diff --git a/.depcheckrc.yaml b/.depcheckrc.yaml new file mode 100644 index 000000000..8f377c159 --- /dev/null +++ b/.depcheckrc.yaml @@ -0,0 +1,10 @@ +ignores: +# Unused dependencies + +# Unused devDependencies + +# Missing dependencies + + +ignore-patterns: + - "node_modules" \ No newline at end of file diff --git a/.eslintignore b/.eslintignore index 5f3b9072a..295562c16 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1,2 +1,6 @@ dist -runtime \ No newline at end of file +runtime +dist-vue2/ +dist-vue3/ +node_modules +examples/docs/public/assets/map/js \ No newline at end of file diff --git a/.eslintrc b/.eslintrc deleted file mode 100644 index 81bd121cf..000000000 --- a/.eslintrc +++ /dev/null @@ -1,94 +0,0 @@ -{ - "root": true, - "env": { - "es6": true, - "browser": true, - "node": true, - "jest": true - }, - "extends": ["eslint:recommended", "plugin:vue/vue3-essential"], - "parserOptions": { - "parser": ["vue-eslint-parser", "@babel/eslint-parser"], - "requireConfigFile": false, - "sourceType": "module", - "ecmaVersion": "latest", - "ecmaFeatures": { - "jsx": true - } - }, - "rules": { - "no-debugger": "off", - "no-var": "error", - "no-tabs": "error", - "no-trailing-spaces": "error", - "no-mixed-spaces-and-tabs": "error", - "no-undef": "error", - "no-extra-semi": "error", - "no-empty": "error", - "no-console": "off", - "semi": [2, "never"], - "max-len": [ - "warn", - { - "code": 160 - } - ], - "function-paren-newline": ["off"], - "object-property-newline": [ - "warn", - { - "allowAllPropertiesOnSameLine": true - } - ], - "newline-per-chained-call": [ - "warn", - { - "ignoreChainWithDepth": 4 - } - ], - "comma-dangle": "off", - "semi-style": ["warn", "last"], - "max-lines": ["error", 2400], - "max-lines-per-function": ["error", 200], - "complexity": ["error", 26], - "max-depth": ["warn", 4], - "max-nested-callbacks": ["error", 4], - "no-multi-assign": "off", - "no-undef-init": "warn", - "no-shadow": "off", - "max-params": ["warn", 5], - "no-param-reassign": "off", - "prefer-rest-params": "off", - "prefer-arrow-callback": "error", - "arrow-body-style": ["warn", "as-needed"], - "no-this-before-super": "error", - "quotes": ["warn", "single"], - "prefer-template": "off", - "no-multi-str": "warn", - "object-shorthand": "warn", - "dot-notation": "error", - "accessor-pairs": "error", - "no-prototype-builtins": "error", - "guard-for-in": "error", - "eqeqeq": "off", - "no-fallthrough": "error", - "no-case-declarations": "error", - "no-unsafe-finally": "error", - "no-eval": "error", - "no-with": "error", - "no-implicit-coercion": [ - "error", - { - "allow": ["!!", "~"] - } - ], - "vue/multi-word-component-names": "off", - "vue/valid-v-slot": "off", - "vue/no-deprecated-v-on-native-modifier": "off", - "vue/no-reserved-component-names": "off", - "vue/no-deprecated-dollar-listeners-api": "off", - "vue/no-deprecated-slot-attribute": "off", - "vue/no-use-computed-property-like-method": "off", - "vue/no-mutating-props": "off" - } -} diff --git a/.eslintrc.js b/.eslintrc.js new file mode 100644 index 000000000..1af6cd973 --- /dev/null +++ b/.eslintrc.js @@ -0,0 +1,42 @@ +/* eslint-env node */ + +/** @type {import('eslint').Linter.Config} */ +module.exports = { + extends: '@antfu', + rules: { + 'vue/component-tags-order': ['error', { + order: [['script', 'template'], 'style'], + }], + 'vue/order-in-components': 'off', + 'vue/component-name-in-template-casing': 'off', + 'vue/custom-event-name-casing': 'off', + 'vue/quote-props': 'off', + 'vue/attributes-order': 'off', + 'vue/prop-name-casing': 'off', + 'vue/html-self-closing': 'off', + 'vue/prefer-separate-static-class': 'off', + 'vue/comma-dangle': 'off', + 'vue/prefer-template': 'off', + 'curly': 'off', + 'sort-imports': 'off', + 'prefer-template': 'off', + 'arrow-parens': 'off', + 'operator-linebreak': 'off', + 'antfu/if-newline': 'off', + 'import/order': 'off', + 'import/no-duplicates': 'off', + 'quote-props': 'off', + 'prefer-const': 'off', + '@typescript-eslint/comma-dangle': 'off', + // '@typescript-eslint/indent': 'off', + '@typescript-eslint/no-unsafe-assignment': 'off', + '@typescript-eslint/no-unsafe-call': 'off', + '@typescript-eslint/no-unsafe-member-access': 'off', + '@typescript-eslint/no-unsafe-argument': 'off', + '@typescript-eslint/no-unsafe-return': 'off', + '@typescript-eslint/brace-style': 'off', + '@typescript-eslint/restrict-plus-operands': 'off', + '@typescript-eslint/no-use-before-define': 'off', + '@typescript-eslint/restrict-template-expressions': 'off', + }, +} diff --git a/.gitattributes b/.gitattributes new file mode 100644 index 000000000..d6e52a9f0 --- /dev/null +++ b/.gitattributes @@ -0,0 +1,6 @@ +* text=auto eol=lf +*.ts linguist-detectable=false +*.css linguist-detectable=false +*.scss linguist-detectable=false +*.js linguist-detectable=true +*.vue linguist-detectable=true diff --git a/.gitignore b/.gitignore index b3e1a5a99..b9b4b1831 100644 --- a/.gitignore +++ b/.gitignore @@ -1,16 +1,27 @@ .DS_Store node_modules dist/ +dist2/ +dist2.7/ +dist3/ allDist/ -packages/**/runtime/ +packages/**/runtime coverage/ -/packages/base.js -/packages/chart.js -/packages/core.js -/packages/index.js -/packages/pc.js -/packages/mobile.js +/packages/vue-icon-saas/src +/packages/vue-icon-saas/index.ts +/packages/vue/index.ts +/packages/vue/pc.ts +/packages/vue/mobile.ts +/packages/vue/app.ts +/packages/vue-icon/src/index.ts + +/examples/**/playwright-report +/examples/docs/.vuepress/.cache/ +/examples/docs/.vuepress/.temp/ +/examples/docs/.vitepress/cache +vite.config.ts.timestamp* +vitest.config.ts.timestamp* # local env .env.local @@ -20,12 +31,11 @@ coverage/ npm-debug.log* yarn-debug.log* yarn-error.log* +pnpm-lock.yaml # Editor directories and files .idea .history -.vscode -.cloudbuild *.suo *.ntvs* *.njsproj @@ -34,8 +44,7 @@ yarn-error.log* *.log *.stackdump -yarn.lock -package-lock.json - tgzs *.tgz + + diff --git a/.hintrc b/.hintrc new file mode 100644 index 000000000..ae8c7fb87 --- /dev/null +++ b/.hintrc @@ -0,0 +1,16 @@ +{ + "extends": [ + "development" + ], + "hints": { + "compat-api/html": [ + "default", + { + "ignore": [ + "script[type=module]" + ] + } + ], + "axe/language": "off" + } +} \ No newline at end of file diff --git a/.npmrc b/.npmrc new file mode 100644 index 000000000..4f18c8a65 --- /dev/null +++ b/.npmrc @@ -0,0 +1,4 @@ +shell-emulator=true +auto-install-peers=true +strict-peer-dependencies=false +enable-pre-post-scripts=true \ No newline at end of file diff --git a/.prettierignore b/.prettierignore index 68ef920d1..d312ec356 100644 --- a/.prettierignore +++ b/.prettierignore @@ -1,3 +1,8 @@ -# Except myapp folder: -dist/ -public/ \ No newline at end of file +dist +dist-vue2 +dist-vue3 +node_modules +internal/template +internal/runtime +examples/docs/public/static +pnpm-lock.yaml diff --git a/.prettierrc b/.prettierrc index 08c3f2656..a607ca7c5 100644 --- a/.prettierrc +++ b/.prettierrc @@ -1,4 +1,22 @@ -semi: false -singleQuote: true -printWidth: 160 -trailingComma: none +{ + "semi": false, + "singleQuote": true, + "printWidth": 120, + "trailingComma": "none", + "quoteProps": "preserve", + "endOfLine": "auto", + "bracketSpacing": true, + "jsxBracketSameLine": true, + "jsxSingleQuote": false, + "useTabs": false, + "tabWidth": 2, + "proseWrap": "preserve", + "overrides": [ + { + "files": ".prettierrc", + "options": { + "parser": "json" + } + } + ] +} diff --git a/.vscode/extensions.json b/.vscode/extensions.json new file mode 100644 index 000000000..556fbb260 --- /dev/null +++ b/.vscode/extensions.json @@ -0,0 +1,14 @@ +{ + "recommendations": [ + "vue.volar", + "vue.vscode-typescript-vue-plugin", + "davidanson.vscode-markdownlint", + "dbaeumer.vscode-eslint", + "stylelint.vscode-stylelint", + "ms-playwright.playwright" + ], + "unwantedRecommendations": [ + "esbenp.prettier-vscode", + "octref.vetur" + ] +} \ No newline at end of file diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 000000000..d1a2108f8 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,72 @@ +{ + "editor.quickSuggestions": { + "strings": true + }, + "markdownlint.config": { + "no-inline-html": true, + "first-line-heading": true + }, + "typescript.tsdk": "node_modules/typescript/lib", + "prettier.enable": true, + "editor.formatOnSave": true, + "editor.codeActionsOnSave": { + "source.fixAll.eslint": true + }, + "better-comments.highlightPlainText": true, + "better-comments.tags": [ + { + "tag": "#v", + "color": "#FF8C00", + "strikethrough": false, + "underline": false, + "backgroundColor": "transparent", + "bold": false, + "italic": false + }, + { + "tag": "!", + "color": "#FF2D00", + "strikethrough": false, + "underline": false, + "backgroundColor": "transparent", + "bold": false, + "italic": false + }, + { + "tag": "?", + "color": "#3498DB", + "strikethrough": false, + "underline": false, + "backgroundColor": "transparent", + "bold": false, + "italic": false + }, + { + "tag": "//", + "color": "#474747", + "strikethrough": true, + "underline": false, + "backgroundColor": "transparent", + "bold": false, + "italic": false + }, + { + "tag": "todo", + "color": "#FF8C00", + "strikethrough": false, + "underline": false, + "backgroundColor": "transparent", + "bold": false, + "italic": false + }, + { + "tag": "*", + "color": "#98C379", + "strikethrough": false, + "underline": false, + "backgroundColor": "transparent", + "bold": false, + "italic": false + } + ] +} \ No newline at end of file diff --git a/CHANGELOG.md b/CHANGELOG.md index 2e40d967e..e69de29bb 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,20 +0,0 @@ -# 更新日志 - -## v2.0.0/v3.0.0 - -`2022/09/15` - -### 📢破坏性变更 - -无 - -### ✨新特性 - -- Search 组件:增加 input 事件 -- Select 组件:增加 scroll 事件 - -### 🐞缺陷修复 - -- Tabs 组件:修复 tab 组件套 tab 组件,内部的 tab 项会显示在外部 tab 上的bug -- PopEditor 组件:解决弹出框里的查询条件不能输入的问题 -- Cascader 组件:解决点击已选中选项无法关闭选择器的问题 diff --git a/LICENSE b/LICENSE index 0c4793709..180359954 100644 --- a/LICENSE +++ b/LICENSE @@ -19,4 +19,4 @@ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE -SOFTWARE. +SOFTWARE. \ No newline at end of file diff --git a/README.md b/README.md index 57b746bbe..cea20f91d 100644 --- a/README.md +++ b/README.md @@ -75,4 +75,4 @@ If you don't know how to start, please read our [contributing guide](CONTRIBUTIN ## License -[MIT](LICENSE) +[MIT](LICENSE) \ No newline at end of file diff --git a/build/.eslintrc b/build/.eslintrc deleted file mode 100644 index 3d48e6bf7..000000000 --- a/build/.eslintrc +++ /dev/null @@ -1,6 +0,0 @@ -{ - "rules": { - "no-empty": "off", - "no-console": "off" - } -} \ No newline at end of file diff --git a/build/build-entry-app.js b/build/build-entry-app.js deleted file mode 100644 index 3a8e893d9..000000000 --- a/build/build-entry-app.js +++ /dev/null @@ -1,54 +0,0 @@ -/** - * 生成全量运行时入口文件 - */ -const fs = require('fs-extra') -const endOfLine = require('os').EOL -const utils = require('./utils') -const runtimeUtils = require('./runtime-utils') - -const version = utils.getTinyVersion() -const outputDir = 'packages' -const IMPORT_TEMPLATE = 'import {{name}} from "@opentiny/vue-{{package}}"' -const MAIN_TEMPLATE = `{{include}} - -const version = '${version}' - -export { - version, - {{components}} -} -` - -const buildFullRuntime = (buildType) => { - const outputPath = utils.pathJoin('..', outputDir, buildType + '.js') - const includeTemplate = [] - const componentsTemplate = [] - const render = utils.renderTemplate() - let coreLibs = [] - - coreLibs = runtimeUtils.getFullRuntime(buildType === 'base' ? ['base', 'business'] : buildType) - - coreLibs.forEach((name) => { - includeTemplate.push( - render(IMPORT_TEMPLATE, { - name, - package: utils.kebabCase({ str: name }) - }) - ) - componentsTemplate.push(name) - }) - - const template = render(MAIN_TEMPLATE, { - include: includeTemplate.join(endOfLine), - components: componentsTemplate.join(',' + endOfLine) - }) - - const output = utils.prettierFormat({ - str: template - }) - - fs.writeFileSync(outputPath, output) - - utils.logGreen(`npm run build:entry done. [${outputDir}/${buildType}.js]`) -}; -['core', 'base', 'chart'].forEach(buildFullRuntime) diff --git a/build/build-entry.js b/build/build-entry.js deleted file mode 100644 index b0112b3e5..000000000 --- a/build/build-entry.js +++ /dev/null @@ -1,144 +0,0 @@ -/** - * 生成入口文件,包括 pc.js / mobile.js / index.js - */ -const fs = require('fs-extra') -const endOfLine = require('os').EOL -const utils = require('./utils') -const moduleUtils = require('./module-utils') - -const version = utils.getTinyVersion() -const outputDir = 'packages' - -const fileNames = { - all: 'index.js', - pc: 'pc.js', - mobile: 'mobile.js' -} - -const getMainTemplate = (mode) => { - const template = `{{include}} - import { $prefix } from '@opentiny/vue-common' - const components = [{{components}}] - - export const install = (app, opts = {}) => { - const regex = new RegExp('^' + $prefix) - ${ - mode === 'all' - ? '' - : ` - if (typeof app.unmount === 'function') { - app.config.globalProperties.tiny_mode = { value: '${mode}' } - } else { - app.prototype.tiny_mode = { value: '${mode}' } - } - ` - } - components.filter(component=> component.name !== 'TinyPicker').forEach((component) => { - let name = component.name - let alias = opts.alias || opts.prefix - if (typeof component.install !== 'function') { return } - if (name && alias) { - app.component(name.replace(regex, alias), component) - } else { - component.install(app) - } - }) - } - const version = '${version}' - export { - version, - {{components}} - } - - export default { - version, - {{components}}, - install - } - ` - return template -} - -const forEachCompoents = ({ components, componentsTemplate, render, INSTALL_COMPONENT_TEMPLATE, includeTemplate, IMPORT_TEMPLATE }) => { - components.forEach((item) => { - let exportsComponents = '' - const childrenComponents = [] - - // 增加组件内部抛出子组件,针对父子组件不能拆分的情况 - if (Array.isArray(item.exports) && item.exports.length > 0) { - item.exports.indexOf(item.name) === -1 && item.exports.push(item.name) - } else { - item.exports = [item.name] - } - - item.exports.forEach((component) => { - if (component !== item.name) { - component = utils.capitalizeKebabCase(component) - - childrenComponents.push(component) - } - - componentsTemplate.push( - render(INSTALL_COMPONENT_TEMPLATE, { - name: component - }) - ) - }) - - if (childrenComponents.length) { - exportsComponents = `,{${childrenComponents.join(',')}}` - } - - includeTemplate.push( - render(IMPORT_TEMPLATE, { - name: item.name, - exports: exportsComponents, - package: item.importName - }) - ) - }) -} - -const createEntry = (mode) => { - const OUTPUT_PATH = utils.pathJoin('..', outputDir, fileNames[mode]) - const IMPORT_TEMPLATE = 'import {{name}} {{exports}} from "{{package}}"' - const INSTALL_COMPONENT_TEMPLATE = ' {{name}}' - - const MAIN_TEMPLATE = getMainTemplate(mode) - - const includeTemplate = [] - const componentsTemplate = [] - const render = utils.renderTemplate() - let components - - if (mode === 'pc') { - components = moduleUtils.getPcComponents() - } else if (mode === 'mobile') { - components = moduleUtils.getMobileComponents() - } else { - components = moduleUtils.getComponents() - } - - forEachCompoents({ - components, - componentsTemplate, - render, - INSTALL_COMPONENT_TEMPLATE, - includeTemplate, - IMPORT_TEMPLATE - }) - - const template = render(MAIN_TEMPLATE, { - include: includeTemplate.join(endOfLine), - components: componentsTemplate.join(`,${endOfLine}`) - }) - - const output = utils.prettierFormat({ - str: template - }) - - fs.writeFileSync(OUTPUT_PATH, output) -}; -['all', 'pc', 'mobile'].forEach(createEntry) - -utils.logGreen(`npm run build:entry done. [${outputDir}/index.js,${outputDir}/pc.js,${outputDir}/mobile.js]`) diff --git a/build/build-ui.js b/build/build-ui.js deleted file mode 100644 index 2a46f5633..000000000 --- a/build/build-ui.js +++ /dev/null @@ -1,115 +0,0 @@ -const rollup = require('rollup') -const utils = require('./utils') -const replace = require('@rollup/plugin-replace') -const moduleUtils = require('./module-utils') -const fs = require('fs-extra') -const isSingle = process.env.BUILD_TARGET === 'single' -const config = require('./config') - -const outputOptions = { - format: 'es', - globals: config.globals, - exports: 'named' -} - -const inputOptions = { - plugins: config.plugins, - external: config.external -} - -const replaceConstant = { - 'process.env.BUILD_TARGET': JSON.stringify(process.env.BUILD_TARGET), - 'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV) -} - -if (process.env.TINY_MODE === 'pc') { - outputOptions.format = 'umd' - replaceConstant['process.env.TINY_MODE'] = JSON.stringify(process.env.TINY_MODE) -} - -/** - * 编译单个组件 - * @param {Object} component 组件 module 信息 (modules.json) - * @param {Function} 回调函数 - */ -const build = ({ component, callback }) => { - inputOptions.input = utils.pathJoin('..', component.path) - - inputOptions.plugins.push(replace(replaceConstant)) - rollup - .rollup(inputOptions) - .then((bundle) => { - outputOptions.file = utils.pathJoin('..', component.libPath) - if (outputOptions.format === 'umd') { - outputOptions.name = component.global - } - bundle.write(outputOptions).finally(() => { - const filePath = utils.pathJoin('..', component.libPath) - if (filePath.endsWith('index.js')) { - const indexStr = fs.readFileSync(filePath).toString('UTF-8') - const resStr = indexStr.replace('./src/pc', './pc').replace('./src/mobile', './mobile') - fs.writeFileSync(filePath, resStr) - } - callback() - }) - }) - .catch((e) => { - utils.logRed(e) - callback() - }) -} - -let components = [] - -/** - * 递归执行 Rollup 编译 - * @param {Number} count 起始索引 - */ -const buildAll = (count = 0) => { - let component = components[count++] - if (component) { - if (!isSingle) { - component.libPath = 'dist/' + component.libName.replace('@opentiny/vue/', '') - component.libPath += (component.type === 'component' ? '/index' : '') + '.js' - } - build({ - component, - callback() { - buildAll(count) - } - }) - } else { - utils.logGreen(`npm run build:ui${isSingle ? '-single' : ''} done.`) - } -} - -if (isSingle) { - const inputName = utils.getInputCmd() - if (inputName.length > 0) { - inputName.forEach((input) => { - const activeComponentName = utils.kebabCase({ str: input }) - - if (activeComponentName) { - components.push( - ...moduleUtils.getByName({ - name: activeComponentName, - isSort: false - }) - ) - } - }) - } else { - const activeComponentName = utils.getComponentName() - components = moduleUtils.getByName({ - name: activeComponentName, - isSort: false - }) - } -} else { - components = moduleUtils.getAllModules(false) -} -if (components.length > 0) { - buildAll() -} else { - utils.logYellow('please enter the component name after command.') -} diff --git a/build/create-mapping.js b/build/create-mapping.js deleted file mode 100644 index c5a4c9780..000000000 --- a/build/create-mapping.js +++ /dev/null @@ -1,68 +0,0 @@ -const { sep } = require('path') -const utils = require('./utils') -const { addModule, writeModuleMap, quickSort, readModuleMap } = require('./module-utils') - -const isDeepFn = (file, dirs, subPath) => - // 如果底层文件夹内没有找到 vue 文件,找到 src//index.js 文件也被认可为组件 - (file.endsWith('.vue') && (dirs.includes('index.js') || dirs.includes('index.vue'))) || ~subPath.indexOf(['src', 'index.js'].join(sep)) - -const getTemplateName = (currentPaths) => currentPaths.slice(2).map(utils.capitalize).join('/').split('.')[0].replace('/', '') - -/** - * 扫描指定目录下面的组件目录,查找非 index.vue 文件(模板)生成 modules.json 中的对象 - */ -const makeModules = () => { - const templates = {} - const oldModules = readModuleMap() - const packagesStr = 'packages' - utils.walkFileTree({ - isDeep: true, - dirPath: utils.pathJoin('..', packagesStr), - fileFilter({ file }) { - return !/node_modules|helper|common|assets/.test(file) - }, - callback({ file, subPath, dirs }) { - const isDeep = isDeepFn(file, dirs, subPath) - // NEXT: 针对 option 的模板做特殊处理 - if (isDeep && ['template.vue'].indexOf(file) === -1) { - const isEntry = file.startsWith('index') - const subPaths = subPath.split(sep) - const currentPaths = subPaths.slice(subPaths.indexOf(packagesStr) + 1) - const templateName = getTemplateName(currentPaths) - const templatePath = currentPaths[currentPaths.length - 1].split('.')[0] - const componentName = [] - currentPaths.every((dirName) => { - if (dirName === 'src') { - return false - } - componentName.push(dirName) - return true - }) - const globalName = componentName[componentName.length - 1].split('-').map(utils.capitalize).join('') - const moduleName = globalName + (isEntry ? '' : templateName) - const oldModuleItem = oldModules[moduleName] || {} - const oldKeys = Object.keys(oldModuleItem) - const newModuleItem = addModule({ - componentName: componentName.join('/'), - templateName: templatePath - }) - oldKeys.forEach((key) => { - if (typeof newModuleItem[key] === 'undefined' || key === 'onlyMode') { - newModuleItem[key] = oldModuleItem[key] - } - }) - newModuleItem.exclude = oldModuleItem.exclude || false - templates[moduleName] = newModuleItem - } - } - }) - writeModuleMap(quickSort({ sortData: templates, returnType: 'object' })) -} - -try { - makeModules() - - utils.logGreen('npm run create:mapping done.') -} catch (e) { - utils.logRed('npm run create:mapping failed.', e) -} diff --git a/build/create-ui.js b/build/create-ui.js deleted file mode 100644 index 770d300e3..000000000 --- a/build/create-ui.js +++ /dev/null @@ -1,229 +0,0 @@ -/** - * yarn create:ui 新建组件,支持格式如下: - * yarn create:ui img-preview - * yarn create:ui img-preview -single 输出纯净模板(没有 pc 等模板/单层组件) - * yarn create:ui img-preview -mobile 创建纯移动组件 - */ -const path = require('path') -const fs = require('fs-extra') -const semver = require('semver') -const utils = require('./utils') -const { createModuleMapping } = require('./module-utils') - -const args = utils.getInputCmd() - -const getTemplate = (upperComponentName) => ` - -` - -const getDcoTemplate = () => `
-

- -

- -## [[UNAME]] - - - -
- -### [[UNAME]] - -` - -const getTemp = (componentName) => `const router = [ - { - path: '${componentName}', - meta: { - title: 'test', - lang: 'zh-CN', - sign: 'component' - }, - component: () => - import( - /* webpackChunkName: 'v3-${componentName}' */ './docs/mobile/${componentName}/base.md' - ) - },` - -const doWorkTreeFn = ({ templateDir, componentPath, componetDir, componentName, isSingle, render, version, isMobile }) => { - utils.walkFileTree({ - isDeep: true, - dirPath: templateDir, - callback({ file, subPath }) { - let fileName = file - const isSingleTemplate = file === 'single.vue' - const isSrcDir = path.basename(path.dirname(subPath)) === 'src' - - componentPath = path.join(componetDir, componentName) - - // 单层组件处理逻辑 - if (isSrcDir) { - componentPath = path.join(componentPath, 'src') - - if (isSingle) { - if (!isSingleTemplate) { - return - } - - fileName = 'index.vue' - } else { - if (isSingleTemplate) { - return - } - } - } - - if (!fs.existsSync(componentPath)) { - fs.mkdirSync(componentPath) - } - - componentPath = path.join(componentPath, fileName) - - let fileContent = fs.readFileSync(subPath, { encoding: 'utf8' }) - const upperComponentName = utils.capitalizeKebabCase(componentName) - - // 编译模板 - fileContent = render(fileContent, { - NAME: componentName, - UNAME: upperComponentName, - MINOR: semver.minor(version), - SUFFIX: isSingle ? '.vue' : '', - THEME: isMobile ? 'theme-mobile' : 'theme' - }) - - fs.writeFileSync(componentPath, fileContent) - } - }) -} - -const createRouter = (json, componentName, navPath, router) => { - const Navs = JSON.parse(json) - Navs.component.push({ - name: 'New Component', - children: [ - { - path: `/${componentName}`, - name: `${componentName}` - } - ] - }) - - fs.writeFileSync(path.join(navPath, 'nav.config.comp.mobile.json'), JSON.stringify(Navs, null, 2), { encoding: 'utf-8' }) - - fs.writeFileSync(path.join(navPath, 'route.config.comp.mobile.js'), router, { - encoding: 'utf8' - }) -} - -if (args.length > 0) { - const commands = [] - const components = [] - const render = utils.renderTemplate({ leftChar: '[[', rightChar: ']]' }) - const templateDir = utils.pathJoin('..', 'template', 'component') - const componetDir = utils.pathJoin('..', 'packages') - const demoDir = utils.pathJoin('..', 'example', 'src', 'demo', 'mobile') - const docDir = utils.pathJoin('..', 'example', 'src', 'docs', 'mobile') - const { version } = fs.readJSONSync(utils.pathJoin('..', 'package.json')) - const navPath = utils.pathJoin('..', 'example', 'src') - - args.forEach((item) => { - if (item.indexOf('-') === 0) { - commands.push(item.replace(/-/g, '').toLowerCase()) - } else { - components.push(item) - } - }) - - const isSingle = commands.includes('single') - const isMobile = commands.includes('mobile') - - const createDemo = (filePath, componentName, fileName, template) => { - if (!fs.existsSync(filePath)) { - fs.mkdirSync(filePath) - } - - const upperComponentName = utils.capitalizeKebabCase(componentName) - - // 生成测试demo - filePath = path.join(filePath, fileName) - - const outString = render(template, { - NAME: componentName, - UNAME: upperComponentName - }) - - const outputDemo = require('prettier').format(outString, { - printWidth: 160, - jsxBracketSameLine: false, - tabWidth: 2, - useTabs: false, - singleQuote: true, - semi: false, - trailingComma: 'none', - bracketSpacing: true, - parser: 'vue' - }) - - fs.writeFileSync(filePath, outputDemo) - } - - components.forEach((componentName) => { - let componentPath = path.join(componetDir, componentName) - let demoPath = path.join(demoDir, componentName) - let docPath = path.join(docDir, componentName) - const upperComponentName = utils.capitalizeKebabCase(componentName) - - if (fs.existsSync(componentPath)) { - utils.logYellow(`The component name : ${componentName} is exist , please enter other name.`) - return - } - - const json = fs.readFileSync(path.join(navPath, 'nav.config.comp.mobile.json'), { encoding: 'utf8' }) - - let router = fs.readFileSync(path.join(navPath, 'route.config.comp.mobile.js'), { encoding: 'utf8' }) - - const templ = getTemp(componentName) - router = router.replace('const router = [', templ) - - createRouter(json, componentName, navPath, router) - - doWorkTreeFn({ - templateDir, - componentPath, - componetDir, - componentName, - isSingle, - render, - version, - isMobile - }) - - // 生成测试demo - const template = getTemplate(upperComponentName) - createDemo(demoPath, componentName, 'base.vue', template) - - // 生成doc - const dcoTemplate = getDcoTemplate() - - createDemo(docPath, componentName, 'base.md', dcoTemplate) - - componentName && createModuleMapping(componentName, componentPath, isMobile) - }) - - utils.logYellow('npm run create:ui done.') -} else { - utils.logYellow('please enter the component name after command.') -} diff --git a/build/runtime-utils.js b/build/runtime-utils.js deleted file mode 100644 index c4e7f8bb6..000000000 --- a/build/runtime-utils.js +++ /dev/null @@ -1,304 +0,0 @@ -/** - * 打包运行时通用配置 - * - * 全量运行时(组件分组) - * 运行时版本号 - * 运行时外部依赖路径 - */ -const fs = require('fs-extra') -const { getVersion, pathJoin, logRed } = require('./utils') -const moduleUtils = require('./module-utils') - -const runtimeComponents = { - core: [ - 'Common', - 'Icon', - 'Locale', - 'Alert', - 'Col', - 'Container', - 'DialogBox', - 'Layout', - 'Loading', - 'Popover', - 'Row', - 'Tooltip', - 'Carousel', - 'CarouselItem', - 'Collapse', - 'CollapseItem', - 'Split', - 'TimeLine', - 'Milestone', - 'Floatbar', - 'Steps', - 'TabItem', - 'Tabs', - 'Breadcrumb', - 'BreadcrumbItem', - 'FallMenu', - 'NavMenu', - 'Rate', - 'Tag', - 'TopBox', - 'Notify', - 'Image', - 'ImageViewer', - 'ScrollText', - 'Scrollbar', - 'UserHead', - 'SlideBar', - 'Slider', - 'Link', - 'Progress', - 'Crop' - ], - base: [ - 'Autocomplete', - 'BulletinBoard', - 'Button', - 'ButtonGroup', - 'Calendar', - 'Cascader', - 'CascaderMenu', - 'CascaderNode', - 'CascaderPanel', - 'Checkbox', - 'CheckboxButton', - 'CheckboxGroup', - 'DatePanel', - 'DatePicker', - 'DateRange', - 'DateTable', - 'DetailPage', - 'DropTimes', - 'FileUpload', - 'Form', - 'FormItem', - 'Grid', - 'GridColumn', - 'GridManager', - 'GridToolbar', - 'Input', - 'IpAddress', - 'LinkMenu', - 'Modal', - 'MonthRange', - 'MonthTable', - 'Numeric', - 'Option', - 'OptionGroup', - 'Pager', - 'PagerItem', - 'Picker', - 'PopUpload', - 'Popeditor', - 'Radio', - 'RadioButton', - 'RadioGroup', - 'Search', - 'Select', - 'SelectDropdown', - 'Switch', - 'Table', - 'TextPopup', - 'Time', - 'TimePanel', - 'TimePicker', - 'TimeRange', - 'TimeSelect', - 'TimeSpinner', - 'ToggleMenu', - 'Transfer', - 'TransferPanel', - 'Tree', - 'TreeMenu', - 'Upload', - 'UploadDragger', - 'UploadList', - 'YearTable' - ], - business: ['UserContact', 'Wizard'], - chart: [ - 'BaiduMap', - 'ChartBar', - 'ChartCandle', - 'ChartCore', - 'ChartFunnel', - 'ChartGauge', - 'ChartWaterfall', - 'ChartGraph', - 'ChartHeatmap', - 'ChartHistogram', - 'ChartLine', - 'ChartMap', - 'ChartPie', - 'ChartRadar', - 'ChartRing', - 'ChartSankey', - 'ChartScatter', - 'ChartSunburst', - 'ChartTree', - 'Chart', - 'ChartBoxplot' - ], - external: ['CardTemplate', 'CreditCard', 'CreditCardForm', 'SvgIcon', 'AutonaviMap', 'ChartWordcloud', 'ChartLiquidfill'] -} - -const echartsVersion = getVersion('echarts') -const auroraVueVersion = getVersion('@opentiny/vue') -const echartsSource = 'lib/echarts.min.js' + echartsVersion -const dependencies = { - vue: 'node_modules/vue/dist/vue.min.js', - 'vue-i18n': 'node_modules/vue-i18n/dist/vue-i18n.min.js', - axios: 'node_modules/axios/dist/axios.min.js', - 'axios-mock-adapter': 'node_modules/axios-mock-adapter/dist/axios-mock-adapter.min.js', - '@vue/composition-api': 'node_modules/@vue/composition-api/dist/vue-composition-api.prod.js', - '@opentiny/core': 'node_modules/@opentiny/core/dist/aurora.min.js', - '@opentiny/service': 'node_modules/@opentiny/service/dist/aurora.service.min.js', - cropperjs: 'node_modules/cropperjs/dist/cropper.min.js', - vue3: 'example/node_modules/vue/dist/vue.global.prod.js', - 'vue3-i18n': 'example/node_modules/vue-i18n/dist/vue-i18n.global.js' -} - -const runtimeDeps = { - base: { - vue: 'lib/vue.min.js' + getVersion('vue'), - axios: 'lib/axios.min.js' + getVersion('axios'), - 'vue-i18n': 'lib/vue-i18n.min.js' + getVersion('vue-i18n'), - 'axios-mock-adapter': 'lib/axios-mock-adapter.min.js' + getVersion('axios-mock-adapter') - }, - aurora: { - '@opentiny/core': 'lib/aurora.min.js' + getVersion('@opentiny/core'), - '@opentiny/service': 'lib/aurora.service.min.js' + getVersion('@opentiny/service') - }, - tiny3Lib: { - '@vue/composition-api': 'lib/vue-composition-api.prod.js' + getVersion('@vue/composition-api'), - echarts: echartsSource, - 'echarts/lib/echarts': echartsSource, - 'echarts/lib/chart/bar': echartsSource, - 'echarts/lib/chart/boxplot': echartsSource, - 'echarts/lib/chart/candlestick': echartsSource, - 'echarts/lib/chart/chord': echartsSource, - 'echarts/lib/chart/custom': echartsSource, - 'echarts/lib/chart/effectScatter': echartsSource, - 'echarts/lib/chart/funnel': echartsSource, - 'echarts/lib/chart/gauge': echartsSource, - 'echarts/lib/chart/graph': echartsSource, - 'echarts/lib/chart/heatmap': echartsSource, - 'echarts/lib/chart/line': echartsSource, - 'echarts/lib/chart/lines': echartsSource, - 'echarts/lib/chart/map': echartsSource, - 'echarts/lib/chart/parallel': echartsSource, - 'echarts/lib/chart/pictorialBar': echartsSource, - 'echarts/lib/chart/pie': echartsSource, - 'echarts/lib/chart/radar': echartsSource, - 'echarts/lib/chart/sankey': echartsSource, - 'echarts/lib/chart/scatter': echartsSource, - 'echarts/lib/chart/sunburst': echartsSource, - 'echarts/lib/chart/themeRiver': echartsSource, - 'echarts/lib/chart/tree': echartsSource, - 'echarts/lib/chart/treemap': echartsSource, - 'echarts/lib/component/legend': echartsSource, - 'echarts/lib/component/tooltip': echartsSource, - 'echarts/lib/component/dataZoom': echartsSource, - 'echarts/lib/component/visualMap': echartsSource, - cropperjs: 'lib/cropper.min.js' + getVersion('cropperjs'), - '@opentiny/vue-renderless-common': 'tiny/common/renderless.js' + getVersion('@opentiny/vue-renderless') - }, - tiny3Component: { - '@opentiny/vue-locale': 'COMPONENT_DIR/locale.js' + auroraVueVersion, - '@opentiny/vue-icon': 'COMPONENT_DIR/icon.js' + auroraVueVersion, - '@opentiny/vue-common': 'COMPONENT_DIR/common.js' + auroraVueVersion - } -} - -const getPartDeps = (keys = []) => { - const tempDeps = {} - - for (let key in runtimeDeps) { - if (Object.prototype.hasOwnProperty.call(runtimeDeps, key)) { - keys.includes(key) && Object.assign(tempDeps, runtimeDeps[key]) - } - } - - return tempDeps -} - -const getAllDeps = () => getPartDeps(Object.keys(runtimeDeps)) - -const getAllComponents = () => { - const componentMap = moduleUtils.getPcComponents(true) - const systemMap = {} - - for (let i = 0, len = componentMap.length; i < len; i++) { - const libName = componentMap[i].LowerName - const libEntry = componentMap[i].path - let version = auroraVueVersion - - try { - version = '?v=' + require('../' + libEntry.replace('index.js', 'package.json')).version.replace(/[\^|~]/g, '') - } catch (e) { - logRed(e) - } - - systemMap[componentMap[i].importName] = 'COMPONENT_DIR/' + libName + '.js' + version - } - - return systemMap -} - -const getFullRuntimeDeps = () => ({ ...getAllDeps(), ...getAllComponents() }) - -const getComponentRuntimeDeps = () => ({ - ...getPartDeps(['theme', 'tiny3Lib', 'tiny3Component']), - ...getAllComponents() -}) - -const getFullRuntime = (name) => { - const arr = typeof name === 'string' ? [name] : name || Object.keys(runtimeComponents) - - return [].concat(...arr.map((key) => runtimeComponents[key])) -} - -/** - * 提取 @opentiny/vue-renderless 中的公共代码,打成独立包(避免组件运行不正常) - */ -const getRenderlessExports = () => { - const RENDERLESS_PATH = pathJoin('..', 'node_modules', '@opentiny', 'renderless', 'common', 'runtime.js') - - let EXTERNAL_RENDERLESS = [] - - // 获取需要排除的依赖 - if (fs.existsSync(RENDERLESS_PATH)) { - const runtimeExport = fs.readFileSync(RENDERLESS_PATH).toString('UTF-8') - - EXTERNAL_RENDERLESS = runtimeExport.match(/import(.*)from(.*)/g) || [] - - EXTERNAL_RENDERLESS = EXTERNAL_RENDERLESS.map((item) => { - let moduleLine = item.replace(/^import\s+/g, '').split(/\s+from\s+/) - - return { - libraryName: moduleLine.pop().replace(/'/g, '').replace(';', ''), - exportName: moduleLine.pop().split(/\s/).pop() - } - }) - } - - return { - EXTERNAL_RENDERLESS, - RENDERLESS_PATH - } -} - -module.exports = { - dependencies, - getAllDeps, - getPartDeps, - getFullRuntime, - getAllComponents, - getFullRuntimeDeps, - getRenderlessExports, - getComponentRuntimeDeps, - getExternalComponents: () => runtimeComponents.external -} diff --git a/build/sync-icons.js b/build/sync-icons.js deleted file mode 100644 index 9989a014a..000000000 --- a/build/sync-icons.js +++ /dev/null @@ -1,88 +0,0 @@ -/** - * 初始化/创建 ICON 组件,从 @opentiny/vue-theme/svgs 中提取 SVG 图标创建对应的 ICON 组件 - */ -const path = require('path') -const fs = require('fs-extra') -const utils = require('./utils') -const semver = require('semver') -const { EOL } = require('os') - -const svgRE = /\.svg$/ -const svgDir = utils.pathJoin('../../', 'vue-theme', 'theme', 'svgs') -const iconDir = utils.pathJoin('..', 'packages', 'icon') -const packageJson = 'package.json' -const templatePath = utils.pathJoin('..', 'template') -const render = utils.renderTemplate({ leftChar: '[[', rightChar: ']]' }) - -// 检查是否按照依赖包 -if (!fs.existsSync(svgDir)) { - utils.logYellow('The @opentiny/vue-theme is not exist , please npm install @opentiny/vue-theme.') -} - -// 是否包含 package/icon 目录 -if (!fs.existsSync(iconDir)) { - fs.mkdirSync(iconDir) - - const version = utils.getTinyVersion() - const iconTemplate = fs.readJSONSync(path.join(templatePath, 'component', packageJson)) - - // 删除多余的依赖 - if (iconTemplate.dependencies) { - delete iconTemplate.dependencies['@opentiny/vue-renderless'] - } - - const packageContent = render(JSON.stringify(iconTemplate), { - NAME: 'icon', - MINOR: semver.minor(version) - }) - - fs.writeFileSync(path.join(iconDir, packageJson), packageContent) -} - -const exportComponents = [] -const exportIcons = [] -const componentTemplate = fs.readFileSync(path.join(templatePath, 'icon', 'index.js'), { encoding: 'utf8' }) - -// 根据 @opentiny/vue-theme/svgs 中的 svg 图片创建对应的 icon 组件 -fs.readdirSync(svgDir).forEach((fileName) => { - if (svgRE.test(fileName)) { - const svgName = fileName.replace(svgRE, '') - const iconPath = path.join(iconDir, svgName) - const iconName = utils.capitalizeKebabCase(svgName) - const fullIconName = `Icon${iconName}` - - if (!fs.existsSync(iconPath)) { - fs.mkdirSync(iconPath) - const iconEntryContent = render(componentTemplate, { - CNAME: iconName, - SNAME: fileName - }) - - fs.writeFileSync(path.join(iconPath, 'index.js'), utils.prettierFormat({ str: iconEntryContent })) - } - exportComponents.push(`import ${fullIconName} from './${svgName}'`) - exportIcons.push(fullIconName) - } -}) - -if (exportComponents.length) { - fs.writeFileSync( - path.join(iconDir, 'index.js'), - utils.prettierFormat({ - str: `${exportComponents.join(EOL)} - - export { - ${exportIcons.join(',' + EOL)} - } - - export default { - ${exportIcons.join(',' + EOL)} - } - ` - }) - ) - - utils.logGreen('npm run create:icon done.') -} else { - utils.logRed('npm run create:icon fail.') -} diff --git a/build/utils.js b/build/utils.js deleted file mode 100644 index 6cdbdacf0..000000000 --- a/build/utils.js +++ /dev/null @@ -1,309 +0,0 @@ -const fs = require('fs-extra') -const path = require('path') -const chalk = require('chalk') -const { execSync } = require('child_process') -const log = global.console - -const logger = log.log - -/** - * 根据运行上下文获取路径(运行时打包用) - * @returns 文件绝对路径 - */ -const resolveCwd = (...args) => path.join(process.cwd(), ...args) - -/** - * 获取模板替换路径(动态) - * @param {String} posixPath 路径 - * @returns 文件绝对路径 - */ -const assetsPath = (posixPath) => path.posix.join('static', posixPath) - -/** - * 根据运行上下文获取,当前运行组件的名称 - * @returns 当前运行组件目录名称 - */ -const getComponentName = () => process.cwd().split(path.sep).pop() - -/** - * 获取当前上下文的路径 - * @returns 文件绝对路径 - */ -const pathJoin = (...args) => path.join(__dirname, ...args) - -/** - * 获取用户输入命令参数 - * @returns 参数数组 - */ -const getInputCmd = () => { - const args = [] - const argv = process.argv || [] - - argv.forEach((item) => { - if (item.indexOf(path.sep) === -1) { - args.push(item) - } - }) - - return args -} - -/** - * 获取当前执行 cli 命令的工具:node\npm\yarn - * @returns node\npm\yarn - */ -const getCurrentCliTool = () => { - const npmExecpaths = process.env.npm_execpaths - - if (!npmExecpaths) { - return 'node' - } - - return npmExecpaths.substring(npmExecpaths.lastIndexOf(path.sep) + 1).replace(/.js|-cli/g, '') -} - -/** - * 执行 node 命令 - * @param {String} cmdStr 命令字符串 - */ -const execCmd = (cmdStr) => { - cmdStr && execSync(cmdStr, { stdio: 'inherit' }) -} - -/** - * 首字母大写 - * @param {String} str 字符串 - * @returns 字符串 - */ -const capitalize = (str) => (typeof str === 'string' ? str.slice(0, 1).toUpperCase() + str.slice(1) : str) - -/** - * 首字母大写 - * @param {String} str 字符串 - * @returns 字符串 - */ -const capitalizeKebabCase = (str, splitChar = '-') => (typeof str === 'string' ? str.split(splitChar).map(capitalize).join('') : str) - -/** - * @description 将驼峰字符串转化为以指定字符分割的小写字符串 - * @example kebabCase({ str : 'ImgPreviewItem' } ) - * @example 输出结果:img-preview-item - * - * @param str 字符串 - * @param splitChar 分隔符 - */ -const kebabCase = ({ str, splitChar = '-' }) => { - if (!str || typeof str !== 'string') { - return str - } - - return str - .split('') - .map((char, index) => { - const charCod = char.charCodeAt(0) - - if (charCod < 65 || charCod > 122) { - return char - } - - return (charCod >= 65 && charCod) <= 90 ? (index === 0 ? '' : splitChar) + char.toLowerCase() : char - }) - .join('') -} - -/** - * 采用 prettier 美化字符串 - * @param {String} str 格式字符 - * @param {Object} options 格式字符 - */ -const prettierFormat = ({ str, options = {} }) => - require('prettier').format(str, { - printWidth: 100, - jsxBracketSameLine: false, - tabWidth: 2, - useTabs: false, - singleQuote: true, - semi: false, - trailingComma: 'none', - bracketSpacing: true, - parser: 'babel', - ...options - }) - -/** - * @private - * @param {String} path dotted to indicate levels in an object. - * @param {Object} view for the data. - */ -function extractValue(path, view) { - if (view && view[path]) { - return view[path] - } - - const parts = path.split('.') - let part = '' - - while (view && (part = parts.shift())) { - view = typeof view === 'object' && part in view ? view[part] : undefined - } - - return view -} - -/** - * 渲染字符串模板 - * @param {String} leftChar 匹配左边字符 - * @param {String} rightChar 匹配右边字符 - */ -const renderTemplate = ({ leftChar = '{{', rightChar = '}}' } = {}) => { - const specialChar = ['[', ']'] - const _leftChar = leftChar.split('').map((item) => (specialChar.includes(item) ? '\\' : '') + item) - - const _rightChar = rightChar.split('').map((item) => (specialChar.includes(item) ? '\\' : '') + item) - - const REGEX = new RegExp(`${_leftChar.join('')}([a-zA-Z.-_0-9]+)${_rightChar.join('')}`, 'g') - - return (input, view) => { - if (input.indexOf(leftChar) === -1) { - return input - } - - let result - const replaced = input.replace(REGEX, (original, path) => { - const value = extractValue(path, view) - - if (undefined === value || value === null) { - return original - } - - if (typeof value === 'object') { - result = value - return - } - - return value - }) - - return undefined === result ? replaced : result - } -} - -/** - * 扫描指定目录下面的组件目录 - * @param {String} dirPath 绝对路径 - * @param {Boolean} isDeep 是否深度遍历 - * @param {Function} fileFilter 文件筛选拦截函数 - * @param {Function} callback 遍历回调 - */ -const walkFileTree = ({ dirPath, isDeep = false, fileFilter, callback }) => { - if (!dirPath || typeof callback !== 'function') { - return - } - - const dirs = fs.readdirSync(path.isAbsolute(dirPath) ? dirPath : path.join(__dirname, dirPath)) - - if (Array.isArray(dirs) && dirs.length > 0) { - dirs.forEach((file) => { - let isFind = true - const subPath = path.join(dirPath, file) - const isDirectory = fs.statSync(subPath).isDirectory() - - if (typeof fileFilter === 'function') { - isFind = fileFilter({ file, subPath, dirs, isDirectory }) === true - } - - if (isFind && isDirectory) { - if (isDeep) { - walkFileTree({ isDeep, dirPath: subPath, fileFilter, callback }) - return - } - } - - callback({ file, subPath, dirs, isDirectory }) - }) - } -} - -/** - * 获取根目录 package.json 中的 version - * @param {String} 对象的 Key - */ -const getTinyVersion = (key = 'version') => { - const packageJson = fs.readJsonSync(pathJoin('..', 'package.json')) - - return packageJson[key] || packageJson -} - -/** - * 获取指定包名的版本号 - * - * @param {String} name NPM 包名 - * @param {String} context 上下文 - * @returns - */ -const getVersion = (name, context = '..') => { - let version - const packageJSON = getTinyVersion('full') - - try { - version = fs.readJsonSync(pathJoin(context, 'node_modules', name, 'package.json')).version - } catch (e) { - version = (packageJSON.devDependencies || packageJSON.dependencies || {})[name] || packageJSON.version - } - - return '?v=' + version.replace(/[\^|~]/g, '') -} - -/** - * 在控制台显示绿色提示 - * @param {String} 提示内容 - */ -const logGreen = (str) => { - logger(chalk.green('### ' + str)) -} - -/** - * 在控制台显示黄色提示 - * @param {String} 提示内容 - */ -const logYellow = (str) => { - logger(chalk.yellow('### ' + str)) -} - -/** - * 在控制台显示青色提示 - * @param {String} 提示内容 - */ -const logCyan = (str) => { - logger(chalk.cyan('### ' + str)) -} - -/** - * 在控制台显示红色提示 - * @param {String} 提示内容 - */ -const logRed = (str) => { - logger(chalk.red('### ' + str)) -} - -module.exports = { - logRed, - execCmd, - logCyan, - pathJoin, - logGreen, - logYellow, - kebabCase, - assetsPath, - capitalize, - getVersion, - resolveCwd, - getInputCmd, - walkFileTree, - renderTemplate, - prettierFormat, - getTinyVersion, - getComponentName, - getCurrentCliTool, - capitalizeKebabCase -} diff --git a/deleteDist.js b/deleteDist.js deleted file mode 100644 index f05f43d73..000000000 --- a/deleteDist.js +++ /dev/null @@ -1,33 +0,0 @@ -const path = require('path') -const fs = require('fs-extra') - -const ROOTPATH = path.join(__dirname, './') - -const publish = () => { - const publishDir = path.join(ROOTPATH, 'packages') - fs.readdirSync(publishDir).forEach((item) => { - const childPath = path.join(publishDir, item) - const stat = fs.statSync(childPath) - - if (stat.isDirectory()) { - const distPath = path.join(childPath, './dist') - if (fs.existsSync(distPath) && fs.statSync(distPath).isDirectory()) { - fs.removeSync(distPath) - } - if (item.startsWith('chart')) { - fs.readdirSync(childPath).forEach((value) => { - const chartChildPath = path.join(childPath, value) - const chartStat = fs.statSync(chartChildPath) - if (value.includes('-') && chartStat.isDirectory()) { - const distPath = path.join(chartChildPath, './dist') - fs.existsSync(distPath) && - fs.statSync(distPath).isDirectory() && - fs.removeSync(distPath) - } - }) - } - } - }) -} - -publish() diff --git a/example/.eslintrc b/example/.eslintrc deleted file mode 100644 index 21c9f0492..000000000 --- a/example/.eslintrc +++ /dev/null @@ -1,6 +0,0 @@ -{ - "rules": { - "no-console": "off", - "no-unused-vars": "off" - } -} \ No newline at end of file diff --git a/example/build/build-ui.js b/example/build/build-ui.js deleted file mode 100644 index 73ce312c0..000000000 --- a/example/build/build-ui.js +++ /dev/null @@ -1,107 +0,0 @@ -const rollup = require('rollup') -const replace = require('@rollup/plugin-replace') -const { readJSONSync } = require('fs-extra') -const utils = require('../../build/utils') -const config = require('./config') -const moduleUtils = require('../../build/module-utils') -const fs = require('fs-extra') -const isSingle = process.env.BUILD_TARGET === 'single' - -const inputOptions = { - plugins: config.plugins, - external: config.external -} - -const outputOptions = { - format: 'es', - globals: config.globals, - exports: 'named' -} - -const replaceConstant = { - 'process.env.BUILD_TARGET': JSON.stringify(process.env.BUILD_TARGET), - 'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV) -} - -if (process.env.TINY_MODE === 'pc') { - outputOptions.format = 'umd' - replaceConstant['process.env.TINY_MODE'] = JSON.stringify(process.env.TINY_MODE) -} - -const build = ({ comp, callbackFn }) => { - inputOptions.input = utils.pathJoin('..', comp.path) - - inputOptions.plugins.push(replace(replaceConstant)) - rollup - .rollup(inputOptions) - .then((bundle) => { - outputOptions.file = utils.pathJoin('..', comp.libPath) - if (outputOptions.format === 'umd') { - outputOptions.name = comp.global - } - bundle.write(outputOptions).finally(() => { - const filePath = utils.pathJoin('..', comp.libPath) - if (filePath.endsWith('index.js')) { - const indexStr = fs.readFileSync(filePath).toString('UTF-8') - const resStr = indexStr.replace('./src/pc', './pc').replace('./src/mobile', './mobile') - fs.writeFileSync(filePath, resStr) - } - callbackFn() - }) - }) - .catch((e) => { - utils.logRed(e) - callbackFn() - }) -} - -let componentsArr = [] - -const buildAll = (count = 0) => { - let comp = componentsArr[count++] - if (comp) { - if (!isSingle) { - comp.libPath = 'dist/' + comp.libName.replace('@opentiny/vue/', '') - comp.libPath += (comp.type === 'component' ? '/index' : '') + '.js' - } - build({ - comp, - callbackFn() { - buildAll(count) - } - }) - } else { - utils.logGreen(`npm run build:ui${isSingle ? '-single' : ''} done.`) - } -} - -if (isSingle) { - const inputNameArr = utils.getInputCmd() - if (inputNameArr.length > 0) { - inputNameArr.forEach((input) => { - const activeComName = utils.kebabCase({ str: input }) - - if (activeComName) { - componentsArr.push( - ...moduleUtils.getByName({ - name: activeComName, - isSort: false - }) - ) - } - }) - } else { - const activeCompName = utils.getComponentName() - componentsArr = moduleUtils.getByName({ - name: activeCompName, - isSort: false - }) - } -} else { - componentsArr = moduleUtils.getAllModules(false) -} -if (componentsArr.length > 0) { - buildAll() -} else { - utils.logYellow('please enter the component name after command.') -} diff --git a/example/build/rollup-vue3-svg.js b/example/build/rollup-vue3-svg.js deleted file mode 100644 index 9f9363765..000000000 --- a/example/build/rollup-vue3-svg.js +++ /dev/null @@ -1,25 +0,0 @@ -let compilerDom = require('@vue/compiler-dom') - -function vue3SvgInline() { - return { - name: 'vue3SvgInline', - - transform(source, id) { - if (id.indexOf('vue-theme') === -1) { - return null - } - const parsedSvg = source.match(//)[0] - const { code } = compilerDom.compile(parsedSvg, { - mode: 'module' - }) - - return ` - ${code} - export default { - render - }` - } - } -} - -module.exports = vue3SvgInline diff --git a/example/entry/icon.js b/example/entry/icon.js deleted file mode 100644 index 839248ed1..000000000 --- a/example/entry/icon.js +++ /dev/null @@ -1 +0,0 @@ -export * from '@opentiny/vue-icon' diff --git a/example/entry/pc.js b/example/entry/pc.js deleted file mode 100644 index 7a5b4c4b0..000000000 --- a/example/entry/pc.js +++ /dev/null @@ -1,5 +0,0 @@ -export * from '@opentiny/vue' -import locale from '@opentiny/vue-locale' - -// 这里需要在运行时导出国际化方法 -export { locale } diff --git a/example/index.html b/example/index.html deleted file mode 100644 index b22901e3e..000000000 --- a/example/index.html +++ /dev/null @@ -1,13 +0,0 @@ - - - - - - - Tiny Vue - - -
- - - \ No newline at end of file diff --git a/example/package.json b/example/package.json deleted file mode 100644 index 8c48dfb5f..000000000 --- a/example/package.json +++ /dev/null @@ -1,48 +0,0 @@ -{ - "name": "vue-example", - "version": "0.1.0", - "scripts": { - "dev": "vite", - "test": "vitest test", - "build:runtime-pc": "vite build --mode pc", - "build:runtime-icon": "vite build --mode icon", - "build:icon3": "cross-env NODE_ENV=production node build/build-icon.js", - "coverage": "vitest run --coverage" - }, - "devDependencies": { - "@vitejs/plugin-vue": "^3.0.3", - "@vitejs/plugin-vue-jsx": "^2.0.0", - "@vue/babel-plugin-jsx": "^1.1.0", - "@vue/test-utils": "^2.0.0", - "esbuild-register": "^3.3.3", - "jsdom": "16.4.0", - "rollup-plugin-postcss": "^2.0.3", - "rollup-plugin-vue": "^6.0.0", - "vite-plugin-markdown-vue": "^0.1.2", - "vitest": "^0.22.1", - "vue": "^3.2.25", - "vue-i18n": "^9.1.7", - "vue-router": "^4.0.11" - }, - "eslintConfig": { - "root": true, - "env": { - "node": true - }, - "extends": [ - "plugin:vue/essential", - "eslint:recommended" - ], - "parserOptions": { - "parser": "babel-eslint" - }, - "rules": { - "no-debugger": "off" - } - }, - "browserslist": [ - "> 1%", - "last 2 versions", - "not dead" - ] -} diff --git a/example/public/favicon.ico b/example/public/favicon.ico deleted file mode 100644 index 586794445..000000000 Binary files a/example/public/favicon.ico and /dev/null differ diff --git a/example/public/index.html b/example/public/index.html deleted file mode 100644 index 81cb3ee20..000000000 --- a/example/public/index.html +++ /dev/null @@ -1,21 +0,0 @@ - - - - - - - - - TinyUI for Vue ( <%= htmlWebpackPlugin.options.vueVersion %> ) - - - - - -
- - - diff --git a/example/public/mock/gateway/ajax.js b/example/public/mock/gateway/ajax.js deleted file mode 100644 index 89c9ead6b..000000000 --- a/example/public/mock/gateway/ajax.js +++ /dev/null @@ -1,1678 +0,0 @@ -let data = { - env: { - serviceCacheList: null, - user: { - createdBy: 131269511, - creationDate: '2017-09-27T00:00:00.000+0800', - creationUserCN: null, - lastUpdateDate: '2017-11-14T09:43:38.000+0800', - lastUpdateUserCN: null, - rowIdx: -1, - userId: 131269511, - userAccount: 'test1', - employeeNumber: '12345678', - userCN: 'test1', - email: 'test1@test1.com', - userType: 'HWE', - dept: null, - coalitionPermission: false, - currentRole: { - creationDate: null, - createdBy: null, - lastUpdateDate: null, - creationUserCN: null, - rowIdx: -1, - lastUpdateUserCN: null, - roleId: 1001, - roleSort: null, - roleDesc: null, - roleName: 'System Admin', - status: null, - owner: null, - defaultUrl: '', - applyStatus: null, - userAdminRole: null, - grantedOperations: null, - personalPermissions: [ - 'vui$Service$Employee.Manage$delete', - 'vui$Service$Employee.Manage$edit' - ], - noPermissionUrl: ['vui$jalor/logs/listLogs.html'], - permissionUrl: null, - approvedByOld: null, - approveMode: null, - roleDimension: null, - roleChk: null, - roleList: null, - currentScope: 'otc', - appNames: ['vui'] - }, - currentProgramIds: [1001], - currentPrograms: null, - validRoles: [ - { - createdBy: null, - creationDate: null, - creationUserCN: null, - lastUpdateDate: null, - lastUpdateUserCN: null, - rowIdx: -1, - roleSort: null, - roleId: 1003, - roleName: 'Guest', - roleDesc: null, - defaultUrl: null, - status: null, - applyStatus: null, - personalPermissions: null, - owner: null, - userAdminRole: null, - grantedOperations: null, - roleList: null, - permissionUrl: null, - approvedByOld: null, - noPermissionUrl: null, - roleDimension: null, - roleChk: null, - currentScope: 'otc', - approveMode: null, - appNames: ['tiny'] - }, - { - createdBy: null, - creationDate: null, - creationUserCN: null, - lastUpdateDate: null, - lastUpdateUserCN: null, - rowIdx: -1, - roleSort: null, - roleId: 1001, - roleName: 'System Admin', - roleDesc: null, - defaultUrl: '', - status: null, - applyStatus: null, - owner: null, - userAdminRole: null, - grantedOperations: null, - personalPermissions: null, - noPermissionUrl: null, - permissionUrl: null, - approvedByOld: null, - approveMode: null, - roleDimension: null, - roleChk: null, - roleList: null, - currentScope: 'otc', - appNames: ['vui'] - } - ], - defaultRole: 'vui:1001;', - endDate: '2017-11-14T11:08:58.000+0800', - programValidity: null, - appNames: ['vui'], - scopes: ['otc'] - }, - envBean: { - exclusions: ['/applet/'], - profileName: 'sit', - homePath: 'index.html', - urlOfIData: null, - urlOfIDataGoverner: null, - appName: 'vui' - }, - appResBeans: [], - config: { - hwaSiteId: null, - appVersion: '20140627', - resourceMode: '0', - ScriptLogLevel: '2', - earSplit: '0', - crossDomainMode: '0', - jalorStatic: '', - IsWideScreen: true, - subAppMap: {}, - enableDynamicHelp: true, - hwaIgnoreRegular: '0', - jalorVersion: '0', - w3Static: '', - scope: 'otc', - i18nVersion: '20160524', - historySettings: '{"enable":1,"length":3,"storage":0,"sort":1}', - delayHide: null, - MergePermission2CurrentRole: '0', - IDataSoaservicesV1: null, - enableInfoTip: true, - badScriptWords: '0', - pushMsgDelayLoadTime: null, - appName: 'vui', - forwardDelayTime: '0', - enabledI18nCache: '0', - enableMulti: false, - appSystemAdmin: 'test1', - selfStatic: '', - hwa: '1', - enablePushMessage: false, - IsFixedMenu: '1', - enableHomeCache: false, - enabledParamterAppendToRequest: '', - resourceMap: {}, - region: null, - PrivilegeType: '0' - }, - contextPath: '/jalor6DemoService1/', - switchLanguageEnabled: true, - validLanguages: ['enUS', 'zhCN'], - currentLanguage: 'zhCN', - leftMenuNode: { - siteNodeId: 7000, - name: '更新日志', - url: '#/zh-CN/guide/changelog', - target: '_self', - location: '', - extensionField: '{"icon":"icon-affix"}', - children: [ - { - siteNodeId: 7001, - name: '开发指南', - url: '', - target: '_self', - location: '', - extensionField: '{"icon":"icon-setup"}', - children: [ - { - siteNodeId: 7002, - name: '安装', - children: null, - url: '#/zh-CN/guide/installation', - target: '_self', - location: '' - }, - { - siteNodeId: 7003, - name: '引入组件', - children: null, - url: '#/zh-CN/guide/quickstart', - target: '_self', - location: '' - }, - { - siteNodeId: 7004, - name: 'CLI配置', - children: null, - url: '#/zh-CN/guide/configuration', - target: '_self', - location: '' - }, - { - siteNodeId: 7004, - name: '国际化', - children: null, - url: '#/zh-CN/guide/i18n', - target: '_self', - location: '' - }, - { - siteNodeId: 7004, - name: '权限', - children: null, - url: '#/zh-CN/guide/permission', - target: '_self', - location: '' - }, - { - siteNodeId: 7004, - name: '代码分隔', - children: null, - url: '#/zh-CN/guide/codesplit', - target: '_self', - location: '' - }, - { - siteNodeId: 7004, - name: '构建部署', - children: null, - url: '#/zh-CN/guide/publish', - target: '_self', - location: '' - }, - { - siteNodeId: 7004, - name: '自定义主题', - children: null, - url: '#/zh-CN/guide/theme', - target: '_self', - location: '' - } - ] - }, - { - siteNodeId: 8001, - name: '表单组件', - url: '', - target: '_self', - location: '', - extensionField: '{"icon":"icon-list"}', - children: [ - { - siteNodeId: 8002, - name: 'Button 按钮', - url: '#/zh-CN/component/button', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8002, - name: 'Input 输入框', - url: '#/zh-CN/component/input', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8002, - name: 'Textarea 文本域', - url: '#/zh-CN/component/textarea', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8002, - name: 'Numeric 数字框', - url: '#/zh-CN/component/numeric', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8002, - name: 'Selectgroup 选择框', - url: '#/zh-CN/component/selectgroup', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8002, - name: 'Dropdown 下拉框', - url: '#/zh-CN/component/dropdown', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8002, - name: 'Suggest 联想框', - url: '#/zh-CN/component/suggest', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8002, - name: 'Datepicker 日期选择器', - url: '#/zh-CN/component/datepicker', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8002, - name: 'Time 时间', - url: '#/zh-CN/component/time', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8002, - name: 'DropTimes 下拉时间', - url: '#/zh-CN/component/droptimes', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8002, - name: 'Fileupload 上传', - url: '#/zh-CN/component/fileupload', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8002, - name: 'Form 表单', - url: '#/zh-CN/component/form', - target: '_self', - location: '', - children: null - } - ] - }, - { - siteNodeId: 8003, - name: '数据组件', - url: '', - target: '_self', - location: '', - extensionField: '{"icon":"icon-db"}', - children: [ - { - siteNodeId: 8004, - name: 'Grid 数据表格', - url: '#/zh-CN/component/grid', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Repeater 数据列表', - url: '#/zh-CN/component/repeater', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Tree 树形控件', - url: '#/zh-CN/component/tree', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Pager 分页', - url: '#/zh-CN/component/pager', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Badge 徽标', - url: '#/zh-CN/component/badge', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Chart 图表', - url: '#/zh-CN/component/chart', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Gridster 拖放网格', - url: '#/zh-CN/component/gridster', - target: '_self', - location: '', - children: null - } - ] - }, - { - siteNodeId: 8003, - name: '导航组件', - url: '', - target: '_self', - location: '', - extensionField: '{"icon":"icon-route"}', - children: [ - { - siteNodeId: 8004, - name: 'TreeMenu 树型菜单', - url: '#/zh-CN/component/treemenu', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'ToggleMenu 收缩菜单', - url: '#/zh-CN/component/toggleMenu', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'LinkMenu 收藏夹菜单', - url: '#/zh-CN/component/linkmenu', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'PopupMenu 弹出菜单', - url: '#/zh-CN/component/popupmenu', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'ContextMenu 上下文菜单', - url: '#/zh-CN/component/contextmenu', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Menubar 菜单栏', - url: '#/zh-CN/component/menubar', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Breadcrumb 面包屑', - url: '#/zh-CN/component/breadcrumb', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Floatbar 浮动块', - url: '#/zh-CN/component/floatbar', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Flowchart 复杂流程图', - url: '#/zh-CN/component/flowchart', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Wizard 流程图', - url: '#/zh-CN/component/wizard', - target: '_self', - location: '', - children: null - } - ] - }, - { - siteNodeId: 8003, - name: '业务组件', - url: '', - target: '_self', - location: '', - extensionField: '{"icon":"icon-user"}', - children: [ - { - siteNodeId: 8004, - name: 'Area 片区', - url: '#/zh-CN/component/area', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Amount 金额', - url: '#/zh-CN/component/amount', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Country 国家/地区', - url: '#/zh-CN/component/country', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Company 公司', - url: '#/zh-CN/component/company', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Currency 币种', - url: '#/zh-CN/component/currency', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Hrapprover HR授权人', - url: '#/zh-CN/component/hrapprover', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Dept 部门', - url: '#/zh-CN/component/dept', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Roles 角色切换', - url: '#/zh-CN/component/roles', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'DropRoles 下拉角色', - url: '#/zh-CN/component/droproles', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Locales 语言切换', - url: '#/zh-CN/component/locales', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'User 用户', - url: '#/zh-CN/component/user', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'UserAccount 用户账号', - url: '#/zh-CN/component/useraccount', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'UserLink 用户信息链接', - url: '#/zh-CN/component/userlink', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'LogonUser 登录用户', - url: '#/zh-CN/component/logonuser', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Logout 注销', - url: '#/zh-CN/component/logout', - target: '_self', - location: '', - children: null - } - ] - }, - { - siteNodeId: 8003, - name: '其他组件', - url: '', - target: '_self', - location: '', - extensionField: '{"icon":"icon-stardisable"}', - children: [ - { - siteNodeId: 8004, - name: 'PopEditor 弹出编辑', - url: '#/zh-CN/component/popeditor', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'SuggestPopup 联想弹出框', - url: '#/zh-CN/component/suggestpopup', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Tip 文字提示', - url: '#/zh-CN/component/tip', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Card 卡片', - url: '#/zh-CN/component/card', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Panel 折叠面板', - url: '#/zh-CN/component/panel', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'Slider 滑块', - url: '#/zh-CN/component/slider', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'SlideBar 滚动块', - url: '#/zh-CN/component/slidebar', - target: '_self', - location: '', - children: null - }, - { - siteNodeId: 8004, - name: 'SlideImg 图片轮播', - url: '#/zh-CN/component/slideImg', - target: '_self', - location: '', - children: null - } - ] - } - ] - }, - userSettingList: [ - { - lastUpdateDate: '2017-11-01T11:39:36.000+0800', - rowIdx: -1, - settingId: 1006, - settingKey: 'global', - userId: 131269511, - settingContent: '', - numberOfSettings: 0 - } - ], - helpers: null, - pushMsg: false, - serverTime: '2017-11-14T11:26:30.155+0800', - globalScript: null, - globalStyle: null, - checkBrowser: '0', - network: 'intranet', - themeName: 'default', - switchThemeEnabled: '0', - themes: { - default: - '' - }, - languageList: [], - msaGatewayConfig: {} - }, - lang: { - zhCN: { - 'widget.grid.individuation.otherTabInfo': - '设置服务器排序或客户端排序, 每页条数大小。', - 'wiget.grid.individuation.btntitle': '个性化设置', - 'widget.close': '关闭', - 'widget.datepicker_month': '月', - 'widget.usercard.manager': 'manager', - 'widget.usercard.empno': '工号', - 'widget.menu.coltitle': '点击进行菜单收起到边缘', - 'widget.datepicker_months.11': '十二月', - 'widget.datepicker_months.10': '十一月', - 'widget.grid.operation.copy_pop': '弹出复制', - 'widget.upload.filename': '文件名', - 'widget.grid.fullscreen.warn': - 'grid全屏编辑模式下,关闭或者刷新浏览器有可能导致未提交数据丢失!请先确保你的数据都已提交。', - 'widget.upload.sechight': '高风险', - 'widget.datepicker_weekdays': - '星期日,星期一,星期二,星期三,星期四,星期五,星期六,星期日', - 'widget.grid.individuation.setDefaultBtn': '恢复默认设置', - 'widget.grid.search_noRecords': '暂无数据', - 'widget.upload.filestatus': '文件状态', - 'widget.edit': '编辑', - 'widget.dialog.pin.pin': '固定窗口', - 'widget.login': '登录', - 'widget.tree.reload': '重新加载节点', - 'widget.grid.status.del': '删除的数据', - 'widget.grid.individuation.baseTabInfo': '请拖动对象进行排序', - 'widget.usercard.timezone': '时区', - 'widget.usercard.internal': 'internal line', - 'widget.grid.filter.unempty': '不为空', - 'widget.grid.filter.include': '包含', - 'widget.upload.httperror': '上传错误,HTTP状态:{0}. {1}', - 'widget.grid.filter.greaterThan': '大于', - 'widget.customer.name': '客户名称', - 'widget.grid.operation.insert_child': '新增子节点', - 'widget.dept.inputtip': '可输入部门编码或名称', - 'widget.upload.preview': '预览', - 'widget.dept.search': '辅助查询', - 'widget.upload.dragtip': '拖拽文件到此处', - 'widget.dropdown.suggest.info_text': - '仅显示匹配的{0}条记录,请输入更多的关键字!', - 'widget.upload.imgmemoryerror': '运行时已消耗所有可用内存。', - 'widget.customer.code': '客户编码', - 'widget.dept.ok': '确定', - 'widget.pager.pagesize': '条/页', - 'widget.pager.ok': 'GO', - 'widget.dept.selectdept': '部门选择', - 'widget.view': '查看', - 'widget.grid.operation.isSave_msg': '有修改的数据,是否要保存?', - 'widget.collapse': '收起', - 'widget.upload.stopupload': '停止上传', - 'widget.upload.seclow': '低风险', - 'widget.dept.company': '公司', - 'widget.pager.total': '共', - 'widget.upload.imgformaterror': '图片格式错误或者不支持。', - 'widget.usercard.title': '用户信息: {0}', - 'widget.grid.operation.noSelected_msg': '请选择一条记录!', - 'widget.datepicker_weekdays.1': '星期一', - 'widget.datepicker_weekdays.0': '星期日', - 'widget.datepicker_weekdays.7': '星期日', - 'widget.datepicker_weekdays.6': '星期六', - 'widget.datepicker_weekdays.5': '星期五', - 'widget.datepicker_weekdays.4': '星期四', - 'widget.datepicker_weekdays.3': '星期三', - 'widget.datepicker_weekdays.2': '星期二', - 'widget.tree.edit': '修改名称', - 'widget.datepicker_year': '年', - 'widget.myAccountSetting': '我的账号设置', - 'widget.usercard.zipcode': '邮编', - 'widget.grid.filter.sort_desc': '降序', - 'widget.menu.poptitle': '设置常用链接', - 'widget.grid.filter.advanced': '高级筛选...', - 'widget.reset': '重置', - 'widget.grid.individuation.currPageSort': '当前页数据排序', - 'widget.grid.individuation.noUnFrozen': '该列不能设置为非冻结列', - 'widget.upload.close': '关闭', - 'widget.grid.individuation.saveBtn': '确 认', - 'widget.myrole': '当前角色:', - 'widget.upload.maxcount': '最多上传{0}个文件', - 'widget.grid.operation.reload_child': '重新加载子节点', - 'widget.usercard.other': '其他', - 'widget.datepicker_previousMonth': '上月', - 'widget.customer.address': '客户地址', - 'widget.grid.filter.equalToGreaterThan': '大于等于', - 'widget.upload.maxfilesize': '每个文件最大{0}', - 'widget.upload.overcount': '已超出上传文件最大数量', - 'widget.grid.individuation.allSort': '全部数据排序', - 'widget.tree.delWarn': '不能删除有子节点的节点', - 'widget.browse': '浏览...', - 'widget.datepicker_monthsShort.': - '1月,2月,3月,4月,5月,6月,7月,8月,9月,10月,11月,12月', - 'widget.dept.selected': '已选', - 'widget.upload.duplicateerror': '文件{0} 已经在当前队列里。', - 'widget.tree.del': '删除节点', - 'widget.dialog.confirm.title': '请确认', - 'widget.usercard.fax': '传真', - 'widget.upload.typeerror': '文件类型出错', - 'widget.selectAll': '全选', - 'widget.tree.requireval': '值不能为空,请重新输入值', - 'widget.grid.operation.leadingIn': '导入', - 'widget.grid.operation.insert_node': '新增同一级节点', - 'widget.datepicker_weekdaysShort.7': '周日', - 'widget.datepicker_weekdaysShort.6': '周六', - 'widget.dept.eighth': '八级部门', - 'widget.dept.fifth': '五级部门', - 'widget.datepicker_weekdaysShort.5': '周五', - 'widget.datepicker_weekdaysShort.4': '周四', - 'widget.datepicker_weekdaysShort.3': '周三', - 'widget.datepicker_weekdaysShort.2': '周二', - 'widget.datepicker_weekdaysShort.1': '周一', - 'widget.datepicker_weekdaysShort.0': '周日', - 'widget.grid.operation.copy_node': '复制同一级节点', - 'widget.grid.status.add': '新增的数据', - 'widget.usercard.phone': '固定电话', - 'widget.upload.filetypeerror': '文件: {0} 的类型不符合要求', - 'widget.upload.sizeerror': '文件: {0}, 大小: {1}, 最大文件大小: {2}', - 'widget.usercard.address': '地址', - 'widget.grid.operate': '操作', - 'widget.datepicker_months.': - '一月,二月,三月,四月,五月,六月,七月,八月,九月,十月,十一月,十二月', - 'widget.tree.addbrother': '添加同级节点', - 'widget.grid.filter.clear': '清除当前列筛选', - 'widget.dept.selecttip': '请选择部门', - 'widget.upload.title': '文件上传', - 'widget.grid.operation.templete': '下载模板', - 'widget.datepicker_weekdaysShort.': - '周日,周一,周二,周三,周四,周五,周六,周日', - 'widget.grid.operation.copy': '复制', - 'widget.grid.operation.leadingOut': '导出', - 'widget.customer.placeholder': '可输入客户编码或名称', - 'widget.usercard.viop': 'VIOP', - 'widget.logout': '注销', - 'widget.datepicker_today': '今天', - 'widget.customer.title': '客户信息列表', - 'widget.upload.filethumbnailsview': '缩略图模式', - 'widget.upload.del_comfirm_msg': '确定要删除吗?', - 'widget.grid.filter.week': '本周', - 'widget.grid.individuation.warn': '请保证至少两条未隐藏列不被冻结!', - 'widget.grid.filter.suffix': '结尾是', - 'widget.success_msg': '操作成功!', - 'widget.grid.filter.equal': '等于', - 'widget.datepicker_monthsShort.10': '11月', - 'widget.datepicker_monthsShort.11': '12月', - 'widget.dept.deptcode': '部门编码', - 'widget.upload.secmid': '中风险', - 'widget.upload.fileexsupport': '支持上传【{0}】格式文件', - 'widget.grid.individuation.renderTabTitle': '行渲染设置', - 'widget.tree.add': '添加子节点', - 'widget.grid.filter.and': '并且', - 'widget.save_noChanged_msg': '没有记录被更改,无需保存。', - 'widget.dialog.crop.image_dialog_title': '图片', - 'widget.setting': '设置', - 'widget.grid.filter.equalToLessThan': '小于等于', - 'widget.upload.secblack': '该文件的安全等级为: 黑名单, 无法上传', - 'widget.upload.closemsg': - '文件正在上传或安全扫描中,关闭后信息会丢失,确认关闭?', - 'widget.grid.filter.or': '或者', - 'widget.grid.individuation.descTitle': '降序', - 'widget.upload.fileexerror': '文件: {0} 的类型不符合要求', - 'widget.grid.filter.sort_asc': '升序', - 'widget.grid.filter.empty': '为空', - 'widget.grid.status.edit': '更新的数据', - 'widget.dialog.pin.unpin': '取消固定', - 'widget.del_comfirm_msg': '确定要删除?', - 'widget.menu.nourlwarn': '该节点无链接URL,不能选择,请选择其他节点。', - 'widget.grid.individuation.hideMsg': '至少保留一列显示', - 'widget.tab.exceed_max_tabitem': '标签项的最大值为', - 'widget.menu.maxwarn': '不能选择多于{0}个节点', - 'widget.grid.status.error': '验证未通过的数据', - 'widget.datepicker_nextMonth': '下月', - 'widget.grid.operation.noSetting_msg': '您未设置该操作!', - 'widget.upload.filesqueued': '继续添加', - 'widget.grid.filter.month': '本月', - 'widget.upload.counterror': - '每次只接受同时上传 {0} 个文件,多余的文件将会被删除。', - 'widget.tab.same_tabid_confirm': '存在相同的TabId项.', - 'widget.grid.individuation.resetBtn': '重 置', - 'widget.amount.date': '日期', - 'widget.grid.filter.clear_all': '清除所有列筛选', - 'widget.search': '搜索', - 'widget.expand': '展开', - 'widget.grid.individuation.sortType': '排序类型', - 'widget.tab.del_comfirm_msg': '确认删除 ?', - 'widget.datepicker_weekdays.': - '星期日,星期一,星期二,星期三,星期四,星期五,星期六,星期日', - 'widget.dept.primary': '一级部门', - 'widget.upload.selectfiles': '选择文件', - 'widget.grid.operation.del': '删除', - 'widget.dept.third': '三级部门', - 'widget.upload.filesize': '文件大小', - 'widget.usercard.email': '邮箱', - 'widget.dept.deptname': '部门名称', - 'widget.grid.individuation.showTitle': '可见的', - 'widget.datepicker_weekdaysShort': - '周日,周一,周二,周三,周四,周五,周六,周日', - 'widget.datepicker_months.2': '三月', - 'widget.datepicker_months.3': '四月', - 'widget.datepicker_months.4': '五月', - 'widget.datepicker_months.5': '六月', - 'widget.datepicker_months.6': '七月', - 'widget.datepicker_months.7': '八月', - 'widget.datepicker_months.8': '九月', - 'widget.datepicker_months.9': '十月', - 'widget.grid.individuation.nosortTitle': '无排序', - 'widget.datepicker_months.0': '一月', - 'widget.datepicker_months.1': '二月', - 'widget.grid.individuation.renderTabInfo': - '拖动矩形块,块内的图标按钮可点击操作,拖到锁定框内的顺序为优先级。', - 'widget.upload.uploadcomplete': '文件上传完成', - 'widget.dropdown.emptyData': '没有数据', - 'widget.grid.individuation.ascTitle': '升序', - 'widget.datepicker_monthsShort': - '1月,2月,3月,4月,5月,6月,7月,8月,9月,10月,11月,12月', - 'widget.upload.overmax': - '上传文件个数已达上限: {0},请先删除已上传的文件后方可继续上传其他文件', - 'widget.grid.individuation.otherTabTitle': '其他设置', - 'widget.grid.filter.lessThan': '小于', - 'widget.amount.currency': '币种', - 'widget.dept.cancel': '取消', - 'widget.usercard.employeId': 'employee id', - 'widget.grid.filter.prefix': '开头是', - 'widget.dialog.crop.comments.1': - '(2) 建议使用大头照,不然缩小后可能看不清楚', - 'widget.dialog.crop.comments.0': - '(1) 支持JPG和PNG格式的图片文件,大小20M以内', - 'widget.dialog.crop.comments.3': - '(4) 如要设置系统默认头像,请勿上传图片,直接点击“设置”按钮', - 'widget.dialog.crop.comments.2': - '(3) 请“浏览”大图,上传头像;您也可以手工调整选择头像区域', - 'widget.grid.operation.insert_pop': '弹出新增', - 'widget.grid.operation.undelete': '取消删除', - 'widget.upload.filelistview': '列表模式', - 'widget.save': '保存', - 'widget.upload.secwarn': '该文件的安全等级为: {0}, 建议删除', - 'widget.define': '确定', - 'widget.upload.delconfirm': '确认要取消上传这个文件吗?', - 'widget.customer.search': '快速查询', - 'widget.tree.noEdit': '该节点不能修改名称', - 'widget.grid.individuation.closeBtn': '取 消', - 'widget.fullScreen': '全屏', - 'widget.datepicker_weekdaysShortest.0': '日', - 'widget.datepicker_weekdaysShortest.1': '一', - 'widget.datepicker_weekdaysShortest.2': '二', - 'widget.datepicker_weekdaysShortest.3': '三', - 'widget.datepicker_weekdaysShortest.4': '四', - 'widget.datepicker_weekdaysShortest.5': '五', - 'widget.datepicker_weekdaysShortest.6': '六', - 'widget.datepicker_weekdaysShortest.7': '日', - 'widget.dept.seventh': '七级部门', - 'widget.usercard.travelcode': 'travel code', - 'widget.upload.startupload': '开始上传', - 'widget.grid.individuation.baseTabTitle': '基础设置', - 'widget.datepicker_months': - '一月,二月,三月,四月,五月,六月,七月,八月,九月,十月,十一月,十二月', - 'widget.datepicker_monthsShort.9': '10月', - 'widget.datepicker_monthsShort.8': '9月', - 'widget.datepicker_monthsShort.7': '8月', - 'widget.datepicker_monthsShort.6': '7月', - 'widget.pager.rows': '条', - 'widget.datepicker_monthsShort.1': '2月', - 'widget.datepicker_monthsShort.0': '1月', - 'widget.datepicker_monthsShort.5': '6月', - 'widget.datepicker_monthsShort.4': '5月', - 'widget.datepicker_monthsShort.3': '4月', - 'widget.datepicker_monthsShort.2': '3月', - 'widget.grid.individuation.pageSize': '每页条数', - 'widget.select': '选择', - 'widget.grid.individuation.noFrozen': '该列不能设置为冻结列。', - 'widget.upload.addfiles': '添加文件', - 'widget.grid.individuation.hideTitle': '隐藏的', - 'widget.datepicker_nextYear': '下年', - 'widget.dropdown.suggest.mismatchUserMsg': - '[{0}]有误!请输入有效的工号,w3账号或姓名全拼', - 'widget.grid.filter.today': '今天', - 'widget.maximize': '最大化', - 'widget.dept.fourth': '四级部门', - 'widget.dept.second': '二级部门', - 'widget.grid.filter.threeMonth': '三月之内', - 'widget.grid.operation.leading': 'Excel导入导出', - 'widget.dialog.crop.title': '设置头像', - 'widget.datepicker_previousYear': '上年', - 'widget.usercard.department': '部门', - 'widget.grid.status.emptyName': '未设置名称', - 'widget.amount.amount': '金额', - 'widget.dept.sixth': '六级部门', - 'widget.menu.exptitle': '点击恢复菜单', - 'widget.ok': '确定', - 'widget.pager.curpage': '当前页', - 'widget.usercard.mobile': '手机', - 'widget.grid.filter.exclude': '不包含', - 'widget.dialog.alert.title': '提示', - 'widget.tree.noInsert': '该节点不能添加子节点', - 'widget.grid.filter.unequal': '不等于', - 'widget.tree.placeholder': '请输入内容进行筛选', - 'widget.upload.uploadedfiles': '已上传 {0}/{1} 个文件', - 'widget.grid.operation.insert': '新增', - 'widget.cancel': '取消', - 'widget.grid.filter.year': '本年度', - 'widget.restore': '还原', - 'hra.noapprover': '没有权签人', - 'hra.selecttip': '没有选择权签人', - 'hra.Approver': '权签人', - 'hra.Remarks': '说明', - 'hra.selectapprover': '权签人选择', - 'hae.widget.emptyData': '没有数据', - 'hae.widget.textarea.exceeded': '已经超出字数限制', - 'popeditor.popup_all': '所有数据列表', - 'popeditor.popup_selected': '选中数据列表', - 'hae.i18n.label.type': '类别', - 'hae.i18n.column.module': '模块', - 'hae.i18n.column.key': '键值', - 'hae.i18n.column.content': '内容', - 'hae.i18n.label.foregroud': '前台', - 'hae.i18n.column.language': '语种', - 'hae.i18n.label.backgroud': '服务', - 'hae.catalog.i18n_manager': '国际化管理', - 'hae.loading': '加载中...', - 'popeditor.popup_history': '历史选项', - enUS: 'English', - zhCN: '中文', - 'validation.maxLengthErr': '长度必须不大于 {{length}}', - 'validation.maxErr': '值应不大于最大值{{value}}', - 'validation.integerErr': '非法整数', - 'validation.urlErr': '非法url地址', - 'validation.acceptErr': '后缀不匹配此正则表达式:{{result}}', - 'validation.intOverFlow': '整数超出限制, 允许最大整数位数: {0}位', - 'validation.timeErr': '无效时间', - 'validation.rateErr': '比例应该在{{min}}%与 {{max}}%之间', - 'validation.versionErr': '非法版本格式', - 'validation.minLengthErr': '长度必须不小于{{length}}', - 'validation.fileSizeErr': '文件大小的格式不正确,应如 3kb', - 'validation.emailErr': '非法邮件地址', - 'validation.lenRange': '长度必须在 {{minLen}} 与 {{maxLen}}之间', - 'validation.requireErr': '必填!', - 'validation.minErr': '值应不小于最小值{{value}}', - 'validation.digitsErr': '非法纯数字', - 'validation.dateYMErr': '不符合规则的时间格式', - 'validation.dateTimeErr': '不符合规则的时间格式', - 'validation.dateFormatErr': '此日期格式必须是', - 'validation.numErr': '非法数字', - 'validation.dateErr': '不符合规则的数据格式', - 'validation.regularConfigErro': '规则配置错误', - 'validation.xmlErr': '非法的xml格式', - 'validation.specialchErr': '只能输入数字、字母、下划线、横杠、点号', - 'validation.jsonErr': '请输入正确的JSON格式,如{"a":1}', - 'validation.invalidData': '无效输入!', - 'validation.ipErr': '非法IP地址', - 'validation.longDateTimeErr': '不符合规则的时间格式', - 'tabs.more': '更多', - 'widget.steps.done': '已完成', - 'widget.steps.wait': '未开始', - 'widget.steps.doing': '进行中', - 'widget.alert.success': '成功了!', - 'widget.alert.error': '出错了!', - 'widget.alert.info': '帮助信息!', - 'widget.alert.warning': '请注意!', - 'widget.transfer.title.datalists': '所有数据列表', - 'widget.transfer.title.selectedlists': '已选数据列表', - 'widget.transfer.search.placeholder': '请输入要搜索的内容', - 'widget.transfer.search.noMatch': '没有匹配到数据' - } - } -} - -export default [ - { - url: /services\/jalor\/web\/support\/workspace\/current/, - response: function response() { - return [200, data.env] - } - }, - { - url: /services\/jalor\/resource\/i18nQuery\/findI18nMap/, - response: function response() { - return [200, data.lang.zhCN] - } - }, - { - url: /only4ssoTimeUpdate.do/, - response: function response() { - return [200] - } - }, - { - url: /services\/jalor\/security\/user\/list\/byids/, - proxy: 'mock/gateway/json/services/byids.json', - handleData: function handleData(data, config) { - let users = config.data - let res = users ? [] : data - if (users) { - data.forEach((item) => { - if (users.indexOf(item.userId) > -1) { - res.push(item) - } - }) - } - return res - } - }, - { - url: /services\/jalor\/security\/user\/list\/byaccounts/, - proxy: 'mock/gateway/json/services/byaccounts.json', - handleData: function handleData(data, config) { - let users = config.data - let res = users ? [] : data - if (users) { - data.forEach((item) => { - if (users.indexOf(item.userAccount) > -1) { - res.push(item) - } - }) - } - return res - } - }, - { - url: /servlet\/idataProxy\/params\/ws\/soaservices\/AreaServlet/, - proxy: 'mock/gateway/json/services/area.json', - handleData: function handleData(data, _ref) { - let _ref$params = _ref.params, - label = _ref$params.area_label, - parent = _ref$params.parent - - let res = data[label] - if (parent) { - res = { - area: res.area.filter((item) => item.parent === parent) - } - } - return res - } - }, - { - url: /servlet\/idataProxy\/params\/ws\/soaservices\/CurrencyServlet/, - proxy: 'mock/gateway/json/services/currency.json' - }, - { - url: /servlet\/idataProxy\/params\/ws\/soaservices\/CountryServlet/, - proxy: 'mock/gateway/json/services/jalor.country.json' - }, - { - url: /servlet\/idataProxy\/params\/ws\/soaservices\/CompanyServlet/, - proxy: 'mock/gateway/json/services/jalor.company.json' - }, - { - url: /services\/getTreeMockData/, - proxy: 'mock/gateway/json/services/tree.json' - }, - { - url: /services\/getSelectorMockData/, - proxy: 'mock/gateway/json/services/suggest.json' - }, - { - url: /servlet\/idataProxy\/params\/ws\/soaservices\/PersonServlet/, - proxy: 'mock/gateway/json/services/jalor.user.json', - handleData: function handleData(data, _ref2) { - let empNo = _ref2.params.empNo - - if (empNo) { - data = data.filter((item) => item.employee_Number === empNo) - } - return data[0] - } - }, - { - url: /services\/jalor\/security\/user\/suggest/, - proxy: 'mock/gateway/json/services/byids.json', - handleData: function handleData(data, userData) { - let userData$params = userData.params, - params = userData$params === undefined ? {} : userData$params - - let val = params.userCN || params - if (typeof val === 'string') { - data = data.filter((value) => ( - value.userCN.indexOf(val) > -1 || - value.userAccount.indexOf(val) > -1 || - String(value.userId) === val - )) - } - return data - } - }, - { - url: /services\/jalor\/security\/user\/suggest/, - proxy: 'mock/gateway/json/services/byaccounts.json', - handleData: function handleData(data, _ref3) { - let _ref3$params = _ref3.params, - params = _ref3$params === undefined ? {} : _ref3$params - - let val = params.userCN || params - if (typeof val === 'string') { - data = data.filter((item) => ( - item.userCN.indexOf(val) > -1 || - item.userAccount.indexOf(val) > -1 || - String(item.userId) === val - )) - } - return data - } - }, - { - url: /servlet\/idataProxy\/params\/ws\/soaservices\/HRDepartmentServlet/, - proxy: 'mock/gateway/json/services/deptInfo.json', - handleData: function handleData(data, _ref4) { - let _ref4$params = _ref4.params, - params = _ref4$params === undefined ? {} : _ref4$params - - let res = data[0] - if (params.code) { - res = data.filter((item) => item.dept_Code === params.code)[0] - } - return res - } - }, - { - url: /servlet\/idataProxy\/params\/ws\/soaservices\/HRDeptListServlet/, - proxy: 'mock/gateway/json/services/deptList.json', - handleData: function handleData(data, _ref5) { - let _ref5$params = _ref5.params, - params = _ref5$params === undefined ? {} : _ref5$params - - let searchKey = params.upperCode || '000001' - let res = data.filter((item) => item.upperCode === searchKey)[0] - return res - } - }, - { - url: /servlet\/idataProxy\/params\/wsres\/soaservices\/dept\/list/, - proxy: 'mock/gateway/json/services/deptSearch.json', - handleData: function handleData(data, _ref6) { - let _ref6$params = _ref6.params, - params = _ref6$params === undefined ? {} : _ref6$params - - let searchKey = params.searchValue || '' - let res = data.filter((item) => ( - item.hrCode.indexOf(searchKey) > -1 || - item.hrName.indexOf(searchKey) > -1 - )) - return { result: res } - } - }, - { - url: /servlet\/idataProxy\/params\/ws\/soaservices\/HRApproverServlet/, - proxy: 'mock/gateway/json/services/hrapprover.json', - handleData: function handleData(data, _ref7) { - let _ref7$params = _ref7.params, - params = _ref7$params === undefined ? {} : _ref7$params - - let res = data.filter((item) => params.code === item.dept_Code) - return { hrpa: res } - } - }, - { - url: /services\/getDropdownProvince/, - response: function response() { - let data = [ - { prov: '广东' }, - { prov: '广西' }, - { prov: '北京' }, - { prov: '上海' } - ] - return [200, data] - } - }, - { - url: /services\/getDropCascadeData/, - response: function response(_ref8) { - let url = _ref8.url, - _ref8$params = _ref8.params - _ref8$params = _ref8$params === undefined ? {} : _ref8$params - let prov = _ref8$params.prov - - let _Hae$String$getUrlPar = url // Hae.String.getUrlParams(url), - let type = _Hae$String$getUrlPar.params.type - - let data = [] - if (type === 'province') { - data = [{ province: '广东省' }, { province: '福建省' }] - } - if (type === 'city') { - switch (prov) { - case '广东省': - data = [{ city: '广州' }, { city: '深圳' }] - break - case '福建省': - data = [{ city: '龙岩' }, { city: '福州' }, { city: '厦门' }] - break - } - } - return [200, data] - } - }, - { - url: /services\/forGridCascade\/getCascadeData/, - response: function response(_ref9) { - let url = _ref9.url, _ref9$params = _ref9.params - _ref9$params = _ref9$params === undefined ? {} : _ref9$params - let area = _ref9$params.area, prov = _ref9$params.prov, province = _ref9$params.province - let _Hae$String$getUrlPar2 = url // String.getUrlParams(url), - let type = _Hae$String$getUrlPar2.params.type - let data = void 0 - if (type === 'area') { - data = [ { area: '华东区' },{ area: '华南区' },{ area: '华中区' },{ area: '西南区' }] - } - if (type === 'province') { - switch (area) { - case '华东区': - data = [{ province: '福建省' }] - break - case '华南区': - data = [{ province: '广东省' }, { province: '广西省' }] - break - case '华中区': - data = [{ province: '湖北省' }] - break - case '西南区': - data = [{ province: '云南省' }] - break - } - } - if (type === 'city') { - switch (prov || province) { - case '广东省': - data = [ { city: '广州' }, { city: '深圳' }, { city: '中山' }, { city: '韶关' },{ city: '珠海' }] - break - case '福建省': - data = [{ city: '龙岩' }, { city: '福州' }, { city: '厦门' }] - break - case '广西省': - data = [{ city: '南宁' }, { city: '北海' }, { city: '桂林' }] - break - case '云南省': - data = [{ city: '昆明' }, { city: '大理' }, { city: '西双版纳' }] - break - case '湖北省': - data = [{ city: '武汉' }, { city: '十堰' },{ city: '潜江' },{ city: '黄冈' },{ city: '赤壁' },{ city: '襄阳' }] - break - } - } - return [200, data] - } - }, - { - url: /services\/getSuggestProvince/, - response: function response(_ref10) { - let params = _ref10.params - - let data = [ - { prov: '广东省' }, - { prov: '广西省' }, - { prov: '福建省' }, - { prov: '云南省' } - ] - let res = [] - if (params) { - data.forEach((item) => { - if (item.prov.indexOf(params) > -1) { - res.push(item) - } - }) - } else { - res = data - } - return [200, res] - } - }, - { - url: /services\/getSuggestPopupData/, - proxy: 'mock/gateway/json/services/suggest.json', - handleData: function handleData(data, _ref11) { - let params = _ref11.params - - let res = params && !params.pageVO ? [] : data - if (params && !params.pageVO) { - data.forEach((item) => { - if (item.name.indexOf(params) > -1) { - res.push(item) - } - }) - } - return res - } - }, - { - url: /services\/getGridMockData/, - proxy: 'mock/gateway/json/services/grid.json', - handleData: function handleData(datas, _ref12) { - let url = _ref12.url, _ref12$param = _ref12.param, param = _ref12$param === undefined ? {} : _ref12$param, data = _ref12.data - let name = void 0, key = void 0,area = void 0,filters = _ref12.filters - if (data && typeof data === 'string') { - let obj = JSON.parse(data) - if (obj) { - name = obj.name - key = obj.cascade || obj.id - } - if (obj.pageVO && obj.pageVO.filterStr) { - let filterStr = JSON.parse(obj.pageVO.filterStr) - filterStr.area && (area = filterStr.area.value) - } - } - if (filters && filters.city && filters.city.value) { - datas = datas.filter((item) => filters.city.value.indexOf(item.city) > -1) - } - if (key) { - let keys = key.split(',') - datas = datas.filter((item) => keys.indexOf(item.id) > -1) - } - if (name) { - datas = datas.filter((item) => ( - name && item.name.toUpperCase().indexOf(name.toUpperCase()) > -1 - )) - } - if (area) { - datas = datas.filter((item) => area.indexOf(item.area) > -1) - } - if (typeof param.showPager === 'undefined' || param.showPager) { - let parts = url.split('/'),curPage = parseInt(parts[4]),pageSize = parseInt(parts[3]),offset = (curPage - 1) * pageSize - datas = { - pageVO: { - endIndex: offset + pageSize, - totalRows: datas.length, - curPage, - startIndex: offset + 1, - pageSize, - totalPages: Math.ceil(datas.length / pageSize) - }, - result: datas.slice(offset, offset + pageSize), - } - } - return datas - } - }, - { - url: /services\/getGridTreeMockData/, - proxy: 'mock/gateway/json/services/gridTree.json', - handleData: function handleData(datas, _ref13) { - let url = _ref13.url, - _ref13$param = _ref13.param, - param = _ref13$param === undefined ? {} : _ref13$param, - data = _ref13.data - - if (data && typeof data === 'string') { - let key = JSON.parse(data).cascade || JSON.parse(data).id - if (key) { - let keys = key.split(',') - datas = datas.filter((item) => keys.indexOf(item.id) > -1) - } - } - - if (typeof param.showPager === 'undefined' || param.showPager) { - let parts = url.split('/'), - curPage = parseInt(parts[4]), - pageSize = parseInt(parts[3]), - offset = (curPage - 1) * pageSize - - datas = { - result: datas.slice(offset, offset + pageSize), - pageVO: { - startIndex: offset + 1, - endIndex: offset + pageSize, - totalRows: datas.length, - curPage, - pageSize, - totalPages: Math.ceil(datas.length / pageSize) - } - } - } - - return datas - } - }, - { - url: /servlet\/proxy\/params\/pbi/, - proxy: 'mock/gateway/json/services/pbi.json', - handleData: function handleData(datas, _ref14) { - let data = _ref14.data - - let startIndex = data.lastIndexOf(''), - endIndex = data.lastIndexOf(''), - parentId = data.substring(startIndex + 8, endIndex), - key = 'p3' - if (parentId === '21796006') { - key = 'p2' - } else if (parentId === '21799321') { - key = 'p4' - } else if (parentId === '11499') { - key = 'p1' - } - return datas[key] - } - }, - { - url: /services\/dataVerification/, - response: function response(config) { - let account = JSON.parse(config.data).account - let data = ['test1', 'test2', 'test3', 'test4', 'test5'] - - if (data.indexOf(account) > -1) { - return [200, { exist: true }] - } else { - return [200, { exist: false }] - } - } - }, - { - url: /services\/jalor\/personalized\/setting\/createSingle/, - response: function response(config) { - let data = JSON.parse(config.data) - let resData = {} - - resData.settingId = (data.settingId && data.settingId) || 0 - resData.settingKey = (data.settingKey && data.settingKey) || null - resData.settingContent = - (data.settingContent && data.settingContent) || null - resData.numberOfSettings = 0 - resData.userId = 0 - resData.rowIdx = -1 - resData.lastUpdateDate = null - resData.appName = 'vui' - - return [200, resData] - } - }, - { - url: /edoc\/upload/, - response: function response() { - let resData = {} - - resData.hwDocumentCode = 'A1-35-36-79-50-7B-71-0F-9C-62' - resData.message = 'Operation Success' - resData.url = '//edoc-beta.huawei.com/edoc/EdocAction.do' - resData.status = 'success' - - return [200, resData] - } - }, - { - url: /servlet\/edm\/uploadDocumentServlet/, - response: function response() { - let resData = {} - - resData.hwDocumentCode = 'A1-35-36-79-50-7B-71-0F-9C-62' - resData.message = 'Operation Success' - resData.edocUploadFileAction = '//edoc-beta.huawei.com/edoc/EdocAction.do' - resData.status = 'success' - - return [200, resData] - } - }, - { - url: /services\/getPopEditorData\/page\/\d+\/\d+/, - proxy: 'mock/gateway/json/services/grid.json', - handleData: function handleData(data, config) { - let param = config.data - let name = void 0 - let contact = void 0 - let res = [] - - if (param && JSON.parse(param)) { - param = JSON.parse(param) - name = param.name - contact = param.contact - - data.forEach((item) => { - if ( - (!name || - item.name.toUpperCase().indexOf(name.toUpperCase()) > -1) && - (!contact || item.contact.indexOf(contact) > -1) - ) { - res.push(item) - } - }) - data = res - } - - if (typeof config.showPager === 'undefined' || config.showPager) { - let parts = config.url.split('/') - let curPage = parseInt(parts[4]) - let pageSize = parseInt(parts[3]) - let offset = (curPage - 1) * pageSize - - data = { - result: data.slice(offset, offset + pageSize), - pageVO: { - startIndex: offset + 1, - endIndex: offset + pageSize, - totalRows: data.length, - curPage, - pageSize, - totalPages: Math.ceil(data.length / pageSize) - } - } - } - return data - } - }, - { - url: /services\/getPopEditorData/, - proxy: 'mock/gateway/json/services/grid.json', - handleData: function handleData(datas, _ref15) { - let data = _ref15.data, - _ref15$params = _ref15.params - _ref15$params = _ref15$params === undefined ? {} : _ref15$params - let name = _ref15$params.name, - contact = _ref15$params.contact - - if (data) { - datas = datas.filter((item) => data.indexOf(item.id) !== -1) - } - - if (name || contact) { - datas = datas.filter((item) => ( - (!name || - item.name.toUpperCase().indexOf(name.toUpperCase()) > -1) && - (!contact || item.contact.indexOf(contact) > -1) - )) - } - - return datas - } - }, - { - url: /services\/getBadgeData/, - proxy: 'mock/gateway/json/services/badge.json' - }, - { - url: /services\/getSlideBarData/, - proxy: 'mock/gateway/json/services/saasI18nGetInfoWithPage.json' - }, - { - url: /services\/mapChina/, - proxy: 'mock/gateway/json/services/mapChina.json' - } -] diff --git a/example/public/mock/gateway/json/services/area.jcr.json b/example/public/mock/gateway/json/services/area.jcr.json deleted file mode 100644 index 3129871a6..000000000 --- a/example/public/mock/gateway/json/services/area.jcr.json +++ /dev/null @@ -1,56 +0,0 @@ -{ - "area": [ - { - "org_id": "3623", - "id_and_type": "3623JCR", - "parent_and_type": null, - "name_cn": "A公司 Marketing与销售服务部", - "date_from": "2005/06/21 00:00:00", - "name_en": "Consumer BG Marketing and Sales Service Dept", - "parent_type": null, - "dept_code": "024206", - "date_to": null, - "parent": null, - "area_label": "JCR" - }, - { - "org_id": "650561", - "id_and_type": "650561JCR", - "parent_and_type": null, - "name_cn": "A公司 Marketing与销售服务部(东莞)", - "date_from": "2012/09/27 00:00:00", - "name_en": "Consumer BG Marketing and Sales Service Dept (Dongguan)", - "parent_type": null, - "dept_code": "036068", - "date_to": null, - "parent": null, - "area_label": "JCR" - }, - { - "org_id": "654434", - "id_and_type": "654434JCR", - "parent_and_type": null, - "name_cn": "区域管理部", - "date_from": "2014/06/18 00:00:00", - "name_en": "Regions Mgmt Dept", - "parent_type": null, - "dept_code": "038368", - "date_to": null, - "parent": null, - "area_label": "JCR" - }, - { - "org_id": "653159", - "id_and_type": "037852JCR", - "parent_and_type": null, - "name_cn": "A公司业务部", - "date_from": "2014/01/20 00:00:00", - "name_en": "Consumer BG Business Unit", - "parent_type": null, - "dept_code": "037852", - "date_to": null, - "parent": null, - "area_label": "JCR" - } - ] -} \ No newline at end of file diff --git a/example/public/mock/gateway/json/services/area.json b/example/public/mock/gateway/json/services/area.json deleted file mode 100644 index a69eb4164..000000000 --- a/example/public/mock/gateway/json/services/area.json +++ /dev/null @@ -1,343 +0,0 @@ -{ - "JCR": { - "area": [ - { - "org_id": "3623", - "id_and_type": "3623JCR", - "parent_and_type": null, - "name_cn": "A公司 Marketing与销售服务部", - "date_from": "2005/06/21 00:00:00", - "name_en": "Consumer BG Marketing and Sales Service Dept", - "parent_type": null, - "dept_code": "024206", - "date_to": null, - "parent": null, - "area_label": "JCR" - }, - { - "org_id": "650561", - "id_and_type": "650561JCR", - "parent_and_type": null, - "name_cn": "A公司 Marketing与销售服务部(东莞)", - "date_from": "2012/09/27 00:00:00", - "name_en": "Consumer BG Marketing and Sales Service Dept (Dongguan)", - "parent_type": null, - "dept_code": "036068", - "date_to": null, - "parent": null, - "area_label": "JCR" - }, - { - "org_id": "654434", - "id_and_type": "654434JCR", - "parent_and_type": null, - "name_cn": "区域管理部", - "date_from": "2014/06/18 00:00:00", - "name_en": "Regions Mgmt Dept", - "parent_type": null, - "dept_code": "038368", - "date_to": null, - "parent": null, - "area_label": "JCR" - }, - { - "org_id": "653159", - "id_and_type": "037852JCR", - "parent_and_type": null, - "name_cn": "A公司业务部", - "date_from": "2014/01/20 00:00:00", - "name_en": "Consumer BG Business Unit", - "parent_type": null, - "dept_code": "037852", - "date_to": null, - "parent": null, - "area_label": "JCR" - } - ] - }, - "Region": { - "area": [ - { - "org_id": "608076", - "id_and_type": "608076Region", - "parent_and_type": "650561JCR", - "name_cn": "火星终端子公司", - "date_from": "2007/08/06 00:00:00", - "name_en": "SZ Device USA", - "parent_type": "JCR", - "dept_code": "024387", - "date_to": null, - "parent": "650561", - "area_label": "Region" - }, - { - "org_id": "606661", - "id_and_type": "606661Region", - "parent_and_type": "654434JCR", - "name_cn": "中东测试数据", - "date_from": "2007/04/06 00:00:00", - "name_en": "Middle East Region", - "parent_type": "JCR", - "dept_code": "026699", - "date_to": null, - "parent": "654434", - "area_label": "Region" - }, - { - "org_id": "611900", - "id_and_type": "611900Region", - "parent_and_type": "654434JCR", - "name_cn": "加拿大代表处", - "date_from": "2008/04/09 00:00:00", - "name_en": "Canada Rep Office", - "parent_type": "JCR", - "dept_code": "027339", - "date_to": null, - "parent": "654434", - "area_label": "Region" - }, - { - "org_id": "1079", - "id_and_type": "1079Region", - "parent_and_type": "654434JCR", - "name_cn": "中国测试数据", - "date_from": "1980/01/01 00:00:00", - "name_en": "China Region", - "parent_type": "JCR", - "dept_code": "027425", - "date_to": null, - "parent": "654434", - "area_label": "Region" - }, - { - "org_id": "4199", - "id_and_type": "4199Region", - "parent_and_type": "3623JCR", - "name_cn": "测试数据", - "date_from": "2005/06/29 00:00:00", - "name_en": "test data China Region", - "parent_type": "JCR", - "dept_code": "024207", - "date_to": null, - "parent": "3623", - "area_label": "Region" - }, - { - "org_id": "653596", - "id_and_type": "653596Region", - "parent_and_type": "037852JCR", - "name_cn": "国内销售与服务部", - "date_from": "2014/03/18 00:00:00", - "name_en": "Domestic Sales & Service Dept", - "parent_type": "JCR", - "dept_code": "037985", - "date_to": null, - "parent": "037852", - "area_label": "Region" - }, - { - "org_id": "606804", - "id_and_type": "606804Region", - "parent_and_type": "654434JCR", - "name_cn": "西欧测试数据", - "date_from": "2007/04/19 00:00:00", - "name_en": "West European Region", - "parent_type": "JCR", - "dept_code": "024931", - "date_to": null, - "parent": "654434", - "area_label": "Region" - } - ] - }, - "Rep. Office": { - "area": [ - { - "org_id": "1112", - "id_and_type": "1112Rep.Office", - "parent_and_type": "1079Region", - "name_cn": "北京代表处", - "date_from": "1980/ 01 / 01 00:00:00", - "name_en": "Beijing Rep Office, CN", - "parent_type": "Region", - "dept_code": "027848", - "date_to": null, - "parent": "1079", - "area_label": "Rep.Office" - }, - { - "org_id": "1114", - "id_and_type": "1114Rep.Office", - "parent_and_type": "1079Region", - "name_cn": "天津代表处", - "date_from": "1980/ 01 / 01 00:00:00", - "name_en": "Tianjin Rep Office, CN", - "parent_type": "Region", - "dept_code": "027862", - "date_to": null, - "parent": "1079", - "area_label": "Rep.Office" - }, - { - "org_id": "1115", - "id_and_type": "1115Rep.Office", - "parent_and_type": "1079Region", - "name_cn": "太原代表处", - "date_from": "1980/ 01 / 01 00:00:00", - "name_en": "Taiyuan Rep Office, CN", - "parent_type": "Region", - "dept_code": "027876", - "date_to": null, - "parent": "1079", - "area_label": "Rep.Office" - }, - { - "org_id": "649991", - "id_and_type": "649991Rep.Office", - "parent_and_type": "4199Region", - "name_cn": "测试数据广东代表处", - "date_from": "2012/ 07 / 28 00:00:00", - "name_en": "test data China Region Guangdong Rep Office", - "parent_type": "Region", - "dept_code": "035628", - "date_to": null, - "parent": "4199", - "area_label": "Rep.Office" - }, - { - "org_id": "100000", - "id_and_type": "100000Rep.Office", - "parent_and_type": "606804Region", - "name_cn": "加勒比海代表处", - "date_from": "2013/ 09 / 29 00:00:00", - "name_en": "Caribbean Rep Office", - "parent_type": "Region", - "dept_code": "037549", - "date_to": null, - "parent": "606804", - "area_label": "Rep.Office" - }, - { - "org_id": "1125", - "id_and_type": "1125Rep.Office", - "parent_and_type": "1079Region", - "name_cn": "兰州代表处", - "date_from": "1980/ 01 / 01 00:00:00", - "name_en": "Lanzhou Rep Office, CN", - "parent_type": "Region", - "dept_code": "028017", - "date_to": null, - "parent": "1079", - "area_label": "Rep.Office" - } - ] - }, - "Office": { - "area": [ - { - "org_id": "610453", - "id_and_type": "610453Office", - "parent_and_type": "100000Rep. Office", - "name_cn": "牙买加工作室", - "date_from": "2007/11/26 00:00:00", - "name_en": "Jamaica Office", - "parent_type": "Rep. Office", - "dept_code": "025641", - "date_to": null, - "parent": "100000", - "area_label": "Office" - }, - { - "org_id": "615077", - "id_and_type": "615077Office", - "parent_and_type": "100000Rep. Office", - "name_cn": "巴拿马工作室", - "date_from": "2008/07/08 00:00:00", - "name_en": "Panama Office", - "parent_type": "Rep. Office", - "dept_code": "025656", - "date_to": null, - "parent": "100000", - "area_label": "Office" - }, - { - "org_id": "620058", - "id_and_type": "620058Office", - "parent_and_type": "100000Rep. Office", - "name_cn": "多米尼加工作室", - "date_from": "2009/05/21 00:00:00", - "name_en": "Dominica Office", - "parent_type": "Rep. Office", - "dept_code": "025659", - "date_to": null, - "parent": "100000", - "area_label": "Office" - }, - { - "org_id": "649896", - "id_and_type": "649896Office", - "parent_and_type": "1125Rep. Office", - "name_cn": "西宁工作室", - "date_from": "2012/07/12 00:00:00", - "name_en": "Xining Office, CN", - "parent_type": "Rep. Office", - "dept_code": "035560", - "date_to": null, - "parent": "1125", - "area_label": "Office" - }, - { - "org_id": "661414", - "id_and_type": "661414Office", - "parent_and_type": "649991Rep. Office", - "name_cn": "测试数据广州工作室", - "date_from": "2016/03/28 00:00:00", - "name_en": "test data China Region Guangzhou Office", - "parent_type": "Rep. Office", - "dept_code": "041626", - "date_to": null, - "parent": "649991", - "area_label": "Office" - }, - { - "org_id": "661415", - "id_and_type": "661415Office", - "parent_and_type": "649991Rep. Office", - "name_cn": "测试数据深圳工作室", - "date_from": "2016/03/28 00:00:00", - "name_en": "test data China Region Shenzhen Office", - "parent_type": "Rep. Office", - "dept_code": "041627", - "date_to": null, - "parent": "649991", - "area_label": "Office" - }, - { - "org_id": "661416", - "id_and_type": "661416Office", - "parent_and_type": "649991Rep. Office", - "name_cn": "测试数据东莞工作室", - "date_from": "2016/03/28 00:00:00", - "name_en": "test data China Region Dongguan Office", - "parent_type": "Rep. Office", - "dept_code": "041628", - "date_to": null, - "parent": "649991", - "area_label": "Office" - }, - { - "org_id": "661417", - "id_and_type": "661417Office", - "parent_and_type": "649991Rep. Office", - "name_cn": "测试数据佛山工作室", - "date_from": "2016/03/28 00:00:00", - "name_en": "test data China Region Foshan Office", - "parent_type": "Rep. Office", - "dept_code": "041629", - "date_to": null, - "parent": "649991", - "area_label": "Office" - } - ] - } -} \ No newline at end of file diff --git a/example/public/mock/gateway/json/services/area.office.json b/example/public/mock/gateway/json/services/area.office.json deleted file mode 100644 index 4fd32a061..000000000 --- a/example/public/mock/gateway/json/services/area.office.json +++ /dev/null @@ -1,108 +0,0 @@ -{ - "area": [ - { - "org_id": "610453", - "id_and_type": "610453Office", - "parent_and_type": "652495Rep. Office", - "name_cn": "牙买加办事处", - "date_from": "2007/11/26 00:00:00", - "name_en": "Jamaica Office", - "parent_type": "Rep. Office", - "dept_code": "025641", - "date_to": null, - "parent": "652495", - "area_label": "Office" - }, - { - "org_id": "615077", - "id_and_type": "615077Office", - "parent_and_type": "652495Rep. Office", - "name_cn": "巴拿马办事处", - "date_from": "2008/07/08 00:00:00", - "name_en": "Panama Office", - "parent_type": "Rep. Office", - "dept_code": "025656", - "date_to": null, - "parent": "652495", - "area_label": "Office" - }, - { - "org_id": "620058", - "id_and_type": "620058Office", - "parent_and_type": "652495Rep. Office", - "name_cn": "多米尼加办事处", - "date_from": "2009/05/21 00:00:00", - "name_en": "Dominica Office", - "parent_type": "Rep. Office", - "dept_code": "025659", - "date_to": null, - "parent": "652495", - "area_label": "Office" - }, - { - "org_id": "649896", - "id_and_type": "649896Office", - "parent_and_type": "1125Rep. Office", - "name_cn": "西宁办事处", - "date_from": "2012/07/12 00:00:00", - "name_en": "Xining Office, CN", - "parent_type": "Rep. Office", - "dept_code": "035560", - "date_to": null, - "parent": "1125", - "area_label": "Office" - }, - { - "org_id": "661414", - "id_and_type": "661414Office", - "parent_and_type": "649991Rep. Office", - "name_cn": "A公司XX地区部广州办事处", - "date_from": "2016/03/28 00:00:00", - "name_en": "Consumer BG Greater China Region Guangzhou Office", - "parent_type": "Rep. Office", - "dept_code": "041626", - "date_to": null, - "parent": "649991", - "area_label": "Office" - }, - { - "org_id": "661415", - "id_and_type": "661415Office", - "parent_and_type": "649991Rep. Office", - "name_cn": "A公司XX地区部深圳办事处", - "date_from": "2016/03/28 00:00:00", - "name_en": "Consumer BG Greater China Region Shenzhen Office", - "parent_type": "Rep. Office", - "dept_code": "041627", - "date_to": null, - "parent": "649991", - "area_label": "Office" - }, - { - "org_id": "661416", - "id_and_type": "661416Office", - "parent_and_type": "649991Rep. Office", - "name_cn": "A公司XX地区部东莞办事处", - "date_from": "2016/03/28 00:00:00", - "name_en": "Consumer BG Greater China Region Dongguan Office", - "parent_type": "Rep. Office", - "dept_code": "041628", - "date_to": null, - "parent": "649991", - "area_label": "Office" - }, - { - "org_id": "661417", - "id_and_type": "661417Office", - "parent_and_type": "649991Rep. Office", - "name_cn": "A公司XX地区部佛山办事处", - "date_from": "2016/03/28 00:00:00", - "name_en": "Consumer BG Greater China Region Foshan Office", - "parent_type": "Rep. Office", - "dept_code": "041629", - "date_to": null, - "parent": "649991", - "area_label": "Office" - } - ] -} \ No newline at end of file diff --git a/example/public/mock/gateway/json/services/area.region.json b/example/public/mock/gateway/json/services/area.region.json deleted file mode 100644 index 9fd33a355..000000000 --- a/example/public/mock/gateway/json/services/area.region.json +++ /dev/null @@ -1,95 +0,0 @@ -{ - "area": [ - { - "org_id": "608076", - "id_and_type": "608076Region", - "parent_and_type": "650561JCR", - "name_cn": "火星终端子公司", - "date_from": "2007/08/06 00:00:00", - "name_en": "SZ Device USA", - "parent_type": "JCR", - "dept_code": "024387", - "date_to": null, - "parent": "650561", - "area_label": "Region" - }, - { - "org_id": "606661", - "id_and_type": "606661Region", - "parent_and_type": "654434JCR", - "name_cn": "中东地区部", - "date_from": "2007/04/06 00:00:00", - "name_en": "Middle East Region", - "parent_type": "JCR", - "dept_code": "026699", - "date_to": null, - "parent": "654434", - "area_label": "Region" - }, - { - "org_id": "611900", - "id_and_type": "611900Region", - "parent_and_type": "654434JCR", - "name_cn": "加拿大代表处", - "date_from": "2008/04/09 00:00:00", - "name_en": "Canada Rep Office", - "parent_type": "JCR", - "dept_code": "027339", - "date_to": null, - "parent": "654434", - "area_label": "Region" - }, - { - "org_id": "1079", - "id_and_type": "1079Region", - "parent_and_type": "654434JCR", - "name_cn": "中国地区部", - "date_from": "1980/01/01 00:00:00", - "name_en": "China Region", - "parent_type": "JCR", - "dept_code": "027425", - "date_to": null, - "parent": "654434", - "area_label": "Region" - }, - { - "org_id": "4199", - "id_and_type": "4199Region", - "parent_and_type": "3623JCR", - "name_cn": "A公司XX地区部", - "date_from": "2005/06/29 00:00:00", - "name_en": "Consumer BG Greater China Region", - "parent_type": "JCR", - "dept_code": "024207", - "date_to": null, - "parent": "3623", - "area_label": "Region" - }, - { - "org_id": "653596", - "id_and_type": "653596Region", - "parent_and_type": "037852JCR", - "name_cn": "国内销售与服务部", - "date_from": "2014/03/18 00:00:00", - "name_en": "Domestic Sales & Service Dept", - "parent_type": "JCR", - "dept_code": "037985", - "date_to": null, - "parent": "037852", - "area_label": "Region" - }, - { - "org_id": "606804", - "id_and_type": "606804Region", - "parent_and_type": "654434JCR", - "name_cn": "西欧地区部", - "date_from": "2007/04/19 00:00:00", - "name_en": "West European Region", - "parent_type": "JCR", - "dept_code": "024931", - "date_to": null, - "parent": "654434", - "area_label": "Region" - } - ] -} \ No newline at end of file diff --git a/example/public/mock/gateway/json/services/area.repoffice.json b/example/public/mock/gateway/json/services/area.repoffice.json deleted file mode 100644 index 0bea50bdf..000000000 --- a/example/public/mock/gateway/json/services/area.repoffice.json +++ /dev/null @@ -1,82 +0,0 @@ -{ - "area": [ - { - "org_id": "1112", - "id_and_type": "1112Rep.Office", - "parent_and_type": "1079Region", - "name_cn": "北京代表处", - "date_from": "1980/ 01 / 01 00:00:00", - "name_en": "Beijing Rep Office, CN", - "parent_type": "Region", - "dept_code": "027848", - "date_to": null, - "parent": "1079", - "area_label": "Rep.Office" - }, - { - "org_id": "1114", - "id_and_type": "1114Rep.Office", - "parent_and_type": "1079Region", - "name_cn": "天津代表处", - "date_from": "1980/ 01 / 01 00:00:00", - "name_en": "Tianjin Rep Office, CN", - "parent_type": "Region", - "dept_code": "027862", - "date_to": null, - "parent": "1079", - "area_label": "Rep.Office" - }, - { - "org_id": "1115", - "id_and_type": "1115Rep.Office", - "parent_and_type": "1079Region", - "name_cn": "太原代表处", - "date_from": "1980/ 01 / 01 00:00:00", - "name_en": "Taiyuan Rep Office, CN", - "parent_type": "Region", - "dept_code": "027876", - "date_to": null, - "parent": "1079", - "area_label": "Rep.Office" - }, - { - "org_id": "649991", - "id_and_type": "649991Rep.Office", - "parent_and_type": "4199Region", - "name_cn": "A公司XX地区部广东代表处", - "date_from": "2012/ 07 / 28 00:00:00", - "name_en": "Consumer BG Greater China Region Guangdong Rep Office", - "parent_type": "Region", - "dept_code": "035628", - "date_to": null, - "parent": "4199", - "area_label": "Rep.Office" - }, - { - "org_id": "652495", - "id_and_type": "652495Rep.Office", - "parent_and_type": "606804Region", - "name_cn": "加勒比海代表处", - "date_from": "2013/ 09 / 29 00:00:00", - "name_en": "Caribbean Rep Office", - "parent_type": "Region", - "dept_code": "037549", - "date_to": null, - "parent": "606804", - "area_label": "Rep.Office" - }, - { - "org_id": "1125", - "id_and_type": "1125Rep.Office", - "parent_and_type": "1079Region", - "name_cn": "兰州代表处", - "date_from": "1980/ 01 / 01 00:00:00", - "name_en": "Lanzhou Rep Office, CN", - "parent_type": "Region", - "dept_code": "028017", - "date_to": null, - "parent": "1079", - "area_label": "Rep.Office" - } - ] -} \ No newline at end of file diff --git a/example/public/mock/gateway/json/services/badge.json b/example/public/mock/gateway/json/services/badge.json deleted file mode 100644 index 47cb731f1..000000000 --- a/example/public/mock/gateway/json/services/badge.json +++ /dev/null @@ -1,103 +0,0 @@ -[ - { - "parent_instance_name": null, - "value": 5, - "assigneeColumn": null, - "remark": null, - "task_create_by": "uuid~dGVzdDE=", - "task_id": "E92_test1_467679ee0f424db98e2c2d673c6009df", - "appid": "app_000000040141", - "instance_end_time": "", - "ext": {}, - "node_id": "managerId", - "task_admin": [], - "instance_status": "1", - "instance_extend": {}, - "_id": "56552e1fa0957029ffcce971", - "hw_hae_paging": { - "startIndex": 1, - "totalRows": 2, - "curPage": 1, - "pageSize": 15, - "endIndex": 15, - "totalPages": 1 - }, - "process_key": "processMobile", - "instance_starter": "uuid~dGVzdDE=", - "instance_create_time": "2015-11-25 11:42:23", - "instance_id": "E92_test1_d6b728c58fbf428b95dba1457d254bc2", - "task_due_time": "", - "task_candidate": [], - "last_update_time": "2015-11-25 11:42:23", - "attach_id": "A76bd0ebf664b42ab8ae76e4968ba95d6", - "task_reader": [ - "uuid~dGVzdDE=" - ], - "process_name": "手机话费报销申请", - "approver": [], - "task_name": "主管审批", - "modification_num": "1", - "task_status": "1", - "process_version": "9", - "task_assignee": [ - "uuid~dGVzdDE=" - ], - "reader": [ - "uuid~dGVzdDE=" - ], - "business_key": "50f7f96d-9808-431f-99bc-e4593002318f", - "task_end_time": "", - "last_update_by": "uuid~dGVzdDE=", - "parent_instance_id": null, - "node_name": "主管审批", - "task_url": "toApprove", - "engine_name": "E92", - "task_create_time": "2015-11-25 11:42:23.000168" - }, - { - "parent_instance_name": null, - "assigneeColumn": null, - "remark": null, - "task_create_by": "uuid~dGVzdDE=", - "task_id": "E4_test2_1616635ea8e8452481545f585dbd5979", - "appid": "app_000000040141", - "instance_end_time": "", - "ext": {}, - "node_id": "managerId", - "task_admin": [], - "instance_status": "1", - "instance_extend": {}, - "_id": "56551c55a0957029ffcce94d", - "process_key": "processMobile", - "instance_starter": "uuid~dGVzdDE=", - "instance_create_time": "2015-11-25 10:26:28", - "instance_id": "E4_test2_d5ad0716628e48cbad3bb9828d998109", - "task_due_time": "", - "task_candidate": [], - "last_update_time": "2015-11-25 10:26:28", - "attach_id": "A76bd0ebf664b42ab8ae76e4968ba95d6", - "task_reader": [ - "uuid~dGVzdDE=" - ], - "process_name": "手机话费报销申请", - "approver": [], - "task_name": "主管审批", - "modification_num": "1", - "task_status": "1", - "process_version": "9", - "task_assignee": [ - "uuid~dGVzdDE=" - ], - "reader": [ - "uuid~dGVzdDE=" - ], - "business_key": "1a5bf156-6a09-4526-b015-340e6cea7488", - "task_end_time": "", - "last_update_by": "uuid~dGVzdDE=", - "parent_instance_id": null, - "node_name": "主管审批", - "task_url": "toApprove", - "engine_name": "E4", - "task_create_time": "2015-11-25 10:26:28.000966" - } -] diff --git a/example/public/mock/gateway/json/services/byaccounts.json b/example/public/mock/gateway/json/services/byaccounts.json deleted file mode 100644 index a11c64e91..000000000 --- a/example/public/mock/gateway/json/services/byaccounts.json +++ /dev/null @@ -1,86 +0,0 @@ -[ - { - "programValidity": null, - "employeeNumber": "12345678", - "userType": "HWE", - "currentRole": null, - "currentProgramIds": null, - "validRoles": null, - "defaultRole": "otc:2749;", - "coalitionPermission": false, - "endDate": "2017-11-13T14:26:06.000+0800", - "dept": null, - "userId": 421000103624183, - "userAccount": "test1", - "userCN": "test1", - "email": "test1@test1.com", - "creationDate": "2012-08-17T11:26:18.000+0800", - "lastUpdateDate": "2015-03-30T14:27:34.000+0800", - "rowIdx": -1, - "creationUserCN": null, - "lastUpdateUserCN": null - }, - { - "programValidity": null, - "employeeNumber": "12345678", - "userType": "WX", - "currentRole": null, - "currentProgramIds": null, - "validRoles": null, - "defaultRole": null, - "coalitionPermission": false, - "endDate": null, - "dept": null, - "userId": 435259704104388, - "userAccount": "test2", - "userCN": "test2", - "email": "test2@test2.com", - "creationDate": "2017-10-23T11:16:59.000+0800", - "lastUpdateDate": "2017-10-23T11:16:59.000+0800", - "rowIdx": -1, - "creationUserCN": null, - "lastUpdateUserCN": null - }, - { - "programValidity": null, - "employeeNumber": "12345678", - "userType": "HWE", - "currentRole": null, - "currentProgramIds": null, - "validRoles": null, - "defaultRole": null, - "coalitionPermission": false, - "endDate": "2017-10-26T11:48:56.000+0800", - "dept": null, - "userId": 441047913162396, - "userAccount": "test3", - "userCN": "test3", - "email": "test3@test3.com", - "creationDate": "2015-01-06T09:38:41.000+0800", - "lastUpdateDate": "2017-10-10T15:13:28.000+0800", - "rowIdx": -1, - "creationUserCN": null, - "lastUpdateUserCN": null - }, - { - "programValidity": null, - "employeeNumber": "12345678", - "userType": "WX", - "currentRole": null, - "currentProgramIds": null, - "validRoles": null, - "defaultRole": null, - "coalitionPermission": false, - "endDate": "2017-11-10T08:50:56.000+0800", - "dept": null, - "userId": 655783272594485, - "userAccount": "test4", - "userCN": "test4", - "email": "test4@test4.com", - "creationDate": "2017-10-10T18:22:33.000+0800", - "lastUpdateDate": "2017-10-10T18:22:33.000+0800", - "rowIdx": -1, - "creationUserCN": null, - "lastUpdateUserCN": null - } -] \ No newline at end of file diff --git a/example/public/mock/gateway/json/services/byids.json b/example/public/mock/gateway/json/services/byids.json deleted file mode 100644 index 93d6a66ca..000000000 --- a/example/public/mock/gateway/json/services/byids.json +++ /dev/null @@ -1,86 +0,0 @@ -[ - { - "programValidity": null, - "employeeNumber": "test1", - "userType": "HWE", - "currentRole": null, - "currentProgramIds": null, - "validRoles": null, - "defaultRole": "otc:2749;", - "coalitionPermission": false, - "endDate": "2017-11-13T14:26:06.000+0800", - "dept": null, - "userId": 421000103624183, - "userAccount": "test1", - "userCN": "test1", - "email": "", - "creationDate": "2012-08-17T11:26:18.000+0800", - "lastUpdateDate": "2015-03-30T14:27:34.000+0800", - "rowIdx": -1, - "creationUserCN": null, - "lastUpdateUserCN": null - }, - { - "programValidity": null, - "employeeNumber": "test10", - "userType": "WX", - "currentRole": null, - "currentProgramIds": null, - "validRoles": null, - "defaultRole": null, - "coalitionPermission": false, - "endDate": null, - "dept": null, - "userId": 435259704104388, - "userAccount": "test10", - "userCN": "test10", - "email": "", - "creationDate": "2017-10-23T11:16:59.000+0800", - "lastUpdateDate": "2017-10-23T11:16:59.000+0800", - "rowIdx": -1, - "creationUserCN": null, - "lastUpdateUserCN": null - }, - { - "programValidity": null, - "employeeNumber": "test2", - "userType": "HWE", - "currentRole": null, - "currentProgramIds": null, - "validRoles": null, - "defaultRole": null, - "coalitionPermission": false, - "endDate": "2017-10-26T11:48:56.000+0800", - "dept": null, - "userId": 441047913162396, - "userAccount": "test2", - "userCN": "test2", - "email": "", - "creationDate": "2015-01-06T09:38:41.000+0800", - "lastUpdateDate": "2017-10-10T15:13:28.000+0800", - "rowIdx": -1, - "creationUserCN": null, - "lastUpdateUserCN": null - }, - { - "programValidity": null, - "employeeNumber": "test3", - "userType": "WX", - "currentRole": null, - "currentProgramIds": null, - "validRoles": null, - "defaultRole": null, - "coalitionPermission": false, - "endDate": "2017-11-10T08:50:56.000+0800", - "dept": null, - "userId": 655783272594485, - "userAccount": "test3", - "userCN": "test3", - "email": "", - "creationDate": "2017-10-10T18:22:33.000+0800", - "lastUpdateDate": "2017-10-10T18:22:33.000+0800", - "rowIdx": -1, - "creationUserCN": null, - "lastUpdateUserCN": null - } -] diff --git a/example/public/mock/gateway/json/services/currency.json b/example/public/mock/gateway/json/services/currency.json deleted file mode 100644 index 21a2e018c..000000000 --- a/example/public/mock/gateway/json/services/currency.json +++ /dev/null @@ -1,52 +0,0 @@ -{ - "currency": [ - { - "symbol": "$", - "currency_code": "MZN" - }, - { - "symbol": null, - "currency_code": "CNY" - }, - { - "symbol": "*NULL*", - "currency_code": "CHE" - }, - { - "symbol": "$", - "currency_code": "USD" - }, - { - "symbol": null, - "currency_code": "VND" - }, - { - "symbol": null, - "currency_code": "VUV" - }, - { - "symbol": null, - "currency_code": "WST" - }, - { - "symbol": null, - "currency_code": "XAF" - }, - { - "symbol": null, - "currency_code": "IRU" - }, - { - "symbol": null, - "currency_code": "IRE" - }, - { - "symbol": null, - "currency_code": "BYN" - }, - { - "symbol": null, - "currency_code": "HKD" - } - ] -} diff --git a/example/public/mock/gateway/json/services/deptInfo.json b/example/public/mock/gateway/json/services/deptInfo.json deleted file mode 100644 index 8b2daadc1..000000000 --- a/example/public/mock/gateway/json/services/deptInfo.json +++ /dev/null @@ -1,80 +0,0 @@ -[ - { - "l5_Organization_Id": null, - "errorInfo": null, - "l5_Dept_Code": null, - "l0_Name": "SZ技术", - "l3_Dept_Code": "041963", - "l2_Name": "测试数据XX人力资源部", - "date_From": "2016/04/2900: 00: 00", - "l6_Organization_Id": null, - "name": "BPIT&QM HRBP管理部", - "l1_Organization_Id": "1385", - "upper_Organization_Id": "1389", - "l0_Organization_Id": "1072", - "upper_Name": "测试数据XX人力资源部", - "business_Group_Id": "443", - "l3_Organization_Id": "662093", - "l6_Name": null, - "coa_Combination": "0021.000.0001.041963", - "l4_Name": null, - "l4_Organization_Id": null, - "dept_Code": "041963", - "dept_Level": "3", - "organization_Id": "662093", - "l0_Dept_Code": "022471", - "l2_Dept_Code": "023114", - "upper_Dept_Code": "023114", - "l1_Name": "测试数据XX管理部", - "l4_Dept_Code": null, - "last_Update_Date": "2017/05/2015: 14: 18", - "l2_Organization_Id": "1389", - "l5_Name": null, - "l1_Dept_Code": "023093", - "date_To": null, - "language": "CHN", - "region_Code": "0001", - "l6_Dept_Code": null, - "cost_Allocation_Keyflex_Id": "1563274", - "l3_Name": "BPIT&QM HRBP管理部" - }, - { - "l5_Organization_Id": null, - "errorInfo": null, - "l5_Dept_Code": null, - "l0_Name": "SZ技术", - "l3_Dept_Code": "023286", - "l2_Name": "中央XX测试数据部", - "date_From": "2011/03/30 00:00:00", - "l6_Organization_Id": null, - "name": "XX应用实施部", - "l1_Organization_Id": "1404", - "upper_Organization_Id": "627453", - "l0_Organization_Id": "1072", - "upper_Name": "XX应用交付部", - "business_Group_Id": "443", - "l3_Organization_Id": "627453", - "l6_Name": null, - "coa_Combination": "0021.000.0001.022471", - "l4_Name": "XX应用实施部", - "l4_Organization_Id": "627409", - "dept_Code": "022471", - "dept_Level": "4", - "organization_Id": "627409", - "l0_Dept_Code": "022471", - "l2_Dept_Code": "023489", - "upper_Dept_Code": "023286", - "l1_Name": "测试数据室XX", - "l4_Dept_Code": "022471", - "last_Update_Date": "2017/11/14 12:32:32", - "l2_Organization_Id": "3864", - "l5_Name": null, - "l1_Dept_Code": "023338", - "date_To": null, - "language": "CHN", - "region_Code": "0001", - "l6_Dept_Code": null, - "cost_Allocation_Keyflex_Id": "1082225", - "l3_Name": "XX应用交付部" - } -] diff --git a/example/public/mock/gateway/json/services/deptList.json b/example/public/mock/gateway/json/services/deptList.json deleted file mode 100644 index be830b321..000000000 --- a/example/public/mock/gateway/json/services/deptList.json +++ /dev/null @@ -1,168 +0,0 @@ -[ - { - "upperCode": "000001", - "list": [ - { - "coa_Combination": null, - "hrCode": "022471", - "dept_Code": null, - "hrName": "SZ技术", - "coaCode": null - }, - { - "coa_Combination": null, - "hrCode": "030055", - "dept_Code": null, - "hrName": "SZ海洋网络", - "coaCode": null - }, - { - "coa_Combination": null, - "hrCode": "035021", - "dept_Code": null, - "hrName": "天闻数媒", - "coaCode": null - }, - { - "coa_Combination": null, - "hrCode": "022279", - "dept_Code": null, - "hrName": "贝托SZ", - "coaCode": null - }, - { - "coa_Combination": null, - "hrCode": "030736", - "dept_Code": null, - "hrName": "鼎桥通信", - "coaCode": null - } - ] - }, - { - "upperCode": "023114", - "list": [ - { - "coa_Combination": null, - "hrCode": "041963", - "dept_Code": null, - "hrName": "BPIT&QM HRBP管理部", - "coaCode": "0021.000.0001.041963" - } - ] - }, - { - "upperCode": "038384", - "list": [ - { - "coa_Combination": null, - "hrCode": "038759", - "dept_Code": null, - "hrName": "公共技术平台部", - "coaCode": "0021.000.0001.038759" - } - ] - }, - { - "upperCode": "022471", - "list": [ - { - "coa_Combination": null, - "hrCode": "023338", - "dept_Code": null, - "hrName": "测试数据室XX", - "coaCode": "0021.000.0001.023338" - }, - { - "coa_Combination": null, - "hrCode": "027425", - "dept_Code": null, - "hrName": "中国XX测试数据部", - "coaCode": "0021.000.0002.027425" - }, - { - "coa_Combination": null, - "hrCode": "023093", - "dept_Code": null, - "hrName": "测试数据XX管理部", - "coaCode": "0021.000.0001.023093" - } - ] - }, - { - "upperCode": "023093", - "list": [ - { - "coa_Combination": null, - "hrCode": "038370", - "dept_Code": null, - "hrName": "业务应用与XX测试数据部", - "coaCode": "0021.000.0001.038370" - }, - { - "coa_Combination": null, - "hrCode": "038371", - "dept_Code": null, - "hrName": "企业架构与流程管理部", - "coaCode": "0021.000.0001.038371" - }, - { - "coa_Combination": null, - "hrCode": "023114", - "dept_Code": null, - "hrName": "测试数据XX人力资源部", - "coaCode": "0021.000.0001.023114" - }, - { - "coa_Combination": null, - "hrCode": "034899", - "dept_Code": null, - "hrName": "测试数据XX财经管理部", - "coaCode": "0021.000.0001.034899" - }, - { - "coa_Combination": null, - "hrCode": "023221", - "dept_Code": null, - "hrName": "测试数据XX质量与运营部", - "coaCode": "0021.000.0001.023221" - } - ] - }, - { - "upperCode": "023338", - "list": [ - { - "coa_Combination": null, - "hrCode": "023489", - "dept_Code": null, - "hrName": "中央XX测试数据部", - "coaCode": "0021.000.0001.023489" - } - ] - }, - { - "upperCode": "023489", - "list": [ - { - "coa_Combination": null, - "hrCode": "023286", - "dept_Code": null, - "hrName": "XX应用交付部", - "coaCode": "0021.000.0001.023286" - } - ] - }, - { - "upperCode": "023286", - "list": [ - { - "coa_Combination": null, - "hrCode": "022471", - "dept_Code": null, - "hrName": "XX应用实施部", - "coaCode": "0021.000.0001.022471" - } - ] - } -] diff --git a/example/public/mock/gateway/json/services/deptSearch.json b/example/public/mock/gateway/json/services/deptSearch.json deleted file mode 100644 index c5f59d62e..000000000 --- a/example/public/mock/gateway/json/services/deptSearch.json +++ /dev/null @@ -1,32 +0,0 @@ -[ - { - "coaCode": "0021.000.0001.037106", - "hrCode": "037106", - "hrName": "无线网络业务架构与设计部", - "coaStatus": "1-有效-VALID" - }, - { - "coaCode": "0021.000.0001.037271", - "hrCode": "037271", - "hrName": "服务架构与技术规划部", - "coaStatus": "1-有效-VALID" - }, - { - "coaCode": "0021.000.0001.023475", - "hrCode": "023475", - "hrName": "测试数据室XX质量与运营部", - "coaStatus": "1-有效-VALID" - }, - { - "coaCode": "0021.000.0001.023114", - "hrCode": "023114", - "hrName": "测试数据XX人力资源部", - "coaStatus": "1-有效-VALID" - }, - { - "coaCode": "0021.000.0001.023093", - "hrCode": "023093", - "hrName": "测试数据XX管理部", - "coaStatus": "1-有效-VALID" - } -] diff --git a/example/public/mock/gateway/json/services/grid.json b/example/public/mock/gateway/json/services/grid.json deleted file mode 100644 index 2c430efdc..000000000 --- a/example/public/mock/gateway/json/services/grid.json +++ /dev/null @@ -1,342 +0,0 @@ -[ - { - "id": "1", - "name": "GFD科技有限公司", - "userId": 421000103624183, - "area": "华东区", - "province": "福建省", - "city": "福州", - "contact": "许生", - "telephone": "13620211175", - "address": "福州", - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "employees": 800, - "created_date": "2014-04-30 00:56:00", - "boole": false, - "assets": "1000000", - "rate": 0.9 - }, - { - "id": "2", - "name": "WWW科技有限公司", - "userId": 421000103624183, - "area": "华南区", - "province": "广东省", - "city": "深圳", - "contact": "朱生", - "telephone": "16549849651", - "address": "深圳福田区", - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "employees": 300, - "created_date": "2016-07-08 12:36:22", - "boole": true, - "assets": "1500000", - "rate": 0.7 - }, - { - "id": "3", - "name": "RFV有限责任公司", - "userId": 441047913162396, - "area": "华南区", - "province": "广东省", - "city": "中山", - "contact": "秦生", - "telephone": "13145351232", - "address": "中山市", - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "employees": 1300, - "created_date": "2014-02-14 14:14:14", - "boole": false, - "assets": "1500000", - "rate": 0.6 - }, - { - "id": "4", - "name": "TGB科技有限公司", - "userId": 655783272594485, - "area": "华东区", - "province": "福建省", - "city": "龙岩", - "contact": "周生", - "telephone": "18920211175", - "address": "龙岩", - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "employees": 360, - "created_date": "2013-01-13 13:13:13", - "boole": true, - "assets": "1200000", - "rate": 0.5 - }, - { - "id": "5", - "name": "YHN科技有限公司", - "userId": 655783272594485, - "area": "华南区", - "province": "广东省", - "city": "韶关", - "contact": "郑生", - "telephone": "18920211175", - "address": "韶关", - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "employees": 810, - "created_date": "2012-12-12 12:12:12", - "boole": true, - "assets": "1500000", - "rate": 0.6 - }, - { - "id": "6", - "name": "WSX科技有限公司", - "userId": 441047913162396, - "area": "华中区", - "province": "湖北省", - "city": "黄冈", - "contact": "陈生", - "telephone": "13120211175", - "address": "黄冈", - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "employees": 800, - "created_date": "2011-11-11 11:11:11", - "boole": true, - "assets": "1500000", - "rate": 0.6 - }, - { - "id": "7", - "name": "KBG物业有限公司", - "userId": 421000103624183, - "area": "华中区", - "province": "湖北省", - "city": "赤壁", - "contact": "王二", - "telephone": "13066932564", - "address": "赤壁", - "introduction": "公司治理结构严格按现代企业制度设计,管理机构设置合理,制度完善,各部门分工明确、协作顺畅。拥有中、高级职称或大学本科以上学历的人员占职工总人数的80%以上,具有雄厚的资金实力和高度专业化的项目开发管理能力,是一支具有强烈的社会责任感和引领房地产业科技创新的地产新军。", - "employees": 400, - "created_date": "2016-04-30 23:56:00", - "boole": false, - "assets": "2000000", - "rate": 0.7 - }, - { - "id": "8", - "name": "深圳市福德宝网络技术有限公司", - "userId": 421000103624183, - "address": "厦门岛内", - "area": "华东区", - "assets": "2000000", - "boole": true, - "city": "厦门", - "contact": "李四", - "created_date": "2016-06-03 13:53:25", - "employees": 540, - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "province": "福建省", - "rate": 0.6, - "telephone": "15875599279" - }, - { - "id": "9", - "name": "UJM有限责任公司", - "userId": 421000103624183, - "area": "华南区", - "province": "广西省", - "city": "南宁", - "contact": "段生", - "telephone": "15920211175", - "address": "南宁", - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "employees": 750, - "created_date": "2014-04-21 11:56:00", - "boole": true, - "assets": "1500000", - "rate": 0.6 - }, - { - "id": "10", - "name": "IKA有限责任公司", - "userId": 421000103624183, - "area": "华南区", - "province": "广西省", - "city": "北海", - "contact": "谭生", - "telephone": "15820211175", - "address": "北海", - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "employees": 400, - "created_date": "2014-09-30 00:56:00", - "boole": false, - "assets": "110000", - "rate": 0.11 - }, - { - "id": "11", - "name": "TIG管理有限公司", - "userId": 421000103624183, - "area": "华南区", - "province": "广西省", - "city": "桂林", - "contact": "陈生", - "telephone": "13120211175", - "address": "桂林", - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "employees": 900, - "created_date": "2014-11-30 00:56:00", - "boole": true, - "assets": "120000", - "rate": 0.13 - }, - { - "id": "12", - "name": "GGT科技有限公司", - "userId": 441047913162396, - "area": "西南区", - "province": "云南省", - "city": "昆明", - "contact": "周生", - "telephone": "13120211175", - "address": "昆明", - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "employees": 500, - "created_date": "2014-03-20 02:50:00", - "boole": false, - "assets": "100000", - "rate": 0.1 - }, - { - "id": "13", - "name": "YYS有限公司", - "userId": 441047913162396, - "area": "西南区", - "province": "云南省", - "city": "西双版纳", - "contact": "廖生", - "telephone": "13120211175", - "address": "西双版纳", - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "employees": 985, - "created_date": "2015-07-28 11:37:00", - "boole": true, - "assets": "120000", - "rate": 0.12 - }, - { - "id": "14", - "name": "VBN有限责任公司", - "userId": 421000103624183, - "area": "西南区", - "province": "云南省", - "city": "大理", - "contact": "欧生", - "telephone": "15820211175", - "address": "大理", - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "employees": 598, - "created_date": "2014-04-30 00:56:00", - "boole": false, - "assets": "220000", - "rate": 0.22 - }, - { - "id": "15", - "name": "深圳XX科技有限公司", - "userId": 441047913162396, - "area": "华中区", - "province": "湖北省", - "city": "武汉", - "contact": "阮生", - "telephone": "18920211175", - "address": "武汉", - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "employees": 725, - "created_date": "2014-04-30 00:56:00", - "boole": true, - "assets": "2500000", - "rate": 0.8 - }, - { - "id": "16", - "name": "深圳XX信息技术有限公司", - "userId": 421000103624183, - "area": "华中区", - "province": "湖北省", - "city": "十堰", - "contact": "邓生", - "telephone": "13120211175", - "address": "十堰", - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "employees": 632, - "created_date": "2014-07-30 02:44:00", - "boole": true, - "assets": "3000000", - "rate": 0.85 - }, - { - "id": "17", - "name": "深圳XX餐饮管理有限公司", - "userId": 441047913162396, - "area": "华中区", - "province": "湖北省", - "city": "潜江", - "contact": "罗生", - "telephone": "13520211175", - "address": "潜江", - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "employees": 246, - "created_date": "2013-04-30 00:56:00", - "boole": false, - "assets": "2000000", - "rate": 0.7 - }, - { - "id": "18", - "name": "珠海XX科技有限公司", - "userId": 441047913162396, - "area": "华南区", - "province": "广东省", - "city": "珠海", - "contact": "黄生", - "telephone": "13120211175", - "address": "珠海香洲区", - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "employees": 592, - "created_date": "2014-05-30 01:00:00", - "boole": false, - "assets": "1800000", - "rate": 0.66 - }, - { - "id": "19", - "name": "珠海XX医疗科技有限公司", - "userId": 441047913162396, - "area": "华南区", - "province": "广东省", - "city": "广州", - "contact": "刘生", - "telephone": "13820211175", - "address": "广州天河区", - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "employees": 851, - "created_date": "2014-04-29 08:56:00", - "boole": false, - "assets": "100000", - "rate": 0.1 - }, - { - "id": "20", - "name": "东莞XX礼品有限公司", - "userId": 421000103624183, - "area": "华中区", - "province": "湖北省", - "city": "襄阳", - "contact": "范生", - "telephone": "13120211175", - "address": "襄阳", - "introduction": "公司技术和研发实力雄厚,是国家863项目的参与者,并被政府认定为“高新技术企业”。", - "employees": 394, - "created_date": "2014-04-28 10:56:00", - "boole": true, - "assets": "400000", - "rate": 0.4 - } -] \ No newline at end of file diff --git a/example/public/mock/gateway/json/services/gridTree.json b/example/public/mock/gateway/json/services/gridTree.json deleted file mode 100644 index a70c24124..000000000 --- a/example/public/mock/gateway/json/services/gridTree.json +++ /dev/null @@ -1,93 +0,0 @@ -[ - { - "id": "1", - "pid": "0", - "name": "GFD科技有限公司", - "area": "华东区", - "employees": "800" - }, - { - "id": "15", - "pid": "1", - "name": "GFD科技股份有限子公司", - "area": "华东区", - "employees": "700" - }, - { - "id": "2", - "pid": "0", - "name": "WWWW科技有限公司", - "area": "华南区", - "employees": "500" - }, - { - "id": "22", - "pid": "2", - "name": "WWWW科技股份有限子公司", - "area": "华南区", - "employees": "720" - }, - { - "id": "3", - "pid": "4", - "name": "RFV有限责任公司", - "area": "华南区", - "employees": "300" - }, - { - "id": "4", - "pid": "0", - "name": "TGB有限公司", - "area": "华南区", - "employees": "360" - }, - { - "id": "5", - "pid": "4", - "name": "YHN科技有限公司", - "area": "华南区", - "employees": "810" - }, - { - "id": "6", - "pid": "5", - "name": "WSX科技有限公司", - "area": "华南区", - "employees": "800" - }, - { - "id": "7", - "pid": "0", - "name": "XX物业有限公司", - "area": "华南区", - "employees": "400" - }, - { - "id": "8", - "pid": "7", - "name": "深圳市XX网络技术有限公司", - "area": "华南区", - "employees": "540" - }, - { - "id": "9", - "pid": "5", - "name": "UJM有限责任公司", - "area": "华南区", - "employees": "750" - }, - { - "id": "10", - "pid": "7", - "name": "IK有限责任公司", - "area": "华南区", - "employees": "400" - }, - { - "id": "23", - "pid": "10", - "name": "IK有限责任股份有限公司", - "area": "华南区", - "employees": "455" - } -] \ No newline at end of file diff --git a/example/public/mock/gateway/json/services/hrapprover.json b/example/public/mock/gateway/json/services/hrapprover.json deleted file mode 100644 index ec005e5d3..000000000 --- a/example/public/mock/gateway/json/services/hrapprover.json +++ /dev/null @@ -1,20 +0,0 @@ -[ - { - "dept_Code": "022471", - "remarks": null, - "approval_Person": "test1", - "approval_Category": "0303" - }, - { - "dept_Code": "041963", - "remarks": "权限申请", - "approval_Person": "test2", - "approval_Category": "0303" - }, - { - "dept_Code": "041963", - "remarks": "资产申请", - "approval_Person": "test3", - "approval_Category": "0303" - } -] \ No newline at end of file diff --git a/example/public/mock/gateway/json/services/jalor.company.json b/example/public/mock/gateway/json/services/jalor.company.json deleted file mode 100644 index 55175f752..000000000 --- a/example/public/mock/gateway/json/services/jalor.company.json +++ /dev/null @@ -1,87 +0,0 @@ -{ - "more": [ - 1 - ], - "company": [ - { - "kw_control_status": "Branches/分公司", - "tx_delegate": "test1 95270007/SZ,", - "kw_in_group": "Y", - "tx_type_en": "Domestic", - "tx_corporation": "SZ Technologies Co., Ltd. Guangzhou Branch", - "tx_person": null, - "tx_country_code": "CN", - "tx_corporation_cn": "SZ技术有限公司广州分公司", - "last_modified_date": "2016/05/03 14:04:48", - "kwregion": "China Region", - "txcity": "广州/Guangzhou", - "tx_country": "中国/China", - "tx_entity_type": "in operation", - "tx_corporation_local": "SZ技术有限公司广州分公司", - "tx_type_cn": "国内", - "dtincorporation": "2009-08-24", - "txaddress": "广州市越秀区环市东路", - "tx_coa": "0231" - }, - { - "kw_control_status": "Subsidiaries/子公司", - "tx_delegate": "test2 95270008/SZ,", - "kw_in_group": "Y", - "tx_type_en": "Overseas", - "tx_corporation": "SZ Network USA, Inc.", - "tx_person": null, - "tx_country_code": "US", - "tx_corporation_cn": "SZ网络MG有限公司", - "last_modified_date": "2016/10/29 11:18:30", - "kwregion": "America Rep Office", - "txcity": "Dallas, Texas", - "tx_country": "MG/United States", - "tx_entity_type": "closed", - "tx_corporation_local": "SZ Network USA, Inc.", - "tx_type_cn": "海外", - "dtincorporation": "2010-03-12", - "txaddress": "\"350 North St. Paul StreetDallas\"", - "tx_coa": "0741" - }, - { - "kw_control_status": "Controlled Entities/合营公司", - "tx_delegate": "张三,", - "kw_in_group": "Y", - "tx_type_en": "Overseas", - "tx_corporation": "H.S. USA,INC.", - "tx_person": "张三,李四,", - "tx_country_code": "US", - "tx_corporation_cn": "MG有限公司(美研所)", - "last_modified_date": "2016/05/03 14:04:48", - "kwregion": "America Rep Office", - "txcity": "Cupertino", - "tx_country": "MG/United States", - "tx_entity_type": "closed", - "tx_corporation_local": "HS USA.,Inc", - "tx_type_cn": "海外", - "dtincorporation": "2008-09-03", - "txaddress": "1209 Orange Street,City of Wilmington,County of New Castle", - "tx_coa": "7061" - }, - { - "kw_control_status": "Subsidiaries/子公司", - "tx_delegate": null, - "kw_in_group": "Y", - "tx_type_en": "Domestic", - "tx_corporation": "shenzhenSZ", - "tx_person": null, - "tx_country_code": "CN", - "tx_corporation_cn": "SZ技术有限公司", - "last_modified_date": "2016/11/15 14:41:24", - "kwregion": "China Region", - "txcity": "深圳市", - "tx_country": "中国/China", - "tx_entity_type": "setting up", - "tx_corporation_local": "深圳坂田SZ", - "tx_type_cn": "国内", - "dtincorporation": "2016-08-01", - "txaddress": "SZ技术有限公司", - "tx_coa": "0021" - } - ] -} \ No newline at end of file diff --git a/example/public/mock/gateway/json/services/jalor.country.json b/example/public/mock/gateway/json/services/jalor.country.json deleted file mode 100644 index 3015ea0dd..000000000 --- a/example/public/mock/gateway/json/services/jalor.country.json +++ /dev/null @@ -1,94 +0,0 @@ -{ - "country": [ - { - "territory_short_name": "China", - "description": "the People's Republic of China", - "language": "US", - "territory_code": "CN" - }, - { - "territory_short_name": "France", - "description": "the French Republic", - "language": "US", - "territory_code": "FR" - }, - { - "territory_short_name": "Finland", - "description": "the Republic of Finland", - "language": "US", - "territory_code": "FI" - }, - { - "territory_short_name": "Kuwait", - "description": "the State of Kuwait", - "language": "US", - "territory_code": "KW" - }, - { - "territory_short_name": "Moldova (the Republic of)", - "description": "the Republic of Moldova", - "language": "US", - "territory_code": "MD" - }, - { - "territory_short_name": "Mozambique", - "description": "the Republic of Mozambique", - "language": "US", - "territory_code": "MZ" - }, - { - "territory_short_name": "Niger", - "description": "the Republic of the Niger", - "language": "US", - "territory_code": "NE" - }, - { - "territory_short_name": "Oman", - "description": "the Sultanate of Oman", - "language": "US", - "territory_code": "OM" - }, - { - "territory_short_name": "Panama", - "description": "the Republic of Panama", - "language": "US", - "territory_code": "PA" - }, - { - "territory_short_name": "Papua New Guinea", - "description": "the Independent State of Papua New Guinea", - "language": "US", - "territory_code": "PG" - }, - { - "territory_short_name": "Serbia", - "description": "the Republic of Serbia", - "language": "US", - "territory_code": "RS" - }, - { - "territory_short_name": "Senegal", - "description": "the Republic of Senegal", - "language": "US", - "territory_code": "SN" - }, - { - "territory_short_name": "Tonga", - "description": "the Kingdom of Tonga", - "language": "US", - "territory_code": "TO" - }, - { - "territory_short_name": "Uganda", - "description": "the Republic of Uganda", - "language": "US", - "territory_code": "UG" - }, - { - "territory_short_name": "United States", - "description": "the United States of America", - "language": "US", - "territory_code": "US" - } - ] -} diff --git a/example/public/mock/gateway/json/services/jalor.user.json b/example/public/mock/gateway/json/services/jalor.user.json deleted file mode 100644 index 821739026..000000000 --- a/example/public/mock/gateway/json/services/jalor.user.json +++ /dev/null @@ -1,79 +0,0 @@ -[ - { - "sex": "M", - "l0_Name": "SZ技术", - "effective_Start_Date": "2011/10/14 00:00:00", - "l3_Dept_Code": "038384", - "person_Notes_Cn": "test1 12345678", - "l2_Name": "信息技术工程部", - "short_Name": "l12345678", - "effective_End_Date": "4712/12/31 00:00:00", - "person_Mail": "", - "name": "公共技术测试数据部门", - "location_second_area": "Shenzhen", - "upper_Name": "IT技术架构与测试数据部", - "coa_Combination": "0021.000.0001.038759", - "l4_Name": "公共技术测试数据部门", - "english_Name": "zhang san", - "dept_Code": "038759", - "employee_Number": "12345678", - "l0_Dept_Code": "022471", - "l2_Dept_Code": "023268", - "upper_Dept_Code": "038384", - "l1_Name": "测试数据部", - "location_country": "China", - "l4_Dept_Code": "038759", - "start_Date": "2011/08/01 00:00:00", - "contract_Location_Code": "010400", - "l1_Dept_Code": "023093", - "contract_Location_Name": "China\\Guangdong-Shenzhen", - "location_first_area": "Guangdong", - "last_Name": "张三", - "language": "CHN", - "l3_Name": "测试与测试数据部" - }, - { - "contract_Location_Name": "China\\Guangdong-Shenzhen", - "location_second_area": "Shenzhen", - "effective_End_Date": "4712/12/31 00:00:00", - "l4_Name": "公共技术测试数据部门", - "l0_Dept_Code": "022471", - "l0_Name": "SZ技术", - "coa_Combination": "0021.000.0001.038759", - "last_Name": "李四", - "language": "CHN", - "l1_Name": "测试数据部", - "l3_Dept_Code": "038384", - "l4_Dept_Code": "038759", - "location_first_area": "Guangdong", - "l2_Name": "信息技术工程部", - "start_Date": "2014/04/21 00:00:00", - "l2_Dept_Code": "023268", - "effective_Start_Date": "2014/04/21 00:00:00", - "upper_Dept_Code": "038384", - "employee_Number": "12345678", - "dept_Code": "038759", - "contract_Location_Code": "010400", - "short_Name": "12345678", - "person_Mail": "", - "l3_Name": "IT技术架构与测试数据部", - "sex": "M", - "name": "公共技术测试数据部门", - "person_Notes_Cn": "test2 12345678", - "location_country": "China", - "upper_Name": "IT技术架构与测试数据部", - "l1_Dept_Code": "023093", - "english_Name": "li si" - }, - { - "language": "CHN", - "employee_Number": "12345678", - "short_Name": "12345678", - "person_Mail": "", - "person_Notes_Cn": "wangwu 12345678", - "last_Name": "王五", - "english_Name": "wang wu", - "l0_Name": "SZ技术", - "l1_Name": "SZIT云" - } -] diff --git a/example/public/mock/gateway/json/services/saasDictItemSearch.json b/example/public/mock/gateway/json/services/saasDictItemSearch.json deleted file mode 100644 index 39fbff199..000000000 --- a/example/public/mock/gateway/json/services/saasDictItemSearch.json +++ /dev/null @@ -1,18 +0,0 @@ -[ - { - "id": "b49cf1a5326b4ce797541064e48302d5", - "app_id": "app_common777777", - "code": "zhCN", - "name": "中文", - "i18n$$name": "中文", - "order_number": null - }, - { - "id": "bdaedfe15dfd4ad8aa30bc05567de629", - "app_id": "app_common777777", - "code": "enUS", - "name": "English", - "i18n$$name": "English", - "order_number": null - } -] diff --git a/example/public/mock/gateway/json/services/saasI18nGetInfoWithPage.json b/example/public/mock/gateway/json/services/saasI18nGetInfoWithPage.json deleted file mode 100644 index bfd0a3b74..000000000 --- a/example/public/mock/gateway/json/services/saasI18nGetInfoWithPage.json +++ /dev/null @@ -1,265 +0,0 @@ -[ - { - "id": "ced3f89e313d4bbea1821a9942196d0d", - "app_id": "app_common666666", - "sub_app_id": null, - "code": "a", - "value": "b", - "language": "enUS", - "module": "hae.manager.catalog", - "memo": null, - "extend": null, - "created_by": "uuid~eldYMjc2MDg0", - "created_date": "2016-03-01 09:59:50.000000", - "last_updated_by": "uuid~eldYMjc2MDg0", - "last_updated_date": "2016-03-01 09:59:50.000000", - "modification_num": 1, - "type": "2", - "hw_hae_paging": { - "startIndex": 1, - "totalRows": 652, - "curPage": 1, - "pageSize": 15, - "endIndex": 15, - "totalPages": 44 - } - }, - { - "id": "70cdecbd47714568812433ac99895c9e", - "app_id": "app_common666666", - "sub_app_id": null, - "code": "a", - "value": "a", - "language": "zhCN", - "module": "hae.manager.catalog", - "memo": null, - "extend": null, - "created_by": "uuid~eldYMjc2MDg0", - "created_date": "2016-03-01 09:59:50.000000", - "last_updated_by": "uuid~eldYMjc2MDg0", - "last_updated_date": "2016-03-01 09:59:50.000000", - "modification_num": 1, - "type": "2" - }, - { - "id": "830cbe73d92f41fdaf11647fd70c7313", - "app_id": "app_common666666", - "sub_app_id": null, - "code": "hae.developer.Guideline.Environment", - "value": "环境及运维手册", - "language": "zhCN", - "module": "hae.manager.catalog", - "memo": null, - "extend": null, - "created_by": "uuid~dGVzdDE=", - "created_date": "2015-05-28 09:41:51.000000", - "last_updated_by": "uuid~dzAwMTk2MTgx", - "last_updated_date": "2015-09-01 10:55:50.000000", - "modification_num": 2, - "type": "2" - }, - { - "id": "2c3d8b59b68948caa637fa857cfe2a17", - "app_id": "app_common666666", - "sub_app_id": null, - "code": "hae.developer.Guideline.FrontWebDocuments", - "value": "Web Development Docs", - "language": "enUS", - "module": "hae.manager.catalog", - "memo": null, - "extend": null, - "created_by": "uuid~dGVzdDE=", - "created_date": "2015-05-28 09:40:02.000000", - "last_updated_by": "uuid~dzAwMTk2MTgx", - "last_updated_date": "2015-09-01 10:55:50.000000", - "modification_num": 3, - "type": "2" - }, - { - "id": "b1143eb90e224153b27c60bacf027ea8", - "app_id": "app_common666666", - "sub_app_id": null, - "code": "hae.developer.Guideline.FrontWebDocuments", - "value": "Web开发手册", - "language": "zhCN", - "module": "hae.manager.catalog", - "memo": null, - "extend": null, - "created_by": "uuid~dGVzdDE=", - "created_date": "2015-05-28 09:40:02.000000", - "last_updated_by": "uuid~dzAwMTk2MTgx", - "last_updated_date": "2015-09-01 10:55:50.000000", - "modification_num": 2, - "type": "2" - }, - { - "id": "1477ebb28ad645d699dac39eae3ff945", - "app_id": "app_common666666", - "sub_app_id": null, - "code": "hae.developer.Guideline.WebDoc", - "value": "Web Document", - "language": "enUS", - "module": "hae.saas.i18n", - "memo": null, - "extend": null, - "created_by": "uuid~eFdYMjMzODM5", - "created_date": "2015-04-10 10:16:29.000000", - "last_updated_by": "uuid~dzAwMTk2MTgx", - "last_updated_date": "2015-09-01 10:55:49.000000", - "modification_num": 1, - "type": "1" - }, - { - "id": "721f546b95ac484e9711033cb0613747", - "app_id": "app_common666666", - "sub_app_id": null, - "code": "hae.developer.Guideline.WebDoc", - "value": "前端WEB文档", - "language": "zhCN", - "module": "hae.saas.i18n", - "memo": null, - "extend": null, - "created_by": "uuid~eFdYMjMzODM5", - "created_date": "2015-04-10 10:16:29.000000", - "last_updated_by": "uuid~dzAwMTk2MTgx", - "last_updated_date": "2015-09-01 10:55:49.000000", - "modification_num": 1, - "type": "1" - }, - { - "id": "af6c514babec4b33b980b026a516e217", - "app_id": "app_common666666", - "sub_app_id": null, - "code": "hae.developer.Guideline.webDoc", - "value": "WEB Document", - "language": "enUS", - "module": "hae.saas.i18n", - "memo": null, - "extend": null, - "created_by": "uuid~eFdYMjMzODM5", - "created_date": "2015-04-10 10:09:46.000000", - "last_updated_by": "uuid~dzAwMTk2MTgx", - "last_updated_date": "2015-09-01 10:55:49.000000", - "modification_num": 1, - "type": "1" - }, - { - "id": "e71ada77514d4417b118e4d8fc9ec708", - "app_id": "app_common666666", - "sub_app_id": null, - "code": "hae.developer.Guideline.webDoc", - "value": "前端WEB文档", - "language": "zhCN", - "module": "hae.saas.i18n", - "memo": null, - "extend": null, - "created_by": "uuid~eFdYMjMzODM5", - "created_date": "2015-04-10 10:09:46.000000", - "last_updated_by": "uuid~dzAwMTk2MTgx", - "last_updated_date": "2015-09-01 10:55:49.000000", - "modification_num": 1, - "type": "1" - }, - { - "id": "cf188cfc93e94d05bbbfc25f4d628550", - "app_id": "app_common666666", - "sub_app_id": null, - "code": "hae.developer.HelpTopic", - "value": "Help", - "language": "enUS", - "module": "hae.saas.i18n", - "memo": null, - "extend": null, - "created_by": "uuid~d1dYMjAzNDY3", - "created_date": "2015-04-07 15:56:15.000000", - "last_updated_by": "uuid~dzAwMTk2MTgx", - "last_updated_date": "2015-09-01 10:55:49.000000", - "modification_num": 19, - "type": "1" - }, - { - "id": "4472e69546f4489b98772d5f4eaf5abf", - "app_id": "app_common666666", - "sub_app_id": null, - "code": "hae.developer.HelpTopic", - "value": "帮助", - "language": "zhCN", - "module": "hae.saas.i18n", - "memo": null, - "extend": null, - "created_by": "uuid~d1dYMjAzNDY3", - "created_date": "2015-04-07 15:56:15.000000", - "last_updated_by": "uuid~dzAwMTk2MTgx", - "last_updated_date": "2015-09-01 10:55:49.000000", - "modification_num": 1, - "type": "1" - }, - { - "id": "a5ad6b57e7954fbfb9a19a295d924ce5", - "app_id": "app_common666666", - "sub_app_id": null, - "code": "hae.developer.HelpTopic.ConfigurePlatform", - "value": "Configuration Platform", - "language": "enUS", - "module": "hae.manager.catalog", - "memo": null, - "extend": null, - "created_by": "uuid~dGVzdDE=", - "created_date": "2015-05-28 10:19:41.000000", - "last_updated_by": "uuid~dzAwMTk2MTgx", - "last_updated_date": "2015-09-01 10:55:50.000000", - "modification_num": 2, - "type": "2" - }, - { - "id": "bfb4547487b24321a6991bc65a8c5d8e", - "app_id": "app_common666666", - "sub_app_id": null, - "code": "hae.developer.HelpTopic.ConfigurePlatform", - "value": "配置平台", - "language": "zhCN", - "module": "hae.manager.catalog", - "memo": null, - "extend": null, - "created_by": "uuid~dGVzdDE=", - "created_date": "2015-05-28 10:19:41.000000", - "last_updated_by": "uuid~dzAwMTk2MTgx", - "last_updated_date": "2015-09-01 10:55:50.000000", - "modification_num": 1, - "type": "2" - }, - { - "id": "960d6aadbe3b43a8932b5ca95ff18cf8", - "app_id": "app_common666666", - "sub_app_id": null, - "code": "hae.developer.HelpTopic.Expert", - "value": "Online Expert", - "language": "enUS", - "module": "hae.manager.catalog", - "memo": null, - "extend": null, - "created_by": "uuid~eDAwMTkyMDAw", - "created_date": "2015-06-01 14:33:52.000000", - "last_updated_by": "uuid~dzAwMTk2MTgx", - "last_updated_date": "2015-09-01 10:55:49.000000", - "modification_num": 2, - "type": "2" - }, - { - "id": "d95f2707549e42e6a9cd75de4d429025", - "app_id": "app_common666666", - "sub_app_id": null, - "code": "hae.developer.HelpTopic.Expert", - "value": "专家在线", - "language": "zhCN", - "module": "hae.manager.catalog", - "memo": null, - "extend": null, - "created_by": "uuid~eDAwMTkyMDAw", - "created_date": "2015-06-01 14:33:52.000000", - "last_updated_by": "uuid~dzAwMTk2MTgx", - "last_updated_date": "2015-09-01 10:55:49.000000", - "modification_num": 1, - "type": "2" - } -] diff --git a/example/public/mock/gateway/json/services/saasI18nSearch.json b/example/public/mock/gateway/json/services/saasI18nSearch.json deleted file mode 100644 index c8c52e1f2..000000000 --- a/example/public/mock/gateway/json/services/saasI18nSearch.json +++ /dev/null @@ -1,10 +0,0 @@ -[ - { - "id": "ee2dcdfb6dc94b33b997db2fff25a1bf", - "module": "hae.saas.i18n", - "code": "pmallmng.exception.code.", - "type": "1", - "value": "sdfeeee", - "language": "zhCN" - } -] diff --git a/example/public/mock/gateway/json/services/suggest.json b/example/public/mock/gateway/json/services/suggest.json deleted file mode 100644 index 867ead84c..000000000 --- a/example/public/mock/gateway/json/services/suggest.json +++ /dev/null @@ -1,92 +0,0 @@ -[ - { - "id": 1, - "pid": -1, - "name": "湖南", - "memo": "" - }, - { - "id": 2, - "pid": -1, - "name": "湖北", - "memo": "" - }, - { - "id": 3, - "pid": -1, - "name": "广东", - "memo": "" - }, - { - "id": 4, - "pid": -1, - "name": "广西", - "memo": "" - }, - { - "id": 5, - "pid": -1, - "name": "浙江", - "memo": "" - }, - { - "id": 6, - "pid": -1, - "name": "西藏", - "memo": "" - }, - { - "id": 7, - "pid": -1, - "name": "四川", - "memo": "" - }, - { - "id": 8, - "pid": -1, - "name": "云南", - "memo": "" - }, - { - "id": 9, - "pid": 1, - "name": "长沙", - "memo": "" - }, - { - "id": 10, - "pid": 2, - "name": "武汉", - "memo": "" - }, - { - "id": 11, - "pid": 3, - "name": "广州", - "memo": "" - }, - { - "id": 12, - "pid": 3, - "name": "深圳", - "memo": "" - }, - { - "id": 13, - "pid": 3, - "name": "东莞", - "memo": "" - }, - { - "id": 14, - "pid": 3, - "name": "惠州", - "memo": "" - }, - { - "id": 15, - "pid": 1, - "name": "岳阳", - "memo": "" - } -] diff --git a/example/public/mock/gateway/json/services/tree.json b/example/public/mock/gateway/json/services/tree.json deleted file mode 100644 index 662cf5cdd..000000000 --- a/example/public/mock/gateway/json/services/tree.json +++ /dev/null @@ -1,98 +0,0 @@ -[ - { - "id": 100, - "pId": 0, - "label": "node1", - "isParent": true - }, - { - "id": 1, - "pId": 100, - "label": "node1.1", - "isParent": false - }, - { - "id": 2, - "pId": 100, - "label": "node1.2", - "isParent": false - }, - { - "id": 3, - "pId": 100, - "label": "node1.3", - "isParent": false - }, - { - "id": 4, - "pId": 100, - "label": "node1.4", - "isParent": true - }, - { - "id": 41, - "pId": 4, - "label": "node1.4.1", - "isParent": false - }, - { - "id": 411, - "pId": 41, - "label": "node1.4.1.1", - "isParent": false - }, - { - "id": 42, - "pId": 4, - "label": "node1.4.2", - "isParent": false - }, - { - "id": 421, - "pId": 42, - "label": "node1.4.2.1", - "isParent": false - }, - { - "id": 5, - "pId": 100, - "label": "node1.5", - "isParent": true - }, - { - "id": 51, - "pId": 5, - "label": "node1.5.1", - "isParent": false - }, - { - "id": 101, - "pId": 0, - "label": "node2", - "isParent": true - }, - { - "id": 1011, - "pId": 101, - "label": "node2.1", - "isParent": false - }, - { - "id": 102, - "pId": 0, - "label": "node3", - "isParent": true - }, - { - "id": 1021, - "pId": 102, - "label": "node3.1", - "isParent": false - }, - { - "id": 103, - "pId": 0, - "label": "node4", - "isParent": false - } -] \ No newline at end of file diff --git a/example/public/static/images/1.jpg b/example/public/static/images/1.jpg deleted file mode 100644 index bc65f7344..000000000 Binary files a/example/public/static/images/1.jpg and /dev/null differ diff --git a/example/public/static/images/2.jpg b/example/public/static/images/2.jpg deleted file mode 100644 index 31332e509..000000000 Binary files a/example/public/static/images/2.jpg and /dev/null differ diff --git a/example/public/static/images/3.jpg b/example/public/static/images/3.jpg deleted file mode 100644 index 36cf1c18f..000000000 Binary files a/example/public/static/images/3.jpg and /dev/null differ diff --git a/example/public/static/images/4.jpg b/example/public/static/images/4.jpg deleted file mode 100644 index 2e871721e..000000000 Binary files a/example/public/static/images/4.jpg and /dev/null differ diff --git a/example/public/static/images/5.jpg b/example/public/static/images/5.jpg deleted file mode 100644 index 797d07bd4..000000000 Binary files a/example/public/static/images/5.jpg and /dev/null differ diff --git a/example/public/static/images/6.jpg b/example/public/static/images/6.jpg deleted file mode 100644 index c9a0c8854..000000000 Binary files a/example/public/static/images/6.jpg and /dev/null differ diff --git a/example/public/static/images/7.jpg b/example/public/static/images/7.jpg deleted file mode 100644 index 981cd1a27..000000000 Binary files a/example/public/static/images/7.jpg and /dev/null differ diff --git a/example/public/static/images/8.jpg b/example/public/static/images/8.jpg deleted file mode 100644 index c79a51dad..000000000 Binary files a/example/public/static/images/8.jpg and /dev/null differ diff --git a/example/public/static/images/9.jpg b/example/public/static/images/9.jpg deleted file mode 100644 index b1692044a..000000000 Binary files a/example/public/static/images/9.jpg and /dev/null differ diff --git a/example/public/static/images/animal.jpg b/example/public/static/images/animal.jpg deleted file mode 100644 index 56df9ac30..000000000 Binary files a/example/public/static/images/animal.jpg and /dev/null differ diff --git a/example/public/static/images/book-big.jpg b/example/public/static/images/book-big.jpg deleted file mode 100644 index b86736bb1..000000000 Binary files a/example/public/static/images/book-big.jpg and /dev/null differ diff --git a/example/public/static/images/book-small.jpg b/example/public/static/images/book-small.jpg deleted file mode 100644 index 6e3c1f439..000000000 Binary files a/example/public/static/images/book-small.jpg and /dev/null differ diff --git a/example/public/static/images/book.jpg b/example/public/static/images/book.jpg deleted file mode 100644 index 6cf36a40c..000000000 Binary files a/example/public/static/images/book.jpg and /dev/null differ diff --git a/example/public/static/images/bridge.jpg b/example/public/static/images/bridge.jpg deleted file mode 100644 index ab545c7af..000000000 Binary files a/example/public/static/images/bridge.jpg and /dev/null differ diff --git a/example/public/static/images/button-image.png b/example/public/static/images/button-image.png deleted file mode 100644 index f3322e468..000000000 Binary files a/example/public/static/images/button-image.png and /dev/null differ diff --git a/example/public/static/images/circle.png b/example/public/static/images/circle.png deleted file mode 100644 index e16488e45..000000000 Binary files a/example/public/static/images/circle.png and /dev/null differ diff --git a/example/public/static/images/dh.png b/example/public/static/images/dh.png deleted file mode 100644 index 9f2f79e93..000000000 Binary files a/example/public/static/images/dh.png and /dev/null differ diff --git a/example/public/static/images/dog1.png b/example/public/static/images/dog1.png deleted file mode 100644 index 8ef391baf..000000000 Binary files a/example/public/static/images/dog1.png and /dev/null differ diff --git a/example/public/static/images/dog2.png b/example/public/static/images/dog2.png deleted file mode 100644 index eb6d5dbe4..000000000 Binary files a/example/public/static/images/dog2.png and /dev/null differ diff --git a/example/public/static/images/dog3.png b/example/public/static/images/dog3.png deleted file mode 100644 index 1947b1c5c..000000000 Binary files a/example/public/static/images/dog3.png and /dev/null differ diff --git a/example/public/static/images/dsj.png b/example/public/static/images/dsj.png deleted file mode 100644 index a269b3949..000000000 Binary files a/example/public/static/images/dsj.png and /dev/null differ diff --git a/example/public/static/images/floral.png b/example/public/static/images/floral.png deleted file mode 100644 index 80f595e26..000000000 Binary files a/example/public/static/images/floral.png and /dev/null differ diff --git a/example/public/static/images/fruit.jpg b/example/public/static/images/fruit.jpg deleted file mode 100644 index b295bd78e..000000000 Binary files a/example/public/static/images/fruit.jpg and /dev/null differ diff --git a/example/public/static/images/hae-logo.png b/example/public/static/images/hae-logo.png deleted file mode 100644 index 0e907d2c9..000000000 Binary files a/example/public/static/images/hae-logo.png and /dev/null differ diff --git a/example/public/static/images/house.jpg b/example/public/static/images/house.jpg deleted file mode 100644 index ab5480802..000000000 Binary files a/example/public/static/images/house.jpg and /dev/null differ diff --git a/example/public/static/images/icon.png b/example/public/static/images/icon.png deleted file mode 100644 index f1f7bc506..000000000 Binary files a/example/public/static/images/icon.png and /dev/null differ diff --git a/example/public/static/images/jz.png b/example/public/static/images/jz.png deleted file mode 100644 index d238442d8..000000000 Binary files a/example/public/static/images/jz.png and /dev/null differ diff --git a/example/public/static/images/ld.png b/example/public/static/images/ld.png deleted file mode 100644 index b67de9343..000000000 Binary files a/example/public/static/images/ld.png and /dev/null differ diff --git a/example/public/static/images/mountain.png b/example/public/static/images/mountain.png deleted file mode 100644 index e8a3e63ec..000000000 Binary files a/example/public/static/images/mountain.png and /dev/null differ diff --git a/example/public/static/images/planet1.jpg b/example/public/static/images/planet1.jpg deleted file mode 100644 index b5228a40e..000000000 Binary files a/example/public/static/images/planet1.jpg and /dev/null differ diff --git a/example/public/static/images/planet2.jpg b/example/public/static/images/planet2.jpg deleted file mode 100644 index 4880a85e9..000000000 Binary files a/example/public/static/images/planet2.jpg and /dev/null differ diff --git a/example/public/static/images/planet3.jpg b/example/public/static/images/planet3.jpg deleted file mode 100644 index b74628331..000000000 Binary files a/example/public/static/images/planet3.jpg and /dev/null differ diff --git a/example/public/static/images/px.png b/example/public/static/images/px.png deleted file mode 100644 index 4a5d17004..000000000 Binary files a/example/public/static/images/px.png and /dev/null differ diff --git a/example/public/static/images/user-head.png b/example/public/static/images/user-head.png deleted file mode 100644 index 963524468..000000000 Binary files a/example/public/static/images/user-head.png and /dev/null differ diff --git a/example/public/static/images/watercolor.png b/example/public/static/images/watercolor.png deleted file mode 100644 index ad31f47c2..000000000 Binary files a/example/public/static/images/watercolor.png and /dev/null differ diff --git a/example/public/static/images/zh.png b/example/public/static/images/zh.png deleted file mode 100644 index b2305c804..000000000 Binary files a/example/public/static/images/zh.png and /dev/null differ diff --git a/example/src/App.vue b/example/src/App.vue deleted file mode 100644 index d8540d3a9..000000000 --- a/example/src/App.vue +++ /dev/null @@ -1,8 +0,0 @@ - - diff --git a/example/src/DemoView.vue b/example/src/DemoView.vue deleted file mode 100644 index 27bd9da84..000000000 --- a/example/src/DemoView.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - diff --git a/example/src/assets/logo.png b/example/src/assets/logo.png deleted file mode 100644 index f3d2503fc..000000000 Binary files a/example/src/assets/logo.png and /dev/null differ diff --git a/example/src/assets/markdown.css b/example/src/assets/markdown.css deleted file mode 100644 index 6005bf2a1..000000000 --- a/example/src/assets/markdown.css +++ /dev/null @@ -1,559 +0,0 @@ -.hljs { - margin: 12px 0 25px 0; -} - -.highlight .hljs { - margin: 0; -} - -code { - background-color: #faffff; - border-radius: 4px; - padding: 1px 3px; - font-family: Menlo, YaHei Consolas Hybrid, Consolas, Courier New, monospace; - font-size: 13px; -} - -button, -input, -select, -textarea { - font-family: inherit; - font-size: inherit; - line-height: inherit; - color: inherit; -} -a { - display: inline-block; - white-space: nowrap; - cursor: pointer; - background-image: none; - text-decoration: none; - outline: 0; - color: var(--ti-common-color-line-active); -} - -input::-ms-clear, -input::-ms-reveal { - display: none; -} -.main-cnt { - padding: 80px 0 40px; - box-sizing: border-box; - height: 100%; -} - -.page-container { - width: 1140px; - padding: 0; - margin: 0 auto; -} - -.page-container { - padding-top: 0px; -} - -.page-container h2 { - font-size: 28px; - color: #1f2d3d; - margin: 0; - padding-bottom: 10px; - display: inline-block; -} - -.page-container h2 + p { - display: inline-block; -} - -.displaywrap .page-container h2 + p { - display: block; -} - -.page-container h3 { - font-size: 22px; -} - -.page-container h2, -.page-container h3, -.page-container h4, -.page-container h5 { - font-weight: 400; - color: #1f2f3d; -} - -.page-container h2 a, -.page-container h3 a, -.page-container h4 a, -.page-container h5 a { - float: left; - margin-left: -20px; - opacity: 0; - cursor: pointer; -} - -.page-container h2 a:hover, -.page-container h2:hover a, -.page-container h3 a:hover, -.page-container h3:hover a, -.page-container h4 a:hover, -.page-container h4:hover a, -.page-container h5 a:hover, -.page-container h5:hover a { - opacity: 0.4; -} - -.page-container p { - font-size: 16px; - color: #5e6d82; - line-height: 1.7em; -} - -.page-container .tip { - padding: 8px 16px; - background-color: #ecf8ff; - border-radius: 4px; - border-left: 5px solid #50bfff; - margin: 20px 0; - font-size: 14px; - color: #5e6d82; -} - -.page-container .tip .highlight-lines, -.page-container .tip .line-numbers-wrapper { - font-size: 12px; -} - -.page-container .tip code { - font-size: 14px; - line-height: 2em; -} - -.page-container .warn { - padding: 8px 16px; - background-color: #fffbe6; - border-radius: 4px; - border-left: 5px solid #ffd666; - margin: 20px 0; -} - -.page-container .warn code { - background-color: hsla(0, 0%, 100%, 0.7); - color: #445368; -} -.page-container .error { - padding: 8px 16px; - background-color: #fff1f0; - border-radius: 4px; - border-left: 5px solid #ff7875; - margin: 20px 0; -} - -.page-container .attach-icon .hae-icon.error, -.page-container .attach-icon .hae-icon.warn { - padding: 0; - margin: 0; - border: 0; - border-radius: 0; - background: none; -} - -.page-container .error code { - background-color: hsla(0, 0%, 100%, 0.7); - color: #445368; -} - -.page-container.academy-container { - width: 100%; - padding: 0; - margin: 0; -} - -.page-container.academy-container .main-left h2, -.page-container.academy-container .main-left h2 + p { - display: block; -} - -.page-container.academy-container .main-left h2 { - padding: 10px 0; -} - -.page-container.academy-container .main-left h3 { - margin: 40px 0 20px 0; -} - -.page-container.academy-container .main-left p > img, -.page-container.academy-container .main-left img { - max-width: 1200px; - margin: 10px 0; -} - -.page-container.academy-container .main-left code.hljs { - max-width: 720px; -} - -.page-container.academy-container .main-left hr { - max-width: 1200px; - margin-left: 0; -} - -.page-container.academy-container .main-left ul { - list-style: disc inside; - padding-left: 12px; - margin: 12px 0; -} - -.page-container.academy-container .main-left ul > li { - font-size: 14px; - line-height: 36px; -} - -.page-container.academy-container .main-left ul > li > p { - display: inline-block; -} - -.page-container.academy-container .main-left ul > li > ul { - padding-left: 24px; -} - -/* vue-press */ -.content code { - color: #476582; - padding: 0.25rem 0.5rem; - margin: 0; - font-size: 0.85em; - background-color: rgba(27, 31, 35, 0.05); - border-radius: 3px; -} - -.content code, -.content pre, -.content kbd, -.content samp { - font-family: 'source-code-pro', 'Menlo', 'Monaco', 'Consolas', 'Courier New', - 'monospace'; -} -.custom-block .custom-block-title { - font-weight: 600; - margin-bottom: -0.4rem; -} - -.page-container .content .table { - width: 100%; - text-align: left; - font-size: 14px; - margin: 10px 0; - border-collapse: collapse; -} -.page-container .content .table th, -.page-container .content .table td { - color: #333; - padding: 12px; - border: 1px solid #ddd; - vertical-align: top; -} -.page-container .content .table th { - background-color: #eee; -} -.page-container .content .table td:first-child { - width: 15%; -} -.page-container .content blockquote { - border-left: 4px solid var(--theme-color, #42b983); - color: #858585; - margin: 2em 0; - padding-left: 20px; -} - -.demo-popover-class1 { - background: #eee !important; -} -.demo-popover-class2 { - background: #999 !important; -} - -/* hightline */ -.page-main.noborder .content > h2:first-of-type { - border-bottom: 0; - margin-bottom: 0; -} - -.page-main.noborder .content > p.overviewicon { - margin-right: 20px; -} - -.page-main:not(.noborder) .content > h2 { - width: 100%; -} - -.content > h2:not(:first-of-type) { - margin-top: 36px; -} - -.content .badge.warn { - border-left: 0; - margin: 0; -} - -.content > h2 { - font-size: 1.65rem; - padding-bottom: 0.3rem; - margin-bottom: 16px; - text-indent: -1px; -} - -.content > h3 { - margin: 40px 0 20px 0; - padding-bottom: 0.3rem; - border-bottom: 1px solid #eaecef; -} - -.content > h4 { - font-size: 20px; - padding-top: 24px; -} - -.content > p > code { - font-size: 14px; -} - -.content > p > strong { - color: #2c3e50; -} - -.content pre code { - font-size: 14px; - font-family: 'source-code-pro', 'Menlo', 'Monaco', 'Consolas', 'Courier New', - 'monospace'; -} - -.content pre code.hljs { - padding: 18px; - border-radius: 6px; -} - -.content .apiBox pre.preview-code { - background-color: transparent; -} - -.content .visual-editor pre { - background-color: transparent; - padding: 0; - font-size: 14px; -} - -.content > ul > li { - color: #5e6d82; -} - -.content .apiContainer ul, -.content .visual-editor ul, -.content .attrContainer ul { - list-style: none; - margin: 0; - padding: 0; -} - -.content .float-css ul { - font-size: 14px; - margin: 0; - padding: 0; -} - -.content .box_all ul { - margin: 0; -} - -.content .logBox ul { - list-style: none; -} - -.content ul ul { - list-style-type: circle; -} - -.content .visual-editor ul { - font-size: 12px; -} - -.content .hae-carousel ul { - padding: 0 4px; - line-height: 1.42857143; - font-family: Helvetica, Arial, 'microsoft yahei'; -} - -.content a.hae-icon.outer-link:hover, -.content p a:hover { - text-decoration: underline; -} - -.content a.hae-icon.outer-link::after { - content: '\E840'; - font-size: 12px; - color: #999; - position: relative; - top: -6px; - left: 2px; -} - -.content > .custom-block > p { - margin: 16px 0; -} - -.content div[class*='language-'] { - position: relative; - background-color: #282c34; - border-radius: 6px; -} - -.custom-block.danger, -.custom-block.tip, -.custom-block.warning { - padding: 0.1rem 1.5rem; - border-left-width: 0.5rem; - border-left-style: solid; - margin: 1rem 0; -} - -.content .custom-block.tip { - background-color: #f3f5f7; - border-color: #42b983; - border-radius: 0; -} - -.content .custom-block.warning { - background-color: rgba(255, 229, 100, 0.3); - border-color: #e7c000; - color: #6b5900; -} - -.content .custom-block.warning .custom-block-title { - color: #b29400; -} - -.content .custom-block.danger { - background-color: #ffe6e6; - border-color: #c00; - color: #4d0000; -} - -.content .custom-block.danger .custom-block-title { - color: #900; -} - -div[class*='language-'] .highlight-lines { - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - padding-top: 1.3rem; - position: absolute; - top: 0; - left: 0; - width: 100%; - line-height: 1.7; -} - -div[class*='language-'] .highlight-lines .highlighted { - background-color: rgba(0, 0, 0, 0.66); -} - -div[class*='language-'] pre, -div[class*='language-'] pre[class*='language-'] { - background: transparent; - position: relative; - z-index: 1; -} - -.content pre, -.content pre[class*='language-'] { - line-height: 1.4; - padding: 1.25rem 1.5rem; - margin: 0.85rem 0; - background-color: #282c34; - border-radius: 6px; - overflow: auto; -} - -.content pre[class*='language-'] code, -.content pre code { - color: #fff; - padding: 0; - background-color: transparent; - border-radius: 0; - line-height: 1.42857143; -} - -.token.atrule, -.token.builtin, -.token.important, -.token.keyword, -.token.selector { - color: #cc99cd; -} - -.token.punctuation { - color: #ccc; -} - -.token.boolean, -.token.function, -.token.number { - color: #f08d49; -} - -.token.attr-value, -.token.char, -.token.regex, -.token.string, -.token.variable { - color: #7ec699; -} - -.token.entity, -.token.operator, -.token.url { - color: #67cdcc; -} - -.token.block-comment, -.token.cdata, -.token.comment, -.token.doctype, -.token.prolog { - color: #999; -} - -.token.attr-name, -.token.deleted, -.token.namespace, -.token.tag { - color: #e2777a; -} - -.token.function-name { - color: #6196cc; -} - -.token.class-name, -.token.constant, -.token.property, -.token.symbol { - color: #f8c555; -} - -.token.bold, -.token.important { - font-weight: 700; -} - -.token.italic { - font-style: italic; -} - -.token.entity { - cursor: help; -} - -.token.inserted { - color: green; -} diff --git a/example/src/components/Home.vue b/example/src/components/Home.vue deleted file mode 100644 index 582e0573b..000000000 --- a/example/src/components/Home.vue +++ /dev/null @@ -1,177 +0,0 @@ - - - - - - - diff --git a/example/src/const.js b/example/src/const.js deleted file mode 100644 index baa26cb76..000000000 --- a/example/src/const.js +++ /dev/null @@ -1,16 +0,0 @@ -import { tinyImpressionTheme, tinyInfinityTheme, tinyDeepTheme, tinyGalaxyTheme } from '@opentiny/vue-theme/theme' - -export const CURRENT_THEME_KEY = 'tiny-current-theme' -export const DEFAULT_THEME = 'tiny-default-theme' -export const IMPRESSION_THEME = 'tiny-impression-theme' -export const INFINITY_THEME = 'tiny-infinity-theme' -export const DEEP_THEME = 'tiny-deep-theme' -export const GALAXY_THEME = 'tiny-galaxy-theme' - -export const THEME_MAP = { - [DEFAULT_THEME]: null, - [IMPRESSION_THEME]: tinyImpressionTheme, - [INFINITY_THEME]: tinyInfinityTheme, - [DEEP_THEME]: tinyDeepTheme, - [GALAXY_THEME]: tinyGalaxyTheme -} diff --git a/example/src/demo/mobile/action-sheet/actionsheet.vue b/example/src/demo/mobile/action-sheet/actionsheet.vue deleted file mode 100644 index 6cf3fc1db..000000000 --- a/example/src/demo/mobile/action-sheet/actionsheet.vue +++ /dev/null @@ -1,90 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/action-sheet/slot-action.vue b/example/src/demo/mobile/action-sheet/slot-action.vue deleted file mode 100644 index 4dfe7d634..000000000 --- a/example/src/demo/mobile/action-sheet/slot-action.vue +++ /dev/null @@ -1,74 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/action-sheet/slot-item.vue b/example/src/demo/mobile/action-sheet/slot-item.vue deleted file mode 100644 index e0a1de08d..000000000 --- a/example/src/demo/mobile/action-sheet/slot-item.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/alert/base.vue b/example/src/demo/mobile/alert/base.vue deleted file mode 100644 index cf0944a01..000000000 --- a/example/src/demo/mobile/alert/base.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/alert/icon.vue b/example/src/demo/mobile/alert/icon.vue deleted file mode 100644 index 435458c02..000000000 --- a/example/src/demo/mobile/alert/icon.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/alert/size.vue b/example/src/demo/mobile/alert/size.vue deleted file mode 100644 index 6cf62668b..000000000 --- a/example/src/demo/mobile/alert/size.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/alert/slot-default.vue b/example/src/demo/mobile/alert/slot-default.vue deleted file mode 100644 index ac6f84c5d..000000000 --- a/example/src/demo/mobile/alert/slot-default.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/avatar/base.vue b/example/src/demo/mobile/avatar/base.vue deleted file mode 100644 index 3334d563c..000000000 --- a/example/src/demo/mobile/avatar/base.vue +++ /dev/null @@ -1,97 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/badge/base.vue b/example/src/demo/mobile/badge/base.vue deleted file mode 100644 index 52a803cf2..000000000 --- a/example/src/demo/mobile/badge/base.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/badge/href-target.vue b/example/src/demo/mobile/badge/href-target.vue deleted file mode 100644 index 63f14a1f0..000000000 --- a/example/src/demo/mobile/badge/href-target.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/badge/is-dot.vue b/example/src/demo/mobile/badge/is-dot.vue deleted file mode 100644 index 3c4fdcbf9..000000000 --- a/example/src/demo/mobile/badge/is-dot.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/badge/type.vue b/example/src/demo/mobile/badge/type.vue deleted file mode 100644 index 342c23786..000000000 --- a/example/src/demo/mobile/badge/type.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/button/base.vue b/example/src/demo/mobile/button/base.vue deleted file mode 100644 index dfbd37b7c..000000000 --- a/example/src/demo/mobile/button/base.vue +++ /dev/null @@ -1,131 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/button/event-click.vue b/example/src/demo/mobile/button/event-click.vue deleted file mode 100644 index 6fa2af88a..000000000 --- a/example/src/demo/mobile/button/event-click.vue +++ /dev/null @@ -1,30 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/button/icon.vue b/example/src/demo/mobile/button/icon.vue deleted file mode 100644 index d383b956f..000000000 --- a/example/src/demo/mobile/button/icon.vue +++ /dev/null @@ -1,41 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/button/loading.vue b/example/src/demo/mobile/button/loading.vue deleted file mode 100644 index 3a9fa65d4..000000000 --- a/example/src/demo/mobile/button/loading.vue +++ /dev/null @@ -1,33 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/button/plain.vue b/example/src/demo/mobile/button/plain.vue deleted file mode 100644 index b4851d789..000000000 --- a/example/src/demo/mobile/button/plain.vue +++ /dev/null @@ -1,33 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/button/reset-time.vue b/example/src/demo/mobile/button/reset-time.vue deleted file mode 100644 index c54c73aae..000000000 --- a/example/src/demo/mobile/button/reset-time.vue +++ /dev/null @@ -1,38 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/button/round.vue b/example/src/demo/mobile/button/round.vue deleted file mode 100644 index 2ac83ffae..000000000 --- a/example/src/demo/mobile/button/round.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/button/text.vue b/example/src/demo/mobile/button/text.vue deleted file mode 100644 index 8b1219ecd..000000000 --- a/example/src/demo/mobile/button/text.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/checkbox-group/base.vue b/example/src/demo/mobile/checkbox-group/base.vue deleted file mode 100644 index db543254f..000000000 --- a/example/src/demo/mobile/checkbox-group/base.vue +++ /dev/null @@ -1,30 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/checkbox-group/disabled.vue b/example/src/demo/mobile/checkbox-group/disabled.vue deleted file mode 100644 index f3be19c3e..000000000 --- a/example/src/demo/mobile/checkbox-group/disabled.vue +++ /dev/null @@ -1,30 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/checkbox-group/event-change.vue b/example/src/demo/mobile/checkbox-group/event-change.vue deleted file mode 100644 index e822639d9..000000000 --- a/example/src/demo/mobile/checkbox-group/event-change.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/checkbox-group/min-max.vue b/example/src/demo/mobile/checkbox-group/min-max.vue deleted file mode 100644 index cd65329ae..000000000 --- a/example/src/demo/mobile/checkbox-group/min-max.vue +++ /dev/null @@ -1,30 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/checkbox-group/vertical.vue b/example/src/demo/mobile/checkbox-group/vertical.vue deleted file mode 100644 index 019dcb8b1..000000000 --- a/example/src/demo/mobile/checkbox-group/vertical.vue +++ /dev/null @@ -1,30 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/checkbox/base.vue b/example/src/demo/mobile/checkbox/base.vue deleted file mode 100644 index d434b352b..000000000 --- a/example/src/demo/mobile/checkbox/base.vue +++ /dev/null @@ -1,99 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/checkbox/event-change.vue b/example/src/demo/mobile/checkbox/event-change.vue deleted file mode 100644 index 9c472dca2..000000000 --- a/example/src/demo/mobile/checkbox/event-change.vue +++ /dev/null @@ -1,30 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/checkbox/indeterminate.vue b/example/src/demo/mobile/checkbox/indeterminate.vue deleted file mode 100644 index c9274f5ba..000000000 --- a/example/src/demo/mobile/checkbox/indeterminate.vue +++ /dev/null @@ -1,54 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/checkbox/label.vue b/example/src/demo/mobile/checkbox/label.vue deleted file mode 100644 index f204d1975..000000000 --- a/example/src/demo/mobile/checkbox/label.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/components.js b/example/src/demo/mobile/components.js deleted file mode 100644 index d9cde9704..000000000 --- a/example/src/demo/mobile/components.js +++ /dev/null @@ -1,13 +0,0 @@ -export default { - alert: { - Attributes: { - type: 'base' - }, - Events: { - close: 'base' - }, - Slots: { - default: 'base' - } - } -} diff --git a/example/src/demo/mobile/dialog-box/base.vue b/example/src/demo/mobile/dialog-box/base.vue deleted file mode 100644 index 8ce005918..000000000 --- a/example/src/demo/mobile/dialog-box/base.vue +++ /dev/null @@ -1,71 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/dialog-box/close-on-click-modal.vue b/example/src/demo/mobile/dialog-box/close-on-click-modal.vue deleted file mode 100644 index d949c213d..000000000 --- a/example/src/demo/mobile/dialog-box/close-on-click-modal.vue +++ /dev/null @@ -1,24 +0,0 @@ - - - diff --git a/example/src/demo/mobile/dialog-box/lock-scroll.vue b/example/src/demo/mobile/dialog-box/lock-scroll.vue deleted file mode 100644 index 536df0dca..000000000 --- a/example/src/demo/mobile/dialog-box/lock-scroll.vue +++ /dev/null @@ -1,24 +0,0 @@ - - - diff --git a/example/src/demo/mobile/dialog-box/slot-footer.vue b/example/src/demo/mobile/dialog-box/slot-footer.vue deleted file mode 100644 index 668c29c73..000000000 --- a/example/src/demo/mobile/dialog-box/slot-footer.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/mobile/dropdown-menu/direction.vue b/example/src/demo/mobile/dropdown-menu/direction.vue deleted file mode 100644 index 3c048f985..000000000 --- a/example/src/demo/mobile/dropdown-menu/direction.vue +++ /dev/null @@ -1,64 +0,0 @@ - - - diff --git a/example/src/demo/mobile/dropdown-menu/dropdown-filter.vue b/example/src/demo/mobile/dropdown-menu/dropdown-filter.vue deleted file mode 100644 index 551f19d28..000000000 --- a/example/src/demo/mobile/dropdown-menu/dropdown-filter.vue +++ /dev/null @@ -1,77 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/dropdown-menu/duration.vue b/example/src/demo/mobile/dropdown-menu/duration.vue deleted file mode 100644 index 14b071915..000000000 --- a/example/src/demo/mobile/dropdown-menu/duration.vue +++ /dev/null @@ -1,64 +0,0 @@ - - - diff --git a/example/src/demo/mobile/dropdown-menu/event.vue b/example/src/demo/mobile/dropdown-menu/event.vue deleted file mode 100644 index 9a941c60f..000000000 --- a/example/src/demo/mobile/dropdown-menu/event.vue +++ /dev/null @@ -1,87 +0,0 @@ - - - diff --git a/example/src/demo/mobile/dropdown-menu/icon.vue b/example/src/demo/mobile/dropdown-menu/icon.vue deleted file mode 100644 index 0c048371e..000000000 --- a/example/src/demo/mobile/dropdown-menu/icon.vue +++ /dev/null @@ -1,30 +0,0 @@ - - - diff --git a/example/src/demo/mobile/dropdown-menu/slot.vue b/example/src/demo/mobile/dropdown-menu/slot.vue deleted file mode 100644 index 23d041949..000000000 --- a/example/src/demo/mobile/dropdown-menu/slot.vue +++ /dev/null @@ -1,83 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/dropdown-menu/type.vue b/example/src/demo/mobile/dropdown-menu/type.vue deleted file mode 100644 index c0bcc3c3b..000000000 --- a/example/src/demo/mobile/dropdown-menu/type.vue +++ /dev/null @@ -1,64 +0,0 @@ - - - diff --git a/example/src/demo/mobile/exception/exceptionClass.vue b/example/src/demo/mobile/exception/exceptionClass.vue deleted file mode 100644 index a9ca63c24..000000000 --- a/example/src/demo/mobile/exception/exceptionClass.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/mobile/exception/message.vue b/example/src/demo/mobile/exception/message.vue deleted file mode 100644 index 12b0dba8b..000000000 --- a/example/src/demo/mobile/exception/message.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/mobile/exception/type.vue b/example/src/demo/mobile/exception/type.vue deleted file mode 100644 index 4e47a0f60..000000000 --- a/example/src/demo/mobile/exception/type.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/abort-quest.vue b/example/src/demo/mobile/file-upload/abort-quest.vue deleted file mode 100644 index 6eae04c26..000000000 --- a/example/src/demo/mobile/file-upload/abort-quest.vue +++ /dev/null @@ -1,36 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/accept-file-image.vue b/example/src/demo/mobile/file-upload/accept-file-image.vue deleted file mode 100644 index 330453b98..000000000 --- a/example/src/demo/mobile/file-upload/accept-file-image.vue +++ /dev/null @@ -1,24 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/accept-file-type.vue b/example/src/demo/mobile/file-upload/accept-file-type.vue deleted file mode 100644 index c15497b10..000000000 --- a/example/src/demo/mobile/file-upload/accept-file-type.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/accept-file.vue b/example/src/demo/mobile/file-upload/accept-file.vue deleted file mode 100644 index f89d7792a..000000000 --- a/example/src/demo/mobile/file-upload/accept-file.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/base.vue b/example/src/demo/mobile/file-upload/base.vue deleted file mode 100644 index 21e8ff729..000000000 --- a/example/src/demo/mobile/file-upload/base.vue +++ /dev/null @@ -1,50 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/file-upload/basic-usage.vue b/example/src/demo/mobile/file-upload/basic-usage.vue deleted file mode 100644 index 2539f44f9..000000000 --- a/example/src/demo/mobile/file-upload/basic-usage.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/file-upload/clear-files.vue b/example/src/demo/mobile/file-upload/clear-files.vue deleted file mode 100644 index 1ccc3ce11..000000000 --- a/example/src/demo/mobile/file-upload/clear-files.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/custom-prefix.vue b/example/src/demo/mobile/file-upload/custom-prefix.vue deleted file mode 100644 index 836c61bbe..000000000 --- a/example/src/demo/mobile/file-upload/custom-prefix.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/custom-trigger.vue b/example/src/demo/mobile/file-upload/custom-trigger.vue deleted file mode 100644 index 3964cc0e5..000000000 --- a/example/src/demo/mobile/file-upload/custom-trigger.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/custom-upload-request.vue b/example/src/demo/mobile/file-upload/custom-upload-request.vue deleted file mode 100644 index 6da622983..000000000 --- a/example/src/demo/mobile/file-upload/custom-upload-request.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/custom-upload-tip.vue b/example/src/demo/mobile/file-upload/custom-upload-tip.vue deleted file mode 100644 index b88c24f34..000000000 --- a/example/src/demo/mobile/file-upload/custom-upload-tip.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/data.vue b/example/src/demo/mobile/file-upload/data.vue deleted file mode 100644 index f9010b3e2..000000000 --- a/example/src/demo/mobile/file-upload/data.vue +++ /dev/null @@ -1,47 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/file-upload/drag-select-file.vue b/example/src/demo/mobile/file-upload/drag-select-file.vue deleted file mode 100644 index 0c25502bb..000000000 --- a/example/src/demo/mobile/file-upload/drag-select-file.vue +++ /dev/null @@ -1,33 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/drag-upload.vue b/example/src/demo/mobile/file-upload/drag-upload.vue deleted file mode 100644 index 467fc7791..000000000 --- a/example/src/demo/mobile/file-upload/drag-upload.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/dynamic-disable.vue b/example/src/demo/mobile/file-upload/dynamic-disable.vue deleted file mode 100644 index c97d6df07..000000000 --- a/example/src/demo/mobile/file-upload/dynamic-disable.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/file-picture-card.vue b/example/src/demo/mobile/file-upload/file-picture-card.vue deleted file mode 100644 index 1c7e78231..000000000 --- a/example/src/demo/mobile/file-upload/file-picture-card.vue +++ /dev/null @@ -1,76 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/image-size.vue b/example/src/demo/mobile/file-upload/image-size.vue deleted file mode 100644 index 7fe1b3a3f..000000000 --- a/example/src/demo/mobile/file-upload/image-size.vue +++ /dev/null @@ -1,42 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/jalor-request.vue b/example/src/demo/mobile/file-upload/jalor-request.vue deleted file mode 100644 index 43f6bc784..000000000 --- a/example/src/demo/mobile/file-upload/jalor-request.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/manual-upload.vue b/example/src/demo/mobile/file-upload/manual-upload.vue deleted file mode 100644 index 3df591573..000000000 --- a/example/src/demo/mobile/file-upload/manual-upload.vue +++ /dev/null @@ -1,30 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/max-file-count.vue b/example/src/demo/mobile/file-upload/max-file-count.vue deleted file mode 100644 index 3d27e8073..000000000 --- a/example/src/demo/mobile/file-upload/max-file-count.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/mini-mode.vue b/example/src/demo/mobile/file-upload/mini-mode.vue deleted file mode 100644 index 04a50d880..000000000 --- a/example/src/demo/mobile/file-upload/mini-mode.vue +++ /dev/null @@ -1,30 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/multiple-file.vue b/example/src/demo/mobile/file-upload/multiple-file.vue deleted file mode 100644 index 955c8921b..000000000 --- a/example/src/demo/mobile/file-upload/multiple-file.vue +++ /dev/null @@ -1,24 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/picture-card.vue b/example/src/demo/mobile/file-upload/picture-card.vue deleted file mode 100644 index 278ddbe66..000000000 --- a/example/src/demo/mobile/file-upload/picture-card.vue +++ /dev/null @@ -1,88 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/file-upload/picture-list.vue b/example/src/demo/mobile/file-upload/picture-list.vue deleted file mode 100644 index 4a442eeb8..000000000 --- a/example/src/demo/mobile/file-upload/picture-list.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/prevent-delete-file.vue b/example/src/demo/mobile/file-upload/prevent-delete-file.vue deleted file mode 100644 index c776b0947..000000000 --- a/example/src/demo/mobile/file-upload/prevent-delete-file.vue +++ /dev/null @@ -1,41 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/prevent-upload-file.vue b/example/src/demo/mobile/file-upload/prevent-upload-file.vue deleted file mode 100644 index 951bd784e..000000000 --- a/example/src/demo/mobile/file-upload/prevent-upload-file.vue +++ /dev/null @@ -1,41 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/size.vue b/example/src/demo/mobile/file-upload/size.vue deleted file mode 100644 index c52607dea..000000000 --- a/example/src/demo/mobile/file-upload/size.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/upload-events.vue b/example/src/demo/mobile/file-upload/upload-events.vue deleted file mode 100644 index bac16e36d..000000000 --- a/example/src/demo/mobile/file-upload/upload-events.vue +++ /dev/null @@ -1,71 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/upload-file-filters.vue b/example/src/demo/mobile/file-upload/upload-file-filters.vue deleted file mode 100644 index b32669407..000000000 --- a/example/src/demo/mobile/file-upload/upload-file-filters.vue +++ /dev/null @@ -1,42 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/upload-file-list.vue b/example/src/demo/mobile/file-upload/upload-file-list.vue deleted file mode 100644 index eac72a57b..000000000 --- a/example/src/demo/mobile/file-upload/upload-file-list.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/upload-limit.vue b/example/src/demo/mobile/file-upload/upload-limit.vue deleted file mode 100644 index d25aa3f17..000000000 --- a/example/src/demo/mobile/file-upload/upload-limit.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/upload-request.vue b/example/src/demo/mobile/file-upload/upload-request.vue deleted file mode 100644 index b834864b5..000000000 --- a/example/src/demo/mobile/file-upload/upload-request.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - diff --git a/example/src/demo/mobile/file-upload/upload-user-head.vue b/example/src/demo/mobile/file-upload/upload-user-head.vue deleted file mode 100644 index da8bfcacd..000000000 --- a/example/src/demo/mobile/file-upload/upload-user-head.vue +++ /dev/null @@ -1,42 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/form/base.vue b/example/src/demo/mobile/form/base.vue deleted file mode 100644 index 03989f62a..000000000 --- a/example/src/demo/mobile/form/base.vue +++ /dev/null @@ -1,116 +0,0 @@ - - - - - - - diff --git a/example/src/demo/mobile/icon/base.vue b/example/src/demo/mobile/icon/base.vue deleted file mode 100644 index 4e0ff03de..000000000 --- a/example/src/demo/mobile/icon/base.vue +++ /dev/null @@ -1,78 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/image-viewer/base.vue b/example/src/demo/mobile/image-viewer/base.vue deleted file mode 100644 index 9aba2527d..000000000 --- a/example/src/demo/mobile/image-viewer/base.vue +++ /dev/null @@ -1,36 +0,0 @@ - - - diff --git a/example/src/demo/mobile/index.js b/example/src/demo/mobile/index.js deleted file mode 100644 index 109fa0b4c..000000000 --- a/example/src/demo/mobile/index.js +++ /dev/null @@ -1,3 +0,0 @@ -import Components from './components' - -export const getDemoCode = ({ component, type: typeStr, name }) => `${component}/${Components[component][typeStr][name]}` diff --git a/example/src/demo/mobile/input/autofocus.vue b/example/src/demo/mobile/input/autofocus.vue deleted file mode 100644 index a0cef8415..000000000 --- a/example/src/demo/mobile/input/autofocus.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/input/autosize.vue b/example/src/demo/mobile/input/autosize.vue deleted file mode 100644 index 7aab76bc9..000000000 --- a/example/src/demo/mobile/input/autosize.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/input/base.vue b/example/src/demo/mobile/input/base.vue deleted file mode 100644 index bc236194f..000000000 --- a/example/src/demo/mobile/input/base.vue +++ /dev/null @@ -1,63 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/input/clearable.vue b/example/src/demo/mobile/input/clearable.vue deleted file mode 100644 index ed7b0c3f2..000000000 --- a/example/src/demo/mobile/input/clearable.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/input/counter.vue b/example/src/demo/mobile/input/counter.vue deleted file mode 100644 index 10531a948..000000000 --- a/example/src/demo/mobile/input/counter.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/input/events.vue b/example/src/demo/mobile/input/events.vue deleted file mode 100644 index bb8b0b803..000000000 --- a/example/src/demo/mobile/input/events.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/input/form.vue b/example/src/demo/mobile/input/form.vue deleted file mode 100644 index a0a2e03a9..000000000 --- a/example/src/demo/mobile/input/form.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/input/method-select.vue b/example/src/demo/mobile/input/method-select.vue deleted file mode 100644 index 875204952..000000000 --- a/example/src/demo/mobile/input/method-select.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/input/props-step.vue b/example/src/demo/mobile/input/props-step.vue deleted file mode 100644 index b83b5fb2f..000000000 --- a/example/src/demo/mobile/input/props-step.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/input/show-password.vue b/example/src/demo/mobile/input/show-password.vue deleted file mode 100644 index 53219a5c2..000000000 --- a/example/src/demo/mobile/input/show-password.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/input/slot-content.vue b/example/src/demo/mobile/input/slot-content.vue deleted file mode 100644 index ff81a5eaf..000000000 --- a/example/src/demo/mobile/input/slot-content.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/input/suffix-icon.vue b/example/src/demo/mobile/input/suffix-icon.vue deleted file mode 100644 index 40809fa64..000000000 --- a/example/src/demo/mobile/input/suffix-icon.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/input/validate-event.vue b/example/src/demo/mobile/input/validate-event.vue deleted file mode 100644 index eefaf3de2..000000000 --- a/example/src/demo/mobile/input/validate-event.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/list/base.vue b/example/src/demo/mobile/list/base.vue deleted file mode 100644 index 4b93521ab..000000000 --- a/example/src/demo/mobile/list/base.vue +++ /dev/null @@ -1,39 +0,0 @@ - - - diff --git a/example/src/demo/mobile/list/slots.vue b/example/src/demo/mobile/list/slots.vue deleted file mode 100644 index 5bf5b6587..000000000 --- a/example/src/demo/mobile/list/slots.vue +++ /dev/null @@ -1,55 +0,0 @@ - - - diff --git a/example/src/demo/mobile/loading/base.vue b/example/src/demo/mobile/loading/base.vue deleted file mode 100644 index 5ef040444..000000000 --- a/example/src/demo/mobile/loading/base.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - \ No newline at end of file diff --git a/example/src/demo/mobile/loading/type.vue b/example/src/demo/mobile/loading/type.vue deleted file mode 100644 index d4ba08b34..000000000 --- a/example/src/demo/mobile/loading/type.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - \ No newline at end of file diff --git a/example/src/demo/mobile/mini-picker/change.vue b/example/src/demo/mobile/mini-picker/change.vue deleted file mode 100644 index 8c3ce3c4f..000000000 --- a/example/src/demo/mobile/mini-picker/change.vue +++ /dev/null @@ -1,37 +0,0 @@ - - - diff --git a/example/src/demo/mobile/mini-picker/methods.vue b/example/src/demo/mobile/mini-picker/methods.vue deleted file mode 100644 index e5ff776f0..000000000 --- a/example/src/demo/mobile/mini-picker/methods.vue +++ /dev/null @@ -1,41 +0,0 @@ - - - diff --git a/example/src/demo/mobile/mini-picker/minipicker.vue b/example/src/demo/mobile/mini-picker/minipicker.vue deleted file mode 100644 index 5cabf006e..000000000 --- a/example/src/demo/mobile/mini-picker/minipicker.vue +++ /dev/null @@ -1,64 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/nav-bar/base.vue b/example/src/demo/mobile/nav-bar/base.vue deleted file mode 100644 index a47c1234c..000000000 --- a/example/src/demo/mobile/nav-bar/base.vue +++ /dev/null @@ -1,16 +0,0 @@ - - - diff --git a/example/src/demo/mobile/nav-bar/slots.vue b/example/src/demo/mobile/nav-bar/slots.vue deleted file mode 100644 index e946952a0..000000000 --- a/example/src/demo/mobile/nav-bar/slots.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/mobile/numeric/controls-position.vue b/example/src/demo/mobile/numeric/controls-position.vue deleted file mode 100644 index dc99539ad..000000000 --- a/example/src/demo/mobile/numeric/controls-position.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/example/src/demo/mobile/numeric/controls.vue b/example/src/demo/mobile/numeric/controls.vue deleted file mode 100644 index 9c2722b15..000000000 --- a/example/src/demo/mobile/numeric/controls.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/mobile/numeric/event.vue b/example/src/demo/mobile/numeric/event.vue deleted file mode 100644 index 329aa10e4..000000000 --- a/example/src/demo/mobile/numeric/event.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/mobile/numeric/max.vue b/example/src/demo/mobile/numeric/max.vue deleted file mode 100644 index 4df1784aa..000000000 --- a/example/src/demo/mobile/numeric/max.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/example/src/demo/mobile/numeric/numeric.vue b/example/src/demo/mobile/numeric/numeric.vue deleted file mode 100644 index 89352b30b..000000000 --- a/example/src/demo/mobile/numeric/numeric.vue +++ /dev/null @@ -1,60 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/numeric/placeholder.vue b/example/src/demo/mobile/numeric/placeholder.vue deleted file mode 100644 index dd509a4f8..000000000 --- a/example/src/demo/mobile/numeric/placeholder.vue +++ /dev/null @@ -1,60 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/numeric/precision.vue b/example/src/demo/mobile/numeric/precision.vue deleted file mode 100644 index dd7c660cd..000000000 --- a/example/src/demo/mobile/numeric/precision.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/example/src/demo/mobile/numeric/size.vue b/example/src/demo/mobile/numeric/size.vue deleted file mode 100644 index ec5b31ae7..000000000 --- a/example/src/demo/mobile/numeric/size.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/mobile/numeric/step.vue b/example/src/demo/mobile/numeric/step.vue deleted file mode 100644 index 043b637f9..000000000 --- a/example/src/demo/mobile/numeric/step.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/example/src/demo/mobile/package.json b/example/src/demo/mobile/package.json deleted file mode 100644 index 5814ccc5f..000000000 --- a/example/src/demo/mobile/package.json +++ /dev/null @@ -1,11 +0,0 @@ -{ - "name": "@opentiny/vue-mobile-example", - "version": "0.0.3", - "description": "TINY vue mobile example", - "main": "index.js", - "scripts": { - "test": "echo \"Error: no test specified\" && exit 1" - }, - "author": "", - "license": "ISC" -} diff --git a/example/src/demo/mobile/popover/base.vue b/example/src/demo/mobile/popover/base.vue deleted file mode 100644 index 94e64a347..000000000 --- a/example/src/demo/mobile/popover/base.vue +++ /dev/null @@ -1,104 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/popover/direction.vue b/example/src/demo/mobile/popover/direction.vue deleted file mode 100644 index 63201dcc5..000000000 --- a/example/src/demo/mobile/popover/direction.vue +++ /dev/null @@ -1,102 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/progress/base.vue b/example/src/demo/mobile/progress/base.vue deleted file mode 100644 index a3d9542cf..000000000 --- a/example/src/demo/mobile/progress/base.vue +++ /dev/null @@ -1,60 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/progress/basic-usage.vue b/example/src/demo/mobile/progress/basic-usage.vue deleted file mode 100644 index b8a607aaa..000000000 --- a/example/src/demo/mobile/progress/basic-usage.vue +++ /dev/null @@ -1,54 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/progress/custom-color.vue b/example/src/demo/mobile/progress/custom-color.vue deleted file mode 100644 index 4f5fd6927..000000000 --- a/example/src/demo/mobile/progress/custom-color.vue +++ /dev/null @@ -1,43 +0,0 @@ - - - diff --git a/example/src/demo/mobile/progress/dynamic-control-changes.vue b/example/src/demo/mobile/progress/dynamic-control-changes.vue deleted file mode 100644 index cd8dd9e09..000000000 --- a/example/src/demo/mobile/progress/dynamic-control-changes.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - diff --git a/example/src/demo/mobile/progress/format-text.vue b/example/src/demo/mobile/progress/format-text.vue deleted file mode 100644 index 7ed778c15..000000000 --- a/example/src/demo/mobile/progress/format-text.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/progress/format.vue b/example/src/demo/mobile/progress/format.vue deleted file mode 100644 index d92241f51..000000000 --- a/example/src/demo/mobile/progress/format.vue +++ /dev/null @@ -1,59 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/progress/progress-status.vue b/example/src/demo/mobile/progress/progress-status.vue deleted file mode 100644 index 7d201d38e..000000000 --- a/example/src/demo/mobile/progress/progress-status.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/mobile/progress/progress-type-circle.vue b/example/src/demo/mobile/progress/progress-type-circle.vue deleted file mode 100644 index 1c50be4a2..000000000 --- a/example/src/demo/mobile/progress/progress-type-circle.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/progress/progress-type-dashboard.vue b/example/src/demo/mobile/progress/progress-type-dashboard.vue deleted file mode 100644 index 4277f310e..000000000 --- a/example/src/demo/mobile/progress/progress-type-dashboard.vue +++ /dev/null @@ -1,37 +0,0 @@ - - - diff --git a/example/src/demo/mobile/progress/progress-type.vue b/example/src/demo/mobile/progress/progress-type.vue deleted file mode 100644 index 4cf8366ec..000000000 --- a/example/src/demo/mobile/progress/progress-type.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/progress/progress-width.vue b/example/src/demo/mobile/progress/progress-width.vue deleted file mode 100644 index 10e8405b4..000000000 --- a/example/src/demo/mobile/progress/progress-width.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/mobile/progress/text-inside-or-no-text.vue b/example/src/demo/mobile/progress/text-inside-or-no-text.vue deleted file mode 100644 index c283dff29..000000000 --- a/example/src/demo/mobile/progress/text-inside-or-no-text.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - diff --git a/example/src/demo/mobile/progress/width.vue b/example/src/demo/mobile/progress/width.vue deleted file mode 100644 index b64b5d86d..000000000 --- a/example/src/demo/mobile/progress/width.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/radio/base.vue b/example/src/demo/mobile/radio/base.vue deleted file mode 100644 index 8d210fd5d..000000000 --- a/example/src/demo/mobile/radio/base.vue +++ /dev/null @@ -1,118 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/radio/border.vue b/example/src/demo/mobile/radio/border.vue deleted file mode 100644 index 6e353c7ac..000000000 --- a/example/src/demo/mobile/radio/border.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/radio/disabled.vue b/example/src/demo/mobile/radio/disabled.vue deleted file mode 100644 index e69e8916a..000000000 --- a/example/src/demo/mobile/radio/disabled.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/radio/event-change.vue b/example/src/demo/mobile/radio/event-change.vue deleted file mode 100644 index 23db2c5f2..000000000 --- a/example/src/demo/mobile/radio/event-change.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/search/clear.vue b/example/src/demo/mobile/search/clear.vue deleted file mode 100644 index ddb4c345b..000000000 --- a/example/src/demo/mobile/search/clear.vue +++ /dev/null @@ -1,70 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/search/default-value.vue b/example/src/demo/mobile/search/default-value.vue deleted file mode 100644 index bb31c19c9..000000000 --- a/example/src/demo/mobile/search/default-value.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/mobile/search/events.vue b/example/src/demo/mobile/search/events.vue deleted file mode 100644 index a36151a09..000000000 --- a/example/src/demo/mobile/search/events.vue +++ /dev/null @@ -1,37 +0,0 @@ - - - - diff --git a/example/src/demo/mobile/slider/about-step.vue b/example/src/demo/mobile/slider/about-step.vue deleted file mode 100644 index c3b4c5c31..000000000 --- a/example/src/demo/mobile/slider/about-step.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/slider/base.vue b/example/src/demo/mobile/slider/base.vue deleted file mode 100644 index 877284284..000000000 --- a/example/src/demo/mobile/slider/base.vue +++ /dev/null @@ -1,52 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/slider/basic-usage.vue b/example/src/demo/mobile/slider/basic-usage.vue deleted file mode 100644 index 382033df1..000000000 --- a/example/src/demo/mobile/slider/basic-usage.vue +++ /dev/null @@ -1,48 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/slider/dynamic-disable.vue b/example/src/demo/mobile/slider/dynamic-disable.vue deleted file mode 100644 index 40864576e..000000000 --- a/example/src/demo/mobile/slider/dynamic-disable.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/slider/format-tooltip.vue b/example/src/demo/mobile/slider/format-tooltip.vue deleted file mode 100644 index c9d603e07..000000000 --- a/example/src/demo/mobile/slider/format-tooltip.vue +++ /dev/null @@ -1,51 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/slider/max-min.vue b/example/src/demo/mobile/slider/max-min.vue deleted file mode 100644 index 5ef2e734d..000000000 --- a/example/src/demo/mobile/slider/max-min.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/slider/range-select.vue b/example/src/demo/mobile/slider/range-select.vue deleted file mode 100644 index 51493fe75..000000000 --- a/example/src/demo/mobile/slider/range-select.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/slider/shortcut-operation.vue b/example/src/demo/mobile/slider/shortcut-operation.vue deleted file mode 100644 index ed13a7a24..000000000 --- a/example/src/demo/mobile/slider/shortcut-operation.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/slider/show-iput.vue b/example/src/demo/mobile/slider/show-iput.vue deleted file mode 100644 index d46990073..000000000 --- a/example/src/demo/mobile/slider/show-iput.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/slider/show-tip.vue b/example/src/demo/mobile/slider/show-tip.vue deleted file mode 100644 index 5e3b46750..000000000 --- a/example/src/demo/mobile/slider/show-tip.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/slider/slider-event-change.vue b/example/src/demo/mobile/slider/slider-event-change.vue deleted file mode 100644 index 2c9801fe0..000000000 --- a/example/src/demo/mobile/slider/slider-event-change.vue +++ /dev/null @@ -1,51 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/slider/slider-event-start.vue b/example/src/demo/mobile/slider/slider-event-start.vue deleted file mode 100644 index 81ec2c6a6..000000000 --- a/example/src/demo/mobile/slider/slider-event-start.vue +++ /dev/null @@ -1,51 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/slider/slider-event-stop.vue b/example/src/demo/mobile/slider/slider-event-stop.vue deleted file mode 100644 index afa020a02..000000000 --- a/example/src/demo/mobile/slider/slider-event-stop.vue +++ /dev/null @@ -1,51 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/slider/slider-slot.vue b/example/src/demo/mobile/slider/slider-slot.vue deleted file mode 100644 index b56a85cda..000000000 --- a/example/src/demo/mobile/slider/slider-slot.vue +++ /dev/null @@ -1,50 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/slider/vertical-mode.vue b/example/src/demo/mobile/slider/vertical-mode.vue deleted file mode 100644 index 4be8f9506..000000000 --- a/example/src/demo/mobile/slider/vertical-mode.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/switch/base.vue b/example/src/demo/mobile/switch/base.vue deleted file mode 100644 index be5871d4e..000000000 --- a/example/src/demo/mobile/switch/base.vue +++ /dev/null @@ -1,78 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/switch/disabled.vue b/example/src/demo/mobile/switch/disabled.vue deleted file mode 100644 index 1906f2a06..000000000 --- a/example/src/demo/mobile/switch/disabled.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/switch/event-change.vue b/example/src/demo/mobile/switch/event-change.vue deleted file mode 100644 index fd660f5c3..000000000 --- a/example/src/demo/mobile/switch/event-change.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/tabbar/base.vue b/example/src/demo/mobile/tabbar/base.vue deleted file mode 100644 index 78c6d294a..000000000 --- a/example/src/demo/mobile/tabbar/base.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/tabbar/border.vue b/example/src/demo/mobile/tabbar/border.vue deleted file mode 100644 index 27fdba63d..000000000 --- a/example/src/demo/mobile/tabbar/border.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/mobile/tabbar/event-change.vue b/example/src/demo/mobile/tabbar/event-change.vue deleted file mode 100644 index a0e528cfe..000000000 --- a/example/src/demo/mobile/tabbar/event-change.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - diff --git a/example/src/demo/mobile/tabbar/route.vue b/example/src/demo/mobile/tabbar/route.vue deleted file mode 100644 index ecba44a55..000000000 --- a/example/src/demo/mobile/tabbar/route.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/mobile/tabs/active-color.vue b/example/src/demo/mobile/tabs/active-color.vue deleted file mode 100644 index 075f8eef7..000000000 --- a/example/src/demo/mobile/tabs/active-color.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/mobile/tabs/base.vue b/example/src/demo/mobile/tabs/base.vue deleted file mode 100644 index 1384f4b43..000000000 --- a/example/src/demo/mobile/tabs/base.vue +++ /dev/null @@ -1,48 +0,0 @@ - - - - - diff --git a/example/src/demo/mobile/tabs/before-leave.vue b/example/src/demo/mobile/tabs/before-leave.vue deleted file mode 100644 index 991d79b5b..000000000 --- a/example/src/demo/mobile/tabs/before-leave.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/mobile/time-line/slot.vue b/example/src/demo/mobile/time-line/slot.vue deleted file mode 100644 index ada8dc31c..000000000 --- a/example/src/demo/mobile/time-line/slot.vue +++ /dev/null @@ -1,93 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/action-menu/basic-usage.vue b/example/src/demo/pc/action-menu/basic-usage.vue deleted file mode 100644 index 77361dc0e..000000000 --- a/example/src/demo/pc/action-menu/basic-usage.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/action-menu/disabled.vue b/example/src/demo/pc/action-menu/disabled.vue deleted file mode 100644 index 97579dd22..000000000 --- a/example/src/demo/pc/action-menu/disabled.vue +++ /dev/null @@ -1,39 +0,0 @@ - - - diff --git a/example/src/demo/pc/action-menu/popper-class.vue b/example/src/demo/pc/action-menu/popper-class.vue deleted file mode 100644 index db9af47ce..000000000 --- a/example/src/demo/pc/action-menu/popper-class.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/action-menu/slot-item.vue b/example/src/demo/pc/action-menu/slot-item.vue deleted file mode 100644 index 1723640a2..000000000 --- a/example/src/demo/pc/action-menu/slot-item.vue +++ /dev/null @@ -1,42 +0,0 @@ - - - diff --git a/example/src/demo/pc/action-menu/text-field.vue b/example/src/demo/pc/action-menu/text-field.vue deleted file mode 100644 index 8ad421f6c..000000000 --- a/example/src/demo/pc/action-menu/text-field.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/alert/base.vue b/example/src/demo/pc/alert/base.vue deleted file mode 100644 index efce8e5a5..000000000 --- a/example/src/demo/pc/alert/base.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/alert/center.vue b/example/src/demo/pc/alert/center.vue deleted file mode 100644 index 2feb5dc64..000000000 --- a/example/src/demo/pc/alert/center.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/alert/icon.vue b/example/src/demo/pc/alert/icon.vue deleted file mode 100644 index 34a25dcc5..000000000 --- a/example/src/demo/pc/alert/icon.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - diff --git a/example/src/demo/pc/alert/size.vue b/example/src/demo/pc/alert/size.vue deleted file mode 100644 index b36b27aa7..000000000 --- a/example/src/demo/pc/alert/size.vue +++ /dev/null @@ -1,16 +0,0 @@ - - - diff --git a/example/src/demo/pc/alert/slot-default.vue b/example/src/demo/pc/alert/slot-default.vue deleted file mode 100644 index 515f9b594..000000000 --- a/example/src/demo/pc/alert/slot-default.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/alert/title.vue b/example/src/demo/pc/alert/title.vue deleted file mode 100644 index 80689d0ef..000000000 --- a/example/src/demo/pc/alert/title.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/example/src/demo/pc/alert/type.vue b/example/src/demo/pc/alert/type.vue deleted file mode 100644 index 5acf6f988..000000000 --- a/example/src/demo/pc/alert/type.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/example/src/demo/pc/amount/basic-usage.vue b/example/src/demo/pc/amount/basic-usage.vue deleted file mode 100644 index 39c903fa7..000000000 --- a/example/src/demo/pc/amount/basic-usage.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/amount/custom-service.vue b/example/src/demo/pc/amount/custom-service.vue deleted file mode 100644 index eb7636493..000000000 --- a/example/src/demo/pc/amount/custom-service.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/amount/size.vue b/example/src/demo/pc/amount/size.vue deleted file mode 100644 index 93d4b057a..000000000 --- a/example/src/demo/pc/amount/size.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/example/src/demo/pc/area/area-events.vue b/example/src/demo/pc/area/area-events.vue deleted file mode 100644 index a09ca79fb..000000000 --- a/example/src/demo/pc/area/area-events.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/pc/area/basic-usage.vue b/example/src/demo/pc/area/basic-usage.vue deleted file mode 100644 index 60345dee4..000000000 --- a/example/src/demo/pc/area/basic-usage.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/area/custom-service.vue b/example/src/demo/pc/area/custom-service.vue deleted file mode 100644 index 6afc2de4d..000000000 --- a/example/src/demo/pc/area/custom-service.vue +++ /dev/null @@ -1,157 +0,0 @@ - - - diff --git a/example/src/demo/pc/area/disabled.vue b/example/src/demo/pc/area/disabled.vue deleted file mode 100644 index dc4b04468..000000000 --- a/example/src/demo/pc/area/disabled.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - diff --git a/example/src/demo/pc/area/size.vue b/example/src/demo/pc/area/size.vue deleted file mode 100644 index 3f87ca318..000000000 --- a/example/src/demo/pc/area/size.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/autocomplete/basic-usage.vue b/example/src/demo/pc/autocomplete/basic-usage.vue deleted file mode 100644 index 4a5b57b55..000000000 --- a/example/src/demo/pc/autocomplete/basic-usage.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/autocomplete/clearable.vue b/example/src/demo/pc/autocomplete/clearable.vue deleted file mode 100644 index b7ffc4778..000000000 --- a/example/src/demo/pc/autocomplete/clearable.vue +++ /dev/null @@ -1,70 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/autocomplete/custom-icon.vue b/example/src/demo/pc/autocomplete/custom-icon.vue deleted file mode 100644 index 1eef612a6..000000000 --- a/example/src/demo/pc/autocomplete/custom-icon.vue +++ /dev/null @@ -1,79 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/autocomplete/disabled.vue b/example/src/demo/pc/autocomplete/disabled.vue deleted file mode 100644 index 8b7102bfc..000000000 --- a/example/src/demo/pc/autocomplete/disabled.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/autocomplete/hide-loading.vue b/example/src/demo/pc/autocomplete/hide-loading.vue deleted file mode 100644 index fcd453941..000000000 --- a/example/src/demo/pc/autocomplete/hide-loading.vue +++ /dev/null @@ -1,70 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/autocomplete/popper-class.vue b/example/src/demo/pc/autocomplete/popper-class.vue deleted file mode 100644 index 2adecd23f..000000000 --- a/example/src/demo/pc/autocomplete/popper-class.vue +++ /dev/null @@ -1,98 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/autocomplete/remote-search.vue b/example/src/demo/pc/autocomplete/remote-search.vue deleted file mode 100644 index 938656e90..000000000 --- a/example/src/demo/pc/autocomplete/remote-search.vue +++ /dev/null @@ -1,79 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/autocomplete/size.vue b/example/src/demo/pc/autocomplete/size.vue deleted file mode 100644 index a914caa81..000000000 --- a/example/src/demo/pc/autocomplete/size.vue +++ /dev/null @@ -1,70 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/badge/base.vue b/example/src/demo/pc/badge/base.vue deleted file mode 100644 index 71e89d794..000000000 --- a/example/src/demo/pc/badge/base.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/badge/is-dot.vue b/example/src/demo/pc/badge/is-dot.vue deleted file mode 100644 index 658d00730..000000000 --- a/example/src/demo/pc/badge/is-dot.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/badge/max.vue b/example/src/demo/pc/badge/max.vue deleted file mode 100644 index d64c543d7..000000000 --- a/example/src/demo/pc/badge/max.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/badge/slot-content.vue b/example/src/demo/pc/badge/slot-content.vue deleted file mode 100644 index 825e5b351..000000000 --- a/example/src/demo/pc/badge/slot-content.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/badge/slot-default.vue b/example/src/demo/pc/badge/slot-default.vue deleted file mode 100644 index 1c1273716..000000000 --- a/example/src/demo/pc/badge/slot-default.vue +++ /dev/null @@ -1,17 +0,0 @@ - - - diff --git a/example/src/demo/pc/badge/target.vue b/example/src/demo/pc/badge/target.vue deleted file mode 100644 index ea17d9045..000000000 --- a/example/src/demo/pc/badge/target.vue +++ /dev/null @@ -1,17 +0,0 @@ - - - diff --git a/example/src/demo/pc/badge/type.vue b/example/src/demo/pc/badge/type.vue deleted file mode 100644 index d1e008fae..000000000 --- a/example/src/demo/pc/badge/type.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - diff --git a/example/src/demo/pc/breadcrumb/base.vue b/example/src/demo/pc/breadcrumb/base.vue deleted file mode 100644 index f4def7e22..000000000 --- a/example/src/demo/pc/breadcrumb/base.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - diff --git a/example/src/demo/pc/breadcrumb/options.vue b/example/src/demo/pc/breadcrumb/options.vue deleted file mode 100644 index 7fa39fa67..000000000 --- a/example/src/demo/pc/breadcrumb/options.vue +++ /dev/null @@ -1,65 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/breadcrumb/slot-default.vue b/example/src/demo/pc/breadcrumb/slot-default.vue deleted file mode 100644 index f333ea3ac..000000000 --- a/example/src/demo/pc/breadcrumb/slot-default.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/bulletin-board/base.vue b/example/src/demo/pc/bulletin-board/base.vue deleted file mode 100644 index dd09e0689..000000000 --- a/example/src/demo/pc/bulletin-board/base.vue +++ /dev/null @@ -1,99 +0,0 @@ - - - diff --git a/example/src/demo/pc/bulletin-board/icon.vue b/example/src/demo/pc/bulletin-board/icon.vue deleted file mode 100644 index efd603f82..000000000 --- a/example/src/demo/pc/bulletin-board/icon.vue +++ /dev/null @@ -1,101 +0,0 @@ - - - diff --git a/example/src/demo/pc/bulletin-board/route.vue b/example/src/demo/pc/bulletin-board/route.vue deleted file mode 100644 index 058fd4e36..000000000 --- a/example/src/demo/pc/bulletin-board/route.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/pc/bulletin-board/title.vue b/example/src/demo/pc/bulletin-board/title.vue deleted file mode 100644 index abecff2b8..000000000 --- a/example/src/demo/pc/bulletin-board/title.vue +++ /dev/null @@ -1,99 +0,0 @@ - - - diff --git a/example/src/demo/pc/button-group/base.vue b/example/src/demo/pc/button-group/base.vue deleted file mode 100644 index e3b916306..000000000 --- a/example/src/demo/pc/button-group/base.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - diff --git a/example/src/demo/pc/button-group/data.vue b/example/src/demo/pc/button-group/data.vue deleted file mode 100644 index 01a935e1b..000000000 --- a/example/src/demo/pc/button-group/data.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/button-group/disabled.vue b/example/src/demo/pc/button-group/disabled.vue deleted file mode 100644 index 020780b09..000000000 --- a/example/src/demo/pc/button-group/disabled.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/button-group/plain.vue b/example/src/demo/pc/button-group/plain.vue deleted file mode 100644 index 5f75a3570..000000000 --- a/example/src/demo/pc/button-group/plain.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/button-group/size.vue b/example/src/demo/pc/button-group/size.vue deleted file mode 100644 index b226422cf..000000000 --- a/example/src/demo/pc/button-group/size.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - diff --git a/example/src/demo/pc/button-group/slot-default.vue b/example/src/demo/pc/button-group/slot-default.vue deleted file mode 100644 index 1b2708fa5..000000000 --- a/example/src/demo/pc/button-group/slot-default.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/button/autofocus.vue b/example/src/demo/pc/button/autofocus.vue deleted file mode 100644 index ac2e364bd..000000000 --- a/example/src/demo/pc/button/autofocus.vue +++ /dev/null @@ -1,16 +0,0 @@ - - - diff --git a/example/src/demo/pc/button/base.vue b/example/src/demo/pc/button/base.vue deleted file mode 100644 index 95eaa3d5e..000000000 --- a/example/src/demo/pc/button/base.vue +++ /dev/null @@ -1,57 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/button/click.vue b/example/src/demo/pc/button/click.vue deleted file mode 100644 index c4d6d6704..000000000 --- a/example/src/demo/pc/button/click.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/button/dynamic-disabled.vue b/example/src/demo/pc/button/dynamic-disabled.vue deleted file mode 100644 index 6f72b7d17..000000000 --- a/example/src/demo/pc/button/dynamic-disabled.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/button/icon.vue b/example/src/demo/pc/button/icon.vue deleted file mode 100644 index c4b6be925..000000000 --- a/example/src/demo/pc/button/icon.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/button/loading.vue b/example/src/demo/pc/button/loading.vue deleted file mode 100644 index f92c74a87..000000000 --- a/example/src/demo/pc/button/loading.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/pc/button/plain.vue b/example/src/demo/pc/button/plain.vue deleted file mode 100644 index 389b177fb..000000000 --- a/example/src/demo/pc/button/plain.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/pc/button/reset-time.vue b/example/src/demo/pc/button/reset-time.vue deleted file mode 100644 index d6369b7d6..000000000 --- a/example/src/demo/pc/button/reset-time.vue +++ /dev/null @@ -1,17 +0,0 @@ - - - diff --git a/example/src/demo/pc/button/round.vue b/example/src/demo/pc/button/round.vue deleted file mode 100644 index d29c7f278..000000000 --- a/example/src/demo/pc/button/round.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/pc/button/size.vue b/example/src/demo/pc/button/size.vue deleted file mode 100644 index b892ae58f..000000000 --- a/example/src/demo/pc/button/size.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/example/src/demo/pc/button/slot-default.vue b/example/src/demo/pc/button/slot-default.vue deleted file mode 100644 index 88566d33e..000000000 --- a/example/src/demo/pc/button/slot-default.vue +++ /dev/null @@ -1,30 +0,0 @@ - - - diff --git a/example/src/demo/pc/button/text.vue b/example/src/demo/pc/button/text.vue deleted file mode 100644 index ee3d47dd4..000000000 --- a/example/src/demo/pc/button/text.vue +++ /dev/null @@ -1,16 +0,0 @@ - - - diff --git a/example/src/demo/pc/button/type.vue b/example/src/demo/pc/button/type.vue deleted file mode 100644 index 69cc3a3cd..000000000 --- a/example/src/demo/pc/button/type.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - diff --git a/example/src/demo/pc/calendar/basic-usage.vue b/example/src/demo/pc/calendar/basic-usage.vue deleted file mode 100644 index e0946e2b8..000000000 --- a/example/src/demo/pc/calendar/basic-usage.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/carousel/basic-usage.vue b/example/src/demo/pc/carousel/basic-usage.vue deleted file mode 100644 index d6dd41e26..000000000 --- a/example/src/demo/pc/carousel/basic-usage.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/carousel/show-title.vue b/example/src/demo/pc/carousel/show-title.vue deleted file mode 100644 index 0c2ca637a..000000000 --- a/example/src/demo/pc/carousel/show-title.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/cascader-panel/basic-usage.vue b/example/src/demo/pc/cascader-panel/basic-usage.vue deleted file mode 100644 index 5e413219b..000000000 --- a/example/src/demo/pc/cascader-panel/basic-usage.vue +++ /dev/null @@ -1,217 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/cascader-panel/change.vue b/example/src/demo/pc/cascader-panel/change.vue deleted file mode 100644 index 86d9ff8d0..000000000 --- a/example/src/demo/pc/cascader-panel/change.vue +++ /dev/null @@ -1,247 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/cascader/auto-load.vue b/example/src/demo/pc/cascader/auto-load.vue deleted file mode 100644 index 25d2a70a3..000000000 --- a/example/src/demo/pc/cascader/auto-load.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - diff --git a/example/src/demo/pc/cascader/basic-usage.vue b/example/src/demo/pc/cascader/basic-usage.vue deleted file mode 100644 index 25d6df008..000000000 --- a/example/src/demo/pc/cascader/basic-usage.vue +++ /dev/null @@ -1,212 +0,0 @@ - - - diff --git a/example/src/demo/pc/cascader/check-strictly.vue b/example/src/demo/pc/cascader/check-strictly.vue deleted file mode 100644 index 409f66a1b..000000000 --- a/example/src/demo/pc/cascader/check-strictly.vue +++ /dev/null @@ -1,215 +0,0 @@ - - - diff --git a/example/src/demo/pc/cascader/clearable.vue b/example/src/demo/pc/cascader/clearable.vue deleted file mode 100644 index cd4f132b4..000000000 --- a/example/src/demo/pc/cascader/clearable.vue +++ /dev/null @@ -1,212 +0,0 @@ - - - diff --git a/example/src/demo/pc/cascader/collapse-tags.vue b/example/src/demo/pc/cascader/collapse-tags.vue deleted file mode 100644 index 311eb638b..000000000 --- a/example/src/demo/pc/cascader/collapse-tags.vue +++ /dev/null @@ -1,197 +0,0 @@ - - - diff --git a/example/src/demo/pc/cascader/events.vue b/example/src/demo/pc/cascader/events.vue deleted file mode 100644 index e578827e9..000000000 --- a/example/src/demo/pc/cascader/events.vue +++ /dev/null @@ -1,253 +0,0 @@ - - - diff --git a/example/src/demo/pc/cascader/filter-method.vue b/example/src/demo/pc/cascader/filter-method.vue deleted file mode 100644 index df027e64d..000000000 --- a/example/src/demo/pc/cascader/filter-method.vue +++ /dev/null @@ -1,229 +0,0 @@ - - - diff --git a/example/src/demo/pc/cascader/filterable.vue b/example/src/demo/pc/cascader/filterable.vue deleted file mode 100644 index 292334941..000000000 --- a/example/src/demo/pc/cascader/filterable.vue +++ /dev/null @@ -1,215 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/amap/base.vue b/example/src/demo/pc/chart/amap/base.vue deleted file mode 100644 index 8f45233d1..000000000 --- a/example/src/demo/pc/chart/amap/base.vue +++ /dev/null @@ -1,39 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/bar/base.vue b/example/src/demo/pc/chart/bar/base.vue deleted file mode 100644 index 66df71cbd..000000000 --- a/example/src/demo/pc/chart/bar/base.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/bar/demo2.vue b/example/src/demo/pc/chart/bar/demo2.vue deleted file mode 100644 index aaef7580f..000000000 --- a/example/src/demo/pc/chart/bar/demo2.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/bar/demo3.vue b/example/src/demo/pc/chart/bar/demo3.vue deleted file mode 100644 index 18c024b5c..000000000 --- a/example/src/demo/pc/chart/bar/demo3.vue +++ /dev/null @@ -1,37 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/bar/demo4.vue b/example/src/demo/pc/chart/bar/demo4.vue deleted file mode 100644 index f00aae8ca..000000000 --- a/example/src/demo/pc/chart/bar/demo4.vue +++ /dev/null @@ -1,37 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/bar/demo5.vue b/example/src/demo/pc/chart/bar/demo5.vue deleted file mode 100644 index 42f18efc3..000000000 --- a/example/src/demo/pc/chart/bar/demo5.vue +++ /dev/null @@ -1,39 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/bar/demo6.vue b/example/src/demo/pc/chart/bar/demo6.vue deleted file mode 100644 index 823580f3a..000000000 --- a/example/src/demo/pc/chart/bar/demo6.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/bar/demo7.vue b/example/src/demo/pc/chart/bar/demo7.vue deleted file mode 100644 index 1e53bf4bf..000000000 --- a/example/src/demo/pc/chart/bar/demo7.vue +++ /dev/null @@ -1,33 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/base.vue b/example/src/demo/pc/chart/base.vue deleted file mode 100644 index d129b9a2d..000000000 --- a/example/src/demo/pc/chart/base.vue +++ /dev/null @@ -1,81 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/bmap/base.vue b/example/src/demo/pc/chart/bmap/base.vue deleted file mode 100644 index c5fe55aba..000000000 --- a/example/src/demo/pc/chart/bmap/base.vue +++ /dev/null @@ -1,37 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/boxplot/base.vue b/example/src/demo/pc/chart/boxplot/base.vue deleted file mode 100644 index 90c2dd76c..000000000 --- a/example/src/demo/pc/chart/boxplot/base.vue +++ /dev/null @@ -1,50 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/boxplot/multiple.vue b/example/src/demo/pc/chart/boxplot/multiple.vue deleted file mode 100644 index 331666399..000000000 --- a/example/src/demo/pc/chart/boxplot/multiple.vue +++ /dev/null @@ -1,134 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/boxplot/vertical.vue b/example/src/demo/pc/chart/boxplot/vertical.vue deleted file mode 100644 index d0de48840..000000000 --- a/example/src/demo/pc/chart/boxplot/vertical.vue +++ /dev/null @@ -1,105 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/candle/base.vue b/example/src/demo/pc/chart/candle/base.vue deleted file mode 100644 index bb562a9f4..000000000 --- a/example/src/demo/pc/chart/candle/base.vue +++ /dev/null @@ -1,201 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/candle/demo2.vue b/example/src/demo/pc/chart/candle/demo2.vue deleted file mode 100644 index 4dd9145ba..000000000 --- a/example/src/demo/pc/chart/candle/demo2.vue +++ /dev/null @@ -1,64 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/candle/demo3.vue b/example/src/demo/pc/chart/candle/demo3.vue deleted file mode 100644 index afdce2dcb..000000000 --- a/example/src/demo/pc/chart/candle/demo3.vue +++ /dev/null @@ -1,76 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/candle/demo4.vue b/example/src/demo/pc/chart/candle/demo4.vue deleted file mode 100644 index e3d2da608..000000000 --- a/example/src/demo/pc/chart/candle/demo4.vue +++ /dev/null @@ -1,85 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/candle/demo5.vue b/example/src/demo/pc/chart/candle/demo5.vue deleted file mode 100644 index d641e362a..000000000 --- a/example/src/demo/pc/chart/candle/demo5.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/candle/demo6.vue b/example/src/demo/pc/chart/candle/demo6.vue deleted file mode 100644 index 1d4568b53..000000000 --- a/example/src/demo/pc/chart/candle/demo6.vue +++ /dev/null @@ -1,181 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/candle/demo7.vue b/example/src/demo/pc/chart/candle/demo7.vue deleted file mode 100644 index 5dcc7d1b5..000000000 --- a/example/src/demo/pc/chart/candle/demo7.vue +++ /dev/null @@ -1,214 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/events/base.vue b/example/src/demo/pc/chart/events/base.vue deleted file mode 100644 index 88d67633e..000000000 --- a/example/src/demo/pc/chart/events/base.vue +++ /dev/null @@ -1,37 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/funnel/base.vue b/example/src/demo/pc/chart/funnel/base.vue deleted file mode 100644 index 1a77e7b25..000000000 --- a/example/src/demo/pc/chart/funnel/base.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/funnel/demo2.vue b/example/src/demo/pc/chart/funnel/demo2.vue deleted file mode 100644 index eba14e2f0..000000000 --- a/example/src/demo/pc/chart/funnel/demo2.vue +++ /dev/null @@ -1,33 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/funnel/demo3.vue b/example/src/demo/pc/chart/funnel/demo3.vue deleted file mode 100644 index dc17cdeb3..000000000 --- a/example/src/demo/pc/chart/funnel/demo3.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/funnel/demo4.vue b/example/src/demo/pc/chart/funnel/demo4.vue deleted file mode 100644 index e748122cf..000000000 --- a/example/src/demo/pc/chart/funnel/demo4.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/funnel/demo5.vue b/example/src/demo/pc/chart/funnel/demo5.vue deleted file mode 100644 index 49f07a36e..000000000 --- a/example/src/demo/pc/chart/funnel/demo5.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/funnel/demo6.vue b/example/src/demo/pc/chart/funnel/demo6.vue deleted file mode 100644 index 171bf3404..000000000 --- a/example/src/demo/pc/chart/funnel/demo6.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/funnel/demo7.vue b/example/src/demo/pc/chart/funnel/demo7.vue deleted file mode 100644 index 3a8ae0efa..000000000 --- a/example/src/demo/pc/chart/funnel/demo7.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/gauge/base.vue b/example/src/demo/pc/chart/gauge/base.vue deleted file mode 100644 index 629d8dff0..000000000 --- a/example/src/demo/pc/chart/gauge/base.vue +++ /dev/null @@ -1,24 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/gauge/demo2.vue b/example/src/demo/pc/chart/gauge/demo2.vue deleted file mode 100644 index 209d3ca13..000000000 --- a/example/src/demo/pc/chart/gauge/demo2.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/gauge/demo3.vue b/example/src/demo/pc/chart/gauge/demo3.vue deleted file mode 100644 index a1ba7eba2..000000000 --- a/example/src/demo/pc/chart/gauge/demo3.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/gauge/demo4.vue b/example/src/demo/pc/chart/gauge/demo4.vue deleted file mode 100644 index 4467cb838..000000000 --- a/example/src/demo/pc/chart/gauge/demo4.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/gauge/demo5.vue b/example/src/demo/pc/chart/gauge/demo5.vue deleted file mode 100644 index 29f3a83fb..000000000 --- a/example/src/demo/pc/chart/gauge/demo5.vue +++ /dev/null @@ -1,261 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/graph/base.vue b/example/src/demo/pc/chart/graph/base.vue deleted file mode 100644 index 68b7d5a96..000000000 --- a/example/src/demo/pc/chart/graph/base.vue +++ /dev/null @@ -1,127 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/graph/demo2.vue b/example/src/demo/pc/chart/graph/demo2.vue deleted file mode 100644 index a0184d67d..000000000 --- a/example/src/demo/pc/chart/graph/demo2.vue +++ /dev/null @@ -1,65 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/graph/demo3.vue b/example/src/demo/pc/chart/graph/demo3.vue deleted file mode 100644 index e9611b805..000000000 --- a/example/src/demo/pc/chart/graph/demo3.vue +++ /dev/null @@ -1,356 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/heatmap/base.vue b/example/src/demo/pc/chart/heatmap/base.vue deleted file mode 100644 index 9d68b307b..000000000 --- a/example/src/demo/pc/chart/heatmap/base.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/heatmap/demo2.vue b/example/src/demo/pc/chart/heatmap/demo2.vue deleted file mode 100644 index ddb8813a8..000000000 --- a/example/src/demo/pc/chart/heatmap/demo2.vue +++ /dev/null @@ -1,39 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/heatmap/demo3.vue b/example/src/demo/pc/chart/heatmap/demo3.vue deleted file mode 100644 index 454aaf6ea..000000000 --- a/example/src/demo/pc/chart/heatmap/demo3.vue +++ /dev/null @@ -1,45 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/heatmap/demo4.vue b/example/src/demo/pc/chart/heatmap/demo4.vue deleted file mode 100644 index 1de0fe26e..000000000 --- a/example/src/demo/pc/chart/heatmap/demo4.vue +++ /dev/null @@ -1,64 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/heatmap/demo5.vue b/example/src/demo/pc/chart/heatmap/demo5.vue deleted file mode 100644 index 3370cadd6..000000000 --- a/example/src/demo/pc/chart/heatmap/demo5.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/histogram/base.vue b/example/src/demo/pc/chart/histogram/base.vue deleted file mode 100644 index fea29d356..000000000 --- a/example/src/demo/pc/chart/histogram/base.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/histogram/demo2.vue b/example/src/demo/pc/chart/histogram/demo2.vue deleted file mode 100644 index 4837a5daf..000000000 --- a/example/src/demo/pc/chart/histogram/demo2.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/histogram/demo3.vue b/example/src/demo/pc/chart/histogram/demo3.vue deleted file mode 100644 index 92ee76f9b..000000000 --- a/example/src/demo/pc/chart/histogram/demo3.vue +++ /dev/null @@ -1,36 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/histogram/demo4.vue b/example/src/demo/pc/chart/histogram/demo4.vue deleted file mode 100644 index 4fb74a2cb..000000000 --- a/example/src/demo/pc/chart/histogram/demo4.vue +++ /dev/null @@ -1,36 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/histogram/demo5.vue b/example/src/demo/pc/chart/histogram/demo5.vue deleted file mode 100644 index 15ec255cb..000000000 --- a/example/src/demo/pc/chart/histogram/demo5.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/histogram/demo6.vue b/example/src/demo/pc/chart/histogram/demo6.vue deleted file mode 100644 index 273046ac0..000000000 --- a/example/src/demo/pc/chart/histogram/demo6.vue +++ /dev/null @@ -1,37 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/histogram/demo7.vue b/example/src/demo/pc/chart/histogram/demo7.vue deleted file mode 100644 index 7e599c449..000000000 --- a/example/src/demo/pc/chart/histogram/demo7.vue +++ /dev/null @@ -1,41 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/histogram/demo8.vue b/example/src/demo/pc/chart/histogram/demo8.vue deleted file mode 100644 index d55af4840..000000000 --- a/example/src/demo/pc/chart/histogram/demo8.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/line/base.vue b/example/src/demo/pc/chart/line/base.vue deleted file mode 100644 index 8d2fe6c82..000000000 --- a/example/src/demo/pc/chart/line/base.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/line/demo2.vue b/example/src/demo/pc/chart/line/demo2.vue deleted file mode 100644 index 9058877f3..000000000 --- a/example/src/demo/pc/chart/line/demo2.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/line/demo3.vue b/example/src/demo/pc/chart/line/demo3.vue deleted file mode 100644 index ec2290133..000000000 --- a/example/src/demo/pc/chart/line/demo3.vue +++ /dev/null @@ -1,36 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/line/demo4.vue b/example/src/demo/pc/chart/line/demo4.vue deleted file mode 100644 index 0aba13117..000000000 --- a/example/src/demo/pc/chart/line/demo4.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/line/demo5.vue b/example/src/demo/pc/chart/line/demo5.vue deleted file mode 100644 index 5572cee0b..000000000 --- a/example/src/demo/pc/chart/line/demo5.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/line/demo6.vue b/example/src/demo/pc/chart/line/demo6.vue deleted file mode 100644 index 396da40aa..000000000 --- a/example/src/demo/pc/chart/line/demo6.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/line/demo7.vue b/example/src/demo/pc/chart/line/demo7.vue deleted file mode 100644 index f7c31dbeb..000000000 --- a/example/src/demo/pc/chart/line/demo7.vue +++ /dev/null @@ -1,41 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/line/demo8.vue b/example/src/demo/pc/chart/line/demo8.vue deleted file mode 100644 index 86d186199..000000000 --- a/example/src/demo/pc/chart/line/demo8.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/line/demo9.vue b/example/src/demo/pc/chart/line/demo9.vue deleted file mode 100644 index 6585d8181..000000000 --- a/example/src/demo/pc/chart/line/demo9.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/liquidfill/base.vue b/example/src/demo/pc/chart/liquidfill/base.vue deleted file mode 100644 index eab546891..000000000 --- a/example/src/demo/pc/chart/liquidfill/base.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/liquidfill/demo2.vue b/example/src/demo/pc/chart/liquidfill/demo2.vue deleted file mode 100644 index 5b583f6e9..000000000 --- a/example/src/demo/pc/chart/liquidfill/demo2.vue +++ /dev/null @@ -1,37 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/liquidfill/demo3.vue b/example/src/demo/pc/chart/liquidfill/demo3.vue deleted file mode 100644 index f197b99d9..000000000 --- a/example/src/demo/pc/chart/liquidfill/demo3.vue +++ /dev/null @@ -1,76 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/liquidfill/demo4.vue b/example/src/demo/pc/chart/liquidfill/demo4.vue deleted file mode 100644 index 2d91c21c3..000000000 --- a/example/src/demo/pc/chart/liquidfill/demo4.vue +++ /dev/null @@ -1,36 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/liquidfill/demo5.vue b/example/src/demo/pc/chart/liquidfill/demo5.vue deleted file mode 100644 index fed9fc3ca..000000000 --- a/example/src/demo/pc/chart/liquidfill/demo5.vue +++ /dev/null @@ -1,56 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/map/base.vue b/example/src/demo/pc/chart/map/base.vue deleted file mode 100644 index 02e0134d2..000000000 --- a/example/src/demo/pc/chart/map/base.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/pie/base.vue b/example/src/demo/pc/chart/pie/base.vue deleted file mode 100644 index a78818f2c..000000000 --- a/example/src/demo/pc/chart/pie/base.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/pie/demo2.vue b/example/src/demo/pc/chart/pie/demo2.vue deleted file mode 100644 index 5dfd19e7b..000000000 --- a/example/src/demo/pc/chart/pie/demo2.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/pie/demo3.vue b/example/src/demo/pc/chart/pie/demo3.vue deleted file mode 100644 index f23d6674e..000000000 --- a/example/src/demo/pc/chart/pie/demo3.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/pie/demo4.vue b/example/src/demo/pc/chart/pie/demo4.vue deleted file mode 100644 index ff8db499f..000000000 --- a/example/src/demo/pc/chart/pie/demo4.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/pie/demo5.vue b/example/src/demo/pc/chart/pie/demo5.vue deleted file mode 100644 index 54b0d147e..000000000 --- a/example/src/demo/pc/chart/pie/demo5.vue +++ /dev/null @@ -1,37 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/pie/demo6.vue b/example/src/demo/pc/chart/pie/demo6.vue deleted file mode 100644 index fece76ab4..000000000 --- a/example/src/demo/pc/chart/pie/demo6.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/pie/demo7.vue b/example/src/demo/pc/chart/pie/demo7.vue deleted file mode 100644 index 25836e2a9..000000000 --- a/example/src/demo/pc/chart/pie/demo7.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/props/base.vue b/example/src/demo/pc/chart/props/base.vue deleted file mode 100644 index 413358b8a..000000000 --- a/example/src/demo/pc/chart/props/base.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/props/demo2.vue b/example/src/demo/pc/chart/props/demo2.vue deleted file mode 100644 index 8e37ba588..000000000 --- a/example/src/demo/pc/chart/props/demo2.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/props/demo3.vue b/example/src/demo/pc/chart/props/demo3.vue deleted file mode 100644 index bd5ba2151..000000000 --- a/example/src/demo/pc/chart/props/demo3.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/props/demo4.vue b/example/src/demo/pc/chart/props/demo4.vue deleted file mode 100644 index ac956c425..000000000 --- a/example/src/demo/pc/chart/props/demo4.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/props/demo5.vue b/example/src/demo/pc/chart/props/demo5.vue deleted file mode 100644 index f8f569bc1..000000000 --- a/example/src/demo/pc/chart/props/demo5.vue +++ /dev/null @@ -1,39 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/chart/props/demo6.vue b/example/src/demo/pc/chart/props/demo6.vue deleted file mode 100644 index b7d7ef707..000000000 --- a/example/src/demo/pc/chart/props/demo6.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/props/demo7.vue b/example/src/demo/pc/chart/props/demo7.vue deleted file mode 100644 index 6fce7ae73..000000000 --- a/example/src/demo/pc/chart/props/demo7.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/props/demo8.vue b/example/src/demo/pc/chart/props/demo8.vue deleted file mode 100644 index 5909963a0..000000000 --- a/example/src/demo/pc/chart/props/demo8.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/props/demo9.vue b/example/src/demo/pc/chart/props/demo9.vue deleted file mode 100644 index 5e80cf231..000000000 --- a/example/src/demo/pc/chart/props/demo9.vue +++ /dev/null @@ -1,41 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/question/base.vue b/example/src/demo/pc/chart/question/base.vue deleted file mode 100644 index a1c6ef4f1..000000000 --- a/example/src/demo/pc/chart/question/base.vue +++ /dev/null @@ -1,53 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/question/demo2.vue b/example/src/demo/pc/chart/question/demo2.vue deleted file mode 100644 index 63075dcb5..000000000 --- a/example/src/demo/pc/chart/question/demo2.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/question/demo3.vue b/example/src/demo/pc/chart/question/demo3.vue deleted file mode 100644 index d23ded79c..000000000 --- a/example/src/demo/pc/chart/question/demo3.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/question/demo4.vue b/example/src/demo/pc/chart/question/demo4.vue deleted file mode 100644 index de85eb1d0..000000000 --- a/example/src/demo/pc/chart/question/demo4.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/question/demo5.vue b/example/src/demo/pc/chart/question/demo5.vue deleted file mode 100644 index 4502f8c12..000000000 --- a/example/src/demo/pc/chart/question/demo5.vue +++ /dev/null @@ -1,53 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/radar/base.vue b/example/src/demo/pc/chart/radar/base.vue deleted file mode 100644 index 293f373ac..000000000 --- a/example/src/demo/pc/chart/radar/base.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/radar/demo2.vue b/example/src/demo/pc/chart/radar/demo2.vue deleted file mode 100644 index b17361e15..000000000 --- a/example/src/demo/pc/chart/radar/demo2.vue +++ /dev/null @@ -1,36 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/radar/demo3.vue b/example/src/demo/pc/chart/radar/demo3.vue deleted file mode 100644 index c21399a43..000000000 --- a/example/src/demo/pc/chart/radar/demo3.vue +++ /dev/null @@ -1,39 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/ring/base.vue b/example/src/demo/pc/chart/ring/base.vue deleted file mode 100644 index fc2d24c22..000000000 --- a/example/src/demo/pc/chart/ring/base.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/ring/demo2.vue b/example/src/demo/pc/chart/ring/demo2.vue deleted file mode 100644 index e0af714ac..000000000 --- a/example/src/demo/pc/chart/ring/demo2.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/ring/demo3.vue b/example/src/demo/pc/chart/ring/demo3.vue deleted file mode 100644 index b4440d22e..000000000 --- a/example/src/demo/pc/chart/ring/demo3.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/ring/demo4.vue b/example/src/demo/pc/chart/ring/demo4.vue deleted file mode 100644 index 48d074531..000000000 --- a/example/src/demo/pc/chart/ring/demo4.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/ring/demo5.vue b/example/src/demo/pc/chart/ring/demo5.vue deleted file mode 100644 index af11572f4..000000000 --- a/example/src/demo/pc/chart/ring/demo5.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/ring/demo6.vue b/example/src/demo/pc/chart/ring/demo6.vue deleted file mode 100644 index 65ebf3468..000000000 --- a/example/src/demo/pc/chart/ring/demo6.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/sankey/base.vue b/example/src/demo/pc/chart/sankey/base.vue deleted file mode 100644 index c91c4d231..000000000 --- a/example/src/demo/pc/chart/sankey/base.vue +++ /dev/null @@ -1,41 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/sankey/demo2.vue b/example/src/demo/pc/chart/sankey/demo2.vue deleted file mode 100644 index a463000c0..000000000 --- a/example/src/demo/pc/chart/sankey/demo2.vue +++ /dev/null @@ -1,43 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/scatter/base.vue b/example/src/demo/pc/chart/scatter/base.vue deleted file mode 100644 index 742a36323..000000000 --- a/example/src/demo/pc/chart/scatter/base.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/scatter/demo2.vue b/example/src/demo/pc/chart/scatter/demo2.vue deleted file mode 100644 index da6bce5fe..000000000 --- a/example/src/demo/pc/chart/scatter/demo2.vue +++ /dev/null @@ -1,50 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/scatter/demo3.vue b/example/src/demo/pc/chart/scatter/demo3.vue deleted file mode 100644 index fcab771ca..000000000 --- a/example/src/demo/pc/chart/scatter/demo3.vue +++ /dev/null @@ -1,53 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/scatter/demo4.vue b/example/src/demo/pc/chart/scatter/demo4.vue deleted file mode 100644 index 80ef6663f..000000000 --- a/example/src/demo/pc/chart/scatter/demo4.vue +++ /dev/null @@ -1,56 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/scatter/demo5.vue b/example/src/demo/pc/chart/scatter/demo5.vue deleted file mode 100644 index db5020219..000000000 --- a/example/src/demo/pc/chart/scatter/demo5.vue +++ /dev/null @@ -1,57 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/scatter/demo6.vue b/example/src/demo/pc/chart/scatter/demo6.vue deleted file mode 100644 index 4075d3051..000000000 --- a/example/src/demo/pc/chart/scatter/demo6.vue +++ /dev/null @@ -1,53 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/scatter/demo7.vue b/example/src/demo/pc/chart/scatter/demo7.vue deleted file mode 100644 index 5fd677fc4..000000000 --- a/example/src/demo/pc/chart/scatter/demo7.vue +++ /dev/null @@ -1,55 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/scatter/demo8.vue b/example/src/demo/pc/chart/scatter/demo8.vue deleted file mode 100644 index 8f0a5a33b..000000000 --- a/example/src/demo/pc/chart/scatter/demo8.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/sunburst/base.vue b/example/src/demo/pc/chart/sunburst/base.vue deleted file mode 100644 index 293bdc672..000000000 --- a/example/src/demo/pc/chart/sunburst/base.vue +++ /dev/null @@ -1,296 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/sunburst/demo2.vue b/example/src/demo/pc/chart/sunburst/demo2.vue deleted file mode 100644 index 9ba14fbdb..000000000 --- a/example/src/demo/pc/chart/sunburst/demo2.vue +++ /dev/null @@ -1,857 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/tree/base.vue b/example/src/demo/pc/chart/tree/base.vue deleted file mode 100644 index a80a8095e..000000000 --- a/example/src/demo/pc/chart/tree/base.vue +++ /dev/null @@ -1,105 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/tree/demo2.vue b/example/src/demo/pc/chart/tree/demo2.vue deleted file mode 100644 index 51791a49b..000000000 --- a/example/src/demo/pc/chart/tree/demo2.vue +++ /dev/null @@ -1,125 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/tree/demo3.vue b/example/src/demo/pc/chart/tree/demo3.vue deleted file mode 100644 index 17c675d67..000000000 --- a/example/src/demo/pc/chart/tree/demo3.vue +++ /dev/null @@ -1,112 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/tree/demo4.vue b/example/src/demo/pc/chart/tree/demo4.vue deleted file mode 100644 index 8f94550d5..000000000 --- a/example/src/demo/pc/chart/tree/demo4.vue +++ /dev/null @@ -1,112 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/tree/demo5.vue b/example/src/demo/pc/chart/tree/demo5.vue deleted file mode 100644 index bb26f07be..000000000 --- a/example/src/demo/pc/chart/tree/demo5.vue +++ /dev/null @@ -1,117 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/waterfall/base.vue b/example/src/demo/pc/chart/waterfall/base.vue deleted file mode 100644 index a285b4c35..000000000 --- a/example/src/demo/pc/chart/waterfall/base.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/waterfall/demo2.vue b/example/src/demo/pc/chart/waterfall/demo2.vue deleted file mode 100644 index 5cee48df4..000000000 --- a/example/src/demo/pc/chart/waterfall/demo2.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/waterfall/demo3.vue b/example/src/demo/pc/chart/waterfall/demo3.vue deleted file mode 100644 index c05538532..000000000 --- a/example/src/demo/pc/chart/waterfall/demo3.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/waterfall/demo4.vue b/example/src/demo/pc/chart/waterfall/demo4.vue deleted file mode 100644 index 70718eabe..000000000 --- a/example/src/demo/pc/chart/waterfall/demo4.vue +++ /dev/null @@ -1,33 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/waterfall/demo5.vue b/example/src/demo/pc/chart/waterfall/demo5.vue deleted file mode 100644 index 0e811f9e8..000000000 --- a/example/src/demo/pc/chart/waterfall/demo5.vue +++ /dev/null @@ -1,33 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/wordcloud/base.vue b/example/src/demo/pc/chart/wordcloud/base.vue deleted file mode 100644 index e3bcfcced..000000000 --- a/example/src/demo/pc/chart/wordcloud/base.vue +++ /dev/null @@ -1,167 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/wordcloud/demo2.vue b/example/src/demo/pc/chart/wordcloud/demo2.vue deleted file mode 100644 index 4ff5490e7..000000000 --- a/example/src/demo/pc/chart/wordcloud/demo2.vue +++ /dev/null @@ -1,170 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/wordcloud/demo3.vue b/example/src/demo/pc/chart/wordcloud/demo3.vue deleted file mode 100644 index 3c5b1e1cd..000000000 --- a/example/src/demo/pc/chart/wordcloud/demo3.vue +++ /dev/null @@ -1,170 +0,0 @@ - - - diff --git a/example/src/demo/pc/chart/wordcloud/demo4.vue b/example/src/demo/pc/chart/wordcloud/demo4.vue deleted file mode 100644 index af93e1816..000000000 --- a/example/src/demo/pc/chart/wordcloud/demo4.vue +++ /dev/null @@ -1,171 +0,0 @@ - - - diff --git a/example/src/demo/pc/checkbox/basic-usage.vue b/example/src/demo/pc/checkbox/basic-usage.vue deleted file mode 100644 index 06d4c426e..000000000 --- a/example/src/demo/pc/checkbox/basic-usage.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/checkbox/group-options.vue b/example/src/demo/pc/checkbox/group-options.vue deleted file mode 100644 index 88a6d8b4f..000000000 --- a/example/src/demo/pc/checkbox/group-options.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/pc/checkbox/indeterminate.vue b/example/src/demo/pc/checkbox/indeterminate.vue deleted file mode 100644 index c13b03ffa..000000000 --- a/example/src/demo/pc/checkbox/indeterminate.vue +++ /dev/null @@ -1,45 +0,0 @@ - - - diff --git a/example/src/demo/pc/checkbox/min-max.vue b/example/src/demo/pc/checkbox/min-max.vue deleted file mode 100644 index c6dab83ce..000000000 --- a/example/src/demo/pc/checkbox/min-max.vue +++ /dev/null @@ -1,24 +0,0 @@ - - - diff --git a/example/src/demo/pc/checkbox/text.vue b/example/src/demo/pc/checkbox/text.vue deleted file mode 100644 index 4059cc647..000000000 --- a/example/src/demo/pc/checkbox/text.vue +++ /dev/null @@ -1,30 +0,0 @@ - - - diff --git a/example/src/demo/pc/checkbox/with-border.vue b/example/src/demo/pc/checkbox/with-border.vue deleted file mode 100644 index 9eb73bab4..000000000 --- a/example/src/demo/pc/checkbox/with-border.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - diff --git a/example/src/demo/pc/col/base.vue b/example/src/demo/pc/col/base.vue deleted file mode 100644 index 6fe18e559..000000000 --- a/example/src/demo/pc/col/base.vue +++ /dev/null @@ -1,65 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/col/order.vue b/example/src/demo/pc/col/order.vue deleted file mode 100644 index c792baf22..000000000 --- a/example/src/demo/pc/col/order.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/collapse/accordion.vue b/example/src/demo/pc/collapse/accordion.vue deleted file mode 100644 index 432f4fedd..000000000 --- a/example/src/demo/pc/collapse/accordion.vue +++ /dev/null @@ -1,45 +0,0 @@ - - - diff --git a/example/src/demo/pc/collapse/basic-usage.vue b/example/src/demo/pc/collapse/basic-usage.vue deleted file mode 100644 index c4eb3e300..000000000 --- a/example/src/demo/pc/collapse/basic-usage.vue +++ /dev/null @@ -1,37 +0,0 @@ - - - diff --git a/example/src/demo/pc/collapse/dynamic-disable.vue b/example/src/demo/pc/collapse/dynamic-disable.vue deleted file mode 100644 index 19950ed3b..000000000 --- a/example/src/demo/pc/collapse/dynamic-disable.vue +++ /dev/null @@ -1,37 +0,0 @@ - - - diff --git a/example/src/demo/pc/company/basic-usage.vue b/example/src/demo/pc/company/basic-usage.vue deleted file mode 100644 index ca6f4fc4a..000000000 --- a/example/src/demo/pc/company/basic-usage.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - diff --git a/example/src/demo/pc/company/custom-service.vue b/example/src/demo/pc/company/custom-service.vue deleted file mode 100644 index 296731d78..000000000 --- a/example/src/demo/pc/company/custom-service.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/company/fields.vue b/example/src/demo/pc/company/fields.vue deleted file mode 100644 index f0781b71c..000000000 --- a/example/src/demo/pc/company/fields.vue +++ /dev/null @@ -1,50 +0,0 @@ - - - diff --git a/example/src/demo/pc/components.js b/example/src/demo/pc/components.js deleted file mode 100644 index ddf897bb5..000000000 --- a/example/src/demo/pc/components.js +++ /dev/null @@ -1,951 +0,0 @@ -export default { - alert: { - Attributes: { - closable: 'closable', - description: 'description', - type: 'type', - icon: 'icon', - size: 'size', - title: 'title', - center: 'center', - 'show-icon': 'show-icon', - 'close-text': 'close-text' - }, - Events: { - close: 'close' - }, - Slots: { - default: 'slot-default', - title: 'slot-title' - } - }, - - badge: { - Attributes: { - value: 'value', - max: 'max', - 'is-dot': 'is-dot', - hidden: 'hidden', - href: 'href', - target: 'target', - type: 'type' - }, - Slots: { - default: 'slot-default', - content: 'slot-content' - } - }, - - breadcrumb: { - Attributes: { - separator: 'separator', - 'separator-class': 'separator', - replace: 'replace', - to: 'to' - }, - Slots: { - default: 'slot-default' - } - }, - - 'bulletin-board': { - Attributes: { - data: 'data', - 'more-link': 'more-link', - 'active-name': 'active-name', - icon: 'icon', - 'show-more': 'show-more', - 'tab-title': 'tab-title', - title: 'title' - } - }, - - button: { - Attributes: { - 'native-type': 'native-type', - type: 'type', - size: 'size', - autofocus: 'autofocus', - circle: 'circle', - disabled: 'disabled', - icon: 'icon', - loading: 'loading', - plain: 'plain', - 'reset-time': 'reset-time', - round: 'round' - }, - Events: { - click: 'click' - }, - Slots: { - default: 'slot-default' - } - }, - - 'button-group': { - Attributes: { - data: 'data', - disabled: 'disabled', - plain: 'plain', - 'text-field': 'text-field', - value: 'value', - 'value-field': 'value-field' - }, - Slots: { - default: 'slot-default' - } - }, - - input: { - Attributes: { - 'suffix-icon': 'suffix-icon', - maxlength: 'maxlength', - 'prefix-icon': 'prefix-icon', - readonly: 'readonly', - clearable: 'clearable', - type: 'type', - 'value / v-model': 'value', - autocomplete: 'autocomplete', - counter: 'counter', - autofocus: 'autofocus', - autosize: 'autosize', - disabled: 'disabled', - form: 'form', - label: 'label', - max: 'max', - min: 'min', - minlength: 'minlength', - name: 'name', - placeholder: 'placeholder', - resize: 'resize', - rows: 'rows', - 'show-password': 'show-password', - 'show-word-limit': 'show-word-limit', - size: 'size', - step: 'step', - tabindex: 'tabindex', - 'validate-event': 'validate-event' - }, - Events: { - blur: 'event-blur', - change: 'event-change', - clear: 'event-clear', - focus: 'event-focus', - input: 'event-input' - }, - Methods: { - addMemory: 'method-addMemory', - blur: 'method-blur', - focus: 'method-focus', - select: 'method-select' - }, - Slots: { - append: 'slot-append', - prefix: 'slot-prefix', - prepend: 'slot-prepend', - suffix: 'slot-suffix' - } - }, - - select: { - Attributes: { - multiple: 'multiple', - clearable: 'clearable', - 'value / v-model': 'value', - autocomplete: 'autocomplete', - 'allow-create': 'allow-create', - 'automatic-dropdown': 'automatic-dropdown', - 'collapse-tags': 'collapse-tags', - 'default-first-option': 'default-first-option', - disabled: 'disabled', - 'filter-method': 'filter-method', - filterable: 'filterable', - loading: 'loading', - 'loading-text': 'loading-text', - 'multiple-limit': 'multiple-limit', - name: 'name', - 'no-data-text': 'no-data-text', - 'no-match-text': 'no-match-text', - placeholder: 'placeholder', - 'popper-append-to-body': 'popper-append-to-body', - 'popper-class': 'popper-class', - remote: 'remote', - 'remote-method': 'remote-method', - 'reserve-keyword': 'reserve-keyword', - size: 'size', - 'value-key': 'value-key' - }, - Methods: { - blur: 'method-blur', - focus: 'method-focus' - }, - Events: { - change: 'event-change', - clear: 'event-clear', - blur: 'event-blur', - focus: 'event-focus', - 'remove-tag': 'event-remove-tag', - 'visible-change': 'event-visible-change' - }, - Slots: { - default: 'slot-default', - empty: 'slot-empty', - prefix: 'slot-prefix' - } - }, - - option: { - Attributes: { - disabled: 'disabled', - label: 'label', - value: 'value' - } - }, - - 'option-group': { - Attributes: { - disabled: 'disabled', - label: 'label' - } - }, - - 'scroll-text': { - Attributes: { - direction: 'direction', - 'hover-stop': 'text', - text: 'text', - time: 'text' - }, - Events: {}, - Methods: {}, - Slots: { - default: 'slots' - } - }, - container: { - Attributes: { - 'aside-width': 'base', - 'footer-height': 'base', - 'header-height': 'base', - pattern: 'pattern' - }, - Events: {}, - Methods: {}, - Slots: {} - }, - switch: { - Attributes: { - disabled: 'disabled', - mini: 'disabled', - 'value / v-model': 'truevlue', - trueValue: 'truevlue', - falseValue: 'truevlue' - }, - Events: {}, - Methods: {}, - Slots: {} - }, - tag: { - Attributes: { - border: 'hit', - hit: 'hit', - color: 'color3', - type: 'type', - closeable: 'closeable', - createable: 'closeable', - effect: 'effect', - disabled: 'disabled', - mode: 'border', - readonly: 'disabled', - selectable: 'border', - size: 'tag-size', - value: 'base' - }, - Events: { - click: 'tag-event-click', - close: 'tag-event-close' - }, - Methods: {}, - Slots: { - new: 'slotNew', - text: 'slotText' - } - }, - tabs: { - Attributes: { - activeName: 'basic-usage', - tabStyle: 'tab-style-card', - withAdd: 'with-add', - withClose: 'with-close', - position: 'position-bottom', - 'before-leave': 'before-leave', - stretch: 'stretch-wh', - size: 'tabs-size', - value: 'basic-value' - }, - Events: { - add: 'tabs-events-add', - click: 'tabs-events-click', - close: 'tabs-events-close', - edit: 'tabs-events-edit' - }, - Methods: {}, - Slots: { - title: 'custom-tab-title' - } - }, - 'text-popup': { - Attributes: { - label: 'label', - placeholder: 'placeholder', - readonly: 'readonly', - value: 'value', - width: 'width', - separtor: 'separtor' - }, - Events: {}, - Methods: {}, - Slots: {} - }, - search: { - Attributes: { - 'default-value': 'default-value', - mini: 'mini-mode', - placeholder: 'basic-usage', - 'search-types': 'search-types', - transparent: 'transparent-mode' - }, - Events: { - change: 'search-events', - search: 'search-events' - }, - Methods: {}, - Slots: { - poplist: 'custom-search-types', - text: 'show-selected-types' - } - }, - slider: { - Attributes: { - value: 'basic-usage', - mini: 'disabled', - 'value / v-model': 'truevlue', - trueValue: 'truevlue', - falseValue: 'truevlue' - }, - Events: {}, - Methods: {}, - Slots: {} - }, - split: { - Attributes: { - 'left-top-min': 'base', - mode: 'base', - 'right-bottom-min': 'base', - value: 'base', - transparent: 'base' - }, - Events: { - moveend: 'events', - movestart: 'events', - moving: 'events' - }, - Methods: {}, - Slots: { - bottom: 'slots', - left: 'slots', - right: 'slots', - top: 'slots', - trigger: 'slots' - } - }, - 'card-template': { - Attributes: { - 'body-style': 'base', - 'header-line': 'base' - }, - Events: {}, - Methods: {}, - Slots: { - default: 'slots', - footer: 'slots', - header: 'slots' - } - }, - col: { - Attributes: { - span: 'base', - move: 'move', - offset: 'move', - xs: 'responsive', - sm: 'responsive', - xl: 'responsive', - md: 'responsive', - lg: 'responsive', - no: 'move', - tag: 'tag' - }, - Events: {}, - Methods: {}, - Slots: {} - }, - loading: { - Attributes: { - text: 'base', - background: 'background', - body: 'body', - customClass: 'custom-class', - lock: 'lock', - spinner: 'spinner', - transparent: 'opacity', - fullscreen: 'fullscreen', - target: 'target' - }, - Events: {}, - Methods: {}, - Slots: {} - }, - progress: { - Attributes: { - color: 'custom-color', - percentage: 'basic-usage', - 'show-text': 'format-text', - status: 'progress-status', - 'stroke-width': 'progress-width', - 'text-inside': 'text-inside-or-no-text', - type: 'progress-type' - } - }, - numeric: { - Attributes: { - controls: 'controls', - disabled: 'dynamic-disabled', - max: 'max-min', - min: 'max-min', - mouseWheel: 'mouse-wheel', - precision: 'precision', - step: 'about-step' - } - }, - milestone: { - Attributes: { - data: 'data-source', - 'completed-field': 'completed-field', - 'flag-before': 'flag-before', - 'flag-content-field': 'flag-content-field', - 'flag-field': 'flag-field', - 'flag-name-field': 'flag-name-field', - 'flag-status-field': 'flag-status-field', - 'line-style': 'line-style', - 'milestones-status': 'base', - 'show-number': 'show-number', - solid: 'solid', - space: 'space', - start: 'space', - 'status-field': 'status-field', - 'time-field': 'time-field' - }, - Events: { - click: 'click', - flagclick: 'click', - 'flag-click': 'click' - }, - Methods: {}, - Slots: { - bottom: 'bottom', - flag: 'flag', - top: 'top' - } - }, - modal: { - Attributes: { - 'value,v-model': 'value', - type: 'type', - id: 'id', - duration: 'duration', - fullscreen: 'fullscreen', - width: 'width', - height: 'height', - mask: 'lock-view', - message: 'message', - resize: 'resize', - showFooter: 'showFooter', - showHeader: 'showHeader', - status: 'status', - title: 'title', - top: 'top', - zIndex: 'zIndex', - 'min-width': 'min-width', - 'min-height': 'min-height', - 'esc-closable': 'esc-closable', - 'lock-view': 'lock-view', - 'lock-scroll': 'lock-scroll', - 'mask-closable': 'mask-closable' - }, - Events: { - confirm: 'confirm-event', - cancel: 'cancel-event', - close: 'close-event', - show: 'show-event', - hide: 'hide-event', - zoom: 'zoom-event' - }, - Methods: {}, - Slots: { - default: 'value', - footer: 'footer-slot' - } - }, - espace: { - Attributes: { - data: 'data' - }, - Events: {}, - Methods: {}, - Slots: {} - }, - steps: { - Attributes: { - data: 'data-resource', - active: 'order-progress', - 'count-field': 'custom-field', - 'name-field': 'custom-field', - space: 'space', - 'status-field': 'custom-field' - }, - Events: { - click: 'click' - }, - Methods: {}, - Slots: { - item: 'slot' - } - }, - 'user-head': { - Attributes: { - 'background-color': 'color', - color: 'color', - 'message-total': 'message-total', - 'message-type': 'message-type', - 'message-upper-limit': 'message-upper-limit', - min: 'shape', - round: 'shape', - type: 'type', - value: 'type' - }, - Events: {}, - Methods: {}, - Slots: { - default: 'slot' - } - }, - 'fall-menu': { - Attributes: { - data: 'a' - }, - Events: {}, - Methods: {}, - Slots: { - left: 'level', - level1: 'level', - level2: 'level', - level3: 'level', - right: 'level' - } - }, - rate: { - Attributes: { - colors: 'score', - 'disabled-void-color': 'disabledcolor', - 'disabled-void-icon-class': 'disabledcolor', - 'show-text': 'readiconclass', - 'icon-classes': 'colors', - disabled: 'disabledcolor', - 'text-color': 'readiconclass', - texts: 'readiconclass', - 'void-icon-class': 'colors', - 'allow-half': 'half', - 'score-template': 'textconfig', - 'show-score': 'textconfig', - 'void-color': 'colors', - 'text-on-bottom': 'half', - 'value / v-model': 'half', - size: 'spacesize', - space: 'spacesize', - 'high-threshold': 'score', - 'low-threshold': 'score', - max: 'score', - radio: 'radio' - }, - Events: { - change: 'events' - }, - Methods: {}, - Slots: {} - }, - 'ip-address': { - Attributes: { - delimiter: 'delimiter', - disabled: 'disabled', - readonly: 'readonly', - type: 'type', - value: 'type' - }, - Events: { - select: 'select', - input: 'input', - change: 'change', - focus: 'focus', - blur: 'blur' - }, - Methods: {}, - Slots: { - 默认插槽: 'slots' - } - }, - row: { - Attributes: { - align: 'align', - gutter: 'gutter', - justify: 'justify', - order: 'order', - tag: 'tag1' - }, - Events: {}, - Methods: {}, - Slots: {} - }, - 'user-contact': { - Attributes: { - data: 'basic-usage', - espace: 'support-open-espace', - 'show-img': 'support-open-espace', - 'show-name': 'support-open-espace', - 'show-description': 'support-open-espace' - }, - Events: {}, - Methods: {}, - Slots: {} - }, - 'user-link': { - Attributes: { - value: 'basic-usage', - 'value-split': 'value-split', - 'text-split': 'text-split', - 'value-field': 'value-field', - 'text-field': 'text-field', - service: 'custom-service' - }, - Events: {}, - Slots: {}, - Methods: {} - }, - tree: { - Attributes: { - accordion: 'accordion-mode', - 'allow-drag': 'allow-drag', - data: 'data-source', - 'allow-drop': 'allow-drop', - 'auto-expand-parent': 'auto-expand-parent', - 'basic-usage': 'basic-usage', - 'check-descendants': 'check-descendants', - 'check-on-click-node': 'check-on-click-node', - 'check-strictly': 'check-strictly', - 'current-node-key': 'current-node-key', - 'custom-empty-text': 'custom-empty-text', - 'custom-node-icon': 'custom-node-icon', - 'default-checked-keys': 'default-checked-keys', - 'default-expand-all': 'default-expand-all', - 'default-expanded-keys': 'default-expanded-keys', - 'disable-node': 'disable-node', - 'expand-on-click-node': 'expand-on-click-node', - 'filter-node-method': 'filter-node', - 'highlight-current': 'highlight-current', - indent: 'indent', - 'icon-class': 'icon-class', - 'node-draggable': 'node-draggable', - 'node-key': 'node-key', - props: 'node-props-config', - 'render-after-expand': 'render-after-expand', - 'render-content': 'render-content', - 'show-checkbox': 'show-checkbox', - 'lazy-load': 'lazy-load-node' - }, - Events: {}, - Methods: {}, - Slots: {} - }, - - 'time-select': { - Attributes: { - 'arrow-control': 'arrow-control', - 'clear-icon': 'clear-icon', - clearable: 'clearable', - 'default-time': 'default-time', - 'default-value': 'default-value', - disabled: 'disabled', - editable: 'editable', - 'start-placeholder': 'range-placeholder', - 'end-placeholder': 'range-placeholder', - placeholder: 'basic-usage', - name: '', - value: 'basic-usage', - 'v-model': 'basic-usage', - 'picker-options': 'picker-options', - 'popper-class': '', - 'prefix-icon': 'prefix-icon', - 'range-separator': '', - size: 'size-mini' - }, - Events: { - 'event-change': 'event', - 'event-blur': 'event', - 'event-focus': 'event' - }, - Methods: {}, - Slots: {} - }, - transfer: { - Attributes: { - 'button-texts': 'custom-button-texts', - columns: '', - data: '', - 'drop-config': 'drop-config', - 'filter-method': 'custom-filter-method', - 'filter-placeholder': 'filter-placeholder', - filterable: 'filterable', - format: 'checked-format-text', - 'left-default-checked': 'default-checked', - 'page-vo': '', - props: 'props-of-data-source', - 'render-content': 'custom-render-content', - 'render-type': '', - 'right-default-checked': 'default-checked', - 'show-all-btn': '', - sortable: '', - 'target-order': 'custom-data-items', - titles: 'custom-transfer-titles', - 'to-left-disable': '', - 'to-right-disable': '', - 'value/v-model': 'basic-usage' - }, - Events: { - change: 'transfer-events', - 'left-check-change': 'transfer-events', - 'right-check-change': 'transfer-events' - }, - Slots: { - default: 'custom-data-items', - 'left-footer': 'custom-footer', - 'right-footer': 'custom-footer' - }, - Methods: { - clearQuery: 'manual-clear-query' - } - }, - - logout: { - Attributes: { - guestRole: 'basic-usage', - service: 'custom-service' - } - }, - - user: { - Attributes: { - value: 'basic-usage', - multiple: 'multiple-users', - disabled: 'dynamic-disable', - 'value-split': 'value-split', - 'value-field': 'value-field', - 'text-field': 'text-field', - cache: 'cache-users', - 'cache-key': 'cache-users', - delay: 'delay-load', - 'suggest-length': 'load-after-input-the-length', - 'cache-fields': 'cache-users', - service: 'custom-service', - 'collapse-tags': '', - placeholder: 'custom-placeholder', - 'expand-tags': '', - sortable: 'custom-sort', - size: 'user-select-size' - }, - Events: {}, - Slots: {}, - Methods: {} - }, - carousel: { - Attributes: {}, - Events: {}, - Methods: {}, - Slots: {} - }, - checkbox: { - Attributes: {}, - Events: {}, - Methods: {}, - Slots: {} - }, - 'dialog-box': { - Attributes: {}, - Events: {}, - Methods: {}, - Slots: {} - }, - radio: { - Attributes: { - disabled: 'dynamic-disable', - border: 'with-border', - label: 'basic-usage', - name: '', - size: 'radio-size' - }, - Events: { - change: 'radio-events' - }, - Slots: { - default: 'basic-usage' - }, - Methods: {} - }, - pager: { - Attributes: { - 'pager-count': 'pager-count', - mode: 'pager-mode', - 'value / v-model': 'basic-usage', - 'page-sizes': 'page-size', - layout: 'custom-layout', - 'current-page': 'current-page', - 'hide-on-single-page': 'hide-on-single-page', - 'next-text': 'custom-next-prev-text', - 'page-count': 'page-count', - 'page-size': 'page-size', - 'prev-text': 'custom-next-prev-text', - total: 'pager-in-grid' - }, - Events: { - 'size-change': 'pager-events', - 'current-change': 'pager-events', - 'next-click': 'pager-events', - 'prev-click': 'pager-events' - }, - Methods: {}, - Slots: { - default: '' - } - }, - collapse: { - Attributes: { - 'value / v-model': 'basic-usage', - accordion: 'accordion' - }, - Events: { - change: 'collapse-events' - }, - Methods: {}, - Slots: {} - }, - 'slide-bar': { - Attributes: { - value: 'basic-usage', - 'init-blocks': 'basic-usage', - 'wheel-blocks': 'wheel-blocks', - tag: 'custom-tag', - 'sub-tag': 'custom-tag' - }, - Events: { - click: 'slide-bar-events', - 'before-click': 'slide-bar-events' - }, - Methods: {}, - Slots: { - default: 'custom-content' - } - }, - 'credit-card-form': { - Attributes: { - 'form-data': 'basic-usage' - }, - Events: { - 'input-card-cvv': 'basic-usage', - 'input-card-month': 'basic-usage', - 'input-card-name': 'basic-usage', - 'input-card-number': 'basic-usage', - 'input-card-year': 'basic-usage', - submit: 'basic-usage' - }, - Methods: {}, - Slots: {} - }, - 'time-line': { - Attributes: { - vertical: 'vertical-step', - 'show-number': 'show-number', - 'name-field': 'different-data', - 'time-field': 'different-data', - start: 'set-start-value', - data: 'basic-usage', - space: 'set-step-width', - active: 'basic-usage', - reverse: 'vertical-step' - }, - Events: { - click: 'basic-usage' - }, - Methods: {}, - Slots: { - top: 'custom-normal-step', - bottom: 'custom-normal-step', - left: 'custom-vertical-step', - right: 'custom-vertical-step' - } - }, - 'date-picker': { - Attributes: { - 'value/v-model': 'basic-usage', - align: 'align', - 'clear-icon': 'about-clear', - clearable: 'about-clear', - type: 'date-range', - 'picker-options': 'date-range-shortcuts', - 'start-placeholder': 'custom-range', - 'end-placeholder': 'custom-range', - 'range-separator': 'custom-range', - 'default-time': 'default-time-of-range', - disabled: 'disabled', - 'default-value': 'default-value', - editable: 'editable', - format: 'about-format', - 'prefix-icon': 'custom-prefix-icon', - size: 'set-size', - placeholder: 'custom-placeholder', - 'unlink-panels': 'unlink-panels' - }, - Events: { - blur: 'date-picker-events', - change: 'date-picker-events', - focus: 'date-picker-events' - }, - Methods: {}, - Slots: {} - }, - 'logon-user': { - Attributes: { - service: 'custom-service' - }, - Events: {}, - Methods: {}, - Slots: {} - }, - 'user-account': { - Attributes: { - service: 'custom-service' - }, - Events: {}, - Methods: {}, - Slots: { - default: 'custom-operation' - } - } -} diff --git a/example/src/demo/pc/container/basic-usage.vue b/example/src/demo/pc/container/basic-usage.vue deleted file mode 100644 index cb69e7325..000000000 --- a/example/src/demo/pc/container/basic-usage.vue +++ /dev/null @@ -1,58 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/country/basic-usage.vue b/example/src/demo/pc/country/basic-usage.vue deleted file mode 100644 index f0da928f8..000000000 --- a/example/src/demo/pc/country/basic-usage.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - diff --git a/example/src/demo/pc/country/custom-service.vue b/example/src/demo/pc/country/custom-service.vue deleted file mode 100644 index 68f528646..000000000 --- a/example/src/demo/pc/country/custom-service.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/country/fields.vue b/example/src/demo/pc/country/fields.vue deleted file mode 100644 index c1417caea..000000000 --- a/example/src/demo/pc/country/fields.vue +++ /dev/null @@ -1,50 +0,0 @@ - - - diff --git a/example/src/demo/pc/credit-card-form/basic-usage.vue b/example/src/demo/pc/credit-card-form/basic-usage.vue deleted file mode 100644 index 15359ab0d..000000000 --- a/example/src/demo/pc/credit-card-form/basic-usage.vue +++ /dev/null @@ -1,24 +0,0 @@ - - - diff --git a/example/src/demo/pc/crop/aspect-ratio.vue b/example/src/demo/pc/crop/aspect-ratio.vue deleted file mode 100644 index d310ccf96..000000000 --- a/example/src/demo/pc/crop/aspect-ratio.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/crop/auto-crop-area.vue b/example/src/demo/pc/crop/auto-crop-area.vue deleted file mode 100644 index 5afdbd726..000000000 --- a/example/src/demo/pc/crop/auto-crop-area.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/crop/basic-usage.vue b/example/src/demo/pc/crop/basic-usage.vue deleted file mode 100644 index b1bf86896..000000000 --- a/example/src/demo/pc/crop/basic-usage.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/crop/crop-meth.vue b/example/src/demo/pc/crop/crop-meth.vue deleted file mode 100644 index 983496a94..000000000 --- a/example/src/demo/pc/crop/crop-meth.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - diff --git a/example/src/demo/pc/crop/drag-mode.vue b/example/src/demo/pc/crop/drag-mode.vue deleted file mode 100644 index a308131fc..000000000 --- a/example/src/demo/pc/crop/drag-mode.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/crop/event-ready.vue b/example/src/demo/pc/crop/event-ready.vue deleted file mode 100644 index d9e0e63b1..000000000 --- a/example/src/demo/pc/crop/event-ready.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/crop/no-background.vue b/example/src/demo/pc/crop/no-background.vue deleted file mode 100644 index 48619f832..000000000 --- a/example/src/demo/pc/crop/no-background.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/crop/no-modal.vue b/example/src/demo/pc/crop/no-modal.vue deleted file mode 100644 index b8096b9f5..000000000 --- a/example/src/demo/pc/crop/no-modal.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/crop/replace-image.vue b/example/src/demo/pc/crop/replace-image.vue deleted file mode 100644 index 3ef91d1c4..000000000 --- a/example/src/demo/pc/crop/replace-image.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - diff --git a/example/src/demo/pc/crop/wheel-zoom-ratio.vue b/example/src/demo/pc/crop/wheel-zoom-ratio.vue deleted file mode 100644 index 77b407624..000000000 --- a/example/src/demo/pc/crop/wheel-zoom-ratio.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/crop/zoom-on-wheel.vue b/example/src/demo/pc/crop/zoom-on-wheel.vue deleted file mode 100644 index 89ce80029..000000000 --- a/example/src/demo/pc/crop/zoom-on-wheel.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/currency/basic-usage.vue b/example/src/demo/pc/currency/basic-usage.vue deleted file mode 100644 index 101a94e27..000000000 --- a/example/src/demo/pc/currency/basic-usage.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - diff --git a/example/src/demo/pc/currency/custom-service.vue b/example/src/demo/pc/currency/custom-service.vue deleted file mode 100644 index f95f13652..000000000 --- a/example/src/demo/pc/currency/custom-service.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - diff --git a/example/src/demo/pc/currency/fields.vue b/example/src/demo/pc/currency/fields.vue deleted file mode 100644 index 97f4ecffa..000000000 --- a/example/src/demo/pc/currency/fields.vue +++ /dev/null @@ -1,43 +0,0 @@ - - - diff --git a/example/src/demo/pc/currency/size.vue b/example/src/demo/pc/currency/size.vue deleted file mode 100644 index e147f7612..000000000 --- a/example/src/demo/pc/currency/size.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - diff --git a/example/src/demo/pc/date-picker/align.vue b/example/src/demo/pc/date-picker/align.vue deleted file mode 100644 index 4e12c3931..000000000 --- a/example/src/demo/pc/date-picker/align.vue +++ /dev/null @@ -1,36 +0,0 @@ - - - diff --git a/example/src/demo/pc/date-picker/basic-usage.vue b/example/src/demo/pc/date-picker/basic-usage.vue deleted file mode 100644 index d13123ca5..000000000 --- a/example/src/demo/pc/date-picker/basic-usage.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/pc/date-picker/clearable.vue b/example/src/demo/pc/date-picker/clearable.vue deleted file mode 100644 index d5afd760a..000000000 --- a/example/src/demo/pc/date-picker/clearable.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - diff --git a/example/src/demo/pc/date-picker/custom-range.vue b/example/src/demo/pc/date-picker/custom-range.vue deleted file mode 100644 index 8b1632a0b..000000000 --- a/example/src/demo/pc/date-picker/custom-range.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/date-picker/default-value.vue b/example/src/demo/pc/date-picker/default-value.vue deleted file mode 100644 index 09e10d24c..000000000 --- a/example/src/demo/pc/date-picker/default-value.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/date-picker/disabled.vue b/example/src/demo/pc/date-picker/disabled.vue deleted file mode 100644 index 18c8c14fd..000000000 --- a/example/src/demo/pc/date-picker/disabled.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/date-picker/editable.vue b/example/src/demo/pc/date-picker/editable.vue deleted file mode 100644 index eb210a1e5..000000000 --- a/example/src/demo/pc/date-picker/editable.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/date-picker/focus.vue b/example/src/demo/pc/date-picker/focus.vue deleted file mode 100644 index f3f276822..000000000 --- a/example/src/demo/pc/date-picker/focus.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - diff --git a/example/src/demo/pc/date-picker/max-min.vue b/example/src/demo/pc/date-picker/max-min.vue deleted file mode 100644 index 05896094d..000000000 --- a/example/src/demo/pc/date-picker/max-min.vue +++ /dev/null @@ -1,38 +0,0 @@ - - - diff --git a/example/src/demo/pc/date-picker/readonly.vue b/example/src/demo/pc/date-picker/readonly.vue deleted file mode 100644 index d27549c0a..000000000 --- a/example/src/demo/pc/date-picker/readonly.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/date-picker/timezone.vue b/example/src/demo/pc/date-picker/timezone.vue deleted file mode 100644 index cbcd1dbd8..000000000 --- a/example/src/demo/pc/date-picker/timezone.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/date-picker/utc8.vue b/example/src/demo/pc/date-picker/utc8.vue deleted file mode 100644 index b1bdd1cfc..000000000 --- a/example/src/demo/pc/date-picker/utc8.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/date-picker/validate-event.vue b/example/src/demo/pc/date-picker/validate-event.vue deleted file mode 100644 index 077759756..000000000 --- a/example/src/demo/pc/date-picker/validate-event.vue +++ /dev/null @@ -1,85 +0,0 @@ - - - diff --git a/example/src/demo/pc/dept/basic-usage.vue b/example/src/demo/pc/dept/basic-usage.vue deleted file mode 100644 index 66fdd2097..000000000 --- a/example/src/demo/pc/dept/basic-usage.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/dept/custom-service.vue b/example/src/demo/pc/dept/custom-service.vue deleted file mode 100644 index ac138657d..000000000 --- a/example/src/demo/pc/dept/custom-service.vue +++ /dev/null @@ -1,83 +0,0 @@ - - - diff --git a/example/src/demo/pc/dept/dynamic-disable.vue b/example/src/demo/pc/dept/dynamic-disable.vue deleted file mode 100644 index cba1e91a8..000000000 --- a/example/src/demo/pc/dept/dynamic-disable.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/dept/size.vue b/example/src/demo/pc/dept/size.vue deleted file mode 100644 index 5acd7f094..000000000 --- a/example/src/demo/pc/dept/size.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/dept/title.vue b/example/src/demo/pc/dept/title.vue deleted file mode 100644 index 1804bef3a..000000000 --- a/example/src/demo/pc/dept/title.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/detail-page/basic-usage.vue b/example/src/demo/pc/detail-page/basic-usage.vue deleted file mode 100644 index b6b6d3f3f..000000000 --- a/example/src/demo/pc/detail-page/basic-usage.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - diff --git a/example/src/demo/pc/dialog-box/basic-usage.vue b/example/src/demo/pc/dialog-box/basic-usage.vue deleted file mode 100644 index 5f8c426b3..000000000 --- a/example/src/demo/pc/dialog-box/basic-usage.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - diff --git a/example/src/demo/pc/dialog-box/center.vue b/example/src/demo/pc/dialog-box/center.vue deleted file mode 100644 index fbfe7ab42..000000000 --- a/example/src/demo/pc/dialog-box/center.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/pc/dialog-box/close-on-click-modal.vue b/example/src/demo/pc/dialog-box/close-on-click-modal.vue deleted file mode 100644 index 429a59dbf..000000000 --- a/example/src/demo/pc/dialog-box/close-on-click-modal.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/pc/dialog-box/draggable.vue b/example/src/demo/pc/dialog-box/draggable.vue deleted file mode 100644 index 977724feb..000000000 --- a/example/src/demo/pc/dialog-box/draggable.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - diff --git a/example/src/demo/pc/dialog-box/fullscreen.vue b/example/src/demo/pc/dialog-box/fullscreen.vue deleted file mode 100644 index 1c1397dde..000000000 --- a/example/src/demo/pc/dialog-box/fullscreen.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/pc/dialog-box/lock-scroll.vue b/example/src/demo/pc/dialog-box/lock-scroll.vue deleted file mode 100644 index 9509cb5ec..000000000 --- a/example/src/demo/pc/dialog-box/lock-scroll.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/pc/dialog-box/no-modal.vue b/example/src/demo/pc/dialog-box/no-modal.vue deleted file mode 100644 index addb26ea7..000000000 --- a/example/src/demo/pc/dialog-box/no-modal.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/pc/drop-roles/basic-usage.vue b/example/src/demo/pc/drop-roles/basic-usage.vue deleted file mode 100644 index 81e3b917f..000000000 --- a/example/src/demo/pc/drop-roles/basic-usage.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/drop-roles/custom-service.vue b/example/src/demo/pc/drop-roles/custom-service.vue deleted file mode 100644 index 952d9c97d..000000000 --- a/example/src/demo/pc/drop-roles/custom-service.vue +++ /dev/null @@ -1,52 +0,0 @@ - - - diff --git a/example/src/demo/pc/drop-roles/size.vue b/example/src/demo/pc/drop-roles/size.vue deleted file mode 100644 index 7d4fdccf3..000000000 --- a/example/src/demo/pc/drop-roles/size.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/example/src/demo/pc/drop-times/basic-usage.vue b/example/src/demo/pc/drop-times/basic-usage.vue deleted file mode 100644 index 2fa972852..000000000 --- a/example/src/demo/pc/drop-times/basic-usage.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - diff --git a/example/src/demo/pc/drop-times/size.vue b/example/src/demo/pc/drop-times/size.vue deleted file mode 100644 index 4e20d3c75..000000000 --- a/example/src/demo/pc/drop-times/size.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - diff --git a/example/src/demo/pc/dropdown/basic-usage.vue b/example/src/demo/pc/dropdown/basic-usage.vue deleted file mode 100644 index d8dca181a..000000000 --- a/example/src/demo/pc/dropdown/basic-usage.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - diff --git a/example/src/demo/pc/dropdown/events.vue b/example/src/demo/pc/dropdown/events.vue deleted file mode 100644 index b19f09c91..000000000 --- a/example/src/demo/pc/dropdown/events.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - diff --git a/example/src/demo/pc/dropdown/options.vue b/example/src/demo/pc/dropdown/options.vue deleted file mode 100644 index d45d1d5df..000000000 --- a/example/src/demo/pc/dropdown/options.vue +++ /dev/null @@ -1,119 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/dropdown/size.vue b/example/src/demo/pc/dropdown/size.vue deleted file mode 100644 index 08b37ef1a..000000000 --- a/example/src/demo/pc/dropdown/size.vue +++ /dev/null @@ -1,65 +0,0 @@ - - - diff --git a/example/src/demo/pc/edoc/base.vue b/example/src/demo/pc/edoc/base.vue deleted file mode 100644 index eff9f35a9..000000000 --- a/example/src/demo/pc/edoc/base.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/edoc/can-be-del.vue b/example/src/demo/pc/edoc/can-be-del.vue deleted file mode 100644 index 3473bde4d..000000000 --- a/example/src/demo/pc/edoc/can-be-del.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/edoc/default-slot.vue b/example/src/demo/pc/edoc/default-slot.vue deleted file mode 100644 index a27dc01c8..000000000 --- a/example/src/demo/pc/edoc/default-slot.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - diff --git a/example/src/demo/pc/edoc/doc-format.vue b/example/src/demo/pc/edoc/doc-format.vue deleted file mode 100644 index ecc50b5e9..000000000 --- a/example/src/demo/pc/edoc/doc-format.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/edoc/edoc-btn-icon.vue b/example/src/demo/pc/edoc/edoc-btn-icon.vue deleted file mode 100644 index 8a759e483..000000000 --- a/example/src/demo/pc/edoc/edoc-btn-icon.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - diff --git a/example/src/demo/pc/edoc/edoc-btn-text.vue b/example/src/demo/pc/edoc/edoc-btn-text.vue deleted file mode 100644 index 897757ba9..000000000 --- a/example/src/demo/pc/edoc/edoc-btn-text.vue +++ /dev/null @@ -1,15 +0,0 @@ - - - diff --git a/example/src/demo/pc/edoc/events.vue b/example/src/demo/pc/edoc/events.vue deleted file mode 100644 index 0774a3e71..000000000 --- a/example/src/demo/pc/edoc/events.vue +++ /dev/null @@ -1,36 +0,0 @@ - - - diff --git a/example/src/demo/pc/edoc/fetch-api.vue b/example/src/demo/pc/edoc/fetch-api.vue deleted file mode 100644 index fbf8f527f..000000000 --- a/example/src/demo/pc/edoc/fetch-api.vue +++ /dev/null @@ -1,49 +0,0 @@ - - - diff --git a/example/src/demo/pc/edoc/fetch-upload.vue b/example/src/demo/pc/edoc/fetch-upload.vue deleted file mode 100644 index 3aefce4fa..000000000 --- a/example/src/demo/pc/edoc/fetch-upload.vue +++ /dev/null @@ -1,39 +0,0 @@ - - - diff --git a/example/src/demo/pc/edoc/file-whitelist.vue b/example/src/demo/pc/edoc/file-whitelist.vue deleted file mode 100644 index 8ef026a5e..000000000 --- a/example/src/demo/pc/edoc/file-whitelist.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/edoc/is-constraint.vue b/example/src/demo/pc/edoc/is-constraint.vue deleted file mode 100644 index 956c396e5..000000000 --- a/example/src/demo/pc/edoc/is-constraint.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/edoc/methods.vue b/example/src/demo/pc/edoc/methods.vue deleted file mode 100644 index 70104c3b1..000000000 --- a/example/src/demo/pc/edoc/methods.vue +++ /dev/null @@ -1,51 +0,0 @@ - - - diff --git a/example/src/demo/pc/edoc/sub-class-name.vue b/example/src/demo/pc/edoc/sub-class-name.vue deleted file mode 100644 index 88e64b5cc..000000000 --- a/example/src/demo/pc/edoc/sub-class-name.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/edoc/web-doc-ext.vue b/example/src/demo/pc/edoc/web-doc-ext.vue deleted file mode 100644 index 992316a8b..000000000 --- a/example/src/demo/pc/edoc/web-doc-ext.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/edoc/web-doc-preview.vue b/example/src/demo/pc/edoc/web-doc-preview.vue deleted file mode 100644 index 2631ef54e..000000000 --- a/example/src/demo/pc/edoc/web-doc-preview.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - diff --git a/example/src/demo/pc/espace/data.vue b/example/src/demo/pc/espace/data.vue deleted file mode 100644 index 5320d6ad9..000000000 --- a/example/src/demo/pc/espace/data.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - diff --git a/example/src/demo/pc/fall-menu/data-resource.vue b/example/src/demo/pc/fall-menu/data-resource.vue deleted file mode 100644 index ca51c6473..000000000 --- a/example/src/demo/pc/fall-menu/data-resource.vue +++ /dev/null @@ -1,182 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/file-upload/abort-quest.vue b/example/src/demo/pc/file-upload/abort-quest.vue deleted file mode 100644 index a8801be97..000000000 --- a/example/src/demo/pc/file-upload/abort-quest.vue +++ /dev/null @@ -1,30 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/accept-file-image.vue b/example/src/demo/pc/file-upload/accept-file-image.vue deleted file mode 100644 index 0565063ce..000000000 --- a/example/src/demo/pc/file-upload/accept-file-image.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/accept-file.vue b/example/src/demo/pc/file-upload/accept-file.vue deleted file mode 100644 index 966bb15d8..000000000 --- a/example/src/demo/pc/file-upload/accept-file.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/basic-usage.vue b/example/src/demo/pc/file-upload/basic-usage.vue deleted file mode 100644 index 62f0005e4..000000000 --- a/example/src/demo/pc/file-upload/basic-usage.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/clear-files.vue b/example/src/demo/pc/file-upload/clear-files.vue deleted file mode 100644 index c0cfc8db5..000000000 --- a/example/src/demo/pc/file-upload/clear-files.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/custom-prefix.vue b/example/src/demo/pc/file-upload/custom-prefix.vue deleted file mode 100644 index a78b5fcf2..000000000 --- a/example/src/demo/pc/file-upload/custom-prefix.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/custom-trigger.vue b/example/src/demo/pc/file-upload/custom-trigger.vue deleted file mode 100644 index 012917e05..000000000 --- a/example/src/demo/pc/file-upload/custom-trigger.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/custom-upload-request.vue b/example/src/demo/pc/file-upload/custom-upload-request.vue deleted file mode 100644 index 702628354..000000000 --- a/example/src/demo/pc/file-upload/custom-upload-request.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/custom-upload-tip.vue b/example/src/demo/pc/file-upload/custom-upload-tip.vue deleted file mode 100644 index 42da7615c..000000000 --- a/example/src/demo/pc/file-upload/custom-upload-tip.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/drag-select-file.vue b/example/src/demo/pc/file-upload/drag-select-file.vue deleted file mode 100644 index 81ea9a71b..000000000 --- a/example/src/demo/pc/file-upload/drag-select-file.vue +++ /dev/null @@ -1,33 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/drag-upload.vue b/example/src/demo/pc/file-upload/drag-upload.vue deleted file mode 100644 index e0d0370d0..000000000 --- a/example/src/demo/pc/file-upload/drag-upload.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/dynamic-disable.vue b/example/src/demo/pc/file-upload/dynamic-disable.vue deleted file mode 100644 index e59594694..000000000 --- a/example/src/demo/pc/file-upload/dynamic-disable.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/edm-download.vue b/example/src/demo/pc/file-upload/edm-download.vue deleted file mode 100644 index e82e5ea86..000000000 --- a/example/src/demo/pc/file-upload/edm-download.vue +++ /dev/null @@ -1,99 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/file-upload/edm-folder-upload.vue b/example/src/demo/pc/file-upload/edm-folder-upload.vue deleted file mode 100644 index 4b06ac0d0..000000000 --- a/example/src/demo/pc/file-upload/edm-folder-upload.vue +++ /dev/null @@ -1,57 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/edm-pack-download.vue b/example/src/demo/pc/file-upload/edm-pack-download.vue deleted file mode 100644 index 660ea9c27..000000000 --- a/example/src/demo/pc/file-upload/edm-pack-download.vue +++ /dev/null @@ -1,93 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/file-upload/edm-updatefile.vue b/example/src/demo/pc/file-upload/edm-updatefile.vue deleted file mode 100644 index c44e7b281..000000000 --- a/example/src/demo/pc/file-upload/edm-updatefile.vue +++ /dev/null @@ -1,39 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/edm-upload-grid.vue b/example/src/demo/pc/file-upload/edm-upload-grid.vue deleted file mode 100644 index 2c47cf8ab..000000000 --- a/example/src/demo/pc/file-upload/edm-upload-grid.vue +++ /dev/null @@ -1,77 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/file-upload/edm-upload.vue b/example/src/demo/pc/file-upload/edm-upload.vue deleted file mode 100644 index 38fcfe59c..000000000 --- a/example/src/demo/pc/file-upload/edm-upload.vue +++ /dev/null @@ -1,38 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/file-picture-card.vue b/example/src/demo/pc/file-upload/file-picture-card.vue deleted file mode 100644 index 80ce7dff2..000000000 --- a/example/src/demo/pc/file-upload/file-picture-card.vue +++ /dev/null @@ -1,52 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/http-request.vue b/example/src/demo/pc/file-upload/http-request.vue deleted file mode 100644 index 0735d85fa..000000000 --- a/example/src/demo/pc/file-upload/http-request.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/image-size.vue b/example/src/demo/pc/file-upload/image-size.vue deleted file mode 100644 index a5a313540..000000000 --- a/example/src/demo/pc/file-upload/image-size.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/jalor-request.vue b/example/src/demo/pc/file-upload/jalor-request.vue deleted file mode 100644 index 551328d8a..000000000 --- a/example/src/demo/pc/file-upload/jalor-request.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/manual-upload.vue b/example/src/demo/pc/file-upload/manual-upload.vue deleted file mode 100644 index fdf515985..000000000 --- a/example/src/demo/pc/file-upload/manual-upload.vue +++ /dev/null @@ -1,30 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/max-file-count.vue b/example/src/demo/pc/file-upload/max-file-count.vue deleted file mode 100644 index 0bc67a93d..000000000 --- a/example/src/demo/pc/file-upload/max-file-count.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/mini-mode.vue b/example/src/demo/pc/file-upload/mini-mode.vue deleted file mode 100644 index 7c2d9c5ee..000000000 --- a/example/src/demo/pc/file-upload/mini-mode.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/multiple-file.vue b/example/src/demo/pc/file-upload/multiple-file.vue deleted file mode 100644 index e106d3dc5..000000000 --- a/example/src/demo/pc/file-upload/multiple-file.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/picture-card.vue b/example/src/demo/pc/file-upload/picture-card.vue deleted file mode 100644 index c27ce0c21..000000000 --- a/example/src/demo/pc/file-upload/picture-card.vue +++ /dev/null @@ -1,30 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/picture-list.vue b/example/src/demo/pc/file-upload/picture-list.vue deleted file mode 100644 index 4a442eeb8..000000000 --- a/example/src/demo/pc/file-upload/picture-list.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/prevent-delete-file.vue b/example/src/demo/pc/file-upload/prevent-delete-file.vue deleted file mode 100644 index 671e96435..000000000 --- a/example/src/demo/pc/file-upload/prevent-delete-file.vue +++ /dev/null @@ -1,39 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/prevent-upload-file.vue b/example/src/demo/pc/file-upload/prevent-upload-file.vue deleted file mode 100644 index 2c24eb268..000000000 --- a/example/src/demo/pc/file-upload/prevent-upload-file.vue +++ /dev/null @@ -1,39 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/size.vue b/example/src/demo/pc/file-upload/size.vue deleted file mode 100644 index bffc331f1..000000000 --- a/example/src/demo/pc/file-upload/size.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/upload-events.vue b/example/src/demo/pc/file-upload/upload-events.vue deleted file mode 100644 index dcdaaa92a..000000000 --- a/example/src/demo/pc/file-upload/upload-events.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/upload-file-filters.vue b/example/src/demo/pc/file-upload/upload-file-filters.vue deleted file mode 100644 index fee0a198b..000000000 --- a/example/src/demo/pc/file-upload/upload-file-filters.vue +++ /dev/null @@ -1,43 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/upload-file-list-thumb.vue b/example/src/demo/pc/file-upload/upload-file-list-thumb.vue deleted file mode 100644 index bd4542d92..000000000 --- a/example/src/demo/pc/file-upload/upload-file-list-thumb.vue +++ /dev/null @@ -1,36 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/upload-file-list.vue b/example/src/demo/pc/file-upload/upload-file-list.vue deleted file mode 100644 index 3a4320ff3..000000000 --- a/example/src/demo/pc/file-upload/upload-file-list.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/upload-limit.vue b/example/src/demo/pc/file-upload/upload-limit.vue deleted file mode 100644 index fc4fb362c..000000000 --- a/example/src/demo/pc/file-upload/upload-limit.vue +++ /dev/null @@ -1,33 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/upload-request.vue b/example/src/demo/pc/file-upload/upload-request.vue deleted file mode 100644 index c64bb00bb..000000000 --- a/example/src/demo/pc/file-upload/upload-request.vue +++ /dev/null @@ -1,41 +0,0 @@ - - - diff --git a/example/src/demo/pc/file-upload/upload-user-head.vue b/example/src/demo/pc/file-upload/upload-user-head.vue deleted file mode 100644 index 28b6fc9c5..000000000 --- a/example/src/demo/pc/file-upload/upload-user-head.vue +++ /dev/null @@ -1,48 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/floatbar/base.vue b/example/src/demo/pc/floatbar/base.vue deleted file mode 100644 index fdd0dd72d..000000000 --- a/example/src/demo/pc/floatbar/base.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/pc/form/size.vue b/example/src/demo/pc/form/size.vue deleted file mode 100644 index 5439fdd18..000000000 --- a/example/src/demo/pc/form/size.vue +++ /dev/null @@ -1,72 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/fullscreen/example-api.vue b/example/src/demo/pc/fullscreen/example-api.vue deleted file mode 100644 index c8e59d149..000000000 --- a/example/src/demo/pc/fullscreen/example-api.vue +++ /dev/null @@ -1,45 +0,0 @@ - - - diff --git a/example/src/demo/pc/fullscreen/example-component.vue b/example/src/demo/pc/fullscreen/example-component.vue deleted file mode 100644 index 1a4df2f3e..000000000 --- a/example/src/demo/pc/fullscreen/example-component.vue +++ /dev/null @@ -1,41 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/adaptive-column-width.vue b/example/src/demo/pc/grid/aui3-first-menu/adaptive-column-width.vue deleted file mode 100644 index 727e6e541..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/adaptive-column-width.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/adaptive-grid-off-width-height.vue b/example/src/demo/pc/grid/aui3-first-menu/adaptive-grid-off-width-height.vue deleted file mode 100644 index 8ab64b2f9..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/adaptive-grid-off-width-height.vue +++ /dev/null @@ -1,114 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/adaptive-grid-width-height.vue b/example/src/demo/pc/grid/aui3-first-menu/adaptive-grid-width-height.vue deleted file mode 100644 index 093b3d096..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/adaptive-grid-width-height.vue +++ /dev/null @@ -1,114 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/adaptive-un-column-width.vue b/example/src/demo/pc/grid/aui3-first-menu/adaptive-un-column-width.vue deleted file mode 100644 index a5be460c3..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/adaptive-un-column-width.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/auto-load.vue b/example/src/demo/pc/grid/aui3-first-menu/auto-load.vue deleted file mode 100644 index 320201d3d..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/auto-load.vue +++ /dev/null @@ -1,97 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/cell-editing.vue b/example/src/demo/pc/grid/aui3-first-menu/cell-editing.vue deleted file mode 100644 index 4d8124625..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/cell-editing.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/clearData.vue b/example/src/demo/pc/grid/aui3-first-menu/clearData.vue deleted file mode 100644 index 939bd67d5..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/clearData.vue +++ /dev/null @@ -1,123 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/clearRadioRow.vue b/example/src/demo/pc/grid/aui3-first-menu/clearRadioRow.vue deleted file mode 100644 index 1e1a51ab4..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/clearRadioRow.vue +++ /dev/null @@ -1,89 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/clearSelection.vue b/example/src/demo/pc/grid/aui3-first-menu/clearSelection.vue deleted file mode 100644 index 7975c7457..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/clearSelection.vue +++ /dev/null @@ -1,89 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/column-asyn-rendering.vue b/example/src/demo/pc/grid/aui3-first-menu/column-asyn-rendering.vue deleted file mode 100644 index 60bce7ba2..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/column-asyn-rendering.vue +++ /dev/null @@ -1,162 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/column-key.vue b/example/src/demo/pc/grid/aui3-first-menu/column-key.vue deleted file mode 100644 index 64a3a4a26..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/column-key.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/column-min-width.vue b/example/src/demo/pc/grid/aui3-first-menu/column-min-width.vue deleted file mode 100644 index f0a0a3097..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/column-min-width.vue +++ /dev/null @@ -1,80 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/column-width.vue b/example/src/demo/pc/grid/aui3-first-menu/column-width.vue deleted file mode 100644 index 4bb4d8d0c..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/column-width.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/columns.vue b/example/src/demo/pc/grid/aui3-first-menu/columns.vue deleted file mode 100644 index 9146e34d8..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/columns.vue +++ /dev/null @@ -1,91 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/copy-row-data.vue b/example/src/demo/pc/grid/aui3-first-menu/copy-row-data.vue deleted file mode 100644 index 78968ab66..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/copy-row-data.vue +++ /dev/null @@ -1,107 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/custom-editing.vue b/example/src/demo/pc/grid/aui3-first-menu/custom-editing.vue deleted file mode 100644 index 49bbd311a..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/custom-editing.vue +++ /dev/null @@ -1,117 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/custom-operation-column.vue b/example/src/demo/pc/grid/aui3-first-menu/custom-operation-column.vue deleted file mode 100644 index cd829ec88..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/custom-operation-column.vue +++ /dev/null @@ -1,102 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/custom-serial-column.vue b/example/src/demo/pc/grid/aui3-first-menu/custom-serial-column.vue deleted file mode 100644 index dce127a28..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/custom-serial-column.vue +++ /dev/null @@ -1,74 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/custom-toolbar.vue b/example/src/demo/pc/grid/aui3-first-menu/custom-toolbar.vue deleted file mode 100644 index 6ec14a678..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/custom-toolbar.vue +++ /dev/null @@ -1,148 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/default-serial-column.vue b/example/src/demo/pc/grid/aui3-first-menu/default-serial-column.vue deleted file mode 100644 index 0937a671a..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/default-serial-column.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/editor-is-salid-always.vue b/example/src/demo/pc/grid/aui3-first-menu/editor-is-salid-always.vue deleted file mode 100644 index aab1cc028..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/editor-is-salid-always.vue +++ /dev/null @@ -1,144 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/empty-data-default-tip.vue b/example/src/demo/pc/grid/aui3-first-menu/empty-data-default-tip.vue deleted file mode 100644 index a3fb0b821..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/empty-data-default-tip.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/empty-data-iscenter.vue b/example/src/demo/pc/grid/aui3-first-menu/empty-data-iscenter.vue deleted file mode 100644 index 8729e4f0c..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/empty-data-iscenter.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/empty-data-tip.vue b/example/src/demo/pc/grid/aui3-first-menu/empty-data-tip.vue deleted file mode 100644 index e9a7e06cb..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/empty-data-tip.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/export-excel.vue b/example/src/demo/pc/grid/aui3-first-menu/export-excel.vue deleted file mode 100644 index f283c881e..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/export-excel.vue +++ /dev/null @@ -1,94 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/fixed-column-width.vue b/example/src/demo/pc/grid/aui3-first-menu/fixed-column-width.vue deleted file mode 100644 index b805f51a1..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/fixed-column-width.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/fixed-grid-height.vue b/example/src/demo/pc/grid/aui3-first-menu/fixed-grid-height.vue deleted file mode 100644 index 9a3bf469e..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/fixed-grid-height.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/format-value.vue b/example/src/demo/pc/grid/aui3-first-menu/format-value.vue deleted file mode 100644 index c30f311a0..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/format-value.vue +++ /dev/null @@ -1,79 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/full-data-loading.vue b/example/src/demo/pc/grid/aui3-first-menu/full-data-loading.vue deleted file mode 100644 index 60fdaa54e..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/full-data-loading.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/get-row-method.vue b/example/src/demo/pc/grid/aui3-first-menu/get-row-method.vue deleted file mode 100644 index 82c6b1f77..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/get-row-method.vue +++ /dev/null @@ -1,111 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/grid-border.vue b/example/src/demo/pc/grid/aui3-first-menu/grid-border.vue deleted file mode 100644 index f77cfc8bd..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/grid-border.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/grid-customs.vue b/example/src/demo/pc/grid/aui3-first-menu/grid-customs.vue deleted file mode 100644 index 6ba69a0aa..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/grid-customs.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/grid-full-screen-height.vue b/example/src/demo/pc/grid/aui3-first-menu/grid-full-screen-height.vue deleted file mode 100644 index 92212109d..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/grid-full-screen-height.vue +++ /dev/null @@ -1,72 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/grid-full-screen.vue b/example/src/demo/pc/grid/aui3-first-menu/grid-full-screen.vue deleted file mode 100644 index df547289f..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/grid-full-screen.vue +++ /dev/null @@ -1,99 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/grid-loading-off-tip.vue b/example/src/demo/pc/grid/aui3-first-menu/grid-loading-off-tip.vue deleted file mode 100644 index 83d75635c..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/grid-loading-off-tip.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/grid-loading-tip.vue b/example/src/demo/pc/grid/aui3-first-menu/grid-loading-tip.vue deleted file mode 100644 index fc4a15d51..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/grid-loading-tip.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/grid-optimization.vue b/example/src/demo/pc/grid/aui3-first-menu/grid-optimization.vue deleted file mode 100644 index 1d22f0767..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/grid-optimization.vue +++ /dev/null @@ -1,89 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/grid-size-mini.vue b/example/src/demo/pc/grid/aui3-first-menu/grid-size-mini.vue deleted file mode 100644 index 97b6971f9..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/grid-size-mini.vue +++ /dev/null @@ -1,91 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/grid-size-small.vue b/example/src/demo/pc/grid/aui3-first-menu/grid-size-small.vue deleted file mode 100644 index 0473d597c..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/grid-size-small.vue +++ /dev/null @@ -1,91 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/grid-size.vue b/example/src/demo/pc/grid/aui3-first-menu/grid-size.vue deleted file mode 100644 index 0c1d84de3..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/grid-size.vue +++ /dev/null @@ -1,91 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/inner-pager.vue b/example/src/demo/pc/grid/aui3-first-menu/inner-pager.vue deleted file mode 100644 index c3c061cb5..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/inner-pager.vue +++ /dev/null @@ -1,125 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/insert-delete-update.vue b/example/src/demo/pc/grid/aui3-first-menu/insert-delete-update.vue deleted file mode 100644 index d9e6149df..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/insert-delete-update.vue +++ /dev/null @@ -1,157 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/max-min-grid-height.vue b/example/src/demo/pc/grid/aui3-first-menu/max-min-grid-height.vue deleted file mode 100644 index 04b641495..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/max-min-grid-height.vue +++ /dev/null @@ -1,87 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/min-grid-height.vue b/example/src/demo/pc/grid/aui3-first-menu/min-grid-height.vue deleted file mode 100644 index 6e01fe5ad..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/min-grid-height.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/min-width.vue b/example/src/demo/pc/grid/aui3-first-menu/min-width.vue deleted file mode 100644 index a0a934724..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/min-width.vue +++ /dev/null @@ -1,75 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/proxy-config.vue b/example/src/demo/pc/grid/aui3-first-menu/proxy-config.vue deleted file mode 100644 index da1da212b..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/proxy-config.vue +++ /dev/null @@ -1,110 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/radio-config.vue b/example/src/demo/pc/grid/aui3-first-menu/radio-config.vue deleted file mode 100644 index fc8a625f4..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/radio-config.vue +++ /dev/null @@ -1,85 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/refresh-grid.vue b/example/src/demo/pc/grid/aui3-first-menu/refresh-grid.vue deleted file mode 100644 index 032157a80..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/refresh-grid.vue +++ /dev/null @@ -1,107 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/request-service.vue b/example/src/demo/pc/grid/aui3-first-menu/request-service.vue deleted file mode 100644 index a4b4f7177..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/request-service.vue +++ /dev/null @@ -1,113 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/resize-column-width.vue b/example/src/demo/pc/grid/aui3-first-menu/resize-column-width.vue deleted file mode 100644 index 98a586a55..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/resize-column-width.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/row-editing.vue b/example/src/demo/pc/grid/aui3-first-menu/row-editing.vue deleted file mode 100644 index 7882711cd..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/row-editing.vue +++ /dev/null @@ -1,76 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/row-id.vue b/example/src/demo/pc/grid/aui3-first-menu/row-id.vue deleted file mode 100644 index ff6274df7..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/row-id.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/save-data.vue b/example/src/demo/pc/grid/aui3-first-menu/save-data.vue deleted file mode 100644 index ee96dadab..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/save-data.vue +++ /dev/null @@ -1,138 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/scroll-paging.vue b/example/src/demo/pc/grid/aui3-first-menu/scroll-paging.vue deleted file mode 100644 index 769d5366b..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/scroll-paging.vue +++ /dev/null @@ -1,108 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/start-index.vue b/example/src/demo/pc/grid/aui3-first-menu/start-index.vue deleted file mode 100644 index 3b75ed715..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/start-index.vue +++ /dev/null @@ -1,129 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/static-data.vue b/example/src/demo/pc/grid/aui3-first-menu/static-data.vue deleted file mode 100644 index dcf5e0876..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/static-data.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/status-of-editing.vue b/example/src/demo/pc/grid/aui3-first-menu/status-of-editing.vue deleted file mode 100644 index e2a44221e..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/status-of-editing.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/status-of-noediting.vue b/example/src/demo/pc/grid/aui3-first-menu/status-of-noediting.vue deleted file mode 100644 index 1fdfb1db9..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/status-of-noediting.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/trigger-mode-db-editing.vue b/example/src/demo/pc/grid/aui3-first-menu/trigger-mode-db-editing.vue deleted file mode 100644 index 2f0808e5a..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/trigger-mode-db-editing.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/trigger-mode-for-editing.vue b/example/src/demo/pc/grid/aui3-first-menu/trigger-mode-for-editing.vue deleted file mode 100644 index 9c2c168fb..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/trigger-mode-for-editing.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/trigger-mode-hm-editing.vue b/example/src/demo/pc/grid/aui3-first-menu/trigger-mode-hm-editing.vue deleted file mode 100644 index bb70e568d..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/trigger-mode-hm-editing.vue +++ /dev/null @@ -1,111 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/aui3-first-menu/virtual-rolling.vue b/example/src/demo/pc/grid/aui3-first-menu/virtual-rolling.vue deleted file mode 100644 index 99c4b373a..000000000 --- a/example/src/demo/pc/grid/aui3-first-menu/virtual-rolling.vue +++ /dev/null @@ -1,55 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/custom/column-width.vue b/example/src/demo/pc/grid/custom/column-width.vue deleted file mode 100644 index 6ec3ff4af..000000000 --- a/example/src/demo/pc/grid/custom/column-width.vue +++ /dev/null @@ -1,72 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/custom/page-size.vue b/example/src/demo/pc/grid/custom/page-size.vue deleted file mode 100644 index e7f24a534..000000000 --- a/example/src/demo/pc/grid/custom/page-size.vue +++ /dev/null @@ -1,129 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/pager/inner-pager.vue b/example/src/demo/pc/grid/pager/inner-pager.vue deleted file mode 100644 index 5b8d9fb48..000000000 --- a/example/src/demo/pc/grid/pager/inner-pager.vue +++ /dev/null @@ -1,125 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/slot/default-slot.vue b/example/src/demo/pc/grid/slot/default-slot.vue deleted file mode 100644 index d5fcf16fc..000000000 --- a/example/src/demo/pc/grid/slot/default-slot.vue +++ /dev/null @@ -1,81 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/grid/sort/combinations-sort.vue b/example/src/demo/pc/grid/sort/combinations-sort.vue deleted file mode 100644 index 775d85166..000000000 --- a/example/src/demo/pc/grid/sort/combinations-sort.vue +++ /dev/null @@ -1,83 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/sort/custom-sort.vue b/example/src/demo/pc/grid/sort/custom-sort.vue deleted file mode 100644 index 3243d822f..000000000 --- a/example/src/demo/pc/grid/sort/custom-sort.vue +++ /dev/null @@ -1,91 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/adaptive-column-width.vue b/example/src/demo/pc/grid/tiny-first-menu/adaptive-column-width.vue deleted file mode 100644 index ede703668..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/adaptive-column-width.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/adaptive-grid-off-width-height.vue b/example/src/demo/pc/grid/tiny-first-menu/adaptive-grid-off-width-height.vue deleted file mode 100644 index 642d5e3e4..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/adaptive-grid-off-width-height.vue +++ /dev/null @@ -1,114 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/adaptive-grid-width-height.vue b/example/src/demo/pc/grid/tiny-first-menu/adaptive-grid-width-height.vue deleted file mode 100644 index 6b44aa192..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/adaptive-grid-width-height.vue +++ /dev/null @@ -1,114 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/adaptive-un-column-width.vue b/example/src/demo/pc/grid/tiny-first-menu/adaptive-un-column-width.vue deleted file mode 100644 index 70c73513f..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/adaptive-un-column-width.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/auto-load.vue b/example/src/demo/pc/grid/tiny-first-menu/auto-load.vue deleted file mode 100644 index 414db9606..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/auto-load.vue +++ /dev/null @@ -1,97 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/cell-editing.vue b/example/src/demo/pc/grid/tiny-first-menu/cell-editing.vue deleted file mode 100644 index 8de5e2fb5..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/cell-editing.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/clearData.vue b/example/src/demo/pc/grid/tiny-first-menu/clearData.vue deleted file mode 100644 index aa09aadd3..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/clearData.vue +++ /dev/null @@ -1,123 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/clearRadioRow.vue b/example/src/demo/pc/grid/tiny-first-menu/clearRadioRow.vue deleted file mode 100644 index f4a62e552..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/clearRadioRow.vue +++ /dev/null @@ -1,89 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/clearSelection.vue b/example/src/demo/pc/grid/tiny-first-menu/clearSelection.vue deleted file mode 100644 index 680f86936..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/clearSelection.vue +++ /dev/null @@ -1,89 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/column-asyn-rendering.vue b/example/src/demo/pc/grid/tiny-first-menu/column-asyn-rendering.vue deleted file mode 100644 index d336792a6..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/column-asyn-rendering.vue +++ /dev/null @@ -1,162 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/column-key.vue b/example/src/demo/pc/grid/tiny-first-menu/column-key.vue deleted file mode 100644 index 97467d387..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/column-key.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/column-min-width.vue b/example/src/demo/pc/grid/tiny-first-menu/column-min-width.vue deleted file mode 100644 index 778b8816d..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/column-min-width.vue +++ /dev/null @@ -1,80 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/column-width.vue b/example/src/demo/pc/grid/tiny-first-menu/column-width.vue deleted file mode 100644 index bcb582348..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/column-width.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/columns.vue b/example/src/demo/pc/grid/tiny-first-menu/columns.vue deleted file mode 100644 index babfbefe1..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/columns.vue +++ /dev/null @@ -1,91 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/copy-row-data.vue b/example/src/demo/pc/grid/tiny-first-menu/copy-row-data.vue deleted file mode 100644 index b62a502cb..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/copy-row-data.vue +++ /dev/null @@ -1,107 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/custom-editing.vue b/example/src/demo/pc/grid/tiny-first-menu/custom-editing.vue deleted file mode 100644 index efdfae2e5..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/custom-editing.vue +++ /dev/null @@ -1,117 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/custom-operation-column.vue b/example/src/demo/pc/grid/tiny-first-menu/custom-operation-column.vue deleted file mode 100644 index 79a8c4c4d..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/custom-operation-column.vue +++ /dev/null @@ -1,102 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/custom-serial-column.vue b/example/src/demo/pc/grid/tiny-first-menu/custom-serial-column.vue deleted file mode 100644 index e05a60d24..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/custom-serial-column.vue +++ /dev/null @@ -1,74 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/custom-toolbar.vue b/example/src/demo/pc/grid/tiny-first-menu/custom-toolbar.vue deleted file mode 100644 index 50a07273a..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/custom-toolbar.vue +++ /dev/null @@ -1,148 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/default-serial-column.vue b/example/src/demo/pc/grid/tiny-first-menu/default-serial-column.vue deleted file mode 100644 index 762bc6670..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/default-serial-column.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/editor-is-salid-always.vue b/example/src/demo/pc/grid/tiny-first-menu/editor-is-salid-always.vue deleted file mode 100644 index a8af80d1a..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/editor-is-salid-always.vue +++ /dev/null @@ -1,144 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/empty-data-default-tip.vue b/example/src/demo/pc/grid/tiny-first-menu/empty-data-default-tip.vue deleted file mode 100644 index a3fb0b821..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/empty-data-default-tip.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/empty-data-iscenter.vue b/example/src/demo/pc/grid/tiny-first-menu/empty-data-iscenter.vue deleted file mode 100644 index 8729e4f0c..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/empty-data-iscenter.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/empty-data-tip.vue b/example/src/demo/pc/grid/tiny-first-menu/empty-data-tip.vue deleted file mode 100644 index e9a7e06cb..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/empty-data-tip.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/export-excel.vue b/example/src/demo/pc/grid/tiny-first-menu/export-excel.vue deleted file mode 100644 index 8d31509e0..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/export-excel.vue +++ /dev/null @@ -1,94 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/fixed-column-width.vue b/example/src/demo/pc/grid/tiny-first-menu/fixed-column-width.vue deleted file mode 100644 index 8fbab5ed1..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/fixed-column-width.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/fixed-grid-height.vue b/example/src/demo/pc/grid/tiny-first-menu/fixed-grid-height.vue deleted file mode 100644 index d13ac4229..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/fixed-grid-height.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/format-value.vue b/example/src/demo/pc/grid/tiny-first-menu/format-value.vue deleted file mode 100644 index ea90d86b3..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/format-value.vue +++ /dev/null @@ -1,79 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/full-data-loading.vue b/example/src/demo/pc/grid/tiny-first-menu/full-data-loading.vue deleted file mode 100644 index 48a3b4424..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/full-data-loading.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/get-row-method.vue b/example/src/demo/pc/grid/tiny-first-menu/get-row-method.vue deleted file mode 100644 index a7fd0ba06..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/get-row-method.vue +++ /dev/null @@ -1,111 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/grid-border.vue b/example/src/demo/pc/grid/tiny-first-menu/grid-border.vue deleted file mode 100644 index 371a6202e..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/grid-border.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/grid-customs.vue b/example/src/demo/pc/grid/tiny-first-menu/grid-customs.vue deleted file mode 100644 index 5870585f7..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/grid-customs.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/grid-full-screen-height.vue b/example/src/demo/pc/grid/tiny-first-menu/grid-full-screen-height.vue deleted file mode 100644 index 2e4e5ce72..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/grid-full-screen-height.vue +++ /dev/null @@ -1,72 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/grid-full-screen.vue b/example/src/demo/pc/grid/tiny-first-menu/grid-full-screen.vue deleted file mode 100644 index e3a9ad374..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/grid-full-screen.vue +++ /dev/null @@ -1,99 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/grid-loading-off-tip.vue b/example/src/demo/pc/grid/tiny-first-menu/grid-loading-off-tip.vue deleted file mode 100644 index f0ee78fd5..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/grid-loading-off-tip.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/grid-loading-tip.vue b/example/src/demo/pc/grid/tiny-first-menu/grid-loading-tip.vue deleted file mode 100644 index d0175dcb3..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/grid-loading-tip.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/grid-optimization.vue b/example/src/demo/pc/grid/tiny-first-menu/grid-optimization.vue deleted file mode 100644 index 86f99f739..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/grid-optimization.vue +++ /dev/null @@ -1,89 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/grid-size-mini.vue b/example/src/demo/pc/grid/tiny-first-menu/grid-size-mini.vue deleted file mode 100644 index a84e51fcc..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/grid-size-mini.vue +++ /dev/null @@ -1,91 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/grid-size-small.vue b/example/src/demo/pc/grid/tiny-first-menu/grid-size-small.vue deleted file mode 100644 index 77167c056..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/grid-size-small.vue +++ /dev/null @@ -1,91 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/grid-size.vue b/example/src/demo/pc/grid/tiny-first-menu/grid-size.vue deleted file mode 100644 index c03fb0969..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/grid-size.vue +++ /dev/null @@ -1,91 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/inner-pager.vue b/example/src/demo/pc/grid/tiny-first-menu/inner-pager.vue deleted file mode 100644 index 5b8d9fb48..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/inner-pager.vue +++ /dev/null @@ -1,125 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/insert-delete-update.vue b/example/src/demo/pc/grid/tiny-first-menu/insert-delete-update.vue deleted file mode 100644 index 71a16435d..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/insert-delete-update.vue +++ /dev/null @@ -1,157 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/max-min-grid-height.vue b/example/src/demo/pc/grid/tiny-first-menu/max-min-grid-height.vue deleted file mode 100644 index c29fc7daf..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/max-min-grid-height.vue +++ /dev/null @@ -1,87 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/min-grid-height.vue b/example/src/demo/pc/grid/tiny-first-menu/min-grid-height.vue deleted file mode 100644 index f1d3bc1cf..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/min-grid-height.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/min-width.vue b/example/src/demo/pc/grid/tiny-first-menu/min-width.vue deleted file mode 100644 index 7434de8aa..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/min-width.vue +++ /dev/null @@ -1,75 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/proxy-config.vue b/example/src/demo/pc/grid/tiny-first-menu/proxy-config.vue deleted file mode 100644 index 7665c2856..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/proxy-config.vue +++ /dev/null @@ -1,110 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/radio-config.vue b/example/src/demo/pc/grid/tiny-first-menu/radio-config.vue deleted file mode 100644 index 270ec009b..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/radio-config.vue +++ /dev/null @@ -1,85 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/refresh-grid.vue b/example/src/demo/pc/grid/tiny-first-menu/refresh-grid.vue deleted file mode 100644 index fac88c5a1..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/refresh-grid.vue +++ /dev/null @@ -1,107 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/request-service.vue b/example/src/demo/pc/grid/tiny-first-menu/request-service.vue deleted file mode 100644 index fd3dcf9d3..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/request-service.vue +++ /dev/null @@ -1,113 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/resize-column-width.vue b/example/src/demo/pc/grid/tiny-first-menu/resize-column-width.vue deleted file mode 100644 index cfc47cdd2..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/resize-column-width.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/row-editing.vue b/example/src/demo/pc/grid/tiny-first-menu/row-editing.vue deleted file mode 100644 index 5f74522e0..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/row-editing.vue +++ /dev/null @@ -1,76 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/row-id.vue b/example/src/demo/pc/grid/tiny-first-menu/row-id.vue deleted file mode 100644 index 64182be1f..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/row-id.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/save-data.vue b/example/src/demo/pc/grid/tiny-first-menu/save-data.vue deleted file mode 100644 index a534eb1e4..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/save-data.vue +++ /dev/null @@ -1,138 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/scroll-paging.vue b/example/src/demo/pc/grid/tiny-first-menu/scroll-paging.vue deleted file mode 100644 index 769d5366b..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/scroll-paging.vue +++ /dev/null @@ -1,108 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/start-index.vue b/example/src/demo/pc/grid/tiny-first-menu/start-index.vue deleted file mode 100644 index 2531a078e..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/start-index.vue +++ /dev/null @@ -1,129 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/static-data.vue b/example/src/demo/pc/grid/tiny-first-menu/static-data.vue deleted file mode 100644 index dd0b30320..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/static-data.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/status-of-editing.vue b/example/src/demo/pc/grid/tiny-first-menu/status-of-editing.vue deleted file mode 100644 index 917d49354..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/status-of-editing.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/status-of-noediting.vue b/example/src/demo/pc/grid/tiny-first-menu/status-of-noediting.vue deleted file mode 100644 index 7885e108d..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/status-of-noediting.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/trigger-mode-db-editing.vue b/example/src/demo/pc/grid/tiny-first-menu/trigger-mode-db-editing.vue deleted file mode 100644 index 4ed59cc6d..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/trigger-mode-db-editing.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/trigger-mode-for-editing.vue b/example/src/demo/pc/grid/tiny-first-menu/trigger-mode-for-editing.vue deleted file mode 100644 index c2e8626b0..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/trigger-mode-for-editing.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/trigger-mode-hm-editing.vue b/example/src/demo/pc/grid/tiny-first-menu/trigger-mode-hm-editing.vue deleted file mode 100644 index 4abe2b056..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/trigger-mode-hm-editing.vue +++ /dev/null @@ -1,111 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny-first-menu/virtual-rolling.vue b/example/src/demo/pc/grid/tiny-first-menu/virtual-rolling.vue deleted file mode 100644 index be13962f9..000000000 --- a/example/src/demo/pc/grid/tiny-first-menu/virtual-rolling.vue +++ /dev/null @@ -1,55 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/adaptive-column-width.vue b/example/src/demo/pc/grid/tiny3-first-menu/adaptive-column-width.vue deleted file mode 100644 index 727e6e541..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/adaptive-column-width.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/adaptive-grid-off-width-height.vue b/example/src/demo/pc/grid/tiny3-first-menu/adaptive-grid-off-width-height.vue deleted file mode 100644 index 8ab64b2f9..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/adaptive-grid-off-width-height.vue +++ /dev/null @@ -1,114 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/adaptive-grid-width-height.vue b/example/src/demo/pc/grid/tiny3-first-menu/adaptive-grid-width-height.vue deleted file mode 100644 index 093b3d096..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/adaptive-grid-width-height.vue +++ /dev/null @@ -1,114 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/adaptive-un-column-width.vue b/example/src/demo/pc/grid/tiny3-first-menu/adaptive-un-column-width.vue deleted file mode 100644 index a5be460c3..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/adaptive-un-column-width.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/auto-load.vue b/example/src/demo/pc/grid/tiny3-first-menu/auto-load.vue deleted file mode 100644 index 320201d3d..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/auto-load.vue +++ /dev/null @@ -1,97 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/cell-editing.vue b/example/src/demo/pc/grid/tiny3-first-menu/cell-editing.vue deleted file mode 100644 index 4d8124625..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/cell-editing.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/clearData.vue b/example/src/demo/pc/grid/tiny3-first-menu/clearData.vue deleted file mode 100644 index 939bd67d5..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/clearData.vue +++ /dev/null @@ -1,123 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/clearRadioRow.vue b/example/src/demo/pc/grid/tiny3-first-menu/clearRadioRow.vue deleted file mode 100644 index 1e1a51ab4..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/clearRadioRow.vue +++ /dev/null @@ -1,89 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/clearSelection.vue b/example/src/demo/pc/grid/tiny3-first-menu/clearSelection.vue deleted file mode 100644 index 7975c7457..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/clearSelection.vue +++ /dev/null @@ -1,89 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/column-asyn-rendering.vue b/example/src/demo/pc/grid/tiny3-first-menu/column-asyn-rendering.vue deleted file mode 100644 index 60bce7ba2..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/column-asyn-rendering.vue +++ /dev/null @@ -1,162 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/column-key.vue b/example/src/demo/pc/grid/tiny3-first-menu/column-key.vue deleted file mode 100644 index 64a3a4a26..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/column-key.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/column-min-width.vue b/example/src/demo/pc/grid/tiny3-first-menu/column-min-width.vue deleted file mode 100644 index f0a0a3097..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/column-min-width.vue +++ /dev/null @@ -1,80 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/column-width.vue b/example/src/demo/pc/grid/tiny3-first-menu/column-width.vue deleted file mode 100644 index 4bb4d8d0c..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/column-width.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/columns.vue b/example/src/demo/pc/grid/tiny3-first-menu/columns.vue deleted file mode 100644 index 9146e34d8..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/columns.vue +++ /dev/null @@ -1,91 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/copy-row-data.vue b/example/src/demo/pc/grid/tiny3-first-menu/copy-row-data.vue deleted file mode 100644 index 78968ab66..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/copy-row-data.vue +++ /dev/null @@ -1,107 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/custom-editing.vue b/example/src/demo/pc/grid/tiny3-first-menu/custom-editing.vue deleted file mode 100644 index 49bbd311a..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/custom-editing.vue +++ /dev/null @@ -1,117 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/custom-operation-column.vue b/example/src/demo/pc/grid/tiny3-first-menu/custom-operation-column.vue deleted file mode 100644 index cd829ec88..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/custom-operation-column.vue +++ /dev/null @@ -1,102 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/custom-serial-column.vue b/example/src/demo/pc/grid/tiny3-first-menu/custom-serial-column.vue deleted file mode 100644 index dce127a28..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/custom-serial-column.vue +++ /dev/null @@ -1,74 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/custom-toolbar.vue b/example/src/demo/pc/grid/tiny3-first-menu/custom-toolbar.vue deleted file mode 100644 index 6ec14a678..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/custom-toolbar.vue +++ /dev/null @@ -1,148 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/default-serial-column.vue b/example/src/demo/pc/grid/tiny3-first-menu/default-serial-column.vue deleted file mode 100644 index 0937a671a..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/default-serial-column.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/editor-is-salid-always.vue b/example/src/demo/pc/grid/tiny3-first-menu/editor-is-salid-always.vue deleted file mode 100644 index aab1cc028..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/editor-is-salid-always.vue +++ /dev/null @@ -1,144 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/empty-data-default-tip.vue b/example/src/demo/pc/grid/tiny3-first-menu/empty-data-default-tip.vue deleted file mode 100644 index a3fb0b821..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/empty-data-default-tip.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/empty-data-iscenter.vue b/example/src/demo/pc/grid/tiny3-first-menu/empty-data-iscenter.vue deleted file mode 100644 index 8729e4f0c..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/empty-data-iscenter.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/empty-data-tip.vue b/example/src/demo/pc/grid/tiny3-first-menu/empty-data-tip.vue deleted file mode 100644 index e9a7e06cb..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/empty-data-tip.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/export-excel.vue b/example/src/demo/pc/grid/tiny3-first-menu/export-excel.vue deleted file mode 100644 index f283c881e..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/export-excel.vue +++ /dev/null @@ -1,94 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/fixed-column-width.vue b/example/src/demo/pc/grid/tiny3-first-menu/fixed-column-width.vue deleted file mode 100644 index b805f51a1..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/fixed-column-width.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/fixed-grid-height.vue b/example/src/demo/pc/grid/tiny3-first-menu/fixed-grid-height.vue deleted file mode 100644 index 9a3bf469e..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/fixed-grid-height.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/format-value.vue b/example/src/demo/pc/grid/tiny3-first-menu/format-value.vue deleted file mode 100644 index c30f311a0..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/format-value.vue +++ /dev/null @@ -1,79 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/full-data-loading.vue b/example/src/demo/pc/grid/tiny3-first-menu/full-data-loading.vue deleted file mode 100644 index 60fdaa54e..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/full-data-loading.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/get-row-method.vue b/example/src/demo/pc/grid/tiny3-first-menu/get-row-method.vue deleted file mode 100644 index 82c6b1f77..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/get-row-method.vue +++ /dev/null @@ -1,111 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/grid-border.vue b/example/src/demo/pc/grid/tiny3-first-menu/grid-border.vue deleted file mode 100644 index f77cfc8bd..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/grid-border.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/grid-customs.vue b/example/src/demo/pc/grid/tiny3-first-menu/grid-customs.vue deleted file mode 100644 index 6ba69a0aa..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/grid-customs.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/grid-full-screen-height.vue b/example/src/demo/pc/grid/tiny3-first-menu/grid-full-screen-height.vue deleted file mode 100644 index 92212109d..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/grid-full-screen-height.vue +++ /dev/null @@ -1,72 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/grid-full-screen.vue b/example/src/demo/pc/grid/tiny3-first-menu/grid-full-screen.vue deleted file mode 100644 index df547289f..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/grid-full-screen.vue +++ /dev/null @@ -1,99 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/grid-loading-off-tip.vue b/example/src/demo/pc/grid/tiny3-first-menu/grid-loading-off-tip.vue deleted file mode 100644 index 83d75635c..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/grid-loading-off-tip.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/grid-loading-tip.vue b/example/src/demo/pc/grid/tiny3-first-menu/grid-loading-tip.vue deleted file mode 100644 index fc4a15d51..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/grid-loading-tip.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/grid-optimization.vue b/example/src/demo/pc/grid/tiny3-first-menu/grid-optimization.vue deleted file mode 100644 index 1d22f0767..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/grid-optimization.vue +++ /dev/null @@ -1,89 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/grid-size-mini.vue b/example/src/demo/pc/grid/tiny3-first-menu/grid-size-mini.vue deleted file mode 100644 index 97b6971f9..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/grid-size-mini.vue +++ /dev/null @@ -1,91 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/grid-size-small.vue b/example/src/demo/pc/grid/tiny3-first-menu/grid-size-small.vue deleted file mode 100644 index 0473d597c..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/grid-size-small.vue +++ /dev/null @@ -1,91 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/grid-size.vue b/example/src/demo/pc/grid/tiny3-first-menu/grid-size.vue deleted file mode 100644 index 0c1d84de3..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/grid-size.vue +++ /dev/null @@ -1,91 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/inner-pager.vue b/example/src/demo/pc/grid/tiny3-first-menu/inner-pager.vue deleted file mode 100644 index c3c061cb5..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/inner-pager.vue +++ /dev/null @@ -1,125 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/insert-delete-update.vue b/example/src/demo/pc/grid/tiny3-first-menu/insert-delete-update.vue deleted file mode 100644 index d9e6149df..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/insert-delete-update.vue +++ /dev/null @@ -1,157 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/max-min-grid-height.vue b/example/src/demo/pc/grid/tiny3-first-menu/max-min-grid-height.vue deleted file mode 100644 index 04b641495..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/max-min-grid-height.vue +++ /dev/null @@ -1,87 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/min-grid-height.vue b/example/src/demo/pc/grid/tiny3-first-menu/min-grid-height.vue deleted file mode 100644 index 6e01fe5ad..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/min-grid-height.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/min-width.vue b/example/src/demo/pc/grid/tiny3-first-menu/min-width.vue deleted file mode 100644 index a0a934724..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/min-width.vue +++ /dev/null @@ -1,75 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/proxy-config.vue b/example/src/demo/pc/grid/tiny3-first-menu/proxy-config.vue deleted file mode 100644 index da1da212b..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/proxy-config.vue +++ /dev/null @@ -1,110 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/radio-config.vue b/example/src/demo/pc/grid/tiny3-first-menu/radio-config.vue deleted file mode 100644 index fc8a625f4..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/radio-config.vue +++ /dev/null @@ -1,85 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/refresh-grid.vue b/example/src/demo/pc/grid/tiny3-first-menu/refresh-grid.vue deleted file mode 100644 index 032157a80..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/refresh-grid.vue +++ /dev/null @@ -1,107 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/request-service.vue b/example/src/demo/pc/grid/tiny3-first-menu/request-service.vue deleted file mode 100644 index a4b4f7177..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/request-service.vue +++ /dev/null @@ -1,113 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/resize-column-width.vue b/example/src/demo/pc/grid/tiny3-first-menu/resize-column-width.vue deleted file mode 100644 index 98a586a55..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/resize-column-width.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/row-editing.vue b/example/src/demo/pc/grid/tiny3-first-menu/row-editing.vue deleted file mode 100644 index 7882711cd..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/row-editing.vue +++ /dev/null @@ -1,76 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/row-id.vue b/example/src/demo/pc/grid/tiny3-first-menu/row-id.vue deleted file mode 100644 index ff6274df7..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/row-id.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/save-data.vue b/example/src/demo/pc/grid/tiny3-first-menu/save-data.vue deleted file mode 100644 index ee96dadab..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/save-data.vue +++ /dev/null @@ -1,138 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/scroll-paging.vue b/example/src/demo/pc/grid/tiny3-first-menu/scroll-paging.vue deleted file mode 100644 index 769d5366b..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/scroll-paging.vue +++ /dev/null @@ -1,108 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/start-index.vue b/example/src/demo/pc/grid/tiny3-first-menu/start-index.vue deleted file mode 100644 index 3b75ed715..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/start-index.vue +++ /dev/null @@ -1,129 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/static-data.vue b/example/src/demo/pc/grid/tiny3-first-menu/static-data.vue deleted file mode 100644 index dcf5e0876..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/static-data.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/status-of-editing.vue b/example/src/demo/pc/grid/tiny3-first-menu/status-of-editing.vue deleted file mode 100644 index e2a44221e..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/status-of-editing.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/status-of-noediting.vue b/example/src/demo/pc/grid/tiny3-first-menu/status-of-noediting.vue deleted file mode 100644 index 1fdfb1db9..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/status-of-noediting.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/trigger-mode-db-editing.vue b/example/src/demo/pc/grid/tiny3-first-menu/trigger-mode-db-editing.vue deleted file mode 100644 index 2f0808e5a..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/trigger-mode-db-editing.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/trigger-mode-for-editing.vue b/example/src/demo/pc/grid/tiny3-first-menu/trigger-mode-for-editing.vue deleted file mode 100644 index 9c2c168fb..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/trigger-mode-for-editing.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/trigger-mode-hm-editing.vue b/example/src/demo/pc/grid/tiny3-first-menu/trigger-mode-hm-editing.vue deleted file mode 100644 index bb70e568d..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/trigger-mode-hm-editing.vue +++ /dev/null @@ -1,111 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tiny3-first-menu/virtual-rolling.vue b/example/src/demo/pc/grid/tiny3-first-menu/virtual-rolling.vue deleted file mode 100644 index 99c4b373a..000000000 --- a/example/src/demo/pc/grid/tiny3-first-menu/virtual-rolling.vue +++ /dev/null @@ -1,55 +0,0 @@ - - - diff --git a/example/src/demo/pc/grid/tip/column-header-tip.vue b/example/src/demo/pc/grid/tip/column-header-tip.vue deleted file mode 100644 index bbe4e664e..000000000 --- a/example/src/demo/pc/grid/tip/column-header-tip.vue +++ /dev/null @@ -1,87 +0,0 @@ - - - diff --git a/example/src/demo/pc/hrapprover/basic-usage.vue b/example/src/demo/pc/hrapprover/basic-usage.vue deleted file mode 100644 index 28ebe0a08..000000000 --- a/example/src/demo/pc/hrapprover/basic-usage.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/example/src/demo/pc/hrapprover/custom-service.vue b/example/src/demo/pc/hrapprover/custom-service.vue deleted file mode 100644 index 85c0c3c13..000000000 --- a/example/src/demo/pc/hrapprover/custom-service.vue +++ /dev/null @@ -1,45 +0,0 @@ - - - diff --git a/example/src/demo/pc/hrapprover/disabled.vue b/example/src/demo/pc/hrapprover/disabled.vue deleted file mode 100644 index 6b392555e..000000000 --- a/example/src/demo/pc/hrapprover/disabled.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/pc/icon/basic-usage.vue b/example/src/demo/pc/icon/basic-usage.vue deleted file mode 100644 index 7d950b34e..000000000 --- a/example/src/demo/pc/icon/basic-usage.vue +++ /dev/null @@ -1,47 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/icon/list.vue b/example/src/demo/pc/icon/list.vue deleted file mode 100644 index 5e9670f23..000000000 --- a/example/src/demo/pc/icon/list.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - - diff --git a/example/src/demo/pc/icon/show-title.vue b/example/src/demo/pc/icon/show-title.vue deleted file mode 100644 index 8180f6359..000000000 --- a/example/src/demo/pc/icon/show-title.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/image/basic-usage.vue b/example/src/demo/pc/image/basic-usage.vue deleted file mode 100644 index bb58e62e1..000000000 --- a/example/src/demo/pc/image/basic-usage.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/image/custom-placeholder.vue b/example/src/demo/pc/image/custom-placeholder.vue deleted file mode 100644 index ad3d98961..000000000 --- a/example/src/demo/pc/image/custom-placeholder.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/image/lazy-load.vue b/example/src/demo/pc/image/lazy-load.vue deleted file mode 100644 index 255422514..000000000 --- a/example/src/demo/pc/image/lazy-load.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/image/preview-src-list.vue b/example/src/demo/pc/image/preview-src-list.vue deleted file mode 100644 index 3d3ceb501..000000000 --- a/example/src/demo/pc/image/preview-src-list.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/example/src/demo/pc/image/preview-z-index.vue b/example/src/demo/pc/image/preview-z-index.vue deleted file mode 100644 index a29f9d29a..000000000 --- a/example/src/demo/pc/image/preview-z-index.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/example/src/demo/pc/index.js b/example/src/demo/pc/index.js deleted file mode 100644 index 9d5735e41..000000000 --- a/example/src/demo/pc/index.js +++ /dev/null @@ -1,3 +0,0 @@ -import Components from './components' - -export const getDemoCode = ({ component, type, name }) => `${component}/${Components[component][type][name]}` diff --git a/example/src/demo/pc/input/autofocus.vue b/example/src/demo/pc/input/autofocus.vue deleted file mode 100644 index e2d8b51c0..000000000 --- a/example/src/demo/pc/input/autofocus.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/autosize.vue b/example/src/demo/pc/input/autosize.vue deleted file mode 100644 index 2ebb67124..000000000 --- a/example/src/demo/pc/input/autosize.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/basic-usage.vue b/example/src/demo/pc/input/basic-usage.vue deleted file mode 100644 index ae4767dd6..000000000 --- a/example/src/demo/pc/input/basic-usage.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/clearable.vue b/example/src/demo/pc/input/clearable.vue deleted file mode 100644 index 974d706f6..000000000 --- a/example/src/demo/pc/input/clearable.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/counter.vue b/example/src/demo/pc/input/counter.vue deleted file mode 100644 index b19b35bea..000000000 --- a/example/src/demo/pc/input/counter.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/disabled.vue b/example/src/demo/pc/input/disabled.vue deleted file mode 100644 index 85105edae..000000000 --- a/example/src/demo/pc/input/disabled.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/event-blur.vue b/example/src/demo/pc/input/event-blur.vue deleted file mode 100644 index e8a49bb69..000000000 --- a/example/src/demo/pc/input/event-blur.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/event-change.vue b/example/src/demo/pc/input/event-change.vue deleted file mode 100644 index f02a4808e..000000000 --- a/example/src/demo/pc/input/event-change.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/form.vue b/example/src/demo/pc/input/form.vue deleted file mode 100644 index e264a03c7..000000000 --- a/example/src/demo/pc/input/form.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/label.vue b/example/src/demo/pc/input/label.vue deleted file mode 100644 index 105107e21..000000000 --- a/example/src/demo/pc/input/label.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/max.vue b/example/src/demo/pc/input/max.vue deleted file mode 100644 index 6ce5bdd7b..000000000 --- a/example/src/demo/pc/input/max.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/method-select.vue b/example/src/demo/pc/input/method-select.vue deleted file mode 100644 index 9d84efb68..000000000 --- a/example/src/demo/pc/input/method-select.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/name.vue b/example/src/demo/pc/input/name.vue deleted file mode 100644 index e99035a2d..000000000 --- a/example/src/demo/pc/input/name.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/placeholder.vue b/example/src/demo/pc/input/placeholder.vue deleted file mode 100644 index dad7eb89b..000000000 --- a/example/src/demo/pc/input/placeholder.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/readonly.vue b/example/src/demo/pc/input/readonly.vue deleted file mode 100644 index 19fb5fe57..000000000 --- a/example/src/demo/pc/input/readonly.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/resize.vue b/example/src/demo/pc/input/resize.vue deleted file mode 100644 index af0819e67..000000000 --- a/example/src/demo/pc/input/resize.vue +++ /dev/null @@ -1,38 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/show-password.vue b/example/src/demo/pc/input/show-password.vue deleted file mode 100644 index 93f871916..000000000 --- a/example/src/demo/pc/input/show-password.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/size.vue b/example/src/demo/pc/input/size.vue deleted file mode 100644 index eb0b58c96..000000000 --- a/example/src/demo/pc/input/size.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/step.vue b/example/src/demo/pc/input/step.vue deleted file mode 100644 index 0ea10e120..000000000 --- a/example/src/demo/pc/input/step.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/suffix-icon.vue b/example/src/demo/pc/input/suffix-icon.vue deleted file mode 100644 index 04b1c4db0..000000000 --- a/example/src/demo/pc/input/suffix-icon.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/tabindex.vue b/example/src/demo/pc/input/tabindex.vue deleted file mode 100644 index 108364a25..000000000 --- a/example/src/demo/pc/input/tabindex.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/type.vue b/example/src/demo/pc/input/type.vue deleted file mode 100644 index 17358115b..000000000 --- a/example/src/demo/pc/input/type.vue +++ /dev/null @@ -1,89 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/input/validate-event.vue b/example/src/demo/pc/input/validate-event.vue deleted file mode 100644 index 09194f9d3..000000000 --- a/example/src/demo/pc/input/validate-event.vue +++ /dev/null @@ -1,38 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/ip-address/change.vue b/example/src/demo/pc/ip-address/change.vue deleted file mode 100644 index e254a374c..000000000 --- a/example/src/demo/pc/ip-address/change.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/pc/ip-address/disabled.vue b/example/src/demo/pc/ip-address/disabled.vue deleted file mode 100644 index 9d870b28b..000000000 --- a/example/src/demo/pc/ip-address/disabled.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/ip-address/focus.vue b/example/src/demo/pc/ip-address/focus.vue deleted file mode 100644 index 88e111297..000000000 --- a/example/src/demo/pc/ip-address/focus.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/pc/ip-address/readonly.vue b/example/src/demo/pc/ip-address/readonly.vue deleted file mode 100644 index ea87baf17..000000000 --- a/example/src/demo/pc/ip-address/readonly.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/ip-address/size.vue b/example/src/demo/pc/ip-address/size.vue deleted file mode 100644 index 31cb8b6fa..000000000 --- a/example/src/demo/pc/ip-address/size.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/ip-address/slots.vue b/example/src/demo/pc/ip-address/slots.vue deleted file mode 100644 index 1743d94b2..000000000 --- a/example/src/demo/pc/ip-address/slots.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/layout/base.vue b/example/src/demo/pc/layout/base.vue deleted file mode 100644 index ad3960bb5..000000000 --- a/example/src/demo/pc/layout/base.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/layout/gutter.vue b/example/src/demo/pc/layout/gutter.vue deleted file mode 100644 index 17e0f0d34..000000000 --- a/example/src/demo/pc/layout/gutter.vue +++ /dev/null @@ -1,52 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/layout/order.vue b/example/src/demo/pc/layout/order.vue deleted file mode 100644 index 2e125a17b..000000000 --- a/example/src/demo/pc/layout/order.vue +++ /dev/null @@ -1,77 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/link-menu/basic-usage.vue b/example/src/demo/pc/link-menu/basic-usage.vue deleted file mode 100644 index 7d1a0048e..000000000 --- a/example/src/demo/pc/link-menu/basic-usage.vue +++ /dev/null @@ -1,92 +0,0 @@ - - - diff --git a/example/src/demo/pc/link-menu/custom-icon.vue b/example/src/demo/pc/link-menu/custom-icon.vue deleted file mode 100644 index 805f4de69..000000000 --- a/example/src/demo/pc/link-menu/custom-icon.vue +++ /dev/null @@ -1,95 +0,0 @@ - - - diff --git a/example/src/demo/pc/link-menu/data-resource.vue b/example/src/demo/pc/link-menu/data-resource.vue deleted file mode 100644 index 94ef20f07..000000000 --- a/example/src/demo/pc/link-menu/data-resource.vue +++ /dev/null @@ -1,93 +0,0 @@ - - - diff --git a/example/src/demo/pc/link-menu/get-menu-data-sync.vue b/example/src/demo/pc/link-menu/get-menu-data-sync.vue deleted file mode 100644 index 4d988a10a..000000000 --- a/example/src/demo/pc/link-menu/get-menu-data-sync.vue +++ /dev/null @@ -1,97 +0,0 @@ - - - diff --git a/example/src/demo/pc/link/basic-usage.vue b/example/src/demo/pc/link/basic-usage.vue deleted file mode 100644 index f25e1e7a2..000000000 --- a/example/src/demo/pc/link/basic-usage.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/link/custom-icon.vue b/example/src/demo/pc/link/custom-icon.vue deleted file mode 100644 index 039359b3f..000000000 --- a/example/src/demo/pc/link/custom-icon.vue +++ /dev/null @@ -1,30 +0,0 @@ - - - diff --git a/example/src/demo/pc/link/dynamic-disable.vue b/example/src/demo/pc/link/dynamic-disable.vue deleted file mode 100644 index 4539dc6d0..000000000 --- a/example/src/demo/pc/link/dynamic-disable.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/pc/loading/basic-usage.vue b/example/src/demo/pc/loading/basic-usage.vue deleted file mode 100644 index 773438152..000000000 --- a/example/src/demo/pc/loading/basic-usage.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - diff --git a/example/src/demo/pc/loading/fullscreen.vue b/example/src/demo/pc/loading/fullscreen.vue deleted file mode 100644 index a78531104..000000000 --- a/example/src/demo/pc/loading/fullscreen.vue +++ /dev/null @@ -1,39 +0,0 @@ - - - diff --git a/example/src/demo/pc/loading/target.vue b/example/src/demo/pc/loading/target.vue deleted file mode 100644 index 84ad671ce..000000000 --- a/example/src/demo/pc/loading/target.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/locales/basic-usage.vue b/example/src/demo/pc/locales/basic-usage.vue deleted file mode 100644 index ba48a1dd2..000000000 --- a/example/src/demo/pc/locales/basic-usage.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/locales/custom-service.vue b/example/src/demo/pc/locales/custom-service.vue deleted file mode 100644 index 4c228195c..000000000 --- a/example/src/demo/pc/locales/custom-service.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/pc/logon-user/basic-usage.vue b/example/src/demo/pc/logon-user/basic-usage.vue deleted file mode 100644 index 66f8cc9c9..000000000 --- a/example/src/demo/pc/logon-user/basic-usage.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/logon-user/custom-service.vue b/example/src/demo/pc/logon-user/custom-service.vue deleted file mode 100644 index 46f96581a..000000000 --- a/example/src/demo/pc/logon-user/custom-service.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - diff --git a/example/src/demo/pc/logout/basic-usage.vue b/example/src/demo/pc/logout/basic-usage.vue deleted file mode 100644 index a1e5d209a..000000000 --- a/example/src/demo/pc/logout/basic-usage.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/logout/custom-service.vue b/example/src/demo/pc/logout/custom-service.vue deleted file mode 100644 index b3cef239c..000000000 --- a/example/src/demo/pc/logout/custom-service.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - diff --git a/example/src/demo/pc/milestone/basic-usage.vue b/example/src/demo/pc/milestone/basic-usage.vue deleted file mode 100644 index 47ea103f3..000000000 --- a/example/src/demo/pc/milestone/basic-usage.vue +++ /dev/null @@ -1,80 +0,0 @@ - - - diff --git a/example/src/demo/pc/milestone/data-source.vue b/example/src/demo/pc/milestone/data-source.vue deleted file mode 100644 index a76622630..000000000 --- a/example/src/demo/pc/milestone/data-source.vue +++ /dev/null @@ -1,59 +0,0 @@ - - - diff --git a/example/src/demo/pc/milestone/show-number.vue b/example/src/demo/pc/milestone/show-number.vue deleted file mode 100644 index 31b402795..000000000 --- a/example/src/demo/pc/milestone/show-number.vue +++ /dev/null @@ -1,66 +0,0 @@ - - - diff --git a/example/src/demo/pc/milestone/start-index.vue b/example/src/demo/pc/milestone/start-index.vue deleted file mode 100644 index 873f3a246..000000000 --- a/example/src/demo/pc/milestone/start-index.vue +++ /dev/null @@ -1,48 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/base.vue b/example/src/demo/pc/modal/base.vue deleted file mode 100644 index b11f06f42..000000000 --- a/example/src/demo/pc/modal/base.vue +++ /dev/null @@ -1,38 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/cancel-event.vue b/example/src/demo/pc/modal/cancel-event.vue deleted file mode 100644 index 72b19733d..000000000 --- a/example/src/demo/pc/modal/cancel-event.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/close-event.vue b/example/src/demo/pc/modal/close-event.vue deleted file mode 100644 index cc4a68c02..000000000 --- a/example/src/demo/pc/modal/close-event.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/confirm-event.vue b/example/src/demo/pc/modal/confirm-event.vue deleted file mode 100644 index d0c73c49f..000000000 --- a/example/src/demo/pc/modal/confirm-event.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/duration.vue b/example/src/demo/pc/modal/duration.vue deleted file mode 100644 index 72c37d300..000000000 --- a/example/src/demo/pc/modal/duration.vue +++ /dev/null @@ -1,36 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/esc-closable.vue b/example/src/demo/pc/modal/esc-closable.vue deleted file mode 100644 index b7d206edb..000000000 --- a/example/src/demo/pc/modal/esc-closable.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/footer-slot.vue b/example/src/demo/pc/modal/footer-slot.vue deleted file mode 100644 index 3735872e7..000000000 --- a/example/src/demo/pc/modal/footer-slot.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/fullscreen.vue b/example/src/demo/pc/modal/fullscreen.vue deleted file mode 100644 index 6a505d879..000000000 --- a/example/src/demo/pc/modal/fullscreen.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/grid.vue b/example/src/demo/pc/modal/grid.vue deleted file mode 100644 index fc6cc69fb..000000000 --- a/example/src/demo/pc/modal/grid.vue +++ /dev/null @@ -1,59 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/hide-event.vue b/example/src/demo/pc/modal/hide-event.vue deleted file mode 100644 index 5c8ce1451..000000000 --- a/example/src/demo/pc/modal/hide-event.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/id.vue b/example/src/demo/pc/modal/id.vue deleted file mode 100644 index 7c1cff617..000000000 --- a/example/src/demo/pc/modal/id.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/is-form-reset.vue b/example/src/demo/pc/modal/is-form-reset.vue deleted file mode 100644 index 18a0f78f2..000000000 --- a/example/src/demo/pc/modal/is-form-reset.vue +++ /dev/null @@ -1,48 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/lock-scroll.vue b/example/src/demo/pc/modal/lock-scroll.vue deleted file mode 100644 index c3e2bb554..000000000 --- a/example/src/demo/pc/modal/lock-scroll.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/lock-view.vue b/example/src/demo/pc/modal/lock-view.vue deleted file mode 100644 index 31d88f37d..000000000 --- a/example/src/demo/pc/modal/lock-view.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/mask-closable.vue b/example/src/demo/pc/modal/mask-closable.vue deleted file mode 100644 index 41f708f3d..000000000 --- a/example/src/demo/pc/modal/mask-closable.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/message.vue b/example/src/demo/pc/modal/message.vue deleted file mode 100644 index bcf1371e4..000000000 --- a/example/src/demo/pc/modal/message.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/min-height.vue b/example/src/demo/pc/modal/min-height.vue deleted file mode 100644 index 77026a6f4..000000000 --- a/example/src/demo/pc/modal/min-height.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/min-width.vue b/example/src/demo/pc/modal/min-width.vue deleted file mode 100644 index 9f3da5ff4..000000000 --- a/example/src/demo/pc/modal/min-width.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/resize.vue b/example/src/demo/pc/modal/resize.vue deleted file mode 100644 index ec68fa016..000000000 --- a/example/src/demo/pc/modal/resize.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/show-event.vue b/example/src/demo/pc/modal/show-event.vue deleted file mode 100644 index 021e75847..000000000 --- a/example/src/demo/pc/modal/show-event.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/showFooter.vue b/example/src/demo/pc/modal/showFooter.vue deleted file mode 100644 index 594e8da09..000000000 --- a/example/src/demo/pc/modal/showFooter.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/showHeader.vue b/example/src/demo/pc/modal/showHeader.vue deleted file mode 100644 index c420ceabf..000000000 --- a/example/src/demo/pc/modal/showHeader.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/status.vue b/example/src/demo/pc/modal/status.vue deleted file mode 100644 index cbbf183e9..000000000 --- a/example/src/demo/pc/modal/status.vue +++ /dev/null @@ -1,36 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/title.vue b/example/src/demo/pc/modal/title.vue deleted file mode 100644 index a97f4aa3b..000000000 --- a/example/src/demo/pc/modal/title.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/top.vue b/example/src/demo/pc/modal/top.vue deleted file mode 100644 index 7c319ddc4..000000000 --- a/example/src/demo/pc/modal/top.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/type.vue b/example/src/demo/pc/modal/type.vue deleted file mode 100644 index 33423fbb1..000000000 --- a/example/src/demo/pc/modal/type.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/value.vue b/example/src/demo/pc/modal/value.vue deleted file mode 100644 index 9d1e3580f..000000000 --- a/example/src/demo/pc/modal/value.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/zIndex.vue b/example/src/demo/pc/modal/zIndex.vue deleted file mode 100644 index f03864359..000000000 --- a/example/src/demo/pc/modal/zIndex.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/modal/zoom-event.vue b/example/src/demo/pc/modal/zoom-event.vue deleted file mode 100644 index 6bfbfc57e..000000000 --- a/example/src/demo/pc/modal/zoom-event.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/nav-menu/basic-usage.vue b/example/src/demo/pc/nav-menu/basic-usage.vue deleted file mode 100644 index a6f9a0f19..000000000 --- a/example/src/demo/pc/nav-menu/basic-usage.vue +++ /dev/null @@ -1,219 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/nav-menu/before-skip.vue b/example/src/demo/pc/nav-menu/before-skip.vue deleted file mode 100644 index 3cf7fb492..000000000 --- a/example/src/demo/pc/nav-menu/before-skip.vue +++ /dev/null @@ -1,205 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/nav-menu/custom-service.vue b/example/src/demo/pc/nav-menu/custom-service.vue deleted file mode 100644 index 18f16d0d2..000000000 --- a/example/src/demo/pc/nav-menu/custom-service.vue +++ /dev/null @@ -1,233 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/nav-menu/data-resource.vue b/example/src/demo/pc/nav-menu/data-resource.vue deleted file mode 100644 index f942aa8c0..000000000 --- a/example/src/demo/pc/nav-menu/data-resource.vue +++ /dev/null @@ -1,169 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/nav-menu/overflow.vue b/example/src/demo/pc/nav-menu/overflow.vue deleted file mode 100644 index 8034eeb1b..000000000 --- a/example/src/demo/pc/nav-menu/overflow.vue +++ /dev/null @@ -1,169 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/nav-menu/slot-logo.vue b/example/src/demo/pc/nav-menu/slot-logo.vue deleted file mode 100644 index ad4e68b27..000000000 --- a/example/src/demo/pc/nav-menu/slot-logo.vue +++ /dev/null @@ -1,176 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/nav-menu/slot-toolbar.vue b/example/src/demo/pc/nav-menu/slot-toolbar.vue deleted file mode 100644 index c6e82d7df..000000000 --- a/example/src/demo/pc/nav-menu/slot-toolbar.vue +++ /dev/null @@ -1,182 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/notify/basic-usage.vue b/example/src/demo/pc/notify/basic-usage.vue deleted file mode 100644 index 23414926d..000000000 --- a/example/src/demo/pc/notify/basic-usage.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/pc/numeric/about-step.vue b/example/src/demo/pc/numeric/about-step.vue deleted file mode 100644 index 47115e578..000000000 --- a/example/src/demo/pc/numeric/about-step.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/example/src/demo/pc/numeric/basic-usage.vue b/example/src/demo/pc/numeric/basic-usage.vue deleted file mode 100644 index be45bcd33..000000000 --- a/example/src/demo/pc/numeric/basic-usage.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/numeric/controls-position.vue b/example/src/demo/pc/numeric/controls-position.vue deleted file mode 100644 index dc99539ad..000000000 --- a/example/src/demo/pc/numeric/controls-position.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/example/src/demo/pc/numeric/controls.vue b/example/src/demo/pc/numeric/controls.vue deleted file mode 100644 index 3b4388d06..000000000 --- a/example/src/demo/pc/numeric/controls.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/pc/numeric/dynamic-disabled.vue b/example/src/demo/pc/numeric/dynamic-disabled.vue deleted file mode 100644 index a25c05ad7..000000000 --- a/example/src/demo/pc/numeric/dynamic-disabled.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/pc/numeric/max-min.vue b/example/src/demo/pc/numeric/max-min.vue deleted file mode 100644 index c5b558ed7..000000000 --- a/example/src/demo/pc/numeric/max-min.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/example/src/demo/pc/numeric/precision.vue b/example/src/demo/pc/numeric/precision.vue deleted file mode 100644 index dd7c660cd..000000000 --- a/example/src/demo/pc/numeric/precision.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/example/src/demo/pc/package.json b/example/src/demo/pc/package.json deleted file mode 100644 index 1ad5866b0..000000000 --- a/example/src/demo/pc/package.json +++ /dev/null @@ -1,11 +0,0 @@ -{ - "name": "@opentiny/vue-example", - "version": "1.0.0", - "description": "TINY 3.0 vue example", - "main": "index.js", - "scripts": { - "test": "echo \"Error: no test specified\" && exit 1" - }, - "author": "", - "license": "ISC" -} \ No newline at end of file diff --git a/example/src/demo/pc/pager/basic-usage.vue b/example/src/demo/pc/pager/basic-usage.vue deleted file mode 100644 index 95ef3891f..000000000 --- a/example/src/demo/pc/pager/basic-usage.vue +++ /dev/null @@ -1,17 +0,0 @@ - - - diff --git a/example/src/demo/pc/pager/page-append-to-body.vue b/example/src/demo/pc/pager/page-append-to-body.vue deleted file mode 100644 index 472eb9232..000000000 --- a/example/src/demo/pc/pager/page-append-to-body.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/pager/page-size.vue b/example/src/demo/pc/pager/page-size.vue deleted file mode 100644 index 3102b0c10..000000000 --- a/example/src/demo/pc/pager/page-size.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/pager/pager-in-grid.vue b/example/src/demo/pc/pager/pager-in-grid.vue deleted file mode 100644 index 2eea5b0eb..000000000 --- a/example/src/demo/pc/pager/pager-in-grid.vue +++ /dev/null @@ -1,95 +0,0 @@ - - - diff --git a/example/src/demo/pc/pager/popper-class.vue b/example/src/demo/pc/pager/popper-class.vue deleted file mode 100644 index 4485ff1b6..000000000 --- a/example/src/demo/pc/pager/popper-class.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/pop-upload/basic-usage.vue b/example/src/demo/pc/pop-upload/basic-usage.vue deleted file mode 100644 index 872834a38..000000000 --- a/example/src/demo/pc/pop-upload/basic-usage.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/pop-upload/data.vue b/example/src/demo/pc/pop-upload/data.vue deleted file mode 100644 index 27afe745b..000000000 --- a/example/src/demo/pc/pop-upload/data.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - diff --git a/example/src/demo/pc/pop-upload/http-request.vue b/example/src/demo/pc/pop-upload/http-request.vue deleted file mode 100644 index 64f863f70..000000000 --- a/example/src/demo/pc/pop-upload/http-request.vue +++ /dev/null @@ -1,24 +0,0 @@ - - - diff --git a/example/src/demo/pc/pop-upload/prevent-delete-file.vue b/example/src/demo/pc/pop-upload/prevent-delete-file.vue deleted file mode 100644 index bd13176d4..000000000 --- a/example/src/demo/pc/pop-upload/prevent-delete-file.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - diff --git a/example/src/demo/pc/pop-upload/size.vue b/example/src/demo/pc/pop-upload/size.vue deleted file mode 100644 index 7d3e679e3..000000000 --- a/example/src/demo/pc/pop-upload/size.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/popeditor/base.vue b/example/src/demo/pc/popeditor/base.vue deleted file mode 100644 index 2c7942213..000000000 --- a/example/src/demo/pc/popeditor/base.vue +++ /dev/null @@ -1,105 +0,0 @@ - - - diff --git a/example/src/demo/pc/popeditor/clearable.vue b/example/src/demo/pc/popeditor/clearable.vue deleted file mode 100644 index bc2fbdec1..000000000 --- a/example/src/demo/pc/popeditor/clearable.vue +++ /dev/null @@ -1,109 +0,0 @@ - - - diff --git a/example/src/demo/pc/popeditor/close-event.vue b/example/src/demo/pc/popeditor/close-event.vue deleted file mode 100644 index c0788eadf..000000000 --- a/example/src/demo/pc/popeditor/close-event.vue +++ /dev/null @@ -1,129 +0,0 @@ - - - diff --git a/example/src/demo/pc/popeditor/disabled.vue b/example/src/demo/pc/popeditor/disabled.vue deleted file mode 100644 index c53809218..000000000 --- a/example/src/demo/pc/popeditor/disabled.vue +++ /dev/null @@ -1,105 +0,0 @@ - - - diff --git a/example/src/demo/pc/popeditor/draggable.vue b/example/src/demo/pc/popeditor/draggable.vue deleted file mode 100644 index 50b6edb1b..000000000 --- a/example/src/demo/pc/popeditor/draggable.vue +++ /dev/null @@ -1,110 +0,0 @@ - - - diff --git a/example/src/demo/pc/popeditor/events.vue b/example/src/demo/pc/popeditor/events.vue deleted file mode 100644 index 68af35f22..000000000 --- a/example/src/demo/pc/popeditor/events.vue +++ /dev/null @@ -1,132 +0,0 @@ - - - diff --git a/example/src/demo/pc/popeditor/grid.vue b/example/src/demo/pc/popeditor/grid.vue deleted file mode 100644 index a87a31a7c..000000000 --- a/example/src/demo/pc/popeditor/grid.vue +++ /dev/null @@ -1,105 +0,0 @@ - - - diff --git a/example/src/demo/pc/popeditor/icon.vue b/example/src/demo/pc/popeditor/icon.vue deleted file mode 100644 index 463a5715b..000000000 --- a/example/src/demo/pc/popeditor/icon.vue +++ /dev/null @@ -1,105 +0,0 @@ - - - diff --git a/example/src/demo/pc/popeditor/readonly.vue b/example/src/demo/pc/popeditor/readonly.vue deleted file mode 100644 index ba1f9e87b..000000000 --- a/example/src/demo/pc/popeditor/readonly.vue +++ /dev/null @@ -1,105 +0,0 @@ - - - diff --git a/example/src/demo/pc/popeditor/remote-search.vue b/example/src/demo/pc/popeditor/remote-search.vue deleted file mode 100644 index a6721f52c..000000000 --- a/example/src/demo/pc/popeditor/remote-search.vue +++ /dev/null @@ -1,78 +0,0 @@ - - - diff --git a/example/src/demo/pc/popeditor/resize.vue b/example/src/demo/pc/popeditor/resize.vue deleted file mode 100644 index a88efeb76..000000000 --- a/example/src/demo/pc/popeditor/resize.vue +++ /dev/null @@ -1,105 +0,0 @@ - - - diff --git a/example/src/demo/pc/popeditor/single-select-radio.vue b/example/src/demo/pc/popeditor/single-select-radio.vue deleted file mode 100644 index 2f01f793f..000000000 --- a/example/src/demo/pc/popeditor/single-select-radio.vue +++ /dev/null @@ -1,76 +0,0 @@ - - - diff --git a/example/src/demo/pc/popeditor/size.vue b/example/src/demo/pc/popeditor/size.vue deleted file mode 100644 index a350304f4..000000000 --- a/example/src/demo/pc/popeditor/size.vue +++ /dev/null @@ -1,108 +0,0 @@ - - - diff --git a/example/src/demo/pc/popeditor/slot.vue b/example/src/demo/pc/popeditor/slot.vue deleted file mode 100644 index b400e36fe..000000000 --- a/example/src/demo/pc/popeditor/slot.vue +++ /dev/null @@ -1,130 +0,0 @@ - - - diff --git a/example/src/demo/pc/popeditor/tabindex.vue b/example/src/demo/pc/popeditor/tabindex.vue deleted file mode 100644 index df78d6a26..000000000 --- a/example/src/demo/pc/popeditor/tabindex.vue +++ /dev/null @@ -1,116 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/popeditor/title.vue b/example/src/demo/pc/popeditor/title.vue deleted file mode 100644 index 6c9ee9022..000000000 --- a/example/src/demo/pc/popeditor/title.vue +++ /dev/null @@ -1,106 +0,0 @@ - - - diff --git a/example/src/demo/pc/popeditor/width.vue b/example/src/demo/pc/popeditor/width.vue deleted file mode 100644 index a03e0bb46..000000000 --- a/example/src/demo/pc/popeditor/width.vue +++ /dev/null @@ -1,106 +0,0 @@ - - - diff --git a/example/src/demo/pc/popover/arrow-offset.vue b/example/src/demo/pc/popover/arrow-offset.vue deleted file mode 100644 index 3118b370d..000000000 --- a/example/src/demo/pc/popover/arrow-offset.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - - diff --git a/example/src/demo/pc/popover/basic-usage.vue b/example/src/demo/pc/popover/basic-usage.vue deleted file mode 100644 index 8a696dcee..000000000 --- a/example/src/demo/pc/popover/basic-usage.vue +++ /dev/null @@ -1,17 +0,0 @@ - - - diff --git a/example/src/demo/pc/popover/close-delay.vue b/example/src/demo/pc/popover/close-delay.vue deleted file mode 100644 index 912a1ef49..000000000 --- a/example/src/demo/pc/popover/close-delay.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/pc/popover/custom-transition.vue b/example/src/demo/pc/popover/custom-transition.vue deleted file mode 100644 index 3f8cddc79..000000000 --- a/example/src/demo/pc/popover/custom-transition.vue +++ /dev/null @@ -1,49 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/popover/dynamic-disable.vue b/example/src/demo/pc/popover/dynamic-disable.vue deleted file mode 100644 index c2576cfec..000000000 --- a/example/src/demo/pc/popover/dynamic-disable.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/popover/frame-offset.vue b/example/src/demo/pc/popover/frame-offset.vue deleted file mode 100644 index 5586a10a1..000000000 --- a/example/src/demo/pc/popover/frame-offset.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - - diff --git a/example/src/demo/pc/popover/hidden-arrow.vue b/example/src/demo/pc/popover/hidden-arrow.vue deleted file mode 100644 index a8f412ae0..000000000 --- a/example/src/demo/pc/popover/hidden-arrow.vue +++ /dev/null @@ -1,43 +0,0 @@ - - - - diff --git a/example/src/demo/pc/popover/open-delay.vue b/example/src/demo/pc/popover/open-delay.vue deleted file mode 100644 index 897bc0b40..000000000 --- a/example/src/demo/pc/popover/open-delay.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/pc/popover/popover-content.vue b/example/src/demo/pc/popover/popover-content.vue deleted file mode 100644 index 2e23d6936..000000000 --- a/example/src/demo/pc/popover/popover-content.vue +++ /dev/null @@ -1,17 +0,0 @@ - - - diff --git a/example/src/demo/pc/popover/popover-placement.vue b/example/src/demo/pc/popover/popover-placement.vue deleted file mode 100644 index 98aa53fd0..000000000 --- a/example/src/demo/pc/popover/popover-placement.vue +++ /dev/null @@ -1,53 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/popover/popover-width.vue b/example/src/demo/pc/popover/popover-width.vue deleted file mode 100644 index cf1b0e0ab..000000000 --- a/example/src/demo/pc/popover/popover-width.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/popover/popper-class.vue b/example/src/demo/pc/popover/popper-class.vue deleted file mode 100644 index 5c925ebfd..000000000 --- a/example/src/demo/pc/popover/popper-class.vue +++ /dev/null @@ -1,56 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/popover/popper-options.vue b/example/src/demo/pc/popover/popper-options.vue deleted file mode 100644 index 67aac6ddb..000000000 --- a/example/src/demo/pc/popover/popper-options.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/pc/popover/trigger-mode.vue b/example/src/demo/pc/popover/trigger-mode.vue deleted file mode 100644 index b40cd4620..000000000 --- a/example/src/demo/pc/popover/trigger-mode.vue +++ /dev/null @@ -1,52 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/popover/trigger-reference.vue b/example/src/demo/pc/popover/trigger-reference.vue deleted file mode 100644 index 127275f17..000000000 --- a/example/src/demo/pc/popover/trigger-reference.vue +++ /dev/null @@ -1,17 +0,0 @@ - - - diff --git a/example/src/demo/pc/progress/basic-usage.vue b/example/src/demo/pc/progress/basic-usage.vue deleted file mode 100644 index 864bbc691..000000000 --- a/example/src/demo/pc/progress/basic-usage.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/progress/custom-color.vue b/example/src/demo/pc/progress/custom-color.vue deleted file mode 100644 index 584cd3de4..000000000 --- a/example/src/demo/pc/progress/custom-color.vue +++ /dev/null @@ -1,42 +0,0 @@ - - - diff --git a/example/src/demo/pc/progress/dynamic-control-changes.vue b/example/src/demo/pc/progress/dynamic-control-changes.vue deleted file mode 100644 index 23b718ed4..000000000 --- a/example/src/demo/pc/progress/dynamic-control-changes.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - diff --git a/example/src/demo/pc/progress/format-text.vue b/example/src/demo/pc/progress/format-text.vue deleted file mode 100644 index 127efea69..000000000 --- a/example/src/demo/pc/progress/format-text.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/progress/progress-status.vue b/example/src/demo/pc/progress/progress-status.vue deleted file mode 100644 index 4fa4ee406..000000000 --- a/example/src/demo/pc/progress/progress-status.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/example/src/demo/pc/progress/progress-type-circle.vue b/example/src/demo/pc/progress/progress-type-circle.vue deleted file mode 100644 index 613518b10..000000000 --- a/example/src/demo/pc/progress/progress-type-circle.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/progress/progress-type-dashboard.vue b/example/src/demo/pc/progress/progress-type-dashboard.vue deleted file mode 100644 index 650fdef16..000000000 --- a/example/src/demo/pc/progress/progress-type-dashboard.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - diff --git a/example/src/demo/pc/progress/progress-type.vue b/example/src/demo/pc/progress/progress-type.vue deleted file mode 100644 index 4cf8366ec..000000000 --- a/example/src/demo/pc/progress/progress-type.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/progress/progress-width.vue b/example/src/demo/pc/progress/progress-width.vue deleted file mode 100644 index bffba8c00..000000000 --- a/example/src/demo/pc/progress/progress-width.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/pc/progress/text-inside-or-no-text.vue b/example/src/demo/pc/progress/text-inside-or-no-text.vue deleted file mode 100644 index a79ce3596..000000000 --- a/example/src/demo/pc/progress/text-inside-or-no-text.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - diff --git a/example/src/demo/pc/radio/active-color.vue b/example/src/demo/pc/radio/active-color.vue deleted file mode 100644 index d86b2083f..000000000 --- a/example/src/demo/pc/radio/active-color.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/pc/radio/basic-usage.vue b/example/src/demo/pc/radio/basic-usage.vue deleted file mode 100644 index 3b8185073..000000000 --- a/example/src/demo/pc/radio/basic-usage.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - diff --git a/example/src/demo/pc/radio/dynamic-disable.vue b/example/src/demo/pc/radio/dynamic-disable.vue deleted file mode 100644 index 9f84dd3e4..000000000 --- a/example/src/demo/pc/radio/dynamic-disable.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - diff --git a/example/src/demo/pc/radio/group-options.vue b/example/src/demo/pc/radio/group-options.vue deleted file mode 100644 index 40e30b1de..000000000 --- a/example/src/demo/pc/radio/group-options.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/pc/radio/vertical.vue b/example/src/demo/pc/radio/vertical.vue deleted file mode 100644 index 32c0dc34b..000000000 --- a/example/src/demo/pc/radio/vertical.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - diff --git a/example/src/demo/pc/radio/with-border.vue b/example/src/demo/pc/radio/with-border.vue deleted file mode 100644 index 9b1a22bf9..000000000 --- a/example/src/demo/pc/radio/with-border.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/rate/basic-usage.vue b/example/src/demo/pc/rate/basic-usage.vue deleted file mode 100644 index 15da32337..000000000 --- a/example/src/demo/pc/rate/basic-usage.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/rate/dynamic-disable.vue b/example/src/demo/pc/rate/dynamic-disable.vue deleted file mode 100644 index 8af22c842..000000000 --- a/example/src/demo/pc/rate/dynamic-disable.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/roles/base.vue b/example/src/demo/pc/roles/base.vue deleted file mode 100644 index 98a1c4b3e..000000000 --- a/example/src/demo/pc/roles/base.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - diff --git a/example/src/demo/pc/row/align.vue b/example/src/demo/pc/row/align.vue deleted file mode 100644 index 5d1e87541..000000000 --- a/example/src/demo/pc/row/align.vue +++ /dev/null @@ -1,75 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/row/gutter.vue b/example/src/demo/pc/row/gutter.vue deleted file mode 100644 index f97f9d26a..000000000 --- a/example/src/demo/pc/row/gutter.vue +++ /dev/null @@ -1,63 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/row/order.vue b/example/src/demo/pc/row/order.vue deleted file mode 100644 index 329182356..000000000 --- a/example/src/demo/pc/row/order.vue +++ /dev/null @@ -1,58 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/scroll-text/basic-usage.vue b/example/src/demo/pc/scroll-text/basic-usage.vue deleted file mode 100644 index 0bda558b1..000000000 --- a/example/src/demo/pc/scroll-text/basic-usage.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/scroll-text/slots.vue b/example/src/demo/pc/scroll-text/slots.vue deleted file mode 100644 index 08fcfe4e4..000000000 --- a/example/src/demo/pc/scroll-text/slots.vue +++ /dev/null @@ -1,17 +0,0 @@ - - - diff --git a/example/src/demo/pc/search/basic-usage.vue b/example/src/demo/pc/search/basic-usage.vue deleted file mode 100644 index 013f04d09..000000000 --- a/example/src/demo/pc/search/basic-usage.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - diff --git a/example/src/demo/pc/search/clearable.vue b/example/src/demo/pc/search/clearable.vue deleted file mode 100644 index da935df36..000000000 --- a/example/src/demo/pc/search/clearable.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/pc/search/default-value.vue b/example/src/demo/pc/search/default-value.vue deleted file mode 100644 index de056226c..000000000 --- a/example/src/demo/pc/search/default-value.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/search/input-events.vue b/example/src/demo/pc/search/input-events.vue deleted file mode 100644 index 7ea9f0df8..000000000 --- a/example/src/demo/pc/search/input-events.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/search/mini-mode.vue b/example/src/demo/pc/search/mini-mode.vue deleted file mode 100644 index 6b42852f0..000000000 --- a/example/src/demo/pc/search/mini-mode.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/search/search-events.vue b/example/src/demo/pc/search/search-events.vue deleted file mode 100644 index d7802be4f..000000000 --- a/example/src/demo/pc/search/search-events.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/select/basic-usage.vue b/example/src/demo/pc/select/basic-usage.vue deleted file mode 100644 index 2ebea472c..000000000 --- a/example/src/demo/pc/select/basic-usage.vue +++ /dev/null @@ -1,43 +0,0 @@ - - - diff --git a/example/src/demo/pc/select/clearable.vue b/example/src/demo/pc/select/clearable.vue deleted file mode 100644 index 2ce731134..000000000 --- a/example/src/demo/pc/select/clearable.vue +++ /dev/null @@ -1,43 +0,0 @@ - - - diff --git a/example/src/demo/pc/select/collapse-tags.vue b/example/src/demo/pc/select/collapse-tags.vue deleted file mode 100644 index a278b784b..000000000 --- a/example/src/demo/pc/select/collapse-tags.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - diff --git a/example/src/demo/pc/select/custom-prefix.vue b/example/src/demo/pc/select/custom-prefix.vue deleted file mode 100644 index 2731d4a42..000000000 --- a/example/src/demo/pc/select/custom-prefix.vue +++ /dev/null @@ -1,48 +0,0 @@ - - - diff --git a/example/src/demo/pc/select/disabled.vue b/example/src/demo/pc/select/disabled.vue deleted file mode 100644 index 1e958aa98..000000000 --- a/example/src/demo/pc/select/disabled.vue +++ /dev/null @@ -1,43 +0,0 @@ - - - diff --git a/example/src/demo/pc/select/filter-method.vue b/example/src/demo/pc/select/filter-method.vue deleted file mode 100644 index f5359f43e..000000000 --- a/example/src/demo/pc/select/filter-method.vue +++ /dev/null @@ -1,58 +0,0 @@ - - - diff --git a/example/src/demo/pc/select/multiple.vue b/example/src/demo/pc/select/multiple.vue deleted file mode 100644 index 5a6c4734e..000000000 --- a/example/src/demo/pc/select/multiple.vue +++ /dev/null @@ -1,43 +0,0 @@ - - - diff --git a/example/src/demo/pc/select/name.vue b/example/src/demo/pc/select/name.vue deleted file mode 100644 index c6f3a156b..000000000 --- a/example/src/demo/pc/select/name.vue +++ /dev/null @@ -1,43 +0,0 @@ - - - diff --git a/example/src/demo/pc/select/show-tip.vue b/example/src/demo/pc/select/show-tip.vue deleted file mode 100644 index e9abcd381..000000000 --- a/example/src/demo/pc/select/show-tip.vue +++ /dev/null @@ -1,43 +0,0 @@ - - - diff --git a/example/src/demo/pc/select/size-medium.vue b/example/src/demo/pc/select/size-medium.vue deleted file mode 100644 index 3e99abe98..000000000 --- a/example/src/demo/pc/select/size-medium.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - diff --git a/example/src/demo/pc/select/size-mini.vue b/example/src/demo/pc/select/size-mini.vue deleted file mode 100644 index 11443ff3d..000000000 --- a/example/src/demo/pc/select/size-mini.vue +++ /dev/null @@ -1,43 +0,0 @@ - - - diff --git a/example/src/demo/pc/select/size-small.vue b/example/src/demo/pc/select/size-small.vue deleted file mode 100644 index 8bfa39777..000000000 --- a/example/src/demo/pc/select/size-small.vue +++ /dev/null @@ -1,43 +0,0 @@ - - - diff --git a/example/src/demo/pc/select/slot-default.vue b/example/src/demo/pc/select/slot-default.vue deleted file mode 100644 index 3e11ff446..000000000 --- a/example/src/demo/pc/select/slot-default.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - diff --git a/example/src/demo/pc/select/slot-footer.vue b/example/src/demo/pc/select/slot-footer.vue deleted file mode 100644 index 87b50c829..000000000 --- a/example/src/demo/pc/select/slot-footer.vue +++ /dev/null @@ -1,57 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/select/tag-copy-all.vue b/example/src/demo/pc/select/tag-copy-all.vue deleted file mode 100644 index 7aa30b0cc..000000000 --- a/example/src/demo/pc/select/tag-copy-all.vue +++ /dev/null @@ -1,58 +0,0 @@ - - - diff --git a/example/src/demo/pc/slide-bar/basic-usage.vue b/example/src/demo/pc/slide-bar/basic-usage.vue deleted file mode 100644 index c834bc036..000000000 --- a/example/src/demo/pc/slide-bar/basic-usage.vue +++ /dev/null @@ -1,29 +0,0 @@ - - - diff --git a/example/src/demo/pc/slider/about-step.vue b/example/src/demo/pc/slider/about-step.vue deleted file mode 100644 index 752af2a1f..000000000 --- a/example/src/demo/pc/slider/about-step.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/slider/basic-usage.vue b/example/src/demo/pc/slider/basic-usage.vue deleted file mode 100644 index e908ac837..000000000 --- a/example/src/demo/pc/slider/basic-usage.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/pc/slider/dynamic-disable.vue b/example/src/demo/pc/slider/dynamic-disable.vue deleted file mode 100644 index 556a31b9a..000000000 --- a/example/src/demo/pc/slider/dynamic-disable.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/slider/format-tooltip.vue b/example/src/demo/pc/slider/format-tooltip.vue deleted file mode 100644 index cebda2f12..000000000 --- a/example/src/demo/pc/slider/format-tooltip.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/pc/slider/max-min.vue b/example/src/demo/pc/slider/max-min.vue deleted file mode 100644 index 7a8794640..000000000 --- a/example/src/demo/pc/slider/max-min.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/slider/range-select.vue b/example/src/demo/pc/slider/range-select.vue deleted file mode 100644 index ee3e535aa..000000000 --- a/example/src/demo/pc/slider/range-select.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/slider/shortcut-operation.vue b/example/src/demo/pc/slider/shortcut-operation.vue deleted file mode 100644 index f8e13d025..000000000 --- a/example/src/demo/pc/slider/shortcut-operation.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/slider/show-iput.vue b/example/src/demo/pc/slider/show-iput.vue deleted file mode 100644 index e78bba376..000000000 --- a/example/src/demo/pc/slider/show-iput.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/slider/show-tip.vue b/example/src/demo/pc/slider/show-tip.vue deleted file mode 100644 index 836778149..000000000 --- a/example/src/demo/pc/slider/show-tip.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/pc/slider/slider-event-change.vue b/example/src/demo/pc/slider/slider-event-change.vue deleted file mode 100644 index 7710df06d..000000000 --- a/example/src/demo/pc/slider/slider-event-change.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/pc/slider/slider-event-start.vue b/example/src/demo/pc/slider/slider-event-start.vue deleted file mode 100644 index 193c9ab32..000000000 --- a/example/src/demo/pc/slider/slider-event-start.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/pc/slider/slider-event-stop.vue b/example/src/demo/pc/slider/slider-event-stop.vue deleted file mode 100644 index c3fab48d8..000000000 --- a/example/src/demo/pc/slider/slider-event-stop.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/pc/slider/slider-slot.vue b/example/src/demo/pc/slider/slider-slot.vue deleted file mode 100644 index 9cf5e6b11..000000000 --- a/example/src/demo/pc/slider/slider-slot.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/slider/vertical-mode.vue b/example/src/demo/pc/slider/vertical-mode.vue deleted file mode 100644 index 06219b040..000000000 --- a/example/src/demo/pc/slider/vertical-mode.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/split/basic-usage.vue b/example/src/demo/pc/split/basic-usage.vue deleted file mode 100644 index 7f6fed5cf..000000000 --- a/example/src/demo/pc/split/basic-usage.vue +++ /dev/null @@ -1,38 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/steps/click.vue b/example/src/demo/pc/steps/click.vue deleted file mode 100644 index 800503ae3..000000000 --- a/example/src/demo/pc/steps/click.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/steps/data-resource.vue b/example/src/demo/pc/steps/data-resource.vue deleted file mode 100644 index b8bd7725f..000000000 --- a/example/src/demo/pc/steps/data-resource.vue +++ /dev/null @@ -1,49 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/steps/slot.vue b/example/src/demo/pc/steps/slot.vue deleted file mode 100644 index 46feae029..000000000 --- a/example/src/demo/pc/steps/slot.vue +++ /dev/null @@ -1,64 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/switch/basic-usage.vue b/example/src/demo/pc/switch/basic-usage.vue deleted file mode 100644 index c02dbe084..000000000 --- a/example/src/demo/pc/switch/basic-usage.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/switch/dynamic-disable.vue b/example/src/demo/pc/switch/dynamic-disable.vue deleted file mode 100644 index cd2b613a4..000000000 --- a/example/src/demo/pc/switch/dynamic-disable.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/switch/mini-mode.vue b/example/src/demo/pc/switch/mini-mode.vue deleted file mode 100644 index 9374b9dd6..000000000 --- a/example/src/demo/pc/switch/mini-mode.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/tabs/basic-usage.vue b/example/src/demo/pc/tabs/basic-usage.vue deleted file mode 100644 index d879f995e..000000000 --- a/example/src/demo/pc/tabs/basic-usage.vue +++ /dev/null @@ -1,24 +0,0 @@ - - - diff --git a/example/src/demo/pc/tabs/before-leave.vue b/example/src/demo/pc/tabs/before-leave.vue deleted file mode 100644 index d1e4e5c7e..000000000 --- a/example/src/demo/pc/tabs/before-leave.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/tabs/position.vue b/example/src/demo/pc/tabs/position.vue deleted file mode 100644 index 094243d7d..000000000 --- a/example/src/demo/pc/tabs/position.vue +++ /dev/null @@ -1,50 +0,0 @@ - - - diff --git a/example/src/demo/pc/tabs/stretch-wh.vue b/example/src/demo/pc/tabs/stretch-wh.vue deleted file mode 100644 index 0dae5f63b..000000000 --- a/example/src/demo/pc/tabs/stretch-wh.vue +++ /dev/null @@ -1,24 +0,0 @@ - - - diff --git a/example/src/demo/pc/tabs/with-add.vue b/example/src/demo/pc/tabs/with-add.vue deleted file mode 100644 index cc86e62d0..000000000 --- a/example/src/demo/pc/tabs/with-add.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - diff --git a/example/src/demo/pc/tag/basic-usage.vue b/example/src/demo/pc/tag/basic-usage.vue deleted file mode 100644 index 0c58659f4..000000000 --- a/example/src/demo/pc/tag/basic-usage.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/text-popup/basic-usage.vue b/example/src/demo/pc/text-popup/basic-usage.vue deleted file mode 100644 index a3184c863..000000000 --- a/example/src/demo/pc/text-popup/basic-usage.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/text-popup/label.vue b/example/src/demo/pc/text-popup/label.vue deleted file mode 100644 index 8dc252d9e..000000000 --- a/example/src/demo/pc/text-popup/label.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/text-popup/placeholder.vue b/example/src/demo/pc/text-popup/placeholder.vue deleted file mode 100644 index 445b1c698..000000000 --- a/example/src/demo/pc/text-popup/placeholder.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/text-popup/readonly.vue b/example/src/demo/pc/text-popup/readonly.vue deleted file mode 100644 index c37e7dd19..000000000 --- a/example/src/demo/pc/text-popup/readonly.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/text-popup/value.vue b/example/src/demo/pc/text-popup/value.vue deleted file mode 100644 index 86b9af7fb..000000000 --- a/example/src/demo/pc/text-popup/value.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - diff --git a/example/src/demo/pc/text-popup/width.vue b/example/src/demo/pc/text-popup/width.vue deleted file mode 100644 index a5fc0f6e0..000000000 --- a/example/src/demo/pc/text-popup/width.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-line/basic-usage.vue b/example/src/demo/pc/time-line/basic-usage.vue deleted file mode 100644 index b3fe895eb..000000000 --- a/example/src/demo/pc/time-line/basic-usage.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-line/different-data.vue b/example/src/demo/pc/time-line/different-data.vue deleted file mode 100644 index 71fde442d..000000000 --- a/example/src/demo/pc/time-line/different-data.vue +++ /dev/null @@ -1,37 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-line/show-number.vue b/example/src/demo/pc/time-line/show-number.vue deleted file mode 100644 index 3ae941e3c..000000000 --- a/example/src/demo/pc/time-line/show-number.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-picker/basic-usage.vue b/example/src/demo/pc/time-picker/basic-usage.vue deleted file mode 100644 index 4708012ba..000000000 --- a/example/src/demo/pc/time-picker/basic-usage.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-picker/clear-icon.vue b/example/src/demo/pc/time-picker/clear-icon.vue deleted file mode 100644 index 4a57b6e41..000000000 --- a/example/src/demo/pc/time-picker/clear-icon.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-picker/clearable.vue b/example/src/demo/pc/time-picker/clearable.vue deleted file mode 100644 index d5afd760a..000000000 --- a/example/src/demo/pc/time-picker/clearable.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-picker/default-value.vue b/example/src/demo/pc/time-picker/default-value.vue deleted file mode 100644 index 4332344b5..000000000 --- a/example/src/demo/pc/time-picker/default-value.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-picker/disabled.vue b/example/src/demo/pc/time-picker/disabled.vue deleted file mode 100644 index 66a47529d..000000000 --- a/example/src/demo/pc/time-picker/disabled.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-picker/editable.vue b/example/src/demo/pc/time-picker/editable.vue deleted file mode 100644 index a2ce0ccaf..000000000 --- a/example/src/demo/pc/time-picker/editable.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-picker/event-blur.vue b/example/src/demo/pc/time-picker/event-blur.vue deleted file mode 100644 index 63f4f1bd5..000000000 --- a/example/src/demo/pc/time-picker/event-blur.vue +++ /dev/null @@ -1,36 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-picker/format.vue b/example/src/demo/pc/time-picker/format.vue deleted file mode 100644 index 85617ae0b..000000000 --- a/example/src/demo/pc/time-picker/format.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-picker/name.vue b/example/src/demo/pc/time-picker/name.vue deleted file mode 100644 index 96705c85d..000000000 --- a/example/src/demo/pc/time-picker/name.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-picker/picker-options.vue b/example/src/demo/pc/time-picker/picker-options.vue deleted file mode 100644 index 4708012ba..000000000 --- a/example/src/demo/pc/time-picker/picker-options.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-picker/popper-class.vue b/example/src/demo/pc/time-picker/popper-class.vue deleted file mode 100644 index 655aa10b1..000000000 --- a/example/src/demo/pc/time-picker/popper-class.vue +++ /dev/null @@ -1,26 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/time-picker/size-medium.vue b/example/src/demo/pc/time-picker/size-medium.vue deleted file mode 100644 index 30b037009..000000000 --- a/example/src/demo/pc/time-picker/size-medium.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-picker/size-mini.vue b/example/src/demo/pc/time-picker/size-mini.vue deleted file mode 100644 index 552090d16..000000000 --- a/example/src/demo/pc/time-picker/size-mini.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-picker/size-small.vue b/example/src/demo/pc/time-picker/size-small.vue deleted file mode 100644 index 8ac6e6096..000000000 --- a/example/src/demo/pc/time-picker/size-small.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-picker/suffix-icon.vue b/example/src/demo/pc/time-picker/suffix-icon.vue deleted file mode 100644 index 5f916f96d..000000000 --- a/example/src/demo/pc/time-picker/suffix-icon.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-select/basic-usage.vue b/example/src/demo/pc/time-select/basic-usage.vue deleted file mode 100644 index ed586f927..000000000 --- a/example/src/demo/pc/time-select/basic-usage.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-select/clear-icon.vue b/example/src/demo/pc/time-select/clear-icon.vue deleted file mode 100644 index 49c0a967d..000000000 --- a/example/src/demo/pc/time-select/clear-icon.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-select/default-value.vue b/example/src/demo/pc/time-select/default-value.vue deleted file mode 100644 index 67ce4d05b..000000000 --- a/example/src/demo/pc/time-select/default-value.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-select/disabled.vue b/example/src/demo/pc/time-select/disabled.vue deleted file mode 100644 index f6778f465..000000000 --- a/example/src/demo/pc/time-select/disabled.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-select/editable.vue b/example/src/demo/pc/time-select/editable.vue deleted file mode 100644 index 2153497c8..000000000 --- a/example/src/demo/pc/time-select/editable.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-select/event-blur.vue b/example/src/demo/pc/time-select/event-blur.vue deleted file mode 100644 index 3a3b72f8d..000000000 --- a/example/src/demo/pc/time-select/event-blur.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-select/event-change.vue b/example/src/demo/pc/time-select/event-change.vue deleted file mode 100644 index 93b2b47ac..000000000 --- a/example/src/demo/pc/time-select/event-change.vue +++ /dev/null @@ -1,25 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-select/focus.vue b/example/src/demo/pc/time-select/focus.vue deleted file mode 100644 index b9d52f81f..000000000 --- a/example/src/demo/pc/time-select/focus.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-select/picker-options.vue b/example/src/demo/pc/time-select/picker-options.vue deleted file mode 100644 index 6766fb661..000000000 --- a/example/src/demo/pc/time-select/picker-options.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-select/popper-class.vue b/example/src/demo/pc/time-select/popper-class.vue deleted file mode 100644 index 549072e38..000000000 --- a/example/src/demo/pc/time-select/popper-class.vue +++ /dev/null @@ -1,30 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/time-select/range-placeholder.vue b/example/src/demo/pc/time-select/range-placeholder.vue deleted file mode 100644 index 6c20e8979..000000000 --- a/example/src/demo/pc/time-select/range-placeholder.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-select/size-medium.vue b/example/src/demo/pc/time-select/size-medium.vue deleted file mode 100644 index 238d09000..000000000 --- a/example/src/demo/pc/time-select/size-medium.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-select/size-mini.vue b/example/src/demo/pc/time-select/size-mini.vue deleted file mode 100644 index 7231d5a41..000000000 --- a/example/src/demo/pc/time-select/size-mini.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-select/size-small.vue b/example/src/demo/pc/time-select/size-small.vue deleted file mode 100644 index a6f35e14a..000000000 --- a/example/src/demo/pc/time-select/size-small.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/time-select/suffix-icon.vue b/example/src/demo/pc/time-select/suffix-icon.vue deleted file mode 100644 index bf50616c1..000000000 --- a/example/src/demo/pc/time-select/suffix-icon.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/example/src/demo/pc/toggle-menu/basic-usage.vue b/example/src/demo/pc/toggle-menu/basic-usage.vue deleted file mode 100644 index 4ec041ed9..000000000 --- a/example/src/demo/pc/toggle-menu/basic-usage.vue +++ /dev/null @@ -1,92 +0,0 @@ - - - diff --git a/example/src/demo/pc/toggle-menu/custom-icon.vue b/example/src/demo/pc/toggle-menu/custom-icon.vue deleted file mode 100644 index f6e109cca..000000000 --- a/example/src/demo/pc/toggle-menu/custom-icon.vue +++ /dev/null @@ -1,94 +0,0 @@ - - - diff --git a/example/src/demo/pc/toggle-menu/default-expand-all.vue b/example/src/demo/pc/toggle-menu/default-expand-all.vue deleted file mode 100644 index 90a42dec1..000000000 --- a/example/src/demo/pc/toggle-menu/default-expand-all.vue +++ /dev/null @@ -1,92 +0,0 @@ - - - diff --git a/example/src/demo/pc/toggle-menu/drag-events.vue b/example/src/demo/pc/toggle-menu/drag-events.vue deleted file mode 100644 index 6112153de..000000000 --- a/example/src/demo/pc/toggle-menu/drag-events.vue +++ /dev/null @@ -1,117 +0,0 @@ - - - diff --git a/example/src/demo/pc/toggle-menu/draggable.vue b/example/src/demo/pc/toggle-menu/draggable.vue deleted file mode 100644 index c6f96e22f..000000000 --- a/example/src/demo/pc/toggle-menu/draggable.vue +++ /dev/null @@ -1,92 +0,0 @@ - - - diff --git a/example/src/demo/pc/toggle-menu/get-menu-data-sync.vue b/example/src/demo/pc/toggle-menu/get-menu-data-sync.vue deleted file mode 100644 index bb64aa7b4..000000000 --- a/example/src/demo/pc/toggle-menu/get-menu-data-sync.vue +++ /dev/null @@ -1,97 +0,0 @@ - - - diff --git a/example/src/demo/pc/tooltip/basic-usage.vue b/example/src/demo/pc/tooltip/basic-usage.vue deleted file mode 100644 index 13fed043d..000000000 --- a/example/src/demo/pc/tooltip/basic-usage.vue +++ /dev/null @@ -1,94 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/tooltip/custom-transition.vue b/example/src/demo/pc/tooltip/custom-transition.vue deleted file mode 100644 index 7b72b448a..000000000 --- a/example/src/demo/pc/tooltip/custom-transition.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/tooltip/dynamic-disable.vue b/example/src/demo/pc/tooltip/dynamic-disable.vue deleted file mode 100644 index 564ec4b08..000000000 --- a/example/src/demo/pc/tooltip/dynamic-disable.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/pc/tooltip/open-delay.vue b/example/src/demo/pc/tooltip/open-delay.vue deleted file mode 100644 index f72d56c6b..000000000 --- a/example/src/demo/pc/tooltip/open-delay.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/pc/tooltip/popper-class.vue b/example/src/demo/pc/tooltip/popper-class.vue deleted file mode 100644 index db4d74a62..000000000 --- a/example/src/demo/pc/tooltip/popper-class.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/pc/tooltip/popper-options.vue b/example/src/demo/pc/tooltip/popper-options.vue deleted file mode 100644 index 942bbe924..000000000 --- a/example/src/demo/pc/tooltip/popper-options.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/pc/tooltip/tabindex.vue b/example/src/demo/pc/tooltip/tabindex.vue deleted file mode 100644 index ca72cbbd4..000000000 --- a/example/src/demo/pc/tooltip/tabindex.vue +++ /dev/null @@ -1,15 +0,0 @@ - - - diff --git a/example/src/demo/pc/transfer/basic-usage.vue b/example/src/demo/pc/transfer/basic-usage.vue deleted file mode 100644 index bbe122e8b..000000000 --- a/example/src/demo/pc/transfer/basic-usage.vue +++ /dev/null @@ -1,33 +0,0 @@ - - - diff --git a/example/src/demo/pc/transfer/data-source.vue b/example/src/demo/pc/transfer/data-source.vue deleted file mode 100644 index f6643b308..000000000 --- a/example/src/demo/pc/transfer/data-source.vue +++ /dev/null @@ -1,33 +0,0 @@ - - - diff --git a/example/src/demo/pc/transfer/filterable.vue b/example/src/demo/pc/transfer/filterable.vue deleted file mode 100644 index be86c38f9..000000000 --- a/example/src/demo/pc/transfer/filterable.vue +++ /dev/null @@ -1,33 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree-menu/accordion.vue b/example/src/demo/pc/tree-menu/accordion.vue deleted file mode 100644 index a80827ad5..000000000 --- a/example/src/demo/pc/tree-menu/accordion.vue +++ /dev/null @@ -1,175 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree-menu/basic-usage.vue b/example/src/demo/pc/tree-menu/basic-usage.vue deleted file mode 100644 index e246dcbf4..000000000 --- a/example/src/demo/pc/tree-menu/basic-usage.vue +++ /dev/null @@ -1,16 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree-menu/check-strictly.vue b/example/src/demo/pc/tree-menu/check-strictly.vue deleted file mode 100644 index 2ec8929d2..000000000 --- a/example/src/demo/pc/tree-menu/check-strictly.vue +++ /dev/null @@ -1,123 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree-menu/data-resource.vue b/example/src/demo/pc/tree-menu/data-resource.vue deleted file mode 100644 index 88f853c9c..000000000 --- a/example/src/demo/pc/tree-menu/data-resource.vue +++ /dev/null @@ -1,123 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree-menu/default-expand-all.vue b/example/src/demo/pc/tree-menu/default-expand-all.vue deleted file mode 100644 index 9816e975b..000000000 --- a/example/src/demo/pc/tree-menu/default-expand-all.vue +++ /dev/null @@ -1,176 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree-menu/default-expanded-keys.vue b/example/src/demo/pc/tree-menu/default-expanded-keys.vue deleted file mode 100644 index 752f17a77..000000000 --- a/example/src/demo/pc/tree-menu/default-expanded-keys.vue +++ /dev/null @@ -1,124 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree-menu/expand-on-click-node.vue b/example/src/demo/pc/tree-menu/expand-on-click-node.vue deleted file mode 100644 index 10a5f6133..000000000 --- a/example/src/demo/pc/tree-menu/expand-on-click-node.vue +++ /dev/null @@ -1,175 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree-menu/get-menu-data-sync.vue b/example/src/demo/pc/tree-menu/get-menu-data-sync.vue deleted file mode 100644 index 87bce2129..000000000 --- a/example/src/demo/pc/tree-menu/get-menu-data-sync.vue +++ /dev/null @@ -1,128 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree-menu/lazy-load.vue b/example/src/demo/pc/tree-menu/lazy-load.vue deleted file mode 100644 index c4acd76f3..000000000 --- a/example/src/demo/pc/tree-menu/lazy-load.vue +++ /dev/null @@ -1,58 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree-menu/show-checkbox.vue b/example/src/demo/pc/tree-menu/show-checkbox.vue deleted file mode 100644 index 28cd7233c..000000000 --- a/example/src/demo/pc/tree-menu/show-checkbox.vue +++ /dev/null @@ -1,176 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree/basic-usage.vue b/example/src/demo/pc/tree/basic-usage.vue deleted file mode 100644 index d4299b698..000000000 --- a/example/src/demo/pc/tree/basic-usage.vue +++ /dev/null @@ -1,83 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree/check-strictly.vue b/example/src/demo/pc/tree/check-strictly.vue deleted file mode 100644 index 02fc13da8..000000000 --- a/example/src/demo/pc/tree/check-strictly.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree/data-source.vue b/example/src/demo/pc/tree/data-source.vue deleted file mode 100644 index 6b351acd4..000000000 --- a/example/src/demo/pc/tree/data-source.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree/default-expand-all.vue b/example/src/demo/pc/tree/default-expand-all.vue deleted file mode 100644 index 151936a13..000000000 --- a/example/src/demo/pc/tree/default-expand-all.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree/default-expanded-keys.vue b/example/src/demo/pc/tree/default-expanded-keys.vue deleted file mode 100644 index a40eb7d7f..000000000 --- a/example/src/demo/pc/tree/default-expanded-keys.vue +++ /dev/null @@ -1,76 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree/drag-events.vue b/example/src/demo/pc/tree/drag-events.vue deleted file mode 100644 index f4710142e..000000000 --- a/example/src/demo/pc/tree/drag-events.vue +++ /dev/null @@ -1,93 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree/expand-on-click-node.vue b/example/src/demo/pc/tree/expand-on-click-node.vue deleted file mode 100644 index 26c4d7b66..000000000 --- a/example/src/demo/pc/tree/expand-on-click-node.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree/node-key.vue b/example/src/demo/pc/tree/node-key.vue deleted file mode 100644 index dc130e9df..000000000 --- a/example/src/demo/pc/tree/node-key.vue +++ /dev/null @@ -1,117 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/tree/render-content.vue b/example/src/demo/pc/tree/render-content.vue deleted file mode 100644 index 6a719debc..000000000 --- a/example/src/demo/pc/tree/render-content.vue +++ /dev/null @@ -1,101 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree/show-checkbox.vue b/example/src/demo/pc/tree/show-checkbox.vue deleted file mode 100644 index 83eb4b2a4..000000000 --- a/example/src/demo/pc/tree/show-checkbox.vue +++ /dev/null @@ -1,95 +0,0 @@ - - - diff --git a/example/src/demo/pc/tree/single-select-radio.vue b/example/src/demo/pc/tree/single-select-radio.vue deleted file mode 100644 index 4f11ccbad..000000000 --- a/example/src/demo/pc/tree/single-select-radio.vue +++ /dev/null @@ -1,84 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-account/basic-usage.vue b/example/src/demo/pc/user-account/basic-usage.vue deleted file mode 100644 index e7f614f24..000000000 --- a/example/src/demo/pc/user-account/basic-usage.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-account/custom-service.vue b/example/src/demo/pc/user-account/custom-service.vue deleted file mode 100644 index 82c82c5c1..000000000 --- a/example/src/demo/pc/user-account/custom-service.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-contact/basic-usage.vue b/example/src/demo/pc/user-contact/basic-usage.vue deleted file mode 100644 index 65b27ea70..000000000 --- a/example/src/demo/pc/user-contact/basic-usage.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-contact/data-source.vue b/example/src/demo/pc/user-contact/data-source.vue deleted file mode 100644 index 65b27ea70..000000000 --- a/example/src/demo/pc/user-contact/data-source.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-head/basic-usage.vue b/example/src/demo/pc/user-head/basic-usage.vue deleted file mode 100644 index 95fdff6ae..000000000 --- a/example/src/demo/pc/user-head/basic-usage.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-head/color.vue b/example/src/demo/pc/user-head/color.vue deleted file mode 100644 index caeff1e72..000000000 --- a/example/src/demo/pc/user-head/color.vue +++ /dev/null @@ -1,16 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-head/custom-background-color.vue b/example/src/demo/pc/user-head/custom-background-color.vue deleted file mode 100644 index 09f5caba7..000000000 --- a/example/src/demo/pc/user-head/custom-background-color.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-head/custom-user-head-content.vue b/example/src/demo/pc/user-head/custom-user-head-content.vue deleted file mode 100644 index c4d690a3f..000000000 --- a/example/src/demo/pc/user-head/custom-user-head-content.vue +++ /dev/null @@ -1,39 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/user-head/icon-user-head.vue b/example/src/demo/pc/user-head/icon-user-head.vue deleted file mode 100644 index 7e651c02d..000000000 --- a/example/src/demo/pc/user-head/icon-user-head.vue +++ /dev/null @@ -1,19 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-head/image-user-head.vue b/example/src/demo/pc/user-head/image-user-head.vue deleted file mode 100644 index b2e7fef13..000000000 --- a/example/src/demo/pc/user-head/image-user-head.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-head/label-user-head.vue b/example/src/demo/pc/user-head/label-user-head.vue deleted file mode 100644 index a600a5bd4..000000000 --- a/example/src/demo/pc/user-head/label-user-head.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-head/message-count-limit.vue b/example/src/demo/pc/user-head/message-count-limit.vue deleted file mode 100644 index 1d6ac7aac..000000000 --- a/example/src/demo/pc/user-head/message-count-limit.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-head/message-count-total.vue b/example/src/demo/pc/user-head/message-count-total.vue deleted file mode 100644 index f149bff40..000000000 --- a/example/src/demo/pc/user-head/message-count-total.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-head/message-count-type.vue b/example/src/demo/pc/user-head/message-count-type.vue deleted file mode 100644 index e63335dcf..000000000 --- a/example/src/demo/pc/user-head/message-count-type.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-head/min-user-head.vue b/example/src/demo/pc/user-head/min-user-head.vue deleted file mode 100644 index 4c71bf4e3..000000000 --- a/example/src/demo/pc/user-head/min-user-head.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-head/render-user-head-in-grid.vue b/example/src/demo/pc/user-head/render-user-head-in-grid.vue deleted file mode 100644 index 49d286883..000000000 --- a/example/src/demo/pc/user-head/render-user-head-in-grid.vue +++ /dev/null @@ -1,130 +0,0 @@ - - - - - diff --git a/example/src/demo/pc/user-head/round-user-head.vue b/example/src/demo/pc/user-head/round-user-head.vue deleted file mode 100644 index 44bb06c03..000000000 --- a/example/src/demo/pc/user-head/round-user-head.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-link/basic-usage.vue b/example/src/demo/pc/user-link/basic-usage.vue deleted file mode 100644 index 801097e88..000000000 --- a/example/src/demo/pc/user-link/basic-usage.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-link/cache-users.vue b/example/src/demo/pc/user-link/cache-users.vue deleted file mode 100644 index 1a6e0717d..000000000 --- a/example/src/demo/pc/user-link/cache-users.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-link/custom-service.vue b/example/src/demo/pc/user-link/custom-service.vue deleted file mode 100644 index 858ff2b66..000000000 --- a/example/src/demo/pc/user-link/custom-service.vue +++ /dev/null @@ -1,55 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-link/text-field.vue b/example/src/demo/pc/user-link/text-field.vue deleted file mode 100644 index 57f26af65..000000000 --- a/example/src/demo/pc/user-link/text-field.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-link/value-field.vue b/example/src/demo/pc/user-link/value-field.vue deleted file mode 100644 index 829ac59cc..000000000 --- a/example/src/demo/pc/user-link/value-field.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-link/value-split.vue b/example/src/demo/pc/user-link/value-split.vue deleted file mode 100644 index 997c390e3..000000000 --- a/example/src/demo/pc/user-link/value-split.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/user-link/value.vue b/example/src/demo/pc/user-link/value.vue deleted file mode 100644 index 801097e88..000000000 --- a/example/src/demo/pc/user-link/value.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/user/basic-usage.vue b/example/src/demo/pc/user/basic-usage.vue deleted file mode 100644 index f185f1e06..000000000 --- a/example/src/demo/pc/user/basic-usage.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/user/cache-users.vue b/example/src/demo/pc/user/cache-users.vue deleted file mode 100644 index 9958a08be..000000000 --- a/example/src/demo/pc/user/cache-users.vue +++ /dev/null @@ -1,24 +0,0 @@ - - - diff --git a/example/src/demo/pc/user/custom-placeholder.vue b/example/src/demo/pc/user/custom-placeholder.vue deleted file mode 100644 index dbd46ae89..000000000 --- a/example/src/demo/pc/user/custom-placeholder.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/user/custom-service.vue b/example/src/demo/pc/user/custom-service.vue deleted file mode 100644 index bffe5c004..000000000 --- a/example/src/demo/pc/user/custom-service.vue +++ /dev/null @@ -1,56 +0,0 @@ - - - diff --git a/example/src/demo/pc/user/custom-sort.vue b/example/src/demo/pc/user/custom-sort.vue deleted file mode 100644 index c148674d8..000000000 --- a/example/src/demo/pc/user/custom-sort.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/pc/user/dynamic-disable.vue b/example/src/demo/pc/user/dynamic-disable.vue deleted file mode 100644 index 8b5ea8094..000000000 --- a/example/src/demo/pc/user/dynamic-disable.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/user/event-change.vue b/example/src/demo/pc/user/event-change.vue deleted file mode 100644 index 96ee801fb..000000000 --- a/example/src/demo/pc/user/event-change.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/example/src/demo/pc/user/tag-copy-all.vue b/example/src/demo/pc/user/tag-copy-all.vue deleted file mode 100644 index 3ac451088..000000000 --- a/example/src/demo/pc/user/tag-copy-all.vue +++ /dev/null @@ -1,20 +0,0 @@ - - - diff --git a/example/src/demo/pc/user/text-field.vue b/example/src/demo/pc/user/text-field.vue deleted file mode 100644 index 7d23b1cbc..000000000 --- a/example/src/demo/pc/user/text-field.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/example/src/demo/pc/user/value-field.vue b/example/src/demo/pc/user/value-field.vue deleted file mode 100644 index 09fed77dd..000000000 --- a/example/src/demo/pc/user/value-field.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - diff --git a/example/src/demo/pc/user/value-split.vue b/example/src/demo/pc/user/value-split.vue deleted file mode 100644 index 5459faf6c..000000000 --- a/example/src/demo/pc/user/value-split.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - diff --git a/example/src/demo/pc/wizard/basic-usage.vue b/example/src/demo/pc/wizard/basic-usage.vue deleted file mode 100644 index 0b8551b9e..000000000 --- a/example/src/demo/pc/wizard/basic-usage.vue +++ /dev/null @@ -1,39 +0,0 @@ - - - diff --git a/example/src/demo/pc/wizard/vertical.vue b/example/src/demo/pc/wizard/vertical.vue deleted file mode 100644 index 6297bb00a..000000000 --- a/example/src/demo/pc/wizard/vertical.vue +++ /dev/null @@ -1,49 +0,0 @@ - - - diff --git a/example/src/docs/LICENSE b/example/src/docs/LICENSE deleted file mode 100644 index 0a8f88408..000000000 --- a/example/src/docs/LICENSE +++ /dev/null @@ -1,103 +0,0 @@ -Creative Commons Attribution 4.0 International Public License - -By exercising the Licensed Rights (defined below), You accept and agree to be bound by the terms and conditions of this Creative Commons Attribution 4.0 International Public License ("Public License"). To the extent this Public License may be interpreted as a contract, You are granted the Licensed Rights in consideration of Your acceptance of these terms and conditions, and the Licensor grants You such rights in consideration of benefits the Licensor receives from making the Licensed Material available under these terms and conditions. - -Section 1 – Definitions. - -a. Adapted Material means material subject to Copyright and Similar Rights that is derived from or based upon the Licensed Material and in which the Licensed Material is translated, altered, arranged, transformed, or otherwise modified in a manner requiring permission under the Copyright and Similar Rights held by the Licensor. For purposes of this Public License, where the Licensed Material is a musical work, performance, or sound recording, Adapted Material is always produced where the Licensed Material is synched in timed relation with a moving image. - -b. Adapter's License means the license You apply to Your Copyright and Similar Rights in Your contributions to Adapted Material in accordance with the terms and conditions of this Public License. - -c. Copyright and Similar Rights means copyright and/or similar rights closely related to copyright including, without limitation, performance, broadcast, sound recording, and Sui Generis Database Rights, without regard to how the rights are labeled or categorized. For purposes of this Public License, the rights specified in Section 2(b)(1)-(2) are not Copyright and Similar Rights. - -d. Effective Technological Measures means those measures that, in the absence of proper authority, may not be circumvented under laws fulfilling obligations under Article 11 of the WIPO Copyright Treaty adopted on December 20, 1996, and/or similar international agreements. - -e. Exceptions and Limitations means fair use, fair dealing, and/or any other exception or limitation to Copyright and Similar Rights that applies to Your use of the Licensed Material. - -f. Licensed Material means the artistic or literary work, database, or other material to which the Licensor applied this Public License. - -g. Licensed Rights means the rights granted to You subject to the terms and conditions of this Public License, which are limited to all Copyright and Similar Rights that apply to Your use of the Licensed Material and that the Licensor has authority to license. - -h. Licensor means the individual(s) or entity(ies) granting rights under this Public License. - -i. Share means to provide material to the public by any means or process that requires permission under the Licensed Rights, such as reproduction, public display, public performance, distribution, dissemination, communication, or importation, and to make material available to the public including in ways that members of the public may access the material from a place and at a time individually chosen by them. - -j. Sui Generis Database Rights means rights other than copyright resulting from Directive 96/9/EC of the European Parliament and of the Council of 11 March 1996 on the legal protection of databases, as amended and/or succeeded, as well as other essentially equivalent rights anywhere in the world. - -k. You means the individual or entity exercising the Licensed Rights under this Public License. Your has a corresponding meaning. - -Section 2 – Scope. - -a. License grant. -1. Subject to the terms and conditions of this Public License, the Licensor hereby grants You a worldwide, royalty-free, non-sublicensable, non-exclusive, irrevocable license to exercise the Licensed Rights in the Licensed Material to: - A. reproduce and Share the Licensed Material, in whole or in part; and - B. produce, reproduce, and Share Adapted Material. -2. Exceptions and Limitations. For the avoidance of doubt, where Exceptions and Limitations apply to Your use, this Public License does not apply, and You do not need to comply with its terms and conditions. -3. Term. The term of this Public License is specified in Section 6(a). -4. Media and formats; technical modifications allowed. The Licensor authorizes You to exercise the Licensed Rights in all media and formats whether now known or hereafter created, and to make technical modifications necessary to do so. The Licensor waives and/or agrees not to assert any right or authority to forbid You from making technical modifications necessary to exercise the Licensed Rights, including technical modifications necessary to circumvent Effective Technological Measures. For purposes of this Public License, simply making modifications authorized by this Section 2(a)(4) never produces Adapted Material. -5. Downstream recipients. -A. Offer from the Licensor – Licensed Material. Every recipient of the Licensed Material automatically receives an offer from the Licensor to exercise the Licensed Rights under the terms and conditions of this Public License. -B. No downstream restrictions. You may not offer or impose any additional or different terms or conditions on, or apply any Effective Technological Measures to, the Licensed Material if doing so restricts exercise of the Licensed Rights by any recipient of the Licensed Material. -6. No endorsement. Nothing in this Public License constitutes or may be construed as permission to assert or imply that You are, or that Your use of the Licensed Material is, connected with, or sponsored, endorsed, or granted official status by, the Licensor or others designated to receive attribution as provided in Section 3(a)(1)(A)(i). - -b. Other rights. -1. Moral rights, such as the right of integrity, are not licensed under this Public License, nor are publicity, privacy, and/or other similar personality rights; however, to the extent possible, the Licensor waives and/or agrees not to assert any such rights held by the Licensor to the limited extent necessary to allow You to exercise the Licensed Rights, but not otherwise. -2. Patent and trademark rights are not licensed under this Public License. -3. To the extent possible, the Licensor waives any right to collect royalties from You for the exercise of the Licensed Rights, whether directly or through a collecting society under any voluntary or waivable statutory or compulsory licensing scheme. In all other cases the Licensor expressly reserves any right to collect such royalties. - -Section 3 – License Conditions. - -Your exercise of the Licensed Rights is expressly made subject to the following conditions. - -a. Attribution. -1. If You Share the Licensed Material (including in modified form), You must: -A. retain the following if it is supplied by the Licensor with the Licensed Material: - i. identification of the creator(s) of the Licensed Material and any others designated to receive attribution, in any reasonable manner requested by the Licensor (including by pseudonym if designated); - ii. a copyright notice; - iii. a notice that refers to this Public License; - iv. a notice that refers to the disclaimer of warranties; - v. a URI or hyperlink to the Licensed Material to the extent reasonably practicable; -B. indicate if You modified the Licensed Material and retain an indication of any previous modifications; and -C. indicate the Licensed Material is licensed under this Public License, and include the text of, or the URI or hyperlink to, this Public License. -2. You may satisfy the conditions in Section 3(a)(1) in any reasonable manner based on the medium, means, and context in which You Share the Licensed Material. For example, it may be reasonable to satisfy the conditions by providing a URI or hyperlink to a resource that includes the required information. -3. If requested by the Licensor, You must remove any of the information required by Section 3(a)(1)(A) to the extent reasonably practicable. -4. If You Share Adapted Material You produce, the Adapter's License You apply must not prevent recipients of the Adapted Material from complying with this Public License. - -Section 4 – Sui Generis Database Rights. - -Where the Licensed Rights include Sui Generis Database Rights that apply to Your use of the Licensed Material: - -a. for the avoidance of doubt, Section 2(a)(1) grants You the right to extract, reuse, reproduce, and Share all or a substantial portion of the contents of the database; - -b. if You include all or a substantial portion of the database contents in a database in which You have Sui Generis Database Rights, then the database in which You have Sui Generis Database Rights (but not its individual contents) is Adapted Material; and -c. You must comply with the conditions in Section 3(a) if You Share all or a substantial portion of the contents of the database. -For the avoidance of doubt, this Section 4 supplements and does not replace Your obligations under this Public License where the Licensed Rights include other Copyright and Similar Rights. - -Section 5 – Disclaimer of Warranties and Limitation of Liability. - -a. Unless otherwise separately undertaken by the Licensor, to the extent possible, the Licensor offers the Licensed Material as-is and as-available, and makes no representations or warranties of any kind concerning the Licensed Material, whether express, implied, statutory, or other. This includes, without limitation, warranties of title, merchantability, fitness for a particular purpose, non-infringement, absence of latent or other defects, accuracy, or the presence or absence of errors, whether or not known or discoverable. Where disclaimers of warranties are not allowed in full or in part, this disclaimer may not apply to You. -b. To the extent possible, in no event will the Licensor be liable to You on any legal theory (including, without limitation, negligence) or otherwise for any direct, special, indirect, incidental, consequential, punitive, exemplary, or other losses, costs, expenses, or damages arising out of this Public License or use of the Licensed Material, even if the Licensor has been advised of the possibility of such losses, costs, expenses, or damages. Where a limitation of liability is not allowed in full or in part, this limitation may not apply to You. -c. The disclaimer of warranties and limitation of liability provided above shall be interpreted in a manner that, to the extent possible, most closely approximates an absolute disclaimer and waiver of all liability. - -Section 6 – Term and Termination. - -a. This Public License applies for the term of the Copyright and Similar Rights licensed here. However, if You fail to comply with this Public License, then Your rights under this Public License terminate automatically. -b. Where Your right to use the Licensed Material has terminated under Section 6(a), it reinstates: -1. automatically as of the date the violation is cured, provided it is cured within 30 days of Your discovery of the violation; or -2. upon express reinstatement by the Licensor. -For the avoidance of doubt, this Section 6(b) does not affect any right the Licensor may have to seek remedies for Your violations of this Public License. - -c. For the avoidance of doubt, the Licensor may also offer the Licensed Material under separate terms or conditions or stop distributing the Licensed Material at any time; however, doing so will not terminate this Public License. -d. Sections 1, 5, 6, 7, and 8 survive termination of this Public License. - -Section 7 – Other Terms and Conditions. - -a. The Licensor shall not be bound by any additional or different terms or conditions communicated by You unless expressly agreed. -b. Any arrangements, understandings, or agreements regarding the Licensed Material not stated herein are separate from and independent of the terms and conditions of this Public License. - -Section 8 – Interpretation. - -a. For the avoidance of doubt, this Public License does not, and shall not be interpreted to, reduce, limit, restrict, or impose conditions on any use of the Licensed Material that could lawfully be made without permission under this Public License. -b. To the extent possible, if any provision of this Public License is deemed unenforceable, it shall be automatically reformed to the minimum extent necessary to make it enforceable. If the provision cannot be reformed, it shall be severed from this Public License without affecting the enforceability of the remaining terms and conditions. -c. No term or condition of this Public License will be waived and no failure to comply consented to unless expressly agreed to by the Licensor. -d. Nothing in this Public License constitutes or may be interpreted as a limitation upon, or waiver of, any privileges and immunities that apply to the Licensor or You, including from the legal processes of any jurisdiction or authority. diff --git a/example/src/docs/mobile/action-sheet/actionsheet.md b/example/src/docs/mobile/action-sheet/actionsheet.md deleted file mode 100644 index 4d3756bf2..000000000 --- a/example/src/docs/mobile/action-sheet/actionsheet.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## ActionSheet 上滑列表组件 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/action-sheet/clickitem.md b/example/src/docs/mobile/action-sheet/clickitem.md deleted file mode 100644 index 34c2faa75..000000000 --- a/example/src/docs/mobile/action-sheet/clickitem.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## ActionSheet 上滑列表组件 - - -
- -### 点击列表事件 - - - -
diff --git a/example/src/docs/mobile/action-sheet/ellipsis.md b/example/src/docs/mobile/action-sheet/ellipsis.md deleted file mode 100644 index 2335e5d9d..000000000 --- a/example/src/docs/mobile/action-sheet/ellipsis.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## ActionSheet 上滑列表组件 - - -
- -### 内容超出显示省略号 - - - -
diff --git a/example/src/docs/mobile/action-sheet/slot.md b/example/src/docs/mobile/action-sheet/slot.md deleted file mode 100644 index 0404c5abc..000000000 --- a/example/src/docs/mobile/action-sheet/slot.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## ActionSheet 上滑列表组件 - - -
- -### 自定义列表项内容 - -通过 `item` 插槽自定义下拉列表内容 - - - -
- -### 自定义操作项 - -通过 `action` 插槽自定义操作项内容 - - diff --git a/example/src/docs/mobile/alert/custom-close.md b/example/src/docs/mobile/alert/custom-close.md deleted file mode 100644 index 1f3536a9e..000000000 --- a/example/src/docs/mobile/alert/custom-close.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Alert 提示 - - -
- -### 自定义关闭 - - - -
diff --git a/example/src/docs/mobile/alert/icon.md b/example/src/docs/mobile/alert/icon.md deleted file mode 100644 index 8f7cb067e..000000000 --- a/example/src/docs/mobile/alert/icon.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Alert 提示 - - -
- -### 自定义提示图标 - - - -
diff --git a/example/src/docs/mobile/alert/mobilealert.md b/example/src/docs/mobile/alert/mobilealert.md deleted file mode 100644 index c9219395b..000000000 --- a/example/src/docs/mobile/alert/mobilealert.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Alert 提示 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/alert/size.md b/example/src/docs/mobile/alert/size.md deleted file mode 100644 index 83aba6eb5..000000000 --- a/example/src/docs/mobile/alert/size.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Alert 提示 - - -
- -### 不同尺寸 - - - -
diff --git a/example/src/docs/mobile/alert/slot-default.md b/example/src/docs/mobile/alert/slot-default.md deleted file mode 100644 index 28977a2f4..000000000 --- a/example/src/docs/mobile/alert/slot-default.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Alert 提示 - - -
- -### 自定义提示内容 - - - -
diff --git a/example/src/docs/mobile/avatar/avatar-size.md b/example/src/docs/mobile/avatar/avatar-size.md deleted file mode 100644 index 36345c3c9..000000000 --- a/example/src/docs/mobile/avatar/avatar-size.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## Avatar 头像 - - -
- -### 基本用法 - -`size`可设置为`large,medium,small`,如果不能满足需要,可以设置`size`为`number`类型自定义大小 - - -
diff --git a/example/src/docs/mobile/avatar/avatar-src-set.md b/example/src/docs/mobile/avatar/avatar-src-set.md deleted file mode 100644 index e7534b58e..000000000 --- a/example/src/docs/mobile/avatar/avatar-src-set.md +++ /dev/null @@ -1,22 +0,0 @@ -
-

- -

- -## Avatar 头像 - - -
- -### 基本用法 - -`src`设置``的展示源,``原生属性 -`srcSet`设置``在不同情况下的图片源的集合,``原生属性 -`icon`设置图标头像 -`fit`设置填充样式,默认为`cover`可选`fill,contain,cover,none,scale-down` -`error`设置`img`标签的`onerror`函数 -`shape`设置形状,默认为`circle`可选`circle,square` - - - -
diff --git a/example/src/docs/mobile/badge/content.md b/example/src/docs/mobile/badge/content.md deleted file mode 100644 index 3e31bdfd3..000000000 --- a/example/src/docs/mobile/badge/content.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Badge 徽章 - - -
- -### 自定义提示内容 - - - -
diff --git a/example/src/docs/mobile/badge/hidden.md b/example/src/docs/mobile/badge/hidden.md deleted file mode 100644 index e81d189cc..000000000 --- a/example/src/docs/mobile/badge/hidden.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Badge 徽章 - - -
- -### 隐藏徽标 - - - -
diff --git a/example/src/docs/mobile/badge/href-target.md b/example/src/docs/mobile/badge/href-target.md deleted file mode 100644 index 0301e785b..000000000 --- a/example/src/docs/mobile/badge/href-target.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Badge 徽章 - - -
- -### 跳转链接 - - - -
diff --git a/example/src/docs/mobile/badge/is-dot.md b/example/src/docs/mobile/badge/is-dot.md deleted file mode 100644 index 6b81464a4..000000000 --- a/example/src/docs/mobile/badge/is-dot.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Badge 徽章 - - -
- -### 小圆点标记 - - - -
diff --git a/example/src/docs/mobile/badge/is-mini.md b/example/src/docs/mobile/badge/is-mini.md deleted file mode 100644 index 94ba19d7b..000000000 --- a/example/src/docs/mobile/badge/is-mini.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Badge 徽章 - - -
- -### 小尺寸 - - - -
diff --git a/example/src/docs/mobile/badge/mobilebadge.md b/example/src/docs/mobile/badge/mobilebadge.md deleted file mode 100644 index fcb09d6a5..000000000 --- a/example/src/docs/mobile/badge/mobilebadge.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Badge 徽章 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/badge/type.md b/example/src/docs/mobile/badge/type.md deleted file mode 100644 index 9cdcb7b3e..000000000 --- a/example/src/docs/mobile/badge/type.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Badge 徽章 - - -
- -### 不同主题 - - - -
diff --git a/example/src/docs/mobile/button/event-click.md b/example/src/docs/mobile/button/event-click.md deleted file mode 100644 index 7800309c8..000000000 --- a/example/src/docs/mobile/button/event-click.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Button 按钮 - - -
- -### 单击事件 - - - -
diff --git a/example/src/docs/mobile/button/icon.md b/example/src/docs/mobile/button/icon.md deleted file mode 100644 index 029e3e3d9..000000000 --- a/example/src/docs/mobile/button/icon.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Button 按钮 - - -
- -### 图标按钮 - - - -
diff --git a/example/src/docs/mobile/button/loading.md b/example/src/docs/mobile/button/loading.md deleted file mode 100644 index 21326b3ff..000000000 --- a/example/src/docs/mobile/button/loading.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Button 按钮 - - -
- -### 加载中 - - - -
diff --git a/example/src/docs/mobile/button/mobilebutton.md b/example/src/docs/mobile/button/mobilebutton.md deleted file mode 100644 index f9cf590ee..000000000 --- a/example/src/docs/mobile/button/mobilebutton.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Button 按钮 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/button/native-type.md b/example/src/docs/mobile/button/native-type.md deleted file mode 100644 index 74dd8cd69..000000000 --- a/example/src/docs/mobile/button/native-type.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## Button 按钮 - - - -
- -### 按钮属性 - -通过 `native-type` 属性可以设置原生 type 属性,该属性的可选值为 button / submit / reset - - - -
diff --git a/example/src/docs/mobile/button/plain.md b/example/src/docs/mobile/button/plain.md deleted file mode 100644 index 2949744fc..000000000 --- a/example/src/docs/mobile/button/plain.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Button 按钮 - - -
- -### 朴素按钮 - - - -
diff --git a/example/src/docs/mobile/button/reset-time.md b/example/src/docs/mobile/button/reset-time.md deleted file mode 100644 index 8321f1cfb..000000000 --- a/example/src/docs/mobile/button/reset-time.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## Button 按钮 - - - -
- -### 按钮禁用时间 - -通过 `reset-time` 属性可以设置按钮禁用时间,防止重复提交,单位毫秒,该属性默认为 1000 - - - -
diff --git a/example/src/docs/mobile/button/round.md b/example/src/docs/mobile/button/round.md deleted file mode 100644 index 557a6a19c..000000000 --- a/example/src/docs/mobile/button/round.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Button 按钮 - - -
- -### 圆角按钮 - - - -
diff --git a/example/src/docs/mobile/button/size.md b/example/src/docs/mobile/button/size.md deleted file mode 100644 index 5dddf9f15..000000000 --- a/example/src/docs/mobile/button/size.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Button 按钮 - - -
- -### 不同尺寸 - - - -
diff --git a/example/src/docs/mobile/button/text.md b/example/src/docs/mobile/button/text.md deleted file mode 100644 index 60d01525a..000000000 --- a/example/src/docs/mobile/button/text.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Button 按钮 - - -
- -### 文字按钮 - - - -
diff --git a/example/src/docs/mobile/checkbox-group/disabled.md b/example/src/docs/mobile/checkbox-group/disabled.md deleted file mode 100644 index 744aba00b..000000000 --- a/example/src/docs/mobile/checkbox-group/disabled.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## CheckboxGroup 复选框组 - - - -
- -### 是否禁用 - - - -
diff --git a/example/src/docs/mobile/checkbox-group/event-change.md b/example/src/docs/mobile/checkbox-group/event-change.md deleted file mode 100644 index e5ed56193..000000000 --- a/example/src/docs/mobile/checkbox-group/event-change.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## CheckboxGroup 复选框组 - - -
- -### 事件 - - - -
diff --git a/example/src/docs/mobile/checkbox-group/min-max.md b/example/src/docs/mobile/checkbox-group/min-max.md deleted file mode 100644 index b7602011d..000000000 --- a/example/src/docs/mobile/checkbox-group/min-max.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## CheckboxGroup 复选框组 - - -
- -### 可选数量 - - - -
diff --git a/example/src/docs/mobile/checkbox-group/monilecheckboxgroup.md b/example/src/docs/mobile/checkbox-group/monilecheckboxgroup.md deleted file mode 100644 index 1bd2fdd5e..000000000 --- a/example/src/docs/mobile/checkbox-group/monilecheckboxgroup.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## CheckboxGroup 复选框组 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/checkbox-group/vertical.md b/example/src/docs/mobile/checkbox-group/vertical.md deleted file mode 100644 index 125ec1fe0..000000000 --- a/example/src/docs/mobile/checkbox-group/vertical.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## CheckboxGroup 复选框组 - - -
- -### 垂直排列 - - - -
diff --git a/example/src/docs/mobile/checkbox/default.md b/example/src/docs/mobile/checkbox/default.md deleted file mode 100644 index bc58e8dac..000000000 --- a/example/src/docs/mobile/checkbox/default.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## Checkbox 复选框 - - - -
- -### 默认插槽 - - - -
diff --git a/example/src/docs/mobile/checkbox/event-change.md b/example/src/docs/mobile/checkbox/event-change.md deleted file mode 100644 index 109c5f578..000000000 --- a/example/src/docs/mobile/checkbox/event-change.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Checkbox 复选框 - - -
- -### 事件 - - - -
diff --git a/example/src/docs/mobile/checkbox/indeterminate.md b/example/src/docs/mobile/checkbox/indeterminate.md deleted file mode 100644 index d4bc0db18..000000000 --- a/example/src/docs/mobile/checkbox/indeterminate.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Checkbox 复选框 - - -
- -### 全选与半选 - - - -
diff --git a/example/src/docs/mobile/checkbox/label.md b/example/src/docs/mobile/checkbox/label.md deleted file mode 100644 index db419e3ad..000000000 --- a/example/src/docs/mobile/checkbox/label.md +++ /dev/null @@ -1,34 +0,0 @@ -
-

- -

- -## Checkbox 复选框 - - - -
- -### 复选框组选中的值设置 - - - -
- -### 选中与未选中的值设置 - - - -
- -### 是否禁用 - - - -
- -### name 属性 - - - -
diff --git a/example/src/docs/mobile/checkbox/mobilecheckbox.md b/example/src/docs/mobile/checkbox/mobilecheckbox.md deleted file mode 100644 index ee328a7d5..000000000 --- a/example/src/docs/mobile/checkbox/mobilecheckbox.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Checkbox 复选框 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/dialog-box/cancel-confirm.md b/example/src/docs/mobile/dialog-box/cancel-confirm.md deleted file mode 100644 index 7bf5aa6c0..000000000 --- a/example/src/docs/mobile/dialog-box/cancel-confirm.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## Dialogbox 对话框 - - - -
- -### 取消与确认事件的回调 - - - -
diff --git a/example/src/docs/mobile/dialog-box/close-on-click-modal.md b/example/src/docs/mobile/dialog-box/close-on-click-modal.md deleted file mode 100644 index 08419370a..000000000 --- a/example/src/docs/mobile/dialog-box/close-on-click-modal.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Dialogbox 对话框 - - -
- -### 单击遮罩层不关闭 - - - -
diff --git a/example/src/docs/mobile/dialog-box/events-open-close.md b/example/src/docs/mobile/dialog-box/events-open-close.md deleted file mode 100644 index 957de446e..000000000 --- a/example/src/docs/mobile/dialog-box/events-open-close.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Dialogbox 对话框 - - -
- -### 打开与关闭事件 - - - -
diff --git a/example/src/docs/mobile/dialog-box/lock-scroll.md b/example/src/docs/mobile/dialog-box/lock-scroll.md deleted file mode 100644 index 8c9a7d242..000000000 --- a/example/src/docs/mobile/dialog-box/lock-scroll.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## Dialogbox 对话框 - - - -
- -### 弹出时禁用滚动 - - - -
diff --git a/example/src/docs/mobile/dialog-box/mobiledialogbox.md b/example/src/docs/mobile/dialog-box/mobiledialogbox.md deleted file mode 100644 index e33546eea..000000000 --- a/example/src/docs/mobile/dialog-box/mobiledialogbox.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Dialogbox 对话框 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/dialog-box/show-header.md b/example/src/docs/mobile/dialog-box/show-header.md deleted file mode 100644 index f2a8d9ca7..000000000 --- a/example/src/docs/mobile/dialog-box/show-header.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Dialogbox 对话框 - - -
- -### 不显示标题 - - - -
diff --git a/example/src/docs/mobile/dialog-box/slot-footer.md b/example/src/docs/mobile/dialog-box/slot-footer.md deleted file mode 100644 index a8905aadd..000000000 --- a/example/src/docs/mobile/dialog-box/slot-footer.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Dialogbox 对话框 - - -
- -### 自定义底部 - - - -
diff --git a/example/src/docs/mobile/dialog-box/slot-title.md b/example/src/docs/mobile/dialog-box/slot-title.md deleted file mode 100644 index 1ee42b81a..000000000 --- a/example/src/docs/mobile/dialog-box/slot-title.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Dialogbox 对话框 - - -
- -### 自定义标题 - - - -
diff --git a/example/src/docs/mobile/dialog-box/with-input.md b/example/src/docs/mobile/dialog-box/with-input.md deleted file mode 100644 index 269edc405..000000000 --- a/example/src/docs/mobile/dialog-box/with-input.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Dialogbox 对话框 - - -
- -### 输入类提示框 - - - -
diff --git a/example/src/docs/mobile/dropdown-menu/activeColor.md b/example/src/docs/mobile/dropdown-menu/activeColor.md deleted file mode 100644 index c09e9180f..000000000 --- a/example/src/docs/mobile/dropdown-menu/activeColor.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## DropdownMenu 下拉筛选排序 - - -
- -### 设置选中项颜色 - -`示例样式与组件无关,拷贝 Demo 时无需拷贝样式` - - - -
diff --git a/example/src/docs/mobile/dropdown-menu/closeOnClickOutside.md b/example/src/docs/mobile/dropdown-menu/closeOnClickOutside.md deleted file mode 100644 index 07f06d715..000000000 --- a/example/src/docs/mobile/dropdown-menu/closeOnClickOutside.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## DropdownMenu 下拉筛选排序 - - -
- -### 点击外部元素关闭弹出菜单 - -`示例样式与组件无关,拷贝 Demo 时无需拷贝样式` - - - -
diff --git a/example/src/docs/mobile/dropdown-menu/closeOnClickOverlay.md b/example/src/docs/mobile/dropdown-menu/closeOnClickOverlay.md deleted file mode 100644 index a4413a27d..000000000 --- a/example/src/docs/mobile/dropdown-menu/closeOnClickOverlay.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## DropdownMenu 下拉筛选排序 - - -
- -### 点击遮罩层关闭弹出菜单 - -`示例样式与组件无关,拷贝 Demo 时无需拷贝样式` - - - -
diff --git a/example/src/docs/mobile/dropdown-menu/direction.md b/example/src/docs/mobile/dropdown-menu/direction.md deleted file mode 100644 index 295f0e9b9..000000000 --- a/example/src/docs/mobile/dropdown-menu/direction.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## DropdownMenu 下拉筛选排序 - - -
- -### 弹出菜单位置 - -`示例样式与组件无关,拷贝 Demo 时无需拷贝样式` - - - -
diff --git a/example/src/docs/mobile/dropdown-menu/dropdown-filter.md b/example/src/docs/mobile/dropdown-menu/dropdown-filter.md deleted file mode 100644 index d094125ed..000000000 --- a/example/src/docs/mobile/dropdown-menu/dropdown-filter.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## DropdownMenu 下拉筛选排序 - - -
- -### 下拉筛选 - -`示例样式与组件无关,拷贝 Demo 时无需拷贝样式` - - - -
diff --git a/example/src/docs/mobile/dropdown-menu/duration.md b/example/src/docs/mobile/dropdown-menu/duration.md deleted file mode 100644 index 6bd4e3261..000000000 --- a/example/src/docs/mobile/dropdown-menu/duration.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## DropdownMenu 下拉筛选排序 - - -
- -### 弹出菜单动画时长 - -`示例样式与组件无关,拷贝 Demo 时无需拷贝样式` - - - -
diff --git a/example/src/docs/mobile/dropdown-menu/event.md b/example/src/docs/mobile/dropdown-menu/event.md deleted file mode 100644 index 1a016fa81..000000000 --- a/example/src/docs/mobile/dropdown-menu/event.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## DropdownMenu 下拉筛选排序 - - -
- -### 事件 - -`示例样式与组件无关,拷贝 Demo 时无需拷贝样式` - - - -
diff --git a/example/src/docs/mobile/dropdown-menu/icon.md b/example/src/docs/mobile/dropdown-menu/icon.md deleted file mode 100644 index 1ade89f04..000000000 --- a/example/src/docs/mobile/dropdown-menu/icon.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## DropdownMenu 下拉筛选排序 - - -
- -### 自定义 icon - -`示例样式与组件无关,拷贝 Demo 时无需拷贝样式` - - - -
diff --git a/example/src/docs/mobile/dropdown-menu/item-disabled.md b/example/src/docs/mobile/dropdown-menu/item-disabled.md deleted file mode 100644 index d96c27d6d..000000000 --- a/example/src/docs/mobile/dropdown-menu/item-disabled.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## DropdownMenu 下拉筛选排序 - - - -
- -### 是否禁用 - -通过 `disabled` 属性设置是否禁用,默认为 false 。 - - - -
diff --git a/example/src/docs/mobile/dropdown-menu/overlay.md b/example/src/docs/mobile/dropdown-menu/overlay.md deleted file mode 100644 index 49859262a..000000000 --- a/example/src/docs/mobile/dropdown-menu/overlay.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## DropdownMenu 下拉筛选排序 - - -
- -### 遮罩层 - -`示例样式与组件无关,拷贝 Demo 时无需拷贝样式` - - - -
diff --git a/example/src/docs/mobile/dropdown-menu/screen-funnel.md b/example/src/docs/mobile/dropdown-menu/screen-funnel.md deleted file mode 100644 index 3e77412b4..000000000 --- a/example/src/docs/mobile/dropdown-menu/screen-funnel.md +++ /dev/null @@ -1,26 +0,0 @@ -
-

- -

- -## DropdownMenu 下拉筛选排序 - - - -
- -### 筛选漏斗 - -`示例样式与组件无关,拷贝 Demo 时无需拷贝样式` - - - -
- -### 标题类名 - -通过 `title-class` 属性设置标题类名 - - - -
diff --git a/example/src/docs/mobile/dropdown-menu/slot.md b/example/src/docs/mobile/dropdown-menu/slot.md deleted file mode 100644 index bc16cca1c..000000000 --- a/example/src/docs/mobile/dropdown-menu/slot.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## DropdownMenu 下拉筛选排序 - - -
- -### 插槽 - -`示例样式与组件无关,拷贝 Demo 时无需拷贝样式` - - - -
diff --git a/example/src/docs/mobile/dropdown-menu/type.md b/example/src/docs/mobile/dropdown-menu/type.md deleted file mode 100644 index b6617ea0d..000000000 --- a/example/src/docs/mobile/dropdown-menu/type.md +++ /dev/null @@ -1,26 +0,0 @@ -
-

- -

- -## DropdownMenu 下拉筛选排序 - - - -
- -### 筛选类型 - -`示例样式与组件无关,拷贝 Demo 时无需拷贝样式` - - - -
- -### 弹出框层级 - -通过 `z-index` 属性设置设置弹出框的在 Index。 - - - -
diff --git a/example/src/docs/mobile/exception/buttonText.md b/example/src/docs/mobile/exception/buttonText.md deleted file mode 100644 index a2f57e748..000000000 --- a/example/src/docs/mobile/exception/buttonText.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Exception 缺省页 - - -
- -### 自定义按钮文本 - -`示例样式与组件无关,拷贝 Demo 时无需拷贝样式` - - - -
diff --git a/example/src/docs/mobile/exception/exceptionClass.md b/example/src/docs/mobile/exception/exceptionClass.md deleted file mode 100644 index 9e2be8896..000000000 --- a/example/src/docs/mobile/exception/exceptionClass.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Exception 缺省页 - - -
- -### 自定义类名 - -`示例样式与组件无关,拷贝 Demo 时无需拷贝样式` - - - -
diff --git a/example/src/docs/mobile/exception/message.md b/example/src/docs/mobile/exception/message.md deleted file mode 100644 index 2443be465..000000000 --- a/example/src/docs/mobile/exception/message.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Exception 缺省页 - - -
- -### 设置文本内容 - -`示例样式与组件无关,拷贝 Demo 时无需拷贝样式` - - - -
diff --git a/example/src/docs/mobile/exception/subMessage.md b/example/src/docs/mobile/exception/subMessage.md deleted file mode 100644 index f4c365c07..000000000 --- a/example/src/docs/mobile/exception/subMessage.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Exception 缺省页 - - -
- -### 设置副文本内容 - -`示例样式与组件无关,拷贝 Demo 时无需拷贝样式` - - - -
diff --git a/example/src/docs/mobile/exception/type.md b/example/src/docs/mobile/exception/type.md deleted file mode 100644 index 59cec74cc..000000000 --- a/example/src/docs/mobile/exception/type.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Exception 缺省页 - - -
- -### 缺省页类型 - -`示例样式与组件无关,拷贝 Demo 时无需拷贝样式` - - - -
diff --git a/example/src/docs/mobile/file-upload/abort-quest.md b/example/src/docs/mobile/file-upload/abort-quest.md deleted file mode 100644 index 42c3b6d3d..000000000 --- a/example/src/docs/mobile/file-upload/abort-quest.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - -
- -可以设定文件的类型与上传的个数等。可自定义上传服务。 - -### 手动取消上传请求 - -调用组件abort方法,取消上传请求 - diff --git a/example/src/docs/mobile/file-upload/accept-file-type.md b/example/src/docs/mobile/file-upload/accept-file-type.md deleted file mode 100644 index ab6677da7..000000000 --- a/example/src/docs/mobile/file-upload/accept-file-type.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 可上传的文件类型 - -通过配置 accept(image) 来限制上传文件的格式为 image - - - -通过配置 accept(.doc,.docx) 来限制上传文件的格式为 .doc .docx - -
diff --git a/example/src/docs/mobile/file-upload/basic-usage.md b/example/src/docs/mobile/file-upload/basic-usage.md deleted file mode 100644 index 66079870d..000000000 --- a/example/src/docs/mobile/file-upload/basic-usage.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 基本用法 - -属性 action(type:String) 上传服务器地址。 - - -
- - diff --git a/example/src/docs/mobile/file-upload/clear-files.md b/example/src/docs/mobile/file-upload/clear-files.md deleted file mode 100644 index 02ef85517..000000000 --- a/example/src/docs/mobile/file-upload/clear-files.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 手动清空已上传文件列表 - -调用组件clearFiles方法,清空已上传的文件列表(该方法不支持在 before-upload 中调用) - diff --git a/example/src/docs/mobile/file-upload/custom-prefix.md b/example/src/docs/mobile/file-upload/custom-prefix.md deleted file mode 100644 index 7230acd0a..000000000 --- a/example/src/docs/mobile/file-upload/custom-prefix.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 钩子函数 - -`before-remove` 删除文件之前的钩子,参数为上传的文件和文件列表,若返回 false 或者返回 Promise 且被 reject,则停止删除。`before-upload` 上传文件之前的钩子,参数为上传的文件,若返回 false 或者返回 Promise 且被 reject,则停止上传。 - - - -
diff --git a/example/src/docs/mobile/file-upload/custom-trigger.md b/example/src/docs/mobile/file-upload/custom-trigger.md deleted file mode 100644 index 0f72ead36..000000000 --- a/example/src/docs/mobile/file-upload/custom-trigger.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 自定义触发文件选项框 - -可在组件中写一个名为trigger的插槽,来触发弹出文件选项框 - diff --git a/example/src/docs/mobile/file-upload/custom-upload-request.md b/example/src/docs/mobile/file-upload/custom-upload-request.md deleted file mode 100644 index ac9399ffd..000000000 --- a/example/src/docs/mobile/file-upload/custom-upload-request.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 自定义上传请求 - -通过配置 headers ,设置自定义上传请求头信息 - - - -
diff --git a/example/src/docs/mobile/file-upload/custom-upload-tip.md b/example/src/docs/mobile/file-upload/custom-upload-tip.md deleted file mode 100644 index a435990d6..000000000 --- a/example/src/docs/mobile/file-upload/custom-upload-tip.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 自定义上传提示 - -可通过 tip 插槽来自定义上传提示 - - diff --git a/example/src/docs/mobile/file-upload/data.md b/example/src/docs/mobile/file-upload/data.md deleted file mode 100644 index b5b20586f..000000000 --- a/example/src/docs/mobile/file-upload/data.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 - -
- -### 额外参数 - -通过 `data` 属性可以上传时附带的额外参数。 - -通过 `file-title` 属性可以设置头部标题,该属性默认为‘附件’。 - - diff --git a/example/src/docs/mobile/file-upload/drag-select-file.md b/example/src/docs/mobile/file-upload/drag-select-file.md deleted file mode 100644 index 29fc566de..000000000 --- a/example/src/docs/mobile/file-upload/drag-select-file.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 拖拽上传 - -可配置drag(type:boolean),来控制组件是否可以拖拽文件 - - -
diff --git a/example/src/docs/mobile/file-upload/drag-upload.md b/example/src/docs/mobile/file-upload/drag-upload.md deleted file mode 100644 index 50497deef..000000000 --- a/example/src/docs/mobile/file-upload/drag-upload.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 拖拽上传 - -可配置 `drag(type:boolean)`,来控制组件是否可以拖拽文件上传,如果配置了 `accept` 属性,可通过 `@drop-error` 事件获取不合规的拖拽文件。 - - -
diff --git a/example/src/docs/mobile/file-upload/dynamic-disable.md b/example/src/docs/mobile/file-upload/dynamic-disable.md deleted file mode 100644 index 950b96999..000000000 --- a/example/src/docs/mobile/file-upload/dynamic-disable.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 禁用 - -可配置disabled(type:boolean),来控制组件是否禁用 - - -
diff --git a/example/src/docs/mobile/file-upload/file-picture-card.md b/example/src/docs/mobile/file-upload/file-picture-card.md deleted file mode 100644 index 4c323ebfb..000000000 --- a/example/src/docs/mobile/file-upload/file-picture-card.md +++ /dev/null @@ -1,18 +0,0 @@ - -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 文件缩略图 - - - -
diff --git a/example/src/docs/mobile/file-upload/fileupload.md b/example/src/docs/mobile/file-upload/fileupload.md deleted file mode 100644 index 314b09c8e..000000000 --- a/example/src/docs/mobile/file-upload/fileupload.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## FileUpload 提示 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/file-upload/image-size.md b/example/src/docs/mobile/file-upload/image-size.md deleted file mode 100644 index 53309a566..000000000 --- a/example/src/docs/mobile/file-upload/image-size.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### mini 模式 - -
- -获取上传的片的原始尺寸 - - - -
diff --git a/example/src/docs/mobile/file-upload/manual-upload.md b/example/src/docs/mobile/file-upload/manual-upload.md deleted file mode 100644 index 300091b58..000000000 --- a/example/src/docs/mobile/file-upload/manual-upload.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 手动上传 - -通过 action 配置上传地址,通过 submit 设置手动上传 - - - -
diff --git a/example/src/docs/mobile/file-upload/max-file-count.md b/example/src/docs/mobile/file-upload/max-file-count.md deleted file mode 100644 index f387c9c3a..000000000 --- a/example/src/docs/mobile/file-upload/max-file-count.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 最大上传文件数 - -
- -可通过配置limit(type:Number,大于0的整数)来限制上传文件的个数 - - -
diff --git a/example/src/docs/mobile/file-upload/mini-mode.md b/example/src/docs/mobile/file-upload/mini-mode.md deleted file mode 100644 index 9405b25c1..000000000 --- a/example/src/docs/mobile/file-upload/mini-mode.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### mini 模式 - -
- -可通过配置 mini-mode,设置显示 mini 模式 - - - -
diff --git a/example/src/docs/mobile/file-upload/multiple-file.md b/example/src/docs/mobile/file-upload/multiple-file.md deleted file mode 100644 index 99bd0f4fe..000000000 --- a/example/src/docs/mobile/file-upload/multiple-file.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 文件多选 - -文件选择默认单选 -可配置multiple = 'true' 实现文件多选 - - -
diff --git a/example/src/docs/mobile/file-upload/only-exist-mobile.md b/example/src/docs/mobile/file-upload/only-exist-mobile.md deleted file mode 100644 index 01d043221..000000000 --- a/example/src/docs/mobile/file-upload/only-exist-mobile.md +++ /dev/null @@ -1,29 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 配置文件上传显示的图标路径 - - - -
- -### 设置头部标题 - - - -
- -### 是否显示头部 - - - -
diff --git a/example/src/docs/mobile/file-upload/picture-card.md b/example/src/docs/mobile/file-upload/picture-card.md deleted file mode 100644 index 1f12b69ad..000000000 --- a/example/src/docs/mobile/file-upload/picture-card.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 照片墙 - -可配置list-type = 'picture-card'开启照片墙模式 - - -
diff --git a/example/src/docs/mobile/file-upload/picture-list.md b/example/src/docs/mobile/file-upload/picture-list.md deleted file mode 100644 index 8d037c9ca..000000000 --- a/example/src/docs/mobile/file-upload/picture-list.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 图片列表缩略图 - -
- -可通过配置list-type="picture",来实现图片列表缩略图显示 - - -
diff --git a/example/src/docs/mobile/file-upload/prevent-delete-file.md b/example/src/docs/mobile/file-upload/prevent-delete-file.md deleted file mode 100644 index 55a8bbbd6..000000000 --- a/example/src/docs/mobile/file-upload/prevent-delete-file.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 阻止删除文件 - -:before-remove(移除文件前回调事件),方法里面return true/false,表示是否可以删除 - - -
diff --git a/example/src/docs/mobile/file-upload/prevent-upload-file.md b/example/src/docs/mobile/file-upload/prevent-upload-file.md deleted file mode 100644 index cbd12dc6b..000000000 --- a/example/src/docs/mobile/file-upload/prevent-upload-file.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 阻止上传文件 - -before-upload(上传前回调事件),方法里面 return true/false,表示是否可以进行上传文件 - - - -
diff --git a/example/src/docs/mobile/file-upload/size.md b/example/src/docs/mobile/file-upload/size.md deleted file mode 100644 index 43195f4c7..000000000 --- a/example/src/docs/mobile/file-upload/size.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 设置组件大小 - -可选值为`medium`,`small`,`mini` - - - -
diff --git a/example/src/docs/mobile/file-upload/upload-events.md b/example/src/docs/mobile/file-upload/upload-events.md deleted file mode 100644 index 2d480b5b6..000000000 --- a/example/src/docs/mobile/file-upload/upload-events.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 事件 - -`preview` 点击文件列表中已上传的文件时触发的事件。 -`remove` 文件列表移除文件时触发的事件。 -`error` 文件上传失败时触发的事件。 -`exceed` 文件超出个数限制时触发的事件。 -`progress` 文件上传时触发的事件。 -`change` 文件状态改变时触发的事件,添加文件、上传成功和上传失败时都会被触发。 -`success` 文件上传成功时触发的事件。 - - - -
diff --git a/example/src/docs/mobile/file-upload/upload-file-filters.md b/example/src/docs/mobile/file-upload/upload-file-filters.md deleted file mode 100644 index f3eff37ef..000000000 --- a/example/src/docs/mobile/file-upload/upload-file-filters.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 基本用法 - - - -
diff --git a/example/src/docs/mobile/file-upload/upload-file-list.md b/example/src/docs/mobile/file-upload/upload-file-list.md deleted file mode 100644 index c20f4ebfb..000000000 --- a/example/src/docs/mobile/file-upload/upload-file-list.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 上传的文件列表 - -可配置:file-list(type:Object)来显示已上传的文件名和地址 - - - -
diff --git a/example/src/docs/mobile/file-upload/upload-limit.md b/example/src/docs/mobile/file-upload/upload-limit.md deleted file mode 100644 index 919559654..000000000 --- a/example/src/docs/mobile/file-upload/upload-limit.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 最大上传限制 - -可配置:before-upload(上传前事件回调),对文件类型和大小做限制 - - -
diff --git a/example/src/docs/mobile/file-upload/upload-request.md b/example/src/docs/mobile/file-upload/upload-request.md deleted file mode 100644 index 52bc95d17..000000000 --- a/example/src/docs/mobile/file-upload/upload-request.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 上传请求 - -可通过配置 action 为上传地址,可通过配置 headers 为头部请求信息 - - - -
- -### 覆盖默认请求 - -通过配置 http-request ,覆盖默认的上传行为,可以自定义上传的实现 - - - -
diff --git a/example/src/docs/mobile/file-upload/upload-user-head.md b/example/src/docs/mobile/file-upload/upload-user-head.md deleted file mode 100644 index 8463eac21..000000000 --- a/example/src/docs/mobile/file-upload/upload-user-head.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 用户头像上传 - - diff --git a/example/src/docs/mobile/file-upload/with-credentials.md b/example/src/docs/mobile/file-upload/with-credentials.md deleted file mode 100644 index 2afc3ce2e..000000000 --- a/example/src/docs/mobile/file-upload/with-credentials.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 支持发送 cookie 凭证信息 - -可通过配置:with-credentials = 'true' 开启访问服务器携带 cookie,默认为 false 。 - - - -
diff --git a/example/src/docs/mobile/form/base.md b/example/src/docs/mobile/form/base.md deleted file mode 100644 index 99e808262..000000000 --- a/example/src/docs/mobile/form/base.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## Form 表单 - - -
- -### 基本功能 - - - -
- diff --git a/example/src/docs/mobile/form/form-select.md b/example/src/docs/mobile/form/form-select.md deleted file mode 100644 index 58b9253bd..000000000 --- a/example/src/docs/mobile/form/form-select.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Form 表单 - - -
- -### 表单(纯展示) - - - -
diff --git a/example/src/docs/mobile/form/form-tabselect.md b/example/src/docs/mobile/form/form-tabselect.md deleted file mode 100644 index 513237163..000000000 --- a/example/src/docs/mobile/form/form-tabselect.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Form 表单 - - -
- -### 表单(纯展示) - - - -
diff --git a/example/src/docs/mobile/form/form-writeone.md b/example/src/docs/mobile/form/form-writeone.md deleted file mode 100644 index 0bf7ae874..000000000 --- a/example/src/docs/mobile/form/form-writeone.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Form 表单 - - -
- -### 表单(纯展示) - - - -
diff --git a/example/src/docs/mobile/form/form-writetwo.md b/example/src/docs/mobile/form/form-writetwo.md deleted file mode 100644 index c7cdce870..000000000 --- a/example/src/docs/mobile/form/form-writetwo.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Form 表单 - - -
- -### 表单(纯展示) - - - -
diff --git a/example/src/docs/mobile/form/hide-required-asterisk.md b/example/src/docs/mobile/form/hide-required-asterisk.md deleted file mode 100644 index 6b6f13757..000000000 --- a/example/src/docs/mobile/form/hide-required-asterisk.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## Form 表单 - - - -
- -### 是否显示红色星号 - - - -
diff --git a/example/src/docs/mobile/form/label-width.md b/example/src/docs/mobile/form/label-width.md deleted file mode 100644 index 7e1ed565f..000000000 --- a/example/src/docs/mobile/form/label-width.md +++ /dev/null @@ -1,22 +0,0 @@ -
-

- -

- -## Form 表单 - - -
- -### 自定义标签的宽度 - - - -
- -### 自定义标签后缀 - -通过 `label-suffix` 自定义标签后缀 - - -
diff --git a/example/src/docs/mobile/form/only-read.md b/example/src/docs/mobile/form/only-read.md deleted file mode 100644 index d9f274cdd..000000000 --- a/example/src/docs/mobile/form/only-read.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Form 表单 - - -
- -### 表单(纯展示) - - - -
diff --git a/example/src/docs/mobile/form/validate-position.md b/example/src/docs/mobile/form/validate-position.md deleted file mode 100644 index 8a579083f..000000000 --- a/example/src/docs/mobile/form/validate-position.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Form 表单 - - -
- -### 校验提示信息的位置 - -`validate-position`默认值为`right` - - - -
diff --git a/example/src/docs/mobile/form/validate.md b/example/src/docs/mobile/form/validate.md deleted file mode 100644 index 7c50a3b8b..000000000 --- a/example/src/docs/mobile/form/validate.md +++ /dev/null @@ -1,14 +0,0 @@ -
-

- -

- -## Form 表单 - - -
- -### 表单校验 - - - diff --git a/example/src/docs/mobile/icon/icon-set.md b/example/src/docs/mobile/icon/icon-set.md deleted file mode 100644 index 0d366d98c..000000000 --- a/example/src/docs/mobile/icon/icon-set.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Icon 图标 - - -
- -### 基本用法 - - - -
diff --git a/example/src/docs/mobile/image-viewer/events-change-close.md b/example/src/docs/mobile/image-viewer/events-change-close.md deleted file mode 100644 index 05ececcc3..000000000 --- a/example/src/docs/mobile/image-viewer/events-change-close.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## ImageViewer 图片预览 - - -
- -### 切换与关闭事件 - - - -
diff --git a/example/src/docs/mobile/image-viewer/image-full-current.md b/example/src/docs/mobile/image-viewer/image-full-current.md deleted file mode 100644 index 59fb6a442..000000000 --- a/example/src/docs/mobile/image-viewer/image-full-current.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## ImageViewer 图片预览 - - -
- -### 全屏显示 - - - -
diff --git a/example/src/docs/mobile/image-viewer/mobileimageviewer.md b/example/src/docs/mobile/image-viewer/mobileimageviewer.md deleted file mode 100644 index 2834c1fa6..000000000 --- a/example/src/docs/mobile/image-viewer/mobileimageviewer.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## ImageViewer 图片预览 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/image-viewer/slot-index.md b/example/src/docs/mobile/image-viewer/slot-index.md deleted file mode 100644 index f41669945..000000000 --- a/example/src/docs/mobile/image-viewer/slot-index.md +++ /dev/null @@ -1,22 +0,0 @@ -
-

- -

- -## ImageViewer 图片预览 - - - -
- -### 自定义下标 - - - -
- -### 自定义 z-index - - - -
diff --git a/example/src/docs/mobile/image-viewer/start-position.md b/example/src/docs/mobile/image-viewer/start-position.md deleted file mode 100644 index 961dc5e27..000000000 --- a/example/src/docs/mobile/image-viewer/start-position.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## ImageViewer 图片预览 - - -
- -### 初始起始位置 - - - -
diff --git a/example/src/docs/mobile/input/autofocus.md b/example/src/docs/mobile/input/autofocus.md deleted file mode 100644 index 23bb9148d..000000000 --- a/example/src/docs/mobile/input/autofocus.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -
- -### 自动获取焦点 - - - -
diff --git a/example/src/docs/mobile/input/autosize.md b/example/src/docs/mobile/input/autosize.md deleted file mode 100644 index 537a3c77a..000000000 --- a/example/src/docs/mobile/input/autosize.md +++ /dev/null @@ -1,24 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -
- -### 自适应内容高度 - - - -
- -### 自定义标题 - -通过 `textarea-title` 属性设置 textarea 类型自定义标题,该属性默认为‘标题’。 - - - -
diff --git a/example/src/docs/mobile/input/blur-focus.md b/example/src/docs/mobile/input/blur-focus.md deleted file mode 100644 index 001ffc6b9..000000000 --- a/example/src/docs/mobile/input/blur-focus.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -
- -### 获取/失去焦点 - - - -
diff --git a/example/src/docs/mobile/input/clearable.md b/example/src/docs/mobile/input/clearable.md deleted file mode 100644 index 44fddaa6b..000000000 --- a/example/src/docs/mobile/input/clearable.md +++ /dev/null @@ -1,38 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -
- -### 可清空 - - - -
- -### form - - - -
- -### 输入框可下拉选择 - -通过 `is-select` 属性可以设置输入框可下拉选择,type 为 form 时。 - - - -
- -### 输入框下拉选择项 - -通过 `select-menu` 属性可以设置输入框可下拉选择,设置选择项,type 为 form 时。 - - - -
diff --git a/example/src/docs/mobile/input/counter.md b/example/src/docs/mobile/input/counter.md deleted file mode 100644 index 9fb004314..000000000 --- a/example/src/docs/mobile/input/counter.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Input 输入框 - - -
- -### 计数与输入统计 - - - -
diff --git a/example/src/docs/mobile/input/events.md b/example/src/docs/mobile/input/events.md deleted file mode 100644 index ac4cc722c..000000000 --- a/example/src/docs/mobile/input/events.md +++ /dev/null @@ -1,22 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -
- -### 事件 - - - -
- -### blur / focus / input 事件 - - - -
diff --git a/example/src/docs/mobile/input/max-min-length.md b/example/src/docs/mobile/input/max-min-length.md deleted file mode 100644 index 71b60c560..000000000 --- a/example/src/docs/mobile/input/max-min-length.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Input 输入框 - - -
- -### 输入长度限制 - - - -
diff --git a/example/src/docs/mobile/input/method-select.md b/example/src/docs/mobile/input/method-select.md deleted file mode 100644 index 9b9e2eb15..000000000 --- a/example/src/docs/mobile/input/method-select.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Input 输入框 - - -
- -### 选中输入框文本 - - - -
diff --git a/example/src/docs/mobile/input/mobileinput.md b/example/src/docs/mobile/input/mobileinput.md deleted file mode 100644 index ff5d3410c..000000000 --- a/example/src/docs/mobile/input/mobileinput.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Input 输入框 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/input/props.md b/example/src/docs/mobile/input/props.md deleted file mode 100644 index deac3d36a..000000000 --- a/example/src/docs/mobile/input/props.md +++ /dev/null @@ -1,36 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -
- -### 原生属性 - - - -
- -### 步长 - -通过 `step` 设置步长,需要结合 type="number" 一起使用 - - - -
- -### 是否只读 - - - -
- -### 宽度和高度 - - - -
diff --git a/example/src/docs/mobile/input/show-password.md b/example/src/docs/mobile/input/show-password.md deleted file mode 100644 index 6871d6380..000000000 --- a/example/src/docs/mobile/input/show-password.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Input 输入框 - - -
- -### 密码框 - - - -
diff --git a/example/src/docs/mobile/input/slot-content.md b/example/src/docs/mobile/input/slot-content.md deleted file mode 100644 index 3f990ce45..000000000 --- a/example/src/docs/mobile/input/slot-content.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Input 输入框 - - -
- -### 插槽 - -通过 `content` 自定义头部内容,只对 type=‘textarea‘有效 - - - -
diff --git a/example/src/docs/mobile/input/slots-append-prepend.md b/example/src/docs/mobile/input/slots-append-prepend.md deleted file mode 100644 index 017d1ff0f..000000000 --- a/example/src/docs/mobile/input/slots-append-prepend.md +++ /dev/null @@ -1,22 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -
- -### 复合型输入框 - - - -
- -### 复合型输入框 - - - -
diff --git a/example/src/docs/mobile/input/suffix-icon.md b/example/src/docs/mobile/input/suffix-icon.md deleted file mode 100644 index 2233e559a..000000000 --- a/example/src/docs/mobile/input/suffix-icon.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Input 输入框 - - -
- -### 自定义后置图标 - - - -
diff --git a/example/src/docs/mobile/input/type-be-form-tips.md b/example/src/docs/mobile/input/type-be-form-tips.md deleted file mode 100644 index 8ad8e55a2..000000000 --- a/example/src/docs/mobile/input/type-be-form-tips.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Input 输入框 - - -
- -### 类型type为form时的输入框下的提示 - - - -
diff --git a/example/src/docs/mobile/input/type-be-form.md b/example/src/docs/mobile/input/type-be-form.md deleted file mode 100644 index 64e346f9d..000000000 --- a/example/src/docs/mobile/input/type-be-form.md +++ /dev/null @@ -1,22 +0,0 @@ -
-

- -

- -## Input 输入框 - - -
- -### 类型 type 为 form 时的基本用法 - - - -
- -### 类型 type 为 form 时的下拉用法 - -`is-select`与`select-menu`搭配让 `type`为`form`的输入框变为下拉 - - -
diff --git a/example/src/docs/mobile/input/validate-event.md b/example/src/docs/mobile/input/validate-event.md deleted file mode 100644 index 8ddad3f9c..000000000 --- a/example/src/docs/mobile/input/validate-event.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -
- -### 表单校正 - -通过 `validate-event` 属性设置输入时是否触发表单的校验,该属性默认为 true。 - - - -
diff --git a/example/src/docs/mobile/list/doublelist.md b/example/src/docs/mobile/list/doublelist.md deleted file mode 100644 index 58a2a6b01..000000000 --- a/example/src/docs/mobile/list/doublelist.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## List 列表 - - -
- -### 双行列表 - - - -
diff --git a/example/src/docs/mobile/list/imformationlist.md b/example/src/docs/mobile/list/imformationlist.md deleted file mode 100644 index dae2c181b..000000000 --- a/example/src/docs/mobile/list/imformationlist.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## List 列表 - - -
- -### 资讯类列表 - - - -
diff --git a/example/src/docs/mobile/list/mobilelist.md b/example/src/docs/mobile/list/mobilelist.md deleted file mode 100644 index 73d82e7d9..000000000 --- a/example/src/docs/mobile/list/mobilelist.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## List 列表 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/list/single-line.md b/example/src/docs/mobile/list/single-line.md deleted file mode 100644 index 643a7ad60..000000000 --- a/example/src/docs/mobile/list/single-line.md +++ /dev/null @@ -1,16 +0,0 @@ - -
-

- -

- -## List 列表 - - -
- -### 单行 - - - -
diff --git a/example/src/docs/mobile/list/slots.md b/example/src/docs/mobile/list/slots.md deleted file mode 100644 index e94e73ce8..000000000 --- a/example/src/docs/mobile/list/slots.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## List 列表 - - -
- -### 自定义列表内容 - - - -
diff --git a/example/src/docs/mobile/loading/mobileloading.md b/example/src/docs/mobile/loading/mobileloading.md deleted file mode 100644 index 7e66c6f1b..000000000 --- a/example/src/docs/mobile/loading/mobileloading.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Loading 加载 - - - -加载数据时显示的动画效果。 - -
-
- -### 基本用法 - -通过静态方法 `Loading.service` 在指定 `target` 上设置加载。 - - - -
- - diff --git a/example/src/docs/mobile/loading/type.md b/example/src/docs/mobile/loading/type.md deleted file mode 100644 index 660ddae83..000000000 --- a/example/src/docs/mobile/loading/type.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Loading 加载 - - - -加载数据时显示的动画效果。 - -
-
- -### 设置加载类型 - -通过 `type` 指定不同的加载类型。可选值:primary、simple,默认值:primary - - - -
diff --git a/example/src/docs/mobile/mini-picker/cancel-button-text.md b/example/src/docs/mobile/mini-picker/cancel-button-text.md deleted file mode 100644 index 32372ec61..000000000 --- a/example/src/docs/mobile/mini-picker/cancel-button-text.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## MiniPicker 选择器组件 - - - -
- -### 取消按钮内容 - - - -
diff --git a/example/src/docs/mobile/mini-picker/cancel.md b/example/src/docs/mobile/mini-picker/cancel.md deleted file mode 100644 index 597ae736e..000000000 --- a/example/src/docs/mobile/mini-picker/cancel.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## MiniPicker 选择器组件 - - - -
- -### 事件 - -`MiniPicker` 选择器的事件 `cancel` 。 - - - -
diff --git a/example/src/docs/mobile/mini-picker/cascad.md b/example/src/docs/mobile/mini-picker/cascad.md deleted file mode 100644 index e3ab1c12c..000000000 --- a/example/src/docs/mobile/mini-picker/cascad.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## MiniPicker 选择器组件 - - -
- -### 级联选择 - - - -
diff --git a/example/src/docs/mobile/mini-picker/change.md b/example/src/docs/mobile/mini-picker/change.md deleted file mode 100644 index e1f2e54d8..000000000 --- a/example/src/docs/mobile/mini-picker/change.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## MiniPicker 选择器组件示 - - -
- -### change 事件 - - - -
diff --git a/example/src/docs/mobile/mini-picker/defaultindex.md b/example/src/docs/mobile/mini-picker/defaultindex.md deleted file mode 100644 index 4f5b4844b..000000000 --- a/example/src/docs/mobile/mini-picker/defaultindex.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## MiniPicker 选择器组件 - - -
- -### 初始值索引 - - - -
diff --git a/example/src/docs/mobile/mini-picker/itemheight.md b/example/src/docs/mobile/mini-picker/itemheight.md deleted file mode 100644 index c1265dc92..000000000 --- a/example/src/docs/mobile/mini-picker/itemheight.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## MiniPicker 选择器组件 - - -
- -### 选项高度 - - - -
diff --git a/example/src/docs/mobile/mini-picker/methods.md b/example/src/docs/mobile/mini-picker/methods.md deleted file mode 100644 index f1e9718a8..000000000 --- a/example/src/docs/mobile/mini-picker/methods.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## MiniPicker 选择器组件 - - - -
- -### 获取所有选中列的值与对应索引 - - - -
- -### 方法 - -`MiniPicker` 的 `getColumnIndex` 获取对应列选中项的索引。 - -`getColumnValue` 获取对应列选中的值。 - -`getColumnValues` 获取对应列中所有选项 - - - -
diff --git a/example/src/docs/mobile/mini-picker/minipicker.md b/example/src/docs/mobile/mini-picker/minipicker.md deleted file mode 100644 index 8136611d7..000000000 --- a/example/src/docs/mobile/mini-picker/minipicker.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## MiniPicker 选择器组件 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/mini-picker/multicolumn.md b/example/src/docs/mobile/mini-picker/multicolumn.md deleted file mode 100644 index 36fefd0d6..000000000 --- a/example/src/docs/mobile/mini-picker/multicolumn.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## MiniPicker 选择器组件 - - -
- -### 多列选择 - - - -
diff --git a/example/src/docs/mobile/mini-picker/toolbar.md b/example/src/docs/mobile/mini-picker/toolbar.md deleted file mode 100644 index b55d4712b..000000000 --- a/example/src/docs/mobile/mini-picker/toolbar.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## MiniPicker 选择器组件 - - -
- -### toolbar 插槽 - - - -
diff --git a/example/src/docs/mobile/mini-picker/visibleitemcount.md b/example/src/docs/mobile/mini-picker/visibleitemcount.md deleted file mode 100644 index 14bfb042e..000000000 --- a/example/src/docs/mobile/mini-picker/visibleitemcount.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## MiniPicker 选择器组件 - - -
- -### 可见选项个数 - - - -
diff --git a/example/src/docs/mobile/mobileavatar.md b/example/src/docs/mobile/mobileavatar.md deleted file mode 100644 index af0d93f7e..000000000 --- a/example/src/docs/mobile/mobileavatar.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Avatar 头像 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/mobiledropdownmenu.md b/example/src/docs/mobile/mobiledropdownmenu.md deleted file mode 100644 index 74badeeb7..000000000 --- a/example/src/docs/mobile/mobiledropdownmenu.md +++ /dev/null @@ -1,22 +0,0 @@ -
-

- -

- -## DropdownMenu 下拉筛选排序 - - - -
- -### 基本用法 - - - -
- - - -### DropdownItem Props - - diff --git a/example/src/docs/mobile/mobileexception.md b/example/src/docs/mobile/mobileexception.md deleted file mode 100644 index 6f7d77ea9..000000000 --- a/example/src/docs/mobile/mobileexception.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Exception 缺省页 - - -
- -### 基本用法 - -`示例样式与组件无关,拷贝 Demo 时无需拷贝样式` - - - -
- - diff --git a/example/src/docs/mobile/mobileicon.md b/example/src/docs/mobile/mobileicon.md deleted file mode 100644 index 0b55f512e..000000000 --- a/example/src/docs/mobile/mobileicon.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Icon 图标 - - -
- -### 基本用法 - -`点击图标复制图标文本` - -### 图标合集 - - - -
- - diff --git a/example/src/docs/mobile/mobiletabs.md b/example/src/docs/mobile/mobiletabs.md deleted file mode 100644 index 128fbd82c..000000000 --- a/example/src/docs/mobile/mobiletabs.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Tabs 选项卡 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/mobiletimeline.md b/example/src/docs/mobile/mobiletimeline.md deleted file mode 100644 index 58d8ca89e..000000000 --- a/example/src/docs/mobile/mobiletimeline.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimeLine 时间轴 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/nav-bar/left-right-arrow.md b/example/src/docs/mobile/nav-bar/left-right-arrow.md deleted file mode 100644 index e9b66c4d1..000000000 --- a/example/src/docs/mobile/nav-bar/left-right-arrow.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## NavBar 导航栏 - - -
- -### 显示左右箭头 - - - -
diff --git a/example/src/docs/mobile/nav-bar/left-right-text.md b/example/src/docs/mobile/nav-bar/left-right-text.md deleted file mode 100644 index edf1ac62c..000000000 --- a/example/src/docs/mobile/nav-bar/left-right-text.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## NavBar 导航栏 - - -
- -### 指定左右文本 - - - -
diff --git a/example/src/docs/mobile/nav-bar/mobilenavbar.md b/example/src/docs/mobile/nav-bar/mobilenavbar.md deleted file mode 100644 index ec0f9d883..000000000 --- a/example/src/docs/mobile/nav-bar/mobilenavbar.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## NavBar 导航栏 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/nav-bar/slots.md b/example/src/docs/mobile/nav-bar/slots.md deleted file mode 100644 index ae5ff9b0e..000000000 --- a/example/src/docs/mobile/nav-bar/slots.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## NavBar 导航栏 - - -
- -### 自定义左右侧内容 - - - -
diff --git a/example/src/docs/mobile/nav-bar/z-index.md b/example/src/docs/mobile/nav-bar/z-index.md deleted file mode 100644 index 44a81277d..000000000 --- a/example/src/docs/mobile/nav-bar/z-index.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## NavBar 导航栏 - - - -
- -### 设置层级 - - - -
diff --git a/example/src/docs/mobile/numeric/automaticprice.md b/example/src/docs/mobile/numeric/automaticprice.md deleted file mode 100644 index 4ea606a97..000000000 --- a/example/src/docs/mobile/numeric/automaticprice.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - -
- -### 根据商品数量自动计算价格 - - - -
diff --git a/example/src/docs/mobile/numeric/circulate.md b/example/src/docs/mobile/numeric/circulate.md deleted file mode 100644 index 2ad397c82..000000000 --- a/example/src/docs/mobile/numeric/circulate.md +++ /dev/null @@ -1,22 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - - -
- -### 是否循环 - - - -
- -### 是否禁用 - - - -
diff --git a/example/src/docs/mobile/numeric/controls.md b/example/src/docs/mobile/numeric/controls.md deleted file mode 100644 index 306c13938..000000000 --- a/example/src/docs/mobile/numeric/controls.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - -
- -### 控制按钮 - - - -
diff --git a/example/src/docs/mobile/numeric/controlsposition.md b/example/src/docs/mobile/numeric/controlsposition.md deleted file mode 100644 index 3d5ce0a94..000000000 --- a/example/src/docs/mobile/numeric/controlsposition.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - -
- -### 控制按钮显示位置 - - - -
diff --git a/example/src/docs/mobile/numeric/event.md b/example/src/docs/mobile/numeric/event.md deleted file mode 100644 index 94417b0b9..000000000 --- a/example/src/docs/mobile/numeric/event.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - -
- -### 事件 - - - -
diff --git a/example/src/docs/mobile/numeric/max.md b/example/src/docs/mobile/numeric/max.md deleted file mode 100644 index 62b80b3c8..000000000 --- a/example/src/docs/mobile/numeric/max.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - -
- -### 最大值最小值 - - - -
diff --git a/example/src/docs/mobile/numeric/numeric.md b/example/src/docs/mobile/numeric/numeric.md deleted file mode 100644 index 737977c88..000000000 --- a/example/src/docs/mobile/numeric/numeric.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/numeric/precision.md b/example/src/docs/mobile/numeric/precision.md deleted file mode 100644 index 238311aec..000000000 --- a/example/src/docs/mobile/numeric/precision.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - -
- -### 数值精度 - - - -
diff --git a/example/src/docs/mobile/numeric/size.md b/example/src/docs/mobile/numeric/size.md deleted file mode 100644 index 4258fcd36..000000000 --- a/example/src/docs/mobile/numeric/size.md +++ /dev/null @@ -1,24 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - - -
- -### 尺寸 - - - -
- -### 占位文本 - -通过 `placeholder` 属性设置输入框占位文本。 - - - -
diff --git a/example/src/docs/mobile/numeric/step.md b/example/src/docs/mobile/numeric/step.md deleted file mode 100644 index ee985c886..000000000 --- a/example/src/docs/mobile/numeric/step.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - -
- -### 步长 - - - -
diff --git a/example/src/docs/mobile/popover/base.md b/example/src/docs/mobile/popover/base.md deleted file mode 100644 index b7f29d82c..000000000 --- a/example/src/docs/mobile/popover/base.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## 气泡 - - -
- -### 基本功能 - - - -
- diff --git a/example/src/docs/mobile/popover/direction.md b/example/src/docs/mobile/popover/direction.md deleted file mode 100644 index 426742580..000000000 --- a/example/src/docs/mobile/popover/direction.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## 气泡 - - -
- -### 基本功能 - - - -
diff --git a/example/src/docs/mobile/progress/basic-usage.md b/example/src/docs/mobile/progress/basic-usage.md deleted file mode 100644 index 5092361c7..000000000 --- a/example/src/docs/mobile/progress/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/progress/custom-color.md b/example/src/docs/mobile/progress/custom-color.md deleted file mode 100644 index 7685456de..000000000 --- a/example/src/docs/mobile/progress/custom-color.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 -
- -### 自定义颜色 - -通过 `color` 设置进度条颜色。color 进度条背景色(会覆盖 status 状态颜色) - - - -
diff --git a/example/src/docs/mobile/progress/dynamic-control-changes.md b/example/src/docs/mobile/progress/dynamic-control-changes.md deleted file mode 100644 index 25c8fba06..000000000 --- a/example/src/docs/mobile/progress/dynamic-control-changes.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 -
- -### 动态控制进度条变化 - -通过设置 `percentage` 动态控制进度条变化 - - - -
diff --git a/example/src/docs/mobile/progress/dynamic-progress.md b/example/src/docs/mobile/progress/dynamic-progress.md deleted file mode 100644 index cdd913711..000000000 --- a/example/src/docs/mobile/progress/dynamic-progress.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 -
- -### 动态进度条 - -通过动态改变`percentage`的值,使进度条动态变化 - - diff --git a/example/src/docs/mobile/progress/format-text.md b/example/src/docs/mobile/progress/format-text.md deleted file mode 100644 index 687fe9035..000000000 --- a/example/src/docs/mobile/progress/format-text.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 -
- -### 自定义显示文字 - -`text-inside` 进度条显示文字内置在进度条内(只在 type=line 时可用) - - - -
diff --git a/example/src/docs/mobile/progress/format.md b/example/src/docs/mobile/progress/format.md deleted file mode 100644 index e4e60c105..000000000 --- a/example/src/docs/mobile/progress/format.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 - -
- -### 自定义显示内容 - -通过 `format` 属性设置显示文字内置在进度条内时,用于自定义显示内容。 - - - -
diff --git a/example/src/docs/mobile/progress/progress-status.md b/example/src/docs/mobile/progress/progress-status.md deleted file mode 100644 index 9e49470d1..000000000 --- a/example/src/docs/mobile/progress/progress-status.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 -
- -### 状态 - -`status` 进度条当前状态(success/exception/warning) - - diff --git a/example/src/docs/mobile/progress/progress-type.md b/example/src/docs/mobile/progress/progress-type.md deleted file mode 100644 index 0ae6ee261..000000000 --- a/example/src/docs/mobile/progress/progress-type.md +++ /dev/null @@ -1,35 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 - -
- -取值 line:线性进度条。取值 circle:环形进度条,取值 dashboard:仪表盘形进度条 -
- -### line 类型 - -`type="line"` 显示为 line 类型 - - - -### circle 类型 - -`type="circle"` 显示为 circle 类型 - - - -### dashboard 类型 - -`type="dashboard"` 显示为 dashboard 类型 - - - -
diff --git a/example/src/docs/mobile/progress/progress-width.md b/example/src/docs/mobile/progress/progress-width.md deleted file mode 100644 index d7c735c6e..000000000 --- a/example/src/docs/mobile/progress/progress-width.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 -
- -### 宽度 - -`stroke-width`进度条的宽度,单位 px - - - -
diff --git a/example/src/docs/mobile/progress/text-inside-or-no-text.md b/example/src/docs/mobile/progress/text-inside-or-no-text.md deleted file mode 100644 index 4c0748ca5..000000000 --- a/example/src/docs/mobile/progress/text-inside-or-no-text.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 -
- -### 文字内显或不显 - -`show-text` 是否显示进度条文字内容 - - - -
diff --git a/example/src/docs/mobile/progress/width.md b/example/src/docs/mobile/progress/width.md deleted file mode 100644 index 65ebfa610..000000000 --- a/example/src/docs/mobile/progress/width.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 - -
- -### 环形进度条画布宽度 - -通过设置 `width` 属性设置环形进度条画布宽度(只在 type 为 circle 或 dashboard 时可用)。 - - - -
diff --git a/example/src/docs/mobile/radio/border.md b/example/src/docs/mobile/radio/border.md deleted file mode 100644 index be22de817..000000000 --- a/example/src/docs/mobile/radio/border.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Radio 单选 - - -
- -### 显示边框 - - - -
diff --git a/example/src/docs/mobile/radio/disabled.md b/example/src/docs/mobile/radio/disabled.md deleted file mode 100644 index 538636098..000000000 --- a/example/src/docs/mobile/radio/disabled.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## Radio 单选 - - - -
- -### 是否禁用 - - - -
diff --git a/example/src/docs/mobile/radio/event-change.md b/example/src/docs/mobile/radio/event-change.md deleted file mode 100644 index bff15c2b2..000000000 --- a/example/src/docs/mobile/radio/event-change.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Radio 单选 - - -
- -### 值改变事件 - - - -
diff --git a/example/src/docs/mobile/radio/mobileradio.md b/example/src/docs/mobile/radio/mobileradio.md deleted file mode 100644 index ff65535ce..000000000 --- a/example/src/docs/mobile/radio/mobileradio.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Radio 单选 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/search/button-text.md b/example/src/docs/mobile/search/button-text.md deleted file mode 100644 index 9a747f15c..000000000 --- a/example/src/docs/mobile/search/button-text.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Search 搜索框 - - -
- -### 自定义搜索按钮文本 - - - -
diff --git a/example/src/docs/mobile/search/default-value.md b/example/src/docs/mobile/search/default-value.md deleted file mode 100644 index 5eb77bcdb..000000000 --- a/example/src/docs/mobile/search/default-value.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Search 搜索框 - - -
- -### 默认搜索 - - - -
diff --git a/example/src/docs/mobile/search/events.md b/example/src/docs/mobile/search/events.md deleted file mode 100644 index a8d3acfc4..000000000 --- a/example/src/docs/mobile/search/events.md +++ /dev/null @@ -1,22 +0,0 @@ -
-

- -

- -## Search 搜索框 - - - -
- -### 事件 - - - -
- -### clear 事件 - - - -
diff --git a/example/src/docs/mobile/search/mobilesearch.md b/example/src/docs/mobile/search/mobilesearch.md deleted file mode 100644 index 6f0d5c4b9..000000000 --- a/example/src/docs/mobile/search/mobilesearch.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Search 搜索框 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/slider/about-step.md b/example/src/docs/mobile/slider/about-step.md deleted file mode 100644 index f6b8fc5e5..000000000 --- a/example/src/docs/mobile/slider/about-step.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 步长 - -通过设置`step`来配置滑块滑动的步长 - - - -
diff --git a/example/src/docs/mobile/slider/basic-usage.md b/example/src/docs/mobile/slider/basic-usage.md deleted file mode 100644 index b36884853..000000000 --- a/example/src/docs/mobile/slider/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/slider/dynamic-disable.md b/example/src/docs/mobile/slider/dynamic-disable.md deleted file mode 100644 index 870f4b694..000000000 --- a/example/src/docs/mobile/slider/dynamic-disable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 禁用 - -通过设置属性`disabled` ,设置滑动滑块禁止滑动 - - - -
diff --git a/example/src/docs/mobile/slider/format-tooltip.md b/example/src/docs/mobile/slider/format-tooltip.md deleted file mode 100644 index 4682b3d30..000000000 --- a/example/src/docs/mobile/slider/format-tooltip.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 - -
- -### 总步数 - -通过`format-tooltip` 属性设置 value。 - - - -
diff --git a/example/src/docs/mobile/slider/max-min.md b/example/src/docs/mobile/slider/max-min.md deleted file mode 100644 index 14c0f5cc3..000000000 --- a/example/src/docs/mobile/slider/max-min.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 最大最小值 - -通过设置`min` `max` 来设置滑块取值范围 - - - -
diff --git a/example/src/docs/mobile/slider/range-select.md b/example/src/docs/mobile/slider/range-select.md deleted file mode 100644 index 56396642e..000000000 --- a/example/src/docs/mobile/slider/range-select.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 范围选择 - -通过`v-model` 为数组 设定初始范围选择 - - - -
diff --git a/example/src/docs/mobile/slider/shortcut-operation.md b/example/src/docs/mobile/slider/shortcut-operation.md deleted file mode 100644 index cbea345c4..000000000 --- a/example/src/docs/mobile/slider/shortcut-operation.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 - -
- -### 总步数 - -通过`num-pages` 属性设置总步数,即按快捷键 PageDown/PageUp 时,每次移动的距离是(最大值-最小值)/分页数。 - - - -
diff --git a/example/src/docs/mobile/slider/show-input.md b/example/src/docs/mobile/slider/show-input.md deleted file mode 100644 index e6e9362a4..000000000 --- a/example/src/docs/mobile/slider/show-input.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 输入框模式 - -通过配置`show-input`,开启滑块输入框模式 - - - -
diff --git a/example/src/docs/mobile/slider/show-tip.md b/example/src/docs/mobile/slider/show-tip.md deleted file mode 100644 index 515b19dff..000000000 --- a/example/src/docs/mobile/slider/show-tip.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 提示 - -通过设定`:show-tip="false"`,关闭滑块提示。(默认开启) - - - -
diff --git a/example/src/docs/mobile/slider/slider-events.md b/example/src/docs/mobile/slider/slider-events.md deleted file mode 100644 index 83c45affe..000000000 --- a/example/src/docs/mobile/slider/slider-events.md +++ /dev/null @@ -1,31 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 事件 - -

change 事件

- - - -
- -

start 滑块开始滑动事件

- - - -
- -

stop 滑块停止滑动事件

- - - -
diff --git a/example/src/docs/mobile/slider/slider-slot.md b/example/src/docs/mobile/slider/slider-slot.md deleted file mode 100644 index 0bfb624ce..000000000 --- a/example/src/docs/mobile/slider/slider-slot.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 自定义插槽 - - - -
- diff --git a/example/src/docs/mobile/slider/vertical-mode.md b/example/src/docs/mobile/slider/vertical-mode.md deleted file mode 100644 index 4b7b88c33..000000000 --- a/example/src/docs/mobile/slider/vertical-mode.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 竖向模式 - -通过设置`vertical` 属性来展示滑块竖向模式(不设置,默认为横向模式) -竖向模式可以通过 `height` 设置组件高度 - - - -
diff --git a/example/src/docs/mobile/switch/disabled.md b/example/src/docs/mobile/switch/disabled.md deleted file mode 100644 index 132272445..000000000 --- a/example/src/docs/mobile/switch/disabled.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## Switch 开关 - - - -
- -### 是否禁用 - - - -
diff --git a/example/src/docs/mobile/switch/event-change.md b/example/src/docs/mobile/switch/event-change.md deleted file mode 100644 index b7d230342..000000000 --- a/example/src/docs/mobile/switch/event-change.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Switch 开关 - - -
- -### 值改变事件 - - - -
diff --git a/example/src/docs/mobile/switch/mobileswitch.md b/example/src/docs/mobile/switch/mobileswitch.md deleted file mode 100644 index afa1d5fc8..000000000 --- a/example/src/docs/mobile/switch/mobileswitch.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Switch 开关 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/mobile/switch/scenario.md b/example/src/docs/mobile/switch/scenario.md deleted file mode 100644 index c9649d780..000000000 --- a/example/src/docs/mobile/switch/scenario.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Switch 开关 - - -
- -### 应用场景 - - - -
diff --git a/example/src/docs/mobile/switch/true-false-value.md b/example/src/docs/mobile/switch/true-false-value.md deleted file mode 100644 index 9ff63ef0e..000000000 --- a/example/src/docs/mobile/switch/true-false-value.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Switch 开关 - - -
- -### 自定义打开关闭的值 - - - -
diff --git a/example/src/docs/mobile/tabbar/active-inactive-color.md b/example/src/docs/mobile/tabbar/active-inactive-color.md deleted file mode 100644 index 2a91f6cb4..000000000 --- a/example/src/docs/mobile/tabbar/active-inactive-color.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Tabbar 标签栏 - - -
- -### 自定义颜色 - - - -
diff --git a/example/src/docs/mobile/tabbar/badge.md b/example/src/docs/mobile/tabbar/badge.md deleted file mode 100644 index 1039d9b4c..000000000 --- a/example/src/docs/mobile/tabbar/badge.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Tabbar 标签栏 - - -
- -### 徽标提示 - - - -
diff --git a/example/src/docs/mobile/tabbar/border.md b/example/src/docs/mobile/tabbar/border.md deleted file mode 100644 index 00ac8846a..000000000 --- a/example/src/docs/mobile/tabbar/border.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Tabbar 标签栏 - - -
- -### 无边框 - - - -
diff --git a/example/src/docs/mobile/tabbar/event-change.md b/example/src/docs/mobile/tabbar/event-change.md deleted file mode 100644 index 112e094a2..000000000 --- a/example/src/docs/mobile/tabbar/event-change.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Tabbar 标签栏 - - -
- -### 切换事件 - - - -
diff --git a/example/src/docs/mobile/tabbar/mobiletabbar.md b/example/src/docs/mobile/tabbar/mobiletabbar.md deleted file mode 100644 index 2e683091f..000000000 --- a/example/src/docs/mobile/tabbar/mobiletabbar.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Tabbar 标签栏 - - -
- -### 基本用法 - - - -
- - - -
- -### TabbarItem Props - - diff --git a/example/src/docs/mobile/tabbar/onlytext.md b/example/src/docs/mobile/tabbar/onlytext.md deleted file mode 100644 index 2cc2a76a0..000000000 --- a/example/src/docs/mobile/tabbar/onlytext.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Tabbar 标签栏 - - -
- -### 纯文本 - - - -
diff --git a/example/src/docs/mobile/tabbar/route.md b/example/src/docs/mobile/tabbar/route.md deleted file mode 100644 index c22999c32..000000000 --- a/example/src/docs/mobile/tabbar/route.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Tabbar 标签栏 - - -
- -### 路由跳转 - - - -
diff --git a/example/src/docs/mobile/tabbar/slot-icon.md b/example/src/docs/mobile/tabbar/slot-icon.md deleted file mode 100644 index 111da51a2..000000000 --- a/example/src/docs/mobile/tabbar/slot-icon.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Tabbar 标签栏 - - -
- -### 自定义图标 - - - -
diff --git a/example/src/docs/mobile/tabs/active-color.md b/example/src/docs/mobile/tabs/active-color.md deleted file mode 100644 index c740f21cf..000000000 --- a/example/src/docs/mobile/tabs/active-color.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - -
- -### 自定义当前标签页颜色 - - - -
diff --git a/example/src/docs/mobile/tabs/before-leave.md b/example/src/docs/mobile/tabs/before-leave.md deleted file mode 100644 index f13d7e79e..000000000 --- a/example/src/docs/mobile/tabs/before-leave.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - -
- -### 离开前事件 - -`before-leave`切换标签之前的钩子函数,若返回 `false` 或者返回 `Promise` 且被`reject`,则阻止切换,返回 `true` 则可以切换。 - - - -
diff --git a/example/src/docs/mobile/tabs/swipe.md b/example/src/docs/mobile/tabs/swipe.md deleted file mode 100644 index e4d54f3f6..000000000 --- a/example/src/docs/mobile/tabs/swipe.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - -
- -### 滑动内容切换标签页 - - - -
diff --git a/example/src/docs/mobile/tabs/tabs-event.md b/example/src/docs/mobile/tabs/tabs-event.md deleted file mode 100644 index ebb6374f8..000000000 --- a/example/src/docs/mobile/tabs/tabs-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - -
- -### 事件 - -单击标签页时触发 `click` 事件 -点击新增按钮增加标签页时触发 `add` 事件 -关闭标签页时触发 `close` 事件 - - - -
diff --git a/example/src/docs/mobile/tabs/three-level.md b/example/src/docs/mobile/tabs/three-level.md deleted file mode 100644 index bc233de1c..000000000 --- a/example/src/docs/mobile/tabs/three-level.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - -
- -### 新增标签页 - - - -
diff --git a/example/src/docs/mobile/tabs/with-add.md b/example/src/docs/mobile/tabs/with-add.md deleted file mode 100644 index 03ae965d0..000000000 --- a/example/src/docs/mobile/tabs/with-add.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - -
- -### 新增标签页 - - - -
diff --git a/example/src/docs/mobile/time-line/different-data.md b/example/src/docs/mobile/time-line/different-data.md deleted file mode 100644 index dce08a3da..000000000 --- a/example/src/docs/mobile/time-line/different-data.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimeLine 时间轴 - - -
- -### 数据映射 - - - -
- - diff --git a/example/src/docs/mobile/time-line/slot.md b/example/src/docs/mobile/time-line/slot.md deleted file mode 100644 index 9cb694c06..000000000 --- a/example/src/docs/mobile/time-line/slot.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimeLine 时间轴 - - -
- -### 插槽 - - - -
- - diff --git a/example/src/docs/mobile/time-line/space.md b/example/src/docs/mobile/time-line/space.md deleted file mode 100644 index 4092fdc3b..000000000 --- a/example/src/docs/mobile/time-line/space.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimeLine 时间轴 - - -
- -### 时间轴项高度 - - - -
- - diff --git a/example/src/docs/zh-CN/action-menu/basic-usage.md b/example/src/docs/zh-CN/action-menu/basic-usage.md deleted file mode 100644 index 836100475..000000000 --- a/example/src/docs/zh-CN/action-menu/basic-usage.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## ActionMenu 菜单按钮 - - - -提供一组操作按钮的组件,当按钮数量太多导致预留空间大小无法显示所有按钮时,自动将超出部分的按钮放置在一个 menu 组件下拉中。 - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/action-menu/disabled.md b/example/src/docs/zh-CN/action-menu/disabled.md deleted file mode 100644 index b2e3a8579..000000000 --- a/example/src/docs/zh-CN/action-menu/disabled.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## ActionMenu 菜单按钮 - - - -提供一组操作按钮的组件,当按钮数量太多导致预留空间大小无法显示所有按钮时,自动将超出部分的按钮放置在一个 menu 组件下拉中。 - -
- -### 禁用 - - - -
- - diff --git a/example/src/docs/zh-CN/action-menu/item-click.md b/example/src/docs/zh-CN/action-menu/item-click.md deleted file mode 100644 index 0ec858c8b..000000000 --- a/example/src/docs/zh-CN/action-menu/item-click.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## ActionMenu 菜单按钮 - - - -提供一组操作按钮的组件,当按钮数量太多导致预留空间大小无法显示所有按钮时,自动将超出部分的按钮放置在一个 menu 组件下拉中。 - -
- -### 菜单项点击事件 - - - -
- - diff --git a/example/src/docs/zh-CN/action-menu/max-show-num.md b/example/src/docs/zh-CN/action-menu/max-show-num.md deleted file mode 100644 index 04884bbe2..000000000 --- a/example/src/docs/zh-CN/action-menu/max-show-num.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## ActionMenu 菜单按钮 - - - -提供一组操作按钮的组件,当按钮数量太多导致预留空间大小无法显示所有按钮时,自动将超出部分的按钮放置在一个 menu 组件下拉中。 - -
- -### 显示个数 - - - -
- - diff --git a/example/src/docs/zh-CN/action-menu/more-click.md b/example/src/docs/zh-CN/action-menu/more-click.md deleted file mode 100644 index 5bbea723e..000000000 --- a/example/src/docs/zh-CN/action-menu/more-click.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## ActionMenu 菜单按钮 - - - -提供一组操作按钮的组件,当按钮数量太多导致预留空间大小无法显示所有按钮时,自动将超出部分的按钮放置在一个 menu 组件下拉中。 - -
- -### 更多按钮点击事件 - - - -
- - diff --git a/example/src/docs/zh-CN/action-menu/more-text.md b/example/src/docs/zh-CN/action-menu/more-text.md deleted file mode 100644 index 4f7eae7c8..000000000 --- a/example/src/docs/zh-CN/action-menu/more-text.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## ActionMenu 菜单按钮 - - - -提供一组操作按钮的组件,当按钮数量太多导致预留空间大小无法显示所有按钮时,自动将超出部分的按钮放置在一个 menu 组件下拉中。 - -
- -### 下拉按钮显示文本 - - - -
- - diff --git a/example/src/docs/zh-CN/action-menu/popper-class.md b/example/src/docs/zh-CN/action-menu/popper-class.md deleted file mode 100644 index 9f53b815e..000000000 --- a/example/src/docs/zh-CN/action-menu/popper-class.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## ActionMenu 菜单按钮 - - - -提供一组操作按钮的组件,当按钮数量太多导致预留空间大小无法显示所有按钮时,自动将超出部分的按钮放置在一个 menu 组件下拉中。 - -
- -### 自定义下拉面板样式 - - - -
- - diff --git a/example/src/docs/zh-CN/action-menu/slot-item.md b/example/src/docs/zh-CN/action-menu/slot-item.md deleted file mode 100644 index 2de50a721..000000000 --- a/example/src/docs/zh-CN/action-menu/slot-item.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## ActionMenu 菜单按钮 - - - -提供一组操作按钮的组件,当按钮数量太多导致预留空间大小无法显示所有按钮时,自动将超出部分的按钮放置在一个 menu 组件下拉中。 - -
- -### 菜单项插槽 - - - -
- - diff --git a/example/src/docs/zh-CN/action-menu/spacing.md b/example/src/docs/zh-CN/action-menu/spacing.md deleted file mode 100644 index f2be09dc2..000000000 --- a/example/src/docs/zh-CN/action-menu/spacing.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## ActionMenu 菜单按钮 - - - -提供一组操作按钮的组件,当按钮数量太多导致预留空间大小无法显示所有按钮时,自动将超出部分的按钮放置在一个 menu 组件下拉中。 - -
- -### 间距 - - - -
- - diff --git a/example/src/docs/zh-CN/action-menu/text-field.md b/example/src/docs/zh-CN/action-menu/text-field.md deleted file mode 100644 index c43e56934..000000000 --- a/example/src/docs/zh-CN/action-menu/text-field.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## ActionMenu 菜单按钮 - - - -通过属性 labelKey 配置要显示文本的键值。 - -
- -### 显示文本 - - - -
- - diff --git a/example/src/docs/zh-CN/alert/alert-close-event.md b/example/src/docs/zh-CN/alert/alert-close-event.md deleted file mode 100644 index 792046a49..000000000 --- a/example/src/docs/zh-CN/alert/alert-close-event.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Alert 警告 - - -
- -### 关闭事件 - -`close` 事件,关闭警告框时触发。 - - - -
diff --git a/example/src/docs/zh-CN/alert/alert-type.md b/example/src/docs/zh-CN/alert/alert-type.md deleted file mode 100644 index d4cd9878c..000000000 --- a/example/src/docs/zh-CN/alert/alert-type.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Alert 警告 - - -
- -### 类型 - -通过 `type` 设置不同的类型。可选值:success、warning、info、error,默认值:info 。 - - - -
diff --git a/example/src/docs/zh-CN/alert/align-center.md b/example/src/docs/zh-CN/alert/align-center.md deleted file mode 100644 index 484275cf5..000000000 --- a/example/src/docs/zh-CN/alert/align-center.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Alert 警告 - - -
- -### 文字居中 - -通过 `center` 属性可使文字显示居中。 - - - -
diff --git a/example/src/docs/zh-CN/alert/basic-usage.md b/example/src/docs/zh-CN/alert/basic-usage.md deleted file mode 100644 index 082b2ac98..000000000 --- a/example/src/docs/zh-CN/alert/basic-usage.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Alert 警告 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/alert/custom-alert-icon.md b/example/src/docs/zh-CN/alert/custom-alert-icon.md deleted file mode 100644 index 02b029fcd..000000000 --- a/example/src/docs/zh-CN/alert/custom-alert-icon.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Alert 警告 - - -
- -### 自定义警告图标 - -通过 `icon` 属性自定义图标。 - - - -
diff --git a/example/src/docs/zh-CN/alert/custom-close-text.md b/example/src/docs/zh-CN/alert/custom-close-text.md deleted file mode 100644 index ea8e6b3e1..000000000 --- a/example/src/docs/zh-CN/alert/custom-close-text.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Alert 警告 - - -
- -### 自定义关闭按钮文本 - -通过属性 `close-text` 自定义关闭按钮文本。 - - - -
diff --git a/example/src/docs/zh-CN/alert/custom-description.md b/example/src/docs/zh-CN/alert/custom-description.md deleted file mode 100644 index 48632414d..000000000 --- a/example/src/docs/zh-CN/alert/custom-description.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Alert 警告 - - -
- -### 自定义提示内容 - -当 `size` 为 large时,可通过 `description` 属性或插槽设置自定义提示内容。 - - - -
diff --git a/example/src/docs/zh-CN/alert/custom-title.md b/example/src/docs/zh-CN/alert/custom-title.md deleted file mode 100644 index 55b43c02c..000000000 --- a/example/src/docs/zh-CN/alert/custom-title.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Alert 警告 - - -
- -### 自定义标题 - -当 `size` 为 large 时显示标题,可设置 `title` 或 `slot` 自定义标题。默认标题根据设置的 `type` 显示。 - - - -
diff --git a/example/src/docs/zh-CN/alert/feedback-of-result.md b/example/src/docs/zh-CN/alert/feedback-of-result.md deleted file mode 100644 index 2e9e251d5..000000000 --- a/example/src/docs/zh-CN/alert/feedback-of-result.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Alert 警告 - - -
- -### 表单提交结果反馈 - -当 `size` 为 large时,属性 `description` 和默认插槽结合使用,可渲染提交反馈界面。 - - - -
diff --git a/example/src/docs/zh-CN/alert/interactive-operation.md b/example/src/docs/zh-CN/alert/interactive-operation.md deleted file mode 100644 index bdf417405..000000000 --- a/example/src/docs/zh-CN/alert/interactive-operation.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Alert 警告 - - -
- -### 自定义交互操作 - -当 `size` 为 large 时,设置默认插槽自定义交互操作。 - - - -
diff --git a/example/src/docs/zh-CN/alert/large-size.md b/example/src/docs/zh-CN/alert/large-size.md deleted file mode 100644 index f0ac6633b..000000000 --- a/example/src/docs/zh-CN/alert/large-size.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Alert 警告 - - -
- -### 大尺寸 - -通过 `size` 属性设置不同的尺寸,可选值:nomal、large,默认值:nomal 。 - - - -
diff --git a/example/src/docs/zh-CN/alert/not-closable.md b/example/src/docs/zh-CN/alert/not-closable.md deleted file mode 100644 index bb5be4b05..000000000 --- a/example/src/docs/zh-CN/alert/not-closable.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Alert 警告 - - -
- -### 不可关闭 - -通过 `closable` 属性可设置是否显示关闭按钮,没有关闭按钮,警告框将不可关闭。 - - - -
diff --git a/example/src/docs/zh-CN/alert/show-icon.md b/example/src/docs/zh-CN/alert/show-icon.md deleted file mode 100644 index a9179f0e2..000000000 --- a/example/src/docs/zh-CN/alert/show-icon.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## Alert 警告 - - - -
- -### 是否显示图标 - -通过配置 `show-icon` 属性,控制图标是否显示。 - - - -
diff --git a/example/src/docs/zh-CN/amount/amount-disable.md b/example/src/docs/zh-CN/amount/amount-disable.md deleted file mode 100644 index fd4d49cb9..000000000 --- a/example/src/docs/zh-CN/amount/amount-disable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Amount 金额 - - - -用于处理货币、金额和相关时间,选择货币类型并填写数目和时间,也可以通过设定服务,自定义货币类型。 -
- -### 禁用 - -通过 `disabled` 配置 Amount 组件禁用。 - - - -
diff --git a/example/src/docs/zh-CN/amount/basic-usage.md b/example/src/docs/zh-CN/amount/basic-usage.md deleted file mode 100644 index fde2667cf..000000000 --- a/example/src/docs/zh-CN/amount/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Amount 金额 - - - -用于处理货币、金额和相关时间,选择货币类型并填写数目和时间,也可以通过设定服务,自定义货币类型。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/amount/custom-currency.md b/example/src/docs/zh-CN/amount/custom-currency.md deleted file mode 100644 index 613f5b5f5..000000000 --- a/example/src/docs/zh-CN/amount/custom-currency.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Amount 金额 - - - -用于处理货币、金额和相关时间,选择货币类型并填写数目和时间,也可以通过设定服务,自定义货币类型。 -
- -### 指定币种 - -默认显示币种为 CNY,可通过 `currency` 指定需要的币种,若指定的币种在返回的服务数据中不存在,则币种下拉框将不显示该币种。 - - - -
diff --git a/example/src/docs/zh-CN/amount/custom-service.md b/example/src/docs/zh-CN/amount/custom-service.md deleted file mode 100644 index 8f32afa4d..000000000 --- a/example/src/docs/zh-CN/amount/custom-service.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Amount 金额 - - - -用于处理货币、金额和相关时间,选择货币类型并填写数目和时间,也可以通过设定服务,自定义货币类型。 -
- -### 自定义服务 - -`fetchCurrency` 指定自定义服务,`fields` 可指定显示字段和值设置在服务数据中的字段映射。 - - - -
diff --git a/example/src/docs/zh-CN/amount/digits-maxlen.md b/example/src/docs/zh-CN/amount/digits-maxlen.md deleted file mode 100644 index 51bb16cd2..000000000 --- a/example/src/docs/zh-CN/amount/digits-maxlen.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Amount 金额 - - - -用于处理货币、金额和相关时间,选择货币类型并填写数目和时间,也可以通过设定服务,自定义货币类型。 - -
- -### 金额设置 - -设置 `digits` 属性可指定金额小数位数,默认为 2 位。设置 `max-len` 属性指定整数位最大可输入长度,默认为 15 位。 - - - -
diff --git a/example/src/docs/zh-CN/amount/set-date.md b/example/src/docs/zh-CN/amount/set-date.md deleted file mode 100644 index d6a2c188b..000000000 --- a/example/src/docs/zh-CN/amount/set-date.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Amount 金额 - - - -用于处理货币、金额和相关时间,选择货币类型并填写数目和时间,也可以通过设定服务,自定义货币类型。 -
- -### 设置日期 - -通过 `date` 属性设置日期后,将会在金额组件中显示日期框。值可设置为 String 或者 Date() 类型。 - -通过 `change` 获取改变后的值。 - - - -
diff --git a/example/src/docs/zh-CN/amount/size.md b/example/src/docs/zh-CN/amount/size.md deleted file mode 100644 index 4d36179bc..000000000 --- a/example/src/docs/zh-CN/amount/size.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Amount 金额 - - - -用于处理货币、金额和相关时间,选择货币类型并填写数目和时间,也可以通过设定服务,自定义货币类型。 -
- -### 编辑框大小 - -可选择的类型:`medium`,`small`,`mini` - - - -
diff --git a/example/src/docs/zh-CN/area/area-events.md b/example/src/docs/zh-CN/area/area-events.md deleted file mode 100644 index 450514fce..000000000 --- a/example/src/docs/zh-CN/area/area-events.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Area 片区 - - - -用于显示区域名称,通过配置区域和数据源获取选项。 -
- -### 事件 - -Region 下拉框的值改变时触发 `change-region` 事件,Rep 下拉框的值改变时触发 `change-rep` 事件,Office 下拉框的值改变时触发 `change-office` 事件。 - - - -
diff --git a/example/src/docs/zh-CN/area/basic-usage.md b/example/src/docs/zh-CN/area/basic-usage.md deleted file mode 100644 index 6d00aa784..000000000 --- a/example/src/docs/zh-CN/area/basic-usage.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Area 片区 - - - -用于显示区域名称,通过配置区域和数据源获取选项。 -
- -### 基本用法 - -通过 `v-model / value` 属性设置默认值。 - - - -
- - diff --git a/example/src/docs/zh-CN/area/custom-service.md b/example/src/docs/zh-CN/area/custom-service.md deleted file mode 100644 index 3a3c4a459..000000000 --- a/example/src/docs/zh-CN/area/custom-service.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Area 片区 - - - -用于显示区域名称,通过配置区域和数据源获取选项。 -
- -### 自定义服务 - -通过 `fetch-jcr` 可以自定义服务用于获取片区 JCR 数据,`fetch-rigion` 用于获取地区部 Region 的数据,`fetch-rep` 用于获取代表处 Rep 的数据,`fetch-office` 用于获取办事处 Office 的数据。同时 当数据字段为非默认的 `name_cn` `org_id` 时,可以通过 `props` 属性设置数据的映射字段。 - - - -
diff --git a/example/src/docs/zh-CN/area/disabled.md b/example/src/docs/zh-CN/area/disabled.md deleted file mode 100644 index 0dc04caa2..000000000 --- a/example/src/docs/zh-CN/area/disabled.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Area 片区 - - - -用于显示区域名称,通过配置区域和数据源获取选项。 -
- -### 设置组件大小 - -通过 `disabled` 设置组件禁用默认值为 false 。 - - - -
diff --git a/example/src/docs/zh-CN/area/size.md b/example/src/docs/zh-CN/area/size.md deleted file mode 100644 index 3fdb24d5c..000000000 --- a/example/src/docs/zh-CN/area/size.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Area 片区 - - - -用于显示区域名称,通过配置区域和数据源获取选项。 -
- -### 设置组件大小 - -可选值为:`medium`,`small`,`mini` - - - -
diff --git a/example/src/docs/zh-CN/autocomplete/append-prepend.md b/example/src/docs/zh-CN/autocomplete/append-prepend.md deleted file mode 100644 index 0df3be04b..000000000 --- a/example/src/docs/zh-CN/autocomplete/append-prepend.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Autocomplete 自动完成 - - - -根据输入内容提供对应的输入建议。 - -
- -### 输入框前置内容 - -配置 `prepend` 属性设置输入框前置内容。 - - - -
- -### 输入框后置内容 - -配置 `append` 属性设置输入框后置内容。 - - - -
diff --git a/example/src/docs/zh-CN/autocomplete/basic-usage.md b/example/src/docs/zh-CN/autocomplete/basic-usage.md deleted file mode 100644 index 6f30ed73f..000000000 --- a/example/src/docs/zh-CN/autocomplete/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Autocomplete 自动完成 - - - -根据输入内容提供对应的输入建议。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/autocomplete/clearable.md b/example/src/docs/zh-CN/autocomplete/clearable.md deleted file mode 100644 index 5e416407b..000000000 --- a/example/src/docs/zh-CN/autocomplete/clearable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Autocomplete 自动完成 - - - -根据输入内容提供对应的输入建议。 -
- -### 可清除 - -配置 `clearable` 属性后,输入内容后会显示清除图标,单击可以清除输入框内容。 - - - -
diff --git a/example/src/docs/zh-CN/autocomplete/cust-template.md b/example/src/docs/zh-CN/autocomplete/cust-template.md deleted file mode 100644 index 9b996fb01..000000000 --- a/example/src/docs/zh-CN/autocomplete/cust-template.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Autocomplete 自动完成 - - - -根据输入内容提供对应的输入建议。 -
- -### 自定义模板 - -通过作用域插槽可以自定义输入建议模板。 - - - -
diff --git a/example/src/docs/zh-CN/autocomplete/custom-icon.md b/example/src/docs/zh-CN/autocomplete/custom-icon.md deleted file mode 100644 index 212965214..000000000 --- a/example/src/docs/zh-CN/autocomplete/custom-icon.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Autocomplete 自动完成 - - - -根据输入内容提供对应的输入建议。 -
- -### 自定义图标 - -配置 `prefix-icon` 和 `suffix-icon` 属性可分别自定义输入框前后置图标。 - - - -### 通过插槽自定义图标 - -通过 `prefix` 和 `suffix` 插槽也可以分别自定义输入框前后置图标。 - - - -
diff --git a/example/src/docs/zh-CN/autocomplete/debounce.md b/example/src/docs/zh-CN/autocomplete/debounce.md deleted file mode 100644 index 42a96b178..000000000 --- a/example/src/docs/zh-CN/autocomplete/debounce.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Autocomplete 自动完成 - - - -根据输入内容提供对应的输入建议。 -
- -### 去抖延时 - -通过 `debounce` 属性可以设置获取输入建议的去抖延时,默认值为 300 毫秒。 - - - -
diff --git a/example/src/docs/zh-CN/autocomplete/disabled.md b/example/src/docs/zh-CN/autocomplete/disabled.md deleted file mode 100644 index a47797c57..000000000 --- a/example/src/docs/zh-CN/autocomplete/disabled.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Autocomplete 自动完成 - - - -根据输入内容提供对应的输入建议。 - -
- -### 禁用 - -通过 `disabled` 属性可以设置为禁用状态。 - - - -
- -### 原生属性 - -通过 `name` 属性可以设置原生属性。 - - - -
diff --git a/example/src/docs/zh-CN/autocomplete/hide-loading.md b/example/src/docs/zh-CN/autocomplete/hide-loading.md deleted file mode 100644 index 62a49fbdb..000000000 --- a/example/src/docs/zh-CN/autocomplete/hide-loading.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Autocomplete 自动完成 - - - -根据输入内容提供对应的输入建议。 - -
- -### 隐藏加载图标 - -设置 `hide-loading` 属性为 true ,可以隐藏加载图标。 - - - -
- -### 输入框占位文本 - -设置 `placeholder` 属性可设置自定义输入框占位文本内容。 - - - -
diff --git a/example/src/docs/zh-CN/autocomplete/highlight-first-item.md b/example/src/docs/zh-CN/autocomplete/highlight-first-item.md deleted file mode 100644 index c5fccdd15..000000000 --- a/example/src/docs/zh-CN/autocomplete/highlight-first-item.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Autocomplete 自动完成 - - - -根据输入内容提供对应的输入建议。 -
- -### 高亮显示第一项 - -设置 `highlight-first-item` 属性为 true ,可以突出显示远程搜索建议中的第一项。 - - - -
diff --git a/example/src/docs/zh-CN/autocomplete/no-trigger-on-focus.md b/example/src/docs/zh-CN/autocomplete/no-trigger-on-focus.md deleted file mode 100644 index 440020cef..000000000 --- a/example/src/docs/zh-CN/autocomplete/no-trigger-on-focus.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Autocomplete 自动完成 - - - -根据输入内容提供对应的输入建议。 -
- -### 聚焦不显示建议列表 - -默认输入框聚焦就会显示全部的建议列表,但设置 `trigger-on-focus` 属性为 false 后只有在匹配到输入建议后才会显示匹配到的建议列表。 - - - -
diff --git a/example/src/docs/zh-CN/autocomplete/placement.md b/example/src/docs/zh-CN/autocomplete/placement.md deleted file mode 100644 index 49a852572..000000000 --- a/example/src/docs/zh-CN/autocomplete/placement.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Autocomplete 自动完成 - - - -根据输入内容提供对应的输入建议。 -
- -### 设置菜单弹出位置 - -`placement` 属性可以设置菜单弹出位置,默认为 `bottom-start`。可选值有 top、top-start、top-end、bottom、bottom-start、bottom-end 。 - - - -
diff --git a/example/src/docs/zh-CN/autocomplete/popper-class.md b/example/src/docs/zh-CN/autocomplete/popper-class.md deleted file mode 100644 index 122ef3003..000000000 --- a/example/src/docs/zh-CN/autocomplete/popper-class.md +++ /dev/null @@ -1,39 +0,0 @@ - - -
-

- -

- -## Autocomplete 自动完成 - - - -根据输入内容提供对应的输入建议。 -
- -### 自定义列表样式 - -`popper-class` 属性可指定一个样式类名,可自定义建议列表的样式。 - -`popper-append-to-body` 属性可设置是否将下拉列表插入至 body 元素。在下拉列表的定位出现问题时,可将该属性设置为 false。 - - - -
diff --git a/example/src/docs/zh-CN/autocomplete/remote-search.md b/example/src/docs/zh-CN/autocomplete/remote-search.md deleted file mode 100644 index bc92e5162..000000000 --- a/example/src/docs/zh-CN/autocomplete/remote-search.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Autocomplete 自动完成 - - - -根据输入内容提供对应的输入建议。 -
- -### 远程搜索 - - - -
diff --git a/example/src/docs/zh-CN/autocomplete/select-event.md b/example/src/docs/zh-CN/autocomplete/select-event.md deleted file mode 100644 index 582a8b531..000000000 --- a/example/src/docs/zh-CN/autocomplete/select-event.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Autocomplete 自动完成 - - - -根据输入内容提供对应的输入建议。 -
- -### 事件 - -Autocomplete 组件提供 `select` 事件,点击选中建议项时触发,回调参数为选中建议项。 -通过 `select-when-unmatched` 设置在输入联想没有匹配值时,按 Enter 键时是否触发 select 事件,默认值为 false。 - - - -
diff --git a/example/src/docs/zh-CN/autocomplete/size.md b/example/src/docs/zh-CN/autocomplete/size.md deleted file mode 100644 index 843c4d9d6..000000000 --- a/example/src/docs/zh-CN/autocomplete/size.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Autocomplete 自动完成 - - - -根据输入内容提供对应的输入建议。 -
- -### 输入框大小 - -可选择值为medium,small,mini - - - -
diff --git a/example/src/docs/zh-CN/autocomplete/value-key.md b/example/src/docs/zh-CN/autocomplete/value-key.md deleted file mode 100644 index 3a5c2dfad..000000000 --- a/example/src/docs/zh-CN/autocomplete/value-key.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Autocomplete 自动完成 - - - -根据输入内容提供对应的输入建议。 -
- -### 指定显示的键名 - -输入内容后,建议列表中默认显示输入建议对象中 value 键名对应的值,若对象中没有 value 键名,就可以通过 `value-key` 属性指定显示的键名。 - - - -
diff --git a/example/src/docs/zh-CN/badge/badge-style.md b/example/src/docs/zh-CN/badge/badge-style.md deleted file mode 100644 index 7d2578e52..000000000 --- a/example/src/docs/zh-CN/badge/badge-style.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Badge 标记 - - - -Badge 展示指定数据信息,如:我的待办数、新任务数等。 -
- -### 主題样式 - -`type` 设置显示主题,可选值:primary、success、warning、danger、info,默认值:danger - - - -
diff --git a/example/src/docs/zh-CN/badge/basic-usage.md b/example/src/docs/zh-CN/badge/basic-usage.md deleted file mode 100644 index e48511d3b..000000000 --- a/example/src/docs/zh-CN/badge/basic-usage.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Badge 标记 - - - -Badge 展示指定数据信息,如:我的待办数、新任务数等。 -
- -### 基本用法 - -

Badge 展示指定数据信息,如:我的待办数、新任务数等。

- - -
- - diff --git a/example/src/docs/zh-CN/badge/custom-badge-target.md b/example/src/docs/zh-CN/badge/custom-badge-target.md deleted file mode 100644 index 925a69541..000000000 --- a/example/src/docs/zh-CN/badge/custom-badge-target.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Badge 标记 - - - -Badge 展示指定数据信息,如:我的待办数、新任务数等。 -
- -### 自定义标记目标 - -`default slot` 标记内容自定义 - - - -
diff --git a/example/src/docs/zh-CN/badge/custom-tip-text.md b/example/src/docs/zh-CN/badge/custom-tip-text.md deleted file mode 100644 index 9bc8cf652..000000000 --- a/example/src/docs/zh-CN/badge/custom-tip-text.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Badge 标记 - - - -Badge 展示指定数据信息,如:我的待办数、新任务数等。 -
- -### 自定义提示内容 - -`content slot` 自定义提示内容 - - - -
diff --git a/example/src/docs/zh-CN/badge/hidden-badge-while-read-message.md b/example/src/docs/zh-CN/badge/hidden-badge-while-read-message.md deleted file mode 100644 index 904b8e602..000000000 --- a/example/src/docs/zh-CN/badge/hidden-badge-while-read-message.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Badge 标记 - - - -Badge 展示指定数据信息,如:我的待办数、新任务数等。 -
- -### 消息已读动态隐藏标记 - -`hidden` 隐藏标记 - - - -
diff --git a/example/src/docs/zh-CN/badge/href-target.md b/example/src/docs/zh-CN/badge/href-target.md deleted file mode 100644 index 51a380c69..000000000 --- a/example/src/docs/zh-CN/badge/href-target.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Badge 标记 - - - -Badge 展示指定数据信息,如:我的待办数、新任务数等。 -
- -### 跳转链接 - -`href`定义跳转链接 - - - -
diff --git a/example/src/docs/zh-CN/badge/is-dot.md b/example/src/docs/zh-CN/badge/is-dot.md deleted file mode 100644 index 48a1abe9b..000000000 --- a/example/src/docs/zh-CN/badge/is-dot.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Badge 标记 - - - -Badge 展示指定数据信息,如:我的待办数、新任务数等。 -
- -### 小圆点标记 - -`is-dot` 显示小圆点标记 - - - -
diff --git a/example/src/docs/zh-CN/badge/max-num.md b/example/src/docs/zh-CN/badge/max-num.md deleted file mode 100644 index 6f2929a35..000000000 --- a/example/src/docs/zh-CN/badge/max-num.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Badge 标记 - - - -Badge 展示指定数据信息,如:我的待办数、新任务数等。 -
- -### 计数最大值 - -`max` 超过最大值会显示 '{max}+' - - - -
diff --git a/example/src/docs/zh-CN/breadcrumb/based-on-routing.md b/example/src/docs/zh-CN/breadcrumb/based-on-routing.md deleted file mode 100644 index 7b2a7601c..000000000 --- a/example/src/docs/zh-CN/breadcrumb/based-on-routing.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Breadcrumb 面包屑 - - - -Breadcrumb 面包屑导航,作用是告诉访问者他们目前在网站中的位置以及如何返回。 -
- -### 基于路由动态生成 - - - -
diff --git a/example/src/docs/zh-CN/breadcrumb/custom-item.md b/example/src/docs/zh-CN/breadcrumb/custom-item.md deleted file mode 100644 index 0609a2a0f..000000000 --- a/example/src/docs/zh-CN/breadcrumb/custom-item.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Breadcrumb 面包屑 - - - -Breadcrumb 面包屑导航,作用是告诉访问者他们目前在网站中的位置以及如何返回。 -
- -### 自定义节点 - -设置子组件 BreadcrumbItem 的 默认插槽,自定义节点内容。`to` 设置路由跳转的对象,同时设置 `replace` 后将不会向 history 添加新记录。 - - - -
diff --git a/example/src/docs/zh-CN/breadcrumb/custom-separator.md b/example/src/docs/zh-CN/breadcrumb/custom-separator.md deleted file mode 100644 index 87abd38d1..000000000 --- a/example/src/docs/zh-CN/breadcrumb/custom-separator.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Breadcrumb 面包屑 - - - -Breadcrumb 面包屑导航,作用是告诉访问者他们目前在网站中的位置以及如何返回。 -
- -### 自定义分隔符 - -设置 `separator` 或 `separator-icon` 属性,自定义分隔符。 - - - -
diff --git a/example/src/docs/zh-CN/breadcrumb/normal-item.md b/example/src/docs/zh-CN/breadcrumb/normal-item.md deleted file mode 100644 index 74a7691ef..000000000 --- a/example/src/docs/zh-CN/breadcrumb/normal-item.md +++ /dev/null @@ -1,29 +0,0 @@ -
-

- -

- -## Breadcrumb 面包屑 - - - -Breadcrumb 面包屑导航,作用是告诉访问者他们目前在网站中的位置以及如何返回。 -
- -### 基本用法 - - - -
- -### Breadcrumb 属性 - - - -
- -### Breadcrumb-Item 属性 - - - -
diff --git a/example/src/docs/zh-CN/breadcrumb/options.md b/example/src/docs/zh-CN/breadcrumb/options.md deleted file mode 100644 index fa1a3d5e3..000000000 --- a/example/src/docs/zh-CN/breadcrumb/options.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Breadcrumb 面包屑 - - - -Breadcrumb 面包屑导航,作用是告诉访问者他们目前在网站中的位置以及如何返回。 -
- -### 自定义分隔符 - -设置 `options` 设置面包屑的数据,设置 `textField` 属性,自定义显示字段,默认字段值为 `label`。 - - - -
diff --git a/example/src/docs/zh-CN/bulletin-board/base-on-route.md b/example/src/docs/zh-CN/bulletin-board/base-on-route.md deleted file mode 100644 index 891c5b7e5..000000000 --- a/example/src/docs/zh-CN/bulletin-board/base-on-route.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## BulletinBoard 公告牌 - - - -BulletinBoard 公告牌组件,展现需要重点关注的信息。 -
- -### 基于Route的跳转 - -基于 Route 的跳转是根据数据中的 `route` 字段进行跳转的。 - - - -
diff --git a/example/src/docs/zh-CN/bulletin-board/base-on-url.md b/example/src/docs/zh-CN/bulletin-board/base-on-url.md deleted file mode 100644 index 03e419470..000000000 --- a/example/src/docs/zh-CN/bulletin-board/base-on-url.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## BulletinBoard 公告牌 - - - -BulletinBoard 公告牌组件,展现需要重点关注的信息。 -
- -### 基于Url的跳转 - -基于 Url 的跳转是根据数据中的 `url` 和 `target` 字段进行跳转的。 - - - -
diff --git a/example/src/docs/zh-CN/bulletin-board/basic-usage.md b/example/src/docs/zh-CN/bulletin-board/basic-usage.md deleted file mode 100644 index 133ebdfe3..000000000 --- a/example/src/docs/zh-CN/bulletin-board/basic-usage.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## BulletinBoard 公告牌 - - - -BulletinBoard 公告牌组件,展现需要重点关注的信息。 -
- -### 基本用法 - -必须设置 `data` 属性设置公告牌公告信息数据,以及 `tab-title` 属性设置每个公告牌标题。 - - - -
- - diff --git a/example/src/docs/zh-CN/bulletin-board/bulletin-board-title.md b/example/src/docs/zh-CN/bulletin-board/bulletin-board-title.md deleted file mode 100644 index a67d49b2f..000000000 --- a/example/src/docs/zh-CN/bulletin-board/bulletin-board-title.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## BulletinBoard 公告牌 - - - -BulletinBoard 公告牌组件,展现需要重点关注的信息。 -
- -### 公告牌标题 - -可通过 `title` 设置公告牌标题。 - - - -
diff --git a/example/src/docs/zh-CN/bulletin-board/custom-new-bulletin-icon.md b/example/src/docs/zh-CN/bulletin-board/custom-new-bulletin-icon.md deleted file mode 100644 index 9969302fe..000000000 --- a/example/src/docs/zh-CN/bulletin-board/custom-new-bulletin-icon.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## BulletinBoard 公告牌 - - - -BulletinBoard 公告牌组件,展现需要重点关注的信息。 -
- -### 自定义新公告前缀 - -可通过 `icon` 自定义新公告前缀图标。 - - - -
diff --git a/example/src/docs/zh-CN/bulletin-board/custom-tab-title.md b/example/src/docs/zh-CN/bulletin-board/custom-tab-title.md deleted file mode 100644 index 24b073fba..000000000 --- a/example/src/docs/zh-CN/bulletin-board/custom-tab-title.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## BulletinBoard 公告牌 - - - -BulletinBoard 公告牌组件,展现需要重点关注的信息。 -
- -### 选项卡标题 - -可通过 `tab-title` 属性自定义选项卡标题。 - - - -
diff --git a/example/src/docs/zh-CN/bulletin-board/default-active-tab.md b/example/src/docs/zh-CN/bulletin-board/default-active-tab.md deleted file mode 100644 index 0323ab4fb..000000000 --- a/example/src/docs/zh-CN/bulletin-board/default-active-tab.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## BulletinBoard 公告牌 - - - -BulletinBoard 公告牌组件,展现需要重点关注的信息。 -
- -### 默认激活的选项卡 - -可通过 `active-name` 设置默认激活的选项卡,从 `1` 开始计算。 - - - -
diff --git a/example/src/docs/zh-CN/bulletin-board/show-more-link.md b/example/src/docs/zh-CN/bulletin-board/show-more-link.md deleted file mode 100644 index 01ef5e9e0..000000000 --- a/example/src/docs/zh-CN/bulletin-board/show-more-link.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## BulletinBoard 公告牌 - - - -BulletinBoard 公告牌组件,展现需要重点关注的信息。 -
- -### 显示 “更多” 链接 - -可通过 `more-link` 显示并设置更多链接。 `show-more` 设置是否显示更多按钮,默认为 true。 - - - -
diff --git a/example/src/docs/zh-CN/button-group/basic-usage.md b/example/src/docs/zh-CN/button-group/basic-usage.md deleted file mode 100644 index 498f0fde9..000000000 --- a/example/src/docs/zh-CN/button-group/basic-usage.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## ButtonGroup 按钮组 - - - -以按钮组的方式出现,常用于多项类似操作。 -
- -### 基本用法 - -通过 `v-model` 设置默认选中的按钮,并实现双向绑定。通过 `value` 也可设置默认选中按钮,但不能进行双向绑定。 - - - -
- - diff --git a/example/src/docs/zh-CN/button-group/button-group-data.md b/example/src/docs/zh-CN/button-group/button-group-data.md deleted file mode 100644 index 90759a75e..000000000 --- a/example/src/docs/zh-CN/button-group/button-group-data.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Buttongroup 按钮组 - - - -以按钮组的方式出现,常用于多项类似操作。 -
- -### 按钮组数据 - -通过 `data` 属性设置按钮组数据,对象中的 text 为按钮显示文本,value 用于双向绑定时指定的值。 - - - -
diff --git a/example/src/docs/zh-CN/button-group/default-slot-usage.md b/example/src/docs/zh-CN/button-group/default-slot-usage.md deleted file mode 100644 index b19683fc8..000000000 --- a/example/src/docs/zh-CN/button-group/default-slot-usage.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Buttongroup 按钮组 - - - -以按钮组的方式出现,常用于多项类似操作。 -
- -### 默认插槽 - -使用默认插槽的方式时,ButtonGroup 的 `data、text-field、value-field、value / v-model、size` 属性对插槽中的按钮将不再生效。 - -但可根据使用场景在 Button 组件标签上对不同按钮设置不同的属性,具体参考 Button 组件属性。 - - - -
diff --git a/example/src/docs/zh-CN/button-group/dynamic-disable.md b/example/src/docs/zh-CN/button-group/dynamic-disable.md deleted file mode 100644 index 896c3ea33..000000000 --- a/example/src/docs/zh-CN/button-group/dynamic-disable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Buttongroup 按钮组 - - - -以按钮组的方式出现,常用于多项类似操作。 -
- -### 禁用状态 - -设置 `disabled` 属性为 true 可禁用整个按钮组。 - - - -
diff --git a/example/src/docs/zh-CN/button-group/plain-button-group.md b/example/src/docs/zh-CN/button-group/plain-button-group.md deleted file mode 100644 index 1bec414ec..000000000 --- a/example/src/docs/zh-CN/button-group/plain-button-group.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Buttongroup 按钮组 - - - -以按钮组的方式出现,常用于多项类似操作。 -
- -### 朴素按钮 - -设置 `plain` 属性为 true 可显示为朴素按钮样式。 - - - -
diff --git a/example/src/docs/zh-CN/button-group/size.md b/example/src/docs/zh-CN/button-group/size.md deleted file mode 100644 index 439bc91d7..000000000 --- a/example/src/docs/zh-CN/button-group/size.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## ButtonGroup 按钮组 - - - -以按钮组的方式出现,常用于多项类似操作。 -
- -### 设置组件大小 - -可以设置为:`medium`,`small`,`mini` - diff --git a/example/src/docs/zh-CN/button-group/text-value-field.md b/example/src/docs/zh-CN/button-group/text-value-field.md deleted file mode 100644 index 0a3d87ef6..000000000 --- a/example/src/docs/zh-CN/button-group/text-value-field.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Buttongroup 按钮组 - - - -以按钮组的方式出现,常用于多项类似操作。 -
- -### 数据字段映射 - -若按钮组数据对象中的字段不是默认的 text 和 value ,则可通过 `text-field`、`value-field` 属性进行映射。 - - - -
diff --git a/example/src/docs/zh-CN/button/autofocus.md b/example/src/docs/zh-CN/button/autofocus.md deleted file mode 100644 index ca3aa3a99..000000000 --- a/example/src/docs/zh-CN/button/autofocus.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Button 按钮 - - - -常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。 - -
- -### 聚焦 - -通过 `autofocus` 属性设置是否默认聚焦。 - - - -
diff --git a/example/src/docs/zh-CN/button/basic-usage.md b/example/src/docs/zh-CN/button/basic-usage.md deleted file mode 100644 index f5133640a..000000000 --- a/example/src/docs/zh-CN/button/basic-usage.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Button 按钮 - - - -常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。 -
- -### 基本用法 - - - -
- - - -
diff --git a/example/src/docs/zh-CN/button/button-events.md b/example/src/docs/zh-CN/button/button-events.md deleted file mode 100644 index f4a518e41..000000000 --- a/example/src/docs/zh-CN/button/button-events.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Button 按钮 - - - -常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。 -
- -### 事件 - -按钮的单击事件,该示例中单击按钮将会出现提示信息。 - - - -
diff --git a/example/src/docs/zh-CN/button/button-group.md b/example/src/docs/zh-CN/button/button-group.md deleted file mode 100644 index a8f84f733..000000000 --- a/example/src/docs/zh-CN/button/button-group.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Button 按钮 - - - -常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。 -
- -### 按钮组 - - - -
diff --git a/example/src/docs/zh-CN/button/button-size.md b/example/src/docs/zh-CN/button/button-size.md deleted file mode 100644 index 743f0a334..000000000 --- a/example/src/docs/zh-CN/button/button-size.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Button 按钮 - - - -常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。 -
- -### 尺寸 - -通过 `size` 属性设置按钮不同的大小尺寸,包括 large、medium、small、mini 四种不同大小。不设置时为默认尺寸。 - - - -
diff --git a/example/src/docs/zh-CN/button/button-style.md b/example/src/docs/zh-CN/button/button-style.md deleted file mode 100644 index 6ffc93a1c..000000000 --- a/example/src/docs/zh-CN/button/button-style.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Button 按钮 - - - -常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。 -
- -### 主题样式 - -通过 `type` 属性可以设置不同的主题样式,主要包括 primary、success、info、warning、danger、text。 - - - -
diff --git a/example/src/docs/zh-CN/button/circle-button.md b/example/src/docs/zh-CN/button/circle-button.md deleted file mode 100644 index 7f7ef6fb2..000000000 --- a/example/src/docs/zh-CN/button/circle-button.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Button 按钮 - - - -常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。 -
- -### 圆形按钮 - -直接配置 `circle` 属性为 true,即可展示为圆形按钮的形式。 - - - -
diff --git a/example/src/docs/zh-CN/button/default-focus.md b/example/src/docs/zh-CN/button/default-focus.md deleted file mode 100644 index e5735a2c9..000000000 --- a/example/src/docs/zh-CN/button/default-focus.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Button 按钮 - - - -常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。 -
- -### 默认聚焦 - -配置 `autofocus` 属性的按钮,将默认展示为聚焦状态。 - - - -
diff --git a/example/src/docs/zh-CN/button/dynamic-disable-button.md b/example/src/docs/zh-CN/button/dynamic-disable-button.md deleted file mode 100644 index 9703d1060..000000000 --- a/example/src/docs/zh-CN/button/dynamic-disable-button.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Button 按钮 - - - -常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。 -
- -### 动态禁用按钮 - -设置 `disabled` 属性为 true 后,可以禁用按钮。 - - - -
diff --git a/example/src/docs/zh-CN/button/icon-button.md b/example/src/docs/zh-CN/button/icon-button.md deleted file mode 100644 index a73d5a8be..000000000 --- a/example/src/docs/zh-CN/button/icon-button.md +++ /dev/null @@ -1,24 +0,0 @@ -
-

- -

- -## Button 按钮 - - - -常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。 -
- -### 图标按钮 - -指定 `icon` 属性值为需要的 Icon 图标即可展示为图标按钮。 - -:::tip Icon 图标用法 -先从 `@opentiny/vue-icon` 中导入需要的 Icon,再在 data 函数中初始化 Icon 组件并赋值给一个属性。最后在模板中通过 `icon` 属性进行引用。 -通过 `native-type` 设置 button、image 两种按钮的表单类型。该属性仅当属性 type 为 button 或 image 时使用。该属性的可选值为 button / submit / reset。 -::: - - - -
diff --git a/example/src/docs/zh-CN/button/img-button.md b/example/src/docs/zh-CN/button/img-button.md deleted file mode 100644 index cb959ba38..000000000 --- a/example/src/docs/zh-CN/button/img-button.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Button 按钮 - - - -常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。 -
- -### 图片按钮 - -以默认插槽的用法嵌入 img 标签,并引入图片。 - - - -
diff --git a/example/src/docs/zh-CN/button/plain-button.md b/example/src/docs/zh-CN/button/plain-button.md deleted file mode 100644 index 8c7825c99..000000000 --- a/example/src/docs/zh-CN/button/plain-button.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Button 按钮 - - - -常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。 -
- -### 朴素按钮 - -配置 `plain` 属性为 true,即可展示为朴素按钮的形式。 - - - -
diff --git a/example/src/docs/zh-CN/button/reset-time.md b/example/src/docs/zh-CN/button/reset-time.md deleted file mode 100644 index c8b005b5c..000000000 --- a/example/src/docs/zh-CN/button/reset-time.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Button 按钮 - - - -常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。 -
- -### 防止表单重复提交 - -通过 `reset-time` 属性可设置单击后按钮禁用的时长,默认的禁用时长为 1000 毫秒。 - -可用于防止按钮连续点击出现表单重复提交的问题。 - - - -
diff --git a/example/src/docs/zh-CN/button/round.md b/example/src/docs/zh-CN/button/round.md deleted file mode 100644 index 4026d6f21..000000000 --- a/example/src/docs/zh-CN/button/round.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Button 按钮 - - - -常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。 - -
- -### 防止表单重复提交 - -通过 `round` 属性设置是否圆角按钮。 - - - -
diff --git a/example/src/docs/zh-CN/button/show-loading.md b/example/src/docs/zh-CN/button/show-loading.md deleted file mode 100644 index 921c23871..000000000 --- a/example/src/docs/zh-CN/button/show-loading.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Button 按钮 - - - -常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。 -
- -### 显示加载中 - -直接配置 `loading` 属性为 true,即可展示为加载中的样式。 - - - -
diff --git a/example/src/docs/zh-CN/button/text-button.md b/example/src/docs/zh-CN/button/text-button.md deleted file mode 100644 index ee13ed83f..000000000 --- a/example/src/docs/zh-CN/button/text-button.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Button 按钮 - - - -常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。 -
- -### 文字按钮 - -设置 `type` 属性为 `text` 即为文字按钮,可在标签子级或者通过 `text` 属性设置显示内容。 - - - -
diff --git a/example/src/docs/zh-CN/calendar/basic-usage.md b/example/src/docs/zh-CN/calendar/basic-usage.md deleted file mode 100644 index 61306605b..000000000 --- a/example/src/docs/zh-CN/calendar/basic-usage.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Calendar 日历 - - - -按照日历形式展示数据的容器。 -
- -### 基本用法 - -默认以月的形式展示当月的每一天。 - - - -
- - diff --git a/example/src/docs/zh-CN/calendar/calendar-mode.md b/example/src/docs/zh-CN/calendar/calendar-mode.md deleted file mode 100644 index 9cae0b952..000000000 --- a/example/src/docs/zh-CN/calendar/calendar-mode.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Calendar 日历 - - - -按照日历形式展示数据的容器。 -
- -### 显示模式 - -通过 `mode` 属性指定以年的形式显示,将展示当年的每个月份。可选值有 year、month。 - - - -
diff --git a/example/src/docs/zh-CN/calendar/custom-calendar-toolbar.md b/example/src/docs/zh-CN/calendar/custom-calendar-toolbar.md deleted file mode 100644 index 2259b180d..000000000 --- a/example/src/docs/zh-CN/calendar/custom-calendar-toolbar.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Calendar 日历 - - - -按照日历形式展示数据的容器。 -
- -### 自定义工具栏 - -通过作用域插槽 tool 自定义需要的工具栏。 - - - -
diff --git a/example/src/docs/zh-CN/calendar/custom-day-cell.md b/example/src/docs/zh-CN/calendar/custom-day-cell.md deleted file mode 100644 index a7588d51c..000000000 --- a/example/src/docs/zh-CN/calendar/custom-day-cell.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Calendar 日历 - - - -按照日历形式展示数据的容器。 -
- -### 自定义日期单元格 - -通过作用域插槽 day 自定义日期单元格。 - - - -
diff --git a/example/src/docs/zh-CN/calendar/dynamic-add-schedule.md b/example/src/docs/zh-CN/calendar/dynamic-add-schedule.md deleted file mode 100644 index 45bf81630..000000000 --- a/example/src/docs/zh-CN/calendar/dynamic-add-schedule.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Calendar 日历 - - - -按照日历形式展示数据的容器。 -
- -### 添加日程事件 - -通过 events 属性可以指定事件列表,它是一个对象数组,对象中包含如下字段: - -:::tip events 说明 -time:指定需要展示事件的日期 -title:指定事件标题 -content:指定事件的具体内容 type:指定当鼠标悬停在事件标题上时,弹出的展示事件具体内容的提示框的主题,包括 warning、error、info、success -::: - - - -
diff --git a/example/src/docs/zh-CN/calendar/show-selected-date.md b/example/src/docs/zh-CN/calendar/show-selected-date.md deleted file mode 100644 index 0aaf9f0be..000000000 --- a/example/src/docs/zh-CN/calendar/show-selected-date.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Calendar 日历 - - - -按照日历形式展示数据的容器。 -
- -### 显示选中日期 - -以月的形式展示时,指定 show-selected 属性后,单击日期单元格,将会在日历框上方展示当前选中的日期。 - - - -
diff --git a/example/src/docs/zh-CN/carousel/autoplay.md b/example/src/docs/zh-CN/carousel/autoplay.md deleted file mode 100644 index 74414f58a..000000000 --- a/example/src/docs/zh-CN/carousel/autoplay.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Carousel 走马灯 - - - -常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。 -
- -### 自动切换 - -配置 `autoplay` 属性为 true 后,走马灯的幻灯片内容将自动轮播切换。 - - - -
diff --git a/example/src/docs/zh-CN/carousel/basic-usage.md b/example/src/docs/zh-CN/carousel/basic-usage.md deleted file mode 100644 index 6eb8342ac..000000000 --- a/example/src/docs/zh-CN/carousel/basic-usage.md +++ /dev/null @@ -1,29 +0,0 @@ -
-

- -

- -## Carousel 走马灯 - - - -常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。 -
- -### 基本用法 - - - -
- -### Carousel 属性 - - - -
- -### Carousel-Item 属性 - - - -
diff --git a/example/src/docs/zh-CN/carousel/card-mode.md b/example/src/docs/zh-CN/carousel/card-mode.md deleted file mode 100644 index 7defc0497..000000000 --- a/example/src/docs/zh-CN/carousel/card-mode.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Carousel 走马灯 - - - -常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。 -
- -### 基本用法 - -配置 `type` 属性为 card 后,走马灯将以卡片形式进行展示。 - - - -
diff --git a/example/src/docs/zh-CN/carousel/carousel-arrow.md b/example/src/docs/zh-CN/carousel/carousel-arrow.md deleted file mode 100644 index 753e1e184..000000000 --- a/example/src/docs/zh-CN/carousel/carousel-arrow.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Carousel 走马灯 - - - -常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。 -
- -### 总是显示切换箭头 - - - -### hover 时显示切换箭头 - - - -### 隐藏切换箭头 - - - -
diff --git a/example/src/docs/zh-CN/carousel/close-loop.md b/example/src/docs/zh-CN/carousel/close-loop.md deleted file mode 100644 index 06837daad..000000000 --- a/example/src/docs/zh-CN/carousel/close-loop.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Carousel 走马灯 - - - -常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。 -
- -### 关闭循环轮播 - -配置 `loop` 属性为 false 后,若走马灯幻灯片已切换到最后一项,则将不能再从第一项开始循环切换。即切换到最后一项时,右侧切换箭头不再显示,切换到第一项时,左侧切换箭头不再显示。 - - - -
diff --git a/example/src/docs/zh-CN/carousel/custom-height.md b/example/src/docs/zh-CN/carousel/custom-height.md deleted file mode 100644 index df64e208a..000000000 --- a/example/src/docs/zh-CN/carousel/custom-height.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Carousel 走马灯 - - - -常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。 -
- -### 关闭循环轮播 - - - -
diff --git a/example/src/docs/zh-CN/carousel/indicator-trigger.md b/example/src/docs/zh-CN/carousel/indicator-trigger.md deleted file mode 100644 index d151842da..000000000 --- a/example/src/docs/zh-CN/carousel/indicator-trigger.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Carousel 走马灯 - - - -常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。 -
- -### 指示器和触发方式 - -走马灯指示器默认显示在幻灯片内容上,配置 `indicator-position` 为 outside 后,将显示在外部。
- -配置 `trigger` 为 click ,可以修改指示器触发方式为单击,默认鼠标悬停到指示器时,走马灯幻灯片就会对应切换。 - - - -
diff --git a/example/src/docs/zh-CN/carousel/initial-index.md b/example/src/docs/zh-CN/carousel/initial-index.md deleted file mode 100644 index c95906fc8..000000000 --- a/example/src/docs/zh-CN/carousel/initial-index.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Carousel 走马灯 - - - -常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。 -
- -### 播放开始位置 - - - -
diff --git a/example/src/docs/zh-CN/carousel/manual-play.md b/example/src/docs/zh-CN/carousel/manual-play.md deleted file mode 100644 index e29f7c2a2..000000000 --- a/example/src/docs/zh-CN/carousel/manual-play.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Carousel 走马灯 - - - -常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。 -
- -### 手动轮播 - -调用 `setActiveItem()`、`next()`、`prev()` 方法可根据需要进行轮播。`initial-index` 属性可以指定初始激活的幻灯片索引。 - - - -
diff --git a/example/src/docs/zh-CN/carousel/play-interval.md b/example/src/docs/zh-CN/carousel/play-interval.md deleted file mode 100644 index e24ba2f2d..000000000 --- a/example/src/docs/zh-CN/carousel/play-interval.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Carousel 走马灯 - - - -常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。 -
- -### 轮播间隔时间 - -走马灯幻灯片轮播间隔时间默认为 3000 毫秒,通过 `interval` 属性可以自定义。 - - - -
diff --git a/example/src/docs/zh-CN/carousel/show-title.md b/example/src/docs/zh-CN/carousel/show-title.md deleted file mode 100644 index 130f19a23..000000000 --- a/example/src/docs/zh-CN/carousel/show-title.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Carousel 走马灯 - - - -常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。 -
- -### 显示标题 -通过 `title` 配置显示标题,需要与 `show-title` 结合使用。 - - -
diff --git a/example/src/docs/zh-CN/carousel/up-down-carousel.md b/example/src/docs/zh-CN/carousel/up-down-carousel.md deleted file mode 100644 index 73041c6e0..000000000 --- a/example/src/docs/zh-CN/carousel/up-down-carousel.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Carousel 走马灯 - - - -常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。 -
- -### 纵向轮播 - -配置 `type` 属性为 vertical 即可实现纵向轮播。 - - - -
diff --git a/example/src/docs/zh-CN/cascader-panel/basic-usage.md b/example/src/docs/zh-CN/cascader-panel/basic-usage.md deleted file mode 100644 index 83f78b233..000000000 --- a/example/src/docs/zh-CN/cascader-panel/basic-usage.md +++ /dev/null @@ -1,31 +0,0 @@ -
-

- -

- -## CascaderPanel 级联面板 - - - -级联面板与级联选择器一样,有单选、多选、动态加载等多种功能。 -
- -### 基本用法 - -通过 `options` 来指定选项,也可通过 `props` 来设置多选、动态加载等功能,具体详情见下方 API 表格。 - - - -
- -### CascaderPanel 属性 - - - -
- -### CascaderPanel Props - - - -
diff --git a/example/src/docs/zh-CN/cascader-panel/cascader-panel-props.md b/example/src/docs/zh-CN/cascader-panel/cascader-panel-props.md deleted file mode 100644 index b37f06e85..000000000 --- a/example/src/docs/zh-CN/cascader-panel/cascader-panel-props.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## CascaderPanel 级联面板 - - - -级联面板与级联选择器一样,有单选、多选、动态加载等多种功能。 - -
- -### Props 选项 - -:::tip Props - -通过 `children` 指定子级选项,默认值为 children。 -通过 `emitPath` 是否返回由该节点所在的各级菜单的值所组成的数组。 -通过 `label` 指定显示选项 label 值,默认为 label。 -通过 `value` 指定值选项 value 值,默认为 value - -::: - - - - diff --git a/example/src/docs/zh-CN/cascader-panel/change.md b/example/src/docs/zh-CN/cascader-panel/change.md deleted file mode 100644 index 4a305e672..000000000 --- a/example/src/docs/zh-CN/cascader-panel/change.md +++ /dev/null @@ -1,31 +0,0 @@ -
-

- -

- -## CascaderPanel 级联面板 - - - -级联面板与级联选择器一样,有单选、多选、动态加载等多种功能。 - -
- -### 选中节点变化 - -通过 `change` 点击节点后触发的事件,回调参数为 选中节点的值 -通过 `clearCheckedNodes` 清除选中的节点。 -通过 `getCheckedNodes` 获取选中的节点。 - - - - -
- -### 展开节点发生变化 - -通过 `expand-change` 点击展开节点发生变化时触发,回调参数为 各父级选项值组成的数组 - - - -
diff --git a/example/src/docs/zh-CN/cascader-panel/custom-option-content.md b/example/src/docs/zh-CN/cascader-panel/custom-option-content.md deleted file mode 100644 index 5452915ec..000000000 --- a/example/src/docs/zh-CN/cascader-panel/custom-option-content.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## CascaderPanel 级联面板 - - - -级联面板与级联选择器一样,有单选、多选、动态加载等多种功能。 -
- -### 自定义节点内容 - -可以通过 `scoped slot` 对级联面板的备选项的节点内容进行自定义,`scoped slot` 会传入两个字段 `node` 和 `data`,分别表示当前节点的 Node 对象和数据。 - - - -
diff --git a/example/src/docs/zh-CN/cascader/auto-load.md b/example/src/docs/zh-CN/cascader/auto-load.md deleted file mode 100644 index eda902ff3..000000000 --- a/example/src/docs/zh-CN/cascader/auto-load.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Cascader 级联选择器 - - - -当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。 -
- -### 动态加载 - -当选中某一级时,动态加载该级下的选项。通过 `props` 属性中的 `lazy` 开启动态加载,并通过 `lazyload` 来设置加载数据源的方法。`lazyload` 方法有两个参数,第一个参数 node 为当前点击的节点,第二个 resolve 为数据加载完成的回调(必须调用)。为了更准确的显示节点的状态,还可以对节点数据添加是否为叶子节点的标志位 (默认字段为 leaf,可通过 props.leaf 修改),否则会简单的以有无子节点来判断是否为叶子节点。 - - - -
- -### 动态加载且父子级不相关联 - -当选中某一级时,动态加载该级下的选项。通过 `props` 属性中的 `lazy` 开启动态加载,并通过 `lazyload` 来设置加载数据源的方法。通过 `props` 属性中的 `checkStrictly` 开启父子级不相关联。 - - - -
diff --git a/example/src/docs/zh-CN/cascader/basic-usage.md b/example/src/docs/zh-CN/cascader/basic-usage.md deleted file mode 100644 index 5634bb279..000000000 --- a/example/src/docs/zh-CN/cascader/basic-usage.md +++ /dev/null @@ -1,39 +0,0 @@ -
-

- -

- -## Cascader 级联选择器 - - - -当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。 -
- -### 基本用法 - -通过 `options` 属性指定选项数组即可渲染出一个级联选择器。 - - - -
- -### hover 触发子菜单 - -通过 `props.expandTrigger` 可以指定展开子级菜单的触发方式为 `hover`,默认为 `click` 。 - - - -
- -### Cascader 属性 - - - -
- -### Cascader Props - - - -
diff --git a/example/src/docs/zh-CN/cascader/check-strictly.md b/example/src/docs/zh-CN/cascader/check-strictly.md deleted file mode 100644 index 260227c72..000000000 --- a/example/src/docs/zh-CN/cascader/check-strictly.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Cascader 级联选择器 - - - -当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。 -
- -### 父子级不相关联 - -通过 `props.checkStrictly = true` 来设置父子节点取消选中关联,从而达到选择任意一级选项的目的。默认单选模式下,只能选择叶子节点。 - - - -
- -### 多选选择任意一级选项 - -在多选模式下同时取消父子节点关联,选择任意一级选项。 - - - -
diff --git a/example/src/docs/zh-CN/cascader/clearable.md b/example/src/docs/zh-CN/cascader/clearable.md deleted file mode 100644 index e8ad015a3..000000000 --- a/example/src/docs/zh-CN/cascader/clearable.md +++ /dev/null @@ -1,36 +0,0 @@ -
-

- -

- -## Cascader 级联选择器 - - - -当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。 - -
- -### 可清空 - -通过 `clearable` 属性设置输入框可清空。 - - - -
- -### 分隔符 - -通过 `separator` 属性设置选项的分隔符。 - - - -
- -### 尺寸 - -通过 `size` 属性设置尺寸的大小,可选值为 medium / small / mini。 - - - -
diff --git a/example/src/docs/zh-CN/cascader/default-multiple.md b/example/src/docs/zh-CN/cascader/default-multiple.md deleted file mode 100644 index 443c20161..000000000 --- a/example/src/docs/zh-CN/cascader/default-multiple.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Cascader 级联选择器 - - - -当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。 -
- -### 多选 - -通过 `props.multiple = true` 来开启多选模式。 - - - -
- -### 折叠展示 Tag - -在开启多选模式后,默认情况下会展示所有已选中的选项的 Tag,可以使用 `collapse-tags` 来折叠 Tag 。 -通过 `disabled` 设置组件是否禁用,默认值为 false 。 - - -
diff --git a/example/src/docs/zh-CN/cascader/disabled-items.md b/example/src/docs/zh-CN/cascader/disabled-items.md deleted file mode 100644 index b7264d8dc..000000000 --- a/example/src/docs/zh-CN/cascader/disabled-items.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Cascader 级联选择器 - - - -当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。 - -
- -### 禁用选项 - -通过在数据源中设置 `disabled` 字段来声明该选项是禁用的,本例中,`options` 指定的数组中的第一个元素含有 `disabled: true` 键值对,因此是禁用的。在默认情况下,Cascader 会检查数据中每一项的 `disabled` 字段是否为 `true`,如果你的数据中表示禁用含义的字段名不为 `disabled`,可以通过 `props.disabled` 属性来指定(详见 Cascader Props 的 API 表格)。当然,`value`、`label` 和 `children` 这三个字段名也可以通过同样的方式指定。 - - - -
- -### 指定属性值 - -通过 `label` 属性设置指定选项标签为选项对象的某个属性值,默认值为 label。 - - - -
diff --git a/example/src/docs/zh-CN/cascader/events.md b/example/src/docs/zh-CN/cascader/events.md deleted file mode 100644 index d120496d2..000000000 --- a/example/src/docs/zh-CN/cascader/events.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Cascader 级联选择器 - - - -当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。 - -
- -### 事件 - -Cascader 级联选择器的事件有:`change`、`expand-change`、`blur`、`focus`、`visible-change`。 - - - -
- -### 节点返回的数据类型 - -`emitPath` 在选中节点改变时,是否返回由该节点所在的各级菜单的值所组成的数组,若设置 false,则只返回该节点的值 - - - -
diff --git a/example/src/docs/zh-CN/cascader/filterable.md b/example/src/docs/zh-CN/cascader/filterable.md deleted file mode 100644 index 134a800b2..000000000 --- a/example/src/docs/zh-CN/cascader/filterable.md +++ /dev/null @@ -1,52 +0,0 @@ -
-

- -

- -## Cascader 级联选择器 - - - -当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。 - -
- -### 可搜索 - -将 `filterable` 赋值为 `true` 即可打开搜索功能,默认会匹配节点的 `label` 或所有父节点的 `label` (由 `show-all-levels` 决定)中包含输入值的选项。 `empty` 无匹配选项时显示的内容 - - - -
- -### 搜索延时 - -通过 `debounce` 属性可以设置搜索关键词输入的去抖延迟,默认值为 300 毫秒。 - - - -
- -### 多选可搜索 - -多选模式下开启搜索功能。 - - - -
- -### 自定义搜索逻辑 - -` filter-method` 自定义搜索逻辑,第一个参数是节点 node,第二个参数是搜索关键词 keyword,通过返回布尔值表示是否命中,如果需要选择父级,通过 props.checkStrictly = true 来设置父子节点取消选中关联,从而达到选择任意一级选项的目的。默认单选模式下,只能选择叶子节点。 - - - -
- -### 占位文本 - -输入框占位文本。 - - - -
diff --git a/example/src/docs/zh-CN/cascader/props-children.md b/example/src/docs/zh-CN/cascader/props-children.md deleted file mode 100644 index ce3292cfd..000000000 --- a/example/src/docs/zh-CN/cascader/props-children.md +++ /dev/null @@ -1,26 +0,0 @@ -
-

- -

- -## Cascader 级联选择器 - - - -当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。 - -
- -### 指定选项 - -:::tip Props - -通过 `children ` 指定选项的子选项,默认为 children 。 -通过 `value` 指定指定选项的 value 值,默认为 value 。 -通过 `label` 指定选项标签,默认为 label 。 - -::: - - - -
diff --git a/example/src/docs/zh-CN/cascader/show-all-levels.md b/example/src/docs/zh-CN/cascader/show-all-levels.md deleted file mode 100644 index 43b110221..000000000 --- a/example/src/docs/zh-CN/cascader/show-all-levels.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Cascader 级联选择器 - - - -当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。 -
- -### 仅显示最后一级 - -属性 `show-all-levels` 定义了是否显示完整的路径,将其赋值为 `false` 则仅显示最后一级,默认为 `true` ,显示选中项所在的完整路径。 - - - -
diff --git a/example/src/docs/zh-CN/charts/attributes-demo.md b/example/src/docs/zh-CN/charts/attributes-demo.md deleted file mode 100644 index 97573bfdd..000000000 --- a/example/src/docs/zh-CN/charts/attributes-demo.md +++ /dev/null @@ -1,70 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 属性配置示例 - -:::tip 如果某属性加上去之后没有生效,很可能是没有引入相应的模块。例如: -在使用 dataZoom 组件时,需要引入 dataZoom 模块资源 `import 'echarts/lib/component/dataZoom'` 。 -::: - -### 1 设置区域缩放组件 - -可通过 `init-options` 配置组件初始化附加参数,具体可[参考文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/api.html#echarts.init) - - - -### 2 设置extend配置项 - -extend 属性支持数组、对象、函数配置方式,以下3种配置是等效的。 - - - -### 3 修改颜色列表 - - - -### 4 设置暂无数据状态 - - - -### 5 增加自定义内容 - - - - -### 6 隐藏提示框与图例 - - - -### 7 设置图表容器样式 - - - -### 8 设置图表标线与标点 - - - -### 9 设置视觉映射组件 - - - -### 10 设置afterConfig函数 - - - -### 11 设置工具箱 - - - -### 12 设置加载状态 - - diff --git a/example/src/docs/zh-CN/charts/attributes.md b/example/src/docs/zh-CN/charts/attributes.md deleted file mode 100644 index cbf6dea7e..000000000 --- a/example/src/docs/zh-CN/charts/attributes.md +++ /dev/null @@ -1,197 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 自有属性 - -图表自身的属性,例如用于设置数据类型的 `yAxisType`, 是否展示为面积图的 `area`,这样的属性被置于 - `settings` 内,每种图表的自有属性不完全相同,具体参数请参考下述图表文档中的配置项。 - -### 公有属性 - -所有图表都具有的属性,例如 `width`, `events` 等。 - -```vue - -``` - -#### 基本属性 - -| 配置项 | 简介 | 类型 | 默认值 | -| ----- | --- |:----:| --- | -| data | 数据,[参考文档](#/webnova/zh-CN/component/chart/data-config) | object | - | -| settings | 配置项 | object | - | -| width | 宽度 | string | auto | -| height | 高度 | string | 400px | -| events | 事件绑定,[参考文档](#/webnova/zh-CN/component/chart/events) | object | - | -| init-options | init 附加参数,[参考文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/api.html#echarts.init) | object | - | -| tooltip-visible | 是否显示提示框 | boolean | true | -| legend-visible | 是否显示图例 | boolean | true | -| theme | 自定义主题 | object | - | -| theme-name | 自定义主题名称 | string | - | -| judge-width | 是否处理生成图表时的宽度问题 | boolean | false | -| width-change-delay | 容器宽度变化的延迟 | number | 300 | -| resizeable | 是否处理窗口 resize 事件 | boolean | true | -| cancel-resize-check | 是否禁用 resize 时的容器检测 | boolean | false | -| resize-delay | 窗口 resize 事件回调的延迟 | number | 200 | -| change-delay | 属性修改触发图表重绘回调的延迟 | number | 0 | -| set-option-opts | echarts setOption 的第二个参数, [参考文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/api.html#echartsInstance.setOption) | boolean
object | true | -| not-set-unchange | 未发生变化时不参加 setOption 的属性 | array | - | - - - -#### 增加标识元素的属性 - -标识元素包括:markLine、markArea、markPoint,每个种类的图对应的使用方式略有不同, -可以参考 echarts 文档中实现。需要注意的是,设置的标识元素会被增加到每一个指标上,例如一个 -单维度多指标折线图,两条线都会显示对应的标识元素,如果设置只在一个指标线上显示,可以使用 `extend` -属性,直接为 series 设置 mark* 来自由配置。 - -| 配置项 | 简介 | 类型 | -| ----- | --- |:----:| -| mark-line | 标线 | object | -| mark-area | 标点 | object | -| mark-point | 标志区域 | object | - - -:::tip 使用时需先引入对应的组件 -markLine -> `echarts/lib/component/markLine` -markPoint -> `echarts/lib/component/markPoint` -markArea -> `echarts/lib/component/markArea` -::: - -#### 状态属性 - -加载状态和暂无数据状态可以在父组件中通过切换下面两种属性实现。 - -| 配置项 | 简介 | 类型 | 默认值 | -| ----- | --- |:----:| --- | -| loading | 加载状态 | boolean | false | -| data-empty | 暂无数据状态 | boolean | false | - -#### 钩子函数 - -共有属性中的钩子函数用于在配置项生成过程中进行调整以及获取实例。 - -| 配置项 | 说明 | 参数 | -| ----- | --- | --- | -| before-config | 对数据提前进行额外的处理,
在数据转化为配置项开始前触发 | 参数为 data,返回值为表格数据 | -| after-config | 对生成好的echarts配置进行额外的处理,
在数据转化为配置项结束后触发 | 参数为 options,返回值为 echarts 配置 | -| after-set-option | 生成图之后获取echarts实例 | 参数为echarts实例 | -| after-set-option-once | 生成图后获取echarts实例
(只执行一次) | 参数为echarts实例 | - -#### extend 属性 - -为了能够更方便的设置属性配置项等,可以通过extend属性实现对已配置好的内部属性进行单独的设置, -extend为对象类型,对象内的属性可以是函数,也可以对象,也可以是其他类型的值 - -- 当属性为函数时,设置的是函数的返回值 -- 当属性为对象时,如果在options中对应的属性为对象(eg: tooltip)或包含对象的数组(eg: series), -对应的配置会被合并,否则将直接覆盖对应的配置 - - - -#### echarts options 属性 - -与echarts配置项对应的属性也被加到了组件上,用于直接**覆盖** options 原有的对应属性,使用方式可参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html) - -```yaml -grid: [object, array], -colors: array, -visualMap: [object, array], -dataZoom: [object, array], -toolbox: [object, array], -title: object, -legend: [object, array], -xAxis: [object, array], -yAxis: [object, array], -radar: object, -tooltip: object, -axisPointer: object, -brush: [object, array], -geo: object, -timeline: [object, array], -graphic: [object, array], -series: [object, array], -backgroundColor: [object, string], -textStyle: object, -animation: object -``` - - -### 事件 - -渲染成功后会通过事件传递给父组件。 - -| 方法名 | 说明 | -| ----- | --- | -| ready | 图表渲染完成后触发,每次渲染都会触发一次 | -| ready-once | 只会在首次渲染完成后触发 | - -### 按需引入模块 - -:::danger 如果 echarts options 某属性加上去之后没有生效,很可能是没有引入相应的模块 -::: - -例如: -在使用 dataZoom 组件时,需要引入 dataZoom 模块资源 `import 'echarts/lib/component/dataZoom'` 。 - - - -
- -**按需引入模块的路径如下:** - -```js -import 'echarts/lib/component/grid' - -import 'echarts/lib/component/polar' - -import 'echarts/lib/component/geo' - -import 'echarts/lib/component/singleAxis' - -import 'echarts/lib/component/parallel' - -import 'echarts/lib/component/calendar' - -import 'echarts/lib/component/graphic' - -import 'echarts/lib/component/toolbox' - -import 'echarts/lib/component/axisPointer' - -import 'echarts/lib/component/brush' - -import 'echarts/lib/component/title' - -import 'echarts/lib/component/timeline' - -import 'echarts/lib/component/markPoint' - -import 'echarts/lib/component/markLine' - -import 'echarts/lib/component/markArea' - -import 'echarts/lib/component/legendScroll' - -import 'echarts/lib/component/dataZoom' - -import 'echarts/lib/component/dataZoomInside' - -import 'echarts/lib/component/dataZoomSlider' - -import 'echarts/lib/component/visualMap' - -import 'echarts/lib/component/visualMapContinuous' - -import 'echarts/lib/component/visualMapPiecewise' -``` diff --git a/example/src/docs/zh-CN/charts/autonavi-map.md b/example/src/docs/zh-CN/charts/autonavi-map.md deleted file mode 100644 index 44703b8dd..000000000 --- a/example/src/docs/zh-CN/charts/autonavi-map.md +++ /dev/null @@ -1,39 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。 - -:::warning 高德地图需要外网访问权限才能正常使用 -::: - - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| key | 高德地图 access_key | string | 可[由此](https://lbs.amap.com/api/webservice/guide/create-project/get-key)获取 | -| v | 高德地图版本 | string | 默认1.4.3 | -| amap | 高德地图配置项 | object | 参考高德地图文档配置 | -| useOuterMap | 使用全局的地图依赖 | boolean | - | - -> 高德地图在与其他地图搭配使用时,需要额外引入相应的 echarts 模块,例如使用热力图,则需要`import 'echarts/lib/chart/heatmap'`。 - -> 使用 script 引入高德地图后,配置 useOuterMap 可以阻止组件对地图资源的引用 - - -> 高德地图 `` diff --git a/example/src/docs/zh-CN/charts/baidu-map.md b/example/src/docs/zh-CN/charts/baidu-map.md deleted file mode 100644 index 3057fd313..000000000 --- a/example/src/docs/zh-CN/charts/baidu-map.md +++ /dev/null @@ -1,37 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。 - -:::warning 百度地图需要外网访问权限才能正常使用 -::: - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| key | 百度地图 access_key | string | 可[由此](http://lbsyun.baidu.com/apiconsole/key)获取 | -| v | 百度地图版本 | string | 默认2.0 | -| bmap | 百度地图配置项 | object | 参考[文档](https://github.com/ecomfe/echarts/tree/master/extension/bmap#使用)配置 | -| useOuterMap | 使用全局的地图依赖 | boolean | - | - -> 百度地图在与其他地图搭配使用时,需要额外引入相应的 echarts 模块,例如使用热力图,则需要`import 'echarts/lib/chart/heatmap'`。 - -> 使用 script 引入百度地图后,配置 useOuterMap 可以阻止组件对地图资源的引用 - -> 百度地图 `` diff --git a/example/src/docs/zh-CN/charts/bar.md b/example/src/docs/zh-CN/charts/bar.md deleted file mode 100644 index d112e3492..000000000 --- a/example/src/docs/zh-CN/charts/bar.md +++ /dev/null @@ -1,75 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。 - - - -### 指定指标维度 - - - -### 排序条形图 - - - -### 条形轴配置双 y 轴 - - - -### 设置 legend 别名 - - - -### 堆叠条形图 - - - -### 设置纵轴为连续的数值轴 - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| dimension | 维度 | array | 默认columns第一项为维度 | -| metrics | 指标 | array | 默认columns第二项起为指标 | -| xAxisType | 上下坐标轴数据类型 | array | 可选值: KMB, normal, percent | -| xAxisName | 上下坐标轴标题 | array | - | -| axisSite | 指标所在的轴 | object | 默认不在top轴的指标都在bottom轴 | -| stack | 堆叠选项 | object | - | -| digit | 设置数据类型为percent时保留的位数 | number | 默认为2 | -| dataOrder | 设置数据排序方式 | boolean, object | 默认为false | -| scale | 是否是脱离 0 值比例 | array | 默认为[false, false],表示上下两个轴都不会脱离0值比例。设置成 true 后坐标刻度不会强制包含零刻度 | -| min | 上下坐标轴最小值 | array | - | -| max | 上下坐标轴最大值 | array | - | -| labelMap | 设置指标的别名,同时作用于提示框和图例| object | - | -| legendName | 设置图表上方图例的别名 | object | - | -| label | 设置图形上的文本标签 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-bar.label) | -| itemStyle | 图形样式 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-bar.itemStyle) | -| yAxisType | 纵轴的类型 | string | 可选值'category','value',默认为'category' | -| opacity | 透明度 | number | - | - -> 备注1. axisSite 可以设置 top 和 bottom,例如示例所示 `axisSite: { top: ['占比'] }` 即将占比的数据置于上轴上。 - -> 备注2. stack 用于将两数据堆叠起来,例如实例中所示`stack: { '销售额': ['销售额-1季度', '销售额-2季度'] }` 即将'销售额-1季度', '销售额-2季度'相应的数据堆叠在一起。 - -> 备注3. dataOrder 用于设置数据的排序方式,用于更加清晰的展示数据的升降。例如: `{ label: '成本', order: 'asc }` 表示数据按照成本指标升序展示,降序为`desc`。 - -> 备注4. min和max的值可以直接设置为数字,例如:`[100, 300]`;也可以设置为`['dataMin', 'dataMin']`, `['dataMax', 'dataMax']`,此时表示使用该坐标轴上的最小值或最大值为最小或最大刻度。 - -> 备注5. 为了优化连续的数值型横轴显示多指标的时候样式,在此情况下默认设置opacity为0.5。 diff --git a/example/src/docs/zh-CN/charts/base.md b/example/src/docs/zh-CN/charts/base.md deleted file mode 100644 index 8fb7d2e01..000000000 --- a/example/src/docs/zh-CN/charts/base.md +++ /dev/null @@ -1,41 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 `eCharts v4.4.0` 封装,一个纯 Javascript 的图表库。 - -
- -### 基本用法 - -图表组件支持 `双向数据绑定`,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。 -可通过 `theme` 自定义主题 - -:::warning - -百度地图和高德地图需要外网访问权限才能正常使用 - -::: - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| ------ | -------- | ------ | -------------------------------------------------------------------------------- | -| type | 图表类型 | string | 可选值 'bar','histogram','line', 'pie','ring','funnel','radar','waterfall' | - -:::tip - -以下是图表公共属性,各图表 Settings 属性配置请查阅各图表详情页面 - -::: - - diff --git a/example/src/docs/zh-CN/charts/boxplot.md b/example/src/docs/zh-CN/charts/boxplot.md deleted file mode 100644 index 3a7e64638..000000000 --- a/example/src/docs/zh-CN/charts/boxplot.md +++ /dev/null @@ -1,51 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -Boxplot 中文可以称为『箱形图』、『盒须图』、『盒式图』、『盒状图』、『箱线图』,是一种用作显示一组数据分散情况资料的统计图。它能显示出一组数据的最大值、最小值、中位数、下四分位数及上四分位数。 - - - -### 多数据显示 - -`boxplot` 提供数据转化方法 `prepareBoxplotData` 将源数据转化为 `{ axisData: [...], boxData: [...], outliers: [...] }` 的格式化数据。 - - - -
- -### 垂直显示 - -通过 `extend` 属性实现 `echarts` 方式的配置。 - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| metrics | 指标 | array | 默认columns为指标 | -| xAxisType | 上下坐标轴数据类型 | array | 可选值: category, value | -| xAxisName | 上下坐标轴标题 | array | - | -| axisSite | 指标所在的轴 | object | 默认不在top轴的指标都在bottom轴 | -| digit | 设置数据类型为percent时保留的位数 | number | 默认为2 | -| scale | 是否是脱离 0 值比例 | array | 默认为[false, false],表示上下两个轴都不会脱离0值比例。设置成 true 后坐标刻度不会强制包含零刻度 | -| min | 上下坐标轴最小值 | array | - | -| max | 上下坐标轴最大值 | array | - | -| labelMap | 设置指标的别名,同时作用于提示框和图例| object | - | -| legendName | 设置图表上方图例的别名 | object | - | -| label | 设置图形上的文本标签 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-bar.label) | -| itemStyle | 图形样式 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-bar.itemStyle) | -| yAxisType | 纵轴的类型 | string | 可选值'category','value',默认为'category' | diff --git a/example/src/docs/zh-CN/charts/candle.md b/example/src/docs/zh-CN/charts/candle.md deleted file mode 100644 index d752bd3af..000000000 --- a/example/src/docs/zh-CN/charts/candle.md +++ /dev/null @@ -1,66 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

- - - -### 使用简化的数据格式 - - - -### 设置数据格式 - - - -### 显示 MA, VOL - - - -### 修改指标名和图例文字 - - - -### 修改 MA 显示周期 - - - -### 设置 dataRoom 控件 - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| dimension | 维度 | string | 默认为 columns[0] | -| metrics | 指标 | array | 默认为 [columns[1] ~ columns[5]] | -| digit | 设置数据类型为percent时保留的位数 | number | 默认为2 | -| itemStyle | 图形样式 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-candlestick.itemStyle) | -| labelMap | 设置指标的别名 | object | - | -| legendName | 设置图表上方图例的别名 | object | - | -| showMA | 是否展示移动平均线指标 | boolean | 默认 为 false | -| MA | 移动平均线指标周期 | array | 默认 `[5, 10, 20, 30]` | -| showVol | 是否展示成交量 | boolean | 默认为 false | -| downColor | 下降颜色 | string | 默认为 #ec0000 | -| upColor | 上升颜色 | string | 默认为 #00da3c | -| showDataZoom | 是否展示 dataZoom 控件 | boolean | 默认为 false | -| start | dataZoom 控件的起始位置 | number | 默认为 50,即中间位置 | -| end | dataZoom 控件的结束位置 | number | 默认为 100,即末尾位置 | -| dataType | 数据展示格式 | string | 可选值: KMB, normal, percent | - -> 备注1: metrics 各项的值分别代表 `['open', 'close', 'lowest', 'highest', 'vol']`(开盘值, 收盘值, 最低值, 最高值, 成交量), 其中 vol 为可选值。 -> 备注2: k 线图左侧数值被遮挡时,可以通过设置 grid 属性来增加数值可用空间,从而避免遮挡。示例: diff --git a/example/src/docs/zh-CN/charts/common-header.vue b/example/src/docs/zh-CN/charts/common-header.vue deleted file mode 100644 index d964c96fa..000000000 --- a/example/src/docs/zh-CN/charts/common-header.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - diff --git a/example/src/docs/zh-CN/charts/data-config.md b/example/src/docs/zh-CN/charts/data-config.md deleted file mode 100644 index cec8ac133..000000000 --- a/example/src/docs/zh-CN/charts/data-config.md +++ /dev/null @@ -1,354 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 指标和维度 - -Chart 的数据由指标和维度组成。以一组常见的数据为例: - -| 日期 | 访问用户 | 下单用户 | -| :--: | --: | --: | -| 2018-05-22 | 32371 | 29810 | -| 2018-05-23 | 12328 | 11398 | -| 2018-05-24 | 92381 | 82910 | - -“维度” 指的是数据的属性,例如表格中的 “日期” 维度,表示生成的每组数据的日期。 - -“指标” 是量化衡量标准,例如表格中的 “访问用户” 和 “下单用户”。 - -下面,以上面的这组数据为例绘制一个折线图: - -```vue - - - -``` - -### 设置指标维度 - -一种典型的 Chart `data` 属性数据格式如下所示: - -```js -{ - columns: ['日期', '访问用户', '下单用户'], - rows: [ - { '日期': '2018-05-22', '访问用户': 32371, '下单用户': 19810 }, - { '日期': '2018-05-23', '访问用户': 12328, '下单用户': 4398 }, - { '日期': '2018-05-24', '访问用户': 92381, '下单用户': 52910 } - ] -} -``` - -- columns 中是维度和指标的集合,Chart 中的大部分图表都是单维度多指标,所以默认第一个值为 -维度,剩余的值为指标 -- rows 中是数据的集合。 - -图表的 setting 属性中统一有两个配置: - -- dimension 用于指定维度 -- metrics 用于指定指标 - - -```vue - - - -``` - -### 设置指标的别名 - -某些情况下,数据中指标的名称并不是我们想要展示出来的,大部分图表的 setting 属性中提供 -统一的配置来解决这个问题。 - -```vue - - -``` - - -### 设置数据格式 - -大部分情况下,我们需要对数据进行一些格式化,每种图表组件对数据格式的设置方式略有不同。 -例如 折线图使用 yAxisType, 饼图使用 dataType。基本的数据格式有 'normal' (千分位)、'KMB' (kmb 格式)、percent (百分比格式);如果上述格式不能满足需求的话,还可以使用 [numerify](http://daxigua.me/numerify/) 的格式来配置显示,具体的格式支持和插件扩展写法可以参考 -numerify 文档;并且,为了支持更多未知的情况,格式的设置也支持使用回调函数的方式。以上三种方式 -的使用可以参考下面的示例。 - -#### 基本类型 - -```vue - - - -``` - -#### 使用 numerify 格式 - -```vue - - -``` - -#### 使用回调函数 - - -```vue - - - -``` - -### 数据请求示例 - -```vue - - - -``` diff --git a/example/src/docs/zh-CN/charts/events.md b/example/src/docs/zh-CN/charts/events.md deleted file mode 100644 index ce2683310..000000000 --- a/example/src/docs/zh-CN/charts/events.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 事件监听 - -绑定事件通过传递一个事件名称和对应回调函数的对象实现,回调函数内的参数是 echarts 模块,可以据此做相应的处理。 - -#### 示例 - - diff --git a/example/src/docs/zh-CN/charts/funnel.md b/example/src/docs/zh-CN/charts/funnel.md deleted file mode 100644 index 34181bfa2..000000000 --- a/example/src/docs/zh-CN/charts/funnel.md +++ /dev/null @@ -1,59 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

- - - -### 指定指标维度 - - - -### 自动按照数值排序并过滤 0 值 - - - -### 定制顺序漏斗图 - - - -### 指定数据类型漏斗图 - - - -### 修改 legend 别名漏斗图 - - - -### 金字塔 - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| dimension | 维度 | string | 默认columns第一项为维度 | -| metrics | 指标 | string | 默认columns第二项为指标 | -| dataType | 数据类型 | string | 可选值: KMB, normal, percent | -| sequence | 数据显示顺序 | array | 默认按照数据大小顺序 | -| ascending | 是否显示为金字塔 | boolean | 默认为false | -| useDefaultOrder | 是否自动按照数值大小排序 | boolean | 默认为false | -| filterZero | 是否过滤指标为0的数据 | boolean | 默认为false | -| digit | 设置数据类型为percent时保留的位数 | number | 默认为2 | -| label | 设置文本标签样式 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-funnel.label) | -| labelLine | 设置标签的视觉引导线样式 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-funnel.labelLine) | -| itemStyle | 设置图形样式 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-funnel.itemStyle) | diff --git a/example/src/docs/zh-CN/charts/gauge.md b/example/src/docs/zh-CN/charts/gauge.md deleted file mode 100644 index ffcf56b8a..000000000 --- a/example/src/docs/zh-CN/charts/gauge.md +++ /dev/null @@ -1,49 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

- - - -### 指标维度配置 - - - -### 设置数据类型 - - - -### 设置指标别名与单位 - - - -### 设置多表盘及修改样式 - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| dimension | 维度 | string | 默认 columns[0] | -| metrics | 指标 | string | 默认 columns[1] | -| dataType | 数据类型 | object | - | -| digit | 设置数据类型为percent时保留的位数 | number | 默认为2 | -| labelMap | 设置指标的别名 | object | - | -| seriesMap | 附加到 series 中的设置 | object | - | -| dataName | 表盘上显示的单位 | object | - | - -> 备注1: 通过 seriesMap,可以为每一个仪表设置样式,具体样式的配置可以参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-gauge) diff --git a/example/src/docs/zh-CN/charts/graph.md b/example/src/docs/zh-CN/charts/graph.md deleted file mode 100644 index fdb07a165..000000000 --- a/example/src/docs/zh-CN/charts/graph.md +++ /dev/null @@ -1,29 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

- -> 该图只支持 `extend` 配置,使用方式及属性和 eCharts 一致,请参考 eCharts 配置 - - - -### 笛卡尔坐标系上的 Graph - - - -### 拓扑图的事件拓展 - - - -
diff --git a/example/src/docs/zh-CN/charts/heatmap.md b/example/src/docs/zh-CN/charts/heatmap.md deleted file mode 100644 index c0d59f3c5..000000000 --- a/example/src/docs/zh-CN/charts/heatmap.md +++ /dev/null @@ -1,68 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

- - - -### 配置坐标轴 - - - -### 自定义 visualMap - - - -### 地图热力图 - - - -### 百度地图热力图 - -:::warning 百度地图和高德地图需要外网访问权限才能正常使用 -::: - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| type | 热力图的类型 | string | 可选值:`cartesian`(默认值,直角坐标系), `map`(地图),`bmap`(百度地图) | -| xAxisList | x 轴数据 | array | 默认取数据中的数据中的第一维度的数据 | -| yAxisList | y 轴数据 | array | 默认取数据中的数据中的第二维度的数据 | -| dimension | 维度 | array | 默认为 [columns[0], columns[1]] | -| metrics | 指标 | string | 默认为 columns[2] | -| dataType | 数据类型 | string | 可选值: KMB, normal, percent | -| min | visualMap 中的最小值 | number | 默认取指标中最小的数据 | -| max | visualMap 中的最大值 | number | 默认取指标中最大的数据 | -| digit | 设置数据类型为percent时保留的位数 | number | 默认为2 | -| key | 百度地图 access_key | string | 可[由此](http://lbsyun.baidu.com/apiconsole/key)获取 | -| bmap | 百度地图配置项 | object | 参考[文档](https://github.com/ecomfe/echarts/tree/master/extension/bmap#使用)配置 | -| geo | 地图配置项 | object | 参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#geo) | -| position | 地图类型 | string | 默认为 `'china'` | -| positionJsonLink | 地图数据源 | string | - | -| beforeRegisterMap | 地图数据注册前执行的函数 | Function | 参数为地图数据,需返回地图数据 | -| beforeRegisterMapOnce | 地图数据注册前执行的函数(仅执行一次) | Function | 参数为地图数据,需返回地图数据 | -| specialAreas | 地图中的位置配置 | object | 将地图中的部分区域缩放到合适的位置,可以使得整个地图的显示更加好看, 用法参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/api.html#echarts.registerMap) | -| mapURLProfix | 位置请求的 URL 前缀 | string | 默认为 `https://unpkg.com/echarts@3.6.2/map/json/` | -| pointSize | 点大小 | number | 默认为 10 | -| blurSize | 模糊大小 | number | 默认为 5 | -| heatColor | visualMap 中的最大值颜色区间 | array | - | -| yAxisName | y 轴名称 | string | - | -| xAxisName | x 轴名称 | string | - | - -> 备注:当不指定指标时,指标的值默认为1。 diff --git a/example/src/docs/zh-CN/charts/histogram.md b/example/src/docs/zh-CN/charts/histogram.md deleted file mode 100644 index 7b301fe55..000000000 --- a/example/src/docs/zh-CN/charts/histogram.md +++ /dev/null @@ -1,82 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

- - - -### 设置显示的指标维度 - - - -### 设置双 y 轴 - - - -### 柱状图+折线图 - - - -### 堆叠柱状图 - - - -### 默认显示柱状图数据 - - - -### 修改别名 - - - -### 设置横轴为连续的数值轴 - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| dimension | 维度 | array | 默认columns第一项为维度 | -| metrics | 指标 | array | 默认columns第二项起为指标 | -| yAxisType | 左右坐标轴数据类型 | array | 可选值: KMB, normal, percent | -| yAxisName | 左右坐标轴标题 | array | - | -| axisSite | 指标所在的轴 | object | 默认不在right轴的指标都在left轴 | -| stack | 堆叠选项 | object | - | -| digit | 设置数据类型为percent时保留的位数 | number | 默认为2 | -| dataOrder | 设置数据排序方式 | boolean, object | 默认为false | -| scale | 是否是脱离 0 值比例 | array | 默认为[false, false],表示左右
两个轴都不会脱离0值比例。
设置成 true 后坐标刻度不会
强制包含零刻度
| -| min | 左右坐标轴最小值 | array | - | -| max | 左右坐标轴最大值 | array | - | -| labelMap | 设置指标的别名,同时作用于提示框和图例| object | - | -| legendName | 设置图表上方图例的别名 | object | - | -| label | 设置图形上的文本标签 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-bar.label) | -| itemStyle | 图形样式 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-bar.itemStyle) | -| showLine | 展示为折线图的指标 | array | - | -| xAxisType | 横轴的类型 | string | 可选值'category','value',默认为'category' | -| opacity | 透明度 | number | - | - -> 备注1. axisSite 可以设置 left 和 right,例如示例所示 `axisSite: { right: ['占比'] }` 即将占比的数据置于右轴上。 - -> 备注2. stack 用于将两数据堆叠起来,例如实例中所示`stack: { '销售额': ['销售额-1季度', '销售额-2季度'] }` 即将'销售额-1季度', '销售额-2季度'相应的数据堆叠在一起。 - -> 备注3. dataOrder 用于设置数据的排序方式,用于更加清晰的展示数据的升降。例如: `{ label: '余额', order: 'asc }` 表示数据按照余额指标升序展示,降序为`desc`。 - -> 备注4. min和max的值可以直接设置为数字,例如:`[100, 300]`;也可以设置为`['dataMin', 'dataMin']`, `['dataMax', 'dataMax']`,此时表示使用该坐标轴上的最小值或最大值为最小或最大刻度。 - -> 备注5. 有时我们需要将折线图与柱状图展示在同一个图上,利用showLine属性可以设置需要展示为折线图的指标,其他的指标则使用柱状图展示。 - -> 备注6. 为了优化连续的数值型横轴显示多指标的时候样式,在此情况下默认设置opacity为0.5。 diff --git a/example/src/docs/zh-CN/charts/line.md b/example/src/docs/zh-CN/charts/line.md deleted file mode 100644 index 00710a4ab..000000000 --- a/example/src/docs/zh-CN/charts/line.md +++ /dev/null @@ -1,76 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

- - - -### 设置显示的指标维度 - - - -### 设置双 y 轴 - - - -### 横坐标的倾斜 - - - -### 堆叠面积图 - - - -### 设置别名 - - - -### 显示指标数值 - - - -### 设置横轴为连续的数值轴 - - - -### 设置横轴为连续的时间轴 - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| dimension | 维度 | array | 默认columns第一项为维度 | -| metrics | 指标 | array | 默认columns第二项起为指标 | -| xAxisType | 横轴的数据类型 | string | 可选值: category, value, time, log | -| yAxisType | 左右坐标轴数据类型 | array | 可选值: KMB, normal, percent | -| yAxisName | 左右坐标轴标题 | array | - | -| axisSite | 指标所在的轴 | object | 默认不在right轴的指标都在left轴 | -| stack | 堆叠选项 | object | - | -| area | 是否展示为面积图 | boolean | 默认为false | -| scale | 是否是脱离 0 值比例 | array | 默认为[false, false],表示左右
两个轴都不会脱离0值比例。
设置成 true 后坐标刻度不会
强制包含零刻度
| -| min | 左右坐标轴最小值 | array | - | -| max | 左右坐标轴最大值 | array | - | -| digit | 设置数据类型为percent时保留的位数 | number | 默认为2 | -| labelMap | 设置指标的别名,同时作用于提示框和图例 | object | - | -| legendName | 设置图表上方图例的别名 | object | - | - -> 备注1. axisSite 可以设置 left 和 right,例如示例所示 `axisSite: { right: ['占比'] }` 即将占比的数据置于右轴上。 - -> 备注2. stack 用于将两数据堆叠起来,例如实例中所示`stack: { '销售额': ['成本', '利润'] }` 即将'成本', '利润'相应的数据堆叠在一起。 - -> 备注3. min和max的值可以直接设置为数字,例如:`[100, 300]`;也可以设置为`['dataMin', 'dataMin']`, `['dataMax', 'dataMax']`,此时表示使用该坐标轴上的最小值或最大值为最小或最大刻度。 diff --git a/example/src/docs/zh-CN/charts/liquidfill.md b/example/src/docs/zh-CN/charts/liquidfill.md deleted file mode 100644 index 9e96eefe2..000000000 --- a/example/src/docs/zh-CN/charts/liquidfill.md +++ /dev/null @@ -1,118 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

- - - -### 水球图分层 - - - -### 设置多个水球图 - - - -### 设置水球图的形状 - - - -### 水球图文字标签及样式设置 - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| dimension | 维度 | String | 默认 columns[0] | -| metrics | 指标 | String | 默认 columns[1] | -| dataType | 数据类型 | String | 默认为percent,也可设置为normal | -| digit | 设置数据类型为percent时保留的位数 | Number | 默认为2 | -| wave | 设置水球图分层 | Array[Number],Array[Array[Number]] | 默认为[], 数组中的值不大于row中对应的维度值,且需要由大到小排列。可设置为[0.3, 0.2, 0.1]的形式,表示每个水球图都显示4层,且最下面三层的值分别为0.1,0.2,0.3;也可设置为[[0.2, 0.1], [0.1], []]的形式,当有多个水球图时,wave中的每一项对应一个水球图的分层设置,如果wave.length < rows.length,则剩余的水球图的分层设置以wave数组中最后一项为准。比如rows=[{val: 0.1}, {val: 0.2}, {val: 0.3}, {val: 0.4}], 而wave=[[0.2,0.1], [0.2]],此时rows中后三项的分层设置均为[0.2]| -| seriesMap | 附加到 series 中的设置 | Object,Array[Object] | 默认为{},可以设置单个水球图,也可以一次设置多个。数组形式配置见“多个水球图”示例,对象形式配置见其他示例。 | - -> 备注1: 通过 seriesMap,可以为每一个水球图设置样式,具体样式的配置可以参考[文档](https://github.com/ecomfe/echarts-liquidfill)或下面对应的中文文档。 - -### echarts-liquidfill配置中文文档(在seriesMap中使用)) -#### seriesMap 配置项 -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| color | 颜色 | Array[String] | data中第一个数据对应color中第一个颜色,以此类推。如果color.length小于data.length, data中数据项的颜色会循环展示。在这里,color设置的是row中metrics和wave的值对应数据波浪的颜色。| -| radius | 水球图的半径 | String | 单个水球图的半径,相对于容器元素中较短边(width和height)的长度,以百分数表示,如’50%’ | -| center | 水球图的位置 | Array[String] | 设置时以百分数表示,数组中第一项代表横坐标,相对于容器的width的百分比,第二项代表纵坐标,相对于容器heigght的百分比。如[’50%’, ’50%’]表示居中 | -| amplitude | 水波的起伏程度 | String | 用百分数表示。数值越大,起伏程度越大,如’10%’ | -| waveLength | 水波的长度 | String | 相对于水球的直径。当为’50%’时,水球图中一条数据上会出现两个水波;为33%时,会出现三个水波。以此类推。| -| period | 水波滚动的速度 | Number, Function | 表示滚动一个水波需要花费的时间,以毫秒为单位。可以直接设置数字,也可以设置为function(value, index)的形式。| -| direction | 水波的滚动方向 | String | 整体设置水波的滚动方向,可选’left’或’right’| -| shape | 水球图的形状 | String | 水球图的形状,可选值有’circle’, ‘rect’, ‘roundRect’, ‘triangle’, ‘diamond’, ‘pin’, ‘arrow’,也可以通过svg自定义’path://*' | -| waveAnimation | 水波是否滚动 | Boolean | 为true时水波滚动,反之不滚动。默认为true | -| animationEasing | 水波初始的动画的速度曲线 | String | 水波初始的动画的速度曲线 | -| animationEasingUpdate | 数据变动时水波动画的速度曲线 | String | 数据变动时水波动画的速度曲线 | -| animationDuration | 水波初始动画所需要的时间 | Number | 水波初始动画所需要的时间 | -| animationDurationUpdate | 数据变动时水波动画变化所需要的时间 | Number | 数据变动时水波动画变化所需要的时间 | -| outline | 水球图的外边框设置 | Object | 水球图的外边框设置 | -| backgroundStyle | 水球图的背景颜色 | Object | 水球图的背景颜色 | -| itemStyle | 水球图波浪的样式 | Object | 水球图波浪的样式 | -| emphasis | 鼠标悬浮时波浪的样式 | Object | 鼠标悬浮时波浪的样式 | -| label | 图形上的文本标签 | Object | 图形上的文本标签 | - -:::danger 注意:不要在seriesMap中设置data,这样会覆盖row中对应的数据和wave。 -::: - -> "outline" 水球图外边框配置 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| show | 是否显示 | Boolean | | -| borderDistance | | Number | 水球图外边框和水球图核心内容的距离,类似于元素的内边距 | -| itemStyle | 水球图外边框的样式 | Object | 主要配置项有color: String(边框和核心内容之间的背景颜色,也就是borderDistance那部分的背景颜色), borderColor: String(外边框的颜色),borderWidth: Number(外边框的宽度),shadowBlur: Number(外边阴影的模糊距离),shadowColor: String(边框阴影的颜色) - -> "backgroundStyle" 配置 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| color | 水球图的背景颜色 | String | | -| borderWidth | 背景的边框 | Number | | -| borderColor | 背景边框的颜色 | String | | - -> "itemStyle" 配置 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| opacity | 波浪的透明度 | Number | | -| shadowBlur | 波浪阴影的模糊距离 | Number | | -| shadowColor | 波浪阴影的颜色 | String | | - -> "emphasis" 配置 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| itemStyle | 鼠标悬浮时波浪的样式 | Object | opacity: Number(鼠标悬浮时波浪的透明度) | - -> "label" 配置 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| show | 是否显示 | Boolean | 默认显示 -| color | 文本的颜色 | String | | -| insideColor | 被波浪覆盖部分的文本的颜色 | String | | -| fontWeight | 文本的字重 | String | | -| fontSize | 字号 | Number | | -| formatter | 自定义文字标签内容 | Function | | -| align | 文本的位置 | String | 可选值有'left', 'center', 'right | -| baseline | 文本垂直方向上对齐方向 | String | 可选值有'top', 'middle', 'bottom' | -| position | 文本的位置 | String, Array[string] | 有inside, left, right, top, bottom可选,也可设置为[’10%’, ’20%’]形式表示水平和垂直方向的位置 | diff --git a/example/src/docs/zh-CN/charts/map.md b/example/src/docs/zh-CN/charts/map.md deleted file mode 100644 index d3a1d669e..000000000 --- a/example/src/docs/zh-CN/charts/map.md +++ /dev/null @@ -1,46 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| dimension | 维度 | string | 默认columns第一项为维度 | -| metrics | 指标 | array | 默认columns第二项为指标 | -| position | 位置 | string | 默认为 `'china'` | -| selectData | 是否高亮显示数据对应位置 | boolean | 默认为 `false` | -| selectedMode | 地图选中模式 | Boolean,String | 默认为 `false`, 可选值有
`'single', 'multiple'` | -| dataType | 指标数据类型 | object | 内容为 指标-指标数据
类型的键值对,支持
`'normal', 'KMB', 'percent'` | -| digit | 设置数据类型为percent时保留的位数 | number | 默认为2 | -| zoom | 视角的缩放比例 | number | 默认为1 | -| center | 当前视角的中心点 | array | - | -| aspectScale | 用于 scale 地图的长宽比 | number | 默认为0.75 | -| boundingCoords | 左上角以及右下角分别所对应的经纬度 | array | 默认为null | -| roam | 是否开启鼠标缩放和平移漫游 | boolean, string | 默认为false, 可选值有
`false, true, 'scale', 'move'` | -| scaleLimit | 滚轮缩放的极限控制 | object | 默认`{ min: 1, max: 1 }` | -| mapGrid | 地图距离容器的边距 | object | 默认值为
`{`
` left: auto,`
` right: auto,`
` top: auto,`
` bottom: auto`
` }` | -| label | 文本标签 | boolean, object | 默认为`true`, 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-map.label) | -| itemStyle | 地图区域的多边形 图形样式 | boolean, object | 默认为true, 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-map.itemStyle) | -| positionJsonLink | 地图数据源 | string | - | -| beforeRegisterMap | 地图数据注册前执行的函数 | Function | 参数为地图数据,需返回地图数据 | -| beforeRegisterMapOnce | 地图数据注册前执行的函数(仅执行一次) | Function | 参数为地图数据,需返回地图数据 | -| specialAreas | 地图中的位置配置 | object | 将地图中的部分区域缩放到合适的位置,可以使得整个地图的显示更加好看, 用法参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/api.html#echarts.registerMap) | -| mapURLProfix | 位置请求的 URL 前缀 | string | 默认为 `https://unpkg.com/echarts@3.6.2/map/json/` | -| mapOrigin | 地图 geojson | object | - | - -> 备注: 属性中的 position 默认为'china',可设置的类型有'china'、'china-cities'、'china-contour'、'world'、'province/beijing'、'province/shanghai'等,省份的position如例子中所示需要在前面加'province/' diff --git a/example/src/docs/zh-CN/charts/pie.md b/example/src/docs/zh-CN/charts/pie.md deleted file mode 100644 index 3a8aae7b6..000000000 --- a/example/src/docs/zh-CN/charts/pie.md +++ /dev/null @@ -1,65 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

- - - -### 设置指标维度 - - - -### 玫瑰图 - - - -### 限制显示条数饼图 - - - -### 多圆饼图 - - - -### 设置数据类型 - - - -### 设置饼图半径边距 - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| dimension | 维度 | string | 默认columns第一项为维度 | -| metrics | 指标 | string | 默认columns第二项为指标 | -| dataType | 数据类型 | string | 可选值: KMB, normal, percent | -| legendLimit | legend显示数量限制 | number | legend数量过多会导致饼图样式错误,限制legend最大值并且当超过此值时,隐藏legend可以解决这个问题 | -| selectedMode | 选中模式 | string | 可选值:single, multiple,默认为false | -| hoverAnimation | 是否开启 hover 在扇区上的放大动画效果 | boolean | 默认值为true | -| radius | 饼图半径 | number / string | 支持数值和百分比 | -| offsetY | 纵向偏移量 | number / string | 支持数值和百分比 | -| digit | 设置数据类型为percent时保留的位数 | number | 默认为2 | -| roseType | 显示为南丁格尔玫瑰图 | string | 默认不展示为南丁格尔玫瑰图,可设置为`'radius', 'area'` | -| label | 饼图图形上的文本标签 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-pie.label) | -| labelLine | 标签的视觉引导线样式 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-pie.labelLine) | -| itemStyle | 图形样式 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-pie.itemStyle) | -| level | 多圆饼图时设置 | array | - | -| limitShowNum | 设置超过此数字时使用‘其他’代替 | number | 此时数据会按照由大到小顺序显示 | - -> 备注1. level 的值接受二维数组,例如:`[['a', 'b'], ['c', 'd']]`, 表示的含义是内层展示的是维度中的`'a', 'b'`的指标加在一起组成的饼图,外层为`'c', 'd'`的指标加在一起组成的环图。 diff --git a/example/src/docs/zh-CN/charts/question.md b/example/src/docs/zh-CN/charts/question.md deleted file mode 100644 index 4bce5a731..000000000 --- a/example/src/docs/zh-CN/charts/question.md +++ /dev/null @@ -1,48 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 常见问题 - -#### 父元素的初始宽度未知 - -在一个初始宽度未知的容器内绘制图表时,因为无法获取宽度,所以图表会绘制失败,解决的办法是在容器宽度已知后, -调用 echarts 的 resize 方法。 -通过 `cancel-resize-check` 是用于resize之前,检测组件元素是否存在,元素是否有宽高,没有则不resize。 - - - -
- -当父元素改变时,图表需要执行 resize 方法同步图表的宽高。 - - - -
- -#### 数据改变视图自动更新 - -图表是基于 Vue 开发的,同样支持 `双向数据绑定`,只要改变图表数据 `(示例中的 chartData.row)` 视图会自动更新。 - - - - -#### 小数显示精度 - -处理数据类型时默认保留两位有效数字,但是当数字较小并设置为百分比类型时,这种方式会导致显示上的问题,例如: - - - -
- -每个图表内都有digit配置项,设置此属性,保证设置类型后,数值较小也能够正常显示,如下所示: - - diff --git a/example/src/docs/zh-CN/charts/radar.md b/example/src/docs/zh-CN/charts/radar.md deleted file mode 100644 index 96618eba4..000000000 --- a/example/src/docs/zh-CN/charts/radar.md +++ /dev/null @@ -1,43 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

- - - -### 设置显示的指标维度 - - - -### 修改指标名称 - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| dimension | 维度 | string | 默认columns第一项为维度 | -| metrics | 指标 | array | 默认columns第二项起为指标 | -| dataType | 数据类型 | object | 可选值: KMB, normal, percent | -| digit | 设置数据类型为percent时保留的位数 | number | 默认为2 | -| label | 图形上的文本标签 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-radar.label) | -| itemStyle | 折线拐点标志的样式 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-radar.itemStyle) | -| lineStyle | 线条样式 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-radar.lineStyle) | -| areaStyle | 区域填充样式 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-radar.areaStyle) | - - -> 备注:dataType中直接设置对应维度的数据类型,例如示例的`{ '占比': 'percent' }`,即将占比数据设置为百分比类型 diff --git a/example/src/docs/zh-CN/charts/ring.md b/example/src/docs/zh-CN/charts/ring.md deleted file mode 100644 index 76218791e..000000000 --- a/example/src/docs/zh-CN/charts/ring.md +++ /dev/null @@ -1,62 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 - -
- -### 基本用法 - -

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

- - - -### 设置指标维度 - - - -### 玫瑰图 - - - -### 限制显示条数环图 - - - -### 设置数据类型 - - - -### 设置环图半径 - - - -### 设置环图title的位置 - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| -------------- | ---------------------- | --------------- | ----------------------------------------------------------------------------- | -| dimension | 维度 | string | 默认columns第一项为维度 | -| metrics | 指标 | string | 默认columns第二项为指标 | -| dataType | 数据类型 | string | 可选值: KMB, normal, percent | -| legendLimit | legend显示数量限制 | number | legend数量过多会导致环图样式错误,限制legend最大值并且当超过此值时,隐藏legend可以解决这个问题 | -| selectedMode | 选中模式 | string | 可选值:single, multiple,默认为false | -| hoverAnimation | 是否开启 hover 在扇区上的放大动画效果 | boolean | 默认值为true | -| radius | 环图外半径与内半径 | array | 数组元素支持数值和百分比,如:[50, 70] 或 ['50%', '70%'] | -| offsetY | 纵向偏移量 | number / string | 支持数值和百分比 | -| digit | 设置数据类型为percent时保留的位数 | number | 默认为2 | -| roseType | 显示为南丁格尔玫瑰图 | string | 默认不展示为南丁格尔玫瑰图,可设置为`'radius', 'area'` | -| label | 环图图形上的文本标签 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-pie.label) | -| labelLine | 标签的视觉引导线样式 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-pie.labelLine) | -| itemStyle | 图形样式 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-pie.itemStyle) | -| limitShowNum | 设置超过此数字时使用‘其他’代替 | number | 此时数据会按照由大到小顺序显示 | diff --git a/example/src/docs/zh-CN/charts/sankey.md b/example/src/docs/zh-CN/charts/sankey.md deleted file mode 100644 index ff275594b..000000000 --- a/example/src/docs/zh-CN/charts/sankey.md +++ /dev/null @@ -1,36 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

- - - -### 设置数据类型 - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| dimension | 维度 | string | 默认columns第一项为维度 | -| metrics | 指标 | string | 默认columns第二项为指标 | -| dataType | 数据类型 | array | 数组的第一项为item的数据类型,
第二项为line的数据类型,
可选值: KMB, normal, percent | -| links | 节点间的关系数据 | array | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-sankey.links) | -| digit | 设置数据类型为percent时保留的位数 | number | 默认为2 | -| label | 每个矩形节点中文本标签的样式 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-sankey.label) | -| itemStyle | 节点矩形的样式 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-sankey.itemStyle) | -| lineStyle | 桑基图边的样式 | object | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-sankey.lineStyle) | diff --git a/example/src/docs/zh-CN/charts/scatter.md b/example/src/docs/zh-CN/charts/scatter.md deleted file mode 100644 index 76427edf9..000000000 --- a/example/src/docs/zh-CN/charts/scatter.md +++ /dev/null @@ -1,72 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

- - - -### 双维度多指标散点图示例 - - - -### 指标维度配置 - - - -### 数据类型配置 - - - -### 属性名配置 - - - -### 缩放配置 - - - -### 散点样式配置 - - - -### 散点出现覆盖时, 提示框可以改成通过坐标轴触发 - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| dimension | 维度 | string | 默认 columns[0] | -| metrics | 指标 | array | 默认 [columns[0], columns[1]] | -| dataType | 数据类型 | object | - | -| xAxisType | x轴类型 | string | 可选值: category, value, time, log | -| xAxisName | x轴标题 | string | - | -| yAxisName | y轴标题 | string | - | -| digit | 设置数据类型为percent时保留的位数 | number | 默认为2 | -| labelMap | 设置指标的别名 | object | - | -| legendName | 设置图表上方图例的别名 | object | - | -| tooltipTrigger | 提示框的触发方式 | string | 可选值: item, axis | -| axisVisible | 是否显示坐标轴 | boolean | - | -| symbolSizeMax | 气泡最大值 | number | 默认为50 | -| symbol | 标记的图形 | string | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-scatter.symbol) | -| symbolSize | 标记的大小 | number, array, Function | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-scatter.symbolSize) | -| symbolRotate | 标记的旋转角度 | number | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-scatter.symbolRotate) | -| symbolOffset | 标记相对于原本位置的偏移 | array | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-scatter.symbolOffset) | -| cursor | 鼠标悬浮时在图形元素上时鼠标的样式 | string | 内容参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-scatter.cursor) | -| scale | 是否是脱离 0 值比例 | boolean | - | -| min | y轴最小值 | number | - | -| max | y轴最大值 | number | - | diff --git a/example/src/docs/zh-CN/charts/sunburst.md b/example/src/docs/zh-CN/charts/sunburst.md deleted file mode 100644 index b44d78199..000000000 --- a/example/src/docs/zh-CN/charts/sunburst.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

- -> 该图只支持 `extend` 配置,使用方式及属性和 eCharts 一致,请参考 eCharts 配置 - - - -### 复杂示例 - - - -
diff --git a/example/src/docs/zh-CN/charts/tree.md b/example/src/docs/zh-CN/charts/tree.md deleted file mode 100644 index f62c65e9e..000000000 --- a/example/src/docs/zh-CN/charts/tree.md +++ /dev/null @@ -1,45 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

- - - -### 多树图 - - - -### 径向树图 - - - -### 纵向树图 - - - -### 自定义提示框内容 - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| dimension | 维度 | string | 默认columns第一项为维度 | -| metrics | 指标 | string | 默认columns第二项为指标 | -| seriesMap | 附加到 series 中的设置 | object | - | - -> 备注1: 通过 seriesMap,可以为每一个树设置样式,具体样式的配置可以参考[文档](http://xui.test.huawei.com/echarts4/echarts-doc/public/cn/option.html#series-tree) diff --git a/example/src/docs/zh-CN/charts/waterfall.md b/example/src/docs/zh-CN/charts/waterfall.md deleted file mode 100644 index c29e63af4..000000000 --- a/example/src/docs/zh-CN/charts/waterfall.md +++ /dev/null @@ -1,47 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

- - - -### 设置指标维度 - - - -### 设置数据类型 - - - -### 修改指标名称 - - - -### 设置 总计、剩余 的名称 - - - -
- -#### settings 配置项 - -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| dimension | 维度 | string | 默认columns第一项为维度 | -| metrics | 指标 | string | 默认columns第二项为指标 | -| dataType | 数据类型 | string | 可选值: KMB, normal, percent | -| totalNum | 总量 | number | 默认瀑布图总量为所有数据的和 | -| totalName | 总量的显示文案 | string | 默认显示总计 | -| remainName | 剩余的显示文案 | string | 默认显示其他 | -| digit | 设置数据类型为percent时保留的位数 | number | 默认为2 | diff --git a/example/src/docs/zh-CN/charts/wordcloud.md b/example/src/docs/zh-CN/charts/wordcloud.md deleted file mode 100644 index b1208bb66..000000000 --- a/example/src/docs/zh-CN/charts/wordcloud.md +++ /dev/null @@ -1,45 +0,0 @@ -
-

- -

- -## Chart 图表 - - - -基于 eCharts 封装,一个纯 Javascript 的图表库。 -
- -### 基本用法 - -

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

- - - -### 设置词云图的颜色 - - - -### 设置词云图的形状 - - - -### 设置词云图的字体大小范围 - - - -
- -#### settings 配置项 -| 配置项 | 简介 | 类型 | 备注 | -| --- | --- | --- | --- | -| dimension | 维度 | String | 默认 `columns[0]` | -| metrics | 指标 | String | 默认 `columns[1]` | -| sizeMin | 最小字体大小 | Number | 默认为 `12` | -| sizeMax | 最大字体大小 | Number | 默认为 `60` | -| shape | 词云图的形状 | String | 默认为 `circle`,可选值见备注 | -| color | 词云图字体颜色 | Array[String], String, Function | 默认为 `"rgb(Math.round(Math.random * 160), Math.round(Math.random * 160), Math.round(Math.random * 160))"` | - -> 备注1: shape 可选值有cardioid、 diamond、triangle-forward、triangle、pentagon、star等。如果最终的形状不是理想的形状(都为矩形),可能是画布高度或者宽度不够以及数据过多导致的。可通过设置画布或容器的width或height,通过extend设置series的drawOutOfBound尝试解决。 - -> 备注2: 详细配置详见[echarts-wordcloud文档](https://github.com/ecomfe/echarts-wordcloud)。更多个性化配置可以结合wordcloud文档在extend的series配置项中设置。 diff --git a/example/src/docs/zh-CN/checkbox/basic-usage.md b/example/src/docs/zh-CN/checkbox/basic-usage.md deleted file mode 100644 index 04f1d3c3f..000000000 --- a/example/src/docs/zh-CN/checkbox/basic-usage.md +++ /dev/null @@ -1,33 +0,0 @@ -
-

- -

- -## Checkbox 复选框 - - - -用于配置不同场景的选项,提供用户可在一组选项中进行多选。 -
- -### 基本用法 - - - -
- -### Checkbox 属性 - - - -
- -### Checkbox-Button 属性 - - - -
- -### Checkbox-Group 属性 - - diff --git a/example/src/docs/zh-CN/checkbox/checkbox-button.md b/example/src/docs/zh-CN/checkbox/checkbox-button.md deleted file mode 100644 index bce150d32..000000000 --- a/example/src/docs/zh-CN/checkbox/checkbox-button.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Checkbox 复选框 - - - -用于配置不同场景的选项,提供用户可在一组选项中进行多选。 -
- -### 按钮形式复选框 - -在 `checkbox-group` 元素中嵌入 `checkbox-button` 即可实现按钮形式的复选框组。 -通过 `fill` 按钮形式的 Checkbox 激活时的填充色和边框色,默认值为:#409EFF。 - - - -
diff --git a/example/src/docs/zh-CN/checkbox/checkbox-events.md b/example/src/docs/zh-CN/checkbox/checkbox-events.md deleted file mode 100644 index 072e3c8cc..000000000 --- a/example/src/docs/zh-CN/checkbox/checkbox-events.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Checkbox 复选框 - - - -用于配置不同场景的选项,提供用户可在一组选项中进行多选。 - -
- -### 事件 - -勾选值改变后将触发 `change` 事件。 - - - -
diff --git a/example/src/docs/zh-CN/checkbox/checkbox-group.md b/example/src/docs/zh-CN/checkbox/checkbox-group.md deleted file mode 100644 index c001f0ba8..000000000 --- a/example/src/docs/zh-CN/checkbox/checkbox-group.md +++ /dev/null @@ -1,33 +0,0 @@ -
-

- -

- -## Checkbox 复选框 - - - -用于配置不同场景的选项,提供用户可在一组选项中进行多选。 -
- -### 复选框组 - -通过 `checkbox-group` 元素把多个 `checkbox` 元素管理为一组,在 `checkbox-group` 中使用 `v-model` 绑定 Array 类型的变量即可实现双向绑定。 `checkbox` 的 `label` 属性是其对应的值,若该标签中无内容,则该属性也充当 checkbox 后的介绍。`label` 与数组中的元素值相对应,如果存在指定的值则为选中状态,否则为不选中。 - - - -### 配置式复选框组 - -提供 `options` 属性,支持通过配置对象数组数据的形式来渲染多选框组。使用该属性后,可以不用再在标签中以插槽的形式插入 `checkbox` 或 `checkbox-button` 元素。 - -
- -`options` 对象数组中包括三个字段:`label`、`text`、`events`。 - -
- -另外还提供 `type` 属性,配合 `options` 属性一起使用,默认值为 `checkbox`。还可以配置为 `button`,配置后复选框组将以按钮的形式展示。 - - - -
diff --git a/example/src/docs/zh-CN/checkbox/checkbox-slot.md b/example/src/docs/zh-CN/checkbox/checkbox-slot.md deleted file mode 100644 index 9d46bb945..000000000 --- a/example/src/docs/zh-CN/checkbox/checkbox-slot.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Checkbox 复选框 - - - -用于配置不同场景的选项,提供用户可在一组选项中进行多选。 - -
- -### 插槽 - -Checkbox 的内容 - - - -
diff --git a/example/src/docs/zh-CN/checkbox/content-overflow.md b/example/src/docs/zh-CN/checkbox/content-overflow.md deleted file mode 100644 index 5de916459..000000000 --- a/example/src/docs/zh-CN/checkbox/content-overflow.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Checkbox 复选框 - - - -用于配置不同场景的选项,提供用户可在一组选项中进行多选。 -
- -### 内容超出时的提示信息 - -若复选框后的介绍文字超出时,可以通过 Tooltip 组件增加提示信息,鼠标悬停时可提示所有内容。 - -
- -在 `checkbox` 元素上配置 `border` 属性为 true,可显示边框。 - - - -
diff --git a/example/src/docs/zh-CN/checkbox/dynamic-create-checkbox.md b/example/src/docs/zh-CN/checkbox/dynamic-create-checkbox.md deleted file mode 100644 index 0ea588379..000000000 --- a/example/src/docs/zh-CN/checkbox/dynamic-create-checkbox.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Checkbox 复选框 - - - -用于配置不同场景的选项,提供用户可在一组选项中进行多选。 -
- -### 动态生成复选框组 - -复选框组所需数据可通过请求服务从后台取得,然后动态生成。 - - - -
diff --git a/example/src/docs/zh-CN/checkbox/indeterminate.md b/example/src/docs/zh-CN/checkbox/indeterminate.md deleted file mode 100644 index 7d5f66e3f..000000000 --- a/example/src/docs/zh-CN/checkbox/indeterminate.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Checkbox 复选框 - - - -用于配置不同场景的选项,提供用户可在一组选项中进行多选。 -
- -### 全选与半选 - -在 `checkbox` 元素中配置 `indeterminate` 属性为 true 后,勾选框将展示为半选的样式。 - - - -
diff --git a/example/src/docs/zh-CN/checkbox/min-max.md b/example/src/docs/zh-CN/checkbox/min-max.md deleted file mode 100644 index c50982e63..000000000 --- a/example/src/docs/zh-CN/checkbox/min-max.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Checkbox 复选框 - - - -用于配置不同场景的选项,提供用户可在一组选项中进行多选。 - -
- -### 可选数量限制 - -在 `checkbox-group` 上可通过 `min`、`max` 属性指定可勾选项目的最小、最大值。 - - - -
- -### 当前是否勾选 - -在 `checked` 当前是否勾选,通过 `disabled` 设置组件是否禁用。 - - - -
diff --git a/example/src/docs/zh-CN/checkbox/text.md b/example/src/docs/zh-CN/checkbox/text.md deleted file mode 100644 index bcf41c08a..000000000 --- a/example/src/docs/zh-CN/checkbox/text.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Checkbox 复选框 - - - -用于配置不同场景的选项,提供用户可在一组选项中进行多选。 - -
- -### 文本 - -在 `text` 属性设置文本内容 -通过 `true-label` 设置选中的值, `false-label` 设置未选中的值。 - - - -
- -### 文本选择 - -通过 `true-label` 设置选中的值, `false-label` 设置未选中的值。 - - - diff --git a/example/src/docs/zh-CN/checkbox/vertical-checkbox.md b/example/src/docs/zh-CN/checkbox/vertical-checkbox.md deleted file mode 100644 index 764b1cd21..000000000 --- a/example/src/docs/zh-CN/checkbox/vertical-checkbox.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Checkbox 复选框 - - - -用于配置不同场景的选项,提供用户可在一组选项中进行多选。 -
- -### 垂直布局 - -在 `checkbox-group` 元素上设置 `vertical` 为 true,则其管理的 `checkbox-button` 或 `checkbox` 将展示为垂直布局。 - - - -
diff --git a/example/src/docs/zh-CN/checkbox/with-border.md b/example/src/docs/zh-CN/checkbox/with-border.md deleted file mode 100644 index 8b726d2f3..000000000 --- a/example/src/docs/zh-CN/checkbox/with-border.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Checkbox 复选框 - - - -用于配置不同场景的选项,提供用户可在一组选项中进行多选。 -
- -### 尺寸 - -当复选框为按钮形式时,通过 `size` 属性可以设置按钮复选框的尺寸,可选项有 medium、small、mini。 - -
- -在 `checkbox-button` 上设置 `disabled` 属性,将禁用某一个复选按钮,若在 `checkbox-group` 标签上配置 `disabled` 属性,则禁用所有复选按钮。 - - - -
diff --git a/example/src/docs/zh-CN/collapse/accordion.md b/example/src/docs/zh-CN/collapse/accordion.md deleted file mode 100644 index 8015192c5..000000000 --- a/example/src/docs/zh-CN/collapse/accordion.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Collapse 折叠面板 - - - -内容区可指定动态页面或自定义 html 等,支持展开收起操作。 - -
- -### 手风琴效果 - -配置 `accordion` 属性为 true 后,折叠面板将展示手风琴效果。 -配置 `v-model` 设置当前激活的面板(如果是手风琴模式,绑定值类型需要为 string ,否则为 array ) -`change` 事件,在当前激活面板改变时触发,参数为当前的 value 值 -配置 `name` 属性作为每个 collapse-item 的唯一标志符 - - - -
diff --git a/example/src/docs/zh-CN/collapse/basic-usage.md b/example/src/docs/zh-CN/collapse/basic-usage.md deleted file mode 100644 index 5678e039b..000000000 --- a/example/src/docs/zh-CN/collapse/basic-usage.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Collapse 折叠面板 - - - -内容区可指定动态页面或自定义 html 等,支持展开收起操作。 -
- -### 基本用法 - - - -
- -### Collapse 属性 - - - -
- -### Collapse-Item 属性 - - - diff --git a/example/src/docs/zh-CN/collapse/block-close.md b/example/src/docs/zh-CN/collapse/block-close.md deleted file mode 100644 index 21ecb8eae..000000000 --- a/example/src/docs/zh-CN/collapse/block-close.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Collapse 折叠面板 - - - -内容区可指定动态页面或自定义 html 等,支持展开收起操作。 -
- -### 阻止折叠面板关闭事件 - -:before-close 折叠面板关闭前事件,方法里面return true/false,表示是否可以关闭 - - - -
- diff --git a/example/src/docs/zh-CN/collapse/collapse-events.md b/example/src/docs/zh-CN/collapse/collapse-events.md deleted file mode 100644 index dc1069bcd..000000000 --- a/example/src/docs/zh-CN/collapse/collapse-events.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Collapse 折叠面板 - - - -内容区可指定动态页面或自定义 html 等,支持展开收起操作。 -
- -### 折叠面板事件 - -激活面板的值改变时将触发 `change` 事件。 - - - -
- diff --git a/example/src/docs/zh-CN/collapse/custom-collapse-title.md b/example/src/docs/zh-CN/collapse/custom-collapse-title.md deleted file mode 100644 index 71beaf7ad..000000000 --- a/example/src/docs/zh-CN/collapse/custom-collapse-title.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Collapse 折叠面板 - - - -内容区可指定动态页面或自定义 html 等,支持展开收起操作。 -
- -### 自定义面板标题 - -在 `collapse-item` 元素上配置 `title` 属性可以指定每个折叠面板项的标题。但同时也可以通过 `title` 插槽的方式自定义面板标题,比如在标题前增加图标。 - - - -
- diff --git a/example/src/docs/zh-CN/collapse/dynamic-disable.md b/example/src/docs/zh-CN/collapse/dynamic-disable.md deleted file mode 100644 index 515882fb7..000000000 --- a/example/src/docs/zh-CN/collapse/dynamic-disable.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Collapse 折叠面板 - - - -内容区可指定动态页面或自定义 html 等,支持展开收起操作。 -
- -### 禁用状态 - -在 `collapse-item` 元素上配置 `disabled` 属性为 true 后,将禁用指定的折叠面板项。 - - - -
- diff --git a/example/src/docs/zh-CN/collapse/nested-form.md b/example/src/docs/zh-CN/collapse/nested-form.md deleted file mode 100644 index 710337aae..000000000 --- a/example/src/docs/zh-CN/collapse/nested-form.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Collapse 折叠面板 - - - -内容区可指定动态页面或自定义 html 等,支持展开收起操作。 -
- -### 嵌套表单 - -通过 `collapse-item` 元素的默认插槽嵌入表单。 - - - -
- diff --git a/example/src/docs/zh-CN/collapse/nested-grid.md b/example/src/docs/zh-CN/collapse/nested-grid.md deleted file mode 100644 index fc6b154cf..000000000 --- a/example/src/docs/zh-CN/collapse/nested-grid.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Collapse 折叠面板 - - - -内容区可指定动态页面或自定义 html 等,支持展开收起操作。 -
- -### 嵌套表格 - -通过 `collapse-item` 元素的默认插槽嵌入表格。 - - - -
- diff --git a/example/src/docs/zh-CN/color.md b/example/src/docs/zh-CN/color.md deleted file mode 100644 index 9333ed09f..000000000 --- a/example/src/docs/zh-CN/color.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Color 色彩 - - -
- -### 主色彩 - - - -### 辅助色 - - - -### 中性色 - - - - diff --git a/example/src/docs/zh-CN/company/basic-usage.md b/example/src/docs/zh-CN/company/basic-usage.md deleted file mode 100644 index 3bd2ccc19..000000000 --- a/example/src/docs/zh-CN/company/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Company 公司 - - - -Company 公司组件,用于公司名称展示及选择,通过配置数据源获取选项。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/company/custom-service.md b/example/src/docs/zh-CN/company/custom-service.md deleted file mode 100644 index 1079c8a52..000000000 --- a/example/src/docs/zh-CN/company/custom-service.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Company 公司 - - - -Company 公司组件,用于公司名称展示及选择,通过配置数据源获取选项。 -
- -### 自定义服务 - -通过 `fetch-company` 属性可以指定一个方法,在方法中可实现请求自定义的服务。 - - - -
- -自定义服务时,通过 `fields` 属性可以指定显示内容和值在数据中对应的字段。 - - - -
diff --git a/example/src/docs/zh-CN/company/custom-show-num.md b/example/src/docs/zh-CN/company/custom-show-num.md deleted file mode 100644 index f459f423d..000000000 --- a/example/src/docs/zh-CN/company/custom-show-num.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Company 公司 - - - -Company 公司组件,用于公司名称展示及选择,通过配置数据源获取选项。 -
- -### 自定义数据显示数量 - -可通过 `max` 属性设置下拉框最大显示的数据条数。`clearable` 是否显示清除按钮,默认为 true 。 - - - -
diff --git a/example/src/docs/zh-CN/container.md b/example/src/docs/zh-CN/container.md deleted file mode 100644 index 31455be07..000000000 --- a/example/src/docs/zh-CN/container.md +++ /dev/null @@ -1,50 +0,0 @@ -
-

- -

- -## Container 版型 - - - -用于布局的容器组件,方便快速搭建页面的版型。 - -
- -提示布局容器内置 `default(默认)`、`simple(简约)`、`classic(经典)`、`fashion(时尚)`、`legend(传奇)` 五种布局类型,用户可通过 `pattern` 属性选择合适的布局类型,可选值有 `default | simple | classic | fashion | legend` -
- -### 默认布局 - - - -### 简约布局 - - - -### 经典布局 - - - -### 时尚布局 - - - -### 传奇布局 - - - -### 自定义宽度和高度 - -Container 布局容器支持用户通过设置 `headerHeight`、`footerHeight`、`asideWidth` 等属性来控制 `header(头部区域)`、`footer(底部区域)` 的高度和 `aside(左侧区域)` 的宽度。`main(主体区域)` 的宽度和高度是自适应的。 - - - -### 版型切换 - -Container 布局容器支持用户通过切换 `pattern` 版型属性的值实现版型切换。 - -
- - - diff --git a/example/src/docs/zh-CN/country/basic-usage.md b/example/src/docs/zh-CN/country/basic-usage.md deleted file mode 100644 index 04f31a642..000000000 --- a/example/src/docs/zh-CN/country/basic-usage.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Country 国家/地区 - - - -Country 国家/地区组件,用于国家/地区名称展示及选择,通过配置数据源获取选项。 -
- -### 基本用法 - - - - diff --git a/example/src/docs/zh-CN/country/custom-service.md b/example/src/docs/zh-CN/country/custom-service.md deleted file mode 100644 index 22a491930..000000000 --- a/example/src/docs/zh-CN/country/custom-service.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Country 国家/地区 - - - -Country 国家/地区组件,用于国家/地区名称展示及选择,通过配置数据源获取选项。 -
- -### 自定义服务 - -通过 `fetch-country` 属性可以指定一个方法,在方法中可实现请求自定义的服务。 `clearable` 设置是否可清空,默认值为 true。 - - - -
- -自定义服务时,通过 `fields` 属性可以指定显示内容和值在数据中对应的字段。 - -通过 `disabled` 设置是否输入,默认值为 false。 - - - -
- diff --git a/example/src/docs/zh-CN/credit-card-form/background-image.md b/example/src/docs/zh-CN/credit-card-form/background-image.md deleted file mode 100644 index 8adda6dce..000000000 --- a/example/src/docs/zh-CN/credit-card-form/background-image.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## CreditCardForm 信用卡表单 - - - -通过表单输入实时改变信用卡卡片的相关信息。 -
- -### 背景图片 - -通过 `background-image` 设置信用卡背景图片。 - - - - - diff --git a/example/src/docs/zh-CN/credit-card-form/basic-usage.md b/example/src/docs/zh-CN/credit-card-form/basic-usage.md deleted file mode 100644 index c6f4b0101..000000000 --- a/example/src/docs/zh-CN/credit-card-form/basic-usage.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## CreditCardForm 信用卡表单 - - - -通过表单输入实时改变信用卡卡片的相关信息。 -
- -### 基本用法 - - - -
- - - diff --git a/example/src/docs/zh-CN/credit-card-form/credit-card-form-events.md b/example/src/docs/zh-CN/credit-card-form/credit-card-form-events.md deleted file mode 100644 index 2d1681765..000000000 --- a/example/src/docs/zh-CN/credit-card-form/credit-card-form-events.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## CreditCardForm 信用卡表单 - - - -通过表单输入实时改变信用卡卡片的相关信息。 -
- -### 基本用法 - - - - diff --git a/example/src/docs/zh-CN/crop/aspect-ratio.md b/example/src/docs/zh-CN/crop/aspect-ratio.md deleted file mode 100644 index 08ab5a64a..000000000 --- a/example/src/docs/zh-CN/crop/aspect-ratio.md +++ /dev/null @@ -1,22 +0,0 @@ -
-

- -

- -## Crop 图片裁剪 - - - -Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。 - -
- -### 裁剪框宽高比 - -通过 `aspect-ratio` 属性可以设置裁剪框的宽高比例,默认为 `16 / 9` 。还可以通过调用 `setAspectRatio` 方法来设置裁切框的宽高比。 - -通过 `center` 属性可以设置裁剪框是否在图片正中心。 - - - -
diff --git a/example/src/docs/zh-CN/crop/auto-crop-area.md b/example/src/docs/zh-CN/crop/auto-crop-area.md deleted file mode 100644 index fb2f719a7..000000000 --- a/example/src/docs/zh-CN/crop/auto-crop-area.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Crop 图片裁剪 - - - -Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。 -
- -### 自动裁剪面积 - -初始化时,通过属性 `auto-crop-area` 可以设置裁剪框自动裁剪的面积,默认为 `0.8`,在 `auto-crop` 属性为 `true` 时生效。 - - - -
diff --git a/example/src/docs/zh-CN/crop/basic-usage.md b/example/src/docs/zh-CN/crop/basic-usage.md deleted file mode 100644 index 5c2953044..000000000 --- a/example/src/docs/zh-CN/crop/basic-usage.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Crop 图片裁剪 - - - -Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。 -
- -### 基本用法 - -通过 `src` 属性设置默认裁剪的图片源路径,并通过 `cropvisible` 属性来控制裁剪弹框是否可见。 - - - -
- - diff --git a/example/src/docs/zh-CN/crop/crop-events.md b/example/src/docs/zh-CN/crop/crop-events.md deleted file mode 100644 index 9c93190da..000000000 --- a/example/src/docs/zh-CN/crop/crop-events.md +++ /dev/null @@ -1,48 +0,0 @@ -
-

- -

- -## Crop 图片裁剪 - - - -Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。 - -
- -### ready 事件 - -当一个 cropper 实例完全构建时触发 `ready` 事件。 - - - -
- -### 裁剪框方法 事件 - -当一个 cropper 实例完全构建时触发 ` disable` 方法禁用裁剪框,当触发 `enable` 启用裁剪框 - - - -
- -### 裁剪相关事件 - -:::tip - -说明当画布或剪切框开始发生变化时触发 `cropstart` 事件 - -当画布或剪切框正在发生变化时触发 `cropmove` 事件 - -当画布或剪切框发生变化结束时触发 `cropend` 事件 - -当画布或裁剪框发生改变时触发 `crop` 事件 - -通过触发 `getCanvasData` 获取画布 Canvas(图像包装器)位置和大小数据 - -::: - - - -
diff --git a/example/src/docs/zh-CN/crop/drag-mode.md b/example/src/docs/zh-CN/crop/drag-mode.md deleted file mode 100644 index 68774cd97..000000000 --- a/example/src/docs/zh-CN/crop/drag-mode.md +++ /dev/null @@ -1,26 +0,0 @@ -
-

- -

- -## Crop 图片裁剪 - - - -Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。 -
- -### 拖拽模式 - -通过 `drag-mode` 属性可以设置裁剪框的拖拽模式,有 `crop`、`move`、`none` 三种选项,默认为 `crop` 。 - -:::tip drag-mode 选项说明 -`crop`:当裁剪框取消后,按住鼠标左键在图片区域拖拽,将产生一个新的裁剪框。 -`move`:当裁剪框取消后,按住鼠标左键将移动图片。 -`none`:当裁剪框取消后,不能裁剪、也不能移动图片。 -`movable` 控制图片是否可以移动,默认为 true。 -::: - - - -
diff --git a/example/src/docs/zh-CN/crop/get-container-data.md b/example/src/docs/zh-CN/crop/get-container-data.md deleted file mode 100644 index c7ae21019..000000000 --- a/example/src/docs/zh-CN/crop/get-container-data.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Crop 图片裁剪 - - - -Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。 -
- -### 获取容器数据 - -调用 `getContainerData` 方法可以获取容器的大小数据。 - - - -
diff --git a/example/src/docs/zh-CN/crop/get-crop-box-data.md b/example/src/docs/zh-CN/crop/get-crop-box-data.md deleted file mode 100644 index cb7143558..000000000 --- a/example/src/docs/zh-CN/crop/get-crop-box-data.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Crop 图片裁剪 - - - -Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。 -
- -### 获取剪切框数据 - -调用 `getCropBoxData` 方法可以获取剪切框的位置和大小数据。 - - - -
diff --git a/example/src/docs/zh-CN/crop/get-cropped-canvas.md b/example/src/docs/zh-CN/crop/get-cropped-canvas.md deleted file mode 100644 index 1b9a15889..000000000 --- a/example/src/docs/zh-CN/crop/get-cropped-canvas.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Crop 图片裁剪 - - - -Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。 -
- -### 获取裁剪后的图片数据 - -调用 `getCroppedCanvas` 方法可以获取裁剪后的图片数据,搭配 `toDataURL` 方法将转成 base64 图片数据,搭配 `toBlob` 方法将生成 Blob 图片数据。 - - - -
diff --git a/example/src/docs/zh-CN/crop/get-data.md b/example/src/docs/zh-CN/crop/get-data.md deleted file mode 100644 index 65dcdc4e6..000000000 --- a/example/src/docs/zh-CN/crop/get-data.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Crop 图片裁剪 - - - -Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。 -
- -### 获取裁剪区域数据 - -调用 `getData` 方法可以获取裁剪区域的位置以及大小。 - - - -
diff --git a/example/src/docs/zh-CN/crop/get-image-data.md b/example/src/docs/zh-CN/crop/get-image-data.md deleted file mode 100644 index 5c95a5f6e..000000000 --- a/example/src/docs/zh-CN/crop/get-image-data.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Crop 图片裁剪 - - - -Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。 -
- -### 获取图像数据 - -调用 `getImageData` 方法可以获取图像位置、大小和其他相关数据,若想获取画布位置和大小数据可以调用 `getCanvasData` 方法。 - - - -
diff --git a/example/src/docs/zh-CN/crop/min-crop-box-width-height.md b/example/src/docs/zh-CN/crop/min-crop-box-width-height.md deleted file mode 100644 index f5633a846..000000000 --- a/example/src/docs/zh-CN/crop/min-crop-box-width-height.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Crop 图片裁剪 - - - -Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。 -
- -### 裁剪框最小宽高 - -通过属性 `min-crop-box-width` 、`min-crop-box-height` 设置裁剪框最小宽高。设置后,调整裁剪框宽高时,调整到最小值后将不能再调整。 -通过属性 `mmin-container-width` 、`min-container-height` 设置容器的最小宽度,最小高度。 - - - -
diff --git a/example/src/docs/zh-CN/crop/no-background.md b/example/src/docs/zh-CN/crop/no-background.md deleted file mode 100644 index c7e16a46f..000000000 --- a/example/src/docs/zh-CN/crop/no-background.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Crop 图片裁剪 - - - -Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。 -
- -### 不显示网格背景 - -设置 `background` 属性为 `false` 后,将不显示容器的网格背景。 - - - -
diff --git a/example/src/docs/zh-CN/crop/no-guides.md b/example/src/docs/zh-CN/crop/no-guides.md deleted file mode 100644 index c8fe0bf03..000000000 --- a/example/src/docs/zh-CN/crop/no-guides.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Crop 图片裁剪 - - - -Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。 -
- -### 不显示虚线 - -设置 `guides` 属性为 `false` 将取消裁剪框上方的虚线显示。 - - - -
diff --git a/example/src/docs/zh-CN/crop/no-modal.md b/example/src/docs/zh-CN/crop/no-modal.md deleted file mode 100644 index 7134ad172..000000000 --- a/example/src/docs/zh-CN/crop/no-modal.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Crop 图片裁剪 - - - -Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。 -
- -### 不显示模态 - -设置 `modal` 属性为 `false` 将取消裁剪框下方图片上方的模态层显示。 - - - -
diff --git a/example/src/docs/zh-CN/crop/replace-image.md b/example/src/docs/zh-CN/crop/replace-image.md deleted file mode 100644 index 02676290b..000000000 --- a/example/src/docs/zh-CN/crop/replace-image.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Crop 图片裁剪 - - - -Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。 - -
- -### 替换图片 - -调用 `replace` 方法可以替换图像的 src 并重新构建 cropper 。 通过 `rotatable` 属性控制图片旋转,默认为 true 。 - - - -
- -### 放大图片 - -调用 `zoomable` 属性可以设置是否允许放大图像,默认值为 true。 - - - -
diff --git a/example/src/docs/zh-CN/crop/view-mode.md b/example/src/docs/zh-CN/crop/view-mode.md deleted file mode 100644 index 6a7a1b966..000000000 --- a/example/src/docs/zh-CN/crop/view-mode.md +++ /dev/null @@ -1,26 +0,0 @@ -
-

- -

- -## Crop 图片裁剪 - - - -Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。 -
- -### 视图模式 - -通过 `view-mode` 属性可以设置裁剪框的视图模式,有 `0`、`1`、`2`、`3` 四种选项,默认为 `0` 。 - -:::tip view-mode 选项说明 -`0`:裁剪框可以移动到图片外面。 -`1`:裁剪框只能在图片内移动。 -`2`:图片不全部铺满容器,缩小时可以有一边出现空隙。 -`3`:图片填充整个容器。 -::: - - - -
diff --git a/example/src/docs/zh-CN/crop/wheel-zoom-ratio.md b/example/src/docs/zh-CN/crop/wheel-zoom-ratio.md deleted file mode 100644 index 5e8a6b6bd..000000000 --- a/example/src/docs/zh-CN/crop/wheel-zoom-ratio.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Crop 图片裁剪 - - - -Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。 -
- -### 鼠标滚轮缩放图像时比例 - -`zoom-on-wheel` 属性为 `true` 情况下,通过 `wheel-zoom-ratio` 属性可以设置缩放比例,默认为 `0.1` 。 - - - -
diff --git a/example/src/docs/zh-CN/crop/zoom-on-wheel.md b/example/src/docs/zh-CN/crop/zoom-on-wheel.md deleted file mode 100644 index a0ea0ac54..000000000 --- a/example/src/docs/zh-CN/crop/zoom-on-wheel.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Crop 图片裁剪 - - - -Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。 -
- -### 禁用鼠标滚轮缩放图像 - -设置 `zoom-on-wheel` 属性为 `false` 后,将不允许通过滚动鼠标滚轮来缩放图像。 - - - -
diff --git a/example/src/docs/zh-CN/currency/basic-usage.md b/example/src/docs/zh-CN/currency/basic-usage.md deleted file mode 100644 index 49255a868..000000000 --- a/example/src/docs/zh-CN/currency/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Currency 币种 - - - -Currency 币种组件,用于货币名称展示及选择,通过配置数据源获取选项。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/currency/currency-disabled.md b/example/src/docs/zh-CN/currency/currency-disabled.md deleted file mode 100644 index 8c7ed42ae..000000000 --- a/example/src/docs/zh-CN/currency/currency-disabled.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Currency 币种 - - - -Currency 币种组件,用于货币名称展示及选择,通过配置数据源获取选项。 -
- -### 禁用 - -通过 `disabled` 属性设置组件是否禁用,默认值为 false。 - - diff --git a/example/src/docs/zh-CN/currency/custom-service.md b/example/src/docs/zh-CN/currency/custom-service.md deleted file mode 100644 index 4e866e7a5..000000000 --- a/example/src/docs/zh-CN/currency/custom-service.md +++ /dev/null @@ -1,26 +0,0 @@ -
-

- -

- -## Currency 币种 - - - -Currency 币种组件,用于货币名称展示及选择,通过配置数据源获取选项。 -
- -### 自定义服务 - -通过 `fetch-currency` 属性可以指定一个方法,在方法中可实现请求自定义的服务。 -通过 `clearable ` 属性设置是否可以清空,默认值为 true。 - - - -
- -自定义服务时,通过 `fields` 属性可以指定显示内容和值在数据中对应的字段。 - - - -
diff --git a/example/src/docs/zh-CN/currency/size.md b/example/src/docs/zh-CN/currency/size.md deleted file mode 100644 index aafae248f..000000000 --- a/example/src/docs/zh-CN/currency/size.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Currency 币种 - - - -Currency 币种组件,用于货币名称展示及选择,通过配置数据源获取选项。 -
- -### 设置组件大小 - -可设置为:`medium`,`small`,`mini` - - -
- diff --git a/example/src/docs/zh-CN/date-picker/about-clear.md b/example/src/docs/zh-CN/date-picker/about-clear.md deleted file mode 100644 index 4613b5713..000000000 --- a/example/src/docs/zh-CN/date-picker/about-clear.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 清除输入 - -选择日期后,鼠标悬停在输入框时,默认会显示清除图标,单击图标可以清除输入框内容。设置 `clearable` 属性为 false 后,则不显示清除图标,不可清除。通过 `clear-icon` 属性可以自定义清除图标。 - - - -
- diff --git a/example/src/docs/zh-CN/date-picker/about-format.md b/example/src/docs/zh-CN/date-picker/about-format.md deleted file mode 100644 index 7fac523c8..000000000 --- a/example/src/docs/zh-CN/date-picker/about-format.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 格式化相关 - -通过 `format` 属性设置输入框的格式,`value-format` 属性设置绑定值的格式。更多日期格式需查看 Date Format 属性列表。 - - - -
- diff --git a/example/src/docs/zh-CN/date-picker/align.md b/example/src/docs/zh-CN/date-picker/align.md deleted file mode 100644 index 56d898f61..000000000 --- a/example/src/docs/zh-CN/date-picker/align.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 对齐方式 - -通过 `align` 属性可以设置日期选择面板与输入框之间的对齐方式,可选值有 left、right、center,默认为 left 左对齐。 - - - -
- diff --git a/example/src/docs/zh-CN/date-picker/basic-usage.md b/example/src/docs/zh-CN/date-picker/basic-usage.md deleted file mode 100644 index 782076a1d..000000000 --- a/example/src/docs/zh-CN/date-picker/basic-usage.md +++ /dev/null @@ -1,37 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 基本用法 - - - -
- - - -
- -### Date Picker Options - - - -
- -### Shortcuts - - - -
- -### Date Format - - diff --git a/example/src/docs/zh-CN/date-picker/custom-range.md b/example/src/docs/zh-CN/date-picker/custom-range.md deleted file mode 100644 index 89dbf62c4..000000000 --- a/example/src/docs/zh-CN/date-picker/custom-range.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 范围选择自定义相关 - -范围选择时,`start-placeholder` 和 `end-placeholder` 属性可分别指定开始日期和结束日期输入框的占位符。`range-separator` 属性指定开始日期和结束日期输入框之间的分隔符。 - - - -
- diff --git a/example/src/docs/zh-CN/date-picker/custom-suffix-icon.md b/example/src/docs/zh-CN/date-picker/custom-suffix-icon.md deleted file mode 100644 index 07660f8b2..000000000 --- a/example/src/docs/zh-CN/date-picker/custom-suffix-icon.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 - -
- -### 自定义后置图标 - -通过 `suffix-icon` 属性设置日期输入框前置图标,从 `@opentiny/vue-icon` 中导入一个图标并进行初始化后传给 `suffix-icon`。 - - - -
- -### 自定义下拉框的类名 - -通过 `popper-class` 属性设置下拉框的类名。 - - - -
diff --git a/example/src/docs/zh-CN/date-picker/date-picker-disabled.md b/example/src/docs/zh-CN/date-picker/date-picker-disabled.md deleted file mode 100644 index 0ec74650d..000000000 --- a/example/src/docs/zh-CN/date-picker/date-picker-disabled.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 禁用 - -通过 `disabled` 属性控制组件禁用 - - - -
- diff --git a/example/src/docs/zh-CN/date-picker/date-picker-events.md b/example/src/docs/zh-CN/date-picker/date-picker-events.md deleted file mode 100644 index 1f8fd44eb..000000000 --- a/example/src/docs/zh-CN/date-picker/date-picker-events.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 事件 - -主要事件有 change、blur、focus。 - - - -
- diff --git a/example/src/docs/zh-CN/date-picker/date-range-shortcuts.md b/example/src/docs/zh-CN/date-picker/date-range-shortcuts.md deleted file mode 100644 index 05707cd1a..000000000 --- a/example/src/docs/zh-CN/date-picker/date-range-shortcuts.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 日期范围快捷选项 - -通过 `picker-options` 对象设置日期范围快捷选项。 - -通过 `firstDayOfWeek` 周起始日,该属性可选值为 1 到 7,默认值为 7。 - - - -
diff --git a/example/src/docs/zh-CN/date-picker/date-range.md b/example/src/docs/zh-CN/date-picker/date-range.md deleted file mode 100644 index c92fab17b..000000000 --- a/example/src/docs/zh-CN/date-picker/date-range.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 选择日期范围 - -设置 `type` 属性为 daterange,可以设置以日期范围的形式进行选择。 -通过 `onPick` 获取选中日期后会执行的回调,需要与 `daterange` 或 `datetimerange` 才生效,需要配置在 `picker-options` 中。 - - - -
- diff --git a/example/src/docs/zh-CN/date-picker/date-shortcuts.md b/example/src/docs/zh-CN/date-picker/date-shortcuts.md deleted file mode 100644 index ad7675109..000000000 --- a/example/src/docs/zh-CN/date-picker/date-shortcuts.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 选择日带快捷选项 - -通过 `picker-options` 属性,该属性是一个对象,在其中指定 `shortcuts` 对象数组可以设置快捷选项。同时可以根据需要设置 `disabledDate` 方法禁用日期。 - - - -
- diff --git a/example/src/docs/zh-CN/date-picker/default-time-of-range.md b/example/src/docs/zh-CN/date-picker/default-time-of-range.md deleted file mode 100644 index 85656bf2c..000000000 --- a/example/src/docs/zh-CN/date-picker/default-time-of-range.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 日期范围默认时刻 - -使用 `datetimerange` 设置日期范围时,可以通过 `default-time` 属性设置起始与结束的时刻,默认是选定日期的 00:00:00 作为起始与结束的时刻。`default-time` 接受一个数组,数组的每一项都为一个字符串,第一项控制起始日期的时刻,第二项控制结束日期的时刻。 - - - -
- diff --git a/example/src/docs/zh-CN/date-picker/default-value.md b/example/src/docs/zh-CN/date-picker/default-value.md deleted file mode 100644 index e8d47a3eb..000000000 --- a/example/src/docs/zh-CN/date-picker/default-value.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 选择器打开时默认时间设置 - -`default-value` 属性指定日期选择器面板打开时默认选中的日期。 - - - -
- diff --git a/example/src/docs/zh-CN/date-picker/disabled.md b/example/src/docs/zh-CN/date-picker/disabled.md deleted file mode 100644 index bc42d5cce..000000000 --- a/example/src/docs/zh-CN/date-picker/disabled.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 禁用 - - - -
- diff --git a/example/src/docs/zh-CN/date-picker/editable.md b/example/src/docs/zh-CN/date-picker/editable.md deleted file mode 100644 index 624fa27ec..000000000 --- a/example/src/docs/zh-CN/date-picker/editable.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 文本框不可输入 - -日期输入框默认可以输入日期,设置 `editable` 为 false 后,将不能输入。 - - - -
- diff --git a/example/src/docs/zh-CN/date-picker/focus.md b/example/src/docs/zh-CN/date-picker/focus.md deleted file mode 100644 index 822873923..000000000 --- a/example/src/docs/zh-CN/date-picker/focus.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 - -
- -### 获取焦点 - -通过 `focus` 方法设置使 input 获取焦点。 - - - -
diff --git a/example/src/docs/zh-CN/date-picker/max-min.md b/example/src/docs/zh-CN/date-picker/max-min.md deleted file mode 100644 index 867852294..000000000 --- a/example/src/docs/zh-CN/date-picker/max-min.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 最大最小值 - -配置 `picker-options` 属性,在对象中的 `disabledDate` 方法中根据日期进行判断来禁用指定的日期段,通过这种方式来实现最大最小值。 - - - -
- diff --git a/example/src/docs/zh-CN/date-picker/month-range-shortcuts.md b/example/src/docs/zh-CN/date-picker/month-range-shortcuts.md deleted file mode 100644 index ef0e49b03..000000000 --- a/example/src/docs/zh-CN/date-picker/month-range-shortcuts.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 - -
- -### 月份范围快捷选项 - -同样通过 `picker-options` 对象设置月份范围快捷选项。 - - - -
- -### 只读 - -通过 `readonly` 属性设置日历组件是否只读。 - - - -
diff --git a/example/src/docs/zh-CN/date-picker/month-range.md b/example/src/docs/zh-CN/date-picker/month-range.md deleted file mode 100644 index c6d177d50..000000000 --- a/example/src/docs/zh-CN/date-picker/month-range.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 选择月份范围 - -设置 `type` 属性为 monthrange,可以设置以月份范围的形式进行选择。 - - - -
- diff --git a/example/src/docs/zh-CN/date-picker/other-picker-type.md b/example/src/docs/zh-CN/date-picker/other-picker-type.md deleted file mode 100644 index 243caee85..000000000 --- a/example/src/docs/zh-CN/date-picker/other-picker-type.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 其他日期单位 - -通过 `type` 属性可以设置不同的日期单位,如下示例中配置的有 week、year、month、dates。 - - - -
- diff --git a/example/src/docs/zh-CN/date-picker/set-size.md b/example/src/docs/zh-CN/date-picker/set-size.md deleted file mode 100644 index 285b8c2e1..000000000 --- a/example/src/docs/zh-CN/date-picker/set-size.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 尺寸设置 - -通过 `size` 属性可以设置日期输入框的尺寸,可选值有 medium、small、mini。 - - - -
- diff --git a/example/src/docs/zh-CN/date-picker/time-arrow-control.md b/example/src/docs/zh-CN/date-picker/time-arrow-control.md deleted file mode 100644 index 91cd76c81..000000000 --- a/example/src/docs/zh-CN/date-picker/time-arrow-control.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 箭头按钮控制时间选择 - -当 `type` 为 datetime、datetimerange 时,设置 `time-arrow-control` 属性为 true,在时间面板中将显示箭头按钮,通过箭头按钮控制时间选择。默认为滚动选择时间。 - - - -
diff --git a/example/src/docs/zh-CN/date-picker/time-format.md b/example/src/docs/zh-CN/date-picker/time-format.md deleted file mode 100644 index 3900509c6..000000000 --- a/example/src/docs/zh-CN/date-picker/time-format.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 时区选择 - -通过 `time-format` 属性可以设置日期选择面板的时间显示格式 - - - -
diff --git a/example/src/docs/zh-CN/date-picker/time-zone.md b/example/src/docs/zh-CN/date-picker/time-zone.md deleted file mode 100644 index fd6f7a0cf..000000000 --- a/example/src/docs/zh-CN/date-picker/time-zone.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 时区选择 - -通过 `show-timezone` 属性可以设置日期选择面板时区选择,同时需要引入 timezoneData 时区数据 - - - -
diff --git a/example/src/docs/zh-CN/date-picker/unlink-panels.md b/example/src/docs/zh-CN/date-picker/unlink-panels.md deleted file mode 100644 index d045d4069..000000000 --- a/example/src/docs/zh-CN/date-picker/unlink-panels.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 范围选择取消面板联动 - -范围选择时,默认情况下,在开始日期面板中单击上一月或上一年箭头图标时,结束日期面板中日期也联动切换到上一月或上一年。在结束日期面板中切换下一月或下一年时,开始日期面板也随之联动。但若配置 `unlink-panels` 属性为 true ,面板之间就不再联动,切换年月时只对当前面板生效。 - - - -
- diff --git a/example/src/docs/zh-CN/date-picker/utc8.md b/example/src/docs/zh-CN/date-picker/utc8.md deleted file mode 100644 index 80a0d15cd..000000000 --- a/example/src/docs/zh-CN/date-picker/utc8.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DatePicker 海外显示东八区时间 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 时区选择 - -通过 `isutc8` 属性可以设置是否显示为东八区时间 - - - -
diff --git a/example/src/docs/zh-CN/date-picker/validate-event.md b/example/src/docs/zh-CN/date-picker/validate-event.md deleted file mode 100644 index a9bdf43fe..000000000 --- a/example/src/docs/zh-CN/date-picker/validate-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DatePicker 日期选择器 - - - -用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。 -
- -### 不触发表单校验 - -日期选择器在输入时默认会触发表单校验,触发方式有 blur、change。但若设置 `validate-event` 属性为 false,将不再触发表单校验。 - - - -
diff --git a/example/src/docs/zh-CN/dept/auto-select.md b/example/src/docs/zh-CN/dept/auto-select.md deleted file mode 100644 index 1f6ceea0c..000000000 --- a/example/src/docs/zh-CN/dept/auto-select.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Dept 部门 - - - -部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。 -
- -### 部门信息自动选中 - -`auto-select` 默认值为 true,配置该属性为 false 可以阻止当部门信息仅一个时自动补全选中行为。 - - - -
diff --git a/example/src/docs/zh-CN/dept/basic-usage.md b/example/src/docs/zh-CN/dept/basic-usage.md deleted file mode 100644 index 005ba14f4..000000000 --- a/example/src/docs/zh-CN/dept/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Dept 部门 - - - -部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/dept/before-confirm.md b/example/src/docs/zh-CN/dept/before-confirm.md deleted file mode 100644 index 9ba53ce30..000000000 --- a/example/src/docs/zh-CN/dept/before-confirm.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Dept 部门 - - - -部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。 -
- -### 阻止弹框关闭 - -before-confirm(确认前回调事件),方法里面 return true/false,表示是否关闭弹框 - - - -
diff --git a/example/src/docs/zh-CN/dept/custom-service.md b/example/src/docs/zh-CN/dept/custom-service.md deleted file mode 100644 index 58d0a0a12..000000000 --- a/example/src/docs/zh-CN/dept/custom-service.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Dept 部门 - - - -部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。 -
- -### 自定义服务数据 - -提供 `fetch-dept-by-value`、`fetch-dept`、`fetch-dept-list` 属性用于自定义部门服务。 - - - -
diff --git a/example/src/docs/zh-CN/dept/dept-events.md b/example/src/docs/zh-CN/dept/dept-events.md deleted file mode 100644 index 85e9e59fc..000000000 --- a/example/src/docs/zh-CN/dept/dept-events.md +++ /dev/null @@ -1,31 +0,0 @@ -
-

- -

- -## Dept 部门 - - - -部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。 -
- -### open 和 change 事件 - - - -### selected 事件 - - - -### close 事件 - - - -### confirm 事件 - - - -### cancel 事件 - - diff --git a/example/src/docs/zh-CN/dept/dynamic-disable.md b/example/src/docs/zh-CN/dept/dynamic-disable.md deleted file mode 100644 index d159a1829..000000000 --- a/example/src/docs/zh-CN/dept/dynamic-disable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Dept 部门 - - - -部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。 -
- -### 禁用 - -可通过 `disabled` 设置是否禁用,默认为 fase - - - -
diff --git a/example/src/docs/zh-CN/dept/size.md b/example/src/docs/zh-CN/dept/size.md deleted file mode 100644 index 5b6df191a..000000000 --- a/example/src/docs/zh-CN/dept/size.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Dept 部门 - - - -部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。 -
- -### 设置组件大小 - -可以设置为:`medium`,`small`,`mini` - - - -
diff --git a/example/src/docs/zh-CN/dept/slot-hrapprover.md b/example/src/docs/zh-CN/dept/slot-hrapprover.md deleted file mode 100644 index 942315fb3..000000000 --- a/example/src/docs/zh-CN/dept/slot-hrapprover.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Dept 部门 - - - -部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。 -
- -### 权签人插槽 - - - -
diff --git a/example/src/docs/zh-CN/dept/title.md b/example/src/docs/zh-CN/dept/title.md deleted file mode 100644 index d1a4d0556..000000000 --- a/example/src/docs/zh-CN/dept/title.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Dept 部门 - - - -部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。 - -
- -### 设置弹出框标题 - -自定义弹出框标题,该属性默认值为空。 - - - -
diff --git a/example/src/docs/zh-CN/detail-page/basic-usage.md b/example/src/docs/zh-CN/detail-page/basic-usage.md deleted file mode 100644 index 8160d2c19..000000000 --- a/example/src/docs/zh-CN/detail-page/basic-usage.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## DetailPage 表头详情栏 - - - -DetailPage 带表头的详情栏组件。 -
- -### 基本用法 - -在数据对象中可设置 `hidden: true` 来指定默认隐藏的数据。 - - - -
- - diff --git a/example/src/docs/zh-CN/detail-page/custom-show-text.md b/example/src/docs/zh-CN/detail-page/custom-show-text.md deleted file mode 100644 index 9881d4577..000000000 --- a/example/src/docs/zh-CN/detail-page/custom-show-text.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DetailPage 表头详情栏 - - - -DetailPage 带表头的详情栏组件。 -
- -### 自定义展示文本 - -通过 `title`、`text-split`、`dialog-title`、`label-title`、`value-title`、`tips`、`save-button`、`cancel-button` 这些属性可指定表头详情栏组件不同位置的展示文本。 - - - -
diff --git a/example/src/docs/zh-CN/dialog-box/basic-usage.md b/example/src/docs/zh-CN/dialog-box/basic-usage.md deleted file mode 100644 index b907340f8..000000000 --- a/example/src/docs/zh-CN/dialog-box/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/dialog-box/center.md b/example/src/docs/zh-CN/dialog-box/center.md deleted file mode 100644 index c1f83c242..000000000 --- a/example/src/docs/zh-CN/dialog-box/center.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 头部和底部水平居中 - -头部标题默认显示在区域左侧,设置 `center` 为 true 后,将居中显示。 - - - -
diff --git a/example/src/docs/zh-CN/dialog-box/close-on-click-modal.md b/example/src/docs/zh-CN/dialog-box/close-on-click-modal.md deleted file mode 100644 index e360b1198..000000000 --- a/example/src/docs/zh-CN/dialog-box/close-on-click-modal.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 点击遮罩时不关闭弹窗 - -默认弹窗打开后,可以单击遮罩层关闭弹窗,设置 `close-on-click-modal` 为 false 后将禁用该功能。 - - - -
diff --git a/example/src/docs/zh-CN/dialog-box/close-on-press-escape.md b/example/src/docs/zh-CN/dialog-box/close-on-press-escape.md deleted file mode 100644 index dde878933..000000000 --- a/example/src/docs/zh-CN/dialog-box/close-on-press-escape.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 禁用 ESC 关闭 - -默认弹窗打开后,可以按下 Esc 键关闭弹窗,设置 `close-on-press-escape` 为 false 后将禁用该功能。 - - - -
diff --git a/example/src/docs/zh-CN/dialog-box/custom-dialog-content.md b/example/src/docs/zh-CN/dialog-box/custom-dialog-content.md deleted file mode 100644 index 208395ed9..000000000 --- a/example/src/docs/zh-CN/dialog-box/custom-dialog-content.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 自定义内容 - -通过 default 默认插槽自定义弹窗主体部分的内容。 - - - -
diff --git a/example/src/docs/zh-CN/dialog-box/custom-dialog-footer.md b/example/src/docs/zh-CN/dialog-box/custom-dialog-footer.md deleted file mode 100644 index 377952501..000000000 --- a/example/src/docs/zh-CN/dialog-box/custom-dialog-footer.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 自定义底部 - -通过 `footer` 插槽自定义弹窗底部操作区内容。 - - - -
diff --git a/example/src/docs/zh-CN/dialog-box/custom-dialog-title.md b/example/src/docs/zh-CN/dialog-box/custom-dialog-title.md deleted file mode 100644 index 740f8261d..000000000 --- a/example/src/docs/zh-CN/dialog-box/custom-dialog-title.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 自定义标题 - -除 `title` 属性可以设置弹窗标题外,还可以通过 `title` 插槽自定义弹窗标题区的内容。 - - - -
diff --git a/example/src/docs/zh-CN/dialog-box/dialog-top-height.md b/example/src/docs/zh-CN/dialog-box/dialog-top-height.md deleted file mode 100644 index 06dc39cdd..000000000 --- a/example/src/docs/zh-CN/dialog-box/dialog-top-height.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 弹窗距离顶部的高度 - -通过 `top` 属性指定弹窗距离窗口顶部的高度,默认为屏高的 15% 。 - - - -
diff --git a/example/src/docs/zh-CN/dialog-box/dialog-width.md b/example/src/docs/zh-CN/dialog-box/dialog-width.md deleted file mode 100644 index b611c2306..000000000 --- a/example/src/docs/zh-CN/dialog-box/dialog-width.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 弹窗的宽度 - -通过 `width` 属性指定弹窗的宽度。 - - - -
diff --git a/example/src/docs/zh-CN/dialog-box/draggable.md b/example/src/docs/zh-CN/dialog-box/draggable.md deleted file mode 100644 index 89119b2dc..000000000 --- a/example/src/docs/zh-CN/dialog-box/draggable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 可拖拽的弹窗 - -默认弹窗不可拖拽,设置 `draggable` 属性为 true 后,鼠标移入标题区域单击可拖拽,拖拽事件有 `@drag-start`、`drag-move`、`drag-end`。 - - - -
diff --git a/example/src/docs/zh-CN/dialog-box/form-in-dialog.md b/example/src/docs/zh-CN/dialog-box/form-in-dialog.md deleted file mode 100644 index 2ea133063..000000000 --- a/example/src/docs/zh-CN/dialog-box/form-in-dialog.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 弹窗表单 - -通过 default 默认插槽实现嵌套表单以及表单提交的逻辑。 - - - -
diff --git a/example/src/docs/zh-CN/dialog-box/fullscreen.md b/example/src/docs/zh-CN/dialog-box/fullscreen.md deleted file mode 100644 index cde9876c0..000000000 --- a/example/src/docs/zh-CN/dialog-box/fullscreen.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 全屏弹窗 - -设置 `fullscreen` 属性为 true 可显示全屏弹窗,默认弹窗宽度是 500px,此时设置宽度是不生效的。 - - - -
diff --git a/example/src/docs/zh-CN/dialog-box/hidden-close-buttons.md b/example/src/docs/zh-CN/dialog-box/hidden-close-buttons.md deleted file mode 100644 index 0c789d6be..000000000 --- a/example/src/docs/zh-CN/dialog-box/hidden-close-buttons.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 隐藏关闭按钮 - -默认弹窗右上角会显示关闭图标,单击可以关闭弹窗。若设置 `show-close` 为 false 后,将隐藏关闭图标,要实现关闭弹窗的功能可以通过底部操作区按钮的 click 事件切换 `visible` 属性的值为 false 。 - - - -
diff --git a/example/src/docs/zh-CN/dialog-box/hidden-header.md b/example/src/docs/zh-CN/dialog-box/hidden-header.md deleted file mode 100644 index 422cc0984..000000000 --- a/example/src/docs/zh-CN/dialog-box/hidden-header.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 隐藏标题区域 - -弹窗默认有标题区域,设置 `show-header` 为 false 后,将隐藏标题区域。 - - - -
diff --git a/example/src/docs/zh-CN/dialog-box/lock-scroll.md b/example/src/docs/zh-CN/dialog-box/lock-scroll.md deleted file mode 100644 index 9f8be11bd..000000000 --- a/example/src/docs/zh-CN/dialog-box/lock-scroll.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 弹出时禁用滚动 - -弹窗弹出后,背景页面默认仍然是不可以滚动的,设置 `lock-scroll` 为 fasle 后将不锁定被遮罩内容的滚动。 - - - -
diff --git a/example/src/docs/zh-CN/dialog-box/no-modal.md b/example/src/docs/zh-CN/dialog-box/no-modal.md deleted file mode 100644 index f0578f771..000000000 --- a/example/src/docs/zh-CN/dialog-box/no-modal.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 不启用遮罩层 - -默认弹窗打开时会显示遮罩层,设置 `modal` 为 false 后将不启用遮罩层。无遮罩层时,单击弹窗外部区域仍然可以关闭弹窗。 - - - -
diff --git a/example/src/docs/zh-CN/dialog-box/open-close-events.md b/example/src/docs/zh-CN/dialog-box/open-close-events.md deleted file mode 100644 index 59a3efa93..000000000 --- a/example/src/docs/zh-CN/dialog-box/open-close-events.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 弹出与关闭事件 - -`open` :对话框打开时触发,`opened` :对话框打开动画结束时触发,`close` :对话框关闭时触发,`closed` :对话框关闭动画结束时触发。 - - - -
diff --git a/example/src/docs/zh-CN/dialog-box/right-dialog.md b/example/src/docs/zh-CN/dialog-box/right-dialog.md deleted file mode 100644 index a8a092044..000000000 --- a/example/src/docs/zh-CN/dialog-box/right-dialog.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 右侧弹窗 - -设置 `right-slide` 属性为 true 后,弹窗将从窗口右侧弹出。 - -设置 ` modal-append-to-body` 属性默认为 true 遮罩层应用在 body 上。 - - - -
diff --git a/example/src/docs/zh-CN/dialog-box/secondary-dialog.md b/example/src/docs/zh-CN/dialog-box/secondary-dialog.md deleted file mode 100644 index 428128a65..000000000 --- a/example/src/docs/zh-CN/dialog-box/secondary-dialog.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DialogBox 对话框 - - - -模态对话框,在浮层中显示,引导用户进行相关操作。 -
- -### 二级弹窗 - -通过 default 默认插槽和底部操作区按钮实现二级弹窗。设置 `append-to-body` 属性后,二级弹窗的实体 DOM 结构将追加到 body 元素上。 - - - -
diff --git a/example/src/docs/zh-CN/drop-roles/basic-usage.md b/example/src/docs/zh-CN/drop-roles/basic-usage.md deleted file mode 100644 index cae498fbe..000000000 --- a/example/src/docs/zh-CN/drop-roles/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DropRoles 下拉角色 - - - -DropRoles,提供当前用户的角色列表,并可以在不同角色间进行切换。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/drop-roles/change-role-event.md b/example/src/docs/zh-CN/drop-roles/change-role-event.md deleted file mode 100644 index 88d4a6258..000000000 --- a/example/src/docs/zh-CN/drop-roles/change-role-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## DropRoles 下拉角色 - - - -DropRoles,提供当前用户的角色列表,并可以在不同角色间进行切换。 -
- -### change 事件 - -切换下拉角色时触发 change 事件,需要通过 change 事件回调方法去发送请求。 - - - -
diff --git a/example/src/docs/zh-CN/drop-roles/custom-service.md b/example/src/docs/zh-CN/drop-roles/custom-service.md deleted file mode 100644 index 354606b3f..000000000 --- a/example/src/docs/zh-CN/drop-roles/custom-service.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## DropRoles 下拉角色 - - - -DropRoles,提供当前用户的角色列表,并可以在不同角色间进行切换。 -
- -### 自定义服务 - -可通过 `fetch-role` 和 `fetch-current-role` 两个方法自定义服务,同时可通过 `fields` 属性指定显示和绑定值对应的字段。 -可通过 `placeholder` 展示占位符。 - - - -
diff --git a/example/src/docs/zh-CN/drop-roles/size.md b/example/src/docs/zh-CN/drop-roles/size.md deleted file mode 100644 index 7482e52e0..000000000 --- a/example/src/docs/zh-CN/drop-roles/size.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## DropRoles 下拉角色 - - - -DropRoles,提供当前用户的角色列表,并可以在不同角色间进行切换。 -
- -### 设置组件大小 - -可设置为:`medium`,`small`,`mini` - - -
diff --git a/example/src/docs/zh-CN/drop-times/basic-usage.md b/example/src/docs/zh-CN/drop-times/basic-usage.md deleted file mode 100644 index ee13bc7b4..000000000 --- a/example/src/docs/zh-CN/drop-times/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## dropTimes 下拉时间 - - - -时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/drop-times/size.md b/example/src/docs/zh-CN/drop-times/size.md deleted file mode 100644 index 590b16559..000000000 --- a/example/src/docs/zh-CN/drop-times/size.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## dropTimes 下拉时间 - - - -时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。 -
- -### 设置组件大小的size属性 - - 可设置为:medium,small,mini - - -
diff --git a/example/src/docs/zh-CN/drop-times/start-end-step.md b/example/src/docs/zh-CN/drop-times/start-end-step.md deleted file mode 100644 index 1c0ce3820..000000000 --- a/example/src/docs/zh-CN/drop-times/start-end-step.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## dropTimes 下拉时间 - - - -时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。 -
- -### 步长与时间区间 - -`start` 设置区间的起始时间,默认为 0 ,`end` 设置区间的结束时间,默认为 24 * 60 ,`step` 设置间隔的步长,默认为 15 。 - - - -
diff --git a/example/src/docs/zh-CN/dropdown/basic-usage.md b/example/src/docs/zh-CN/dropdown/basic-usage.md deleted file mode 100644 index 38f46503f..000000000 --- a/example/src/docs/zh-CN/dropdown/basic-usage.md +++ /dev/null @@ -1,30 +0,0 @@ -
-

- -

- -## Dropdown 下拉菜单 - - - -将动作或菜单折叠到下拉菜单中。 - -
- -### 基本用法 - - - -
- - - -### Dropdown-Menu 属性 - - - -
- -### Dropdown-Item 属性 - - diff --git a/example/src/docs/zh-CN/dropdown/disabled.md b/example/src/docs/zh-CN/dropdown/disabled.md deleted file mode 100644 index f00bef313..000000000 --- a/example/src/docs/zh-CN/dropdown/disabled.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## Dropdown 下拉菜单 - - - -将动作或菜单折叠到下拉菜单中。 - -
- -### 禁用 - -Dropdown、DropdownItem 两个组件分别可以通过 `disabled` 属性设置禁用状态。 - - diff --git a/example/src/docs/zh-CN/dropdown/events.md b/example/src/docs/zh-CN/dropdown/events.md deleted file mode 100644 index 1e21cdc84..000000000 --- a/example/src/docs/zh-CN/dropdown/events.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## Dropdown 下拉菜单 - - - -将动作或菜单折叠到下拉菜单中。 - -
- -### 内置事件 - -内置事件包含:`button-click`、`item-click`、`visible-change` 事件。 - - diff --git a/example/src/docs/zh-CN/dropdown/hide-on-click.md b/example/src/docs/zh-CN/dropdown/hide-on-click.md deleted file mode 100644 index a1b82b4d0..000000000 --- a/example/src/docs/zh-CN/dropdown/hide-on-click.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Dropdown 下拉菜单 - - - -将动作或菜单折叠到下拉菜单中。 - -
- -### 菜单隐藏方式 - -下拉菜单默认在点击菜单项后会被隐藏,将 `hide-on-click` 属性默认为 `false` 可以关闭此功能。 - - - diff --git a/example/src/docs/zh-CN/dropdown/multi-level.md b/example/src/docs/zh-CN/dropdown/multi-level.md deleted file mode 100644 index cb369b5b5..000000000 --- a/example/src/docs/zh-CN/dropdown/multi-level.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Dropdown 下拉菜单 - - - -将动作或菜单折叠到下拉菜单中。 - -
- -### 多级下拉菜单 - -可以通过 `children`字段设置菜单的子节点 - - - diff --git a/example/src/docs/zh-CN/dropdown/size.md b/example/src/docs/zh-CN/dropdown/size.md deleted file mode 100644 index 286e4b964..000000000 --- a/example/src/docs/zh-CN/dropdown/size.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Dropdown 下拉菜单 - - - -将动作或菜单折叠到下拉菜单中。 - -
- -### 不同尺寸 - -额外的尺寸:`medium`、`small`、`mini`,通过设置 `size` 属性来配置它们。 - - - diff --git a/example/src/docs/zh-CN/dropdown/split-button.md b/example/src/docs/zh-CN/dropdown/split-button.md deleted file mode 100644 index 4bf49be4a..000000000 --- a/example/src/docs/zh-CN/dropdown/split-button.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Dropdown 下拉菜单 - - - -将动作或菜单折叠到下拉菜单中。 - -
- -### 触发对象 - -可使用内置按钮触发下拉菜单。 - - - diff --git a/example/src/docs/zh-CN/dropdown/trigger.md b/example/src/docs/zh-CN/dropdown/trigger.md deleted file mode 100644 index 6d64ad625..000000000 --- a/example/src/docs/zh-CN/dropdown/trigger.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Dropdown 下拉菜单 - - - -将动作或菜单折叠到下拉菜单中。 - -
- -### 触发方式 - -可以配置 `click` 激活或者 `hover` 激活。 - - - diff --git a/example/src/docs/zh-CN/espace/basic-usage.md b/example/src/docs/zh-CN/espace/basic-usage.md deleted file mode 100644 index 30fa95179..000000000 --- a/example/src/docs/zh-CN/espace/basic-usage.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Espace 消息弹框 - - - -主要和 UserContact 联系人组件配套使用,快捷打开对应用户的 eSpace 弹窗,eSpace 呼叫,邮件等应用。 -
- -### 基本用法 - -`data` 属性设置组件数据,数组对象中包含选项有 type、value、icon。其中 type 的可选择值有:im、sip、mailto 。单击图标,将会打开 type 选项值对应的外部应用。 - - - -
- - diff --git a/example/src/docs/zh-CN/espace/use-in-usercontact.md b/example/src/docs/zh-CN/espace/use-in-usercontact.md deleted file mode 100644 index 770fb2a08..000000000 --- a/example/src/docs/zh-CN/espace/use-in-usercontact.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Espace 消息弹框 - - - -主要和 UserContact 联系人组件配套使用,快捷打开对应用户的 eSpace 弹窗,eSpace 呼叫,邮件等应用。 -
- -### 用户联系人使用 eSpace - -UserContact 联系人组件提供了 `espace` 属性配置 Espace 组件需要的数据。该组件内部实际使用了 Espace 组件。 - - - -
diff --git a/example/src/docs/zh-CN/fall-menu/basic-usage.md b/example/src/docs/zh-CN/fall-menu/basic-usage.md deleted file mode 100644 index 995e4985c..000000000 --- a/example/src/docs/zh-CN/fall-menu/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FallMenu 瀑布菜单 - - - -FallMenu 瀑布菜单以横向方式显示,支持三级菜单配置,适用于版型定制,以弹出的方式展示。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/fall-menu/custom-menuitem.md b/example/src/docs/zh-CN/fall-menu/custom-menuitem.md deleted file mode 100644 index d3f348e66..000000000 --- a/example/src/docs/zh-CN/fall-menu/custom-menuitem.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FallMenu 瀑布菜单 - - - -FallMenu 瀑布菜单以横向方式显示,支持三级菜单配置,适用于版型定制,以弹出的方式展示。 -
- -### 自定义内容 - -通过 `level1` 插槽自定义一级菜单内容,通过 `level2` 插槽自定义二级菜单内容,通过 `level3` 插槽自定义三级菜单内容。 - - - -
diff --git a/example/src/docs/zh-CN/fall-menu/custom-slider-icon.md b/example/src/docs/zh-CN/fall-menu/custom-slider-icon.md deleted file mode 100644 index 687a7df30..000000000 --- a/example/src/docs/zh-CN/fall-menu/custom-slider-icon.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FallMenu 瀑布菜单 - - - -FallMenu 瀑布菜单以横向方式显示,支持三级菜单配置,适用于版型定制,以弹出的方式展示。 -
- -### 自定义左/右侧图标 - -通过 `left` 插槽自定义左侧切换图标为 IconLeft ,通过 `right` 插槽右侧切换图标 IconRight 。 - - - -
diff --git a/example/src/docs/zh-CN/fall-menu/data-resource.md b/example/src/docs/zh-CN/fall-menu/data-resource.md deleted file mode 100644 index 98706c17a..000000000 --- a/example/src/docs/zh-CN/fall-menu/data-resource.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FallMenu 瀑布菜单 - - - -FallMenu 瀑布菜单以横向方式显示,支持三级菜单配置,适用于版型定制,以弹出的方式展示。 -
- -### 数据源 - -通过 `data` 设置瀑布菜单的数据。 - - - -
diff --git a/example/src/docs/zh-CN/file-upload/abort-quest.md b/example/src/docs/zh-CN/file-upload/abort-quest.md deleted file mode 100644 index 9b26912f2..000000000 --- a/example/src/docs/zh-CN/file-upload/abort-quest.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 手动取消上传请求 - -调用组件abort方法,取消上传请求 - diff --git a/example/src/docs/zh-CN/file-upload/accept-file-type.md b/example/src/docs/zh-CN/file-upload/accept-file-type.md deleted file mode 100644 index 332e3f8b7..000000000 --- a/example/src/docs/zh-CN/file-upload/accept-file-type.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 可上传的文件类型 - -通过配置 accept(image) 来限制上传文件的格式为 image - - - -通过配置 accept(.doc,.docx) 来限制上传文件的格式为 .doc .docx - -
diff --git a/example/src/docs/zh-CN/file-upload/basic-usage.md b/example/src/docs/zh-CN/file-upload/basic-usage.md deleted file mode 100644 index 5aa109d0a..000000000 --- a/example/src/docs/zh-CN/file-upload/basic-usage.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 基本用法 - -属性 action(type:String) 上传服务器地址。 - - -
- - diff --git a/example/src/docs/zh-CN/file-upload/clear-files.md b/example/src/docs/zh-CN/file-upload/clear-files.md deleted file mode 100644 index 12dcc49a6..000000000 --- a/example/src/docs/zh-CN/file-upload/clear-files.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 手动清空已上传文件列表 - -调用组件clearFiles方法,清空已上传的文件列表(该方法不支持在 before-upload 中调用) - diff --git a/example/src/docs/zh-CN/file-upload/custom-prefix.md b/example/src/docs/zh-CN/file-upload/custom-prefix.md deleted file mode 100644 index c4b8bfcb6..000000000 --- a/example/src/docs/zh-CN/file-upload/custom-prefix.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 钩子函数 - -`before-remove` 删除文件之前的钩子,参数为上传的文件和文件列表,若返回 false 或者返回 Promise 且被 reject,则停止删除。`before-upload` 上传文件之前的钩子,参数为上传的文件,若返回 false 或者返回 Promise 且被 reject,则停止上传。 - - - -
diff --git a/example/src/docs/zh-CN/file-upload/custom-trigger.md b/example/src/docs/zh-CN/file-upload/custom-trigger.md deleted file mode 100644 index 53855f19c..000000000 --- a/example/src/docs/zh-CN/file-upload/custom-trigger.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 自定义触发文件选项框 - -可在组件中写一个名为trigger的插槽,来触发弹出文件选项框 - diff --git a/example/src/docs/zh-CN/file-upload/custom-upload-request.md b/example/src/docs/zh-CN/file-upload/custom-upload-request.md deleted file mode 100644 index 8d23a5641..000000000 --- a/example/src/docs/zh-CN/file-upload/custom-upload-request.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 自定义上传请求 - -通过配置 `headers` ,设置自定义上传请求头信息 - - - -
- -### 覆盖默认请求 - -通过配置 `http-request` ,覆盖默认的上传行为,可以自定义上传的实现 - - - -
diff --git a/example/src/docs/zh-CN/file-upload/custom-upload-tip.md b/example/src/docs/zh-CN/file-upload/custom-upload-tip.md deleted file mode 100644 index 774277539..000000000 --- a/example/src/docs/zh-CN/file-upload/custom-upload-tip.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 自定义上传提示 - -可通过 tip 插槽来自定义上传提示 - - diff --git a/example/src/docs/zh-CN/file-upload/drag-select-file.md b/example/src/docs/zh-CN/file-upload/drag-select-file.md deleted file mode 100644 index 685ffff26..000000000 --- a/example/src/docs/zh-CN/file-upload/drag-select-file.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 拖拽上传 - -可配置drag(type:boolean),来控制组件是否可以拖拽文件 - - -
diff --git a/example/src/docs/zh-CN/file-upload/drag-upload.md b/example/src/docs/zh-CN/file-upload/drag-upload.md deleted file mode 100644 index 1e68e18b9..000000000 --- a/example/src/docs/zh-CN/file-upload/drag-upload.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 拖拽上传 - -可配置 `drag(type:boolean)`,来控制组件是否可以拖拽文件上传,如果配置了 `accept` 属性,可通过 `@drop-error` 事件获取不合规的拖拽文件。 - - -
diff --git a/example/src/docs/zh-CN/file-upload/dynamic-disable.md b/example/src/docs/zh-CN/file-upload/dynamic-disable.md deleted file mode 100644 index b47ae4f05..000000000 --- a/example/src/docs/zh-CN/file-upload/dynamic-disable.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 禁用 - -可配置disabled(type:boolean),来控制组件是否禁用 - - -
diff --git a/example/src/docs/zh-CN/file-upload/file-picture-card.md b/example/src/docs/zh-CN/file-upload/file-picture-card.md deleted file mode 100644 index 630180430..000000000 --- a/example/src/docs/zh-CN/file-upload/file-picture-card.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 文件缩略图 - - - -
diff --git a/example/src/docs/zh-CN/file-upload/image-size.md b/example/src/docs/zh-CN/file-upload/image-size.md deleted file mode 100644 index 8d201c7df..000000000 --- a/example/src/docs/zh-CN/file-upload/image-size.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### mini 模式 - -
- -获取上传的片的原始尺寸 - - - -
diff --git a/example/src/docs/zh-CN/file-upload/jalor-request.md b/example/src/docs/zh-CN/file-upload/jalor-request.md deleted file mode 100644 index 5aca06b1d..000000000 --- a/example/src/docs/zh-CN/file-upload/jalor-request.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 网关上传 - -不配置 `action` 属性时,默认生成网关链接,也可以通过 `getFileUploadUrl()` 方法获取生成的网关链接,如果要修改网关后面的上传地址请修改 `$service.setting.services.Fileupload.Upload`。 - - - -
diff --git a/example/src/docs/zh-CN/file-upload/manual-upload.md b/example/src/docs/zh-CN/file-upload/manual-upload.md deleted file mode 100644 index 87e6f37ce..000000000 --- a/example/src/docs/zh-CN/file-upload/manual-upload.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 手动上传 - -通过 action 配置上传地址,通过 submit 设置手动上传 - - - -
diff --git a/example/src/docs/zh-CN/file-upload/max-file-count.md b/example/src/docs/zh-CN/file-upload/max-file-count.md deleted file mode 100644 index 7c551cc1d..000000000 --- a/example/src/docs/zh-CN/file-upload/max-file-count.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 最大上传文件数 - -
- -可通过配置limit(type:Number,大于0的整数)来限制上传文件的个数 - - -
diff --git a/example/src/docs/zh-CN/file-upload/mini-mode.md b/example/src/docs/zh-CN/file-upload/mini-mode.md deleted file mode 100644 index 00f4531fd..000000000 --- a/example/src/docs/zh-CN/file-upload/mini-mode.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### mini 模式 - -
- -可通过配置 mini-mode,设置显示 mini 模式 - - - -
diff --git a/example/src/docs/zh-CN/file-upload/multiple-file.md b/example/src/docs/zh-CN/file-upload/multiple-file.md deleted file mode 100644 index 4a0cc89b0..000000000 --- a/example/src/docs/zh-CN/file-upload/multiple-file.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 文件多选 - -文件选择默认单选 -可配置multiple = 'true' 实现文件多选 - - -
diff --git a/example/src/docs/zh-CN/file-upload/picture-card.md b/example/src/docs/zh-CN/file-upload/picture-card.md deleted file mode 100644 index 550a8cdbd..000000000 --- a/example/src/docs/zh-CN/file-upload/picture-card.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 照片墙 - -可配置list-type = 'picture-card'开启照片墙模式 - - -
diff --git a/example/src/docs/zh-CN/file-upload/picture-list.md b/example/src/docs/zh-CN/file-upload/picture-list.md deleted file mode 100644 index c832dcb3c..000000000 --- a/example/src/docs/zh-CN/file-upload/picture-list.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 图片列表缩略图 - -
- -可通过配置list-type="picture",来实现图片列表缩略图显示 - - -
diff --git a/example/src/docs/zh-CN/file-upload/prevent-delete-file.md b/example/src/docs/zh-CN/file-upload/prevent-delete-file.md deleted file mode 100644 index 790bba2a1..000000000 --- a/example/src/docs/zh-CN/file-upload/prevent-delete-file.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 阻止删除文件 - -:before-remove(移除文件前回调事件),方法里面return true/false,表示是否可以删除 - - -
diff --git a/example/src/docs/zh-CN/file-upload/prevent-upload-file.md b/example/src/docs/zh-CN/file-upload/prevent-upload-file.md deleted file mode 100644 index 24c298db9..000000000 --- a/example/src/docs/zh-CN/file-upload/prevent-upload-file.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 阻止上传文件 - -before-upload(上传前回调事件),方法里面 return true/false,表示是否可以进行上传文件 - - - -
diff --git a/example/src/docs/zh-CN/file-upload/size.md b/example/src/docs/zh-CN/file-upload/size.md deleted file mode 100644 index 018153301..000000000 --- a/example/src/docs/zh-CN/file-upload/size.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 设置组件大小 - -可选值为`medium`,`small`,`mini` - - - -
diff --git a/example/src/docs/zh-CN/file-upload/upload-events.md b/example/src/docs/zh-CN/file-upload/upload-events.md deleted file mode 100644 index 0c4e6ebf0..000000000 --- a/example/src/docs/zh-CN/file-upload/upload-events.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 事件 - -`preview` 点击文件列表中已上传的文件时触发的事件。 -`remove` 文件列表移除文件时触发的事件。 -`error` 文件上传失败时触发的事件。 -`exceed` 文件超出个数限制时触发的事件。 -`progress` 文件上传时触发的事件。 -`change` 文件状态改变时触发的事件,添加文件、上传成功和上传失败时都会被触发。 -`success` 文件上传成功时触发的事件。 - - - -
diff --git a/example/src/docs/zh-CN/file-upload/upload-file-filters.md b/example/src/docs/zh-CN/file-upload/upload-file-filters.md deleted file mode 100644 index 784b9e96e..000000000 --- a/example/src/docs/zh-CN/file-upload/upload-file-filters.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 基本用法 - - - -
diff --git a/example/src/docs/zh-CN/file-upload/upload-file-list.md b/example/src/docs/zh-CN/file-upload/upload-file-list.md deleted file mode 100644 index 5ecc7c880..000000000 --- a/example/src/docs/zh-CN/file-upload/upload-file-list.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 上传的文件列表 - -通过 `show-file-list` 配置是否显示是否显示已上传文件列表,默认值为 true ,需要与 file-list 同时使用 -可配置 `:file-list(type:Object)`来显示已上传的文件名和地址 - - - - -### 上传的文件列表弹出显示 - -通过 `list-type = thumb` 开启文件列表弹窗显示,`thumbOption` 设置弹窗相关数据; - - - - -
diff --git a/example/src/docs/zh-CN/file-upload/upload-limit.md b/example/src/docs/zh-CN/file-upload/upload-limit.md deleted file mode 100644 index bcbaaf6dd..000000000 --- a/example/src/docs/zh-CN/file-upload/upload-limit.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 最大上传限制 - -可配置:before-upload(上传前事件回调),对文件类型和大小做限制 - - -
diff --git a/example/src/docs/zh-CN/file-upload/upload-request.md b/example/src/docs/zh-CN/file-upload/upload-request.md deleted file mode 100644 index a1281ed5a..000000000 --- a/example/src/docs/zh-CN/file-upload/upload-request.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 上传请求 - -可通过配置 action 为上传地址,可通过配置 headers 为头部请求信息 - - - -
diff --git a/example/src/docs/zh-CN/file-upload/upload-user-head.md b/example/src/docs/zh-CN/file-upload/upload-user-head.md deleted file mode 100644 index bd7cce4f2..000000000 --- a/example/src/docs/zh-CN/file-upload/upload-user-head.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 用户头像上传 - - diff --git a/example/src/docs/zh-CN/file-upload/with-credentials.md b/example/src/docs/zh-CN/file-upload/with-credentials.md deleted file mode 100644 index a144fd75f..000000000 --- a/example/src/docs/zh-CN/file-upload/with-credentials.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## FileUpload 文件上传 - - - -可以设定文件的类型与上传的个数等。可自定义上传服务。 -
- -### 支持发送 cookie 凭证信息 - -可通过配置:with-credentials = 'true' 开启访问服务器携带 cookie,默认为 false 。 - - - -
diff --git a/example/src/docs/zh-CN/floatbar/basic-usage.md b/example/src/docs/zh-CN/floatbar/basic-usage.md deleted file mode 100644 index bef1ec1b1..000000000 --- a/example/src/docs/zh-CN/floatbar/basic-usage.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Floatbar 浮动块 - - - -始终浮动在屏幕某一位置,不会因网页滚动使此模块离开屏幕。 -
- -### 基本用法 - -默认固定在屏幕右侧固定位置 - - - -
- - diff --git a/example/src/docs/zh-CN/floatbar/custom-floatbar-item.md b/example/src/docs/zh-CN/floatbar/custom-floatbar-item.md deleted file mode 100644 index 34dd57f36..000000000 --- a/example/src/docs/zh-CN/floatbar/custom-floatbar-item.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Floatbar 浮动块 - - - -始终浮动在屏幕某一位置,不会因网页滚动使此模块离开屏幕。 -
- -### 自定义内容 - -通过默认插槽设置浮动块的内容 - - - -
diff --git a/example/src/docs/zh-CN/floatbar/custom-style.md b/example/src/docs/zh-CN/floatbar/custom-style.md deleted file mode 100644 index 1a50fc38a..000000000 --- a/example/src/docs/zh-CN/floatbar/custom-style.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Floatbar 浮动块 - - - -始终浮动在屏幕某一位置,不会因网页滚动使此模块离开屏幕。 -
- -### 自定义样式 - -可通过配置 css 样式,设置浮动块的样式 - - - -
diff --git a/example/src/docs/zh-CN/floatbar/operation-floatbar-item.md b/example/src/docs/zh-CN/floatbar/operation-floatbar-item.md deleted file mode 100644 index 7108d7d3e..000000000 --- a/example/src/docs/zh-CN/floatbar/operation-floatbar-item.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Floatbar 浮动块 - - - -始终浮动在屏幕某一位置,不会因网页滚动使此模块离开屏幕。 -
- -### 操作浮动块内容 - - - -
diff --git a/example/src/docs/zh-CN/font.md b/example/src/docs/zh-CN/font.md deleted file mode 100644 index 4a8c84a79..000000000 --- a/example/src/docs/zh-CN/font.md +++ /dev/null @@ -1,24 +0,0 @@ -
-

- -

- -## Font 字体 - - - -
- -### 中文字体集 - - - -### 英文字体 - - - -### 字体使用规范 - - - - diff --git a/example/src/docs/zh-CN/form/form-clear-validate.md b/example/src/docs/zh-CN/form/form-clear-validate.md deleted file mode 100644 index e85bf8e9d..000000000 --- a/example/src/docs/zh-CN/form/form-clear-validate.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## 移除表单项的校验结果 - - - -Form 组件下的移除表单项的校验结果的方法。 - -
- -### 移除表单项的校验结果 - -调用 `clearValidate` 方法移除表单项的校验结果。传入待移除的表单项的 `prop` 属性或者 `prop` 组成的数组,如不传则移除整个表单的校验结果。 - - - -
diff --git a/example/src/docs/zh-CN/form/form-disabled.md b/example/src/docs/zh-CN/form/form-disabled.md deleted file mode 100644 index 7d96cbe64..000000000 --- a/example/src/docs/zh-CN/form/form-disabled.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Form 表单 - - - -由按钮、输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。 -
- -### 校验提示的形式 - -通过 `disabled` 可设置表单是否禁用,默认为 `false`。 - - diff --git a/example/src/docs/zh-CN/form/form-validate-setting.md b/example/src/docs/zh-CN/form/form-validate-setting.md deleted file mode 100644 index b2a986edf..000000000 --- a/example/src/docs/zh-CN/form/form-validate-setting.md +++ /dev/null @@ -1,307 +0,0 @@ -## 表单校验配置 - -
-
- -表单校验是基于 `async-validator` 封装的,主要用到 `validate` 函数和 `rules` 的配置规则。 - -### API - -#### validate - -常用于提交表单的时候,对整个表单需校验字段进行校验,得到校验结果,使用示例如下所示: - -```js -this.$refs[formName].validate((valid, error) => {}) -``` - -参数说明: - -- `valid`:Boolean 类型,值为 `true` 时表示表单所有字段都校验通过,可提交表单。值为 `false` 时表示有字段没校验通过。 - -- `error`:Array 类型,包含校验不通过的字段。 - -### Rules - -用于设置表单每个需校验字段的校验规则,可设置每个字段的校验类型,是否必填,校验不成功的提示信息等。 - -#### type - -通过 `type` 设置需校验字段的校验类型,使用这个,我们就可以对一些特定的字段进行校验,而不用再像以前一样写正则,做判断。使用示例如下所示: - -```js -rules: { - name: { type: 'string', required: true } -} -``` - -可设置的值如下: - -- `string`:字符串类型(默认值) - -- `number`:数字类型 - -- `boolean`:布尔类型 - -- `method`:函数类型 - -- `regexp`:正则表达式 - -- `integer`:整型 - -- `float`:双精度浮点型数字 - -- `array`:数组类型 - -- `object`:对象类型 - -- `enum`:枚举值 - -- `date`:值必须是由日期决定的有效值 - -- `url`:网址格式 - -- `hex`:16进制数字 - -- `email`:电子邮箱类型 - -- `any`:任意类型 - -#### required - -`required` 的属性值为 Boolean 类型,用于设置字段是否为必填项,即非空验证。 - -- `true`:设置为 `true`,表示该字段为必填项,且 label 会带红色 \* 号 - -- `false`:默认值,表示该字段不是必填项,label 不会带红色 \* 号 - -#### pattern - -配置用于校验该字段的正则表达式。使用示例如下所示: - -```js -rules: { - name: { required: true, pattern: /^[a-z]+$/ } -} -``` - -#### min - -对于 string 和 array 类型,将对长度进行比较,对于 number 类型,数字不能小于 `min`。使用示例如下所示: - -```js -rules: { - users: { min: 2, message: '长度必须不小于2' } -} -``` - -#### max - -对于 string 和 array 类型,将对长度进行比较,对于 number 类型,数字不能大于 `max`。使用示例如下所示: - -```js -rules: { - users: { max: 11, message: '长度必须不大于11' } -} -``` - -#### len - -要验证字段的确切长度,请指定 `len` 属性。对于 string 和 array 类型,将对 length 属性进行比较。对于 number 类型,此属性表示该数字的精确匹配,即,它只能严格等于 `len`。如果 `len` 属性与 `min` 和 `max` 属性一起使用,则 `len` 优先。使用示例如下所示: - -```js -rules: { - users: { len: 2, message: '长度必须为2' } -} -``` - -#### trigger - -通过 `trigger` 配置触发校验规则的方式,为 `change` 时,当输入框值改变即触发校验,为 `blur` 时则失焦后触发校验。使用示例如下所示: - -```js -rules: { - users: { len: 2, message: '长度必须为2', trigger: 'change' } -} -``` - -可配置的值如下: - -- `blur`:则失焦后触发校验。 - -- `change`:当输入框值改变即触发校验 - -#### enum - -枚举值验证,验证字段的值是否在 `enum` 属性配置的数组 `['admin', 'user', 'guest']` 中。例如: - -```js -rules: { - role: { type: 'enum', enum: ['admin', 'user', 'guest'] } -} -``` - -#### whitespace - -验证必填字段是否只有空格。通常将只包含空白的必填字段视为错误。若要将仅由空格组成的字符串视为错误,则可设置 `whitespace` 为 `true` ,如果没有该配置,则全空格的输入值也是有效的。 - -```js -rules: { - name: { required: true, whitespace: true, message: '相对人名称不能为空' } -} -``` - -#### fields - -深层规则。如果需要验证深层对象属性,可以通过将嵌套规则分配给规则的 `fields` 属性来验证 object 或 array 类型的验证规则。请注意,如果不在父规则上指定 `required` 属性,则不在源对象上声明字段是完全有效的,并且深度验证规则将不会执行,因为没有任何可验证的对象。例如: - -- object 类型: - -```js -rules: { - address: { - type: 'object', required: true, // 父规则上必须指定 required 为 true - fields: { - street: { type: 'string', required: true }, - city: { type: 'string', required: true }, - zip: { type: 'string', required: true, len: 8, message: 'invalid zip' } - } - }, - name: { type: 'string', required: true } -} -``` - -- array 类型: - -```js -rules: { - roles: { - type: 'array', required: true, len: 3, - fields: { - 0: { type: 'string', required: true }, - 1: { type: 'string', required: true }, - 2: { type: 'string', required: true } - } - } -} -``` - -#### defaultField - -`defaultField` 属性可与 array 或 object 类型一起使用,以验证容器的所有值。它可以是包含验证规则的 object 或 array。例如: - -```js -rules: { - urls: { - type: 'array', required: true, - defaultField: { type: 'url' } - } -} -``` - -#### transform - -有时有必要在验证之前转换值,以强制或以某种方式对其进行清理。为此 `transform` ,向验证规则添加一个功能。在验证之前,先转换属性,然后将其重新分配给源对象,以更改该属性的值。使用场景比如:去除用户输入的空格。 - -```js -rules: { - name: { - type: 'string', - required: true, - pattern: /^[a-z]+$/, - transform(value) { - return value.trim(); - } - } -} -``` - -#### messages - -用于配置字段校验不成功时的提示信息,支持国际化。 - -- 实现此目的最简单的方法是将消息分配给规则 - -```js -rules: { - name: { type: 'string', required: true, message: 'Name is required' } -} -``` - -- 消息可以是任何类型,例如 jsx 格式 - -```js -rules: { - name: { type: 'string', required: true, message: 'Name is required' } -} -``` - -- 消息也可以是一个函数,例如,如果使用 vue-i18n - -```js -rules: { - name: { type: 'string', required: true, message: () => this.$t( 'name is required' ) } -} -``` - -#### validator - -通过 `validator` 选项为某个字段进行自定义校验,校验方法中 `callback` 必须被调用。 - -如下所示,先在 `methods` 对象中定义一个自定义校验的方法: - -```js -// 自定义的校验passwordValue的方法 -validatePass(rule, value, callback) { - if (!/^(?=._[a-z])(?=._[A-Z])(?=.\*\\d)[a-zA-Z\d]{8,}$/.test(value)) { - callback(new Error('最少八个字符,至少包含一个大写字母,一个小写字母和一个数字')) - } else { - if (this.ruleForm.passwordValue !== '') { - this.$refs.ruleForm.validateField('passwordValue') - } - callback() - } -} -``` - -然后在对应的需要校验的规则中配置 `validator: this.validatePass`: - -```js -rules: { - passwordValue: [ - { required: true, message: '必填', trigger: 'blur' }, - { validator: this.validatePass, trigger: 'blur' } - ] -} -``` - -#### asyncValidator - -通过 `asyncValidator` 选项为某个字段进行自定义异步校验,校验方法中 `callback` 必须被调用。 - -如下所示,先在 `methods` 对象中定义一个自定义的异步校验的方法: - -```js -// 自定义异步校验passwordValue的方法 -promiseField(rule, value, callback) { - ajax({ - url: 'xx', - value: value - }).then(function(data) { - callback(); - }, function(error) { - callback(new Error(error)) - }) -} -``` - -然后在对应的需要校验的规则中配置 `asyncValidator: this.promiseField`: - -```js -rules: { - passwordValue: [ - { required: true, message: '必填', trigger: 'blur' }, - { asyncValidator: this.promiseField, trigger: 'blur' } - ] -} -``` diff --git a/example/src/docs/zh-CN/form/form-validation.md b/example/src/docs/zh-CN/form/form-validation.md deleted file mode 100644 index b44003ffc..000000000 --- a/example/src/docs/zh-CN/form/form-validation.md +++ /dev/null @@ -1,36 +0,0 @@ -
-

- -

- -## Form 表单 - - - -由按钮、输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。 - -
- -### 表单校验 - -包括常用的必填、日期、时间、URL、邮件等校验规则。通过 `trigger` 配置触发校验规则的方式,为 `change` 时,当输入框值改变即触发校验,为 `blur` 时则失焦后触发校验。 - - - -:::tip 注意 - -校验时若校验类型为 `date`,则需要使用 `DatePicker` 组件进行日期选择,若使用 `Input` 组件进行日期输入,建议使用自定义校验规则。 - -::: - -### 自定义校验规则 - -通过 `validator` 选项进行自定义校验,校验方法中 `callback` 必须被调用。通过配置 `validate-on-rule-change` 属性,设置是否在 `rules` 属性改变后立即触发一次验证 - - - -### 校验提示位置 - -通过 `validate-position` 可自定义错误提示出现的位置,在 `Form` 组件上设置后,子组件`FormItem`会继承父组件设置。单独在 `FormItem` 组件上进行设置优先级高于在 `From`上的设置。 - - \ No newline at end of file diff --git a/example/src/docs/zh-CN/form/form.md b/example/src/docs/zh-CN/form/form.md deleted file mode 100644 index 757387d2b..000000000 --- a/example/src/docs/zh-CN/form/form.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Form 表单 - - - -由按钮、输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。 - -
- -### 常用表单 - -在 Form 组件中,每一个表单域由一个 FormItem 组件构成,表单域中可以放置各种类型的表单控件,包括 Input、Select、Checkbox、Radio、Switch、DatePicker、TimePicker。 - - - -### 行内表单 - -当垂直方向空间受限且表单较简单时,可以在一行内放置表单,设置 `inline` 属性可以让表单域变为行内的表单域。 - - - -
- - diff --git a/example/src/docs/zh-CN/form/formitem.md b/example/src/docs/zh-CN/form/formitem.md deleted file mode 100644 index 7a6b3ebcd..000000000 --- a/example/src/docs/zh-CN/form/formitem.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## FormItem 表单项 - - - -Form 组件下的 FormItem 配置。 -
- -### 行内表单 - -当垂直方向空间受限且表单较简单时,可以在一行内放置表单,设置 `inline` 属性可以让表单域变为行内的表单域。 - - - -
- - diff --git a/example/src/docs/zh-CN/form/novalid-tip.md b/example/src/docs/zh-CN/form/novalid-tip.md deleted file mode 100644 index a8a9c01a9..000000000 --- a/example/src/docs/zh-CN/form/novalid-tip.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Form 表单 - - - -配置是否显示校验提示框的tip内容提示 - -
- -### 隐藏表单项校验提示 - -通过配置 `novalid-tip` 设置是否显示校验提示框的tip内容提示。 - - - -
diff --git a/example/src/docs/zh-CN/form/size.md b/example/src/docs/zh-CN/form/size.md deleted file mode 100644 index 7601ac757..000000000 --- a/example/src/docs/zh-CN/form/size.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## FormItem 表单项 - - - -由按钮、输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。 - -
- -### 表单尺寸 - -通过在 `tiny-form` 标签上设置 `size` 属性可以改变表单内组件尺寸;设置 `disabled` 属性可以改变表单内组件禁用状态 - - - -
diff --git a/example/src/docs/zh-CN/form/slot-label.md b/example/src/docs/zh-CN/form/slot-label.md deleted file mode 100644 index c3374cbff..000000000 --- a/example/src/docs/zh-CN/form/slot-label.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## FormItem 表单项 - - - -由按钮、输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。 - -
- -### 标签文本插槽 - -通过在 `label` 插槽,自定义标签文本的内容 - - - -
diff --git a/example/src/docs/zh-CN/form/validate-type.md b/example/src/docs/zh-CN/form/validate-type.md deleted file mode 100644 index fc0eb0444..000000000 --- a/example/src/docs/zh-CN/form/validate-type.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Form 表单 - - - -由按钮、输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。 -
- -### 校验提示的形式 - -通过 `validate-type` 可设置校验提示信息是以 `text` 文本显示还是以 `tip` 提示框的形式显示,默认为 `tip` 。也可直接配置在某一个 `` 上控制某一项的校验提示形式。 - - diff --git a/example/src/docs/zh-CN/fullscreen/basic-usage.md b/example/src/docs/zh-CN/fullscreen/basic-usage.md deleted file mode 100644 index bdd3fc00d..000000000 --- a/example/src/docs/zh-CN/fullscreen/basic-usage.md +++ /dev/null @@ -1,24 +0,0 @@ -
-

- -

- -## Fullscreen 全屏显示 - - - -
- -### 组件式使用 - - - -
- -### 函数式使用 - - - -
- - diff --git a/example/src/docs/zh-CN/grid/align/column-align.md b/example/src/docs/zh-CN/grid/align/column-align.md deleted file mode 100644 index bef3abd57..000000000 --- a/example/src/docs/zh-CN/grid/align/column-align.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 列对齐 - -`align` 设置单独列对齐方式 可选值为 `left` `center` `right`,默认值为 `left`。 - -:::tip -列设置的 `align` 会覆盖掉表格设置的 `align` -::: - - - -
diff --git a/example/src/docs/zh-CN/grid/align/footer-align.md b/example/src/docs/zh-CN/grid/align/footer-align.md deleted file mode 100644 index 4f25dc76d..000000000 --- a/example/src/docs/zh-CN/grid/align/footer-align.md +++ /dev/null @@ -1,32 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 表尾左对齐 - -`footer-align` 设置表尾对齐方式的可选值为 `left` `center` `right`,默认值为 `left`。 - -:::tip -表格上配置 `footer-align` 会被列配置的 `footer-align` 覆盖 -::: - - - -### 表尾右对齐 - - - - -### 表尾居中对齐 - - - -
diff --git a/example/src/docs/zh-CN/grid/align/grid-align.md b/example/src/docs/zh-CN/grid/align/grid-align.md deleted file mode 100644 index ed1cc4023..000000000 --- a/example/src/docs/zh-CN/grid/align/grid-align.md +++ /dev/null @@ -1,31 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 表格左对齐 - -`align` 设置全部列对齐方式可选值为 `left` `center` `right`,默认值为 `left`。 - -:::tip -表格设置对齐方式优先级最低,会被单独设置对齐方式覆盖 -::: - - - -### 表格右对齐 - - - -### 表格居中对齐 - - - -
diff --git a/example/src/docs/zh-CN/grid/align/header-align.md b/example/src/docs/zh-CN/grid/align/header-align.md deleted file mode 100644 index 2b44ee95e..000000000 --- a/example/src/docs/zh-CN/grid/align/header-align.md +++ /dev/null @@ -1,31 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 表头左对齐 - -`header-align` 设置表头对齐方式可选值为 `left` `center` `right`,默认值为 `left`。 - -:::tip -表格上配置 `header-align` 会被列配置的 `header-align` 覆盖 -::: - - - -### 表头右对齐 - - - -### 表头居中对齐 - - - -
diff --git a/example/src/docs/zh-CN/grid/cascade/any-parent-cascade.md b/example/src/docs/zh-CN/grid/cascade/any-parent-cascade.md deleted file mode 100644 index b85ae6f48..000000000 --- a/example/src/docs/zh-CN/grid/cascade/any-parent-cascade.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### Grid-数据级联-任意父级联 - -需要在 `grid` 标签上配 `edit-config` 对象,`activeMethod` 编辑前的事件处理编辑项数据集。 -`grid-column` 列上面配置 `editor` 对象,`component` 用来渲染编辑组件。 -`attrs` 配置级联数据。 -`events` 来设置事件。 -具体参考下面示例。 - - - -
diff --git a/example/src/docs/zh-CN/grid/cascade/normal-column-cascade.md b/example/src/docs/zh-CN/grid/cascade/normal-column-cascade.md deleted file mode 100644 index c51b9c096..000000000 --- a/example/src/docs/zh-CN/grid/cascade/normal-column-cascade.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### Grid-数据级联-正常列级联 - -需要在 `grid` 标签上配 `edit-config` 对象,`activeMethod` 编辑前的事件处理编辑项数据集。 -`grid-column` 列上面配置 `editor` 对象,`component` 用来渲染编辑组件。 -`attrs` 配置级联数据。 -`events` 来设置事件。 -具体参考下面示例。 - - - -
diff --git a/example/src/docs/zh-CN/grid/common-header.vue b/example/src/docs/zh-CN/grid/common-header.vue deleted file mode 100644 index 3a2113e14..000000000 --- a/example/src/docs/zh-CN/grid/common-header.vue +++ /dev/null @@ -1,14 +0,0 @@ - - - diff --git a/example/src/docs/zh-CN/grid/context-menu/cell-menu.md b/example/src/docs/zh-CN/grid/context-menu/cell-menu.md deleted file mode 100644 index ce72b6014..000000000 --- a/example/src/docs/zh-CN/grid/context-menu/cell-menu.md +++ /dev/null @@ -1,24 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### Grid-右键菜单-单元格菜单 - -配置 `context-menu="{body: {options: bodyMenus},visibleMethod}"` 对象来控制单元格菜单。 -`bodyMenus` 里面配置 `visible` 是否显示菜单,`disabled` 是否禁用菜单项。 -可配合 `visibleMethod` 方法来控制菜单权限。 -`@cell-context-menu` 监控菜单弹出前事件。 -`@context-menu-click` 监控菜单点击事件。 -具体参考下面示例。 - - - -
diff --git a/example/src/docs/zh-CN/grid/context-menu/footer-menu.md b/example/src/docs/zh-CN/grid/context-menu/footer-menu.md deleted file mode 100644 index 76c612716..000000000 --- a/example/src/docs/zh-CN/grid/context-menu/footer-menu.md +++ /dev/null @@ -1,24 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### Grid-右键菜单-表尾菜单 - -必须要配置 `:context-menu="{body: {options: bodyMenus}}" `,`show-footer`,`:footer-method="footerMethod"` 才能展示表尾菜单 -配置 `:context-menu="{body: {options: bodyMenus}, footer: {options: footerMenus},visibleMethod}"` 对象来控制表头菜单。 -`footerMenus` 里面配置 `visible` 是否显示菜单, `disabled` 是否禁用菜单项。 -可配合 `visibleMethod` 方法来控制菜单权限。 -`@context-menu-click` 监控菜单点击事件。 -具体参考下面示例。 - - - -
diff --git a/example/src/docs/zh-CN/grid/context-menu/header-menu.md b/example/src/docs/zh-CN/grid/context-menu/header-menu.md deleted file mode 100644 index 50a28b9b8..000000000 --- a/example/src/docs/zh-CN/grid/context-menu/header-menu.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### Grid-右键菜单-表头菜单 - -配置 `:context-menu="{header: {options: headerMenus}, visibleMethod}"` 对象来控制表头菜单。 -`headerMenus` 里面配置 `visible` 是否显示菜单, `disabled` 是否禁用菜单项。 -可配合 `visibleMethod` 方法来控制菜单权限。 -`@context-menu-click` 监控菜单点击事件。 -具体参考下面示例。 - - - -
diff --git a/example/src/docs/zh-CN/grid/context-menu/menu-permissions.md b/example/src/docs/zh-CN/grid/context-menu/menu-permissions.md deleted file mode 100644 index 9a7296539..000000000 --- a/example/src/docs/zh-CN/grid/context-menu/menu-permissions.md +++ /dev/null @@ -1,24 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### Grid-右键菜单-菜单权限 - -配置 `:context-menu="{header: {options: headerMenus},body: {options: bodyMenus}, footer: {options: footerMenus},visibleMethod}"` 对象来控制表头菜单。 -`header,bodyMenus,footer` 里面配置 `visible` 是否显示菜单, `disabled` 是否禁用菜单项。 -使用配合 `visibleMethod` 方法来控制菜单权限。 -`@cell-context-menu` 监控菜单弹出前事件。 -`@context-menu-click` 监控菜单点击事件。 -具体参考下面示例。 - - - -
diff --git a/example/src/docs/zh-CN/grid/custom-style/cell-style.md b/example/src/docs/zh-CN/grid/custom-style/cell-style.md deleted file mode 100644 index 6a1b5a5d3..000000000 --- a/example/src/docs/zh-CN/grid/custom-style/cell-style.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 单元格样式 - -通过 `cell-class-name` 自定义设置表格的单元格样式 - - - -### 列样式 - -通过 `class-name` 自定义设置表格的列样式 - - - -
diff --git a/example/src/docs/zh-CN/grid/custom-style/footer-style.md b/example/src/docs/zh-CN/grid/custom-style/footer-style.md deleted file mode 100644 index b83ecdd46..000000000 --- a/example/src/docs/zh-CN/grid/custom-style/footer-style.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 表尾样式(自定义表尾行样式) - -通过 `footer-cell-class-name` 和 `footer-row-class-name` 设置表尾的单元格和行样式 - - - -### 表尾样式(自定义表尾单元格样式) - - - -
diff --git a/example/src/docs/zh-CN/grid/custom-style/header-style.md b/example/src/docs/zh-CN/grid/custom-style/header-style.md deleted file mode 100644 index b51cabedf..000000000 --- a/example/src/docs/zh-CN/grid/custom-style/header-style.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 设置表头样式 - -通过 `header-cell-class-name` 和 `header-row-class-name` 设置表头的单元格和行样式 - -### 设置表头单元格样式 - - - -### 设置表头行样式 - - - -
diff --git a/example/src/docs/zh-CN/grid/custom-style/row-style.md b/example/src/docs/zh-CN/grid/custom-style/row-style.md deleted file mode 100644 index 046d1f26d..000000000 --- a/example/src/docs/zh-CN/grid/custom-style/row-style.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 设置行样式 - -通过 `row-class-name` 自定义设置表格的行样式 - -### 设置行样式 - - - -
diff --git a/example/src/docs/zh-CN/grid/customized/column-fixed.md b/example/src/docs/zh-CN/grid/customized/column-fixed.md deleted file mode 100644 index c86973ba9..000000000 --- a/example/src/docs/zh-CN/grid/customized/column-fixed.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 列冻结 - -在 `column` 标签上配置 `fixed="left"` 可以固定在左侧,并在 `toolbar` 标签上配置 `setting` 开启个性化设置,在个性化面板里可以设置是否固定列 - - - -
diff --git a/example/src/docs/zh-CN/grid/customized/column-sort.md b/example/src/docs/zh-CN/grid/customized/column-sort.md deleted file mode 100644 index 30608b974..000000000 --- a/example/src/docs/zh-CN/grid/customized/column-sort.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 排序 - -在 `column` 标签上配置 `sortable` 可以排序(未配置的列,在个性化面板中的排序图标会隐藏),并在 `toolbar` 标签上配置 `setting` 开启个性化设置,在个性化面板里进行排序,排序过后会保存在本地的 `localStroage` 里,刷新页面页面上会显示排序过后的数据 - - - -
diff --git a/example/src/docs/zh-CN/grid/customized/column-sortable.md b/example/src/docs/zh-CN/grid/customized/column-sortable.md deleted file mode 100644 index 612d31255..000000000 --- a/example/src/docs/zh-CN/grid/customized/column-sortable.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 本地记录 - -配置 `setting` 的 `sortable` 为 `sortablejs` 可实现拖拽排序列功能, 此功能在多级列头下无效 - - - -
- -### 加载远端数据 - -通过 `reloadCustoms` 方法,将第二个参数置为 `true` 可按序加载列 - - - -
diff --git a/example/src/docs/zh-CN/grid/customized/column-visible-hidden.md b/example/src/docs/zh-CN/grid/customized/column-visible-hidden.md deleted file mode 100644 index ad4d1969a..000000000 --- a/example/src/docs/zh-CN/grid/customized/column-visible-hidden.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 列显示隐藏 - -在 `toolbar` 标签上配置 `setting` 开启个性化设置,在个性化面板里可以设置是否显示和隐藏列 - - - -### 手动隐藏显示列 - -通过调用 `hideColumn(column)` 方法隐藏指定列,`showColumn(column)` 方法显示指定列。使用这两个方法隐藏/显示列时,还需要再调用 `refreshColumn()` 方法刷新列配置才能实际生效。 - - - -
diff --git a/example/src/docs/zh-CN/grid/customized/column-width.md b/example/src/docs/zh-CN/grid/customized/column-width.md deleted file mode 100644 index 85108828b..000000000 --- a/example/src/docs/zh-CN/grid/customized/column-width.md +++ /dev/null @@ -1,29 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 列宽 - -在 `grid` 标签上配置 `resizable="true"` 可以调整列宽,并在 `toolbar` 标签上配置 `resizable="{storage: true}"` 保存在本地的 `localStroage` 里,刷新页面表格的列宽按照拖动后的列宽显示 - - - -### 手动重置列操作 - -:::tip 方法说明 -`resetResizable()`:手动重置列宽拖动的操作,还原到初始状态 -`resetCustoms()`:手动重置列的显示/隐藏操作,还原到初始状态 -`resetAll()`:手动重置列的所有操作,还原到初始状态 -::: - -请先对列宽进行拖动、隐藏列等操作,然后单击对应按钮查看效果。 - - diff --git a/example/src/docs/zh-CN/grid/customized/local-storage.md b/example/src/docs/zh-CN/grid/customized/local-storage.md deleted file mode 100644 index 228944941..000000000 --- a/example/src/docs/zh-CN/grid/customized/local-storage.md +++ /dev/null @@ -1,22 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 本地存储 - -在 `toolbar` 标签上配置 `:setting="{storage:'local'}"` 开启个性化并保存到本地 `localSotrage` 里 - -:::danger 在V3.10.0版本中新增了列顺序存储功能, 在 @remote-setting 事件中暴露的数据由原来仅修改过的列信息变成了所有的列信息 -::: - - - -
diff --git a/example/src/docs/zh-CN/grid/customized/page-size.md b/example/src/docs/zh-CN/grid/customized/page-size.md deleted file mode 100644 index b91705586..000000000 --- a/example/src/docs/zh-CN/grid/customized/page-size.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 - -
- -### 分页条数 - -在 `toolbar` 标签上配置 `setting` 开启个性化设置,在个性化面板里选择其它设置,其它设置里可以选择每页显示的条数,可以通过 `setting` 的 `other` 属性控制显示其他设置,`Boolean` 类型默认为 `true` - - - -
diff --git a/example/src/docs/zh-CN/grid/customized/prsonalized-drag.md b/example/src/docs/zh-CN/grid/customized/prsonalized-drag.md deleted file mode 100644 index 3b3a91a99..000000000 --- a/example/src/docs/zh-CN/grid/customized/prsonalized-drag.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 个性化面板拖拽前事件 - -在 `toolbar` 标签上配置 `setting` 开启个性化设置,在个性化面板里配置 `onBeforeMove` 拖拽前事件,也可配置 `filter` 设置类名, 拖拽个性化面板某一行会触发个性化面板的拖拽前事件。 - - - -
diff --git a/example/src/docs/zh-CN/grid/customized/server-storage.md b/example/src/docs/zh-CN/grid/customized/server-storage.md deleted file mode 100644 index 13d23306d..000000000 --- a/example/src/docs/zh-CN/grid/customized/server-storage.md +++ /dev/null @@ -1,29 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 服务端存储 - -在 `toolbar` 标签上配置 `:setting="{storage:'remote'}"` 开启个性化并启用远程服务获取个性化数据,并配置 `@remote-setting` 调用 `reloadCustoms` 方法更新个性化数据。 - -:::warning 注意 -如果是根据服务端数据控制显示/隐藏列,调用接口获取到个性化的数据后需手动调用 `reloadCustoms` 方法更新。 -::: -:::danger 在V3.10.0版本中新增了列顺序存储功能, 在 @remote-setting 事件中暴露的数据由原来仅修改过的列信息变成了所有的列信息 -::: - - - -:::tip 说明 -Grid 个性化设置默认不是服务端存储,如果需要服务端存储,需要每个 Grid 单独实现。 -::: - -
diff --git a/example/src/docs/zh-CN/grid/customized/sort-type.md b/example/src/docs/zh-CN/grid/customized/sort-type.md deleted file mode 100644 index 74c6bcfa1..000000000 --- a/example/src/docs/zh-CN/grid/customized/sort-type.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 排序类型 - -在 `column` 标签上配置 `sortable` 可以排序,并在 `toolbar` 标签上配置 `setting` 开启个性化设置,在个性化面板里选择其它设置,其它设置里可以选择排序类型,排序类型有当前页排序和所有数据排序选项,默认是当前页排序 - - - -
diff --git a/example/src/docs/zh-CN/grid/data-source/auto-load.md b/example/src/docs/zh-CN/grid/data-source/auto-load.md deleted file mode 100644 index 18bf1a61c..000000000 --- a/example/src/docs/zh-CN/grid/data-source/auto-load.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -表格属性 `auto-load` 设置是否开启自动请求服务,配置 fetch-data 时有效。如下示例设置 `auto-load` 为 false 后,就不会自动加载数据。 - - - -
diff --git a/example/src/docs/zh-CN/grid/data-source/column-asyn-rendering.md b/example/src/docs/zh-CN/grid/data-source/column-asyn-rendering.md deleted file mode 100644 index a98f93bc5..000000000 --- a/example/src/docs/zh-CN/grid/data-source/column-asyn-rendering.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -异步渲染配置步骤: -1、表格属性设置 `is-async-column` 开启异步渲染; -2、表格列设置 `format-config` 开启该列数据异步渲染。 - - - -
diff --git a/example/src/docs/zh-CN/grid/data-source/columns.md b/example/src/docs/zh-CN/grid/data-source/columns.md deleted file mode 100644 index a174e261f..000000000 --- a/example/src/docs/zh-CN/grid/data-source/columns.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -表格属性 `columns` 设置表格列的配置信息,具体参考列配置项。 - -
- - - -
diff --git a/example/src/docs/zh-CN/grid/data-source/proxy-config.md b/example/src/docs/zh-CN/grid/data-source/proxy-config.md deleted file mode 100644 index eed0d3f85..000000000 --- a/example/src/docs/zh-CN/grid/data-source/proxy-config.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -表格属性 `proxy-config` 设置代理配置。 - -
- - - -
diff --git a/example/src/docs/zh-CN/grid/data-source/request-service.md b/example/src/docs/zh-CN/grid/data-source/request-service.md deleted file mode 100644 index f3b59e109..000000000 --- a/example/src/docs/zh-CN/grid/data-source/request-service.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -表格属性设置 `fetch-data` 开启服务请求。 - - - -
diff --git a/example/src/docs/zh-CN/grid/data-source/static-data.md b/example/src/docs/zh-CN/grid/data-source/static-data.md deleted file mode 100644 index a2b9785e7..000000000 --- a/example/src/docs/zh-CN/grid/data-source/static-data.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -表格属性设置 `data` 开启双向绑定静态数据。 - - - -
diff --git a/example/src/docs/zh-CN/grid/drag/column-drag.md b/example/src/docs/zh-CN/grid/drag/column-drag.md deleted file mode 100644 index 1e70911e4..000000000 --- a/example/src/docs/zh-CN/grid/drag/column-drag.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 列拖拽 - -通过设置 `drop-config` 的 `column` 属性控制列拖拽,默认为开启列拖拽,列拖拽事件有 `@column-drop-start`、`column-drop-move`、`column-drop-end`。 - - - -
diff --git a/example/src/docs/zh-CN/grid/drag/row-drag.md b/example/src/docs/zh-CN/grid/drag/row-drag.md deleted file mode 100644 index d17a2f7e7..000000000 --- a/example/src/docs/zh-CN/grid/drag/row-drag.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 行拖拽 - -通过设置 `drop-config` 的 `row` 属性控制行拖拽,默认为开启行拖拽,行拖拽事件有 `@row-drop-start`、`row-drop-move`、`row-drop-end`。 - - - -
- -### 拖拽控制 - -可以通过设置 `drop-config` 的 `onBeforeMove` 事件控制行拖动,也可以配置`drop-config` 的 `filter` 与自定义样式结合使用来限制拖动 - - - -
- diff --git a/example/src/docs/zh-CN/grid/dynamically-columns.md b/example/src/docs/zh-CN/grid/dynamically-columns.md deleted file mode 100644 index a7b996cf8..000000000 --- a/example/src/docs/zh-CN/grid/dynamically-columns.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### Grid-根据选择日期动态生成列 - - - -
diff --git a/example/src/docs/zh-CN/grid/edit/cell-editing.md b/example/src/docs/zh-CN/grid/edit/cell-editing.md deleted file mode 100644 index e56702a05..000000000 --- a/example/src/docs/zh-CN/grid/edit/cell-editing.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 单元格编辑 - -表格属性设置 `edit-config` 开启编辑模式,然后在该属性对象内设置 `mode: 'cell'` 开启行编辑,即:`:edit-config="{ mode: 'cell' }"`。 -表格列属性设置 `show-icon` 设置列头是否显示编辑图标,在编辑时有效。 - - - -
- -### 手动激活编辑 - -`setActiveCell(row, field)` 方法可激活指定单元格编辑。`setActiveRow(row)` 方法激活行编辑,如果是 mode=cell 则默认激活第一个单元格。 - - - -
diff --git a/example/src/docs/zh-CN/grid/edit/custom-editing.md b/example/src/docs/zh-CN/grid/edit/custom-editing.md deleted file mode 100644 index ec2e1171b..000000000 --- a/example/src/docs/zh-CN/grid/edit/custom-editing.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 表格 - -表格属性设置 `edit-config` 开启编辑模式,然后在该属性对象内设置 `activeMethod` 自定义编辑规则。 - - - -
- -### 自定义编辑校验规则 - -表格属性设置 `edit-config` 开启编辑模式,并配置 `edit-rules` 对象来设置校验对象和校验规则,然后在 `editor` 对象中设置 `isValidAlways` 开启编辑实时校验。 - - - -
diff --git a/example/src/docs/zh-CN/grid/edit/format-value.md b/example/src/docs/zh-CN/grid/edit/format-value.md deleted file mode 100644 index 3b08b3554..000000000 --- a/example/src/docs/zh-CN/grid/edit/format-value.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 单元格编辑 - -表格列属性 `format-value` 格式化单元格编辑器组件的传入值。 - - - -
diff --git a/example/src/docs/zh-CN/grid/edit/row-editing.md b/example/src/docs/zh-CN/grid/edit/row-editing.md deleted file mode 100644 index ffc8ee101..000000000 --- a/example/src/docs/zh-CN/grid/edit/row-editing.md +++ /dev/null @@ -1,31 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 行编辑 - -表格属性设置 `edit-config` 开启编辑模式,然后在该属性对象内设置 `mode: 'row'` 开启行编辑,即:`:edit-config="{ mode: 'row' }"`。 - - - -### 还原更改 - -调用方法 `revertData(rows, field)` 可以还原指定行 row 或者整个表格的数据。rows 为对象则还原一行数据,为数组则还原多行数据,field 可不指定。不指定任何参数时则还原整个表格数据。 - - - -### 检查数据是否改变 - -`hasRowChange(row, field)` 检查行或列数据是否发生改变,field 可不指定。 - - - -
diff --git a/example/src/docs/zh-CN/grid/edit/status-of-editing.md b/example/src/docs/zh-CN/grid/edit/status-of-editing.md deleted file mode 100644 index b0e084b6d..000000000 --- a/example/src/docs/zh-CN/grid/edit/status-of-editing.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 开启编辑状态 - - 表格属性设置 `edit-config` 开启编辑模式,然后在该属性对象内设置 `showStatus` 开启或关闭单元格更新状态(单元格左上角倒三角形更新标识),默认值为 `true` 开启状态。 - - - -### 关闭编辑状态 - - - -
diff --git a/example/src/docs/zh-CN/grid/edit/trigger-mode-for-editing.md b/example/src/docs/zh-CN/grid/edit/trigger-mode-for-editing.md deleted file mode 100644 index d94f27eff..000000000 --- a/example/src/docs/zh-CN/grid/edit/trigger-mode-for-editing.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 点击触发编辑 - -表格属性设置 `edit-config` 开启编辑模式,然后在该属性对象内设置 `trigger` 修改触发方式。可选值有 `点击触发(click)/ 双击触发(dblclick)/ 手动触发(manual)`,默认值为 `click 点击触发`。 - - - -### 双击触发编辑 - - - -### 手动触发编辑 - - - -
diff --git a/example/src/docs/zh-CN/grid/editor/custom-editor-aui3.md b/example/src/docs/zh-CN/grid/editor/custom-editor-aui3.md deleted file mode 100644 index efc854d18..000000000 --- a/example/src/docs/zh-CN/grid/editor/custom-editor-aui3.md +++ /dev/null @@ -1,32 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 引入 Tiny Vue 组件作为编辑器 - -通过 `属性配置` 方式引入 Tiny Vue `Select` 组件。 - - - -
- -通过 `属性配置` 方式引入 `Autocomplete` 组件。 - - - -
- - -通过 `slot 插槽` 方式引入 `Autocomplete` 组件。 - - - -
diff --git a/example/src/docs/zh-CN/grid/editor/custom-editor-tiny3.md b/example/src/docs/zh-CN/grid/editor/custom-editor-tiny3.md deleted file mode 100644 index 9985e7868..000000000 --- a/example/src/docs/zh-CN/grid/editor/custom-editor-tiny3.md +++ /dev/null @@ -1,32 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 引入 3.0 组件作为编辑器 - -通过 `属性配置` 方式引入 TINY 3.0 `Select` 组件。 - - - -
- -通过 `属性配置` 方式引入 `Autocomplete` 组件。 - - - -
- - -通过 `slot 插槽` 方式引入 `Autocomplete` 组件。 - - - -
diff --git a/example/src/docs/zh-CN/grid/editor/custom-editor.md b/example/src/docs/zh-CN/grid/editor/custom-editor.md deleted file mode 100644 index 0d4d29529..000000000 --- a/example/src/docs/zh-CN/grid/editor/custom-editor.md +++ /dev/null @@ -1,22 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### Grid-编辑器-自定义编辑器 - -`grid` 标签上配置 `edit-config`。 -在 `grid-column` 列配置 `editor` 对象, `component` 渲染自定义编辑组件。 -自定义编辑默认编辑框为小框,可以配合样式修改编辑框。 -具体参考下面示例。 - - - -
diff --git a/example/src/docs/zh-CN/grid/editor/editor-events.md b/example/src/docs/zh-CN/grid/editor/editor-events.md deleted file mode 100644 index 489cfdb9d..000000000 --- a/example/src/docs/zh-CN/grid/editor/editor-events.md +++ /dev/null @@ -1,22 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### Grid-编辑器-自定义编辑器 - -`grid` 标签上配置 `edit-config`。 -在 `grid-column` 列配置 `editor` 对象, `component` 渲染自定义编辑组件, 通过其events选项配置编辑器组件的事件。 -自定义编辑默认编辑框为小框,可以配合样式修改编辑框。 -具体参考下面示例。 - - - -
diff --git a/example/src/docs/zh-CN/grid/editor/inner-editor.md b/example/src/docs/zh-CN/grid/editor/inner-editor.md deleted file mode 100644 index f281a4a0c..000000000 --- a/example/src/docs/zh-CN/grid/editor/inner-editor.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### Grid-编辑器-内置编辑器 - -`grid` 标签上配置 `edit-config`。在 `grid-column` 列配置 `editor` 对象, `component` 渲染内置编辑组件, `events` 配置组件事件。具体参考下面示例。 - -:::tip 说明 - -TinyGrid 内置编辑器只支持 `Input` 和 `Select` 组件,需要使用其他组件可参考自定义编辑器 - -::: - - - -
diff --git a/example/src/docs/zh-CN/grid/editor/mutil-render.md b/example/src/docs/zh-CN/grid/editor/mutil-render.md deleted file mode 100644 index aea96dbd5..000000000 --- a/example/src/docs/zh-CN/grid/editor/mutil-render.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### Grid-编辑器-下拉多选 - -配置列为下拉多选时,单元格渲染需要自行实现,如下例中使用`format-text`渲染多个枚举值。也可以使用`renderer`自己实现自定义的组件去渲染。 - - - -
diff --git a/example/src/docs/zh-CN/grid/editor/popeditor-in-grid.md b/example/src/docs/zh-CN/grid/editor/popeditor-in-grid.md deleted file mode 100644 index d6d5416e1..000000000 --- a/example/src/docs/zh-CN/grid/editor/popeditor-in-grid.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### Popeditor 弹窗编辑 - -在 `grid-column` 列元素上配置 `editor` 属性,该对象中可以指定 `component` 为 `Popeditor`、`attrs` 为 Popeditor 组件的属性。需要注意的是,引入 Popeditor 组件后,需要在 `data()` 中进行实例化。 - - - -
- -### Popeditor 弹窗编辑,配置远程搜索 - - - -
diff --git a/example/src/docs/zh-CN/grid/empty-data-tip.md b/example/src/docs/zh-CN/grid/empty-data-tip.md deleted file mode 100644 index 4b879e404..000000000 --- a/example/src/docs/zh-CN/grid/empty-data-tip.md +++ /dev/null @@ -1,32 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 - -
- -### 自定义提示 - -空数据时默认显示 `图标 + 文字` 提示,用户也可通过设置插槽 `v-slot:empty` 或者 属性 `render-empty` 来自定义提示内容。 - - - -### 默认提示 - - - -
- -### 固定居中 - -配置 `is-center-empty` 为 `true` 时,拖动横向滚动条可以保持空数据提示使终相对表格宽度居中显示 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/cell-click-event.md b/example/src/docs/zh-CN/grid/event/cell-click-event.md deleted file mode 100644 index 4c6efde81..000000000 --- a/example/src/docs/zh-CN/grid/event/cell-click-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 单元格点击事件 - -在 `grid` 标签上配置 `cell-click` 可以监听到单元格的点击事件 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/cell-dblclick-event.md b/example/src/docs/zh-CN/grid/event/cell-dblclick-event.md deleted file mode 100644 index 65aeafe56..000000000 --- a/example/src/docs/zh-CN/grid/event/cell-dblclick-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 单元格双击事件 - -在 `grid` 标签上配置 `cell-dblclick` 可以监听到单元格的双击事件 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/cell-mouseenter-event.md b/example/src/docs/zh-CN/grid/event/cell-mouseenter-event.md deleted file mode 100644 index 61e843098..000000000 --- a/example/src/docs/zh-CN/grid/event/cell-mouseenter-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 鼠标进入单元格事件 - -在 `grid` 标签上配置 `cell-dblclick` 可以监听到单元格的双击事件 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/cell-mouseleave-event.md b/example/src/docs/zh-CN/grid/event/cell-mouseleave-event.md deleted file mode 100644 index e280ccca0..000000000 --- a/example/src/docs/zh-CN/grid/event/cell-mouseleave-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 鼠标离开单元格事件 - -在 `grid` 标签上配置 `cell-mouseleave` 可以监听到鼠标离开单元格事件 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/current-change-event.md b/example/src/docs/zh-CN/grid/event/current-change-event.md deleted file mode 100644 index 147d2c36a..000000000 --- a/example/src/docs/zh-CN/grid/event/current-change-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 行选中事件 - -只对 在 `grid` 标签上配置 `highlightCurrentRow` 有效,当手动选中行时触发的事件 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/edit-actived-event.md b/example/src/docs/zh-CN/grid/event/edit-actived-event.md deleted file mode 100644 index 7ce67b2ff..000000000 --- a/example/src/docs/zh-CN/grid/event/edit-actived-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 单元格被激活编辑时会触发该事件 - -只对 在 `grid` 标签上配置 `edit-actived` 有效,单元格被激活编辑时触发的事件 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/edit-closed-event.md b/example/src/docs/zh-CN/grid/event/edit-closed-event.md deleted file mode 100644 index 404ac972d..000000000 --- a/example/src/docs/zh-CN/grid/event/edit-closed-event.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 单元格编辑完成触发该事件 - -只对 在 `grid` 标签上配置 `edit-closed` 有效,单元格编辑完成触发该事件 - - - -
- -### 两个表格数据相互关联 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/edit-disabled-event.md b/example/src/docs/zh-CN/grid/event/edit-disabled-event.md deleted file mode 100644 index 234a955b9..000000000 --- a/example/src/docs/zh-CN/grid/event/edit-disabled-event.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 - -
- -### 当单元格激活时如果是禁用状态时会触发该事件 - -只对 在 `grid` 标签上配置 `edit-disabled-event` 有效,同时需要在 `edit-config` 配置中的 `activeMethod` 方法控制单元格是否可以编辑(返回 `true` 可以编辑,反之亦然)。 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/footer-cell-click-event.md b/example/src/docs/zh-CN/grid/event/footer-cell-click-event.md deleted file mode 100644 index d017e7df6..000000000 --- a/example/src/docs/zh-CN/grid/event/footer-cell-click-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 表尾单元格被点击时会触发该事件 - -只对 在 `grid` 标签上配置 `footer-cell-click` 可以监听点击表尾单元格事件 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/footer-cell-context-menu-event.md b/example/src/docs/zh-CN/grid/event/footer-cell-context-menu-event.md deleted file mode 100644 index 04ccc3654..000000000 --- a/example/src/docs/zh-CN/grid/event/footer-cell-context-menu-event.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 - -
- -### 右键点击表尾单元格事件 - -在 `grid` 标签上配置 `footer-cell-context-menu` 右键点击表尾单元格事件,配置 `footer-cell-click` 可以触发点击表尾单元格事件。 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/footer-cell-dblclick-event.md b/example/src/docs/zh-CN/grid/event/footer-cell-dblclick-event.md deleted file mode 100644 index d086200e1..000000000 --- a/example/src/docs/zh-CN/grid/event/footer-cell-dblclick-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 双击表尾单元格事件 - -在 `grid` 标签上配置 `footer-cell-dblclick` 可以监听到双击表尾单元格事件 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/grid-events.md b/example/src/docs/zh-CN/grid/event/grid-events.md deleted file mode 100644 index 807ac6b7b..000000000 --- a/example/src/docs/zh-CN/grid/event/grid-events.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 事件对象 - -表格属性 `envents` 设置表格的事件对象。 - -
- - - -
diff --git a/example/src/docs/zh-CN/grid/event/grid-methods.md b/example/src/docs/zh-CN/grid/event/grid-methods.md deleted file mode 100644 index 6673ae84b..000000000 --- a/example/src/docs/zh-CN/grid/event/grid-methods.md +++ /dev/null @@ -1,24 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 获取表格行方法 -::: tip 获取行的方法 - `getCurrentRow` 获取当前行 - `getRowIndex` 获取当前行号 - `getRadioRow` Radio 单选选中行 - `getRowById` 通过 rowId 获取当前行 - `getRowNode` 通过 tr 元素获取行信息 -::: - - - -
diff --git a/example/src/docs/zh-CN/grid/event/grid-scroll-event.md b/example/src/docs/zh-CN/grid/event/grid-scroll-event.md deleted file mode 100644 index ee7b91c24..000000000 --- a/example/src/docs/zh-CN/grid/event/grid-scroll-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 事件 - -在 `grid` 标签上配置 `scroll` 事件,可以监听表格的滚动 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/header-cell-context-menu-event.md b/example/src/docs/zh-CN/grid/event/header-cell-context-menu-event.md deleted file mode 100644 index e0b5ef88b..000000000 --- a/example/src/docs/zh-CN/grid/event/header-cell-context-menu-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 右键点击表头事件 - -只对 在 `grid` 标签上配置 `header-cell-context-menu` 可以监听右键点击表头事件 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/header-click-event.md b/example/src/docs/zh-CN/grid/event/header-click-event.md deleted file mode 100644 index 15498f41c..000000000 --- a/example/src/docs/zh-CN/grid/event/header-click-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 表头点击事件 - -在 `grid` 标签上配置 `header-cell-click` 可以监听到表头的点击事件 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/header-dblclick-event.md b/example/src/docs/zh-CN/grid/event/header-dblclick-event.md deleted file mode 100644 index 39e68e652..000000000 --- a/example/src/docs/zh-CN/grid/event/header-dblclick-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 表头双击事件 - -在 `grid` 标签上配置 `header-cell-dblclick` 可以监听到表头的双击事件 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/page-change-event.md b/example/src/docs/zh-CN/grid/event/page-change-event.md deleted file mode 100644 index 2dab12363..000000000 --- a/example/src/docs/zh-CN/grid/event/page-change-event.md +++ /dev/null @@ -1,29 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 分页发生改变事件 - -只对 在 `grid` 标签上配置 `page-change` 可以监听分页发生改变事件 - - - -
-
-
- -### 分页发生改变前的事件 - -通过在 `grid` 标签上配置 `is-before-page-change` 选择是否打开页面改变时的前置处理特性。在值为 `true` 时,翻页操作或者改变页大小操作不会立即生效,留给用户处理业务逻辑,之后通过调用预留的 `callback` 或者 `rollback` 使之生效或者失效;通过事件 `before-page-change` 在进行翻页操作或者改变页大小操作时触发,然后控制是否跳转分页。 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/radio-change-event.md b/example/src/docs/zh-CN/grid/event/radio-change-event.md deleted file mode 100644 index 7adf07bbb..000000000 --- a/example/src/docs/zh-CN/grid/event/radio-change-event.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 勾选行事件 - -在 `grid` 标签上配置 `radio-change` 可以监听勾选行事件 -只对 type=radio 有效,当手动勾选并且值发生改变时触发的事件 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/resizable-change-event.md b/example/src/docs/zh-CN/grid/event/resizable-change-event.md deleted file mode 100644 index 5c66d4be8..000000000 --- a/example/src/docs/zh-CN/grid/event/resizable-change-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 列宽改变事件 - -在 `grid` 标签上配置 `resizable-change` 可以监听列宽改变事件 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/select-all-event.md b/example/src/docs/zh-CN/grid/event/select-all-event.md deleted file mode 100644 index e44bdf8d8..000000000 --- a/example/src/docs/zh-CN/grid/event/select-all-event.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 手动勾选全选时触发的事件 - -在 `grid` 标签上配置 `select-all` 有效 -只对 type=selection 有效,当手动勾选全选时触发的事件 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/select-change-event.md b/example/src/docs/zh-CN/grid/event/select-change-event.md deleted file mode 100644 index a209f4517..000000000 --- a/example/src/docs/zh-CN/grid/event/select-change-event.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 勾选行事件 - -在 `grid` 标签上配置 `select-change` 可以监听到勾选行事件 -只对 type=selection 有效,当手动勾选并且值发生改变时触发的事件 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/toggle-expand-change-event.md b/example/src/docs/zh-CN/grid/event/toggle-expand-change-event.md deleted file mode 100644 index cd04c1efe..000000000 --- a/example/src/docs/zh-CN/grid/event/toggle-expand-change-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 行展开收起事件 - -在 `grid` 标签上配置 `toggle-expand-change` 可以监听到行展开收起事件 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/toggle-tree-change-event.md b/example/src/docs/zh-CN/grid/event/toggle-tree-change-event.md deleted file mode 100644 index 388c03f7b..000000000 --- a/example/src/docs/zh-CN/grid/event/toggle-tree-change-event.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 树节点展开收起事件 - -在 `grid` 标签上配置 `toggle-tree-change` 可以监听树节点展开收起事件 - - -
diff --git a/example/src/docs/zh-CN/grid/event/toolbar-button-click-event.md b/example/src/docs/zh-CN/grid/event/toolbar-button-click-event.md deleted file mode 100644 index 7b8ede7b6..000000000 --- a/example/src/docs/zh-CN/grid/event/toolbar-button-click-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 工具栏点击事件 - -在 `grid` 标签上配置 `resizable-change` 可以监听工具栏点击事件 - - - -
diff --git a/example/src/docs/zh-CN/grid/event/valid-error-event.md b/example/src/docs/zh-CN/grid/event/valid-error-event.md deleted file mode 100644 index e319f1da5..000000000 --- a/example/src/docs/zh-CN/grid/event/valid-error-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 校验不通过事件 - -在 `grid` 标签上配置 `valid-error` 监听校验不通过事件 - - - -
diff --git a/example/src/docs/zh-CN/grid/faq.md b/example/src/docs/zh-CN/grid/faq.md deleted file mode 100644 index 8e9250c02..000000000 --- a/example/src/docs/zh-CN/grid/faq.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 表格列头与单元格错位 - -当出现grid表头与表体单元格错位时,可以选择性地做以下偿试 -1.给每列设置列宽,可以使用`column-width`属性,也可以单独给每列进行设置 -2.将`show-overflow`、`show-header-overflow` 都设置为 `true` -3.将 `table-layout` 设置为 `auto` - - - - -
diff --git a/example/src/docs/zh-CN/grid/filter/advanced-filter.md b/example/src/docs/zh-CN/grid/filter/advanced-filter.md deleted file mode 100644 index c03b06419..000000000 --- a/example/src/docs/zh-CN/grid/filter/advanced-filter.md +++ /dev/null @@ -1,22 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 过滤高级设置 - -通过 `inputFilter` 可以给input过滤区域配置自定义组件与条件,通过 `extends` 可以增加快捷过滤列表 - - - -
- - - diff --git a/example/src/docs/zh-CN/grid/filter/custom-filter.md b/example/src/docs/zh-CN/grid/filter/custom-filter.md deleted file mode 100644 index 5a9900faf..000000000 --- a/example/src/docs/zh-CN/grid/filter/custom-filter.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 过滤 - -通过 `filter` 属性设置列筛选规则 - - - -
- -### 自定义筛选 - -通过 `params` 属性设置额外的参数 - - - - diff --git a/example/src/docs/zh-CN/grid/filter/default-filter.md b/example/src/docs/zh-CN/grid/filter/default-filter.md deleted file mode 100644 index 7ec7e30e9..000000000 --- a/example/src/docs/zh-CN/grid/filter/default-filter.md +++ /dev/null @@ -1,46 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 - -
- -### 过滤 - -::: tip filter 配置 - -通过自定义的 `filter` 的作用域插槽自定义筛选的规则 - -可以配置项: - -multi 设置在显示枚举选项功能是否为多选, 仅在 enumable:true 下有效。 - -enumable 设置在过滤面板中显示枚举选项。 - -inputFilter 设置在过滤面板中显示输入筛选的项。 - -defaultFilter 设置在过滤面板中显示默认的筛选条件。 - -values 设置在显示枚举选项功能(enumable)下制定静态数据源。 - -label 设置枚举数据的显示值属性字段, 默认'label'。 - -value 设置枚举数据的实际值属性字段, 默认'value'。 - -::: - - - -### 自定义参数 - -通过 `params` 添加自定义参数 - - - -
diff --git a/example/src/docs/zh-CN/grid/filter/default-relation.md b/example/src/docs/zh-CN/grid/filter/default-relation.md deleted file mode 100644 index 64a96ed9b..000000000 --- a/example/src/docs/zh-CN/grid/filter/default-relation.md +++ /dev/null @@ -1,24 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 输入过滤的默认选项 - -通过属性 `inputFilter.relation` 配置输入过滤的默认选项。 -输入过滤的内置选项:`equals`,`unequal`,`greaterThan`,`lessThan`,`equalToGreaterThan`,`equalToLessThan`,`contains`,`startwith`,`endwith`;也可以配置自定义选项。 -配置自定义选项的同时要配置过滤方法,通过属性 `inputFilter.method` 配置。 - - - -
- - - diff --git a/example/src/docs/zh-CN/grid/filter/server-filter.md b/example/src/docs/zh-CN/grid/filter/server-filter.md deleted file mode 100644 index d76ac2f3c..000000000 --- a/example/src/docs/zh-CN/grid/filter/server-filter.md +++ /dev/null @@ -1,24 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 - -
- -### 服务端过滤 - -配置 remote-filter 开启服务端过滤,服务端过滤会调用表格 fetch-data 进行查询,filter-change 服务端过滤后触发的事件 - -:::warning -该示例中的 `services/getGridMockData` 服务需要自行实现,示例模拟了远程服务返回的数据 -::: - - - -
diff --git a/example/src/docs/zh-CN/grid/fixed/left-fixed.md b/example/src/docs/zh-CN/grid/fixed/left-fixed.md deleted file mode 100644 index 93e8266ad..000000000 --- a/example/src/docs/zh-CN/grid/fixed/left-fixed.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 左冻结 - - 通过 `fixed` 属性设置列冻结。可选值为 `left right` 默认为 `left` - - - -
diff --git a/example/src/docs/zh-CN/grid/fixed/multi-column-fixed.md b/example/src/docs/zh-CN/grid/fixed/multi-column-fixed.md deleted file mode 100644 index a97c2b8cc..000000000 --- a/example/src/docs/zh-CN/grid/fixed/multi-column-fixed.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 操作列冻结 - - 通过 `fixed` 属性设置列冻结。可选值为 `left right` 默认为 `left` - - - -
diff --git a/example/src/docs/zh-CN/grid/fixed/right-fixed.md b/example/src/docs/zh-CN/grid/fixed/right-fixed.md deleted file mode 100644 index c35cf9943..000000000 --- a/example/src/docs/zh-CN/grid/fixed/right-fixed.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 右冻结 - -通过 `fixed` 属性设置列冻结。可选值为 `left right` 默认为 `left` - - - -
diff --git a/example/src/docs/zh-CN/grid/footer/custom-footer.md b/example/src/docs/zh-CN/grid/footer/custom-footer.md deleted file mode 100644 index 2a4358e56..000000000 --- a/example/src/docs/zh-CN/grid/footer/custom-footer.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 自定义表尾合计 - -通过 `footer-method` 设置表尾合计的逻辑 必须配置 `show-footer` - - - -
diff --git a/example/src/docs/zh-CN/grid/footer/footer-class-name.md b/example/src/docs/zh-CN/grid/footer/footer-class-name.md deleted file mode 100644 index 2eb1f6295..000000000 --- a/example/src/docs/zh-CN/grid/footer/footer-class-name.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 表尾class类名 - -
- -通过表格列属性 `footer-class-name` 给表尾的单元格附加 className,也可以是函数 Function({$rowIndex, column, columnIndex, $columnIndex})。 - -
- - - -
diff --git a/example/src/docs/zh-CN/grid/footer/footer-row-or-column-span.md b/example/src/docs/zh-CN/grid/footer/footer-row-or-column-span.md deleted file mode 100644 index 563074d7f..000000000 --- a/example/src/docs/zh-CN/grid/footer/footer-row-or-column-span.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 表尾合并行或列 - -通过 `footer-method` 和 `footer-span-method` 设置表尾合计行或列逻辑 必须配置 `show-footer` - - - -
diff --git a/example/src/docs/zh-CN/grid/footer/footer-summation.md b/example/src/docs/zh-CN/grid/footer/footer-summation.md deleted file mode 100644 index 30e1097e9..000000000 --- a/example/src/docs/zh-CN/grid/footer/footer-summation.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 表尾统计 - - - -
- -### 表尾统计(空数据) - - - -
\ No newline at end of file diff --git a/example/src/docs/zh-CN/grid/grid-basic-usage.md b/example/src/docs/zh-CN/grid/grid-basic-usage.md deleted file mode 100644 index 5d33efe9e..000000000 --- a/example/src/docs/zh-CN/grid/grid-basic-usage.md +++ /dev/null @@ -1,36 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 - -
- -### 标签式 - - - -### 配置式 - - - -### 表格属性说明 - - - -
- -### 表格列属性说明 - - - -
- -### 表格工具栏说明 - - diff --git a/example/src/docs/zh-CN/grid/grid-border.md b/example/src/docs/zh-CN/grid/grid-border.md deleted file mode 100644 index cb3a42151..000000000 --- a/example/src/docs/zh-CN/grid/grid-border.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -表格属性设置 `border` 给表格加上边框。 - - - -
diff --git a/example/src/docs/zh-CN/grid/grid-customs.md b/example/src/docs/zh-CN/grid/grid-customs.md deleted file mode 100644 index 9665c6e02..000000000 --- a/example/src/docs/zh-CN/grid/grid-customs.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -表格属性 `customs` 初始化显示/隐藏列(通过 visible 设置为 false 则默认隐藏列)。 - - - -
diff --git a/example/src/docs/zh-CN/grid/grid-loading-tip.md b/example/src/docs/zh-CN/grid/grid-loading-tip.md deleted file mode 100644 index 250c27d19..000000000 --- a/example/src/docs/zh-CN/grid/grid-loading-tip.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 关闭加载中状态 - -表格属性设置 `loading` 开启或关闭加载状态,默认值为 `false` 不开启。 - - - -### 开启加载中状态 - - - -
diff --git a/example/src/docs/zh-CN/grid/grid-optimization.md b/example/src/docs/zh-CN/grid/grid-optimization.md deleted file mode 100644 index e8e7b1f81..000000000 --- a/example/src/docs/zh-CN/grid/grid-optimization.md +++ /dev/null @@ -1,26 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 优化配置项 - -:::tip optimization(Object) 配置说明 -| animat(Boolean) | 表格动画效果开关(关闭后视觉效果更快)默认为 true | -| delayHover(Number) | 当表格发生拖动、滚动...等行为时,至少多少毫秒之后才允许触发 hover 事件 默认 250ms | -| scrollX(Object) | 横向 X 虚拟滚动配置(用于特殊场景手动调优)例如:{ gt: 100 } | -| scrollY(Object) | 纵向 Y 虚拟滚动配置(用于特殊场景手动调优)例如:{ gt: 500 } | -::: - -
- - - -
diff --git a/example/src/docs/zh-CN/grid/grid-size.md b/example/src/docs/zh-CN/grid/grid-size.md deleted file mode 100644 index 54b7832ef..000000000 --- a/example/src/docs/zh-CN/grid/grid-size.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### size 设置大小为 medium - -表格设置 `size` 属性调整表格尺寸大小。 - - - -### size 设置大小为 small - - - -### size 设置大小为 mini - - - -
diff --git a/example/src/docs/zh-CN/grid/grid-stripe.md b/example/src/docs/zh-CN/grid/grid-stripe.md deleted file mode 100644 index 8546e157d..000000000 --- a/example/src/docs/zh-CN/grid/grid-stripe.md +++ /dev/null @@ -1,33 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -`stripe` 是否带有斑马纹 默认不开启,设置stripe属性为true时开启。(注:需要注意的是,在可编辑表格场景下,临时插入的数据不会有斑马纹样式) - -
- -默认没有斑马纹: -
- - - -
- -设置为有斑马纹: -
- - - - - -
diff --git a/example/src/docs/zh-CN/grid/header/custom-grid-header.md b/example/src/docs/zh-CN/grid/header/custom-grid-header.md deleted file mode 100644 index d9cd61e66..000000000 --- a/example/src/docs/zh-CN/grid/header/custom-grid-header.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 自定义表头 - -通过列 `slot` 插槽自定义表头 - - - -
diff --git a/example/src/docs/zh-CN/grid/header/header-class-name.md b/example/src/docs/zh-CN/grid/header/header-class-name.md deleted file mode 100644 index 957d69538..000000000 --- a/example/src/docs/zh-CN/grid/header/header-class-name.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本说明 - -通过列属性 `header-class-name` 给表头的单元格附加 className,也可以是函数 Function({$rowIndex, column, columnIndex, $columnIndex})。 - -
- - - -
diff --git a/example/src/docs/zh-CN/grid/header/hide-grid-header.md b/example/src/docs/zh-CN/grid/header/hide-grid-header.md deleted file mode 100644 index 0f1317a68..000000000 --- a/example/src/docs/zh-CN/grid/header/hide-grid-header.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 控制隐藏表头 - -设置 `showHeader` 属性为 `fasle` 控制隐藏表头,默认为 `true`。 - - - -
diff --git a/example/src/docs/zh-CN/grid/header/slot-header.md b/example/src/docs/zh-CN/grid/header/slot-header.md deleted file mode 100644 index bca4b0ed2..000000000 --- a/example/src/docs/zh-CN/grid/header/slot-header.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 自定义表头 - -设置 `header` 插槽,配置自定义表头内容的模板。 - - - -
diff --git a/example/src/docs/zh-CN/grid/highlight/highlight-cell.md b/example/src/docs/zh-CN/grid/highlight/highlight-cell.md deleted file mode 100644 index 588542cc3..000000000 --- a/example/src/docs/zh-CN/grid/highlight/highlight-cell.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -设置 `highlight-cell` 是否在编辑时高亮单元格边框,只对 `editConfig` 配置时有效 - - - -
diff --git a/example/src/docs/zh-CN/grid/highlight/highlight-current-column.md b/example/src/docs/zh-CN/grid/highlight/highlight-current-column.md deleted file mode 100644 index dc31ef94d..000000000 --- a/example/src/docs/zh-CN/grid/highlight/highlight-current-column.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -设置 `highlight-current-column` 属性控制鼠标选中的当前列是否开启高亮 - - - -
diff --git a/example/src/docs/zh-CN/grid/highlight/highlight-current-row.md b/example/src/docs/zh-CN/grid/highlight/highlight-current-row.md deleted file mode 100644 index 8c0dfbd5a..000000000 --- a/example/src/docs/zh-CN/grid/highlight/highlight-current-row.md +++ /dev/null @@ -1,24 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -设置 `highlight-current-row` 属性控制鼠标选中行是否开启高亮 - - -:::warning -带有斑马线的行无高亮效果 -::: - - - -
diff --git a/example/src/docs/zh-CN/grid/highlight/highlight-hover-column.md b/example/src/docs/zh-CN/grid/highlight/highlight-hover-column.md deleted file mode 100644 index 511147bcc..000000000 --- a/example/src/docs/zh-CN/grid/highlight/highlight-hover-column.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -设置 `highlight-hover-column` 属性为控制鼠标悬停到当前列列头是否开启高亮。 - - - -
diff --git a/example/src/docs/zh-CN/grid/highlight/highlight-hover-row.md b/example/src/docs/zh-CN/grid/highlight/highlight-hover-row.md deleted file mode 100644 index 9cb00bca7..000000000 --- a/example/src/docs/zh-CN/grid/highlight/highlight-hover-row.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 高亮悬停行 - -设置 `highlight-hover-row` 属性控制鼠标悬停到当前行是否开启高亮。 默认为 `true` 开启高亮, 如果不需要悬停高亮设置 `highlight-hover-row` 为 `false`。 - - - -### 设置指定行高亮 - -`setCurrentRow(row)` 可设置某一行为高亮状态。 - - - -
diff --git a/example/src/docs/zh-CN/grid/import-export/export-excel.md b/example/src/docs/zh-CN/grid/import-export/export-excel.md deleted file mode 100644 index e1a9b305c..000000000 --- a/example/src/docs/zh-CN/grid/import-export/export-excel.md +++ /dev/null @@ -1,195 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 - -
- -### 基本用法 - - - -### 基于 XLSX 插件进行导出 - -:::tip 提示 - -`xlsx` 是一个非常强大的前端 `EXCEL` 文件操作库,支持表格带格式导入导出,可兼容 `IE9+` 版本的浏览器。 - -详情参考: - -::: - -```javascript - - - -``` - -
diff --git a/example/src/docs/zh-CN/grid/import-export/import-grid.md b/example/src/docs/zh-CN/grid/import-export/import-grid.md deleted file mode 100644 index 2962dc3be..000000000 --- a/example/src/docs/zh-CN/grid/import-export/import-grid.md +++ /dev/null @@ -1,90 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 - -
- -### 基于 XLSX 插件进行导入 - -:::tip - -提示 `xlsx` 是一个非常强大的前端 `EXCEL` 文件操作库,支持表格带格式导入导出,可兼容 `IE9+` 版本的浏览器。 - -详情参考: - -::: - -```javascript - - - -``` - -
diff --git a/example/src/docs/zh-CN/grid/keyboard/keyboard-config.md b/example/src/docs/zh-CN/grid/keyboard/keyboard-config.md deleted file mode 100644 index 3dc4f0c5a..000000000 --- a/example/src/docs/zh-CN/grid/keyboard/keyboard-config.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -表格属性 `keyboard-config` 设置按键配置项。 - -
- - - -
diff --git a/example/src/docs/zh-CN/grid/keyboard/keyboard-navigation.md b/example/src/docs/zh-CN/grid/keyboard/keyboard-navigation.md deleted file mode 100644 index e251586f4..000000000 --- a/example/src/docs/zh-CN/grid/keyboard/keyboard-navigation.md +++ /dev/null @@ -1,36 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 键盘导航 - -:::tip 按键说明 -| Arrow Up ↑ | 移动到当前活动单元格上面的单元格 | -| Arrow Down ↓ | 移动到当前活动单元格下面的单元格 | -| Arrow Left ← | 移动到当前活动单元格左边的单元格 | -| Arrow Right → | 移动到当前活动单元格右边的单元格 | -| Tab | 移动到当前选中或活动单元格的右侧单元格,如果到最后一列且存在下一行,则从下一行开始移动 | -| Tab + Shift | 移动到当前选中或活动单元格的左侧单元格,如果到第一列且存在上一行,则从上一行开始移动 | -| Spacebar | 如果单元格是复选框或单选框则切换勾选状态 | -| Enter | 取消编辑并移动到当前活动单元格下面的单元格 | -| Delete | 清空内容 | -| Backspace | 清空内容并激活选中单元格为编辑状态 | -| F2 | 激活单元格编辑 | -| Esc | 取消单元格编辑 | -| Page Up | 向上翻页滚动 | -| Page Down | 向下翻页滚动 | -| Home | 滚动到顶部 | -| End | 滚动到底部 | -::: - - - -
diff --git a/example/src/docs/zh-CN/grid/keyboard/mouse-config.md b/example/src/docs/zh-CN/grid/keyboard/mouse-config.md deleted file mode 100644 index 13ba65d9b..000000000 --- a/example/src/docs/zh-CN/grid/keyboard/mouse-config.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -表格属性 `mouse-config` 设置鼠标配置项。 - -
- - - -
diff --git a/example/src/docs/zh-CN/grid/large-data/full-data-loading.md b/example/src/docs/zh-CN/grid/large-data/full-data-loading.md deleted file mode 100644 index c64228934..000000000 --- a/example/src/docs/zh-CN/grid/large-data/full-data-loading.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -当表格数据过多时会有性能问题,用户可通过 `$refs` 获取表格对象,设置表格对象的 `loadData` 方法启用全量加载来优化性能。 - - - -
diff --git a/example/src/docs/zh-CN/grid/large-data/load-column.md b/example/src/docs/zh-CN/grid/large-data/load-column.md deleted file mode 100644 index e32382169..000000000 --- a/example/src/docs/zh-CN/grid/large-data/load-column.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 生成 1000 列 - -通过 `loadColumn(columns)` 方法可以加载列配置,对于需要重新加载列的场景下可能会用到。 - - - -
diff --git a/example/src/docs/zh-CN/grid/large-data/scroll-paging.md b/example/src/docs/zh-CN/grid/large-data/scroll-paging.md deleted file mode 100644 index ef0e88d8b..000000000 --- a/example/src/docs/zh-CN/grid/large-data/scroll-paging.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -滚动分页配置步骤: -1、表格属性设置 `fetch-data` 开启服务请求; -2、表格属性设置 `scroll-load` 开启滚动分页。 - - - -
diff --git a/example/src/docs/zh-CN/grid/large-data/scroll-to.md b/example/src/docs/zh-CN/grid/large-data/scroll-to.md deleted file mode 100644 index c579c4b9a..000000000 --- a/example/src/docs/zh-CN/grid/large-data/scroll-to.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 滚动到指定位置 - -:::tip 方法说明 -`scrollTo(scrollLeft, scrollTop)`:滚动到对应的位置 -`scrollToRow(row)`:滚动到对应的行 -`scrollToColumn(column)`:手滚动到对应的列 -::: - - - -
diff --git a/example/src/docs/zh-CN/grid/large-data/virtual-rolling.md b/example/src/docs/zh-CN/grid/large-data/virtual-rolling.md deleted file mode 100644 index 5e3ae672b..000000000 --- a/example/src/docs/zh-CN/grid/large-data/virtual-rolling.md +++ /dev/null @@ -1,39 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -虚拟滚动配置步骤: -1、表格属性设置 `height` 固定高度; -2、表格属性设置 `optimization` 开启虚拟滚动。 - -:::tip optimization(Object) 配置说明 -| delayHover(Number) | 当表格发生拖动、滚动...等行为时,至少多少毫秒之后才允许触发 hover 事件 默认 250ms | -| scrollX(Object) | 横向 X 虚拟滚动配置(用于特殊场景手动调优)例如:{ gt: 100 } | -| scrollY(Object) | 纵向 Y 虚拟滚动配置(用于特殊场景手动调优)例如:{ gt: 500 } | -::: - -:::tip 开启虚拟滚动注意事项 -1、开启虚拟滚动的前提是需要保证每列的宽度一样,可以通过在 `` 标签上的 `column-width` 属性配置统一的宽度。 -2、开启虚拟滚动将会禁用列宽调整功能,因为列拖拽会改变列宽度,导致虚拟滚动渲染的列数计算有误从而引起表格样式错乱,所以禁止列拖拽。 -::: - - - - -
- -### 树表虚滚 - - - -
diff --git a/example/src/docs/zh-CN/grid/mixin-ui/mixin-antd.md b/example/src/docs/zh-CN/grid/mixin-ui/mixin-antd.md deleted file mode 100644 index 6f5854697..000000000 --- a/example/src/docs/zh-CN/grid/mixin-ui/mixin-antd.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - - - -
diff --git a/example/src/docs/zh-CN/grid/mixin-ui/mixin-aui2.md b/example/src/docs/zh-CN/grid/mixin-ui/mixin-aui2.md deleted file mode 100644 index 829c71570..000000000 --- a/example/src/docs/zh-CN/grid/mixin-ui/mixin-aui2.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### TINY 2.0 - - - -
diff --git a/example/src/docs/zh-CN/grid/mixin-ui/mixin-elementui.md b/example/src/docs/zh-CN/grid/mixin-ui/mixin-elementui.md deleted file mode 100644 index 31f1ae1b8..000000000 --- a/example/src/docs/zh-CN/grid/mixin-ui/mixin-elementui.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### ElementUI - -:::warning 该示例在IE下显示异常,原因是示例中的 ElementUI 组件不兼容 IE11 导致。 -::: - - - -
diff --git a/example/src/docs/zh-CN/grid/mixin-ui/mixin-iview.md b/example/src/docs/zh-CN/grid/mixin-ui/mixin-iview.md deleted file mode 100644 index 4c9452f77..000000000 --- a/example/src/docs/zh-CN/grid/mixin-ui/mixin-iview.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - - - -
diff --git a/example/src/docs/zh-CN/grid/mixin-ui/mixin-tiny2.md b/example/src/docs/zh-CN/grid/mixin-ui/mixin-tiny2.md deleted file mode 100644 index cf564038a..000000000 --- a/example/src/docs/zh-CN/grid/mixin-ui/mixin-tiny2.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### TINY 2.0 - - - -
diff --git a/example/src/docs/zh-CN/grid/mixin-ui/mixin-xui.md b/example/src/docs/zh-CN/grid/mixin-ui/mixin-xui.md deleted file mode 100644 index 4c9452f77..000000000 --- a/example/src/docs/zh-CN/grid/mixin-ui/mixin-xui.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - - - -
diff --git a/example/src/docs/zh-CN/grid/nested-grid.md b/example/src/docs/zh-CN/grid/nested-grid.md deleted file mode 100644 index 43f296fce..000000000 --- a/example/src/docs/zh-CN/grid/nested-grid.md +++ /dev/null @@ -1,43 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 嵌套表格 - -需要在 `grid` 标签上配 `edit-config` 对象,`activeMethod` 编辑前的事件处理编辑项数据集。`grid-column` 列上面配置 `editor` 对象,`component` 用来渲染编辑组件。`attrs` 配置级联数据。`events` 来设置事件。具体参考下面示例。 - - - -### 检查行是否已展开 - -通过调用 `hasRowExpand(row)` 方法可以检查行是否已展开,参数 row 为行数据对象。 - - - -### 设置展开所有行 - -通过调用 `setAllRowExpansion(checked)` 方法可设置所有行的展开与否。 - - - -### 设置展开指定行 - -通过调用 `setRowExpansion(rows, checked)` 方法可设置展开指定行,第二个参数设置这一行展开与否,展开指定行时,通过调用clearRowExpand()方法先,关闭已展开的行。 - - - -### 手动切换展开行 - -通过调用 `toggleRowExpansion(row)` 方法可手动切换展开行。 - - - -
diff --git a/example/src/docs/zh-CN/grid/operation-column/checkbox-operation-column.md b/example/src/docs/zh-CN/grid/operation-column/checkbox-operation-column.md deleted file mode 100644 index dda754041..000000000 --- a/example/src/docs/zh-CN/grid/operation-column/checkbox-operation-column.md +++ /dev/null @@ -1,61 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -表格列属性设置 `type="selection"` 显示多选列。 - - - -
- -### 手动取消多选行 - - - -### 手动选中所有行 - -`setAllSelection(checked)` 用于多选行,可设置所有行的选中状态。 - - - -### 手动选中指定行 - -`setSelection(rows, checked)` 用于多选行,可设置指定行为选中状态,第一个参数可传入对象或数组,如果是对象则选择单行,如果是数组则选择多行,第二个参数为选中与否。 - -:::tip -`setSelection` 方法不会触发 `select-change` 事件,只有点击才会触发 -::: - - - -### 手动切换所有行选中状态 - -`toggleAllSelection()` 方法可直接切换所有行的选中状态。 - - - -### 手动切换指定行选中状态 - -`toggleRowSelection(row)` 方法可直接切换某一行的选中状态。 - - - -
- -### 多选禁用 - -多选模式,通过 `select-config` 配置项的属性 `checkMethod` ,传入自定义方法判断哪些数据项被禁用,方法会判断每个数据项,需返回值为 `true` 或者 `false`,代表此数据项启用或者禁用。 - - - -
diff --git a/example/src/docs/zh-CN/grid/operation-column/column-key.md b/example/src/docs/zh-CN/grid/operation-column/column-key.md deleted file mode 100644 index a24643770..000000000 --- a/example/src/docs/zh-CN/grid/operation-column/column-key.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -通过属性 `column-key` 设置是否需要为每一列的 VNode 设置 `key` 属性(非特殊情况下不需要使用)。 - -
- - - -
diff --git a/example/src/docs/zh-CN/grid/operation-column/custom-operation-column.md b/example/src/docs/zh-CN/grid/operation-column/custom-operation-column.md deleted file mode 100644 index c34f03051..000000000 --- a/example/src/docs/zh-CN/grid/operation-column/custom-operation-column.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -通过插槽设置自定义操作列,即 `` 自定义操作列内容 `` 。 - - - -
diff --git a/example/src/docs/zh-CN/grid/operation-column/radio-operation-column.md b/example/src/docs/zh-CN/grid/operation-column/radio-operation-column.md deleted file mode 100644 index 064acd5d6..000000000 --- a/example/src/docs/zh-CN/grid/operation-column/radio-operation-column.md +++ /dev/null @@ -1,46 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 - -
- -### 基本用法 - -表格列属性设置 `type="radio"` 显示单选列。 - - - -
- -### 手动取消单选行 - - - -### 手动选中某一行 - -`setRadioRow(row)` 用于单选行,设置某一行为选中状态。 - - - -### 单选配置项 - -`radio-config` 配置项,可以配置单选框的默认选中项和禁用配置等特性。 - - - -
- -### 单选禁用 - -单选模式,通过 `radio-config` 配置项的属性 `checkMethod` ,传入自定义方法判断哪些数据项被禁用,方法会判断每个数据项,需返回值为 `true` 或者 `false`,代表此数据项启用或者禁用。 - - - -
diff --git a/example/src/docs/zh-CN/grid/pager/custom-pager.md b/example/src/docs/zh-CN/grid/pager/custom-pager.md deleted file mode 100644 index 75909e010..000000000 --- a/example/src/docs/zh-CN/grid/pager/custom-pager.md +++ /dev/null @@ -1,24 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -和内置分页类似,只需要把我们官方分页组件改为第三方分页组件即可,其他的保持一致。 -自定义分页配置步骤: -1、`import` 引入第三方的 `Pager` 组件,例如引入 `ElementUI` 的 `Pager` 组件的示例: `import { Pager } from 'element-ui'` 。 -2、`Pager` 传入给 `data()` 函数存储起来以便模板中使用。 -3、表格属性设置 `pager` 进行分页相关配置,通过 `pager` 的属性 `{component: Pager}` 注入分页组件。 -4、配置 seq-serial 属性可以设置翻页后序号连续显示,默认是不连续显示的 - - - -
diff --git a/example/src/docs/zh-CN/grid/pager/inner-pager.md b/example/src/docs/zh-CN/grid/pager/inner-pager.md deleted file mode 100644 index 5a8bef2cd..000000000 --- a/example/src/docs/zh-CN/grid/pager/inner-pager.md +++ /dev/null @@ -1,67 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 - -
- -### 基本用法 - -为保障表格足够轻量和开放性需求,表格进行模块化拆分,核心代码轻量化,分页功能需要引入分页组件,内置分页配置步骤: -1、`import` 引入我们官方的 `Pager` 组件,即 `import Pager from '@opentiny/vue-pager'` 或者 `{ Pager } from '@opentiny/vue'` 。 -2、`Pager` 传入给 `data()` 函数存储起来以便模板中使用。 -3、表格属性设置 `pager` 进行分页相关配置,通过 `pager` 的属性 `{component: Pager}` 注入分页组件。 -4、配置 seq-serial 属性可以设置翻页后序号连续显示,默认是不连续显示的 - - - -
- -### 提示保存数据 - -配置 `showSaveMsg` 属性,当检查到表格数据存在修改时,会提示用户进行保存 - - - -
- -### 升级指导 - -TINY 2.x 版本内置分页配置,在 op 中增加如下配置: - -```js -showPager: true, -pagerOp: { - mode: 'number', - pageVO: { - curPage: 1, - pageSize: 5 - }, - pageSizes: [5, 15, 50, 100] -} -``` - -TINY 3 版本内置分页配置,在标签上配置 `pager` 属性,配置内容如下所示: - -```js -import { Grid, GridColumn, Pager } from '@opentiny/vue' -... -pagerConfig: { - component: Pager, - attrs: { - currentPage: 1, - pageSize: 5, - pageSizes: [5, 10], - total: 0, - layout: 'total, prev, pager, next, jumper, sizes' - } -} -``` - -
diff --git a/example/src/docs/zh-CN/grid/renderer/async-colunm-render.md b/example/src/docs/zh-CN/grid/renderer/async-colunm-render.md deleted file mode 100644 index 74834b6ff..000000000 --- a/example/src/docs/zh-CN/grid/renderer/async-colunm-render.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 列异步数据渲染 - -将列`format-config`的 `async`属性配置为`true`后,支持动态修改其`data`数据自动渲染。 这种整列异步渲染一般将`type`设置为`enum`,通过`value`与`label`可以配置渲染单元格的映射。 - - - -
diff --git a/example/src/docs/zh-CN/grid/renderer/custom-renderer.md b/example/src/docs/zh-CN/grid/renderer/custom-renderer.md deleted file mode 100644 index 080371ecd..000000000 --- a/example/src/docs/zh-CN/grid/renderer/custom-renderer.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 自定义渲染器 - -自定义渲染器可以自定义渲染单元格,也可渲染一个 `vue 组件`。在 `grid-column` 列配置 `renderer`,支持方法和对象配置。具体参考下面示例。 - - - -
diff --git a/example/src/docs/zh-CN/grid/renderer/inner-renderer.md b/example/src/docs/zh-CN/grid/renderer/inner-renderer.md deleted file mode 100644 index 590c79900..000000000 --- a/example/src/docs/zh-CN/grid/renderer/inner-renderer.md +++ /dev/null @@ -1,38 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 内置渲染器 - -内置渲染器设置当前表格列的显示获取类型。 -在 `grid-column` 列配置 `format-text` 对象,配合 `format-config` 可以控制数据格式。 - -:::tip -`format-text` 的可取值包括: - * `integer`:显示成整数。 - * `number`:显示成小数。 - * `money`:显示成钱数。 - * rate:显示成百分比的数据。 - * filesize:显示成文件大小的数据。 - * boole:显示成对号或者叉号的图标。 - * date:显示成年月日。 - * dateTime:显示成年月日时分。 - * longDateTime:显示成年月日时分秒。 - * time:显示成时分。 - * longTime:显示成时分秒。 - * yearMonth:显示成年月。 - * enum:通过数据的值,查询出要显示的文本。 - * ellipsis:显示成省略的内容,鼠标移到该单元格上,显示完整内容的提示信息。需要同时配置 format 的 len 属性。 -::: - - - -
diff --git a/example/src/docs/zh-CN/grid/reverse-column-row.md b/example/src/docs/zh-CN/grid/reverse-column-row.md deleted file mode 100644 index 0c2ca56cf..000000000 --- a/example/src/docs/zh-CN/grid/reverse-column-row.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### Grid-表格行列反转 - -需要在 `grid` 标签上配 `:columns="tableColumn"` `:show-header="false"`。点击“反转表格”按钮可查看效果,现阶段只能执行一次,执行多次会有问题。具体参考下面示例。 - - - -
diff --git a/example/src/docs/zh-CN/grid/row-grouping.md b/example/src/docs/zh-CN/grid/row-grouping.md deleted file mode 100644 index aa89e60e5..000000000 --- a/example/src/docs/zh-CN/grid/row-grouping.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -`row-group` 属性可以配置行分组,行分组会将具有相同值的列进行分组展示。 - - - -
- -### 自定义分组 - -`row-group` 配置项 `render` 可以自定义渲染分组内容, `closeable` 可以控制分组行是否可以折叠。 - - - -
diff --git a/example/src/docs/zh-CN/grid/serial-column/custom-serial-column.md b/example/src/docs/zh-CN/grid/serial-column/custom-serial-column.md deleted file mode 100644 index bd6bd706b..000000000 --- a/example/src/docs/zh-CN/grid/serial-column/custom-serial-column.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -表格列属性设置 `type="index"` 显示序号列,`index-method` 方法设置自定义序号规则。 - - - -
- -### 自定义序号列的起始值 - -表格列属性设置 `type="index"` 显示序号列,`start-index` 设置自定义序号列的起始值。 - - - -
diff --git a/example/src/docs/zh-CN/grid/serial-column/default-serial-column.md b/example/src/docs/zh-CN/grid/serial-column/default-serial-column.md deleted file mode 100644 index 6eb3ea3ca..000000000 --- a/example/src/docs/zh-CN/grid/serial-column/default-serial-column.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -表格列属性设置 `type="index"` 显示序号列。 - - - -
diff --git a/example/src/docs/zh-CN/grid/slot/buttons-slot.md b/example/src/docs/zh-CN/grid/slot/buttons-slot.md deleted file mode 100644 index 6d6c385fc..000000000 --- a/example/src/docs/zh-CN/grid/slot/buttons-slot.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 工具栏插槽 - - - -
diff --git a/example/src/docs/zh-CN/grid/slot/default-slot.md b/example/src/docs/zh-CN/grid/slot/default-slot.md deleted file mode 100644 index 7fb6eaa2a..000000000 --- a/example/src/docs/zh-CN/grid/slot/default-slot.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 默认插槽 - - - -
diff --git a/example/src/docs/zh-CN/grid/slot/empty-slot.md b/example/src/docs/zh-CN/grid/slot/empty-slot.md deleted file mode 100644 index 4cde7182c..000000000 --- a/example/src/docs/zh-CN/grid/slot/empty-slot.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 空数据显示插槽 - - - - - -
diff --git a/example/src/docs/zh-CN/grid/sort/combinations-sort.md b/example/src/docs/zh-CN/grid/sort/combinations-sort.md deleted file mode 100644 index f2b588a60..000000000 --- a/example/src/docs/zh-CN/grid/sort/combinations-sort.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 多字段组合排序 - -通过表格列设置 `sortable` 属性开启该列排序功能,然后设置 `sort-by` 属性实现多字段组合排序,数组列表就是排序的字段列表。 - - - -
diff --git a/example/src/docs/zh-CN/grid/sort/custom-sort.md b/example/src/docs/zh-CN/grid/sort/custom-sort.md deleted file mode 100644 index 8e016cb39..000000000 --- a/example/src/docs/zh-CN/grid/sort/custom-sort.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 自定义排序 - -通过表格列设置 `sortable` 属性开启该列排序功能,然后设置 `sort-method` 方法实现自定义排序。 - - - -### 手动排序 - -通过 `sort(field, order)` 方法可手动对表格进行排序(如果 order 为空则自动切换排序)。 - - - -
diff --git a/example/src/docs/zh-CN/grid/sort/default-sort.md b/example/src/docs/zh-CN/grid/sort/default-sort.md deleted file mode 100644 index 4d78798b7..000000000 --- a/example/src/docs/zh-CN/grid/sort/default-sort.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 默认排序 - -通过表格列设置 `sortable` 属性开启该列排序功能。 - - - -
- -### 唯一主键 - -通过表格设置 `row-id` 自定义行数据唯一主键的字段名。该属性的默认值为 _XID - - diff --git a/example/src/docs/zh-CN/grid/sort/server-sort.md b/example/src/docs/zh-CN/grid/sort/server-sort.md deleted file mode 100644 index c515d443d..000000000 --- a/example/src/docs/zh-CN/grid/sort/server-sort.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -:::tip -* 表格设置 `remote-sort` 开启所有列服务端排序,列设置 `remote-sort` 开启该列服务端排序 -* 列排序优先级高于表格排序 -* 列设置 `sortable` 时有效 -::: - -### 表格服务端排序 - -通过表格列设置 `sortable` 属性开启该列排序功能,然后表格设置 `remote-sort` 方法开启服务端排序。 - -:::warning -该示例中的 `services/getGridMockData` 服务需要自行实现,示例模拟了远程服务返回的数据 -::: - - diff --git a/example/src/docs/zh-CN/grid/span/column-span.md b/example/src/docs/zh-CN/grid/span/column-span.md deleted file mode 100644 index bfb362a64..000000000 --- a/example/src/docs/zh-CN/grid/span/column-span.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 列合并 - -列合并是通过表格列设置方法 `span-method` 实现的自定义合并规则。例如: - -> 实现2列合并 - - - -> 实现3列合并 - - - -
diff --git a/example/src/docs/zh-CN/grid/span/custom-span.md b/example/src/docs/zh-CN/grid/span/custom-span.md deleted file mode 100644 index ea3732336..000000000 --- a/example/src/docs/zh-CN/grid/span/custom-span.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - - - -
diff --git a/example/src/docs/zh-CN/grid/span/row-span.md b/example/src/docs/zh-CN/grid/span/row-span.md deleted file mode 100644 index c22189b59..000000000 --- a/example/src/docs/zh-CN/grid/span/row-span.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -通过表格列属性 `row-span` 设置内置的行合并规则,该属性仅适用于普通表格,嵌套树表不支持。 - - - -
- -### 自定义合并规则 - -通过表格列属性 `span-method` 设置自定义合并规则。 - - - -
diff --git a/example/src/docs/zh-CN/grid/summary/configuration-summary.md b/example/src/docs/zh-CN/grid/summary/configuration-summary.md deleted file mode 100644 index 1d3d6221e..000000000 --- a/example/src/docs/zh-CN/grid/summary/configuration-summary.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -通过 `summary-config` 设置配置式的统计。 - - - -
diff --git a/example/src/docs/zh-CN/grid/summary/custom-summary.md b/example/src/docs/zh-CN/grid/summary/custom-summary.md deleted file mode 100644 index fb6c56615..000000000 --- a/example/src/docs/zh-CN/grid/summary/custom-summary.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -通过 `footer-method` 和 `show-footer` 配置自定义统计。 - - - -
diff --git a/example/src/docs/zh-CN/grid/tip/cell-tip.md b/example/src/docs/zh-CN/grid/tip/cell-tip.md deleted file mode 100644 index 274ca5b38..000000000 --- a/example/src/docs/zh-CN/grid/tip/cell-tip.md +++ /dev/null @@ -1,29 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 单元格提示 - -单元格提示有2种,一种是 `show-tip` 提示(内容是否超出都会提示),另一种是 `show-overflow` 内容超出当前行时隐藏并提示。 - -:::tip - -`show-overflow` 可选值有: -* `title`:和原生标签的 `title` 属性一致 -* `ellipsis`:内容超出部分显示 `...`,没有提示 -* `tooltip`:内容超出部分显示 `...`,左侧/右侧弹出提示层显示全部信息,`show-overflow` 开启时的缺省提示 - -`tooltip` 提示可通过 `Grid` 属性 `:tooltip-config` 进行配置,配置方式参考 `Tooltip` 组件 -::: - - - -
diff --git a/example/src/docs/zh-CN/grid/tip/column-header-tip.md b/example/src/docs/zh-CN/grid/tip/column-header-tip.md deleted file mode 100644 index 1bdf73add..000000000 --- a/example/src/docs/zh-CN/grid/tip/column-header-tip.md +++ /dev/null @@ -1,26 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 列头提示 - -列头提示有2种,一种是 `show-header-tip` 提示(内容是否超出都会提示),另一种是 `show-header-overflow` 内容超出当前行时隐藏并提示。 - -:::tip -`show-header-overflow` 可选值有: -* `tooltip`:内容超出部分显示 `...`,左侧/右侧弹出提示层显示全部信息,`show-overflow` 开启时的缺省提示 -* `title`:和原生标签的 `title` 属性一致 -* `ellipsis`:内容超出部分显示 `...`,没有提示 -::: - - - -
diff --git a/example/src/docs/zh-CN/grid/tip/overflow-tip.md b/example/src/docs/zh-CN/grid/tip/overflow-tip.md deleted file mode 100644 index 36be1063b..000000000 --- a/example/src/docs/zh-CN/grid/tip/overflow-tip.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - - - -
diff --git a/example/src/docs/zh-CN/grid/toolbar/copy-row-data.md b/example/src/docs/zh-CN/grid/toolbar/copy-row-data.md deleted file mode 100644 index 2cebaa507..000000000 --- a/example/src/docs/zh-CN/grid/toolbar/copy-row-data.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -工具栏配置步骤: -1、表格以插槽方式引入表格工具栏组件 `GridToolbar`,并设置工具栏组件属性 `slot="toolbar"` 。 -2、设置工具栏组件属性 `buttons` 进行按钮组相关配置。 -3、表格事件设置 `@toolbar-button-click` 获取工具栏 `buttons` 的事件,用户可自定义实现复制行操作的业务逻辑。 -* `size` 属性设置工具栏尺寸大小。 - - - -
diff --git a/example/src/docs/zh-CN/grid/toolbar/custom-toolbar.md b/example/src/docs/zh-CN/grid/toolbar/custom-toolbar.md deleted file mode 100644 index 98a1a1538..000000000 --- a/example/src/docs/zh-CN/grid/toolbar/custom-toolbar.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -工具栏配置步骤: -1、表格以插槽方式引入表格工具栏组件 `GridToolbar`,并设置工具栏组件插槽 `#toolbar` 。 -2、通过工具栏组件的插槽 `#buttons` 自定义内容。 - - - -
diff --git a/example/src/docs/zh-CN/grid/toolbar/grid-full-screen.md b/example/src/docs/zh-CN/grid/toolbar/grid-full-screen.md deleted file mode 100644 index 385707f83..000000000 --- a/example/src/docs/zh-CN/grid/toolbar/grid-full-screen.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 - -
- -### 基本用法 - -工具栏配置步骤: -1、表格以插槽方式引入表格工具栏组件 `GridToolbar`,并设置工具栏组件属性 `slot="toolbar"` 。 -2、设置工具栏组件属性 `full-screen` 开启表格全屏功能。 - - - -
- -### 全屏时改变表格高度 - - - -
diff --git a/example/src/docs/zh-CN/grid/toolbar/import-and-export.md b/example/src/docs/zh-CN/grid/toolbar/import-and-export.md deleted file mode 100644 index bbcb88ced..000000000 --- a/example/src/docs/zh-CN/grid/toolbar/import-and-export.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -工具栏配置步骤: -1、表格以插槽方式引入表格工具栏组件 `GridToolbar`,并设置工具栏组件属性 `slot="toolbar"` 。 -2、设置工具栏组件属性 `full-screen` 开启表格全屏功能。 - - - -
diff --git a/example/src/docs/zh-CN/grid/toolbar/insert-delete-update.md b/example/src/docs/zh-CN/grid/toolbar/insert-delete-update.md deleted file mode 100644 index d0c0c8f67..000000000 --- a/example/src/docs/zh-CN/grid/toolbar/insert-delete-update.md +++ /dev/null @@ -1,53 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 - -
- -### 基本用法 - -工具栏配置步骤: -1、表格以插槽方式引入表格工具栏组件 `GridToolbar`,并设置工具栏组件属性 `slot="toolbar"` 。 -2、设置工具栏组件属性 `buttons` 进行按钮组相关配置。 -3、表格事件设置 `@toolbar-button-click` 获取工具栏 `buttons` 的事件,用户可自定义实现增删改操作的业务逻辑。 - -:::tip 新增的行需要标记新增状态的样式时需要配置 edit-config 的 markInsert 项为 true -::: - - - -
- -### 取消删除 - -在工具栏中配置 `mark_cancel` 的 code,勾选数据后,单击 `删除/取消删除` 按钮,勾选的数据将标记删除线。再单击 `保存` 按钮请求服务删除标记的数据。已标记删除线的数据勾选后再次单击 `删除/取消删除` 按钮,会取消删除线。 - -:::warning 需要配置 fetch-data 请求服务时才有标记删除线和取消删除线的效果 -::: - - - -
- -### 清空数据 - -clearData 方法手动清空单元格内容,如果不传参数,则清空整个表格内容。如果传了行则清空指定行内容,如果传了指定字段,则清空该字段内容。具体参考下面示例。 - - - -
- -### 指定行插入数据和删除指定行 - -通过 `insertAt(records, row)` 方法可以在指定行插入一行或多行数据。`remove(rows)` 方法可以删除指定一行或多行数据,rows 为对象则是一行,数组则是多行数据,为空则删除所有数据。 - - - -
diff --git a/example/src/docs/zh-CN/grid/toolbar/refresh-grid.md b/example/src/docs/zh-CN/grid/toolbar/refresh-grid.md deleted file mode 100644 index 4037b3d59..000000000 --- a/example/src/docs/zh-CN/grid/toolbar/refresh-grid.md +++ /dev/null @@ -1,24 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -工具栏配置步骤: -1、表格以插槽方式引入表格工具栏组件 `GridToolbar`,并设置工具栏组件属性 `slot="toolbar"` 。 -2、设置工具栏组件属性 `refresh` 开启表格刷新功能。 -* 设置工具栏属性 `loading` 开启/关闭加载中。 - -自定义实现刷新时直接调用`handleFetch('reload')` - - - -
diff --git a/example/src/docs/zh-CN/grid/toolbar/save-data.md b/example/src/docs/zh-CN/grid/toolbar/save-data.md deleted file mode 100644 index 4b57ac1d7..000000000 --- a/example/src/docs/zh-CN/grid/toolbar/save-data.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -通过表格属性 `save-data` 服务端数据保存方法。 -通过表格属性 `delete-data` 服务端数据删除方法。 - - - -
diff --git a/example/src/docs/zh-CN/grid/toolbar/search-whole-grid.md b/example/src/docs/zh-CN/grid/toolbar/search-whole-grid.md deleted file mode 100644 index 441d029a1..000000000 --- a/example/src/docs/zh-CN/grid/toolbar/search-whole-grid.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - - - -
diff --git a/example/src/docs/zh-CN/grid/toolbar/toolbar-op-config.md b/example/src/docs/zh-CN/grid/toolbar/toolbar-op-config.md deleted file mode 100644 index ec88bb74f..000000000 --- a/example/src/docs/zh-CN/grid/toolbar/toolbar-op-config.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 配置式 - -TINY 3 版本通过 `v-bind` 绑定一个对象来实现配置式。在绑定的对象中 `toolbar` 字段用于工具栏配置,可配合 `events` 字段对工具栏中按钮进行 `toolbarButtonClick` 事件配置。另外,`pager` 字段用于分页配置,`fetchData` 字段用于请求服务。 - - - -
diff --git a/example/src/docs/zh-CN/grid/tree-grid/tree-grid-base-usage.md b/example/src/docs/zh-CN/grid/tree-grid/tree-grid-base-usage.md deleted file mode 100644 index f27f7b4ee..000000000 --- a/example/src/docs/zh-CN/grid/tree-grid/tree-grid-base-usage.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 有子级的数据结构 - -在 grid 标签上配置 tree-config="{children: 'children'}"以树的形式来展示数据,还需要在展示树节点的字段上配置 tree-node 属性 - - - -### 扁平化数据结构 - -注意:扁平化的数据结构需要调用 aggregateTableData 方法把数据转换成带有子级的数据才能正常的显示出树表的结构 - - - -
diff --git a/example/src/docs/zh-CN/grid/tree-grid/tree-grid-expand-config.md b/example/src/docs/zh-CN/grid/tree-grid/tree-grid-expand-config.md deleted file mode 100644 index 9e53d208e..000000000 --- a/example/src/docs/zh-CN/grid/tree-grid/tree-grid-expand-config.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -表格属性 `expand-config` 设置展开行配置项。 - - - -
diff --git a/example/src/docs/zh-CN/grid/tree-grid/tree-grid-expand.md b/example/src/docs/zh-CN/grid/tree-grid/tree-grid-expand.md deleted file mode 100644 index be647226c..000000000 --- a/example/src/docs/zh-CN/grid/tree-grid/tree-grid-expand.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## 树表 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 展开行 - -在 column 标签上配置 type="expand" 展开行,可以通过 v-slot 插槽插入需要的模板信息 - - - -### 检查树节点是否已展开 - -通过 `hasTreeExpand(row)` 方法可以检查树节点是否已展开,参数 row 为行数据对象。 - - - -
diff --git a/example/src/docs/zh-CN/grid/tree-grid/tree-grid-fixed-column.md b/example/src/docs/zh-CN/grid/tree-grid/tree-grid-fixed-column.md deleted file mode 100644 index 361f757ee..000000000 --- a/example/src/docs/zh-CN/grid/tree-grid/tree-grid-fixed-column.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## 树表 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 冻结列 - -在列的标签上可以通过配置 fixed="left" 属性把该列固定在左侧,配置 fixed="right" 属性把该列固定在右侧 - - - -
diff --git a/example/src/docs/zh-CN/grid/tree-grid/tree-grid-index.md b/example/src/docs/zh-CN/grid/tree-grid/tree-grid-index.md deleted file mode 100644 index 3bf829aaf..000000000 --- a/example/src/docs/zh-CN/grid/tree-grid/tree-grid-index.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## 树表 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 展开行序号列配置 - -在 `treeConfig` 属性里配置 `ordered` 为 `false` 展开行,序号列按父子级的结构排序。默认 `ordered` 属性为 `true` 展开行后序号列按序号排序。 - - diff --git a/example/src/docs/zh-CN/grid/tree-grid/tree-grid-insert-delete-update.md b/example/src/docs/zh-CN/grid/tree-grid/tree-grid-insert-delete-update.md deleted file mode 100644 index 23cb0e3ab..000000000 --- a/example/src/docs/zh-CN/grid/tree-grid/tree-grid-insert-delete-update.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## 树表 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 增删改 - -在 grid-toolbar 标签上配置 slot="toolbar" 插槽,配置相关的操作按钮 ,注意:新增数据需要在 grid 标签上配置 edit-config 编辑框的配置信息,并通过 ref 获取到组件实例调用方法进行相关操作,findTree、filterTree 是工具类里的查找和过滤方法。由于tree数据节构的特殊性,grid的`getInsertRecords`与`getRecordset`方法无法获取到新增数据,此类数据需要用户自行处理。 - - - -
diff --git a/example/src/docs/zh-CN/grid/tree-grid/tree-grid-keyboard-operation.md b/example/src/docs/zh-CN/grid/tree-grid/tree-grid-keyboard-operation.md deleted file mode 100644 index fafed5574..000000000 --- a/example/src/docs/zh-CN/grid/tree-grid/tree-grid-keyboard-operation.md +++ /dev/null @@ -1,24 +0,0 @@ -
-

- -

- -## 树表 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 键盘操作 - -键盘移动高亮行,设置斑马线属性 stripe 为 false,鼠标悬停高亮行 highlight-hover-row 为 false,高亮当前行 highlight-current-row ,并配置 keyboard-config={isArrow: true} 属性启用方向键功能 - -

| Arrow Up ↑ | 移动到高亮行的上一行

-

| Arrow Down ↓ | 移动到高亮行的下一行

-

| Enter | 展开节点,进入子节点

-

| Backspace | 关闭节点,返回到父节点

- - - -
diff --git a/example/src/docs/zh-CN/grid/tree-grid/tree-grid-operation-column.md b/example/src/docs/zh-CN/grid/tree-grid/tree-grid-operation-column.md deleted file mode 100644 index 0f042e08f..000000000 --- a/example/src/docs/zh-CN/grid/tree-grid/tree-grid-operation-column.md +++ /dev/null @@ -1,37 +0,0 @@ -
-

- -

- -## 树表 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 操作列 - -列通过配置 type="radio" 实现单选,配置 type="selection" 实现多选 - - - -### 手动展开所有树节点 - -`setAllTreeExpansion(checked)` 可设置所有树节点的展开与否。 - - - -### 手动展开指定树节点 - -`setTreeExpansion(rows, checked)` 可设置展开指定的树形节点,第二个参数设置这一行展开与否。 - - - -### 手动切换展开树形节点 - -`toggleTreeExpansion(row)` 可设置切换展开树形节点。 - - - -
diff --git a/example/src/docs/zh-CN/grid/validation/before-submit-validation.md b/example/src/docs/zh-CN/grid/validation/before-submit-validation.md deleted file mode 100644 index d164cdc81..000000000 --- a/example/src/docs/zh-CN/grid/validation/before-submit-validation.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### Grid-表格校验-提交前校验 - -grid 标签配置 edit-config 对象,并配置 edit-rules 对象来设置校验对象和校验规则,通过按钮点击事件调用 this.\$refs.basicGrid.validate()方法来触发表格校验,具体参考下面示例。 - - - -
- -### Grid-表格校验-触发校验时自动定位到当前校验的单元格 - -grid 编辑器引入 Tiny Vue 组件,标签配置 edit-config 对象,并配置 edit-rules 对象来设置校验对象和校验规则,通过按钮点击事件调用 this.\$refs.basicGrid.validate()方法来触发表格校验,具体参考下面示例。 - - - -
diff --git a/example/src/docs/zh-CN/grid/validation/editing-validation.md b/example/src/docs/zh-CN/grid/validation/editing-validation.md deleted file mode 100644 index 34c39642a..000000000 --- a/example/src/docs/zh-CN/grid/validation/editing-validation.md +++ /dev/null @@ -1,52 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### Grid-表格校验-编辑时校验 - -grid 标签配置 edit-config 对象,并配置 edit-rules 对象来设置校验对象和校验规则。具体参考下面示例。 - - - -
- -### Grid-表格校验-隐藏列编辑时校验 - -grid 标签配置 edit-config 对象且列配置type:visible 且配置isValidAlways属性时, 即列总是显示可编辑状态时,支持编辑时校验,并配置 edit-rules 对象来设置校验对象和校验规则。具体参考下面示例。 - - - -
- -### 自定义校验配置 - -配置 valid-config 对象来设置校验提示信息展示在表格内部。具体参考下面示例。 - - - -
- -### 数据关联校验 - -在自定义校验时,`validator`方法`rule`参数中可获取到当前行与列的信息。可以按业务的需求实现数据关联的校验逻辑 - - - -
- -### 自定义组件与插槽编辑器校验 - -在使用自定义组件时,组件需要实现`v-model`的功能。在使用插槽时想要实时校验需要手动触发组件的校验方法 - - - -
- diff --git a/example/src/docs/zh-CN/grid/validation/select-validation.md b/example/src/docs/zh-CN/grid/validation/select-validation.md deleted file mode 100644 index a45dec15f..000000000 --- a/example/src/docs/zh-CN/grid/validation/select-validation.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### Grid-表格校验-选中时校验 - -grid 标签配置 edit-config 对象,并配置 edit-rules 对象来设置校验对象和校验规则,通过按钮点击事件调用 this.$refs.basicGrid.validate()方法来触发表格校验,具体参考下面示例。 - - - -
diff --git a/example/src/docs/zh-CN/grid/validation/valide-tipconfig.md b/example/src/docs/zh-CN/grid/validation/valide-tipconfig.md deleted file mode 100644 index 1d78f3328..000000000 --- a/example/src/docs/zh-CN/grid/validation/valide-tipconfig.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### Grid-表格校验-选中时校验 - -表格默认错误提示显示在 `body` 上, 可以通过设置 `tooltip-config` 的 `appendTobody` 设置为 `false` 来解决页面滚动时tip位置错误的问题。设置 `placement` 属性调整默认显示方向。`tooltip-config` 的配置可参参考 tooltip 组件 - - - -
diff --git a/example/src/docs/zh-CN/grid/width-height/adaptive-column-width.md b/example/src/docs/zh-CN/grid/width-height/adaptive-column-width.md deleted file mode 100644 index 35d8bb7d1..000000000 --- a/example/src/docs/zh-CN/grid/width-height/adaptive-column-width.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 列宽自适应撑开 - -表格属性设置 fit 自动撑开,默认值为 true 开启自适应撑开,值为 false 时必须设置列宽度,否则表格宽度由单元格内容撑开。 - - - -### 列宽不自适应撑开 - - - -
diff --git a/example/src/docs/zh-CN/grid/width-height/adaptive-grid-width-height.md b/example/src/docs/zh-CN/grid/width-height/adaptive-grid-width-height.md deleted file mode 100644 index e2f8fb225..000000000 --- a/example/src/docs/zh-CN/grid/width-height/adaptive-grid-width-height.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 开启响应式表格宽高 - -表格属性设置 autoResize 属性开启响应式表格宽高,默认开启。 - - - -### 关闭响应式表格宽高 - - - -
diff --git a/example/src/docs/zh-CN/grid/width-height/auto-height.md b/example/src/docs/zh-CN/grid/width-height/auto-height.md deleted file mode 100644 index 871ea925c..000000000 --- a/example/src/docs/zh-CN/grid/width-height/auto-height.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 开启响应式表格宽高 - -表格属性设置 autoResize 属性开启响应式表格宽高的同时,将高度`heigh`设置为`auto`就可以自动跟随父容器高度。 - - - - diff --git a/example/src/docs/zh-CN/grid/width-height/column-min-width.md b/example/src/docs/zh-CN/grid/width-height/column-min-width.md deleted file mode 100644 index c0869d219..000000000 --- a/example/src/docs/zh-CN/grid/width-height/column-min-width.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -通过属性 `column-min-width` 设置总体列可以调整到的最小宽度,不设置时默认为列头 span 的宽度 + 36(头部固定宽度)。 - -
- - - -
diff --git a/example/src/docs/zh-CN/grid/width-height/column-width.md b/example/src/docs/zh-CN/grid/width-height/column-width.md deleted file mode 100644 index 7675cf46e..000000000 --- a/example/src/docs/zh-CN/grid/width-height/column-width.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -通过属性 `column-width` 设置所有列宽度,默认值为均匀分配。 - -
- - - -
diff --git a/example/src/docs/zh-CN/grid/width-height/fixed-column-width.md b/example/src/docs/zh-CN/grid/width-height/fixed-column-width.md deleted file mode 100644 index 1fc9d8958..000000000 --- a/example/src/docs/zh-CN/grid/width-height/fixed-column-width.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -表格列属性设置 width 固定宽度,支持数值和百分比。 - - - -
diff --git a/example/src/docs/zh-CN/grid/width-height/fixed-grid-height.md b/example/src/docs/zh-CN/grid/width-height/fixed-grid-height.md deleted file mode 100644 index 043e9d46c..000000000 --- a/example/src/docs/zh-CN/grid/width-height/fixed-grid-height.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -表格属性设置 height 固定表格高度。 - - - -
diff --git a/example/src/docs/zh-CN/grid/width-height/max-min-grid-height.md b/example/src/docs/zh-CN/grid/width-height/max-min-grid-height.md deleted file mode 100644 index e76fa4ee1..000000000 --- a/example/src/docs/zh-CN/grid/width-height/max-min-grid-height.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 设置 minHeight 最小高度 - -表格属性设置 minHeight 限制最小高度,maxHeight 限制最大高度。 - - - -### 设置 maxHeight 最大高度 - - - -
diff --git a/example/src/docs/zh-CN/grid/width-height/min-width.md b/example/src/docs/zh-CN/grid/width-height/min-width.md deleted file mode 100644 index f5674aecf..000000000 --- a/example/src/docs/zh-CN/grid/width-height/min-width.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -通过表格列属性 `min-width` 本列最小宽度;会自动将剩余空间按比例分配。 - -
- - - -
diff --git a/example/src/docs/zh-CN/grid/width-height/recalculate.md b/example/src/docs/zh-CN/grid/width-height/recalculate.md deleted file mode 100644 index c8d9695eb..000000000 --- a/example/src/docs/zh-CN/grid/width-height/recalculate.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 重新计算表格 - -通过 `recalculate()` 方法可以重新计算表格,当父容器宽度变化时可通过该方法重新计算表格。 - - - -
diff --git a/example/src/docs/zh-CN/grid/width-height/resize-column-width.md b/example/src/docs/zh-CN/grid/width-height/resize-column-width.md deleted file mode 100644 index eea1307ee..000000000 --- a/example/src/docs/zh-CN/grid/width-height/resize-column-width.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Grid 表格 - - - -表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。 -
- -### 基本用法 - -表格属性设置 resizable 开启列宽拖拽。 - - - -
diff --git a/example/src/docs/zh-CN/hrapprover/basic-usage.md b/example/src/docs/zh-CN/hrapprover/basic-usage.md deleted file mode 100644 index 8c188cd6e..000000000 --- a/example/src/docs/zh-CN/hrapprover/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Hrapprover 权签人 - - - -权签人业务组件用于根据部门查询权签人。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/hrapprover/category-type.md b/example/src/docs/zh-CN/hrapprover/category-type.md deleted file mode 100644 index 8d111e07b..000000000 --- a/example/src/docs/zh-CN/hrapprover/category-type.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Hrapprover 权签人 - - - -权签人业务组件用于根据部门查询权签人。 -
- -### 权签类别 - -可通过 `category` 设置权签类别,默认值是 `0303`,发送权签人请求的category参数。 - - - -
diff --git a/example/src/docs/zh-CN/hrapprover/custom-service.md b/example/src/docs/zh-CN/hrapprover/custom-service.md deleted file mode 100644 index 38841e1e8..000000000 --- a/example/src/docs/zh-CN/hrapprover/custom-service.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Hrapprover 权签人 - - - -权签人业务组件用于根据部门查询权签人。 -
- -### 自定义服务 - -通过 fetch-hrapprover 属性可以指定一个方法,在方法中可实现请求自定义的服务。 - - - -
diff --git a/example/src/docs/zh-CN/hrapprover/disabled-value-hrapprover.md b/example/src/docs/zh-CN/hrapprover/disabled-value-hrapprover.md deleted file mode 100644 index 18da89f70..000000000 --- a/example/src/docs/zh-CN/hrapprover/disabled-value-hrapprover.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Hrapprover 权签人 - - - -权签人业务组件用于根据部门查询权签人。 -
- -### 禁用 - -通过 `value` 设置权签人的值。 通过 `disabled` 设置组件是否禁用,默认值为 false。 - - - -
diff --git a/example/src/docs/zh-CN/icon.md b/example/src/docs/zh-CN/icon.md deleted file mode 100644 index acf1935a1..000000000 --- a/example/src/docs/zh-CN/icon.md +++ /dev/null @@ -1,29 +0,0 @@ -
-

- -

- -## Icon 图标 - - - -提供了一套常用的图标集合,直接通过设置类名为 `icon-iconName` 来使用。 -
- -### 基本用法 - - - -### 显示 Title - -通过在 Icon 的父级元素上增加 `title` 属性来实现给 Icon 图标增加 Title 的功能。 - - - -### 图标集合 - - - -
- - diff --git a/example/src/docs/zh-CN/image/auto-fit-container-size.md b/example/src/docs/zh-CN/image/auto-fit-container-size.md deleted file mode 100644 index 2238a5a60..000000000 --- a/example/src/docs/zh-CN/image/auto-fit-container-size.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Image 图片预览 - - - -图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。 - -
-
- -### 自适应容器尺寸 - -可通过 `fit` 属性确定图片如何适应到容器框,同原生 css 的 object-fit 属性。 - -:::tip object-fit 说明 -fill:被替换的内容将被缩放,以在填充元素的内容框时保持其宽高比 -contain:被替换的内容大小可以填充元素的内容框 -cover:被替换的内容大小保持其宽高比,同时填充元素的整个内容框 -none:被替换的内容尺寸不会被改变 -scale-down:内容的尺寸就像是指定了none 或 contain,取决于哪一个将导致更小的对象尺寸。 -::: - - diff --git a/example/src/docs/zh-CN/image/basic-usage.md b/example/src/docs/zh-CN/image/basic-usage.md deleted file mode 100644 index 3058e1d17..000000000 --- a/example/src/docs/zh-CN/image/basic-usage.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Image 图片预览 - - - -图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。 - -
-
- -### 基本用法 - -通过 `src` 设置预览的图片路径。 - - - -
- - diff --git a/example/src/docs/zh-CN/image/custom-load-failed-text.md b/example/src/docs/zh-CN/image/custom-load-failed-text.md deleted file mode 100644 index d817a9964..000000000 --- a/example/src/docs/zh-CN/image/custom-load-failed-text.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Image 图片预览 - - - -图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。 - -
-
- -### 加载失败 - -可通过 `slot = error` 自定义加载失败内容。 - - diff --git a/example/src/docs/zh-CN/image/custom-placeholder.md b/example/src/docs/zh-CN/image/custom-placeholder.md deleted file mode 100644 index 78ac06faa..000000000 --- a/example/src/docs/zh-CN/image/custom-placeholder.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Image 图片预览 - - - -图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。 - -
-
- -### 占位内容 - -可通过 `slot = placeholder` 自定义占位内容。 - - diff --git a/example/src/docs/zh-CN/image/lazy-load.md b/example/src/docs/zh-CN/image/lazy-load.md deleted file mode 100644 index d4106a814..000000000 --- a/example/src/docs/zh-CN/image/lazy-load.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Image 图片预览 - - - -图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。 - -
-
- -### 懒加载 - -可通过 `lazy` 开启懒加载功能,当图片滚动到可视范围内才会加载。可通过 `scroll-container` 来设置滚动容器,若未定义,则为最近一个 `overflow` 值为 `auto` 或 `scroll` 的父元素。 - -:::tip 提示 -lazy 懒加载的图片必须是远程的图片,不支持静态图片懒加载。 -::: - - diff --git a/example/src/docs/zh-CN/image/load-event.md b/example/src/docs/zh-CN/image/load-event.md deleted file mode 100644 index e6a4874fc..000000000 --- a/example/src/docs/zh-CN/image/load-event.md +++ /dev/null @@ -1,29 +0,0 @@ -
-

- -

- -## Image 图片预览 - - - -图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。 - -
-
- -### 加载成功事件 - -图片加载成功触发 `load` 事件。 - - - -
- -### 加载失败事件 - -图片加载失败触发 `error` 事件。 - - - -
diff --git a/example/src/docs/zh-CN/image/preview-in-dialog.md b/example/src/docs/zh-CN/image/preview-in-dialog.md deleted file mode 100644 index 15e2ace9f..000000000 --- a/example/src/docs/zh-CN/image/preview-in-dialog.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Image 图片预览 - - - -图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。 - -
-
- -### 对话框中预览图片 - -在 `dialog-box` 元素中嵌入 `image` 进行图片预览。 - - - -
diff --git a/example/src/docs/zh-CN/image/preview-src-list.md b/example/src/docs/zh-CN/image/preview-src-list.md deleted file mode 100644 index 7f0db8b05..000000000 --- a/example/src/docs/zh-CN/image/preview-src-list.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Image 图片预览 - - - -图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。 - -
-
- -### 预览大图 - -通过 `preview-src-list` 开启预览大图的功能。 - - - -
diff --git a/example/src/docs/zh-CN/image/preview-z-index.md b/example/src/docs/zh-CN/image/preview-z-index.md deleted file mode 100644 index e211b891e..000000000 --- a/example/src/docs/zh-CN/image/preview-z-index.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Image 图片预览 - - - -图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。 - -
-
- -### 图片预览层级 - -可通过 `z-index` 设置预览图片的层级。 - - diff --git a/example/src/docs/zh-CN/input/autofocus.md b/example/src/docs/zh-CN/input/autofocus.md deleted file mode 100644 index d52878647..000000000 --- a/example/src/docs/zh-CN/input/autofocus.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 - -
- -### 自动获取焦点 - -可通过 `autofocus` 属性设置自动获取焦点。`autofocus` 是原生属性。 - - - -
- -### 自动补全 - -可通过 `autocomplete` 属性设置自动补全,默认值为 off ,可选 on 。 - - - -
diff --git a/example/src/docs/zh-CN/input/autosize-textarea.md b/example/src/docs/zh-CN/input/autosize-textarea.md deleted file mode 100644 index e3ad81164..000000000 --- a/example/src/docs/zh-CN/input/autosize-textarea.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 - -
- -### 可自适应文本高度的文本域 - -可通过 `autosize` 属性设置文本域自适应内容高度。可传入对象,如`{ minRows: 2, maxRows: 6 }`。注意:只对 `type="textarea"` 有效。 - - - -
- -### 输入框的 tabindex - -可通过 `tabindex` 属性设置输入框的 tabindex - - - -
diff --git a/example/src/docs/zh-CN/input/basic-usage.md b/example/src/docs/zh-CN/input/basic-usage.md deleted file mode 100644 index 10cd43d34..000000000 --- a/example/src/docs/zh-CN/input/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/input/clearable.md b/example/src/docs/zh-CN/input/clearable.md deleted file mode 100644 index eb24b6231..000000000 --- a/example/src/docs/zh-CN/input/clearable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 -
- -### 可清空 - -可通过 `clearable` 属性设置输入框显示清空图标按钮。 - - - -
diff --git a/example/src/docs/zh-CN/input/complicated-input.md b/example/src/docs/zh-CN/input/complicated-input.md deleted file mode 100644 index 68c045f25..000000000 --- a/example/src/docs/zh-CN/input/complicated-input.md +++ /dev/null @@ -1,44 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 - -
- -### 前置内容 - -配置 `prepend` slot,设置输入框前置内容,注意:只对 `type="text"` 有效。 - - - -
- -### 后置内容 - -配置 `append` slot,设置输入框后置内容,注意:只对 `type="text"` 有效。 - - - -
- -### 头部内容 - -配置 `prefix` slot,设置输入框头部内容,注意:只对 `type="text"` 有效。 - - - -
- -### 尾部内容 - -配置 `suffix` slot,设置输入框尾部内容,注意:只对 `type="text"` 有效。 - - - -
diff --git a/example/src/docs/zh-CN/input/counter.md b/example/src/docs/zh-CN/input/counter.md deleted file mode 100644 index 2aba2c5b1..000000000 --- a/example/src/docs/zh-CN/input/counter.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 -
- -### 计数器 - -可通过 `counter` 属性设置显示输入框字符计数器。 - - - -
diff --git a/example/src/docs/zh-CN/input/custom-prefix-suffix-icon.md b/example/src/docs/zh-CN/input/custom-prefix-suffix-icon.md deleted file mode 100644 index 25f2f0163..000000000 --- a/example/src/docs/zh-CN/input/custom-prefix-suffix-icon.md +++ /dev/null @@ -1,43 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 -
- -### 头部图标 - -可通过 `prefix-icon` 属性设置输入框头部图标。 - - - -
- -### 尾部图标 - -可通过 `suffix-icon` 属性设置输入框尾部图标。 - - - -
- -### 可通过 slot="prefix" 设置头部图标 - -可通过 `slot="prefix"` 设置输入框头部图标。 - - - -
- -### 可通过 slot="suffix" 设置尾部图标 - -可通过 `slot="suffix"` 设置输入框尾部图标。 - - - -
diff --git a/example/src/docs/zh-CN/input/disabled-readonly.md b/example/src/docs/zh-CN/input/disabled-readonly.md deleted file mode 100644 index 23fafad81..000000000 --- a/example/src/docs/zh-CN/input/disabled-readonly.md +++ /dev/null @@ -1,33 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 -
- -### 禁用 - -可通过 `disabled` 属性设置禁用输入框。`disabled` 是原生属性。 - - - -
- -### 只读 - -可通过 `readonly` 属性设置输入框只读。`readonly` 是原生属性。 - - - -
- -:::warning 配置`readonly`属性后,在IE下输入框仍然有光标闪烁问题 -配置 `readonly` 属性后,在IE下输入框仍然有光标闪烁问题,可在输入框配置`unselectable="on"`解决,但存在如下缺陷,请根据需求慎重修改。 -在IE浏览器下屏蔽了input的blur事件,若用到blur事件,请用click事件来代替。 -::: - diff --git a/example/src/docs/zh-CN/input/input-events.md b/example/src/docs/zh-CN/input/input-events.md deleted file mode 100644 index 4deb3a144..000000000 --- a/example/src/docs/zh-CN/input/input-events.md +++ /dev/null @@ -1,43 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 -
- -### 失焦事件 - -输入框失去焦点时触发 `blur` 事件。 - - - -
- -### 值改变事件 - -输入框值改变时触发 `change` 事件。 - - - -
- -### 清除事件 - -点击输入框清除按钮时触发 `clear` 事件。 - - - -
- -### 聚焦事件 - -输入框获取焦点时触发 `focus` 事件。 - - - -
diff --git a/example/src/docs/zh-CN/input/input-methods.md b/example/src/docs/zh-CN/input/input-methods.md deleted file mode 100644 index 799f3b9d0..000000000 --- a/example/src/docs/zh-CN/input/input-methods.md +++ /dev/null @@ -1,35 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 -
- -### 记忆历史输入 - - - -
- -### 失去焦点 - - - -
- -### 获取焦点 - - - -
- -### 选中输入框文本 - - - -
diff --git a/example/src/docs/zh-CN/input/input-size.md b/example/src/docs/zh-CN/input/input-size.md deleted file mode 100644 index a5fe7c3ac..000000000 --- a/example/src/docs/zh-CN/input/input-size.md +++ /dev/null @@ -1,44 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 - -
- -### 尺寸 - -可通过 `size` 属性设置尺寸大小,可选值:`medium / small / mini`。注意:只在 `type!="textarea"` 时有效。 - - - -
- -### form - -可通过 `form` 属性设置原生属性 form 。 - - - -
- -### name - -可通过 `name` 原生属性。 - - - -
- -### 输入框关联文字 - -可通过 `label` 属性设置输入框关联的 label 文字。 - - - -
diff --git a/example/src/docs/zh-CN/input/max-min-length.md b/example/src/docs/zh-CN/input/max-min-length.md deleted file mode 100644 index 80b21fc84..000000000 --- a/example/src/docs/zh-CN/input/max-min-length.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 - -
- -### 最大输入长度 - -可通过 `maxlength` 属性设置输入框最大输入长度。`maxlength` 是原生属性。 - - - -
- -### 输入字数统计 - -可通过 `show-word-limit` 属性设置是否显示输入字数统计,只在 type = "text" 或 type = "textarea" 时有效 - - - -
diff --git a/example/src/docs/zh-CN/input/max-min.md b/example/src/docs/zh-CN/input/max-min.md deleted file mode 100644 index 8845f07d6..000000000 --- a/example/src/docs/zh-CN/input/max-min.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 -
- -### 最大值 - -可通过 `max` 属性设置输入框最大值。`max` 是原生属性。 - - - -
- -### 最小值 - -可通过 `min` 属性设置输入框最小值。`min` 是原生属性。 - - - -
diff --git a/example/src/docs/zh-CN/input/placeholder.md b/example/src/docs/zh-CN/input/placeholder.md deleted file mode 100644 index fcab29f66..000000000 --- a/example/src/docs/zh-CN/input/placeholder.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 -
- -### 占位文本 - -可通过 `placeholder` 属性设置自定义输入框的占位文本内容。`placeholder` 是原生属性。 - - - -
diff --git a/example/src/docs/zh-CN/input/resize-textarea.md b/example/src/docs/zh-CN/input/resize-textarea.md deleted file mode 100644 index 0a993044c..000000000 --- a/example/src/docs/zh-CN/input/resize-textarea.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 -
- -### 可缩放文本域 - -可通过 `resize` 属性设置文本域的缩放。可选值:`none / both / horizontal / vertical`。注意:只在 `type="textarea"` 时有效。 - - - -
diff --git a/example/src/docs/zh-CN/input/show-password.md b/example/src/docs/zh-CN/input/show-password.md deleted file mode 100644 index ee5887da9..000000000 --- a/example/src/docs/zh-CN/input/show-password.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 - -
- -### 密码显示 - -当 `type` 为 `password` 时,可通过 `show-password` 属性设置输入框显示密码显示/隐藏切换图标按钮。 - - - -
- -### type 属性 - -通对应的 type 属性,可以设置为对应的类型。默认为 text,可选值为 text,textarea 和其他 原生 input 的 type 值 - - - -
diff --git a/example/src/docs/zh-CN/input/step.md b/example/src/docs/zh-CN/input/step.md deleted file mode 100644 index ced7815b5..000000000 --- a/example/src/docs/zh-CN/input/step.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 - -
- -### 输入字段的合法数字间隔 - -可通过 `step` 属性设置输入字段的合法数字间隔。`step` 是原生属性。 - - - -
diff --git a/example/src/docs/zh-CN/input/textarea-limit-rows.md b/example/src/docs/zh-CN/input/textarea-limit-rows.md deleted file mode 100644 index 9e072912d..000000000 --- a/example/src/docs/zh-CN/input/textarea-limit-rows.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 - -
- -### 文本域行数 - -可通过 `rows` 属性设置文本域显示行数。注意:只在 `text="textarea"` 时有效。 - - - -
- -### 文本域宽度 - -可通过 `cols` 属性设置文本域显示宽度。注意:只在 `text="textarea"` 时有效。 - - - -
diff --git a/example/src/docs/zh-CN/input/validate-event.md b/example/src/docs/zh-CN/input/validate-event.md deleted file mode 100644 index 79956b785..000000000 --- a/example/src/docs/zh-CN/input/validate-event.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Input 输入框 - - - -通过鼠标或键盘输入字符。 -
- -### 输入时触发表单校验 - -可通过 `validate-event` 属性设置输入时触发表单校验。通过 `trigger` 配置触发校验规则的方式,为 `change` 时,当输入框值改变即触发校验,为 `blur` 时则失焦后触发校验。 - - - -
diff --git a/example/src/docs/zh-CN/ip-address/basic-usage.md b/example/src/docs/zh-CN/ip-address/basic-usage.md deleted file mode 100644 index dd9dbbff6..000000000 --- a/example/src/docs/zh-CN/ip-address/basic-usage.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## IpAddress 输入框 - - - -IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致,同时提供数据绑定功能。 -
- -### 基本用法 - -可通过 `value` 设置默认值,`type` 配置 `IPv4` 类型或是 `IPv6` 类型,默认是 `IPv4`。 - - - -
- - diff --git a/example/src/docs/zh-CN/ip-address/custom-delimiter.md b/example/src/docs/zh-CN/ip-address/custom-delimiter.md deleted file mode 100644 index 6bdf843c2..000000000 --- a/example/src/docs/zh-CN/ip-address/custom-delimiter.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## IpAddress 输入框 - - - -IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致,同时提供数据绑定功能。 -
- -### IPv4 类型 - -可通过 `delimiter` 属性设置分隔符(图标类)。 - - - -
- -### 默认插槽 - -可通过默认插槽设置分隔符。 - - - -
diff --git a/example/src/docs/zh-CN/ip-address/ipaddress-events.md b/example/src/docs/zh-CN/ip-address/ipaddress-events.md deleted file mode 100644 index 609ee4517..000000000 --- a/example/src/docs/zh-CN/ip-address/ipaddress-events.md +++ /dev/null @@ -1,43 +0,0 @@ -
-

- -

- -## IpAddress 输入框 - - - -IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致,同时提供数据绑定功能。 -
- -### focus 事件 - -文本框获取焦点时触发 `focus` 事件。 - - - -### blur 事件 - -文本框失去焦点时触发 `blur` 事件。 - - - -### input 事件 - -文本框内容输入时触发 `input` 事件。 - - - -### change 事件 - -文本框内容改变后触发 `change` 事件。 - - - -### select 事件 - -文本框内容选中时触发 `select` 事件。 - - - -
diff --git a/example/src/docs/zh-CN/ip-address/readonly.md b/example/src/docs/zh-CN/ip-address/readonly.md deleted file mode 100644 index bff7ee9ef..000000000 --- a/example/src/docs/zh-CN/ip-address/readonly.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## IpAddress 输入框 - - - -IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致,同时提供数据绑定功能。 - -
- -### 文本只读 - -通过 `readonly` 属性设置文本的只读行,默认为 false 。 - - - -
- -### 禁用 - -通过 `disabled` 属性设置文本是否禁用,默认为 false。 - - - -
diff --git a/example/src/docs/zh-CN/ip-address/size.md b/example/src/docs/zh-CN/ip-address/size.md deleted file mode 100644 index 4360226dd..000000000 --- a/example/src/docs/zh-CN/ip-address/size.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## IpAddress 输入框 - - - -IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致,同时提供数据绑定功能。 - -
- -### 输入框大小 - -可设置为`medium`,`small`,`mini` - - - -
diff --git a/example/src/docs/zh-CN/ip-address/type.md b/example/src/docs/zh-CN/ip-address/type.md deleted file mode 100644 index 24940905b..000000000 --- a/example/src/docs/zh-CN/ip-address/type.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## IpAddress 输入框 - - - -IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致,同时提供数据绑定功能。 -
- -### IPv4 类型 - -可通过 `type` 属性配置 `IPv4` 类型,默认是 `IPv4`。 - - - -
- -### IPv6 类型 - -可通过 `type`属性配置为 `IPv6` 类型,默认是 `IPv4`。 - - - -
diff --git a/example/src/docs/zh-CN/layout.md b/example/src/docs/zh-CN/layout.md deleted file mode 100644 index 9941952f3..000000000 --- a/example/src/docs/zh-CN/layout.md +++ /dev/null @@ -1,64 +0,0 @@ -
-

- -

- -## Layout 布局 - - - -采用栅格布局,可使布局方法变得非常简单与清晰。 - -
- -Tiny 采用 12 栅格系统,将屏幕区域划分 12 等份,通过使用栅格系统可轻松应对大多数页面布局。 -另提供两个布局组件 Row 与 Col,配合使用使排版布局更高效。 -
- -### 栅格布局 - -通过使用 `Row` , `Col` 组件的 `span` 属性实现栅格系统布局。 - - -
- -### 间隔 - -通过设置 `Row` 组件的 `gutter` 属性来指定子元素之间的间隔。 - - - -
- -### 对齐方式 - -通过设置 `flex` 属性为 `true` 来启用 flex 布局,并通过 `justify` 与 `align` 属性调整子元素的对齐方式。 - -:::tip 提示 -flex 布局存在 IE 兼容性问题,只能在 IE 10 以上运行。 -::: - - - -
- -### 排序 - -在启用 `flex` 布局时,可通过设置 `Row` 组件的 `order` 属性,给带 `no` 属性的 `col`排序。 - -:::tip 提示 -flex 布局存在 IE 兼容性问题,只能在 IE 10 以上运行。 -::: - - - -
- -### 偏移 - -通过设置 `Col` 组件的 `offset` 属性来指定分栏偏移的栏数。 - - -
- - diff --git a/example/src/docs/zh-CN/layout/col.md b/example/src/docs/zh-CN/layout/col.md deleted file mode 100644 index 3239d88d9..000000000 --- a/example/src/docs/zh-CN/layout/col.md +++ /dev/null @@ -1,61 +0,0 @@ -
-

- -

- -## Col 列配置 - - - -定义 Layout 的列配置信息。 -
- -### 基本用法 - - - -
- -### 偏移 - -通过设置 `Col` 组件的 `offset` 属性来指定分栏偏移的栏数。 - - - -
- -### 移动 - -通过设置 `Col` 组件的 `move` 属性来指定分栏偏移的栏数。 - - - -
- -### 排序 - -:::tip 提示 -flex 布局存在 IE 兼容性问题,只能在 IE 10 以上运行。 -::: - - - -
- -### 响应式布局 - -参照了 Bootstrap 的响应式设计,预设了五个响应尺寸:`xs`、`sm`、`md`、`lg` 和 `xl`。 - - - -
- -### 自定义元素标签 - -可选任意标签。 - - - -
- - diff --git a/example/src/docs/zh-CN/layout/row.md b/example/src/docs/zh-CN/layout/row.md deleted file mode 100644 index 433e831f3..000000000 --- a/example/src/docs/zh-CN/layout/row.md +++ /dev/null @@ -1,61 +0,0 @@ -
-

- -

- -## Row 行配置 - - - -定义 Layout 的行配置信息。 -
- -### 垂直排列方式 - -通过使用 `Row` 组件的 `align` 属性实现 flex 布局下的垂直排列方式。 - - - -
- -### 栅格间隔 - -通过使用 `Row` 组件的 `gutter` 属性实现栅格间隔。 - - - -
- -### 取消栅格默认间隔 - -组件的 `gutter` 属性未设置或者设置为0时,栅格默认有左右内边距10px,可以通过 `no-space` 取消栅格默认间隔。 - - - -
- -### 水平排列方式 - -通过使用 `Row` 组件的 `justify` 属性实现 flex 布局下的水平排列方式。 - - - -
- -### 排序方式 - -通过使用 `Row` 组件的 `order` 属性实现 flex 布局下排序方式。 - - - -
- -### 自定义元素标签 - -通过使用 `Row` 组件的 `tag` 属性实现自定义元素标签,可选任意标签。 - - - -
- - diff --git a/example/src/docs/zh-CN/link-menu/basic-usage.md b/example/src/docs/zh-CN/link-menu/basic-usage.md deleted file mode 100644 index d8304269f..000000000 --- a/example/src/docs/zh-CN/link-menu/basic-usage.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## LinkMenu 收藏夹菜单 - - - -LinkMenu 收藏夹形式的菜单,支持可配置菜单项。 - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/link-menu/custom-foot.md b/example/src/docs/zh-CN/link-menu/custom-foot.md deleted file mode 100644 index ec52a8c60..000000000 --- a/example/src/docs/zh-CN/link-menu/custom-foot.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## LinkMenu 收藏夹菜单 - - - -LinkMenu 收藏夹形式的菜单,支持可配置菜单项。 -
- -### 自定义菜单弹窗底部 - -通过 `foot` 插槽自定义菜单弹窗的底部内容。`sureNodevalue` 方法用于获取选中的菜单节点并关闭菜单弹窗,同时展示选中的菜单。`hideDialog` 方法用于关闭弹窗。插槽可结合这两个方法一起使用。 - - - -
diff --git a/example/src/docs/zh-CN/link-menu/custom-icon.md b/example/src/docs/zh-CN/link-menu/custom-icon.md deleted file mode 100644 index dea2ee566..000000000 --- a/example/src/docs/zh-CN/link-menu/custom-icon.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## LinkMenu 收藏夹菜单 - - - -LinkMenu 收藏夹形式的菜单,支持可配置菜单项。 - -
- -### 自定义折叠展开图标 - -通过 `icon` 属性自定义折叠展开图标。通过 `search-icon` 属性自定义搜索图标。 - - - -
- -### 菜单内容超长时省略显示 - -通过 `ellipsis` 属性设置菜单内容超长时省略显示。 - - - -
diff --git a/example/src/docs/zh-CN/link-menu/data-resource.md b/example/src/docs/zh-CN/link-menu/data-resource.md deleted file mode 100644 index 26ebc004e..000000000 --- a/example/src/docs/zh-CN/link-menu/data-resource.md +++ /dev/null @@ -1,36 +0,0 @@ -
-

- -

- -## LinkMenu 收藏夹菜单 - - - -LinkMenu 收藏夹形式的菜单,支持可配置菜单项。 - -
- -### 数据源 - -通过 `data` 属性设置菜单的数据源,同时在数据对象中可通过 `disabled` 设置该节点是否可被勾选。 - - - -
- -### 收藏菜单标题 - -通过 `title` 属性设置收藏夹菜单的标题 - - - -
- -### 菜单内容超长时换行显示 - -通过 `wrap` 属性设置收藏夹菜单的标题 - - - -
diff --git a/example/src/docs/zh-CN/link-menu/get-menu-data-sync.md b/example/src/docs/zh-CN/link-menu/get-menu-data-sync.md deleted file mode 100644 index 78732a01e..000000000 --- a/example/src/docs/zh-CN/link-menu/get-menu-data-sync.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## LinkMenu 收藏夹菜单 - - - -LinkMenu 收藏夹形式的菜单,支持可配置菜单项。 -
- -### 自定义菜单弹窗底部 - -通过 `get-menu-data-sync` 自定义菜单数据服务。 - - - -
diff --git a/example/src/docs/zh-CN/link-menu/menu-items.md b/example/src/docs/zh-CN/link-menu/menu-items.md deleted file mode 100644 index b33a486bd..000000000 --- a/example/src/docs/zh-CN/link-menu/menu-items.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## LinkMenu 收藏夹菜单 - - - -LinkMenu 收藏夹形式的菜单,支持可配置菜单项。 -
- -### 可收藏栏目数 - -通过 `max-item` 属性指定可勾选并收藏的栏目数。指定 `default-expand-all` 为 false 时,打开菜单弹窗时所有节点为折叠状态。 - - - -
diff --git a/example/src/docs/zh-CN/link/basic-usage.md b/example/src/docs/zh-CN/link/basic-usage.md deleted file mode 100644 index 69c347fda..000000000 --- a/example/src/docs/zh-CN/link/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Link 文字链接 - - - -文字超链接。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/link/config-href.md b/example/src/docs/zh-CN/link/config-href.md deleted file mode 100644 index 05c72d68d..000000000 --- a/example/src/docs/zh-CN/link/config-href.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Link 文字链接 - - - -文字超链接。 -
- -### 链接地址 - -通过属性 `href` 指定链接需要跳转的地址,可配合原生属性 `target` 一起使用。 - - - -
diff --git a/example/src/docs/zh-CN/link/custom-icon.md b/example/src/docs/zh-CN/link/custom-icon.md deleted file mode 100644 index 2c433436d..000000000 --- a/example/src/docs/zh-CN/link/custom-icon.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Link 文字链接 - - - -文字超链接。 -
- -### 自定义图标 - -通过属性 `icon`、默认插槽、`icon` 插槽都可以自定义图标。 - - - -
diff --git a/example/src/docs/zh-CN/link/dynamic-disable.md b/example/src/docs/zh-CN/link/dynamic-disable.md deleted file mode 100644 index 61a82b879..000000000 --- a/example/src/docs/zh-CN/link/dynamic-disable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Link 文字链接 - - - -文字超链接。 -
- -### 基本用法 - -通过 `disabled` 属性可以指定是否禁用链接。 - - - -
diff --git a/example/src/docs/zh-CN/link/focus-no-underline.md b/example/src/docs/zh-CN/link/focus-no-underline.md deleted file mode 100644 index 3ff356608..000000000 --- a/example/src/docs/zh-CN/link/focus-no-underline.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Link 文字链接 - - - -文字超链接。 -
- -### 聚焦时不显示下划线 - -鼠标悬停在链接上时,默认会显示下划线,设置 `underline` 为 false 后聚焦时不显示下划线。 - - - -
diff --git a/example/src/docs/zh-CN/link/link-style.md b/example/src/docs/zh-CN/link/link-style.md deleted file mode 100644 index 102bc0461..000000000 --- a/example/src/docs/zh-CN/link/link-style.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Link 文字链接 - - - -文字超链接。 -
- -### 主题样式 - -通过 `type` 属性设置链接的主题类型。 - - - -
diff --git a/example/src/docs/zh-CN/loading/basic-usage.md b/example/src/docs/zh-CN/loading/basic-usage.md deleted file mode 100644 index 77b324af6..000000000 --- a/example/src/docs/zh-CN/loading/basic-usage.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Loading 加载 - - - -加载数据时显示的动画效果。 - -
-
- -### 基本用法 - -通过静态方法 `Loading.service` 在指定 `target` 上设置加载。 - - - -
- - diff --git a/example/src/docs/zh-CN/loading/body-lock.md b/example/src/docs/zh-CN/loading/body-lock.md deleted file mode 100644 index 89afc3c27..000000000 --- a/example/src/docs/zh-CN/loading/body-lock.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Loading 加载 - - - -加载数据时显示的动画效果。 - -
-
- -### 修饰符 - - - -
diff --git a/example/src/docs/zh-CN/loading/custom-background.md b/example/src/docs/zh-CN/loading/custom-background.md deleted file mode 100644 index 477664ca3..000000000 --- a/example/src/docs/zh-CN/loading/custom-background.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Loading 加载 - - - -加载数据时显示的动画效果。 - -
-
- -### 自定义遮罩背景色 - -通过 `background` 自定义背景颜色和透明度。 - - - -
diff --git a/example/src/docs/zh-CN/loading/custom-class.md b/example/src/docs/zh-CN/loading/custom-class.md deleted file mode 100644 index 7bb7cd9bf..000000000 --- a/example/src/docs/zh-CN/loading/custom-class.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Loading 加载 - - - -加载数据时显示的动画效果。 - -
-
- -### 自定义样式 - -通过 `customClass` 指定类名进行样式修改。 - - - -
diff --git a/example/src/docs/zh-CN/loading/custom-loading-target.md b/example/src/docs/zh-CN/loading/custom-loading-target.md deleted file mode 100644 index 05bdf6270..000000000 --- a/example/src/docs/zh-CN/loading/custom-loading-target.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Loading 加载 - - - -加载数据时显示的动画效果。 - -
-
- -### 区域加载 - -通过 `target` 指定 Loading 需要覆盖的 DOM 节点。 - - - -
diff --git a/example/src/docs/zh-CN/loading/custom-spinner.md b/example/src/docs/zh-CN/loading/custom-spinner.md deleted file mode 100644 index fc2fc6bcd..000000000 --- a/example/src/docs/zh-CN/loading/custom-spinner.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Loading 加载 - - - -加载数据时显示的动画效果。 - -
-
- -### 自定义加载图标 - -通过 `spinner` 自定义加载图标。 - - - -
diff --git a/example/src/docs/zh-CN/loading/fullscreen-loading.md b/example/src/docs/zh-CN/loading/fullscreen-loading.md deleted file mode 100644 index f1c82d78d..000000000 --- a/example/src/docs/zh-CN/loading/fullscreen-loading.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Loading 加载 - - - -加载数据时显示的动画效果。 - -
-
- -### 全局加载 - -通过 `v-loading.lock.fullscreen` 指令方式或者服务方式进行全局加载,如需使用指令方式全局加载需要如下操作: -在 `Vue 2` 版本环境中添加 `Vue.use(Loading)` -在 `Vue 3` 版本环境中添加 `app.use(Loading)` - - - -
diff --git a/example/src/docs/zh-CN/loading/loading-tip-text.md b/example/src/docs/zh-CN/loading/loading-tip-text.md deleted file mode 100644 index 3f86f44b8..000000000 --- a/example/src/docs/zh-CN/loading/loading-tip-text.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Loading 加载 - - - -加载数据时显示的动画效果。 - -
-
- -### 自定义加载提示文本 - -通过 `text` 自定义加载文字的提示文本。 - - - -
diff --git a/example/src/docs/zh-CN/locales/basic-usage.md b/example/src/docs/zh-CN/locales/basic-usage.md deleted file mode 100644 index 3234d059d..000000000 --- a/example/src/docs/zh-CN/locales/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Locales 语言选择 - - - -Locales 语言选择组件,在有两种语言时会直接显示成语种,当语言数大于 2 时,将显示一个下拉列表。 -
- -### 基本用法 - -配置 `local` 属性后,不会自动调用服务,仅用做当前语言切换,不会刷新页面。 - - - - diff --git a/example/src/docs/zh-CN/locales/change-lang.md b/example/src/docs/zh-CN/locales/change-lang.md deleted file mode 100644 index 700d6ffb2..000000000 --- a/example/src/docs/zh-CN/locales/change-lang.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Locales 语言选择 - - - -Locales 语言选择组件,在有两种语言时会直接显示成语种,当语言数大于 2 时,将显示一个下拉列表。 -
- -### 语言切换 - -提供 `change-lang` 函数用于自定义语言切换的逻辑,不设置则使用内置的切换方法。 - - - -
diff --git a/example/src/docs/zh-CN/locales/custom-service.md b/example/src/docs/zh-CN/locales/custom-service.md deleted file mode 100644 index 9821d88d9..000000000 --- a/example/src/docs/zh-CN/locales/custom-service.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Locales 语言选择 - - - -Locales 语言选择组件,在有两种语言时会直接显示成语种,当语言数大于 2 时,将显示一个下拉列表。 -
- -### 自定义服务 - -`get-locale` 可用于自定义获取所有语言。`get-current-locale` 用于获取当前语言。`get-change-locale-url` 用于获取改变语言后的 URL,参数为切换后的语言。 - - - -
diff --git a/example/src/docs/zh-CN/logon-user/basic-usage.md b/example/src/docs/zh-CN/logon-user/basic-usage.md deleted file mode 100644 index 3e00ca605..000000000 --- a/example/src/docs/zh-CN/logon-user/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## LogonUser 登录用户 - - - -LogonUser 用于显示当前登录人的 显示名(displayName) 或 长工号(userCN)。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/logon-user/custom-service.md b/example/src/docs/zh-CN/logon-user/custom-service.md deleted file mode 100644 index 6ec712013..000000000 --- a/example/src/docs/zh-CN/logon-user/custom-service.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## LogonUser 登录用户 - - - -LogonUser 用于显示当前登录人的 显示名(displayName) 或 长工号(userCN)。 -
- -### 自定义服务 - -可通过 `service` 属性设置自定义服务。 - - - -
diff --git a/example/src/docs/zh-CN/logout/basic-usage.md b/example/src/docs/zh-CN/logout/basic-usage.md deleted file mode 100644 index c1c64cdbb..000000000 --- a/example/src/docs/zh-CN/logout/basic-usage.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Logout 注销 - - - -Logout 登录或退出链接。 -
- -### 基本用法 - - - - diff --git a/example/src/docs/zh-CN/logout/custom-service.md b/example/src/docs/zh-CN/logout/custom-service.md deleted file mode 100644 index 3d72907be..000000000 --- a/example/src/docs/zh-CN/logout/custom-service.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Logout 注销 - - - -Logout 登录或退出链接。 -
- -### 自定义服务 - -可通过 `service` 属性设置自定义服务。 - - - -
diff --git a/example/src/docs/zh-CN/logout/redirect-url.md b/example/src/docs/zh-CN/logout/redirect-url.md deleted file mode 100644 index 5381fd1d2..000000000 --- a/example/src/docs/zh-CN/logout/redirect-url.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Logout 注销 - - - -Logout 登录或退出链接。 -
- -### 自定义配置注销后跳转地址 - - diff --git a/example/src/docs/zh-CN/milestone/basic-usage.md b/example/src/docs/zh-CN/milestone/basic-usage.md deleted file mode 100644 index b163bef9a..000000000 --- a/example/src/docs/zh-CN/milestone/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Milestone - - - -里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/milestone/custom-bottom.md b/example/src/docs/zh-CN/milestone/custom-bottom.md deleted file mode 100644 index 691206251..000000000 --- a/example/src/docs/zh-CN/milestone/custom-bottom.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Milestone - - - -里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。 -
- -### 自定义节点下方内容 - -通过 `bottom` 作用域插槽可自定义节点下方的内容。 - - - -
diff --git a/example/src/docs/zh-CN/milestone/custom-flag.md b/example/src/docs/zh-CN/milestone/custom-flag.md deleted file mode 100644 index fb61846b1..000000000 --- a/example/src/docs/zh-CN/milestone/custom-flag.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Milestone - - - -里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。 -
- -### 自定义旗帜内容 - -通过 `flag` 作用域插槽可自定义节点旗帜的内容。 - - - -
diff --git a/example/src/docs/zh-CN/milestone/custom-icon-slot.md b/example/src/docs/zh-CN/milestone/custom-icon-slot.md deleted file mode 100644 index fae5380bf..000000000 --- a/example/src/docs/zh-CN/milestone/custom-icon-slot.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Milestone - - - -里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。 - -
- -### 自定义节点图标 - -通过 `icon` 作用域插槽可自定义图标。 - - - -
diff --git a/example/src/docs/zh-CN/milestone/custom-top.md b/example/src/docs/zh-CN/milestone/custom-top.md deleted file mode 100644 index a91157bea..000000000 --- a/example/src/docs/zh-CN/milestone/custom-top.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Milestone - - - -里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。 -
- -### 自定义节点上方内容 - -通过 `top` 作用域插槽可自定义节点上方的内容。 - - - -
diff --git a/example/src/docs/zh-CN/milestone/data-field-mapping.md b/example/src/docs/zh-CN/milestone/data-field-mapping.md deleted file mode 100644 index 39aca2c8a..000000000 --- a/example/src/docs/zh-CN/milestone/data-field-mapping.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Milestone - - - -里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。 -
- -### 数据字段映射 - -:::tip 数据字段映射属性说明 -`completed-field`:设置里程碑完成状态对应的取值,默认为 `completed` -`flag-content-field`:设置节点旗子数据中描述对应的字段名,默认为 `content` -`flag-field`:设置节点信息中旗子数据所在字段名,默认为 `flags` -`flag-name-field`:设置节点旗子数据中名称对应的字段名,默认为 `name` -`flag-status-field`:设置节点旗子数据中状态对应的字段名,默认为 `status` -`name-field`:设置节点信息中名称对应的字段名,默认为 `name` -`status-field`:设置数据状态对应的字段名,默认为 `status` -`time-field`:设置节点时间信息对应的字段名,默认为 `time` -::: - - - -
diff --git a/example/src/docs/zh-CN/milestone/data-source.md b/example/src/docs/zh-CN/milestone/data-source.md deleted file mode 100644 index 21a6e96be..000000000 --- a/example/src/docs/zh-CN/milestone/data-source.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Milestone - - - -里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。 -
- -### 数据源 - -通过 `data` 属性设置里程碑数据。 - - - -
diff --git a/example/src/docs/zh-CN/milestone/flag-before.md b/example/src/docs/zh-CN/milestone/flag-before.md deleted file mode 100644 index ca5c1e607..000000000 --- a/example/src/docs/zh-CN/milestone/flag-before.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Milestone - - - -里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。 -
- -### 旗帜数据来源前面节点 - -通过 `flag-before` 可设置里程碑上活动(即旗子)上的数据从前面还是后面节点上获取,默认为 `false` 取后面节点上的数据。 - - - -
diff --git a/example/src/docs/zh-CN/milestone/line-style.md b/example/src/docs/zh-CN/milestone/line-style.md deleted file mode 100644 index c3f7d3433..000000000 --- a/example/src/docs/zh-CN/milestone/line-style.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Milestone - - - -里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。 -
- -### 进度条颜色 - -通过 `line-style` 属性设置线条颜色。 - - - -
diff --git a/example/src/docs/zh-CN/milestone/milestone-events.md b/example/src/docs/zh-CN/milestone/milestone-events.md deleted file mode 100644 index a34d3633d..000000000 --- a/example/src/docs/zh-CN/milestone/milestone-events.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Milestone - - - -里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。 - -
- -### 事件 - -单击里程碑节点时触发 `click` 事件,参数(index:节点索引, node:节点数据信息)。单击里程碑旗帜时触发 `flag-click` 事件,参数(index:节点内旗子的索引, node:节点上旗子的数据信息)。 - - - -
diff --git a/example/src/docs/zh-CN/milestone/milestone-space.md b/example/src/docs/zh-CN/milestone/milestone-space.md deleted file mode 100644 index 526951d59..000000000 --- a/example/src/docs/zh-CN/milestone/milestone-space.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Milestone - - - -里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。 -
- -### 宽度 - -通过 `space` 属性设置步骤条的宽度。 - - - -
diff --git a/example/src/docs/zh-CN/milestone/milestones-status.md b/example/src/docs/zh-CN/milestone/milestones-status.md deleted file mode 100644 index dd9a63a9f..000000000 --- a/example/src/docs/zh-CN/milestone/milestones-status.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## Milestone - - - -里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。 -
- -### 状态与颜色对应关系 - -`milestones-status` 属性对象中,键对应 `data` 属性的数据中的 `status` 字段,然后控制不同状态与颜色的对应关系。 - - -
diff --git a/example/src/docs/zh-CN/milestone/show-number.md b/example/src/docs/zh-CN/milestone/show-number.md deleted file mode 100644 index 64d7eaa09..000000000 --- a/example/src/docs/zh-CN/milestone/show-number.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Milestone - - - -里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。 -
- -### 取消未完成状态序号显示 - -设置 `show-number` 为 false 后,里程碑未完成的节点上将不显示序号,默认为 true 。 - - - -
diff --git a/example/src/docs/zh-CN/milestone/solid-style.md b/example/src/docs/zh-CN/milestone/solid-style.md deleted file mode 100644 index 913845412..000000000 --- a/example/src/docs/zh-CN/milestone/solid-style.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Milestone - - - -里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。 -
- -### 已完成节点实心显示 - -通过设置 `solid` 属性为 true 可设置已经完成节点显示为实心,且光晕不透明,默认为 false 。 - - - -
diff --git a/example/src/docs/zh-CN/milestone/start-index.md b/example/src/docs/zh-CN/milestone/start-index.md deleted file mode 100644 index 0551e61e9..000000000 --- a/example/src/docs/zh-CN/milestone/start-index.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Milestone - - - -里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。 -
- -### 序号起始值 - -通过 `start` 属性设置里程碑节点的序号起始值,默认为 -1 。 - - - -
diff --git a/example/src/docs/zh-CN/modal/basic-usage.md b/example/src/docs/zh-CN/modal/basic-usage.md deleted file mode 100644 index 3cf51e8eb..000000000 --- a/example/src/docs/zh-CN/modal/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 基本用法 - -可通过 `Modal.alert` 方法设置弹出框,通过 `Modal.confirm` 方法设置确认弹出框。 - - - -
- - diff --git a/example/src/docs/zh-CN/modal/is-form-reset.md b/example/src/docs/zh-CN/modal/is-form-reset.md deleted file mode 100644 index b7a45e6a3..000000000 --- a/example/src/docs/zh-CN/modal/is-form-reset.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 模态框弹出表单 - -模态框弹出表单,关闭模态框的时候,默认重置表单,设置 `is-form-reset` 为false,则关闭模态框的时候不重置表单 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-duration.md b/example/src/docs/zh-CN/modal/modal-duration.md deleted file mode 100644 index 4c051b861..000000000 --- a/example/src/docs/zh-CN/modal/modal-duration.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 自动关闭延时 - -可通过 `duration` 属性设置自动关闭的延迟时间,只对 type=message 有效。 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-esc-closable.md b/example/src/docs/zh-CN/modal/modal-esc-closable.md deleted file mode 100644 index 4475d4554..000000000 --- a/example/src/docs/zh-CN/modal/modal-esc-closable.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 按 Esc 键关闭弹出框 - -可通过 `esc-closable` 属性设置是否允许按 Esc 键关闭窗口,默认为 `false`。 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-event.md b/example/src/docs/zh-CN/modal/modal-event.md deleted file mode 100644 index 8534d703a..000000000 --- a/example/src/docs/zh-CN/modal/modal-event.md +++ /dev/null @@ -1,57 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 取消按钮事件 - -点击取消按钮时触发 `cancel` 事件。 - - - -
- -### 关闭按钮事件 - -点击关闭按钮时会触发 `close` 事件。 - - - -
- -### 确定按钮事件 - -点击确定按钮时会触发 `confirm` 事件。 - - - -
- -### 窗口关闭事件 - -窗口关闭时会触发 `hide` 事件。 - - - -
- -### 窗口显示事件 - -在窗口显示时会触发 `show` 事件。 - - - -
- -### 窗口缩放事件 - -窗口缩放时会触发 `zoom` 事件。 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-fullscreen.md b/example/src/docs/zh-CN/modal/modal-fullscreen.md deleted file mode 100644 index 59fa4c69c..000000000 --- a/example/src/docs/zh-CN/modal/modal-fullscreen.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 最大化显示 - -可通过 `fullscreen` 属性设置是否最大化显示。 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-id.md b/example/src/docs/zh-CN/modal/modal-id.md deleted file mode 100644 index 309c27dbc..000000000 --- a/example/src/docs/zh-CN/modal/modal-id.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 防止重复提示 - -如果不想窗口重复点击,可以设置唯一的 `id` 防止重复提示,只对 type=message 有效。 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-is-form-reset.md b/example/src/docs/zh-CN/modal/modal-is-form-reset.md deleted file mode 100644 index 5144b07e0..000000000 --- a/example/src/docs/zh-CN/modal/modal-is-form-reset.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 自动关闭延时 - -Modal嵌套表单使用时,关闭弹窗时,重置表单数据.设置 `is-form-reset` 为 `false`,则关闭弹窗是不重置表单 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-lock-scroll.md b/example/src/docs/zh-CN/modal/modal-lock-scroll.md deleted file mode 100644 index e0e6a34bb..000000000 --- a/example/src/docs/zh-CN/modal/modal-lock-scroll.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 锁住滚动条 - -可通过 `lock-scroll` 属性设置是否锁住滚动条,不允许页面滚动。 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-lock-view.md b/example/src/docs/zh-CN/modal/modal-lock-view.md deleted file mode 100644 index 07e6b8647..000000000 --- a/example/src/docs/zh-CN/modal/modal-lock-view.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 锁住页面 - -可通过 `lock-view` 属性设置是否锁住页面,不允许窗口之外的任何操作。 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-mask-closable.md b/example/src/docs/zh-CN/modal/modal-mask-closable.md deleted file mode 100644 index 4b4308569..000000000 --- a/example/src/docs/zh-CN/modal/modal-mask-closable.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 点击遮罩层关闭窗口 - -可通过 `mask-closable` 属性设置是否允许点击遮罩层关闭窗口。 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-mask.md b/example/src/docs/zh-CN/modal/modal-mask.md deleted file mode 100644 index ca48f4f2b..000000000 --- a/example/src/docs/zh-CN/modal/modal-mask.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 显示遮罩层 - -可通过 `mask` 属性设置是否显示遮罩层,默认为 `true`。 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-message.md b/example/src/docs/zh-CN/modal/modal-message.md deleted file mode 100644 index 29d9e5118..000000000 --- a/example/src/docs/zh-CN/modal/modal-message.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 自定义内容 - -可通过 `message` 属性设置窗口的内容。 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-resize.md b/example/src/docs/zh-CN/modal/modal-resize.md deleted file mode 100644 index feb63cc3b..000000000 --- a/example/src/docs/zh-CN/modal/modal-resize.md +++ /dev/null @@ -1,34 +0,0 @@ -
-

- -

- -## Modal 模态框 - - - -
- -### 调整窗口大小 - -可通过和`width`和`height`设置窗口的宽高,而通过 `resize` 设置是否允许拖动调整窗口大小。 - - - -
- -### 调整窗口大小后窗口显示的最小宽度 - -配置 `resize` 可拖拽属性为 `true`后,可通过 `min-width` 属性设置拖拽后窗口的最小宽度。 - - - -
- -### 调整窗口大小后窗口显示的最小高度 - -配置 `resize` 可拖拽属性为 `true`后,可通过 `min-height` 属性设置拖拽后窗口的最小高度。 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-showFooter.md b/example/src/docs/zh-CN/modal/modal-showFooter.md deleted file mode 100644 index d8548fe39..000000000 --- a/example/src/docs/zh-CN/modal/modal-showFooter.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 不显示底部 - -可通过 `showFooter` 属性设置是否显示底部,默认为 `true`。 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-showHeader.md b/example/src/docs/zh-CN/modal/modal-showHeader.md deleted file mode 100644 index 23d08c601..000000000 --- a/example/src/docs/zh-CN/modal/modal-showHeader.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 不显示头部 - -可通过 `showHeader` 属性设置是否显示头部,默认为 `true`。 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-slots.md b/example/src/docs/zh-CN/modal/modal-slots.md deleted file mode 100644 index c55a447be..000000000 --- a/example/src/docs/zh-CN/modal/modal-slots.md +++ /dev/null @@ -1,34 +0,0 @@ -
-

- -

- -## Modal 模态框 - - - -
- -### 默认插槽 - -可通过 `templete` 设置默认插槽。 - - - -
- -### 底部插槽 - -可通过 `slot="footer"` 设置底部插槽。 - - - -
- -### 嵌套 grid - -可通过插槽嵌套 grid - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-status.md b/example/src/docs/zh-CN/modal/modal-status.md deleted file mode 100644 index 5c5baeb13..000000000 --- a/example/src/docs/zh-CN/modal/modal-status.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 消息状态 - -可通过 `status` 属性设置消息状态,可选值有 `info | success | warning | error | loading`。 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-title.md b/example/src/docs/zh-CN/modal/modal-title.md deleted file mode 100644 index 51721c642..000000000 --- a/example/src/docs/zh-CN/modal/modal-title.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 标题 - -可通过 `title` 属性设置窗口的标题。 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-top.md b/example/src/docs/zh-CN/modal/modal-top.md deleted file mode 100644 index d74164207..000000000 --- a/example/src/docs/zh-CN/modal/modal-top.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 距离顶部的位置 - -可通过 `top` 属性设置消息距离顶部的位置,只对 type=message 有效。 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-type.md b/example/src/docs/zh-CN/modal/modal-type.md deleted file mode 100644 index 88d17c24f..000000000 --- a/example/src/docs/zh-CN/modal/modal-type.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 窗口类型 - -可通过 `type` 属性设置窗口类型,可选值 `alert | confirm | message`。 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-value.md b/example/src/docs/zh-CN/modal/modal-value.md deleted file mode 100644 index 56890d4d0..000000000 --- a/example/src/docs/zh-CN/modal/modal-value.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 绑定值 - -可通过 `value/v-model` 属性绑定值。 - - - -
diff --git a/example/src/docs/zh-CN/modal/modal-zIndex.md b/example/src/docs/zh-CN/modal/modal-zIndex.md deleted file mode 100644 index d498b1a13..000000000 --- a/example/src/docs/zh-CN/modal/modal-zIndex.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Modal 模态框 - - -
- -### 自定义堆叠顺序 - -可通过 `zIndex` 属性设置自定义堆叠顺序(对于某些特殊场景,比如被遮挡时可能会用到)。 - - - -
diff --git a/example/src/docs/zh-CN/nav-menu/basic-usage.md b/example/src/docs/zh-CN/nav-menu/basic-usage.md deleted file mode 100644 index df384ff36..000000000 --- a/example/src/docs/zh-CN/nav-menu/basic-usage.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## NavMenu 导航菜单 - - - -NavMenu 导航菜单,主要用于定义页面顶部导航的菜单。 -
- -### 基本用法 - -通过 `data` 属性配置菜单数据,若不配置默认读取后台服务,比如 Jalor 6,读取 services/jalor/web/support/workspace/current 服务的 leftMenuNode 数据。 - - - -
- - diff --git a/example/src/docs/zh-CN/nav-menu/before-skip.md b/example/src/docs/zh-CN/nav-menu/before-skip.md deleted file mode 100644 index 127cf6591..000000000 --- a/example/src/docs/zh-CN/nav-menu/before-skip.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## NavMenu 导航菜单 - - - -NavMenu 导航菜单,主要用于定义页面顶部导航的菜单。 -
- -### 菜单跳转处理 - -提供 `before-skip` 钩子函数,用于菜单点击跳转前处理相关逻辑,返回 `false` 将无法跳转。 - - - -
- -### 使用组件默认服务时,菜单跳转处理 - -如果使用组件的默认服务 `/workspace/current` 获取菜单数据 `response.data.leftMenuNode.children`,那么在使用 `before-skip` 时,需配置属性 `prevent`,用来阻止默认的跳转行为。属性 `prevent` 默认值为 `false`。 - - - -
diff --git a/example/src/docs/zh-CN/nav-menu/custom-service.md b/example/src/docs/zh-CN/nav-menu/custom-service.md deleted file mode 100644 index ad0c3d1dc..000000000 --- a/example/src/docs/zh-CN/nav-menu/custom-service.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## NavMenu 导航菜单 - - - -NavMenu 导航菜单,主要用于定义页面顶部导航的菜单。 -
- -### 自定义服务 - -通过 `fetch-menu-data` 可以自定义菜单服务,若数据中字段不是默认的 `title`、`url`,则可以通过 `fields` 对数据中的字段进行映射。 - - - -
diff --git a/example/src/docs/zh-CN/nav-menu/data-resource.md b/example/src/docs/zh-CN/nav-menu/data-resource.md deleted file mode 100644 index f862ac382..000000000 --- a/example/src/docs/zh-CN/nav-menu/data-resource.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## NavMenu 导航菜单 - - - -NavMenu 导航菜单,主要用于定义页面顶部导航的菜单。 -
- -### 数据源 - -通过 `data` 属性配置菜单数据。 - - - -
diff --git a/example/src/docs/zh-CN/nav-menu/overflow.md b/example/src/docs/zh-CN/nav-menu/overflow.md deleted file mode 100644 index c8dcc63cc..000000000 --- a/example/src/docs/zh-CN/nav-menu/overflow.md +++ /dev/null @@ -1,26 +0,0 @@ -
-

- -

- -## NavMenu 导航菜单 - - - -NavMenu 导航菜单,主要用于定义页面顶部导航的菜单。 -
- -### 显示策略 - -当一级菜单无法在当前菜单容器里显示完全时,可以通过 `overflow` 属性配置显示策略,共有 `auto`、`retract`、`fixed`、`hidden` 4个选项,默认为 `auto`。 - -::: tip overflow 选项说明 -auto:菜单栏右侧显示 `更多` 菜单,鼠标悬停该菜单时,将显示剩余未展示的菜单。 -fixed:菜单栏左侧显示 `三明治折叠/展开` 图标,鼠标悬停该图标时,将显示所有菜单。 -retract:菜单栏不显示任何菜单,只显示 `三明治折叠/展开` 图标,鼠标悬停该图标时,将显示所有菜单。 -hidden:剩余未展示的菜单隐藏不显示。 -::: - - - -
diff --git a/example/src/docs/zh-CN/nav-menu/slot-logo.md b/example/src/docs/zh-CN/nav-menu/slot-logo.md deleted file mode 100644 index 6937a87c5..000000000 --- a/example/src/docs/zh-CN/nav-menu/slot-logo.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## NavMenu 导航菜单 - - - -NavMenu 导航菜单,主要用于定义页面顶部导航的菜单。 -
- -### Toolbar 插槽 - -提供 `toolbar` 插槽用于自定义 Toolbar 。 - - - -
- -### Logo 插槽 - -提供 `logo` 插槽用于自定义 Logo 。 - - - -
diff --git a/example/src/docs/zh-CN/notify/basic-usage.md b/example/src/docs/zh-CN/notify/basic-usage.md deleted file mode 100644 index bd6773c86..000000000 --- a/example/src/docs/zh-CN/notify/basic-usage.md +++ /dev/null @@ -1,34 +0,0 @@ -
-

- -

- -## Notify 通知 - - - -
- -### 属性列表 - -| 名称 | 类型 | 描述 | 默认值 | -| ----------- | ------------------ | ---------------------------------------------------- | ------------- | -| type | String | 通知消息类型,可选值为 info、success、warning、error | info | -| title | [String, Function] | 通知消息标题,可用 jsx 定制 | undefined | -| message | [String, Function] | 通知消息文本,可用 jsx 定制 | undefined | -| position | String | 通知显示位置,可选值为 top-right、bottom-right | bottom-right | -| duration | Number | 自动关闭延时毫秒数 | 4500 | -| customClass | [String, Object] | 自定义样式类 | undefined | -| showClose | Boolean | 是否显示关闭按钮 | true | -| showIcon | Boolean | 是否显示类型图标 | true | -| closeIcon | Object | 关闭图标组件对象 | IconClose | -| statusIcon | Object | 类型图标组件对象 | IconInfoSolid | -| beforeClose | () => Boolean | 关闭前回调方法,返回 false 可阻止关闭 | undefined | -| onClose | Function | 关闭回调 | undefined | - -### 基本用法 - - - - -
diff --git a/example/src/docs/zh-CN/notify/debounce-delay.md b/example/src/docs/zh-CN/notify/debounce-delay.md deleted file mode 100644 index ef64e4369..000000000 --- a/example/src/docs/zh-CN/notify/debounce-delay.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## Notify 通知 - - - -
- - -### 配置防抖 - - - - -
diff --git a/example/src/docs/zh-CN/notify/vertical-offset.md b/example/src/docs/zh-CN/notify/vertical-offset.md deleted file mode 100644 index be7bd07af..000000000 --- a/example/src/docs/zh-CN/notify/vertical-offset.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## Notify 通知 - - - -
- - -### 垂直方向偏离距离 - - - - -
diff --git a/example/src/docs/zh-CN/numeric/about-step.md b/example/src/docs/zh-CN/numeric/about-step.md deleted file mode 100644 index 6a8965a7f..000000000 --- a/example/src/docs/zh-CN/numeric/about-step.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - - -Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。 -
- -### 步长 - -可通过 `step` 属性设置计数器的步长。 - - - -
diff --git a/example/src/docs/zh-CN/numeric/allow-empty.md b/example/src/docs/zh-CN/numeric/allow-empty.md deleted file mode 100644 index 081a791b8..000000000 --- a/example/src/docs/zh-CN/numeric/allow-empty.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - - -Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。 -
- -### 步长 - -可通过 `allow-empty` 属性设置计数器内容的可清空特性。默认为 `false`,表示不可清空。 - - - -
diff --git a/example/src/docs/zh-CN/numeric/basic-usage.md b/example/src/docs/zh-CN/numeric/basic-usage.md deleted file mode 100644 index a95b289ba..000000000 --- a/example/src/docs/zh-CN/numeric/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - - -Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/numeric/calculate-according-to-num-of-goods.md b/example/src/docs/zh-CN/numeric/calculate-according-to-num-of-goods.md deleted file mode 100644 index 487c726a3..000000000 --- a/example/src/docs/zh-CN/numeric/calculate-according-to-num-of-goods.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - - -Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。 -
- -### 示例 - -根据商品数量自动计算价格。 - - - -
diff --git a/example/src/docs/zh-CN/numeric/controls.md b/example/src/docs/zh-CN/numeric/controls.md deleted file mode 100644 index 667ce1159..000000000 --- a/example/src/docs/zh-CN/numeric/controls.md +++ /dev/null @@ -1,44 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - - -Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。 - -
- -### 控制按钮 - -可通过 `controls` 属性设置计数器是否有控制按钮。 - - - -
- -### 控制按钮显示位置 - -可通过 `controls-position` 属性设置控制按钮显示的位置。 - - - -
- -### 关联文字 - -可通过 `label` 属性设置输入框的关联文字。 - - - -
- -### name - -可通过 `name` 属性设置原生属性。 - - - -
diff --git a/example/src/docs/zh-CN/numeric/dynamic-disabled.md b/example/src/docs/zh-CN/numeric/dynamic-disabled.md deleted file mode 100644 index faa72cb4c..000000000 --- a/example/src/docs/zh-CN/numeric/dynamic-disabled.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - - -Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。 -
- -### 禁用 - -通过设置 disabled 控制是否禁用计数器 - - - -
diff --git a/example/src/docs/zh-CN/numeric/max-min.md b/example/src/docs/zh-CN/numeric/max-min.md deleted file mode 100644 index 4e596abb3..000000000 --- a/example/src/docs/zh-CN/numeric/max-min.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - - -Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。 - -
- -### 数值循环 - -可通过设置 `max` 属性设置计数器允许的最大值,通过设置 `min` 属性设置计数器允许的最小值,通过设置 `circulate` 属性设置向上到达最大值后从最小值开始,或反过来。 - - - -
diff --git a/example/src/docs/zh-CN/numeric/mouse-wheel.md b/example/src/docs/zh-CN/numeric/mouse-wheel.md deleted file mode 100644 index 3710a7fe8..000000000 --- a/example/src/docs/zh-CN/numeric/mouse-wheel.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - - -Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。 -
- -### 鼠标滚轮滚动改变值 - -可通过 `mouseWheel` 属性控制鼠标滚动滑轮是否能改变数值。 - - - -
diff --git a/example/src/docs/zh-CN/numeric/numeric-events.md b/example/src/docs/zh-CN/numeric/numeric-events.md deleted file mode 100644 index 1b2d8ab79..000000000 --- a/example/src/docs/zh-CN/numeric/numeric-events.md +++ /dev/null @@ -1,35 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - - -Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。 -
- -### 聚焦事件 - -输入框获得焦点时触发 `focus` 事件。 - - - -
- -### 失焦事件 - -输入框失去焦点时触发 `blur` 事件。 - - - -
- -### 值改变事件 - -输入框值被改变时触发 `change` 事件。 - - - -
diff --git a/example/src/docs/zh-CN/numeric/numeric-size.md b/example/src/docs/zh-CN/numeric/numeric-size.md deleted file mode 100644 index 62edf33d9..000000000 --- a/example/src/docs/zh-CN/numeric/numeric-size.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - - -Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。 -
- -### 尺寸 - -可通过 `size` 属性设置计数器尺寸。可取值 `medium / small / mini`。 - - - -
diff --git a/example/src/docs/zh-CN/numeric/precision.md b/example/src/docs/zh-CN/numeric/precision.md deleted file mode 100644 index 332abd71c..000000000 --- a/example/src/docs/zh-CN/numeric/precision.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Numeric 计数器 - - - -Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。 -
- -### 数值精度 - -可通过 precision 属性设置计数器的精度值。 - - - -
diff --git a/example/src/docs/zh-CN/overview/component-overview.md b/example/src/docs/zh-CN/overview/component-overview.md deleted file mode 100644 index 9a102ecb7..000000000 --- a/example/src/docs/zh-CN/overview/component-overview.md +++ /dev/null @@ -1,147 +0,0 @@ -### 表单组件 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -### 导航组件 - - - - - - - - - - - - - - - -### 容器组件 - - - - - - - - -### 表格组件 - - - -### 数据组件 - - - - - - - - -### 提示组件 - - - - - - - - - - - - - - - - - - - -### 其他组件 - - - - - - - - - - - - - - - - - - - - diff --git a/example/src/docs/zh-CN/pager/basic-usage.md b/example/src/docs/zh-CN/pager/basic-usage.md deleted file mode 100644 index 2ed412621..000000000 --- a/example/src/docs/zh-CN/pager/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Pager 分页 - - - -当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/pager/current-page.md b/example/src/docs/zh-CN/pager/current-page.md deleted file mode 100644 index 51b78deec..000000000 --- a/example/src/docs/zh-CN/pager/current-page.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Pager 分页 - - - -当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。 -
- -### 当前页 - -通过 `current-page` 设置初始加载页码数, 通过 `total` 设置总条数 - - - -
diff --git a/example/src/docs/zh-CN/pager/custom-layout.md b/example/src/docs/zh-CN/pager/custom-layout.md deleted file mode 100644 index a74ee54a5..000000000 --- a/example/src/docs/zh-CN/pager/custom-layout.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Pager 分页 - - - -当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。 - -
- -### 自定义分页布局 - -`layout` 设置分页布局,通过在`layout`里调整`slot`的位置,从而调整插槽内容渲染的位置 - - - -
diff --git a/example/src/docs/zh-CN/pager/custom-next-prev-text.md b/example/src/docs/zh-CN/pager/custom-next-prev-text.md deleted file mode 100644 index 2591c1f6b..000000000 --- a/example/src/docs/zh-CN/pager/custom-next-prev-text.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Pager 分页 - - - -当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。 -
- -### 自定义上下页按钮文本 - -`prev-text` ,`next-text` 自定义上下页按钮文本 - - - -
diff --git a/example/src/docs/zh-CN/pager/hide-on-single-page.md b/example/src/docs/zh-CN/pager/hide-on-single-page.md deleted file mode 100644 index 710924047..000000000 --- a/example/src/docs/zh-CN/pager/hide-on-single-page.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Pager 分页 - - - -当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。 -
- -### 只有一页时隐藏分页 - -`hide-on-single-page` 只有一页时隐藏分页 - - - -
diff --git a/example/src/docs/zh-CN/pager/page-count.md b/example/src/docs/zh-CN/pager/page-count.md deleted file mode 100644 index 884373740..000000000 --- a/example/src/docs/zh-CN/pager/page-count.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Pager 分页 - - - -当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。 -
- -### 总页数 - -通过 `page-count` 设置总页数 - - - -
diff --git a/example/src/docs/zh-CN/pager/page-size.md b/example/src/docs/zh-CN/pager/page-size.md deleted file mode 100644 index a0d911823..000000000 --- a/example/src/docs/zh-CN/pager/page-size.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Pager 分页 - - - -当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。 -
- -### 每页显示数量 - -`page-sizes` 和 `page-size` 结合使用调整每页显示数量 - - - -
diff --git a/example/src/docs/zh-CN/pager/pager-append-to-body.md b/example/src/docs/zh-CN/pager/pager-append-to-body.md deleted file mode 100644 index 5f6a571e9..000000000 --- a/example/src/docs/zh-CN/pager/pager-append-to-body.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Pager 分页 - - - -当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。 -
- -### 分页下拉框显示位置 - -`popper-append-to-body` 分页下拉框元素是否追加到body元素节点下,默认值为 `true` 。 - - - -
diff --git a/example/src/docs/zh-CN/pager/pager-count.md b/example/src/docs/zh-CN/pager/pager-count.md deleted file mode 100644 index bccee9d0b..000000000 --- a/example/src/docs/zh-CN/pager/pager-count.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Pager 分页 - - - -当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。 -
- -### 页码按钮数量 - -`pager-count` 设置页码数量 - - - -
diff --git a/example/src/docs/zh-CN/pager/pager-events.md b/example/src/docs/zh-CN/pager/pager-events.md deleted file mode 100644 index d0aff47b2..000000000 --- a/example/src/docs/zh-CN/pager/pager-events.md +++ /dev/null @@ -1,35 +0,0 @@ -
-

- -

- -## Pager 分页 - - - -当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。 -
- -### 分页事件 - -`size-change` 每页条数改变时触发 - -
- -`current-change` 切换当前页码时触发 - -
- -`prev-click` 切换至前一页时触发 - -
- -`next-click` 切换至后一页时触发 - -
- -`before-page-change` 切换分页前事件 - - - -
diff --git a/example/src/docs/zh-CN/pager/pager-in-grid.md b/example/src/docs/zh-CN/pager/pager-in-grid.md deleted file mode 100644 index 7b0a1bb4d..000000000 --- a/example/src/docs/zh-CN/pager/pager-in-grid.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Pager 分页 - - - -当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。 -
- -### Grid 表格分页 - -Grid 表格使用分页组件 - -:::warning -该示例中的 `services/getGridMockData` 服务需要自行实现,示例模拟了远程服务返回的数据 -::: - - - -
diff --git a/example/src/docs/zh-CN/pager/pager-mode.md b/example/src/docs/zh-CN/pager/pager-mode.md deleted file mode 100644 index 7498dbd3b..000000000 --- a/example/src/docs/zh-CN/pager/pager-mode.md +++ /dev/null @@ -1,43 +0,0 @@ -
-

- -

- -## Pager 分页 - - - -当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。 -
- -### number 模式 - -通过 `mode="number"` 设置组件渲染模式 - - - -
- -### fixed 模式 - -通过 `mode="fixed"` 设置组件渲染模式 - - - -
- -### simple 模式 - -通过 `mode="simple"` 设置组件渲染模式 - - - -
- -### complete 模式 - -通过 `mode="complete"` 设置组件渲染模式 - - - -
diff --git a/example/src/docs/zh-CN/pager/popper-class.md b/example/src/docs/zh-CN/pager/popper-class.md deleted file mode 100644 index d0bbd946b..000000000 --- a/example/src/docs/zh-CN/pager/popper-class.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Pager 分页 - - - -当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。 -
- -### 自定义分页下拉框的类名 - -`popper-class` 可以自定义分页下拉框的类名 。 - - - -
\ No newline at end of file diff --git a/example/src/docs/zh-CN/pop-editor/basic-usage.md b/example/src/docs/zh-CN/pop-editor/basic-usage.md deleted file mode 100644 index 19c67be5d..000000000 --- a/example/src/docs/zh-CN/pop-editor/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/pop-editor/before-reset.md b/example/src/docs/zh-CN/pop-editor/before-reset.md deleted file mode 100644 index df85fd2be..000000000 --- a/example/src/docs/zh-CN/pop-editor/before-reset.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 重置 - -通过 `before-reset` 属性设置重置前的钩子函数。 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/clearable.md b/example/src/docs/zh-CN/pop-editor/clearable.md deleted file mode 100644 index 0fde66fa6..000000000 --- a/example/src/docs/zh-CN/pop-editor/clearable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 弹出窗筛选条件支持可清空 - -`clearable` Popeditor 组件 支持在搜索表单配置清除按钮。 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/custom-conditions.md b/example/src/docs/zh-CN/pop-editor/custom-conditions.md deleted file mode 100644 index 20ca5472a..000000000 --- a/example/src/docs/zh-CN/pop-editor/custom-conditions.md +++ /dev/null @@ -1,33 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 自定义查询条件 - -通过 `conditions` 属性可以自定义查询条件,组件内置的输入框支持按回车触发搜索的功能。 - - - -
- -### 布局与配置 - -通过 `condition` 项目里属性里的`span`配置栅格,`labelWidth` 配置label宽度。 `component`配置自定义组件,并通过 `attrs`配置组件属性 - - - -
- -### Form 表单中使用并开启表单校验 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/custom-icon.md b/example/src/docs/zh-CN/pop-editor/custom-icon.md deleted file mode 100644 index cabb84844..000000000 --- a/example/src/docs/zh-CN/pop-editor/custom-icon.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 自定义图标 - -通过 `icon` 属性可以自定义组件图标,需引入对应的 svg 图标。 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/custom-title.md b/example/src/docs/zh-CN/pop-editor/custom-title.md deleted file mode 100644 index 996a2f2d7..000000000 --- a/example/src/docs/zh-CN/pop-editor/custom-title.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 自定义标题 - -通过 `title` 属性设置弹出窗口标题,支持国际化信息配置。 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/draggable.md b/example/src/docs/zh-CN/pop-editor/draggable.md deleted file mode 100644 index d77ee607e..000000000 --- a/example/src/docs/zh-CN/pop-editor/draggable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 拖动窗口 - -通过 `draggable` 属性设置弹出窗口拖动特性。默认为 `true` 表示可在标题栏按住鼠标左键拖动窗口,设置为 `false` 则固定窗口位置不可拖动。 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/dynamic-disabled.md b/example/src/docs/zh-CN/pop-editor/dynamic-disabled.md deleted file mode 100644 index 7d3f961a3..000000000 --- a/example/src/docs/zh-CN/pop-editor/dynamic-disabled.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 禁用 - -通过 `disabled` 属性设置为是否只读。 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/dynamic-readonly.md b/example/src/docs/zh-CN/pop-editor/dynamic-readonly.md deleted file mode 100644 index 2ab66bea7..000000000 --- a/example/src/docs/zh-CN/pop-editor/dynamic-readonly.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 只读 - -通过 `readonly` 属性设置为是否只读。 - - - -
- -### 输入框的 tabindex - -通过 `tabindex` 属性置是否可通过 Tab 键获焦及获焦顺序(`readonly` 属性设置为 false 时有效)。 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/editable.md b/example/src/docs/zh-CN/pop-editor/editable.md deleted file mode 100644 index 05fca1644..000000000 --- a/example/src/docs/zh-CN/pop-editor/editable.md +++ /dev/null @@ -1,11 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - -
- -
diff --git a/example/src/docs/zh-CN/pop-editor/history-data-source.md b/example/src/docs/zh-CN/pop-editor/history-data-source.md deleted file mode 100644 index 80a255671..000000000 --- a/example/src/docs/zh-CN/pop-editor/history-data-source.md +++ /dev/null @@ -1,11 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - -
- -
diff --git a/example/src/docs/zh-CN/pop-editor/manual-popup.md b/example/src/docs/zh-CN/pop-editor/manual-popup.md deleted file mode 100644 index 2ce639f82..000000000 --- a/example/src/docs/zh-CN/pop-editor/manual-popup.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 手动弹出面板 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/multi-selected.md b/example/src/docs/zh-CN/pop-editor/multi-selected.md deleted file mode 100644 index 5462d1715..000000000 --- a/example/src/docs/zh-CN/pop-editor/multi-selected.md +++ /dev/null @@ -1,26 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 多选 - -通过设置 `multi` 属性为 true 实现多选。 -通过设置 `show-history` 当弹出面板配置的是表格时,设置历史记录标签页是否显示表格,默认为 false。 - - - -
- -### 多选且初始数据为数组 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/pager.md b/example/src/docs/zh-CN/pop-editor/pager.md deleted file mode 100644 index 4d784a182..000000000 --- a/example/src/docs/zh-CN/pop-editor/pager.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。 -
- -### 分页 - -`showPager` 属性只有当 `popseletor` 为 `grid` 时才能生效,默认值为 `false` 不启用分页,配置为 `true` 后还需配置 `pagerOp` 属性;并且需要监听 `page-change` 事件改变 `gridOp` 的 `data` 数据源 - -
diff --git a/example/src/docs/zh-CN/pop-editor/popeditor-events.md b/example/src/docs/zh-CN/pop-editor/popeditor-events.md deleted file mode 100644 index f56e66799..000000000 --- a/example/src/docs/zh-CN/pop-editor/popeditor-events.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### change 事件 - -`change` Popeditor 组件 Input 框的 change 事件。 `page-change` Popeditor 组件表格模式带分页切换事件。 - - - -### close 事件 - -`close` 弹框关闭时触发的事件。 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/remote-search.md b/example/src/docs/zh-CN/pop-editor/remote-search.md deleted file mode 100644 index 46f8a62ba..000000000 --- a/example/src/docs/zh-CN/pop-editor/remote-search.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 远程搜索 - -通过 `remote-search` 属性配置远程搜索,在 remoteSearch 方法里可以把 conditions 搜索条件传给后台,后台处理好数据后就能正常的显示在页面上。 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/render-text.md b/example/src/docs/zh-CN/pop-editor/render-text.md deleted file mode 100644 index a82ac53f4..000000000 --- a/example/src/docs/zh-CN/pop-editor/render-text.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 - -
- -### 渲染反查 - -在组件加载的第一批数据中不含有当前所设置的 `value` 对应的数据时,可以设置 `text-render-source` 进行反查 - - - -
- diff --git a/example/src/docs/zh-CN/pop-editor/resize.md b/example/src/docs/zh-CN/pop-editor/resize.md deleted file mode 100644 index da5969957..000000000 --- a/example/src/docs/zh-CN/pop-editor/resize.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 - -
- -### 全屏展示 - -通过配置 `resize` 控制是否全屏展示 - - - -
- diff --git a/example/src/docs/zh-CN/pop-editor/selected-data-source.md b/example/src/docs/zh-CN/pop-editor/selected-data-source.md deleted file mode 100644 index 80a255671..000000000 --- a/example/src/docs/zh-CN/pop-editor/selected-data-source.md +++ /dev/null @@ -1,11 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - -
- -
diff --git a/example/src/docs/zh-CN/pop-editor/show-clear-btn.md b/example/src/docs/zh-CN/pop-editor/show-clear-btn.md deleted file mode 100644 index 172de60fb..000000000 --- a/example/src/docs/zh-CN/pop-editor/show-clear-btn.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 不可清除 - -通过 `show-clear-btn` 属性设置是否可以清除。 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/show-history.md b/example/src/docs/zh-CN/pop-editor/show-history.md deleted file mode 100644 index 4d586d07d..000000000 --- a/example/src/docs/zh-CN/pop-editor/show-history.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 设置历史记录标签页 - -当弹出面板配置的是表格时,通过配置 `show-history` 设置历史记录标签页是否显示表格,该值默认为false。 - -
diff --git a/example/src/docs/zh-CN/pop-editor/show-overflow.md b/example/src/docs/zh-CN/pop-editor/show-overflow.md deleted file mode 100644 index 6e704545a..000000000 --- a/example/src/docs/zh-CN/pop-editor/show-overflow.md +++ /dev/null @@ -1,26 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 数据超出隐藏 - -在数据的列上配置 `showOverflow` 属性用于设置数据超出列宽时的显示和隐藏。值的类型可以为 Boolean 和 String,有三个值可以选择,如下所示。默认为换行显示全部内容。 - -:::tip 可选值说明 -tooltip:内容超出部分显示 ...,左侧/右侧弹出提示层显示全部信息。 -title:和原生标签的 title 属性一致。 -ellipsis:内容超出部分显示 ...,没有提示。 -true:为 true 时,效果和 tooltip 一致。 -::: - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/show-toolbar.md b/example/src/docs/zh-CN/pop-editor/show-toolbar.md deleted file mode 100644 index c2975a0da..000000000 --- a/example/src/docs/zh-CN/pop-editor/show-toolbar.md +++ /dev/null @@ -1,11 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - -
- -
diff --git a/example/src/docs/zh-CN/pop-editor/showPrimary.md b/example/src/docs/zh-CN/pop-editor/showPrimary.md deleted file mode 100644 index 80a255671..000000000 --- a/example/src/docs/zh-CN/pop-editor/showPrimary.md +++ /dev/null @@ -1,11 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - -
- -
diff --git a/example/src/docs/zh-CN/pop-editor/single-select-radio.md b/example/src/docs/zh-CN/pop-editor/single-select-radio.md deleted file mode 100644 index 264e71a6b..000000000 --- a/example/src/docs/zh-CN/pop-editor/single-select-radio.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 树模式单选 - -通过 `popseletor` 属性开启树模式,然后 `tree-op` 属性是 `Tree` 组件的 `op 配置方式`。 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/size.md b/example/src/docs/zh-CN/pop-editor/size.md deleted file mode 100644 index 0a0211161..000000000 --- a/example/src/docs/zh-CN/pop-editor/size.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 编辑框大小 - -通过 `size` 属性设置 PopEditor 编辑框大小,可选值有 `medium`、`small`、`mini`。 - -
diff --git a/example/src/docs/zh-CN/pop-editor/slot.md b/example/src/docs/zh-CN/pop-editor/slot.md deleted file mode 100644 index b20259180..000000000 --- a/example/src/docs/zh-CN/pop-editor/slot.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 组件查询条件插槽 - -通过插槽 `search` 自定义弹出面板查询结构。 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/table-edit.md b/example/src/docs/zh-CN/pop-editor/table-edit.md deleted file mode 100644 index 622fe02ea..000000000 --- a/example/src/docs/zh-CN/pop-editor/table-edit.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 表格编辑 - -gridOp 当 popseletor 为 grid 时生效,目前支持配置 columns 表格列 和 data 数据源,详细配置项参考 Grid 表格组件,需同时配置 textField、valueField 字段。 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/text-field.md b/example/src/docs/zh-CN/pop-editor/text-field.md deleted file mode 100644 index 5a45e4a74..000000000 --- a/example/src/docs/zh-CN/pop-editor/text-field.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 显示字段映射 - -通过 `text-field` 属性设置组件显示的字段。 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/text-render-source.md b/example/src/docs/zh-CN/pop-editor/text-render-source.md deleted file mode 100644 index c2975a0da..000000000 --- a/example/src/docs/zh-CN/pop-editor/text-render-source.md +++ /dev/null @@ -1,11 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - -
- -
diff --git a/example/src/docs/zh-CN/pop-editor/tree-edit.md b/example/src/docs/zh-CN/pop-editor/tree-edit.md deleted file mode 100644 index 748ade905..000000000 --- a/example/src/docs/zh-CN/pop-editor/tree-edit.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 自定义标题 - -通过 `popseletor` 属性开启树模式,然后 `tree-op` 属性是 `Tree` 组件的 `op 配置方式`。 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/trigger.md b/example/src/docs/zh-CN/pop-editor/trigger.md deleted file mode 100644 index 98aea3b82..000000000 --- a/example/src/docs/zh-CN/pop-editor/trigger.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 单选时触发勾选的方式 - -弹出编辑为单选时,默认只能通过单击单选按钮进行勾选。但也可以通过设置属性 `trigger` 为 `row` 实现单击行中任意位置进行勾选。或者设置 `trigger` 为 `cell`,单击操作列的单元格上任意位置进行勾选。 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/value-field.md b/example/src/docs/zh-CN/pop-editor/value-field.md deleted file mode 100644 index a2f417f60..000000000 --- a/example/src/docs/zh-CN/pop-editor/value-field.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 提交字段映射 - -通过 `value-field` 属性设置组件提交给后台的字段。 - - - -
diff --git a/example/src/docs/zh-CN/pop-editor/width-height.md b/example/src/docs/zh-CN/pop-editor/width-height.md deleted file mode 100644 index bb98c4a4f..000000000 --- a/example/src/docs/zh-CN/pop-editor/width-height.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## PopEditor 弹出编辑 - - - -该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。 -
- -### 宽高 - -通过 `width height` 属性配置宽高。 -通过 `dialog-class` 自定义配置弹窗类名 - - - -
diff --git a/example/src/docs/zh-CN/pop-upload/basic-usage.md b/example/src/docs/zh-CN/pop-upload/basic-usage.md deleted file mode 100644 index 63c9ec72f..000000000 --- a/example/src/docs/zh-CN/pop-upload/basic-usage.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## PopUpload 弹出框上传 - - - -点击所设置的元素,弹出上传对话框。 -
- -### 基本用法 - -通过 `action` 属性设置上传的服务接口。 - - - -
- - diff --git a/example/src/docs/zh-CN/pop-upload/custom-request-headers.md b/example/src/docs/zh-CN/pop-upload/custom-request-headers.md deleted file mode 100644 index e71628a33..000000000 --- a/example/src/docs/zh-CN/pop-upload/custom-request-headers.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopUpload 弹出框上传 - - - -点击所设置的元素,弹出上传对话框。 -
- -### 自定义请求头 - -通过 `headers` 属性自定义上传请求头信息。 - - - -
diff --git a/example/src/docs/zh-CN/pop-upload/data.md b/example/src/docs/zh-CN/pop-upload/data.md deleted file mode 100644 index b5feadc95..000000000 --- a/example/src/docs/zh-CN/pop-upload/data.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopUpload 弹出框上传 - - - -点击所设置的元素,弹出上传对话框。 -
- -### 基本用法 - -通过 `data` 属性设置上传时附带的额外参数。 - - - -
diff --git a/example/src/docs/zh-CN/pop-upload/file-limit.md b/example/src/docs/zh-CN/pop-upload/file-limit.md deleted file mode 100644 index ab51220f8..000000000 --- a/example/src/docs/zh-CN/pop-upload/file-limit.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## PopUpload 弹出框上传 - - - -点击所设置的元素,弹出上传对话框。 - -
- -### 最大上传文件数 - -通过 `limit` 属性可以指定最大上传的文件数量,配置 `multiple` 属性后可同时选择多个文件。 - - - -
diff --git a/example/src/docs/zh-CN/pop-upload/file-type.md b/example/src/docs/zh-CN/pop-upload/file-type.md deleted file mode 100644 index 67e353dac..000000000 --- a/example/src/docs/zh-CN/pop-upload/file-type.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopUpload 弹出框上传 - - - -点击所设置的元素,弹出上传对话框。 -
- -### 可上传文件类型 - -通过 `accept` 属性可以对选择文件时的文件类型进行控制,而 `upload-file-type` 属性可以指定在上传时进行校验的文件类型。 - - - -
diff --git a/example/src/docs/zh-CN/pop-upload/fill-button-text.md b/example/src/docs/zh-CN/pop-upload/fill-button-text.md deleted file mode 100644 index dcc57d188..000000000 --- a/example/src/docs/zh-CN/pop-upload/fill-button-text.md +++ /dev/null @@ -1,44 +0,0 @@ -
-

- -

- -## PopUpload 弹出框上传 - - - -点击所设置的元素,弹出上传对话框。 - -
- -### 文件上传弹框中取消按钮的文本 - -通过 `cancel-button-text` 属性指定取消按钮的文本内容 - - - -
- -### 文件上传弹框中提交按钮的文本 - -通过 `submit-button-text` 属性指定文件上传弹框中提交按钮的文本 - - - -
- -### 文件上传弹框中取消按钮的文本 - -通过 `dialog-title` 属性指定文件上传弹框中取消按钮的文本 - - - -
- -### 打开弹出框的按钮的文本 - -通过 `upload-button-text` 属性指定打开弹出框的按钮的文本 - - - -
diff --git a/example/src/docs/zh-CN/pop-upload/http-request.md b/example/src/docs/zh-CN/pop-upload/http-request.md deleted file mode 100644 index 96f00525f..000000000 --- a/example/src/docs/zh-CN/pop-upload/http-request.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopUpload 弹出框上传 - - - -点击所设置的元素,弹出上传对话框。 -
- -### 覆盖默认请求 - -通过配置 `http-request` 覆盖默认的上传行为,可以自定义上传的实现 - - - -
diff --git a/example/src/docs/zh-CN/pop-upload/max-upload-file-size.md b/example/src/docs/zh-CN/pop-upload/max-upload-file-size.md deleted file mode 100644 index 6b084522c..000000000 --- a/example/src/docs/zh-CN/pop-upload/max-upload-file-size.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## PopUpload 弹出框上传 - - - -点击所设置的元素,弹出上传对话框。 -
- -### 可上传文件大小 - -通过 `max-upload-file-size` 属性指定可上传文件的大小。 - - - -
diff --git a/example/src/docs/zh-CN/pop-upload/prevent-delete-file.md b/example/src/docs/zh-CN/pop-upload/prevent-delete-file.md deleted file mode 100644 index 31389fdf6..000000000 --- a/example/src/docs/zh-CN/pop-upload/prevent-delete-file.md +++ /dev/null @@ -1,26 +0,0 @@ -
-

- -

- -## PopUpload 弹出框上传 - - - -点击所设置的元素,弹出上传对话框。 - -
- -### 阻止删除文件 - -:before-remove(移除文件前回调事件),方法里面return true/false,表示是否可以删除 - - -
- -### 阻止上传文件 - -:before-upload 上传文件之前的钩子,参数为上传的文件,若返回 false 或者返回 Promise 且被 reject,则停止上传 - - -
diff --git a/example/src/docs/zh-CN/pop-upload/size.md b/example/src/docs/zh-CN/pop-upload/size.md deleted file mode 100644 index b3d2e06a5..000000000 --- a/example/src/docs/zh-CN/pop-upload/size.md +++ /dev/null @@ -1,22 +0,0 @@ -
-

- -

- -## PopUpload 弹出框上传 - - - -点击所设置的元素,弹出上传对话框。 - -
- -### 设置组件大小 - -可设置为:`medium`,`small`,`mini` - -通过 `disabled` 属性设置是否禁用,默认值为 false 。 - - - -
diff --git a/example/src/docs/zh-CN/pop-upload/upload-name.md b/example/src/docs/zh-CN/pop-upload/upload-name.md deleted file mode 100644 index ccabadea0..000000000 --- a/example/src/docs/zh-CN/pop-upload/upload-name.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## PopUpload 弹出框上传 - - - -点击所设置的元素,弹出上传对话框。 - -
- -### 上传的文件字段名 - -通过 `upload-name` 属性设置上传的文件字段名,默认值为 file 。 - - - -
- -### 发送 cookie 凭证信息 - -通过 `with-credentials` 属性设置是否支持发送 cookie 凭证信息,默认为 false 。 - - - -
diff --git a/example/src/docs/zh-CN/popover/arrow-offset.md b/example/src/docs/zh-CN/popover/arrow-offset.md deleted file mode 100644 index dfa0c20e8..000000000 --- a/example/src/docs/zh-CN/popover/arrow-offset.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## Popover - - - -Popover可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画 -
- -### 箭头偏移 - -`arrow-offset` 设置箭头的偏移量,来改变箭头的位置。 - diff --git a/example/src/docs/zh-CN/popover/basic-usage.md b/example/src/docs/zh-CN/popover/basic-usage.md deleted file mode 100644 index add6e329d..000000000 --- a/example/src/docs/zh-CN/popover/basic-usage.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Popover - - - -Popover可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画 -
- -### 基本用法 - - -
- diff --git a/example/src/docs/zh-CN/popover/close-delay.md b/example/src/docs/zh-CN/popover/close-delay.md deleted file mode 100644 index b2855c621..000000000 --- a/example/src/docs/zh-CN/popover/close-delay.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Popover - - - -Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画 -
- -### 延迟隐藏 - -`close-delay` 弹出框延迟隐藏单位为毫秒(Number) - - diff --git a/example/src/docs/zh-CN/popover/custom-tip-text.md b/example/src/docs/zh-CN/popover/custom-tip-text.md deleted file mode 100644 index b20841b4d..000000000 --- a/example/src/docs/zh-CN/popover/custom-tip-text.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Popover - - - -Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画 -
- -### 自定义提示文本 - -`content` 设置自定义文本,也可在标签内直接嵌套默认插槽为自定义文本 - - diff --git a/example/src/docs/zh-CN/popover/custom-transition.md b/example/src/docs/zh-CN/popover/custom-transition.md deleted file mode 100644 index 6e68a2068..000000000 --- a/example/src/docs/zh-CN/popover/custom-transition.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Popover - - - -Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画 -
- -### 自定义渐变动画 - -`transition` 设置弹框的显示隐藏淡入淡出动画,默认取值 fade-in-linear,fade-in ( 无动画效果 ) - - diff --git a/example/src/docs/zh-CN/popover/dynamic-disable.md b/example/src/docs/zh-CN/popover/dynamic-disable.md deleted file mode 100644 index 0c920d6be..000000000 --- a/example/src/docs/zh-CN/popover/dynamic-disable.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Popover - - - -Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画 -
- -### 禁用 - -`disabled` 设置是否禁用弹出框。 - - diff --git a/example/src/docs/zh-CN/popover/frame-offset.md b/example/src/docs/zh-CN/popover/frame-offset.md deleted file mode 100644 index 55a740d60..000000000 --- a/example/src/docs/zh-CN/popover/frame-offset.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## Popover - - - -Popover可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画 -
- -### 弹出框偏移 - -`offset` 设置弹框的偏移量,来改变弹框的位置。 - diff --git a/example/src/docs/zh-CN/popover/hidden-arrow.md b/example/src/docs/zh-CN/popover/hidden-arrow.md deleted file mode 100644 index 7ded67834..000000000 --- a/example/src/docs/zh-CN/popover/hidden-arrow.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Popover - - - -Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画 -
- -### 隐藏提示框箭头 - -`visible-arrow` 设定是否显示提示框的箭头 - - diff --git a/example/src/docs/zh-CN/popover/open-delay.md b/example/src/docs/zh-CN/popover/open-delay.md deleted file mode 100644 index acf7074fc..000000000 --- a/example/src/docs/zh-CN/popover/open-delay.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Popover - - - -Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画 -
- -### 延迟显示 - -`open-delay`,设置延迟时间 ( type:number,单位毫秒 ) - - diff --git a/example/src/docs/zh-CN/popover/popover-content.md b/example/src/docs/zh-CN/popover/popover-content.md deleted file mode 100644 index b99432bbb..000000000 --- a/example/src/docs/zh-CN/popover/popover-content.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Popover - - - -Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画 -
- -### 添加内容 - -`content` 设置要显示的内容。 - - diff --git a/example/src/docs/zh-CN/popover/popover-events.md b/example/src/docs/zh-CN/popover/popover-events.md deleted file mode 100644 index 9b99df287..000000000 --- a/example/src/docs/zh-CN/popover/popover-events.md +++ /dev/null @@ -1,33 +0,0 @@ -
-

- -

- -## Popover - - - -Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画 -
- -### 事件 - -`input` 加载完触发回调 - -
- -`hide` 隐藏时触发回调 - -
- -`show` 显示时触发回调 - -
- -`after-leave` 显示时触发回调 - -
- -`after-enter` 显示动画播放完毕后触发回调 - - diff --git a/example/src/docs/zh-CN/popover/popover-placement.md b/example/src/docs/zh-CN/popover/popover-placement.md deleted file mode 100644 index 5c8eccf11..000000000 --- a/example/src/docs/zh-CN/popover/popover-placement.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Popover - - - -Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画 -
- -### 显示位置 - -`placement` 设置弹出框的的位置,可选值为(to/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end) - - diff --git a/example/src/docs/zh-CN/popover/popover-width.md b/example/src/docs/zh-CN/popover/popover-width.md deleted file mode 100644 index 1dd678ad7..000000000 --- a/example/src/docs/zh-CN/popover/popover-width.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Popover - - - -Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画 -
- -### 宽度 - -`width` 弹出框的宽度 - - diff --git a/example/src/docs/zh-CN/popover/popper-class.md b/example/src/docs/zh-CN/popover/popper-class.md deleted file mode 100644 index 2154e5728..000000000 --- a/example/src/docs/zh-CN/popover/popper-class.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Popover - - - -Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画 -
- -### 自定义样式 - -`popper-class` 可配置单个或多个 class - - diff --git a/example/src/docs/zh-CN/popover/popper-options.md b/example/src/docs/zh-CN/popover/popper-options.md deleted file mode 100644 index 9f37f3823..000000000 --- a/example/src/docs/zh-CN/popover/popper-options.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Popover - - - -Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画 -
- -### 弹出框选项 - -`popper-options` 配置弹出框选项 - - diff --git a/example/src/docs/zh-CN/popover/trigger-mode.md b/example/src/docs/zh-CN/popover/trigger-mode.md deleted file mode 100644 index 044ba5aef..000000000 --- a/example/src/docs/zh-CN/popover/trigger-mode.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Popover - - - -Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画 -
- -### 触发方式 - -`trigger`设定弹出框的触发方式
`click` 点击触发
`focus` 鼠标长按触发
`hover` 鼠标悬浮触发
`manual` 点击触发,再次点击隐藏 - - diff --git a/example/src/docs/zh-CN/popover/trigger-reference.md b/example/src/docs/zh-CN/popover/trigger-reference.md deleted file mode 100644 index cae02cbbc..000000000 --- a/example/src/docs/zh-CN/popover/trigger-reference.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Popover - - - -Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画 -
- -### 触发源 - -`slot` 设置弹出框的触发源 - - diff --git a/example/src/docs/zh-CN/progress/basic-usage.md b/example/src/docs/zh-CN/progress/basic-usage.md deleted file mode 100644 index 99a5ffa50..000000000 --- a/example/src/docs/zh-CN/progress/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/progress/custom-color.md b/example/src/docs/zh-CN/progress/custom-color.md deleted file mode 100644 index e80c93e00..000000000 --- a/example/src/docs/zh-CN/progress/custom-color.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 -
- -### 自定义颜色 - -通过 `color` 设置进度条颜色。color 进度条背景色(会覆盖 status 状态颜色) - - - -
diff --git a/example/src/docs/zh-CN/progress/dynamic-control-changes.md b/example/src/docs/zh-CN/progress/dynamic-control-changes.md deleted file mode 100644 index 2429330a1..000000000 --- a/example/src/docs/zh-CN/progress/dynamic-control-changes.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 -
- -### 动态控制进度条变化 - -通过设置 `percentage` 动态控制进度条变化 - - - -
diff --git a/example/src/docs/zh-CN/progress/format-text.md b/example/src/docs/zh-CN/progress/format-text.md deleted file mode 100644 index c71a76c3c..000000000 --- a/example/src/docs/zh-CN/progress/format-text.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 - -
- -### 自定义显示文字 - -`text-inside` 进度条显示文字内置在进度条内(只在 type=line 时可用),`format`自定义进度条的文字 - - - -
diff --git a/example/src/docs/zh-CN/progress/progress-status.md b/example/src/docs/zh-CN/progress/progress-status.md deleted file mode 100644 index 42c3802a4..000000000 --- a/example/src/docs/zh-CN/progress/progress-status.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 -
- -### 状态 - -`status` 进度条当前状态(success/exception/warning) - - diff --git a/example/src/docs/zh-CN/progress/progress-type.md b/example/src/docs/zh-CN/progress/progress-type.md deleted file mode 100644 index f5b8c9dad..000000000 --- a/example/src/docs/zh-CN/progress/progress-type.md +++ /dev/null @@ -1,36 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 - -
- -取值 line:线性进度条。取值 circle:环形进度条,取值 dashboard:仪表盘形进度条 - -
- -### line 类型 - -`type="line"` 显示为 line 类型 - - - -### circle 类型 - -`type="circle"` 显示为 circle 类型。`width`可以调整环形进度条画布宽度,默认值为126px。 - - - -### dashboard 类型 - -`type="dashboard"` 显示为 dashboard 类型。`width`可以调整环形进度条画布宽度,默认值为126px。 - - - -
diff --git a/example/src/docs/zh-CN/progress/progress-width.md b/example/src/docs/zh-CN/progress/progress-width.md deleted file mode 100644 index abb69bfa6..000000000 --- a/example/src/docs/zh-CN/progress/progress-width.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 -
- -### 宽度 - -`stroke-width`进度条的宽度,单位 px - - - -
diff --git a/example/src/docs/zh-CN/progress/text-inside-or-no-text.md b/example/src/docs/zh-CN/progress/text-inside-or-no-text.md deleted file mode 100644 index 62e389a36..000000000 --- a/example/src/docs/zh-CN/progress/text-inside-or-no-text.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Progress - - - -用于展示操作进度,告知用户当前状态和预期。 -
- -### 文字内显或不显 - -`show-text` 是否显示进度条文字内容 - - - -
diff --git a/example/src/docs/zh-CN/radio/active-color.md b/example/src/docs/zh-CN/radio/active-color.md deleted file mode 100644 index 2a3471924..000000000 --- a/example/src/docs/zh-CN/radio/active-color.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Radio 单选框 - - - -用于配置不同场景的选项,在一组备选项中进行单选。 -
- -### 颜色设置 - -按钮形式的 Radio 激活时可通过 `text-color` 属性设置文本颜色,通过 `fill` 属性设置填充色和边框色。 - - - -
diff --git a/example/src/docs/zh-CN/radio/basic-usage.md b/example/src/docs/zh-CN/radio/basic-usage.md deleted file mode 100644 index 09a424be7..000000000 --- a/example/src/docs/zh-CN/radio/basic-usage.md +++ /dev/null @@ -1,56 +0,0 @@ -
-

- -

- -## Radio 单选框 - - - -用于配置不同场景的选项,在一组备选项中进行单选。 - -
- -### 基本用法 - -通过 `v-model` 绑定变量,设置的变量值为默认选中的 Radio,变量值对应 `label` 属性的值。通过 `text` 也可以配置显示文本,与默认插槽配置纯文本的结果一致 - -
- -`label` 可以是 `String`、`Number` 或 `Boolean`。 - - - -
- -### 配置式单选组 - -提供 `options` 属性,支持通过配置对象数组数据的形式来渲染单选组。使用该属性后,可以不用再在标签中以插槽的形式插入 `` 或 `` 标签。 - -
- -`options` 对象数组中包括三个字段:`label`、`text`、`events`。 - -
- -另外还提供 `type` 属性,配合 `options` 属性一起使用,默认值为 `radio`。还可以配置为 `button`,配置后单选组将以按钮的形式展示。 - - - -
- -### Radio - - - -
- -### RadioGroup - - - -
- -### RadioButton - - diff --git a/example/src/docs/zh-CN/radio/dynamic-disable.md b/example/src/docs/zh-CN/radio/dynamic-disable.md deleted file mode 100644 index 33006987f..000000000 --- a/example/src/docs/zh-CN/radio/dynamic-disable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Radio 单选框 - - - -用于配置不同场景的选项,在一组备选项中进行单选。 -
- -### 禁用状态 - -设置 `disabled` 属性即可启动禁用状态,默认为 false 。 - - - -
diff --git a/example/src/docs/zh-CN/radio/group-options.md b/example/src/docs/zh-CN/radio/group-options.md deleted file mode 100644 index cd951a7ef..000000000 --- a/example/src/docs/zh-CN/radio/group-options.md +++ /dev/null @@ -1,19 +0,0 @@ -

- -

- -## Radio 单选框 - - - -用于配置不同场景的选项,在一组备选项中进行单选。 - -
- -### 单选框事件 - -可在 RadioGroup 组件上设置 `options ` 属性,可循环配置 Radio。 - - - -
diff --git a/example/src/docs/zh-CN/radio/radio-default.md b/example/src/docs/zh-CN/radio/radio-default.md deleted file mode 100644 index 8657f0a43..000000000 --- a/example/src/docs/zh-CN/radio/radio-default.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Radio 单选框 - - - -用于配置不同场景的选项,在一组备选项中进行单选。 - -
- -### 默认插槽 - -通过 `default` 默认插槽列表。 - - - -
diff --git a/example/src/docs/zh-CN/radio/radio-events.md b/example/src/docs/zh-CN/radio/radio-events.md deleted file mode 100644 index 080856a8b..000000000 --- a/example/src/docs/zh-CN/radio/radio-events.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Radio 单选框 - - - -用于配置不同场景的选项,在一组备选项中进行单选。 -
- -### 单选框事件 - -可在 Radio、RadioGroup 组件上设置 `change` 事件,当绑定值变化时触发,回调函数为选中的 Radio label 值。 - - - -
diff --git a/example/src/docs/zh-CN/radio/radio-size.md b/example/src/docs/zh-CN/radio/radio-size.md deleted file mode 100644 index a38bc0915..000000000 --- a/example/src/docs/zh-CN/radio/radio-size.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Radio 单选框 - - - -用于配置不同场景的选项,在一组备选项中进行单选。 -
- -### 尺寸设置 - -可对按钮形式的 Radio 或带有边框的 Radio 设置 `size` 属性,以改变其尺寸,包括 medium、small、mini 三个选项。 - - - -
diff --git a/example/src/docs/zh-CN/radio/radio-text.md b/example/src/docs/zh-CN/radio/radio-text.md deleted file mode 100644 index 720d2eda4..000000000 --- a/example/src/docs/zh-CN/radio/radio-text.md +++ /dev/null @@ -1,36 +0,0 @@ -
-

- -

- -## Radio 单选框 - - - -用于配置不同场景的选项,在一组备选项中进行单选。 - -
- -### 文字内容 - -可在 Radio 组件上设置 `text` 属性,设置内容。 - - - -
- -### 按钮内容 - -通过 `label` 属性可以设置 Radio 的内容 - - - -
- -### name - -通过 `name` 属性可以设置原生 name 属性。 - - - -
diff --git a/example/src/docs/zh-CN/radio/radio-value.md b/example/src/docs/zh-CN/radio/radio-value.md deleted file mode 100644 index 2a9ba7a19..000000000 --- a/example/src/docs/zh-CN/radio/radio-value.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Radio 单选框 - - - -用于配置不同场景的选项,在一组备选项中进行单选。 - -
- -### 垂直布局 - -可在 RadioGroup 组件上设置 `value/v-model` 属性,绑定值。 - - - -
diff --git a/example/src/docs/zh-CN/radio/vertical.md b/example/src/docs/zh-CN/radio/vertical.md deleted file mode 100644 index a4b4cf7ab..000000000 --- a/example/src/docs/zh-CN/radio/vertical.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Radio 单选框 - - - -用于配置不同场景的选项,在一组备选项中进行单选。 -
- -### 垂直布局 - -可在 RadioGroup 组件上设置 `vertical` 属性,使单选框垂直布局。 - - - -
diff --git a/example/src/docs/zh-CN/radio/with-border.md b/example/src/docs/zh-CN/radio/with-border.md deleted file mode 100644 index c0e278f0b..000000000 --- a/example/src/docs/zh-CN/radio/with-border.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Radio 单选框 - - - -用于配置不同场景的选项,在一组备选项中进行单选。 -
- -### 带有边框 - -可通过设置 `border` 属性,给单选框增加边框。 - - - -
diff --git a/example/src/docs/zh-CN/rate/allow-half.md b/example/src/docs/zh-CN/rate/allow-half.md deleted file mode 100644 index e5e3d8492..000000000 --- a/example/src/docs/zh-CN/rate/allow-half.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Rate 评分 - - - -Rate 快速评级,对评价进行展示。 -
- -### 半选 - -可通过 `allow-half` 定义是否支持半选。 - - - -
diff --git a/example/src/docs/zh-CN/rate/basic-usage.md b/example/src/docs/zh-CN/rate/basic-usage.md deleted file mode 100644 index ab460c108..000000000 --- a/example/src/docs/zh-CN/rate/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Rate 评分 - - - -Rate 快速评级,对评价进行展示。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/rate/custom-3-threshold-colors.md b/example/src/docs/zh-CN/rate/custom-3-threshold-colors.md deleted file mode 100644 index 01590620d..000000000 --- a/example/src/docs/zh-CN/rate/custom-3-threshold-colors.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Rate 评分 - - - -Rate 快速评级,对评价进行展示。 -
- -### 自定义 3 分段颜色 - -可通过 `colors` 定义 3 分段颜色。 - - - -
diff --git a/example/src/docs/zh-CN/rate/custom-3-threshold-icon.md b/example/src/docs/zh-CN/rate/custom-3-threshold-icon.md deleted file mode 100644 index b4e673402..000000000 --- a/example/src/docs/zh-CN/rate/custom-3-threshold-icon.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Rate 评分 - - - -Rate 快速评级,对评价进行展示。 -
- -### 自定义 3 分段图标样式 - -可通过 `icon-classes` 自定义 3 分段图标样式。 - - - -
diff --git a/example/src/docs/zh-CN/rate/disabled-not-selected-style.md b/example/src/docs/zh-CN/rate/disabled-not-selected-style.md deleted file mode 100644 index 06ac0b520..000000000 --- a/example/src/docs/zh-CN/rate/disabled-not-selected-style.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Rate 评分 - - - -Rate 快速评级,对评价进行展示。 -
- -### 自定义禁用时未选中图标颜色 - -可通过 `disabled-void-color` 自定义禁用时未选中图标颜色。 - - - -### 自定义禁用时未选中图标类名 - -可通过 `disabled-void-icon-class` 自定义禁用时未选中图标类名。 - - - -
diff --git a/example/src/docs/zh-CN/rate/dynamic-disable.md b/example/src/docs/zh-CN/rate/dynamic-disable.md deleted file mode 100644 index 9761152f4..000000000 --- a/example/src/docs/zh-CN/rate/dynamic-disable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Rate 评分 - - - -Rate 快速评级,对评价进行展示。 -
- -### 禁用 - -可通过 `disabled` 定义是否禁用。 - - - -
diff --git a/example/src/docs/zh-CN/rate/max-score.md b/example/src/docs/zh-CN/rate/max-score.md deleted file mode 100644 index 2f61794bd..000000000 --- a/example/src/docs/zh-CN/rate/max-score.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Rate 评分 - - - -Rate 快速评级,对评价进行展示。 -
- -### 最大分值 - -可通过 `max` 设置最大分值。 - - - -
diff --git a/example/src/docs/zh-CN/rate/not-selected-style.md b/example/src/docs/zh-CN/rate/not-selected-style.md deleted file mode 100644 index 800dd9c08..000000000 --- a/example/src/docs/zh-CN/rate/not-selected-style.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Rate 评分 - - - -Rate 快速评级,对评价进行展示。 -
- -### 自定义未选中图标颜色 - -可通过 `void-color` 定义未选中图标颜色。 - - - -### 自定义未选中图标类名 - -可通过 `void-icon-class` 定义未选中图标类名。 - - - -
diff --git a/example/src/docs/zh-CN/rate/radio-rate.md b/example/src/docs/zh-CN/rate/radio-rate.md deleted file mode 100644 index 7b89a45ad..000000000 --- a/example/src/docs/zh-CN/rate/radio-rate.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Rate 评分 - - - -Rate 快速评级,对评价进行展示。 -
- -### 单选模式 - -可通过 `radio` 设置单选模式。 - - - -
diff --git a/example/src/docs/zh-CN/rate/rate-events.md b/example/src/docs/zh-CN/rate/rate-events.md deleted file mode 100644 index 6606021b8..000000000 --- a/example/src/docs/zh-CN/rate/rate-events.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Rate 评分 - - - -Rate 快速评级,对评价进行展示。 -
- -### 事件 - -监听 `change` 事件触发处理方法。 - - - -
diff --git a/example/src/docs/zh-CN/rate/show-score.md b/example/src/docs/zh-CN/rate/show-score.md deleted file mode 100644 index eb77d3e9a..000000000 --- a/example/src/docs/zh-CN/rate/show-score.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Rate 评分 - - - -Rate 快速评级,对评价进行展示。 -
- -### 分数显示 - -可通过 `show-score score-template` 分别定义是否显示分数和显示的模板。 - - - -
diff --git a/example/src/docs/zh-CN/rate/size-and-space.md b/example/src/docs/zh-CN/rate/size-and-space.md deleted file mode 100644 index ac7c5b591..000000000 --- a/example/src/docs/zh-CN/rate/size-and-space.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Rate 评分 - - - -Rate 快速评级,对评价进行展示。 -
- -### 大小及占位宽度 - -可通过 `size space` 分别大小和占位宽度。 - - - -
diff --git a/example/src/docs/zh-CN/rate/text-on-bottom.md b/example/src/docs/zh-CN/rate/text-on-bottom.md deleted file mode 100644 index a1b2330ae..000000000 --- a/example/src/docs/zh-CN/rate/text-on-bottom.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Rate 评分 - - - -Rate 快速评级,对评价进行展示。 -
- -### 图标下文字提示 - -可通过 `text-on-bottom` 定义是否在图标下显示文字提示。 - - - -
diff --git a/example/src/docs/zh-CN/rate/texts-and-text-color.md b/example/src/docs/zh-CN/rate/texts-and-text-color.md deleted file mode 100644 index b2be840f7..000000000 --- a/example/src/docs/zh-CN/rate/texts-and-text-color.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Rate 评分 - - - -Rate 快速评级,对评价进行展示。 -
- -### 辅助文字及颜色 - -可通过 `texts show-text text-color` 三个属性分别设置辅助文字内容、是否显示辅助文字及辅助文字颜色。 - - - -
diff --git a/example/src/docs/zh-CN/rate/threshold-value.md b/example/src/docs/zh-CN/rate/threshold-value.md deleted file mode 100644 index fb49a9022..000000000 --- a/example/src/docs/zh-CN/rate/threshold-value.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Rate 评分 - - - -Rate 快速评级,对评价进行展示。 -
- -### 界限值 - -可通过 `low-threshold high-threshold` 分别设置下限值和上限值,通过`colors`配置显示星的颜色 - - - -
diff --git a/example/src/docs/zh-CN/roles/basic-usage.md b/example/src/docs/zh-CN/roles/basic-usage.md deleted file mode 100644 index 831fa4271..000000000 --- a/example/src/docs/zh-CN/roles/basic-usage.md +++ /dev/null @@ -1,24 +0,0 @@ -
-

- -

- -## Roles 角色切换 - - - -Roles 角色组件,提供当前用户的角色列表,并可以在不同角色间进行切换。 -
- -### 基本用法 - -> 注意 Roles 组件请求的是 mock 数据,开发时请用真实服务。 - -通过 `change(userId)` 可以监听切换事件,入参是切换后的用户ID。 - - - -
- - - diff --git a/example/src/docs/zh-CN/roles/fetch-role.md b/example/src/docs/zh-CN/roles/fetch-role.md deleted file mode 100644 index aca56876b..000000000 --- a/example/src/docs/zh-CN/roles/fetch-role.md +++ /dev/null @@ -1,24 +0,0 @@ -
-

- -

- -## Roles 角色切换 - - - -Roles 角色组件,提供当前用户的角色列表,并可以在不同角色间进行切换。 -
- -### 基本用法 - -> 注意 Roles 组件请求的是 mock 数据,开发时请用真实服务。 - -通过 `fetch-role` 自定义查询服务。 - - - -
- - - diff --git a/example/src/docs/zh-CN/scroll-text/basic-usage.md b/example/src/docs/zh-CN/scroll-text/basic-usage.md deleted file mode 100644 index ec7896008..000000000 --- a/example/src/docs/zh-CN/scroll-text/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ScrollText 文字滚动 - - - -常用于文字提示信息滚动轮播显示。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/scroll-text/custom-scroll-text.md b/example/src/docs/zh-CN/scroll-text/custom-scroll-text.md deleted file mode 100644 index b402f91f4..000000000 --- a/example/src/docs/zh-CN/scroll-text/custom-scroll-text.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## ScrollText 文字滚动 - - - -常用于文字提示信息滚动轮播显示。 -
- -### 自定义文本内容 - -可通过 `text` 自定义文本内容。 - - - -### 通过 solt 插槽自定义文本内容 - -可通过 solt 插槽自定义文本内容。 - - - -
diff --git a/example/src/docs/zh-CN/scroll-text/custom-text-style.md b/example/src/docs/zh-CN/scroll-text/custom-text-style.md deleted file mode 100644 index e6f9ea426..000000000 --- a/example/src/docs/zh-CN/scroll-text/custom-text-style.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ScrollText 文字滚动 - - - -常用于文字提示信息滚动轮播显示。 -
- -### 自定义文本样式 - -可通过 `class` 自定义文本样式。 - - - -
diff --git a/example/src/docs/zh-CN/scroll-text/hover-stop.md b/example/src/docs/zh-CN/scroll-text/hover-stop.md deleted file mode 100644 index c8ab58753..000000000 --- a/example/src/docs/zh-CN/scroll-text/hover-stop.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ScrollText 文字滚动 - - - -常用于文字提示信息滚动轮播显示。 -
- -### 鼠标悬停时文本停止滚动 - -可通过 `hover-stop` 设鼠标悬停时文本是否停止滚动。 - - - -
diff --git a/example/src/docs/zh-CN/scroll-text/scroll-direction.md b/example/src/docs/zh-CN/scroll-text/scroll-direction.md deleted file mode 100644 index c74b9f2e9..000000000 --- a/example/src/docs/zh-CN/scroll-text/scroll-direction.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ScrollText 文字滚动 - - - -常用于文字提示信息滚动轮播显示。 -
- -### 文字滚动方向 - -可通过 `direction` 设置文字滚动方向。 - - - -
diff --git a/example/src/docs/zh-CN/scroll-text/scroll-time.md b/example/src/docs/zh-CN/scroll-text/scroll-time.md deleted file mode 100644 index d044b1612..000000000 --- a/example/src/docs/zh-CN/scroll-text/scroll-time.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ScrollText 文字滚动 - - - -常用于文字提示信息滚动轮播显示。 -
- -### 滚动时间间隔 - -可通过 `time` 设置滚动时间间隔。 - - - -
diff --git a/example/src/docs/zh-CN/search/basic-usage.md b/example/src/docs/zh-CN/search/basic-usage.md deleted file mode 100644 index 9b1df1b9f..000000000 --- a/example/src/docs/zh-CN/search/basic-usage.md +++ /dev/null @@ -1,27 +0,0 @@ - -
-

- -

- -## Search 搜索 - - - -指定条件对象进行搜索数据。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/search/clearable.md b/example/src/docs/zh-CN/search/clearable.md deleted file mode 100644 index edd29dcb7..000000000 --- a/example/src/docs/zh-CN/search/clearable.md +++ /dev/null @@ -1,28 +0,0 @@ - -
-

- -

- -## Search 搜索 - - - -指定条件对象进行搜索数据。 -
- -### 可清除 - -可通过 `clearable` 属性设置显示清空图标按钮。 - - - -
- diff --git a/example/src/docs/zh-CN/search/custom-search-types.md b/example/src/docs/zh-CN/search/custom-search-types.md deleted file mode 100644 index b95dae87d..000000000 --- a/example/src/docs/zh-CN/search/custom-search-types.md +++ /dev/null @@ -1,25 +0,0 @@ - -
-

- -

- -## Search 搜索 - - - -指定条件对象进行搜索数据。 -
- -### 自定义搜索类型的内容 - - - -
diff --git a/example/src/docs/zh-CN/search/default-value.md b/example/src/docs/zh-CN/search/default-value.md deleted file mode 100644 index 6557e1820..000000000 --- a/example/src/docs/zh-CN/search/default-value.md +++ /dev/null @@ -1,27 +0,0 @@ - -
-

- -

- -## Search 搜索 - - - -指定条件对象进行搜索数据。 -
- -### 默认值搜索 - -可通过 `v-model` 配置组件默认搜索条件。 - - - -
diff --git a/example/src/docs/zh-CN/search/mini-mode.md b/example/src/docs/zh-CN/search/mini-mode.md deleted file mode 100644 index 2076e221c..000000000 --- a/example/src/docs/zh-CN/search/mini-mode.md +++ /dev/null @@ -1,27 +0,0 @@ - -
-

- -

- -## Search 搜索 - - - -指定条件对象进行搜索数据。 -
- -### 迷你模式 - -可通过 `mini` 设置组件为mini模式。 - - - -
diff --git a/example/src/docs/zh-CN/search/search-events.md b/example/src/docs/zh-CN/search/search-events.md deleted file mode 100644 index 743281dd3..000000000 --- a/example/src/docs/zh-CN/search/search-events.md +++ /dev/null @@ -1,35 +0,0 @@ - -
-

- -

- -## Search 搜索 - - - -指定条件对象进行搜索数据。 -
- -### 自定义 search 事件 - - - -### 自定义 change 事件 - - - -
- -### 自定义 select 事件 - - - -
diff --git a/example/src/docs/zh-CN/search/search-in-navigation-menu.md b/example/src/docs/zh-CN/search/search-in-navigation-menu.md deleted file mode 100644 index 54d089c2b..000000000 --- a/example/src/docs/zh-CN/search/search-in-navigation-menu.md +++ /dev/null @@ -1,26 +0,0 @@ - - -
-

- -

- -## Search 搜索 - - - -指定条件对象进行搜索数据。 -
- -### 事件 - - - -
diff --git a/example/src/docs/zh-CN/search/search-types.md b/example/src/docs/zh-CN/search/search-types.md deleted file mode 100644 index a2913029c..000000000 --- a/example/src/docs/zh-CN/search/search-types.md +++ /dev/null @@ -1,27 +0,0 @@ - -
-

- -

- -## Search 搜索 - - - -指定条件对象进行搜索数据。 -
- -### 搜索类型 - -可通过 `search-types` 配置组件可选的搜索类型。 - - - -
diff --git a/example/src/docs/zh-CN/search/show-selected-types.md b/example/src/docs/zh-CN/search/show-selected-types.md deleted file mode 100644 index 9119307b0..000000000 --- a/example/src/docs/zh-CN/search/show-selected-types.md +++ /dev/null @@ -1,27 +0,0 @@ - -
-

- -

- -## Search 搜索 - - - -指定条件对象进行搜索数据。 -
- -### 自定义搜索类型 - - - - - -
diff --git a/example/src/docs/zh-CN/search/transparent-mode.md b/example/src/docs/zh-CN/search/transparent-mode.md deleted file mode 100644 index 725ee0aae..000000000 --- a/example/src/docs/zh-CN/search/transparent-mode.md +++ /dev/null @@ -1,29 +0,0 @@ - -
-

- -

- -## Search 搜索 - - - -指定条件对象进行搜索数据。 -
- -### 透明模式 - -可通过 `transparent` 设置组件为透明模式(`mini`模式下有效)。 - - - - - -
diff --git a/example/src/docs/zh-CN/select/allow-create.md b/example/src/docs/zh-CN/select/allow-create.md deleted file mode 100644 index 11419906a..000000000 --- a/example/src/docs/zh-CN/select/allow-create.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### 创建条目 - -通过 `allow-create` 属性可通过在输入框中输入文字来创建选项中并不存在的新的条目。注意此时 `filterable` 属性必须为真。而`default-first-option` 属性设置为 true 后,通过按下回车就可以选中当前选项列表中的第一个选项,无需使用鼠标或键盘方向键进行定位。 - - - -
- - diff --git a/example/src/docs/zh-CN/select/automatic-select.md b/example/src/docs/zh-CN/select/automatic-select.md deleted file mode 100644 index eae24412c..000000000 --- a/example/src/docs/zh-CN/select/automatic-select.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### 获取焦点既弹出下拉菜单 - -设置 `automatic-dropdown` 属性为 true 后,对于不可搜索的 Select,在输入框获得焦点后将自动弹出选项菜单。 - - - -
- - diff --git a/example/src/docs/zh-CN/select/basic-usage.md b/example/src/docs/zh-CN/select/basic-usage.md deleted file mode 100644 index 403144365..000000000 --- a/example/src/docs/zh-CN/select/basic-usage.md +++ /dev/null @@ -1,40 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 - -:::warning -在大数据量场景,为了防止大量 dom 渲染开销导致页面卡顿,请使用 [嵌套 Grid](#/webnova/zh-CN/component/select/nest-grid) -::: - -
- -### 基本用法 - -`v-model` 的值为当前被选中的 `tiny-option` 的 `value` 属性值。 - - - -
- -### Select 属性 - - - -
- -### Option 属性 - - - -
- -### Option-Group 属性 - - diff --git a/example/src/docs/zh-CN/select/binding-obj.md b/example/src/docs/zh-CN/select/binding-obj.md deleted file mode 100644 index d17e05717..000000000 --- a/example/src/docs/zh-CN/select/binding-obj.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### 绑定值为对象 - -如果绑定值为对象时,则必须要配置 `value-key` 属性指定 value 唯一标识的键名。 - - - -
diff --git a/example/src/docs/zh-CN/select/cache-usage.md b/example/src/docs/zh-CN/select/cache-usage.md deleted file mode 100644 index f2ca694b2..000000000 --- a/example/src/docs/zh-CN/select/cache-usage.md +++ /dev/null @@ -1,26 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### 配置方式 - -通过设置 `cache-op` 开启缓存功能并且通过 `options` 设置下来选项。 - - - -
- -### 插槽方式 - -通过 slot 设置列表渲染组件为 `vue-option` 来输出下拉列表,则需要手动加入缓存功能。 - - - diff --git a/example/src/docs/zh-CN/select/clear-options.md b/example/src/docs/zh-CN/select/clear-options.md deleted file mode 100644 index 5910370e3..000000000 --- a/example/src/docs/zh-CN/select/clear-options.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 - -
- -### 选项可清除 - -通过 `clearable` 属性可将选择器清空,鼠标悬停于选择器上时,会出现清除图标。需要注意的是,`clearable` 属性仅适用于单选。 - - - -
- -### name - -通过 `name` 属性可已设置 name 的属性 - - - -
diff --git a/example/src/docs/zh-CN/select/custom-empty-data-text.md b/example/src/docs/zh-CN/select/custom-empty-data-text.md deleted file mode 100644 index 45bcf3d96..000000000 --- a/example/src/docs/zh-CN/select/custom-empty-data-text.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### 自定义空数据显示文字 - -通过 `no-data-text` 属性可以自定义选项为空时显示的文字。 - - - -
diff --git a/example/src/docs/zh-CN/select/custom-no-result-text.md b/example/src/docs/zh-CN/select/custom-no-result-text.md deleted file mode 100644 index 88d74860f..000000000 --- a/example/src/docs/zh-CN/select/custom-no-result-text.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### 自定义无匹配搜索文字 - -通过 `no-match-text` 属性可自定义搜索条件无匹配时显示的文字。 - - - -
- - diff --git a/example/src/docs/zh-CN/select/custom-options.md b/example/src/docs/zh-CN/select/custom-options.md deleted file mode 100644 index 9ec77f9fb..000000000 --- a/example/src/docs/zh-CN/select/custom-options.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### 自定义下拉内容 - -通过 Option 的默认插槽实现,将自定义的 HTML 模板插入 `tiny-option` 的 slot 中即可。 - - - -
- - diff --git a/example/src/docs/zh-CN/select/custom-prefix.md b/example/src/docs/zh-CN/select/custom-prefix.md deleted file mode 100644 index 10efbacba..000000000 --- a/example/src/docs/zh-CN/select/custom-prefix.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### 自定义头部内容 - -通过 `prefix` 插槽自定义输入框头部内容。 - - - -
- - diff --git a/example/src/docs/zh-CN/select/dynamic-disable.md b/example/src/docs/zh-CN/select/dynamic-disable.md deleted file mode 100644 index 41d4c7fc9..000000000 --- a/example/src/docs/zh-CN/select/dynamic-disable.md +++ /dev/null @@ -1,34 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 - -
- -### 禁用 - -设置 `disabled` 属性后整个选择器不可用。 - - - -### 下拉选项某些项禁用 - -tiny-options 标签设置 `disabled` 属性后该选项不可用。 - - - -
- -### 下拉选项某些项默认选中且禁用 - -tiny-options 默认选中标签设置 `disabled` 属性后该选项禁用。 - - - -
\ No newline at end of file diff --git a/example/src/docs/zh-CN/select/filterable.md b/example/src/docs/zh-CN/select/filterable.md deleted file mode 100644 index 92a1cadf4..000000000 --- a/example/src/docs/zh-CN/select/filterable.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 - -
- -### 可搜索 - -通过 `filterable` 属性可启用搜索功能。默认情况下,Select 会找出所有 `label` 属性包含输入值的选项。如果希望使用其他的搜索逻辑,可以通过传入一个 `filter-method` 来实现。`filter-method` 为一个 Function,它会在输入值发生变化时调用,参数为当前输入值。 - - - -
- -### 搜索允许复制 - -搜索单选场景,不能复制输入框的内容,需要添加属性 `allow-copy` 才能复制。属性 `allow-copy` 默认为 `false`。 -在鼠标悬浮在输入框上时,按下鼠标左键并移动鼠标,可选中之前输入文本; -在鼠标悬浮在输入框上时,点击鼠标左键,还是原有行为,即输入内容变为 placeholder,内容清空,进入输入状态; - - diff --git a/example/src/docs/zh-CN/select/hide-select-input-border.md b/example/src/docs/zh-CN/select/hide-select-input-border.md deleted file mode 100644 index ca1a7591f..000000000 --- a/example/src/docs/zh-CN/select/hide-select-input-border.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### 隐藏搜索框边框 - - - -
- - diff --git a/example/src/docs/zh-CN/select/is-drop-inherit-width.md b/example/src/docs/zh-CN/select/is-drop-inherit-width.md deleted file mode 100644 index 4cc965988..000000000 --- a/example/src/docs/zh-CN/select/is-drop-inherit-width.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### 下拉列表跟随输入框宽度 - -通过 `is-drop-inherit-width` 属性设置下拉列表是否跟随输入框宽度。默认为 `false` 表示不跟随,内容可撑开下拉列表宽度,设置为 `true` 则跟随宽度。 - - - -
- - diff --git a/example/src/docs/zh-CN/select/manual-focus-blur.md b/example/src/docs/zh-CN/select/manual-focus-blur.md deleted file mode 100644 index 15cfedf0c..000000000 --- a/example/src/docs/zh-CN/select/manual-focus-blur.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 - -
- -### 手动获取焦点 - -通过调用 `focus()` 方法使 input 获取焦点。 - - - -
- -### 手动失去焦点 - -通过调用 `blur()` 方法使 input 失去焦点。 - - - -
diff --git a/example/src/docs/zh-CN/select/multi-select.md b/example/src/docs/zh-CN/select/multi-select.md deleted file mode 100644 index 3a75158e3..000000000 --- a/example/src/docs/zh-CN/select/multi-select.md +++ /dev/null @@ -1,35 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### 多选 - -通过 `multiple` 属性启用多选功能,此时 `v-model` 的值为当前选中值所组成的数组。默认情况下选中值会以 Tag 的形式展现。 - - - -
- -### 折叠 Tag - -多选时通过设置 `collapse-tags` 属性将选中值合并为一段文字。 - - - -
- -### 选择个数限制 - -`multiple-limit` 属性可指定多选时用户最多可以选择的项目数,默认为 0 不限制。 - - - -
diff --git a/example/src/docs/zh-CN/select/nest-grid.md b/example/src/docs/zh-CN/select/nest-grid.md deleted file mode 100644 index bb8366a99..000000000 --- a/example/src/docs/zh-CN/select/nest-grid.md +++ /dev/null @@ -1,77 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 - -
- -### 嵌套单选 Grid - - - -
- -### 嵌套单选 Grid,可搜索,可清除 - - - -
- -### 嵌套多选 Grid - - - -
- - - -### text-field - -通过 `text-field` 属性可以设置下拉框的文本对应的数据源的字段名称。 - - - -
- -### value-field - -通过 `value-field` 属性可以下拉框的值所对应数据源的字段名称,下拉框的值用于提交到服务器。 - - - -
- -### 嵌套 Grid 数据项禁用 - -下拉表格多选模式,通过 `select-config` 配置项的属性 `checkMethod` ,传入自定义方法判断哪些数据项被禁用,方法会判断每个数据项,需返回值为 `true` 或者 `false`,代表此数据项启用或者禁用。下拉表格单选模式,通过 `radio-config` 配置项的属性 `checkMethod` ,传入自定义方法判断哪些数据项被禁用,方法会判断每个数据项,需返回值为 `true` 或者 `false`,代表此数据项启用或者禁用。 - - - -
- -### 嵌套 Grid 开启远程搜索(多选) -配置 `render-type` 为 `grid` 嵌套Grid;将 `filterable` 和 `remote` 设置为 `true`,同时传入 `remote-method` 方法,开启远程搜索。如需自动搜索和显示展开按钮,需设置 `remote-config` - - - -
- -### 嵌套 Grid 开启远程搜索(单选) - -配置 `render-type` 为 `grid` 嵌套Grid;将 `filterable` 和 `remote` 设置为 `true`,同时传入 `remote-method` 方法,开启远程搜索。如需自动搜索和显示展开按钮,需设置 `remote-config` - - - -
- -### 嵌套 Grid 且数据量大 - - - -
diff --git a/example/src/docs/zh-CN/select/nest-tree.md b/example/src/docs/zh-CN/select/nest-tree.md deleted file mode 100644 index 21301ae8f..000000000 --- a/example/src/docs/zh-CN/select/nest-tree.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### 嵌套单选 Tree - - - -
- -### 嵌套多选 Tree - - - -### 可搜索 tree - - - -
diff --git a/example/src/docs/zh-CN/select/optimization.md b/example/src/docs/zh-CN/select/optimization.md deleted file mode 100644 index e6bf56cc4..000000000 --- a/example/src/docs/zh-CN/select/optimization.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 - -
- -### 配置方式 - -通过 `options` 设置下拉选项并且设置 `optimization` 开启大数据虚拟滚动功能。使用标签配置选项时不支持开启虚拟滚动。 -多选模式下,最大选中项数 `multiple-limit` 默认值为 20,如果选中项比较多,建议开启 `collapse-tags` 进行折叠显示。 - - - - diff --git a/example/src/docs/zh-CN/select/option-group.md b/example/src/docs/zh-CN/select/option-group.md deleted file mode 100644 index df7694056..000000000 --- a/example/src/docs/zh-CN/select/option-group.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 - -
- -### 分组 - -使用 `tiny-option-group` 对备选项进行分组,它的 `label` 属性为分组名,使用 `disabled` 属性设置该分组下所有选项为禁用。 - - - -
- -### 分组禁用部分选项 - -使用 `tiny-option-group` 对备选项进行分组,禁用部分分组。 - - - -
diff --git a/example/src/docs/zh-CN/select/popup-style-position.md b/example/src/docs/zh-CN/select/popup-style-position.md deleted file mode 100644 index cafd2a078..000000000 --- a/example/src/docs/zh-CN/select/popup-style-position.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### 弹出框样式与定位 - -通过 `popper-class` 属性可自定义下拉弹框的样式。`popper-append-to-body` 指定是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false 。 - - - -
- - diff --git a/example/src/docs/zh-CN/select/remote-filter.md b/example/src/docs/zh-CN/select/remote-filter.md deleted file mode 100644 index da1d0400a..000000000 --- a/example/src/docs/zh-CN/select/remote-filter.md +++ /dev/null @@ -1,34 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 - -
- -### 远程搜索 - -为了启用远程搜索,需要将 `filterable` 和 `remote` 设置为 `true`,同时传入一个 `remote-method`。`remote-method` 为一个 Function,它会在输入值发生变化时调用,参数为当前输入值。`reserve-keyword` 属性在多选且可搜索时,可以在选中一个选项后保留当前的搜索关键词。 - - - -
- -### 获焦时触发远程搜索 - - - -
- -### 远程搜索允许复制 - -远程搜索单选场景,不能复制输入框的内容,需要添加属性 `allow-copy` 才能复制。属性 `allow-copy` 默认为 `false`。 -在鼠标悬浮在输入框上时,按下鼠标左键并移动鼠标,可选中之前输入文本; -在鼠标悬浮在输入框上时,点击鼠标左键,还是原有行为,即输入内容变为 placeholder,内容清空,进入输入状态; - - diff --git a/example/src/docs/zh-CN/select/searchable.md b/example/src/docs/zh-CN/select/searchable.md deleted file mode 100644 index 9f96b234b..000000000 --- a/example/src/docs/zh-CN/select/searchable.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 - -
- -### 下拉面板显示搜索框 - -通过 `searchable` 属性可启用下拉面板的搜索功能。 - - - -
diff --git a/example/src/docs/zh-CN/select/select-events.md b/example/src/docs/zh-CN/select/select-events.md deleted file mode 100644 index a93761ec3..000000000 --- a/example/src/docs/zh-CN/select/select-events.md +++ /dev/null @@ -1,37 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### change clear blur focus 事件 - -:::tip 事件说明 -change:选中值发生变化时触发,回调参数为目前的选中值 -clear:可清空的单选模式下用户点击清空按钮时触发 -blur:当 input 失去焦点时触发 -focus:当 input 获得焦点时触发 -scroll:当 select 下拉列表滚动时触发 -::: - - - -
- -### visible-change remove-tag 事件 - -:::tip 事件说明 -visible-change:下拉框出现/隐藏时触发,回调参数为:出现则为 true,隐藏则为 false -remove-tag:多选模式下移除tag时触发,回调参数为移除的 tag 值 -::: - - - -
- diff --git a/example/src/docs/zh-CN/select/select-size.md b/example/src/docs/zh-CN/select/select-size.md deleted file mode 100644 index 12aedc1e5..000000000 --- a/example/src/docs/zh-CN/select/select-size.md +++ /dev/null @@ -1,32 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### medium - -通过 `size` 属性定义输入框尺寸,可选项有 medium、small、mini 。 -通过 `options` 配置 Select 数据项,使用后不需要再配置 tiny-option。 - - - -
- -### small - - - -
- -### mini - - - -
diff --git a/example/src/docs/zh-CN/select/set-input-value.md b/example/src/docs/zh-CN/select/set-input-value.md deleted file mode 100644 index c0316b89a..000000000 --- a/example/src/docs/zh-CN/select/set-input-value.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### 改变输入框的值 - - - -
diff --git a/example/src/docs/zh-CN/select/show-alloption.md b/example/src/docs/zh-CN/select/show-alloption.md deleted file mode 100644 index bd3fa1a06..000000000 --- a/example/src/docs/zh-CN/select/show-alloption.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### 不展示全选选项 - -`show-alloption` 属性设置为 false 后将不展示 `全选` 选项,默认为 true 。 - - - -
diff --git a/example/src/docs/zh-CN/select/show-tip.md b/example/src/docs/zh-CN/select/show-tip.md deleted file mode 100644 index 6819e1ad0..000000000 --- a/example/src/docs/zh-CN/select/show-tip.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### Tip 提示 - -设置 `show-overflow-tooltip` 属性后,多选 Tag 折叠时,鼠标悬停到带有 `...` 的 Tag 会提示全部内容。 - - - -
diff --git a/example/src/docs/zh-CN/select/slot-select.md b/example/src/docs/zh-CN/select/slot-select.md deleted file mode 100644 index 5ddcc646b..000000000 --- a/example/src/docs/zh-CN/select/slot-select.md +++ /dev/null @@ -1,38 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 - -
- -### 默认插槽 - -通过 `default` 使用默认插槽。 - - - -
- -### 底部插槽 - -通过 `footer` 使用底部插槽。 - - - -
- -### 空数据插槽 - -通过 `empty` 设置没有数据时显示的提示语。 - - - -
- - diff --git a/example/src/docs/zh-CN/select/tag-copy-all.md b/example/src/docs/zh-CN/select/tag-copy-all.md deleted file mode 100644 index 551b52d2c..000000000 --- a/example/src/docs/zh-CN/select/tag-copy-all.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### Select选择器选项支持复制所有 - -设置 `copyable` 属性后,可以复制所有的 `tag` 文本内容以逗号分隔 - - - -
diff --git a/example/src/docs/zh-CN/select/tag-copy.md b/example/src/docs/zh-CN/select/tag-copy.md deleted file mode 100644 index 939304fc0..000000000 --- a/example/src/docs/zh-CN/select/tag-copy.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### Select选择器选项可复制 - -设置 `tag-selectable` 属性后,输入框中已选择的选项可通过鼠标选择,然后按 Ctrl + C 或右键进行复制。 - - - -
diff --git a/example/src/docs/zh-CN/select/upgrade-guide.md b/example/src/docs/zh-CN/select/upgrade-guide.md deleted file mode 100644 index 3f17b2f4e..000000000 --- a/example/src/docs/zh-CN/select/upgrade-guide.md +++ /dev/null @@ -1,29 +0,0 @@ -
-

- -

- -## Select 选择器 - - - -Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。 -
- -### 升级指导 - -#### 服务请求前事件 - -TINY 2 的 Dropdown 下拉框事件中存在 `beforeRequest` 事件,经常被用于在请求服务前对参数等内容进行干预。 - -```js -beforeRequest: function (source, controller) { - source.data = { - id: 1 - } -} -``` - -但在 TINY 3 中不存在 Dropdown 下拉框,一般使用 Select 选择器组件进行替代,而该组件中并没有 `beforeRequest` 事件,那么若需要在请求服务前进行干预,需要怎么做呢?

- -思路:在 Select 组件中通过 `tiny-option` 组件或者 `options` 属性设置数据,那么在请求服务前,就可以直接进行干预,不用任何事件。 diff --git a/example/src/docs/zh-CN/slide-bar/basic-usage.md b/example/src/docs/zh-CN/slide-bar/basic-usage.md deleted file mode 100644 index c281519d9..000000000 --- a/example/src/docs/zh-CN/slide-bar/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## SlideBar 滚动块 - - - -SlideBar 滚动块,可以用作文字块的滑动。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/slide-bar/custom-content.md b/example/src/docs/zh-CN/slide-bar/custom-content.md deleted file mode 100644 index 134c2730e..000000000 --- a/example/src/docs/zh-CN/slide-bar/custom-content.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## SlideBar 滚动块 - - - -SlideBar 滚动块,可以用作文字块的滑动。 -
- -### 自定义滚动块内容 - -通过插槽自定义滚动块内容。 - - - -
diff --git a/example/src/docs/zh-CN/slide-bar/custom-tag.md b/example/src/docs/zh-CN/slide-bar/custom-tag.md deleted file mode 100644 index 584de12d9..000000000 --- a/example/src/docs/zh-CN/slide-bar/custom-tag.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## SlideBar 滚动块 - - - -SlideBar 滚动块,可以用作文字块的滑动。 -
- -### 自定义 DOM 标签 - -可通过 `tag sub-tag` 自定义 DOM 标签。 - - - -
diff --git a/example/src/docs/zh-CN/slide-bar/slide-bar-events.md b/example/src/docs/zh-CN/slide-bar/slide-bar-events.md deleted file mode 100644 index bbf527b3a..000000000 --- a/example/src/docs/zh-CN/slide-bar/slide-bar-events.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## SlideBar 滚动块 - - - -SlideBar 滚动块,可以用作文字块的滑动。 -
- -### 滚动块事件 - - - -
diff --git a/example/src/docs/zh-CN/slide-bar/wheel-blocks.md b/example/src/docs/zh-CN/slide-bar/wheel-blocks.md deleted file mode 100644 index 01aa6c344..000000000 --- a/example/src/docs/zh-CN/slide-bar/wheel-blocks.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## SlideBar 滚动块 - - - -SlideBar 滚动块,可以用作文字块的滑动。 -
- -### 每次滚动块数 - -可通过 `wheel-blocks` 设置每次滚动块数。 -可通过 `value` 调用服务时候获取数据的来源 - - - -
diff --git a/example/src/docs/zh-CN/slider/about-step.md b/example/src/docs/zh-CN/slider/about-step.md deleted file mode 100644 index 3959b4083..000000000 --- a/example/src/docs/zh-CN/slider/about-step.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 步长 - -通过设置`step`来配置滑块滑动的步长 - - - -
diff --git a/example/src/docs/zh-CN/slider/basic-usage.md b/example/src/docs/zh-CN/slider/basic-usage.md deleted file mode 100644 index 29ffc7735..000000000 --- a/example/src/docs/zh-CN/slider/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/slider/dynamic-disable.md b/example/src/docs/zh-CN/slider/dynamic-disable.md deleted file mode 100644 index 0360469a2..000000000 --- a/example/src/docs/zh-CN/slider/dynamic-disable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 禁用 - -通过设置属性`disabled` ,设置滑动滑块禁止滑动 - - - -
diff --git a/example/src/docs/zh-CN/slider/max-min.md b/example/src/docs/zh-CN/slider/max-min.md deleted file mode 100644 index 710fe4d48..000000000 --- a/example/src/docs/zh-CN/slider/max-min.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 - -
- -### 最大最小值 - -通过设置`min` `max` 来设置滑块取值范围 - - - -
- -### 当前值 - -通过设置`format-tooltip` 来属性设置 value - - - -
diff --git a/example/src/docs/zh-CN/slider/range-select.md b/example/src/docs/zh-CN/slider/range-select.md deleted file mode 100644 index 49b25983f..000000000 --- a/example/src/docs/zh-CN/slider/range-select.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 范围选择 - -通过`v-model` 为数组 设定初始范围选择 - - - -
diff --git a/example/src/docs/zh-CN/slider/shortcut-operation.md b/example/src/docs/zh-CN/slider/shortcut-operation.md deleted file mode 100644 index 44245165c..000000000 --- a/example/src/docs/zh-CN/slider/shortcut-operation.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 快捷键操作 - -设置总步数,即按快捷键 PageDown/PageUp 时,每次移动的距离是(最大值-最小值)/分页数 - - - -
diff --git a/example/src/docs/zh-CN/slider/show-input.md b/example/src/docs/zh-CN/slider/show-input.md deleted file mode 100644 index 42b9f6484..000000000 --- a/example/src/docs/zh-CN/slider/show-input.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 输入框模式 - -通过配置`show-input`,开启滑块输入框模式 - - - -
diff --git a/example/src/docs/zh-CN/slider/show-tip.md b/example/src/docs/zh-CN/slider/show-tip.md deleted file mode 100644 index f3eb02fd0..000000000 --- a/example/src/docs/zh-CN/slider/show-tip.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 提示 - -通过设定`:show-tip="false"`,关闭滑块提示。(默认开启) - - - -
diff --git a/example/src/docs/zh-CN/slider/slider-events.md b/example/src/docs/zh-CN/slider/slider-events.md deleted file mode 100644 index 8cd4f7b4b..000000000 --- a/example/src/docs/zh-CN/slider/slider-events.md +++ /dev/null @@ -1,31 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 事件 - -

change 事件

- - - -
- -

start 滑块开始滑动事件

- - - -
- -

stop 滑块停止滑动事件

- - - -
diff --git a/example/src/docs/zh-CN/slider/slider-slot.md b/example/src/docs/zh-CN/slider/slider-slot.md deleted file mode 100644 index 766642805..000000000 --- a/example/src/docs/zh-CN/slider/slider-slot.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 自定义插槽 - - - -
- diff --git a/example/src/docs/zh-CN/slider/vertical-mode.md b/example/src/docs/zh-CN/slider/vertical-mode.md deleted file mode 100644 index 4635c9e75..000000000 --- a/example/src/docs/zh-CN/slider/vertical-mode.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Slider 滑块 - - - -通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 -
- -### 竖向模式 - -通过设置`vertical` 属性来展示滑块竖向模式(不设置,默认为横向模式) -竖向模式可以通过 `height` 设置组件高度 - - - -
diff --git a/example/src/docs/zh-CN/split/basic-usage.md b/example/src/docs/zh-CN/split/basic-usage.md deleted file mode 100644 index 94cfe1126..000000000 --- a/example/src/docs/zh-CN/split/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Split 面板分割 - - - -常用于将一片区域,分割为可以拖拽调整宽度或高度的两部分区域。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/split/nested-use.md b/example/src/docs/zh-CN/split/nested-use.md deleted file mode 100644 index 9ce25e5c2..000000000 --- a/example/src/docs/zh-CN/split/nested-use.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Split 面板分割 - - - -常用于将一片区域,分割为可以拖拽调整宽度或高度的两部分区域。 -
- -### 嵌套使用 - - - -
diff --git a/example/src/docs/zh-CN/split/split-events.md b/example/src/docs/zh-CN/split/split-events.md deleted file mode 100644 index dd62123e9..000000000 --- a/example/src/docs/zh-CN/split/split-events.md +++ /dev/null @@ -1,35 +0,0 @@ -
-

- -

- -## Split 面板分割 - - - -常用于将一片区域,分割为可以拖拽调整宽度或高度的两部分区域。 -
- -### movestart 事件 - -开始移动事件 - - - -
- -### moving 事件 - -移动中事件 - - - -
- -### moveend 事件 - -移动完成事件 - - - -
diff --git a/example/src/docs/zh-CN/split/split-mode.md b/example/src/docs/zh-CN/split/split-mode.md deleted file mode 100644 index f8a0e0e6e..000000000 --- a/example/src/docs/zh-CN/split/split-mode.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Split 面板分割 - - - -常用于将一片区域,分割为可以拖拽调整宽度或高度的两部分区域。 -
- -### 分割方式 - -同个mode设置分割类型,可选值为 `horizontal`(横向) 或 `vertical`(纵向);默认值`horizontal`。 - - - -### 不可拖拽 - - - -
diff --git a/example/src/docs/zh-CN/split/split-slot.md b/example/src/docs/zh-CN/split/split-slot.md deleted file mode 100644 index 3659af0cc..000000000 --- a/example/src/docs/zh-CN/split/split-slot.md +++ /dev/null @@ -1,29 +0,0 @@ -
-

- -

- -## Split 面板分割 - - - -常用于将一片区域,分割为可以拖拽调整宽度或高度的两部分区域。 -
- -### 左右面板插槽 - - - -
- -### 上下面板插槽 - - - -
- -### 拖拽插槽 - - - -
diff --git a/example/src/docs/zh-CN/split/split-threshold.md b/example/src/docs/zh-CN/split/split-threshold.md deleted file mode 100644 index c8764123a..000000000 --- a/example/src/docs/zh-CN/split/split-threshold.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Split 面板分割 - - - -常用于将一片区域,分割为可以拖拽调整宽度或高度的两部分区域。 -
- -### 面板阈值 - - - -
diff --git a/example/src/docs/zh-CN/steps/advanced-steps.md b/example/src/docs/zh-CN/steps/advanced-steps.md deleted file mode 100644 index 017ce90a1..000000000 --- a/example/src/docs/zh-CN/steps/advanced-steps.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Steps 步骤条 - - -
- -### 高级向导 - -设置 `type` 为 `advanced` 启用高级向导功能。 - - - -
diff --git a/example/src/docs/zh-CN/steps/basic-usage.md b/example/src/docs/zh-CN/steps/basic-usage.md deleted file mode 100644 index fa88b1fbd..000000000 --- a/example/src/docs/zh-CN/steps/basic-usage.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Steps 步骤条 - - -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/steps/custom-steps-item.md b/example/src/docs/zh-CN/steps/custom-steps-item.md deleted file mode 100644 index d32cc3f54..000000000 --- a/example/src/docs/zh-CN/steps/custom-steps-item.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Steps 步骤条 - - -
- -### 自定义数据项 - -默认情况下,绑定数据的子对象包含 name、count、status 字段。 -`name-field`:设置节点信息中名称对应的字段名,默认为 'name' 。 -`count-field`:设置高级向导里徽标计数对应的字段名,默认为 'count' 。 -`status-field`:设置数据状态对应的字段名,默认为 'status' 。 - - - -
diff --git a/example/src/docs/zh-CN/steps/data-resource.md b/example/src/docs/zh-CN/steps/data-resource.md deleted file mode 100644 index 1d768c743..000000000 --- a/example/src/docs/zh-CN/steps/data-resource.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Steps 步骤条 - - -
- -### 数据源 - -通过 `data` 属性配置步骤条数据源。 - - - -
diff --git a/example/src/docs/zh-CN/steps/normal-steps.md b/example/src/docs/zh-CN/steps/normal-steps.md deleted file mode 100644 index a5e15dfee..000000000 --- a/example/src/docs/zh-CN/steps/normal-steps.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Steps 步骤条 - - -
- -### 普通步骤条 - -使用 `tiny-time-line` 标签,并设置 `type` 为 `normal` 实现普通步骤条。 - - - -
diff --git a/example/src/docs/zh-CN/steps/order-progress.md b/example/src/docs/zh-CN/steps/order-progress.md deleted file mode 100644 index 89e62a5f8..000000000 --- a/example/src/docs/zh-CN/steps/order-progress.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Steps 步骤条 - - -
- -### 订单流程 - -通过 Steps 组件模拟订单流程。 - - - -
diff --git a/example/src/docs/zh-CN/steps/steps-event.md b/example/src/docs/zh-CN/steps/steps-event.md deleted file mode 100644 index 362af6633..000000000 --- a/example/src/docs/zh-CN/steps/steps-event.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Steps 步骤条 - - -
- -### 点击事件 - -点击节点时触发 `click` 事件。 - - - -
diff --git a/example/src/docs/zh-CN/steps/steps-slot.md b/example/src/docs/zh-CN/steps/steps-slot.md deleted file mode 100644 index cf1c37ed5..000000000 --- a/example/src/docs/zh-CN/steps/steps-slot.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Steps 步骤条 - - -
- -### 插槽的使用 - -通过作用域插槽 `item` 自定义步骤条节点内容。 - - - -
diff --git a/example/src/docs/zh-CN/steps/timeline-steps.md b/example/src/docs/zh-CN/steps/timeline-steps.md deleted file mode 100644 index c66c8504d..000000000 --- a/example/src/docs/zh-CN/steps/timeline-steps.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Steps 步骤条 - - -
- -### 时间线步骤条 - -使用 `tiny-time-line` 标签,并设置 `type` 为 `timeline` 实现时间线步骤条。同时若配置 `vertical` 属性,时间线步骤条将变成竖向模式,而若再配置 `reverse` 属性,则还可以实现时间线步骤条竖向模式的反向形式。 - - - -
diff --git a/example/src/docs/zh-CN/switch/basic-usage.md b/example/src/docs/zh-CN/switch/basic-usage.md deleted file mode 100644 index eb6b91e84..000000000 --- a/example/src/docs/zh-CN/switch/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Switch 开关 - - - -Switch 在两种状态间切换选择。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/switch/custom-open-close.md b/example/src/docs/zh-CN/switch/custom-open-close.md deleted file mode 100644 index b35bc0564..000000000 --- a/example/src/docs/zh-CN/switch/custom-open-close.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Switch 开关 - - - -通过具名插槽 open 和 close 自定义 Switch 显示。 -
- -### 自定义开关显示 - - - -
diff --git a/example/src/docs/zh-CN/switch/custom-true-false-value.md b/example/src/docs/zh-CN/switch/custom-true-false-value.md deleted file mode 100644 index 2b9d70fc8..000000000 --- a/example/src/docs/zh-CN/switch/custom-true-false-value.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Switch 开关 - - - -通过 true-value 和 false-value 属性设置 Switch 在开和关状态下的不同取值。 -
- -### 自定义开关取值 - -`false-value` 属性表示的是关闭时取付给 `false-value` 的值。 -`true-value` 属性表示的是开启时取付给 `true-value` 的值,v-model里定义的属性名是 `value` 时就能拿的到 `true-value` 或`false-value` 里的值。 - - - -
diff --git a/example/src/docs/zh-CN/switch/dynamic-disable.md b/example/src/docs/zh-CN/switch/dynamic-disable.md deleted file mode 100644 index 656914823..000000000 --- a/example/src/docs/zh-CN/switch/dynamic-disable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Switch 开关 - - - -通过 disabled 属性设置 Switch 禁用状态。 -
- -### 禁用状态 - -`disable` 属性表示的是当前状态是无法被使用的,默认值为false(true/false)。 - - - -
diff --git a/example/src/docs/zh-CN/switch/enent.md b/example/src/docs/zh-CN/switch/enent.md deleted file mode 100644 index 01f45f4c8..000000000 --- a/example/src/docs/zh-CN/switch/enent.md +++ /dev/null @@ -1,16 +0,0 @@ -
-

- -

- -## Switch 开关 - - -
- -### Switch事件 - -可在 `switch` 组件上设置 change 事件,当绑定值变化时触发 - - -
diff --git a/example/src/docs/zh-CN/switch/mini-mode.md b/example/src/docs/zh-CN/switch/mini-mode.md deleted file mode 100644 index e96f7464e..000000000 --- a/example/src/docs/zh-CN/switch/mini-mode.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Switch 开关 - - - -设置是否显示为 mini 模式,默认为 false。当设置 `mini` 为 `true` 时,不会显示文字提示。 -
- -### 迷你尺寸 - - - -
diff --git a/example/src/docs/zh-CN/tabs/basic-usage.md b/example/src/docs/zh-CN/tabs/basic-usage.md deleted file mode 100644 index 2de3ef0f9..000000000 --- a/example/src/docs/zh-CN/tabs/basic-usage.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - - -分隔内容上有关联但属于不同类别的数据集合。 -
- -### 基本用法 - -通过 `v-model` 设置初始激活的标签页,绑定的值对应 `tiny-tab-item` 元素中 `name` 属性的值。一个 `tiny-tab-item` 为一个标签页,通过 `title` 属性设置标签页标题。 - - - -
- - diff --git a/example/src/docs/zh-CN/tabs/before-leave.md b/example/src/docs/zh-CN/tabs/before-leave.md deleted file mode 100644 index b2985b6b0..000000000 --- a/example/src/docs/zh-CN/tabs/before-leave.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - - -分隔内容上有关联但属于不同类别的数据集合。 -
- -### 离开前事件 - -`before-leave` 切换标签之前的钩子函数,若返回 false 或者返回 Promise 且被 reject,则阻止切换,返回 true 则可以切换。 - - - -
diff --git a/example/src/docs/zh-CN/tabs/custom-tab-content.md b/example/src/docs/zh-CN/tabs/custom-tab-content.md deleted file mode 100644 index 95f947fad..000000000 --- a/example/src/docs/zh-CN/tabs/custom-tab-content.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - - -分隔内容上有关联但属于不同类别的数据集合。 -
- -### 自定义标签页内容 - - - -
diff --git a/example/src/docs/zh-CN/tabs/custom-tab-title.md b/example/src/docs/zh-CN/tabs/custom-tab-title.md deleted file mode 100644 index 1961d2b88..000000000 --- a/example/src/docs/zh-CN/tabs/custom-tab-title.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - - -分隔内容上有关联但属于不同类别的数据集合。 -
- -### 自定义标签页标题 - -通过 `tiny-tab-item` 的 `title` 插槽自定义标签页标题,比如在标题前增加图标。 - - - -
- -### 循环创建标签页 - -通过 `v-for` 根据数据循环创建多个 `tiny-tab-item` 。 - - - -
diff --git a/example/src/docs/zh-CN/tabs/position.md b/example/src/docs/zh-CN/tabs/position.md deleted file mode 100644 index efd5620f6..000000000 --- a/example/src/docs/zh-CN/tabs/position.md +++ /dev/null @@ -1,31 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - - -分隔内容上有关联但属于不同类别的数据集合。 -
- -### top 显示位置 - -通过 `position` 属性设置标签页显示位置,可选值有 `top`、`right`、`bottom`、`left`,默认为 `top` 。 - - - -### 右侧显示 - - - -### 下方显示 (不符合 Tiny 规范) - - - -### 左侧显示 - - - -
diff --git a/example/src/docs/zh-CN/tabs/prevent-tab-switching.md b/example/src/docs/zh-CN/tabs/prevent-tab-switching.md deleted file mode 100644 index 73e7c139d..000000000 --- a/example/src/docs/zh-CN/tabs/prevent-tab-switching.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - - -分隔内容上有关联但属于不同类别的数据集合。 -
- -### 阻止标签页切换 - - - -
diff --git a/example/src/docs/zh-CN/tabs/show-different-grid-data.md b/example/src/docs/zh-CN/tabs/show-different-grid-data.md deleted file mode 100644 index 3364e668d..000000000 --- a/example/src/docs/zh-CN/tabs/show-different-grid-data.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - - -分隔内容上有关联但属于不同类别的数据集合。 -
- -### 标签页切换不同 Grid - -> Tabs 组件里使用 Grid 组件需要 Grid 设置属性 `:auto-resize="true"`,这样才能让 Grid 自适应父元素响应变化。 - - - -
diff --git a/example/src/docs/zh-CN/tabs/stretch-wh.md b/example/src/docs/zh-CN/tabs/stretch-wh.md deleted file mode 100644 index f8c8e6ddb..000000000 --- a/example/src/docs/zh-CN/tabs/stretch-wh.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - - -分隔内容上有关联但属于不同类别的数据集合。 -
- -### 可自动撑开 - -`stretch` 属性设置标签的宽度是否自撑开,默认为 false 。 - - - -
diff --git a/example/src/docs/zh-CN/tabs/tab-style.md b/example/src/docs/zh-CN/tabs/tab-style.md deleted file mode 100644 index b7bd6ae41..000000000 --- a/example/src/docs/zh-CN/tabs/tab-style.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - - -分隔内容上有关联但属于不同类别的数据集合。 -
- -### card 类型 - -通过 `tab-style` 设置标签页风格类型,默认为 `card` 通过 `active-name` 设置初始激活的标签页 。 - - - -### bordercard 类型 - -通过 `tab-style` 设置标签页风格类型为 `bordercard` 。 - - - -
diff --git a/example/src/docs/zh-CN/tabs/tabs-events.md b/example/src/docs/zh-CN/tabs/tabs-events.md deleted file mode 100644 index b73fee8d1..000000000 --- a/example/src/docs/zh-CN/tabs/tabs-events.md +++ /dev/null @@ -1,37 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - - -分隔内容上有关联但属于不同类别的数据集合。 -
- -### add 事件 - -点击新增按钮增加标签页时触发 `add` 事件 - - - -### click 事件 - -单击标签页时触发 `click` 事件 - - - -### close 事件 - -关闭标签页时触发 `close` 事件 - - - -### edit 事件 - -点击新增按钮增加标签页 或 标签页被关闭后触发 `edit` 事件 - - - -
diff --git a/example/src/docs/zh-CN/tabs/tabs-size.md b/example/src/docs/zh-CN/tabs/tabs-size.md deleted file mode 100644 index 658fdf9e0..000000000 --- a/example/src/docs/zh-CN/tabs/tabs-size.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - - -分隔内容上有关联但属于不同类别的数据集合。 -
- -### 尺寸 - - - -
diff --git a/example/src/docs/zh-CN/tabs/with-add.md b/example/src/docs/zh-CN/tabs/with-add.md deleted file mode 100644 index bd92a19e8..000000000 --- a/example/src/docs/zh-CN/tabs/with-add.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - - -分隔内容上有关联但属于不同类别的数据集合。 -
- -### 标签页可增加 - -设置 `with-add` 属性启用标签可增加功能。同时通过 `add` 事件自定义实现增加标签页的逻辑。配置 `show-more-tabs` 属性后当标签页超过一定宽度时将显示 `更多` 按钮。 - - - -
diff --git a/example/src/docs/zh-CN/tabs/with-close.md b/example/src/docs/zh-CN/tabs/with-close.md deleted file mode 100644 index c61f87bf8..000000000 --- a/example/src/docs/zh-CN/tabs/with-close.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tabs 标签页 - - - -分隔内容上有关联但属于不同类别的数据集合。 -
- -### 标签页可关闭 - -通过 `withClose` 属性设置是否可关闭标签页。同时可通过 `close` 事件自定义实现关闭标签页的逻辑。 - - - -
diff --git a/example/src/docs/zh-CN/tag/basic-usage.md b/example/src/docs/zh-CN/tag/basic-usage.md deleted file mode 100644 index 72dd6a926..000000000 --- a/example/src/docs/zh-CN/tag/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tag 标签 - - - -Tag 标签组件,用于标记事物的属性和维度 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/tag/color-border.md b/example/src/docs/zh-CN/tag/color-border.md deleted file mode 100644 index e7f274a3a..000000000 --- a/example/src/docs/zh-CN/tag/color-border.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## Tag 标签 - - - -Tag 标签组件,用于标记事物的属性和维度 -
- -### 颜色 - -可通过 `color` 设置标签背景色。 - - - -
- -### 边框 - -可通过 `hit` 设置标签边框,可选值(true/false)true为有边框,false无边框,默认值为 false。 - - - -
diff --git a/example/src/docs/zh-CN/tag/create-and-close.md b/example/src/docs/zh-CN/tag/create-and-close.md deleted file mode 100644 index ce44a853e..000000000 --- a/example/src/docs/zh-CN/tag/create-and-close.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Tag 标签 - - - -Tag 标签组件,用于标记事物的属性和维度 -
- -### 动态编辑标签 - -通过点击`+ New Tag`在文本框中输入你要定义的标签名就能在标签列表中最后一个创建标签 。`closable` 属性可以为标签设置成可去除标签。 - - - -
- -### 可移除标签 - - - -
diff --git a/example/src/docs/zh-CN/tag/tag-effect.md b/example/src/docs/zh-CN/tag/tag-effect.md deleted file mode 100644 index d52996b75..000000000 --- a/example/src/docs/zh-CN/tag/tag-effect.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Tag 标签 - - - -Tag 标签组件,用于标记事物的属性和维度 -
- -### 主题 - -可通过 `effect` 设置Tag标签主题,可选值(dark / light / plain)。 -`type`可以为标签设置相应的类型,可选值(success / info / warning / danger)。 - - - -
diff --git a/example/src/docs/zh-CN/tag/tag-events.md b/example/src/docs/zh-CN/tag/tag-events.md deleted file mode 100644 index 44a0c1bf9..000000000 --- a/example/src/docs/zh-CN/tag/tag-events.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## Tag 标签 - - - -Tag 标签组件,用于标记事物的属性和维度 -
- -### Click 事件 - - - -
- -### Close 事件 - - - -
diff --git a/example/src/docs/zh-CN/tag/tag-mode.md b/example/src/docs/zh-CN/tag/tag-mode.md deleted file mode 100644 index 1953a01ba..000000000 --- a/example/src/docs/zh-CN/tag/tag-mode.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## Tag 标签 - - - -Tag 标签组件,用于标记事物的属性和维度 -
- -### 基本用法 - - - -
diff --git a/example/src/docs/zh-CN/tag/tag-size.md b/example/src/docs/zh-CN/tag/tag-size.md deleted file mode 100644 index f6115bf7f..000000000 --- a/example/src/docs/zh-CN/tag/tag-size.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tag 标签 - - - -Tag 标签组件,用于标记事物的属性和维度 -
- -### 尺寸 - -可通过 `size` 设置Tag标签大小,可选值(medium / small / mini)。 - - - -
diff --git a/example/src/docs/zh-CN/textpopup/basic-usage.md b/example/src/docs/zh-CN/textpopup/basic-usage.md deleted file mode 100644 index 37342494f..000000000 --- a/example/src/docs/zh-CN/textpopup/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## TextPopup 输入框 - - - -TextPopup 输入框,提供数据绑定功能。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/textpopup/textpopup-label.md b/example/src/docs/zh-CN/textpopup/textpopup-label.md deleted file mode 100644 index 05ce80aa2..000000000 --- a/example/src/docs/zh-CN/textpopup/textpopup-label.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## TextPopup 输入框 - - - -TextPopup 输入框,提供数据绑定功能。 -
- -### 标签名 - -`label` 相当于取一个别名的意思,可通过 `value 或 v-model` 设置标签名。 - - -
diff --git a/example/src/docs/zh-CN/textpopup/textpopup-placeholder.md b/example/src/docs/zh-CN/textpopup/textpopup-placeholder.md deleted file mode 100644 index 7ee83c951..000000000 --- a/example/src/docs/zh-CN/textpopup/textpopup-placeholder.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## TextPopup 输入框 - - - -TextPopup 输入框,提供数据绑定功能。 -
- -### 提示占位文本 - -`placeholder` 属性的值为 `string` 此属性会把值默认显示到输入框中。 - - -
diff --git a/example/src/docs/zh-CN/textpopup/textpopup-readonly.md b/example/src/docs/zh-CN/textpopup/textpopup-readonly.md deleted file mode 100644 index ac299d2ea..000000000 --- a/example/src/docs/zh-CN/textpopup/textpopup-readonly.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## TextPopup 输入框 - - - -TextPopup 输入框,提供数据绑定功能。 -
- -### 只读 - -可通过 `readonly` 设置是否只读。 - - -
diff --git a/example/src/docs/zh-CN/textpopup/textpopup-separtor.md b/example/src/docs/zh-CN/textpopup/textpopup-separtor.md deleted file mode 100644 index 1ba88cbd4..000000000 --- a/example/src/docs/zh-CN/textpopup/textpopup-separtor.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## TextPopup 输入框 - - - -TextPopup 输入框,提供数据绑定功能。 -
- -### 分隔符 - -可通过 `separtor` 设置分隔符,在文本框中输入回车就是分隔符的位置。 - - -
diff --git a/example/src/docs/zh-CN/textpopup/textpopup-value.md b/example/src/docs/zh-CN/textpopup/textpopup-value.md deleted file mode 100644 index 194dda460..000000000 --- a/example/src/docs/zh-CN/textpopup/textpopup-value.md +++ /dev/null @@ -1,24 +0,0 @@ -
-

- -

- -## TextPopup 输入框 - - - -TextPopup 输入框,提供数据绑定功能。 -
- -### 绑定值 - -可通过 `value` 或 `v-model` 设置绑定值。 - - -
- -### 清除 value 值 - - - -
diff --git a/example/src/docs/zh-CN/textpopup/textpopup-width.md b/example/src/docs/zh-CN/textpopup/textpopup-width.md deleted file mode 100644 index 02dfef1c2..000000000 --- a/example/src/docs/zh-CN/textpopup/textpopup-width.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## TextPopup 输入框 - - - -TextPopup 输入框,提供数据绑定功能。 -
- -### 宽度 - -可通过 `width` 设置宽度。 - - -
diff --git a/example/src/docs/zh-CN/time-line/basic-usage.md b/example/src/docs/zh-CN/time-line/basic-usage.md deleted file mode 100644 index 451853072..000000000 --- a/example/src/docs/zh-CN/time-line/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## TimeLine 时间线 - - -
- -### 基本用法 - -通过 `data` 属性设置时间线步骤条数据,通过 `active` 属性设置步骤条的选中步骤。 - - - -
- - diff --git a/example/src/docs/zh-CN/time-line/custom-normal-step.md b/example/src/docs/zh-CN/time-line/custom-normal-step.md deleted file mode 100644 index 083f4969f..000000000 --- a/example/src/docs/zh-CN/time-line/custom-normal-step.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimeLine 时间线 - - -
- -### 自定义横向时间线 - -`slot` 为 `top`可以自定义步骤条顶部内容,`slot` 为 `bottom` 可以自定义步骤条底部内容。 - - - -
diff --git a/example/src/docs/zh-CN/time-line/custom-vertical-step.md b/example/src/docs/zh-CN/time-line/custom-vertical-step.md deleted file mode 100644 index 8915313c3..000000000 --- a/example/src/docs/zh-CN/time-line/custom-vertical-step.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimeLine 时间线 - - -
- -### 自定义竖向时间线 - -`slot` 为 `left`可以自定义步骤条左侧内容,`slot` 为 `right` 可以自定义步骤条右侧内容。 - - - -
diff --git a/example/src/docs/zh-CN/time-line/different-data.md b/example/src/docs/zh-CN/time-line/different-data.md deleted file mode 100644 index a894b7ee7..000000000 --- a/example/src/docs/zh-CN/time-line/different-data.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimeLine 时间线 - - -
- -### 数据映射 - -通过 `name-field` 属性设置节点信息中名称对应的字段名,通过 `time-field` 属性设置节点时间信息对应的字段名。 - - - -
diff --git a/example/src/docs/zh-CN/time-line/event.md b/example/src/docs/zh-CN/time-line/event.md deleted file mode 100644 index bb4b088a5..000000000 --- a/example/src/docs/zh-CN/time-line/event.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## TimeLine 时间线 - - - -
- -### click 事件 - -单击时触发 click 事件 - - - -
diff --git a/example/src/docs/zh-CN/time-line/set-start-value.md b/example/src/docs/zh-CN/time-line/set-start-value.md deleted file mode 100644 index 4afdf7ce5..000000000 --- a/example/src/docs/zh-CN/time-line/set-start-value.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimeLine 时间线 - - -
- -### 设置序号起始值 - -通过 `start` 属性设置步骤条序号起始值。 - - - -
diff --git a/example/src/docs/zh-CN/time-line/set-step-width.md b/example/src/docs/zh-CN/time-line/set-step-width.md deleted file mode 100644 index 2047a7677..000000000 --- a/example/src/docs/zh-CN/time-line/set-step-width.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimeLine 时间线 - - -
- -### 宽度设置 - -通过 `space`属性设置步骤条的宽度。 - - - -
diff --git a/example/src/docs/zh-CN/time-line/show-number.md b/example/src/docs/zh-CN/time-line/show-number.md deleted file mode 100644 index 1eca75876..000000000 --- a/example/src/docs/zh-CN/time-line/show-number.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimeLine 时间线 - - -
- -### 未完成的序号显示 - -通过 `show-number` 属性设置未完成的状态是否显示序号。 - - - -
diff --git a/example/src/docs/zh-CN/time-line/show-status.md b/example/src/docs/zh-CN/time-line/show-status.md deleted file mode 100644 index 5f791bc10..000000000 --- a/example/src/docs/zh-CN/time-line/show-status.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimeLine 时间线 - - -
- -### 显示组件内部状态 - -通过 `show-status` 属性设置是否显示组件内部状态。默认为 `false`,表示不显示。 - - - -
diff --git a/example/src/docs/zh-CN/time-line/vertical-step.md b/example/src/docs/zh-CN/time-line/vertical-step.md deleted file mode 100644 index 89f06aab1..000000000 --- a/example/src/docs/zh-CN/time-line/vertical-step.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## TimeLine 时间线 - - -
- -### 竖向时间线 - -通过 `vertical` 属性设置竖向时间线。 - - - -
- -### 竖向时间线的方向 - -通过 `reverse` 属性设置竖向步骤条的方向。 - - - -
diff --git a/example/src/docs/zh-CN/time-picker/about-clear.md b/example/src/docs/zh-CN/time-picker/about-clear.md deleted file mode 100644 index b6d8d071f..000000000 --- a/example/src/docs/zh-CN/time-picker/about-clear.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 清除输入 - - - -
diff --git a/example/src/docs/zh-CN/time-picker/about-format.md b/example/src/docs/zh-CN/time-picker/about-format.md deleted file mode 100644 index f94dc5a17..000000000 --- a/example/src/docs/zh-CN/time-picker/about-format.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 格式化相关 - - - -
- diff --git a/example/src/docs/zh-CN/time-picker/align.md b/example/src/docs/zh-CN/time-picker/align.md deleted file mode 100644 index 2f4188be1..000000000 --- a/example/src/docs/zh-CN/time-picker/align.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 对齐方式 - - - -
- diff --git a/example/src/docs/zh-CN/time-picker/arrow-control.md b/example/src/docs/zh-CN/time-picker/arrow-control.md deleted file mode 100644 index 36fb1f62c..000000000 --- a/example/src/docs/zh-CN/time-picker/arrow-control.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 箭头选择 - -`arrow-control` 属性设置是否使用箭头进行时间选择,仅对 `` 有效 - - - -
diff --git a/example/src/docs/zh-CN/time-picker/basic-usage.md b/example/src/docs/zh-CN/time-picker/basic-usage.md deleted file mode 100644 index 2f6163106..000000000 --- a/example/src/docs/zh-CN/time-picker/basic-usage.md +++ /dev/null @@ -1,31 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 基本用法 - - - -
- - - -
- -### Time Picker Options - - - -
- -### Date Format - - diff --git a/example/src/docs/zh-CN/time-picker/clear-icon.md b/example/src/docs/zh-CN/time-picker/clear-icon.md deleted file mode 100644 index 859491f62..000000000 --- a/example/src/docs/zh-CN/time-picker/clear-icon.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 清除输入 - -通过 `clear-icon` 自定义清空图标 - - - -
- -### 清除按钮 - -通过 `clearable` 属性设置是否显示清除按钮,默认值为 true - - - -
diff --git a/example/src/docs/zh-CN/time-picker/custom-range.md b/example/src/docs/zh-CN/time-picker/custom-range.md deleted file mode 100644 index 39019c6c5..000000000 --- a/example/src/docs/zh-CN/time-picker/custom-range.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 范围选择自定义相关 - - - -
- diff --git a/example/src/docs/zh-CN/time-picker/date-range-shortcuts.md b/example/src/docs/zh-CN/time-picker/date-range-shortcuts.md deleted file mode 100644 index 68f023395..000000000 --- a/example/src/docs/zh-CN/time-picker/date-range-shortcuts.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 日期范围快捷选项 - - - -
- diff --git a/example/src/docs/zh-CN/time-picker/date-range.md b/example/src/docs/zh-CN/time-picker/date-range.md deleted file mode 100644 index 1187bb806..000000000 --- a/example/src/docs/zh-CN/time-picker/date-range.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 选择日期范围 - - - -
- diff --git a/example/src/docs/zh-CN/time-picker/date-shortcuts.md b/example/src/docs/zh-CN/time-picker/date-shortcuts.md deleted file mode 100644 index 7ef9ceb56..000000000 --- a/example/src/docs/zh-CN/time-picker/date-shortcuts.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 选择日带快捷选项 - - - -
- diff --git a/example/src/docs/zh-CN/time-picker/date.md b/example/src/docs/zh-CN/time-picker/date.md deleted file mode 100644 index 37e54f3af..000000000 --- a/example/src/docs/zh-CN/time-picker/date.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 日期显示格式 - -`WW` 属性设置周,例如 01, `W` 属性设置不补 0。 - -`yyyy` 属性设置年,例如 2020。 - -`MM` 属性设置月,例如 01 `M` 属性设置不补 0。 - -`dd` 属性设置日,例如 01 `d` 属性设置不补 0。 - - - -
diff --git a/example/src/docs/zh-CN/time-picker/default-time-of-range.md b/example/src/docs/zh-CN/time-picker/default-time-of-range.md deleted file mode 100644 index b698c9a26..000000000 --- a/example/src/docs/zh-CN/time-picker/default-time-of-range.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 日期范围默认时刻 - - - -
- diff --git a/example/src/docs/zh-CN/time-picker/default-value.md b/example/src/docs/zh-CN/time-picker/default-value.md deleted file mode 100644 index 251cfa088..000000000 --- a/example/src/docs/zh-CN/time-picker/default-value.md +++ /dev/null @@ -1,35 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 选择器打开时默认时间设置 - -通过 `default-value` 设置选择器打开显示默认时间 - - - -
- -### 原生属性 - -通过 `name` 属性设置默认 name - - - -
- -### 下拉框的类名 - -通过 `popper-class` 属性设置下拉框的类名 - - - -
diff --git a/example/src/docs/zh-CN/time-picker/disabled.md b/example/src/docs/zh-CN/time-picker/disabled.md deleted file mode 100644 index 050e6d924..000000000 --- a/example/src/docs/zh-CN/time-picker/disabled.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - -
- -### 禁用 - - - -
diff --git a/example/src/docs/zh-CN/time-picker/editable.md b/example/src/docs/zh-CN/time-picker/editable.md deleted file mode 100644 index 0f445208f..000000000 --- a/example/src/docs/zh-CN/time-picker/editable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 文本框不可输入 - -日期输入框默认可以输入日期,设置 `editable` 为 false 后,将不能输入。 - - - -
diff --git a/example/src/docs/zh-CN/time-picker/format.md b/example/src/docs/zh-CN/time-picker/format.md deleted file mode 100644 index 96ab2caa8..000000000 --- a/example/src/docs/zh-CN/time-picker/format.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 时间格式化 - -`format` 时间格式化显示 -`timestamp` JS 时间戳,仅 value-format 可用;组件绑定值为 number 类型 - - diff --git a/example/src/docs/zh-CN/time-picker/is-range.md b/example/src/docs/zh-CN/time-picker/is-range.md deleted file mode 100644 index 8076c5fa1..000000000 --- a/example/src/docs/zh-CN/time-picker/is-range.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 范围选择 - -`is-range` 设置是否为范围选择,默认为 false,`range-separator`,设置范围选择分隔符(为可选值)默认为‘-’ - - diff --git a/example/src/docs/zh-CN/time-picker/month-range-shortcuts.md b/example/src/docs/zh-CN/time-picker/month-range-shortcuts.md deleted file mode 100644 index b54f9c5f1..000000000 --- a/example/src/docs/zh-CN/time-picker/month-range-shortcuts.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 月份范围快捷选项 - - - -
- diff --git a/example/src/docs/zh-CN/time-picker/month-range.md b/example/src/docs/zh-CN/time-picker/month-range.md deleted file mode 100644 index 47d46cdc9..000000000 --- a/example/src/docs/zh-CN/time-picker/month-range.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 选择月份范围 - - - -
- diff --git a/example/src/docs/zh-CN/time-picker/other-picker-type.md b/example/src/docs/zh-CN/time-picker/other-picker-type.md deleted file mode 100644 index 57c71bb9c..000000000 --- a/example/src/docs/zh-CN/time-picker/other-picker-type.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 其他日期单位 - - - -
- diff --git a/example/src/docs/zh-CN/time-picker/picker-options.md b/example/src/docs/zh-CN/time-picker/picker-options.md deleted file mode 100644 index 91441edb9..000000000 --- a/example/src/docs/zh-CN/time-picker/picker-options.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 选择范围 - -picker-options 设置时间选择范围 - - diff --git a/example/src/docs/zh-CN/time-picker/set-size.md b/example/src/docs/zh-CN/time-picker/set-size.md deleted file mode 100644 index deaa35a5b..000000000 --- a/example/src/docs/zh-CN/time-picker/set-size.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 尺寸设置 - - - - - - - -
diff --git a/example/src/docs/zh-CN/time-picker/suffix-icon.md b/example/src/docs/zh-CN/time-picker/suffix-icon.md deleted file mode 100644 index 723d6ec4e..000000000 --- a/example/src/docs/zh-CN/time-picker/suffix-icon.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 自定义后置图标 - -通过 `suffix-icon` 属性设置日期输入框后置图标,从 `@opentiny/vue-icon` 中导入一个图标并进行初始化后传给 `suffix-icon`。 - - - -
diff --git a/example/src/docs/zh-CN/time-picker/time-low.md b/example/src/docs/zh-CN/time-picker/time-low.md deleted file mode 100644 index bd7870522..000000000 --- a/example/src/docs/zh-CN/time-picker/time-low.md +++ /dev/null @@ -1,39 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 时间显示类型 - -通过 `hh` 属性可设置 12 小时制。 `HH` 属性为 24 小时制,须和 A 或 a 使用。 `h` 与 `H` 属性设置不补 0。 - -通过 `mm` 属性可设置分钟显示格式,例如 01。 `m` 属性设置不补 0。 - -通过 `ss` 属性可设置秒的显示格式,例如 01。 `s` 属性设置不补 0。 - -通过 `a` 属性可设置显示时间为 am/pm `A`属性设置显示时间为 AM/PM。 - - - -
- -### 时间显示类型 - -通过 `h` 与 `H` 属性设置不补 0。 - -通过 `m` 属性设置不补 0。 - -通过 `s` 属性设置不补 0。 - -通过 `a` 属性可设置显示时间为 am/pm `A`属性设置显示时间为 AM/PM。 - - - -
diff --git a/example/src/docs/zh-CN/time-picker/time-picker-events.md b/example/src/docs/zh-CN/time-picker/time-picker-events.md deleted file mode 100644 index a99ea67a8..000000000 --- a/example/src/docs/zh-CN/time-picker/time-picker-events.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 事件 - -当聚焦和失焦时会触发 focus 和 bulr 事件,当确定选值时会触发 change 事件 - - - -
diff --git a/example/src/docs/zh-CN/time-picker/unlink-panels.md b/example/src/docs/zh-CN/time-picker/unlink-panels.md deleted file mode 100644 index efa7782dd..000000000 --- a/example/src/docs/zh-CN/time-picker/unlink-panels.md +++ /dev/null @@ -1,18 +0,0 @@ -
-

- -

- -## TimePicker 时间选择器 - - - - -
- -### 范围选择取消面板联动 - - - -
- diff --git a/example/src/docs/zh-CN/time-select/basic-usage.md b/example/src/docs/zh-CN/time-select/basic-usage.md deleted file mode 100644 index 0e8fcf6a9..000000000 --- a/example/src/docs/zh-CN/time-select/basic-usage.md +++ /dev/null @@ -1,33 +0,0 @@ -
-

- -

- -## TimeSelect 时间选择器 - - - -时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。 -
- -### 基本用法 - - - -
- -### Time-select - - - -
- -### Time Select Options - - - -
- -### Date Format - - diff --git a/example/src/docs/zh-CN/time-select/clear-icon.md b/example/src/docs/zh-CN/time-select/clear-icon.md deleted file mode 100644 index c6eef5f94..000000000 --- a/example/src/docs/zh-CN/time-select/clear-icon.md +++ /dev/null @@ -1,32 +0,0 @@ -
-

- -

- -## TimeSelect 时间选择器 - - - -时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。 - -
- -### 清除按钮 - -通过 `clear-icon` 自定义清空图标 - - - -
- -### 显示清除按钮 - -通过 `clearable` 属性设置是否显示清除按钮,默认值为 true - - - -### 原生属性 - -通过 `name` 属性设置原生属性。 - - diff --git a/example/src/docs/zh-CN/time-select/default-time.md b/example/src/docs/zh-CN/time-select/default-time.md deleted file mode 100644 index 3a04650da..000000000 --- a/example/src/docs/zh-CN/time-select/default-time.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimeSelect 时间选择器 - - - -时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。 -
- -### 默认时间 - -`default-time` 设置默认时间 - - diff --git a/example/src/docs/zh-CN/time-select/default-value.md b/example/src/docs/zh-CN/time-select/default-value.md deleted file mode 100644 index 7faad0b0b..000000000 --- a/example/src/docs/zh-CN/time-select/default-value.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimeSelect 时间选择器 - - - -时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。 -
- -### 选择器打开时默认时间设置 - -通过 `default-value` 设置选择器打开显示默认时间 - - diff --git a/example/src/docs/zh-CN/time-select/disabled.md b/example/src/docs/zh-CN/time-select/disabled.md deleted file mode 100644 index b3a6dbafc..000000000 --- a/example/src/docs/zh-CN/time-select/disabled.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## TimeSelect 时间选择器 - - - -时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。 -
- -### 默认可编辑 - - - -### 禁用 - - diff --git a/example/src/docs/zh-CN/time-select/editable.md b/example/src/docs/zh-CN/time-select/editable.md deleted file mode 100644 index ca5f2dfa8..000000000 --- a/example/src/docs/zh-CN/time-select/editable.md +++ /dev/null @@ -1,22 +0,0 @@ -
-

- -

- -## TimeSelect 时间选择器 - - - -时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。 -
- - - -### 文本框不可编辑 - -日期输入框默认可以输入日期,设置 `editable` 为 false 后,将不能输入。 - - diff --git a/example/src/docs/zh-CN/time-select/event.md b/example/src/docs/zh-CN/time-select/event.md deleted file mode 100644 index af53bea7f..000000000 --- a/example/src/docs/zh-CN/time-select/event.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## TimeSelect 时间选择器 - - - -时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。 -
- -### 事件 - -`focus` input 框聚焦时触发,`blur` input 框失焦时触发 - - - -
- -`change` 当确定选值时触发 - - diff --git a/example/src/docs/zh-CN/time-select/focus.md b/example/src/docs/zh-CN/time-select/focus.md deleted file mode 100644 index d917a17f4..000000000 --- a/example/src/docs/zh-CN/time-select/focus.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimeSelect 时间选择器 - - - -时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。 -
- -### 手动获取焦点 - - - -
diff --git a/example/src/docs/zh-CN/time-select/picker-options.md b/example/src/docs/zh-CN/time-select/picker-options.md deleted file mode 100644 index a7abf7926..000000000 --- a/example/src/docs/zh-CN/time-select/picker-options.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimeSelect 时间选择器 - - - -时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。 -
- -### 指定时间点 - -picker-options 设置时间点 - - diff --git a/example/src/docs/zh-CN/time-select/popper-class.md b/example/src/docs/zh-CN/time-select/popper-class.md deleted file mode 100644 index 718e62b43..000000000 --- a/example/src/docs/zh-CN/time-select/popper-class.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimeSelect 时间选择器 - - - -时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。 -
- -### 自定义类名 - - - -
diff --git a/example/src/docs/zh-CN/time-select/range-placeholder.md b/example/src/docs/zh-CN/time-select/range-placeholder.md deleted file mode 100644 index 7bac09b5c..000000000 --- a/example/src/docs/zh-CN/time-select/range-placeholder.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## TimeSelect 时间选择器 - - - -时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。 -
- -### 固定时间范围 - - diff --git a/example/src/docs/zh-CN/time-select/size.md b/example/src/docs/zh-CN/time-select/size.md deleted file mode 100644 index fd03d5249..000000000 --- a/example/src/docs/zh-CN/time-select/size.md +++ /dev/null @@ -1,23 +0,0 @@ -
-

- -

- -## TimeSelect 时间选择器 - - - -时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。 -
- -### mini 尺寸 - - - -### small 尺寸 - - - -### medium 尺寸 - - diff --git a/example/src/docs/zh-CN/time-select/suffix-icon.md b/example/src/docs/zh-CN/time-select/suffix-icon.md deleted file mode 100644 index 2a89259f1..000000000 --- a/example/src/docs/zh-CN/time-select/suffix-icon.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TimeSelect 时间选择器 - - - -时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。 -
- -### 后置图标 - -通过 `suffix-icon` 属性设置日期输入框后置图标,从 `@opentiny/vue-icon` 中导入一个图标并进行初始化后传给 `suffix-icon`。 - - diff --git a/example/src/docs/zh-CN/toggle-menu/basic-usage.md b/example/src/docs/zh-CN/toggle-menu/basic-usage.md deleted file mode 100644 index c18b55e2e..000000000 --- a/example/src/docs/zh-CN/toggle-menu/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ToggleMenu 收缩菜单 - - - -以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/toggle-menu/custom-icon.md b/example/src/docs/zh-CN/toggle-menu/custom-icon.md deleted file mode 100644 index 46c522311..000000000 --- a/example/src/docs/zh-CN/toggle-menu/custom-icon.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ToggleMenu 收缩菜单 - - - -以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。 -
- -### 自定义菜单左侧图标 - -可通过 `icon` 属性自定义菜单左侧图标。 - - - -
diff --git a/example/src/docs/zh-CN/toggle-menu/custom-searchicon.md b/example/src/docs/zh-CN/toggle-menu/custom-searchicon.md deleted file mode 100644 index 45cff7014..000000000 --- a/example/src/docs/zh-CN/toggle-menu/custom-searchicon.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ToggleMenu 收缩菜单 - - - -以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。 -
- -### 自定义搜索图标 - -可通过 `search-icon` 属性自定义搜索图标。 - - - -
diff --git a/example/src/docs/zh-CN/toggle-menu/default-expand-all.md b/example/src/docs/zh-CN/toggle-menu/default-expand-all.md deleted file mode 100644 index e90f01230..000000000 --- a/example/src/docs/zh-CN/toggle-menu/default-expand-all.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ToggleMenu 收缩菜单 - - - -以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。 -
- -### 默认展开所有节点 - -可通过 `default-expand-all` 属性设置是否默认展开所有节点,通过 `expand-on-click-node` 属性设置是否可以通过点击节点展开/收起菜单。 - - - -
diff --git a/example/src/docs/zh-CN/toggle-menu/dragable.md b/example/src/docs/zh-CN/toggle-menu/dragable.md deleted file mode 100644 index 215f67a45..000000000 --- a/example/src/docs/zh-CN/toggle-menu/dragable.md +++ /dev/null @@ -1,22 +0,0 @@ -
-

- -

- -## ToggleMenu 收缩菜单 - - - -以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。 - -
- -### 拖拽节点 - -可通过 `draggable` 属性设置是否开启拖拽节点的功能,默认值为 `false`。 - -可通过 `ellipsis` 属性设置是否开启文本内容超长是省略显示,默认值为 `false` - - - -
diff --git a/example/src/docs/zh-CN/toggle-menu/events.md b/example/src/docs/zh-CN/toggle-menu/events.md deleted file mode 100644 index 8bd989c22..000000000 --- a/example/src/docs/zh-CN/toggle-menu/events.md +++ /dev/null @@ -1,51 +0,0 @@ -
-

- -

- -## ToggleMenu 收缩菜单 - - - -以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。 -
- -### 点击节点事件 - -`node-click` 点击节点后触发的事件。 - - - -
- -### 展开节点事件 - -`node-expand` 展开节点后触发的事件。 - - - -
- -### 收缩节点事件 - -`node-collapse` 收缩节点后触发的事件。 - - - -
- -### 拖放节点事件 - -`node-drop` 拖放节点后触发的事件,需要设置 `dragable` 属性为 `true`。 - - - -
- -### 拖拽事件 - -`node-drag-start` 拖拽节点后的事件,`node-drag-enter` 拖拽进入其他节点时触发的事件,`node-drag-over` 在拖拽节点时触发的事件,`node-drag-leave` 拖拽离开某个节点时触发的事件,`node-drag-end` 拖拽结束时触发的事件。 - - - -
diff --git a/example/src/docs/zh-CN/toggle-menu/get-menu-data-sync.md b/example/src/docs/zh-CN/toggle-menu/get-menu-data-sync.md deleted file mode 100644 index 476364309..000000000 --- a/example/src/docs/zh-CN/toggle-menu/get-menu-data-sync.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## ToggleMenu 收缩菜单 - - - -以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。 - -
- -### 自定义菜单数据服务 - -可通过 `get-menu-data-sync ` 自定义菜单数据服务。 - - - -
diff --git a/example/src/docs/zh-CN/toggle-menu/show-filter.md b/example/src/docs/zh-CN/toggle-menu/show-filter.md deleted file mode 100644 index c3cdb0a03..000000000 --- a/example/src/docs/zh-CN/toggle-menu/show-filter.md +++ /dev/null @@ -1,36 +0,0 @@ -
-

- -

- -## ToggleMenu 收缩菜单 - - - -以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。 - -
- -### 显示过滤搜索框 - -可通过 `show-filter` 属性设置是否展示过滤搜索框,默认为 `true`,可设置为`false`不展示过滤搜索框。 - - - -
- -### 自动过滤 - -可通过 `placeholder` 属性设置输入框的占位符。 通过 `automatic-filtering` 设置输入时是否自动过滤,默认值为 true。 - - - -
- -### 内容超出换行 - -可通过 `warp` 属性设置菜单内容超长是否换行显示 - - - -
diff --git a/example/src/docs/zh-CN/toggle-menu/toggle-props.md b/example/src/docs/zh-CN/toggle-menu/toggle-props.md deleted file mode 100644 index c4a6a31f4..000000000 --- a/example/src/docs/zh-CN/toggle-menu/toggle-props.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## ToggleMenu 收缩菜单 - - - -以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。 - -
- -### props 选项映射 - -可通过 `props` 配置选项映射字段该属性的默认值为 {children: 'children',label: 'label',disabled: 'disabled'} 。 - - - -
- -### 自定义节点内容 -通过 `node` 插槽自定义节点内容。 - - diff --git a/example/src/docs/zh-CN/tooltip/basic-usage.md b/example/src/docs/zh-CN/tooltip/basic-usage.md deleted file mode 100644 index 4f36772fd..000000000 --- a/example/src/docs/zh-CN/tooltip/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ToolTip 文字提示 - - - -动态显示提示信息,一般通过鼠标事件进行响应;提供 warning、error、info、success 四种类型显示不同类别的信息。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/tooltip/custom-transition.md b/example/src/docs/zh-CN/tooltip/custom-transition.md deleted file mode 100644 index a0291edbb..000000000 --- a/example/src/docs/zh-CN/tooltip/custom-transition.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ToolTip 文字提示 - - - -动态显示提示信息,一般通过鼠标事件进行响应;提供 warning、error、info、success 四种类型显示不同类别的信息。 -
- -### 自定义渐变动画 - -通过 `transition` 定义渐变动画,默认选值为 `tiny-fade-in-linear` - - - -
diff --git a/example/src/docs/zh-CN/tooltip/dynamic-disable.md b/example/src/docs/zh-CN/tooltip/dynamic-disable.md deleted file mode 100644 index 7709efce0..000000000 --- a/example/src/docs/zh-CN/tooltip/dynamic-disable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ToolTip 文字提示 - - - -动态显示提示信息,一般通过鼠标事件进行响应;提供 warning、error、info、success 四种类型显示不同类别的信息。 -
- -### 禁用 - -通过 `diabled` 设置禁用 - - - -
diff --git a/example/src/docs/zh-CN/tooltip/manual-control-tip.md b/example/src/docs/zh-CN/tooltip/manual-control-tip.md deleted file mode 100644 index 78f53042e..000000000 --- a/example/src/docs/zh-CN/tooltip/manual-control-tip.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ToolTip 文字提示 - - - -动态显示提示信息,一般通过鼠标事件进行响应;提供 warning、error、info、success 四种类型显示不同类别的信息。 -
- -### 手动控制 - -手动控制模式,通过设置 `manual` 属性为 true 后,mouseenter 和 mouseleave 事件将不会生效,然后可以通过设置 `v-model` 动态控制显示和隐藏 - - - -
diff --git a/example/src/docs/zh-CN/tooltip/tabindex.md b/example/src/docs/zh-CN/tooltip/tabindex.md deleted file mode 100644 index e07fcbc3f..000000000 --- a/example/src/docs/zh-CN/tooltip/tabindex.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ToolTip 文字提示 - - - -动态显示提示信息,一般通过鼠标事件进行响应;提供 warning、error、info、success 四种类型显示不同类别的信息。 -
- -### tabindex 配置 - -通过配置 `tabindex`, 配置的属性会自动添加到该组件的触发原上。 - - - -
diff --git a/example/src/docs/zh-CN/tooltip/tooltip-content.md b/example/src/docs/zh-CN/tooltip/tooltip-content.md deleted file mode 100644 index 348c51152..000000000 --- a/example/src/docs/zh-CN/tooltip/tooltip-content.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ToolTip 文字提示 - - - -动态显示提示信息,一般通过鼠标事件进行响应;提供 warning、error、info、success 四种类型显示不同类别的信息。 -
- -### 插槽 - -通过 `content` 插槽添加自定义内容。 - - - -
diff --git a/example/src/docs/zh-CN/tooltip/tooltip-enterable.md b/example/src/docs/zh-CN/tooltip/tooltip-enterable.md deleted file mode 100644 index be4556ea2..000000000 --- a/example/src/docs/zh-CN/tooltip/tooltip-enterable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ToolTip 文字提示 - - - -动态显示提示信息,一般通过鼠标事件进行响应;提供 warning、error、info、success 四种类型显示不同类别的信息。 -
- -### 鼠标是否可进入 - -通过 `enterable` 属性设置鼠标是否可进入到 tooltip 中。 - - - -
diff --git a/example/src/docs/zh-CN/tooltip/tooltip-hide-delay.md b/example/src/docs/zh-CN/tooltip/tooltip-hide-delay.md deleted file mode 100644 index 469b293fc..000000000 --- a/example/src/docs/zh-CN/tooltip/tooltip-hide-delay.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ToolTip 文字提示 - - - -动态显示提示信息,一般通过鼠标事件进行响应;提供 warning、error、info、success 四种类型显示不同类别的信息。 -
- -### 自动隐藏和延迟时间 - -通过 `hide-after` 属性设置 Tooltip 组件出现后自动隐藏延时,单位毫秒,为 0 则不会自动隐藏。通过 `open-delay` 属性设置 Tooltip 组件延迟出现的时间,单位毫秒。 - - - -
diff --git a/example/src/docs/zh-CN/tooltip/tooltip-offset.md b/example/src/docs/zh-CN/tooltip/tooltip-offset.md deleted file mode 100644 index 0e3b4b5a5..000000000 --- a/example/src/docs/zh-CN/tooltip/tooltip-offset.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ToolTip 文字提示 - - - -动态显示提示信息,一般通过鼠标事件进行响应;提供 warning、error、info、success 四种类型显示不同类别的信息。 -
- -### 偏移量 - -通过 `offset` 属性设置 Tooltip 组件出现位置的偏移量。 - - - -
diff --git a/example/src/docs/zh-CN/tooltip/tooltip-popper-class.md b/example/src/docs/zh-CN/tooltip/tooltip-popper-class.md deleted file mode 100644 index 0ba35d541..000000000 --- a/example/src/docs/zh-CN/tooltip/tooltip-popper-class.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ToolTip 文字提示 - - - -动态显示提示信息,一般通过鼠标事件进行响应;提供 warning、error、info、success 四种类型显示不同类别的信息。 -
- -### 添加样式类名 - -通过 `popper-class` 属性为 Tooltip 的 popper 添加类名。 - - - -
diff --git a/example/src/docs/zh-CN/tooltip/tooltip-popper-options.md b/example/src/docs/zh-CN/tooltip/tooltip-popper-options.md deleted file mode 100644 index bb4313d2d..000000000 --- a/example/src/docs/zh-CN/tooltip/tooltip-popper-options.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ToolTip 文字提示 - - - -动态显示提示信息,一般通过鼠标事件进行响应;提供 warning、error、info、success 四种类型显示不同类别的信息。 -
- -### popper配置 - -通过 `popper-options` 属性为 Tooltip 的 popper 配置参数,具体可参考[popper.js](https://popper.js.org/) - - - -
diff --git a/example/src/docs/zh-CN/tooltip/tooltip-theme.md b/example/src/docs/zh-CN/tooltip/tooltip-theme.md deleted file mode 100644 index 2bdd55de6..000000000 --- a/example/src/docs/zh-CN/tooltip/tooltip-theme.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ToolTip 文字提示 - - - -动态显示提示信息,一般通过鼠标事件进行响应;提供 warning、error、info、success 四种类型显示不同类别的信息。 -
- -### 主题 - -通过 `effect` 属性设置主题,可选值 dark/light 两种主题。 - - - -
diff --git a/example/src/docs/zh-CN/tooltip/tooltip-visible-arrow.md b/example/src/docs/zh-CN/tooltip/tooltip-visible-arrow.md deleted file mode 100644 index abb51c3cc..000000000 --- a/example/src/docs/zh-CN/tooltip/tooltip-visible-arrow.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## ToolTip 文字提示 - - - -动态显示提示信息,一般通过鼠标事件进行响应;提供 warning、error、info、success 四种类型显示不同类别的信息。 -
- -### 是否显示箭头 - -通过 `visible-arrow` 属性设置是否显示 Tooltip 箭头。 - - - -
diff --git a/example/src/docs/zh-CN/tooltip/visible-show.md b/example/src/docs/zh-CN/tooltip/visible-show.md deleted file mode 100644 index 20501b9ad..000000000 --- a/example/src/docs/zh-CN/tooltip/visible-show.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## ToolTip 文字提示 - - - -控制 tooltip 出现的时机;提供 auto、always 可选值。 - -
- -### 控制 tooltip 出现 - -通过 `visible` 定义提示是否智能出现,当值为 `auto` 时,只有超长文字时,才出现提示! - - - -
diff --git a/example/src/docs/zh-CN/transfer/basic-usage.md b/example/src/docs/zh-CN/transfer/basic-usage.md deleted file mode 100644 index cfcb18163..000000000 --- a/example/src/docs/zh-CN/transfer/basic-usage.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 基本用法 - -通过 `value` 属性进行双向绑定,其指定的值为默认选择的值,将展示在右侧列表。 - -
- -`data` 属性提供数据源,其是一个对象数组,对象中默认字段有 key、label、disabled 。 - - - -
- - diff --git a/example/src/docs/zh-CN/transfer/checked-format-text.md b/example/src/docs/zh-CN/transfer/checked-format-text.md deleted file mode 100644 index c4fdecd37..000000000 --- a/example/src/docs/zh-CN/transfer/checked-format-text.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 列表顶部勾选状态文案 - -指定 `format` 属性后,勾选数据时,左右侧列表顶部将展示已勾选数据和所有数据的比值。 - - - -
- diff --git a/example/src/docs/zh-CN/transfer/custom-button-texts.md b/example/src/docs/zh-CN/transfer/custom-button-texts.md deleted file mode 100644 index 5bbad4bb0..000000000 --- a/example/src/docs/zh-CN/transfer/custom-button-texts.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 自定义按钮文案 - -通过 `button-texts` 属性自定义左右穿梭的按钮文本。 - - - -
- - diff --git a/example/src/docs/zh-CN/transfer/custom-filter-method.md b/example/src/docs/zh-CN/transfer/custom-filter-method.md deleted file mode 100644 index e39a77a62..000000000 --- a/example/src/docs/zh-CN/transfer/custom-filter-method.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 自定义搜索方法 - -提供 `filter-method` 钩子函数,可自定义搜索的方法。 - - - -
- - diff --git a/example/src/docs/zh-CN/transfer/custom-footer.md b/example/src/docs/zh-CN/transfer/custom-footer.md deleted file mode 100644 index 2e5129115..000000000 --- a/example/src/docs/zh-CN/transfer/custom-footer.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 自定义列表底部 - -通过 `left-footer`、`right-footer` 插槽可分别对左右列表底部进行自定义。 - - - -
- - diff --git a/example/src/docs/zh-CN/transfer/custom-render-content.md b/example/src/docs/zh-CN/transfer/custom-render-content.md deleted file mode 100644 index 93517e0ae..000000000 --- a/example/src/docs/zh-CN/transfer/custom-render-content.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 自定义数据项渲染 - -使用 render-content 自定义数据项 - - - -
- -使用 scoped-slot 自定义数据项 - - - -
diff --git a/example/src/docs/zh-CN/transfer/custom-transfer-titles.md b/example/src/docs/zh-CN/transfer/custom-transfer-titles.md deleted file mode 100644 index ae8595e7c..000000000 --- a/example/src/docs/zh-CN/transfer/custom-transfer-titles.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 自定义列表标题 - -通过 `titles` 属性可对左右列表的标题进行自定义。 - - - -
diff --git a/example/src/docs/zh-CN/transfer/data-source.md b/example/src/docs/zh-CN/transfer/data-source.md deleted file mode 100644 index 9fb96428e..000000000 --- a/example/src/docs/zh-CN/transfer/data-source.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 数据源 - -可请求服务获取数据,再将数据赋予 `data` 。 - - - -
diff --git a/example/src/docs/zh-CN/transfer/default-checked.md b/example/src/docs/zh-CN/transfer/default-checked.md deleted file mode 100644 index eb88ff19f..000000000 --- a/example/src/docs/zh-CN/transfer/default-checked.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 默认勾选项 - -通过 `left-default-checked`、`right-default-checked` 属性分别指定左右侧列表默认的勾选数据。 - - - -
diff --git a/example/src/docs/zh-CN/transfer/drop-config.md b/example/src/docs/zh-CN/transfer/drop-config.md deleted file mode 100644 index 00009cf2a..000000000 --- a/example/src/docs/zh-CN/transfer/drop-config.md +++ /dev/null @@ -1,22 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 左右拖拽 - -:::tip 使用拖拽功能时请先安装 sortablejs 插件 -::: - -通过 `drop-config` 属性配置 sortablejs 插件进行左右拖拽穿梭。 - - - -
diff --git a/example/src/docs/zh-CN/transfer/filter-placeholder.md b/example/src/docs/zh-CN/transfer/filter-placeholder.md deleted file mode 100644 index e96730f9b..000000000 --- a/example/src/docs/zh-CN/transfer/filter-placeholder.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 搜索框占位符 - -通过 `filter-placeholder` 属性自定义搜索框占位符。 - - - -
diff --git a/example/src/docs/zh-CN/transfer/filterable.md b/example/src/docs/zh-CN/transfer/filterable.md deleted file mode 100644 index 3d978254c..000000000 --- a/example/src/docs/zh-CN/transfer/filterable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 可搜索 - -通过 `filterable` 属性开启左右侧列表的搜索功能。 - - - -
diff --git a/example/src/docs/zh-CN/transfer/manual-clear-query.md b/example/src/docs/zh-CN/transfer/manual-clear-query.md deleted file mode 100644 index cc099b30a..000000000 --- a/example/src/docs/zh-CN/transfer/manual-clear-query.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 手动清空搜索框 - -调用 `clearQuery()` 方法可清空左右侧列表的搜索框,参数为 left 或者 right 。 - - - -
diff --git a/example/src/docs/zh-CN/transfer/nested-table.md b/example/src/docs/zh-CN/transfer/nested-table.md deleted file mode 100644 index 7d3fd5f35..000000000 --- a/example/src/docs/zh-CN/transfer/nested-table.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 嵌套表格 - -当 `render` 属性里的 `plugin` 设置为 `Table` 时指定穿梭框渲染成表格,具体配置可参考 `grid` 组件的配置。 - - - -
diff --git a/example/src/docs/zh-CN/transfer/nested-tree.md b/example/src/docs/zh-CN/transfer/nested-tree.md deleted file mode 100644 index 1c76ec26e..000000000 --- a/example/src/docs/zh-CN/transfer/nested-tree.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 嵌套树 - -当 `render` 属性里的 `plugin` 设置为 `Tree` 时指定穿梭框渲染成树,通过 `treeConfig` 属性配置树相关的配置(具体配置可参考 `tree` 组件的配置)。 - - - -
diff --git a/example/src/docs/zh-CN/transfer/panel-slot.md b/example/src/docs/zh-CN/transfer/panel-slot.md deleted file mode 100644 index d29c64175..000000000 --- a/example/src/docs/zh-CN/transfer/panel-slot.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 - -
- -### 面板插槽 - -可通过 `left-panel` 和 `right-panel` 自定义左、右侧面板内容;通过 `button` 自定义穿梭按钮 - - - -
diff --git a/example/src/docs/zh-CN/transfer/props-of-data-source.md b/example/src/docs/zh-CN/transfer/props-of-data-source.md deleted file mode 100644 index 9ee16589d..000000000 --- a/example/src/docs/zh-CN/transfer/props-of-data-source.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 数据源的字段别名 - -当数据对象中的字段和默认不一致时,可通过 `props` 属性进行映射。 - - - -
diff --git a/example/src/docs/zh-CN/transfer/show-all-btn.md b/example/src/docs/zh-CN/transfer/show-all-btn.md deleted file mode 100644 index 662921570..000000000 --- a/example/src/docs/zh-CN/transfer/show-all-btn.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 展示全部移动按钮 - -可通过 `show-all-btn` 属性设置展示全部移动按钮。 - - - -
diff --git a/example/src/docs/zh-CN/transfer/target-order.md b/example/src/docs/zh-CN/transfer/target-order.md deleted file mode 100644 index 685392032..000000000 --- a/example/src/docs/zh-CN/transfer/target-order.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 右侧排序策略 - -通过 `target-order` 属性设置右侧列表元素的排序策略,有 original、push、unshift 三个选项,默认为 original 。 - -:::tip 排序策略 -若为 original,则保持与数据源相同的顺序 -若为 push,则新加入的元素排在最后 -若为 unshift,则新加入的元素排在最前 -::: - - - -
diff --git a/example/src/docs/zh-CN/transfer/transfer-events.md b/example/src/docs/zh-CN/transfer/transfer-events.md deleted file mode 100644 index 1ca41dfbe..000000000 --- a/example/src/docs/zh-CN/transfer/transfer-events.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Transfer 穿梭框 - - - -穿梭框,提供表格数据的双向选择。 -
- -### 穿梭框事件 - -主要有 `change`、`left-check-change`、`right-check-change` 三个事件。 - -:::tip 事件说明 -change:右侧列表元素变化时触发 -left-check-change:左侧列表元素被用户选中 / 取消选中时触发 -right-check-change:右侧列表元素被用户选中 / 取消选中时触发 -::: - - - -
diff --git a/example/src/docs/zh-CN/tree-menu/accordion.md b/example/src/docs/zh-CN/tree-menu/accordion.md deleted file mode 100644 index bf84f631e..000000000 --- a/example/src/docs/zh-CN/tree-menu/accordion.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## TreeMenu 树型菜单 - - - -以树形方式显示的菜单,适用于版型定制的一种组件。 -
- -### 手风琴 - -通过 `accordion` 设置手风琴效果。 - - - -
diff --git a/example/src/docs/zh-CN/tree-menu/basic-usage.md b/example/src/docs/zh-CN/tree-menu/basic-usage.md deleted file mode 100644 index 8f6f018e1..000000000 --- a/example/src/docs/zh-CN/tree-menu/basic-usage.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## TreeMenu 树型菜单 - - - -以树形方式显示的菜单,适用于版型定制的一种组件。 -
- -### 基本用法 - -不配置数据时,默认从框架服务读取数据。 - - - -
- - diff --git a/example/src/docs/zh-CN/tree-menu/can-draggable.md b/example/src/docs/zh-CN/tree-menu/can-draggable.md deleted file mode 100644 index 0dbc54163..000000000 --- a/example/src/docs/zh-CN/tree-menu/can-draggable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## TreeMenu 树型菜单 - - - -以树形方式显示的菜单,适用于版型定制的一种组件。 -
- -### 拖动菜单 - -可通过属性置 `draggable` 实现菜单拖拽。 - - - -
diff --git a/example/src/docs/zh-CN/tree-menu/check-strictly.md b/example/src/docs/zh-CN/tree-menu/check-strictly.md deleted file mode 100644 index e63b5c1ec..000000000 --- a/example/src/docs/zh-CN/tree-menu/check-strictly.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## TreeMenu 树型菜单 - - - -以树形方式显示的菜单,适用于版型定制的一种组件。 -
- -### 父子级不相关联 - -通过 `check-strictly` 设置选择时父子级不相关联,需要与 `show-checkbox` 同时使用 。 - - - -
diff --git a/example/src/docs/zh-CN/tree-menu/data-resource.md b/example/src/docs/zh-CN/tree-menu/data-resource.md deleted file mode 100644 index f72f5e51e..000000000 --- a/example/src/docs/zh-CN/tree-menu/data-resource.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## TreeMenu 树型菜单 - - - -以树形方式显示的菜单,适用于版型定制的一种组件。 -
- -### 数据源 - -通过 `data` 设置树形菜单的数据。 - - - -
- -### 自定义菜单服务数据 - -通过 `get-menu-data-sync` 自定义菜单服务数据,直接返回数据。 - - diff --git a/example/src/docs/zh-CN/tree-menu/default-expand-all.md b/example/src/docs/zh-CN/tree-menu/default-expand-all.md deleted file mode 100644 index b4406f576..000000000 --- a/example/src/docs/zh-CN/tree-menu/default-expand-all.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## TreeMenu 树型菜单 - - - -以树形方式显示的菜单,适用于版型定制的一种组件。 -
- -### 默认展开全部菜单 - -可通过属性 `default-expand-all` 配置默认展开全部菜单。 -通过属性 `default-checked-keys` 配置默认选中,需要与 `show-checkbox`, `node-key` 同时使用。 - - - -
diff --git a/example/src/docs/zh-CN/tree-menu/default-expanded-keys.md b/example/src/docs/zh-CN/tree-menu/default-expanded-keys.md deleted file mode 100644 index 558a31f46..000000000 --- a/example/src/docs/zh-CN/tree-menu/default-expanded-keys.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## TreeMenu 树型菜单 - - - -以树形方式显示的菜单,适用于版型定制的一种组件。 -
- -### 默认展开某节点 - -通过 `default-expanded-keys` 设置初始化展开某一节点 。 - - - -
diff --git a/example/src/docs/zh-CN/tree-menu/empty-text.md b/example/src/docs/zh-CN/tree-menu/empty-text.md deleted file mode 100644 index 8e2b8db7f..000000000 --- a/example/src/docs/zh-CN/tree-menu/empty-text.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## TreeMenu 树型菜单 - - - -以树形方式显示的菜单,适用于版型定制的一种组件。 -
- -### 自定义空数据文本 - -可通过属性 `empty-text` 配置空数据显示文本。 - - diff --git a/example/src/docs/zh-CN/tree-menu/expand-on-click-node.md b/example/src/docs/zh-CN/tree-menu/expand-on-click-node.md deleted file mode 100644 index 644467bd5..000000000 --- a/example/src/docs/zh-CN/tree-menu/expand-on-click-node.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## TreeMenu 树型菜单 - - - -以树形方式显示的菜单,适用于版型定制的一种组件。 -
- -### 点击文字展开菜单 - -可通过属性 `expand-on-click-node` 配置点击文字即可展开子菜单。 - - - -
diff --git a/example/src/docs/zh-CN/tree-menu/filter-node-method.md b/example/src/docs/zh-CN/tree-menu/filter-node-method.md deleted file mode 100644 index e4a90f3ce..000000000 --- a/example/src/docs/zh-CN/tree-menu/filter-node-method.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## TreeMenu 树型菜单 - - - -以树形方式显示的菜单,适用于版型定制的一种组件。 -
- -### 搜索规则配置 - -可配置 `filter-node-method` 进行搜索规则配置,默认为模糊匹配,以下示例是精确配置。 - - - -
diff --git a/example/src/docs/zh-CN/tree-menu/lazy-load.md b/example/src/docs/zh-CN/tree-menu/lazy-load.md deleted file mode 100644 index 2f26ddcc2..000000000 --- a/example/src/docs/zh-CN/tree-menu/lazy-load.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## TreeMenu 树型菜单 - - - -以树形方式显示的菜单,适用于版型定制的一种组件。 -
- -### 懒加载子节点 - -可通过 ` lazy ` 是否懒加载子节点,需与 load 方法结合使用。 - - - -
diff --git a/example/src/docs/zh-CN/tree-menu/search-icon.md b/example/src/docs/zh-CN/tree-menu/search-icon.md deleted file mode 100644 index 4edc63d94..000000000 --- a/example/src/docs/zh-CN/tree-menu/search-icon.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## TreeMenu 树型菜单 - - - -以树形方式显示的菜单,适用于版型定制的一种组件。 - -
- -### 自定义搜索图标 - -可配置 `search-icon` 属性设置自定义搜索图标 - - - -
diff --git a/example/src/docs/zh-CN/tree-menu/show-checkbox.md b/example/src/docs/zh-CN/tree-menu/show-checkbox.md deleted file mode 100644 index b0e9405ec..000000000 --- a/example/src/docs/zh-CN/tree-menu/show-checkbox.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## TreeMenu 树型菜单 - - - -以树形方式显示的菜单,适用于版型定制的一种组件。 - -
- -### 搜索规则配置 - -可配置 `show-checkbox ` 属性设置节点是否可被选择。 - - - -
diff --git a/example/src/docs/zh-CN/tree-menu/text-ellipsis.md b/example/src/docs/zh-CN/tree-menu/text-ellipsis.md deleted file mode 100644 index d60ad751b..000000000 --- a/example/src/docs/zh-CN/tree-menu/text-ellipsis.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## TreeMenu 树型菜单 - - - -以树形方式显示的菜单,适用于版型定制的一种组件。 -
- -### 文字超长省略显示 - -可通过 `ellipsis` 配置当菜单文字过长时,显示成省略号。通过 `prefix-icon` 自定义前置图标。 - - - -
diff --git a/example/src/docs/zh-CN/tree-menu/text-wrap.md b/example/src/docs/zh-CN/tree-menu/text-wrap.md deleted file mode 100644 index 8da6ddf93..000000000 --- a/example/src/docs/zh-CN/tree-menu/text-wrap.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## TreeMenu 树型菜单 - - - -以树形方式显示的菜单,适用于版型定制的一种组件。 - -
- -### 文字超长换行显示 - -可通过 `wrap` 配置当菜单文字过长时,换行显示。通过 showTitle 属性配置是否展示 title,默认值为 true。 -可通过 `show-filter` 配置是否显示搜索过滤框,默认为 true。 -可通过 `show-title` 配置是否显示 title ,默认为 true。 - - -
diff --git a/example/src/docs/zh-CN/tree-menu/tree-menu-event.md b/example/src/docs/zh-CN/tree-menu/tree-menu-event.md deleted file mode 100644 index d5b75e9df..000000000 --- a/example/src/docs/zh-CN/tree-menu/tree-menu-event.md +++ /dev/null @@ -1,49 +0,0 @@ -
-

- -

- -## TreeMenu 树型菜单 - - - -以树形方式显示的菜单,适用于版型定制的一种组件。 -
- -### 事件 - -`current-change` 当前选中节点变化时触发的事件。 - - - -
- -`check-change` 节点选中状态发生变化时的回调。 - - - -
- -`node-click` 节点被点击时的回调。 - - - -
- -`node-collapse` 节点被关闭时触发的事件。 - - - -
- -`node-expand` 节点被展开时触发的事件。 - - - -
- -`allow-drag`节点能否被拖动回调事件,`allow-drop` 节点能否被拖放回调事件。需配置 `draggable` 同时使用。 - - - -
diff --git a/example/src/docs/zh-CN/tree-menu/tree-menu-indent.md b/example/src/docs/zh-CN/tree-menu/tree-menu-indent.md deleted file mode 100644 index 933ed2502..000000000 --- a/example/src/docs/zh-CN/tree-menu/tree-menu-indent.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## TreeMenu 树型菜单 - - - -以树形方式显示的菜单,适用于版型定制的一种组件。 -
- -### 水平缩进 - -可通过属性 `indent` 控制子级相对于父级菜单的水平缩进距离,单位 px 。 - - - -
diff --git a/example/src/docs/zh-CN/tree-menu/tree-menu-slot.md b/example/src/docs/zh-CN/tree-menu/tree-menu-slot.md deleted file mode 100644 index 967517657..000000000 --- a/example/src/docs/zh-CN/tree-menu/tree-menu-slot.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## TreeMenu 树型菜单 - - - -以树形方式显示的菜单,适用于版型定制的一种组件。 -
- -### 插槽 - -可通过配置默认作用域插槽来显示菜单内容。 - - - -
diff --git a/example/src/docs/zh-CN/tree/accordion-mode.md b/example/src/docs/zh-CN/tree/accordion-mode.md deleted file mode 100644 index ed3c9e012..000000000 --- a/example/src/docs/zh-CN/tree/accordion-mode.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 手风琴模式 - -通过 `accordion` 属性设置是否每次只打开一个同级树节点展开(手风琴模式),默认值为 `false`。 - - - -
diff --git a/example/src/docs/zh-CN/tree/allow-drag.md b/example/src/docs/zh-CN/tree/allow-drag.md deleted file mode 100644 index e244af0ff..000000000 --- a/example/src/docs/zh-CN/tree/allow-drag.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 自定义节点能否被拖拽 - -通过 `allow-drag` 钩子函数判断节点能否被拖拽,返回值为 `false` 时,节点不能拖拽。 - - - -
diff --git a/example/src/docs/zh-CN/tree/allow-drop.md b/example/src/docs/zh-CN/tree/allow-drop.md deleted file mode 100644 index dd106b365..000000000 --- a/example/src/docs/zh-CN/tree/allow-drop.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 自定义目标节点能否被放置 - -通过 `allow-drop` 属性设置拖拽时判断目标节点能否被放置。type 参数有三种情况:'prev'、'inner' 和 'next',分别表示放置在目标节点前、插入至目标节点和放置在目标节点后。 - - - -
diff --git a/example/src/docs/zh-CN/tree/auto-expand-parent.md b/example/src/docs/zh-CN/tree/auto-expand-parent.md deleted file mode 100644 index 37bc353d0..000000000 --- a/example/src/docs/zh-CN/tree/auto-expand-parent.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 自动展开父节点 - -通过 `auto-expand-parent` 属性是否展示父节点,默认为 `true`。 - - - -
diff --git a/example/src/docs/zh-CN/tree/basic-usage.md b/example/src/docs/zh-CN/tree/basic-usage.md deleted file mode 100644 index 5a4e2d47e..000000000 --- a/example/src/docs/zh-CN/tree/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/tree/check-on-click-node.md b/example/src/docs/zh-CN/tree/check-on-click-node.md deleted file mode 100644 index 73dcde912..000000000 --- a/example/src/docs/zh-CN/tree/check-on-click-node.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 点击节点时选中 - -通过 `check-on-click-node` 属性设置点击节点内容同时可以勾选数据/去勾选数据。 -通过 `icon-trigger-click-node` 属性控制点击图标是否触发 node-click 事件,默认为 true。 - - - -
diff --git a/example/src/docs/zh-CN/tree/check-strictly.md b/example/src/docs/zh-CN/tree/check-strictly.md deleted file mode 100644 index 1f0dbed74..000000000 --- a/example/src/docs/zh-CN/tree/check-strictly.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 父子不互相关联 - -通过 `check-strictly` 属性设置父子层级勾选不关联。 - - - -
diff --git a/example/src/docs/zh-CN/tree/contextmenu.md b/example/src/docs/zh-CN/tree/contextmenu.md deleted file mode 100644 index a76a42eef..000000000 --- a/example/src/docs/zh-CN/tree/contextmenu.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -右键点击节点弹出自定义菜单 -
- -### 可自定义右键菜单内容 - -通过 `show-contextmenu` 属性设置是否开启弹窗右键菜单,调用实例的 `closeMenu` 方法可以关闭自定义菜单。 - - - -
diff --git a/example/src/docs/zh-CN/tree/current-node-key.md b/example/src/docs/zh-CN/tree/current-node-key.md deleted file mode 100644 index c479be86d..000000000 --- a/example/src/docs/zh-CN/tree/current-node-key.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 当前选中节点标志 - -通过 `current-node-key` 设置当前选中节点标志,要配合 node-key="id" 使用。 - - - -
diff --git a/example/src/docs/zh-CN/tree/custom-empty-text.md b/example/src/docs/zh-CN/tree/custom-empty-text.md deleted file mode 100644 index a655a02ee..000000000 --- a/example/src/docs/zh-CN/tree/custom-empty-text.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 自定义空数据文本 - -配置 `template #empty` 设置自定义空数据文本。 - - - -
diff --git a/example/src/docs/zh-CN/tree/custom-node-icon.md b/example/src/docs/zh-CN/tree/custom-node-icon.md deleted file mode 100644 index 4ad97d955..000000000 --- a/example/src/docs/zh-CN/tree/custom-node-icon.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 自定义展开折叠图标 - -通过 `icon` 属性设置树节点展开折叠图标,从 `@opentiny/vue-icon` 中导入一个图标并进行初始化后传给 `icon` 属性。 - - - -
diff --git a/example/src/docs/zh-CN/tree/data-source.md b/example/src/docs/zh-CN/tree/data-source.md deleted file mode 100644 index d997b6d74..000000000 --- a/example/src/docs/zh-CN/tree/data-source.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 数据源 - -通过配置 `data` 属性来设置数据源,可配置静态数据源和动态数据源。 - - - -
diff --git a/example/src/docs/zh-CN/tree/default-checked-keys.md b/example/src/docs/zh-CN/tree/default-checked-keys.md deleted file mode 100644 index f3410e44e..000000000 --- a/example/src/docs/zh-CN/tree/default-checked-keys.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 默认勾选的节点 - -通过 `default-checked-keys` 属性设置默认勾选数据。 - - - -
diff --git a/example/src/docs/zh-CN/tree/default-expand-all.md b/example/src/docs/zh-CN/tree/default-expand-all.md deleted file mode 100644 index 1f54d771d..000000000 --- a/example/src/docs/zh-CN/tree/default-expand-all.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 默认展开所有节点 - -通过 `default-expand-all` 属性设置默认展开所有节点。 - - - -
diff --git a/example/src/docs/zh-CN/tree/default-expanded-keys.md b/example/src/docs/zh-CN/tree/default-expanded-keys.md deleted file mode 100644 index 2fa17deca..000000000 --- a/example/src/docs/zh-CN/tree/default-expanded-keys.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 点击节点展开收缩 - -通过 `expand-on-click-node` 属性设置点击节点可以展开/收缩节点。 - - - -
diff --git a/example/src/docs/zh-CN/tree/disable-node.md b/example/src/docs/zh-CN/tree/disable-node.md deleted file mode 100644 index 1337ba494..000000000 --- a/example/src/docs/zh-CN/tree/disable-node.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 禁用状态 - -数据源里面带 `disabled: true` 渲染时自动禁用。 - - - -
diff --git a/example/src/docs/zh-CN/tree/events.md b/example/src/docs/zh-CN/tree/events.md deleted file mode 100644 index 4de2cd4dc..000000000 --- a/example/src/docs/zh-CN/tree/events.md +++ /dev/null @@ -1,29 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 拖拽节点事件 - - - -
- -### 勾选节点事件 - - - -
- -### 鼠标右键点击节点事件 - - - -
diff --git a/example/src/docs/zh-CN/tree/expand-on-click-node.md b/example/src/docs/zh-CN/tree/expand-on-click-node.md deleted file mode 100644 index 0efb2cb7c..000000000 --- a/example/src/docs/zh-CN/tree/expand-on-click-node.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 点击节点展开收缩 - -通过 `expand-on-click-node` 属性设置点击节点内容时可展开/收起节点。 - - - -
diff --git a/example/src/docs/zh-CN/tree/filter-node.md b/example/src/docs/zh-CN/tree/filter-node.md deleted file mode 100644 index ae2ad7c02..000000000 --- a/example/src/docs/zh-CN/tree/filter-node.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 节点过滤 - -通过 `filter-node-method` 属性设置节点过滤的方法。 - - - -
diff --git a/example/src/docs/zh-CN/tree/highlight-current.md b/example/src/docs/zh-CN/tree/highlight-current.md deleted file mode 100644 index 739d0a3bd..000000000 --- a/example/src/docs/zh-CN/tree/highlight-current.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 高亮当前选择节点 - -通过 `highlight-current` 属性设置高亮当前选择的节点。 - - - -
diff --git a/example/src/docs/zh-CN/tree/indent.md b/example/src/docs/zh-CN/tree/indent.md deleted file mode 100644 index caf3cc486..000000000 --- a/example/src/docs/zh-CN/tree/indent.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 水平缩进 - -通过 `indent` 属性控制水平缩进距离,单位 `px`,默认值为 `18px`。 - - - -
diff --git a/example/src/docs/zh-CN/tree/lazy-load-node.md b/example/src/docs/zh-CN/tree/lazy-load-node.md deleted file mode 100644 index ec200daed..000000000 --- a/example/src/docs/zh-CN/tree/lazy-load-node.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 懒加载子节点 - -通过 `lazy` 属性设置是否懒加载子节点,需与 `load` 方法结合使用。默认值为 `false`。 - - - -
diff --git a/example/src/docs/zh-CN/tree/node-draggable.md b/example/src/docs/zh-CN/tree/node-draggable.md deleted file mode 100644 index bd09b3d52..000000000 --- a/example/src/docs/zh-CN/tree/node-draggable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 可拖拽节点 - -通过 `draggable` 属性设置节点是否可拖拽。 - - - -
diff --git a/example/src/docs/zh-CN/tree/node-key.md b/example/src/docs/zh-CN/tree/node-key.md deleted file mode 100644 index e38273c4c..000000000 --- a/example/src/docs/zh-CN/tree/node-key.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 唯一标识 - -通过 `node-key` 属性设置唯一标识。 - - - -
diff --git a/example/src/docs/zh-CN/tree/node-props-config.md b/example/src/docs/zh-CN/tree/node-props-config.md deleted file mode 100644 index 33e9dfdb3..000000000 --- a/example/src/docs/zh-CN/tree/node-props-config.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 数据节点属性配置 - -通过 `props` 属性设置数据节点属性的配置,该属性的默认值为 `{children: 'children',label: 'label',disabled: 'disabled'}`。 - - - -
diff --git a/example/src/docs/zh-CN/tree/render-after-expand.md b/example/src/docs/zh-CN/tree/render-after-expand.md deleted file mode 100644 index d3b752c2e..000000000 --- a/example/src/docs/zh-CN/tree/render-after-expand.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 展开后渲染 - -配置 `render-after-expand` 属性设置是否展开后渲染数据,默认为 `true`。 - - - -
diff --git a/example/src/docs/zh-CN/tree/render-content.md b/example/src/docs/zh-CN/tree/render-content.md deleted file mode 100644 index 482fc27d5..000000000 --- a/example/src/docs/zh-CN/tree/render-content.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 自定义内容区渲染 - -通过 `render-content` 属性设置自定义内容。 - - - -
diff --git a/example/src/docs/zh-CN/tree/set-tree-icon.md b/example/src/docs/zh-CN/tree/set-tree-icon.md deleted file mode 100644 index 4229fd2ff..000000000 --- a/example/src/docs/zh-CN/tree/set-tree-icon.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 展开折叠图标分别设置 - -通过 `expandIcon` 属性设置展开的图标,通过 `shrinkIcon` 属性设置折叠的图标。 - - - -
diff --git a/example/src/docs/zh-CN/tree/show-checkbox.md b/example/src/docs/zh-CN/tree/show-checkbox.md deleted file mode 100644 index c1733b253..000000000 --- a/example/src/docs/zh-CN/tree/show-checkbox.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 是否开启多选模式 - -通过 `show-checkbox` 属性设置节点是否可被选择,默认为 `false`。 - - - -
diff --git a/example/src/docs/zh-CN/tree/single-select-radio.md b/example/src/docs/zh-CN/tree/single-select-radio.md deleted file mode 100644 index e32ccca9b..000000000 --- a/example/src/docs/zh-CN/tree/single-select-radio.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 单选 - -通过 `show-radio` 属性设置树节点的单选特性,默认为 `false`,与 `show-checkbox` 属性互斥,不能同时设置为 `true`。 - - - -
diff --git a/example/src/docs/zh-CN/tree/slot-deffault.md b/example/src/docs/zh-CN/tree/slot-deffault.md deleted file mode 100644 index f1c386814..000000000 --- a/example/src/docs/zh-CN/tree/slot-deffault.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Tree 树形控件 - - - -可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。 -
- -### 默认插槽 - -通过 `default` 插槽,可自定义树节点的内容,参数为 { node, data }。 - - - -
diff --git a/example/src/docs/zh-CN/user-account/basic-usage.md b/example/src/docs/zh-CN/user-account/basic-usage.md deleted file mode 100644 index 1f279fb1c..000000000 --- a/example/src/docs/zh-CN/user-account/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## UserAccount 用户账号 - - - -用户账号组件,用于显示用户账号、注销及自定义功能。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/user-account/custom-operation.md b/example/src/docs/zh-CN/user-account/custom-operation.md deleted file mode 100644 index 2cf48401d..000000000 --- a/example/src/docs/zh-CN/user-account/custom-operation.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## UserAccount 用户账号 - - - -用户账号组件,用于显示用户账号、注销及自定义功能。 -
- -### 自定义功能 - -通过默认插槽自定义功能 - - - -
diff --git a/example/src/docs/zh-CN/user-account/custom-service.md b/example/src/docs/zh-CN/user-account/custom-service.md deleted file mode 100644 index 0ef4c8b63..000000000 --- a/example/src/docs/zh-CN/user-account/custom-service.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## UserAccount 用户账号 - - - -用户账号组件,用于显示用户账号、注销及自定义功能。 -
- -### 自定义服务 - -设置自定义服务 - - - -
diff --git a/example/src/docs/zh-CN/user-contact/basic-usage.md b/example/src/docs/zh-CN/user-contact/basic-usage.md deleted file mode 100644 index 2c0b7d95e..000000000 --- a/example/src/docs/zh-CN/user-contact/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## UserContact 联系人 - - - -UserContact 联系人组件,展现用户账号和基本联系方式,包括头像、姓名、描述、三种元素,任意组合。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/user-contact/data-source.md b/example/src/docs/zh-CN/user-contact/data-source.md deleted file mode 100644 index c78da2033..000000000 --- a/example/src/docs/zh-CN/user-contact/data-source.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## UserContact 联系人 - - - -UserContact 联系人组件,展现用户账号和基本联系方式,包括头像、姓名、描述三种元素,任意组合。 -
- -### 设置数据源 - -可通过 `data` 设置数据源, `imgUrl` 表示的是图片路径, `userName` 表示的是姓名, `userDescription` 表示的是描述。 - - - -
diff --git a/example/src/docs/zh-CN/user-contact/not-displayed-content.md b/example/src/docs/zh-CN/user-contact/not-displayed-content.md deleted file mode 100644 index 4dc7417d6..000000000 --- a/example/src/docs/zh-CN/user-contact/not-displayed-content.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## UserContact 联系人 - - - -UserContact 联系人组件,展现用户账号和基本联系方式,包括头像、姓名、用户描述三种元素,任意组合。 -
- -### 定制弹框不显示的内容 - -定制弹框不显示的内容 -`show-img` 是否显示头像,值为 true 时显示, false 隐藏,默认 true。 -`show-name` 是否显示名字,值为 true 时显示, false 隐藏,默认 true。 -`show-description` 是否显示用户描述,值为 true 时显示, false 隐藏,默认 true。 - - -
diff --git a/example/src/docs/zh-CN/user-contact/slots-usercontact.md b/example/src/docs/zh-CN/user-contact/slots-usercontact.md deleted file mode 100644 index f11168b73..000000000 --- a/example/src/docs/zh-CN/user-contact/slots-usercontact.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## UserContact 联系人 - - - -UserContact 联系人组件,展现用户账号和基本联系方式,包括头像、姓名、描述三种元素,任意组合。 -
- -### 自定义默认插槽 - - - -
diff --git a/example/src/docs/zh-CN/user-contact/support-open-espace.md b/example/src/docs/zh-CN/user-contact/support-open-espace.md deleted file mode 100644 index d8c0358dc..000000000 --- a/example/src/docs/zh-CN/user-contact/support-open-espace.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## UserContact 联系人 - - - -UserContact 联系人组件,展现用户账号和基本联系方式,包括工号、头像、姓名三种元素,任意组合。 -
- -### 连接 eSpace 功能 - -可通过 `espace` 设置连接 eSpace 功能, 在案例的倒三角中最下方有三个按钮,分别代表连接 eSpace 的不同的功能,里面的属性分别代表类型,值,和要显示的图片。 - - - -
diff --git a/example/src/docs/zh-CN/user-head/basic-usage.md b/example/src/docs/zh-CN/user-head/basic-usage.md deleted file mode 100644 index c4ac3b793..000000000 --- a/example/src/docs/zh-CN/user-head/basic-usage.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## UserHead 用户头像 - - - -UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。 -
- -### 基本用法 - - - -
- - diff --git a/example/src/docs/zh-CN/user-head/custom-background-color.md b/example/src/docs/zh-CN/user-head/custom-background-color.md deleted file mode 100644 index 513f4873a..000000000 --- a/example/src/docs/zh-CN/user-head/custom-background-color.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## UserHead 用户头像 - - - -UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。 -
- -### 自定义背景颜色 - -可通过 `background-color` 自定义背景颜色。 - - - -
diff --git a/example/src/docs/zh-CN/user-head/custom-color.md b/example/src/docs/zh-CN/user-head/custom-color.md deleted file mode 100644 index ce4d9eec5..000000000 --- a/example/src/docs/zh-CN/user-head/custom-color.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## UserHead 用户头像 - - - -UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。 -
- -### 自定义颜色 - -可通过 `color` 自定义颜色,图标或文字类型(type属性值为 icon 或 label )的情况下,设置字体颜色和背景色。 - - - -
diff --git a/example/src/docs/zh-CN/user-head/custom-user-head-content.md b/example/src/docs/zh-CN/user-head/custom-user-head-content.md deleted file mode 100644 index e761c97f6..000000000 --- a/example/src/docs/zh-CN/user-head/custom-user-head-content.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## UserHead 用户头像 - - - -UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。 -
- -### 自定义图像内容 - -通过插槽自定义图像内容。 - - - -
diff --git a/example/src/docs/zh-CN/user-head/icon-user-head.md b/example/src/docs/zh-CN/user-head/icon-user-head.md deleted file mode 100644 index e97572d1a..000000000 --- a/example/src/docs/zh-CN/user-head/icon-user-head.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## UserHead 用户头像 - - - -UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。 -
- -### 图标头像 - -可通过 `type="icon"` 设置图标头像。 - - - -
diff --git a/example/src/docs/zh-CN/user-head/image-user-head.md b/example/src/docs/zh-CN/user-head/image-user-head.md deleted file mode 100644 index cc3e90d50..000000000 --- a/example/src/docs/zh-CN/user-head/image-user-head.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## UserHead 用户头像 - - - -UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。 -
- -### 图片头像 - -可通过 `type="image"` 设置图片头像。 - - - -
diff --git a/example/src/docs/zh-CN/user-head/label-user-head.md b/example/src/docs/zh-CN/user-head/label-user-head.md deleted file mode 100644 index 3ce9fc7f1..000000000 --- a/example/src/docs/zh-CN/user-head/label-user-head.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## UserHead 用户头像 - - - -UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。 -
- -### 文字头像 - -可通过 `type="label"` 设置文字头像。 - - - -
diff --git a/example/src/docs/zh-CN/user-head/message-count.md b/example/src/docs/zh-CN/user-head/message-count.md deleted file mode 100644 index e32464a30..000000000 --- a/example/src/docs/zh-CN/user-head/message-count.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## UserHead 用户头像 - - - -UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。 -
- -### 头像消息计数 - - - -### 使用小红点代替具体数值 - - - -### 消息计数上限 - - - -
diff --git a/example/src/docs/zh-CN/user-head/min-user-head.md b/example/src/docs/zh-CN/user-head/min-user-head.md deleted file mode 100644 index b1b57c70a..000000000 --- a/example/src/docs/zh-CN/user-head/min-user-head.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## UserHead 用户头像 - - - -UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。 -
- -### 小头像 - -可通过 `min` 设置小头像。 - - - -
diff --git a/example/src/docs/zh-CN/user-head/render-user-head-in-grid.md b/example/src/docs/zh-CN/user-head/render-user-head-in-grid.md deleted file mode 100644 index 7447842d8..000000000 --- a/example/src/docs/zh-CN/user-head/render-user-head-in-grid.md +++ /dev/null @@ -1,17 +0,0 @@ -
-

- -

- -## UserHead 用户头像 - - - -UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。 -
- -### Grid 单元格展示头像 - - - -
diff --git a/example/src/docs/zh-CN/user-head/round-user-head.md b/example/src/docs/zh-CN/user-head/round-user-head.md deleted file mode 100644 index 20db04866..000000000 --- a/example/src/docs/zh-CN/user-head/round-user-head.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## UserHead 用户头像 - - - -UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。 -
- -### 圆形头像 - -可通过 `round` 设置圆形头像。 - - - -
diff --git a/example/src/docs/zh-CN/user-link/basic-usage.md b/example/src/docs/zh-CN/user-link/basic-usage.md deleted file mode 100644 index 3c508df34..000000000 --- a/example/src/docs/zh-CN/user-link/basic-usage.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## UserLink 用户信息链接 - - - -用户信息链接组件,可显示用户详细信息对话框的特殊链接。 -
- -### 基本用法 - -注意 UserLink 组件请求的是 mock 数据,其他用户查询不了,开发时请用真实服务。 - - - -
- - diff --git a/example/src/docs/zh-CN/user-link/cache-users.md b/example/src/docs/zh-CN/user-link/cache-users.md deleted file mode 100644 index 982881692..000000000 --- a/example/src/docs/zh-CN/user-link/cache-users.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## UserLink 用户信息链接 - - - -用户信息链接组件,可显示用户详细信息对话框的特殊链接。 -
- -### 基本用法 - -注意 UserLink 组件请求的是 mock 数据,其他用户查询不了,开发时请用真实服务。 - - - -
diff --git a/example/src/docs/zh-CN/user-link/custom-service.md b/example/src/docs/zh-CN/user-link/custom-service.md deleted file mode 100644 index aa86315f4..000000000 --- a/example/src/docs/zh-CN/user-link/custom-service.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## UserLink 用户信息链接 - - - -用户信息链接组件,可显示用户详细信息对话框的特殊链接。 -
- -### 自定义服务 - -注意 UserLink 组件请求的是 mock 数据,其他用户查询不了,开发时请用真实服务。 - - - -
diff --git a/example/src/docs/zh-CN/user-link/text-field.md b/example/src/docs/zh-CN/user-link/text-field.md deleted file mode 100644 index a365de2c5..000000000 --- a/example/src/docs/zh-CN/user-link/text-field.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## UserLink 用户信息链接 - - - -用户信息链接组件,可显示用户详细信息对话框的特殊链接。 -
- -### 显示字段映射 - -通过 text-field 设置显示字段信息,默认是 userCN -注意 UserLink 组件请求的是 mock 数据,其他用户查询不了,开发时请用真实服务。 - - - -
diff --git a/example/src/docs/zh-CN/user-link/text-split.md b/example/src/docs/zh-CN/user-link/text-split.md deleted file mode 100644 index ec5928e12..000000000 --- a/example/src/docs/zh-CN/user-link/text-split.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## UserLink 用户信息链接 - - - -用户信息链接组件,可显示用户详细信息对话框的特殊链接。 -
- -### 自定义文本分隔符 - -通过 text-split 自定义文本分隔符,默认是 ',' -注意 UserLink 组件请求的是 mock 数据,其他用户查询不了,开发时请用真实服务。 - - - -
diff --git a/example/src/docs/zh-CN/user-link/value-field.md b/example/src/docs/zh-CN/user-link/value-field.md deleted file mode 100644 index 658cf9acd..000000000 --- a/example/src/docs/zh-CN/user-link/value-field.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## UserLink 用户信息链接 - - - -用户信息链接组件,可显示用户详细信息对话框的特殊链接。 -
- -### 值字段映射 - -通过 value-field 设置值字段映射,默认是 userId -注意 UserLink 组件请求的是 mock 数据,其他用户查询不了,开发时请用真实服务。 - - - -
diff --git a/example/src/docs/zh-CN/user-link/value-split.md b/example/src/docs/zh-CN/user-link/value-split.md deleted file mode 100644 index dd4204a48..000000000 --- a/example/src/docs/zh-CN/user-link/value-split.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## UserLink 用户信息链接 - - - -用户信息链接组件,可显示用户详细信息对话框的特殊链接。 -
- -### 自定义值分隔符 - -通过 value-split 自定义值分隔符,默认是 ',' -注意 UserLink 组件请求的是 mock 数据,其他用户查询不了,开发时请用真实服务。 - - - -
diff --git a/example/src/docs/zh-CN/user-link/value.md b/example/src/docs/zh-CN/user-link/value.md deleted file mode 100644 index 4ed00b494..000000000 --- a/example/src/docs/zh-CN/user-link/value.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## UserLink 用户信息链接 - - - -用户信息链接组件,可显示用户详细信息对话框的特殊链接。 - -
- -### 自定义默认值 - -通过 value 自定义默认值,默认为空注意 value 值与 v-model 不能同时使用,同时使用时 v-model 权重更高 - - - -
diff --git a/example/src/docs/zh-CN/user/basic-usage.md b/example/src/docs/zh-CN/user/basic-usage.md deleted file mode 100644 index bd9af691b..000000000 --- a/example/src/docs/zh-CN/user/basic-usage.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 -
- -### 基本用法 - -注意 User 组件请求的是 mock 数据,其他用户查询不了,开发时请用真实服务。 - - - -
- - diff --git a/example/src/docs/zh-CN/user/cache-users.md b/example/src/docs/zh-CN/user/cache-users.md deleted file mode 100644 index b83acead2..000000000 --- a/example/src/docs/zh-CN/user/cache-users.md +++ /dev/null @@ -1,27 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 -
- -### 缓存用户 - -通过 `cache` 属性指定用户数据是否缓存,默认为缓存。 - -
- -`cache-key` 属性可以自定义缓存的 key 值,默认为 aurora-user 。 - -
- -`cache-fields` 属性用于指定缓存哪些用户数据。 - - - -
diff --git a/example/src/docs/zh-CN/user/collapse-show-overflow-tooltip.md b/example/src/docs/zh-CN/user/collapse-show-overflow-tooltip.md deleted file mode 100644 index 1da889d6b..000000000 --- a/example/src/docs/zh-CN/user/collapse-show-overflow-tooltip.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 -
- -### 超出提示 - -注意 `collapse-show-overflow-tooltip` 此属性必须设置缓存 `cache` 为 `true` 时才会生效。 - - - -
diff --git a/example/src/docs/zh-CN/user/collapse-tags.md b/example/src/docs/zh-CN/user/collapse-tags.md deleted file mode 100644 index 13a9c46f6..000000000 --- a/example/src/docs/zh-CN/user/collapse-tags.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 -
- -### 折叠标签 - -`collapse-tags` 属性是是否把除第一个用户的其他用户折叠起来。 - - - -
diff --git a/example/src/docs/zh-CN/user/custom-placeholder.md b/example/src/docs/zh-CN/user/custom-placeholder.md deleted file mode 100644 index a0f30edbe..000000000 --- a/example/src/docs/zh-CN/user/custom-placeholder.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 -
- -### 自定义占位符 - -通过 `placeholder` 属性自定义用户输入框占位文本。 - - - -
diff --git a/example/src/docs/zh-CN/user/custom-service.md b/example/src/docs/zh-CN/user/custom-service.md deleted file mode 100644 index b4ea19172..000000000 --- a/example/src/docs/zh-CN/user/custom-service.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 -
- -### 自定义服务 - -通过 `service` 属性可自定义用户服务,当用户在文本框中输入准确的账号时,会在下拉菜单中出现此用户。 -通过 `sort-by-fetch-data` 联想时下拉框的数据顺序和接口返回的数据顺序一致 - - - -
diff --git a/example/src/docs/zh-CN/user/custom-sort.md b/example/src/docs/zh-CN/user/custom-sort.md deleted file mode 100644 index 8a199ff6c..000000000 --- a/example/src/docs/zh-CN/user/custom-sort.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 -
- -### 自定义排序 - -通过 `sortable` 属性引用 `sortablejs` 进行排序。 - - - -
diff --git a/example/src/docs/zh-CN/user/delay-load.md b/example/src/docs/zh-CN/user/delay-load.md deleted file mode 100644 index c9a266f92..000000000 --- a/example/src/docs/zh-CN/user/delay-load.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 -
- -### 延时加载 - -通过 `delay` 属性指定延时加载的时间,单位是毫秒。 - - - -
diff --git a/example/src/docs/zh-CN/user/dynamic-disable.md b/example/src/docs/zh-CN/user/dynamic-disable.md deleted file mode 100644 index 8f79ba59f..000000000 --- a/example/src/docs/zh-CN/user/dynamic-disable.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 -
- -### 禁用状态 - -设置 `disabled` 属性可禁用 User 组件。 - - - -
diff --git a/example/src/docs/zh-CN/user/event-change.md b/example/src/docs/zh-CN/user/event-change.md deleted file mode 100644 index 131cf9ad9..000000000 --- a/example/src/docs/zh-CN/user/event-change.md +++ /dev/null @@ -1,28 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 - -
- -### 值改变事件 - -通过 `change` 事件能获取用户类型。 - - - -
- -### 用户查询错误提示 - -通过 `error` 事件能获取查询失败的输入。 - - - -
diff --git a/example/src/docs/zh-CN/user/load-after-input-the-length.md b/example/src/docs/zh-CN/user/load-after-input-the-length.md deleted file mode 100644 index 9224c5d03..000000000 --- a/example/src/docs/zh-CN/user/load-after-input-the-length.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 -
- -### 输入完指定长度后加载 - -通过 `suggest-length` 属性可指定输入多少个字符后开始请求服务。 - - - -
diff --git a/example/src/docs/zh-CN/user/multiple-users.md b/example/src/docs/zh-CN/user/multiple-users.md deleted file mode 100644 index ca512d035..000000000 --- a/example/src/docs/zh-CN/user/multiple-users.md +++ /dev/null @@ -1,26 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 -
- -### 多用户 - -设置 `multiple` 属性即可启用多用户形式。 - - - -
- -### 折叠 Tag - -设置 `multiple` 属性即可启用多用户形式。 -通过 `collapse-tags` 配置多用户模式下是否展示折叠标签,默认为 false。 - - diff --git a/example/src/docs/zh-CN/user/tag-copy-all.md b/example/src/docs/zh-CN/user/tag-copy-all.md deleted file mode 100644 index b24113032..000000000 --- a/example/src/docs/zh-CN/user/tag-copy-all.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 -
- -### user选择器选项可复制 - -设置 `copyable` 属性后,可以复制所有的 `tag` 文本内容以逗号分隔 - - - -
diff --git a/example/src/docs/zh-CN/user/tag-copy.md b/example/src/docs/zh-CN/user/tag-copy.md deleted file mode 100644 index b9267832a..000000000 --- a/example/src/docs/zh-CN/user/tag-copy.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 -
- -### user选择器选项可复制 - -通过 `tag-selectable` 输入框中已选择的选项可通过鼠标选择,然后按 Ctrl + C 或右键进行复制。 - - - -
diff --git a/example/src/docs/zh-CN/user/text-field.md b/example/src/docs/zh-CN/user/text-field.md deleted file mode 100644 index 4ca9c7677..000000000 --- a/example/src/docs/zh-CN/user/text-field.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 -
- -### 显示字段映射 - -通过 `text-field` 属性可指定显示用户的哪个字段信息。 - - - -
diff --git a/example/src/docs/zh-CN/user/user-options.md b/example/src/docs/zh-CN/user/user-options.md deleted file mode 100644 index da6e0ec37..000000000 --- a/example/src/docs/zh-CN/user/user-options.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 -
- -### 自定义选项文本 - -通过 `options` 插槽设置自定义下拉选项文本。 - - - -
diff --git a/example/src/docs/zh-CN/user/user-select-size.md b/example/src/docs/zh-CN/user/user-select-size.md deleted file mode 100644 index 260966f53..000000000 --- a/example/src/docs/zh-CN/user/user-select-size.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 -
- -### 尺寸设置 - -通过 `size` 属性可指定用户输入框的尺寸,包括 medium、small、mini 三个选项。 - - - -
diff --git a/example/src/docs/zh-CN/user/value-field.md b/example/src/docs/zh-CN/user/value-field.md deleted file mode 100644 index cceb3d9c0..000000000 --- a/example/src/docs/zh-CN/user/value-field.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 -
- -### 取值字段映射 - -通过 `value-field` 属性可指定获取到的 value 值的形式,默认为 userId,还包括 userAccount。 - - - -
diff --git a/example/src/docs/zh-CN/user/value-split.md b/example/src/docs/zh-CN/user/value-split.md deleted file mode 100644 index 3823e56c4..000000000 --- a/example/src/docs/zh-CN/user/value-split.md +++ /dev/null @@ -1,20 +0,0 @@ -
-

- -

- -## User 用户 - - - -通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。 -
- -### 值分隔符 - -通过 `value-split` 属性可指定多用户下获取到的 value 值中不同用户之间的分隔符,默认为 `,`。 -通过 `text-split` 属性可指定多用户模式下输入匹配的文本分隔符,默认为 `,` ,可选值为 `!~%(=+^{/}).!]<->[\,:*#;`。 - - - -
diff --git a/example/src/docs/zh-CN/wizard/base-flow.md b/example/src/docs/zh-CN/wizard/base-flow.md deleted file mode 100644 index fd1cc0167..000000000 --- a/example/src/docs/zh-CN/wizard/base-flow.md +++ /dev/null @@ -1,15 +0,0 @@ -
-

- -

- -## Wizard 流程图 - - - -以特定的图形符号加上说明,表示各流程节点关系的组件。 -
- -### 基本流程图 - -
diff --git a/example/src/docs/zh-CN/wizard/basic-usage.md b/example/src/docs/zh-CN/wizard/basic-usage.md deleted file mode 100644 index 7854bb12b..000000000 --- a/example/src/docs/zh-CN/wizard/basic-usage.md +++ /dev/null @@ -1,21 +0,0 @@ -
-

- -

- -## Wizard 流程图 - - - -以特定的图形符号加上说明,表示各流程节点关系的组件。 -
- -### 基本用法 - -通过 `base-flow` 属性设置基本流程图模式,以节点图示的方式,显示流程节点及节点间关系,节点的信息只有节点名称和状态。 - - - -
- - diff --git a/example/src/docs/zh-CN/wizard/page-guide.md b/example/src/docs/zh-CN/wizard/page-guide.md deleted file mode 100644 index 2a3c07fce..000000000 --- a/example/src/docs/zh-CN/wizard/page-guide.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Wizard 流程图 - - - -以特定的图形符号加上说明,表示各流程节点关系的组件。 -
- -### 页向导流程图 - -通过 `page-guide` 属性设置页向导流程图模式,用于导航当前页面与上一页面、下一页面的前后关系,包括流程图区域、页面展示区域、功能按钮区域。 - - - -
diff --git a/example/src/docs/zh-CN/wizard/slot.md b/example/src/docs/zh-CN/wizard/slot.md deleted file mode 100644 index c1002f238..000000000 --- a/example/src/docs/zh-CN/wizard/slot.md +++ /dev/null @@ -1,25 +0,0 @@ -
-

- -

- -## Wizard 流程图 - - - -以特定的图形符号加上说明,表示各流程节点关系的组件。 -
- -### 步骤插槽 - -页向导流程图里通过 `stepbutton` 插槽可以自定义步骤按钮或内容。 - - - -
- -### 基本插槽 - -通过 `base` 配置基本内容。 - - diff --git a/example/src/docs/zh-CN/wizard/status-icon.md b/example/src/docs/zh-CN/wizard/status-icon.md deleted file mode 100644 index 93077f4b3..000000000 --- a/example/src/docs/zh-CN/wizard/status-icon.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Wizard 流程图 - - - -以特定的图形符号加上说明,表示各流程节点关系的组件。 -
- -### 自定义状态图标 - -通过 `status-icon` 属性自定义状态图标。 - - - -
diff --git a/example/src/docs/zh-CN/wizard/time-line-flow.md b/example/src/docs/zh-CN/wizard/time-line-flow.md deleted file mode 100644 index 1d5f78af9..000000000 --- a/example/src/docs/zh-CN/wizard/time-line-flow.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Wizard 流程图 - - - -以特定的图形符号加上说明,表示各流程节点关系的组件。 -
- -### 时间线流程图 - -通过 `time-line-flow` 属性设置时间线流程图,通过 `time-icon` 属性自定义时间图标。以时间点的方式竖向显示流程节点处理信息,包括节点名称、状态、完成时间、用户。 - - - -
diff --git a/example/src/docs/zh-CN/wizard/vertical.md b/example/src/docs/zh-CN/wizard/vertical.md deleted file mode 100644 index d27ba53d4..000000000 --- a/example/src/docs/zh-CN/wizard/vertical.md +++ /dev/null @@ -1,19 +0,0 @@ -
-

- -

- -## Wizard 流程图 - - - -以特定的图形符号加上说明,表示各流程节点关系的组件。 -
- -### 垂直流程图 - -通过 `vertical` 属性设置垂直流程图模式,以节点图示的方式竖向显示流程节点及节点间关系,节点的信息包含节点名称、状态、完成时间、用户。 - - - -
diff --git a/example/test/alert.spec.jsx b/example/test/alert.spec.jsx deleted file mode 100644 index 19fcc4aa8..000000000 --- a/example/test/alert.spec.jsx +++ /dev/null @@ -1,36 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test } from 'vitest' -import { Alert } from '@opentiny/vue' -import { iconBoat } from '@opentiny/vue-icon' - -describe('Alert ', () => { - test('render test & type & size', async () => { - const TEXT = 'Winter is coming' - const wrapper = mount(() => ) - expect(wrapper.find('.tiny-alert__close').exists()).toBe(true) - expect(wrapper.find('.tiny-alert__title').text()).toEqual(TEXT) - expect(wrapper.find('.tiny-alert').classes()).toContain('tiny-alert--large') - expect(wrapper.find('.tiny-alert').classes()).toContain('tiny-alert--success') - }) - - test('icon', async () => { - const TEXT = 'Winter is coming' - const wrapper = mount(() => ) - expect(wrapper.find('.tiny-alert__icon').exists()).toBe(true) - }) - - test('slot', async () => { - const TEXT = 'Winter is coming' - const wrapper = mount(() => ( - TEXT - }} - description="type 为 success" - /> - )) - expect(wrapper.find('.tiny-alert__title').text()).toEqual(TEXT) - }) -}) diff --git a/example/test/autocomplete.spec.jsx b/example/test/autocomplete.spec.jsx deleted file mode 100644 index 5c32954c8..000000000 --- a/example/test/autocomplete.spec.jsx +++ /dev/null @@ -1,73 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { Autocomplete } from '@opentiny/vue' -import { ref, nextTick } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - - -const loadAll = [ - { - value: 'GFD科技YX公司', - address: '福州' - }, - { - value: 'WWWW科技YX公司', - address: '深圳福田区' - }, - { - value: 'RFV有限责任公司', - address: '中山市' - } -] - -const querySearch = (queryString, cb) => { - const restaurants = loadAll - let results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants - cb(results) -} - -const createFilter = (queryString) => (restaurant) => restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0 - -describe('autocomplete', () => { - test('size', async () => { - const value = 'GFD科技' - const TEXT = '请输入内容' - const medium = 'medium' - const wrapper = mount(() => - - ) - expect(wrapper.find('.tiny-input-medium').exists()).toBe(true) - - }) - - test('events', async () => { - const value = '' - const keys = 'name' - const handleSelect = vi.fn() - const wrapper = mount(() => - - ) - await nextTick() - const target = wrapper.getComponent(Autocomplete).vm - await nextTick() - target.handleKeyEnter() - expect(handleSelect).toHaveBeenCalled() - }) - - test('slot', async () => { - const value = '' - const TEXT = '请输入内容' - const wrapper = mount(() =>
前置内容
, - append: () =>
后置内容
- }}> - -
) - - expect(wrapper.find('.tiny-input-group__prepend').exists()).toBe(true) - expect(wrapper.find('.tiny-input-group__append').exists()).toBe(true) - }) - -}) diff --git a/example/test/badge.spec.jsx b/example/test/badge.spec.jsx deleted file mode 100644 index 546f8c961..000000000 --- a/example/test/badge.spec.jsx +++ /dev/null @@ -1,45 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test } from 'vitest' -import { Badge } from '@opentiny/vue' - -describe('Badge ', () => { - test('type & value', async () => { - const NUM = 2 - const TEXT = 'danger 类型' - const wrapper = mount(() => ( - - {TEXT} - - )) - expect(wrapper.find('.tiny-badge__content-text').text()).toEqual(String(NUM)) - expect(wrapper.find('.tiny-badge').classes()).toContain('tiny-badge--danger') - }) - - test('max', async () => { - const wrapper = mount(() => ( - - 小圆点显示 - - )) - expect(wrapper.find('.tiny-badge__content-text').text()).toEqual('2+') - }) - - test('is-dot', async () => { - const wrapper = mount(() => 小圆点显示) - expect(wrapper.find('.tiny-badge').classes()).toContain('tiny-badge--default') - }) - - test('slot', async () => { - const wrapper = mount(() => ( -
自定义
- }} - > - 自定义内容插槽 -
- )) - expect(wrapper.find('.badge__content').text()).toEqual('自定义') - }) -}) diff --git a/example/test/button-group.spec.jsx b/example/test/button-group.spec.jsx deleted file mode 100644 index d3d45a7b6..000000000 --- a/example/test/button-group.spec.jsx +++ /dev/null @@ -1,44 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { ButtonGroup, Button } from '@opentiny/vue' -import { ref } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - -const groupData = [ - { text: 'Button1', value: 'Button1' }, - { text: 'Button2', value: 'Button2' }, - { text: 'Button3', value: 'Button3' } -] - -describe('button-group', () => { - test('type & icon', async () => { - const wrapper = mount(() => ) - expect(wrapper.find('button').classes()).toContain('disabled') - expect(wrapper.findAll('button').length).toBe(3) - }) - test('show-more', async () => { - const checkedVal = 'Button1' - const wrapper = mount(() => ) - expect(wrapper.find('svg').classes()).toContain('tiny-svg') - expect(wrapper.find('.tiny-group-item').classes()).toContain('show-more') - }) - - test('slot', async () => { - const wrapper = mount(() => ) - expect(wrapper.findAll('button').length).toBe(1) - }) - - test('events', async () => { - const handleEdit = vi.fn() - const checkedVal = 'Button1' - const wrapper = mount(() => ) - const buttons = wrapper.findAll('button') - await buttons[buttons.length - 1].trigger('click') - expect(handleEdit).toHaveBeenCalled() - }) - -}) diff --git a/example/test/button.spec.jsx b/example/test/button.spec.jsx deleted file mode 100644 index 2509e6f1b..000000000 --- a/example/test/button.spec.jsx +++ /dev/null @@ -1,56 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { Button } from '@opentiny/vue' -import { iconBoat } from '@opentiny/vue-icon' -import { ref, nextTick } from 'vue' - -describe('Button ', () => { - test('type & icon', async () => { - const TEXT = '危险按钮' - const wrapper = mount(() => ( - - )) - expect(wrapper.find('.tiny-svg').exists()).toBe(true) - }) - - test('size & plain', async () => { - const TEXT = '危险按钮' - const SIZE = 'large' - const wrapper = mount(() => ( - - )) - expect(wrapper.find('.tiny-button').classes()).toContain('tiny-button--large') - expect(wrapper.find('.tiny-button').classes()).toContain('is-plain') - }) - - test('circle & disabled', async () => { - const disabledValue = ref(false) - const wrapper = mount(() => ( - - )) - expect(wrapper.find('.tiny-button').classes()).toContain('is-circle') - expect(wrapper.find('.is-disabled').exists()).toBe(false) - disabledValue.value = true - await nextTick() - expect(wrapper.find('.tiny-button').classes()).toContain('is-disabled') - }) - - test('events', async () => { - const handleClick = vi.fn() - const TEXT = '危险按钮' - const wrapper = mount(() => ( - - )) - const button = wrapper.find('button') - await button.trigger('click') - expect(handleClick).toBeCalled() - }) -}) diff --git a/example/test/cascader-panel.spec.jsx b/example/test/cascader-panel.spec.jsx deleted file mode 100644 index 7d97fff8c..000000000 --- a/example/test/cascader-panel.spec.jsx +++ /dev/null @@ -1,122 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { CascaderPanel } from '@opentiny/vue' -import { ref, nextTick } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - - -const options = [ - { - value: 'zhinan', - label: '指南', - children: [ - { - value: 'anzhuang', - label: '安装', - children: [ - { - value: 'xiangmudengji', - label: '项目登记' - }, - { - value: 'huanjingzhunbei', - label: '环境准备' - }, - { - value: 'anzhuangcli', - label: '安装 CLI' - }, - { - value: 'chuangjianxiangmu', - label: '创建项目' - } - ] - }, - { - value: 'kaifa', - label: '开发', - children: [ - { - value: 'yinruzujian', - label: '引入组件' - }, - { - value: 'monishuju', - label: '模拟数据' - } - ] - } - ] - }, - { - value: 'zujian', - label: '组件', - children: [ - { - value: 'basic', - label: '框架风格', - children: [ - { - value: 'layout', - label: 'Layout 布局' - }, - { - value: 'color', - label: 'Color 色彩' - }, - { - value: 'font', - label: 'Font 字体' - }, - { - value: 'icon', - label: 'Icon 图标' - } - ] - }] - }] -let value = ['zhinan', 'anzhuang'] - -describe('cascader-panel', () => { - test('options', async () => { - const separators = '+' - const medium = 'medium' - const wrapper = mount(() => ) - expect(wrapper.findAll('.tiny-cascader-node').length).toBe(2) - - }) - - test('triggerOnFocus', async () => { - const handleChange = vi.fn() - const wrapper = mount(() => ) - - const list = wrapper.findAll('.tiny-cascader-node') - const [znNode, zjNode] = list - '.arrow-right.el-cascader-node__postfix' - await znNode.trigger('click') - expect(handleChange).toBeCalled() - }) - - test('slot', async () => { - const value = 'pppppppppp' - const TEXT = '请输入内容' - const wrapper = mount(() => <> {scopeData.data.label}自定义 - !scopeData.node.isLeaf&& ({scopeData.data.children.length}) - }} - >) - expect(wrapper.find('.only-slot').exists()).toBe(true) - }) - -}) diff --git a/example/test/cascader.spec.jsx b/example/test/cascader.spec.jsx deleted file mode 100644 index dfc1907a6..000000000 --- a/example/test/cascader.spec.jsx +++ /dev/null @@ -1,123 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { Cascader } from '@opentiny/vue' -import { ref, nextTick } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - - -const options = [ - { - value: 'zhinan', - label: '指南', - children: [ - { - value: 'anzhuang', - label: '安装', - children: [ - { - value: 'xiangmudengji', - label: '项目登记' - }, - { - value: 'huanjingzhunbei', - label: '环境准备' - }, - { - value: 'anzhuangcli', - label: '安装 CLI' - }, - { - value: 'chuangjianxiangmu', - label: '创建项目' - } - ] - }, - { - value: 'kaifa', - label: '开发', - children: [ - { - value: 'yinruzujian', - label: '引入组件' - }, - { - value: 'monishuju', - label: '模拟数据' - } - ] - } - ] - }, - { - value: 'zujian', - label: '组件', - children: [ - { - value: 'basic', - label: '框架风格', - children: [ - { - value: 'layout', - label: 'Layout 布局' - }, - { - value: 'color', - label: 'Color 色彩' - }, - { - value: 'font', - label: 'Font 字体' - }, - { - value: 'icon', - label: 'Icon 图标' - } - ] - }] - }] -let value = ['zhinan', 'anzhuang'] - -describe('cascader', () => { - test('size', async () => { - const separators = '+' - const medium = 'medium' - const wrapper = mount(() => ) - expect(wrapper.find('.tiny-cascader--medium').exists()).toBe(true) - - }) - test('triggerOnFocus', async () => { - const triggerOnFocus = vi.fn() - const wrapper = mount(() => ) - - await nextTick() - await wrapper.find('input').trigger('focus') - await nextTick() - expect(triggerOnFocus).toHaveBeenCalledTimes(1) - }) - - test('slot', async () => { - const value = 'pppppppppp' - const TEXT = '请输入内容' - const wrapper = mount(() =>
没有选项
- }} - >
) - - expect(wrapper.find('.tiny-cascader__empty-text').exists()).toBe(true) - }) -}) diff --git a/example/test/checkbox.spec.jsx b/example/test/checkbox.spec.jsx deleted file mode 100644 index 0a235ef18..000000000 --- a/example/test/checkbox.spec.jsx +++ /dev/null @@ -1,41 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { Checkbox, CheckboxGroup, CheckboxButton } from '@opentiny/vue' -import { ref } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - -let checked = '' -describe('checkbox', () => { - test('size', async () => { - const wrapper = mount(() => ) - expect(wrapper.find('.tiny-checkbox__original').attributes()['false-value']).toBe('假文本') - }) - - test('slot', async () => { - const wrapper = mount(() => 复选框1 - }} - >) - expect(wrapper.find('.only-slot').exists()).toBe(true) - }) - - test('events', async () => { - const handleChange = vi.fn() - let checkedVal = [] - const wrapper = mount(() => - - - ) - await wrapper.find('.tiny-checkbox-button').trigger('click') - expect(handleChange).toHaveBeenCalled() - }) -}) diff --git a/example/test/common/globalConfig.js b/example/test/common/globalConfig.js deleted file mode 100644 index 72c300456..000000000 --- a/example/test/common/globalConfig.js +++ /dev/null @@ -1,10 +0,0 @@ -const { randomBytes } = await import('node:crypto') - -export const randomValues = (global) => { - global.crypto = {} - global.crypto.getRandomValues = function getRandomValues(buf) { - const bytes = randomBytes(buf.length) - buf.set(bytes) - return buf - } -} diff --git a/example/test/date-picker.spec.jsx b/example/test/date-picker.spec.jsx deleted file mode 100644 index dd2df3408..000000000 --- a/example/test/date-picker.spec.jsx +++ /dev/null @@ -1,25 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { DatePicker } from '@opentiny/vue' -import { ref } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - -describe('date-picker', () => { - test('readonly', async () => { - let value = '2020/10/29' - const wrapper = mount(() => ) - expect(wrapper.find('input').attributes()).toHaveProperty('readonly') - }) - - test('events', async () => { - let value = '' - const wrapper = mount(() => ) - expect(document.querySelector('.tiny-picker-panel')).toBe(null) - await wrapper.find('input').trigger('focus') - expect(document.querySelector('.tiny-picker-panel') !== 'null').toBe(true) - }) -}) diff --git a/example/test/drop-times.spec.jsx b/example/test/drop-times.spec.jsx deleted file mode 100644 index 6f66fa534..000000000 --- a/example/test/drop-times.spec.jsx +++ /dev/null @@ -1,25 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { DropTimes } from '@opentiny/vue' -import { nextTick, ref } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - -describe('drop-times', () => { - test('size', async () => { - let value = '' - const wrapper = mount(() => ) - expect(wrapper.find('.tiny-select--medium').exists()).toBe(true) - }) - - test('events', async () => { - const handleChange = vi.fn() - let value = '' - const wrapper = mount(() => ) - await wrapper.find('.tiny-select').trigger('click') - await nextTick() - await document.querySelector('.tiny-select-dropdown__item').click() - expect(handleChange).toHaveBeenCalled() - }) -}) diff --git a/example/test/file-upload.spec.jsx b/example/test/file-upload.spec.jsx deleted file mode 100644 index c348b5875..000000000 --- a/example/test/file-upload.spec.jsx +++ /dev/null @@ -1,54 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { FileUpload } from '@opentiny/vue' -import { ref } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - -describe('file-upload', () => { - test('drag', async () => { - const action = 'http://localhost:3000/api/upload' - const wrapper = mount(() => - ) - expect(wrapper.find('.tiny-upload-dragger').exists()).toBe(true) - }) - - - test('slot', async () => { - const action = 'http://localhost:3000/api/upload' - const wrapper = mount(() =>
只能上传jpg/png文件,且不超过500kb
- }} - > -
) - expect(wrapper.find('.tiny-upload__tip').exists()).toBe(true) - }) - - test('events', async () => { - const handleDelete = vi.fn() - const fileList = [ - { - name: 'test1', - url: 'https://test-static-resource.obs.cn-north-7.ulanqab.huawei.com/tinydoc-website-vue/1.0.0.20220924181516/static/images/ld.png' - }, - { - name: 'test2', - url: 'https://test-static-resource.obs.cn-north-7.ulanqab.huawei.com/tinydoc-website-vue/1.0.0.20220924181516/static/images/ry.png' - } - ] - const action = 'http://localhost:3000/api/upload' - const wrapper = mount(() => - ) - await wrapper.find('span').trigger('click') - expect(handleDelete).toHaveBeenCalled() - }) -}) diff --git a/example/test/form.spec.jsx b/example/test/form.spec.jsx deleted file mode 100644 index e6f0d9045..000000000 --- a/example/test/form.spec.jsx +++ /dev/null @@ -1,55 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { Form, Input, FormItem, Button } from '@opentiny/vue' -import { nextTick, ref } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - -const createData = { - quantity: '1' -} - -describe('form', () => { - test('label-width', async () => { - const wrapper = mount(() =>
- - - -
) - expect(wrapper.find('.tiny-form-item__content').attributes().style).toBe('margin-left: 100px;') - }) - - - test('slot', async () => { - const action = 'http://localhost:3000/api/upload' - const wrapper = mount(() =>
- <>必填 - }}> - - -
) - expect(wrapper.find('.tiny-form-item__label').text()).toBe('必填') - }) - - test('events', async () => { - const rules = { - quantity: { required: true } - } - - const wrapper = mount(() =>
- - - -
) - const form = wrapper.findComponent(Form).componentVM - await nextTick() - - const valid = await form - .validate() - .then(() => true) - .catch(() => false) - expect(valid).toBe(true) - }) -}) diff --git a/example/test/input.spec.jsx b/example/test/input.spec.jsx deleted file mode 100644 index 5d4996a09..000000000 --- a/example/test/input.spec.jsx +++ /dev/null @@ -1,31 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { Input } from '@opentiny/vue' -import { nextTick, ref } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - -let value = '' - -describe('input', () => { - test('maxlength', async () => { - const wrapper = mount(() => ) - expect(wrapper.find('input').attributes().maxlength).toBe('5') - }) - - test('slot', async () => { - const wrapper = mount(() => <>Http:// - }}>) - expect(wrapper.find('.tiny-input-group__prepend').text()).toBe('Http://') - }) - - test('events', async () => { - const focus = vi.fn() - const wrapper = mount(() => ) - await wrapper.find('input').trigger('focus') - await nextTick() - expect(focus).toHaveBeenCalled() - }) -}) diff --git a/example/test/ip-address.spec.jsx b/example/test/ip-address.spec.jsx deleted file mode 100644 index 0162da774..000000000 --- a/example/test/ip-address.spec.jsx +++ /dev/null @@ -1,32 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { IpAddress } from '@opentiny/vue' -import { nextTick, ref } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - -let value = '' - -describe('ip-address', () => { - test('readonly', async () => { - const wrapper = mount(() => ) - expect(wrapper.find('input').attributes()).toHaveProperty('readonly') - }) - - - test('slot', async () => { - const wrapper = mount(() => -- - }}>) - expect(wrapper.find('i').text()).toBe('--') - }) - - test('events', async () => { - const focus = vi.fn() - const wrapper = mount(() => ) - await wrapper.find('input').trigger('focus') - await nextTick() - expect(focus).toHaveBeenCalled() - }) -}) diff --git a/example/test/link.spec.jsx b/example/test/link.spec.jsx deleted file mode 100644 index fc5a99ec5..000000000 --- a/example/test/link.spec.jsx +++ /dev/null @@ -1,24 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { Link } from '@opentiny/vue' -import { nextTick, ref } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - -const iconTest = 'IconDel()' - -describe('link', () => { - test('href', async () => { - const wrapper = mount(() => ) - expect(wrapper.find('.tiny-link').attributes().href).toBe('localhost:3000/#/zh-CN/index') - }) - - test('slot', async () => { - const wrapper = mount(() => iconTest - }}>) - expect(wrapper.text()).toContain(iconTest) - }) - -}) diff --git a/example/test/numeric.spec.jsx b/example/test/numeric.spec.jsx deleted file mode 100644 index d89653d1a..000000000 --- a/example/test/numeric.spec.jsx +++ /dev/null @@ -1,24 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { Numeric } from '@opentiny/vue' -import { nextTick, ref } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - -let value = 1 - -describe('numeric', () => { - test('size', async () => { - const wrapper = mount(() => ) - expect(wrapper.find('.tiny-input-medium').exists()).toBe(true) - }) - - test('events', async () => { - const focus = vi.fn() - const wrapper = mount(() => ) - await wrapper.find('input').trigger('focus') - await nextTick() - expect(focus).toHaveBeenCalled() - }) -}) diff --git a/example/test/pop-editor.spec.jsx b/example/test/pop-editor.spec.jsx deleted file mode 100644 index 55b92d080..000000000 --- a/example/test/pop-editor.spec.jsx +++ /dev/null @@ -1,39 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { Popeditor } from '@opentiny/vue' -import { nextTick, ref } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - -let value = '' - -describe('pop-editor', () => { - test('readonly & close', async () => { - const handleClose = vi.fn() - const wrapper = mount(() => ) - expect(wrapper.find('.tiny-popeditor-readonly').exists()).toBe(true) - expect(wrapper.find('.tiny-dialog-box__wrapper').attributes().style).toBe('display: none;') - await (wrapper.find('input')).trigger('click') - await nextTick() - expect(document.querySelector('.tiny-dialog-box__wrapper').style).not.toHaveProperty('display', 'none') - await document.querySelector('.tiny-dialog-box__headerbtn').click() - expect(handleClose).toHaveBeenCalled() - await nextTick() - expect(document.querySelector('.tiny-dialog-box__wrapper').style).toHaveProperty('display', 'none') - }) - - test('slot', async () => { - const params = { - name: '' - } - const wrapper = mount(() => <>
公司名:
-
- Search -
- }}>
) - expect(document.querySelector('.tiny-button--primary') !== null).toBe(true) - }) - -}) diff --git a/example/test/pop-upload.spec.jsx b/example/test/pop-upload.spec.jsx deleted file mode 100644 index 6c0ad0288..000000000 --- a/example/test/pop-upload.spec.jsx +++ /dev/null @@ -1,19 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { PopUpload } from '@opentiny/vue' -import { nextTick, ref } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - -describe('pop-upload', () => { - test('size', async () => { - const wrapper = mount(() => ) - expect(wrapper.find('.tiny-button--medium').exists()).toBe(true) - }) - - test('disabled', async () => { - const wrapper = mount(() => ) - expect(wrapper.find('.is-disabled').exists()).toBe(true) - }) -}) diff --git a/example/test/radio.spec.jsx b/example/test/radio.spec.jsx deleted file mode 100644 index 7cce6ca31..000000000 --- a/example/test/radio.spec.jsx +++ /dev/null @@ -1,32 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { Radio } from '@opentiny/vue' -import { nextTick, ref } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - -let value = '' - -describe('radio', () => { - test('disabled', async () => { - const wrapper = mount(() => ) - expect(wrapper.find('.is-disabled').exists()).toBe(true) - }) - - test('slot', async () => { - const wrapper = mount(() => 选项描述 - }}>) - expect(wrapper.find('.des').text()).toBe('选项描述') - }) - - test('events', async () => { - const change = vi.fn() - const wrapper = mount(() => ) - await wrapper.find('.tiny-radio__input').trigger('click') - await nextTick() - expect(change).toHaveBeenCalled() - - }) -}) diff --git a/example/test/search.spec.jsx b/example/test/search.spec.jsx deleted file mode 100644 index a91a86dac..000000000 --- a/example/test/search.spec.jsx +++ /dev/null @@ -1,55 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { Search } from '@opentiny/vue' -import { nextTick, ref } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - -let value = '' - -describe('search', () => { - test('searchTypes', async () => { - const searchTypes = [ - { - text: '找人', - value: 1 - }, - { - text: '找文档', - value: 2 - } - ] - const wrapper = mount(() => ) - expect(wrapper.find('.tiny-search__text').exists()).toBe(true) - }) - - - test('slot', async () => { - const searchTypes1 = [ - { - text: '插槽1', - value: 1 - }, - { - text: '插槽2', - value: 2 - } - ] - const wrapper = mount(() => {slotScope.slotScope.text} - }}>) - expect(wrapper.find('.tiny-search__selector').attributes().style).toBe('display: none;') - await wrapper.find('.tiny-search__present').trigger('click') - await nextTick() - expect(wrapper.find('.tiny-search__selector').attributes().style).not.toHaveProperty('display', 'none') - }) - - test('events', async () => { - const handleSearch = vi.fn() - const wrapper = mount(() => ) - await wrapper.find('a').trigger('click') - await nextTick() - expect(handleSearch).toHaveBeenCalled() - }) -}) diff --git a/example/test/select.spec.jsx b/example/test/select.spec.jsx deleted file mode 100644 index 521ae9657..000000000 --- a/example/test/select.spec.jsx +++ /dev/null @@ -1,74 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { Select, Option } from '@opentiny/vue' -import { nextTick, ref } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - -const _mount = (template, data, otherObj) => - mount( - { - components: { - 'tiny-select': Select, - 'tiny-option': Option - }, - template, - data, - ...otherObj, - }, - { - attachTo: 'body', - } - ) - -describe('select', () => { - test('multiple-limit', async () => { - let wrapper = _mount( - ` - - - - - `, - () => ({ - options: [ - { - value: '选项1', - label: '黄金糕' - }, - { - value: '选项2', - label: '双皮奶' - } - ], - value: '选项2' - }) - ) - await nextTick() - await wrapper.find('input').trigger('click') - expect(document.querySelector('.is-disabled') !== null).toBe(true) - }) - - test('slot', async () => { - let value = '' - const wrapper = mount(() => ) - await wrapper.find('input').trigger('click') - expect(wrapper.find('.tips').exists()).toBe(true) - }) - - test('events', async () => { - let value = '' - const handleFocus = vi.fn() - const wrapper = mount(() => ) - await wrapper.find('input').trigger('focus') - await nextTick() - expect(handleFocus).toHaveBeenCalled() - }) -}) diff --git a/example/test/slider.spec.jsx b/example/test/slider.spec.jsx deleted file mode 100644 index acb102cd0..000000000 --- a/example/test/slider.spec.jsx +++ /dev/null @@ -1,32 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { Slider } from '@opentiny/vue' -import { nextTick, ref } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - -let value = 40 - -describe('slider', () => { - test('vertical', async () => { - const wrapper = mount(() => ) - expect(wrapper.find('.tiny-slider__vertical').exists()).toBe(true) - }) - - test('slot', async () => { - const wrapper = mount(() => {slotScope.slotScope}% - }}>) - expect(wrapper.find('.onlyText').text()).toBe(`${value}%`) - }) - - test('events', async () => { - const mousedown = vi.fn() - const wrapper = mount(() => ) - await wrapper.find('.tiny-slider__handle').trigger('mousedown') - await nextTick() - expect(mousedown).toHaveBeenCalled() - - }) -}) diff --git a/example/test/switch.spec.jsx b/example/test/switch.spec.jsx deleted file mode 100644 index 3eb13bd0e..000000000 --- a/example/test/switch.spec.jsx +++ /dev/null @@ -1,32 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { Switch } from '@opentiny/vue' -import { nextTick, ref } from 'vue' -import { randomValues } from './common/globalConfig' - -randomValues(global) - -let value = false - -describe('switch', () => { - test('size', async () => { - const wrapper = mount(() => ) - expect(wrapper.find('.mini').exists()).toBe(true) - }) - - test('slot', async () => { - const wrapper = mount(() => , - close: () => - }}>) - expect(wrapper.find('.no').exists()).toBe(true) - }) - - test('events', async () => { - const handleClick = vi.fn() - const wrapper = mount(() => ) - await wrapper.find('.tiny-switch').trigger('click') - await nextTick() - expect(handleClick).toHaveBeenCalled() - }) -}) diff --git a/example/test/time-picker.spec.jsx b/example/test/time-picker.spec.jsx deleted file mode 100644 index 395c796be..000000000 --- a/example/test/time-picker.spec.jsx +++ /dev/null @@ -1,31 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { TimePicker } from '@opentiny/vue' -import { nextTick, ref } from 'vue' -import { randomValues } from './common/globalConfig' -import { iconBoat } from '@opentiny/vue-icon' - -randomValues(global) - -let value = new Date(2016, 9, 10, 18, 40) - -describe('time-picker', () => { - test('readonly', async () => { - const wrapper = mount(() => ) - expect(wrapper.find('input').attributes()).toHaveProperty('readonly') - }) - - test('events', async () => { - const handleFocus = vi.fn() - const wrapper = mount(() => ) - - await wrapper.find('input').trigger('focus') - await nextTick() - expect(handleFocus).toHaveBeenCalled() - }) - - test('icon', async () => { - const wrapper = mount(() => ) - expect(wrapper.find('.tiny-svg').exists()).toBe(true) - }) -}) diff --git a/example/test/time-select.spec.jsx b/example/test/time-select.spec.jsx deleted file mode 100644 index b74da8107..000000000 --- a/example/test/time-select.spec.jsx +++ /dev/null @@ -1,35 +0,0 @@ -import { mount } from '@vue/test-utils' -import { describe, expect, test, vi } from 'vitest' -import { TimeSelect } from '@opentiny/vue' -import { nextTick, ref } from 'vue' -import { randomValues } from './common/globalConfig' -import { iconBoat } from '@opentiny/vue-icon' - -randomValues(global) - -let value = '18:00' - -describe('time-select', () => { - test('placeholder', async () => { - const wrapper = mount(() => ) - expect(wrapper.find('input').attributes().placeholder).toBe('选择时间') - }) - - test('events', async () => { - const handleFocus = vi.fn() - const handleBlur = vi.fn() - const wrapper = mount(() => ) - await wrapper.find('input').trigger('focus') - await nextTick() - expect(handleFocus).toHaveBeenCalled() - await document.querySelector('.tiny-time-select__item').click() - await nextTick() - expect(handleBlur).toHaveBeenCalled() - expect(value).not.toBe('18:00') - }) - - test('icon', async () => { - const wrapper = mount(() => ) - expect(wrapper.find('.tiny-svg').exists()).toBe(true) - }) -}) diff --git a/example/vite-plugins/vite-plugin-vue-svg.js b/example/vite-plugins/vite-plugin-vue-svg.js deleted file mode 100644 index b6ec5b21a..000000000 --- a/example/vite-plugins/vite-plugin-vue-svg.js +++ /dev/null @@ -1,59 +0,0 @@ -const { readFileSync } = require('fs') -const SVGO = require('svgo') -const { compileTemplate } = require('@vue/compiler-sfc') - -async function compileSvgIcons(svg, id) { - let { code } = compileTemplate({ source: svg, id, transformAssetUrls: false }) - - let codeStr = code.replace('export function render', 'function render') - codeStr += '\nexport default { render };' - - return codeStr -} - -async function optimizeSvgIcons(svgIcon, content, path) { - const { data } = await svgIcon.optimize(content, { - path - }) - - return data -} - -export default (options = {}) => { - const { svgoConfig, defaultExport = 'url' } = options - const svgIcon = new SVGO(svgoConfig) - const svgRegexp = /\.svg(?:\?(component|url))?$/ - const svgCache = new Map() - - return { - name: 'vue-svg', - async transform(sourceSvg, id, isBuild) { - const svgMatch = id.match(svgRegexp) - - if (svgMatch) { - const type = svgMatch[1] - - if ((defaultExport === 'url' && typeof type === 'undefined') || type === 'url') { - return sourceSvg - } - - if ((defaultExport === 'component' && typeof type === 'undefined') || type === 'component') { - const idWithoutQuery = id.replace('.svg?component', '.svg') - let resultCache = svgCache.get(idWithoutQuery) - - if (!resultCache) { - const code = readFileSync(idWithoutQuery) - const svg = await optimizeSvgIcons(svgIcon, code, idWithoutQuery) - resultCache = await compileSvgIcons(svg, idWithoutQuery) - - if (isBuild) { - svgCache.set(idWithoutQuery, resultCache) - } - } - - return resultCache - } - } - } - } -} diff --git a/example/vite.config.js b/example/vite.config.js deleted file mode 100644 index 1a31df6c7..000000000 --- a/example/vite.config.js +++ /dev/null @@ -1,96 +0,0 @@ -import path from 'path' -import vue from '@vitejs/plugin-vue' -import { defineConfig, loadEnv } from 'vite' -import vueJsx from '@vitejs/plugin-vue-jsx' -import markdown from 'vite-plugin-markdown-vue' -import vueSvgPlugin from './vite-plugins/vite-plugin-vue-svg' -const { getAllModules } = require('../build/module-utils') - -const pathJoin = (...args) => path.join(__dirname, ...args) -const components = getAllModules(false) -const doComponents = (alias = {}) => { - components.forEach((item) => { - alias[item.libName] = pathJoin('../', item.path) - alias[item.importName] = pathJoin('../', item.path) - if (item.type === 'component') { - alias[`@opentiny/vue-theme/${item.LowerName}/index.css`] = pathJoin(`../../tiny-vue-theme/src/${item.LowerName}/index.less`) - alias[`@opentiny/vue-theme-mobile/${item.LowerName}/index.css`] = pathJoin(`../../tiny-vue-theme-mobile/src/${item.LowerName}/index.less`) - } - }) - return alias -} -const config = { - base: './', - server: { - host: '127.0.0.1', - open: true - }, - test: { - clearMocks: true, - environment: 'jsdom', - globals: true, - transformMode: { - web: [/\.jsx$/] - } - }, - plugins: [ - markdown(), - vue({ - include: [/\.vue$/, /\.md$/] - }), - vueJsx(), - vueSvgPlugin({ - defaultExport: 'component', - svgoConfig: {} - }) - ], - resolve: { - extensions: ['.js', '.jsx', '.vue'], - alias: { - '@': pathJoin('./src'), - vue: pathJoin('./node_modules/vue/dist/vue.runtime.esm-bundler.js'), - '@opentiny/vue': pathJoin('../../tiny-vue/packages'), - '@opentiny/vue-locale/vue2': pathJoin('../../tiny-vue/packages/locale/vue3'), - '@opentiny/vue-locale': pathJoin('../../tiny-vue/packages/locale'), - '@opentiny/vue-common/adapter/vue2': pathJoin('../../tiny-vue/packages/common/adapter/vue3'), - '@opentiny/vue-common': pathJoin('../../tiny-vue/packages/common'), - '@opentiny/vue-renderless': pathJoin('../../tiny-vue-renderless/src'), - '@opentiny/vue-icon': pathJoin('../../tiny-vue/packages/icon/index.js'), - ...doComponents(), - '@opentiny/vue-theme/base/index.css': pathJoin('../../tiny-vue-theme/src/base/index.less'), - '@opentiny/vue-theme/svg/index.css': pathJoin('../../tiny-vue-theme/src/svg/index.less'), - '@opentiny/vue-theme/tall-storage/index.css': pathJoin('../../tiny-vue-theme/src/tall-storage/index.less'), - '@opentiny/vue-theme': pathJoin('../../tiny-vue-theme/src'), - '@opentiny/vue-theme-mobile/base/index.css': pathJoin('../../tiny-vue-theme-mobile/src/base/index.less') - } - }, - define: { - 'process.env': process.env - }, - build: { - sourcemap: false, - copyPublicDir: false, - outDir: path.resolve(__dirname, '../dist/vue/runtime/'), - rollupOptions: { - // 确保外部化处理那些你不想打包进库的依赖 - external: ['vue'] - } - } -} - -export default defineConfig(({ command, mode }) => { - if (mode === 'pc') { - config.build.lib = { - entry: path.resolve(__dirname, './entry/pc.js'), - formats: ['es'], - fileName: (format) => `tiny-vue.${format}.js` - } - } else { - config.build.lib = { - entry: path.resolve(__dirname, './entry/icon.js'), - formats: ['es'], - fileName: (format) => `tiny-vue-icon.${format}.js` - } - } - return config -}) diff --git a/examples/docs/.depcheckrc b/examples/docs/.depcheckrc new file mode 100644 index 000000000..90d5cd7d8 --- /dev/null +++ b/examples/docs/.depcheckrc @@ -0,0 +1 @@ +ignores: [ "postcss", "autoprefixer", "flexsearch", "@root/typings-vue3"] \ No newline at end of file diff --git a/examples/docs/CHANGELOG.md b/examples/docs/CHANGELOG.md new file mode 100644 index 000000000..becd2ee3b --- /dev/null +++ b/examples/docs/CHANGELOG.md @@ -0,0 +1,67 @@ +# Change Log + +All notable changes to this project will be documented in this file. +See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + +## [1.0.6-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/@opentiny/vue-docs@1.0.5-mf.0...@opentiny/vue-docs@1.0.6-mf.0) (2023-02-08) + +**Note:** Version bump only for package @opentiny/vue-docs + + + + + +## [1.0.5-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/@opentiny/vue-docs@1.0.4-mf.0...@opentiny/vue-docs@1.0.5-mf.0) (2023-02-08) + +**Note:** Version bump only for package @opentiny/vue-docs + + + + + +## [1.0.4-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/@opentiny/vue-docs@1.0.3-mf.0...@opentiny/vue-docs@1.0.4-mf.0) (2023-02-08) + +**Note:** Version bump only for package @opentiny/vue-docs + + + + + +## [1.0.3-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/@opentiny/vue-docs@1.0.2-mf.0...@opentiny/vue-docs@1.0.3-mf.0) (2023-02-08) + +**Note:** Version bump only for package @opentiny/vue-docs + + + + + +## [1.0.2-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/@opentiny/vue-docs@1.0.1-beta.0...@opentiny/vue-docs@1.0.2-mf.0) (2023-02-08) + +**Note:** Version bump only for package @opentiny/vue-docs + + + + + +## 1.0.1-beta.0 (2023-02-08) + + +### Bug Fixes + +* 回退对tailwind的line-height的修改 ([8de2bb5](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/8de2bb50862e22a9810b5d2b8295d32f34710f4f)) +* 使用了按需导入插件,就不能用import default 导入 ([606b141](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/606b141690736753b20e12235e4e769187e044a5)) +* 修复 time-line 样例报错 ([502a0e6](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/502a0e635df59271ba6a1e56926c2e0d7f66adeb)) +* 修复工程样式问题,样式增加深度选择器 ([dd8d0c3](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/dd8d0c3c2cf02bf68303c33daa6d0301f7117e96)) +* 修正 DemoView 样式 ([e233e72](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/e233e72abdc56fbb4ac82f1ad22a872eb5a4ba35)) +* 修正 loading/custom-class.vue 的归属关系 ([480185f](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/480185fec93c863e25dfa6c4ed3e5e40cf839700)) +* 修正 md 路径问题以及全量引入 vue-icon ([3398881](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/3398881d1c986d398c88c2f2163598d4b48d9131)) +* 修正 md 文档中的表格样式 ([bbfaeb8](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/bbfaeb8d533f92a8d7010a67bd1fde7c7971dabb)) +* demo 链接一定要有后缀名;代码中不直接引用 common/adapter ([15341bd](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/15341bdb0195e545dfbc48c33b1c4e97722c6a96)) +* grid-basic-usage.md 文件放错了目录 ([649f932](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/649f932d93fbb118e1f86ef4ed102ed1cd0522ab)) +* tabs/lazy.vue 迁移回 pc 下 ([6c847d9](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/6c847d99c1f9233256879a93f1f5eca7556bbf4c)) +* tag-selectable.md 错误的同步到了 pc 目录下,重新 mv 到 mobile-first 下即可 ([47cdffa](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/47cdffa50e32a127558c83d0116cf76f30c99537)) + + +### Features + +* 搭建了基于 vitest 的单元测试和基于 playwright 的 E2E 测试 ([fdeddaf](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/fdeddaf6c753c737caf5434cea2c86cc4292a311)) diff --git a/examples/docs/README.md b/examples/docs/README.md new file mode 100644 index 000000000..5e870e5b0 --- /dev/null +++ b/examples/docs/README.md @@ -0,0 +1,8 @@ +# Tiny Vue 文档资源说明 + +本文件夹内容发布到 @opentiny/vue-doc-resources 中。 + +- `api` 记录每个组件的属性,插槽,方法,事件等内容 +- `demo` 记录每个组件的示例源码 +- `demo-config` 记录每个组件的示例配置 +- `menus.js` 记录导航菜单 diff --git a/examples/docs/newsrc/App.vue b/examples/docs/newsrc/App.vue new file mode 100644 index 000000000..6c1f46e8b --- /dev/null +++ b/examples/docs/newsrc/App.vue @@ -0,0 +1,23 @@ + + + diff --git a/examples/docs/newsrc/_.vue b/examples/docs/newsrc/_.vue new file mode 100644 index 000000000..4e135311b --- /dev/null +++ b/examples/docs/newsrc/_.vue @@ -0,0 +1,64 @@ + + + + + diff --git a/examples/docs/newsrc/mobile.vue b/examples/docs/newsrc/mobile.vue new file mode 100644 index 000000000..f35561198 --- /dev/null +++ b/examples/docs/newsrc/mobile.vue @@ -0,0 +1,187 @@ + + + diff --git a/examples/docs/newsrc/pc.vue b/examples/docs/newsrc/pc.vue new file mode 100644 index 000000000..ed31d69b8 --- /dev/null +++ b/examples/docs/newsrc/pc.vue @@ -0,0 +1,179 @@ + + + diff --git a/examples/docs/newsrc/resource.js b/examples/docs/newsrc/resource.js new file mode 100644 index 000000000..3831d9a20 --- /dev/null +++ b/examples/docs/newsrc/resource.js @@ -0,0 +1,29 @@ +// eager = true,可以校验vue,json等文件错误。 +// eager = false, 可以懒加载,优化速度 + +// demo源码 +// 同web-doc的菜单资源 +import originMenuData from '../resources/pc/menus.js' + +export const demoStr = import.meta.glob('../resources/pc/demo/**/*.vue', { eager: false, as: 'raw' }) +export const demoVue = import.meta.glob('../resources/pc/demo/**/*.vue', { eager: false }) + +// // api属性 +export const zhApi = import.meta.glob('../resources/pc/api/zh-CN/**/*.json', { eager: false }) +// export const enApi = import.meta.glob('@resources/api/en-US/**/*.json', { eager: false }) + +// // json, demo的配置文件 +export const zhDemo = import.meta.glob('../resources/pc/demo-config/zh-CN/**/*.json', { eager: false }) +// 格式:{zh,en,enSuffix,path} +// path: '/breadcrumb' 对应着【 demo的配置文件】。每个path有多个示例 +const menuData = originMenuData.slice(0) +function processMenu(menu, isTop) { + menu.id = menu.en + menu.label = isTop ? menu.zh : `${menu.zh} ${menu.en}` + if (menu.children && menu.children.length > 0) { + menu.children.forEach((m) => processMenu(m, false)) + } +} +menuData.forEach((m) => processMenu(m, true)) + +export { menuData } diff --git a/examples/docs/newsrc/resourceMobile.js b/examples/docs/newsrc/resourceMobile.js new file mode 100644 index 000000000..3646276bf --- /dev/null +++ b/examples/docs/newsrc/resourceMobile.js @@ -0,0 +1,24 @@ +// eager = true,可以校验vue,json等文件错误。 +// eager = false, 可以懒加载,优化速度 + +// demo源码 +// 同web-doc的菜单资源 +import { cmpMenus } from '../resources/mobile/menus.js' + +export const demoStr = import.meta.glob('../resources/mobile/app/**/*.vue', { eager: false, as: 'raw' }) +export const demoVue = import.meta.glob('../resources/mobile/app/**/*.vue', { eager: false }) + +// api属性 +export const apis = import.meta.glob('../resources/mobile/app/*/webdoc/*.js', { eager: false }) + +const menuData = cmpMenus.slice(0) +function processMenu(menu) { + menu.id = menu.key + menu.label = menu.nameCn || menu.label + if (menu.children && menu.children.length > 0) { + menu.children.forEach((m) => processMenu(m, false)) + } +} +menuData.forEach((m) => processMenu(m)) + +export { menuData } diff --git a/examples/docs/newsrc/style.css b/examples/docs/newsrc/style.css new file mode 100644 index 000000000..19d387deb --- /dev/null +++ b/examples/docs/newsrc/style.css @@ -0,0 +1,50 @@ +html, +body, +#app { + height: 100%; + width: 100%; + margin: 0; + padding: 0; +} + +.hp100 { + height: 100%; +} +.wp100 { + width: 100%; +} + +:root { + --none: none; + --transparent: transparent; + --white: #fff; + --black: #000; + + --main: #2b292d; + --mainless: #2c2e30; + --second: #7e8085; + --secondless: lighten(#7e8085, 20%); + --light: #f6f8f9; + --lightless: #f1f2f3; + + --primary: #2f5bea; + --success: #18a058; + --warning: #ffbe0e; + --warn: var(--warning); + --error: #ee343f; + + --border-style: solid; + --border-color: #ddd; + --border-width: 1px; + --box-radius-sm: 4px; + --box-radius-lg: 30px; + --box-shadow-sm: 0 2px #0000000b; + --box-shadow-lg: 0px 6px 18px 18px RGBA(0, 0, 0, 0.1); + --text-shadow-sm: 0 -1px 0 rgb(0 0 0 / 12%); + --text-shadow-lg: 0px 6px 3px rgb (0, 0, 0, 0.4); + + --trans-time: 0.4s; + --trans-time-slow: 1s; + --hover-op: 0.85; + --disabled-op: 0.4; +} diff --git a/examples/docs/newsrc/uses/index.js b/examples/docs/newsrc/uses/index.js new file mode 100644 index 000000000..78575fb17 --- /dev/null +++ b/examples/docs/newsrc/uses/index.js @@ -0,0 +1,4 @@ +export { useStorage, $local, $session } from './useStorage.js' +export { useFileSaver } from './useFileSaver.js' +export { useMonaco } from './useMonaco.js' +export { useFullScreen } from './useFullScreen.js' diff --git a/examples/docs/newsrc/uses/useFileSaver.js b/examples/docs/newsrc/uses/useFileSaver.js new file mode 100644 index 000000000..ccae216e6 --- /dev/null +++ b/examples/docs/newsrc/uses/useFileSaver.js @@ -0,0 +1,18 @@ +const pickerOption = { + types: [{ accept: { 'text/vue': ['.vue'] } }] +} + +export function useFileSaver() { + let handle = null + const saver = { + save: async (data) => { + handle = handle || (await window.showSaveFilePicker(pickerOption)) + const writableStream = await handle.createWritable() + await writableStream.write(data) + await writableStream.close() + }, + reset: () => (handle = null) // 切换保存为另一个文件时,要先行调用一下 + } + + return saver +} diff --git a/examples/docs/newsrc/uses/useFullScreen.js b/examples/docs/newsrc/uses/useFullScreen.js new file mode 100644 index 000000000..546cfa03a --- /dev/null +++ b/examples/docs/newsrc/uses/useFullScreen.js @@ -0,0 +1,16 @@ +import { hooks } from '@opentiny/vue-common' + +export function useFullScreen(selector) { + let el = null + const fn = { + toggle: () => (document.fullscreenElement ? fn.exit() : fn.enter()), + enter: () => el && el.requestFullscreen(), + exit: () => document.exitFullscreen() + } + + hooks.onMounted(() => { + el = document.querySelector(selector) + }) + + return fn +} diff --git a/examples/docs/newsrc/uses/useMonaco.js b/examples/docs/newsrc/uses/useMonaco.js new file mode 100644 index 000000000..8857601be --- /dev/null +++ b/examples/docs/newsrc/uses/useMonaco.js @@ -0,0 +1,31 @@ +import * as monaco from 'monaco-editor' +import { hooks } from '@opentiny/vue-common' +// monaco ESM模块集成说明 : https://github.com/microsoft/monaco-editor/blob/main/docs/integrate-esm.md#using-vite +// https://github.com/vitejs/vite/discussions/1791#discussioncomment-321046 +import htmlWorker from 'monaco-editor/esm/vs/language/html/html.worker?worker' +self.MonacoEnvironment = { + getWorker: () => new htmlWorker() +} + +export function useMonaco(selector) { + const state = { + editor: null, + getCode: () => state.editor && state.editor.getValue(), + setCode: (code) => state.editor && state.editor.setValue(code), + hotKey: (key, fn) => state.editor && state.editor.addCommand(key, fn), + format: () => state.editor && state.editor.trigger('anyString', 'editor.action.formatDocument'), + scrollTop: () => state.editor && state.editor.setScrollTop(0) + } + + hooks.onMounted(() => { + state.editor = monaco.editor.create(document.querySelector(selector), { + value: '', + language: 'html', + theme: 'vs-dark', + tabSize: 2, + automaticLayout: true + }) + }) + hooks.onUnmounted(() => (state.editor = null)) + return state +} diff --git a/examples/docs/newsrc/uses/useStorage.js b/examples/docs/newsrc/uses/useStorage.js new file mode 100644 index 000000000..8e979a014 --- /dev/null +++ b/examples/docs/newsrc/uses/useStorage.js @@ -0,0 +1,52 @@ +function parse(str) { + if (str === null) return undefined + const type = str[0] + const strVal = str.slice(1) + // 对象时,有可能是Date, 否则反解析后统一是对象 + if (type === 'o' || type === 'b') { + let val = JSON.parse(strVal) + return typeof val === 'string' ? new Date(val) : val + } + if (type === 'n') return +Number(strVal) + if (type === 's') return strVal +} + +// 带前缀的保存值 +function save(store, k, v) { + const type = typeof v + store.setItem(k, type[0] + (type === 'object' ? JSON.stringify(v) : v)) +} + +/** + * 快速的保存值到 sessionStorage, localStorage. + * 支持基本类型,时间,数组,对象,null,不存在的键值返回undefined 。 + * 不支持:Map,Set, 以及多级串联赋值,比如:$session.obj.name="abcd" + */ +function handler(storage) { + return { + get(target, propKey) { + let val = storage.getItem(propKey) + return parse(val) + }, + set(target, propKey, value) { + save(storage, propKey, value) + return true + } + } +} + +const typeMatcher = { session: null, local: null } + +/** + * 用于记录值到localStorage或 sessionStorage, 并保持数据的类型! + * @ const $s = useStorage("session"); + * @ $s.abc="abc" + * @param {*} type 存储到的目标 "session" || "local" + * @returns Proxy对象 + */ +export const useStorage = (type) => + typeMatcher[type] || // + (typeMatcher[type] = new Proxy({}, handler(type === 'session' ? sessionStorage : localStorage))) + +export const $session = useStorage('session') +export const $local = useStorage('local') diff --git a/examples/docs/package.json b/examples/docs/package.json new file mode 100644 index 000000000..7468eceb8 --- /dev/null +++ b/examples/docs/package.json @@ -0,0 +1,49 @@ +{ + "name": "@opentiny/vue-docs", + "type": "module", + "private": true, + "version": "1.0.6-mf.0", + "description": "", + "scripts": { + "docs:build": "vuepress build", + "docs:clean-dev": "vuepress dev --clean-cache", + "docs:dev": "vuepress dev" + }, + "keywords": [], + "author": "", + "license": "ISC", + "dependencies": { + "@opentiny/vue": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-theme-mobile": "workspace:~", + "sortablejs": "1.15.0" + }, + "devDependencies": { + "@opentiny-internal/unplugin-virtual-template": "workspace:*", + "@playwright/test": "^1.29.2", + "@vitejs/plugin-vue": "^4.0.0", + "@vitejs/plugin-vue-jsx": "^2.1.0", + "@vue/compiler-sfc": "^3.2.31", + "@vue/runtime-core": "^3.2.31", + "@vue/runtime-dom": "^3.2.31", + "@vue/shared": "^3.2.31", + "postcss": "^8.4.16", + "vite": "^4.0.2", + "vite-plugin-dynamic-import": "^1.2.4", + "vite-plugin-importer": "^0.2.5", + "vite-plugin-importus": "^1.0.4", + "vite-plugin-inspect": "^0.7.11", + "vite-plugin-static-copy": "0.12.0", + "vite-svg-loader": "^3.6.0", + "vue": "^3.2.21", + "monaco-editor": "^0.34.1", + "monaco-editor-core": "^0.34.1", + "monaco-volar": "0.0.6", + "onigasm": "^2.2.5", + "unocss": "^0.48.0", + "@unocss/core": "^0.48.0", + "@unocss/preset-icons": "^0.48.0", + "@unocss/transformer-directives": "^0.48.0" + } +} diff --git a/example/src/demo/mobile/action-sheet/clickfn.vue b/examples/docs/resources/mobile/app/actionsheet/clickfn.vue similarity index 98% rename from example/src/demo/mobile/action-sheet/clickfn.vue rename to examples/docs/resources/mobile/app/actionsheet/clickfn.vue index 8b4d16bdd..7eefe37cf 100644 --- a/example/src/demo/mobile/action-sheet/clickfn.vue +++ b/examples/docs/resources/mobile/app/actionsheet/clickfn.vue @@ -16,7 +16,7 @@
- + + diff --git a/examples/docs/resources/mobile/app/actionsheet/slot-item.vue b/examples/docs/resources/mobile/app/actionsheet/slot-item.vue new file mode 100644 index 000000000..b1fb8f4bb --- /dev/null +++ b/examples/docs/resources/mobile/app/actionsheet/slot-item.vue @@ -0,0 +1,74 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/actionsheet/webdoc/actionsheet.cn.md b/examples/docs/resources/mobile/app/actionsheet/webdoc/actionsheet.cn.md new file mode 100644 index 000000000..2ddd9977f --- /dev/null +++ b/examples/docs/resources/mobile/app/actionsheet/webdoc/actionsheet.cn.md @@ -0,0 +1,11 @@ +--- +title: ActionSheet 上滑列表组件 +--- + +# ActionSheet 上滑列表组件 + +
+ +ActionSheet 上滑列表组件 + +
diff --git a/examples/docs/resources/mobile/app/actionsheet/webdoc/actionsheet.en.md b/examples/docs/resources/mobile/app/actionsheet/webdoc/actionsheet.en.md new file mode 100644 index 000000000..76aacb3f7 --- /dev/null +++ b/examples/docs/resources/mobile/app/actionsheet/webdoc/actionsheet.en.md @@ -0,0 +1,7 @@ +--- +title: ActionSheet 上滑列表组件 +--- + +# ActionSheet 上滑列表组件 + +
ActionSheet
diff --git a/examples/docs/resources/mobile/app/actionsheet/webdoc/actionsheet.js b/examples/docs/resources/mobile/app/actionsheet/webdoc/actionsheet.js new file mode 100644 index 000000000..019b9979f --- /dev/null +++ b/examples/docs/resources/mobile/app/actionsheet/webdoc/actionsheet.js @@ -0,0 +1,138 @@ +export default { + column: '2', + owner: '', + demos: [ + { + demoId: 'clickfn', + name: { + 'zh-CN': '点击列表事件', + 'en-US': 'button type' + }, + desc: { + 'zh-CN': '

点击列表事件

', + 'en-US': '

button type

' + }, + codeFiles: ['clickfn.vue'] + }, + { + demoId: 'ellipsis', + name: { + 'zh-CN': '内容超出显示省略号', + 'en-US': 'button round' + }, + desc: { + 'zh-CN': '

内容超出显示省略号

', + 'en-US': '

button round

' + }, + codeFiles: ['ellipsis.vue'] + }, + { + demoId: 'slot-item', + name: { + 'zh-CN': '插槽', + 'en-US': 'events' + }, + desc: { + 'zh-CN': '

通过item插槽自定义下拉列表内容

', + 'en-US': '

bbutton click

' + }, + codeFiles: ['slot-item.vue'] + }, + { + demoId: 'slot-action', + name: { + 'zh-CN': '插槽', + 'en-US': 'events' + }, + desc: { + 'zh-CN': '

通过action插槽自定义操作项内容

', + 'en-US': '

bbutton click

' + }, + codeFiles: ['slot-action.vue'] + } + ], + apis: [ + { + name: 'actionsheet ', // 组件名称展示使用 + type: 'component', // API 类型 + properties: [ + { + name: 'ellipsis', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否省略显示,该属性默认为false

', + 'en-US': 'display different button' + }, + demoId: 'ellipsis' + }, + { + name: 'menus', + type: 'Array', + defaultValue: '50', + desc: { + 'zh-CN': '

列表数组

', + 'en-US': 'display different button' + }, + demoId: 'ellipsis' + }, + { + name: 'visible', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

上划列表显示隐藏,该属性默认为false

', + 'en-US': 'display different button' + }, + demoId: 'ellipsis' + } + ], + methods: [ + { + name: 'visibleHandle', + type: 'string', + defaultValue: '', + desc: { + 'zh-CN': '

菜单列表隐藏方法

', + 'en-US': 'Click' + }, + demoId: 'slot-item' + } + ], + events: [ + { + name: 'click', + type: 'Function()', + defaultValue: '', + desc: { + 'zh-CN': '

设置组件点击列表项时触发的回调函数

', + 'en-US': 'Click' + }, + demoId: 'clickfn' + } + ], + slot: [ + { + name: 'action', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

自定义操作项内容

', + 'en-US': 'Click' + }, + demoId: 'slot-action' + }, + { + name: ' item', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

自定义列表项内容

', + 'en-US': 'Click' + }, + demoId: 'slot-item' + } + ] + } + ] +} diff --git a/example/src/demo/mobile/alert/custom-close.vue b/examples/docs/resources/mobile/app/alert/custom-close.vue similarity index 96% rename from example/src/demo/mobile/alert/custom-close.vue rename to examples/docs/resources/mobile/app/alert/custom-close.vue index 6c37e31f5..46364cd4c 100644 --- a/example/src/demo/mobile/alert/custom-close.vue +++ b/examples/docs/resources/mobile/app/alert/custom-close.vue @@ -7,7 +7,7 @@ - + diff --git a/examples/docs/resources/mobile/app/alert/size.vue b/examples/docs/resources/mobile/app/alert/size.vue new file mode 100644 index 000000000..be516bd6c --- /dev/null +++ b/examples/docs/resources/mobile/app/alert/size.vue @@ -0,0 +1,23 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/alert/slot-default.vue b/examples/docs/resources/mobile/app/alert/slot-default.vue new file mode 100644 index 000000000..5da4e700b --- /dev/null +++ b/examples/docs/resources/mobile/app/alert/slot-default.vue @@ -0,0 +1,23 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/alert/webdoc/alert.cn.md b/examples/docs/resources/mobile/app/alert/webdoc/alert.cn.md new file mode 100644 index 000000000..1c4ebd847 --- /dev/null +++ b/examples/docs/resources/mobile/app/alert/webdoc/alert.cn.md @@ -0,0 +1,13 @@ +--- +title: Alert 提示 +--- + +# Alert 提示 + +
+ +Alert 提示 + + + +
\ No newline at end of file diff --git a/examples/docs/resources/mobile/app/alert/webdoc/alert.en.md b/examples/docs/resources/mobile/app/alert/webdoc/alert.en.md new file mode 100644 index 000000000..6002e2198 --- /dev/null +++ b/examples/docs/resources/mobile/app/alert/webdoc/alert.en.md @@ -0,0 +1,11 @@ +--- +title: Alert 提示 +--- + +# Alert 提示 + +
+ + + +
\ No newline at end of file diff --git a/examples/docs/resources/mobile/app/alert/webdoc/alert.js b/examples/docs/resources/mobile/app/alert/webdoc/alert.js new file mode 100644 index 000000000..ff5e33d16 --- /dev/null +++ b/examples/docs/resources/mobile/app/alert/webdoc/alert.js @@ -0,0 +1,147 @@ +export default { + column: '2', + owner: '', + demos: [ + { + demoId: 'custom-close', + name: { + 'zh-CN': '自定义关闭', + 'en-US': 'left right arrow', + }, + desc: { + 'zh-CN': '

自定义关闭

', + 'en-US': '

button type

', + }, + codeFiles: ['custom-close.vue'], + }, + { + demoId: 'icon', + name: { + 'zh-CN': '自定义提示图标', + 'en-US': 'left right text', + }, + desc: { + 'zh-CN': '

自定义提示图标

', + 'en-US': '

button round

', + }, + codeFiles: ['icon.vue'], + }, + { + demoId: 'size', + name: { + 'zh-CN': '不同尺寸', + 'en-US': 'size', + }, + desc: { + 'zh-CN': '

不同尺寸

', + 'en-US': '

button click

', + }, + codeFiles: ['size.vue'], + }, + { + demoId: 'slot-default', + name: { + 'zh-CN': '自定义提示内容', + 'en-US': 'slot-default', + }, + desc: { + 'zh-CN': '

自定义提示内容

', + 'en-US': '

button click

', + }, + codeFiles: ['slot-default.vue'], + }, + + ], + apis: [ + { + name: 'alert', // 组件名称展示使用 + type: 'component', // API 类型 + properties: [ + { + name: 'closable', + type: 'Boolean', + defaultValue: 'true', + desc: { + 'zh-CN': '

设置警告是否可以关闭,该属性的默认值为 true

', + 'en-US': 'Is fixed top', + }, + demoId: 'custom-close', + }, + { + name: 'close-text', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

关闭按钮自定义文本

', + 'en-US': 'Is show left arrow', + }, + demoId: 'custom-close', + }, + { + name: 'description', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

设置警告的提示内容,默认为空

', + 'en-US': 'Is show right arrow', + }, + demoId: 'custom-close', + }, + { + name: 'icon', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

设置警告的图标,默认会根据 type 值自动使用对应图标

', + 'en-US': 'Is show right text', + }, + demoId: 'icon', + }, + { + name: 'size', + type: 'String', + defaultValue: 'normal', + desc: { + 'zh-CN': '

设置警告的大小 normal/large, 缺省为 normal。

', + 'en-US': 'Is show left text', + }, + demoId: 'size', + }, + { + name: 'type', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

设置警告的类型

', + 'en-US': 'set sub-title', + }, + demoId: 'size', + }, + ], + events: [ + { + name: 'close', + type: 'Function()', + defaultValue: '', + desc: { + 'zh-CN': '

关闭 alert 时触发的事件

', + 'en-US': 'Click', + }, + demoId: 'custom-close', + }, + ], + slot: [ + { + name: 'default', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

组件默认插槽

', + 'en-US': 'Click', + }, + demoId: 'slot-default', + }, + ], + }, + ], +} diff --git a/example/src/demo/mobile/avatar/avatar-size.vue b/examples/docs/resources/mobile/app/avatar/avatar-size.vue similarity index 87% rename from example/src/demo/mobile/avatar/avatar-size.vue rename to examples/docs/resources/mobile/app/avatar/avatar-size.vue index a5f73720d..abb15a1fb 100644 --- a/example/src/demo/mobile/avatar/avatar-size.vue +++ b/examples/docs/resources/mobile/app/avatar/avatar-size.vue @@ -1,8 +1,12 @@ - + diff --git a/examples/docs/resources/mobile/app/badge/is-dot.vue b/examples/docs/resources/mobile/app/badge/is-dot.vue new file mode 100644 index 000000000..dab98daf7 --- /dev/null +++ b/examples/docs/resources/mobile/app/badge/is-dot.vue @@ -0,0 +1,26 @@ + + + + + diff --git a/example/src/demo/mobile/badge/is-mini.vue b/examples/docs/resources/mobile/app/badge/is-mini.vue similarity index 83% rename from example/src/demo/mobile/badge/is-mini.vue rename to examples/docs/resources/mobile/app/badge/is-mini.vue index 5082aa863..3654c0b9e 100644 --- a/example/src/demo/mobile/badge/is-mini.vue +++ b/examples/docs/resources/mobile/app/badge/is-mini.vue @@ -2,24 +2,26 @@
小尺寸
+
默认尺寸
- + diff --git a/examples/docs/resources/mobile/app/badge/webdoc/badge.cn.md b/examples/docs/resources/mobile/app/badge/webdoc/badge.cn.md new file mode 100644 index 000000000..443ddf48d --- /dev/null +++ b/examples/docs/resources/mobile/app/badge/webdoc/badge.cn.md @@ -0,0 +1,12 @@ +--- +title: Badge 徽章 +--- + +# Badge 徽章 + +
+ +Badge 徽章 + + +
diff --git a/examples/docs/resources/mobile/app/badge/webdoc/badge.en.md b/examples/docs/resources/mobile/app/badge/webdoc/badge.en.md new file mode 100644 index 000000000..62cf5df75 --- /dev/null +++ b/examples/docs/resources/mobile/app/badge/webdoc/badge.en.md @@ -0,0 +1,11 @@ +--- +title: Badge 徽章 +--- + +# Badge 徽章 + +
+ +Badge 徽章 + +
diff --git a/examples/docs/resources/mobile/app/badge/webdoc/badge.js b/examples/docs/resources/mobile/app/badge/webdoc/badge.js new file mode 100644 index 000000000..4cbfa000e --- /dev/null +++ b/examples/docs/resources/mobile/app/badge/webdoc/badge.js @@ -0,0 +1,178 @@ +export default { + column: '2', + owner: '', + demos: [ + { + demoId: 'content', + name: { + 'zh-CN': '自定义提示内容', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': '

自定义提示内容

', + 'en-US': '

button type

', + }, + codeFiles: ['content.vue'], + }, + { + demoId: 'hidden', + name: { + 'zh-CN': '隐藏徽标', + 'en-US': 'button round', + }, + desc: { + 'zh-CN': '

隐藏徽标

', + 'en-US': '

button round

', + }, + codeFiles: ['hidden.vue'], + }, + { + demoId: 'href-target', + name: { + 'zh-CN': '跳转链接', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

跳转链接

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['href-target.vue'], + }, + { + demoId: 'is-dot', + name: { + 'zh-CN': '小圆点标记', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

小圆点标记

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['is-dot.vue'], + }, + { + demoId: 'is-mini', + name: { + 'zh-CN': '小尺寸', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

小尺寸

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['is-mini.vue'], + }, + { + demoId: 'type', + name: { + 'zh-CN': '不同主题', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

不同主题

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['type.vue'], + }, + ], + apis: [ + { + name: 'Badge', // 组件名称展示使用 + type: 'component', // API 类型 + properties: [ + { + name: 'hidden', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

禁隐藏 badge,该属性的默认值为 false

', + 'en-US': 'display different button', + }, + demoId: 'hidden', + }, + { + name: 'href', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

指定跳转的链接地址。

', + 'en-US': 'display different button', + }, + demoId: 'href-target', + }, + { + name: 'is-dot', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

设置是否显示为小圆点, 该属性默认值为false。

', + 'en-US': 'display different button', + }, + demoId: 'is-dot', + }, + { + name: 'is-mini', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

设置小尺寸,该属性默认为false

', + 'en-US': 'display different button', + }, + demoId: 'is-mini', + }, + { + name: 'target', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

指定点击徽章 Dom 节点时链接到目标页面的跳转方式,仅在 href 属性存在时使用。

', + 'en-US': 'display different button', + }, + demoId: 'href-target', + }, + { + name: 'max', + type: 'Number', + defaultValue: '', + desc: { + 'zh-CN': '

设置最大值

', + 'en-US': 'display different button', + }, + demoId: 'is-mini', + }, + { + name: 'value', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '', + 'en-US': '', + }, + demoId: 'content', + }, + ], + slot: [ + { + name: 'default', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

组件默认插槽

', + 'en-US': 'Click', + }, + demoId: 'content', + }, + { + name: 'content', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

消息提示内容

', + 'en-US': 'Click', + }, + demoId: 'content', + }, + ], + }, + ], +} diff --git a/examples/docs/resources/mobile/app/button/event-click.vue b/examples/docs/resources/mobile/app/button/event-click.vue new file mode 100644 index 000000000..c8d9d57b4 --- /dev/null +++ b/examples/docs/resources/mobile/app/button/event-click.vue @@ -0,0 +1,40 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/button/icon.vue b/examples/docs/resources/mobile/app/button/icon.vue new file mode 100644 index 000000000..56b2e66d4 --- /dev/null +++ b/examples/docs/resources/mobile/app/button/icon.vue @@ -0,0 +1,41 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/button/loading.vue b/examples/docs/resources/mobile/app/button/loading.vue new file mode 100644 index 000000000..9117e1741 --- /dev/null +++ b/examples/docs/resources/mobile/app/button/loading.vue @@ -0,0 +1,33 @@ + + + + + diff --git a/example/src/demo/mobile/button/native-type.vue b/examples/docs/resources/mobile/app/button/native-type.vue similarity index 81% rename from example/src/demo/mobile/button/native-type.vue rename to examples/docs/resources/mobile/app/button/native-type.vue index a56c2b52f..cda37e3f4 100644 --- a/example/src/demo/mobile/button/native-type.vue +++ b/examples/docs/resources/mobile/app/button/native-type.vue @@ -6,11 +6,14 @@
- + - - 重置 + + + + + 提交
@@ -20,7 +23,7 @@ - + + diff --git a/examples/docs/resources/mobile/app/button/reset-time.vue b/examples/docs/resources/mobile/app/button/reset-time.vue new file mode 100644 index 000000000..8b8c75aa8 --- /dev/null +++ b/examples/docs/resources/mobile/app/button/reset-time.vue @@ -0,0 +1,38 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/button/round.vue b/examples/docs/resources/mobile/app/button/round.vue new file mode 100644 index 000000000..b40bf115a --- /dev/null +++ b/examples/docs/resources/mobile/app/button/round.vue @@ -0,0 +1,34 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/button/size.vue b/examples/docs/resources/mobile/app/button/size.vue new file mode 100644 index 000000000..7cd74845b --- /dev/null +++ b/examples/docs/resources/mobile/app/button/size.vue @@ -0,0 +1,36 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/button/text.vue b/examples/docs/resources/mobile/app/button/text.vue new file mode 100644 index 000000000..3a5962ea3 --- /dev/null +++ b/examples/docs/resources/mobile/app/button/text.vue @@ -0,0 +1,38 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/button/webdoc/button.cn.md b/examples/docs/resources/mobile/app/button/webdoc/button.cn.md new file mode 100644 index 000000000..475442e25 --- /dev/null +++ b/examples/docs/resources/mobile/app/button/webdoc/button.cn.md @@ -0,0 +1,12 @@ +--- +title: Button 按钮 +--- + +# Button 按钮 + +
+ +按钮组件一般用于触发一些操作。 + +
+ diff --git a/examples/docs/resources/mobile/app/button/webdoc/button.en.md b/examples/docs/resources/mobile/app/button/webdoc/button.en.md new file mode 100644 index 000000000..e6e3495e2 --- /dev/null +++ b/examples/docs/resources/mobile/app/button/webdoc/button.en.md @@ -0,0 +1,7 @@ +--- +title: Button +--- + +# Button 按钮 + +
button......。
diff --git a/examples/docs/resources/mobile/app/button/webdoc/button.js b/examples/docs/resources/mobile/app/button/webdoc/button.js new file mode 100644 index 000000000..46c9385c9 --- /dev/null +++ b/examples/docs/resources/mobile/app/button/webdoc/button.js @@ -0,0 +1,247 @@ +export default { + column: '2', + owner: '', + demos: [ + { + demoId: 'event-click', + name: { + 'zh-CN': '点击事件', + 'en-US': 'button type' + }, + desc: { + 'zh-CN': '

单击事件

', + 'en-US': '

button type

' + }, + codeFiles: ['event-click.vue'] + }, + { + demoId: 'icon', + name: { + 'zh-CN': '图标按钮', + 'en-US': 'button round' + }, + desc: { + 'zh-CN': '

图标按钮

', + 'en-US': '

button round

' + }, + codeFiles: ['icon.vue'] + }, + { + demoId: 'loading', + name: { + 'zh-CN': '加载中', + 'en-US': 'events' + }, + desc: { + 'zh-CN': '

加载中

', + 'en-US': '

bbutton click

' + }, + codeFiles: ['loading.vue'] + }, + { + demoId: 'native-type', + name: { + 'zh-CN': '按钮属性', + 'en-US': 'events' + }, + desc: { + 'zh-CN': + '

通过native-type属性可以设置原生 type 属性,该属性的可选值为 button / submit / reset

', + 'en-US': '

bbutton click

' + }, + codeFiles: ['native-type.vue'] + }, + { + demoId: 'plain', + name: { + 'zh-CN': '朴素按钮', + 'en-US': 'events' + }, + desc: { + 'zh-CN': '

朴素按钮

', + 'en-US': '

bbutton click

' + }, + codeFiles: ['plain.vue'] + }, + { + demoId: 'reset-time', + name: { + 'zh-CN': '禁用时间', + 'en-US': 'events' + }, + desc: { + 'zh-CN': '

通过reset-time属性可以设置按钮禁用时间,防止重复提交,单位毫秒,该属性默认为 1000

', + 'en-US': '

bbutton click

' + }, + codeFiles: ['reset-time.vue'] + }, + { + demoId: 'round', + name: { + 'zh-CN': '圆角按钮', + 'en-US': 'events' + }, + desc: { + 'zh-CN': '

圆角按钮

', + 'en-US': '

bbutton click

' + }, + codeFiles: ['round.vue'] + }, + { + demoId: 'size', + name: { + 'zh-CN': '不同尺寸', + 'en-US': 'events' + }, + desc: { + 'zh-CN': '

不同尺寸

', + 'en-US': '

bbutton click

' + }, + codeFiles: ['size.vue'] + }, + { + demoId: 'text', + name: { + 'zh-CN': '文字按钮', + 'en-US': 'events' + }, + desc: { + 'zh-CN': '

文字按钮

', + 'en-US': '

bbutton click

' + }, + codeFiles: ['text.vue'] + } + ], + apis: [ + { + name: 'Button', // 组件名称展示使用 + type: 'component', // API 类型 + properties: [ + { + name: 'disabled', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

设置按钮是否被禁用,该属性默认为false

', + 'en-US': 'display different button' + }, + demoId: '' + }, + { + name: 'icon', + type: 'Object', + defaultValue: '', + desc: { + 'zh-CN': '

svg 图片对象

', + 'en-US': 'display different button' + }, + demoId: 'icon' + }, + { + name: 'loading', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

svg 是否加载中状态,该属性默认为false

', + 'en-US': 'display different button' + }, + demoId: 'loading' + }, + { + name: 'native-type', + type: 'String', + defaultValue: 'button', + desc: { + 'zh-CN': '

原生 type 属性,该属性默认为button

', + 'en-US': 'display different button' + }, + demoId: 'native-type' + }, + { + name: 'plain', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否朴素按钮,该属性默认为false

', + 'en-US': 'display different button' + }, + demoId: 'plain' + }, + { + name: 'reset-time', + type: 'Number', + defaultValue: '1000', + desc: { + 'zh-CN': '

设置按钮禁用时间,防止重复提交,单位毫秒,该属性默认为1000

', + 'en-US': 'display different button' + }, + demoId: 'reset-time' + }, + { + name: 'round', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否圆角按钮,该属性默认为false

', + 'en-US': 'display different button' + }, + demoId: 'round' + }, + { + name: 'size', + type: 'String', + defaultValue: '"large" | "medium" | "small" | "mini"', + desc: { + 'zh-CN': '

尺寸

', + 'en-US': 'display different button' + }, + demoId: 'size' + }, + { + name: 'type', + type: '"primary" | "success" | "warning" |"info" | "danger"', + defaultValue: '', + desc: { + 'zh-CN': '

类型

', + 'en-US': 'display different button' + }, + demoId: 'icon' + }, + { + name: 'text', + type: 'string', + defaultValue: '', + desc: { + 'zh-CN': '

设置按钮显示的文本,可配置国际化

', + 'en-US': 'display different button' + }, + demoId: 'icon' + } + ], + events: [ + { + name: 'click', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

设置当按钮被点击时触发的回调函数。

', + 'en-US': 'Click' + }, + demoId: 'event-click' + } + ], + slots: [ + { + name: 'default', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

组件默认插槽

', + 'en-US': 'Click' + }, + demoId: '' + } + ] + } + ] +} diff --git a/example/src/demo/mobile/checkbox/default.vue b/examples/docs/resources/mobile/app/checkbox/default.vue similarity index 97% rename from example/src/demo/mobile/checkbox/default.vue rename to examples/docs/resources/mobile/app/checkbox/default.vue index fd1c97014..85ad23ad9 100644 --- a/example/src/demo/mobile/checkbox/default.vue +++ b/examples/docs/resources/mobile/app/checkbox/default.vue @@ -13,7 +13,7 @@ - + + diff --git a/examples/docs/resources/mobile/app/checkbox/indeterminate.vue b/examples/docs/resources/mobile/app/checkbox/indeterminate.vue new file mode 100644 index 000000000..3e116062f --- /dev/null +++ b/examples/docs/resources/mobile/app/checkbox/indeterminate.vue @@ -0,0 +1,55 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/checkbox/label.vue b/examples/docs/resources/mobile/app/checkbox/label.vue new file mode 100644 index 000000000..03a27c7a6 --- /dev/null +++ b/examples/docs/resources/mobile/app/checkbox/label.vue @@ -0,0 +1,32 @@ + + + + + diff --git a/example/src/demo/mobile/checkbox/true-false-label.vue b/examples/docs/resources/mobile/app/checkbox/true-false-label.vue similarity index 95% rename from example/src/demo/mobile/checkbox/true-false-label.vue rename to examples/docs/resources/mobile/app/checkbox/true-false-label.vue index e0c3337a8..849b43d69 100644 --- a/example/src/demo/mobile/checkbox/true-false-label.vue +++ b/examples/docs/resources/mobile/app/checkbox/true-false-label.vue @@ -6,7 +6,7 @@ - + diff --git a/examples/docs/resources/mobile/app/checkboxgroup/event-change.vue b/examples/docs/resources/mobile/app/checkboxgroup/event-change.vue new file mode 100644 index 000000000..4205f07b7 --- /dev/null +++ b/examples/docs/resources/mobile/app/checkboxgroup/event-change.vue @@ -0,0 +1,35 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/checkboxgroup/min-max.vue b/examples/docs/resources/mobile/app/checkboxgroup/min-max.vue new file mode 100644 index 000000000..4457d5139 --- /dev/null +++ b/examples/docs/resources/mobile/app/checkboxgroup/min-max.vue @@ -0,0 +1,30 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/checkboxgroup/vertical.vue b/examples/docs/resources/mobile/app/checkboxgroup/vertical.vue new file mode 100644 index 000000000..b00e419b1 --- /dev/null +++ b/examples/docs/resources/mobile/app/checkboxgroup/vertical.vue @@ -0,0 +1,30 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/checkboxgroup/webdoc/checkboxgroup.cn.md b/examples/docs/resources/mobile/app/checkboxgroup/webdoc/checkboxgroup.cn.md new file mode 100644 index 000000000..3bbda9747 --- /dev/null +++ b/examples/docs/resources/mobile/app/checkboxgroup/webdoc/checkboxgroup.cn.md @@ -0,0 +1,12 @@ +--- +title: CheckboxGroup 复选框组 +--- + +# CheckboxGroup 复选框组 + +
+ +CheckboxGroup 复选框组 + +
+ diff --git a/examples/docs/resources/mobile/app/checkboxgroup/webdoc/checkboxgroup.en.md b/examples/docs/resources/mobile/app/checkboxgroup/webdoc/checkboxgroup.en.md new file mode 100644 index 000000000..f348e21cb --- /dev/null +++ b/examples/docs/resources/mobile/app/checkboxgroup/webdoc/checkboxgroup.en.md @@ -0,0 +1,7 @@ +--- +title: CheckboxGroup +--- + +# CheckboxGroup 复选框组 + +
CheckboxGroup
diff --git a/examples/docs/resources/mobile/app/checkboxgroup/webdoc/checkboxgroup.js b/examples/docs/resources/mobile/app/checkboxgroup/webdoc/checkboxgroup.js new file mode 100644 index 000000000..dd8e38e4b --- /dev/null +++ b/examples/docs/resources/mobile/app/checkboxgroup/webdoc/checkboxgroup.js @@ -0,0 +1,125 @@ +export default { + column: '2', + owner: '', + demos: [ + { + demoId: 'disabled', + name: { + 'zh-CN': '是否禁用', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': '

是否禁用

', + 'en-US': '

button type

', + }, + codeFiles: ['disabled.vue'], + }, + { + demoId: 'event-change', + name: { + 'zh-CN': '事件', + 'en-US': 'button round', + }, + desc: { + 'zh-CN': '

事件

', + 'en-US': '

button round

', + }, + codeFiles: ['event-change.vue'], + }, + { + demoId: 'min-max', + name: { + 'zh-CN': '可选数量', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

可选数量

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['min-max.vue'], + }, + { + demoId: 'vertical', + name: { + 'zh-CN': '垂直排列', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

垂直排列

', + }, + codeFiles: ['vertical.vue'], + }, + ], + apis: [ + { + name: 'CheckboxGroup', // 组件名称展示使用 + type: 'component', // API 类型 + properties: [ + { + name: 'disabled', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否禁用,该属性默认为false

', + 'en-US': 'display different button', + }, + demoId: 'disabled', + }, + + { + name: 'max', + type: 'Number', + defaultValue: '', + desc: { + 'zh-CN': '

可被勾选的 checkbox 的最大数量

', + 'en-US': 'display different button', + }, + demoId: 'min-max', + }, + { + name: 'min', + type: 'Number', + defaultValue: '', + desc: { + 'zh-CN': '

可被勾选的 checkbox 的最小数量

', + 'en-US': 'display different button', + }, + demoId: 'min-max', + }, + { + name: 'value / v-model', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

绑定值

', + 'en-US': 'display different button', + }, + demoId: 'dedisabled', + }, + + { + name: 'vertical', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否竖向模式

', + 'en-US': 'display different button', + }, + demoId: 'vertical', + }, + ], + events: [ + { + name: 'change', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

当绑定值变化时触发的事件,该事件可获取更新后的值

', + 'en-US': 'Click', + }, + demoId: 'event-change', + }, + ], + }, + ], +} diff --git a/example/src/demo/mobile/dialog-box/append-to-body.vue b/examples/docs/resources/mobile/app/dialogbox/append-to-body.vue similarity index 96% rename from example/src/demo/mobile/dialog-box/append-to-body.vue rename to examples/docs/resources/mobile/app/dialogbox/append-to-body.vue index b53231c40..6b953a283 100644 --- a/example/src/demo/mobile/dialog-box/append-to-body.vue +++ b/examples/docs/resources/mobile/app/dialogbox/append-to-body.vue @@ -7,7 +7,7 @@ - diff --git a/example/src/demo/mobile/dialog-box/events-open-close.vue b/examples/docs/resources/mobile/app/dialogbox/events-open-close.vue similarity index 97% rename from example/src/demo/mobile/dialog-box/events-open-close.vue rename to examples/docs/resources/mobile/app/dialogbox/events-open-close.vue index 96e1e8e9e..551d9559c 100644 --- a/example/src/demo/mobile/dialog-box/events-open-close.vue +++ b/examples/docs/resources/mobile/app/dialogbox/events-open-close.vue @@ -7,7 +7,7 @@ - diff --git a/example/src/demo/mobile/dialog-box/show-header.vue b/examples/docs/resources/mobile/app/dialogbox/show-header.vue similarity index 96% rename from example/src/demo/mobile/dialog-box/show-header.vue rename to examples/docs/resources/mobile/app/dialogbox/show-header.vue index 68728e0d3..5541344a0 100644 --- a/example/src/demo/mobile/dialog-box/show-header.vue +++ b/examples/docs/resources/mobile/app/dialogbox/show-header.vue @@ -7,7 +7,7 @@ - diff --git a/example/src/demo/mobile/dialog-box/slot-title.vue b/examples/docs/resources/mobile/app/dialogbox/slot-title.vue similarity index 97% rename from example/src/demo/mobile/dialog-box/slot-title.vue rename to examples/docs/resources/mobile/app/dialogbox/slot-title.vue index 28cdd4aaa..6b8b91a92 100644 --- a/example/src/demo/mobile/dialog-box/slot-title.vue +++ b/examples/docs/resources/mobile/app/dialogbox/slot-title.vue @@ -10,7 +10,7 @@ - + diff --git a/example/src/demo/mobile/dropdown-menu/title-class.vue b/examples/docs/resources/mobile/app/dropdownmenu/title-class.vue similarity index 99% rename from example/src/demo/mobile/dropdown-menu/title-class.vue rename to examples/docs/resources/mobile/app/dropdownmenu/title-class.vue index 86aa16916..024708950 100644 --- a/example/src/demo/mobile/dropdown-menu/title-class.vue +++ b/examples/docs/resources/mobile/app/dropdownmenu/title-class.vue @@ -15,7 +15,7 @@ - + diff --git a/examples/docs/resources/mobile/app/file-upload/drag-select-file.vue b/examples/docs/resources/mobile/app/file-upload/drag-select-file.vue new file mode 100644 index 000000000..6d721f48a --- /dev/null +++ b/examples/docs/resources/mobile/app/file-upload/drag-select-file.vue @@ -0,0 +1,33 @@ + + + diff --git a/examples/docs/resources/mobile/app/file-upload/drag-upload.vue b/examples/docs/resources/mobile/app/file-upload/drag-upload.vue new file mode 100644 index 000000000..6376f55fa --- /dev/null +++ b/examples/docs/resources/mobile/app/file-upload/drag-upload.vue @@ -0,0 +1,29 @@ + + + diff --git a/examples/docs/resources/mobile/app/file-upload/dynamic-disable.vue b/examples/docs/resources/mobile/app/file-upload/dynamic-disable.vue new file mode 100644 index 000000000..a417961de --- /dev/null +++ b/examples/docs/resources/mobile/app/file-upload/dynamic-disable.vue @@ -0,0 +1,29 @@ + + + diff --git a/example/src/demo/mobile/file-upload/file-icon-list.vue b/examples/docs/resources/mobile/app/file-upload/file-icon-list.vue similarity index 87% rename from example/src/demo/mobile/file-upload/file-icon-list.vue rename to examples/docs/resources/mobile/app/file-upload/file-icon-list.vue index a86948c5c..3c8cba176 100644 --- a/example/src/demo/mobile/file-upload/file-icon-list.vue +++ b/examples/docs/resources/mobile/app/file-upload/file-icon-list.vue @@ -6,7 +6,7 @@ - diff --git a/example/src/demo/mobile/file-upload/file-title.vue b/examples/docs/resources/mobile/app/file-upload/file-title.vue similarity index 96% rename from example/src/demo/mobile/file-upload/file-title.vue rename to examples/docs/resources/mobile/app/file-upload/file-title.vue index f6880b318..2ae5869d5 100644 --- a/example/src/demo/mobile/file-upload/file-title.vue +++ b/examples/docs/resources/mobile/app/file-upload/file-title.vue @@ -6,7 +6,7 @@ - diff --git a/examples/docs/resources/mobile/app/file-upload/manual-upload.vue b/examples/docs/resources/mobile/app/file-upload/manual-upload.vue new file mode 100644 index 000000000..8790c10c7 --- /dev/null +++ b/examples/docs/resources/mobile/app/file-upload/manual-upload.vue @@ -0,0 +1,30 @@ + + + diff --git a/examples/docs/resources/mobile/app/file-upload/max-file-count.vue b/examples/docs/resources/mobile/app/file-upload/max-file-count.vue new file mode 100644 index 000000000..41384f474 --- /dev/null +++ b/examples/docs/resources/mobile/app/file-upload/max-file-count.vue @@ -0,0 +1,25 @@ + + + diff --git a/examples/docs/resources/mobile/app/file-upload/mini-mode.vue b/examples/docs/resources/mobile/app/file-upload/mini-mode.vue new file mode 100644 index 000000000..069c3bdd7 --- /dev/null +++ b/examples/docs/resources/mobile/app/file-upload/mini-mode.vue @@ -0,0 +1,30 @@ + + + diff --git a/examples/docs/resources/mobile/app/file-upload/multiple-file.vue b/examples/docs/resources/mobile/app/file-upload/multiple-file.vue new file mode 100644 index 000000000..c1587ff31 --- /dev/null +++ b/examples/docs/resources/mobile/app/file-upload/multiple-file.vue @@ -0,0 +1,24 @@ + + + diff --git a/examples/docs/resources/mobile/app/file-upload/picture-card.vue b/examples/docs/resources/mobile/app/file-upload/picture-card.vue new file mode 100644 index 000000000..f8df0f11a --- /dev/null +++ b/examples/docs/resources/mobile/app/file-upload/picture-card.vue @@ -0,0 +1,89 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/file-upload/prevent-delete-file.vue b/examples/docs/resources/mobile/app/file-upload/prevent-delete-file.vue new file mode 100644 index 000000000..8140e913f --- /dev/null +++ b/examples/docs/resources/mobile/app/file-upload/prevent-delete-file.vue @@ -0,0 +1,41 @@ + + + diff --git a/examples/docs/resources/mobile/app/file-upload/prevent-upload-file.vue b/examples/docs/resources/mobile/app/file-upload/prevent-upload-file.vue new file mode 100644 index 000000000..876a29c60 --- /dev/null +++ b/examples/docs/resources/mobile/app/file-upload/prevent-upload-file.vue @@ -0,0 +1,41 @@ + + + diff --git a/examples/docs/resources/mobile/app/file-upload/size.vue b/examples/docs/resources/mobile/app/file-upload/size.vue new file mode 100644 index 000000000..bc430c6a9 --- /dev/null +++ b/examples/docs/resources/mobile/app/file-upload/size.vue @@ -0,0 +1,23 @@ + + + diff --git a/examples/docs/resources/mobile/app/file-upload/upload-events.vue b/examples/docs/resources/mobile/app/file-upload/upload-events.vue new file mode 100644 index 000000000..1a42814da --- /dev/null +++ b/examples/docs/resources/mobile/app/file-upload/upload-events.vue @@ -0,0 +1,71 @@ + + + diff --git a/examples/docs/resources/mobile/app/file-upload/upload-file-list.vue b/examples/docs/resources/mobile/app/file-upload/upload-file-list.vue new file mode 100644 index 000000000..956241600 --- /dev/null +++ b/examples/docs/resources/mobile/app/file-upload/upload-file-list.vue @@ -0,0 +1,34 @@ + + + diff --git a/example/src/demo/mobile/file-upload/upload-http-request.vue b/examples/docs/resources/mobile/app/file-upload/upload-http-request.vue similarity index 93% rename from example/src/demo/mobile/file-upload/upload-http-request.vue rename to examples/docs/resources/mobile/app/file-upload/upload-http-request.vue index 38b32d40b..4a8f06924 100644 --- a/example/src/demo/mobile/file-upload/upload-http-request.vue +++ b/examples/docs/resources/mobile/app/file-upload/upload-http-request.vue @@ -6,7 +6,7 @@ - diff --git a/examples/docs/resources/mobile/app/file-upload/upload-request.vue b/examples/docs/resources/mobile/app/file-upload/upload-request.vue new file mode 100644 index 000000000..2238b924e --- /dev/null +++ b/examples/docs/resources/mobile/app/file-upload/upload-request.vue @@ -0,0 +1,40 @@ + + + diff --git a/examples/docs/resources/mobile/app/file-upload/upload-user-head.vue b/examples/docs/resources/mobile/app/file-upload/upload-user-head.vue new file mode 100644 index 000000000..50f7e59d9 --- /dev/null +++ b/examples/docs/resources/mobile/app/file-upload/upload-user-head.vue @@ -0,0 +1,43 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/file-upload/webdoc/file-upload.cn.md b/examples/docs/resources/mobile/app/file-upload/webdoc/file-upload.cn.md new file mode 100644 index 000000000..d23536cfe --- /dev/null +++ b/examples/docs/resources/mobile/app/file-upload/webdoc/file-upload.cn.md @@ -0,0 +1,12 @@ +--- +title: FileUpload 文件上传 +--- + +# FileUpload 文件上传 + +
+ +可以设定文件的类型与上传的个数等。可自定义上传服务。 + +
+ diff --git a/examples/docs/resources/mobile/app/file-upload/webdoc/file-upload.en.md b/examples/docs/resources/mobile/app/file-upload/webdoc/file-upload.en.md new file mode 100644 index 000000000..2b0ef1dc1 --- /dev/null +++ b/examples/docs/resources/mobile/app/file-upload/webdoc/file-upload.en.md @@ -0,0 +1,7 @@ +--- +title: FileUpload +--- + +# FileUpload 文件上传 + +
FileUpload
diff --git a/examples/docs/resources/mobile/app/file-upload/webdoc/file-upload.js b/examples/docs/resources/mobile/app/file-upload/webdoc/file-upload.js new file mode 100644 index 000000000..8c9a3e725 --- /dev/null +++ b/examples/docs/resources/mobile/app/file-upload/webdoc/file-upload.js @@ -0,0 +1,806 @@ +export default { + column: '2', + owner: '', + // demos: [ + // { + // demoId: 'abort-quest', + // name: { + // 'zh-CN': '手动取消上传请求', + // 'en-US': 'button type', + // }, + // desc: { + // 'zh-CN': '

调用组件abort方法,取消上传请求

', + // 'en-US': '

button type

', + // }, + // codeFiles: ['abort-quest.vue'], + // }, + // { + // demoId: 'accept-file-image', + // name: { + // 'zh-CN': '可上传的文件类型', + // 'en-US': 'button round', + // }, + // desc: { + // 'zh-CN': '

通过配置 accept(image) 来限制上传文件的格式为 image

', + // 'en-US': '

button round

', + // }, + // codeFiles: ['accept-file-image.vue'], + // }, + // { + // demoId: 'clear-files', + // name: { + // 'zh-CN': '可上传的文件类型', + // 'en-US': 'clear-files', + // }, + // desc: { + // 'zh-CN': '

通过配置 accept(.doc,.docx) 来限制上传文件的格式为 .doc .docx

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['clear-files.vue'], + // }, + // { + // demoId: 'accept-file', + // name: { + // 'zh-CN': '可上传的文件类型', + // 'en-US': 'accept-file', + // }, + // desc: { + // 'zh-CN': '

通过配置 accept(.doc,.docx) 来限制上传文件的格式为 .doc .docx

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['accept-file.vue'], + // }, + // { + // demoId: 'custom-prefix', + // name: { + // 'zh-CN': '钩子函数', + // 'en-US': 'event', + // }, + // desc: { + // 'zh-CN': '

before-remove 删除文件之前的钩子,参数为上传的文件和文件列表,若返回 false 或者返回 Promise 且被 reject,则停止删除。
before-upload 上传文件之前的钩子,参数为上传的文件,若返回 false 或者返回 Promise 且被 reject,则停止上传。

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['custom-prefix.vue'], + // }, + // { + // demoId: 'custom-trigger', + // name: { + // 'zh-CN': '自定义触发文件选项框', + // 'en-US': 'max', + // }, + // desc: { + // 'zh-CN': '

可在组件中写一个名为trigger的插槽,来触发弹出文件选项框

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['custom-trigger.vue'], + // }, + // { + // demoId: 'custom-upload-request', + // name: { + // 'zh-CN': '自定义上传请求', + // 'en-US': 'placeholder', + // }, + // desc: { + // 'zh-CN': '

通过配置 headers ,设置自定义上传请求头信息

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['custom-upload-request.vue'], + // }, + // { + // demoId: 'custom-upload-tip', + // name: { + // 'zh-CN': '自定义上传提示', + // 'en-US': 'precision', + // }, + // desc: { + // 'zh-CN': '

可通过 tip 插槽来自定义上传提示

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['custom-upload-tip.vue'], + // }, + // { + // demoId: 'data', + // name: { + // 'zh-CN': '参数', + // 'en-US': 'precision', + // }, + // desc: { + // 'zh-CN': '

通过 data 属性可以上传时附带的额外参数。
通过 file-title 属性可以设置头部标题,该属性默认为‘附件’。

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['data.vue'], + // }, + // { + // demoId: 'drag-select-file', + // name: { + // 'zh-CN': '拖拽上传', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

可配置drag(type:boolean),来控制组件是否可以拖拽文件

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['drag-select-file.vue'], + // }, + // { + // demoId: 'drag-upload', + // name: { + // 'zh-CN': '是否可以拖拽文件上传', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

可配置 drag(type:boolean),来控制组件是否可以拖拽文件上传,如果配置了 accept 属性,可通过 @drop-error 事件获取不合规的拖拽文件。

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['drag-upload.vue'], + // }, + // { + // demoId: 'dynamic-disable', + // name: { + // 'zh-CN': '禁用', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

可配置disabled(type:boolean),来控制组件是否禁用

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['dynamic-disable.vue'], + // }, + // { + // demoId: 'file-icon-list', + // name: { + // 'zh-CN': '特殊属性', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

配置文件上传显示的图标路径

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['file-icon-list.vue'], + // }, + // { + // demoId: 'file-picture-card', + // name: { + // 'zh-CN': '文件缩略图', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

文件缩略图

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['file-picture-card.vue'], + // }, + // { + // demoId: 'file-title', + // name: { + // 'zh-CN': '特殊属性', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

设置头部标题

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['file-title.vue'], + // }, + // { + // demoId: 'header-show', + // name: { + // 'zh-CN': '特殊属性', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

是否显示头部

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['header-show.vue'], + // }, + // { + // demoId: 'image-size', + // name: { + // 'zh-CN': '获取上传图片的长宽尺寸', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

获取上传的片的原始尺寸

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['image-size.vue'], + // }, + // { + // demoId: 'manual-upload', + // name: { + // 'zh-CN': '手动上传', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

通过 action 配置上传地址,通过 submit 设置手动上传

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['manual-upload.vue'], + // }, + // { + // demoId: 'max-file-count', + // name: { + // 'zh-CN': '最大上传文件数', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

可通过配置limit(type:Number,大于0的整数)来限制上传文件的个数

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['max-file-count.vue'], + // }, + // { + // demoId: 'mini-mode', + // name: { + // 'zh-CN': 'mini 模式', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

可通过配置 mini-mode,设置显示 mini 模式

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['mini-mode.vue'], + // }, + // { + // demoId: 'multiple-file', + // name: { + // 'zh-CN': '文件多选', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

文件选择默认单选可配置multiple ="true"实现文件多选

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['multiple-file'], + // }, + // { + // demoId: 'picture-card', + // name: { + // 'zh-CN': '照片墙', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

可配置list-type = "picture-card"开启照片墙模式

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['picture-card'], + // }, + // { + // demoId: 'prevent-delete-file', + // name: { + // 'zh-CN': '阻止删除文件', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

:before-remove(移除文件前回调事件),方法里面return true/false,表示是否可以删除

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['prevent-delete-file'], + // }, + // { + // demoId: 'prevent-upload-file', + // name: { + // 'zh-CN': '阻止上传文件', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

before-upload(上传前回调事件),方法里面 return true/false,表示是否可以进行上传文件

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['prevent-upload-file'], + // }, + // { + // demoId: 'size', + // name: { + // 'zh-CN': '设置组件大小', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

可选值为medium,small,mini

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['size'], + // }, + // { + // demoId: 'upload-events', + // name: { + // 'zh-CN': '事件', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

preview 点击文件列表中已上传的文件时触发的事件。
remove 文件列表移除文件时触发的事件。
error 文件上传失败时触发的事件。
exceed 文件超出个数限制时触发的事件。
progress 文件上传时触发的事件。
change 文件状态改变时触发的事件,添加文件、上传成功和上传失败时都会被触发。
success 文件上传成功时触发的事件。

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['upload-events'], + // }, + // { + // demoId: 'upload-file-list', + // name: { + // 'zh-CN': '上传的文件列表', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

可配置:file-list(type:Object)来显示已上传的文件名和地址

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['upload-file-list'], + // }, + // { + // demoId: 'upload-http-request', + // name: { + // 'zh-CN': '覆盖默认请求', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': 'http-request,覆盖默认的上传行为,可以自定义上传的实现

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['upload-http-request'], + // }, + // { + // demoId: 'upload-limit', + // name: { + // 'zh-CN': '最大上传限制', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['upload-limit'], + // }, + // { + // demoId: 'upload-request', + // name: { + // 'zh-CN': '上传请求', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

可通过配置 action 为上传地址,可通过配置 headers 为头部请求信息

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['upload-request'], + // }, + // { + // demoId: 'upload-user-head', + // name: { + // 'zh-CN': '用户头像上传', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

用户头像上传

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['upload-user-head'], + // }, + // { + // demoId: 'with-credentials', + // name: { + // 'zh-CN': '支持发送cookie凭证信息', + // 'en-US': 'step', + // }, + // desc: { + // 'zh-CN': '

可通过配置:with-credentials = "true"开启访问服务器携带cookie,默认为true

', + // 'en-US': '

bbutton click

', + // }, + // codeFiles: ['with-credentials'], + // }, + // ], + apis: [ + { + name: 'fileupload', // 组件名称展示使用 + type: 'component', // API 类型 + properties: [ + { + name: 'accept', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

接受上传的文件类型(thumbnail-mode 模式下此参数无效)

', + 'en-US': 'display different button' + }, + demoId: 'accept-file-image' + }, + { + name: 'action', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

上传的地址,当不配置 action 时,会生成默认网关链接

', + 'en-US': 'display different button' + }, + demoId: 'accept-file' + }, + { + name: 'auto-upload', + type: 'Boolean', + defaultValue: 'true', + desc: { + 'zh-CN': '

是否在选取文件后立即进行上传,该属性默认为true。

', + 'en-US': 'display different button' + }, + demoId: 'manual-upload' + }, + { + name: 'before-remove', + type: 'function(file, fileList)', + defaultValue: '', + desc: { + 'zh-CN': + '

删除文件之前的钩子,参数为上传的文件和文件列表,若返回 false 或者返回 Promise 且被 reject,则停止删除。

', + 'en-US': 'display different button' + }, + demoId: 'custom-prefix' + }, + { + name: 'before-upload', + type: 'function(file,)', + defaultValue: '', + desc: { + 'zh-CN': + '

上传文件之前的钩子,参数为上传的文件,若返回 false 或者返回 Promise 且被 reject,则停止上传。

', + 'en-US': 'display different button' + }, + demoId: 'custom-prefix' + }, + { + name: 'buttons', + type: 'Boolean', + defaultValue: '', + desc: { + 'zh-CN': '

设置组件基本按钮禁用或启用。

', + 'en-US': 'display different button' + }, + demoId: '' + }, + { + name: 'data', + type: 'Object', + defaultValue: '', + desc: { + 'zh-CN': '

上传时附带的额外参数

', + 'en-US': 'display different button' + }, + demoId: 'data' + }, + { + name: 'disabled', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否禁用,该属性默认为false

', + 'en-US': 'display different button' + }, + demoId: 'dynamic-disable' + }, + { + name: 'display', + type: 'Boolean', + defaultValue: 'true', + desc: { + 'zh-CN': '

显示删除文件功能,该属性默认为true

', + 'en-US': 'display different button' + }, + demoId: 'manual-upload' + }, + { + name: 'ext-icons', + type: 'Object', + defaultValue: '', + desc: { + 'zh-CN': '

设置自定义文件类型图标,根据扩展名定义,默认由组件内部提供。

', + 'en-US': 'display different button' + }, + demoId: 'placeholder' + }, + { + name: 'file-icon-list', + type: 'Array', + defaultValue: '', + desc: { + 'zh-CN': '

配置文件上传显示的图标路径,未配置会默认显示组件内部配置图标

', + 'en-US': 'display different button' + }, + demoId: 'file-icon-list' + }, + { + name: 'file-list', + type: 'Array', + defaultValue: '', + desc: { + 'zh-CN': '

上传的文件列表, 例如: [{name: "food.jpg", url: "https://xxx.cdn.com/xxx.jpg"}]

', + 'en-US': 'display different button' + }, + demoId: 'upload-file-list' + }, + { + name: 'file-title', + type: 'String', + defaultValue: '附件', + desc: { + 'zh-CN': '

头部标题,该属性默认为‘附件’

', + 'en-US': 'display different button' + }, + demoId: 'file-title' + }, + { + name: 'header-show', + type: 'Boolean', + defaultValue: 'true', + desc: { + 'zh-CN': '

是否显示头部,该属性默认为true

', + 'en-US': 'display different button' + }, + demoId: 'header-show' + }, + { + name: 'headers', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

设置上传的请求头部

', + 'en-US': 'display different button' + }, + demoId: 'upload-request' + }, + { + name: 'http-request', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

覆盖默认的上传行为,可以自定义上传的实现

', + 'en-US': 'display different button' + }, + demoId: 'upload-http-request' + }, + { + name: 'limit', + type: 'Number', + defaultValue: '', + desc: { + 'zh-CN': '

最大允许上传个数

', + 'en-US': 'display different button' + }, + demoId: 'upload-limit' + }, + { + name: 'list-type', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

文件列表的类型

', + 'en-US': 'display different button' + }, + demoId: 'file-picture-card' + }, + { + name: 'max_file_count', + type: 'Number', + defaultValue: 'Infinity', + desc: { + 'zh-CN': '

设置文件上传数量的最大值,默认无限制,要大于0的正整数。

', + 'en-US': 'display different button' + }, + demoId: '' + }, + { + name: 'mini-mode', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

设置 mini 模式。

', + 'en-US': 'display different button' + }, + demoId: 'mini-mode' + }, + { + name: 'multiple', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否支持多选文件

', + 'en-US': 'display different button' + }, + demoId: 'multiple-file' + }, + { + name: 'name', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

上传的文件字段名

', + 'en-US': 'display different button' + }, + demoId: 'data' + }, + { + name: 'show-file-list', + type: 'Boolean', + defaultValue: 'true', + desc: { + 'zh-CN': '

是否显示已上传文件列表,该属性默认为true

', + 'en-US': 'display different button' + }, + demoId: 'upload-user-head' + }, + { + name: 'size', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

为单个按钮且按钮为TinyVue的Button组件时生效,值可设置为:medium,small,mini

', + 'en-US': 'display different button' + }, + demoId: 'size' + }, + { + name: 'success-statistics', + type: 'Boolean', + defaultValue: 'true', + desc: { + 'zh-CN': '

文件上传成功数量展示,该属性默认为true

', + 'en-US': 'display different button' + }, + demoId: '' + }, + { + name: 'type', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

文本,该属性默认为select

', + 'en-US': 'display different button' + }, + demoId: '' + }, + { + name: 'upload-icon', + type: 'Boolean', + defaultValue: 'true', + desc: { + 'zh-CN': '

是否显示头部文件上传按钮,该属性默认为true

', + 'en-US': 'display different button' + }, + demoId: 'data' + }, + { + name: 'with-credentials', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

文件列表支持发送 cookie 凭证信息类型,该属性默认为false

', + 'en-US': 'display different button' + }, + demoId: 'with-credentials' + } + ], + methods: [ + { + name: 'abort', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

取消上传请求

', + 'en-US': 'Click' + }, + demoId: 'event' + }, + { + name: 'clearFiles', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

清空已上传的文件列表(该方法不支持在 before-upload 中调用)

', + 'en-US': 'Click' + }, + demoId: 'clear-files' + }, + { + name: 'submit', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '', + 'en-US': 'Click' + }, + demoId: 'manual-upload' + } + ], + events: [ + { + name: 'change', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

文件状态改变时触发的事件,添加文件、上传成功和上传失败时都会被触发

', + 'en-US': 'Click' + }, + demoId: 'upload-events' + }, + { + name: 'error', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

文件上传失败时触发的事件。

', + 'en-US': 'Click' + }, + demoId: 'upload-events' + }, + { + name: 'exceed', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

文件超出个数限制时触发的事件

', + 'en-US': 'Click' + }, + demoId: 'upload-events' + }, + { + name: 'preview', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

点击文件列表中已上传的文件时触发的事件

', + 'en-US': 'Click' + }, + demoId: 'upload-events' + }, + { + name: 'progress', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

文件上传时触发的事件

', + 'en-US': 'Click' + }, + demoId: 'upload-events' + }, + { + name: 'remove', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

从文件列表移除文件时触发的事件

', + 'en-US': 'Click' + }, + demoId: 'upload-events' + }, + { + name: 'success', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

文件上传成功时触发的事件

', + 'en-US': 'Click' + }, + demoId: 'upload-events' + } + ], + slot: [ + { + name: 'tip', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

提示说明文字

', + 'en-US': 'Click' + }, + demoId: 'custom-upload-tip' + }, + { + name: 'trigger', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

触发文件选择框的内容

', + 'en-US': 'Click' + }, + demoId: 'custom-upload-tip' + } + ] + } + ] +} diff --git a/example/src/demo/mobile/file-upload/with-credentials.vue b/examples/docs/resources/mobile/app/file-upload/with-credentials.vue similarity index 95% rename from example/src/demo/mobile/file-upload/with-credentials.vue rename to examples/docs/resources/mobile/app/file-upload/with-credentials.vue index 83134c545..e53526370 100644 --- a/example/src/demo/mobile/file-upload/with-credentials.vue +++ b/examples/docs/resources/mobile/app/file-upload/with-credentials.vue @@ -6,7 +6,7 @@ - diff --git a/example/src/demo/mobile/image-viewer/image-full-current.vue b/examples/docs/resources/mobile/app/imageviewer/image-full-current.vue similarity index 75% rename from example/src/demo/mobile/image-viewer/image-full-current.vue rename to examples/docs/resources/mobile/app/imageviewer/image-full-current.vue index 8050fcea0..62720522c 100644 --- a/example/src/demo/mobile/image-viewer/image-full-current.vue +++ b/examples/docs/resources/mobile/app/imageviewer/image-full-current.vue @@ -1,4 +1,4 @@ - - + diff --git a/example/src/demo/mobile/input/prefix-suffix.vue b/examples/docs/resources/mobile/app/input/prefix-suffix.vue similarity index 96% rename from example/src/demo/mobile/input/prefix-suffix.vue rename to examples/docs/resources/mobile/app/input/prefix-suffix.vue index 785018d41..2d1b9be8b 100644 --- a/example/src/demo/mobile/input/prefix-suffix.vue +++ b/examples/docs/resources/mobile/app/input/prefix-suffix.vue @@ -11,7 +11,7 @@ - + diff --git a/example/src/demo/mobile/input/props.vue b/examples/docs/resources/mobile/app/input/props.vue similarity index 95% rename from example/src/demo/mobile/input/props.vue rename to examples/docs/resources/mobile/app/input/props.vue index c1b645f8c..05fccdb03 100644 --- a/example/src/demo/mobile/input/props.vue +++ b/examples/docs/resources/mobile/app/input/props.vue @@ -4,7 +4,7 @@ - + diff --git a/examples/docs/resources/mobile/app/input/slot-content.vue b/examples/docs/resources/mobile/app/input/slot-content.vue new file mode 100644 index 000000000..9fc43a8d6 --- /dev/null +++ b/examples/docs/resources/mobile/app/input/slot-content.vue @@ -0,0 +1,30 @@ + + + + + diff --git a/example/src/demo/mobile/input/slots-append-prepend.vue b/examples/docs/resources/mobile/app/input/slots-append-prepend.vue similarity index 96% rename from example/src/demo/mobile/input/slots-append-prepend.vue rename to examples/docs/resources/mobile/app/input/slots-append-prepend.vue index 07836dbd8..c642382e9 100644 --- a/example/src/demo/mobile/input/slots-append-prepend.vue +++ b/examples/docs/resources/mobile/app/input/slots-append-prepend.vue @@ -10,7 +10,7 @@ - + diff --git a/example/src/demo/mobile/input/type-be-form-select.vue b/examples/docs/resources/mobile/app/input/type-be-form-select.vue similarity index 97% rename from example/src/demo/mobile/input/type-be-form-select.vue rename to examples/docs/resources/mobile/app/input/type-be-form-select.vue index efac3c93b..72801ae49 100644 --- a/example/src/demo/mobile/input/type-be-form-select.vue +++ b/examples/docs/resources/mobile/app/input/type-be-form-select.vue @@ -4,7 +4,7 @@ - + diff --git a/examples/docs/resources/mobile/app/input/webdoc/input.cn.md b/examples/docs/resources/mobile/app/input/webdoc/input.cn.md new file mode 100644 index 000000000..e819c36c6 --- /dev/null +++ b/examples/docs/resources/mobile/app/input/webdoc/input.cn.md @@ -0,0 +1,12 @@ +--- +title: Input 输入框 +--- + +# Input 输入框 + +
+ +Input 输入框 + +
+ diff --git a/examples/docs/resources/mobile/app/input/webdoc/input.en.md b/examples/docs/resources/mobile/app/input/webdoc/input.en.md new file mode 100644 index 000000000..8ddbce136 --- /dev/null +++ b/examples/docs/resources/mobile/app/input/webdoc/input.en.md @@ -0,0 +1,7 @@ +--- +title: Input +--- + +# Input 输入框 + +
Input
diff --git a/examples/docs/resources/mobile/app/input/webdoc/input.js b/examples/docs/resources/mobile/app/input/webdoc/input.js new file mode 100644 index 000000000..3666f9669 --- /dev/null +++ b/examples/docs/resources/mobile/app/input/webdoc/input.js @@ -0,0 +1,686 @@ +export default { + column: '2', + owner: '', + demos: [ + { + demoId: 'autofocus', + name: { + 'zh-CN': '自动获取焦点', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': '

自动获取焦点

', + 'en-US': '

button type

', + }, + codeFiles: ['autofocus.vue'], + }, + { + demoId: 'autosize', + name: { + 'zh-CN': '自适应内容高度', + 'en-US': 'button round', + }, + desc: { + 'zh-CN': '

自适应内容高度

', + 'en-US': '

button round

', + }, + codeFiles: ['autosize.vue'], + }, + { + demoId: 'blur-focus', + name: { + 'zh-CN': '获取/失去焦点', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

获取/失去焦点

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['blur-focus.vue'], + }, + { + demoId: 'clearable', + name: { + 'zh-CN': '可清空', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

可清空

', + }, + codeFiles: ['clearable.vue'], + }, + { + demoId: 'cols-rows', + name: { + 'zh-CN': '原生属性', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

宽度和高度

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['cols-rows.vue'], + }, + { + demoId: 'counter', + name: { + 'zh-CN': '计数与输入统计', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

计数与输入统计

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['counter.vue'], + }, + { + demoId: 'events', + name: { + 'zh-CN': '事件', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

事件

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['events.vue'], + }, + { + demoId: 'form', + name: { + 'zh-CN': 'form', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

form

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['form.vue'], + }, + { + demoId: 'input-event', + name: { + 'zh-CN': '事件', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

blur / focus / input 事件

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['input-event.vue'], + }, + { + demoId: 'max-min-length', + name: { + 'zh-CN': '输入长度限制', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

输入长度限制

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['max-min-length.vue'], + }, + { + demoId: 'method-select', + name: { + 'zh-CN': '选中输入框文本', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

选中输入框文本

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['method-select.vue'], + }, + { + demoId: 'prefix-suffix', + name: { + 'zh-CN': '复合型输入框', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

复合型输入框

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['prefix-suffix.vue'], + }, + { + demoId: 'props-step', + name: { + 'zh-CN': '步长', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

通过step设置步长,需要结合 type="number" 一起使用

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['props-step.vue'], + }, + { + demoId: 'props', + name: { + 'zh-CN': '原生属性', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

是否只读

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['props.vue'], + }, + { + demoId: 'show-password', + name: { + 'zh-CN': '密码框', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

密码框

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['show-password.vue'], + }, + { + demoId: 'slot-content', + name: { + 'zh-CN': '插槽', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

通过content自定义头部内容,只对 type="textarea" 有效

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['slot-content.vue'], + }, + { + demoId: 'slots-append-prepend', + name: { + 'zh-CN': '复合型输入框', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

通过append自定义头部内容,通过 prepend自定义尾部内容,

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['slots-append-prepend.vue'], + }, + { + demoId: 'suffix-icon', + name: { + 'zh-CN': '自定义后置图标', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

自定义后置图标

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['suffix-icon.vue'], + }, + { + demoId: 'type-be-form-select', + name: { + 'zh-CN': '类型type为 form 时的下拉用法', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

is-selectselect-menu搭配让type为form的输入框变为下拉

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['type-be-form-select.vue'], + }, + { + demoId: 'type-be-form-tips', + name: { + 'zh-CN': 'form类型的文字提示', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

类型type为 form 时的输入框下的提示

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['type-be-form-tips.vue'], + }, + { + demoId: 'type-be-form', + name: { + 'zh-CN': 'type为form类型', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

类型type为 form 时的基本用法

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['type-be-form.vue'], + }, + { + demoId: 'validate-event', + name: { + 'zh-CN': '表单校正', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

通过validate-event属性设置输入时是否触发表单的校验,该属性默认为 true。

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['validate-event.vue'], + }, + + ], + apis: [ + { + name: 'Input', // 组件名称展示使用 + type: 'component', // API 类型 + properties: [ + { + name: 'autocomplete', + type: 'String', + defaultValue: 'off', + desc: { + 'zh-CN': '

原生属性,自动补全,该属性默认为off

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'autofocus', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

原生属性,自动获取焦点,该属性默认为false

', + 'en-US': 'display different button', + }, + demoId: 'autofocus', + }, + { + name: 'autosize', + type: 'Boolean | Object', + defaultValue: 'false', + desc: { + 'zh-CN': '

自适应内容高度,只对 type="textarea"有效,可传入对象,如,{ minRows: 2, maxRows: 6 },该属性默认为false

', + 'en-US': 'display different button', + }, + demoId: 'autosize', + }, + { + name: 'clearable', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

选中时的值

', + 'en-US': 'display different button', + }, + demoId: 'clearable', + }, + { + name: 'cols', + type: 'Number', + defaultValue: '', + desc: { + 'zh-CN': '

原生属性,设置宽度,在 type ="textarea"时有效

', + 'en-US': 'display different button', + }, + demoId: 'cols-rows', + }, + { + name: 'counter', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否显示字数统计,只在 type = "text" 或 type = "textarea" 时有效

', + 'en-US': 'display different button', + }, + demoId: 'counter', + }, + { + name: 'disabled', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

禁用,该属性默认为false性

', + 'en-US': 'display different button', + }, + demoId: 'autosize', + }, + { + name: 'form', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

原生属性

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'is-select', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

type为form时,设置输入框可下拉选择

', + 'en-US': 'display different button', + }, + demoId: 'type-be-form-select', + }, + { + name: 'label', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

输入框关联的label文字

', + 'en-US': 'display different button', + }, + demoId: 'props', + }, + { + name: 'maxlength', + type: 'Number', + defaultValue: '', + desc: { + 'zh-CN': '

原生属性,最大输入长度

', + 'en-US': 'display different button', + }, + demoId: 'max-min-length', + }, + { + name: 'minlength', + type: 'Number', + defaultValue: '', + desc: { + 'zh-CN': '

原生属性,最小输入长度

', + 'en-US': 'display different button', + }, + demoId: 'max-min-length', + }, + { + name: 'mobile-tips', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

原生属性,设置最小值

', + 'en-US': 'display different button', + }, + demoId: 'type-be-form-tips', + }, + { + name: 'name', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

原生属性

', + 'en-US': 'display different button', + }, + demoId: 'props', + }, + { + name: 'placeholde', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

输入框占位文本

', + 'en-US': 'display different button', + }, + demoId: 'prefix-suffix', + }, + { + name: 'readonly', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

原生属性,是否只读,该属性默认为false

', + 'en-US': 'display different button', + }, + demoId: 'props', + }, + { + name: 'rows', + type: 'Number', + defaultValue: '2', + desc: { + 'zh-CN': '

输入框行数,只对 type="textarea"有效,该属性默认为2

', + 'en-US': 'display different button', + }, + demoId: 'cols-rows', + }, + { + name: 'select-menu', + type: 'Array', + defaultValue: '', + desc: { + 'zh-CN': '

type为form时,设置输入框可下拉选择,设置选择项

', + 'en-US': 'display different button', + }, + demoId: 'type-be-form-select', + }, + { + name: 'show-password', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否显示切换密码图标,该属性默认为false

', + 'en-US': 'display different button', + }, + demoId: 'show-password', + }, + { + name: 'show-word-limit', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否显示输入字数统计,只在 type = ‘text’ 或 type = ‘textarea’ 时有效,该属性默认为false

', + 'en-US': 'display different button', + }, + demoId: 'counter', + }, + { + name: 'step', + type: 'Number', + defaultValue: '', + desc: { + 'zh-CN': '

原生属性,设置输入字段的合法数字间隔

', + 'en-US': 'display different button', + }, + demoId: 'props-step', + }, + { + name: 'suffix-icon', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

输入框尾部图标

', + 'en-US': 'display different button', + }, + demoId: 'suffix-icon', + }, + { + name: 'textarea-title', + type: 'String', + defaultValue: '标题', + desc: { + 'zh-CN': '

textarea类型自定义标题,该属性默认为‘标题’

', + 'en-US': 'display different button', + }, + demoId: 'autosize', + }, + { + name: ' type', + type: 'String', + defaultValue: 'text', + desc: { + 'zh-CN': '

input 元素的类型,该属性默认为"text"

', + 'en-US': 'display different button', + }, + demoId: 'autofocus', + }, + { + name: 'validate-event', + type: 'Boolean', + defaultValue: 'true', + desc: { + 'zh-CN': '

输入时是否触发表单的校验,该属性默认为true

', + 'en-US': 'display different button', + }, + demoId: 'validate-event', + }, + { + name: 'value / v-model', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

绑定值

', + 'en-US': 'display different button', + }, + demoId: 'autofocus', + }, + { + name: 'vertical', + type: 'Number', + defaultValue: '', + desc: { + 'zh-CN': '

原生属性,设置最小值

', + 'en-US': 'display different button', + }, + demoId: 'autofocus', + }, + ], + methods: [ + { + name: 'blur', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

使 input 失去焦点

', + 'en-US': 'display different button', + }, + demoId: 'blur-focus', + }, + { + name: 'focus', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

使 input 获取焦点

', + 'en-US': 'display different button', + }, + demoId: 'blur-focus', + }, + { + name: 'select', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

选中 input 中的文字

', + 'en-US': 'display different button', + }, + demoId: 'method-select', + }, + + ], + events: [ + { + name: 'change', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

在 Input 值改变时触发

', + 'en-US': 'Click', + }, + demoId: 'events', + }, + { + name: 'blur', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

在 在 Input 失去焦点时触发

', + 'en-US': 'Click', + }, + demoId: 'blur-focus', + }, + { + name: 'focus', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

在 Input 获得焦点时触发

', + 'en-US': 'Click', + }, + demoId: 'blur-focus', + }, + { + name: 'clear', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

在点击由 clearable 属性生成的清空按钮时触发

', + 'en-US': 'Click', + }, + demoId: 'blur-focus', + }, + { + name: 'input', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

输入值时触发事件

', + 'en-US': 'Click', + }, + demoId: 'input-event', + }, + ], + slots: [ + + { + name: 'append', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

输入框后置内容,只对 type="text"有效

', + 'en-US': 'slots-append-prepend', + }, + demoId: '', + }, + { + name: 'prepend', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

输入框前置内容,只对 type="text"有效

', + 'en-US': 'slots-append-prepend', + }, + demoId: '', + }, + { + name: 'prefix', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

输入框头部内容,只对 type="text"有效

', + 'en-US': 'Click', + }, + demoId: 'prefix-suffix', + }, + { + name: 'suffix', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

输入框尾部内容,只对 type="text"有效

', + 'en-US': 'Click', + }, + demoId: 'prefix-suffix', + }, + { + name: 'content', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

输入框头部内容插槽,只对 type="textarea"有效

', + 'en-US': 'Click', + }, + demoId: 'slot-content', + }, + ], + }, + ], +} diff --git a/example/src/demo/mobile/list/double-line.vue b/examples/docs/resources/mobile/app/list/double-line.vue similarity index 98% rename from example/src/demo/mobile/list/double-line.vue rename to examples/docs/resources/mobile/app/list/double-line.vue index 7ddb9d964..f14a965d7 100644 --- a/example/src/demo/mobile/list/double-line.vue +++ b/examples/docs/resources/mobile/app/list/double-line.vue @@ -14,7 +14,7 @@ - + + diff --git a/examples/docs/resources/mobile/app/multi-select/webdoc/multi-select.cn.md b/examples/docs/resources/mobile/app/multi-select/webdoc/multi-select.cn.md new file mode 100644 index 000000000..34231d3ad --- /dev/null +++ b/examples/docs/resources/mobile/app/multi-select/webdoc/multi-select.cn.md @@ -0,0 +1,11 @@ +--- +title: multiSelect 下拉选择器 +--- + +# multiSelect 下拉选择器 + +
+ +multiSelect 下拉选择器 + +
diff --git a/examples/docs/resources/mobile/app/multi-select/webdoc/multi-select.en.md b/examples/docs/resources/mobile/app/multi-select/webdoc/multi-select.en.md new file mode 100644 index 000000000..46c83c574 --- /dev/null +++ b/examples/docs/resources/mobile/app/multi-select/webdoc/multi-select.en.md @@ -0,0 +1,7 @@ +--- +title: multiSelect +--- + +# multiSelect + +
multiSelect
diff --git a/examples/docs/resources/mobile/app/multi-select/webdoc/multi-select.js b/examples/docs/resources/mobile/app/multi-select/webdoc/multi-select.js new file mode 100644 index 000000000..d2a700b45 --- /dev/null +++ b/examples/docs/resources/mobile/app/multi-select/webdoc/multi-select.js @@ -0,0 +1,68 @@ +export default { + column: '2', + owner: '', + demos: [ + { + demoId: 'basic-usage', + name: { + 'zh-CN': '基础用法', + 'en-US': 'button type' + }, + desc: { + 'zh-CN': '

基础用法

', + 'en-US': '

button type

' + }, + codeFiles: ['basic-usage.vue'] + } + ], + apis: [ + { + name: 'multiSelect', // 组件名称展示使用 + type: 'component', // API 类型 + properties: [ + { + name: 'dataSource', + type: '[]', + defaultValue: '', + desc: { + 'zh-CN': '

数据

', + 'en-US': 'display different button' + }, + demoId: 'basic-usage' + }, + { + name: 'defaultSelectedArray', + type: '[]', + defaultValue: '', + desc: { + 'zh-CN': '

默认值

', + 'en-US': 'display different button' + }, + demoId: 'basic-usage' + } + ], + events: [ + { + name: 'confim', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

确认事件

', + 'en-US': 'display different button' + }, + demoId: 'basic-usage' + }, + { + name: 'reset', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

重置事件

', + 'en-US': 'display different button' + }, + demoId: 'basic-usage' + } + ] + } + ] +} diff --git a/example/src/demo/mobile/nav-bar/left-right-arrow.vue b/examples/docs/resources/mobile/app/navbar/left-right-arrow.vue similarity index 92% rename from example/src/demo/mobile/nav-bar/left-right-arrow.vue rename to examples/docs/resources/mobile/app/navbar/left-right-arrow.vue index 6b140eda3..f600892ef 100644 --- a/example/src/demo/mobile/nav-bar/left-right-arrow.vue +++ b/examples/docs/resources/mobile/app/navbar/left-right-arrow.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/mobile/app/navbar/webdoc/navbar.cn.md b/examples/docs/resources/mobile/app/navbar/webdoc/navbar.cn.md new file mode 100644 index 000000000..2b3dc819c --- /dev/null +++ b/examples/docs/resources/mobile/app/navbar/webdoc/navbar.cn.md @@ -0,0 +1,13 @@ +--- +title: NavBar 导航栏 +--- + +# NavBar 导航栏 + +
+ +NavBar导航栏用于屏幕上方,方便用户切换不同页面。 + + + +
\ No newline at end of file diff --git a/examples/docs/resources/mobile/app/navbar/webdoc/navbar.en.md b/examples/docs/resources/mobile/app/navbar/webdoc/navbar.en.md new file mode 100644 index 000000000..104266a73 --- /dev/null +++ b/examples/docs/resources/mobile/app/navbar/webdoc/navbar.en.md @@ -0,0 +1,11 @@ +--- +title: NavBar 导航栏 +--- + +# NavBar 导航栏 + +
+ + + +
\ No newline at end of file diff --git a/examples/docs/resources/mobile/app/navbar/webdoc/navbar.js b/examples/docs/resources/mobile/app/navbar/webdoc/navbar.js new file mode 100644 index 000000000..d686e6fa7 --- /dev/null +++ b/examples/docs/resources/mobile/app/navbar/webdoc/navbar.js @@ -0,0 +1,174 @@ +export default { + column: '2', + owner: '', + demos: [ + { + demoId: 'left-right-arrow', + name: { + 'zh-CN': '显示左右箭头', + 'en-US': 'left right arrow', + }, + desc: { + 'zh-CN': '

显示左右箭头

', + 'en-US': '

button type

', + }, + codeFiles: ['left-right-arrow.vue'], + }, + { + demoId: 'left-right-text', + name: { + 'zh-CN': '指定左右文本', + 'en-US': 'left right text', + }, + desc: { + 'zh-CN': '

指定左右文本

', + 'en-US': '

button round

', + }, + codeFiles: ['left-right-text.vue'], + }, + { + demoId: 'slots', + name: { + 'zh-CN': '自定义左右侧内容', + 'en-US': 'slots', + }, + desc: { + 'zh-CN': '

自定义左右侧内容

', + 'en-US': '

button click

', + }, + codeFiles: ['slots.vue'], + }, + { + demoId: 'z-index', + name: { + 'zh-CN': '设置层级', + 'en-US': 'z-index', + }, + desc: { + 'zh-CN': '

设置层

', + 'en-US': '

button click

', + }, + codeFiles: ['z-index.vue'], + }, + ], + apis: [ + { + name: 'navBar', // 组件名称展示使用 + type: 'component', // API 类型 + properties: [ + { + name: 'fixed', + type: 'Boolean', + defaultValue: 'true', + desc: { + 'zh-CN': '

是否固定在顶部,该属性默认为true

', + 'en-US': 'Is fixed top', + }, + demoId: 'left-right-arrow', + }, + { + name: 'left-arrow', + type: 'Boolean', + defaultValue: '', + desc: { + 'zh-CN': '

是否显示左侧箭头,该属性默认为false

', + 'en-US': 'Is show left arrow', + }, + demoId: 'left-right-arrow', + }, + { + name: 'right-arrow', + type: 'Boolean', + defaultValue: '', + desc: { + 'zh-CN': '

是否显示右侧箭头

', + 'en-US': 'Is show right arrow', + }, + demoId: 'left-right-arrow', + }, + { + name: 'right-text', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

设置右侧文本

', + 'en-US': 'Is show right text', + }, + demoId: 'left-right-text', + }, + { + name: 'left-text', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

设置左侧文本

', + 'en-US': 'Is show left text', + }, + demoId: 'left-right-text', + }, + { + name: 'sub-title', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

设置副标题

', + 'en-US': 'set sub-title', + }, + demoId: 'left-right-text', + }, + { + name: 'title', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

设置主标题

', + 'en-US': 'set main-title', + }, + demoId: 'z-index', + }, + { + name: 'z-index', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

设置z-index

', + 'en-US': 'set z-index', + }, + demoId: 'z-index', + }, + ], + slot: [ + { + name: 'default', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

自定义标题

', + 'en-US': 'Click', + }, + demoId: 'left-right-arrow', + }, + { + name: 'left', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

自定义左侧内容

', + 'en-US': 'Click', + }, + demoId: 'left-right-text', + }, + { + name: 'right', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

自定义右侧内容

', + 'en-US': 'Click', + }, + demoId: 'left-right-text', + }, + ], + }, + ], +} diff --git a/example/src/demo/mobile/nav-bar/z-index.vue b/examples/docs/resources/mobile/app/navbar/z-index.vue similarity index 93% rename from example/src/demo/mobile/nav-bar/z-index.vue rename to examples/docs/resources/mobile/app/navbar/z-index.vue index 505c56e15..5879ef3b5 100644 --- a/example/src/demo/mobile/nav-bar/z-index.vue +++ b/examples/docs/resources/mobile/app/navbar/z-index.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/mobile/app/numeric/controls.vue b/examples/docs/resources/mobile/app/numeric/controls.vue new file mode 100644 index 000000000..a7ec9c130 --- /dev/null +++ b/examples/docs/resources/mobile/app/numeric/controls.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/mobile/app/numeric/event.vue b/examples/docs/resources/mobile/app/numeric/event.vue new file mode 100644 index 000000000..bde9b91fe --- /dev/null +++ b/examples/docs/resources/mobile/app/numeric/event.vue @@ -0,0 +1,29 @@ + + + diff --git a/examples/docs/resources/mobile/app/numeric/max.vue b/examples/docs/resources/mobile/app/numeric/max.vue new file mode 100644 index 000000000..a50a31a96 --- /dev/null +++ b/examples/docs/resources/mobile/app/numeric/max.vue @@ -0,0 +1,19 @@ + + + diff --git a/examples/docs/resources/mobile/app/numeric/placeholder.vue b/examples/docs/resources/mobile/app/numeric/placeholder.vue new file mode 100644 index 000000000..63dcf8428 --- /dev/null +++ b/examples/docs/resources/mobile/app/numeric/placeholder.vue @@ -0,0 +1,61 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/numeric/precision.vue b/examples/docs/resources/mobile/app/numeric/precision.vue new file mode 100644 index 000000000..21cedd2af --- /dev/null +++ b/examples/docs/resources/mobile/app/numeric/precision.vue @@ -0,0 +1,19 @@ + + + diff --git a/examples/docs/resources/mobile/app/numeric/size.vue b/examples/docs/resources/mobile/app/numeric/size.vue new file mode 100644 index 000000000..01a9fb7bd --- /dev/null +++ b/examples/docs/resources/mobile/app/numeric/size.vue @@ -0,0 +1,20 @@ + + + diff --git a/examples/docs/resources/mobile/app/numeric/step.vue b/examples/docs/resources/mobile/app/numeric/step.vue new file mode 100644 index 000000000..a288d0e42 --- /dev/null +++ b/examples/docs/resources/mobile/app/numeric/step.vue @@ -0,0 +1,19 @@ + + + diff --git a/examples/docs/resources/mobile/app/numeric/webdoc/numeric.cn.md b/examples/docs/resources/mobile/app/numeric/webdoc/numeric.cn.md new file mode 100644 index 000000000..8302f6d48 --- /dev/null +++ b/examples/docs/resources/mobile/app/numeric/webdoc/numeric.cn.md @@ -0,0 +1,12 @@ +--- +title: Numeric 计数器 +--- + +# Numeric 计数器 + +
+ +Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。 + +
+ diff --git a/examples/docs/resources/mobile/app/numeric/webdoc/numeric.en.md b/examples/docs/resources/mobile/app/numeric/webdoc/numeric.en.md new file mode 100644 index 000000000..6cf1ad525 --- /dev/null +++ b/examples/docs/resources/mobile/app/numeric/webdoc/numeric.en.md @@ -0,0 +1,7 @@ +--- +title: Numeric +--- + +# Numeric 计数器 + +
Numeric
diff --git a/examples/docs/resources/mobile/app/numeric/webdoc/numeric.js b/examples/docs/resources/mobile/app/numeric/webdoc/numeric.js new file mode 100644 index 000000000..149a87422 --- /dev/null +++ b/examples/docs/resources/mobile/app/numeric/webdoc/numeric.js @@ -0,0 +1,307 @@ +export default { + column: '2', + owner: '', + demos: [ + { + demoId: 'automatic-price', + name: { + 'zh-CN': '根据商品数量自动计算价格', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': '

根据商品数量自动计算价格

', + 'en-US': '

button type

', + }, + codeFiles: ['automatic-price.vue'], + }, + { + demoId: 'circulate', + name: { + 'zh-CN': '是否循环', + 'en-US': 'button round', + }, + desc: { + 'zh-CN': '

是否循环

', + 'en-US': '

button round

', + }, + codeFiles: ['circulate.vue'], + }, + { + demoId: 'controls-position', + name: { + 'zh-CN': '控制按钮显示位置', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

控制按钮显示位置

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['controls-position.vue'], + }, + { + demoId: 'controls', + name: { + 'zh-CN': '控制按钮', + 'en-US': 'controls', + }, + desc: { + 'zh-CN': '

控制按钮

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['controls.vue'], + }, + { + demoId: 'event', + name: { + 'zh-CN': '事件', + 'en-US': 'event', + }, + desc: { + 'zh-CN': '

事件

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['event.vue'], + }, + { + demoId: 'max', + name: { + 'zh-CN': '最大值最小值', + 'en-US': 'max', + }, + desc: { + 'zh-CN': '

最大值最小值

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['max.vue'], + }, + { + demoId: 'placeholder', + name: { + 'zh-CN': '占位文本', + 'en-US': 'placeholder', + }, + desc: { + 'zh-CN': '

通过placeholder属性设置输入框占位文本。

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['placeholder.vue'], + }, + { + demoId: 'precision', + name: { + 'zh-CN': '数值精度', + 'en-US': 'precision', + }, + desc: { + 'zh-CN': '

数值精度

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['precision.vue'], + }, + { + demoId: 'size', + name: { + 'zh-CN': '尺寸', + 'en-US': 'size', + }, + desc: { + 'zh-CN': '

尺寸

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['size.vue'], + }, + { + demoId: 'step', + name: { + 'zh-CN': '步长', + 'en-US': 'step', + }, + desc: { + 'zh-CN': '

步长

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['step.vue'], + }, + ], + apis: [ + { + name: 'Numeric', // 组件名称展示使用 + type: 'component', // API 类型 + properties: [ + { + name: 'circulate', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

向上到达最大值后从最小值开始,或反过来,该属性默认为false

', + 'en-US': 'display different button', + }, + demoId: 'circulate', + }, + { + name: 'controls', + type: 'Boolean', + defaultValue: 'true', + desc: { + 'zh-CN': '

是否使用控制按钮,该属性默认为true

', + 'en-US': 'display different button', + }, + demoId: 'controls', + }, + { + name: 'controls-position', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

控制按钮位置

', + 'en-US': 'display different button', + }, + demoId: 'controls-position', + }, + { + name: 'disabled', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否禁用计数器。该属性默认为false。

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'label', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

输入框关联的label文字

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'max', + type: 'Number', + defaultValue: 'Infinity', + desc: { + 'zh-CN': '

设置计数器允许的最大值,该属性默为 Infinity。

', + 'en-US': 'display different button', + }, + demoId: 'max', + }, + { + name: 'min', + type: 'Number', + defaultValue: '-Infinity', + desc: { + 'zh-CN': '

设置计数器允许的最小值,该属性默为 -Infinity

', + 'en-US': 'display different button', + }, + demoId: 'max', + }, + { + name: 'placeholder', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

输入框占位文本

', + 'en-US': 'display different button', + }, + demoId: 'placeholder', + }, + { + name: 'precision', + type: 'Number', + defaultValue: '', + desc: { + 'zh-CN': '

数值精度

', + 'en-US': 'display different button', + }, + demoId: 'precision', + }, + { + name: 'size', + type: 'Number | String', + defaultValue: '', + desc: { + 'zh-CN': '

计数器尺寸,可选值:larger

', + 'en-US': 'display different button', + }, + demoId: 'precision', + }, + { + name: 'step', + type: 'Number', + defaultValue: '1', + desc: { + 'zh-CN': '

设置按上下方向键或点击上下按钮增减的数值,该属性默认步长为 1。

', + 'en-US': 'display different button', + }, + demoId: 'step', + }, + { + name: 'step-strictly', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否只能输入 step 的倍数,该属性默认为false。

', + 'en-US': 'display different button', + }, + demoId: 'step', + }, + { + name: 'theme', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

设置圆角风格按钮

', + 'en-US': 'display different button', + }, + demoId: '', + }, + + { + name: 'value', + type: 'Number', + defaultValue: '0', + desc: { + 'zh-CN': '

设置输入组件的默认值,该属性默认为 0。

', + 'en-US': 'display different button', + }, + demoId: '', + }, + ], + events: [ + { + name: 'change', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

设置组件的值变化时触发的回调函数。

', + 'en-US': 'Click', + }, + demoId: 'event', + }, + { + name: 'blur', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

设置组件失去焦点时触发的回调函数。

', + 'en-US': 'Click', + }, + demoId: 'event', + }, + { + name: 'focus', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

设置组件获得焦点时触发的回调函数。

', + 'en-US': 'Click', + }, + demoId: 'event', + }, + ], + }, + ], +} diff --git a/examples/docs/resources/mobile/app/popover/base.vue b/examples/docs/resources/mobile/app/popover/base.vue new file mode 100644 index 000000000..9603d1c62 --- /dev/null +++ b/examples/docs/resources/mobile/app/popover/base.vue @@ -0,0 +1,110 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/popover/direction.vue b/examples/docs/resources/mobile/app/popover/direction.vue new file mode 100644 index 000000000..9f331d996 --- /dev/null +++ b/examples/docs/resources/mobile/app/popover/direction.vue @@ -0,0 +1,109 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/popover/webdoc/popover.cn.md b/examples/docs/resources/mobile/app/popover/webdoc/popover.cn.md new file mode 100644 index 000000000..0eb232574 --- /dev/null +++ b/examples/docs/resources/mobile/app/popover/webdoc/popover.cn.md @@ -0,0 +1,11 @@ +--- +title: Popover 气泡 +--- + +# Popover 气泡 + +
+ +Popover 气泡 + +
diff --git a/examples/docs/resources/mobile/app/popover/webdoc/popover.en.md b/examples/docs/resources/mobile/app/popover/webdoc/popover.en.md new file mode 100644 index 000000000..15518d183 --- /dev/null +++ b/examples/docs/resources/mobile/app/popover/webdoc/popover.en.md @@ -0,0 +1,7 @@ +--- +title: Popover +--- + +# Popover + +
Popover
diff --git a/examples/docs/resources/mobile/app/popover/webdoc/popover.js b/examples/docs/resources/mobile/app/popover/webdoc/popover.js new file mode 100644 index 000000000..7522cd136 --- /dev/null +++ b/examples/docs/resources/mobile/app/popover/webdoc/popover.js @@ -0,0 +1,292 @@ +export default { + column: '2', + owner: '', + demos: [ + { + demoId: 'base', + name: { + 'zh-CN': '基础用法', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': '

基础用法

', + 'en-US': '

button type

', + }, + codeFiles: ['base.vue'], + }, + { + demoId: 'direction', + name: { + 'zh-CN': '方向', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': '

展开方向

', + 'en-US': '

button type

', + }, + codeFiles: ['direction.vue'], + }, + ], + apis: [ + { + name: 'Popover', // 组件名称展示使用 + type: 'component', // API 类型 + properties: [ + { + name: 'trigger', + type: 'string', + defaultValue: 'click', + desc: { + 'zh-CN': '

触发方式;该属性的可选值为 click / focus / hover / manual

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'title', + type: 'string', + defaultValue: '', + desc: { + 'zh-CN': '

标题

', + 'en-US': 'display different button', + }, + demoId: 'base', + }, + { + name: 'content', + type: 'string', + defaultValue: '', + desc: { + 'zh-CN': '

显示的内容,也可以通过 slot 传入 DOM

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'width', + type: 'string| number', + defaultValue: 'auto', + desc: { + 'zh-CN': '

宽度,该属性的默认值为auto,最小宽度 150px

', + 'en-US': 'display different button', + }, + demoId: 'base', + }, + { + name: 'placement', + type: 'String', + defaultValue: 'bottom', + desc: { + 'zh-CN': '

出现位置;该属性的可选值为 top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end

', + 'en-US': 'display different button', + }, + demoId: 'base', + }, + { + name: 'disabled', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

Popover 是否可用

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'modelValue / v-model', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

状态是否可见

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'offset', + type: 'Number', + defaultValue: '0', + desc: { + 'zh-CN': '

出现位置的偏移量

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'arrow-offset', + type: 'Number', + defaultValue: '0', + desc: { + 'zh-CN': '

箭头的位置偏移

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'transform-origin', + type: 'Boolean | String', + defaultValue: 'true', + desc: { + 'zh-CN': '

组件的旋转中心点

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'append-to-body', + type: 'Boolean', + defaultValue: 'true', + desc: { + 'zh-CN': '

是否添加到body上

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'transition', + type: 'String', + defaultValue: 'fade-in-linear', + desc: { + 'zh-CN': '

定义渐变动画

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'visible-arrow', + type: 'Boolean', + defaultValue: 'true', + desc: { + 'zh-CN': '

是否显示 Tooltip 箭头

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'popper-options', + type: 'Object', + defaultValue: '{ boundariesElement: "body", gpuAcceleration: false }', + desc: { + 'zh-CN': '

popper.js 的参数;该属性的可选值为 参考popper.js文档

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'popper-class', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

为 popper 添加类名

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'open-delay', + type: 'Number', + defaultValue: '0', + desc: { + 'zh-CN': '

触发方式为 hover 时的显示延迟,单位为毫秒

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'close-delay', + type: 'Number', + defaultValue: '200', + desc: { + 'zh-CN': '

触发方式为 hover 时的隐藏延迟,单位为毫秒

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'maxHeight', + type: 'Number | String', + defaultValue: '', + desc: { + 'zh-CN': '

最大高度

', + 'en-US': 'display different button', + }, + demoId: 'base', + }, + { + name: 'listData', + type: 'Array | Object', + defaultValue: '', + desc: { + 'zh-CN': '

内容对象列表,对象字段包含:icon图片地址、label标题、subLabel子标题

', + 'en-US': 'display different button', + }, + demoId: 'base', + }, + ], + events: [ + { + name: 'show', + type: 'Function()', + defaultValue: '', + desc: { + 'zh-CN': '

显示时触发

', + 'en-US': 'display different button', + }, + demoId: 'base', + }, + { + name: 'hide', + type: 'Function()', + defaultValue: '', + desc: { + 'zh-CN': '

隐藏时触发

', + 'en-US': 'display different button', + }, + demoId: 'base', + }, + { + name: 'after-enter', + type: 'Function()', + defaultValue: '', + desc: { + 'zh-CN': '

显示动画播放完毕后触发

', + 'en-US': 'display different button', + }, + demoId: 'base', + }, + { + name: 'after-leave', + type: 'Function()', + defaultValue: '', + desc: { + 'zh-CN': '

隐藏动画播放完毕后触发

', + 'en-US': 'display different button', + }, + demoId: 'base', + }, + ], + slots: [ + { + name: 'default', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

Popover 内嵌 HTML 文本

', + 'en-US': 'display different button', + }, + demoId: 'base', + }, + { + name: 'reference', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

触发 Popover 显示的 HTML 元素

', + 'en-US': 'display different button', + }, + demoId: 'base', + }, + ] + } + ] +} diff --git a/examples/docs/resources/mobile/app/progress/custom-color.vue b/examples/docs/resources/mobile/app/progress/custom-color.vue new file mode 100644 index 000000000..14950bae5 --- /dev/null +++ b/examples/docs/resources/mobile/app/progress/custom-color.vue @@ -0,0 +1,43 @@ + + + diff --git a/examples/docs/resources/mobile/app/progress/dynamic-control-changes.vue b/examples/docs/resources/mobile/app/progress/dynamic-control-changes.vue new file mode 100644 index 000000000..e4d432ef0 --- /dev/null +++ b/examples/docs/resources/mobile/app/progress/dynamic-control-changes.vue @@ -0,0 +1,44 @@ + + + diff --git a/example/src/demo/mobile/progress/dynamic-progress.vue b/examples/docs/resources/mobile/app/progress/dynamic-progress.vue similarity index 94% rename from example/src/demo/mobile/progress/dynamic-progress.vue rename to examples/docs/resources/mobile/app/progress/dynamic-progress.vue index 58a72372c..b9c72a8a2 100644 --- a/example/src/demo/mobile/progress/dynamic-progress.vue +++ b/examples/docs/resources/mobile/app/progress/dynamic-progress.vue @@ -11,9 +11,9 @@ - + + diff --git a/examples/docs/resources/mobile/app/progress/format.vue b/examples/docs/resources/mobile/app/progress/format.vue new file mode 100644 index 000000000..906a116dd --- /dev/null +++ b/examples/docs/resources/mobile/app/progress/format.vue @@ -0,0 +1,59 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/progress/progress-status.vue b/examples/docs/resources/mobile/app/progress/progress-status.vue new file mode 100644 index 000000000..cc7e9e6ea --- /dev/null +++ b/examples/docs/resources/mobile/app/progress/progress-status.vue @@ -0,0 +1,23 @@ + + + diff --git a/examples/docs/resources/mobile/app/progress/progress-type-circle.vue b/examples/docs/resources/mobile/app/progress/progress-type-circle.vue new file mode 100644 index 000000000..b49c3e22f --- /dev/null +++ b/examples/docs/resources/mobile/app/progress/progress-type-circle.vue @@ -0,0 +1,19 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/progress/progress-type-dashboard.vue b/examples/docs/resources/mobile/app/progress/progress-type-dashboard.vue new file mode 100644 index 000000000..4607ad85c --- /dev/null +++ b/examples/docs/resources/mobile/app/progress/progress-type-dashboard.vue @@ -0,0 +1,37 @@ + + + diff --git a/examples/docs/resources/mobile/app/progress/progress-type.vue b/examples/docs/resources/mobile/app/progress/progress-type.vue new file mode 100644 index 000000000..cf6f8d14e --- /dev/null +++ b/examples/docs/resources/mobile/app/progress/progress-type.vue @@ -0,0 +1,19 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/progress/progress-width.vue b/examples/docs/resources/mobile/app/progress/progress-width.vue new file mode 100644 index 000000000..98056733c --- /dev/null +++ b/examples/docs/resources/mobile/app/progress/progress-width.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/docs/resources/mobile/app/progress/text-inside-or-no-text.vue b/examples/docs/resources/mobile/app/progress/text-inside-or-no-text.vue new file mode 100644 index 000000000..4d5054c15 --- /dev/null +++ b/examples/docs/resources/mobile/app/progress/text-inside-or-no-text.vue @@ -0,0 +1,26 @@ + + + diff --git a/examples/docs/resources/mobile/app/progress/webdoc/progress.cn.md b/examples/docs/resources/mobile/app/progress/webdoc/progress.cn.md new file mode 100644 index 000000000..e8c870f63 --- /dev/null +++ b/examples/docs/resources/mobile/app/progress/webdoc/progress.cn.md @@ -0,0 +1,13 @@ +--- +title: Progress 进度条 +--- + +# Progress 进度条 + +
+ +Progress 用于展示操作进度,告知用户当前状态和预期。 + + + +
\ No newline at end of file diff --git a/examples/docs/resources/mobile/app/progress/webdoc/progress.en.md b/examples/docs/resources/mobile/app/progress/webdoc/progress.en.md new file mode 100644 index 000000000..604187e87 --- /dev/null +++ b/examples/docs/resources/mobile/app/progress/webdoc/progress.en.md @@ -0,0 +1,9 @@ +--- +title: Progress +--- + +# Progress + +
+Progress +
\ No newline at end of file diff --git a/examples/docs/resources/mobile/app/progress/webdoc/progress.js b/examples/docs/resources/mobile/app/progress/webdoc/progress.js new file mode 100644 index 000000000..68c36189d --- /dev/null +++ b/examples/docs/resources/mobile/app/progress/webdoc/progress.js @@ -0,0 +1,248 @@ +export default { + column: '2', + owner: '', + demos: [ + { + demoId: 'progress-type', + name: { + 'zh-CN': '类型', + 'en-US': 'left right arrow', + }, + desc: { + 'zh-CN': '

line类型

', + 'en-US': '

button type

', + }, + codeFiles: ['progress-type.vue'], + }, + { + demoId: 'progress-type-circle', + name: { + 'zh-CN': '类型', + 'en-US': 'left right text', + }, + desc: { + 'zh-CN': '

circle类型

', + 'en-US': '

button round

', + }, + codeFiles: ['progress-type-circle.vue'], + }, + { + demoId: 'progress-type-dashboard', + name: { + 'zh-CN': '类型', + 'en-US': 'progress-type-dashboard', + }, + desc: { + 'zh-CN': '

dashboard类型

', + 'en-US': '

button click

', + }, + codeFiles: ['progress-type-dashboard.vue'], + }, + { + demoId: 'progress-width', + name: { + 'zh-CN': '宽度', + 'en-US': 'progress-width', + }, + desc: { + 'zh-CN': '

stroke-width进度条的宽度,单位 px

', + 'en-US': '

button click

', + }, + codeFiles: ['progress-width.vue'], + }, + { + demoId: 'progress-status', + name: { + 'zh-CN': '状态', + 'en-US': 'progress-status', + }, + desc: { + 'zh-CN': '

status进度条当前状态(success/exception/warning)

', + 'en-US': '

button click

', + }, + codeFiles: ['progress-status.vue'], + }, + { + demoId: 'text-inside-or-no-text', + name: { + 'zh-CN': '文字内显或不显', + 'en-US': 'text-inside-or-no-text', + }, + desc: { + 'zh-CN': '

show-text是否显示进度条文字内容

', + 'en-US': '

button click

', + }, + codeFiles: ['text-inside-or-no-text.vue'], + }, + { + demoId: 'custom-color', + name: { + 'zh-CN': '自定义颜色', + 'en-US': 'custom-color', + }, + desc: { + 'zh-CN': '

通过color设置进度条颜色。color进度条背景色(会覆盖status状态颜色)

', + 'en-US': '

button click

', + }, + codeFiles: ['custom-color.vue'], + }, + { + demoId: 'format-text', + name: { + 'zh-CN': '自定义显示文字', + 'en-US': 'format-text', + }, + desc: { + 'zh-CN': '

text-inside进度条显示文字内置在进度条内(只在 type=line 时可用)

', + 'en-US': '

button click

', + }, + codeFiles: ['format-text.vue'], + }, + { + demoId: 'format', + name: { + 'zh-CN': '自定义显示内容', + 'en-US': 'format', + }, + desc: { + 'zh-CN': '

通过format属性设置显示文字内置在进度条内时,用于自定义显示内容。

', + 'en-US': '

button click

', + }, + codeFiles: ['format.vue'], + }, + { + demoId: 'dynamic-control-changes', + name: { + 'zh-CN': '动态进度条', + 'en-US': 'dynamic-control-changes', + }, + desc: { + 'zh-CN': '

通过动态改变percentage的值,使进度条动态变化

', + 'en-US': '

button click

', + }, + codeFiles: ['dynamic-control-changes.vue'], + }, + { + demoId: 'dynamic-progress', + name: { + 'zh-CN': '动态控制进度条变化', + 'en-US': 'dynamic-progress', + }, + desc: { + 'zh-CN': '

通过设置percentage动态控制进度条变化

', + 'en-US': '

button click

', + }, + codeFiles: ['dynamic-progress.vue'], + }, + { + demoId: 'width', + name: { + 'zh-CN': '环形进度条画布宽度', + 'en-US': 'width', + }, + desc: { + 'zh-CN': '

通过设置width属性设置环形进度条画布宽度(只在type 为 circle 或 dashboard 时可用)。

', + 'en-US': '

button click

', + }, + codeFiles: ['width.vue'], + }, + ], + apis: [ + { + name: 'progress', // 组件名称展示使用 + type: 'component', // API 类型 + properties: [ + { + name: 'color', + type: 'String | Function | Array', + defaultValue: '', + desc: { + 'zh-CN': '

进度条背景色(会覆盖 status 状态颜色)

', + 'en-US': 'Is fixed top', + }, + demoId: 'custom-color', + }, + { + name: ' format', + type: 'Function', + defaultValue: '', + desc: { + 'zh-CN': '

显示文字内置在进度条内时,用于自定义显示内容

', + 'en-US': 'Is show left arrow', + }, + demoId: 'format', + }, + { + name: 'percentage', + type: 'Number', + defaultValue: '0', + desc: { + 'zh-CN': '

百分比(必填)

', + 'en-US': 'Is show right arrow', + }, + demoId: 'dynamic-progress', + }, + { + name: 'show-text', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否显示进度条文字内容

', + 'en-US': 'Is show right text', + }, + demoId: 'text-inside-or-no-text', + }, + { + name: 'status', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

进度条当前状态

', + 'en-US': 'Is show left text', + }, + demoId: 'progress-status', + }, + { + name: 'stroke-width', + type: 'Number', + defaultValue: '', + desc: { + 'zh-CN': '

进度条的宽度,单位 px

', + 'en-US': 'set sub-title', + }, + demoId: 'progress-width', + }, + { + name: 'text-inside', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

进度条显示文字内置在进度条内(只在 type=line 时可用)

', + 'en-US': 'set main-title', + }, + demoId: 'format-text', + }, + { + name: 'type', + type: 'String', + defaultValue: 'line |circle |dashboard', + desc: { + 'zh-CN': '

进度条类型

', + 'en-US': 'progress-type', + }, + demoId: 'progress-type', + }, + { + name: 'width', + type: 'Number', + defaultValue: '', + desc: { + 'zh-CN': '

环形进度条画布宽度(只在 type 为 circle 或 dashboard 时可用)

', + 'en-US': 'width', + }, + demoId: 'width', + }, + ], + }, + ], +} diff --git a/examples/docs/resources/mobile/app/progress/width.vue b/examples/docs/resources/mobile/app/progress/width.vue new file mode 100644 index 000000000..42bf1aa5e --- /dev/null +++ b/examples/docs/resources/mobile/app/progress/width.vue @@ -0,0 +1,22 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/pull-refresh/animation-duration.vue b/examples/docs/resources/mobile/app/pull-refresh/animation-duration.vue new file mode 100644 index 000000000..dfb5e7e75 --- /dev/null +++ b/examples/docs/resources/mobile/app/pull-refresh/animation-duration.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/mobile/app/pull-refresh/base.vue b/examples/docs/resources/mobile/app/pull-refresh/base.vue new file mode 100644 index 000000000..5b6608dff --- /dev/null +++ b/examples/docs/resources/mobile/app/pull-refresh/base.vue @@ -0,0 +1,54 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/pull-refresh/disabled.vue b/examples/docs/resources/mobile/app/pull-refresh/disabled.vue new file mode 100644 index 000000000..e0b4eea80 --- /dev/null +++ b/examples/docs/resources/mobile/app/pull-refresh/disabled.vue @@ -0,0 +1,50 @@ + + + + + diff --git a/example/src/demo/mobile/pull-refresh/enhance.vue b/examples/docs/resources/mobile/app/pull-refresh/enhance.vue similarity index 100% rename from example/src/demo/mobile/pull-refresh/enhance.vue rename to examples/docs/resources/mobile/app/pull-refresh/enhance.vue diff --git a/example/src/demo/mobile/pull-refresh/hasmore.vue b/examples/docs/resources/mobile/app/pull-refresh/hasmore.vue similarity index 100% rename from example/src/demo/mobile/pull-refresh/hasmore.vue rename to examples/docs/resources/mobile/app/pull-refresh/hasmore.vue diff --git a/examples/docs/resources/mobile/app/pull-refresh/head-height.vue b/examples/docs/resources/mobile/app/pull-refresh/head-height.vue new file mode 100644 index 000000000..7c0ca4b1e --- /dev/null +++ b/examples/docs/resources/mobile/app/pull-refresh/head-height.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/mobile/app/pull-refresh/loosing-text.vue b/examples/docs/resources/mobile/app/pull-refresh/loosing-text.vue new file mode 100644 index 000000000..e7452feb2 --- /dev/null +++ b/examples/docs/resources/mobile/app/pull-refresh/loosing-text.vue @@ -0,0 +1,31 @@ + + + diff --git a/example/src/demo/mobile/pull-refresh/pull-refresh-slot.vue b/examples/docs/resources/mobile/app/pull-refresh/pull-refresh-slot.vue similarity index 96% rename from example/src/demo/mobile/pull-refresh/pull-refresh-slot.vue rename to examples/docs/resources/mobile/app/pull-refresh/pull-refresh-slot.vue index 94250c21b..89a16bf51 100644 --- a/example/src/demo/mobile/pull-refresh/pull-refresh-slot.vue +++ b/examples/docs/resources/mobile/app/pull-refresh/pull-refresh-slot.vue @@ -7,7 +7,7 @@ - diff --git a/example/src/demo/mobile/pull-refresh/result-text.vue b/examples/docs/resources/mobile/app/pull-refresh/result-text.vue similarity index 100% rename from example/src/demo/mobile/pull-refresh/result-text.vue rename to examples/docs/resources/mobile/app/pull-refresh/result-text.vue diff --git a/examples/docs/resources/mobile/app/pull-refresh/success-duration.vue b/examples/docs/resources/mobile/app/pull-refresh/success-duration.vue new file mode 100644 index 000000000..5105a316c --- /dev/null +++ b/examples/docs/resources/mobile/app/pull-refresh/success-duration.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/mobile/app/pull-refresh/success-text.vue b/examples/docs/resources/mobile/app/pull-refresh/success-text.vue new file mode 100644 index 000000000..0a685ce98 --- /dev/null +++ b/examples/docs/resources/mobile/app/pull-refresh/success-text.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/docs/resources/mobile/app/pull-refresh/webdoc/pull-refresh.cn.md b/examples/docs/resources/mobile/app/pull-refresh/webdoc/pull-refresh.cn.md new file mode 100644 index 000000000..da14c7be6 --- /dev/null +++ b/examples/docs/resources/mobile/app/pull-refresh/webdoc/pull-refresh.cn.md @@ -0,0 +1,11 @@ +--- +title: pull-refresh 下拉刷新 +--- + +# pull-refresh 下拉刷新 + +
+ +pull-refresh 下拉刷新 + +
diff --git a/examples/docs/resources/mobile/app/pull-refresh/webdoc/pull-refresh.en.md b/examples/docs/resources/mobile/app/pull-refresh/webdoc/pull-refresh.en.md new file mode 100644 index 000000000..dea4cc005 --- /dev/null +++ b/examples/docs/resources/mobile/app/pull-refresh/webdoc/pull-refresh.en.md @@ -0,0 +1,7 @@ +--- +title: pull-refresh 下拉刷新 +--- + +# pull-refresh 下拉刷新 + +
pull-refresh
diff --git a/examples/docs/resources/mobile/app/pull-refresh/webdoc/pull-refresh.js b/examples/docs/resources/mobile/app/pull-refresh/webdoc/pull-refresh.js new file mode 100644 index 000000000..3e650736f --- /dev/null +++ b/examples/docs/resources/mobile/app/pull-refresh/webdoc/pull-refresh.js @@ -0,0 +1,280 @@ +export default { + column: '2', + owner: '', + demos: [ + { + demoId: 'base', + name: { + 'zh-CN': '基础用法', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': '

基础用法

', + 'en-US': '

button type

', + }, + codeFiles: ['base.vue'], + }, + { + demoId: 'animation-duration', + name: { + 'zh-CN': '弹回动画所用的时间', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': '

下拉可刷新的弹回动画时间

', + 'en-US': '

button type

', + }, + codeFiles: ['animation-duration.vue'], + }, + { + demoId: 'disabled', + name: { + 'zh-CN': '禁用下拉刷新', + 'en-US': 'button round', + }, + desc: { + 'zh-CN': '

禁用下拉刷新

', + 'en-US': '

button round

', + }, + codeFiles: ['disabled.vue'], + }, + { + demoId: 'enhance', + name: { + 'zh-CN': '支持上拉、下拉刷新', + 'en-US': 'button round', + }, + desc: { + 'zh-CN': '

支持上拉、下拉刷新

', + 'en-US': '

button round

', + }, + codeFiles: ['enhance.vue'], + }, + { + demoId: 'head-height', + name: { + 'zh-CN': '提示信息的高度', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

下拉后,提示信息的高度

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['head-height.vue'], + }, + { + demoId: 'loosing-text', + name: { + 'zh-CN': '超过head的高度后的提示', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

下拉超过head的高度后的提示

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['loosing-text.vue'], + }, + { + demoId: 'pull-refresh-slot', + name: { + 'zh-CN': '插槽', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

下拉刷新loading的插槽

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['pull-refresh-slot.vue'], + }, + { + demoId: 'pulling-text', + name: { + 'zh-CN': '下拉提示文字', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

开始下拉并还没到head的高度时的提示文字

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['pulling-text.vue'], + }, + { + demoId: 'result-text', + name: { + 'zh-CN': '刷新完成时的提示文字', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

刷新完成时的提示文字

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['result-text.vue'], + }, + { + demoId: 'success-duration', + name: { + 'zh-CN': '刷新成功的文字展示时长', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

刷新完成时,提示的显示时长

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['success-duration.vue'], + }, + { + demoId: 'success-text', + name: { + 'zh-CN': '刷新成功的文字', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

刷新成功时的提示文字

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['success-text.vue'], + }, + ], + apis: [ + { + name: 'pull-refresh ', // 组件名称展示使用 + type: 'component', // API 类型 + properties: [ + { + name: 'disabled', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

禁止下拉刷新,默认:false

', + 'en-US': 'display different button', + }, + demoId: 'disabled', + }, + { + name: 'head-height', + type: 'Number', + defaultValue: '50', + desc: { + 'zh-CN': '

loading提示的高度,默认:50

', + 'en-US': 'display different button', + }, + demoId: 'head-height-wrap', + }, + { + name: 'loosing-text', + type: 'String', + defaultValue: '释放即可刷新', + desc: { + 'zh-CN': '

下拉高度大于等于head-height时的提示文字,默认为:释放即可刷新

', + 'en-US': 'display different button', + }, + demoId: 'loosing-text', + }, + { + name: 'pulling-text', + type: 'String', + defaultValue: '下拉即可刷新', + desc: { + 'zh-CN': '

下拉高度小于head-height时的提示文字,默认为:下拉即可刷新

', + 'en-US': 'display different button', + }, + demoId: 'pulling-text', + }, + { + name: 'success-duration', + type: 'Number', + defaultValue: '500', + desc: { + 'zh-CN': '

刷新完成的提示文字的显示时长,需要与success-text配合使用,默认:500

', + 'en-US': 'display different button', + }, + demoId: 'success-duration', + }, + { + name: 'success-text', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

下拉刷新完成的提示文字

', + 'en-US': 'display different button', + }, + demoId: 'result-text', + }, + { + name: 'failed-text', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

下拉刷新失败的提示文字

', + 'en-US': 'display different button', + }, + demoId: 'success-text', + }, + { + name: 'value', + type: 'Boolean', + defaultValue: 'true', + desc: { + 'zh-CN': '

下拉过程中会被置为true,当设置为false时,关闭loading

', + 'en-US': 'display different button', + }, + demoId: 'success-text', + }, + { + name: 'pullDown', + type: {}, + defaultValue: '', + desc: { + 'zh-CN': '

下拉刷新

', + 'en-US': 'display different button', + }, + demoId: 'base', + }, + { + name: 'pullUp', + type: '{}', + defaultValue: '', + desc: { + 'zh-CN': '

上拉加载

', + 'en-US': 'display different button', + }, + demoId: 'enhance', + }, + ], + events: [ + { + name: 'refresh', + type: 'Function()', + defaultValue: '', + desc: { + 'zh-CN': '

下拉时触发的事件

', + 'en-US': 'Click', + }, + demoId: 'pulling-text', + }, + ], + slot: [ + { + name: 'default', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

组件默认插槽

', + 'en-US': 'Click', + }, + demoId: '', + }, + { + name: 'loading', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

下拉加载中的插槽

', + 'en-US': 'Click', + }, + demoId: 'pull-refresh-slot', + }, + ], + }, + ], +} diff --git a/examples/docs/resources/mobile/app/radio/base.vue b/examples/docs/resources/mobile/app/radio/base.vue new file mode 100644 index 000000000..e842cc5dc --- /dev/null +++ b/examples/docs/resources/mobile/app/radio/base.vue @@ -0,0 +1,119 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/radio/border.vue b/examples/docs/resources/mobile/app/radio/border.vue new file mode 100644 index 000000000..90e963eb1 --- /dev/null +++ b/examples/docs/resources/mobile/app/radio/border.vue @@ -0,0 +1,27 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/radio/disabled.vue b/examples/docs/resources/mobile/app/radio/disabled.vue new file mode 100644 index 000000000..63bc186de --- /dev/null +++ b/examples/docs/resources/mobile/app/radio/disabled.vue @@ -0,0 +1,27 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/radio/event-change.vue b/examples/docs/resources/mobile/app/radio/event-change.vue new file mode 100644 index 000000000..ae1dd334f --- /dev/null +++ b/examples/docs/resources/mobile/app/radio/event-change.vue @@ -0,0 +1,32 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/radio/webdoc/radio.cn.md b/examples/docs/resources/mobile/app/radio/webdoc/radio.cn.md new file mode 100644 index 000000000..d9e8cf9ed --- /dev/null +++ b/examples/docs/resources/mobile/app/radio/webdoc/radio.cn.md @@ -0,0 +1,12 @@ +--- +title: Radio 单选 +--- + +# Radio 单选 + +
+ +用于配置不同场景的选项,在一组备选项中进行单选。 + +
+ diff --git a/examples/docs/resources/mobile/app/radio/webdoc/radio.en.md b/examples/docs/resources/mobile/app/radio/webdoc/radio.en.md new file mode 100644 index 000000000..79bbd8c8b --- /dev/null +++ b/examples/docs/resources/mobile/app/radio/webdoc/radio.en.md @@ -0,0 +1,7 @@ +--- +title: Radio +--- + +# Radio 单选 + +
Radio
diff --git a/examples/docs/resources/mobile/app/radio/webdoc/radio.js b/examples/docs/resources/mobile/app/radio/webdoc/radio.js new file mode 100644 index 000000000..e9a4be435 --- /dev/null +++ b/examples/docs/resources/mobile/app/radio/webdoc/radio.js @@ -0,0 +1,146 @@ +export default { + column: '2', + owner: '', + demos: [ + { + demoId: 'base', + name: { + 'zh-CN': '基础展示', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': '

基础展示

', + 'en-US': '

button type

', + }, + codeFiles: ['base.vue'], + }, + { + demoId: 'border', + name: { + 'zh-CN': '显示边框', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': '

显示边框

', + 'en-US': '

button type

', + }, + codeFiles: ['border.vue'], + }, + { + demoId: 'disabled', + name: { + 'zh-CN': '是否禁用', + 'en-US': 'button round', + }, + desc: { + 'zh-CN': '

是否禁用

', + 'en-US': '

button round

', + }, + codeFiles: ['disabled.vue'], + }, + { + demoId: 'event-change', + name: { + 'zh-CN': '值改变事件', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

值改变事件

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['event-change.vue'], + }, + ], + apis: [ + { + name: 'Radio', // 组件名称展示使用 + type: 'component', // API 类型 + properties: [ + { + name: 'disabled', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否禁用

', + 'en-US': 'display different button', + }, + demoId: 'disabled', + }, + { + name: 'border', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否显示边框

', + 'en-US': 'display different button', + }, + demoId: 'border', + }, + { + name: 'label', + type: 'Object | String', + defaultValue: '', + desc: { + 'zh-CN': '

Radio 的 value,该属性默认为{}

', + 'en-US': 'display different button', + }, + demoId: 'event-change', + }, + { + name: 'name', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

原生 name 属性

', + 'en-US': 'display different button', + }, + demoId: 'disabled', + }, + { + name: 'text', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

文本

', + 'en-US': 'display different button', + }, + demoId: 'disabled', + }, + { + name: 'value', + type: 'Object | String', + defaultValue: '{}', + desc: { + 'zh-CN': '

绑定值,该属性默认为{}

', + 'en-US': 'display different button', + }, + demoId: 'border', + }, + ], + events: [ + { + name: 'change', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

绑定值变化时触发的事件,可获取changeValue

', + 'en-US': 'Click', + }, + demoId: 'event-change', + }, + ], + slots: [ + { + name: 'default', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

Radio的内容

', + 'en-US': 'Click', + }, + demoId: '', + }, + ], + }, + ], +} diff --git a/example/src/demo/mobile/search/base.vue b/examples/docs/resources/mobile/app/search/base.vue similarity index 100% rename from example/src/demo/mobile/search/base.vue rename to examples/docs/resources/mobile/app/search/base.vue diff --git a/example/src/demo/mobile/search/button-text.vue b/examples/docs/resources/mobile/app/search/button-text.vue similarity index 91% rename from example/src/demo/mobile/search/button-text.vue rename to examples/docs/resources/mobile/app/search/button-text.vue index ccb8ebf05..bd4f14619 100644 --- a/example/src/demo/mobile/search/button-text.vue +++ b/examples/docs/resources/mobile/app/search/button-text.vue @@ -2,7 +2,7 @@ - + + diff --git a/examples/docs/resources/mobile/app/search/default-value.vue b/examples/docs/resources/mobile/app/search/default-value.vue new file mode 100644 index 000000000..a4ee7db0f --- /dev/null +++ b/examples/docs/resources/mobile/app/search/default-value.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/mobile/app/search/events.vue b/examples/docs/resources/mobile/app/search/events.vue new file mode 100644 index 000000000..9d0f49c71 --- /dev/null +++ b/examples/docs/resources/mobile/app/search/events.vue @@ -0,0 +1,38 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/search/webdoc/search.cn.md b/examples/docs/resources/mobile/app/search/webdoc/search.cn.md new file mode 100644 index 000000000..faf8cf5f9 --- /dev/null +++ b/examples/docs/resources/mobile/app/search/webdoc/search.cn.md @@ -0,0 +1,12 @@ +--- +title: Search 搜索框 +--- + +# Search 搜索框 + +
+ +指定条件对象进行搜索数据。用于配置不同场景的选项,在一组备选项中进行单选。 + +
+ diff --git a/examples/docs/resources/mobile/app/search/webdoc/search.en.md b/examples/docs/resources/mobile/app/search/webdoc/search.en.md new file mode 100644 index 000000000..9fda98509 --- /dev/null +++ b/examples/docs/resources/mobile/app/search/webdoc/search.en.md @@ -0,0 +1,7 @@ +--- +title: Search +--- + +# Search 搜索 + +
Search
diff --git a/examples/docs/resources/mobile/app/search/webdoc/search.js b/examples/docs/resources/mobile/app/search/webdoc/search.js new file mode 100644 index 000000000..8c2c5dc86 --- /dev/null +++ b/examples/docs/resources/mobile/app/search/webdoc/search.js @@ -0,0 +1,178 @@ +export default { + column: '2', + owner: '', + demos: [ + { + demoId: 'base', + name: { + 'zh-CN': '基础用法', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': '

基础用法

', + 'en-US': '

button type

', + }, + codeFiles: ['base.vue'], + }, + { + demoId: 'button-text', + name: { + 'zh-CN': '自定义搜索按钮文本', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': '

自定义搜索按钮文本

', + 'en-US': '

button type

', + }, + codeFiles: ['button-text.vue'], + }, + { + demoId: 'clear', + name: { + 'zh-CN': '清除事件', + 'en-US': 'button round', + }, + desc: { + 'zh-CN': '

清除事件

', + 'en-US': '

button round

', + }, + codeFiles: ['clear.vue'], + }, + { + demoId: 'default-value', + name: { + 'zh-CN': '默认搜索', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

默认搜索

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['default-value.vue'], + }, + { + demoId: 'events', + name: { + 'zh-CN': '事件', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

事件

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['events.vue'], + }, + ], + apis: [ + { + name: 'Search', // 组件名称展示使用 + type: 'component', // API 类型 + properties: [ + { + name: 'button-text', + type: 'String', + defaultValue: '搜索', + desc: { + 'zh-CN': '

自定义搜索框按钮的文本内容,默认是‘搜索’

', + 'en-US': 'display different button', + }, + demoId: 'button-text', + }, + { + name: 'themeType', + type: 'String', + defaultValue: 'primary', + desc: { + 'zh-CN': '

配置主题色,primary:蓝 gray:灰

', + 'en-US': 'display different button', + }, + demoId: 'base', + }, + { + name: 'placeholder', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

设置搜索输入框内的提示占位文本

', + 'en-US': 'display different button', + }, + demoId: 'button-text', + }, + { + name: 'v-model/value', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

设置搜索输入框内的默认搜索值

', + 'en-US': 'display different button', + }, + demoId: 'default-value', + }, + { + name: 'search-types', + type: 'Array', + defaultValue: '', + desc: { + 'zh-CN': '', + 'en-US': 'display different button', + }, + demoId: 'default-value', + }, + ], + events: [ + { + name: 'change', + type: 'Function(arg1,arg2)', + defaultValue: '', + desc: { + 'zh-CN': '

在 input 框中输入完成时触发的回调函数;arg1:{Object 搜索类型},arg2:{String 当前input框中值}

', + 'en-US': 'Click', + }, + demoId: 'events', + }, + { + name: 'clear', + type: 'Function(arg1,arg2)', + defaultValue: '', + desc: { + 'zh-CN': '

在点击清除按钮时触发的回调函数

', + 'en-US': 'Click', + }, + demoId: 'clear', + }, + { + name: 'select', + type: 'Function(arg1)', + defaultValue: '', + desc: { + 'zh-CN': '

在search组件切换类型时触发的回调函数;arg1:{Object 搜索类型}

', + 'en-US': 'Click', + }, + demoId: 'clear', + }, + { + name: 'search', + type: 'Function(arg1)', + defaultValue: '', + desc: { + 'zh-CN': '

在展开状态点击搜索按钮时触发的回调函数;arg1:{Object 搜索类型},arg2:{String 当前input框中值}

', + 'en-US': 'Click', + }, + demoId: 'events', + }, + ], + slots: [ + { + name: 'default', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

自定义搜索框右侧内容

', + 'en-US': 'Click', + }, + demoId: '', + }, + ] + }, + ], +} diff --git a/examples/docs/resources/mobile/app/slider/about-step.vue b/examples/docs/resources/mobile/app/slider/about-step.vue new file mode 100644 index 000000000..218d56c1a --- /dev/null +++ b/examples/docs/resources/mobile/app/slider/about-step.vue @@ -0,0 +1,46 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/slider/dynamic-disable.vue b/examples/docs/resources/mobile/app/slider/dynamic-disable.vue new file mode 100644 index 000000000..ee46d015e --- /dev/null +++ b/examples/docs/resources/mobile/app/slider/dynamic-disable.vue @@ -0,0 +1,46 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/slider/format-tooltip.vue b/examples/docs/resources/mobile/app/slider/format-tooltip.vue new file mode 100644 index 000000000..e7f142219 --- /dev/null +++ b/examples/docs/resources/mobile/app/slider/format-tooltip.vue @@ -0,0 +1,51 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/slider/max-min.vue b/examples/docs/resources/mobile/app/slider/max-min.vue new file mode 100644 index 000000000..0f1de6e3a --- /dev/null +++ b/examples/docs/resources/mobile/app/slider/max-min.vue @@ -0,0 +1,46 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/slider/range-select.vue b/examples/docs/resources/mobile/app/slider/range-select.vue new file mode 100644 index 000000000..192591d81 --- /dev/null +++ b/examples/docs/resources/mobile/app/slider/range-select.vue @@ -0,0 +1,46 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/slider/shortcut-operation.vue b/examples/docs/resources/mobile/app/slider/shortcut-operation.vue new file mode 100644 index 000000000..c4ee2166d --- /dev/null +++ b/examples/docs/resources/mobile/app/slider/shortcut-operation.vue @@ -0,0 +1,46 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/slider/show-input.vue b/examples/docs/resources/mobile/app/slider/show-input.vue new file mode 100644 index 000000000..08e0b9595 --- /dev/null +++ b/examples/docs/resources/mobile/app/slider/show-input.vue @@ -0,0 +1,46 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/slider/show-tip.vue b/examples/docs/resources/mobile/app/slider/show-tip.vue new file mode 100644 index 000000000..e8825d6ae --- /dev/null +++ b/examples/docs/resources/mobile/app/slider/show-tip.vue @@ -0,0 +1,46 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/slider/slider-event-change.vue b/examples/docs/resources/mobile/app/slider/slider-event-change.vue new file mode 100644 index 000000000..5e2fc5c31 --- /dev/null +++ b/examples/docs/resources/mobile/app/slider/slider-event-change.vue @@ -0,0 +1,51 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/slider/slider-event-start.vue b/examples/docs/resources/mobile/app/slider/slider-event-start.vue new file mode 100644 index 000000000..c3acecf78 --- /dev/null +++ b/examples/docs/resources/mobile/app/slider/slider-event-start.vue @@ -0,0 +1,51 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/slider/slider-event-stop.vue b/examples/docs/resources/mobile/app/slider/slider-event-stop.vue new file mode 100644 index 000000000..34063183a --- /dev/null +++ b/examples/docs/resources/mobile/app/slider/slider-event-stop.vue @@ -0,0 +1,51 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/slider/slider-slot.vue b/examples/docs/resources/mobile/app/slider/slider-slot.vue new file mode 100644 index 000000000..dfc6f5687 --- /dev/null +++ b/examples/docs/resources/mobile/app/slider/slider-slot.vue @@ -0,0 +1,50 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/slider/vertical-mode.vue b/examples/docs/resources/mobile/app/slider/vertical-mode.vue new file mode 100644 index 000000000..a35d14bbd --- /dev/null +++ b/examples/docs/resources/mobile/app/slider/vertical-mode.vue @@ -0,0 +1,46 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/slider/webdoc/slider.cn.md b/examples/docs/resources/mobile/app/slider/webdoc/slider.cn.md new file mode 100644 index 000000000..28494ade5 --- /dev/null +++ b/examples/docs/resources/mobile/app/slider/webdoc/slider.cn.md @@ -0,0 +1,12 @@ +--- +title: Slider 滑块 +--- + +# Slider 滑块 + +
+ +通过滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。 + +
+ diff --git a/examples/docs/resources/mobile/app/slider/webdoc/slider.en.md b/examples/docs/resources/mobile/app/slider/webdoc/slider.en.md new file mode 100644 index 000000000..267212424 --- /dev/null +++ b/examples/docs/resources/mobile/app/slider/webdoc/slider.en.md @@ -0,0 +1,7 @@ +--- +title: Slider +--- + +# Slider 滑块 + +
Slider
diff --git a/examples/docs/resources/mobile/app/slider/webdoc/slider.js b/examples/docs/resources/mobile/app/slider/webdoc/slider.js new file mode 100644 index 000000000..f208b6851 --- /dev/null +++ b/examples/docs/resources/mobile/app/slider/webdoc/slider.js @@ -0,0 +1,324 @@ +export default { + column: '2', + owner: '', + demos: [ + { + demoId: 'about-step', + name: { + 'zh-CN': '步长', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': '

通过设置step来配置滑块滑动的步长

', + 'en-US': '

button type

', + }, + codeFiles: ['about-step.vue'], + }, + { + demoId: 'dynamic-disable', + name: { + 'zh-CN': '禁用', + 'en-US': 'button round', + }, + desc: { + 'zh-CN': '

通过设置属性disabled,设置滑动滑块禁止滑动

', + 'en-US': '

button round

', + }, + codeFiles: ['dynamic-disable.vue'], + }, + { + demoId: 'max-min', + name: { + 'zh-CN': '最大最小值', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

通过设置min max来设置滑块取值范围

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['max-min.vue'], + }, + { + demoId: 'range-select', + name: { + 'zh-CN': '范围选择', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

通过v-model为数组 设定初始范围选择

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['range-select.vue'], + }, + { + demoId: 'shortcut-operation', + name: { + 'zh-CN': '总步数', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

通过num-pages属性设置总步数,即按快捷键 PageDown/PageUp 时,每次移动的距离是(最大值-最小值)/分页数。

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['shortcut-operation.vue'], + }, + { + demoId: 'format-tooltip', + name: { + 'zh-CN': '总步数', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

通过format-tooltip属性设置 value。

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['format-tooltip.vue'], + }, + { + demoId: 'show-input', + name: { + 'zh-CN': '输入框模式', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

通过配置show-input开启滑块输入框模式

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['show-input.vue'], + }, + { + demoId: 'show-tip', + name: { + 'zh-CN': '提示', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

通过设定show-tip="false",关闭滑块提示。(默认开启)

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['show-tip.vue'], + }, + { + demoId: 'slider-event-change', + name: { + 'zh-CN': '事件', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

change事件

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['slider-event-change.vue'], + }, + { + demoId: 'slider-event-start', + name: { + 'zh-CN': '事件', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

start滑块开始滑动事件

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['slider-event-start.vue'], + }, + { + demoId: 'slider-event-stop', + name: { + 'zh-CN': '事件', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

stop滑块停止滑动事件

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['slider-event-stop.vue'], + }, + { + demoId: 'slider-slot', + name: { + 'zh-CN': '自定义插槽', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

自定义插槽

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['slider-slot.vue'], + }, + { + demoId: 'vertical-mode', + name: { + 'zh-CN': '竖向模式', + 'en-US': 'events', + }, + desc: { + 'zh-CN': '

通过设置vertical属性来展示滑块竖向模式(不设置,默认为横向模式)
竖向模式可以通过height设置组件高度

', + 'en-US': '

bbutton click

', + }, + codeFiles: ['vertical-mode.vue'], + }, + ], + apis: [ + { + name: 'Slider', // 组件名称展示使用 + type: 'component', // API 类型 + properties: [ + { + name: 'disabled', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否禁用

', + 'en-US': 'display different button', + }, + demoId: 'dynamic-disable', + }, + { + name: 'format-tooltip', + type: 'Function(value)', + defaultValue: '', + desc: { + 'zh-CN': '

格式化 tooltip message

', + 'en-US': 'display different button', + }, + demoId: 'format-tooltip', + }, + { + name: 'max', + type: 'Number', + defaultValue: '', + desc: { + 'zh-CN': '

设置最大值。必需是整数,可以负数。必需大于所设置的最小值。

', + 'en-US': 'display different button', + }, + demoId: 'max-min', + }, + { + name: 'min', + type: 'Number', + defaultValue: '', + desc: { + 'zh-CN': '

设置最小值。

', + 'en-US': 'display different button', + }, + demoId: 'max-min', + }, + { + name: 'num-pages', + type: 'Number', + defaultValue: '', + desc: { + 'zh-CN': '

设置总步数,即按快捷键 PageDown/PageUp 时,每次移动的距离是(最大值-最小值)/分页数

', + 'en-US': 'display different button', + }, + demoId: 'shortcut-operation', + }, + { + name: 'range', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否为范围选择

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'show-input', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否显示输入框,仅在非范围选择时有效

', + 'en-US': 'display different button', + }, + demoId: 'show-input', + }, + { + name: 'show-tip', + type: 'Boolean', + defaultValue: 'true', + desc: { + 'zh-CN': '

是否显示 tooltip

', + 'en-US': 'display different button', + }, + demoId: 'show-tip', + }, + { + name: 'step', + type: 'Number', + defaultValue: '', + desc: { + 'zh-CN': '

设置滑块移动时,每步位移距离,必需是大于0的正整数。

', + 'en-US': 'display different button', + }, + demoId: 'about-step', + }, + { + name: 'value', + type: 'Number | Array', + defaultValue: '', + desc: { + 'zh-CN': '

设置单滑块的当前值,必需是整数或数组。

', + 'en-US': 'display different button', + }, + demoId: '', + }, + { + name: 'vertical', + type: 'Boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

是否竖向模式

', + 'en-US': 'display different button', + }, + demoId: 'vertical-mode', + }, + ], + events: [ + { + name: 'change', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

值改变时触发(使用鼠标拖曳时,只在松开鼠标后触发)

', + 'en-US': 'Click', + }, + demoId: 'slider-event-change', + }, + { + name: 'start', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

设置滑块滑动开始时,触发该事件

', + 'en-US': 'Click', + }, + demoId: 'slider-event-start', + }, + { + name: 'stop', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

设置滑块滑动结束时,触发该事件

', + 'en-US': 'Click', + }, + demoId: 'slider-event-stop', + }, + ], + slots: [ + { + name: 'default', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

组件默认插槽

', + 'en-US': 'Click', + }, + demoId: '', + }, + ], + }, + ], +} diff --git a/examples/docs/resources/mobile/app/switch/disabled.vue b/examples/docs/resources/mobile/app/switch/disabled.vue new file mode 100644 index 000000000..e1c49f18b --- /dev/null +++ b/examples/docs/resources/mobile/app/switch/disabled.vue @@ -0,0 +1,67 @@ + + + + + diff --git a/example/src/demo/mobile/switch/scenario.vue b/examples/docs/resources/mobile/app/switch/scenario.vue similarity index 97% rename from example/src/demo/mobile/switch/scenario.vue rename to examples/docs/resources/mobile/app/switch/scenario.vue index 9e1ef97e4..445e7b1ba 100644 --- a/example/src/demo/mobile/switch/scenario.vue +++ b/examples/docs/resources/mobile/app/switch/scenario.vue @@ -12,7 +12,7 @@ - + + diff --git a/example/src/demo/mobile/switch/true-false-value.vue b/examples/docs/resources/mobile/app/switch/true-false-value.vue similarity index 95% rename from example/src/demo/mobile/switch/true-false-value.vue rename to examples/docs/resources/mobile/app/switch/true-false-value.vue index 636621f05..38cf19c28 100644 --- a/example/src/demo/mobile/switch/true-false-value.vue +++ b/examples/docs/resources/mobile/app/switch/true-false-value.vue @@ -5,7 +5,7 @@ - + + diff --git a/examples/docs/resources/mobile/app/tabbar/border.vue b/examples/docs/resources/mobile/app/tabbar/border.vue new file mode 100644 index 000000000..63ec61e8a --- /dev/null +++ b/examples/docs/resources/mobile/app/tabbar/border.vue @@ -0,0 +1,29 @@ + + + diff --git a/examples/docs/resources/mobile/app/tabbar/event-change.vue b/examples/docs/resources/mobile/app/tabbar/event-change.vue new file mode 100644 index 000000000..145bf765f --- /dev/null +++ b/examples/docs/resources/mobile/app/tabbar/event-change.vue @@ -0,0 +1,34 @@ + + + diff --git a/example/src/demo/mobile/tabbar/onlytext.vue b/examples/docs/resources/mobile/app/tabbar/onlytext.vue similarity index 98% rename from example/src/demo/mobile/tabbar/onlytext.vue rename to examples/docs/resources/mobile/app/tabbar/onlytext.vue index aec088bb1..5d0ffbf31 100644 --- a/example/src/demo/mobile/tabbar/onlytext.vue +++ b/examples/docs/resources/mobile/app/tabbar/onlytext.vue @@ -17,7 +17,7 @@ - diff --git a/example/src/demo/mobile/tabbar/slot-icon.vue b/examples/docs/resources/mobile/app/tabbar/slot-icon.vue similarity index 89% rename from example/src/demo/mobile/tabbar/slot-icon.vue rename to examples/docs/resources/mobile/app/tabbar/slot-icon.vue index 1ddaf1500..0998d2d26 100644 --- a/example/src/demo/mobile/tabbar/slot-icon.vue +++ b/examples/docs/resources/mobile/app/tabbar/slot-icon.vue @@ -12,7 +12,7 @@ - + + diff --git a/examples/docs/resources/mobile/app/table/webdoc/table.cn.md b/examples/docs/resources/mobile/app/table/webdoc/table.cn.md new file mode 100644 index 000000000..ec72dc2f5 --- /dev/null +++ b/examples/docs/resources/mobile/app/table/webdoc/table.cn.md @@ -0,0 +1,11 @@ +--- +title: Table 表格 +--- + +# Table 表格 + +
+ +Table 表格 + +
diff --git a/examples/docs/resources/mobile/app/table/webdoc/table.en.md b/examples/docs/resources/mobile/app/table/webdoc/table.en.md new file mode 100644 index 000000000..212451ee9 --- /dev/null +++ b/examples/docs/resources/mobile/app/table/webdoc/table.en.md @@ -0,0 +1,7 @@ +--- +title: Table +--- + +# Table + +
Table
diff --git a/examples/docs/resources/mobile/app/table/webdoc/table.js b/examples/docs/resources/mobile/app/table/webdoc/table.js new file mode 100644 index 000000000..d6f3cf2ce --- /dev/null +++ b/examples/docs/resources/mobile/app/table/webdoc/table.js @@ -0,0 +1,76 @@ +export default { + column: '2', + owner: '', + demos: [ + { + demoId: 'base', + name: { + 'zh-CN': '基础用法', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': '

基础用法

', + 'en-US': '

button type

', + }, + codeFiles: ['base.vue'], + } + ], + apis: [ + { + name: 'Table', // 组件名称展示使用 + type: 'component', // API 类型 + properties: [ + { + name: 'columns', + type: '[]', + defaultValue: '', + desc: { + 'zh-CN': '

列数据

', + 'en-US': 'display different button', + }, + demoId: 'base', + }, + { + name: 'data', + type: '[]', + defaultValue: '', + desc: { + 'zh-CN': '

表格数据

', + 'en-US': 'display different button', + }, + demoId: 'base', + }, + { + name: 'width', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

表格宽度

', + 'en-US': 'display different button', + }, + demoId: 'base', + }, + { + name: 'defaultChecked', + type: '[]', + defaultValue: '', + desc: { + 'zh-CN': '

默认选中项

', + 'en-US': 'display different button', + }, + demoId: 'base', + }, + { + name: 'keys', + type: 'String', + defaultValue: '', + desc: { + 'zh-CN': '

数据标识

', + 'en-US': 'display different button', + }, + demoId: 'base', + }, + ] + } + ] +} diff --git a/examples/docs/resources/mobile/app/tabs/active-color.vue b/examples/docs/resources/mobile/app/tabs/active-color.vue new file mode 100644 index 000000000..81f5bd430 --- /dev/null +++ b/examples/docs/resources/mobile/app/tabs/active-color.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/docs/resources/mobile/app/tabs/before-leave.vue b/examples/docs/resources/mobile/app/tabs/before-leave.vue new file mode 100644 index 000000000..2c1f77f34 --- /dev/null +++ b/examples/docs/resources/mobile/app/tabs/before-leave.vue @@ -0,0 +1,29 @@ + + + diff --git a/example/src/demo/mobile/tabs/expand.vue b/examples/docs/resources/mobile/app/tabs/expand.vue similarity index 100% rename from example/src/demo/mobile/tabs/expand.vue rename to examples/docs/resources/mobile/app/tabs/expand.vue diff --git a/example/src/demo/mobile/tabs/swipe.vue b/examples/docs/resources/mobile/app/tabs/swipe.vue similarity index 97% rename from example/src/demo/mobile/tabs/swipe.vue rename to examples/docs/resources/mobile/app/tabs/swipe.vue index 746fc33ab..913b38a3f 100644 --- a/example/src/demo/mobile/tabs/swipe.vue +++ b/examples/docs/resources/mobile/app/tabs/swipe.vue @@ -10,7 +10,7 @@ - diff --git a/examples/docs/resources/mobile/app/timeline/different-data.vue b/examples/docs/resources/mobile/app/timeline/different-data.vue new file mode 100644 index 000000000..411a626f5 --- /dev/null +++ b/examples/docs/resources/mobile/app/timeline/different-data.vue @@ -0,0 +1,82 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/timeline/mobileTimeLine.vue b/examples/docs/resources/mobile/app/timeline/mobileTimeLine.vue new file mode 100644 index 000000000..d493d53a7 --- /dev/null +++ b/examples/docs/resources/mobile/app/timeline/mobileTimeLine.vue @@ -0,0 +1,135 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/timeline/slot.vue b/examples/docs/resources/mobile/app/timeline/slot.vue new file mode 100644 index 000000000..627a8195a --- /dev/null +++ b/examples/docs/resources/mobile/app/timeline/slot.vue @@ -0,0 +1,93 @@ + + + + + diff --git a/example/src/demo/mobile/time-line/space.vue b/examples/docs/resources/mobile/app/timeline/space.vue similarity index 98% rename from example/src/demo/mobile/time-line/space.vue rename to examples/docs/resources/mobile/app/timeline/space.vue index 4ec90dbce..0223c17f1 100644 --- a/example/src/demo/mobile/time-line/space.vue +++ b/examples/docs/resources/mobile/app/timeline/space.vue @@ -2,7 +2,7 @@ - + + diff --git a/examples/docs/resources/mobile/app/user-head/color.vue b/examples/docs/resources/mobile/app/user-head/color.vue new file mode 100644 index 000000000..d835443b1 --- /dev/null +++ b/examples/docs/resources/mobile/app/user-head/color.vue @@ -0,0 +1,16 @@ + + + diff --git a/examples/docs/resources/mobile/app/user-head/custom-background-color.vue b/examples/docs/resources/mobile/app/user-head/custom-background-color.vue new file mode 100644 index 000000000..318bfdd04 --- /dev/null +++ b/examples/docs/resources/mobile/app/user-head/custom-background-color.vue @@ -0,0 +1,13 @@ + + + diff --git a/examples/docs/resources/mobile/app/user-head/custom-user-head-content.vue b/examples/docs/resources/mobile/app/user-head/custom-user-head-content.vue new file mode 100644 index 000000000..9558d84df --- /dev/null +++ b/examples/docs/resources/mobile/app/user-head/custom-user-head-content.vue @@ -0,0 +1,39 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/user-head/icon-user-head.vue b/examples/docs/resources/mobile/app/user-head/icon-user-head.vue new file mode 100644 index 000000000..d5922b3a0 --- /dev/null +++ b/examples/docs/resources/mobile/app/user-head/icon-user-head.vue @@ -0,0 +1,19 @@ + + + diff --git a/examples/docs/resources/mobile/app/user-head/image-user-head.vue b/examples/docs/resources/mobile/app/user-head/image-user-head.vue new file mode 100644 index 000000000..79767254b --- /dev/null +++ b/examples/docs/resources/mobile/app/user-head/image-user-head.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/mobile/app/user-head/label-user-head.vue b/examples/docs/resources/mobile/app/user-head/label-user-head.vue new file mode 100644 index 000000000..c4f3bade4 --- /dev/null +++ b/examples/docs/resources/mobile/app/user-head/label-user-head.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/mobile/app/user-head/message-count-limit.vue b/examples/docs/resources/mobile/app/user-head/message-count-limit.vue new file mode 100644 index 000000000..a0c0e0028 --- /dev/null +++ b/examples/docs/resources/mobile/app/user-head/message-count-limit.vue @@ -0,0 +1,13 @@ + + + diff --git a/examples/docs/resources/mobile/app/user-head/message-count-total.vue b/examples/docs/resources/mobile/app/user-head/message-count-total.vue new file mode 100644 index 000000000..0aacb967f --- /dev/null +++ b/examples/docs/resources/mobile/app/user-head/message-count-total.vue @@ -0,0 +1,13 @@ + + + diff --git a/examples/docs/resources/mobile/app/user-head/message-count-type.vue b/examples/docs/resources/mobile/app/user-head/message-count-type.vue new file mode 100644 index 000000000..594c843c2 --- /dev/null +++ b/examples/docs/resources/mobile/app/user-head/message-count-type.vue @@ -0,0 +1,13 @@ + + + diff --git a/examples/docs/resources/mobile/app/user-head/min-user-head.vue b/examples/docs/resources/mobile/app/user-head/min-user-head.vue new file mode 100644 index 000000000..9602fe667 --- /dev/null +++ b/examples/docs/resources/mobile/app/user-head/min-user-head.vue @@ -0,0 +1,13 @@ + + + diff --git a/examples/docs/resources/mobile/app/user-head/render-user-head-in-grid.vue b/examples/docs/resources/mobile/app/user-head/render-user-head-in-grid.vue new file mode 100644 index 000000000..08a7916a7 --- /dev/null +++ b/examples/docs/resources/mobile/app/user-head/render-user-head-in-grid.vue @@ -0,0 +1,130 @@ + + + + + diff --git a/examples/docs/resources/mobile/app/user-head/round-user-head.vue b/examples/docs/resources/mobile/app/user-head/round-user-head.vue new file mode 100644 index 000000000..0b2795e59 --- /dev/null +++ b/examples/docs/resources/mobile/app/user-head/round-user-head.vue @@ -0,0 +1,13 @@ + + + diff --git a/examples/docs/resources/mobile/app/user-head/webdoc/user-head.cn.md b/examples/docs/resources/mobile/app/user-head/webdoc/user-head.cn.md new file mode 100644 index 000000000..81544a36d --- /dev/null +++ b/examples/docs/resources/mobile/app/user-head/webdoc/user-head.cn.md @@ -0,0 +1,11 @@ +--- +title: UserHead 用户头像 +--- + +# UserHead 用户头像 + +
+ +UserHead 用户头像 + +
diff --git a/examples/docs/resources/mobile/app/user-head/webdoc/user-head.en.md b/examples/docs/resources/mobile/app/user-head/webdoc/user-head.en.md new file mode 100644 index 000000000..7548cda4e --- /dev/null +++ b/examples/docs/resources/mobile/app/user-head/webdoc/user-head.en.md @@ -0,0 +1,7 @@ +--- +title: UserHead +--- + +# UserHead + +
UserHead
diff --git a/examples/docs/resources/mobile/app/user-head/webdoc/user-head.js b/examples/docs/resources/mobile/app/user-head/webdoc/user-head.js new file mode 100644 index 000000000..ccd070d74 --- /dev/null +++ b/examples/docs/resources/mobile/app/user-head/webdoc/user-head.js @@ -0,0 +1,296 @@ +export default { + column: '2', + owner: '', + demos: [ + { + demoId: 'basic-usage', + name: { + 'zh-CN': '基础用法', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': + '

基础用法

', + 'en-US': '

button type

', + }, + codeFiles: ['basic-usage.vue'], + }, + { + demoId: 'color', + name: { + 'zh-CN': '设置头像的颜色及背景色', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': + '

当头像type设置为icon或label时,可以通过color属性设置颜色,通过background-color

设置背景色', + 'en-US': '

button type

', + }, + codeFiles: ['color.vue'], + }, + { + demoId: 'custom-background-color', + name: { + 'zh-CN': '背景色', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': + '

通过background-color

设置背景色

', + 'en-US': '

button type

', + }, + codeFiles: ['custom-background-color.vue'], + }, + { + demoId: 'custom-user-head-content', + name: { + 'zh-CN': '头像内容', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': + '

直接设置头像显示的内容

', + 'en-US': '

button type

', + }, + codeFiles: ['custom-user-head-content.vue'], + }, + { + demoId: 'icon-user-head', + name: { + 'zh-CN': '设置头像为icon类型', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': + '

设置头像为icon类型

', + 'en-US': '

button type

', + }, + codeFiles: ['icon-user-head.vue'], + }, + { + demoId: 'image-user-head', + name: { + 'zh-CN': '设置头像为图片类型', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': + '

设置头像为图片类型

', + 'en-US': '

button type

', + }, + codeFiles: ['image-user-head.vue'], + }, + { + demoId: 'label-user-head', + name: { + 'zh-CN': '设置头像为文字类型', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': + '

设置头像为文字类型

', + 'en-US': '

button type

', + }, + codeFiles: ['label-user-head.vue'], + }, + { + demoId: 'message-count-limit', + name: { + 'zh-CN': '消息提醒', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': + '

设置头像右上角消息提醒

', + 'en-US': '

button type

', + }, + codeFiles: ['message-count-limit.vue'], + }, + { + demoId: 'message-count-total', + name: { + 'zh-CN': '总消息提醒数', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': + '

总消息提醒数

', + 'en-US': '

button type

', + }, + codeFiles: ['message-count-total.vue'], + }, + { + demoId: 'message-count-type', + name: { + 'zh-CN': '消息提醒类型', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': + '

消息提醒类型

', + 'en-US': '

button type

', + }, + codeFiles: ['message-count-type.vue'], + }, + { + demoId: 'min-user-head', + name: { + 'zh-CN': '小尺寸', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': + '

小尺寸

', + 'en-US': '

button type

', + }, + codeFiles: ['min-user-head.vue'], + }, + { + demoId: 'render-user-head-in-grid', + name: { + 'zh-CN': '渲染用户头像在网格中', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': + '

渲染用户头像在网格中

', + 'en-US': '

button type

', + }, + codeFiles: ['render-user-head-in-grid.vue'], + }, + { + demoId: 'round-user-head', + name: { + 'zh-CN': '圆形用户头像', + 'en-US': 'button type', + }, + desc: { + 'zh-CN': + '

圆形用户头像

', + 'en-US': '

button type

', + }, + codeFiles: ['round-user-head.vue'], + }, + ], + apis: [ + { + name: 'UserHead', // 组件名称展示使用 + type: 'component', // API 类型 + properties: [ + { + name: 'type', + type: 'string', + defaultValue: 'label', + desc: { + 'zh-CN': '

头像类型,该属性的可选值为 icon / image / label

', + 'en-US': 'display different button', + }, + demoId: 'basic-usage', + }, + { + name: 'value', + type: 'string', + defaultValue: '', + desc: { + 'zh-CN': '

设type=icon 时为图标类名,type=label时为字体串,type=image时为资源路径

', + 'en-US': 'display different button', + }, + demoId: 'basic-usage', + }, + { + name: 'size', + type: 'number', + defaultValue: '', + desc: { + 'zh-CN': '

设置头像尺寸

', + 'en-US': 'display different button', + }, + demoId: 'basic-usage', + }, + { + name: 'backgroundColor', + type: 'string', + defaultValue: '', + desc: { + 'zh-CN': '

设置背景色

', + 'en-US': 'display different button', + }, + demoId: 'custom-background-color', + }, + { + name: 'color', + type: 'string', + defaultValue: '#ffffff', + desc: { + 'zh-CN': '

头像为icon或文字类型时的颜色

', + 'en-US': 'display different button', + }, + demoId: 'color', + }, + { + name: 'messageTotal', + type: 'number', + defaultValue: '', + desc: { + 'zh-CN': '

右上角消息计数

', + 'en-US': 'display different button', + }, + demoId: 'message-count-limit', + }, + { + name: 'messageUpperLimit', + type: 'number', + defaultValue: '0', + desc: { + 'zh-CN': '

右上角消息显示上限

', + 'en-US': 'display different button', + }, + demoId: 'message-count-limit', + }, + { + name: 'messageType', + type: 'string', + defaultValue: 'details', + desc: { + 'zh-CN': '

右上角消息提醒类型,basic显示小圆点不显示消息数量

', + 'en-US': 'display different button', + }, + demoId: 'message-count-type', + }, + { + name: 'min', + type: 'boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

小尺寸模式

', + 'en-US': 'display different button', + }, + demoId: 'min-user-head', + }, + { + name: 'round', + type: 'boolean', + defaultValue: 'false', + desc: { + 'zh-CN': '

圆形模式

', + 'en-US': 'display different button', + }, + demoId: 'round-user-head', + }, + + ], + slots: [ + { + name: 'default', + type: '', + defaultValue: '', + desc: { + 'zh-CN': '

自定义图像内容

', + 'en-US': 'display different button', + }, + demoId: 'round-user-head', + }, + ] + }, + ], +} diff --git a/examples/docs/resources/mobile/menus.js b/examples/docs/resources/mobile/menus.js new file mode 100644 index 000000000..6ae6d407e --- /dev/null +++ b/examples/docs/resources/mobile/menus.js @@ -0,0 +1,112 @@ +export const standaloneMenus = [ + { + label: '组件总览', + key: 'overview' + } +] + +export const docMenus = [ + { + label: '使用指南', + labelEn: 'Guide', + key: 'doc_use', + children: [ + { + title: '更新日志', + titleEn: 'Change Log', + key: 'changelog' + }, + { + title: '组件介绍', + titleEn: 'Introduce', + key: 'introduce' + }, + { + title: '引入组件', + titleEn: 'Import Component', + key: 'import' + }, + { + title: '切换模式', + titleEn: 'Switch Mode', + key: 'mode' + } + ] + } +] + +export const cmpMenus = [ + { + label: '导航组件', + labelEn: 'Navigation', + key: 'cmp_navigation', + children: [ + { name: 'Navbar', nameCn: '导航栏', key: 'navbar' }, + { name: 'Tabbar', nameCn: '标签栏', key: 'tabbar' }, + { name: 'Tabs', nameCn: '选项卡', key: 'tabs' }, + { name: 'TimeLine ', nameCn: '时间轴', key: 'timeline' }, + { name: 'IndexBar ', nameCn: '索引条', key: 'index-bar' } + ] + }, + { + label: '容器组件', + labelEn: 'Container', + key: 'cmp_container', + children: [{ name: 'Dialog', nameCn: '对话框', key: 'dialogbox' }] + }, + { + label: '数据组件', + labelEn: 'Data', + key: 'cmp_data', + children: [{ name: 'Progress', nameCn: '进度条', key: 'progress' }] + }, + { + label: '表单组件', + labelEn: 'Form', + key: 'cmp_form', + children: [ + { name: 'Table', nameCn: '表格', key: 'table' }, + { name: 'Button', nameCn: '按钮', key: 'button' }, + { name: 'Form', nameCn: '表单', key: 'form' }, + { name: 'Checkbox', nameCn: '复选框', key: 'checkbox' }, + { name: 'Slider', nameCn: '滑块', key: 'slider' }, + { name: 'CheckboxGroup', nameCn: '复选框组', key: 'checkboxgroup' }, + { name: 'DropdownMenu ', nameCn: '筛选排序', key: 'dropdownmenu' }, + { name: 'ImageViewer', nameCn: '图片预览', key: 'imageviewer' }, + { name: 'Input', nameCn: '输入框', key: 'input' }, + { name: 'List', nameCn: '列表', key: 'list' }, + { name: 'Radio', nameCn: '单选', key: 'radio' }, + { name: 'Search', nameCn: '搜索框', key: 'search' }, + { name: 'Switch', nameCn: '开关', key: 'switch' }, + { name: 'Numeric', nameCn: '计数器 ', key: 'numeric' }, + { name: 'FileUpload', nameCn: '文件上传', key: 'file-upload' }, + { name: 'MultiSelect', nameCn: '下拉选择器', key: 'multi-select' } + ] + }, + { + label: '提示组件', + labelEn: 'Tooltip', + key: 'cmp_tooltip', + children: [ + { name: 'PullRefresh', nameCn: '下拉刷新', key: 'pull-refresh' }, + { name: 'Alert', nameCn: '提示', key: 'alert' }, + { name: 'Badge', nameCn: '徽章', key: 'badge' }, + { name: 'Loading', nameCn: '加载', key: 'loading' }, + { name: 'Modal', nameCn: '模态框', key: 'modal' }, + { name: 'Popover', nameCn: '气泡', key: 'popover' } + ] + }, + { + label: '其它组件', + labelEn: 'Others', + key: 'cmp_others', + children: [ + { name: 'Exception', nameCn: '缺省页', key: 'exception' }, + { name: 'Avatar', nameCn: '头像', key: 'avatar' }, + { name: 'Icon', nameCn: '图标', key: 'icon' }, + { name: 'ActionSheet', nameCn: '上滑列表组件', key: 'actionsheet' }, + { name: 'MiniPicker', nameCn: 'mini选择器', key: 'minipicker' }, + { name: 'UserHead', nameCn: '用户头像', key: 'user-head' } + ] + } +] diff --git a/examples/docs/resources/mobile/overviewimage/actionsheet.svg b/examples/docs/resources/mobile/overviewimage/actionsheet.svg new file mode 100644 index 000000000..587cff8f9 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/actionsheet.svg @@ -0,0 +1,100 @@ + + + select选择器 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/alert.svg b/examples/docs/resources/mobile/overviewimage/alert.svg new file mode 100644 index 000000000..da1c09b1d --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/alert.svg @@ -0,0 +1,90 @@ + + + Alert 警告 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/badge.svg b/examples/docs/resources/mobile/overviewimage/badge.svg new file mode 100644 index 000000000..34c72827f --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/badge.svg @@ -0,0 +1,101 @@ + + + Tag标签 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Tag + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/button.svg b/examples/docs/resources/mobile/overviewimage/button.svg new file mode 100644 index 000000000..7e443c451 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/button.svg @@ -0,0 +1,106 @@ + + + Button按钮 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/buttongroup.svg b/examples/docs/resources/mobile/overviewimage/buttongroup.svg new file mode 100644 index 000000000..2dd081880 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/buttongroup.svg @@ -0,0 +1,138 @@ + + + Buttongroup选块组 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 1 + + + + + + + + 2 + + + + + + + + 3 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/checkbox.svg b/examples/docs/resources/mobile/overviewimage/checkbox.svg new file mode 100644 index 000000000..e7e9d5ba1 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/checkbox.svg @@ -0,0 +1,118 @@ + + + Checkbox复选框 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/checkboxgroup.svg b/examples/docs/resources/mobile/overviewimage/checkboxgroup.svg new file mode 100644 index 000000000..eff6c46cb --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/checkboxgroup.svg @@ -0,0 +1,91 @@ + + + Checkgroup复选框 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/dialogbox.svg b/examples/docs/resources/mobile/overviewimage/dialogbox.svg new file mode 100644 index 000000000..cce60542a --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/dialogbox.svg @@ -0,0 +1,108 @@ + + + Modal 弹出框 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/dropdownmenu.svg b/examples/docs/resources/mobile/overviewimage/dropdownmenu.svg new file mode 100644 index 000000000..d66023eb9 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/dropdownmenu.svg @@ -0,0 +1,104 @@ + + + Menu 下拉菜单 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/exception.svg b/examples/docs/resources/mobile/overviewimage/exception.svg new file mode 100644 index 000000000..1884574d1 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/exception.svg @@ -0,0 +1,82 @@ + + + Link 链接 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/file-upload.svg b/examples/docs/resources/mobile/overviewimage/file-upload.svg new file mode 100644 index 000000000..010feb0e0 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/file-upload.svg @@ -0,0 +1,85 @@ + + + Upload 文件上传 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/fileupload.svg b/examples/docs/resources/mobile/overviewimage/fileupload.svg new file mode 100644 index 000000000..010feb0e0 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/fileupload.svg @@ -0,0 +1,85 @@ + + + Upload 文件上传 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/form.svg b/examples/docs/resources/mobile/overviewimage/form.svg new file mode 100644 index 000000000..ee55a9eab --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/form.svg @@ -0,0 +1,145 @@ + + + Formfield 表单布局 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/icon.svg b/examples/docs/resources/mobile/overviewimage/icon.svg new file mode 100644 index 000000000..fcd0820e3 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/icon.svg @@ -0,0 +1,85 @@ + + + Icon图标 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/imageviewer.svg b/examples/docs/resources/mobile/overviewimage/imageviewer.svg new file mode 100644 index 000000000..c406be843 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/imageviewer.svg @@ -0,0 +1,111 @@ + + + Uploadimage 图片上传 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/input.svg b/examples/docs/resources/mobile/overviewimage/input.svg new file mode 100644 index 000000000..e9ba72ecf --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/input.svg @@ -0,0 +1,94 @@ + + + Text 文本框 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/list.svg b/examples/docs/resources/mobile/overviewimage/list.svg new file mode 100644 index 000000000..0817caa96 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/list.svg @@ -0,0 +1,128 @@ + + + Overflow 溢出提示 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/loading.svg b/examples/docs/resources/mobile/overviewimage/loading.svg new file mode 100644 index 000000000..84d5f8a61 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/loading.svg @@ -0,0 +1,82 @@ + + + Loading 加载 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/modal.svg b/examples/docs/resources/mobile/overviewimage/modal.svg new file mode 100644 index 000000000..cce60542a --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/modal.svg @@ -0,0 +1,108 @@ + + + Modal 弹出框 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/multi-select.svg b/examples/docs/resources/mobile/overviewimage/multi-select.svg new file mode 100644 index 000000000..e7e9d5ba1 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/multi-select.svg @@ -0,0 +1,118 @@ + + + Checkbox复选框 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/navbar.svg b/examples/docs/resources/mobile/overviewimage/navbar.svg new file mode 100644 index 000000000..5d41007d3 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/navbar.svg @@ -0,0 +1,98 @@ + + + Tabs 页签 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/nopic.svg b/examples/docs/resources/mobile/overviewimage/nopic.svg new file mode 100644 index 000000000..c458e8b3e --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/nopic.svg @@ -0,0 +1,81 @@ + + + + + + +{ + "fontFamily": "ti3Font", + "description": "Font generated by IcoMoon.", + "majorVersion": 0, + "version": "Version 1.0", + "fontId": "ti3Font", + "psName": "ti3Font", + "subFamily": "Regular", + "fullName": "ti3Font" +} + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/numeric.svg b/examples/docs/resources/mobile/overviewimage/numeric.svg new file mode 100644 index 000000000..fcb632584 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/numeric.svg @@ -0,0 +1,86 @@ + + + InputNumber 数字输入框 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/progress.svg b/examples/docs/resources/mobile/overviewimage/progress.svg new file mode 100644 index 000000000..92cf20b04 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/progress.svg @@ -0,0 +1,91 @@ + + + Progressbar 进度条 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/pull-refresh.svg b/examples/docs/resources/mobile/overviewimage/pull-refresh.svg new file mode 100644 index 000000000..84d5f8a61 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/pull-refresh.svg @@ -0,0 +1,82 @@ + + + Loading 加载 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/radio.svg b/examples/docs/resources/mobile/overviewimage/radio.svg new file mode 100644 index 000000000..2abd731b3 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/radio.svg @@ -0,0 +1,117 @@ + + + Radio单选框 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/search.svg b/examples/docs/resources/mobile/overviewimage/search.svg new file mode 100644 index 000000000..d6c3c1d49 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/search.svg @@ -0,0 +1,112 @@ + + + Searchbox 搜索框 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/slider.svg b/examples/docs/resources/mobile/overviewimage/slider.svg new file mode 100644 index 000000000..81127cf53 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/slider.svg @@ -0,0 +1,130 @@ + + + Slider滑块 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/switch.svg b/examples/docs/resources/mobile/overviewimage/switch.svg new file mode 100644 index 000000000..1f15d28a8 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/switch.svg @@ -0,0 +1,118 @@ + + + Switch开关 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/tabbar.svg b/examples/docs/resources/mobile/overviewimage/tabbar.svg new file mode 100644 index 000000000..5d41007d3 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/tabbar.svg @@ -0,0 +1,98 @@ + + + Tabs 页签 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/tabs.svg b/examples/docs/resources/mobile/overviewimage/tabs.svg new file mode 100644 index 000000000..5d41007d3 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/tabs.svg @@ -0,0 +1,98 @@ + + + Tabs 页签 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/mobile/overviewimage/timeline.svg b/examples/docs/resources/mobile/overviewimage/timeline.svg new file mode 100644 index 000000000..8a1587031 --- /dev/null +++ b/examples/docs/resources/mobile/overviewimage/timeline.svg @@ -0,0 +1,180 @@ + + + Time 时间 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/action-menu.json b/examples/docs/resources/pc/api/en-US/action-menu.json new file mode 100644 index 000000000..eaca461ac --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/action-menu.json @@ -0,0 +1,99 @@ +{ + "attrs": [ + { + "name": "options", + "sample": "basic-usage", + "type": "Array", + "desc": "You can configure menu button data. The default value is []. Each element in the array is an object item. Each item can contain the following fields: label, children, disabled, and divided, for example, {label:'Login', children:[],divided: true,disabled :true} .", + "defaultValue": "[]" + }, + { + "name": "label", + "sample": "basic-usage", + "type": "String", + "desc": "Display value of a menu item", + "defaultValue": "" + }, + { + "name": "children", + "sample": "basic-usage", + "type": "Array", + "desc": "Subset of menu items", + "defaultValue": "[]" + }, + { + "name": "divided", + "sample": "basic-usage", + "type": "Boolean", + "desc": "Displays the split line. Default value: false", + "defaultValue": "false" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "Whether to disable the function. Default value: false", + "defaultValue": "false" + }, + { + "name": "textField", + "sample": "text-field", + "type": "String", + "desc": "Set the key value of the displayed text of a menu button. The default value is label.", + "defaultValue": "label" + }, + { + "name": "moreText", + "sample": "more-text", + "type": "String", + "desc": "Configure the display text of the drop-down button. The default value is More.", + "defaultValue": "More" + }, + { + "name": "spacing", + "sample": "spacing", + "type": "[String,Number]", + "desc": "Set the spacing between menu buttons. The default value is 5px.", + "defaultValue": "5px" + }, + { + "name": "popperClass", + "sample": "popper-class", + "type": "String", + "desc": "Set the class name of the drop-down list box and customize the style.", + "defaultValue": "" + }, + { + "name": "maxShowNum", + "sample": "max-show-num", + "type": "Number", + "desc": "Maximum number of menu buttons to be displayed. The default value is 2.", + "defaultValue": "2" + } + ], + "slots": [ + { + "name": "item", + "sample": "slot-item", + "type": "Slot", + "desc": "Slots in the drop-down list box", + "defaultValue": "" + } + ], + "events": [ + { + "name": "itemClick", + "sample": "item-click", + "type": "Function", + "desc": "The itemClick event is triggered when a menu item is selected. The transferred parameter is the data of the selected item.", + "defaultValue": "" + }, + { + "name": "moreClick", + "sample": "more-click", + "type": "Function", + "desc": "The moreClick event is triggered when a drop-down list button is clicked.", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/alert.json b/examples/docs/resources/pc/api/en-US/alert.json new file mode 100644 index 000000000..712e08c48 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/alert.json @@ -0,0 +1,99 @@ +{ + "attrs": [ + { + "name": "closable", + "sample": "closable", + "type": "Boolean", + "desc": "Set whether alarms can be disabled.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "icon", + "sample": "icon", + "type": "String , Object", + "desc": "Set the alarm icon. By default, the corresponding icon is automatically used based on the value of type.", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "Set the warning size to nomal or large. The default value is nomal. ;The value of this attribute can be nomal or large", + "defaultValue": "The default value of this attribute is normal." + }, + { + "name": "title", + "sample": "title", + "type": "String", + "desc": "Set the warning title. This parameter is valid only when size is set to large. By default, the alarm title is automatically set based on type.", + "defaultValue": "" + }, + { + "name": "type", + "sample": "type", + "type": "String", + "desc": "Set the alarm type. The value of this attribute can be success / warning / info / error", + "defaultValue": "The default value of this attribute is info." + }, + { + "name": "description", + "sample": "custom-description", + "type": "String", + "desc": "Set the warning prompt content. The default value is null.", + "defaultValue": "" + }, + { + "name": "center", + "sample": "center", + "type": "Boolean", + "desc": "Whether the text is centered", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "close-text", + "sample": "close-text", + "type": "String", + "desc": "Customized text of the close button", + "defaultValue": "" + }, + { + "name": "show-icon", + "sample": "show-icon", + "type": "Boolean", + "desc": "Display icon", + "defaultValue": "The default value of this attribute is true." + } + ], + "slots": [ + { + "name": "default", + "sample": "slot-default", + "type": "", + "desc": "Default slot of the component", + "defaultValue": "" + }, + { + "name": "title", + "sample": "title", + "type": "", + "desc": "Title content", + "defaultValue": "" + }, + { + "name": "description", + "sample": "custom-description", + "type": "", + "desc": "Prompt Content", + "defaultValue": "" + } + ], + "events": [ + { + "name": "close", + "sample": "close", + "type": "", + "desc": "Event triggered when the alert function is disabled", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/amount.json b/examples/docs/resources/pc/api/en-US/amount.json new file mode 100644 index 000000000..191696f2e --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/amount.json @@ -0,0 +1,118 @@ +{ + "attrs": [ + { + "name": "placeholder", + "sample": "custom-service", + "type": "String", + "desc": "Placeholder when data is empty", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "Set the component size", + "defaultValue": "" + }, + { + "name": "format", + "sample": "", + "type": "Object", + "desc": "Number formatting configuration item. The following fields can be configured:; {\n fraction: 4, //Retain the number of decimal places. \n rounding: 0, //Round the number between 0 and 9. For example, if the value is set to 7, the value is rounded off to 6. The default value is 5 (rounded off). If this parameter is set to 0 or greater than 9, truncation is performed. \n prefix: '$', //Front identifier. \n groupSize: 3, //Integer part grouping interval, that is, the number of bits of the first grouping. \n secondaryGroupSize: 2, //Integer part second-level grouping interval. If this parameter is not set or is set to 0, the value of groupSize is automatically used. \n groupSeparator: ',', //Integer part grouping separator. \n decimalSeparator:' ', / / Decimal point symbol \n fractionGroupSize: 0, // Decimal part grouping interval \n fractionGroupSeparator: '', / / Decimal grouping separator \n suffix: '@' / / Post identifier \n}", + "defaultValue": "" + }, + { + "name": "currency", + "sample": "custom-currency", + "type": "String", + "desc": "", + "defaultValue": "The default value of this attribute is CNY." + }, + { + "name": "digits", + "sample": "digits-maxlen", + "type": "Number", + "desc": "Set the number of decimal places. The default value is two.", + "defaultValue": "The default value of this attribute is 2" + }, + { + "name": "date", + "sample": "set-date", + "type": "String", + "desc": "Set the date box to be displayed in the pop-up box. The value can be of the String or Date() type.", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "amount-disable", + "type": "Boolean", + "desc": "Whether to disable the function. The default value is false.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "max-len", + "sample": "digits-maxlen", + "type": "Number", + "desc": "Maximum integer length. The default value is 15 characters.", + "defaultValue": "The default value of this attribute is 15" + }, + { + "name": "negative", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether the value can be a negative number. The default value is true. The value can be a negative number.", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "Add a class name for the popper. For details, see the popover component.", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether to insert the pop-up box to the body element. When a fault occurs in the dialog box that is displayed, you can set this attribute to false (for details, see the select component).", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "value", + "sample": "digits-maxlen", + "type": "String , Number", + "desc": "Set the value of the amount component.", + "defaultValue": "" + }, + { + "name": "rounding", + "sample": "digits-maxlen", + "type": "Boolean", + "desc": "Controls the rounding of the input amount.", + "defaultValue": "" + }, + { + "name": "fetchCurrency", + "sample": "custom-service", + "type": "Function", + "desc": "Request service interface of the customized amount component. fetchCurrency returns a Promise object.", + "defaultValue": "" + }, + { + "name": "fields", + "sample": "custom-service", + "type": "Object", + "desc": "Customized amount component data mapping. This parameter is mandatory when the framework service is not used.", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "set-date", + "type": "", + "desc": "This event is triggered when the value of a component changes.", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/anchor.json b/examples/docs/resources/pc/api/en-US/anchor.json new file mode 100644 index 000000000..324591f1a --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/anchor.json @@ -0,0 +1,48 @@ +{ + "attrs": [ + { + "name": "links", + "sample": "basic-usage", + "type": "{key, link, title, children}[]", + "desc": "Data configuration item, which can be nested by children.", + "defaultValue": "" + }, + { + "name": "is-affix", + "sample": "is-affix", + "type": "Boolean", + "desc": "Fixed mode", + "defaultValue": "false" + }, + { + "name": "container-id", + "sample": "set-container", + "type": "String", + "desc": "Specify the scrolling container ID.", + "defaultValue": "document.body" + }, + { + "name": "mask-class", + "sample": "set-container", + "type": "String", + "desc": "Class name of the customized scrolling target element", + "defaultValue": "" + } + ], + "events": [ + { + "name": "link-click", + "sample": "set-container", + "type": "Function(arg1, arg2)", + "desc": "An anchor click event, which is a callback function triggered after the anchor clicks. //Parameter arg1: click event object //Parameter arg2: {link: click anchor link, title: click node title}", + "defaultValue": "" + }, + { + "name": "on-change", + "sample": "on-change", + "type": "Function(arg1)", + "desc": "Listen to the change of the anchor link; Callback function after the anchor point is changed; //arg1: ID of the current anchor", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/area.json b/examples/docs/resources/pc/api/en-US/area.json new file mode 100644 index 000000000..9a0eea5f4 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/area.json @@ -0,0 +1,104 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "String", + "desc": "Set the default value of a region.", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "Set the component size. The options are medium, small, and mini.", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "custom-service", + "type": "String", + "desc": "Placeholder when data is empty", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "Add a class name for the popper. For details, see the popover component.", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether to insert the pop-up box to the body element. If a fault occurs in locating the fault in the dialog box that is displayed, set this parameter to false (for details, see the select component)", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "Disable the text box. The default value is false", + "defaultValue": "" + }, + { + "name": "props", + "sample": "custom-service", + "type": "Object", + "desc": "Set the data mapping field when customizing a service. The default value is {label:'name_cn', //Display the field corresponding to the text value:'org_id' //Display the field corresponding to the value}", + "defaultValue": "" + }, + { + "name": "fetch-jcr", + "sample": "custom-service", + "type": "Function", + "desc": "User-defined service for obtaining regional JCRs", + "defaultValue": "" + }, + { + "name": "fetch-region", + "sample": "custom-service", + "type": "Function", + "desc": "Obtain the service of a region.", + "defaultValue": "" + }, + { + "name": "fetch-rep", + "sample": "custom-service", + "type": "Function", + "desc": "Obtain services of rep offices and rep offices.", + "defaultValue": "" + }, + { + "name": "fetch-office", + "sample": "custom-service", + "type": "Function", + "desc": "User-defined Office service", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change-region", + "sample": "area-events", + "type": "Function(value, vm)", + "desc": "This event is triggered when the value of a region changes. The callback parameter is the changed value. value: new value, vm: Area component instance", + "defaultValue": "" + }, + { + "name": "change-rep", + "sample": "area-events", + "type": "Function(value, vm)", + "desc": "This event is triggered when the value of Rep changes. The callback parameter is the changed value. value: new value, vm: Area component instance", + "defaultValue": "" + }, + { + "name": "change-office", + "sample": "area-events", + "type": "Function(value, vm)", + "desc": "This event is triggered when the value of Office changes. The callback parameter is the changed value. value: new value, vm: Area component instance", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/autocomplete.json b/examples/docs/resources/pc/api/en-US/autocomplete.json new file mode 100644 index 000000000..8fc9cbb73 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/autocomplete.json @@ -0,0 +1,176 @@ +{ + "attrs": [ + { + "name": "clearable", + "sample": "clearable", + "type": "Boolean", + "desc": "Whether to clear data", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "placeholder", + "sample": "hide-loading1", + "type": "String", + "desc": "Placeholder text in the text box", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled1", + "type": "Boolean", + "desc": "Disabled", + "defaultValue": "" + }, + { + "name": "value-key", + "sample": "value-key", + "type": "String", + "desc": "Enter the key name for display in the suggestion object.", + "defaultValue": "" + }, + { + "name": "value", + "sample": "clearable", + "type": "String", + "desc": "This parameter is mandatory. Enter a bound value.", + "defaultValue": "" + }, + { + "name": "debounce", + "sample": "debounce", + "type": "Number", + "desc": "Obtain the recommended input dejitter delay.", + "defaultValue": "The default value of this attribute is 300." + }, + { + "name": "placement", + "sample": "placement", + "type": "String", + "desc": "Menu pop-up position; The optional value of this attribute is top / top-start / top-end / bottom / bottom-start / bottom-end", + "defaultValue": "The default value of this attribute is bottom-start." + }, + { + "name": "popper-class", + "sample": "popper-class", + "type": "String", + "desc": "Class name of the Autocomplete drop-down list box", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "Set the component size. The value can be medium, small, or mini.", + "defaultValue": "" + }, + { + "name": "trigger-on-focus", + "sample": "no-trigger-on-focus", + "type": "Boolean", + "desc": "Whether to display the suggestion list when the text box is focused", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "name", + "sample": "clearable", + "type": "String", + "desc": "Native attribute", + "defaultValue": "" + }, + { + "name": "select-when-unmatched", + "sample": "select-event", + "type": "Boolean", + "desc": "Indicates whether to trigger the select event when pressing Enter when the input does not have any matching suggestions.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "label", + "sample": "", + "type": "String", + "desc": "Label text associated with the text box", + "defaultValue": "" + }, + { + "name": "prefix-icon", + "sample": "custom-icon", + "type": "String", + "desc": "Icon on the header of the text box", + "defaultValue": "" + }, + { + "name": "suffix-icon", + "sample": "custom-icon", + "type": "String", + "desc": "Icon at the end of the text box", + "defaultValue": "" + }, + { + "name": "hide-loading", + "sample": "hide-loading", + "type": "Boolean", + "desc": "Whether to hide the loading icon during remote loading", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "popper-append-to-body", + "sample": "popper-class", + "type": "Boolean", + "desc": "Indicates whether to insert the drop-down list into the body element. When a fault occurs in locating the drop-down list, you can set this attribute to false", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "fetch-suggestions", + "sample": "remote-search", + "type": "Function(queryString, callback)", + "desc": "This method is used to return input suggestions. It is returned by calling callback(data:[]) only when your input suggestions are resolved.", + "defaultValue": "" + }, + { + "name": "highlight-first-item", + "sample": "highlight-first-item", + "type": "Boolean", + "desc": "Whether to highlight the first item in remote search suggestions by default", + "defaultValue": "The default value of this attribute is false." + } + ], + "slots": [ + { + "name": "prefix", + "sample": "custom-icon", + "type": "", + "desc": "Content in the text box header", + "defaultValue": "" + }, + { + "name": "suffix", + "sample": "custom-icon", + "type": "", + "desc": "Content at the end of the text box", + "defaultValue": "" + }, + { + "name": "prepend", + "sample": "append-prepend", + "type": "", + "desc": "Pre-content in the text box", + "defaultValue": "" + }, + { + "name": "append", + "sample": "append-prepend", + "type": "", + "desc": "Content after the text box", + "defaultValue": "" + } + ], + "events": [ + { + "name": "select", + "sample": "select-event", + "type": "", + "desc": "This event is triggered when a suggestion item is selected. The callback parameter is: Selected Suggestions", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/badge.json b/examples/docs/resources/pc/api/en-US/badge.json new file mode 100644 index 000000000..245a832c5 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/badge.json @@ -0,0 +1,69 @@ +{ + "attrs": [ + { + "name": "value", + "sample": "type", + "type": "Number | String", + "desc": "Dataset object, which supports static and dynamic data. ;Display Value", + "defaultValue": "" + }, + { + "name": "href", + "sample": "target", + "type": "String", + "desc": "Specify the URL of the target page.", + "defaultValue": "" + }, + { + "name": "max", + "sample": "max", + "type": "Number", + "desc": "Specifies the maximum number of badges to be displayed. If the actual badge value exceeds the maximum value, the number of badges is displayed in the format of \"+\". Maximum value. If the value exceeds the maximum value, '{max}+' is displayed. The value must be of the Number type.", + "defaultValue": "" + }, + { + "name": "is-dot", + "sample": "is-dot", + "type": "Boolean", + "desc": "Sets whether there is a default new message prompt. ; Little Dots", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "hidden", + "sample": "dynamic-hidden", + "type": "Boolean", + "desc": "Hide badge", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "type", + "sample": "type", + "type": "String", + "desc": "The value of this attribute can be primary / success / warning / danger / info", + "defaultValue": "" + }, + { + "name": "target", + "sample": "target", + "type": "String", + "desc": "Specifies the redirection mode to the target page when you click the badge Dom node. This parameter is used only when the href attribute exists.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "slot-default", + "type": "", + "desc": "Default slot", + "defaultValue": "" + }, + { + "name": "content", + "sample": "slot-content", + "type": "", + "desc": "Message Content", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/breadcrumb-item.json b/examples/docs/resources/pc/api/en-US/breadcrumb-item.json new file mode 100644 index 000000000..54a1e5829 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/breadcrumb-item.json @@ -0,0 +1,36 @@ +{ + "attrs": [ + { + "name": "to", + "sample": "slot-default", + "type": "String , Object", + "desc": "Route redirection object, which is the same as to in vue-router", + "defaultValue": "" + }, + { + "name": "replace", + "sample": "slot-default", + "type": "Boolean", + "desc": "When to is used for route redirection, if replace is enabled, no new record is added to history.", + "defaultValue": "The default value of this attribute is false." + } + ], + "slots": [ + { + "name": "default", + "sample": "slot-default", + "type": "", + "desc": "Default slot", + "defaultValue": "" + } + ], + "events": [ + { + "name": "select", + "sample": "select", + "type": "", + "desc": "This event is triggered when breadcrumb-item is clicked.", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/breadcrumb.json b/examples/docs/resources/pc/api/en-US/breadcrumb.json new file mode 100644 index 000000000..5331fc953 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/breadcrumb.json @@ -0,0 +1,91 @@ +{ + "attrs": [ + { + "name": "separator", + "sample": "separator", + "type": "String", + "desc": "Separator", + "defaultValue": "The default value of this attribute is /" + }, + { + "name": "separator-icon", + "sample": "separator", + "type": "Object", + "desc": "Icon separator class", + "defaultValue": "" + }, + { + "name": "options", + "sample": "options", + "type": "Array", + "desc": "Configure options. The tiny-breadcrumb component can be used independently.", + "defaultValue": "[]" + }, + { + "name": "textField", + "sample": "options", + "type": "Array", + "desc": "Specify the breadcrumb display field. This field is used together with options. The component defaults to label.", + "defaultValue": "[]" + } + ], + "events": [ + { + "name": "select", + "sample": "base", + "type": "Function", + "desc": "This event is triggered when breadcrumb-item is clicked.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "slot-default", + "type": "", + "desc": "Default slot", + "defaultValue": "" + } + ], + "breadcrumbItemAttrs": [ + { + "name": "to", + "sample": "slot-default", + "type": "String , Object", + "desc": "Route redirection object, which is the same as to of vue-router", + "defaultValue": "" + }, + { + "name": "replace", + "sample": "slot-default", + "type": "Boolean", + "desc": "When to is used for route redirection, if replace is enabled, no new record is added to history.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "label", + "sample": "base", + "type": "String", + "desc": "Define the breadcrumb display value.", + "defaultValue": "" + } + ], + "breadcrumbItemSlots": [ + { + "name": "default", + "sample": "slot-default", + "type": "", + "desc": "Default slot", + "defaultValue": "" + } + ], + "breadcrumbItemEvents": [ + { + "name": "select", + "sample": "base", + "type": "", + "desc": "This event is triggered when breadcrumb-item is clicked.", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/bulletin-board.json b/examples/docs/resources/pc/api/en-US/bulletin-board.json new file mode 100644 index 000000000..33d315a25 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/bulletin-board.json @@ -0,0 +1,53 @@ +{ + "attrs": [ + { + "name": "active-name", + "sample": "active-name", + "type": "String", + "desc": "By default, column 1 is displayed. You can select 1, 2, or 3.", + "defaultValue": "The default value of this attribute is 1." + }, + { + "name": "data", + "sample": "base", + "type": "Array", + "desc": "tab-item data; tab-item data", + "defaultValue": "" + }, + { + "name": "icon", + "sample": "icon", + "type": "Object , String", + "desc": "Font icon of the first information in tab-item; Font icon of the first piece of information in tab-item", + "defaultValue": "" + }, + { + "name": "show-more", + "sample": "more-link", + "type": "Boolean", + "desc": "Indicates whether to display the More button. The More button is displayed by default and must be used together with more-link.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "more-link", + "sample": "more-link", + "type": "Object", + "desc": "More button redirection URL. This parameter is valid only when show-more is set to true. moreLink: {url:'localhost:3000/', //Redirection address. Either the URL or route attribute must be selected. The URL has a higher priority. route:'Alert', //Redirection route. Either the URL or route attribute must be selected. URL has a high priority target: '_blank', //Redirection mode text: 'More' //Link text}", + "defaultValue": "" + }, + { + "name": "tab-title", + "sample": "tab-title", + "type": "Array", + "desc": "Data in the tab column", + "defaultValue": "" + }, + { + "name": "title", + "sample": "title", + "type": "String", + "desc": "Billboard title", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/button-group.json b/examples/docs/resources/pc/api/en-US/button-group.json new file mode 100644 index 000000000..3da21d4f8 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/button-group.json @@ -0,0 +1,85 @@ +{ + "attrs": [ + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "Sets whether the button group is disabled.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "Set the component size", + "defaultValue": "" + }, + { + "name": "data", + "sample": "data", + "type": "Array", + "desc": "button group data. Example: [{text: '', value: ''}]", + "defaultValue": "" + }, + { + "name": "value-field", + "sample": "text-value-field", + "type": "String", + "desc": "Field value of the button value.", + "defaultValue": "The default value of this attribute is value." + }, + { + "name": "text-field", + "sample": "text-value-field", + "type": "String", + "desc": "Field value of the button displayed text.", + "defaultValue": "The default value of this attribute is text." + }, + { + "name": "modelValue / v-model", + "sample": "base", + "type": "Number , String", + "desc": "Default value of the selected button.", + "defaultValue": "" + }, + { + "name": "plain", + "sample": "plain", + "type": "Boolean", + "desc": "Indicates whether the button is a simple button.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "show-more", + "sample": "show-more", + "type": "Number", + "desc": "Set the number of more buttons to be displayed.", + "defaultValue": "" + }, + { + "name": "show-edit", + "sample": "show-edit", + "type": "Boolean", + "desc": "Whether to display the edit button. This parameter takes effect only when more buttons are displayed.", + "defaultValue": "The default value of this attribute is false." + } + ], + "slots": [ + { + "name": "default", + "sample": "slot-default", + "type": "", + "desc": "button group content.", + "defaultValue": "" + } + ], + "events": [ + { + "name": "edit", + "sample": "edit", + "type": "", + "desc": "Set the callback function triggered when the edit button is clicked.", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/button.json b/examples/docs/resources/pc/api/en-US/button.json new file mode 100644 index 000000000..183d8eefe --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/button.json @@ -0,0 +1,106 @@ +{ + "attrs": [ + { + "name": "disabled", + "sample": "dynamic-disabled", + "type": "Boolean", + "desc": "Sets whether the button is disabled.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "native-type", + "sample": "icon", + "type": "String", + "desc": "Set the form type of the button and image buttons. This attribute is used only when type is set to button or image. ;Native type attribute; The options of this attribute are button / submit / reset", + "defaultValue": "The default value of this attribute is button." + }, + { + "name": "reset-time", + "sample": "reset-time", + "type": "Number", + "desc": "Set the button disable time, in milliseconds, to prevent repeated submission.", + "defaultValue": "The default value of this attribute is 1000." + }, + { + "name": "text", + "sample": "text", + "type": "String", + "desc": "Sets the text displayed on the button. The text can be internationalized.", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "Define the button size. The value of this attribute can be large, medium, small, or mini", + "defaultValue": "" + }, + { + "name": "type", + "sample": "type", + "type": "String", + "desc": "Displays different button states. The optional values of this attribute are primary / success / warning / danger / info / text", + "defaultValue": "" + }, + { + "name": "plain", + "sample": "plain", + "type": "Boolean", + "desc": "Simple button", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "round", + "sample": "round", + "type": "Boolean", + "desc": "Whether to round the corner button", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "circle", + "sample": "circle", + "type": "Boolean", + "desc": "Round button", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "loading", + "sample": "loading", + "type": "Boolean", + "desc": "Loading status", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "icon", + "sample": "icon", + "type": "Object , String", + "desc": "svg Image Object", + "defaultValue": "" + }, + { + "name": "autofocus", + "sample": "autofocus", + "type": "Boolean", + "desc": "Whether to focus by default", + "defaultValue": "The default value of this attribute is false." + } + ], + "slots": [ + { + "name": "default", + "sample": "image", + "type": "", + "desc": "Default slot", + "defaultValue": "" + } + ], + "events": [ + { + "name": "click", + "sample": "click", + "type": "", + "desc": "Sets the callback function triggered when a button is clicked.", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/calendar.json b/examples/docs/resources/pc/api/en-US/calendar.json new file mode 100644 index 000000000..e53746876 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/calendar.json @@ -0,0 +1,55 @@ +{ + "attrs": [ + { + "name": "events", + "sample": "dynamic-add-schedule", + "type": "Array", + "desc": "Event List", + "defaultValue": "" + }, + { + "name": "mode", + "sample": "calendar-mode", + "type": "String", + "desc": "Display mode. The value can be month or year. The default value is month.", + "defaultValue": "" + }, + { + "name": "month", + "sample": "custom-day-cell", + "type": "Number", + "desc": "Specified month. The default value is the current month.", + "defaultValue": "" + }, + { + "name": "show-selected", + "sample": "show-selected-date", + "type": "Boolean", + "desc": "Display the selected date.", + "defaultValue": "" + }, + { + "name": "year", + "sample": "custom-day-cell", + "type": "Number", + "desc": "Specified year. The default year is this year.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "day", + "sample": "custom-day-cell", + "type": "", + "desc": "Date Cell Slot", + "defaultValue": "" + }, + { + "name": "tool", + "sample": "custom-calendar-toolbar", + "type": "", + "desc": "Calendar Toolbar Slot", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/card-template.json b/examples/docs/resources/pc/api/en-US/card-template.json new file mode 100644 index 000000000..22ca20c6a --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/card-template.json @@ -0,0 +1,41 @@ +{ + "attrs": [ + { + "name": "body-style", + "sample": "", + "type": "", + "desc": "Set the style of the card body. The optional value of this attribute is --", + "defaultValue": "The default value of this attribute is --" + }, + { + "name": "header-line", + "sample": "", + "type": "Boolean", + "desc": "Specifies whether to display a split line in the card header. The default value is true.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "header", + "sample": "", + "type": "", + "desc": "Set the card header content, such as the title.", + "defaultValue": "" + }, + { + "name": "footer", + "sample": "", + "type": "", + "desc": "Set the content in the footer part of the card.", + "defaultValue": "" + }, + { + "name": "default", + "sample": "", + "type": "", + "desc": "Default slot, which is used to set the content of the card body.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/carousel-item.json b/examples/docs/resources/pc/api/en-US/carousel-item.json new file mode 100644 index 000000000..62d9d44b8 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/carousel-item.json @@ -0,0 +1,27 @@ +{ + "attrs": [ + { + "name": "name", + "sample": "manual-play", + "type": "String", + "desc": "Slide name, which can be used as a parameter of setActiveItem.", + "defaultValue": "" + }, + { + "name": "title", + "sample": "show-title", + "type": "String", + "desc": "Slide title.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "manual-play", + "type": "", + "desc": "Default slot", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/carousel.json b/examples/docs/resources/pc/api/en-US/carousel.json new file mode 100644 index 000000000..5273ad353 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/carousel.json @@ -0,0 +1,115 @@ +{ + "attrs": [ + { + "name": "arrow", + "sample": "up-down-carousel", + "type": "String", + "desc": "Switch the time when the arrow is displayed. The value of this attribute can be always / hover / never", + "defaultValue": "The default value of this attribute is hover." + }, + { + "name": "autoplay", + "sample": "autoplay", + "type": "Boolean", + "desc": "Indicates whether to perform automatic switchover.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "height", + "sample": "indicator-trigger", + "type": "String", + "desc": "Height of a horse-walking lantern.", + "defaultValue": "" + }, + { + "name": "indicator-position", + "sample": "indicator-trigger", + "type": "String", + "desc": "Position of the indicator. The optional values of this attribute are outside / none", + "defaultValue": "" + }, + { + "name": "initial-index", + "sample": "manual-play", + "type": "Number", + "desc": "Index of a slide that is initially activated, starting from 0.", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "interval", + "sample": "play-interval", + "type": "Number", + "desc": "Automatic switchover interval, in milliseconds.", + "defaultValue": "The default value of this attribute is 3000." + }, + { + "name": "show-title", + "sample": "show-title", + "type": "Boolean", + "desc": "Indicates whether to display the title.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "trigger", + "sample": "indicator-trigger", + "type": "String", + "desc": "Indicator triggering mode. The default value is hover. ;The optional value of this attribute is click", + "defaultValue": "The default value of this attribute is hover." + }, + { + "name": "type", + "sample": "card-mode", + "type": "String", + "desc": "Type of the horse-walking lantern; The value of this attribute can be horizontal / vertical / card", + "defaultValue": "The default value of this attribute is horizontal." + }, + { + "name": "loop", + "sample": "close-loop", + "type": "Boolean", + "desc": "Whether to display cyclically", + "defaultValue": "The default value of this attribute is true." + } + ], + "slots": [ + { + "name": "default", + "sample": "manual-play", + "type": "", + "desc": "Default slot", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "next", + "sample": "manual-play", + "type": "", + "desc": "Go to the next slide.", + "defaultValue": "" + }, + { + "name": "prev", + "sample": "manual-play", + "type": "", + "desc": "Switch to the previous slide", + "defaultValue": "" + }, + { + "name": "setActiveItem", + "sample": "manual-play", + "type": "", + "desc": "Switch slides manually", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "manual-play", + "type": "", + "desc": "Triggered upon slide switching", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/cascader-panel.json b/examples/docs/resources/pc/api/en-US/cascader-panel.json new file mode 100644 index 000000000..540e44bdf --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/cascader-panel.json @@ -0,0 +1,145 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "", + "desc": "Bound value of the selected item", + "defaultValue": "" + }, + { + "name": "options", + "sample": "change", + "type": "Array", + "desc": "Optional data source. The key name can be configured through the Props attribute.", + "defaultValue": "" + }, + { + "name": "props", + "sample": "cascader-panel-props", + "type": "Object", + "desc": "Configuration options. For details, see the CascaderPanel Props table.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-option-content", + "type": "", + "desc": "User-defined candidate node content. The parameter is {node, data}, which indicates the node object and data of the current node.", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "getCheckedNodes", + "sample": "change", + "type": "", + "desc": "Obtain the selected node. The parameter (leafOnly) indicates whether to obtain only subnodes. The default value is false", + "defaultValue": "" + }, + { + "name": "clearCheckedNodes", + "sample": "change", + "type": "", + "desc": "Clear selected nodes.", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "change", + "type": "Function(arg)", + "desc": "This event is triggered when the selected node changes. arg: The callback parameter is the value of the selected node (array type).", + "defaultValue": "" + }, + { + "name": "expand-change", + "sample": "change", + "type": "Functon(arg)", + "desc": "This event is triggered when the expanded node changes. arg: The callback parameter is an array (Array type) consisting of parent option values.", + "defaultValue": "" + } + ], + "caspanelprops": [ + { + "name": "expandTrigger", + "sample": "basic-usage", + "type": "String", + "desc": "The expansion mode of the secondary menu; The optional values of this attribute are click / hover", + "defaultValue": "click" + }, + { + "name": "multiple", + "sample": "default-multiple", + "type": "Boolean", + "desc": "Whether to select multiple options", + "defaultValue": "false" + }, + { + "name": "checkStrictly", + "sample": "check-strictly", + "type": "Boolean", + "desc": "Whether to strictly comply with the principle that parent and child nodes are not associated with each other", + "defaultValue": "false" + }, + { + "name": "emitPath", + "sample": "events", + "type": "Boolean", + "desc": "Indicates whether to return an array consisting of the values of menus at different levels of the selected node when the selected node is changed. If this parameter is set to false, only the value of the selected node is returned.", + "defaultValue": "true" + }, + { + "name": "lazy", + "sample": "auto-load", + "type": "Boolean", + "desc": "Whether to dynamically load subnodes. This parameter must be used together with the lazyLoad method.", + "defaultValue": "false" + }, + { + "name": "lazyLoad", + "sample": "auto-load", + "type": "Function(node, resolve)", + "desc": "Method for loading dynamic data. This parameter is valid only when lazy is set to true. Parameter description: node indicates the currently clicked node. resolve indicates the callback after data loading is complete (mandatory).", + "defaultValue": "" + }, + { + "name": "value", + "sample": "props-children", + "type": "String", + "desc": "The value of an option is the value of an attribute of the option object.", + "defaultValue": "'value'" + }, + { + "name": "label", + "sample": "props-children", + "type": "String", + "desc": "Specify that the option label is an attribute value of the option object.", + "defaultValue": "'label'" + }, + { + "name": "children", + "sample": "props-children", + "type": "String", + "desc": "Specifies that the sub-option of an option is an attribute value of the option object.", + "defaultValue": "'children'" + }, + { + "name": "disabled", + "sample": "disabled-items", + "type": "String", + "desc": "Specify that an option is disabled as an attribute value of the option object.", + "defaultValue": "'disabled'" + }, + { + "name": "leaf", + "sample": "check-strictly", + "type": "String", + "desc": "The flag bit of the leaf node of the specified option is an attribute value of the option object.", + "defaultValue": "'leaf'" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/cascader.json b/examples/docs/resources/pc/api/en-US/cascader.json new file mode 100644 index 000000000..5cb71c5bf --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/cascader.json @@ -0,0 +1,264 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "clearable", + "type": "", + "desc": "Bound value of the selected item", + "defaultValue": "" + }, + { + "name": "options", + "sample": "disabled-items", + "type": "Array", + "desc": "Optional data source. The key name can be configured through the Props attribute.", + "defaultValue": "" + }, + { + "name": "props", + "sample": "props-children", + "type": "Object", + "desc": "Configuration options. For details, see the Cascader Props table.", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "Add a class name for the popper. For details, see the popover component.", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether to insert a pop-up box to the body element. If an error occurs in locating a fault in the dialog box that is displayed, set this attribute to false (for details, see the select component).", + "defaultValue": "true" + }, + { + "name": "size", + "sample": "clearable2", + "type": "String", + "desc": "Dimension; The optional values of this attribute are medium / small / mini", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "filterable-multiple1", + "type": "String", + "desc": "Placeholder text in the text box", + "defaultValue": "Please select" + }, + { + "name": "disabled", + "sample": "disabled-items", + "type": "Boolean", + "desc": "Disable", + "defaultValue": "false" + }, + { + "name": "clearable", + "sample": "clearable", + "type": "Boolean", + "desc": "Whether to support the clear option", + "defaultValue": "false" + }, + { + "name": "show-all-levels", + "sample": "show-all-levels", + "type": "Boolean", + "desc": "Whether to display the full path of the selected value in the text box", + "defaultValue": "true" + }, + { + "name": "collapse-tags", + "sample": "collapse-tags", + "type": "Boolean", + "desc": "Whether to collapse tags in multi-choice mode", + "defaultValue": "false" + }, + { + "name": "separator", + "sample": "clearable1", + "type": "String", + "desc": "Option separator", + "defaultValue": "/" + }, + { + "name": "filterable", + "sample": "filterable", + "type": "Boolean", + "desc": "Whether to search for options", + "defaultValue": "" + }, + { + "name": "filter-method", + "sample": "filter-method", + "type": "Function(node, keyword)", + "desc": "Customize the search logic. The first parameter is node, and the second parameter is keyword. A Boolean value is returned to indicate whether the search is hit.", + "defaultValue": "" + }, + { + "name": "debounce", + "sample": "filterable", + "type": "Number", + "desc": "Dejitter delay of the search keyword, in milliseconds.", + "defaultValue": "300" + }, + { + "name": "before-filter", + "sample": "filter-method", + "type": "Function(value)", + "desc": "Hook before filtering. The parameter is the input value. If false is returned or Promise is returned and rejected, the filtering stops.", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "Customized floating layer class name", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "empty", + "sample": "filterable", + "type": "", + "desc": "Content when no matching option is found", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "getCheckedNodes", + "sample": "events", + "type": "", + "desc": "Obtain the selected node. The parameter (leafOnly) indicates whether to obtain only subnodes. The default value is false", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "events", + "type": "Fuction(arg)", + "desc": "This event is triggered when the selected node changes. arg: The callback parameter is the value of the selected node (array type).", + "defaultValue": "" + }, + { + "name": "expand-change", + "sample": "events", + "type": "Fuction(arg)", + "desc": "This event is triggered when the expanded node changes. arg: The callback parameter is an array (Array type) consisting of parent option values.", + "defaultValue": "" + }, + { + "name": "blur", + "sample": "events", + "type": "Fuction(arg)", + "desc": "This event is triggered when the focus is lost. arg: The callback parameter is (event: Event, type: Object).", + "defaultValue": "" + }, + { + "name": "focus", + "sample": "events", + "type": "Fuction(arg)", + "desc": "This event is triggered when the focus is obtained. arg: The callback parameter is (event: Event, type: Object).", + "defaultValue": "" + }, + { + "name": "visible-change", + "sample": "events", + "type": "Fuction(arg)", + "desc": "This event is triggered when the drop-down list box is displayed or hidden. arg: true if the callback parameter is present; false if the callback parameter is hidden (Boolean)", + "defaultValue": "" + }, + { + "name": "remove-tag", + "sample": "default-multiple", + "type": "Fuction(arg)", + "desc": "In multi-choice mode, this event is triggered when a tag is removed. arg: The callback parameter is the value of the node corresponding to the removed tag (array type).", + "defaultValue": "" + } + ], + "casprops": [ + { + "name": "expandTrigger", + "sample": "basic-usage", + "type": "String", + "desc": "The expansion mode of the secondary menu; The optional values of this attribute are click / hover", + "defaultValue": "click" + }, + { + "name": "multiple", + "sample": "default-multiple", + "type": "Boolean", + "desc": "Whether to select multiple options", + "defaultValue": "false" + }, + { + "name": "checkStrictly", + "sample": "check-strictly", + "type": "Boolean", + "desc": "Whether to strictly comply with the principle that parent and child nodes are not associated with each other", + "defaultValue": "false" + }, + { + "name": "emitPath", + "sample": "events", + "type": "Boolean", + "desc": "Indicates whether to return an array consisting of the values of menus at different levels of the selected node when the selected node is changed. If this parameter is set to false, only the value of the selected node is returned.", + "defaultValue": "true" + }, + { + "name": "lazy", + "sample": "auto-load", + "type": "Boolean", + "desc": "Whether to dynamically load subnodes. This parameter must be used together with the lazyLoad method.", + "defaultValue": "false" + }, + { + "name": "lazyLoad", + "sample": "auto-load", + "type": "Function(node, resolve)", + "desc": "Method for loading dynamic data. This parameter is valid only when lazy is set to true. Parameter description: node indicates the currently clicked node. resolve indicates the callback after data loading is complete (mandatory).", + "defaultValue": "" + }, + { + "name": "value", + "sample": "props-children", + "type": "String", + "desc": "The value of an option is the value of an attribute of the option object.", + "defaultValue": "'value'" + }, + { + "name": "label", + "sample": "props-children", + "type": "String", + "desc": "Specify that the option label is an attribute value of the option object.", + "defaultValue": "'label'" + }, + { + "name": "children", + "sample": "props-children", + "type": "String", + "desc": "Specifies that the sub-option of an option is an attribute value of the option object.", + "defaultValue": "'children'" + }, + { + "name": "disabled", + "sample": "disabled-items", + "type": "String", + "desc": "Specify that an option is disabled as an attribute value of the option object.", + "defaultValue": "'disabled'" + }, + { + "name": "leaf", + "sample": "check-strictly", + "type": "String", + "desc": "The flag bit of the leaf node of the specified option is an attribute value of the option object.", + "defaultValue": "'leaf'" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/chart-data.json b/examples/docs/resources/pc/api/en-US/chart-data.json new file mode 100644 index 000000000..b438375e3 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/chart-data.json @@ -0,0 +1,18 @@ +{ + "attrs": [ + { + "name": "columns", + "sample": "", + "type": "array", + "desc": "A collection of dimensions and indicators. Most charts in a chart have a single dimension and multiple indicators. Therefore, the first value is a dimension by default, and the remaining values are indicators.", + "defaultValue": "" + }, + { + "name": "rows", + "sample": "", + "type": "array", + "desc": "Data set", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/chart-pie.json b/examples/docs/resources/pc/api/en-US/chart-pie.json new file mode 100644 index 000000000..96812d4b3 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/chart-pie.json @@ -0,0 +1,109 @@ +{ + "attrs": [ + { + "name": "dimension", + "sample": "", + "type": "String", + "desc": "Dimension. By default, the first item in columns is a dimension.", + "defaultValue": "" + }, + { + "name": "metrics", + "sample": "", + "type": "String", + "desc": "Indicator. By default, the second column is an indicator.", + "defaultValue": "" + }, + { + "name": "dataType", + "sample": "", + "type": "String", + "desc": "Data type; The optional values of this attribute are KMB, normal, percent", + "defaultValue": "" + }, + { + "name": "legendLimit", + "sample": "", + "type": "Number", + "desc": "The number of displayed legends is limited. If the number of legends is too large, the pie chart style is incorrect. If the number of legends exceeds the maximum value, the legend can be hidden to solve this problem.", + "defaultValue": "" + }, + { + "name": "selectedMode", + "sample": "", + "type": "Number", + "desc": "Selected mode; The value of this attribute can be single or multiple", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "hoverAnimation", + "sample": "", + "type": "Boolean", + "desc": "Whether to enable the zoom-in animation effect of hovering on a sector", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "radius", + "sample": "", + "type": "Number", + "desc": "Pie Chart Radius", + "defaultValue": "" + }, + { + "name": "offsetY", + "sample": "", + "type": "Number", + "desc": "Longitudinal offset", + "defaultValue": "" + }, + { + "name": "digit", + "sample": "", + "type": "Number", + "desc": "Set the number of bits reserved when the data type is percent.", + "defaultValue": "The default value of this attribute is 2" + }, + { + "name": "roseType", + "sample": "", + "type": "String", + "desc": "The Nightingale rose chart is displayed. By default, the Nightingale rose chart is not displayed.", + "defaultValue": "The default value of this attribute is radius, area." + }, + { + "name": "label", + "sample": "", + "type": "Object", + "desc": "Text label on the pie chart", + "defaultValue": "" + }, + { + "name": "labelLine", + "sample": "", + "type": "Object", + "desc": "Label visual guide line style", + "defaultValue": "" + }, + { + "name": "itemStyle", + "sample": "", + "type": "Object", + "desc": "Graph Style", + "defaultValue": "" + }, + { + "name": "level", + "sample": "", + "type": "array", + "desc": "This parameter is set when there are multiple pie charts.", + "defaultValue": "" + }, + { + "name": "limitShowNum", + "sample": "", + "type": "Number", + "desc": "If the value of this parameter exceeds the value of this parameter, replace it with'Other'. In this case, data is displayed in descending order.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/chart.json b/examples/docs/resources/pc/api/en-US/chart.json new file mode 100644 index 000000000..adc0c6664 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/chart.json @@ -0,0 +1,130 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "chart/attributes-demo#props-demo10", + "type": "Object", + "desc": "Data consists of indicators and dimensions. Dimension refers to data attributes, and indicator refers to quantitative measurement standards.", + "defaultValue": "" + }, + { + "name": "settings", + "sample": "", + "type": "Object", + "desc": "Configuration item. For details about the attributes of each chart, see the chart details page.", + "defaultValue": "" + }, + { + "name": "width", + "sample": "chart/attributes-demo#props-demo10", + "type": "String", + "desc": "Set the width of the chart container.", + "defaultValue": "The default value of this attribute is auto." + }, + { + "name": "height", + "sample": "chart/attributes-demo#props-demo10", + "type": "String", + "desc": "Set the height of the chart container.", + "defaultValue": "The default value of this attribute is 400px." + }, + { + "name": "events", + "sample": "chart/events#events-base", + "type": "Object", + "desc": "Event binding", + "defaultValue": "" + }, + { + "name": "init-options", + "sample": "chart/attributes-demo#props-demo10", + "type": "Object", + "desc": "Init Additional Parameters", + "defaultValue": "" + }, + { + "name": "tooltip-visible", + "sample": "chart/attributes-demo#props-demo10", + "type": "Boolean", + "desc": "Display dialog box", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "legend-visible", + "sample": "chart/attributes-demo#props-demo10", + "type": "Boolean", + "desc": "Display legend", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "theme", + "sample": "chart#base", + "type": "Object", + "desc": "User-defined theme name. ;User-defined theme object.", + "defaultValue": "" + }, + { + "name": "theme-name", + "sample": "chart#base", + "type": "String", + "desc": "User-defined theme name. If theme-name is set, the theme is invalid.", + "defaultValue": "" + }, + { + "name": "judge-width", + "sample": "chart/events#events-base", + "type": "Boolean", + "desc": "Do you want to process the width issue when generating charts?", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "width-change-delay", + "sample": "chart/question#question-base", + "type": "Number", + "desc": "Container width change delay", + "defaultValue": "The default value of this attribute is 300." + }, + { + "name": "resizeable", + "sample": "chart/question#question-base", + "type": "Boolean", + "desc": "Whether to process the window resize event", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "cancel-resize-check", + "sample": "chart/question#question-base", + "type": "Boolean", + "desc": "Whether to disable container detection during resize", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "resize-delay", + "sample": "chart/attributes-demo#props-demo10", + "type": "Number", + "desc": "Delay of the window resize event callback", + "defaultValue": "The default value of this attribute is 200." + }, + { + "name": "change-delay", + "sample": "chart/question#question-base", + "type": "Number", + "desc": "Delay for triggering chart redrawing callback after attribute modification", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "set-option-opts", + "sample": "", + "type": "Boolean , Object", + "desc": "Echarts setOption second parameter", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "not-set-unchange", + "sample": "", + "type": "Array", + "desc": "The setOption attribute does not change.", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/checkbox-button.json b/examples/docs/resources/pc/api/en-US/checkbox-button.json new file mode 100644 index 000000000..cbe9cbdbc --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/checkbox-button.json @@ -0,0 +1,76 @@ +{ + "attrs": [ + { + "name": "label", + "sample": "checkbox-group", + "type": "String , Number , Boolean", + "desc": "Value in the selected state (This parameter is valid only when checkbox-group or the bound object type is array.) The optional value of this attribute is medium-", + "defaultValue": "" + }, + { + "name": "true-label", + "sample": "text", + "type": "String , Number", + "desc": "Value when selected", + "defaultValue": "" + }, + { + "name": "false-label", + "sample": "text", + "type": "String , Number", + "desc": "Value when no option is selected", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "with-border", + "type": "Boolean", + "desc": "Disable", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "name", + "sample": "checkbox-group", + "type": "String", + "desc": "Native name attribute", + "defaultValue": "" + }, + { + "name": "text", + "sample": "text", + "type": "String", + "desc": "Text", + "defaultValue": "The default value of this attribute is Function." + }, + { + "name": "modelValue / v-model", + "sample": "checkbox-button", + "type": "String , Number , Boolean", + "desc": "Bound Value", + "defaultValue": "" + }, + { + "name": "events", + "sample": "checkbox-group", + "type": "Object", + "desc": "Native event", + "defaultValue": "" + }, + { + "name": "checked", + "sample": "checkbox-button", + "type": "Boolean", + "desc": "Currently selected", + "defaultValue": "The default value of this attribute is false." + } + ], + "slots": [ + { + "name": "default", + "sample": "with-border", + "type": "", + "desc": "Checkbox-button content", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/checkbox-group.json b/examples/docs/resources/pc/api/en-US/checkbox-group.json new file mode 100644 index 000000000..73a4911a6 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/checkbox-group.json @@ -0,0 +1,92 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "checkbox-group", + "type": "Array", + "desc": "Bound Value", + "defaultValue": "" + }, + { + "name": "size", + "sample": "with-border", + "type": "String", + "desc": "Size of the check box group. This parameter is valid only for the check box with buttons or borders. The optional values of this attribute are medium / small / mini", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "with-border", + "type": "Boolean", + "desc": "Disable", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "min", + "sample": "min-max", + "type": "Number", + "desc": "Minimum number of checkboxes that can be selected", + "defaultValue": "" + }, + { + "name": "max", + "sample": "min-max", + "type": "Number", + "desc": "Maximum number of checkboxes that can be selected", + "defaultValue": "" + }, + { + "name": "text-color", + "sample": "vertical-checkbox", + "type": "String", + "desc": "Text color when the checkbox in button mode is activated", + "defaultValue": "The default value of this attribute is #ffffff." + }, + { + "name": "fill", + "sample": "checkbox-button", + "type": "String", + "desc": "Fill color and border color when the checkbox in button mode is activated", + "defaultValue": "The default value of this attribute is #409EFF" + }, + { + "name": "options", + "sample": "checkbox-group", + "type": "Array", + "desc": "Checkbox component list", + "defaultValue": "" + }, + { + "name": "type", + "sample": "checkbox-group", + "type": "String", + "desc": "Checkbox component type (button/checkbox)", + "defaultValue": "The default value of this attribute is checkbox, which is used together with the options attribute." + }, + { + "name": "vertical", + "sample": "vertical-checkbox", + "type": "Boolean", + "desc": "Set the component arrangement mode. Sets whether the check boxes are arranged vertically. The value of this attribute can be true or false", + "defaultValue": "The default value of this attribute is false." + } + ], + "slots": [ + { + "name": "default", + "sample": "checkbox-group", + "type": "", + "desc": "Checkbox Option Group", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "dynamic-create-checkbox", + "type": "", + "desc": "This event is triggered when the binding value changes.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/checkbox.json b/examples/docs/resources/pc/api/en-US/checkbox.json new file mode 100644 index 000000000..4afad419c --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/checkbox.json @@ -0,0 +1,99 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "checkbox-group", + "type": "String , Number , Boolean", + "desc": "Bound Value", + "defaultValue": "" + }, + { + "name": "label", + "sample": "indeterminate", + "type": "String , Number , Boolean", + "desc": "Selected value (This parameter is valid only when checkbox-group or the bound object type is array.)", + "defaultValue": "" + }, + { + "name": "true-label", + "sample": "text", + "type": "String , Number", + "desc": "Value when selected", + "defaultValue": "" + }, + { + "name": "false-label", + "sample": "text", + "type": "String , Number", + "desc": "Value when no option is selected", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "checked", + "type": "Boolean", + "desc": "Disable", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "border", + "sample": "content-overflow", + "type": "Boolean", + "desc": "Display border", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "size", + "sample": "with-border", + "type": "String", + "desc": "Checkbox size. This parameter is valid only when border is set to true. The optional values of this attribute are medium / small / mini", + "defaultValue": "" + }, + { + "name": "name", + "sample": "checkbox-group", + "type": "String", + "desc": "Native name attribute", + "defaultValue": "" + }, + { + "name": "checked", + "sample": "checked", + "type": "Boolean", + "desc": "Currently selected", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "indeterminate", + "sample": "indeterminate", + "type": "Boolean", + "desc": "Sets the indeterminate state and controls only the style.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "text", + "sample": "text", + "type": "String", + "desc": "Text displayed in the check box", + "defaultValue": "The default value of this attribute is null." + } + ], + "slots": [ + { + "name": "default", + "sample": "checkbox-slot", + "type": "", + "desc": "Checkbox content", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "checkbox-events", + "type": "", + "desc": "This event is triggered when the binding value changes.", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/col.json b/examples/docs/resources/pc/api/en-US/col.json new file mode 100644 index 000000000..30bba642c --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/col.json @@ -0,0 +1,83 @@ +{ + "attrs": [ + { + "name": "lg", + "sample": "base", + "type": "Number , Object", + "desc": "Number of responsive grids or grid attribute objects greater than or equal to 1200px, for example, {span: 4, offset: 4}.", + "defaultValue": "" + }, + { + "name": "md", + "sample": "base", + "type": "Number , Object", + "desc": "Number of responsive grids or grid attribute objects greater than or equal to 992px, for example, {span: 4, offset: 4}.", + "defaultValue": "" + }, + { + "name": "no", + "sample": "base", + "type": "Number", + "desc": "Sort ID (valid when order is enabled in a row). The default value is 0.", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "offset", + "sample": "base", + "type": "Number", + "desc": "Number of grids on the left of the grid. The default value is 0.", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "sm", + "sample": "base", + "type": "Number , Object", + "desc": "Number of responsive grids or grid attribute objects greater than or equal to 768 pixels, for example, {span: 4, offset: 4}.", + "defaultValue": "" + }, + { + "name": "span", + "sample": "base", + "type": "Number", + "desc": "Number of columns occupied by a grid", + "defaultValue": "The default value of this attribute is 12" + }, + { + "name": "tag", + "sample": "base", + "type": "String", + "desc": "User-defined element label. Any label can be selected. The optional value of this attribute is *", + "defaultValue": "The default value of this attribute is div." + }, + { + "name": "xl", + "sample": "base", + "type": "Number , Object", + "desc": "Number of responsive grids or grid attribute objects greater than or equal to 1920px, for example, {span: 4, offset: 4}.", + "defaultValue": "" + }, + { + "name": "xs", + "sample": "base", + "type": "Number , Object", + "desc": "<768px responsive grids or grid attribute objects, for example, {span: 4, offset: 4}.", + "defaultValue": "" + }, + { + "name": "move", + "sample": "base", + "type": "Number", + "desc": "Number of grids that move left and right (positive numbers to the right, negative numbers to the left)", + "defaultValue": "The default value of this attribute is 0" + } + ], + "slots": [ + { + "name": "default", + "sample": "base", + "type": "", + "desc": "Default slot", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/collapse-item.json b/examples/docs/resources/pc/api/en-US/collapse-item.json new file mode 100644 index 000000000..6202d32f7 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/collapse-item.json @@ -0,0 +1,48 @@ +{ + "attrs": [ + { + "name": "name", + "sample": "accordion", + "type": "String | Number", + "desc": "Unique identifier", + "defaultValue": "" + }, + { + "name": "title", + "sample": "custom-collapse-title", + "type": "String", + "desc": "Panel Title", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "Disable", + "defaultValue": "The default value of this attribute is false." + } + ], + "slots": [ + { + "name": "default", + "sample": "dynamic-disable", + "type": "", + "desc": "Default slot", + "defaultValue": "" + }, + { + "name": "title", + "sample": "custom-collapse-title", + "type": "", + "desc": "Title", + "defaultValue": "" + }, + { + "name": "icon", + "sample": "custom-collapse-icon", + "type": "", + "desc": "Expand and collapse the icon.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/collapse.json b/examples/docs/resources/pc/api/en-US/collapse.json new file mode 100644 index 000000000..567f38de0 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/collapse.json @@ -0,0 +1,43 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "accordion", + "type": "String , Array , Number", + "desc": "Currently activated panel (In accordion mode, the binding value type must be String. Otherwise, the binding value type is array.)", + "defaultValue": "" + }, + { + "name": "accordion", + "sample": "accordion", + "type": "Boolean", + "desc": "In accordion mode", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "before-close", + "sample": "block-close", + "type": "Function", + "desc": "Do not close the folding panel.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "dynamic-disable", + "type": "", + "desc": "Default slot", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "collapse-events", + "type": "", + "desc": "Triggered when the current active panel changes. (In accordion mode, the type of activeNames is String. Otherwise, the type of activeNames is array.)", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/company.json b/examples/docs/resources/pc/api/en-US/company.json new file mode 100644 index 000000000..1c9bbb1b0 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/company.json @@ -0,0 +1,67 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "custom-show-num", + "type": "String , Number", + "desc": "Set the value of the drop-down list box.", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "custom-service", + "type": "String", + "desc": "Set the placeholder text in the text box.", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "Add a class name for the popper. For details, see the popover component.", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether to insert the pop-up box to the body element. If a fault occurs in locating the fault in the dialog box that is displayed, you can set this attribute to false (for details, see the select component).", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "max", + "sample": "custom-show-num", + "type": "Number", + "desc": "Native attribute. Set the maximum value.", + "defaultValue": "The default value of this attribute is 1000." + }, + { + "name": "fetchCompany", + "sample": "custom-service", + "type": "Function", + "desc": "The fetchCompany interface returns a Promise object.", + "defaultValue": "" + }, + { + "name": "fields", + "sample": "custom-service", + "type": "Object", + "desc": "Customized company data mapping. This parameter is mandatory when the framework service is not used.", + "defaultValue": "" + }, + { + "name": "clearable", + "sample": "custom-show-num", + "type": "Boolean", + "desc": "Whether to display the Clear button; Clearable", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "disabled", + "sample": "", + "type": "Boolean", + "desc": "Disabled", + "defaultValue": "The default value of this attribute is false." + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/container.json b/examples/docs/resources/pc/api/en-US/container.json new file mode 100644 index 000000000..b17997c7c --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/container.json @@ -0,0 +1,62 @@ +{ + "attrs": [ + { + "name": "aside-width", + "sample": "custom-with-height", + "type": "Number , String", + "desc": "Left width", + "defaultValue": "The default value of this attribute is 200." + }, + { + "name": "footer-height", + "sample": "custom-with-height", + "type": "Number , String", + "desc": "Height at the bottom", + "defaultValue": "The default value of this attribute is 60." + }, + { + "name": "header-height", + "sample": "custom-with-height", + "type": "Number , String", + "desc": "Head height", + "defaultValue": "The default value of this attribute is 60." + }, + { + "name": "pattern", + "sample": "custom-container", + "type": "String", + "desc": "Measurement type; The optional values of this attribute are default / simple / legend / classic / fashion", + "defaultValue": "The default value of this attribute is default." + } + ], + "slots": [ + { + "name": "default", + "sample": "basic-usage", + "type": "", + "desc": "Main Content", + "defaultValue": "" + }, + { + "name": "header", + "sample": "basic-usage", + "type": "", + "desc": "Header Content", + "defaultValue": "" + }, + { + "name": "aside", + "sample": "basic-usage", + "type": "", + "desc": "Side Content", + "defaultValue": "" + }, + { + "name": "footer", + "sample": "classic", + "type": "", + "desc": "Bottom Content", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/country.json b/examples/docs/resources/pc/api/en-US/country.json new file mode 100644 index 000000000..f87e29fa5 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/country.json @@ -0,0 +1,60 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "String , number", + "desc": "Set the value of the drop-down list box.", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "basic-usage", + "type": "String", + "desc": "Set the placeholder text in the text box.", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "Add a class name for the popper. For details, see the popover component.", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether to insert the pop-up box to the body element. If a fault occurs in locating the fault in the dialog box that is displayed, you can set this attribute to false (for details, see the select component).", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "fetchCountry", + "sample": "custom-service", + "type": "Function", + "desc": "The user-defined country query interface returns a Promise object. This parameter is mandatory when the framework service is not used.", + "defaultValue": "" + }, + { + "name": "fields", + "sample": "custom-service", + "type": "Object", + "desc": "Customized data mapping. This parameter is mandatory when the framework service is not used.", + "defaultValue": "" + }, + { + "name": "clearable", + "sample": "custom-service", + "type": "Boolean", + "desc": "Whether to display the Clear button; Clearable", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "disabled", + "sample": "", + "type": "Boolean", + "desc": "Disabled", + "defaultValue": "The default value of this attribute is false." + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/credit-card-form.json b/examples/docs/resources/pc/api/en-US/credit-card-form.json new file mode 100644 index 000000000..4e1d3e4ac --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/credit-card-form.json @@ -0,0 +1,62 @@ +{ + "attrs": [ + { + "name": "background-image", + "sample": "background-image", + "type": "String , Object", + "desc": "Set the background image of the card.", + "defaultValue": "" + }, + { + "name": "form-data", + "sample": "basic-usage", + "type": "Object", + "desc": "Setting Credit Card Display Data", + "defaultValue": "//The default value of this attribute is \n{cardCvv: '',cardName: '',cardYear: '',cardMonth: '',cardNumber: ''}" + } + ], + "events": [ + { + "name": "submit", + "sample": "credit-card-form-events", + "type": "", + "desc": "Event triggered upon submission", + "defaultValue": "" + }, + { + "name": "input-card-number", + "sample": "credit-card-form-events", + "type": "", + "desc": "Event triggered when a card number is entered", + "defaultValue": "" + }, + { + "name": "input-card-name", + "sample": "credit-card-form-events", + "type": "", + "desc": "Event triggered when a card holder is entered", + "defaultValue": "" + }, + { + "name": "input-card-month", + "sample": "credit-card-form-events", + "type": "", + "desc": "Event triggered when a month is selected", + "defaultValue": "" + }, + { + "name": "input-card-year", + "sample": "credit-card-form-events", + "type": "", + "desc": "Event triggered when the year is selected", + "defaultValue": "" + }, + { + "name": "input-card-cvv", + "sample": "credit-card-form-events", + "type": "", + "desc": "CVV input event triggered", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/credit-card.json b/examples/docs/resources/pc/api/en-US/credit-card.json new file mode 100644 index 000000000..74fe61c6d --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/credit-card.json @@ -0,0 +1,32 @@ +{ + "attrs": [ + { + "name": "background-image", + "sample": "", + "type": "String , Object", + "desc": "Set the background image of the card.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "lables", + "sample": "", + "type": "Object", + "desc": "Setting Credit Card Display Data", + "defaultValue": "//The default value of this attribute is \n{cardCvv: '',cardName: '',cardYear: '',cardMonth: '',cardNumber: ''}" + }, + { + "name": "fields", + "sample": "", + "type": "Object", + "desc": "ID of the text box in the form corresponding to the item displayed on the card", + "defaultValue": "" + }, + { + "name": "is-card-number-masked", + "sample": "", + "type": "Boolean", + "desc": "Whether the card number is coded", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/crop.json b/examples/docs/resources/pc/api/en-US/crop.json new file mode 100644 index 000000000..cccf012b9 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/crop.json @@ -0,0 +1,302 @@ +{ + "attrs": [ + { + "name": "crop-type", + "sample": "get-cropped-canvas", + "type": "String", + "desc": "Type of the image that is returned after cropping. The value can be blob or base64. The default value is base64.", + "defaultValue": "" + }, + { + "name": "preview", + "sample": "", + "type": "Boolean", + "desc": "Specifies whether images in the cropping area can be previewed. The default value is false.", + "defaultValue": "" + }, + { + "name": "quality", + "sample": "", + "type": "Number", + "desc": "Set the compression ratio of the cropped image. The value ranges from 0 to 1. The default value is 0.92.", + "defaultValue": "" + }, + { + "name": "src", + "sample": "no-background", + "type": "String", + "desc": "Default cropped source image", + "defaultValue": "" + }, + { + "name": "view-mode", + "sample": "view-mode", + "type": "Number", + "desc": "Defines the view mode of the cropper. The default value is 0. 0: no restriction. The value 3 can be moved out of the value 2. 1:3 can only be moved within 2. The 2:2 picture is not completely covered with 1 (i.e., there may be gaps on one side when the picture is zoomed out). 3: 2 The image fills the entire 1.", + "defaultValue": "" + }, + { + "name": "drag-mode", + "sample": "drag-mode", + "type": "String", + "desc": "Defines the drag mode of the cropper. The default value is'crop'. 'Crop': A new crop box 3 can be generated. 'move': Only image 3 can be moved. 'none': no action is required.", + "defaultValue": "" + }, + { + "name": "aspect-ratio", + "sample": "aspect-ratio", + "type": "Number", + "desc": "Aspect-to-height ratio of the crop box; The default value is 16 / 9", + "defaultValue": "" + }, + { + "name": "max-size", + "sample": "", + "type": "String", + "desc": "Set the maximum size of the image to be cropped. The default value is 1 MB. The default value is 1M", + "defaultValue": "" + }, + { + "name": "modal", + "sample": "no-modal", + "type": "Boolean", + "desc": "Whether to display the black mode below the cropping box above the image; The default value is true.", + "defaultValue": "" + }, + { + "name": "guides", + "sample": "no-guides", + "type": "Boolean", + "desc": "Whether to display dotted lines above the crop box; The default value is true.", + "defaultValue": "" + }, + { + "name": "center", + "sample": "aspect-ratio", + "type": "Boolean", + "desc": "Whether the cropping frame is in the center of the image; The default value is true.", + "defaultValue": "" + }, + { + "name": "background", + "sample": "no-background", + "type": "Boolean", + "desc": "Whether to display the grid background of the container; The default value is true.", + "defaultValue": "" + }, + { + "name": "movable", + "sample": "drag-mode", + "type": "Boolean", + "desc": "Indicates whether the image can be moved. The default value is true.", + "defaultValue": "" + }, + { + "name": "rotatable", + "sample": "replace-image", + "type": "Boolean", + "desc": "Indicates whether images can be rotated. The default value is true.", + "defaultValue": "" + }, + { + "name": "zoomable", + "sample": "replace-image", + "type": "Boolean", + "desc": "Whether to allow image zooming in; The default value is true.", + "defaultValue": "" + }, + { + "name": "zoom-on-wheel", + "sample": "zoom-on-wheel", + "type": "Boolean", + "desc": "Specifies whether you can zoom in or out an image by scrolling the mouse wheel. The default value is true.", + "defaultValue": "" + }, + { + "name": "wheel-zoom-ratio", + "sample": "wheel-zoom-ratio", + "type": "Number", + "desc": "Define the scaling ratio when moving the image with the mouse. The default value is 0.1", + "defaultValue": "" + }, + { + "name": "min-container-width", + "sample": "min-crop-box-width-height", + "type": "Number", + "desc": "Minimum width of a container; The default value is 652", + "defaultValue": "" + }, + { + "name": "min-container-height", + "sample": "min-crop-box-width-height", + "type": "Number", + "desc": "Minimum height of a container; The default value is 300", + "defaultValue": "" + }, + { + "name": "min-crop-box-width", + "sample": "min-crop-box-width-height", + "type": "Number", + "desc": "Minimum width of the cropping layer; The default value is 0", + "defaultValue": "" + }, + { + "name": "min-crop-box-height", + "sample": "min-crop-box-width-height", + "type": "Number", + "desc": "Minimum height of the crop layer; The default value is 0", + "defaultValue": "" + }, + { + "name": "auto-crop", + "sample": "auto-crop-area", + "type": "Boolean", + "desc": "Indicates whether to automatically display the crop box during initialization. The default value is true.", + "defaultValue": "" + }, + { + "name": "auto-crop-area", + "sample": "auto-crop-area", + "type": "Number", + "desc": "Defines the automatic cropping area size (percentage). The default value is 0.8", + "defaultValue": "" + }, + { + "name": "cropvisible", + "sample": "min-crop-box-width-height", + "type": "Boolean", + "desc": "Set whether the cropping dialog box is visible. The default value is false", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "getCroppedCanvas", + "sample": "get-cropped-canvas", + "type": "", + "desc": "Obtain the cropped image data. .getCroppedCanvas().toDataURL(): Convert the image to a Base64 image. .getCroppedCanvas().toBlob(): Generate Blob image data", + "defaultValue": "" + }, + { + "name": "replace", + "sample": "replace-image", + "type": "", + "desc": "Replace the image src and rebuild the cropper. The parameter is the image URL.", + "defaultValue": "" + }, + { + "name": "clear", + "sample": "get-data", + "type": "", + "desc": "Clear the cropping box", + "defaultValue": "" + }, + { + "name": "getData", + "sample": "get-data", + "type": "", + "desc": "Obtain the position and size of the final cropped region (based on the natural size of the original image). The parameter is rounded. The default value is false. If this parameter is set to true, all data can be obtained. The returned data type is Object", + "defaultValue": "" + }, + { + "name": "getContainerData", + "sample": "get-container-data", + "type": "", + "desc": "Obtain the container size data. The returned data type is Object", + "defaultValue": "" + }, + { + "name": "getImageData", + "sample": "get-image-data", + "type": "", + "desc": "Obtain the image position, size, and other related data. The returned data type is Object", + "defaultValue": "" + }, + { + "name": "getCanvasData", + "sample": "get-image-data", + "type": "", + "desc": "Obtain the position and size of the canvas Canvas (image wrapper). The returned data type is Object", + "defaultValue": "" + }, + { + "name": "getCropBoxData", + "sample": "get-crop-box-data", + "type": "", + "desc": "Obtain the position and size of the clip box. The returned data type is Object", + "defaultValue": "" + }, + { + "name": "setAspectRatio", + "sample": "aspect-ratio", + "type": "", + "desc": "Change the aspect ratio of the cutting frame; The parameter is (aspectRatio) and the type is Number. The value is a positive number.", + "defaultValue": "" + }, + { + "name": "disable", + "sample": "crop-meth", + "type": "", + "desc": "Disable the cropping box (the cropping box cannot be moved).", + "defaultValue": "" + }, + { + "name": "enable", + "sample": "event-ready", + "type": "", + "desc": "Enable the cropping box", + "defaultValue": "" + }, + { + "name": "destroy", + "sample": "event-ready", + "type": "", + "desc": "Destroy the cropper and delete the entire cropper from the image.", + "defaultValue": "" + } + ], + "events": [ + { + "name": "ready", + "sample": "event-ready", + "type": "", + "desc": "This event is triggered when a cropper instance is completely built.", + "defaultValue": "" + }, + { + "name": "cropdata", + "sample": "event-about-crop", + "type": "Function(data)", + "desc": "The tailored data can be obtained from the cropdata event callback function. The default value is Base64 data.", + "defaultValue": "" + }, + { + "name": "cropstart", + "sample": "event-about-crop", + "type": "", + "desc": "Triggered when the canvas (image wrapper) or clipping box starts to change; The callback parameter is (event: Event)", + "defaultValue": "" + }, + { + "name": "cropmove", + "sample": "event-about-crop", + "type": "", + "desc": "Triggered when the canvas (image wrapper) or clipping box is changing; The callback parameter is (event: Event)", + "defaultValue": "" + }, + { + "name": "cropend", + "sample": "event-about-crop", + "type": "", + "desc": "Triggered when the canvas (image wrapper) or clipping box changes. The callback parameter is (event: Event)", + "defaultValue": "" + }, + { + "name": "crop", + "sample": "event-about-crop", + "type": "Function(value)", + "desc": "Triggered when the canvas (image wrapper) or crop box changes; The callback parameter is (event: Event), native event", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/currency.json b/examples/docs/resources/pc/api/en-US/currency.json new file mode 100644 index 000000000..6642faee2 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/currency.json @@ -0,0 +1,67 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "String , Number", + "desc": "Set the value of the drop-down list box.", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "disable-currency", + "type": "String", + "desc": "Set the prompt placeholder text in the text box.", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "Add a class name for the popper. For details, see the popover component.", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether to insert the pop-up box to the body element. If an error occurs in locating a fault in the dialog box that is displayed, set this attribute to false (for details, see the select component).", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "fetch-currency", + "sample": "custom-service", + "type": "Function", + "desc": "The user-defined amount query interface returns a Promise object.", + "defaultValue": "" + }, + { + "name": "fields", + "sample": "custom-service", + "type": "Object", + "desc": "User-defined data mapping. This parameter is mandatory when the framework service is not used.", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "Size of the text box. This parameter is valid only when type!=\"textarea\". The optional values of this attribute are medium / small / mini", + "defaultValue": "" + }, + { + "name": "clearable", + "sample": "custom-service", + "type": "Boolean", + "desc": "Whether to display the Clear button; Clearable", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "disabled", + "sample": "disable-currency", + "type": "Boolen", + "desc": "Disabled", + "defaultValue": "The default value of this attribute is false." + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/date-picker-date-format.json b/examples/docs/resources/pc/api/en-US/date-picker-date-format.json new file mode 100644 index 000000000..2a2191198 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/date-picker-date-format.json @@ -0,0 +1,137 @@ +{ + "attrs": [ + { + "name": "yyyy", + "sample": "date", + "type": "", + "desc": "Year", + "defaultValue": "The default value of this attribute is 2017." + }, + { + "name": "M", + "sample": "date", + "type": "Do not add 0s", + "desc": "Month", + "defaultValue": "The default value of this attribute is 1" + }, + { + "name": "MM", + "sample": "date", + "type": "", + "desc": "Month", + "defaultValue": "The default value of this attribute is 01." + }, + { + "name": "W", + "sample": "date", + "type": "Only the format of the week selector is available. Do not add 0", + "desc": "Week", + "defaultValue": "The default value of this attribute is 1" + }, + { + "name": "WW", + "sample": "date", + "type": "Only the format of the week selector is available.", + "desc": "Week", + "defaultValue": "The default value of this attribute is 01." + }, + { + "name": "d", + "sample": "date", + "type": "Do not add 0s", + "desc": "Day", + "defaultValue": "The default value of this attribute is 1" + }, + { + "name": "dd", + "sample": "date", + "type": "", + "desc": "Day", + "defaultValue": "The default value of this attribute is 01." + }, + { + "name": "H", + "sample": "time-low", + "type": "24-hour format; Do not add 0", + "desc": "Hour", + "defaultValue": "The default value of this attribute is 1" + }, + { + "name": "HH", + "sample": "time-low", + "type": "24-hour clock", + "desc": "Hour", + "defaultValue": "The default value of this attribute is 01." + }, + { + "name": "h", + "sample": "time-low", + "type": "12-hour format, which must be used with A or a; Do not add 0", + "desc": "Hour", + "defaultValue": "The default value of this attribute is 1" + }, + { + "name": "hh", + "sample": "time-low", + "type": "The 12-hour format must be used with A or a.", + "desc": "Hour", + "defaultValue": "The default value of this attribute is 01." + }, + { + "name": "m", + "sample": "time-low", + "type": "Do not add 0s", + "desc": "Minute", + "defaultValue": "The default value of this attribute is 4" + }, + { + "name": "mm", + "sample": "time-low", + "type": "", + "desc": "Minute", + "defaultValue": "The default value of this attribute is 04." + }, + { + "name": "s", + "sample": "time-low", + "type": "Do not add 0s", + "desc": "Second", + "defaultValue": "The default value of this attribute is 4" + }, + { + "name": "ss", + "sample": "time-low", + "type": "", + "desc": "Second", + "defaultValue": "The default value of this attribute is 04." + }, + { + "name": "A", + "sample": "time-low", + "type": "This parameter is valid only for format and is in uppercase.", + "desc": "AM/PM", + "defaultValue": "The default value of this attribute is AM." + }, + { + "name": "a", + "sample": "time-low", + "type": "Only format is available, in lowercase.", + "desc": "am/pm", + "defaultValue": "The default value of this attribute is am." + }, + { + "name": "timestamp", + "sample": "format", + "type": "Only value-format is available. The component binding value is of the number type", + "desc": "JS Timestamp", + "defaultValue": "The default value of this attribute is 1483326245000." + }, + { + "name": "[MM]", + "sample": "", + "type": "Use square brackets to identify characters that do not need to be formatted, such as [A] [MM]", + "desc": "The formatting character is not required.", + "defaultValue": "The default value of this attribute is MM." + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/date-picker-options.json b/examples/docs/resources/pc/api/en-US/date-picker-options.json new file mode 100644 index 000000000..56f9edbf0 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/date-picker-options.json @@ -0,0 +1,32 @@ +{ + "attrs": [ + { + "name": "shortcuts", + "sample": "date-shortcuts", + "type": "Object", + "desc": "Set shortcut options. The {text, onClick} object needs to be transferred. For details about the usage of the {text, onClick} object, see the demo or the following table.", + "defaultValue": "" + }, + { + "name": "disabledDate", + "sample": "max-min", + "type": "Function", + "desc": "Set the disabled status. The parameter is the current date. The return value is Boolean.", + "defaultValue": "" + }, + { + "name": "firstDayOfWeek", + "sample": "date-range-shortcuts", + "type": "Number", + "desc": "Week start day; The optional values for this property are from 1 to 7", + "defaultValue": "The default value of this attribute is 7." + }, + { + "name": "onPick", + "sample": "date-range", + "type": "Function({maxDate, minDate})", + "desc": "Callback that will be executed after a date is selected. The callback takes effect only when daterange or datetimerange is selected.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/date-picker-shortcuts.json b/examples/docs/resources/pc/api/en-US/date-picker-shortcuts.json new file mode 100644 index 000000000..62663ae96 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/date-picker-shortcuts.json @@ -0,0 +1,18 @@ +{ + "attrs": [ + { + "name": "text", + "sample": "date-shortcuts", + "type": "String", + "desc": "Title Text", + "defaultValue": "" + }, + { + "name": "onClick", + "sample": "date-shortcuts", + "type": "Function", + "desc": "Selected callback function. The parameter is vm. You can set the value of the selector by triggering the pick event. For example, vm.$emit('pick', new Date())", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/date-picker.json b/examples/docs/resources/pc/api/en-US/date-picker.json new file mode 100644 index 000000000..a45c98c39 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/date-picker.json @@ -0,0 +1,232 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "Date / Array", + "desc": "Set the initial value of the calendar component. ;Bound Value", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "focus", + "type": "Boolean", + "desc": "Disabled", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "popper-append-to-body", + "sample": "popup-style-position", + "type": "Boolean", + "desc": "Indicates whether to insert a pop-up box to the body element. When a fault occurs in the dialog box that is displayed, you can set this attribute to false (for details, see the select component).", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "readonly", + "sample": "readonly", + "type": "Boolean", + "desc": "Set whether the calendar component is read-only.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "editable", + "sample": "editable", + "type": "Boolean", + "desc": "The text box can be entered.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "clearable", + "sample": "about-clear", + "type": "Boolean", + "desc": "Display Clear Button", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "size", + "sample": "set-size", + "type": "String", + "desc": "Text box size; The values of this attribute are medium, small, and mini", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "other-picker-type", + "type": "String", + "desc": "Placeholder content for non-range selection", + "defaultValue": "The default value of this attribute is []" + }, + { + "name": "start-placeholder", + "sample": "custom-range", + "type": "String", + "desc": "Placeholder of the start date when the range is selected", + "defaultValue": "" + }, + { + "name": "end-placeholder", + "sample": "custom-range", + "type": "String", + "desc": "Placeholder of the end date when the range is selected", + "defaultValue": "" + }, + { + "name": "type", + "sample": "other-picker-type", + "type": "String", + "desc": "Display type; The optional value of this attribute is year / month / dates / week / daterange / date / datetime / datetimerange / monthrange", + "defaultValue": "The default value of this attribute is date." + }, + { + "name": "format", + "sample": "about-format", + "type": "String", + "desc": "Display format in the text box", + "defaultValue": "The default value of this attribute is yyyy-MM-dd." + }, + { + "name": "value-format", + "sample": "about-format", + "type": "String", + "desc": "Specifies the format of the binding value. If this parameter is not specified, the binding value is Date", + "defaultValue": "The default value of this attribute is the Date object." + }, + { + "name": "time-format", + "sample": "", + "type": "String", + "desc": "If the user-defined format cannot automatically distinguish the time and date, you can set this parameter to assist in determining the format.", + "defaultValue": "" + }, + { + "name": "isutc8", + "sample": "utc8", + "type": "Boolean", + "desc": "The default value is false. If this parameter is set to true, the time in GMT+8 is still displayed when the default time zone is switched. Applicable scenario: The GMT+8 time is displayed in regions outside China", + "defaultValue": "" + }, + { + "name": "align", + "sample": "align", + "type": "String", + "desc": "Alignment mode; The optional values of this attribute are left / center / right", + "defaultValue": "The default value of this attribute is left." + }, + { + "name": "show-timezone", + "sample": "timezone", + "type": "Boolean", + "desc": "Whether to enable the time zone selection function on the date selection panel", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "popper-class", + "sample": "custom-suffix-icon1", + "type": "String", + "desc": "Class name added to the DatePicker drop-down list box", + "defaultValue": "" + }, + { + "name": "picker-options", + "sample": "date-range-shortcuts", + "type": "Object", + "desc": "The following table lists the options of the current time and date selector.", + "defaultValue": "The default value of this attribute is {}." + }, + { + "name": "range-separator", + "sample": "custom-range", + "type": "String", + "desc": "Separator for selecting a range", + "defaultValue": "The default value of this attribute is -." + }, + { + "name": "default-value", + "sample": "default-value", + "type": "Date", + "desc": "Optional. When the selected date is empty, the time displayed by default when the selector panel is opened. Set it to a value that can be parsed by new Date().", + "defaultValue": "" + }, + { + "name": "default-time", + "sample": "default-time-of-range", + "type": "String", + "desc": "The specific time of the current day used by the selected date during range selection; The optional value of this attribute is see date format", + "defaultValue": "" + }, + { + "name": "name", + "sample": "timezone", + "type": "String", + "desc": "Native attribute", + "defaultValue": "" + }, + { + "name": "unlink-panels", + "sample": "unlink-panels", + "type": "Boolean", + "desc": "Cancel the linkage between two date panels in the range selector.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "suffix-icon", + "sample": "custom-suffix-icon", + "type": "Object", + "desc": "Custom selector's rear icon", + "defaultValue": "The default value of this property is IconCalendar." + }, + { + "name": "clear-icon", + "sample": "about-clear", + "type": "String", + "desc": "Custom Clear Icon", + "defaultValue": "The default value of this attribute is IconOperationfailed." + }, + { + "name": "time-arrow-control", + "sample": "time-arrow-control", + "type": "Boolean", + "desc": "Use the arrow button to select the time. This parameter is used when type is set to datetime or datetimerange. By default, the time is selected by scrolling the mouse wheel", + "defaultValue": "" + }, + { + "name": "validate-event", + "sample": "validate-event", + "type": "Boolean", + "desc": "Specifies whether the date selector triggers form validation during input. The default value is true.", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "focus", + "sample": "focus", + "type": "", + "desc": "Enable input to focus.", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "date-picker-events", + "type": "Function(arg1)", + "desc": "This event is triggered when the user confirms the selected value. change (arg1) {//arg1 is the changed date or date set of datepicker}", + "defaultValue": "" + }, + { + "name": "blur", + "sample": "date-picker-events", + "type": "Function", + "desc": "This event is triggered when the input loses focus; blur() {\n//do something you want...\n}", + "defaultValue": "" + }, + { + "name": "focus", + "sample": "date-picker-events", + "type": "Function(arg1)", + "desc": "This event is triggered when the input is focused. focus(arg1}{\n// arg1 = to component vue instance\n//do something you want...\n}", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/dept.json b/examples/docs/resources/pc/api/en-US/dept.json new file mode 100644 index 000000000..82b847766 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/dept.json @@ -0,0 +1,120 @@ +{ + "attrs": [ + { + "name": "value", + "sample": "size", + "type": "String", + "desc": "Set the display value of the department component during initialization.", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "Set the component size", + "defaultValue": "" + }, + { + "name": "title", + "sample": "", + "type": "String", + "desc": "Set the pop-up window title.", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolen", + "desc": "Disabled", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "autoSelect", + "sample": "auto-select", + "type": "Boolen", + "desc": "Specify that when there is only one piece of department information, the system automatically completes the information.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "fetchDeptList", + "sample": "custom-service", + "type": "Function", + "desc": "The interface for querying the customized department list returns a Promise object. This parameter is mandatory when the framework service is not used.", + "defaultValue": "" + }, + { + "name": "fetchDeptByValue", + "sample": "custom-service", + "type": "Function", + "desc": "The interface for querying customized department details returns a Promise object. This parameter is mandatory when the framework service is not used.", + "defaultValue": "" + }, + { + "name": "fetchDept", + "sample": "custom-service", + "type": "Function", + "desc": "The interface for querying customized departments returns a Promise object. This parameter is mandatory when the framework service is not used.", + "defaultValue": "" + }, + { + "name": "beforeConfirm", + "sample": "before-confirm", + "type": "Function", + "desc": "If false is returned or Promise is returned and rejected, the dialog box is not closed.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "hrapprover", + "sample": "slot-hrapprover", + "type": "", + "desc": "Approval", + "defaultValue": "" + } + ], + "events": [ + { + "name": "confirm", + "sample": "dept-confirm", + "type": "Function", + "desc": "This event is triggered when the OK button is clicked.", + "defaultValue": "" + }, + { + "name": "cancel", + "sample": "dept-cancel", + "type": "Function", + "desc": "This event is triggered when the Cancel button is clicked.", + "defaultValue": "" + }, + { + "name": "selected", + "sample": "dept-selected", + "type": "Function(value)", + "desc": "This event is triggered when you click a selected department. The callback parameter is the selected department code.", + "defaultValue": "" + }, + { + "name": "open", + "sample": "dept-events", + "type": "Function", + "desc": "This event is triggered when a user clicks a dialog box that is displayed.", + "defaultValue": "" + }, + { + "name": "change", + "sample": "dept-events", + "type": "Function(value)", + "desc": "This event is triggered when the selected department value changes. The callback parameter is the new department code. ; value: changed value", + "defaultValue": "" + }, + { + "name": "close", + "sample": "dept-close", + "type": "Function", + "desc": "This event is triggered when a department dialog box is closed.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/detail-page.json b/examples/docs/resources/pc/api/en-US/detail-page.json new file mode 100644 index 000000000..fd2eaf8d7 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/detail-page.json @@ -0,0 +1,67 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "", + "type": "Array", + "desc": "Set the data in the table header details column", + "defaultValue": "" + }, + { + "name": "title", + "sample": "custom-show-text", + "type": "String", + "desc": "Details column title; The default value is Detail Bar with Table Header.", + "defaultValue": "" + }, + { + "name": "text-split", + "sample": "custom-show-text", + "type": "String", + "desc": "Details column title separator; The default value is ':'", + "defaultValue": "" + }, + { + "name": "dialog-title", + "sample": "custom-show-text", + "type": "String", + "desc": "Personalized pop-up window title; Default to'Personalization'", + "defaultValue": "" + }, + { + "name": "label-title", + "sample": "custom-show-text", + "type": "String", + "desc": "Personalized pop-up window header text title bar field; The default value is'Field'", + "defaultValue": "" + }, + { + "name": "tips", + "sample": "custom-show-text", + "type": "String", + "desc": "Prompt message that cannot be completely hidden; The default value is'At least one is displayed'", + "defaultValue": "" + }, + { + "name": "value-title", + "sample": "custom-show-text", + "type": "String", + "desc": "Personalized pop-up window header text operation column field; The default value is'hidden'", + "defaultValue": "" + }, + { + "name": "save-button", + "sample": "custom-show-text", + "type": "String", + "desc": "Text of the confirmation button in the personalized pop-up window; The default value is'OK'", + "defaultValue": "" + }, + { + "name": "cancel-button", + "sample": "custom-show-text", + "type": "String", + "desc": "Text of the cancel button in the personalized pop-up window; The default value is'Cancel'", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/dialog-box.json b/examples/docs/resources/pc/api/en-US/dialog-box.json new file mode 100644 index 000000000..2f2e17101 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/dialog-box.json @@ -0,0 +1,204 @@ +{ + "attrs": [ + { + "name": "center", + "sample": "center", + "type": "Boolean", + "desc": "If this parameter is set to true, the header and bottom of the dialog box are automatically centered.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "is-form-reset", + "sample": "form-in-dialog", + "type": "Boolean", + "desc": "Close the pop-up window. The form data is reset by default.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "show-close", + "sample": "hidden-close-buttons", + "type": "Boolean", + "desc": "Whether to display the close button", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "draggable", + "sample": "draggable", + "type": "Boolean", + "desc": "Indicates whether to enable the drag function for pop-up windows. The default value is false.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "fullscreen", + "sample": "fullscreen", + "type": "Boolean", + "desc": "Whether the dialog box is displayed in full screen mode", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "modal", + "sample": "no-modal", + "type": "Boolean", + "desc": "Whether to enable the mask layer", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "close-on-click-modal", + "sample": "close-on-click-modal", + "type": "Boolean", + "desc": "Indicates whether pop-up windows can be closed by clicking the mask layer. The default value is true. You can set modal-closable=\"false\" on the tag. The pop-up windows cannot be closed by clicking the mask layer.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "close-on-press-escape", + "sample": "close-on-press-escape", + "type": "Boolean", + "desc": "Specifies whether the mask layer can be disabled by pressing ESC.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "modal-append-to-body", + "sample": "right-dialog", + "type": "Boolean", + "desc": "Indicates whether the mask layer is applied to the body. If the value is false, the mask layer is applied to the parent element of DialogBox.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "append-to-body", + "sample": "secondary-dialog", + "type": "Boolean", + "desc": "Indicates whether the DialogBox itself is inserted into the body. This attribute must be specified and set to true for nested Dialogs.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "right-slide", + "sample": "right-dialog", + "type": "Boolean", + "desc": "Indicates whether to enable the pop-up slide-out function. The default value is false.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "lock-scroll", + "sample": "lock-scroll", + "type": "Boolean", + "desc": "Whether to disable the scroll bar when a log is displayed.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "show-header", + "sample": "hidden-header", + "type": "Boolean", + "desc": "Indicates whether to display the pop-up header. The default value is true.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "title", + "sample": "custom-dialog-title", + "type": "String", + "desc": "Pop-up dialog box title.", + "defaultValue": "" + }, + { + "name": "top", + "sample": "dialog-top-height", + "type": "String", + "desc": "Height between the pop-up box and the top of the window. The default value is 15% of the screen height.", + "defaultValue": "The default value of this attribute is 15vh." + }, + { + "name": "visible", + "sample": "basic-usage", + "type": "Boolean", + "desc": "Display and close pop-up boxes.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "width", + "sample": "dialog-width", + "type": "String", + "desc": "Wideness of the dialog box that is displayed.", + "defaultValue": "The default value of this attribute is 500px." + }, + { + "name": "dialog-class", + "sample": "dialog-width", + "type": "String", + "desc": "Customized configuration pop-up window class name", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-dialog-content", + "type": "", + "desc": "Dialog content", + "defaultValue": "" + }, + { + "name": "title", + "sample": "custom-dialog-title", + "type": "", + "desc": "Dialog content in the title area", + "defaultValue": "" + }, + { + "name": "footer", + "sample": "custom-dialog-footer", + "type": "", + "desc": "Dialog button operation area content", + "defaultValue": "" + } + ], + "events": [ + { + "name": "close", + "sample": "open-close-events", + "type": "Function()", + "desc": "Dialog disabled callback; Dialog closing callback; No arguments", + "defaultValue": "" + }, + { + "name": "open", + "sample": "open-close-events", + "type": "Function()", + "desc": "Dialog open callback; Dialog open callback; No arguments", + "defaultValue": "" + }, + { + "name": "opened", + "sample": "open-close-events", + "type": "Function()", + "desc": "Dialog: callback when the animation ends; No arguments", + "defaultValue": "" + }, + { + "name": "closed", + "sample": "open-close-events", + "type": "Function()", + "desc": "Dialog closes the callback when the animation ends. No arguments", + "defaultValue": "" + }, + { + "name": "drag-start", + "sample": "draggable", + "type": "Function(arg)", + "desc": "Dialog drag start event; arg:event (including the location of the pop-up window)", + "defaultValue": "" + }, + { + "name": "drag-move", + "sample": "draggable", + "type": "Function(arg)", + "desc": "Dialog dragging and moving event; arg:event (including the location of the pop-up window)", + "defaultValue": "" + }, + { + "name": "drag-end", + "sample": "draggable", + "type": "Function(arg)", + "desc": "Dialog drag end event; arg:event (including the location of the pop-up window)", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/drop-roles.json b/examples/docs/resources/pc/api/en-US/drop-roles.json new file mode 100644 index 000000000..b998bc2ba --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/drop-roles.json @@ -0,0 +1,69 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "change-role-event", + "type": "String , Number", + "desc": "Sets the text display value. ;Bound Value", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "Set the component size", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "custom-service", + "type": "String", + "desc": "Set the placeholder text in the text box.", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "Add a class name for the popper. For details, see the popover component.", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether to insert a pop-up box to the body element. If a fault occurs in locating the fault in the dialog box that is displayed, you can set this attribute to false (for details, see the select component).", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "fetchRole", + "sample": "custom-service", + "type": "Object", + "desc": "User-defined API for obtaining the role list. This parameter is mandatory when the framework service is not used.", + "defaultValue": "" + }, + { + "name": "fetchCurrentRole", + "sample": "custom-service", + "type": "Object", + "desc": "User-defined interface for obtaining the role of the current user. This parameter is mandatory when the framework service is not used.", + "defaultValue": "" + }, + { + "name": "fields", + "sample": "custom-service", + "type": "Object", + "desc": "Customized data mapping. This parameter is mandatory when the framework service is not used.", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "change-role-event", + "type": "", + "desc": "This event is triggered after the current role is switched.", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/drop-times.json b/examples/docs/resources/pc/api/en-US/drop-times.json new file mode 100644 index 000000000..6ce79edac --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/drop-times.json @@ -0,0 +1,69 @@ +{ + "attrs": [ + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "Set the component size. The value can be medium, small, or mini.", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "Class name added to the DropTimes drop-down list box", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether to insert the pop-up box to the body element. If a fault occurs in locating the fault in the dialog box that is displayed, you can set this attribute to false (for details, see the select component).", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "modelValue / v-model", + "sample": "start-end-step", + "type": "-", + "desc": "Bound Value", + "defaultValue": "The default value of this attribute is {}." + }, + { + "name": "placeholder", + "sample": "start-end-step", + "type": "String", + "desc": "Set the prompt placeholder text in the text box.", + "defaultValue": "" + }, + { + "name": "end", + "sample": "start-end-step", + "type": "Number", + "desc": "End time, in minutes. The default value is 1440.", + "defaultValue": "The default value of this attribute is 1440." + }, + { + "name": "start", + "sample": "start-end-step", + "type": "Number", + "desc": "Start time, in minutes. The default value is 0.", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "step", + "sample": "start-end-step", + "type": "Number", + "desc": "Interval, in minutes. The default value is 15.", + "defaultValue": "The default value of this attribute is 15" + } + ], + "events": [ + { + "name": "change", + "sample": "start-end-step", + "type": "", + "desc": "This event is triggered after the current time is switched by the pull-down button.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/dropdown-item.json b/examples/docs/resources/pc/api/en-US/dropdown-item.json new file mode 100644 index 000000000..a9666ab4b --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/dropdown-item.json @@ -0,0 +1,41 @@ +{ + "attrs": [ + { + "name": "type", + "sample": "events", + "type": "", + "desc": "Data that can be obtained when an item-click is bound to the component.", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "", + "desc": "Disabled. Default value: false", + "defaultValue": "" + }, + { + "name": "divided", + "sample": "hide-on-click", + "type": "", + "desc": "Displays the split line. Default value: false", + "defaultValue": "" + }, + { + "name": "icon", + "sample": "trigger", + "type": "", + "desc": "Embedded icon.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "basic-usage", + "type": "", + "desc": "The options in the drop-down list are displayed.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/dropdown-menu.json b/examples/docs/resources/pc/api/en-US/dropdown-menu.json new file mode 100644 index 000000000..eb554e0e7 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/dropdown-menu.json @@ -0,0 +1,48 @@ +{ + "attrs": [ + { + "name": "type", + "sample": "basic-usage", + "type": "", + "desc": "Specifies whether to display arrows in the pop-up drop-down list box.", + "defaultValue": "" + }, + { + "name": "arrow-offset", + "sample": "basic-usage", + "type": "", + "desc": "Set the offset of the pop-up drop-down arrow. The default value is 0.", + "defaultValue": "" + }, + { + "name": "placement", + "sample": "basic-usage", + "type": "", + "desc": "Menu pop-up position. The value can be (top/top-start/top-end/bottom/bottom-start/bottom-end). The default value is bottom-end", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "basic-usage", + "type": "", + "desc": "Set the pop-up drop-down style.", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "basic-usage", + "type": "", + "desc": "Specifies whether the pop-up drop-down list box is created under the body element.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "basic-usage", + "type": "", + "desc": "The drop-down list is usually a component.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/dropdown.json b/examples/docs/resources/pc/api/en-US/dropdown.json new file mode 100644 index 000000000..46b680c76 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/dropdown.json @@ -0,0 +1,198 @@ +{ + "attrs": [ + { + "name": "type", + "sample": "split-button", + "type": "String", + "desc": "Menu button type, which is the same as the Button component. (Valid only if split-button is true).", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "Menu size. When split-button is set to true, this parameter is also valid for triggering a button. Available values (medium / small / mini)", + "defaultValue": "" + }, + { + "name": "split-button", + "sample": "split-button", + "type": "Boolean", + "desc": "The drop-down trigger element is displayed as a button group. Default value: false", + "defaultValue": "false" + }, + { + "name": "trigger", + "sample": "trigger", + "type": "String", + "desc": "Trigger drop-down behavior. The value can be hover or click. The default value is hover", + "defaultValue": "hover" + }, + { + "name": "hide-on-click", + "sample": "hide-on-click", + "type": "Boolean", + "desc": "Indicates whether to hide a menu after a menu item is clicked. The default value is true.", + "defaultValue": "true" + }, + { + "name": "show-timeout", + "sample": "trigger", + "type": "Number", + "desc": "Delay for expanding the drop-down list. This parameter is valid only when trigger is hover. Default value: 250 ms", + "defaultValue": "" + }, + { + "name": "hide-timeout", + "sample": "trigger", + "type": "Number", + "desc": "Delay for collapsing the drop-down list. This parameter is valid only when trigger is hover. Default value: 150 ms", + "defaultValue": "" + }, + { + "name": "tabindex", + "sample": "basic-usage", + "type": "Number", + "desc": "tabindex of the Dropdown component.", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "Whether to disable the function. Default value: false", + "defaultValue": "false" + }, + { + "name": "menuOptions", + "sample": "options", + "type": "Object", + "desc": "Configuring DropdownMenu in Profiles", + "defaultValue": "{\"options\":[],\"textField\":\"label\",\"popper-class\":\"\",\"placement\":\"bottom-end\"}" + }, + { + "name": "title", + "sample": "options", + "type": "String", + "desc": "When the default slot is not used, the menu title can be configured in the title attribute.", + "defaultValue": "drop-down menu" + } + ], + "slots": [ + { + "name": "default", + "sample": "basic-usage", + "type": "", + "desc": "Element that triggers the display of the drop-down list. Note: The value must be an element or component.", + "defaultValue": "" + }, + { + "name": "dropdown", + "sample": "basic-usage", + "type": "", + "desc": "drop-down list, usually the component.", + "defaultValue": "" + } + ], + "events": [ + { + "name": "button-click", + "sample": "events", + "type": "Function", + "desc": "When split-button is set to true, click the callback function of the button on the left.", + "defaultValue": "" + }, + { + "name": "item-click", + "sample": "events", + "type": "Function", + "desc": "Callback triggered by clicking a menu item.", + "defaultValue": "" + }, + { + "name": "visible-change", + "sample": "events", + "type": "Function", + "desc": "This event is triggered when the drop-down list box is displayed or hidden.", + "defaultValue": "" + } + ], + "dropdownMenuattrs": [ + { + "name": "placement", + "sample": "basic-usage", + "type": "String", + "desc": "Menu pop-up position. The value can be (top/top-start/top-end/bottom/bottom-start/bottom-end). The default value is bottom-end", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "basic-usage", + "type": "", + "desc": "Set the pop-up drop-down style.", + "defaultValue": "" + }, + { + "name": "options", + "sample": "options", + "type": "Array", + "desc": "Setting the properties of a menu item using a profile", + "defaultValue": "[]" + }, + { + "name": "textField", + "sample": "options", + "type": "String", + "desc": "Used together with the options attribute to specify the copywriting field of a menu item. The default field is label.", + "defaultValue": "label" + } + ], + "dropdownMenuslots": [ + { + "name": "default", + "sample": "basic-usage", + "type": "", + "desc": "The drop-down list is usually a component.", + "defaultValue": "" + } + ], + "dropdownItemattrs": [ + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "Disabled. Default value: false", + "defaultValue": "false" + }, + { + "name": "divided", + "sample": "hide-on-click", + "type": "Boolean", + "desc": "Displays the split line. Default value: false", + "defaultValue": "false" + }, + { + "name": "icon", + "sample": "trigger", + "type": "Object", + "desc": "Embedded icon.", + "defaultValue": "" + }, + { + "name": "label", + "sample": "basic-usage", + "type": "String", + "desc": "Display value of a menu item", + "defaultValue": "" + } + ], + "dropdownItemslots": [ + { + "name": "default", + "sample": "basic-usage", + "type": "", + "desc": "The options in the drop-down list box are displayed.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/espace.json b/examples/docs/resources/pc/api/en-US/espace.json new file mode 100644 index 000000000..489749e9f --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/espace.json @@ -0,0 +1,11 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "support-open-espace", + "type": "Array , Object", + "desc": "Sets component data. The array object contains the options type, value, and icon. The value of type can be im, sip, or mailto", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/fall-menu.json b/examples/docs/resources/pc/api/en-US/fall-menu.json new file mode 100644 index 000000000..a4068a525 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/fall-menu.json @@ -0,0 +1,48 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "data-resource", + "type": "Object , Array", + "desc": "Set the waterfall menu data. ;Set the data of the waterfall menu.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "level1", + "sample": "custom-menuitem", + "type": "", + "desc": "User-defined level-1 menu", + "defaultValue": "" + }, + { + "name": "level2", + "sample": "custom-menuitem", + "type": "", + "desc": "Customized level-2 menu", + "defaultValue": "" + }, + { + "name": "level3", + "sample": "custom-menuitem", + "type": "", + "desc": "Customized Level-3 Menu", + "defaultValue": "" + }, + { + "name": "left", + "sample": "custom-slider-icon", + "type": "", + "desc": "Customize the switch icon on the left.", + "defaultValue": "" + }, + { + "name": "right", + "sample": "custom-slider-icon", + "type": "", + "desc": "Customize the switch icon on the right.", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/file-upload.json b/examples/docs/resources/pc/api/en-US/file-upload.json new file mode 100644 index 000000000..33e2bcf91 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/file-upload.json @@ -0,0 +1,332 @@ +{ + "attrs": [ + { + "name": "action", + "sample": "basic-usage", + "type": "String", + "desc": "Upload URL. If no action is configured, the default gateway link is generated.", + "defaultValue": "" + }, + { + "name": "open-download-file", + "sample": "upload-file-list", + "type": "Boolean", + "desc": "Whether to enable file download by clicking. By default, this function is disabled.", + "defaultValue": "" + }, + { + "name": "headers", + "sample": "custom-upload-request", + "type": "Object", + "desc": "Set the upload request header. You can set headers to the header request information, for example, 1:headers='headers'2headers:{'Accept-Language':'en,zh', Authorization:' Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ=='}", + "defaultValue": "" + }, + { + "name": "multiple", + "sample": "multiple-file", + "type": "Boolean", + "desc": "Specifies whether multiple files can be selected.", + "defaultValue": "" + }, + { + "name": "data", + "sample": "basic-usage", + "type": "Object", + "desc": "Extra parameters attached during upload", + "defaultValue": "" + }, + { + "name": "name", + "sample": "upload-file-list", + "type": "String", + "desc": "Field name of the uploaded file", + "defaultValue": "The default value of this attribute is file." + }, + { + "name": "with-credentials", + "sample": "upload-request1", + "type": "Boolean", + "desc": "Cookie credential information can be sent.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "show-file-list", + "sample": "upload-file-list", + "type": "Boolean", + "desc": "Whether to display the list of uploaded files", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "drag", + "sample": "drag-upload", + "type": "Boolean", + "desc": "Whether to enable drag-and-drop upload", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "accept", + "sample": "accept-file-image", + "type": "String", + "desc": "File type to be uploaded. This parameter is invalid in thumbnail-mode mode.", + "defaultValue": "" + }, + { + "name": "before-upload", + "sample": "prevent-upload-file", + "type": "Function(file)", + "desc": "Hook before uploading a file. The parameter is the file to be uploaded. If false is returned or Promise is returned and rejected, the upload stops.", + "defaultValue": "" + }, + { + "name": "list-type", + "sample": "picture-card", + "type": "String", + "desc": "File list type; The optional values of this attribute are text / picture / picture-card / thumb", + "defaultValue": "The default value of this attribute is text." + }, + { + "name": "thumb-option", + "sample": "upload-file-list-thumb", + "type": "Object", + "desc": "Configure the file list when the display type is thumb. popperClass pop-up window list custom class name; width: width of the pop-up window. The default value is 270. The value is of the number type. ShowDownload indicates whether to display the download button. The default Boolean value is false. ShowDel indicates whether to display the delete button. The default Boolean value is false. DownloadFile: Click the download button to execute the function. Enable the EDM mode and configure the necessary token. This configuration can be omitted. show-tooltip: Indicates whether to enable tip when the file name exceeds the hidden value. The default value is false. The icon before the list result. The default value is icon-attachment", + "defaultValue": "" + }, + { + "name": "before-remove", + "sample": "prevent-delete-file", + "type": "Function(file, fileList)", + "desc": "Hook before deleting files. The parameters are the uploaded files and file list. If false is returned or Promise is returned and rejected, the deletion stops.", + "defaultValue": "" + }, + { + "name": "auto-upload", + "sample": "manual-upload", + "type": "Boolean", + "desc": "Whether to upload a file immediately after it is selected", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "file-list", + "sample": "accept-file-image", + "type": "Array", + "desc": "List of uploaded files, for example, [{name:'food.jpg', url:' https://xxx.cdn.com/xxx.jpg '}]", + "defaultValue": "" + }, + { + "name": "http-request", + "sample": "http-request", + "type": "Function", + "desc": "Overwrite the default upload behavior. You can customize the upload implementation. httpRequest: () => {this.$service.network.post . ('localhost:3000/tiny/upload',['data']) .then (Res => {//The service is a customized service. The upload cannot be performed because the TinyVue official website uses Mock upload.}) }", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "", + "type": "Boolean", + "desc": "Disable", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "limit", + "sample": "upload-limit", + "type": "Number", + "desc": "Maximum number of files that can be uploaded", + "defaultValue": "" + }, + { + "name": "edm", + "sample": "", + "type": "Object", + "desc": "To use the upload, download, and preview functions of the EDM, you can configure the upload, download, and preview parameters in the object.", + "defaultValue": "" + }, + { + "name": "token", + "sample": "", + "type": "Function", + "desc": "Token required for uploading, downloading, and previewing using EDM. The return value is Promise.", + "defaultValue": "" + }, + { + "name": "isFolder", + "sample": "edm-folder-upload", + "type": "Boolean", + "desc": "If this parameter is set to true, the function of uploading folders is enabled. A maximum of five folders can be uploaded. {edm:upload:{plugin:sha256,isFolder:true,token:()=>{}}}", + "defaultValue": "" + }, + { + "name": "fileSize", + "sample": "", + "type": "Number | Array", + "desc": "Restrict the file size. The unit is KB. This parameter is valid when EDM upload is enabled. When the value is of the Number type, the upload stops if the value is less than the value of this parameter. When the value is an array, [min,max] sets the upload range. The value is of the Number type. The maximum value cannot exceed 2 GB. When this parameter is set to an array, the maximum value is compared with the value set on the EDM server and the minimum value is used.", + "defaultValue": "" + }, + { + "name": "packageToken", + "sample": "", + "type": "Function", + "desc": "Configure the token for EDM batch packaging and downloading. The configuration structure is edm:{download:packageToken:()=>{}} and a Promise is returned", + "defaultValue": "" + }, + { + "name": "upload", + "sample": "", + "type": "Object", + "desc": "Parameters required for configuring the EDM upload function. For example, edm:{upload:{plugin:sha256,token:()=>{}}},plugin indicates the hash value for verifying the document content generated by the third-party dependency, token indicates the authentication token, and the type is Function. Promise is returned.", + "defaultValue": "" + }, + { + "name": "download", + "sample": "", + "type": "Object", + "desc": "Configure the parameters required for the EDM download function. For example, edm:{download:{token:()=>{}}},token is the authentication token.", + "defaultValue": "" + }, + { + "name": "preivew", + "sample": "", + "type": "Object", + "desc": "Parameters required for configuring the EDM preview function, for example, edm:{preview:{plugin: util.default,previewUrl:./_index.html?appid= application ID,packageName:'jslib',token:()=>{}}}", + "defaultValue": "" + }, + { + "name": "mergeService", + "sample": "", + "type": "Boolean", + "desc": "If mergeService is set to true and multiple files are uploaded using the default service, multiple upload services are combined into one service.", + "defaultValue": "" + }, + { + "name": "updateId", + "sample": "", + "type": "String", + "desc": "DocId of the document to be updated on the EDM", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "trigger", + "sample": "custom-trigger", + "type": "", + "desc": "Content of the triggering file selection box", + "defaultValue": "" + }, + { + "name": "tip", + "sample": "custom-upload-tip", + "type": "", + "desc": "Prompt Description", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "clearFiles", + "sample": "clear-files", + "type": "", + "desc": "Clear the list of uploaded files. (This method cannot be invoked in before-upload.)", + "defaultValue": "" + }, + { + "name": "abort", + "sample": "abort-quest", + "type": "", + "desc": "Cancel the upload request", + "defaultValue": "" + }, + { + "name": "submit", + "sample": "manual-upload", + "type": "", + "desc": "List of manually uploaded files", + "defaultValue": "" + }, + { + "name": "downloadFile", + "sample": "", + "type": "", + "desc": "Downloading an EDM File", + "defaultValue": "" + }, + { + "name": "previewFile", + "sample": "", + "type": "", + "desc": "Previewing an EDM File", + "defaultValue": "" + }, + { + "name": "getNewTabPreviewUrl", + "sample": "", + "type": "", + "desc": "URL for previewing the EDM file. The return value is Promise.", + "defaultValue": "" + }, + { + "name": "handleRemove", + "sample": "", + "type": "", + "desc": "Manually remove EDM file", + "defaultValue": "" + } + ], + "events": [ + { + "name": "drop-error", + "sample": "drag-upload", + "type": "Function(arg1)", + "desc": "This event is triggered when a file fails to be dragged. This event is valid only when the drag function is enabled. ; dropError(arg1){\n// arg1 Information about the file that fails to be uploaded.\n {name: name of the file to be uploaded, \npercentage: percentage of the upload progress, \nraw: file information, \nsize: file size, \nstatus: upload status, \nuid: uid} \n// do something you want...}", + "defaultValue": "" + }, + { + "name": "preview", + "sample": "upload-events", + "type": "Function(arg1)", + "desc": "Event triggered when an uploaded file is clicked in the file list. preview(arg1){\n arg1 = {name: Upload file name, percentage: upload progress percentage, raw: file information, size: file size, status: upload status, uid: uid}}", + "defaultValue": "" + }, + { + "name": "remove", + "sample": "upload-events", + "type": "Function(arg1)", + "desc": "Event triggered when a file is removed from the file list; onRomove(arg1){\n //arg1 Information about the file to be removed:\n{name: name of the file to be uploaded, percentage: percentage of the upload progress, raw: file information, size: file size, status: upload status, uid: uid}\n// do something you want...}", + "defaultValue": "" + }, + { + "name": "error", + "sample": "upload-events", + "type": "Function(arg1, arg2, arg3)", + "desc": "Event triggered when a file fails to be uploaded; onError(arg1, arg2, arg3){\n arg1 = error information\n arg2 = {name: upload file name, percentage: upload progress percentage, raw: file information, size: file size, status: upload status, uid: uid} arg2 is the information about the file that fails to be uploaded. // arg3 = [] Array type Array file array that is successfully uploaded. // do something you want...}", + "defaultValue": "" + }, + { + "name": "exceed", + "sample": "upload-events", + "type": "", + "desc": "This event is triggered when the number of files exceeds the upper limit.", + "defaultValue": "" + }, + { + "name": "progress", + "sample": "upload-events", + "type": "Function(arg1, arg2)", + "desc": "Event triggered when a file is uploaded; progress(arg1, arg2){\narg1 = event object current event object\n arg2 = {name: upload file name, percentage: upload progress percentage, raw: file information, size: file size, status: upload status, uid: uid} arg2 is the information about the uploaded file.\n// do something you want...}", + "defaultValue": "" + }, + { + "name": "change", + "sample": "upload-events", + "type": "Function(file, fileList)", + "desc": "The event is triggered when the file status changes. The event is triggered when a file is added, uploaded successfully, or uploaded unsuccessfully. change(file, fileList)\n//file Information about the file that is successfully uploaded.\n {name: file name, percentage: upload progress percentage, raw: file information, size: file size, status: upload status, uid: uid} \n// fileList: array type: number of files that are successfully uploaded.\n}", + "defaultValue": "" + }, + { + "name": "success", + "sample": "upload-events", + "type": "Function(arg1, arg2, arg3)", + "desc": "Event triggered when a file is successfully uploaded; success(arg1, arg2, arg3){// arg1 = res arg1 indicates the response information after the upload is successful. // arg2 = {name: upload file name, percentage: upload progress percentage, raw: file information, size: file size, status: upload status, uid: uid} arg2 is the currently uploaded file // arg3 = [] arg3 is the array of all uploaded files // do something you want...}", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/floatbar.json b/examples/docs/resources/pc/api/en-US/floatbar.json new file mode 100644 index 000000000..fd2d0eda5 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/floatbar.json @@ -0,0 +1,11 @@ +{ + "slots": [ + { + "name": "default", + "sample": "custom-style", + "type": "", + "desc": "Floating block content.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/form-item.json b/examples/docs/resources/pc/api/en-US/form-item.json new file mode 100644 index 000000000..9492c2314 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/form-item.json @@ -0,0 +1,122 @@ +{ + "attrs": [ + { + "name": "prop", + "sample": "form-validation", + "type": "String", + "desc": "Form field model. This attribute is mandatory when the validate and resetFields methods are used. The optional value of this attribute is -", + "defaultValue": "The default value of this attribute is the field in the model of the Form component." + }, + { + "name": "label", + "sample": "form-validation", + "type": "String", + "desc": "Label text; The optional value of this attribute is -", + "defaultValue": "The default value of this attribute is -" + }, + { + "name": "label-width", + "sample": "form-clear-validate", + "type": "String", + "desc": "Width of the form field label, for example, '50px'. Auto is supported. The optional value of this attribute is -", + "defaultValue": "The default value of this attribute is -" + }, + { + "name": "required", + "sample": "form-clear-validate", + "type": "Boolean", + "desc": "Indicates whether this parameter is mandatory. If this parameter is not set, the parameter is automatically generated based on the verification rule. The optional value of this attribute is -", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "rules", + "sample": "form-clear-validate", + "type": "Object", + "desc": "Form validation rule; The optional value of this attribute is -", + "defaultValue": "The default value of this attribute is -" + }, + { + "name": "error", + "sample": "", + "type": "String", + "desc": "Form field verification error information. If this parameter is set, the form verification status changes to error and the error information is displayed. The optional value of this attribute is -", + "defaultValue": "The default value of this attribute is -" + }, + { + "name": "show-message", + "sample": "form-validation", + "type": "Boolean", + "desc": "Whether to display verification error information; The optional value of this attribute is -", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "inline-message", + "sample": "", + "type": "Boolean", + "desc": "The validation information is displayed in rows. The optional value of this attribute is -", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "size", + "sample": "", + "type": "String", + "desc": "Controls the size of the component in the form field. The optional values of this attribute are medium / small / mini", + "defaultValue": "The default value of this attribute is null." + }, + { + "name": "validate-position", + "sample": "form-validation", + "type": "String", + "desc": "Specify the position where the verification dialog box is displayed. The value of this attribute can be top-start / top / top-end / left-start / left / left-end / right-start / right / right-end / bottom-start / bottom / bottom-end", + "defaultValue": "The default value of this attribute is top-end." + }, + { + "name": "validate-type", + "sample": "validate-type", + "type": "String", + "desc": "Verification type; The optional values of this attribute are tip / text", + "defaultValue": "The default value of this attribute is tip." + } + ], + "slots": [ + { + "name": "default", + "sample": "size", + "type": "", + "desc": "Default slot", + "defaultValue": "" + }, + { + "name": "label", + "sample": "slot-label", + "type": "", + "desc": "Label text content", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "resetField", + "sample": "form-validation", + "type": "", + "desc": "Reset the table item to the initial value and remove the verification result.", + "defaultValue": "" + }, + { + "name": "clearValidate", + "sample": "form-clear-validate", + "type": "", + "desc": "Remove the verification result of the table item.", + "defaultValue": "" + } + ], + "events": [ + { + "name": "validate", + "sample": "form-validation", + "type": "", + "desc": "This event is triggered after any form item is verified.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/form.json b/examples/docs/resources/pc/api/en-US/form.json new file mode 100644 index 000000000..4d7602586 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/form.json @@ -0,0 +1,298 @@ +{ + "formattrs": [ + { + "name": "form-item", + "sample": "form-in-row", + "type": "Object", + "desc": "For details about the FormItem component under Form, see the tiny.Widget.Form.FormItem attribute configuration of FormItem", + "defaultValue": "" + }, + { + "name": "model", + "sample": "form-validation", + "type": "Object", + "desc": "Form data object", + "defaultValue": "" + }, + { + "name": "rules", + "sample": "form-validation", + "type": "Object", + "desc": "Form validation rule", + "defaultValue": "" + }, + { + "name": "inline", + "sample": "form-in-row", + "type": "Boolean", + "desc": "In-line layout mode. The default value is false.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "label-position", + "sample": "size", + "type": "String", + "desc": "Layout position of the label in the form; The optional values of this attribute are right / left / top", + "defaultValue": "The default value of this attribute is right." + }, + { + "name": "label-suffix", + "sample": "frequently-used-form", + "type": "String", + "desc": "Label suffix in the form", + "defaultValue": "" + }, + { + "name": "label-width", + "sample": "frequently-used-form", + "type": "String", + "desc": "Label placeholder width in the form. The default value is 80px.", + "defaultValue": "The default value of this attribute is 80px." + }, + { + "name": "label-align", + "sample": "label-align", + "type": "Boolean", + "desc": "Check whether the text is aligned when the red asterisk next to the label of mandatory fields is displayed in the form.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "hide-required-asterisk", + "sample": "form-validation", + "type": "Boolean", + "desc": "Whether to display the red asterisk next to the label of mandatory fields", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "show-message", + "sample": "form-validation", + "type": "Boolean", + "desc": "Display verification error information.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "inline-message", + "sample": "", + "type": "Boolean", + "desc": "Display validation information in line format", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "validate-on-rule-change", + "sample": "custom-validation-rule", + "type": "Boolean", + "desc": "Whether to trigger a verification immediately after the rules attribute is changed", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "Controls the size of components in the form. The optional values of this attribute are medium / small / mini", + "defaultValue": "The default value of this attribute is null." + }, + { + "name": "disabled", + "sample": "size", + "type": "Boolean", + "desc": "Whether to disable all components in the form. If this parameter is set to true, the disabled attribute of components in the form does not take effect.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "novalid-tip", + "sample": "novalid-tip", + "type": "String", + "desc": "Whether to display the tip in the verification dialog box", + "defaultValue": "" + }, + { + "name": "validate-position", + "sample": "validation-position", + "type": "String", + "desc": "Specify the position where the verification dialog box is displayed. The value of this attribute can be top-start / top / top-end / left-start / left / left-end / right-start / right / right-end / bottom-start / bottom / bottom-end", + "defaultValue": "The default value of this attribute is right." + }, + { + "name": "validate-type", + "sample": "validate-type", + "type": "String", + "desc": "Verification type; The optional values of this attribute are tip / text", + "defaultValue": "The default value of this attribute is tip." + } + ], + "formslots": [ + { + "name": "default", + "sample": "form-validation", + "type": "", + "desc": "Default slot", + "defaultValue": "" + }, + { + "name": "label", + "sample": "slot-label", + "type": "", + "desc": "Label text slot", + "defaultValue": "" + } + ], + "formmethods": [ + { + "name": "validate", + "sample": "form-validation", + "type": "", + "desc": "Method for verifying the entire form. The parameter is a callback function. The callback function will be invoked after the verification is complete and two parameters are transferred: whether the verification is successful and whether the verification fails. If the callback function is not transferred, a promise is returned.", + "defaultValue": "" + }, + { + "name": "validateField", + "sample": "form-validation", + "type": "", + "desc": "Method for verifying some fields in a form", + "defaultValue": "" + }, + { + "name": "resetFields", + "sample": "form-validation", + "type": "", + "desc": "Reset all field values to the initial values and remove the verification result.", + "defaultValue": "" + }, + { + "name": "clearValidate", + "sample": "form-clear-validate", + "type": "", + "desc": "The verification result of removing a form item is transferred to the prop attribute of the form item to be removed or an array consisting of prop. If this parameter is not transferred, the verification result of the entire form is removed.", + "defaultValue": "" + } + ], + "formevents": [ + { + "name": "validate", + "sample": "form-validation", + "type": "", + "desc": "Triggered after any form item is verified", + "defaultValue": "" + } + ], + "formItemattrs": [ + { + "name": "prop", + "sample": "form-validation", + "type": "String", + "desc": "Form field model. This attribute is mandatory when the validate and resetFields methods are used. The optional value of this attribute is -", + "defaultValue": "The default value of this attribute is the field in the model of the Form component." + }, + { + "name": "label", + "sample": "form-validation", + "type": "String", + "desc": "Label text; The optional value of this attribute is -", + "defaultValue": "The default value of this attribute is -" + }, + { + "name": "label-width", + "sample": "form-clear-validate", + "type": "String", + "desc": "Width of the form field label, for example, '50px'. Auto is supported. The optional value of this attribute is -", + "defaultValue": "The default value of this attribute is -" + }, + { + "name": "required", + "sample": "form-clear-validate", + "type": "Boolean", + "desc": "Indicates whether this parameter is mandatory. If this parameter is not set, the parameter is automatically generated based on the verification rule. The optional value of this attribute is -", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "rules", + "sample": "form-clear-validate", + "type": "Object", + "desc": "Form validation rule; The optional value of this attribute is -", + "defaultValue": "The default value of this attribute is -." + }, + { + "name": "error", + "sample": "", + "type": "String", + "desc": "Form field verification error. If this parameter is set, the form verification status changes to error and the error information is displayed. The optional value of this attribute is -", + "defaultValue": "The default value of this attribute is -." + }, + { + "name": "show-message", + "sample": "form-validation", + "type": "Boolean", + "desc": "Whether to display verification error information; The optional value of this attribute is -", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "inline-message", + "sample": "", + "type": "Boolean", + "desc": "The validation information is displayed in rows. The optional value of this attribute is -", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "size", + "sample": "", + "type": "String", + "desc": "Controls the size of the component in the form field. The optional values of this attribute are medium / small / mini", + "defaultValue": "The default value of this attribute is null." + }, + { + "name": "validate-position", + "sample": "form-validation", + "type": "String", + "desc": "Specify the position where the verification dialog box is displayed. The value of this attribute can be top-start / top / top-end / left-start / left / left-end / right-start / right / right-end / bottom-start / bottom / bottom-end", + "defaultValue": "The default value of this attribute is top-end." + }, + { + "name": "validate-type", + "sample": "validate-type", + "type": "String", + "desc": "Verification type; The optional values of this attribute are tip / text", + "defaultValue": "The default value of this attribute is tip." + } + ], + "formItemslots": [ + { + "name": "default", + "sample": "size", + "type": "", + "desc": "Default slot", + "defaultValue": "" + }, + { + "name": "label", + "sample": "slot-label", + "type": "", + "desc": "Label text content", + "defaultValue": "" + } + ], + "formItemmethods": [ + { + "name": "resetField", + "sample": "form-validation", + "type": "", + "desc": "Reset the table item to the initial value and remove the verification result.", + "defaultValue": "" + }, + { + "name": "clearValidate", + "sample": "form-clear-validate", + "type": "", + "desc": "Remove the verification result of the table item.", + "defaultValue": "" + } + ], + "formItemevents": [ + { + "name": "validate", + "sample": "form-validation", + "type": "", + "desc": "This event is triggered after any form item is verified.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/fullscreen.json b/examples/docs/resources/pc/api/en-US/fullscreen.json new file mode 100644 index 000000000..f340feff2 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/fullscreen.json @@ -0,0 +1,73 @@ +{ + "attrs": [ + { + "name": "page-only", + "sample": "example-component", + "type": "Boolean", + "desc": "Display mode. The value true indicates that the web page is displayed in full screen mode, and the value false indicates that the browser is displayed in full screen mode. The default value is false", + "defaultValue": "" + }, + { + "name": "teleport", + "sample": "example-component", + "type": "Boolean", + "desc": "Indicates whether to move the target element to the body. true: move; false: do not move. The default value is false", + "defaultValue": "" + }, + { + "name": "z-index", + "sample": "example-component", + "type": "Number", + "desc": "ZIndex of the target element in full-screen display", + "defaultValue": "" + }, + { + "name": "fullscreen-class", + "sample": "example-component", + "type": "String", + "desc": "Style class name of the custom component wrapper", + "defaultValue": "" + }, + { + "name": "fullscreen", + "sample": "example-component", + "type": "Boolean", + "desc": "Whether to display a component in full screen mode. The default value is false", + "defaultValue": "" + }, + { + "name": "exit-on-click-wrapper", + "sample": "example-component", + "type": "Boolean", + "desc": "When the component is used in component mode, click the component wrapper to determine whether to disable full-screen display. The default value is true.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "example-component", + "type": "", + "desc": "User-defined content. Slots must be listed in the layout.", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "toggle", + "sample": "example-component", + "type": "", + "desc": "Switch the full-screen mode when the function mode is used.", + "defaultValue": "" + } + ], + "events": [ + { + "name": "update:fullscreen", + "sample": "example-component", + "type": "", + "desc": "Update the fullscreen attribute in component mode.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/gantt.json b/examples/docs/resources/pc/api/en-US/gantt.json new file mode 100644 index 000000000..87e712b71 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/gantt.json @@ -0,0 +1,76 @@ +{ + "attrs": [ + { + "name": "configs", + "sample": "", + "type": "Object", + "desc": "Configuration options such as dates, scale, and controls", + "defaultValue": "" + }, + { + "name": "columns", + "sample": "", + "type": "Array", + "desc": "Gantt Chart Column Configuration", + "defaultValue": "" + }, + { + "name": "scale", + "sample": "", + "type": "Object", + "desc": "Scale. You can set objects in the array to specify any number of scales.", + "defaultValue": "" + }, + { + "name": "subscales", + "sample": "", + "type": "Array", + "desc": "Specify the second time scale", + "defaultValue": "" + }, + { + "name": "events", + "sample": "", + "type": "Object", + "desc": "Including all processing events", + "defaultValue": "" + }, + { + "name": "locale", + "sample": "", + "type": "Object", + "desc": "Set component internationalization", + "defaultValue": "" + }, + { + "name": "tasks", + "sample": "", + "type": "Object", + "desc": "Setting a data set; Set the task item, including links (the type of the link dependency) and data (data)", + "defaultValue": "" + }, + { + "name": "skin", + "sample": "", + "type": "String", + "desc": "Set the skin of the Gantt chart", + "defaultValue": "" + }, + { + "name": "width", + "sample": "", + "type": "String", + "desc": "Set the width of the Gantt chart. If this parameter is not set, the width of the Gantt chart is adaptive. ;Set the width of the Gantt chart", + "defaultValue": "The default value of this attribute is 500px." + } + ], + "events": [ + { + "name": "ready", + "sample": "", + "type": "", + "desc": "Event triggered after Gantt chart rendering is complete", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/grid-column.json b/examples/docs/resources/pc/api/en-US/grid-column.json new file mode 100644 index 000000000..5e60e3c8e --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/grid-column.json @@ -0,0 +1,286 @@ +{ + "attrs": [ + { + "name": "align", + "sample": "grid-align#align-column-align", + "type": "String", + "desc": "Column alignment mode; The optional values of this attribute are left (to the left), center (to the center), and right (to the right)", + "defaultValue": "The default value of this attribute is the align inherited from the table." + }, + { + "name": "class-name", + "sample": "grid-custom-style#custom-style-cell-style", + "type": "String, Function", + "desc": "Append the class name to the cell, or the function Function({seq, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "multi", + "sample": "grid-filter#filter-default-filter", + "type": "Boolean", + "desc": "This is a built-in attribute of the filter object. Whether to allow multiple selections. Sets whether to display the Select Column check box. This parameter is valid only when columnType is set to'select'.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "method", + "sample": "grid-filter#filter-custom-filter", + "type": "Function", + "desc": "Function({value, row, column}) built-in filter method of the filter object", + "defaultValue": "" + }, + { + "name": "fixed", + "sample": "grid-fixed#fixed-left-fixed", + "type": "String", + "desc": "Fix the column on the left. Freezable can be frozen or unfreezed and can be operated on the table personalized panel. Frozen can only be frozen but cannot be unfreezed and cannot be operated on the personalized panel. Fix the column to the left or right. (Note: The fixed column should be placed on the left and right sides). The options of this attribute are left (fixed to the left) and right (fixed to the right)", + "defaultValue": "" + }, + { + "name": "footer-align", + "sample": "grid-align#align-footer-align-left-footer-align", + "type": "String", + "desc": "Alignment mode of the table tail column; The optional values of this attribute are left (to the left), center (to the center), and right (to the right)", + "defaultValue": "The default value of this attribute is Inherit align > Inherit footer-align of the table." + }, + { + "name": "footer-class-name", + "sample": "grid-footer#footer-footer-class-name", + "type": "String, Function", + "desc": "Add a class name to the cell at the end of the table. The class name can also be the function Function({$rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "header-align", + "sample": "grid-align#align-header-align-left-header-align", + "type": "String", + "desc": "Alignment mode of the table header column; The optional values of this attribute are left (to the left), center (to the center), and right (to the right)", + "defaultValue": "The default value of this attribute is Inherit align > Inherit table header-align." + }, + { + "name": "header-class-name", + "sample": "grid-header#header-header-class-name", + "type": "String, Function", + "desc": "Set the column header style name. Appends a className to the cell in the table header. It can also be a function Function({$rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "index-method", + "sample": "grid-serial-column#tiny-first-menu-custom-serial-column", + "type": "Function", + "desc": "This parameter is valid only for type=index. The index method Function({row, rowIndex, column, columnIndex}) is customized", + "defaultValue": "" + }, + { + "name": "min-width", + "sample": "grid-width-height#tiny-first-menu-min-width", + "type": "Number, String", + "desc": "Minimum column width; The remaining space is automatically allocated proportionally. The optional values of this attribute are integers, px,%", + "defaultValue": "The default value of this attribute is column-min-width inherited from the table." + }, + { + "name": "show-icon", + "sample": "grid-edit#tiny-first-menu-cell-editing", + "type": "Boolean", + "desc": "Indicates whether to display the column header editing icon. This parameter is valid during editing.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "params", + "sample": "grid-filter#filter-default-filter", + "type": "Object", + "desc": "Extra parameters (Customize some data parameters, which may be used in some special scenarios.)", + "defaultValue": "" + }, + { + "name": "remote-sort", + "sample": "grid-sort#sort-server-sort", + "type": "Boolean", + "desc": "Indicates whether to use server-side sorting. If this parameter is set to true, data is not processed.", + "defaultValue": "The default value of this attribute is remote-sort inherited from the table." + }, + { + "name": "resizable", + "sample": "grid-width-height#tiny-first-menu-resize-column-width", + "type": "Boolean", + "desc": "Set whether the column width can be adjusted. Whether the column can be resized by dragging the column width", + "defaultValue": "The default value of this attribute is resizable inherited from the table." + }, + { + "name": "show-header-overflow", + "sample": "grid-tip#tip-column-header-tip", + "type": "String,Boolean", + "desc": "If the table header is too long, an ellipsis is displayed. The optional values of this attribute are ellipsis (only the ellipsis is displayed), title (and the native title is displayed), and tooltip (and the tooltip is displayed)", + "defaultValue": "The default value of this attribute is show-header-overflow inherited from the table." + }, + { + "name": "show-overflow", + "sample": "grid-tip#tip-cell-tip", + "type": "String,Boolean", + "desc": "If the content is too long, an ellipsis is displayed. The optional values of this attribute are ellipsis (only the ellipsis is displayed), title (and the native title is displayed), and tooltip (and the tooltip is displayed)", + "defaultValue": "The default value of this attribute is show-overflow inherited from the table." + }, + { + "name": "sort-by", + "sample": "grid-sort#sort-combinations-sort", + "type": "String, Array", + "desc": "This parameter is valid only for sortable. It is a user-defined sorting attribute.", + "defaultValue": "" + }, + { + "name": "rules", + "sample": "", + "type": "Object", + "desc": "Form verification function", + "defaultValue": "" + }, + { + "name": "required", + "sample": "grid-validation#grid_Example-gridValid-editing-validation", + "type": "Boolean", + "desc": "Indicates whether this parameter is mandatory. If this parameter is not set, the parameter is automatically generated based on the verification rule.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "sort-method", + "sample": "grid-sort#sort-custom-sort", + "type": "Function", + "desc": "Customize the sorting method of all columns. When sorting is triggered, the function Function({data, column, property, order}) is invoked to return the sorting result.", + "defaultValue": "" + }, + { + "name": "sortable", + "sample": "grid-sort#sort-default-sort", + "type": "Boolean", + "desc": "Sets whether the data in the column can be sorted. ;Whether column sorting is allowed", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "title", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "String , Function", + "desc": "Column title (internationalization can be enabled), which can be Function(h, params)", + "defaultValue": "" + }, + { + "name": "tree-node", + "sample": "grid-tree-grid#tree-table-tree-grid-base", + "type": "Boolean", + "desc": "This parameter is valid only when tree-config is configured. It is a tree node.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "format-value", + "sample": "grid-edit#tiny-first-menu-format-value", + "type": "Function", + "desc": "Format the input value of the cell editor component", + "defaultValue": "" + }, + { + "name": "format-text", + "sample": "grid-renderer#grid_Example-gridRenderer-inner-renderer", + "type": "String , Function", + "desc": "Set the display obtaining editing type of the current table column. Sets the display obtaining editing type of the current table column. The function can also be Function(params). The optional value of this attribute is money / enum / select / number / integer / filesize / date / dateTime / longDateTime / time / longTime / yearMonth / ellipsis / rate / boole", + "defaultValue": "" + }, + { + "name": "type", + "sample": "grid-serial-column#tiny-first-menu-default-serial-column", + "type": "String", + "desc": "Set the type of the built-in column. Set the type of the built-in column. The value of this attribute can be index (sequence number), selection (check box), radio (radio button), or expand (expand row)", + "defaultValue": "" + }, + { + "name": "width", + "sample": "grid-width-height#tiny-first-menu-fixed-column-width", + "type": "Number , String", + "desc": "This parameter specifies the width of a column. The value can be pixel, percentage, or auto. When this parameter is set to auto, the column width is automatically adapted. ;column width; The optional values for this attribute are integers / px /%", + "defaultValue": "The default value of this attribute is column-width inherited from the table." + }, + { + "name": "format-config", + "sample": "grid-data-source#tiny-first-menu-column-asyn-rendering", + "type": "Object", + "desc": "Enable asynchronous rendering of data in this column. ; {data: [], // Column data source \n type: '', // Built-in render type, which is the same as the value of format-text.\n async: true, // After this parameter is set to true, data can be dynamically modified. It can also be configured as an object. When it is configured as an object, splitConfig.enabled (whether to enable the separation configuration), splitConfig.valueSplit (specify the separator of the value), splitConfig.textSplit (specify the separator of the text), and fetch (asynchronous column data) can be configured in the object. Rendering, request data)\n label: ''//Mapping of cell display content\n value: ''//Mapping of cell value}", + "defaultValue": "" + }, + { + "name": "class-name", + "sample": "grid-custom-style#custom-style-cell-style", + "type": "String, Function", + "desc": "Append the class name to the cell, or the function Function({seq, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "editor", + "sample": "grid-edit#tiny-first-menu-custom-editing", + "type": "Object , Function", + "desc": "Cell editing and rendering configuration item, which can also be Function(h, params); Set the edit type of the table column. This parameter is valid only when editMode is set to true and editabele is set to true.", + "defaultValue": "" + }, + { + "name": "field", + "sample": "grid-align#align-column-align", + "type": "String", + "desc": "Sets the field name of the data source corresponding to the table column. Note: This parameter cannot contain a semicolon ('). ', a character string starting with a digit. Chinese characters are not supported. Column field repetition is not supported. (This will cause configuration of personalized settings and invalid dragging of customized columns)", + "defaultValue": "" + }, + { + "name": "filter", + "sample": "grid-filter#filter-default-filter", + "type": "Boolean , Object", + "desc": "Set the filtering configuration of the table column. The default value is false. No filtering information is configured.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "renderer", + "sample": "grid-renderer#grid_Example-gridRenderer-custom-renderer", + "type": "Object , Function", + "desc": "Set the rendering type of a table column. It has a higher priority than the type attribute configuration of the column. Cell rendering configuration item. The priority of the configuration item is higher than that of the formatText attribute of the column. It can also be the function Function(h, params)", + "defaultValue": "" + }, + { + "name": "show-tip", + "sample": "grid-tip#tip-cell-tip", + "type": "Boolean", + "desc": "Whether to prompt cells in the table column", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "show-header-tip", + "sample": "grid-tip#tip-column-header-tip", + "type": "Boolean", + "desc": "Whether to prompt table column headers", + "defaultValue": "The default value of this attribute is false." + } + ], + "slots": [ + { + "name": "default", + "sample": "grid-header#header-custom-grid-header", + "type": "", + "desc": "Custom Content Template", + "defaultValue": "" + }, + { + "name": "edit", + "sample": "grid-editor#grid_Example-gridEdit-custom-editor-select", + "type": "", + "desc": "Customize an editable component template", + "defaultValue": "" + }, + { + "name": "filter", + "sample": "grid-filter#filter-custom-filter", + "type": "", + "desc": "Custom Filter Template", + "defaultValue": "" + }, + { + "name": "header", + "sample": "grid-header#header-slot-header", + "type": "", + "desc": "User-defined table header content template", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/grid-table.json b/examples/docs/resources/pc/api/en-US/grid-table.json new file mode 100644 index 000000000..d4d971f75 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/grid-table.json @@ -0,0 +1,1368 @@ +{ + "attrs": [ + { + "name": "pager", + "sample": "grid-pager#pager-inner-pager", + "type": "Object", + "desc": "Set the pagination configuration item. Use the pager attribute {component: Pager} to inject the pagination component and {attrs: {currentPage: 1,pageSize: 5,pageSizes: [5, 10], total: 0,layout:' total, prev, pager, next, jumper, sizes '} to configure pagination.", + "defaultValue": "" + }, + { + "name": "fetch-data", + "sample": "grid-data-source#tiny-first-menu-request-service", + "type": "Object", + "desc": "Querying Data on the Server", + "defaultValue": "" + }, + { + "name": "save-data", + "sample": "grid-toolbar#tiny-first-menu-save-data", + "type": "Object", + "desc": "Data storage method on the server", + "defaultValue": "" + }, + { + "name": "delete-data", + "sample": "", + "type": "Object", + "desc": "Deleting Server Data", + "defaultValue": "" + }, + { + "name": "row-group", + "sample": "grid-row-grouping#row-grouping", + "type": "Object", + "desc": "Set Row Group", + "defaultValue": "" + }, + { + "name": "toolbar", + "sample": "", + "type": "Object", + "desc": "Toolbar Configuration", + "defaultValue": "" + }, + { + "name": "align", + "sample": "grid-align#align-grid-align-left-grid-align", + "type": "String", + "desc": "All columns correspond to their modes. The optional values of this attribute are left (to the left), center (to the center), and right (to the right)", + "defaultValue": "The default value of this attribute is left." + }, + { + "name": "auto-resize", + "sample": "grid-width-height#tiny-first-menu-adaptive-grid-width-height", + "type": "Boolean", + "desc": "Parent element responsive listening (It may be used in scenarios where the parent element may change dynamically.)", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "border", + "sample": "grid-grid-border#tiny-first-menu-grid-border", + "type": "Boolean", + "desc": "Whether to contain vertical borders", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "cell-class-name", + "sample": "grid-custom-style#custom-style-cell-style", + "type": "String, Function", + "desc": "Append a class name to a cell, or the function Function({seq, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "column-key", + "sample": "grid-operation-column#tiny-first-menu-column-key", + "type": "Boolean", + "desc": "Whether to set the key attribute for the VNode in each column (not required unless otherwise specified)", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "column-min-width", + "sample": "grid-width-height#tiny-first-menu-column-min-width", + "type": "Number , String", + "desc": "Set the minimum width that can be adjusted. If this parameter is not set, the width of the column header span + 36 (fixed width of the header) is used by default. ;All minimum column widths; The remaining space is automatically allocated proportionally. The optional values of this attribute are integers, px,%", + "defaultValue": "" + }, + { + "name": "column-width", + "sample": "grid-width-height#tiny-first-menu-column-width", + "type": "Number, String", + "desc": "Width of all columns; The optional values of this attribute are integers, px,%", + "defaultValue": "The default value of this attribute is evenly distributed by default." + }, + { + "name": "context-menu", + "sample": "grid-context-menu#grid_Example-shortcutMenu-footer-menu", + "type": "Object", + "desc": "Shortcut Menu Configuration Item", + "defaultValue": "" + }, + { + "name": "edit-rules", + "sample": "grid-validation#grid_Example-gridValid-editing-validation", + "type": "Object", + "desc": "Validation Rule Configuration Item", + "defaultValue": "" + }, + { + "name": "expand-config", + "sample": "grid-tree-grid#tree-table-tree-grid-expand-config", + "type": "Object", + "desc": "Expanding Configuration Items", + "defaultValue": "" + }, + { + "name": "fit", + "sample": "grid-width-height#tiny-first-menu-adaptive-column-width", + "type": "Boolean", + "desc": "Whether the width of all columns is self-expanded", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "footer-align", + "sample": "grid-align#align-footer-align-left-footer-align", + "type": "String", + "desc": "Alignment mode of all table tail columns; The optional values of this attribute are left (to the left), center (to the center), and right (to the right)", + "defaultValue": "The default value of this attribute is inherited align." + }, + { + "name": "optimization", + "sample": "grid-grid-optimization#tiny-first-menu-grid-optimization", + "type": "Object", + "desc": "Optimize configuration items", + "defaultValue": "The default value of this attribute is {animat: true, delayHover: 250, scrollX: {gt: 100}, scrollY: {gt: 500}" + }, + { + "name": "params", + "sample": "", + "type": "Object", + "desc": "Extra Parameters", + "defaultValue": "" + }, + { + "name": "footer-cell-class-name", + "sample": "grid-custom-style#custom-style-footer-style-footer-cell-style", + "type": "String, Function", + "desc": "Add a class name to the cell at the end of the table, or the function Function({$rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "footer-method", + "sample": "grid-summary#summary-custom-summary", + "type": "Function", + "desc": "Function({columns, data}) for calculating the total at the end of the table", + "defaultValue": "" + }, + { + "name": "footer-row-class-name", + "sample": "grid-custom-style#custom-style-footer-style-footer-cell-style", + "type": "String, Function", + "desc": "Attach className to the row at the end of the table. It can also be a function Function({$rowIndex})", + "defaultValue": "" + }, + { + "name": "footer-span-method", + "sample": "grid-footer#footer-footer-row-or-column-span", + "type": "Object", + "desc": "Combine rows or columns at the end of a table. The Function({$rowIndex, column, columnIndex, $columnIndex, data}) function returns the calculated value.", + "defaultValue": "The default value of this attribute is {rowspan: 1, colspan: 1}" + }, + { + "name": "header-align", + "sample": "grid-align#align-header-align-left-header-align", + "type": "String", + "desc": "Alignment mode of all table header columns; The optional values of this attribute are left (to the left), center (to the center), and right (to the right)", + "defaultValue": "The default value of this attribute is inherited align." + }, + { + "name": "header-cell-class-name", + "sample": "grid-custom-style#custom-style-header-style-header-cell-style", + "type": "String, Function", + "desc": "Append a class name or function Function({$rowIndex, column, columnIndex, $columnIndex}) to the cell in the table header", + "defaultValue": "" + }, + { + "name": "header-row-class-name", + "sample": "grid-custom-style#custom-style-header-style-header-cell-style", + "type": "String, Function", + "desc": "Append className or function Function({$rowIndex}) to the row in the table header.", + "defaultValue": "" + }, + { + "name": "height", + "sample": "grid-width-height#tiny-first-menu-fixed-grid-height", + "type": "Number , String", + "desc": "Set the height of the table content area (excluding the table header and bottom). If this parameter is not set, the height of the table content area is adaptive. ; height of the table; Parent containers can be covered or the width and height can be fixed. The optional values of this attribute are integers, px,%", + "defaultValue": "" + }, + { + "name": "highlight-cell", + "sample": "grid-highlight#highlight-highlight-cell", + "type": "Boolean", + "desc": "This parameter is valid only when editConfig is configured. Whether to highlight the cell border during editing.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "highlight-current-column", + "sample": "grid-highlight#highlight-highlight-current-column", + "type": "Boolean", + "desc": "Are you sure you want to highlight the front column?", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "highlight-current-row", + "sample": "grid-highlight#highlight-highlight-current-row", + "type": "Boolean", + "desc": "Are you sure you want to highlight the current line?", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "highlight-hover-column", + "sample": "grid-highlight#highlight-highlight-hover-column", + "type": "Boolean", + "desc": "Do you want to highlight a column when you move the cursor to the column?", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "highlight-hover-row", + "sample": "grid-highlight#highlight-highlight-hover-row", + "type": "Boolean", + "desc": "Specify whether to highlight a row when you move the cursor to the row.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "keyboard-config", + "sample": "grid-tree-grid#tree-table-tree-grid-keyboard-operation", + "type": "Object", + "desc": "Key Configuration Item", + "defaultValue": "" + }, + { + "name": "loading", + "sample": "grid-grid-loading-tip#tiny-first-menu-grid-loading-off-tip", + "type": "Boolean", + "desc": "Check whether the table is being loaded.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "max-height", + "sample": "grid-width-height#tiny-first-menu-min-grid-height", + "type": "Number , String", + "desc": "Maximum height of the table content area (excluding the table header and bottom). ; The optional values of this attribute are integers, px,%", + "defaultValue": "" + }, + { + "name": "mouse-config", + "sample": "grid-keyboard#mouse-config", + "type": "Object", + "desc": "Mouse Configuration Item", + "defaultValue": "" + }, + { + "name": "radio-config", + "sample": "grid-operation-column#tiny-first-menu-default-serial-column", + "type": "Object", + "desc": "Option button configuration item", + "defaultValue": "" + }, + { + "name": "remote-filter", + "sample": "grid-filter#filter-server-filter", + "type": "Boolean", + "desc": "Whether to use server-side filtering for all columns. If this parameter is set to true, data is not processed.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "remote-sort", + "sample": "grid-filter#filter-server-filter", + "type": "Boolean", + "desc": "Whether to sort all data on the server. The default value is false. The server-side sorting is not performed.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "resizable", + "sample": "grid-width-height#tiny-first-menu-resize-column-width", + "type": "Boolean", + "desc": "Set whether to allow column width adjustment", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "row-class-name", + "sample": "grid-custom-style#custom-style-row-style", + "type": "String, Function", + "desc": "Attach a class name to a row. It can also be a function Function({seq, row, rowIndex, $rowIndex})", + "defaultValue": "" + }, + { + "name": "row-id", + "sample": "", + "type": "String", + "desc": "Field name of the unique primary key of user-defined row data (The row data must have a unique primary key, which is automatically generated by default.)", + "defaultValue": "The default value of this attribute is _XID" + }, + { + "name": "row-key", + "sample": "", + "type": "Boolean", + "desc": "Whether the key attribute needs to be set for each VNode in each line (not required unless otherwise specified)", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "select-config", + "sample": "grid-tree-grid#tree-table-tree-grid-operation-column", + "type": "Object", + "desc": "Check box configuration item", + "defaultValue": "" + }, + { + "name": "show-footer", + "sample": "grid-summary#summary-custom-summary", + "type": "Boolean", + "desc": "Whether to display the total at the end of the table", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "show-header", + "sample": "grid-header#header-hide-grid-header", + "type": "Boolean", + "desc": "Display table header", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "show-header-overflow", + "sample": "grid-tip#tip-column-header-tip", + "type": "Boolean, String", + "desc": "Sets the table header to be displayed as an ellipsis when it is too long. The optional values of this attribute are ellipsis (only the ellipsis is displayed), title (and the native title is displayed), and tooltip (and the tooltip is displayed)", + "defaultValue": "" + }, + { + "name": "show-overflow", + "sample": "grid-tip#tip-cell-tip", + "type": "Boolean, String", + "desc": "All content is displayed as an ellipsis when it is too long. (If the column is fixed, you are advised to set this parameter to improve the rendering speed.) The optional values of this attribute are ellipsis (only the ellipsis is displayed), title (and the native title is displayed), and tooltip (and the tooltip is displayed)", + "defaultValue": "" + }, + { + "name": "size", + "sample": "grid-grid-size#tiny-first-menu-grid-size", + "type": "String", + "desc": "Table size; The options of this attribute are medium, small, and mini", + "defaultValue": "" + }, + { + "name": "sort-config", + "sample": "grid-sort#sort-default-sort", + "type": "Object", + "desc": "Sort Configuration Item", + "defaultValue": "" + }, + { + "name": "sort-method", + "sample": "grid-sort#sort-custom-sort", + "type": "Function", + "desc": "Customize the sorting method of all columns. When sorting is triggered, the function Function({data, column, property, order}) is invoked to return the sorting result.", + "defaultValue": "" + }, + { + "name": "span-method", + "sample": "grid-span#span-column-span", + "type": "Object", + "desc": "Combine rows or columns. The Function({seq, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, data}) function returns the calculated value.", + "defaultValue": "The default value of this attribute is {rowspan: 1, colspan: 1}" + }, + { + "name": "start-index", + "sample": "grid-serial-column#tiny-first-menu-custom-serial-column", + "type": "Number", + "desc": "This parameter is valid only for the column whose type is index. It is the start value of the dynamic index.", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "stripe", + "sample": "grid-grid-stripe#stripe-stripe", + "type": "Boolean", + "desc": "Whether the zebra print is displayed", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "sync-resize", + "sample": "grid-width-height#tiny-first-menu-adaptive-grid-width-height", + "type": "Boolean", + "desc": "Responsive mode follows an attribute. (This may be used in scenarios where an attribute is used to control the display/hide switch)", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "tree-config", + "sample": "grid-tree-grid#tree-table-tree-grid-base", + "type": "Object", + "desc": "Tree structure configuration item", + "defaultValue": "" + }, + { + "name": "valid-config", + "sample": "grid-validation#grid_Example-gridValid-editing-validation", + "type": "Object", + "desc": "Verify configuration items", + "defaultValue": "" + }, + { + "name": "summary-config", + "sample": "grid-summary#summary-configuration-summary", + "type": "Object", + "desc": "Configuration of the table statistics function", + "defaultValue": "" + }, + { + "name": "sortable", + "sample": "grid-customized#custom-column-sort", + "type": "Boolean", + "desc": "Sets whether column data can be sorted. The default value is true. The value can be sorted.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "auto-load", + "sample": "grid-data-source#tiny-first-menu-auto-load", + "type": "Boolean", + "desc": "", + "defaultValue": "Whether to enable the automatic request service. This parameter is valid when fetch-data is configured. The default value of this parameter is true." + }, + { + "name": "is-async-column", + "sample": "grid-data-source#tiny-first-menu-column-asyn-rendering", + "type": "Boolean", + "desc": "Sets whether the column of a table is loaded in lazy mode. Indicates whether to enable the asynchronous column function. This function is used together with scrollLoad.", + "defaultValue": "" + }, + { + "name": "columns", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "Array", + "desc": "Configuration information in the table column. For details, see the configuration items in the column.", + "defaultValue": "" + }, + { + "name": "scroll-load", + "sample": "grid-large-data#tiny-first-menu-scroll-paging", + "type": "Object", + "desc": "Rolling loading configuration; Indicates whether to load scrolling pages. This parameter is valid only when showPager is set to true.", + "defaultValue": "" + }, + { + "name": "row-span", + "sample": "grid-span#span-row-span-row-span-easy", + "type": "Array", + "desc": "Set Row Merge", + "defaultValue": "" + }, + { + "name": "render-empty", + "sample": "", + "type": "Function", + "desc": "Empty data rendering", + "defaultValue": "" + }, + { + "name": "events", + "sample": "grid-event#event-grid-events", + "type": "Object", + "desc": "Event Object", + "defaultValue": "" + }, + { + "name": "data", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "Array", + "desc": "Set the table data. ", + "defaultValue": "" + }, + { + "name": "expand-last-column", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether the last column fills the entire table when scrolling horizontally. The default value is false. The last column does not fill the entire table.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "head-custom", + "sample": "", + "type": "String", + "desc": "Set the container selector of the customized table header. ;User-defined table headers are implemented through columns internal hierarchy or nesting.", + "defaultValue": "" + }, + { + "name": "summary-config", + "sample": "grid-summary#summary-configuration-summary", + "type": "Object", + "desc": "Set the table statistics function.", + "defaultValue": "" + }, + { + "name": "context-menu", + "sample": "grid-context-menu#grid_Example-shortcutMenu-header-menu", + "type": "Object", + "desc": "Menu configuration information.", + "defaultValue": "" + }, + { + "name": "min-height", + "sample": "grid-width-height#tiny-first-menu-min-grid-height", + "type": "Number , String", + "desc": "Set the minimum height of the table content area (excluding the table header and bottom)", + "defaultValue": "" + }, + { + "name": "operation", + "sample": "", + "type": "Object", + "desc": "Table operation column configuration information; Set the renderer of columns to customize the column content or use the embedded component to customize the column content.", + "defaultValue": "" + }, + { + "name": "render-util", + "sample": "", + "type": "Object", + "desc": "Grid rendering is the input template tool method object, which can be used in both renderer and content renderers. ; Use the renderer of the column configuration to configure the custom content display", + "defaultValue": "" + }, + { + "name": "drop-config", + "sample": "grid-drag#drag-row-drag", + "type": "Object", + "desc": "Drag configuration information up and down in a table row.", + "defaultValue": "" + }, + { + "name": "edit-config", + "sample": "grid-editor#grid_Example-gridEdit-inner-editor", + "type": "Object", + "desc": "Sets whether to enable row editing. That is, each cell is in the editing state. This parameter is valid only when editMode is set to true. ;Set mode = row to enable row editing", + "defaultValue": "" + }, + { + "name": "seq-serial", + "sample": "grid-pager#pager-inner-pager", + "type": "Boolean", + "desc": "Specifies whether row sequence numbers are consecutive. The value of seqSerial is valid only when showSeq is set to true.", + "defaultValue": "Sets whether row sequence numbers are consecutive. This parameter is valid only when pagination is enabled. The default value of this parameter is false." + }, + { + "name": "tooltip-config", + "sample": "", + "type": "Object", + "desc": "Component configuration information. For details, see Hae.Widget.Tip.op. ; Grid built-in tip configuration information", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "", + "type": "", + "desc": "Default slot (table column )", + "defaultValue": "" + }, + { + "name": "toolbar", + "sample": "", + "type": "", + "desc": "Toolbar, (including: zoom, personalization, refresh table, and custom buttons) ", + "defaultValue": "" + }, + { + "name": "pager", + "sample": "grid-pager#pager-inner-pager", + "type": "", + "desc": "Paging plug-in, ", + "defaultValue": "" + }, + { + "name": "empty", + "sample": "grid-empty-data-tip#tiny-first-menu-empty-data-tip", + "type": "", + "desc": "Text content displayed when data is empty", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "clearActived()", + "sample": "grid-edit#tiny-first-menu-trigger-mode-for-editing", + "type": "", + "desc": "Manually clear the cell activation status.", + "defaultValue": "" + }, + { + "name": "clearAll()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Manually clear all conditions in the table and restore the table to the initial state. (This parameter may be used in adding, deleting, modifying, and querying data, for example, clearing the table cache after data is saved.)", + "defaultValue": "" + }, + { + "name": "clearCurrentColumn()", + "sample": "grid-highlight#highlight-highlight-current-column", + "type": "", + "desc": "Manually clear the highlighted status of the current column.", + "defaultValue": "" + }, + { + "name": "clearCurrentRow()", + "sample": "grid-highlight#highlight-highlight-current-row", + "type": "", + "desc": "Used in the current line to manually clear the current highlighted status.", + "defaultValue": "" + }, + { + "name": "clearData(rows, field)", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Manually clear the cell content. If no parameter is transferred, the entire table content is cleared. If a row is transferred, the specified row content is cleared. If a specified field is transferred, the field content is cleared.", + "defaultValue": "" + }, + { + "name": "clearFilter(field)", + "sample": "grid-filter#filter-default-filter", + "type": "", + "desc": "Manually clear the filter criteria (if field is not transferred, all filter criteria will be cleared). The data will be restored to the unfiltered state.", + "defaultValue": "" + }, + { + "name": "clearRadioRow()", + "sample": "grid-operation-column#tiny-first-menu-default-serial-column", + "type": "", + "desc": "Used to manually clear the selection of a single row.", + "defaultValue": "" + }, + { + "name": "clearRowExpand()", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "Manually clear the expanded row status. The data will be restored to the unexpanded state.", + "defaultValue": "" + }, + { + "name": "clearScroll()", + "sample": "grid-width-height#tiny-first-menu-min-grid-height", + "type": "", + "desc": "Manually clear scrolling information and restore it to the initial state.", + "defaultValue": "" + }, + { + "name": "clearSelected()", + "sample": "grid-highlight#highlight-highlight-cell", + "type": "", + "desc": "Manually clear the cell selection status.", + "defaultValue": "" + }, + { + "name": "clearSelection()", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "Used to manually clear the selection of multiple rows.", + "defaultValue": "" + }, + { + "name": "clearSort()", + "sample": "grid-sort#sort-default-sort", + "type": "", + "desc": "If you manually clear the sorting criteria, data will be restored to the unsorted state.", + "defaultValue": "" + }, + { + "name": "clearTreeExpand()", + "sample": "grid-tree-grid#tree-table-tree-grid-insert-delete-update", + "type": "", + "desc": "Manually clear the expanded status of tree nodes. Data will be restored to the unexpanded status.", + "defaultValue": "" + }, + { + "name": "closeFilter()", + "sample": "grid-filter#filter-default-filter", + "type": "", + "desc": "Manually close the filtering panel (this may be used in some special scenarios).", + "defaultValue": "" + }, + { + "name": "closeMenu()", + "sample": "grid-context-menu#grid_Example-shortcutMenu-header-menu", + "type": "", + "desc": "Close the shortcut menu manually (this may be used in some special scenarios).", + "defaultValue": "" + }, + { + "name": "createData(records)", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "", + "desc": "Create a data object. (This field may be used in some special scenarios. The system automatically checks the field name of the data. If the field name does not exist, the system automatically defines the field name.)", + "defaultValue": "" + }, + { + "name": "createRow(records)", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "", + "desc": "Create a Row|Rows object. (This parameter may be used when data needs to be manually inserted in some special scenarios.)", + "defaultValue": "" + }, + { + "name": "exportCsv(options)", + "sample": "grid-import-export#tiny-first-menu-export-excel", + "type": "", + "desc": "Export table data to a .csv file. (All mainstream browsers are supported. Rows or columns cannot be merged.)", + "defaultValue": "" + }, + { + "name": "fullValidate(rows, callback)", + "sample": "grid-validation#grid_Example-gridValid-before-submit-validation", + "type": "", + "desc": "Table integrity verification function. The difference between the function and validate is that all rules of full data are verified.", + "defaultValue": "" + }, + { + "name": "getActiveRow()", + "sample": "grid-edit#tiny-first-menu-trigger-mode-for-editing", + "type": "", + "desc": "Obtain activated row data", + "defaultValue": "" + }, + { + "name": "getColumnByField(field)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "Obtain a column based on the column field name.", + "defaultValue": "" + }, + { + "name": "getColumnById(colid)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "Obtain a column based on its unique primary key.", + "defaultValue": "" + }, + { + "name": "getColumnIndex(column)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "Obtain indexes relative to columns based on columns.", + "defaultValue": "" + }, + { + "name": "getColumnNode(cell)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "Obtain the column information based on the th/td element.", + "defaultValue": "" + }, + { + "name": "getColumns(columnIndex)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "Obtains visible columns of a table. You can also specify an index to obtain columns.", + "defaultValue": "" + }, + { + "name": "getCurrentRow()", + "sample": "", + "type": "", + "desc": "Used for the current row to obtain the data of the current row.", + "defaultValue": "" + }, + { + "name": "getData(rowIndex)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "Obtain data. The behavior is the same as that of data. You can also specify an index to obtain data.", + "defaultValue": "" + }, + { + "name": "getInsertRecords()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Obtain the new data.", + "defaultValue": "" + }, + { + "name": "getRadioRow()", + "sample": "", + "type": "", + "desc": "Used to select a row and obtain the selected data.", + "defaultValue": "" + }, + { + "name": "getRecordset()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Obtain the table data set. (Obtain the added, deleted, and modified data, which is convenient for adding, deleting, modifying, and querying tables.)", + "defaultValue": "" + }, + { + "name": "getRemoveRecords()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Obtain deleted data.", + "defaultValue": "" + }, + { + "name": "getRowById(rowid)", + "sample": "", + "type": "", + "desc": "Obtain a row based on its unique primary key.", + "defaultValue": "" + }, + { + "name": "getRowIndex(row:Object)", + "sample": "", + "type": "", + "desc": "Obtain the index relative to the data based on the row.", + "defaultValue": "" + }, + { + "name": "getRowNode(tr)", + "sample": "", + "type": "", + "desc": "Obtain row information based on the tr element.", + "defaultValue": "" + }, + { + "name": "getSelectRecords()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Used to select multiple rows and obtain the selected data.", + "defaultValue": "" + }, + { + "name": "getTableColumn()", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "", + "desc": "Obtains the columns of the current table. (complete full table header column, full table header column after processing condition, table header column in current rendering)", + "defaultValue": "" + }, + { + "name": "getTableData()", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "", + "desc": "Obtain the data in the current table. (complete table body data, full table body data after processing conditions, table body data in current rendering, table tail data in current rendering)", + "defaultValue": "" + }, + { + "name": "getUpdateRecords()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Obtain modified data.", + "defaultValue": "" + }, + { + "name": "hasActiveRow(row)", + "sample": "grid-edit#tiny-first-menu-trigger-mode-for-editing", + "type": "", + "desc": "Check whether the row is in the editing state.", + "defaultValue": "" + }, + { + "name": "hasRowChange(row, field)", + "sample": "grid-edit#tiny-first-menu-row-editing", + "type": "", + "desc": "Check whether the row or column data is changed.", + "defaultValue": "" + }, + { + "name": "hasRowExpand(row)", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "Check whether the row is expanded.", + "defaultValue": "" + }, + { + "name": "hasTreeExpand(row)", + "sample": "grid-tree-grid#tree-table-tree-grid-expand", + "type": "", + "desc": "Check whether the tree node is expanded.", + "defaultValue": "" + }, + { + "name": "hideColumn(column)", + "sample": "grid-customized#custom-column-visible-hidden", + "type": "", + "desc": "Hide a specified column", + "defaultValue": "" + }, + { + "name": "insert(records)", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Add data to the table. ;Insert data to the table by adding one or more rows of new data from the first row.", + "defaultValue": "" + }, + { + "name": "insertAt(records, row)", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Insert one or more rows from the specified position to the table. Second parameter: row specifies the position (tree tables are not supported), null inserts from the first row, and - 1 inserts from the last", + "defaultValue": "" + }, + { + "name": "loadColumn(columns)", + "sample": "grid-large-data#large-data-load-column", + "type": "", + "desc": "Load column configuration (This may be used in scenarios where table columns need to be overloaded and partially incremented.)", + "defaultValue": "" + }, + { + "name": "loadData(data)", + "sample": "grid-large-data#tiny-first-menu-full-data-loading", + "type": "", + "desc": "Load data. (This parameter may be used when table data needs to be reloaded or partially incremented.)", + "defaultValue": "" + }, + { + "name": "recalculate()", + "sample": "grid-width-height#recalculate", + "type": "", + "desc": "Recalculate the table. (This may be used in some special scenarios, such as hidden tables and column width update.)", + "defaultValue": "" + }, + { + "name": "refreshColumn()", + "sample": "grid-customized#custom-column-visible-hidden", + "type": "", + "desc": "Refresh column configuration (This parameter may be used in the scenario of displaying or hiding columns.)", + "defaultValue": "" + }, + { + "name": "refreshData()", + "sample": "grid-tree-grid#tree-table-tree-grid-insert-delete-update", + "type": "", + "desc": "Refresh data synchronously. If this method is used, the component does not record the addition, deletion, or modification status and can only implement the corresponding logic. (It may be used in some special scenarios, for example, when the elements of a deep tree node change)", + "defaultValue": "" + }, + { + "name": "reloadCustoms(customs)", + "sample": "grid-customized#custom-server-storage", + "type": "", + "desc": "Display or hide columns during initialization loading (this parameter may be used in asynchronous update scenarios).", + "defaultValue": "" + }, + { + "name": "remove(rows)", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Delete data in a specified row or [row, ...] to delete multiple data records. If the value is empty, all data records are deleted.", + "defaultValue": "" + }, + { + "name": "removeSelecteds()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Delete all selected rows.", + "defaultValue": "" + }, + { + "name": "resetAll()", + "sample": "grid-customized#custom-column-width", + "type": "", + "desc": "Manually reset all operations on a column and restore the column to the initial state. (If the toolbar has been associated, the column will be updated accordingly.)", + "defaultValue": "" + }, + { + "name": "resetCustoms()", + "sample": "grid-customized#custom-column-width", + "type": "", + "desc": "Manually reset the display/hide operation of a column to restore the initial state. (If the toolbar has been associated, the operation will be updated accordingly.)", + "defaultValue": "" + }, + { + "name": "resetResizable()", + "sample": "grid-customized#custom-column-width", + "type": "", + "desc": "Manually reset the column width and drag the operation to the initial state. (If the toolbar has been associated, the operation will be updated accordingly.)", + "defaultValue": "" + }, + { + "name": "revertData(rows, field)", + "sample": "grid-edit#tiny-first-menu-row-editing", + "type": "", + "desc": "Restore the data of a specified row or the entire table.", + "defaultValue": "" + }, + { + "name": "scrollTo(scrollLeft, scrollTop)", + "sample": "grid-large-data#large-data-scroll-to", + "type": "", + "desc": "If there is a scroll bar, scroll to the corresponding position.", + "defaultValue": "" + }, + { + "name": "scrollToColumn(column)", + "sample": "grid-large-data#large-data-scroll-to", + "type": "", + "desc": "If there is a scroll bar, scroll to the corresponding column.", + "defaultValue": "" + }, + { + "name": "scrollToRow(row)", + "sample": "grid-large-data#large-data-scroll-to", + "type": "", + "desc": "If there is a scroll bar, scroll to the corresponding line.", + "defaultValue": "" + }, + { + "name": "setActiveCell(row, field)", + "sample": "grid-edit#tiny-first-menu-cell-editing", + "type": "", + "desc": "Activate cell editing", + "defaultValue": "" + }, + { + "name": "setActiveRow(row)", + "sample": "grid-edit#tiny-first-menu-cell-editing", + "type": "", + "desc": "Enable row editing. If mode is set to cell, the first cell is activated by default.", + "defaultValue": "" + }, + { + "name": "setAllRowExpansion(checked)", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "Set whether to expand all lines.", + "defaultValue": "" + }, + { + "name": "setAllSelection(checked)", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "Used to select multiple rows and set the selected status of all rows.", + "defaultValue": "" + }, + { + "name": "setAllTreeExpansion(checked)", + "sample": "grid-tree-grid#tree-table-tree-grid-operation-column", + "type": "", + "desc": "Set whether to expand all tree nodes.", + "defaultValue": "" + }, + { + "name": "setCurrentRow(row)", + "sample": "grid-highlight#highlight-highlight-hover-row", + "type": "", + "desc": "This parameter is used to highlight a line in the current line.", + "defaultValue": "" + }, + { + "name": "setRadioRow(row)", + "sample": "grid-operation-column#tiny-first-menu-default-serial-column", + "type": "", + "desc": "Used to select a single line and set the selected status of a line.", + "defaultValue": "" + }, + { + "name": "setRowExpansion(rows, checked)", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "Set the row to be expanded. The two parameters specify whether to expand the row.", + "defaultValue": "" + }, + { + "name": "setSelection(rows, checked)", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "This parameter is used to select multiple lines. The second parameter indicates whether the line is selected.", + "defaultValue": "" + }, + { + "name": "setTreeExpansion(rows, checked)", + "sample": "grid-tree-grid#tree-table-tree-grid-operation-column", + "type": "", + "desc": "Set the tree node to be expanded. The two parameters are used to set whether to expand the tree node.", + "defaultValue": "" + }, + { + "name": "showColumn(column)", + "sample": "grid-customized#custom-column-visible-hidden", + "type": "", + "desc": "Display specified columns", + "defaultValue": "" + }, + { + "name": "sort(field, order)", + "sample": "grid-sort#sort-custom-sort", + "type": "", + "desc": "Manually sort the table. If order is empty, the sorting is automatically switched.", + "defaultValue": "" + }, + { + "name": "toggleAllSelection()", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "Used to select multiple rows and switch the selection status of all rows.", + "defaultValue": "" + }, + { + "name": "toggleRowExpansion(row)", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "Used to switch between expanded rows in a table.", + "defaultValue": "" + }, + { + "name": "toggleRowSelection(row)", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "Used to select multiple rows and switch the selection status of a row.", + "defaultValue": "" + }, + { + "name": "toggleTreeExpansion(row)", + "sample": "grid-tree-grid#tree-table-tree-grid-operation-column", + "type": "", + "desc": "Used to switch between tree-shaped tables and expand tree-shaped nodes.", + "defaultValue": "" + }, + { + "name": "validate(rows, callback)", + "sample": "grid-validation#grid_Example-gridValid-before-submit-validation", + "type": "", + "desc": "Table validation function. If row or rows are specified, one or more specified rows are verified. Otherwise, the entire table is verified. This callback function is invoked after the verification is complete and two parameters are transferred: (whether the verification is successful, that is, the most recent column of fields that fail to pass the verification). If the callback function is not passed, a promise is returned", + "defaultValue": "" + }, + { + "name": "getSelectRecords", + "sample": "", + "type": "", + "desc": "Obtain the data of the selected identifier.", + "defaultValue": "" + }, + { + "name": "getUpdateRecords", + "sample": "", + "type": "", + "desc": "Obtain data for updating identifiers (excluding data for deleting and adding identifiers).", + "defaultValue": "" + }, + { + "name": "renderSort", + "sample": "", + "type": "", + "desc": "Group/Merge Rendering Sort. Prerequisites: Data has been grouped or combined.", + "defaultValue": "" + } + ], + "events": [ + { + "name": "current-page-change", + "sample": "", + "type": "", + "desc": "This event is valid only when pager-config is configured. This event is triggered when the current page changes.", + "defaultValue": "" + }, + { + "name": "page-change", + "sample": "", + "type": "", + "desc": "This event is valid only when pager-config is configured. This event is triggered when paging changes.", + "defaultValue": "" + }, + { + "name": "toolbar-button-click", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "This event is triggered when a toolbar button is clicked.", + "defaultValue": "" + }, + { + "name": "cell-click", + "sample": "grid-event#event-cell-click-event", + "type": "", + "desc": "This event is triggered when a cell is clicked.", + "defaultValue": "" + }, + { + "name": "cell-context-menu", + "sample": "grid-context-menu#grid_Example-shortcutMenu-menu-permissions", + "type": "", + "desc": "This event is triggered when a cell is right-clicked.", + "defaultValue": "" + }, + { + "name": "cell-dblclick", + "sample": "grid-event#event-cell-dblclick-event", + "type": "", + "desc": "This event is triggered when a cell is double-clicked.", + "defaultValue": "" + }, + { + "name": "cell-mouseenter", + "sample": "grid-event#event-cell-mouseenter-event", + "type": "", + "desc": "This event is triggered when a cell is hovered.", + "defaultValue": "" + }, + { + "name": "cell-mouseleave", + "sample": "grid-event#event-cell-mouseleave-event", + "type": "", + "desc": "This event is triggered when the hover cell exits.", + "defaultValue": "" + }, + { + "name": "context-menu-click", + "sample": "grid-context-menu#grid_Example-shortcutMenu-header-menu", + "type": "", + "desc": "This event is valid only when context-menu is configured. This event is triggered when a shortcut menu is clicked.", + "defaultValue": "" + }, + { + "name": "current-change", + "sample": "", + "type": "", + "desc": "This event is triggered when a row is manually selected and its value changes. This event is valid only for highlightCurrentRow.", + "defaultValue": "" + }, + { + "name": "edit-actived", + "sample": "grid-event#event-edit-actived-event", + "type": "", + "desc": "This event is triggered when a cell is activated for editing.", + "defaultValue": "" + }, + { + "name": "edit-closed", + "sample": "grid-event#event-edit-closed-event", + "type": "", + "desc": "This event is triggered when a cell is closed in editing state.", + "defaultValue": "" + }, + { + "name": "edit-disabled", + "sample": "grid-event#event-edit-disabled-event", + "type": "", + "desc": "This event is triggered when a cell is activated and the cell is disabled.", + "defaultValue": "" + }, + { + "name": "filter-change", + "sample": "grid-filter#filter-server-filter", + "type": "", + "desc": "This event is triggered when the filter criteria change.", + "defaultValue": "" + }, + { + "name": "footer-cell-click", + "sample": "", + "type": "", + "desc": "This event is triggered when a cell at the end of a table is clicked.", + "defaultValue": "" + }, + { + "name": "footer-cell-context-menu", + "sample": "grid-context-menu#grid_Example-shortcutMenu-cell-menu", + "type": "", + "desc": "This event is triggered when a cell at the end of a table is right-clicked.", + "defaultValue": "" + }, + { + "name": "footer-cell-dblclick", + "sample": "", + "type": "", + "desc": "This event is triggered when a cell at the end of a table is double-clicked.", + "defaultValue": "" + }, + { + "name": "header-cell-click", + "sample": "grid-event#event-header-click-event", + "type": "", + "desc": "This event is triggered when a table header cell is clicked.", + "defaultValue": "" + }, + { + "name": "header-cell-context-menu", + "sample": "", + "type": "", + "desc": "This event is triggered when a cell in the table header is right-clicked.", + "defaultValue": "" + }, + { + "name": "header-cell-dblclick", + "sample": "grid-event#event-header-dblclick-event", + "type": "", + "desc": "This event is triggered when a table header cell is double-clicked.", + "defaultValue": "" + }, + { + "name": "radio-change", + "sample": "", + "type": "", + "desc": "This event is triggered when type=radio is selected manually and the value changes.", + "defaultValue": "" + }, + { + "name": "resizable-change", + "sample": "", + "type": "", + "desc": "This event is triggered when the column width changes.", + "defaultValue": "" + }, + { + "name": "scroll", + "sample": "grid-event#event-grid-scroll-event", + "type": "", + "desc": "This event is triggered when a table scrolls.", + "defaultValue": "" + }, + { + "name": "select-all", + "sample": "", + "type": "", + "desc": "This parameter is valid only when type=selection is selected. This event is triggered when Select All is selected manually.", + "defaultValue": "" + }, + { + "name": "select-change", + "sample": "", + "type": "", + "desc": "This event is triggered when type=selection is manually selected and the value changes.", + "defaultValue": "" + }, + { + "name": "toggle-expand-change", + "sample": "", + "type": "", + "desc": "This event is triggered when a row is expanded or collapsed.", + "defaultValue": "" + }, + { + "name": "toggle-tree-change", + "sample": "", + "type": "", + "desc": "This event is triggered when a tree node is expanded or collapsed.", + "defaultValue": "" + }, + { + "name": "valid-error", + "sample": "", + "type": "", + "desc": "This event is triggered when data verification fails.", + "defaultValue": "" + }, + { + "name": "BeforeEdit", + "sample": "", + "type": "", + "desc": "Click a cell to display the event triggered before editing the component. ;Click the cell to display the event triggered before editing the component, that is, the activeMethod method in edit-config", + "defaultValue": "" + }, + { + "name": "CellClick", + "sample": "", + "type": "", + "desc": "This event is triggered when a cell is clicked.", + "defaultValue": "" + }, + { + "name": "sort-change", + "sample": "grid-sort#sort-server-sort", + "type": "", + "desc": "This event is triggered before data sorting is performed when a column header is clicked. ;This event is triggered when the sorting condition changes.", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/grid-toolbar.json b/examples/docs/resources/pc/api/en-US/grid-toolbar.json new file mode 100644 index 000000000..4f9acab61 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/grid-toolbar.json @@ -0,0 +1,113 @@ +{ + "attrs": [ + { + "name": "buttons", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "Array", + "desc": "button list", + "defaultValue": "" + }, + { + "name": "id", + "sample": "grid-customized#custom-column-width", + "type": "String", + "desc": "Unique ID", + "defaultValue": "" + }, + { + "name": "loading", + "sample": "grid-toolbar#tiny-first-menu-refresh-grid", + "type": "Boolean", + "desc": "Loading", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "refresh", + "sample": "grid-toolbar#tiny-first-menu-refresh-grid", + "type": "Boolean", + "desc": "The table refresh function is enabled for the toolbar component.", + "defaultValue": "" + }, + { + "name": "resizable", + "sample": "grid-customized#custom-column-width", + "type": "Boolean,Object", + "desc": "Drag column width configuration (id needs to be set)", + "defaultValue": "" + }, + { + "name": "setting", + "sample": "grid-customized#custom-column-width", + "type": "Boolean/Object", + "desc": "Sets whether to display the personalized panel for table attributes. This parameter is valid only when the name attribute of the table is set. Set whether to display personalized settings for toolbar attributes (id needs to be set).", + "defaultValue": "" + }, + { + "name": "full-screen", + "sample": "grid-toolbar#tiny-first-menu-grid-full-screen", + "type": "Boolean", + "desc": "Sets whether the table supports full screen or the container that requires full screen. ;Set whether to display full-screen buttons on the toolbar", + "defaultValue": "" + }, + { + "name": "size", + "sample": "grid-toolbar#tiny-first-menu-copy-row-data", + "type": "String", + "desc": "Dimension; The value of this attribute can be medium, small, or mini", + "defaultValue": "" + }, + { + "name": "before-open-full-screen", + "sample": "grid-toolbar#tiny-first-menu-grid-full-screen", + "type": "Function", + "desc": "Function():Boolean. If false is returned, full screen is blocked. If true is returned, full screen is not blocked.", + "defaultValue": "" + }, + { + "name": "before-close-full-screen", + "sample": "grid-toolbar#tiny-first-menu-grid-full-screen", + "type": "Function", + "desc": "Function():Boolean. If the return value is false, the full-screen function is disabled. If the return value is true, the full-screen function is not disabled.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "toolbar", + "sample": "grid-toolbar#tiny-first-menu-custom-toolbar", + "type": "", + "desc": "Toolbar slot", + "defaultValue": "" + }, + { + "name": "buttons", + "sample": "grid-toolbar#tiny-first-menu-export-excel", + "type": "", + "desc": "button list", + "defaultValue": "" + }, + { + "name": "tools", + "sample": "grid-toolbar#tiny-first-menu-custom-toolbar", + "type": "", + "desc": "Tool list on the right", + "defaultValue": "" + } + ], + "events": [ + { + "name": "button-click", + "sample": "grid-validation#grid_Example-gridValid-before-submit-validation", + "type": "Function(arg, event)", + "desc": "This event is triggered when a button on the toolbar is clicked. arg1:{$grid: VueComponent table component instance object information $table: VueComponent table instance object component information button: button list object code: button type} arg2: event", + "defaultValue": "" + }, + { + "name": "on-before-move", + "sample": "grid-validation#grid_Example-gridValid-before-submit-validation", + "type": "Function(arg1, arg2)", + "desc": "Event triggered before dragging a personalized panel; arg1: drag type arg2: drag line information", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/grid.json b/examples/docs/resources/pc/api/en-US/grid.json new file mode 100644 index 000000000..b8323d8b7 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/grid.json @@ -0,0 +1,1728 @@ +{ + "gridattrs": [ + { + "name": "pager", + "sample": "grid-pager#pager-inner-pager", + "type": "Object", + "desc": "Set the pagination configuration item. Use the pager attribute {component: Pager} to inject the pagination component and {attrs: {currentPage: 1,pageSize: 5,pageSizes: [5, 10], total: 0,layout:' total, prev, pager, next, jumper, sizes '} to configure pagination.", + "defaultValue": "" + }, + { + "name": "fetch-data", + "sample": "grid-data-source#tiny-first-menu-request-service", + "type": "Object", + "desc": "Querying Server Data", + "defaultValue": "" + }, + { + "name": "save-data", + "sample": "grid-toolbar#tiny-first-menu-save-data", + "type": "Object", + "desc": "Method of saving server data", + "defaultValue": "" + }, + { + "name": "delete-data", + "sample": "grid-toolbar#tiny-first-menu-save-data", + "type": "Object", + "desc": "Method of deleting server data; ({$grid, changeRecords}, ...args)=>{return new Promise((resolve, reject)=>{setTimeout(()=>{resolve()},300)})}", + "defaultValue": "" + }, + { + "name": "row-group", + "sample": "grid-row-grouping#row-grouping", + "type": "Object", + "desc": "The row group attribute can be configured. Columns with the same value are displayed in a row group.", + "defaultValue": "" + }, + { + "name": "toolbar", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "Object", + "desc": "Toolbar configuration", + "defaultValue": "" + }, + { + "name": "align", + "sample": "grid-align#align-grid-align-left-grid-align", + "type": "String", + "desc": "All column alignment mode; The optional values of this attribute are left (left-aligned), center (center-aligned), and right (right-aligned)", + "defaultValue": "The default value of this attribute is left" + }, + { + "name": "auto-resize", + "sample": "grid-width-height#tiny-first-menu-adaptive-grid-width-height", + "type": "Boolean", + "desc": "Parent element responsive listening (This may be used in scenarios where the parent element may have dynamic changes.)", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "border", + "sample": "grid-grid-border#tiny-first-menu-grid-border", + "type": "Boolean", + "desc": "Whether there is a vertical border", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "is-before-page-change", + "sample": "grid-event#event-page-change-event", + "type": "Boolean", + "desc": "Whether to enable the preprocessing feature when the page changes. If the value is true, the page turning operation or page size change operation does not take effect immediately. The service logic is left for the user to process. Then, the reserved callback or rollback is invoked to make the operation take effect or invalid. For details, see the before-page-change event", + "defaultValue": "" + }, + { + "name": "cell-class-name", + "sample": "grid-custom-style#custom-style-cell-style", + "type": "String, Function", + "desc": "Add a class name to a cell. The class name can also be the Function({seq, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "column-key", + "sample": "grid-operation-column#tiny-first-menu-column-key", + "type": "Boolean", + "desc": "Whether to set the key attribute for VNodes in each column (not required in special cases).", + "defaultValue": "The default value of this property is false" + }, + { + "name": "column-min-width", + "sample": "grid-width-height#tiny-first-menu-column-min-width", + "type": "Number , String", + "desc": "Minimum width that can be adjusted. If this parameter is not set, the default value is the width of the column head span plus 36 (fixed width of the head).; all minimum column widths; The remaining space will be allocated in proportion automatically. The optional values of this attribute are integers, px,%", + "defaultValue": "" + }, + { + "name": "column-width", + "sample": "grid-width-height#tiny-first-menu-column-width", + "type": "Number, String", + "desc": "Width of all columns; The optional values of this attribute are integers, px,%", + "defaultValue": "The default value of this attribute is equal allocation by default." + }, + { + "name": "context-menu", + "sample": "grid-context-menu#grid_Example-shortcutMenu-footer-menu", + "type": "Object", + "desc": "Shortcut menu configuration item", + "defaultValue": "" + }, + { + "name": "edit-rules", + "sample": "grid-validation#grid_Example-gridValid-editing-validation", + "type": "Object", + "desc": "Check rule configuration item", + "defaultValue": "" + }, + { + "name": "expand-config", + "sample": "grid-tree-grid#tree-table-tree-grid-expand-config", + "type": "Object", + "desc": "Define the row configuration item. {expandAll: false, // Indicates whether to expand all rows by default. \n trigger:'row', // Indicates the triggering mode of expanding rows. The options include cell (triggered by clicking the cell where the icon is located) and row (triggered by clicking the row). By default, click the icon to trigger \n expandRowKeys: [], // Expand the specified row by default. (The row-id is required. \n accordion: false //Whether only one node can be expanded at a time. \n activeMethod: Function () {} // Customized expansion rule}", + "defaultValue": "" + }, + { + "name": "fit", + "sample": "grid-width-height#tiny-first-menu-adaptive-column-width", + "type": "Boolean", + "desc": "Whether the widths of all columns are extended automatically.", + "defaultValue": "The default value of this property is true" + }, + { + "name": "footer-align", + "sample": "grid-align#align-footer-align-left-footer-align", + "type": "String", + "desc": "Alignment mode of all table tail columns; The optional values of this attribute are left (left-aligned), center (center-aligned), and right (right-aligned)", + "defaultValue": "The default value of this property is inherited align" + }, + { + "name": "optimization", + "sample": "grid-grid-optimization#tiny-first-menu-grid-optimization", + "type": "Object", + "desc": "Optimize configuration items", + "defaultValue": "The default value of this attribute is animat: true,delayHover: 250,scrollX: {gt: 100, . When the value is greater than the value range, virtual scrolling is automatically started. (If X virtual scrolling is enabled, all column widths must be fixed, otherwise they are not compatible) The default value is 100, oSize: 2, re-rendering is triggered when the remaining data is less than the specified range. The default value is rSize: 2, and the number of strips is automatically calculated each time. vSize: 5 Number of strips in the specified visible area}, scrollY: {gt: 500, Specify the range beyond which to automatically start virtual scrolling (Enable Y Virtual Scroll, all rows must be fixed, otherwise it is not compatible) The default value is 500 oSize: 2, when the remaining data is less than the specified range, re-rendering is triggered. The default value is rSize: 2, and the number of bars is automatically calculated each time. vSize: 5, the number of bars in the specified visible area is automatically calculated by default. rHeight: 50, the height of a specified row is automatically calculated by default. true: automatically adapts to the optimal rendering mode. The default value is true}" + }, + { + "name": "params", + "sample": "grid-filter#grid-params", + "type": "Object", + "desc": "Additional parameters", + "defaultValue": "" + }, + { + "name": "footer-cell-class-name", + "sample": "grid-custom-style#custom-style-footer-style-footer-cell-style", + "type": "String, Function", + "desc": "Add the class name to the cell at the end of the table. The class name can also be the function Function({$rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "footer-method", + "sample": "grid-summary#summary-custom-summary", + "type": "Function", + "desc": "Calculation method of table tail total Function({columns, data});params:{columns: all column configuration data: all table data}", + "defaultValue": "" + }, + { + "name": "footer-row-class-name", + "sample": "grid-custom-style#custom-style-footer-style-footer-cell-style", + "type": "String, Function", + "desc": "Add className to the row at the end of the table. The className can also be the function Function({$rowIndex}). Use footer-cell-class-name and footer-row-class-name to set the cell and row styles at the end of the table params:{$rowIndex: row label}", + "defaultValue": "" + }, + { + "name": "footer-span-method", + "sample": "grid-footer#footer-footer-row-or-column-span", + "type": "Function", + "desc": "Merge rows or columns at the end of the table. This function Function({$rowIndex, column, columnIndex, $columnIndex, data}) returns the calculated value. The show-footer must be configured when the table tail total row or column logic is set by footer-method and footer-span-method. parmas: {$rowIndex: row label column: column data columnIndex: column subscript data: an array that holds the currently combined and calculated data}", + "defaultValue": "" + }, + { + "name": "header-align", + "sample": "grid-align#align-header-align-left-header-align", + "type": "String", + "desc": "Alignment mode of all table header columns; The optional values of this attribute are left (left-aligned), center (center-aligned), and right (right-aligned)", + "defaultValue": "The default value of this property is inheritance alignment" + }, + { + "name": "header-cell-class-name", + "sample": "grid-custom-style#custom-style-header-style-header-cell-style", + "type": "String, Function", + "desc": "Add a class name to the cell in the table header. The class name can also be the function Function({$rowIndex, column, columnIndex, $columnIndex}). params{$rowIndex: row label, column: column data, columnIndex: column subscript, $columnIndex: column subscript}", + "defaultValue": "" + }, + { + "name": "header-row-class-name", + "sample": "grid-custom-style#custom-style-header-style-header-cell-style", + "type": "String, Function", + "desc": "Add className to the row in the table header. It can also be the function Function({$rowIndex});params: {$rowIndex: row label}", + "defaultValue": "" + }, + { + "name": "height", + "sample": "grid-width-height#tiny-first-menu-fixed-grid-height", + "type": "Number , String", + "desc": "Set the height of the table content area (excluding the table header and bottom). If this parameter is not set, the height of the table content area is adaptive.; height of table; Supports full parent containers or fixed width and height. The optional values of this attribute are integers, px,%", + "defaultValue": "" + }, + { + "name": "highlight-cell", + "sample": "grid-highlight#highlight-highlight-cell", + "type": "Boolean", + "desc": "This parameter is valid only when editConfig is configured. Whether to highlight the cell border during edit.", + "defaultValue": "The default value of this property is false" + }, + { + "name": "highlight-current-column", + "sample": "grid-highlight#highlight-highlight-current-column", + "type": "Boolean", + "desc": "Do you want to highlight the current column?", + "defaultValue": "The default value of this property is false" + }, + { + "name": "highlight-current-row", + "sample": "grid-highlight#highlight-highlight-current-row", + "type": "Boolean", + "desc": "Do you want to highlight the current line?", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "highlight-hover-column", + "sample": "grid-highlight#highlight-highlight-hover-column", + "type": "Boolean", + "desc": "Do you want to highlight the column when you move the cursor to the column?", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "highlight-hover-row", + "sample": "grid-highlight#highlight-highlight-hover-row", + "type": "Boolean", + "desc": "Do you want to highlight the line when you move the cursor to the line?", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "keyboard-config", + "sample": "grid-keyboard#keyboard-navigation", + "type": "Object", + "desc": "Key configuration item; {isArrow: true //Enable the arrow keys}", + "defaultValue": "" + }, + { + "name": "loading", + "sample": "grid-grid-loading-tip#tiny-first-menu-grid-loading-off-tip", + "type": "Boolean", + "desc": "Whether the table is being loaded.", + "defaultValue": "The default value of this property is true" + }, + { + "name": "max-height", + "sample": "grid-width-height#tiny-first-menu-min-grid-height", + "type": "Number , String", + "desc": "Set the maximum height of the table content area (excluding the table header and bottom).; The optional values of this attribute are integers, px,%", + "defaultValue": "" + }, + { + "name": "mouse-config", + "sample": "grid-keyboard#mouse-config", + "type": "Object", + "desc": "Mouse configuration item; {selected: true //Whether to enable the function of selecting cells by left-clicking. This function is valid only for edit-config.mode=cell. The default value is false.}", + "defaultValue": "" + }, + { + "name": "radio-config", + "sample": "grid-operation-column#tiny-first-menu-radio-config", + "type": "Object", + "desc": "Select a configuration item. {trigger:'cell', //Trigger selection mode. The options include cell (triggered by clicking the cell where the icon is located)/row (triggered by clicking the row). By default, the icon is triggered.\n labelField:'', //Field name displayed in the single-choice box. You can directly display it in the check box.\n checkRowKey:', //The specified line is selected by default. (This function is triggered only once during initialization. The row-id parameter is required.) \n checkMethod: Function() {} //Whether to allow the selected method. The return value of this method determines whether the Radio in the row can be selected", + "defaultValue": "" + }, + { + "name": "remote-filter", + "sample": "grid-filter#filter-server-filter", + "type": "Boolean", + "desc": "Whether to use server filtering for all columns. If this parameter is set to true, data will not be processed.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "remote-sort", + "sample": "grid-sort#sort-server-sort", + "type": "Boolean", + "desc": "Whether to sort all data on the server. The default value is false. The server-side sorting is not performed.", + "defaultValue": "The default value of this attribute is false" + }, + { + "name": "resizable", + "sample": "grid-width-height#tiny-first-menu-resize-column-width", + "type": "Boolean", + "desc": "Set whether to allow column width adjustment", + "defaultValue": "The default value of this property is true" + }, + { + "name": "row-class-name", + "sample": "grid-custom-style#custom-style-row-style", + "type": "String, Function", + "desc": "User-defined table row class name, which is used in the scenario where the row style of the table is customized. You can set the string class name directly or use the Function({seq, row, rowIndex, $rowIndex}) function to return the class name.", + "defaultValue": "" + }, + { + "name": "row-id", + "sample": "grid-sort#tiny-first-menu-row-id", + "type": "String", + "desc": "Field name of the unique primary key of the customized row data (The row data must have a unique primary key, which is automatically generated by default)", + "defaultValue": "The default value of this property is _RID" + }, + { + "name": "row-key", + "sample": "", + "type": "Boolean", + "desc": "Whether to set the key attribute for the VNode in each row (not necessary in special cases)", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "select-config", + "sample": "grid-operation-column#disable-selection", + "type": "Object", + "desc": "Check the configuration item. {trigger:'cell', //Trigger selection mode. The options include cell (triggered by clicking the cell where the icon is located) and row (triggered by clicking the row). By default, the icon is triggered.\n labelField:'', //Field name displayed in the check box. It can be directly displayed in the check box.\n checkRowKeys: [], //The specified line is selected by default. (This function is triggered only once during initialization. The row-id parameter is required.) \n checkMethod: Function() {}, // Indicates whether the selected method is allowed. The return value of this method is used to determine whether the checkbox of this line can be selected.\n checkAll: true, true //All are selected by default (triggered only once during initialization)}\n showHeader: true, // Indicates whether to display all buttons. If checkStrictly=true, the default value is false. \n checkStrictly: false, //Whether to strictly follow the method of not associating parent and child with each other.\n reserve: false //Whether to retain the historical selection data for the page turning operation}", + "defaultValue": "" + }, + { + "name": "show-footer", + "sample": "grid-summary#summary-cus tom-summary", + "type": "Boolean", + "desc": "Display the total at the end of the table", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "show-header", + "sample": "grid-header#header-hide-grid-header", + "type": "Boolean", + "desc": "Whether to display the table header", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "show-header-overflow", + "sample": "grid-tip#tip-column-header-tip", + "type": "Boolean, String", + "desc": "Sets the display of all contents in the table header as ellipsis if the length is too long. The optional values for this property are ellipsis (only the ellipsis is displayed), title (and the native title is displayed), and tooltip (and tooltip is displayed)", + "defaultValue": "" + }, + { + "name": "show-overflow", + "sample": "grid-tip#tip-cell-tip", + "type": "Boolean, String", + "desc": "Set the display of all content as ellipsis when the content is too long. (If the column is fixed, you are advised to set this parameter to improve the rendering speed.) The optional values for this property are ellipsis (only the ellipsis is displayed), title (and the native title is displayed), tooltip (and the tooltip prompt is displayed)", + "defaultValue": "" + }, + { + "name": "size", + "sample": "grid-grid-size#tiny-first-menu-grid-size", + "type": "String", + "desc": "Table size; The options of this attribute are medium, small, and mini", + "defaultValue": "" + }, + { + "name": "sort-config", + "sample": "grid-sort#sort-default-sort", + "type": "Object", + "desc": "Sort configuration items; {trigger:'cell'//Sorting triggering mode. You can set this parameter to cell (click the head cell to trigger sorting). If this parameter is not set, the up and down arrows are clicked to trigger sorting by default.} ", + "defaultValue": "" + }, + { + "name": "sort-method", + "sample": "grid-sort#sort-custom-sort", + "type": "Function(arg1, arg2)", + "desc": "Customize the sorting method of all columns. When sorting is triggered, the function Function(arg1, arg2) is invoked to return the sorting result. User-defined sorting method, similar to the native sort sorting method. The input parameter arguments: (arg1, arg2) arg1: is the previous comparison data item arg2: the next comparison data item", + "defaultValue": "" + }, + { + "name": "span-method", + "sample": "grid-span#span-row-span-row-span", + "type": "Function", + "desc": "Consolidate rows or columns. This function Function({seq, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, data}) returns the calculated value.", + "defaultValue": "The default value of this property is {rowspan: 1, colspan: 1}" + }, + { + "name": "start-index", + "sample": "grid-serial-column#tiny-first-menu-start-index", + "type": "Number", + "desc": "This parameter is valid only for columns whose type is index. The value of this parameter is the start value of the dynamic index.", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "stripe", + "sample": "grid-grid-stripe#stripe-stripe", + "type": "Boolean", + "desc": "Zebra pattern", + "defaultValue": "The default value of this property is false." + }, + { + "name": "sync-resize", + "sample": "grid-width-height#tiny-first-menu-adaptive-grid-width-height", + "type": "Boolean", + "desc": "Responsively follow an attribute. (This may be used in scenarios where the display/hide switchover is controlled by an attribute)", + "defaultValue": "The default value of this attribute is false" + }, + { + "name": "tree-config", + "sample": "grid-tree-grid#tree-table-tree-grid-base", + "type": "Object", + "desc": "tree structure configuration item, tree-config:{children:'children'} children: identification character used to define the lower level and subset of data in the tree structure data;{trigger:'default', //Expanding sub-triggering mode: 'default' (click the button to trigger); 'cell' (click cell to trigger); 'row' (triggered by clicking a row)\nordered: true, // Indicates whether to display the child index in ascending order by number. The options are true. (The child index is displayed in ascending order by number, parent level 1 and child level 2); false (The child index is added based on the parent index. The parent index is 1 and the child index is 1.1.) \nindent: 16, // Controls the horizontal indentation distance. The default value is 16. The unit is px\nchildren: 'children', // Specify the field name of child data\nexpandAll: false, // Indicates whether to expand all rows. \nexpandRowKeys: [], // By default, the specified row in the given array is expanded. The row-id is required. The row-id can be obtained from the '_RID' attribute of the row\naccordion: false, // Whether only one subnode can be expanded at the same time for multiple subnodes at the same level} ", + "defaultValue": "" + }, + { + "name": "valid-config", + "sample": "grid-validation#grid_Example-gridValid-valid-config", + "type": "Object", + "desc": "Check configuration items. {message:'inline'//Check prompt type. 'inline' (built-in prompt) 'tooltip'}", + "defaultValue": "" + }, + { + "name": "summary-config", + "sample": "grid-summary#summary-configuration-summary", + "type": "Object", + "desc": "Configuration item of the table statistics function; {fields:['Emp employees'], //Statistics field name\n fraction: 2, //Final digits reserved after decimal point\n truncate: false, //Whether to truncate. The default value is rounding up. The value is not truncated. \n text: ''//Statistics displayed text}", + "defaultValue": "" + }, + { + "name": "sortable", + "sample": "grid-customized#custom-column-sort", + "type": "Boolean", + "desc": "Whether to allow column data sorting. The default value is true, which can be sorted.", + "defaultValue": "The default value of this attribute is true" + }, + { + "name": "auto-load", + "sample": "grid-data-source#tiny-first-menu-auto-load", + "type": "Boolean", + "desc": "", + "defaultValue": "Whether to enable the automatic request service. This parameter is valid only when fetch-data is configured. The default value of this parameter is true." + }, + { + "name": "is-async-column", + "sample": "grid-data-source#tiny-first-menu-column-asyn-rendering", + "type": "Boolean", + "desc": "Sets whether to delay the loading of columns in the table. Indicates whether to enable the asynchronous column function. This parameter is used together with scrollLoad", + "defaultValue": "" + }, + { + "name": "columns", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "Array", + "desc": "Configuration information of the table column. For details, see the column configuration items.", + "defaultValue": "" + }, + { + "name": "scroll-load", + "sample": "grid-large-data#tiny-first-menu-scroll-paging", + "type": "Object", + "desc": "Rolling configuration loading; scrollLoad={isInfinity: false //Continuous, \npageSize: 10 //Number of records to be loaded each time}; Sets whether to load pages in scrolling mode. This parameter is valid only when showPager is set to true.", + "defaultValue": "" + }, + { + "name": "row-span", + "sample": "grid-span#span-row-span-row-span-easy", + "type": "Array", + "desc": "Set row combination. This attribute applies only to common tables and cannot be used together with tree-config.", + "defaultValue": "" + }, + { + "name": "render-empty", + "sample": "grid-empty-data-tip#tiny-first-menu-empty-data-tip", + "type": "Function", + "desc": "Render empty data", + "defaultValue": "" + }, + { + "name": "events", + "sample": "grid-event#event-grid-events", + "type": "Object", + "desc": "Event Object", + "defaultValue": "" + }, + { + "name": "data", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "Array", + "desc": "Set table data.", + "defaultValue": "" + }, + { + "name": "min-height", + "sample": "grid-width-height#tiny-first-menu-min-grid-height", + "type": "Number , String", + "desc": "Set the minimum height of the table content area (excluding the table header and bottom).", + "defaultValue": "" + }, + { + "name": "drop-config", + "sample": "grid-drag#drag-row-drag", + "type": "Object", + "desc": "Drag configuration items in a table. {plugin: Sortable, // Sortablejs plug-in\n row: true, // Enable row dragging\n column: true, // Enable column dragging \n onBeforeMove: Function() {return false}, // function before dragging, return false and cancel dragging\n filter: '.row__drag-disable', //Whether the row can be dragged according to the class name.\n refresh: true //If the tree level is changed, you can specify whether to refresh the data}", + "defaultValue": "" + }, + { + "name": "edit-config", + "sample": "grid-editor#grid_Example-gridEdit-inner-editor", + "type": "Object , Boolean", + "desc": "Configuration item for editing the table. When Object is configured, the following fields can be configured: {trigger:'click', //Activation triggering mode. The options include click, dblclick, manual\n mode:'cell', //Activation type. The options include cell / row\n showStatus: true, // Display Status\n activeMethod: Function () {} //User-defined editing rule}", + "defaultValue": "" + }, + { + "name": "seq-serial", + "sample": "grid-pager#pager-inner-pager", + "type": "Boolean", + "desc": "Whether to set the row sequence number consecutive. This parameter is valid only when showSeq is set to true.", + "defaultValue": "Sets whether the row sequence number is continuous. This parameter is valid when paging is enabled. The default value of this parameter is false." + }, + { + "name": "show-save-msg", + "sample": "grid-pager#pager-showSaveMsg", + "type": "Boolean", + "desc": "Whether to display a prompt when there is unsaved data during page switching.", + "defaultValue": "" + }, + { + "name": "tooltip-config", + "sample": "grid-tip#tip-cell-tip", + "type": "Object", + "desc": "Configuration item of the built-in tooltip of the Grid. For details, see the Tooltip Attribute Description.", + "defaultValue": "" + } + ], + "gridslots": [ + { + "name": "default", + "sample": "grid-slot#slot-default-slot", + "type": "", + "desc": "Default slot (Table column )", + "defaultValue": "" + }, + { + "name": "toolbar", + "sample": "grid-slot#slot-buttons-slot", + "type": "", + "desc": "Toolbar, (Includes: Zoom, Personalize, Refresh Table, and Custom Buttons) ", + "defaultValue": "" + }, + { + "name": "pager", + "sample": "grid-pager#pager-inner-pager", + "type": "", + "desc": "Paging plug-in, ", + "defaultValue": "" + }, + { + "name": "empty", + "sample": "grid-empty-data-tip#tiny-first-menu-empty-data-tip", + "type": "", + "desc": "Text content displayed when the data is empty", + "defaultValue": "" + } + ], + "gridmethods": [ + { + "name": "clearActived()", + "sample": "grid-edit#tiny-first-menu-trigger-mode-for-editing", + "type": "", + "desc": "Manually clear cell activation status", + "defaultValue": "" + }, + { + "name": "clearAll()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Manually clear all conditions in the table and restore the table to the initial state. (This may be used in the scenario of adding, deleting, modifying, and querying, for example, clearing the table cache after data is saved.)", + "defaultValue": "" + }, + { + "name": "clearCurrentColumn()", + "sample": "grid-highlight#highlight-highlight-current-column", + "type": "", + "desc": "This command is used to manually clear the current highlighted status.", + "defaultValue": "" + }, + { + "name": "clearCurrentRow()", + "sample": "grid-highlight#highlight-highlight-current-row", + "type": "", + "desc": "For the current line. Manually clear the highlighted status.", + "defaultValue": "" + }, + { + "name": "clearData(rows, field)", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Manually clear the cell content. If no parameter is transferred, the entire table content is cleared. If a row is transferred, the specified row content is cleared. If a specified field is transferred, the field content is cleared.", + "defaultValue": "" + }, + { + "name": "clearFilter(field)", + "sample": "grid-filter#filter-default-filter", + "type": "", + "desc": "Manually clear the filter criteria (if field is not transferred, all filter criteria are cleared). Data will be restored to the unfiltered state.", + "defaultValue": "" + }, + { + "name": "clearRadioRow()", + "sample": "grid-operation-column#tiny-first-menu-default-serial-column", + "type": "", + "desc": "This is used to select a single row. Manually clear the user selection.", + "defaultValue": "" + }, + { + "name": "clearRowExpand()", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "Manually clear the expanded row status. The data will be restored to the unexpanded state.", + "defaultValue": "" + }, + { + "name": "clearScroll()", + "sample": "grid-width-height#tiny-first-menu-min-grid-height", + "type": "", + "desc": "Manually clear scrolling information and restore the original state.", + "defaultValue": "" + }, + { + "name": "clearSelected()", + "sample": "grid-highlight#highlight-highlight-cell", + "type": "", + "desc": "Clear cell selection manually", + "defaultValue": "" + }, + { + "name": "clearSelection()", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "For selecting multiple lines. Manually clear the user selection.", + "defaultValue": "" + }, + { + "name": "clearSort()", + "sample": "grid-sort#sort-default-sort", + "type": "", + "desc": "Manually clear the sorting conditions. Data will be restored to the unsorted state.", + "defaultValue": "" + }, + { + "name": "clearTreeExpand()", + "sample": "grid-tree-grid#tree-table-tree-grid-insert-delete-update", + "type": "", + "desc": "Manually clear the expanded state of the tree node. The data will be restored to the un-folded state.", + "defaultValue": "" + }, + { + "name": "closeFilter()", + "sample": "grid-filter#filter-default-filter", + "type": "", + "desc": "Manually close the filter panel (which may be used in some special scenarios)", + "defaultValue": "" + }, + { + "name": "closeMenu()", + "sample": "grid-context-menu#grid_Example-shortcutMenu-cell-menu", + "type": "", + "desc": "Manually close the shortcut menu (which may be used in some special scenarios)", + "defaultValue": "" + }, + { + "name": "createData(records)", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "", + "desc": "Create a data object. (For some special scenarios, the field name will be automatically checked. If the field name does not exist, the field name will be automatically defined.)", + "defaultValue": "" + }, + { + "name": "createRow(records)", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "", + "desc": "Create a Row|Rows object. (This method may be used when data needs to be manually inserted in some special scenarios.)", + "defaultValue": "" + }, + { + "name": "exportCsv(options)", + "sample": "grid-import-export#tiny-first-menu-export-excel", + "type": "", + "desc": "Exports table data to a .csv file. (All mainstream browsers are supported. Rows or columns cannot be combined.)", + "defaultValue": "" + }, + { + "name": "fullValidate(rows, callback)", + "sample": "grid-validation#grid_Example-gridValid-before-submit-validation", + "type": "", + "desc": "Complete table verification function. The difference between this function and validate is that all rules of full data are verified.", + "defaultValue": "" + }, + { + "name": "getActiveRow()", + "sample": "grid-edit#tiny-first-menu-trigger-mode-for-editing", + "type": "", + "desc": "Obtain activated row data", + "defaultValue": "" + }, + { + "name": "getColumnByField(field)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "Obtain columns based on column field names.", + "defaultValue": "" + }, + { + "name": "getColumnById(colid)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "Obtain a column based on the unique primary key of the column.", + "defaultValue": "" + }, + { + "name": "getColumnIndex(column)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "Obtain the index relative to the column based on the column.", + "defaultValue": "" + }, + { + "name": "getColumnNode(cell)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "Obtain the column information based on the th/td element.", + "defaultValue": "" + }, + { + "name": "getColumns(columnIndex)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "Obtains the visual column of the table or specifies the index to obtain the column.", + "defaultValue": "" + }, + { + "name": "getCurrentRow()", + "sample": "grid-event#tiny-first-menu-get-row-method", + "type": "", + "desc": "This is used for the current row to obtain the data of the current row.", + "defaultValue": "" + }, + { + "name": "getData(rowIndex)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "The behavior of obtaining data is the same as that of data. You can also specify an index to obtain data.", + "defaultValue": "" + }, + { + "name": "getInsertRecords()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Obtain the new data", + "defaultValue": "" + }, + { + "name": "getRadioRow()", + "sample": "grid-event#tiny-first-menu-get-row-method", + "type": "", + "desc": "This command is used to select a single row to obtain the selected data.", + "defaultValue": "" + }, + { + "name": "getRecordset()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Obtaining a table data set (Obtain the data of adding, deleting, and changing. It is very convenient for adding, deleting, modifying, and querying tables.)", + "defaultValue": "" + }, + { + "name": "getRemoveRecords()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Obtain deleted data", + "defaultValue": "" + }, + { + "name": "getRowById(rowid)", + "sample": "grid-event#tiny-first-menu-get-row-method", + "type": "", + "desc": "Obtain a row based on the unique primary key of the row.", + "defaultValue": "" + }, + { + "name": "getRowIndex(row:Object)", + "sample": "grid-event#tiny-first-menu-get-row-method", + "type": "", + "desc": "Obtains indexes relative to data based on rows.", + "defaultValue": "" + }, + { + "name": "getRowNode(tr)", + "sample": "grid-event#tiny-first-menu-get-row-method", + "type": "", + "desc": "Obtain row information based on the tr element.", + "defaultValue": "" + }, + { + "name": "getSelectRecords()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "This command is used to select multiple lines to obtain the selected data.", + "defaultValue": "" + }, + { + "name": "getTableColumn()", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "", + "desc": "Obtains columns in the current table. (full table header column, full table header column after processing condition, table header column in current rendering)", + "defaultValue": "" + }, + { + "name": "getTableData()", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "", + "desc": "Obtains data in the current table. (complete table body data, full table body data after processing conditions, table body data in the current rendering, table tail data in the current rendering)", + "defaultValue": "" + }, + { + "name": "getUpdateRecords()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Obtain modified data", + "defaultValue": "" + }, + { + "name": "handleFetch()", + "sample": "grid-data-source#tiny-first-menu-request-service", + "type": "", + "desc": "Fetch-data of the trigger table", + "defaultValue": "" + }, + { + "name": "hasActiveRow(row)", + "sample": "grid-edit#tiny-first-menu-trigger-mode-for-editing", + "type": "", + "desc": "Check whether the row has been activated and is in the editing state.", + "defaultValue": "" + }, + { + "name": "hasRowChange(row, field)", + "sample": "grid-edit#tiny-first-menu-row-editing", + "type": "", + "desc": "Check whether the row or column data is changed.", + "defaultValue": "" + }, + { + "name": "hasRowExpand(row)", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "Check whether the row is expanded.", + "defaultValue": "" + }, + { + "name": "hasTreeExpand(row)", + "sample": "grid-tree-grid#tree-table-tree-grid-expand", + "type": "", + "desc": "Check whether the tree node is expanded.", + "defaultValue": "" + }, + { + "name": "hideColumn(column)", + "sample": "grid-customized#custom-column-visible-hidden", + "type": "", + "desc": "Hide a specified column.", + "defaultValue": "" + }, + { + "name": "insert(records)", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Add data to the table.; Insert data into the table, add one or more rows of data from the first row", + "defaultValue": "" + }, + { + "name": "insertAt(records, row)", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Inserts one or more rows into a table. Second parameter: row specified position (tree tables are not supported), null inserted from the first row, and –1 inserted from the last row", + "defaultValue": "" + }, + { + "name": "loadColumn(columns)", + "sample": "grid-large-data#large-data-load-column", + "type": "", + "desc": "Load column configuration (This function may be used in the scenario where table columns need to be reloaded or partially incremented.)", + "defaultValue": "" + }, + { + "name": "loadData(data)", + "sample": "grid-large-data#tiny-first-menu-full-data-loading", + "type": "", + "desc": "Load data (This parameter may be used in the scenario where table data needs to be reloaded or partially incremented.)", + "defaultValue": "" + }, + { + "name": "recalculate()", + "sample": "grid-width-height#recalculate", + "type": "", + "desc": "Recalculate the table. (This may be used in some special scenarios, such as hidden tables and column width update.)", + "defaultValue": "" + }, + { + "name": "refreshColumn()", + "sample": "grid-customized#custom-column-visible-hidden", + "type": "", + "desc": "Refresh column configuration (This parameter may be used in the scenario of displaying or hiding columns.)", + "defaultValue": "" + }, + { + "name": "refreshData()", + "sample": "grid-tree-grid#tree-table-tree-grid-insert-delete-update", + "type": "", + "desc": "Data data is refreshed synchronously. If this method is used, the component does not record the status of adding, deleting, and modifying, and can only implement the corresponding logic. (This parameter may be used in some special scenarios, for example, when a node element in a deep tree changes.)", + "defaultValue": "" + }, + { + "name": "reloadCustoms(customs)", + "sample": "grid-customized#custom-server-storage", + "type": "", + "desc": "Initialize loading to display or hide columns (which may be used in asynchronous update scenarios).", + "defaultValue": "" + }, + { + "name": "remove(rows)", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Deletes data in a specified row. Multiple data records in a specified row or [row, ...] are deleted. If the value is empty, all data records are deleted.", + "defaultValue": "" + }, + { + "name": "removeSelecteds()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "Delete all selected rows.", + "defaultValue": "" + }, + { + "name": "resetAll()", + "sample": "grid-customized#custom-column-width", + "type": "", + "desc": "Manually reset all operations in the column to the initial state. If the toolbar has been associated, the operations will be updated accordingly.", + "defaultValue": "" + }, + { + "name": "resetCustoms()", + "sample": "grid-customized#custom-column-width", + "type": "", + "desc": "Manually reset the display/hide operations of columns to restore the initial status (if the toolbar has been associated, it will be updated accordingly)", + "defaultValue": "" + }, + { + "name": "resetResizable()", + "sample": "grid-customized#custom-column-width", + "type": "", + "desc": "Manually reset the column width and drag the column width to the initial state (if the toolbar has been associated, the column width will be updated accordingly).", + "defaultValue": "" + }, + { + "name": "revertData(rows, field)", + "sample": "grid-edit#tiny-first-menu-row-editing", + "type": "", + "desc": "Restore the data of a specified row or the entire table.", + "defaultValue": "" + }, + { + "name": "scrollTo(scrollLeft, scrollTop)", + "sample": "grid-large-data#large-data-scroll-to", + "type": "", + "desc": "If there is a scroll bar, scroll to the corresponding position.", + "defaultValue": "" + }, + { + "name": "scrollToColumn(column)", + "sample": "grid-large-data#large-data-scroll-to", + "type": "", + "desc": "If there is a scroll bar, scroll to the corresponding column.", + "defaultValue": "" + }, + { + "name": "scrollToRow(row)", + "sample": "grid-large-data#large-data-scroll-to", + "type": "", + "desc": "If there is a scroll bar, scroll to the corresponding line.", + "defaultValue": "" + }, + { + "name": "setActiveCell(row, field)", + "sample": "grid-edit#tiny-first-menu-cell-editing", + "type": "", + "desc": "Activate cell editing", + "defaultValue": "" + }, + { + "name": "setActiveRow(row)", + "sample": "grid-edit#tiny-first-menu-cell-editing", + "type": "", + "desc": "Activate line editing. If mode=cell is selected, the first cell is activated by default.", + "defaultValue": "" + }, + { + "name": "setAllRowExpansion(checked)", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "Set whether to expand all rows.", + "defaultValue": "" + }, + { + "name": "setAllSelection(checked)", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "The input parameter is boolean, which is used to select multiple lines and set the selected status of all lines.", + "defaultValue": "" + }, + { + "name": "setAllTreeExpansion(checked)", + "sample": "grid-tree-grid#tree-table-tree-grid-operation-column", + "type": "", + "desc": "Sets whether to expand all tree nodes.", + "defaultValue": "" + }, + { + "name": "setCurrentRow(row)", + "sample": "grid-highlight#highlight-highlight-hover-row", + "type": "", + "desc": "Sets the highlight status of a row for the current row.", + "defaultValue": "" + }, + { + "name": "setRadioRow(row)", + "sample": "grid-operation-column#tiny-first-menu-default-serial-column", + "type": "", + "desc": "Select a row and set the selected status of a row.", + "defaultValue": "" + }, + { + "name": "setRowExpansion(rows, checked)", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "Set the expansion row, and set whether to expand the row.", + "defaultValue": "" + }, + { + "name": "setSelection(rows, checked)", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "This parameter is used to select multiple lines. The second parameter is whether to select or not.", + "defaultValue": "" + }, + { + "name": "setTreeExpansion(rows, checked)", + "sample": "grid-tree-grid#tree-table-tree-grid-operation-column", + "type": "", + "desc": "Set the expansion tree node and set whether to expand the row.", + "defaultValue": "" + }, + { + "name": "showColumn(column)", + "sample": "grid-customized#custom-column-visible-hidden", + "type": "", + "desc": "Display the specified column.", + "defaultValue": "" + }, + { + "name": "sort(field, order)", + "sample": "grid-sort#sort-custom-sort", + "type": "", + "desc": "Sort the table manually. If the value of order is empty, the table is automatically sorted.", + "defaultValue": "" + }, + { + "name": "toggleAllSelection()", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "Selection of multiple lines and switch the selected status of all lines.", + "defaultValue": "" + }, + { + "name": "toggleRowExpansion(row)", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "For expanding tables or switching rows.", + "defaultValue": "" + }, + { + "name": "toggleRowSelection(row)", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "Selection of multiple lines and switch the selected status of a line.", + "defaultValue": "" + }, + { + "name": "toggleTreeExpansion(row)", + "sample": "grid-tree-grid#tree-table-tree-grid-operation-column", + "type": "", + "desc": "This parameter is used to switch and expand tree nodes in a tree table.", + "defaultValue": "" + }, + { + "name": "validate(rows, callback)", + "sample": "grid-validation#grid_Example-gridValid-before-submit-validation", + "type": "", + "desc": "Table verification function. If a row or rows is specified, the specified row or multiple rows are verified. Otherwise, the entire table is verified. This callback function is called after the verification is complete and the following parameters are transferred: (Whether the verification is successful. The fields in the latest column fail the verification.) If no callback function is passed in, a promise is returned", + "defaultValue": "" + } + ], + "gridevents": [ + { + "name": "page-change", + "sample": "grid-event#event-page-change-event", + "type": "Object(arg)", + "desc": "This event is valid only when pager-config is configured. This event is triggered when the paging is changed. //Parameter arg\n {$grid: VueComponent, //table component vue instance\ncurrentPage: 1 //Current page number\nlayout:' total, prev, pager, next, jumper, sizes '//Current page component layout information\npageSize: 10//Current number of records displayed on each page\npageSize: [5, 10] //Number of records on each page that can be switched\ntotal: 10 //Total number of records}", + "defaultValue": "" + }, + { + "name": "before-page-change", + "sample": "grid-event#event-page-change-event", + "type": "Function(arg)", + "desc": "triggered when the page is changed and the page is turned or the page size is changed. / / Parameter arg:\n{newPage, // New page size\nnewPageSize// New page size\ncurrentPage,// Current page size\ncurrentPageSize, // Current page size\ncallback, // Validate the rollback\nrollback// Invalidate the rollback\nrollback,// Rollback, which may not exist}", + "defaultValue": "" + }, + { + "name": "toolbar-button-click", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "Function(arg, event)", + "desc": "This event is valid only when toolbar.buttons are configured. This event is triggered when a toolbar button is clicked. //arg1: \n{$grid: VueComponent, // table component instance object information\nbutton, // Button information object\ncode// Button function type \n}\n //arg2:\nevent// native click event", + "defaultValue": "" + }, + { + "name": "cell-click", + "sample": "grid-event#event-cell-click-event", + "type": "Function(arg1, event)", + "desc": "This event is triggered when a cell is clicked. arg1: {row: current row, rowIndex: subscript of the current row, column: current column, columnIndex: current column subscript}", + "defaultValue": "" + }, + { + "name": "cancel-page-change", + "sample": "grid-pager#pager-inner-pager", + "type": "Function()", + "desc": "When there is unsaved data during pagination switchover, a dialog box is displayed to determine the button event.", + "defaultValue": "" + }, + { + "name": "cell-context-menu", + "sample": "grid-context-menu#grid_Example-shortcutMenu-menu-permissions", + "type": "Function(arg)", + "desc": "This event is triggered when a cell is right-clicked. arg:{row:current row}", + "defaultValue": "" + }, + { + "name": "cell-dblclick", + "sample": "grid-event#event-cell-dblclick-event", + "type": "Function(arg1, event)", + "desc": "This event is triggered when a cell is double-clicked. //arg1\n{row, // Current row\nrowIndex, // Current row's subscript\ncolumn, // Current row's subscript\ncolumnIndex// Current row's subscript\n}, \neevent //Click Event", + "defaultValue": "" + }, + { + "name": "cell-mouseenter", + "sample": "grid-event#event-cell-mouseenter-event", + "type": "Function(arg1, event)", + "desc": "This event is triggered when the cell hovers. //arg1\n{row, // Current row\nrowIndex, // Subscript of current row\ncolumn, // Current column\ncolumnIndex// Current column\n}, \neevent //Native event", + "defaultValue": "" + }, + { + "name": "cell-mouseleave", + "sample": "grid-event#event-cell-mouseleave-event", + "type": "", + "desc": "This event is triggered when the cell hovers.", + "defaultValue": "" + }, + { + "name": "context-menu-click", + "sample": "grid-context-menu#grid_Example-shortcutMenu-header-menu", + "type": "Function(arg1)", + "desc": "This event is valid only when context-menu is configured. This event is triggered when the shortcut menu is clicked. //arg1\n{table: VueComponent, //table component vue instance\ncell, //Dom\ncolumn of the clicked cell, //Column configuration information\ncolumnIndex:Number,//Click the index of the column\ncolumns:Array,//Information about all columns}, \nmenu:Object,//Configuration of the current context menu, options: Arry,//Configuration list of the context menu\nrow: Object, //Data of the row where the clicked cell is located\nrowIndex: 1,//Index of the row where the clicked cell is located\ntype:'body'//Display position of the context menu}", + "defaultValue": "" + }, + { + "name": "current-change", + "sample": "grid-highlight#highlight-highlight-cell", + "type": "Function(arg1, arg2)", + "desc": "This parameter is valid only for highlightCurrentRow. This parameter is triggered when a row is manually selected and the value changes. arg1:Object: The information object related to the row is manually selected. arg2:event.", + "defaultValue": "" + }, + { + "name": "edit-actived", + "sample": "grid-event#event-edit-actived-event", + "type": "Function(arg1, arg2)", + "desc": "This event is triggered when a cell is activated for editing. arg1: Object activates and edits the related information object of the cell, arg2: event", + "defaultValue": "" + }, + { + "name": "edit-closed", + "sample": "grid-event#event-edit-closed-event", + "type": "Function(arg1, arg2)", + "desc": "This event is triggered when a cell is closed in the editing state. arg1: Object activates the information object of the editing cell, arg2: event", + "defaultValue": "" + }, + { + "name": "edit-disabled", + "sample": "grid-event#event-edit-disabled-event", + "type": "Function(arg1, arg2)", + "desc": "This event is triggered when a cell is activated and is disabled. arg1: Object activates and edits the related information object of the cell. arg2: event", + "defaultValue": "" + }, + { + "name": "filter-change", + "sample": "grid-filter#filter-server-filter", + "type": "Function(arg1, arg2)", + "desc": "This event is triggered when the filter condition changes. Information object of the //arg1:\n{$table:Object, // table\nfilters,//filtering data information of the filter column},//\narg2:\n{$table:Object,// table\nfilters,//filtering data information of the filter column}", + "defaultValue": "" + }, + { + "name": "footer-cell-click", + "sample": "grid-event#event-footer-cell-context-menu-event", + "type": "Function(arg1, arg2)", + "desc": "This event is triggered when a cell at the end of a table is clicked. //arg1: current table object \n{\n$columnIndex: 2,$rowIndex: 0,$table: VueComponent, //table component vue instance\ncell,// current cell node\ncolumn:ColumnConfig, // current column information \ncolumnIndex: 2}\n//arg2:event // native event", + "defaultValue": "" + }, + { + "name": "footer-cell-context-menu", + "sample": "grid-context-menu#grid_Example-shortcutMenu-cell-menu", + "type": "Function(arg1, arg2)", + "desc": "This event is triggered when a cell at the end of the table is right-clicked. //arg1: current table object \n{\n$columnIndex: 2,$rowIndex: 0,$table: VueComponent, //table component vue instance\ncell,// Current cell node\ncolumn:ColumnConfig, // Current column information \ncolumnIndex: 2, \noptions:Array,// configuration and clearing function information\ntype: 'footer' //Table area type \n}\n//arg2:event // native event", + "defaultValue": "" + }, + { + "name": "footer-cell-dblclick", + "sample": "grid-footer#footer-footer-summation", + "type": "Function(arg1, arg2)", + "desc": "This event is triggered when a cell at the end of a table is double-clicked. //arg1: current table object \n{\n$columnIndex: 2,$rowIndex: 0,$table: VueComponent, //table component vue instance\ncell,// Current cell node\ncolumn:ColumnConfig, // Current column information \ncolumnIndex: 2}\n//arg2:event // native event", + "defaultValue": "" + }, + { + "name": "header-cell-click", + "sample": "grid-event#event-header-click-event", + "type": "Function(arg1, arg2)", + "desc": "This event is triggered when a cell in the table header is clicked. //arg1: current table object \n{\n$columnIndex: 2,$rowIndex: 0,$table: VueComponent, //table component vue instance\ncell,// Click the table header cell \ncolumn:ColumnConfig, // Current column information \ncolumnIndex: 2,\ntriggerFilter:false,// Current click node filter flag \ntriggerSort:false,// Current click node sorting flag}\n//arg2:event // Native event ", + "defaultValue": "" + }, + { + "name": "header-cell-context-menu", + "sample": "grid-event#event-header-cell-context-menu-event", + "type": "Function(arg1, arg2)", + "desc": "This event is triggered when a cell in the table header is right-clicked. //arg1: current table object \n{\n$columnIndex: 2,$rowIndex: 0,$table: VueComponent, //table component vue instance\ncell,// Current cell node\ncolumn:ColumnConfig, // Current column information \ncolumnIndex: 2, \noptions:Array,// configuration and clearing function information\ntype: 'header' //Table area type \n}\n//arg2:event // native event", + "defaultValue": "" + }, + { + "name": "header-cell-dblclick", + "sample": "grid-event#event-header-dblclick-event", + "type": "Function(arg1, arg2)", + "desc": "This event is triggered when a table header cell is double-clicked. //arg1:\n{column, //Column data\ncolumnIndex, //Column index\n$table, //Table component vue instance\ncell//Clicked cell dom\n}\n//arg2:\nevent// native event", + "defaultValue": "" + }, + { + "name": "radio-change", + "sample": "grid-event#event-radio-change-event", + "type": "Function(arg1, arg2)", + "desc": "This parameter is valid only for the event whose type is radio. It is triggered when the value is manually selected and the value changes. / / Parameter description:\narg1 $table: VueComponent table Component vue instance \n arg2 event Native radio event object", + "defaultValue": "" + }, + { + "name": "resizable-change", + "sample": "grid-event#event-resizable-change-event", + "type": "Function(arg1)", + "desc": "This event is triggered when the column width changes. //Parameter description of the vue instance of the arg1\n{$table: VueComponent,// table component\ncolumn, //Column configuration information\ncolumnIndex:1//Drag the column index\nfixed//Whether to fix the column}", + "defaultValue": "" + }, + { + "name": "scroll", + "sample": "grid-event#event-grid-scroll-event", + "type": "Function(arg, event)", + "desc": "This event is triggered when the table scrolls. //arg1:\n{\n $table: VueComponent(Table instance object information) \n fixed: undefined\n isX: false: (X axis scrolling) \n isY: true (Y axis scrolling) \n scrollLeft: 0 (X-axis rolling distance)\nscrollTop: 66 (Y-axis rolling distance)\n type: 'body' \n}\n arg2:event", + "defaultValue": "" + }, + { + "name": "select-all", + "sample": "grid-event#event-select-all-event", + "type": "Function(arg, event)", + "desc": "This event is valid only when type=selection and is triggered when all are selected manually. //arg1:\n{\n $table: VueComponent table instance object information\n checked: checked status\n selection: selected table data array \n}\n arg2:event", + "defaultValue": "" + }, + { + "name": "select-change", + "sample": "grid-event#event-select-change-event", + "type": "Function(arg, event)", + "desc": "This event is valid only for type=selection. It is triggered when the value is manually selected and the value changes. //arg1: \n{\n $columnIndex: 0\n $rowIndex: 0\n $seq: '\n $table: VueComponent (Table instance object information) \n checked: true (checked status) \n column: ColumnConfig {...} \n columnIndex: 0 (column subscript)\n data: [{...}, {...}, {...}, {...}, {...}, {...}](Table data) \n fixed: undefined\n isHidden: undefined\n level: 0\n row: {...}(Line data information of selected items)\n rowIndex: 0(Line subscript of selected items)\n selection:[{...}(Selected data) \n seq: 1\n}\n arg2:event", + "defaultValue": "" + }, + { + "name": "toggle-expand-change", + "sample": "grid-event#event-toggle-expand-change-event", + "type": "Function(arg, event)", + "desc": "This event is triggered when a row is expanded or closed. //Parameter arg1: \n{$table: VueComponent,// table instance object information\nrow, // Click to expand the data object \nrowIndex in the row. //Click the subscript of the expanded row} \n //Parameter arg2:\nevent//Event object", + "defaultValue": "" + }, + { + "name": "toggle-tree-change", + "sample": "grid-event#event-toggle-tree-change-event", + "type": "Function(arg, event)", + "desc": "This event is triggered when a tree node is expanded or closed. //Parameter arg1: \n{$table: VueComponent,// table instance object information\nrow,//Click to expand the data information object in the row \nrowIndex,//Click to expand the subscript in the row \n} \n//Parameter arg2:\nevent: Event object", + "defaultValue": "" + }, + { + "name": "valid-error", + "sample": "grid-event#event-valid-error-event", + "type": "Function(arg)", + "desc": "This event is triggered when data verification fails. //Parameter arg:\n{cell,//Cell information object to be verified\ncolumn,//Column configuration information object of the column where the cell is located\nrow,//Information object of the row where the cell is located\nrule//Check rule information object}", + "defaultValue": "" + }, + { + "name": "BeforeEdit", + "sample": "grid-event#event-edit-disabled-event", + "type": "", + "desc": "Click a cell to display the events triggered before the component is edited.; Click the cell to display the event triggered before editing the component - the activeMethod method in edit-config", + "defaultValue": "" + }, + { + "name": "CellClick", + "sample": "grid-event#event-cell-click-event", + "type": "Function(arg1, event)", + "desc": "Event triggered by clicking a cell. arg1:{row: current row, rowIndex: subscript of current row, column: current column, columnIndex: current column subscript}, event: click event", + "defaultValue": "" + }, + { + "name": "sort-change", + "sample": "grid-sort#sort-server-sort", + "type": "Function(arg)", + "desc": "Event triggered before data sorting is performed when a column header is clicked.; / / Parameter arg1: \n{$grid: VueComponent,// (Table instance object information\ncolumn:ColumnConfign,//(Column information) \nfield: 'name', / /(sorted field name)\norder: 'asc', / /(sorted type in ascending or descending order)\nprop: 'name', \n property: 'name'}", + "defaultValue": "" + }, + { + "name": "fullscreen", + "sample": "grid-toolbar#tiny-first-menu-grid-full-screen", + "type": "", + "desc": "Time triggered when full screen is enabled or disabled", + "defaultValue": "" + } + ], + "columnattrs": [ + { + "name": "align", + "sample": "grid-align#align-column-align", + "type": "String", + "desc": "Column pair mode; The optional values for this property are left, center, right", + "defaultValue": "The default value of this attribute is the same as that of the inherited table." + }, + { + "name": "class-name", + "sample": "grid-custom-style#custom-style-cell-style", + "type": "String, Function", + "desc": "Add a class name to a cell. The class name can also be the Function({seq, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "multi", + "sample": "grid-filter#filter-default-filter", + "type": "Boolean", + "desc": "is an attribute built in the filter object. Whether multiple selections are allowed for filtering. Sets whether to display the check box in the selected column. This parameter is valid only when columnType is set to'select'.", + "defaultValue": "The default value of this property is true" + }, + { + "name": "method", + "sample": "grid-filter#filter-custom-filter", + "type": "Function", + "desc": "In the custom filtering method Function({value, row, column}) built in the filter object", + "defaultValue": "" + }, + { + "name": "fixed", + "sample": "grid-fixed#fixed-left-fixed", + "type": "String", + "desc": "Fix columns on the left. Freezable can be frozen or unfrozen, but can be operated in the table personalized panel. Frozen can only be frozen but cannot be operated in the personalized panel. Fix the column to the left or right (Note: The fixed columns should be placed on the left and right sides.) The optional values of this attribute are left (fixed left) and right (fixed right)", + "defaultValue": "" + }, + { + "name": "footer-align", + "sample": "grid-align#align-footer-align-left-footer-align", + "type": "String", + "desc": "Alignment mode of the column at the end of the table; The optional values for this property are left, center, right", + "defaultValue": "The default value of this attribute is inherit align > inherit table footer-align" + }, + { + "name": "footer-class-name", + "sample": "grid-footer#footer-footer-class-name", + "type": "String, Function", + "desc": "Add a class name to the cell at the end of the table. The class name can also be the Function({$rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "header-align", + "sample": "grid-align#align-header-align-left-header-align", + "type": "String", + "desc": "The alignment mode of the table header column; The optional values for this property are left, center, right", + "defaultValue": "The default value of this attribute is inherit align > inherit the header-align of table" + }, + { + "name": "header-class-name", + "sample": "grid-header#header-header-class-name", + "type": "String, Function", + "desc": "Set the column header style name. Add className to the cell in the table header, or the function Function({$rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "index-method", + "sample": "grid-serial-column#tiny-first-menu-custom-serial-column", + "type": "Function", + "desc": "This parameter is valid only for type=index. The user-defined index method is Function({row, rowIndex, column, columnIndex})", + "defaultValue": "" + }, + { + "name": "min-width", + "sample": "grid-width-height#tiny-first-menu-min-width", + "type": "Number, String", + "desc": "Minimum column width; The remaining space will be allocated in proportion. The optional values of this property are integers, px,%", + "defaultValue": "The default value of this attribute is column-min-width of the table." + }, + { + "name": "show-icon", + "sample": "grid-edit#tiny-first-menu-cell-editing", + "type": "Boolean", + "desc": "Whether to display the column header editing icon. This parameter is valid during editing.", + "defaultValue": "The default value of this property is true" + }, + { + "name": "params", + "sample": "grid-filter#column-column-params", + "type": "Object", + "desc": "Extra parameters (User-defined data parameters, which may be used in some special scenarios)", + "defaultValue": "" + }, + { + "name": "remote-sort", + "sample": "grid-sort#sort-server-sort", + "type": "Boolean", + "desc": "Whether to use server sorting. If this parameter is set to true, data will not be processed.", + "defaultValue": "The default value of this attribute is inherited from the remote-sort of the table." + }, + { + "name": "resizable", + "sample": "grid-width-height#tiny-first-menu-resize-column-width", + "type": "Boolean", + "desc": "Set whether the column width can be adjusted. Allows you to drag the column width to adjust the column size.", + "defaultValue": "The default value of this attribute is resizable that inherits the table" + }, + { + "name": "show-header-overflow", + "sample": "grid-tip#tip-column-header-tip", + "type": "String,Boolean", + "desc": "When the table header content is too long, the ellipsis is displayed. The optional values for this property are ellipsis (only the ellipsis is displayed), title (and the native title is displayed), tooltip (and the tooltip prompt is displayed)", + "defaultValue": "The default value of this attribute is the show-header-overflow inherited from the table." + }, + { + "name": "show-overflow", + "sample": "grid-tip#tip-cell-tip", + "type": "String,Boolean", + "desc": "When the content is too long, an ellipsis is displayed. The optional values for this property are ellipsis (only the ellipsis is displayed), title (and the native title is displayed), tooltip (and the tooltip is displayed)", + "defaultValue": "The default value of this attribute is the show-overflow inherited from the table." + }, + { + "name": "sort-by", + "sample": "grid-sort#sort-combinations-sort", + "type": "String, Array", + "desc": "This parameter is valid only for sortable. It is a user-defined sorting attribute.", + "defaultValue": "" + }, + { + "name": "rules", + "sample": "", + "type": "Object", + "desc": "Form verification function", + "defaultValue": "" + }, + { + "name": "required", + "sample": "grid-validation#grid_Example-gridValid-editing-validation", + "type": "Boolean", + "desc": "Mandatory. If this parameter is not set, the system will automatically generate a value based on the verification rule.", + "defaultValue": "The default value of this attribute is false" + }, + { + "name": "sort-method", + "sample": "grid-sort#sort-custom-sort", + "type": "Function", + "desc": "Customize the sorting method of all columns. When sorting is triggered, the function Function({data, column, property, order}) is invoked to return the sorting result.", + "defaultValue": "" + }, + { + "name": "sortable", + "sample": "grid-sort#sort-default-sort", + "type": "Boolean", + "desc": "Whether the data in the column can be sorted.; Allow Sorting Columns", + "defaultValue": "The default value of this property is false" + }, + { + "name": "title", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "String , Function", + "desc": "Column title (internationalization can be enabled). It can be the function Function(h, params)", + "defaultValue": "" + }, + { + "name": "tree-node", + "sample": "grid-tree-grid#tree-table-tree-grid-base", + "type": "Boolean", + "desc": "This parameter is valid only when tree-config is configured. It is specified as a tree node.", + "defaultValue": "The default value of this property is false" + }, + { + "name": "format-value", + "sample": "grid-edit#tiny-first-menu-format-value", + "type": "Function", + "desc": "Incoming value of formatting the cell editor component", + "defaultValue": "" + }, + { + "name": "format-text", + "sample": "grid-renderer#grid_Example-gridRenderer-inner-renderer", + "type": "String , Function", + "desc": "Sets the display and editing mode of the current table column. Sets the display and obtaining editing type of the current table column. It can also be the function Function(params). The optional value of this property is money / enum / select / number / integer / filesize / date / dateTime / longDateTime / time / longTime / yearMonth / ellipsis / rate / boole", + "defaultValue": "" + }, + { + "name": "type", + "sample": "grid-serial-column#tiny-first-menu-default-serial-column", + "type": "String", + "desc": "Set the type of the built-in column. Set the type of the built-in column. The available values of this attribute are index (serial number), selection (check box), radio (single box), and expand (expand row)", + "defaultValue": "" + }, + { + "name": "width", + "sample": "grid-width-height#tiny-first-menu-fixed-column-width", + "type": "Number , String", + "desc": "Set the column width. The value can be pixel, percentage, or auto. If the value is auto, the column width automatically adapts.; column width; The optional value of this property is integer/px/%", + "defaultValue": "The default value of this attribute is the column-width of the inherited table." + }, + { + "name": "format-config", + "sample": "grid-data-source#tiny-first-menu-column-asyn-rendering", + "type": "Object", + "desc": "Enable the asynchronous rendering of the column data.; {data: [], // Column data source\n type:'', // Built-in renderer type, which is the same as the format-text attribute.\n async: true, // Data can be dynamically modified after the value is set to true. You can also configure it as an object. If you configure it as an object, you can configure splitConfig.enabled (whether to enable the separation configuration), splitConfig.valueSplit (separator of the specified value), splitConfig.textSplit (separator of the specified text), and fetch (column data asynchronous). Render, request data)\n label:''//Mapping of the cell display content\n value:''//Mapping of the cell value}", + "defaultValue": "" + }, + { + "name": "class-name", + "sample": "grid-custom-style#custom-style-cell-style", + "type": "String, Function", + "desc": "Add a class name to a cell. The class name can also be the function Function({seq, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "editor", + "sample": "grid-edit#tiny-first-menu-custom-editing", + "type": "Object , Function", + "desc": "Cell editing rendering configuration item, which can also be the function Function(h, params). Sets the editing type of the table column. Valid when editMode is true and editabele is true.", + "defaultValue": "" + }, + { + "name": "filter", + "sample": "grid-filter#filter-default-filter", + "type": "Boolean , Object", + "desc": "Set the filtering configuration of the table column. The default value is false. No filtering information is configured.", + "defaultValue": "The default value of this attribute is false" + }, + { + "name": "renderer", + "sample": "grid-renderer#grid_Example-gridRenderer-custom-renderer", + "type": "Object , Function", + "desc": "Set the rendering type of the table column. The priority of the column is higher than that of the column type attribute. Cell rendering configuration item. Its priority is higher than that of the formatText attribute of the column. It can also be the function Function(h, params)", + "defaultValue": "" + }, + { + "name": "show-tip", + "sample": "grid-tip#tip-cell-tip", + "type": "Boolean", + "desc": "Does the table column cells require prompts?", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "show-header-tip", + "sample": "grid-tip#tip-column-header-tip", + "type": "Boolean", + "desc": "Whether to prompt the table column header.", + "defaultValue": "The default value of this attribute is false." + } + ], + "columnslots": [ + { + "name": "default", + "sample": "grid-header#header-custom-grid-header", + "type": "", + "desc": "Customized display content template", + "defaultValue": "" + }, + { + "name": "edit", + "sample": "grid-editor#grid_Example-gridEdit-custom-editor-select", + "type": "", + "desc": "Customized Editable Component Template", + "defaultValue": "" + }, + { + "name": "filter", + "sample": "grid-filter#filter-custom-filter", + "type": "", + "desc": "User-defined filtering template", + "defaultValue": "" + }, + { + "name": "header", + "sample": "grid-header#header-slot-header", + "type": "", + "desc": "Template of custom table header content", + "defaultValue": "" + } + ], + "toolbarattrs": [ + { + "name": "buttons", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "Array", + "desc": "Button List", + "defaultValue": "" + }, + { + "name": "id", + "sample": "grid-customized#custom-column-width", + "type": "String", + "desc": "Unique ID", + "defaultValue": "" + }, + { + "name": "loading", + "sample": "grid-toolbar#tiny-first-menu-refresh-grid", + "type": "Boolean", + "desc": "Loading", + "defaultValue": "The default value of this property is false" + }, + { + "name": "refresh", + "sample": "grid-toolbar#tiny-first-menu-refresh-grid", + "type": "Boolean", + "desc": "The table refresh function is enabled for the toolbar component.", + "defaultValue": "" + }, + { + "name": "resizable", + "sample": "grid-customized#custom-column-width", + "type": "Boolean,Object", + "desc": "Column width dragging configuration (id needs to be set)", + "defaultValue": "" + }, + { + "name": "setting", + "sample": "grid-customized#custom-column-width", + "type": "Boolean/Object", + "desc": "Whether to display the table attribute on the personalized panel. This parameter is valid only when the name attribute of the table is set. Set whether to display personalized configuration for toolbar attributes (id needs to be set)", + "defaultValue": "" + }, + { + "name": "full-screen", + "sample": "grid-toolbar#tiny-first-menu-grid-full-screen", + "type": "Boolean", + "desc": "Sets whether the table can be displayed in full screen mode or whether the container needs to be displayed in full screen mode.; Sets whether to display the full-screen button on the toolbar.", + "defaultValue": "" + }, + { + "name": "size", + "sample": "grid-toolbar#tiny-first-menu-copy-row-data", + "type": "String", + "desc": "Dimension; The options of this attribute are medium, small, and mini", + "defaultValue": "" + }, + { + "name": "before-open-full-screen", + "sample": "grid-toolbar#tiny-first-menu-grid-full-screen", + "type": "Function", + "desc": "Intercept method before full screen Function():Boolean. If false is returned, the full screen is blocked. If true is returned, the full screen is not blocked.", + "defaultValue": "" + }, + { + "name": "before-close-full-screen", + "sample": "grid-toolbar#tiny-first-menu-grid-full-screen", + "type": "Function", + "desc": "Intercept method Function():Boolean before full screen is disabled. If false is returned, the full screen is disabled. If true is returned, the full screen is not disabled.", + "defaultValue": "" + } + ], + "toolbarslots": [ + { + "name": "toolbar", + "sample": "grid-toolbar#tiny-first-menu-custom-toolbar", + "type": "", + "desc": "Toolbar slot", + "defaultValue": "" + }, + { + "name": "buttons", + "sample": "grid-toolbar#tiny-first-menu-export-excel", + "type": "", + "desc": "Button List", + "defaultValue": "" + }, + { + "name": "tools", + "sample": "grid-toolbar#tiny-first-menu-custom-toolbar", + "type": "", + "desc": "Tool list on the right", + "defaultValue": "" + } + ], + "toolbarevents": [ + { + "name": "button-click", + "sample": "grid-event#event-toolbar-button-click-event", + "type": "Function(arg, event)", + "desc": "This event is triggered when a button on the toolbar is clicked. arg1:{$grid: VueComponent table component instance object information $table: VueComponent table instance object component information button: button list information object code: button type} arg2:event", + "defaultValue": "" + }, + { + "name": "on-before-move", + "sample": "grid-customized#custom-prsonalized-drag", + "type": "Function(arg1, arg2)", + "desc": "event before the personalized panel is dragged. arg1: drag type arg2: drag row information", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/hrapprover.json b/examples/docs/resources/pc/api/en-US/hrapprover.json new file mode 100644 index 000000000..6fcf01692 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/hrapprover.json @@ -0,0 +1,46 @@ +{ + "attrs": [ + { + "name": "value", + "sample": "disabled", + "type": "String", + "desc": "Set the approver.", + "defaultValue": "" + }, + { + "name": "approval-person", + "sample": "category-type", + "type": "String", + "desc": "Approval", + "defaultValue": "" + }, + { + "name": "title", + "sample": "", + "type": "String", + "desc": "Set the pop-up window title.", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "Sets whether the component is disabled.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "category", + "sample": "category-type", + "type": "String", + "desc": "Default approval type.", + "defaultValue": "The default value of this attribute is 0303." + }, + { + "name": "fetchHrapprover", + "sample": "custom-service", + "type": "Function", + "desc": "Customize the interface for obtaining approver information. This parameter is mandatory when the framework service is not used. Other customized attributes are the same as those of the dept component.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/image.json b/examples/docs/resources/pc/api/en-US/image.json new file mode 100644 index 000000000..05ea4bef4 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/image.json @@ -0,0 +1,78 @@ +{ + "attrs": [ + { + "name": "src", + "sample": "basic-usage", + "type": "String", + "desc": "Set the path of the preview image. Image source, which is the same as the original image source", + "defaultValue": "" + }, + { + "name": "fit", + "sample": "auto-fit-container-size", + "type": "String", + "desc": "Determine how the image adapts to the container frame, which is the same as the native object-fit. The optional values of this attribute are fill / contain / cover / none / scale-down", + "defaultValue": "" + }, + { + "name": "lazy", + "sample": "lazy-load", + "type": "Boolean", + "desc": "Whether to enable lazy loading", + "defaultValue": "" + }, + { + "name": "scroll-container", + "sample": "lazy-load", + "type": "String , HTMLElement", + "desc": "Container for listening to scroll events after lazy loading is enabled.", + "defaultValue": "The default value of this attribute is the parent element whose overflow value is auto or scroll." + }, + { + "name": "preview-src-list", + "sample": "preview-src-list", + "type": "Array", + "desc": "Enable the image preview function.", + "defaultValue": "" + }, + { + "name": "z-index", + "sample": "preview-z-index", + "type": "Number", + "desc": "Set the z-index of the image preview", + "defaultValue": "The default value of this attribute is 2000." + } + ], + "slots": [ + { + "name": "placeholder", + "sample": "custom-placeholder", + "type": "", + "desc": "Placeholder content that is not loaded to the image", + "defaultValue": "" + }, + { + "name": "error", + "sample": "custom-load-failed-text", + "type": "", + "desc": "Content that fails to be loaded", + "defaultValue": "" + } + ], + "events": [ + { + "name": "load", + "sample": "load-event", + "type": "", + "desc": "The image is loaded successfully.", + "defaultValue": "" + }, + { + "name": "error", + "sample": "load-error", + "type": "", + "desc": "Image loading failure triggered", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/input.json b/examples/docs/resources/pc/api/en-US/input.json new file mode 100644 index 000000000..85081e26d --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/input.json @@ -0,0 +1,290 @@ +{ + "attrs": [ + { + "name": "disabled", + "sample": "", + "type": "Boolean", + "desc": "Disable", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "suffix-icon", + "sample": "prefix-icon", + "type": "String", + "desc": "The html icon is placed behind the input text box.; Input box end icon", + "defaultValue": "" + }, + { + "name": "maxlength", + "sample": "maxlength", + "type": "Number", + "desc": "Set the maxLength attribute of the input box and the maximum input length.; Native attribute, maximum input length", + "defaultValue": "" + }, + { + "name": "prefix-icon", + "sample": "prefix-icon", + "type": "String", + "desc": "html icon in the front of the input text box. ;Icon at the head of the input box", + "defaultValue": "" + }, + { + "name": "readonly", + "sample": "", + "type": "Boolean", + "desc": "Sets the read-only attribute of the text. The default value is false. ;Native attribute, read-only", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "clearable", + "sample": "clearable", + "type": "Boolean", + "desc": "Whether to display the clear button. This attribute is not applicable to type=\"textarea\". Cleared", + "defaultValue": "" + }, + { + "name": "type", + "sample": "show-password", + "type": "String", + "desc": "Set the type attribute of the input box. The default value is text. The options are password and text.; The optional values of this attribute are text, textarea, and type values of other native inputs", + "defaultValue": "The default value of this attribute is text" + }, + { + "name": "modelValue / v-model", + "sample": "clearable", + "type": "String , Number", + "desc": "Sets the default value of text display. ;Bound value", + "defaultValue": "" + }, + { + "name": "show-word-limit", + "sample": "show-word-limit", + "type": "Boolean", + "desc": "Whether to display the number of input words. This parameter is valid only when type is \"text\" or type is \"textarea\"", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "placeholder", + "sample": "event-blur", + "type": "String", + "desc": "Enter the place-holder text in the text box", + "defaultValue": "" + }, + { + "name": "show-password", + "sample": "show-password", + "type": "Boolean", + "desc": "Whether to display the switchover password icon", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "Size of the text box. This parameter is valid only when type!=\"textarea\". The options of this attribute are medium, small, and mini", + "defaultValue": "" + }, + { + "name": "cols", + "sample": "rows", + "type": "String", + "desc": "Native attribute, which is used to set the width. This parameter is valid only when type is \"textarea\"", + "defaultValue": "" + }, + { + "name": "rows", + "sample": "rows", + "type": "Number", + "desc": "Number of lines in the input box. This parameter is valid only for type=\"textarea\"", + "defaultValue": "The default value of this property is 2" + }, + { + "name": "autosize", + "sample": "autosize", + "type": "Boolean , Object", + "desc": "Adaptive content height. This parameter is valid only for type=\"textarea\". Objects can be transferred, for example, {minRows: 2, maxRows: 6}", + "defaultValue": "The default value of this property is false" + }, + { + "name": "autocomplete", + "sample": "autocomplete", + "type": "String", + "desc": "The original attribute is automatically supplemented. The options of this attribute are on and off", + "defaultValue": "The default value of this attribute is off" + }, + { + "name": "name", + "sample": "name", + "type": "String", + "desc": "Native attribute", + "defaultValue": "" + }, + { + "name": "max", + "sample": "max", + "type": "Number", + "desc": "Native attribute, set the maximum value.", + "defaultValue": "" + }, + { + "name": "min", + "sample": "min", + "type": "Number", + "desc": "Native attribute, which sets the minimum value.", + "defaultValue": "" + }, + { + "name": "step", + "sample": "step", + "type": "Number", + "desc": "Native attribute, which is used to set the valid digit interval of the input field.", + "defaultValue": "" + }, + { + "name": "resize", + "sample": "resize", + "type": "String", + "desc": "Whether the user can zoom in or out. The options of this attribute are none, both, horizontal, and vertical", + "defaultValue": "" + }, + { + "name": "autofocus", + "sample": "autofocus", + "type": "Boolean", + "desc": "Native attribute, which automatically obtains the focus.", + "defaultValue": "The default value of this property is false" + }, + { + "name": "form", + "sample": "form", + "type": "String", + "desc": "Native attribute", + "defaultValue": "" + }, + { + "name": "label", + "sample": "label", + "type": "String", + "desc": "label text associated with the text box", + "defaultValue": "" + }, + { + "name": "tabindex", + "sample": "tabindex", + "type": "String", + "desc": "tabindex in the text box", + "defaultValue": "" + }, + { + "name": "validate-event", + "sample": "validate-event", + "type": "Boolean", + "desc": "Trigger form verification upon input", + "defaultValue": "The default value of this property is true" + }, + { + "name": "counter", + "sample": "counter", + "type": "Boolean", + "desc": "Whether to display the word count statistics. This parameter is valid only when type is \"text\" or type is \"textarea\"", + "defaultValue": "The default value of this attribute is false." + } + ], + "slots": [ + { + "name": "prefix", + "sample": "slot-prepend", + "type": "", + "desc": "Content in the header of the text box, which is valid only for type=\"text\"", + "defaultValue": "" + }, + { + "name": "suffix", + "sample": "slot-suffix", + "type": "", + "desc": "The content at the end of the text box is valid only for type=\"text\"", + "defaultValue": "" + }, + { + "name": "prepend", + "sample": "slot-prepend", + "type": "", + "desc": "Content before the text box, which is valid only for type=\"text\"", + "defaultValue": "" + }, + { + "name": "append", + "sample": "slot-append", + "type": "", + "desc": "Content at the end of the text box. This field is valid only for type=\"text\"", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "focus", + "sample": "method-focus", + "type": "", + "desc": "To enable the input to obtain the focus", + "defaultValue": "" + }, + { + "name": "blur", + "sample": "method-blur", + "type": "", + "desc": "The input loses focus.", + "defaultValue": "" + }, + { + "name": "select", + "sample": "method-select", + "type": "", + "desc": "Select the text in input.", + "defaultValue": "" + }, + { + "name": "addMemory", + "sample": "method-addMemory", + "type": "", + "desc": "Memorization method of historical input content", + "defaultValue": "" + } + ], + "events": [ + { + "name": "input", + "sample": "event-input", + "type": "Function(arg1)", + "desc": "An event is triggered when a value is entered. onInput(arg1){\n// arg1 = event.target.value Value in the text box \n// do something you want...}", + "defaultValue": "" + }, + { + "name": "blur", + "sample": "event-blur", + "type": "Function(arg1)", + "desc": "Trigger when Input loses focus; onBlur(arg1){\n// arg1 = event\n// do something you want...}", + "defaultValue": "" + }, + { + "name": "focus", + "sample": "event-focus", + "type": "Function(arg1)", + "desc": "Trigger when Input obtains focus; onFocus(arg1){\n// arg1 = event} \n// do something you want...}", + "defaultValue": "" + }, + { + "name": "change", + "sample": "event-change", + "type": "Function(arg1)", + "desc": "triggered when the input value changes. onChange(arg1){\n// arg1 = event.target.value Value after the change}\n// do something you want...}", + "defaultValue": "" + }, + { + "name": "clear", + "sample": "event-clear", + "type": "Function", + "desc": "Trigger when the clear button generated by the clearable property is clicked; onClear () {// do something you want...}", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/ip-address.json b/examples/docs/resources/pc/api/en-US/ip-address.json new file mode 100644 index 000000000..ac9cc5c7e --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/ip-address.json @@ -0,0 +1,92 @@ +{ + "attrs": [ + { + "name": "delimiter", + "sample": "delimiter", + "type": "String,Object", + "desc": "Set the separator between IP address segments. The default value is '. '.;Set the class name of the separator between IP segments. The default value is'icon-dot-ipv4'.", + "defaultValue": "The default value of this attribute is icon-dot-ipv4." + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "Set the component size. The optional values of this attribute are medium / small / mini", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "Set the disabled attribute of the text. The default value is false.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "readonly", + "sample": "readonly", + "type": "Boolean", + "desc": "Set the read-only attribute of the text. The default value is false.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "type", + "sample": "ipv4-type", + "type": "String", + "desc": "Sets the type attribute in the IpAddress box. The default value is IPv4 and the value can be IPv6. ;The value of this attribute can be IPv4 or IPv6", + "defaultValue": "The default value of this attribute is IPv4." + }, + { + "name": "value", + "sample": "ipv4-type", + "type": "String", + "desc": "Set the default text display value.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "slots", + "type": "", + "desc": "Separator between IP address segments", + "defaultValue": "" + } + ], + "events": [ + { + "name": "blur", + "sample": "blur", + "type": "Function", + "desc": "The event is triggered when the text box loses the focus; onBlur(){\n// do something you want...} ", + "defaultValue": "" + }, + { + "name": "focus", + "sample": "focus", + "type": "Function", + "desc": "This event is triggered when a text box obtains the focus; onFocus(){\n// do something you want...}", + "defaultValue": "" + }, + { + "name": "change", + "sample": "change", + "type": "Function(arg1)", + "desc": "Value of the ;onChange(arg1){\n// arg1 = value IP event after the text box content is changed.\n// do something you want...}", + "defaultValue": "" + }, + { + "name": "input", + "sample": "input", + "type": "Function(arg1, arg2)", + "desc": "When the text box content is entered, the event is triggered. The value of the ;onInput(arg1, arg2){\n// arg1 = value IP address text box is changed. \n// arg2 = index Index of the IP address text box where the value is changed. \n// do something you want...}", + "defaultValue": "" + }, + { + "name": "select", + "sample": "select", + "type": "Function(arg1)", + "desc": "The event is triggered when the text box content is selected. onSelect(arg1){\n// arg1 = target.value Value of the check box.\n// do something you want...}", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/layout.json b/examples/docs/resources/pc/api/en-US/layout.json new file mode 100644 index 000000000..dcc17fc31 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/layout.json @@ -0,0 +1,27 @@ +{ + "attrs": [ + { + "name": "tag", + "sample": "tag1", + "type": "String", + "desc": "Label", + "defaultValue": "The default value of this attribute is div." + }, + { + "name": "size", + "sample": "", + "type": "String", + "desc": "Size; The value of this attribute can be medium / small / mini", + "defaultValue": "The default value of this attribute is medium." + } + ], + "slots": [ + { + "name": "default", + "sample": "base", + "type": "", + "desc": "Default slot", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/link-menu.json b/examples/docs/resources/pc/api/en-US/link-menu.json new file mode 100644 index 000000000..dc5640d96 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/link-menu.json @@ -0,0 +1,99 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "data-resource1", + "type": "Array", + "desc": "Set the data of the favorites menu.", + "defaultValue": "" + }, + { + "name": "icon", + "sample": "custom-icon", + "type": "Object", + "desc": "Customize the icon for expanding and collapsing a node.", + "defaultValue": "" + }, + { + "name": "max-item", + "sample": "menu-items", + "type": "Number", + "desc": "Set the maximum number of columns that can be added to favorites.", + "defaultValue": "" + }, + { + "name": "titile", + "sample": "data-resource", + "type": "String", + "desc": "Set the title of the favorites menu. The default value is null.", + "defaultValue": "" + }, + { + "name": "default-expand-all", + "sample": "menu-items", + "type": "Boolean", + "desc": "Whether to expand all nodes by default when a menu pop-up window is opened. The default value is true.", + "defaultValue": "" + }, + { + "name": "search-icon", + "sample": "custom-icon", + "type": "Object", + "desc": "Customize the search icon.", + "defaultValue": "" + }, + { + "name": "ellipsis", + "sample": "custom-icon1", + "type": "Boolean", + "desc": "Omitted if the menu content is too long. The default value is true.", + "defaultValue": "" + }, + { + "name": "wrap", + "sample": "data-resource", + "type": "Boolean", + "desc": "The menu content is displayed in a new line when it is too long. The default value is false.", + "defaultValue": "" + }, + { + "name": "keep-selected-nodes", + "sample": "", + "type": "Boolean", + "desc": "Whether to retain the status of the selected content after selecting content in the tree node, clicking Cancel, and opening the dialog box again. The default value is true.", + "defaultValue": "" + }, + { + "name": "get-menu-data-sync", + "sample": "get-menu-data-sync", + "type": "Function", + "desc": "User-defined menu data service. Data is directly returned.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "foot", + "sample": "custom-foot", + "type": "", + "desc": "Slot at the bottom of the menu pop-up window", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "sureNodevalue", + "sample": "custom-foot", + "type": "", + "desc": "Obtains the selected menu node, closes the menu pop-up window, and displays the selected menu.", + "defaultValue": "" + }, + { + "name": "hideDialog", + "sample": "custom-foot", + "type": "", + "desc": "Close the menu pop-up window.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/link.json b/examples/docs/resources/pc/api/en-US/link.json new file mode 100644 index 000000000..3d2fc87f7 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/link.json @@ -0,0 +1,55 @@ +{ + "attrs": [ + { + "name": "type", + "sample": "link-style", + "type": "String", + "desc": "This attribute can be set to primary / success / warning / danger / info", + "defaultValue": "The default value of this attribute is default." + }, + { + "name": "underline", + "sample": "focus-no-underline", + "type": "Boolean", + "desc": "Underline", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "Disabled", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "href", + "sample": "config-href", + "type": "String", + "desc": "Native href attribute", + "defaultValue": "" + }, + { + "name": "icon", + "sample": "custom-icon", + "type": "Object , String", + "desc": "Icon class name", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-icon", + "type": "", + "desc": "Default slot", + "defaultValue": "" + }, + { + "name": "icon", + "sample": "custom-icon", + "type": "", + "desc": "Icon", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/loading.json b/examples/docs/resources/pc/api/en-US/loading.json new file mode 100644 index 000000000..3e215832a --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/loading.json @@ -0,0 +1,60 @@ +{ + "attrs": [ + { + "name": "text", + "sample": "loading-tip-text", + "type": "String", + "desc": "Set the text through the value attribute. Load copy displayed below the load icon", + "defaultValue": "" + }, + { + "name": "fullscreen", + "sample": "fullscreen", + "type": "Boolean", + "desc": "Set type to true to display the full screen. Same as the fullscreen modifier in the v-loading instruction", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "target", + "sample": "target", + "type": "Object/String", + "desc": "Loading the DOM node to be overwritten. A DOM object or character string can be transferred. If a character string is transferred, it is transferred to document.querySelector as a parameter to obtain the corresponding DOM node.", + "defaultValue": "The default value of this attribute is document.body" + }, + { + "name": "body", + "sample": "body", + "type": "Boolean", + "desc": "The same as the body modifier in the v-loading instruction", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "lock", + "sample": "fullscreen", + "type": "Boolean", + "desc": "The same as the lock modifier in the v-loading instruction", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "spinner", + "sample": "spinner", + "type": "String", + "desc": "Customized loading icon class name", + "defaultValue": "" + }, + { + "name": "background", + "sample": "background", + "type": "String", + "desc": "Mask background color", + "defaultValue": "" + }, + { + "name": "customClass", + "sample": "custom-class", + "type": "String", + "desc": "User-defined loading class name", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/locales.json b/examples/docs/resources/pc/api/en-US/locales.json new file mode 100644 index 000000000..332a2c564 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/locales.json @@ -0,0 +1,53 @@ +{ + "attrs": [ + { + "name": "local", + "sample": "basic-usage", + "type": "Boolean", + "desc": "Local or not", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "change-lang", + "sample": "change-lang", + "type": "Function", + "desc": "Switch Language", + "defaultValue": "" + }, + { + "name": "getLocale", + "sample": "custom-service", + "type": "Function", + "desc": "User-defined interface for obtaining the system language list. This parameter is mandatory when the framework service is not used.", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "Add a class name for the popper. For details, see the popover component.", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether to insert the pop-up box to the body element. If a fault occurs in locating the fault in the dialog box that is displayed, you can set this attribute to false (for details, see the select component).", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "getCurrentLocale", + "sample": "custom-service", + "type": "Function", + "desc": "Customized interface for obtaining the current language. This parameter is mandatory when the framework service is not used.", + "defaultValue": "" + }, + { + "name": "getChangeLocaleUrl", + "sample": "custom-service", + "type": "Function", + "desc": "Customized language update service interface. This parameter is mandatory when the framework service is not used and change-lang is not configured.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/logon-user.json b/examples/docs/resources/pc/api/en-US/logon-user.json new file mode 100644 index 000000000..7d5bdf555 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/logon-user.json @@ -0,0 +1,11 @@ +{ + "attrs": [ + { + "name": "getUserInfo", + "sample": "custom-service", + "type": "Function", + "desc": "Configure the interface for querying current system users.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/logout.json b/examples/docs/resources/pc/api/en-US/logout.json new file mode 100644 index 000000000..48095c2f1 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/logout.json @@ -0,0 +1,25 @@ +{ + "attrs": [ + { + "name": "getLogoutUrl", + "sample": "custom-service", + "type": "Function", + "desc": "User-defined interface for obtaining the deregistration service", + "defaultValue": "" + }, + { + "name": "redirectUrl", + "sample": "redirecturl", + "type": "String", + "desc": "User-defined redirection address after deregistration", + "defaultValue": "" + }, + { + "name": "beforeLogout", + "sample": "", + "type": "Function(params)", + "desc": "Callback function before deregistration", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/menu-bar.json b/examples/docs/resources/pc/api/en-US/menu-bar.json new file mode 100644 index 000000000..9e26dfeeb --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/menu-bar.json @@ -0,0 +1 @@ +{} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/milestone.json b/examples/docs/resources/pc/api/en-US/milestone.json new file mode 100644 index 000000000..e552fc90e --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/milestone.json @@ -0,0 +1,169 @@ +{ + "attrs": [ + { + "name": "completed-field", + "sample": "data-field-mapping", + "type": "String", + "desc": "Set the milestone completion status. The default value is'completed'", + "defaultValue": "The default value of this attribute is completed." + }, + { + "name": "data", + "sample": "data-source", + "type": "Object , Array", + "desc": "Set the step bar data. ;Set the data of the step bar.", + "defaultValue": "" + }, + { + "name": "flag-before", + "sample": "flag-before", + "type": "Boolean", + "desc": "Set whether the data on the flag of an activity on a milestone is obtained from the previous node or the next node. The default value is false.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "flag-content-field", + "sample": "data-field-mapping", + "type": "String", + "desc": "Set the field name corresponding to the description in the node flag data. The default value is'content'", + "defaultValue": "The default value of this attribute is content." + }, + { + "name": "flag-status-field", + "sample": "data-field-mapping", + "type": "String", + "desc": "Name of the field corresponding to the status in the node flag data. The default value is'status'", + "defaultValue": "The default value of this attribute is status." + }, + { + "name": "flag-field", + "sample": "data-field-mapping", + "type": "String", + "desc": "Set the name of the field where the flag data is located in the node information. The default value is flags.", + "defaultValue": "The default value of this attribute is flags." + }, + { + "name": "flag-name-field", + "sample": "data-field-mapping", + "type": "String", + "desc": "Set the field name corresponding to the name in the node flag data. The default value is'name'", + "defaultValue": "The default value of this attribute is name." + }, + { + "name": "line-style", + "sample": "line-style", + "type": "String , Number", + "desc": "In milestone mode, set the line color value mode. The default value is 1. Two colors are used to distinguish the completed state from the uncompleted state. The line color of the completed state is the same as the completion color defined by milestonesStatus. \nIf this parameter is set to 2, the line color is based on the node status. \nIf the color value is set to a hexadecimal value, for example, #1890ff, the line color is the configured color regardless of status.", + "defaultValue": "The default value of this attribute is 1" + }, + { + "name": "milestones-status", + "sample": "milestones-status", + "type": "Object", + "desc": "Define the mapping between the milestone status and color. The color must be a hexadecimal number, for example, {completed:'#1890FF'}", + "defaultValue": "The default value of this attribute is Function." + }, + { + "name": "name-field", + "sample": "data-field-mapping", + "type": "String", + "desc": "Set the field name corresponding to the name in the node information. The default value is'name'", + "defaultValue": "The default value of this attribute is name." + }, + { + "name": "show-number", + "sample": "show-number", + "type": "Boolean", + "desc": "Whether to display sequence numbers for unfinished states. The default value is true.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "solid", + "sample": "solid-style", + "type": "Boolean", + "desc": "In milestone mode, set the completed node to be displayed as solid and the halo is opaque. The default value is false.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "space", + "sample": "milestone-space", + "type": "Number", + "desc": "Set the width of the step bar.", + "defaultValue": "" + }, + { + "name": "start", + "sample": "start-index", + "type": "Number", + "desc": "Set the start step sequence number. The default value is -1.", + "defaultValue": "The default value for this property is - 1" + }, + { + "name": "status-field", + "sample": "data-field-mapping", + "type": "String", + "desc": "Name of the field corresponding to the data status. The default value is'status'", + "defaultValue": "The default value of this attribute is status." + }, + { + "name": "time-field", + "sample": "data-field-mapping", + "type": "String", + "desc": "Name of the field corresponding to the node time information. The default value is'time'", + "defaultValue": "The default value of this attribute is time." + } + ], + "slots": [ + { + "name": "top", + "sample": "custom-top", + "type": "", + "desc": "Content above the node", + "defaultValue": "" + }, + { + "name": "flag", + "sample": "custom-flag", + "type": "", + "desc": "Flag Content", + "defaultValue": "" + }, + { + "name": "bottom", + "sample": "custom-bottom", + "type": "", + "desc": "Content under a node", + "defaultValue": "" + }, + { + "name": "icon", + "sample": "custom-icon-slot", + "type": "", + "desc": "Node icon", + "defaultValue": "" + } + ], + "events": [ + { + "name": "click", + "sample": "milestone-events", + "type": "", + "desc": "Node click event (parameter) (index: node index, node: node data information)", + "defaultValue": "" + }, + { + "name": "flagclick", + "sample": "milestone-events", + "type": "", + "desc": "[deprecated in v3.5.0 and removed in v3.17.0; Reason for removal: It is recommended that flag-click be used instead of flag-click]", + "defaultValue": "" + }, + { + "name": "flag-click", + "sample": "milestone-events", + "type": "", + "desc": "In milestone mode, this parameter indicates the click event of the activity flag. (index: index of the flag on the node; node: data information of the flag on the node)", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/modal.json b/examples/docs/resources/pc/api/en-US/modal.json new file mode 100644 index 000000000..0b04bd3de --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/modal.json @@ -0,0 +1,225 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "value", + "type": "Boolean", + "desc": "Bound Value", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "id", + "sample": "id", + "type": "String", + "desc": "This parameter is valid only for type=message. If you do not want to click a window repeatedly, you can set a unique ID to prevent repeated prompts.", + "defaultValue": "" + }, + { + "name": "is-form-reset", + "sample": "is-form-reset", + "type": "Boolean", + "desc": "Close the pop-up window. The form data is reset by default.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "title", + "sample": "title", + "type": "String", + "desc": "Window title (internationalization is supported)", + "defaultValue": "" + }, + { + "name": "type", + "sample": "type", + "type": "String", + "desc": "Window type; The options of this attribute are alert, confirm, and message.", + "defaultValue": "The default value of this attribute is alert." + }, + { + "name": "status", + "sample": "status", + "type": "String", + "desc": "This parameter is valid only for type=alert | confirm | message. The options of this attribute are info, success, warning, error, loading", + "defaultValue": "The default value of this attribute is info." + }, + { + "name": "message", + "sample": "message", + "type": "[String, Function]", + "desc": "Content of the modal, Type: plain text/VNode, or function that returns String/VNode", + "defaultValue": "" + }, + { + "name": "show-header", + "sample": "showHeader", + "type": "Boolean", + "desc": "Display Header", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "showFooter", + "sample": "showFooter", + "type": "Boolean", + "desc": "Display bottom", + "defaultValue": "" + }, + { + "name": "lock-view", + "sample": "lock-view", + "type": "Boolean", + "desc": "Whether to lock the page. Operations outside the window are not allowed.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "lock-scroll", + "sample": "lock-scroll", + "type": "Boolean", + "desc": "Whether to lock the scroll bar to disable page scrolling.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "mask", + "sample": "lock-view1", + "type": "Boolean", + "desc": "Display mask layer", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "mask-closable", + "sample": "mask-closable", + "type": "Boolean", + "desc": "Whether to allow clicking the mask layer to close the window", + "defaultValue": "" + }, + { + "name": "esc-closable", + "sample": "esc-closable", + "type": "Boolean", + "desc": "Whether to allow closing the window by pressing Esc", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "resize", + "sample": "resize", + "type": "Boolean", + "desc": "Whether to allow dragging to adjust the window size", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "duration", + "sample": "duration", + "type": "[Number, String]", + "desc": "This parameter is valid only when type is set to message. It indicates the delay for automatic disabling.", + "defaultValue": "The default value of this attribute is 3000." + }, + { + "name": "width", + "sample": "resize", + "type": "[Number, String]", + "desc": "Window width", + "defaultValue": "" + }, + { + "name": "height", + "sample": "resize", + "type": "[Number, String]", + "desc": "Window height", + "defaultValue": "" + }, + { + "name": "min-width", + "sample": "min-width", + "type": "[Number, String]", + "desc": "Minimum width of the window", + "defaultValue": "" + }, + { + "name": "min-height", + "sample": "min-height", + "type": "[Number, String]", + "desc": "Minimum height of the window", + "defaultValue": "" + }, + { + "name": "top", + "sample": "top", + "type": "[Number, String]", + "desc": "This parameter is valid only when type is set to message. It indicates the position from the top of the message.", + "defaultValue": "The default value of this attribute is 15" + }, + { + "name": "zIndex", + "sample": "zIndex", + "type": "Number", + "desc": "User-defined stacking sequence (It may be used in some special scenarios, for example, when it is blocked.)", + "defaultValue": "The default value of this attribute is 3000." + }, + { + "name": "fullscreen", + "sample": "fullscreen", + "type": "Boolean", + "desc": "Maximized display by default", + "defaultValue": "The default value of this attribute is false." + } + ], + "slots": [ + { + "name": "default", + "sample": "value1", + "type": "", + "desc": "Default slot", + "defaultValue": "" + }, + { + "name": "footer", + "sample": "footer-slot", + "type": "", + "desc": "Template at the bottom of the window", + "defaultValue": "" + } + ], + "events": [ + { + "name": "show", + "sample": "show-event", + "type": "Function(params)", + "desc": "This event is triggered when the window is displayed. params: {type //Event type, $modal //Component instance}", + "defaultValue": "" + }, + { + "name": "hide", + "sample": "hide-event", + "type": "Function(params)", + "desc": "This event is triggered when the window is closed. params: {type //Event type, $modal //Component instance}", + "defaultValue": "" + }, + { + "name": "confirm", + "sample": "confirm-event", + "type": "Function(params, event)", + "desc": "This event is triggered when the OK button is clicked. params: {type //Event type, $modal //Component instance}, event: native event", + "defaultValue": "" + }, + { + "name": "close", + "sample": "close-event", + "type": "Function(params, event)", + "desc": "This event is triggered when the close button is clicked. params: {type //Event type, $modal //Component instance}, event: native event", + "defaultValue": "" + }, + { + "name": "cancel", + "sample": "cancel-event", + "type": "Function(params, event)", + "desc": "This event is triggered when the Cancel button is clicked. params: {type //Event type, $modal //Component instance}, event: native event", + "defaultValue": "" + }, + { + "name": "zoom", + "sample": "zoom-event", + "type": "Function(params, event)", + "desc": "This event is triggered when a window is zoomed in or out. params: {type //Event type, $modal //Component instance}, event: native event", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/nav-menu.json b/examples/docs/resources/pc/api/en-US/nav-menu.json new file mode 100644 index 000000000..3c0beaaa9 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/nav-menu.json @@ -0,0 +1,48 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "data-resource", + "type": "Array", + "desc": "Set the navigation menu data.", + "defaultValue": "" + }, + { + "name": "overflow", + "sample": "overflow", + "type": "String", + "desc": "Sets the processing policy when the level-1 menu cannot be completely displayed in the current menu container. ; The options are auto, retract, fixed, and hidden. The default value is auto", + "defaultValue": "" + }, + { + "name": "before-skip", + "sample": "before-skip", + "type": "Function", + "desc": "Click the hook function before menu redirection. If false is returned, menu redirection cannot be performed.", + "defaultValue": "" + }, + { + "name": "fetch-menu-data", + "sample": "custom-service", + "type": "Function", + "desc": "Customize the menu data loading service. A Promise object is returned.", + "defaultValue": "" + }, + { + "name": "fields", + "sample": "custom-service", + "type": "Object", + "desc": "User-defined menu data mapping.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "logo", + "sample": "slot-logo", + "type": "", + "desc": "Menu Bar Logo Slot", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/notify.json b/examples/docs/resources/pc/api/en-US/notify.json new file mode 100644 index 000000000..d093945ab --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/notify.json @@ -0,0 +1,97 @@ +{ + "attrs": [ + { + "name": "type", + "sample": "type", + "type": "String", + "desc": "Notification message type. The options are info, success, warning, and error.", + "defaultValue": "info" + }, + { + "name": "title", + "sample": "title", + "type": "[String, Function]", + "desc": "Notification message title, which can be customized by JSX.", + "defaultValue": "undefined" + }, + { + "name": "message", + "sample": "message", + "type": "[String, Function]", + "desc": "Notification message text, which can be customized using JSX.", + "defaultValue": "undefined" + }, + { + "name": "position", + "sample": "position", + "type": "String", + "desc": "Notification display position. The value can be top-right or bottom-right.", + "defaultValue": "bottom-right" + }, + { + "name": "duration", + "sample": "duration", + "type": "Number", + "desc": "Automatic shutdown delay in milliseconds", + "defaultValue": "4500" + }, + { + "name": "customClass", + "sample": "basic-usage", + "type": "[String, Object]", + "desc": "Custom style class", + "defaultValue": "undefined" + }, + { + "name": "showClose", + "sample": "showClose", + "type": "Boolean", + "desc": "Whether to display the close button", + "defaultValue": "true" + }, + { + "name": "showIcon", + "sample": "showIcon", + "type": "Boolean", + "desc": "Display Type Icon", + "defaultValue": "true" + }, + { + "name": "closeIcon", + "sample": "closeIcon", + "type": "Object", + "desc": "Close icon component object", + "defaultValue": "IconClose" + }, + { + "name": "statusIcon", + "sample": "statusIcon", + "type": "Object", + "desc": "Type icon component object", + "defaultValue": "IconInfoSolid" + }, + { + "name": "debounceDelay", + "sample": "debounceDelay", + "type": "Number", + "desc": "Enable image stabilization", + "defaultValue": "0" + } + ], + "events": [ + { + "name": "beforeClose", + "sample": "beforeClose", + "type": "Function", + "desc": "Callback method before closing. If false is returned, closing is prevented.", + "defaultValue": "undefined" + }, + { + "name": "close", + "sample": "close", + "type": "Object", + "desc": "Event triggered when the notify function is disabled", + "defaultValue": "undefined" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/numeric.json b/examples/docs/resources/pc/api/en-US/numeric.json new file mode 100644 index 000000000..6445ca5b1 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/numeric.json @@ -0,0 +1,146 @@ +{ + "attrs": [ + { + "name": "circulate", + "sample": "max-min", + "type": "Boolean", + "desc": "When the maximum value is reached, start from the minimum value or vice versa.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "mouse-wheel", + "sample": "mouse-wheel", + "type": "Boolean", + "desc": "Sets whether to change the value of the scroll wheel.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "Number", + "desc": "Set the default value of the input component. The default value is 0.", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "min", + "sample": "max-min", + "type": "Number", + "desc": "Specify the minimum value that can be entered for a component to create a valid value range. Integers and decimals are supported. ;Set the minimum allowed value of the counter", + "defaultValue": "The default value of this attribute is -Infinity" + }, + { + "name": "max", + "sample": "max-min", + "type": "Number", + "desc": "Maximum value that can be entered in a component to create a valid value range. Integers and decimals are supported. ;Set the maximum allowed value of the counter", + "defaultValue": "The default value of this attribute is Infinity." + }, + { + "name": "step", + "sample": "about-step", + "type": "Number", + "desc": "Set the value to be increased or decreased by pressing the up and down arrow keys or clicking the up and down buttons. The default step is 1.", + "defaultValue": "The default value of this attribute is 1" + }, + { + "name": "step-strictly", + "sample": "about-step", + "type": "Boolean", + "desc": "Whether to enter only multiples of step", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "size", + "sample": "numeric-size", + "type": "String", + "desc": "Counter size; The optional values of this attribute are medium / small / mini", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "dynamic-disabled", + "type": "Boolean", + "desc": "Whether to disable the counter", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "controls", + "sample": "controls", + "type": "Boolean", + "desc": "Whether to use the control button", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "controls-position", + "sample": "controls", + "type": "String", + "desc": "Control button position; The optional value of this attribute is right", + "defaultValue": "" + }, + { + "name": "name", + "sample": "controls2", + "type": "String", + "desc": "Native attribute", + "defaultValue": "" + }, + { + "name": "label", + "sample": "controls", + "type": "String", + "desc": "Label text associated with the text box", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "calculate-according-to-num-of-goods", + "type": "String", + "desc": "Set the placeholder text in the text box.", + "defaultValue": "" + }, + { + "name": "precision", + "sample": "precision", + "type": "Number", + "desc": "Numeric precision", + "defaultValue": "" + }, + { + "name": "format", + "sample": "", + "type": "Object", + "desc": "Number formatting configuration item. The following fields can be configured:; {\n fraction: 4, //Retain the number of decimal places. \n rounding: 0, //Round the number between 0 and 9. For example, if this parameter is set to 7, the value is rounded off to 6. The default value is 5 (rounded off). If this parameter is set to 0 or greater than 9, truncation is performed. \n prefix: '$', //Prefix identifier. \n groupSize: 3, //Integer part grouping interval, that is, the number of bits of the first grouping. \n secondaryGroupSize: 2, //Integer part second-level grouping interval. If this parameter is not set or is set to 0, the value of groupSize is automatically used. \n groupSeparator: ',', //Integer part grouping separator. \n decimalSeparator:' ', / / Decimal point symbol \n fractionGroupSize: 0, // Decimal part grouping interval \n fractionGroupSeparator: '', / / Decimal grouping separator \n suffix: '@' / / Post identifier \n}", + "defaultValue": "" + }, + { + "name": "allow-empty", + "sample": "allow-empty", + "type": "Boolean", + "desc": "The counter can be cleared.", + "defaultValue": "The default value of this attribute is false, indicating that this attribute cannot be cleared." + } + ], + "events": [ + { + "name": "focus", + "sample": "focus-event", + "type": "Function(arg1)", + "desc": "Sets the callback function triggered when a component obtains the focus.; onFocus(arg1){\n// arg1 = event // do something you want...}", + "defaultValue": "" + }, + { + "name": "blur", + "sample": "blur-event", + "type": "Function(arg1)", + "desc": "Sets the callback function triggered when a component loses focus. ; onBlur(arg1){\n// arg1 = event arg1 is an event object.\n// do something you want...}", + "defaultValue": "" + }, + { + "name": "change", + "sample": "change-event", + "type": "Function(arg1, arg2)", + "desc": "Sets the callback function triggered when the value of a component changes.; onChange(arg1, arg2){\n// arg1 = newVal/\n/arg2 = oldVal\n// do something you want...}", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/option-group.json b/examples/docs/resources/pc/api/en-US/option-group.json new file mode 100644 index 000000000..ee130caf7 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/option-group.json @@ -0,0 +1,27 @@ +{ + "attrs": [ + { + "name": "label", + "sample": "option-group", + "type": "String", + "desc": "Group name", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "option-group", + "type": "Boolean", + "desc": "Do you want to disable all options in the group?", + "defaultValue": "The default value of this attribute is false." + } + ], + "slots": [ + { + "name": "default", + "sample": "option-group", + "type": "", + "desc": "Default slot", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/option.json b/examples/docs/resources/pc/api/en-US/option.json new file mode 100644 index 000000000..58632866a --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/option.json @@ -0,0 +1,41 @@ +{ + "attrs": [ + { + "name": "value", + "sample": "filter-method", + "type": "String/number/object", + "desc": "Value of an option", + "defaultValue": "" + }, + { + "name": "label", + "sample": "filter-method", + "type": "String/number", + "desc": "Label of an option. If this parameter is not set, the value is the same as the value by default.", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "Do you want to disable this option?", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "highlight-class", + "sample": "", + "type": "String", + "desc": "Customized highlighted class name", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-options", + "type": "", + "desc": "Default slot (Insert a custom HTML template into tiny-option)", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/pager.json b/examples/docs/resources/pc/api/en-US/pager.json new file mode 100644 index 000000000..9c0650617 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/pager.json @@ -0,0 +1,148 @@ +{ + "attrs": [ + { + "name": "page-size", + "sample": "pager-events", + "type": "Number", + "desc": "Number of items displayed on each page. The .sync modifier is supported.", + "defaultValue": "The default value of this attribute is 10." + }, + { + "name": "is-before-page-change", + "sample": "before-page-change", + "type": "Boolean", + "desc": "Indicates whether to enable the pre-processing feature when the page is changed. When the value is true, the operation of turning pages or changing the page size does not take effect immediately. Instead, the service logic is processed by the user. Then, the reserved callback or rollback is invoked to make the operation take effect or invalid. For details, see the before-page-change event", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "Add a class name for the popper. For details, see the popover component.", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether to insert a pop-up box to the body element. If an error occurs in locating a fault in the dialog box that is displayed, set this attribute to false (for details, see the select component).", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "total", + "sample": "current-page", + "type": "Number", + "desc": "Total number of entries", + "defaultValue": "" + }, + { + "name": "page-count", + "sample": "page-count", + "type": "Number", + "desc": "Total number of pages. You can set either total or page-count to display the page number. If you want to support page-sizes changes, you need to use the total attribute", + "defaultValue": "" + }, + { + "name": "pager-count", + "sample": "pager-count", + "type": "Number", + "desc": "Maximum number of page buttons to be displayed in the middle in number/complete mode. Number of page buttons. When the total number of pages exceeds the value, the buttons will be collapsed. The value of this attribute can be an odd number ranging from 5 to 21", + "defaultValue": "The default value of this attribute is 7." + }, + { + "name": "current-page", + "sample": "current-page", + "type": "Number", + "desc": "Number of current pages. The .sync modifier is supported.", + "defaultValue": "The default value of this attribute is 1" + }, + { + "name": "layout", + "sample": "current-page", + "type": "String", + "desc": "Component layout. Subcomponent names are separated by commas (,). The optional value of this attribute is sizes, prev, pager, next, jumper, ->, total, slot", + "defaultValue": "The default value of this attribute is prev, pager, next, jumper, ->, total" + }, + { + "name": "page-sizes", + "sample": "page-size", + "type": "Array", + "desc": "Set the number of records that can be displayed on each page. Option settings of the number of display items per page selector", + "defaultValue": "The default value of this attribute is [10, 20, 30, 40, 50, 100]" + }, + { + "name": "prev-text", + "sample": "custom-next-prev-text", + "type": "String", + "desc": "Substitute the text on the previous page of the icon.", + "defaultValue": "" + }, + { + "name": "next-text", + "sample": "custom-next-prev-text", + "type": "String", + "desc": "Substitute the text on the next page of the icon.", + "defaultValue": "" + }, + { + "name": "hide-on-single-page", + "sample": "hide-on-single-page", + "type": "Boolean", + "desc": "Whether to hide only one page", + "defaultValue": "" + }, + { + "name": "mode", + "sample": "pager-mode-number", + "type": "String", + "desc": "Set the pagination display mode. The default value is number. Set the pagination display mode. The optional values of this attribute are number / simple / complete / fixed", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-layout", + "type": "", + "desc": "User-defined content. Slots must be listed in the layout.", + "defaultValue": "" + } + ], + "events": [ + { + "name": "before-page-change", + "sample": "before-page-change", + "type": "", + "desc": "This event is triggered when the pre-processing feature is enabled when the page is changed and the page turning or page size is changed. ; / / Parameter arg\n {$grid: VueComponent, //table component vue instance \ncurrentPage: 1 // Current page number \nlayout: 'total, prev, pager, next, jumper, sizes' / / Current paging component layout information \npageSize: 10 // Number of records displayed on each page. \npageSizes: [5, 10] //Number of records that can be switched on each page.\ntotal: 10 //Total number of records}", + "defaultValue": "" + }, + { + "name": "size-change", + "sample": "pager-events", + "type": "Function(arg1)", + "desc": "Set the event after pagination. This event is triggered when pageSize changes. arg1: pageSize new current value", + "defaultValue": "" + }, + { + "name": "current-change", + "sample": "pager-events-current-change", + "type": "Function(arg1)", + "desc": "This event is triggered when the currentPage changes. arg1: new current page value", + "defaultValue": "" + }, + { + "name": "prev-click", + "sample": "pager-events-prev-click", + "type": "Function(arg1)", + "desc": "This event is triggered when a user clicks the previous button to change the current page. arg1: new current page value", + "defaultValue": "" + }, + { + "name": "next-click", + "sample": "pager-events-nextclick", + "type": "Function(arg1)", + "desc": "This event is triggered when a user clicks Next to change the current page. arg1: Number New current page value", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/panel.json b/examples/docs/resources/pc/api/en-US/panel.json new file mode 100644 index 000000000..7e1e532b6 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/panel.json @@ -0,0 +1,113 @@ +{ + "attrs": [ + { + "name": "transition", + "sample": "", + "type": "String", + "desc": "Whether to enable the animation effect. The default value is true. ; Animation style class name. ; The optional value of this attribute is --", + "defaultValue": "The default value of this attribute is panel." + }, + { + "name": "expand", + "sample": "", + "type": "Boolean", + "desc": "Whether to expand the content area by default during initialization. The default value is true, and the default value is false. ; Whether to expand the content area by default during initialization. The default value is true, and the default value is false. ; The optional value of this attribute is --", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "foot", + "sample": "", + "type": "String", + "desc": "Specify the bottom content. You can enter i18n content. ; The optional value of this attribute is --", + "defaultValue": "The default value of this attribute is --" + }, + { + "name": "head", + "sample": "", + "type": "String", + "desc": "Specify the header content. You can enter the i18n content. ; The optional value of this attribute is --", + "defaultValue": "The default value of this attribute is --" + }, + { + "name": "isToggle", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether the scale-in mode can be used. The default value is true. \n; The optional value of this attribute is --", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "iconOpen", + "sample": "", + "type": "String", + "desc": "Icon when expanded, providing the style class name of icon-font. ; The optional value of this attribute is --", + "defaultValue": "The default value of this attribute is icon-chevron-right" + }, + { + "name": "iconClose", + "sample": "", + "type": "String", + "desc": "Icon during collapse, providing the style class name of icon-font; The optional value of this attribute is --", + "defaultValue": "The default value of this attribute is icon-chevron-down" + } + ], + "slots": [ + { + "name": "default", + "sample": "", + "type": "", + "desc": "Default slot", + "defaultValue": "" + }, + { + "name": "collapse", + "sample": "", + "type": "", + "desc": "Content", + "defaultValue": "" + }, + { + "name": "header", + "sample": "", + "type": "", + "desc": "Header", + "defaultValue": "" + }, + { + "name": "footer", + "sample": "", + "type": "", + "desc": "Bottom", + "defaultValue": "" + } + ], + "events": [ + { + "name": "beforeCollapse", + "sample": "", + "type": "", + "desc": "Event before scale-in.", + "defaultValue": "" + }, + { + "name": "beforeExpand", + "sample": "", + "type": "", + "desc": "Event before expansion. Return false can prevent expansion.", + "defaultValue": "" + }, + { + "name": "collapse", + "sample": "", + "type": "", + "desc": "Shrunk event.", + "defaultValue": "" + }, + { + "name": "expand", + "sample": "", + "type": "", + "desc": "Expanded event.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/pop-upload.json b/examples/docs/resources/pc/api/en-US/pop-upload.json new file mode 100644 index 000000000..015985363 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/pop-upload.json @@ -0,0 +1,137 @@ +{ + "attrs": [ + { + "name": "dialog-title", + "sample": "fill-button-text1", + "type": "String", + "desc": "Set the title of the file upload dialog box. The default value is file upload", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "Set the component size", + "defaultValue": "" + }, + { + "name": "submit-button-text", + "sample": "fill-button-text2", + "type": "String", + "desc": "Set the text of the Submit button in the file upload dialog box. The default value is Start uploading", + "defaultValue": "" + }, + { + "name": "cancel-button-text", + "sample": "fill-button-text1", + "type": "String", + "desc": "Set the text of the Cancel button in the file upload dialog box. The default value is Cancel", + "defaultValue": "" + }, + { + "name": "action", + "sample": "custom-request-headers", + "type": "String", + "desc": "This parameter is mandatory and specifies the upload address.", + "defaultValue": "" + }, + { + "name": "headers", + "sample": "custom-request-headers", + "type": "Object", + "desc": "Set the upload request header", + "defaultValue": "" + }, + { + "name": "limit", + "sample": "file-limit", + "type": "Number", + "desc": "Maximum number of files that can be uploaded", + "defaultValue": "" + }, + { + "name": "multiple", + "sample": "file-limit", + "type": "Boolean", + "desc": "Specifies whether multiple files can be selected.", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "size", + "type": "Boolean", + "desc": "Whether to disable; The default value is false", + "defaultValue": "" + }, + { + "name": "accept", + "sample": "file-type", + "type": "String", + "desc": "File type to be uploaded", + "defaultValue": "" + }, + { + "name": "upload-file-type", + "sample": "file-type", + "type": "Array", + "desc": "Type of the uploaded file to be verified, for example, ['.png', '.jpg']", + "defaultValue": "" + }, + { + "name": "max-upload-file-size", + "sample": "max-upload-file-size", + "type": "Number", + "desc": "Maximum size of files to be uploaded", + "defaultValue": "" + }, + { + "name": "upload-name", + "sample": "upload-name", + "type": "String", + "desc": "Field name of the uploaded file", + "defaultValue": "The default value of this attribute is file." + }, + { + "name": "upload-button-text", + "sample": "fill-button-text4", + "type": "String", + "desc": "Text configuration attribute of the button for opening a dialog box", + "defaultValue": "The default value of this attribute is Select File." + }, + { + "name": "with-credentials", + "sample": "upload-name", + "type": "Boolean", + "desc": "Cookie credential information can be sent.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "before-remove", + "sample": "prevent-delete-file", + "type": "Function(arg1)", + "desc": "This event is triggered before the upload file list is deleted successfully. arg1:{Information about the file to be deleted by clicking Object}", + "defaultValue": "" + }, + { + "name": "before-upload", + "sample": "before-upload", + "type": "Function(arg1)", + "desc": "Hook before uploading a file. The parameter is the file to be uploaded. If false is returned or Promise is returned and rejected, the upload stops. ;arg1:{Object uploaded file information}", + "defaultValue": "" + }, + { + "name": "http-request", + "sample": "http-request", + "type": "Function", + "desc": "Overwrite the default upload behavior. You can customize the upload implementation.", + "defaultValue": "" + }, + { + "name": "data", + "sample": "", + "type": "Object", + "desc": "Extra parameters attached during upload", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/popeditor.json b/examples/docs/resources/pc/api/en-US/popeditor.json new file mode 100644 index 000000000..61bb1f103 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/popeditor.json @@ -0,0 +1,232 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "base", + "type": "String", + "desc": "Bound Value", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "base", + "type": "String", + "desc": "Placeholder", + "defaultValue": "" + }, + { + "name": "tabindex", + "sample": "tabindex", + "type": "String", + "desc": "Sets whether focus can be obtained by pressing Tab and the focus sequence. This parameter is valid only when readonly is set to false.", + "defaultValue": "The default value of this attribute is 1." + }, + { + "name": "remote-search", + "sample": "remote-search", + "type": "Function({page, conditions})", + "desc": "Configure remote search", + "defaultValue": "" + }, + { + "name": "before-reset", + "sample": "before-reset", + "type": "Function", + "desc": "Hook function before reset", + "defaultValue": "" + }, + { + "name": "resize", + "sample": "resize", + "type": "Boolean", + "desc": "Whether to display the full-screen button in the pop-up box", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "draggable", + "sample": "draggable", + "type": "Boolean", + "desc": "Set whether the pop-up window can be dragged.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "showOverflow", + "sample": "showOverflow", + "type": "String,Object", + "desc": " (When a grid table is nested in popeditor, it is configured in columns of the gridOp attribute.) Sets the display problem caused by excessively long table data. The value can be tooltip, title, or ellipsis;1tooltip: The extra part is displayed.... The prompt layer on the left or right displays all information. 2title: The value is the same as the title attribute of the native tag. 3ellipsis: The part that exceeds the content is displayed as..., and no prompt is displayed. 4true: If the value is true, the effect is the same as that of the tooltip.", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "Set the component size. The options are medium, small, and mini.", + "defaultValue": "" + }, + { + "name": "trigger", + "sample": "trigger", + "type": "String", + "desc": "In the table in the dialog box that is displayed, the radio is selected. The options are as follows: default (default), cell (clicking a cell), and row (clicking a row)", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "Sets whether a component is disabled.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "conditions", + "sample": "conditions", + "type": "Array", + "desc": "When a table is configured on the pop-up panel, set the table query items in the pop-up panel.", + "defaultValue": "" + }, + { + "name": "grid-op", + "sample": "grid", + "type": "Object", + "desc": "Set the configuration information of the table component in the pop-up panel.", + "defaultValue": "" + }, + { + "name": "pager-op", + "sample": "pager", + "type": "Object", + "desc": "Setting Pagination Configuration", + "defaultValue": "" + }, + { + "name": "icon", + "sample": "icon", + "type": "Object", + "desc": "Set the icon of the popEditor component. The default value is svg component", + "defaultValue": "" + }, + { + "name": "multi", + "sample": "multi", + "type": "Boolean", + "desc": "Specifies whether multiple data can be selected in the pop-up panel.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "popseletor", + "sample": "tree", + "type": "String", + "desc": "Set the tree or table components that can be displayed in the pop-up panel.", + "defaultValue": "The default value of this attribute is grid." + }, + { + "name": "readonly", + "sample": "readonly", + "type": "Boolean", + "desc": "Set [3.0] to read-only. If [3.0] is set to false, click the Ipunt box to display the selection box.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "show-clear-btn", + "sample": "showClearBtn", + "type": "Boolean", + "desc": "Specifies whether to display the Clear button on the right of the text box.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "show-pager", + "sample": "pager", + "type": "Boolean", + "desc": "Paging", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "show-history", + "sample": "show-history", + "type": "Boolean", + "desc": "Specifies whether to display tables on the History tab page when tables are configured on the pop-up panel.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "text-field", + "sample": "textField", + "type": "String", + "desc": "Set the text field in the text box. When data is submitted, the text is not submitted.", + "defaultValue": "The default value of this attribute is label." + }, + { + "name": "text-split", + "sample": "multi", + "type": "String", + "desc": "Separator for displaying multiple records in the text box when multiple records are selected.", + "defaultValue": "The default value of this attribute is /" + }, + { + "name": "title", + "sample": "title", + "type": "String", + "desc": "Set the title of the pop-up panel and support internationalization.", + "defaultValue": "" + }, + { + "name": "value-field", + "sample": "title", + "type": "String", + "desc": "Set the field to which data is to be submitted in the text box.", + "defaultValue": "The default value of this attribute is id." + }, + { + "name": "value-split", + "sample": "multi", + "type": "String", + "desc": "Separator for submitting multiple pieces of data in the text box when multiple pieces of data are selected.", + "defaultValue": "The default value of this attribute is;." + }, + { + "name": "width", + "sample": "width", + "type": "Number , String", + "desc": "Wide of the pop-up panel, in pixels.When multi of a component is set to true, the minimum width is 900px. Otherwise, the minimum width is 600px.", + "defaultValue": "" + }, + { + "name": "dialog-class", + "sample": "width", + "type": "String", + "desc": "Customized configuration pop-up window class name", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "search", + "sample": "slot", + "type": "", + "desc": "Query Condition Slot", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "events", + "type": "Function(arg1, arg2)", + "desc": "Change event in the input box of the Popeditor component. ; onChange(arg1, arg2){\n// arg1 = state.commitValue arg1 is the index of the submitted information. \n// arg2 = state.selectedDatas arg2 is the data of the submitted information. \n// do something you want...}", + "defaultValue": "" + }, + { + "name": "close", + "sample": "events", + "type": "Function", + "desc": "Event triggered when the pop-up dialog box of the Popeditor component is closed.", + "defaultValue": "" + }, + { + "name": "page-change", + "sample": "events", + "type": "Function(arg1)", + "desc": "Indicates that the table mode of the Popeditor component is switched by page. ; onPageChange (arg1) {// arg1 = val arg1 is the page number. // do something you want...}", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/popover.json b/examples/docs/resources/pc/api/en-US/popover.json new file mode 100644 index 000000000..483e145d8 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/popover.json @@ -0,0 +1,169 @@ +{ + "attrs": [ + { + "name": "trigger", + "sample": "trigger-mode", + "type": "String", + "desc": "Trigger mode; The optional values of this attribute are click / focus / hover / manual", + "defaultValue": "The default value of this attribute is click." + }, + { + "name": "title", + "sample": "custom-tip-text", + "type": "String", + "desc": "Title", + "defaultValue": "" + }, + { + "name": "content", + "sample": "popover-content", + "type": "String", + "desc": "Displayed content, which can also be transferred to the DOM through slot.", + "defaultValue": "" + }, + { + "name": "width", + "sample": "popover-width", + "type": "String , Number", + "desc": "Width", + "defaultValue": "The default value of this attribute is the minimum width 150px." + }, + { + "name": "placement", + "sample": "popover-placement", + "type": "String", + "desc": "Location; The optional value of this attribute is top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end", + "defaultValue": "The default value of this attribute is bottom." + }, + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "Popover available", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "modelValue / v-model", + "sample": "trigger-mode", + "type": "Boolean", + "desc": "Whether the status is visible", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "offset", + "sample": "frame-offset", + "type": "Number", + "desc": "Offset of the occurrence position", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "arrow-offset", + "sample": "arrow-offset", + "type": "Number", + "desc": "Arrow position offset", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "transform-origin", + "sample": "", + "type": "Boolean , String", + "desc": "The rotation center of the component", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "append-to-body", + "sample": "basic-usage", + "type": "Boolean", + "desc": "Whether to add to body", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "transition", + "sample": "custom-transition", + "type": "String", + "desc": "Define gradient animation", + "defaultValue": "The default value of this attribute is fade-in-linear." + }, + { + "name": "visible-arrow", + "sample": "hidden-arrow", + "type": "Boolean", + "desc": "Whether to display the Tooltip arrow.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "popper-options", + "sample": "popper-options", + "type": "Object", + "desc": "Parameters of popper.js; The optional value of this attribute is a reference to the popper.js document", + "defaultValue": "The default value for this attribute is {boundariesElement: 'body', gpuAcceleration: false}" + }, + { + "name": "popper-class", + "sample": "popper-class", + "type": "String", + "desc": "Add a class name for popper", + "defaultValue": "" + }, + { + "name": "open-delay", + "sample": "open-delay", + "type": "Number", + "desc": "Display delay when the trigger mode is hover, in milliseconds.", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "close-delay", + "sample": "close-delay", + "type": "Number", + "desc": "Hide delay when the trigger mode is hover, in milliseconds.", + "defaultValue": "The default value of this attribute is 200." + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-tip-text", + "type": "", + "desc": "Popover embedded HTML text", + "defaultValue": "" + }, + { + "name": "reference", + "sample": "popover-events", + "type": "", + "desc": "HTML element that triggers popover display", + "defaultValue": "" + } + ], + "events": [ + { + "name": "show", + "sample": "popover-events", + "type": "Function()", + "desc": "Triggered upon display", + "defaultValue": "" + }, + { + "name": "hide", + "sample": "popover-events", + "type": "Function()", + "desc": "Triggered when hidden", + "defaultValue": "" + }, + { + "name": "after-enter", + "sample": "popover-events", + "type": "Function", + "desc": "This event is triggered after the animation is played.", + "defaultValue": "" + }, + { + "name": "after-leave", + "sample": "popover-events", + "type": "Function()", + "desc": "Triggered after the hidden animation is played.", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/popup-load.json b/examples/docs/resources/pc/api/en-US/popup-load.json new file mode 100644 index 000000000..9e26dfeeb --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/popup-load.json @@ -0,0 +1 @@ +{} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/progress.json b/examples/docs/resources/pc/api/en-US/progress.json new file mode 100644 index 000000000..25f7a739a --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/progress.json @@ -0,0 +1,67 @@ +{ + "attrs": [ + { + "name": "percentage", + "sample": "basic-usage", + "type": "Number", + "desc": "Percentage (mandatory) The optional values for this property are 0 - 100", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "type", + "sample": "progress-type", + "type": "String", + "desc": "Progress bar type; The value of this attribute can be line, circle, or dashboard", + "defaultValue": "The default value of this attribute is line." + }, + { + "name": "stroke-width", + "sample": "progress-width", + "type": "Number", + "desc": "Progress bar width, in px", + "defaultValue": "The default value of this attribute is 6" + }, + { + "name": "text-inside", + "sample": "progress-width", + "type": "Boolean", + "desc": "The text displayed on the progress bar is embedded in the progress bar. This parameter is available only when type is set to line.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "status", + "sample": "progress-status", + "type": "String", + "desc": "Current status of the progress bar; The value of this attribute can be success, exception, or warning", + "defaultValue": "" + }, + { + "name": "color", + "sample": "custom-color", + "type": "String , Function , Array", + "desc": "Background color of the progress bar (overwrites the status color).", + "defaultValue": "" + }, + { + "name": "width", + "sample": "progress-width", + "type": "Number", + "desc": "Circular progress bar canvas width (available only when type is circle or dashboard)", + "defaultValue": "The default value of this attribute is 126." + }, + { + "name": "show-text", + "sample": "text-inside-or-no-text", + "type": "Boolean", + "desc": "Display progress bar text", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "format", + "sample": "format-text", + "type": "Function", + "desc": "Customize the text of the progress bar", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/radio-button.json b/examples/docs/resources/pc/api/en-US/radio-button.json new file mode 100644 index 000000000..26b7864be --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/radio-button.json @@ -0,0 +1,34 @@ +{ + "attrs": [ + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "Disable", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "name", + "sample": "radio-text", + "type": "String", + "desc": "Native name attribute", + "defaultValue": "" + }, + { + "name": "label", + "sample": "radio-text", + "type": "String | Number", + "desc": "Radio value", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "dynamic-disable", + "type": "", + "desc": "button content", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/radio-group.json b/examples/docs/resources/pc/api/en-US/radio-group.json new file mode 100644 index 000000000..037079b3b --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/radio-group.json @@ -0,0 +1,71 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "vertical", + "type": "--", + "desc": "Bound Value", + "defaultValue": "" + }, + { + "name": "text-color", + "sample": "active-color", + "type": "String", + "desc": "Text color when the radio is activated in button mode", + "defaultValue": "The default value of this attribute is #fff" + }, + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "Disable", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "size", + "sample": "radio-size", + "type": "String", + "desc": "Size of an option button group. This parameter is valid only for radios with buttons or borders. The optional values of this attribute are medium / small / mini", + "defaultValue": "" + }, + { + "name": "fill", + "sample": "active-color", + "type": "String", + "desc": "Fill color and border color when the radio in button mode is activated", + "defaultValue": "" + }, + { + "name": "vertical", + "sample": "vertical", + "type": "Boolean", + "desc": "Set the component arrangement mode.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "options", + "sample": "group-options", + "type": "Array", + "desc": "Configure radio cyclically", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "vertical", + "type": "", + "desc": "Radio Default Slot", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "vertical", + "type": "", + "desc": "Event triggered when the binding value changes", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/radio.json b/examples/docs/resources/pc/api/en-US/radio.json new file mode 100644 index 000000000..5bbdb6903 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/radio.json @@ -0,0 +1,71 @@ +{ + "attrs": [ + { + "name": "label", + "sample": "with-border", + "type": "Boolean|Number|String", + "desc": "Radio value", + "defaultValue": "" + }, + { + "name": "modelValue / v-model", + "sample": "with-border", + "type": "--", + "desc": "Bound Value", + "defaultValue": "" + }, + { + "name": "text", + "sample": "radio-text", + "type": "String", + "desc": "Text", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "Disable", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "border", + "sample": "with-border", + "type": "Boolean", + "desc": "Display Border", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "size", + "sample": "radio-size", + "type": "String", + "desc": "Radio size. This parameter is valid only when border is set to true. The optional values of this attribute are medium / small / mini", + "defaultValue": "" + }, + { + "name": "name", + "sample": "radio-button1", + "type": "String", + "desc": "Native name attribute", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "radio-default", + "type": "", + "desc": "Radio default slot", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "radio-events", + "type": "", + "desc": "Event triggered when the binding value changes", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/rate.json b/examples/docs/resources/pc/api/en-US/rate.json new file mode 100644 index 000000000..bdd24ca25 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/rate.json @@ -0,0 +1,160 @@ +{ + "attrs": [ + { + "name": "max", + "sample": "max-score", + "type": "Number", + "desc": "Maximum score", + "defaultValue": "The default value of this attribute is 5" + }, + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "Read-only", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "allow-half", + "sample": "allow-half", + "type": "Boolean", + "desc": "Whether to allow half selection", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "colors", + "sample": "custom-3-threshold-colors", + "type": "Array", + "desc": "icon color array, which is the color corresponding to the Threshold three segments.", + "defaultValue": "The default value of this attribute is ['#FADB14', '#FADB14', '#FADB14']" + }, + { + "name": "disabled-void-color", + "sample": "disabled-not-selected-color", + "type": "String", + "desc": "Color of unselected icons in disabled state", + "defaultValue": "The default value of this attribute is #D9D9D9" + }, + { + "name": "disabled-void-icon-class", + "sample": "disabled-not-selected-color", + "type": "String", + "desc": "Icon style name that is not selected in read-only state", + "defaultValue": "The default value of this attribute is icon-stardisable." + }, + { + "name": "high-threshold", + "sample": "threshold-value", + "type": "Number", + "desc": "The threshold between the high score and the medium score. The value is divided into the high score.", + "defaultValue": "The default value of this attribute is 4" + }, + { + "name": "icon-classes", + "sample": "custom-3-threshold-icon", + "type": "Array", + "desc": "Icon style name corresponding to the three segments", + "defaultValue": "The default value of this attribute is ['icon-starActive','icon-starActive','icon-starActive']" + }, + { + "name": "low-threshold", + "sample": "threshold-value", + "type": "Number", + "desc": "The threshold value of the low score and the medium score. The value is divided into the low score.", + "defaultValue": "The default value of this attribute is 2" + }, + { + "name": "score-template", + "sample": "show-score", + "type": "String", + "desc": "Score display template", + "defaultValue": "The default value of this attribute is {value}." + }, + { + "name": "show-score", + "sample": "show-score", + "type": "Boolean", + "desc": "Whether to display the current score. The values of show-score and show-text cannot be true at the same time.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "show-text", + "sample": "texts-and-text-color", + "type": "Boolean", + "desc": "Indicates whether to display auxiliary text. If yes, the text corresponding to the current score is selected from the texts array.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "text-color", + "sample": "texts-and-text-color", + "type": "String", + "desc": "Color of auxiliary text", + "defaultValue": "The default value of this attribute is # 666666" + }, + { + "name": "texts", + "sample": "texts-and-text-color", + "type": "Array", + "desc": "Auxiliary text array", + "defaultValue": "The default value of this attribute is ['poor', 'poor', 'average', 'good', 'good']" + }, + { + "name": "void-color", + "sample": "not-selected-color", + "type": "String", + "desc": "Color of unselected icons", + "defaultValue": "The default value of this attribute is #BFBFBF" + }, + { + "name": "void-icon-class", + "sample": "not-selected-class", + "type": "String", + "desc": "Class name of unselected icons", + "defaultValue": "The default value of this attribute is icon-stardisable." + }, + { + "name": "radio", + "sample": "radio-rate", + "type": "Boolean", + "desc": "Single choice for scoring other forms", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "size", + "sample": "size-and-space", + "type": "String", + "desc": "Icon font size", + "defaultValue": "The default value of this attribute is 18px." + }, + { + "name": "space", + "sample": "size-and-space", + "type": "String", + "desc": "Width of each icon", + "defaultValue": "The default value of this attribute is 24px." + }, + { + "name": "text-on-bottom", + "sample": "text-on-bottom", + "type": "Boolean", + "desc": "Whether to display the corresponding text under the icon", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "Number", + "desc": "Bound Value", + "defaultValue": "The default value of this attribute is 0" + } + ], + "events": [ + { + "name": "change", + "sample": "rate-events", + "type": "", + "desc": "This event is triggered when the score changes.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/roles.json b/examples/docs/resources/pc/api/en-US/roles.json new file mode 100644 index 000000000..2aa78e836 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/roles.json @@ -0,0 +1,20 @@ +{ + "attrs": [ + { + "name": "fetch-role", + "sample": "fetch-role", + "type": "Function", + "desc": "Customized interface. A Promise object is returned. This parameter is mandatory when the framework service is not used.", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "base", + "type": "", + "desc": "This event is triggered when the selected value changes.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/row.json b/examples/docs/resources/pc/api/en-US/row.json new file mode 100644 index 000000000..8ff1ad18b --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/row.json @@ -0,0 +1,55 @@ +{ + "attrs": [ + { + "name": "align", + "sample": "align", + "type": "String", + "desc": "vertical arrangement mode in the flex layout; The value of this attribute can be top / middle / bottom", + "defaultValue": "The default value of this attribute is top." + }, + { + "name": "flex", + "sample": "", + "type": "Boolean", + "desc": "Enable the flex layout mode. This parameter is valid in modern browsers.", + "defaultValue": "" + }, + { + "name": "gutter", + "sample": "align", + "type": "Number", + "desc": "Grid Interval", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "justify", + "sample": "align", + "type": "String", + "desc": "horizontal arrangement mode in flex layout; The optional value of this attribute is start / end / center / space-around / space-between", + "defaultValue": "The default value of this attribute is start." + }, + { + "name": "order", + "sample": "align", + "type": "String", + "desc": "Flex layout sorting mode; The optional value of this attribute is asc / des", + "defaultValue": "" + }, + { + "name": "tag", + "sample": "align", + "type": "String", + "desc": "User-defined element label. Any label can be selected. The optional value of this attribute is *", + "defaultValue": "The default value of this attribute is div." + } + ], + "slots": [ + { + "name": "default", + "sample": "base", + "type": "", + "desc": "Default slot", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/scroll-text.json b/examples/docs/resources/pc/api/en-US/scroll-text.json new file mode 100644 index 000000000..114f3f715 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/scroll-text.json @@ -0,0 +1,41 @@ +{ + "attrs": [ + { + "name": "direction", + "sample": "scroll-direction", + "type": "String", + "desc": "Scrolling direction; The optional values of this attribute are up / left / down / right", + "defaultValue": "The default value of this attribute is left." + }, + { + "name": "hover-stop", + "sample": "hover-stop", + "type": "Boolean", + "desc": "Whether to stop scrolling. The value can be false or true. The default value is true.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "time", + "sample": "scroll-time", + "type": "Number", + "desc": "Time taken for scrolling. The default value is 5s.", + "defaultValue": "The default value of this attribute is 5" + }, + { + "name": "text", + "sample": "custom-scroll-text", + "type": "String", + "desc": "Scrolled text content", + "defaultValue": "The default value of this property is ScrollText" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-scroll-text", + "type": "", + "desc": "Default slot", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/scrollbar.json b/examples/docs/resources/pc/api/en-US/scrollbar.json new file mode 100644 index 000000000..47e45e80c --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/scrollbar.json @@ -0,0 +1,11 @@ +{ + "slots": [ + { + "name": "default", + "sample": "", + "type": "", + "desc": "Default slot", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/search.json b/examples/docs/resources/pc/api/en-US/search.json new file mode 100644 index 000000000..6742394eb --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/search.json @@ -0,0 +1,92 @@ +{ + "attrs": [ + { + "name": "default-value", + "sample": "", + "type": "String", + "desc": "Set the default search value in the search text box.", + "defaultValue": "" + }, + { + "name": "clearable", + "sample": "clearable", + "type": "Boolean", + "desc": "The clear icon is displayed in attribute settings.", + "defaultValue": "" + }, + { + "name": "v-model", + "sample": "basic-usage", + "type": "String", + "desc": "Set the bound value.", + "defaultValue": "" + }, + { + "name": "mini", + "sample": "mini-mode", + "type": "Boolean", + "desc": "Mini mode. If this parameter is set to true, a round button with an icon is displayed by default. After you click the button, the button is displayed. The default value is false.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "placeholder", + "sample": "basic-usage", + "type": "String", + "desc": "Set the placeholder text in the search box.", + "defaultValue": "" + }, + { + "name": "search-types", + "sample": "search-types", + "type": "Array", + "desc": "Search type. The format is [{text:'Document', value:1}, ...]. If this parameter is not specified, All is displayed.", + "defaultValue": "" + }, + { + "name": "transparent", + "sample": "transparent-mode", + "type": "Boolean", + "desc": "Transparent mode. If this parameter is set to true, the border becomes transparent and is displayed semi-transparently after being collapsed. Generally, this parameter is used in scenarios with a background. The default value is false.", + "defaultValue": "The default value of this attribute is false." + } + ], + "slots": [ + { + "name": "poplist", + "sample": "custom-search-types", + "type": "", + "desc": "Slot in the search pop-up list", + "defaultValue": "" + }, + { + "name": "text", + "sample": "show-selected-types", + "type": "", + "desc": "Default search type slot", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "change-events", + "type": "Function(arg1, arg2)", + "desc": "Callback function triggered when input is complete in the input box; arg1:{Object search type}, arg2:{String value in the current input box}", + "defaultValue": "" + }, + { + "name": "search", + "sample": "search-events", + "type": "Function(arg1, arg2)", + "desc": "Callback function triggered when the search button is clicked in the expanded state; arg1:{Object search type}, arg2:{String value in the current input box}", + "defaultValue": "" + }, + { + "name": "select", + "sample": "select-events", + "type": "Function(arg1)", + "desc": "Callback function triggered when the type of the search component is switched; arg1:{Object search type}", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/select-dropdown.json b/examples/docs/resources/pc/api/en-US/select-dropdown.json new file mode 100644 index 000000000..9e26dfeeb --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/select-dropdown.json @@ -0,0 +1 @@ +{} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/select.json b/examples/docs/resources/pc/api/en-US/select.json new file mode 100644 index 000000000..61d3ad52b --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/select.json @@ -0,0 +1,360 @@ +{ + "attrs": [ + { + "name": "tag-selectable", + "sample": "tag-select", + "type": "String", + "desc": "The selected items in the drop-down list box can be copied.", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "Disable", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "multiple", + "sample": "multiple", + "type": "Boolean", + "desc": "Specifies whether multiple items can be entered or selected in the text box. The default value is false. ; Whether to select multiple options", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "placement", + "sample": "popup-style-position", + "type": "String", + "desc": "Location of the tip relative to the dom node where the tip is created. ; The optional value of this attribute is top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end", + "defaultValue": "" + }, + { + "name": "clearable", + "sample": "clearable", + "type": "Boolean", + "desc": "Whether to display the button for clearing text. The default value is true. ;Whether the option can be cleared", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "text-field", + "sample": "nest-checkbox-grid1", + "type": "String", + "desc": "Field name of the data source corresponding to the text in the drop-down list box.", + "defaultValue": "" + }, + { + "name": "modelValue / v-model", + "sample": "multiple", + "type": "Boolean , String , Number", + "desc": "Set the default value of the drop-down list box. ;Bound Value", + "defaultValue": "" + }, + { + "name": "value-field", + "sample": "nest-checkbox-grid2", + "type": "String", + "desc": "Set the field name of the data source corresponding to the value in the drop-down list box. The value in the drop-down list box is submitted to the server.", + "defaultValue": "" + }, + { + "name": "value-key", + "sample": "binding-obj", + "type": "String", + "desc": "Key name that uniquely identifies a value. This parameter is mandatory when the bound value is an object type.", + "defaultValue": "The default value of this attribute is value." + }, + { + "name": "size", + "sample": "size-medium", + "type": "String", + "desc": "Text box size; The value of this attribute can be medium, small, or mini", + "defaultValue": "" + }, + { + "name": "collapse-tags", + "sample": "collapse-tags", + "type": "Boolean", + "desc": "Whether to display the selected value in text format when multiple options are selected.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "multiple-limit", + "sample": "multiple", + "type": "Number", + "desc": "Maximum number of items that a user can select when multiple items are selected. If the value is 0, there is no limit.", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "name", + "sample": "name", + "type": "String", + "desc": "name attribute of select input", + "defaultValue": "" + }, + { + "name": "autocomplete", + "sample": "", + "type": "String", + "desc": "autocomplete attribute of select input", + "defaultValue": "The default value of this attribute is off." + }, + { + "name": "placeholder", + "sample": "basic-usage", + "type": "String", + "desc": "Placeholder", + "defaultValue": "The default value of this attribute is Please select." + }, + { + "name": "filterable", + "sample": "filter-method", + "type": "Boolean", + "desc": "Searchable", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "allow-create", + "sample": "allow-create", + "type": "Boolean", + "desc": "Whether to allow users to create new items. This parameter must be used together with filterable.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "filter-method", + "sample": "filter-method", + "type": "Function(arg1, arg2)", + "desc": "User-defined search method; arg1:{String value in the current input box}, arg2:{a node in the Object tree}", + "defaultValue": "" + }, + { + "name": "remote", + "sample": "remote-method", + "type": "Boolean", + "desc": "Remote search", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "remote-method", + "sample": "remote-method", + "type": "Function", + "desc": "Remote search method", + "defaultValue": "" + }, + { + "name": "loading", + "sample": "remote-method", + "type": "Boolean", + "desc": "Whether data is being obtained from the remote server", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "loading-text", + "sample": "remote-method", + "type": "String", + "desc": "Text displayed during remote loading", + "defaultValue": "The default value of this attribute is loading." + }, + { + "name": "no-match-text", + "sample": "no-match-text", + "type": "String", + "desc": "Text displayed when no search criteria are matched. You can also use slot=\"empty\" to set it.", + "defaultValue": "The default value of this attribute is no matching data." + }, + { + "name": "no-data-text", + "sample": "no-data-text", + "type": "String", + "desc": "Text displayed when the option is empty. You can also use slot=\"empty\" to set it.", + "defaultValue": "The default value of this attribute is no data." + }, + { + "name": "popper-class", + "sample": "popup-style-position", + "type": "String", + "desc": "Class name of the Select drop-down list box", + "defaultValue": "The default value of this attribute is null." + }, + { + "name": "reserve-keyword", + "sample": "remote-method", + "type": "Boolean", + "desc": "Whether to retain the current search keyword after an option is selected when multiple options are selected for search.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "default-first-option", + "sample": "allow-create", + "type": "Boolean", + "desc": "Press Enter in the text box to select the first matching item. This function must be used together with filterable or remote.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "popper-append-to-body", + "sample": "popup-style-position", + "type": "Boolean", + "desc": "Indicates whether to insert a pop-up box to the body element. If a fault occurs in locating the fault in the dialog box that is displayed, you can set this attribute to false", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "automatic-dropdown", + "sample": "automatic-dropdown", + "type": "Boolean", + "desc": "Whether to automatically display the option menu after the focus is obtained in the text box for a non-searchable Select item.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "options", + "sample": "size-medium", + "type": "Array", + "desc": "Configure the Select data item. You do not need to configure tiny-option again.", + "defaultValue": "" + }, + { + "name": "show-alloption", + "sample": "show-alloption", + "type": "Boolean", + "desc": "The Select All option is displayed. The default value is true.", + "defaultValue": "" + }, + { + "name": "is-drop-inherit-width", + "sample": "is-drop-inherit-width", + "type": "Boolean", + "desc": "Whether to display the width of the drop-down list based on the width of the text box. The default value is false. If this parameter is set to false, the drop-down list is not followed. The width of the drop-down list is determined by the length of the option content. If this parameter is set to true, the text box width is displayed.", + "defaultValue": "" + }, + { + "name": "cache-op", + "sample": "cache-usage", + "type": "Object", + "desc": "Enable the local cache function of the select command. (Continue to store and sort according to the number of times the user clicks and the last time); cache-op.key (mandatory): unique key value in the local cache. cache-op.sortBy: sorting field. The default value is frequency. The options are frequency and time. The cache-op.sort. The default value is desc. The options are desc and asc. Unique key name in cache-op.dataKey. The default value is value. The default value is cache-op.highlightClass. The default value is memorize-highlight;cache-op.highlightNum. The default value is Infinity. cache-op.cacheNum: number of personalized storage records. The default value is Infinity.cache-op.serializeLocal storage serialization method.The default value is JSON.Stringify;cache-op.deserialize Local storage order decolumnization method.The default value is JSON.parse", + "defaultValue": "" + }, + { + "name": "render-type", + "sample": "nest-radio-grid", + "type": "String", + "desc": "Set the component type when Grid or Tree is embedded in the drop-down list box.", + "defaultValue": "" + }, + { + "name": "grid-op", + "sample": "nest-radio-grid", + "type": "Object", + "desc": "Configure Grid data when the Grid component is embedded in the drop-down list box.", + "defaultValue": "" + }, + { + "name": "tree-op", + "sample": "nest-radio-tree", + "type": "Object", + "desc": "This parameter is used to configure tree data when the Tree component is embedded in the drop-down list box.", + "defaultValue": "" + }, + { + "name": "allow-copy", + "sample": "search-allow-copy", + "type": "Boolean", + "desc": "Whether to allow copying the content in the text box in the single-choice search scenario", + "defaultValue": "The default value of this attribute is false, indicating that the attribute cannot be copied." + }, + { + "name": "copyable", + "sample": "search-allow-copy", + "type": "Boolean", + "desc": "The copy function is enabled. After the configuration, a copy button is displayed on the right of the text box. (The value can be used in the multi-choice mode.)", + "defaultValue": "" + }, + { + "name": "text-split", + "sample": "", + "type": "String", + "desc": "If copyable is configured, it can be used as the separator of the selected item.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "slot-default", + "type": "", + "desc": "Option component list", + "defaultValue": "" + }, + { + "name": "prefix", + "sample": "custom-prefix", + "type": "", + "desc": "Select component header content", + "defaultValue": "" + }, + { + "name": "empty", + "sample": "slot-empty", + "type": "", + "desc": "List when no option is available", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "focus", + "sample": "manual-focus-blur", + "type": "", + "desc": "Enable input to focus.", + "defaultValue": "" + }, + { + "name": "blur", + "sample": "manual-focus-blur", + "type": "", + "desc": "Disable the focus of the input and hide the drop-down list box.", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "envts-change", + "type": "Function(arg1, arg2)", + "desc": "Sets the event triggered after the value of the drop-down list box is updated. ; arg1:{Any|Array is selected and the rendering type is not specified. In this case, the value field of the selected item does not contain the arg2 parameter. If multiple options are selected and the rendering type is not specified, the value of the selected item is an array. In this case, the arg2 parameter is not provided. If you select a single item and the rendering type is tree or table, the object is selected. In this case, the arg2 parameter is not provided. When multiple selections are selected and the rendering type is tree or table, the array is composed of the selected object value fields. In this case, the arg2 parameter is available. }, arg2:{When multiple Arrays are selected and the rendering type is tree or table, the array consists of selected objects}", + "defaultValue": "" + }, + { + "name": "clear", + "sample": "envts-change", + "type": "Function", + "desc": "Sets the event triggered after content is cleared. ;In the radio option mode that can be cleared, the alarm is triggered when the user clicks the Clear button.", + "defaultValue": "" + }, + { + "name": "visible-change", + "sample": "envts-change", + "type": "Function(arg)", + "desc": "This event is triggered when the drop-down list box is displayed or hidden. arg:{The value is true when the Boolean drop-down list box appears. If the drop-down list box is hidden, the value is false}", + "defaultValue": "" + }, + { + "name": "remove-tag", + "sample": "envts-change", + "type": "Function(arg)", + "desc": "Triggered when a tag is removed in multi-choice mode. arg:{Value field of the data item corresponding to the removed tag of Any}", + "defaultValue": "" + }, + { + "name": "blur", + "sample": "envts-change", + "type": "Function(arg)", + "desc": "This event is triggered when the input loses focus. arg:{FocusEvent native blur event object}", + "defaultValue": "" + }, + { + "name": "focus", + "sample": "envts-change", + "type": "Function(arg)", + "desc": "This event is triggered when the input is focused. arg:{FocusEvent native focus event object}", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/slide-bar.json b/examples/docs/resources/pc/api/en-US/slide-bar.json new file mode 100644 index 000000000..555ffc986 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/slide-bar.json @@ -0,0 +1,64 @@ +{ + "attrs": [ + { + "name": "value", + "sample": "wheel-blocks", + "type": "Array", + "desc": "Data source obtained during service invoking.", + "defaultValue": "" + }, + { + "name": "init-blocks", + "sample": "wheel-blocks", + "type": "Number", + "desc": "Number of blocks to be displayed initially.", + "defaultValue": "" + }, + { + "name": "wheel-blocks", + "sample": "wheel-blocks", + "type": "Number", + "desc": "Number of scrolling blocks when the mouse wheel is scrolled up or down.", + "defaultValue": "The default value of this attribute is 1" + }, + { + "name": "tag", + "sample": "custom-tag", + "type": "String", + "desc": "Setting the Dom Label of a Component", + "defaultValue": "The default value of this attribute is ul." + }, + { + "name": "sub-tag", + "sample": "custom-tag", + "type": "String", + "desc": "Setting the Dom Label of a Component", + "defaultValue": "The default value of this attribute is li" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-content", + "type": "", + "desc": "Default scope slot", + "defaultValue": "" + } + ], + "events": [ + { + "name": "before-click", + "sample": "slide-bar-events", + "type": "Function(value)", + "desc": "Event triggered before a user swipes the screen. event: Native event", + "defaultValue": "" + }, + { + "name": "click", + "sample": "slide-bar-events", + "type": "Function(data, index)", + "desc": "Sliding block click event; data: data of the clicked slider, index: index value of the clicked slider", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/slider.json b/examples/docs/resources/pc/api/en-US/slider.json new file mode 100644 index 000000000..8e3ac9ad7 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/slider.json @@ -0,0 +1,113 @@ +{ + "attrs": [ + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "Disable", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "min", + "sample": "max-min", + "type": "Number", + "desc": "Set the minimum value.", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "max", + "sample": "max-min", + "type": "Number", + "desc": "Set the maximum value. The value must be an integer and can be a negative number. The value must be greater than the minimum value set.", + "defaultValue": "The default value of this attribute is 100." + }, + { + "name": "step", + "sample": "about-step", + "type": "Number", + "desc": "Displacement distance of each step when the slider moves. The value must be a positive integer greater than 0.", + "defaultValue": "The default value of this attribute is 1" + }, + { + "name": "show-input", + "sample": "show-iput", + "type": "Boolean", + "desc": "Indicates whether to display the text box. This parameter is valid only for non-range selection.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "format-tooltip", + "sample": "show-tip", + "type": "Function(value)", + "desc": "Format tooltip message", + "defaultValue": "" + }, + { + "name": "vertical", + "sample": "vertical-mode", + "type": "Boolean", + "desc": "Whether the vertical mode is used", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "height", + "sample": "vertical-mode", + "type": "String", + "desc": "Slider Height", + "defaultValue": "The default value of this attribute is 300px." + }, + { + "name": "value", + "sample": "range-select", + "type": "Number", + "desc": "Sets the current value of a single slider. The value must be an integer or an array. ;Bound Value", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "num-pages", + "sample": "shortcut-operation", + "type": "Number", + "desc": "Set the total number of steps. That is, when you press PageDown or PageUp, the moving distance is (maximum value – minimum value)/number of pages. The optional value of this attribute is 0", + "defaultValue": "The default value of this attribute is 1" + }, + { + "name": "show-tip", + "sample": "show-tip", + "type": "Boolean", + "desc": "Whether to display tooltip", + "defaultValue": "The default value of this attribute is true." + } + ], + "slots": [ + { + "name": "default", + "sample": "slider-slot", + "type": "", + "desc": "Default slot", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "slider-event-change", + "type": "Function(arg)", + "desc": "Triggered when the value changes (When you drag the mouse, it is triggered only after you release the mouse). When the arg:{Number|Array slider is not selected in a range, the value is the current value of the slider. When the slider is a range selection, it is the array of the current values of the slider}", + "defaultValue": "" + }, + { + "name": "Start", + "sample": "slider-event-start", + "type": "Function(arg)", + "desc": "This event is triggered when the slider starts to slide. When the arg:{Number|Array slider is not selected in a range, the value is the current value of the slider. When the slider is a range selection, it is the array of the current values of the slider}", + "defaultValue": "" + }, + { + "name": "Stop", + "sample": "slider-event-stop", + "type": "Function(arg)", + "desc": "This event is triggered when the slider sliding ends. When the arg:{Number|Array slider is not selected in a range, the value is the current value of the slider. When the slider is a range selection, it is the array of the current values of the slider}", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/split.json b/examples/docs/resources/pc/api/en-US/split.json new file mode 100644 index 000000000..3d7eddda8 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/split.json @@ -0,0 +1,92 @@ +{ + "attrs": [ + { + "name": "left-top-min", + "sample": "split-threshold", + "type": "Number , String", + "desc": "Minimum threshold on the left or upper panel.", + "defaultValue": "The default value of this attribute is 40px." + }, + { + "name": "mode", + "sample": "split-mode", + "type": "String", + "desc": "Separation type. The value can be horizontal or vertical. The default value is horizontal. ;The optional values of this attribute are horizontal / vertical", + "defaultValue": "The default value of this attribute is horizontal." + }, + { + "name": "right-bottom-min", + "sample": "split-threshold", + "type": "Number , String", + "desc": "Minimum threshold on the right or lower panel.", + "defaultValue": "The default value of this attribute is 40px." + }, + { + "name": "modelValue", + "sample": "basic-usage", + "type": "Number , String", + "desc": "Position of the split panel.", + "defaultValue": "The default value of this attribute is 0.5." + } + ], + "slots": [ + { + "name": "left", + "sample": "left-right-slot", + "type": "", + "desc": "Slot on the left panel", + "defaultValue": "" + }, + { + "name": "right", + "sample": "left-right-slot", + "type": "", + "desc": "Right panel slot", + "defaultValue": "" + }, + { + "name": "top", + "sample": "top-bottom-slot", + "type": "", + "desc": "Slot on the upper panel", + "defaultValue": "" + }, + { + "name": "bottom", + "sample": "top-bottom-slot", + "type": "", + "desc": "Slot on the lower panel", + "defaultValue": "" + }, + { + "name": "trigger", + "sample": "trigger-slot", + "type": "", + "desc": "Drag Slot", + "defaultValue": "" + } + ], + "events": [ + { + "name": "moveend", + "sample": "moveend-event", + "type": "Function()", + "desc": "Drag end event. ;Drag end event. ;No arguments", + "defaultValue": "" + }, + { + "name": "movestart", + "sample": "movestart-event", + "type": "Function()", + "desc": "Drag start event. ;Drag start event. ;No arguments", + "defaultValue": "" + }, + { + "name": "moving", + "sample": "moving-event", + "type": "Function(arg)", + "desc": "Draging events. ;Drag the event in. ; arg1:event (type Object)", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/steps.json b/examples/docs/resources/pc/api/en-US/steps.json new file mode 100644 index 000000000..a208bb1fa --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/steps.json @@ -0,0 +1,64 @@ +{ + "attrs": [ + { + "name": "active", + "sample": "advanced-steps", + "type": "Number", + "desc": "Set the selected step of the step bar. The default value is -1.", + "defaultValue": "The default value for this property is - 1" + }, + { + "name": "count-field", + "sample": "custom-steps-item", + "type": "String", + "desc": "Set the field name corresponding to the logo count in the advanced wizard. The default value is'count'", + "defaultValue": "The default value of this attribute is count." + }, + { + "name": "data", + "sample": "data-resource", + "type": "Object , Array", + "desc": "Set the step bar data.", + "defaultValue": "" + }, + { + "name": "name-field", + "sample": "custom-steps-item", + "type": "String", + "desc": "Set the field name corresponding to the name in the node information. The default value is'name'", + "defaultValue": "The default value of this attribute is name." + }, + { + "name": "space", + "sample": "order-progress", + "type": "Number", + "desc": "Set the width of the step bar.", + "defaultValue": "" + }, + { + "name": "status-field", + "sample": "custom-steps-item", + "type": "String", + "desc": "Name of the field corresponding to the data status. The default value is'status'", + "defaultValue": "The default value of this attribute is status." + } + ], + "slots": [ + { + "name": "item", + "sample": "slot", + "type": "", + "desc": "Step bar data item slot", + "defaultValue": "" + } + ], + "events": [ + { + "name": "click", + "sample": "click", + "type": "", + "desc": "Node click event. Parameter: (index: node index, node: node data information)", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/svg-icon.json b/examples/docs/resources/pc/api/en-US/svg-icon.json new file mode 100644 index 000000000..ad0647e36 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/svg-icon.json @@ -0,0 +1,32 @@ +{ + "attrs": [ + { + "name": "src", + "sample": "", + "type": "String", + "desc": "", + "defaultValue": "" + }, + { + "name": "width", + "sample": "", + "type": "String", + "desc": "Width", + "defaultValue": "" + }, + { + "name": "height", + "sample": "", + "type": "String", + "desc": "Height", + "defaultValue": "" + }, + { + "name": "fill", + "sample": "", + "type": "String", + "desc": "Spreading", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/switch.json b/examples/docs/resources/pc/api/en-US/switch.json new file mode 100644 index 000000000..be264f630 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/switch.json @@ -0,0 +1,71 @@ +{ + "attrs": [ + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "Disable", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "false-value", + "sample": "custom-true-false-value", + "type": "Boolean , String , Number", + "desc": "Value when switch is disabled", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "true-value", + "sample": "custom-true-false-value", + "type": "Boolean , String , Number", + "desc": "Value when switch is enabled", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "show-text", + "sample": "custom-open-close", + "type": "Boolean", + "desc": "Switch whether to display the text in the content.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "mini", + "sample": "mini-mode", + "type": "Boolean", + "desc": "Sets whether to display in mini mode. In mini mode, the content of the slot is not displayed.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "Boolean , String , Number", + "desc": "Bound Value", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "open", + "sample": "custom-open-close", + "type": "", + "desc": "Enable Content", + "defaultValue": "" + }, + { + "name": "close", + "sample": "custom-open-close", + "type": "", + "desc": "Close Content", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "enent", + "type": "", + "desc": "Callback function for switch changes", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/tabs.json b/examples/docs/resources/pc/api/en-US/tabs.json new file mode 100644 index 000000000..3b13a59f2 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/tabs.json @@ -0,0 +1,127 @@ +{ + "attrs": [ + { + "name": "tab-style", + "sample": "tab-style-card", + "type": "String", + "desc": "Label page style; The optional value of this attribute is card / border-card", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "Add a class name for the popper. For details, see the popover component.", + "defaultValue": "" + }, + { + "name": "with-add", + "sample": "with-add", + "type": "Boolean", + "desc": "Whether tags can be added", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "with-close", + "sample": "tabs-events-close", + "type": "Boolean", + "desc": "Whether the tag can be closed; Whether the tag can be closed", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "editable", + "sample": "tabs-events-add", + "type": "Boolean", + "desc": "Whether tags can be added and disabled at the same time", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "show-more-tabs", + "sample": "with-add", + "type": "Boolean", + "desc": "When the width of a tab page exceeds a specified value, more tabs are displayed. When you hover the cursor to more tabs, the tab page that exceeds the width is displayed.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "String", + "desc": "Bound value, which is the name of the selected tab.", + "defaultValue": "The default value of this attribute is the name of the first tab." + }, + { + "name": "position", + "sample": "position", + "type": "String", + "desc": "Location of the tab; The optional values for this property are top/right/bottom/left", + "defaultValue": "The default value of this attribute is top." + }, + { + "name": "stretch", + "sample": "stretch-wh", + "type": "Boolean", + "desc": "Whether the label width is self-expanded", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "before-leave", + "sample": "before-leave", + "type": "Function(activeName, oldActiveName)", + "desc": "The hook before the tag is switched. If false is returned or Promise is returned and rejected, the switch is blocked.", + "defaultValue": "" + }, + { + "name": "active-name", + "sample": "tab-style-card", + "type": "String", + "desc": "Activate the current page", + "defaultValue": "" + }, + { + "name": "size", + "sample": "tab-style-card", + "type": "String", + "desc": "Sets the tab page size. This attribute is valid only when tabStyle is set to card or border-card. The value of this attribute can be small.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "title", + "sample": "custom-tab-title", + "type": "", + "desc": "Customized titl content", + "defaultValue": "" + } + ], + "events": [ + { + "name": "add", + "sample": "tabs-events-add", + "type": "Function()", + "desc": "This event is triggered when a tab item is added. Click the Add button on the tabs. No arguments", + "defaultValue": "" + }, + { + "name": "click", + "sample": "tabs-events-click", + "type": "Function(arg1, arg2)", + "desc": "This event is triggered when a tabitem is clicked. Triggered when a tab is selected. arguments: arg1:VueComponent Click the compent object information of the tab, arg2:event", + "defaultValue": "" + }, + { + "name": "close", + "sample": "tabs-events-close", + "type": "Function(arg)", + "desc": "This event is triggered when a tab item is deleted. This event is triggered after the tab removal button is clicked. arguments: arg1: name of the deleted tab", + "defaultValue": "" + }, + { + "name": "edit", + "sample": "tabs-events-edit", + "type": "Function(arg1, arg2)", + "desc": "This event is triggered when you click the new button of a tab or the tab is closed. arguments: arg1:null or name of the deleted tab, arg2:'add' or'remove'", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/tag.json b/examples/docs/resources/pc/api/en-US/tag.json new file mode 100644 index 000000000..0c17680d7 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/tag.json @@ -0,0 +1,71 @@ +{ + "attrs": [ + { + "name": "hit", + "sample": "hit", + "type": "Boolean", + "desc": "Whether there is a border stroke", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "closeable", + "sample": "create", + "type": "Boolean", + "desc": "Can be disabled", + "defaultValue": "" + }, + { + "name": "color", + "sample": "color3", + "type": "String", + "desc": "Color. The value can be in rgb, rgba, or hex format. Background color", + "defaultValue": "" + }, + { + "name": "type", + "sample": "effect", + "type": "String", + "desc": "Display type; The value of this attribute can be success / info / warning / danger", + "defaultValue": "" + }, + { + "name": "size", + "sample": "tag-size", + "type": "String", + "desc": "Size; The optional values of this attribute are medium / small / mini", + "defaultValue": "" + }, + { + "name": "effect", + "sample": "effect", + "type": "String", + "desc": "Subject; The optional values of this attribute are dark / light / plain", + "defaultValue": "The default value of this attribute is light." + } + ], + "slots": [ + { + "name": "default", + "sample": "effect", + "type": "", + "desc": "Label Content", + "defaultValue": "" + } + ], + "events": [ + { + "name": "close", + "sample": "tag-event-close", + "type": "Function(event)", + "desc": "This event is triggered when a tag is disabled. event: Native event", + "defaultValue": "" + }, + { + "name": "click", + "sample": "tag-event-click", + "type": "Function(value, vm)", + "desc": "This event is triggered when a tag is clicked. event: Native event", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/text-popup.json b/examples/docs/resources/pc/api/en-US/text-popup.json new file mode 100644 index 000000000..20ffb7280 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/text-popup.json @@ -0,0 +1,39 @@ +{ + "attrs": [ + { + "name": "value", + "sample": "value", + "type": "String", + "desc": "Bound Value", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "placeholder", + "type": "String", + "desc": "Set the prompt placeholder text in the text box.", + "defaultValue": "" + }, + { + "name": "readonly", + "sample": "readonly", + "type": "Boolean", + "desc": "Set whether to read only", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "width", + "sample": "width", + "type": "Number , String", + "desc": "Set width", + "defaultValue": "The default value of this attribute is 150." + }, + { + "name": "separtor", + "sample": "separtor", + "type": "String", + "desc": "Separator", + "defaultValue": "The default value of this attribute is, ." + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/time-line.json b/examples/docs/resources/pc/api/en-US/time-line.json new file mode 100644 index 000000000..2b9ab654b --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/time-line.json @@ -0,0 +1,113 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "basic-usage", + "type": "Array", + "desc": "Set timeline step bar data", + "defaultValue": "" + }, + { + "name": "vertical", + "sample": "vertical-step", + "type": "Boolean", + "desc": "vertical step bar", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "horizontal", + "sample": "horizontal-step", + "type": "Boolean", + "desc": "Whether it is a horizontal step bar", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "show-number", + "sample": "show-number", + "type": "Boolean", + "desc": "Set whether to display sequence numbers for unfinished states.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "name-field", + "sample": "different-data", + "type": "String", + "desc": "Set the field name in the node information.", + "defaultValue": "The default value of this attribute is name." + }, + { + "name": "time-field", + "sample": "different-data", + "type": "String", + "desc": "Setting the name of the field corresponding to the node time information", + "defaultValue": "The default value of this attribute is time." + }, + { + "name": "start", + "sample": "set-start-value", + "type": "Number", + "desc": "Set the start step sequence number.", + "defaultValue": "The default value of this attribute is 1." + }, + { + "name": "space", + "sample": "set-step-width", + "type": "Number", + "desc": "Set the width of the step bar", + "defaultValue": "" + }, + { + "name": "active", + "sample": "basic-usage", + "type": "Number", + "desc": "Set the selected step of the step bar", + "defaultValue": "The default value for this property is - 1" + }, + { + "name": "reverse", + "sample": "vertical-step-reverse", + "type": "Boolean", + "desc": "Set the direction of the vertical step bar", + "defaultValue": "The default value of this attribute is false." + } + ], + "slots": [ + { + "name": "top", + "sample": "custom-normal-step", + "type": "", + "desc": "Define the top of the step bar", + "defaultValue": "" + }, + { + "name": "bottom", + "sample": "custom-normal-step", + "type": "", + "desc": "Define the bottom of the step bar", + "defaultValue": "" + }, + { + "name": "left", + "sample": "custom-vertical-step", + "type": "", + "desc": "Define the content on the left of the step bar.", + "defaultValue": "" + }, + { + "name": "right", + "sample": "custom-vertical-step", + "type": "", + "desc": "Define the content on the right of the step bar", + "defaultValue": "" + } + ], + "events": [ + { + "name": "click", + "sample": "vertical-step-reverse1", + "type": "Function(arg1, arg2)", + "desc": "Click event of a node. arguments: arg1: click the subscript of a node, arg2: {name: node name, time: time}", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/time-picker-options.json b/examples/docs/resources/pc/api/en-US/time-picker-options.json new file mode 100644 index 000000000..59efc65f0 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/time-picker-options.json @@ -0,0 +1,18 @@ +{ + "attrs": [ + { + "name": "selectableRange", + "sample": "basic-usage", + "type": "String/Array", + "desc": "Optional time segment, for example, '18:30:00-20:30:00' or input array ['09:30:00-12:00', '14:30:00-18:30:00']", + "defaultValue": "" + }, + { + "name": "format", + "sample": "format", + "type": "String", + "desc": "TimePicker; The options of this attribute are hour: HH, minute: mm, second: ss, and AM/PM A", + "defaultValue": "The default value of this attribute is'HH:mm:ss'" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/time-picker.json b/examples/docs/resources/pc/api/en-US/time-picker.json new file mode 100644 index 000000000..9688a1e3e --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/time-picker.json @@ -0,0 +1,162 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "date(DatePicker) / array(DateRangePicker)", + "desc": "Date value selected by the date selector. You can set the initial value of the selector.", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "Disabled", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "editable", + "sample": "editable", + "type": "Boolean", + "desc": "The text box can be entered.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "clearable", + "sample": "clearable", + "type": "Boolean", + "desc": "Display Clear Button", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "size", + "sample": "size-medium", + "type": "String", + "desc": "Text box size; The values of this attribute are medium, small, and mini", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "basic-usage", + "type": "String", + "desc": "Placeholder content for non-range selection", + "defaultValue": "The default value of this attribute is null." + }, + { + "name": "start-placeholder", + "sample": "size-medium", + "type": "String", + "desc": "Placeholder of the start date when the range is selected", + "defaultValue": "" + }, + { + "name": "end-placeholder", + "sample": "size-medium", + "type": "String", + "desc": "Placeholder of the end date when the range is selected", + "defaultValue": "" + }, + { + "name": "is-range", + "sample": "is-range", + "type": "Boolean", + "desc": "Indicates whether to select a time range. This parameter is valid only for .", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "arrow-control", + "sample": "clearable", + "type": "Boolean", + "desc": "Indicates whether to use arrows to select time. This parameter is valid only for .", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "popper-class", + "sample": "popper-class", + "type": "String", + "desc": "Class name of the TimePicker drop-down list box", + "defaultValue": "" + }, + { + "name": "picker-options", + "sample": "basic-usage1", + "type": "Object", + "desc": "The following table lists the options of the current time and date selector.", + "defaultValue": "The default value of this attribute is {}." + }, + { + "name": "range-separator", + "sample": "is-range", + "type": "String", + "desc": "Separator for selecting a range", + "defaultValue": "The default value of this attribute is -" + }, + { + "name": "default-value", + "sample": "default-value", + "type": "Date", + "desc": "Optional. When the selected date is empty, the time displayed by default when the selector panel is opened. Set it to a value that can be parsed by new Date().", + "defaultValue": "" + }, + { + "name": "name", + "sample": "name", + "type": "String", + "desc": "Native attribute", + "defaultValue": "" + }, + { + "name": "suffix-icon", + "sample": "suffix-icon", + "type": "String", + "desc": "Class name of the customized header icon", + "defaultValue": "The default value of this attribute is IconCalendar." + }, + { + "name": "clear-icon", + "sample": "clear-icon", + "type": "String", + "desc": "Custom Clear Icon", + "defaultValue": "The default value of this attribute is IconOperationfailed." + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether to insert a pop-up box to the body element. If a fault occurs in locating the fault in the dialog box that is displayed, you can set this attribute to false", + "defaultValue": "The default value of this attribute is true." + } + ], + "methods": [ + { + "name": "focus", + "sample": "event-blur", + "type": "", + "desc": "Enable input to focus.", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "event-blur", + "type": "Function(arg)", + "desc": "This event is triggered when the user confirms the selected value. arg:{Date|Array is the time object of the currently selected value when it is not selected in a range. When the range is selected, it is the time object array of the currently selected value}", + "defaultValue": "" + }, + { + "name": "blur", + "sample": "event-blur", + "type": "Function(arg)", + "desc": "This event is triggered when the input loses focus. arg:{Object Time Component Vue Object}", + "defaultValue": "" + }, + { + "name": "focus", + "sample": "event-blur", + "type": "Function(arg)", + "desc": "This event is triggered when the input is focused. arg:{Object Time Component Vue Object}", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/time-select-options.json b/examples/docs/resources/pc/api/en-US/time-select-options.json new file mode 100644 index 000000000..964cd8b69 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/time-select-options.json @@ -0,0 +1,39 @@ +{ + "attrs": [ + { + "name": "start", + "sample": "picker-options", + "type": "String", + "desc": "Start Time", + "defaultValue": "The default value of this attribute is 9:00." + }, + { + "name": "end", + "sample": "picker-options", + "type": "String", + "desc": "End time", + "defaultValue": "The default value of this attribute is 18:00." + }, + { + "name": "step", + "sample": "picker-options", + "type": "String", + "desc": "Interval", + "defaultValue": "The default value of this attribute is 00:30" + }, + { + "name": "minTime", + "sample": "picker-options", + "type": "String", + "desc": "Minimum time. Time segments earlier than the minimum time will be disabled.", + "defaultValue": "The default value of this attribute is 00:00." + }, + { + "name": "maxTime", + "sample": "picker-options", + "type": "String", + "desc": "Maximum time. Time segments later than the maximum time are disabled.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/time-select.json b/examples/docs/resources/pc/api/en-US/time-select.json new file mode 100644 index 000000000..f095bcd06 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/time-select.json @@ -0,0 +1,127 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "date(DatePicker) / array(DateRangePicker)", + "desc": "Date value selected by the date selector. You can set the initial value of the selector.", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "Disabled", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "editable", + "sample": "basic-usage", + "type": "Boolean", + "desc": "The text box can be entered.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "clearable", + "sample": "clear-icon", + "type": "Boolean", + "desc": "Display Clear Button", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "size", + "sample": "size-mini", + "type": "String", + "desc": "Text box size; The values of this attribute are medium, small, and mini", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "basic-usage", + "type": "String", + "desc": "Placeholder content for non-range selection", + "defaultValue": "The default value of this attribute is null." + }, + { + "name": "popper-class", + "sample": "popper-class", + "type": "String", + "desc": "Class name of the TimePicker drop-down list box", + "defaultValue": "" + }, + { + "name": "picker-options", + "sample": "picker-options", + "type": "Object", + "desc": "The following table lists the options of the current time and date selector.", + "defaultValue": "The default value of this attribute is {}." + }, + { + "name": "default-value", + "sample": "default-value", + "type": "Date", + "desc": "Optional. When the selected date is empty, the time displayed by default when the selector panel is opened. Set it to a value that can be parsed by new Date().", + "defaultValue": "" + }, + { + "name": "name", + "sample": "name", + "type": "String", + "desc": "Native attribute", + "defaultValue": "" + }, + { + "name": "suffix-icon", + "sample": "suffix-icon", + "type": "String", + "desc": "Custom header icon", + "defaultValue": "The default value of this attribute is IconCalendar." + }, + { + "name": "clear-icon", + "sample": "clear-icon", + "type": "String", + "desc": "Customized clear icon", + "defaultValue": "The default value of this attribute is IconOperationfailed." + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether to insert a pop-up box to the body element. If a fault occurs in locating the fault in the dialog box that is displayed, you can set this attribute to false", + "defaultValue": "The default value of this attribute is true." + } + ], + "methods": [ + { + "name": "focus", + "sample": "focus", + "type": "", + "desc": "Enable input to focus.", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "event-blur", + "type": "", + "desc": "This event is triggered when the user confirms the selected value.", + "defaultValue": "" + }, + { + "name": "blur", + "sample": "event-blur", + "type": "", + "desc": "This event is triggered when the input loses focus.", + "defaultValue": "" + }, + { + "name": "focus", + "sample": "event-blur", + "type": "", + "desc": "This event is triggered when the input is focused.", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/en-US/toggle-menu.json b/examples/docs/resources/pc/api/en-US/toggle-menu.json new file mode 100644 index 000000000..36a06e2d0 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/toggle-menu.json @@ -0,0 +1,162 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "basic-usage", + "type": "Array", + "desc": "Set the data of the collapsed menu.", + "defaultValue": "" + }, + { + "name": "dragable", + "sample": "dragable", + "type": "Boolean", + "desc": "Whether to enable the node drag function. The default value is `false`", + "defaultValue": "" + }, + { + "name": "show-filter", + "sample": "show-filter", + "type": "Boolean", + "desc": "Specifies whether to display the search box. The default value is `true`.", + "defaultValue": "" + }, + { + "name": "icon", + "sample": "custom-icon", + "type": "Object", + "desc": "Customize the icon on the left of the menu.", + "defaultValue": "" + }, + { + "name": "default-expand-all", + "sample": "default-expand-all", + "type": "Boolean", + "desc": "Whether to expand all nodes in the menu by default. The default value is false.", + "defaultValue": "" + }, + { + "name": "expand-on-click-node", + "sample": "default-expand-all", + "type": "Boolean", + "desc": "Whether to expand or collapse menus by clicking a node. The default value is false.", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "show-filter", + "type": "String", + "desc": "Placeholder in the text box.", + "defaultValue": "" + }, + { + "name": "ellipsis", + "sample": "dragable", + "type": "Boolean", + "desc": "Omitted if the menu content is too long. The default value is false.", + "defaultValue": "" + }, + { + "name": "wrap", + "sample": "show-filter", + "type": "Boolean", + "desc": "The menu content is displayed in a new line when it is too long. The default value is false.", + "defaultValue": "" + }, + { + "name": "automatic-filtering", + "sample": "automatic-filtering", + "type": "Boolean", + "desc": "Whether to automatically filter content when you enter content in the text box. The default value is true.", + "defaultValue": "" + }, + { + "name": "props", + "sample": "toggle-props", + "type": "Object", + "desc": "Configuration data option mapping field name", + "defaultValue": "The default value of this attribute is {children: 'children', label: 'label', disabled: 'disabled'}" + }, + { + "name": "get-menu-data-sync", + "sample": "get-menu-data-sync", + "type": "Function", + "desc": "User-defined menu data service. Data is directly returned.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "node", + "sample": "toggle-props", + "type": "", + "desc": "Custom Slot", + "defaultValue": "" + } + ], + "events": [ + { + "name": "node-click", + "sample": "node-click", + "type": "Function(arg1, arg2)", + "desc": "Indicates that a node is clicked. ;Callback function triggered after a node is clicked. //Parameter arg1:\n{children: child node of the clicked node, id: ID of the clicked node, label: title of the clicked node} \n//Parameter arg2:\n Object Data information object of the currently clicked node", + "defaultValue": "" + }, + { + "name": "node-expand", + "sample": "node-expand", + "type": "Function(arg1, arg2, arg3)", + "desc": "Event after a node is expanded. ; Event triggered when a node is expanded; / / Parameter arg1:\n{children: child node of the clicked node, id: ID of the clicked node, label: title of the clicked node}\n//Parameter arg2:\nVueComponent Componet object information of the clicked node\n//Parameter arg3:\n{children: subnode ID of the clicked node: ID of the clicked node, label: Click title} of the node", + "defaultValue": "" + }, + { + "name": "node-collapse", + "sample": "node-collapse", + "type": "Function(arg1, arg2)", + "desc": "Event after the node is scaled in. ; Event triggered when a node is shut down; //Parameter arg1:Object \n{children: child node of the clicked node, id: ID of the clicked node, label: title of the clicked node}\n//Parameter arg2:Object Data information object of the currently clicked node", + "defaultValue": "" + }, + { + "name": "node-drag-start", + "sample": "drag-events", + "type": "Function(arg1, arg2)", + "desc": "Event triggered when a node starts to be dragged. ;Event triggered when a node starts to be dragged. ; / / Parameters:\narg1:Object Data information object of the current node \narg2:event", + "defaultValue": "" + }, + { + "name": "node-drag-enter", + "sample": "drag-events", + "type": "Function(arg1, arg2)", + "desc": "This event is triggered when a user drags a node to another node. Event triggered when a user drags a node to another node. / / Parameter \narg1: Object Data information object of the current node \narg2: Object Data information object of the current node after the node is dragged.", + "defaultValue": "" + }, + { + "name": "node-drag-leave", + "sample": "drag-events", + "type": "Function(arg1, arg2)", + "desc": "This event is triggered when a user drags a node. Event triggered when a user drags a node. / / Parameter \narg1:Object Data information object of the currently dragged node \narg2: Object Data information object of the currently dragged node", + "defaultValue": "" + }, + { + "name": "node-drag-over", + "sample": "drag-events", + "type": "Function(arg1, arg2, arg3)", + "desc": "Event triggered when a node is dragged (similar to the mouseover event of the browser); Event triggered when a node is dragged (similar to the mouseover event of the browser) / / Parameter \narg1:Object Data information object of the current dragged node \narg2:Object Data information object of the current dragged node \n arg3:event", + "defaultValue": "" + }, + { + "name": "node-drag-end", + "sample": "drag-events", + "type": "Function(arg1, arg2, arg3, arg4)", + "desc": "Event triggered when dragging ends (r may not succeed). Event triggered when the drag is successfully completed; / / Parameter \narg1: Object Data information object of the current node\narg2: Object Data information object of the current node after the node is dragged\narg3: Drag type, for example,'inner'\narg4:event", + "defaultValue": "" + }, + { + "name": "node-drop", + "sample": "node-drop", + "type": "Function(arg1, arg2)", + "desc": "Indicates the event after a node is dragged and dropped. This parameter is valid when the dragable attribute is set to true. ; Events after a node is dragged and dropped. This parameter is valid when the dragable attribute is set to true. ; / / Parameter \narg1:Object Data information object of the current dragged node \n arg2:Object Data information object of the current clicked node after the dragged node \narg3:Drag type \narg4:event", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/tooltip.json b/examples/docs/resources/pc/api/en-US/tooltip.json new file mode 100644 index 000000000..3cd6e665a --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/tooltip.json @@ -0,0 +1,139 @@ +{ + "attrs": [ + { + "name": "effect", + "sample": "tooltip-theme", + "type": "String", + "desc": "Default theme; The value of this attribute can be dark or light", + "defaultValue": "The default value of this attribute is dark." + }, + { + "name": "content", + "sample": "basic-usage", + "type": "String", + "desc": "Displayed content. You can also use slot#content to transfer the content to the DOM.", + "defaultValue": "" + }, + { + "name": "append-to-body", + "sample": "", + "type": "Boolean", + "desc": "Whether to add to body", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "placement", + "sample": "basic-usage", + "type": "String", + "desc": "Location where the tooltip appears; The optional value of this attribute is top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end", + "defaultValue": "The default value of this attribute is bottom." + }, + { + "name": "modelValue / v-model", + "sample": "manual-control-tip", + "type": "Boolean", + "desc": "Whether the status is visible", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "Whether Tooltip is available", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "offset", + "sample": "tooltip-offset", + "type": "Number", + "desc": "Offset of the occurrence position", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "transition", + "sample": "custom-transition", + "type": "String", + "desc": "Define gradient animation", + "defaultValue": "The default value of this attribute is tiny-fade-in-linear." + }, + { + "name": "visible-arrow", + "sample": "visible-arrow", + "type": "Boolean", + "desc": "Indicates whether to display the tooltip arrow. This parameter is a parameter in popper.js.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "popper-options", + "sample": "popper-options", + "type": "Object", + "desc": "Parameters of popper.js; The optional value of this property is a reference to the popper.js document", + "defaultValue": "The default value of this attribute is {boundariesCBG XUI: 'body', gpuAcceleration: false}" + }, + { + "name": "open-delay", + "sample": "open-delay", + "type": "Number", + "desc": "Delay, in milliseconds.", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "manual", + "sample": "manual-control-tip", + "type": "Boolean", + "desc": "Manual control mode. If this parameter is set to true, the mouseenter and mouseleave events do not take effect.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "visible", + "sample": "visible-show", + "type": "String", + "desc": "Indicated intelligent display mode; The value of this attribute can be auto or always", + "defaultValue": "The default value of this attribute is always." + }, + { + "name": "popper-class", + "sample": "popper-class", + "type": "String", + "desc": "Add a class name for the tooltip popper.", + "defaultValue": "" + }, + { + "name": "enterable", + "sample": "enterable", + "type": "Boolean", + "desc": "Whether the mouse can go to the tooltip", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "hide-after", + "sample": "open-delay", + "type": "Number", + "desc": "Delay for automatically hiding the tooltip, in milliseconds. If the value is 0, the tooltip is not automatically hidden.", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "tabindex", + "sample": "tabindex", + "type": "Number", + "desc": "Configure this element. The configured attributes will be automatically added to the trigger source of this component.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "tooltip-content", + "type": "", + "desc": "Default slot", + "defaultValue": "" + }, + { + "name": "content", + "sample": "tooltip-content", + "type": "", + "desc": "Content", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/top-box.json b/examples/docs/resources/pc/api/en-US/top-box.json new file mode 100644 index 000000000..9e26dfeeb --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/top-box.json @@ -0,0 +1 @@ +{} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/transfer.json b/examples/docs/resources/pc/api/en-US/transfer.json new file mode 100644 index 000000000..7263178a6 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/transfer.json @@ -0,0 +1,241 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "data-source", + "type": "Array", + "desc": "Transfer data source", + "defaultValue": "" + }, + { + "name": "modelValue / v-model", + "sample": "data-source", + "type": "Array", + "desc": "Bound Value", + "defaultValue": "" + }, + { + "name": "filterable", + "sample": "filterable", + "type": "Boolean", + "desc": "Searchable", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "filter-placeholder", + "sample": "filter-placeholder", + "type": "String", + "desc": "Search box placeholder", + "defaultValue": "The default value of this attribute is Please enter the search content." + }, + { + "name": "filter-method", + "sample": "custom-filter-method", + "type": "Function(arg1, arg2)", + "desc": "Set the search filtering field of the shuttle box. This attribute is valid only when RenderType is set to table. //Customize the search method parameter \narg1:String Input filter string \narg2:Object Each data item", + "defaultValue": "" + }, + { + "name": "titles", + "sample": "custom-transfer-titles", + "type": "Array", + "desc": "User-defined list title", + "defaultValue": "The default value of this attribute is ['List1','List2']" + }, + { + "name": "button-texts", + "sample": "custom-button-texts", + "type": "Array", + "desc": "Custom Button Copywriting", + "defaultValue": "The default value of this attribute is []" + }, + { + "name": "render-content", + "sample": "custom-render-content", + "type": "Function(arg1, arg2)", + "desc": "Customized data item rendering function; arg1:{Function for creating a virtual node}, arg2:{Object data item}", + "defaultValue": "" + }, + { + "name": "format", + "sample": "checked-format-text", + "type": "Object", + "desc": "Selected status copywriting at the top of the list", + "defaultValue": "The default value for this attribute is {noChecked: '${checked}/${total}', hasChecked: '${checked}/${total}'}" + }, + { + "name": "props", + "sample": "props-of-data-source", + "type": "Object", + "desc": "Field alias of the data source", + "defaultValue": "" + }, + { + "name": "left-default-checked", + "sample": "default-checked", + "type": "Array", + "desc": "Key array of selected items in the list on the left in the initial state", + "defaultValue": "The default value of this attribute is []" + }, + { + "name": "right-default-checked", + "sample": "default-checked", + "type": "Array", + "desc": "Key array of selected items in the list on the right in the initial state", + "defaultValue": "The default value of this attribute is []" + }, + { + "name": "target-order", + "sample": "target-order", + "type": "String", + "desc": "Sorting policy of elements in the right list: If the value is original, the sequence of elements in the right list is the same as that in the data source. If the value is push, the newly added element is ranked last. If the value is unshift, the newly added element is ranked first. The value of this attribute can be original / push / unshift", + "defaultValue": "The default value of this attribute is original." + }, + { + "name": "to-left-disable", + "sample": "data-source", + "type": "Boolean", + "desc": "Provides users to control the disabled status of the shuttle button. If the button is not selected during component initialization, the disabled status is displayed. The default value is true.", + "defaultValue": "" + }, + { + "name": "to-right-disable", + "sample": "data-source", + "type": "Boolean", + "desc": "Provides users to control the disabled status of the shuttle button. If the button is not selected during component initialization, the disabled status is displayed. The default value is true.", + "defaultValue": "" + }, + { + "name": "show-all-btn", + "sample": "show-all-btn", + "type": "Boolean", + "desc": "All Move Buttons", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "drop-config", + "sample": "drop-config", + "type": "Object", + "desc": "Set the list items in the shuttle box to be dragged.", + "defaultValue": "" + }, + { + "name": "columns", + "sample": "nested-table", + "type": "Array", + "desc": "Sets the table column configuration of the shuttle box. This attribute is valid only when RenderType is set to table. Sets the table column configuration of the shuttle box. This attribute is valid only when the rendering type (renderType) is grid.", + "defaultValue": "" + }, + { + "name": "page-vo", + "sample": "nested-table", + "type": "Object", + "desc": "Sets the pagination configuration. This attribute is valid only when the rendering type is grid and must be used together with pager-op.", + "defaultValue": "The default value of this property is {currentPage:1,pageSize:10}" + }, + { + "name": "show-pager", + "sample": "nested-table", + "type": "Boolean", + "desc": "Specifies whether to display pagination. This parameter is valid only when tables are rendered.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "pager-op", + "sample": "nested-table", + "type": "Object", + "desc": "Sets the pagination configuration. This parameter is valid when the table is rendered.", + "defaultValue": "The default value of this attribute is {mode:'fixed', pageVO: {currentPage: 1,pageSize: 10}" + }, + { + "name": "render", + "sample": "nested-table", + "type": "Object", + "desc": "When plugin is set to Table, set the rendering to table. When the plugin is set to Tree", + "defaultValue": "" + }, + { + "name": "tree-op", + "sample": "nested-tree", + "type": "Object", + "desc": "Set the tree-related configuration attributes when the plug-in is set to tree.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "left-footer", + "sample": "custom-footer", + "type": "", + "desc": "Content at the bottom of the left list", + "defaultValue": "" + }, + { + "name": "right-footer", + "sample": "custom-footer", + "type": "", + "desc": "Content at the bottom of the list on the right", + "defaultValue": "" + }, + { + "name": "button", + "sample": "panel-slot", + "type": "", + "desc": "Customized shuttle button", + "defaultValue": "" + }, + { + "name": "default", + "sample": "custom-render-content", + "type": "", + "desc": "Content of a user-defined data item. The parameter is {option}.", + "defaultValue": "" + }, + { + "name": "leftPanel", + "sample": "", + "type": "", + "desc": "Customized content on the left", + "defaultValue": "" + }, + { + "name": "rightPanel", + "sample": "", + "type": "", + "desc": "Customized content on the right", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "clearQuery", + "sample": "manual-clear-query", + "type": "", + "desc": "Clear the search keywords of a panel.", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "transfer-events", + "type": "Function(arg1, arg2, arg3)", + "desc": "Triggered when an element in the list on the right changes. //Parameter arg1: Data value list on the right of the Array shuttle box.\n//Parameter arg2: String Data movement direction, which can be left or right\n//Parameter arg3: Array data value list to be moved", + "defaultValue": "" + }, + { + "name": "left-check-change", + "sample": "transfer-events", + "type": "Function(arg1, arg2)", + "desc": "This event is triggered when an element in the list on the left is selected or deselected. //Parameter arg1: List of selected data values on the left of the Array shuttle box.\n//Parameter arg2: List of selected data values whose status changes on the left of the Array shuttle box", + "defaultValue": "" + }, + { + "name": "right-check-change", + "sample": "transfer-events", + "type": "Function(arg1, arg2)", + "desc": "This event is triggered when an element in the list on the right is selected or deselected. //Parameter arg1: list of selected data values on the right of the Array shuttle box.\n//Parameter arg2: list of selected data values whose status changes on the right of the Array shuttle box", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/tree-menu.json b/examples/docs/resources/pc/api/en-US/tree-menu.json new file mode 100644 index 000000000..72e25ca3c --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/tree-menu.json @@ -0,0 +1,232 @@ +{ + "attrs": [ + { + "name": "accordion", + "sample": "accordion", + "type": "Boolean", + "desc": "Indicates whether to display the accordion effect. The default value is false.", + "defaultValue": "" + }, + { + "name": "allow-drag", + "sample": "", + "type": "Function(params)", + "desc": "Drag menu callback event. This event is used by draggable. The options are as follows: return false (forbidding dragging) and true (allowing dragging);params1: data object of the node to be dragged.", + "defaultValue": "" + }, + { + "name": "allow-drop", + "sample": "", + "type": "Function(params1, params2, params3)", + "desc": "Drag menu callback event. This event is used by draggable. return false (forbidding dragging), true (allowing dragging);//params1:Object: data information object of the dragged node.\n//params2: Object: data information object of the dragged node\n//params3:'prev','inner', or'next'", + "defaultValue": "" + }, + { + "name": "show-title", + "sample": "text-wrap", + "type": "Boolean", + "desc": "Indicates whether to display the title prompt of a node. The prompt is triggered when the cursor is hovered over the node.", + "defaultValue": "" + }, + { + "name": "show-filter", + "sample": "text-wrap", + "type": "Boolean", + "desc": "Indicates whether to enable the input filtering node in the text box. The default value is true.", + "defaultValue": "" + }, + { + "name": "data", + "sample": "data-resource", + "type": "Array", + "desc": "Display Data", + "defaultValue": "" + }, + { + "name": "empty-text", + "sample": "empty-text", + "type": "String", + "desc": "Text displayed when the content is empty", + "defaultValue": "" + }, + { + "name": "filter-node-method", + "sample": "filter-node-method", + "type": "Function(value, data, node)", + "desc": "Method executed to filter tree nodes. If true is returned, the node can be displayed. If false is returned, the node is hidden.", + "defaultValue": "" + }, + { + "name": "expand-on-click-node", + "sample": "expand-on-click-node", + "type": "", + "desc": "Configure whether to expand a menu by clicking the menu text.", + "defaultValue": "" + }, + { + "name": "ellipsis", + "sample": "text-ellipsis", + "type": "Boolean", + "desc": "Whether to omit display. The priority of wrap is higher than that of wrap. If this parameter is set to true, the required width of the node text exceeds the width of the container. The node text does not wrap, and no horizontal scroll bar is displayed. The extra text is displayed as...", + "defaultValue": "" + }, + { + "name": "indent", + "sample": "tree-menu-indent", + "type": "Number", + "desc": "horizontal indent between adjacent nodes, in pixels.", + "defaultValue": "" + }, + { + "name": "default-expand-all", + "sample": "default-expand-all", + "type": "", + "desc": "Initialize and expand all subnodes.", + "defaultValue": "" + }, + { + "name": "draggable", + "sample": "can-draggable", + "type": "", + "desc": "Drag Menu", + "defaultValue": "" + }, + { + "name": "wrap", + "sample": "text-wrap", + "type": "Boolean", + "desc": "Indicates whether to display information in a new line.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "default-expanded-keys", + "sample": "default-expanded-keys", + "type": "Array", + "desc": "Key array of nodes that are expanded by default", + "defaultValue": "" + }, + { + "name": "node-key", + "sample": "default-expand-all", + "type": "String", + "desc": "Each tree node is used as a unique identifier attribute. The entire tree must be unique.", + "defaultValue": "" + }, + { + "name": "prefix-icon", + "sample": "text-ellipsis", + "type": "Object", + "desc": "Customize the front icon.", + "defaultValue": "" + }, + { + "name": "search-icon", + "sample": "search-icon", + "type": "Object", + "desc": "Customize the search icon.", + "defaultValue": "" + }, + { + "name": "check-strictly", + "sample": "check-strictly", + "type": "Boolean", + "desc": "Whether to strictly follow the method of disassociating parent and child when the check box is displayed. The default value is false and must be used together with show-checkbox.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "lazy", + "sample": "lazy-load", + "type": "Boolean", + "desc": "Whether to lazy load subnodes. This method must be used together with the load method.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "load", + "sample": "lazy-load", + "type": "Function(node, resolve)", + "desc": "Method for loading subtree data. This parameter is valid only when lazy is set to true.", + "defaultValue": "" + }, + { + "name": "show-checkbox", + "sample": "check-strictly", + "type": "Boolean", + "desc": "Whether the node can be selected", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "default-checked-keys", + "sample": "default-expand-all", + "type": "Array", + "desc": "Key array of the nodes selected by default", + "defaultValue": "" + }, + { + "name": "get-menu-data-sync", + "sample": "get-menu-data-sync", + "type": "Function", + "desc": "User-defined menu data service, which returns a Promise object.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "tree-menu-slot", + "type": "", + "desc": "Content of a customized tree node. The parameter is {node, data}", + "defaultValue": "" + } + ], + "events": [ + { + "name": "node-click", + "sample": "event-current-change", + "type": "Function(arg1, arg2)", + "desc": "Callback when a node is clicked; //Parameter: arg1:Object \n{children: subnode of the clicked node, id: ID of the clicked node, label: title}\n// arg2:Object // of the clicked node, data information object of the currently clicked node", + "defaultValue": "" + }, + { + "name": "current-change", + "sample": "event-current-change", + "type": "Function(arg1, arg2)", + "desc": "Event triggered when the selected node changes; //Parameter: arg1:Object \n{children: subnode of the clicked node, id: ID of the clicked node, label: title}\n// arg2:Object // of the clicked node, data information object of the currently clicked node", + "defaultValue": "" + }, + { + "name": "node-expand", + "sample": "event-node-expand", + "type": "Function(arg1, arg2)", + "desc": "Event triggered when a node is expanded; //Parameter: arg1:Object \n{children: subnode of the clicked node, id: ID of the clicked node, label: title}\n// arg2:Object // of the clicked node, data information object of the currently clicked node", + "defaultValue": "" + }, + { + "name": "node-collapse", + "sample": "event-node-collapse", + "type": "Function(arg1, arg2)", + "desc": "Event triggered when a node is shut down; //Parameter: arg1:Object \n{children: subnode of the clicked node, id: ID of the clicked node, label: title}\n// arg2:Object // of the clicked node, data information object of the currently clicked node", + "defaultValue": "" + }, + { + "name": "check-change", + "sample": "event-check-change", + "type": "Function(arg1, arg2, arg3)", + "desc": "Callback when the node selection status changes; //Parameters: arg1:Object \n{children: subnode of the clicked node, id: ID of the clicked node, label: title}\n// arg2:Boolean // of the clicked node, status of the current clicked node, and status of the current clicked node \n // arg3:Boolean //", + "defaultValue": "" + }, + { + "name": "node-drag-start", + "sample": "event-allow-draggable", + "type": "Function(node, event)", + "desc": "Event triggered when a node starts to be dragged; Event triggered when a node starts to be dragged; node: drags a node, event: native event", + "defaultValue": "" + }, + { + "name": "node-drag-end", + "sample": "event-allow-draggable", + "type": "Function(draggingNode, targetNode, dropType, event)", + "desc": "Event triggered when the dragging ends (possibly unsuccessful) //Parameter \n{draggingNode: drag node, targetNode: target node, dropType: drag type, //Drag node mapping on the target node (before/after/inner/none) \nevent: native event}", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/tree-node.json b/examples/docs/resources/pc/api/en-US/tree-node.json new file mode 100644 index 000000000..9e26dfeeb --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/tree-node.json @@ -0,0 +1 @@ +{} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/tree.json b/examples/docs/resources/pc/api/en-US/tree.json new file mode 100644 index 000000000..71b382918 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/tree.json @@ -0,0 +1,444 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "data-source", + "type": "Array", + "desc": "Set the data source. Static and dynamic data sources can be configured.; Display Data", + "defaultValue": "" + }, + { + "name": "expand-icon", + "sample": "set-tree-icon", + "type": "Object", + "desc": "Indicates the expanded icon", + "defaultValue": "" + }, + { + "name": "icon-trigger-click-node", + "sample": "check-on-click-node", + "type": "Boolean", + "desc": "Whether to trigger the node-click event when an icon is clicked to expand a node.", + "defaultValue": "The default value of this attribute is true" + }, + { + "name": "show-contextmenu", + "sample": "contextmenu", + "type": "Boolean", + "desc": "Whether to display the custom menu when right-clicking a node. The default value is false.", + "defaultValue": "" + }, + { + "name": "shrink-icon", + "sample": "set-tree-icon", + "type": "Object", + "desc": "Icon indicating contraction", + "defaultValue": "" + }, + { + "name": "empty-text", + "sample": "custom-empty-text", + "type": "String", + "desc": "Text displayed when the content is empty.", + "defaultValue": "" + }, + { + "name": "render-after-expand", + "sample": "render-after-expand", + "type": "Boolean", + "desc": "Whether to render a tree node after it is expanded for the first time.", + "defaultValue": "The default value of this property is true" + }, + { + "name": "node-key", + "sample": "node-key", + "type": "String", + "desc": "The node uniquely identifies the attribute name.; Each tree node is used as a unique identifier attribute, and the entire tree should be unique", + "defaultValue": "" + }, + { + "name": "check-strictly", + "sample": "check-strictly", + "type": "Boolean", + "desc": "Whether to strictly follow the method of not associating parent and child when the check box is displayed. The default value is false.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "default-expand-all", + "sample": "default-expand-all", + "type": "Boolean", + "desc": "Whether to expand all nodes by default", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "expand-on-click-node", + "sample": "expand-on-click-node", + "type": "Boolean", + "desc": "Click the node to expand the function of the node. When set to true, the node can be expanded or closed when the node content is clicked. If this parameter is set to false, the node can be expanded or expanded only after the expansion/fold icon is clicked in front of the node name.; Indicates whether to expand or shrink a node when a node is clicked. The default value is true. If the value is false, the node is expanded or collapsed only when an arrow icon is displayed.", + "defaultValue": "The default value of this property is true" + }, + { + "name": "check-on-click-node", + "sample": "check-on-click-node", + "type": "Boolean", + "desc": "Whether to select a node when you click it. The default value is false, indicating that the node is selected only when you click the check box.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "auto-expand-parent", + "sample": "auto-expand-parent", + "type": "Boolean", + "desc": "Whether to automatically expand the parent node when expanding the child node.", + "defaultValue": "The default value of this attribute is true" + }, + { + "name": "default-checked-keys", + "sample": "default-checked-keys", + "type": "Array", + "desc": "Selected by default. The value is the value corresponding to the key in the data source dataset. After the component is generated, the corresponding node in defaultValue is selected by default. ;Key array of selected nodes by default", + "defaultValue": "" + }, + { + "name": "default-expanded-keys", + "sample": "default-expanded-keys", + "type": "Array", + "desc": "Key array of the expanded node by default", + "defaultValue": "" + }, + { + "name": "render-content", + "sample": "render-content", + "type": "Function(h, {node, data, store}", + "desc": "Render Function of the content area of the tree node", + "defaultValue": "" + }, + { + "name": "show-checkbox", + "sample": "show-checkbox", + "type": "Boolean", + "desc": "Whether a node can be selected.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "draggable", + "sample": "node-draggable", + "type": "Boolean", + "desc": "Whether to enable the node dragging function. The node position can be dragged at will to change the parent-child structure of the original node. ;Whether to enable the function of dragging nodes", + "defaultValue": "The default value of this property is false" + }, + { + "name": "allow-drag", + "sample": "allow-drag", + "type": "Function(node)", + "desc": "Dedicated whether a node can be dragged.", + "defaultValue": "" + }, + { + "name": "allow-drop", + "sample": "allow-drop", + "type": "Function(draggingNode, dropNode, type)", + "desc": "Dedicated whether the target node can be placed during dragging. The type parameter has three situations: 'prev',' inner', and'next', which indicate that it is placed before the target node, inserted into the target node, and placed after the target node respectively", + "defaultValue": "" + }, + { + "name": "props", + "sample": "node-props-config", + "type": "Object", + "desc": "Configuration options. For details, see the following table.", + "defaultValue": "The default value of this attribute is {children: 'children', label: 'label', disabled: 'disabled'}" + }, + { + "name": "highlight-current", + "sample": "highlight-current", + "type": "Boolean", + "desc": "Whether to highlight the selected node", + "defaultValue": "The default value of this property is false" + }, + { + "name": "lazy", + "sample": "lazy-load-node", + "type": "Boolean", + "desc": "Asynchronous loading mode. Data is requested when a node is expanded. Service support is required.; Whether to load subnodes in lazy mode. This parameter must be used together with the load method.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "load", + "sample": "lazy-load-node", + "type": "Function(node, resolve)", + "desc": "Method for loading subtree data. This parameter is valid only when the lazy attribute is set to true.", + "defaultValue": "" + }, + { + "name": "filter-node-method", + "sample": "filter-node", + "type": "Function(value, data, node)", + "desc": "Field value of the node to be matched during input filtering. This parameter is invalid when showFilter is set to false.; method to filter tree nodes. If true is returned, the node can be displayed. If false is returned, the node can be hidden", + "defaultValue": "" + }, + { + "name": "accordion", + "sample": "accordion-mode", + "type": "Boolean", + "desc": "Whether the path is a single path. If this parameter is set to true, nodes at all levels are mutually exclusive. If this parameter is set to a number, nodes not greater than this parameter are mutually exclusive. ;Do you want to open only one node of the same level tree at a time to expand", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "indent", + "sample": "indent", + "type": "Number", + "desc": "horizontal indentation between adjacent nodes, in pixels.", + "defaultValue": "The default value of this property is 18" + }, + { + "name": "icon", + "sample": "custom-node-icon", + "type": "Object", + "desc": "User-defined icon. css: String (general style name of an icon), child: String (leaf node icon), parent: String (Parent node icon, open, close, and close), expand: String (the expansion node icon); collapse: String (the collapse node icon); Custom tree node icon", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "slot-deffault", + "type": "", + "desc": "Content of a user-defined tree node. The parameter is {node, data}.", + "defaultValue": "" + }, + { + "name": "empty", + "sample": "custom-empty-text", + "type": "", + "desc": "Customize empty data text", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "filter", + "sample": "filter-node", + "type": "(value) => void", + "desc": "Filter tree nodes.", + "defaultValue": "" + }, + { + "name": "updateKeyChildren", + "sample": "show-checkbox", + "type": "(key, data) => void", + "desc": "Use keys to set node subelements. The node-key attribute must be set in this method.", + "defaultValue": "" + }, + { + "name": "getCheckedNodes", + "sample": "check-on-click-node", + "type": "(leafOnly, includeHalfChecked) => result", + "desc": "Obtains the data of the selected identifier.; If a node can be selected (that is, show-checkbox is set to true), the array composed of the currently selected nodes is returned. This parameter is valid only when multiple nodes are selected.", + "defaultValue": "" + }, + { + "name": "setCheckedNodes", + "sample": "show-checkbox", + "type": "(keys, leafOnly) => void", + "desc": "Set the selected node. You must set the node-key attribute in this method.", + "defaultValue": "" + }, + { + "name": "getCheckedKeys", + "sample": "check-on-click-node", + "type": "(leafOnly) => result", + "desc": "If a node can be selected (that is, show-checkbox is set to true), the array consisting of the keys of the selected node is returned. This parameter is valid only when multiple nodes are selected.", + "defaultValue": "" + }, + { + "name": "setCheckedKeys", + "sample": "show-checkbox", + "type": "(keys, leafOnly) => void", + "desc": "Use keys to set the selected node. You must set the node-key attribute.", + "defaultValue": "" + }, + { + "name": "setChecked", + "sample": "show-checkbox", + "type": "(data, checked, deep) => void", + "desc": "Use key/data to set the selected status of a node. You must set the node-key attribute in this method. The third parameter can recursively set the check status of all subnodes", + "defaultValue": "" + }, + { + "name": "closeMenu", + "sample": "contextmenu", + "type": "() => void", + "desc": "Close the shortcut menu.", + "defaultValue": "" + }, + { + "name": "getHalfCheckedNodes", + "sample": "check-on-click-node", + "type": "() => result", + "desc": "If a node can be selected (that is, show-checkbox is set to true), the array composed of half-selected nodes is returned. This parameter takes effect only when multiple nodes are selected.", + "defaultValue": "" + }, + { + "name": "getHalfCheckedKeys", + "sample": "check-on-click-node", + "type": "() => result", + "desc": "If a node can be selected (that is, show-checkbox is set to true), the array consisting of the keys of the currently half-selected node is returned. This parameter is valid only when multiple nodes are selected.", + "defaultValue": "" + }, + { + "name": "getCurrentKey", + "sample": "node-key", + "type": "() => result", + "desc": "Obtains the key of the currently selected node. This method must be used to set the node-key attribute. If no node is selected, the system returns. This method takes effect only when one node is selected.", + "defaultValue": "" + }, + { + "name": "getCurrentNode", + "sample": "node-key", + "type": "() => result", + "desc": "Obtains the selected node. This parameter is valid only in single-choice mode. Obtains the data of the currently selected node. If no node is selected, null is returned", + "defaultValue": "" + }, + { + "name": "setCurrentKey", + "sample": "node-key", + "type": "(key) => void", + "desc": "Use the key to set the selected status of a node. You must set the node-key attribute when using this method.", + "defaultValue": "" + }, + { + "name": "setCurrentNode", + "sample": "node-key", + "type": "(key) => void", + "desc": "Use node to set the selected status of a node. You must set the node-key attribute in this method.", + "defaultValue": "" + }, + { + "name": "getNode", + "sample": "show-checkbox", + "type": "(data) => result", + "desc": "The node in the Tree component is obtained based on data or key.", + "defaultValue": "" + }, + { + "name": "remove", + "sample": "", + "type": "(data) => void", + "desc": "Delete a node. ;Delete a node from the tree. The node-key attribute must be set in this method", + "defaultValue": "" + }, + { + "name": "append", + "sample": "node-key", + "type": "(data, parentNode) => void", + "desc": "Add a subnode to a node in the tree.", + "defaultValue": "" + }, + { + "name": "insertBefore", + "sample": "node-key", + "type": "(data, refNode) => void", + "desc": "Add a node before a tree node.", + "defaultValue": "" + }, + { + "name": "insertAfter", + "sample": "node-key", + "type": "(data, refNode) => void", + "desc": "Insert a child node under the parent node based on the node data. Add a node after a node of the Tree", + "defaultValue": "" + } + ], + "events": [ + { + "name": "node-click", + "sample": "check-on-click-node", + "type": "Function(data, node, vm)", + "desc": "Event after a node is clicked.; Callback when a node is clicked; //Parameter description\n{data: node data, node: node status information (including data), vm: component instance}", + "defaultValue": "" + }, + { + "name": "node-contextmenu", + "sample": "node-contextmenu", + "type": "Function(event, data, node, vm)", + "desc": "This event is triggered when a node is right-clicked. //Parameter description\n{data: node data, node: node status information (including data), vm: component instance, event: native event}", + "defaultValue": "" + }, + { + "name": "check-change", + "sample": "node-events", + "type": "Function(data, node, vm)", + "desc": "The callback is performed when the selected node status changes. //Parameter description\n{node: node status (including data), checked: selected status of the currently clicked node, and indeterminate}", + "defaultValue": "" + }, + { + "name": "check", + "sample": "drag-events", + "type": "Function(data, currentNode)", + "desc": "events after a node is selected. Triggered when the check box is clicked; // Callback parameters:\n{data: Object,// Information about the currently selected node\ncurrentNode:Object// Current selected status of the tree component. Contains four attributes: checkedNodes, checkedKeys, halfCheckedNodes, and halfCheckedKeys} ", + "defaultValue": "" + }, + { + "name": "current-change", + "sample": "drag-events", + "type": "Function(data, currentNode)", + "desc": "Event triggered when the selected node changes. //Parameter description\n{data: node data, currentNode: node status information (including data)}", + "defaultValue": "" + }, + { + "name": "node-expand", + "sample": "default-expanded-keys", + "type": "Function(data, node, vm)", + "desc": "Event after a node is expanded.; event triggered when a node is expanded; //Parameter description\n{data: node data, node: node status information (including data, vm: current component instance}", + "defaultValue": "" + }, + { + "name": "node-collapse", + "sample": "default-expanded-keys", + "type": "Function(data, node, vm)", + "desc": "Event after node shrinking; Event triggered when a node is closed; //Parameter description\n{data: node data, node: node status information (including data), vm: current component instance}", + "defaultValue": "" + }, + { + "name": "node-drag-start", + "sample": "drag-events", + "type": "Function(node, event)", + "desc": "Event triggered when a node starts to be dragged. Event triggered when a node starts to be dragged. node: drag node; event: native event", + "defaultValue": "" + }, + { + "name": "node-drag-enter", + "sample": "drag-events", + "type": "Function(draggingNode, targetNode, dropType, event)", + "desc": "Event triggered when a user drags a node to another node. //Parameters\n{draggingNode: drag node, targetNode: target node, dropType: drag type, //Drag node mapping relationship on the target node (before/after/inner/none) \nevent: native event}", + "defaultValue": "" + }, + { + "name": "node-drag-leave", + "sample": "drag-events", + "type": "Function(draggingNode, targetNode, dropType, event)", + "desc": "Event triggered when a node is dragged away. //Parameters\n{draggingNode: drag node, targetNode: target node, dropType: drag type, //Drag node mapping relationship on the target node (before/after/inner/none) \nevent: native event}", + "defaultValue": "" + }, + { + "name": "node-drag-over", + "sample": "drag-events", + "type": "Function(raggingNode, targetNode, dropType, event)", + "desc": "Event triggered when a node is dragged (similar to the mouseover event of a browser). //Parameters\n{draggingNode: drag node, targetNode: target node, dropType: drag type, //Drag node mapping relationship on the target node (before/after/inner/none) \nevent: native event}", + "defaultValue": "" + }, + { + "name": "node-drag-end", + "sample": "drag-events", + "type": "Function(draggingNode, targetNode, dropType, event)", + "desc": "Event triggered when the drag ends (may not be successful). //Parameters\n{draggingNode: drag node, targetNode: target node, dropType: drag type, //Drag node mapping relationship on the target node (before/after/inner/none) \nevent: native event}", + "defaultValue": "" + }, + { + "name": "node-drop", + "sample": "node-draggable", + "type": "Function(draggingNode, targetNode, dropType, event)", + "desc": "Event after a node is dragged. The dragable attribute is valid when true is enabled.; event triggered when the drag is successfully completed; //Parameters\n{draggingNode: drag node, targetNode: target node, dropType: drag type, //Drag node mapping relationship on the target node (before/after/inner/none) \nevent: native event}", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/user-account.json b/examples/docs/resources/pc/api/en-US/user-account.json new file mode 100644 index 000000000..78fbcafce --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/user-account.json @@ -0,0 +1,55 @@ +{ + "attrs": [ + { + "name": "getUserInfo", + "sample": "custom-service", + "type": "Function", + "desc": "User-defined configuration query service", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "Add a class name for the popper. For details, see the popover component.", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether to insert the pop-up box to the body element. If a fault occurs in locating the fault in the dialog box that is displayed, you can set this attribute to false (for details, see the select component).", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "getUserImageUrl", + "sample": "custom-service", + "type": "Function", + "desc": "Customized configuration for obtaining user avatars", + "defaultValue": "" + }, + { + "name": "showArrow", + "sample": "custom-service", + "type": "Boolean", + "desc": "If this parameter is set to true, the arrow direction is the same as that of the Roles component.", + "defaultValue": "" + }, + { + "name": "beforeLogout", + "sample": "", + "type": "Function(params)", + "desc": "Callback function before deregistration", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-operation", + "type": "", + "desc": "Default slot", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/user-contact.json b/examples/docs/resources/pc/api/en-US/user-contact.json new file mode 100644 index 000000000..77ac76f6d --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/user-contact.json @@ -0,0 +1,62 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "data-source", + "type": "Object", + "desc": "Setted data; Data Settings", + "defaultValue": "" + }, + { + "name": "show-img", + "sample": "not-displayed-content", + "type": "Boolean", + "desc": "Indicates whether to display the avatar. The default value is true.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "show-name", + "sample": "not-displayed-content", + "type": "Boolean", + "desc": "Indicates whether to display userName. The default value is true.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "show-number", + "sample": "not-displayed-content", + "type": "Boolean", + "desc": "Indicates whether to display the employee ID roleNumber. The default value is true.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "Add a class name for the popper. For details, see the popover component.", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether to insert a pop-up box to the body element. If a fault occurs in locating the fault in the dialog box that is displayed, you can set this attribute to false (for details, see the select component).", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "espace", + "sample": "support-open-espace", + "type": "Array", + "desc": "Espace Configuration", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "slots-usercontact", + "type": "", + "desc": "Default slot", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/user-head.json b/examples/docs/resources/pc/api/en-US/user-head.json new file mode 100644 index 000000000..90a2dc46b --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/user-head.json @@ -0,0 +1,76 @@ +{ + "attrs": [ + { + "name": "background-color", + "sample": "custom-background-color", + "type": "String", + "desc": "Background color.", + "defaultValue": "The default value of this attribute is #d9d9" + }, + { + "name": "color", + "sample": "color", + "type": "String", + "desc": "Text color.", + "defaultValue": "The default value of this attribute is #ffffff." + }, + { + "name": "message-total", + "sample": "message-count-total", + "type": "Number", + "desc": "Number of messages.", + "defaultValue": "" + }, + { + "name": "message-type", + "sample": "message-count-type", + "type": "String", + "desc": "Message type details|basic is optional. ;The value of this attribute can be details or basic", + "defaultValue": "The default value of this attribute is details." + }, + { + "name": "message-upper-limit", + "sample": "message-count-limit", + "type": "Number", + "desc": "Maximum number of displayed messages.", + "defaultValue": "The default value of this attribute is 0" + }, + { + "name": "min", + "sample": "min-user-head", + "type": "Boolean", + "desc": "Small size mode.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "round", + "sample": "round-user-head", + "type": "Boolean", + "desc": "Circular mode.", + "defaultValue": "" + }, + { + "name": "type", + "sample": "image-user-head", + "type": "String", + "desc": "Avatar type. The options are icon, image, and label. ;The value of this attribute can be icon / image / label", + "defaultValue": "The default value of this attribute is label." + }, + { + "name": "value", + "sample": "icon-user-head", + "type": "String", + "desc": "If type is set to icon, it indicates the icon class name. If type is set to label, it indicates the font string. If type is set to image, it indicates the resource path.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-user-head-content", + "type": "", + "desc": "Customized image content", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/user-link.json b/examples/docs/resources/pc/api/en-US/user-link.json new file mode 100644 index 000000000..2c19c499f --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/user-link.json @@ -0,0 +1,81 @@ +{ + "attrs": [ + { + "name": "value", + "sample": "custom-service", + "type": "String", + "desc": "The default value is empty.", + "defaultValue": "" + }, + { + "name": "cache", + "sample": "cache-users", + "type": "Boolean", + "desc": "Indicates whether to enable the user data cache function. The default value is true.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "cache-key", + "sample": "cache-users", + "type": "String", + "desc": "The default value of the customized cache key is tiny-user", + "defaultValue": "The default value of this attribute is tiny-user." + }, + { + "name": "cache-fields", + "sample": "cache-users", + "type": "Array", + "desc": "Custom cached fields", + "defaultValue": "" + }, + { + "name": "value-split", + "sample": "value-split", + "type": "String", + "desc": "Separator for displaying multiple texts in the text box. The default value is semicolon (;). Set the separator when multiple texts are displayed in the text box. The default value is, comma (,)", + "defaultValue": "The default value of this attribute is," + }, + { + "name": "value-field", + "sample": "value-field", + "type": "String", + "desc": "Field name of the data source corresponding to the value in the drop-down list box.", + "defaultValue": "The default value of this attribute is userId." + }, + { + "name": "text-split", + "sample": "text-split", + "type": "String", + "desc": "Separator for displaying multiple texts in the text box when multiple texts are selected.", + "defaultValue": "The default value of this attribute is," + }, + { + "name": "text-field", + "sample": "text-field", + "type": "String", + "desc": "Set the field name of the data source corresponding to the text in the drop-down list box.", + "defaultValue": "The default value of this attribute is userCN." + }, + { + "name": "fetchUser", + "sample": "custom-service", + "type": "Function", + "desc": "Configure the function of querying user information by area code (displayed on the card).", + "defaultValue": "" + }, + { + "name": "fetchW3Accounts", + "sample": "custom-service", + "type": "Function", + "desc": "Customize the user information batch query service", + "defaultValue": "" + }, + { + "name": "getUserImageUrl", + "sample": "custom-service", + "type": "Function", + "desc": "Customized configuration for obtaining user avatars", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/user.json b/examples/docs/resources/pc/api/en-US/user.json new file mode 100644 index 000000000..b84ca274c --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/user.json @@ -0,0 +1,197 @@ +{ + "attrs": [ + { + "name": "value", + "sample": "basic-usage", + "type": "String", + "desc": "Default value", + "defaultValue": "" + }, + { + "name": "tag-selectable", + "sample": "tag-copy", + "type": "Boolean", + "desc": "Whether to enable copying of selected options in the text box", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "multiple", + "sample": "multiple-users", + "type": "Boolean", + "desc": "Whether to enable the multi-user mode. The default value is false.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "Whether to disable the user component", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "value-split", + "sample": "value-split", + "type": "String", + "desc": "Value Separator", + "defaultValue": "The default value of this attribute is," + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "Add a class name for the popper. For details, see the popover component.", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether to insert a pop-up box to the body element. When a fault occurs in the dialog box that is displayed, you can set this attribute to false (for details, see the select component).", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "sort-by-fetch-data", + "sample": "custom-service", + "type": "Boolean", + "desc": "The data sequence in the drop-down list box during association is the same as that returned by the interface.", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "textSplit", + "sample": "value-split", + "type": "String", + "desc": "Text separator", + "defaultValue": "Separator for text paste and copy query. The default value of this attribute is, ." + }, + { + "name": "value-field", + "sample": "value-field", + "type": "String", + "desc": "Value Field Mapping", + "defaultValue": "The default value of this attribute is userId." + }, + { + "name": "text-field", + "sample": "text-field", + "type": "String", + "desc": "Display field mapping", + "defaultValue": "The default value of this attribute is userCN." + }, + { + "name": "cache", + "sample": "cache-users", + "type": "Boolean", + "desc": "Whether to cache user data", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "cache-key", + "sample": "cache-users", + "type": "String", + "desc": "Set the key value of cached data.", + "defaultValue": "The default value of this attribute is tiny-user." + }, + { + "name": "delay", + "sample": "delay-load", + "type": "Number", + "desc": "Set the loading delay time.", + "defaultValue": "The default value of this attribute is 600 ms." + }, + { + "name": "suggest-length", + "sample": "load-after-input-the-length", + "type": "Number", + "desc": "Load after the input length is set.", + "defaultValue": "The default value of this attribute is 3" + }, + { + "name": "cache-fields", + "sample": "cache-users", + "type": "Array", + "desc": "Set the user data to be cached.", + "defaultValue": "The default value of this attribute is []." + }, + { + "name": "fetchW3Accounts", + "sample": "custom-service", + "type": "Function", + "desc": "User-defined batch query service", + "defaultValue": "" + }, + { + "name": "fetchSuggestUser", + "sample": "custom-service", + "type": "Function", + "desc": "Customized input query service", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "basic-usage", + "type": "String", + "desc": "Set the placeholder text in the text box", + "defaultValue": "" + }, + { + "name": "collapse-tags", + "sample": "multiple-users-tag", + "type": "Boolean", + "desc": "Whether to collapse tags when there are multiple users", + "defaultValue": "The default value of this attribute is false." + }, + { + "name": "collapse-show-overflow-tooltip", + "sample": "collapse-show-overflow-tooltip", + "type": "Boolean", + "desc": "Whether to omit the data that exceeds one line and display a tooltip.", + "defaultValue": "The default value of this attribute is true." + }, + { + "name": "sortable", + "sample": "custom-sort", + "type": "Function", + "desc": "User-defined drag-and-drop sorting. This attribute references the sortablejs plug-in for sorting.", + "defaultValue": "" + }, + { + "name": "size", + "sample": "user-select-size", + "type": "String", + "desc": "Set the user component size", + "defaultValue": "" + }, + { + "name": "allow-copy", + "sample": "", + "type": "Boolean", + "desc": "Indicates whether content in the text box can be copied in the single-choice search scenario. The attribute is transparently transferred to the internal Select component. For details, see the Select example.", + "defaultValue": "The default value of this attribute is false, indicating that the attribute cannot be copied." + } + ], + "slots": [ + { + "name": "options", + "sample": "user-options", + "type": "", + "desc": "Option Text", + "defaultValue": "" + } + ], + "events": [ + { + "name": "error", + "sample": "event-error", + "type": "", + "desc": "This event is triggered when no user information is matched.", + "defaultValue": "" + }, + { + "name": "change", + "sample": "event-change", + "type": "", + "desc": "This event is triggered when the value changes.", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/en-US/wizard.json b/examples/docs/resources/pc/api/en-US/wizard.json new file mode 100644 index 000000000..f92ad8e05 --- /dev/null +++ b/examples/docs/resources/pc/api/en-US/wizard.json @@ -0,0 +1,55 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "base-flow", + "type": "Array", + "desc": "Setting Flowchart Data", + "defaultValue": "" + }, + { + "name": "base-flow", + "sample": "base-flow", + "type": "Boolean", + "desc": "Set the flow chart to the basic flow chart mode.", + "defaultValue": "" + }, + { + "name": "page-guide", + "sample": "page-guide", + "type": "Boolean", + "desc": "Set the flowchart to a page wizard flowchart, which is used together with the base-flow attribute.", + "defaultValue": "" + }, + { + "name": "vertical", + "sample": "vertical", + "type": "Boolean", + "desc": "Set the flowchart to a vertical flowchart.", + "defaultValue": "" + }, + { + "name": "time-line-flow", + "sample": "time-line-flow", + "type": "Boolean", + "desc": "Set the flowchart to a timeline flowchart.", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "base", + "sample": "slot-base", + "type": "", + "desc": "Basic Flowchart Slot", + "defaultValue": "" + }, + { + "name": "stepbutton", + "sample": "slot-step-button", + "type": "", + "desc": "Page Wizard Flowchart Button Slot", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/action-menu.json b/examples/docs/resources/pc/api/zh-CN/action-menu.json new file mode 100644 index 000000000..39549dfee --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/action-menu.json @@ -0,0 +1,99 @@ +{ + "attrs": [ + { + "name": "options", + "sample": "basic-usage", + "type": "Array", + "desc": "可以配置菜单按钮数据,默认值为 [],数组中的每个元素为对象item,每个 item 一般可包含的字段有 (label,children,disabled,divided),例如:{ label: '登录',children:[],divided: true,disabled :true}。", + "defaultValue": "[]" + }, + { + "name": "label", + "sample": "basic-usage", + "type": "String", + "desc": "菜单项的显示值", + "defaultValue": "" + }, + { + "name": "children", + "sample": "basic-usage", + "type": "Array", + "desc": "菜单项的子集", + "defaultValue": "[]" + }, + { + "name": "divided", + "sample": "basic-usage", + "type": "Boolean", + "desc": "显示分割线。默认值:false", + "defaultValue": "false" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "是否禁用。默认:false", + "defaultValue": "false" + }, + { + "name": "text-field", + "sample": "text-field", + "type": "String", + "desc": "设置菜单按钮显示文本的键值,默认值为 label", + "defaultValue": "label" + }, + { + "name": "more-text", + "sample": "more-text", + "type": "String", + "desc": "配置下拉按钮显示文本,默认值为“更多”", + "defaultValue": "更多" + }, + { + "name": "spacing", + "sample": "spacing", + "type": "[String,Number]", + "desc": "配置菜单按钮之间的间距,默认值为 5px", + "defaultValue": "5px" + }, + { + "name": "popper-class", + "sample": "popper-class", + "type": "String", + "desc": "设置下拉面板的类名,自定义样式", + "defaultValue": "" + }, + { + "name": "max-show-num", + "sample": "max-show-num", + "type": "Number", + "desc": " 配置显示菜单按钮的最大个数,默认值为2", + "defaultValue": "2" + } + ], + "slots": [ + { + "name": "item", + "sample": "slot-item", + "type": "插槽", + "desc": "下拉面板中选项插槽", + "defaultValue": "" + } + ], + "events": [ + { + "name": "item-click", + "sample": "item-click", + "type": "Function", + "desc": "当选中菜单项时触发。返回数据data为Object类型,对象包含字段 itemData 和 vm 字段,itemData 为当前选中项的数据(仅配置式时生效),vm 为当前选中项的实例", + "defaultValue": "Function(data:Object)" + }, + { + "name": "more-click", + "sample": "more-click", + "type": "Function", + "desc": "当点击下拉按钮时触发。", + "defaultValue": "Function" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/alert.json b/examples/docs/resources/pc/api/zh-CN/alert.json new file mode 100644 index 000000000..f3472f5a5 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/alert.json @@ -0,0 +1,99 @@ +{ + "attrs": [ + { + "name": "closable", + "sample": "closable", + "type": "Boolean", + "desc": "设置警告是否可以关闭", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "icon", + "sample": "icon", + "type": "String , Object", + "desc": "设置警告的图标,默认会根据 type 值自动使用对应图标", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "设置警告的大小 nomal/large, 缺省为 nomal。;该属性的可选值为 nomal / large", + "defaultValue": "该属性的默认值为 normal" + }, + { + "name": "title", + "sample": "title", + "type": "String", + "desc": "设置警告的标题,在 size 为 large 时有效,默认根据 type 自动设置", + "defaultValue": "" + }, + { + "name": "type", + "sample": "type", + "type": "String", + "desc": "设置警告的类型;该属性的可选值为 success/warning/info/error", + "defaultValue": "该属性的默认值为 info" + }, + { + "name": "description", + "sample": "custom-description", + "type": "String", + "desc": "设置警告的提示内容,默认为空;", + "defaultValue": "" + }, + { + "name": "center", + "sample": "center", + "type": "Boolean", + "desc": "文字是否居中", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "close-text", + "sample": "close-text", + "type": "String", + "desc": "关闭按钮自定义文本", + "defaultValue": "" + }, + { + "name": "show-icon", + "sample": "show-icon", + "type": "Boolean", + "desc": "是否显示图标", + "defaultValue": "该属性的默认值为 true" + } + ], + "slots": [ + { + "name": "default", + "sample": "slot-default", + "type": "", + "desc": "组件默认插槽", + "defaultValue": "" + }, + { + "name": "title", + "sample": "title", + "type": "", + "desc": "标题的内容", + "defaultValue": "" + }, + { + "name": "description", + "sample": "custom-description", + "type": "", + "desc": "提示内容", + "defaultValue": "" + } + ], + "events": [ + { + "name": "close", + "sample": "close", + "type": "", + "desc": "关闭 alert 时触发的事件", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/amount.json b/examples/docs/resources/pc/api/zh-CN/amount.json new file mode 100644 index 000000000..b70aaee88 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/amount.json @@ -0,0 +1,118 @@ +{ + "attrs": [ + { + "name": "placeholder", + "sample": "custom-service", + "type": "String", + "desc": "当数据为空时的占位符", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "设置组件大小", + "defaultValue": "" + }, + { + "name": "format", + "sample": "", + "type": "Object", + "desc": "数字格式化置项,可配置如下字段:;{\n fraction: 4, // 保留小数位数\n rounding: 0, // 舍入点,0-9之间的数字,如配置为7时则为6舍7入,默认为5(四舍五入);配置为0或>9将会进行截取\n prefix: '$', // 前置标识\n groupSize: 3, // 整数部分分组间隔,即第一个分组位数\n secondaryGroupSize: 2, // 整数部分第二级分组间隔,不设置或为0时 自动取groupSize\n groupSeparator: ',', // 整数部分分组分隔符\n decimalSeparator: '.', // 小数点符号\n fractionGroupSize: 0, // 小数部分分组间隔\n fractionGroupSeparator: ' ', // 小数分组分隔符\n suffix: '@' // 后置标识\n }", + "defaultValue": "" + }, + { + "name": "currency", + "sample": "custom-currency", + "type": "String", + "desc": "", + "defaultValue": "该属性的默认值为 CNY" + }, + { + "name": "digits", + "sample": "digits-maxlen", + "type": "Number", + "desc": "设置小数点位数,默认为 2 位。", + "defaultValue": "该属性的默认值为 2" + }, + { + "name": "date", + "sample": "set-date", + "type": "String", + "desc": "设置弹出框内显示日期框。值可设置为 String 或者 Date() 类型。", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "amount-disable", + "type": "Boolean", + "desc": "设置是否禁用,默认为 false。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "max-len", + "sample": "digits-maxlen", + "type": "Number", + "desc": "整数位最大长度,默认为 15 位。", + "defaultValue": "该属性的默认值为 15" + }, + { + "name": "negative", + "sample": "", + "type": "Boolean", + "desc": "是否可为负数,默认为 true ,可设为负数。", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "为 popper 添加类名(可参考 popover 组件)", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false (可参考 select 组件)", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "value", + "sample": "digits-maxlen", + "type": "String , Number", + "desc": "设置金额组件的值。", + "defaultValue": "" + }, + { + "name": "rounding", + "sample": "digits-maxlen", + "type": "Boolean", + "desc": "控制输入金额四舍五入。", + "defaultValue": "" + }, + { + "name": "fetchCurrency", + "sample": "custom-service", + "type": "Function", + "desc": "自定义金额组件的请求服务接口,fetchCurrency返回一个Promise对象 ", + "defaultValue": "" + }, + { + "name": "fields", + "sample": "custom-service", + "type": "Object", + "desc": "自定义金额组件数据映射,在没有使用框架服务时必填", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "set-date", + "type": "", + "desc": "当组件的值发生变化时会触发该事件。", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/anchor.json b/examples/docs/resources/pc/api/zh-CN/anchor.json new file mode 100644 index 000000000..258ca6069 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/anchor.json @@ -0,0 +1,48 @@ +{ + "attrs": [ + { + "name": "links", + "sample": "basic-usage", + "type": "{ key, link, title, children }[]", + "desc": "数据配置项,可通过children嵌套", + "defaultValue": "" + }, + { + "name": "is-affix", + "sample": "is-affix", + "type": "Boolean", + "desc": "固定模式", + "defaultValue": "false" + }, + { + "name": "container-id", + "sample": "set-container", + "type": "String", + "desc": "指定滚动容器的id值", + "defaultValue": "document.body" + }, + { + "name": "mask-class", + "sample": "set-container", + "type": "String", + "desc": "自定义滚动的目标元素类名", + "defaultValue": "" + } + ], + "events": [ + { + "name": "link-click", + "sample": "set-container", + "type": "Function(arg1,arg2)", + "desc": "锚点点击事件, 点击后触发的回调函数;//参数arg1:点击事件对象 //参数arg2: {link: 点击锚点的链接, title: 点击节点的标题文字 }", + "defaultValue": "" + }, + { + "name": "on-change", + "sample": "on-change", + "type": "Function(arg1)", + "desc": "监听锚点链接的改变;锚点改变后的回调函数; // 参数arg1: 当前锚点的id值", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/area.json b/examples/docs/resources/pc/api/zh-CN/area.json new file mode 100644 index 000000000..7bb82ac3d --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/area.json @@ -0,0 +1,104 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "String", + "desc": "设置片区默认值", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "设置组件大小,可设置值为:medium,small,mini", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "custom-service", + "type": "String", + "desc": "当数据为空时的占位符", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "为 popper 添加类名(可参考 popover 组件)", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false (可参考 select 组件)", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "禁用输入框;默认为 false", + "defaultValue": "" + }, + { + "name": "props", + "sample": "custom-service", + "type": "Object", + "desc": "自定义服务时,设置数据的映射字段;默认为 {label: 'name_cn',// 显示文本对应的字段 value: 'org_id'// 值对应的字段}", + "defaultValue": "" + }, + { + "name": "fetch-jcr", + "sample": "custom-service", + "type": "Function", + "desc": "自定义获取片区 JCR 的服务", + "defaultValue": "" + }, + { + "name": "fetch-region", + "sample": "custom-service", + "type": "Function", + "desc": "自定义获取地区部 Region 的服务", + "defaultValue": "" + }, + { + "name": "fetch-rep", + "sample": "custom-service", + "type": "Function", + "desc": "自定义获取代表处 Rep 的服务", + "defaultValue": "" + }, + { + "name": "fetch-office", + "sample": "custom-service", + "type": "Function", + "desc": "自定义获取办事处 Office 的服务", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change-region", + "sample": "area-events", + "type": "Function(value, vm)", + "desc": "Region 的值发生变化时会触发该事件;回调参数为 改变的值;value: 改变后的值, vm: Area组件实例", + "defaultValue": "" + }, + { + "name": "change-rep", + "sample": "area-events", + "type": "Function(value, vm)", + "desc": "Rep 的值发生变化时会触发该事件;回调参数为 改变的值;value: 改变后的值, vm: Area组件实例", + "defaultValue": "" + }, + { + "name": "change-office", + "sample": "area-events", + "type": "Function(value, vm)", + "desc": "Office 的值发生变化时会触发该事件;回调参数为 改变的值;value: 改变后的值, vm: Area组件实例", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/autocomplete.json b/examples/docs/resources/pc/api/zh-CN/autocomplete.json new file mode 100644 index 000000000..796ffeb63 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/autocomplete.json @@ -0,0 +1,176 @@ +{ + "attrs": [ + { + "name": "clearable", + "sample": "clearable", + "type": "Boolean", + "desc": "是否可清空", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "placeholder", + "sample": "hide-loading1", + "type": "String", + "desc": "输入框占位文本", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled1", + "type": "Boolean", + "desc": "禁用", + "defaultValue": "" + }, + { + "name": "value-key", + "sample": "value-key", + "type": "String", + "desc": "输入建议对象中用于显示的键名", + "defaultValue": "" + }, + { + "name": "value", + "sample": "clearable", + "type": "String", + "desc": "必填值,输入绑定值", + "defaultValue": "" + }, + { + "name": "debounce", + "sample": "debounce", + "type": "Number", + "desc": "获取输入建议的去抖延时", + "defaultValue": "该属性的默认值为 300" + }, + { + "name": "placement", + "sample": "placement", + "type": "String", + "desc": "菜单弹出位置;该属性的可选值为 top / top-start / top-end / bottom / bottom-start / bottom-end", + "defaultValue": "该属性的默认值为 bottom-start" + }, + { + "name": "popper-class", + "sample": "popper-class", + "type": "String", + "desc": "Autocomplete 下拉列表的类名", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "设置组件大小,可设置为:medium,small,mini", + "defaultValue": "" + }, + { + "name": "trigger-on-focus", + "sample": "no-trigger-on-focus", + "type": "Boolean", + "desc": "是否在输入框 focus 时显示建议列表", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "name", + "sample": "clearable", + "type": "String", + "desc": "原生属性", + "defaultValue": "" + }, + { + "name": "select-when-unmatched", + "sample": "select-event", + "type": "Boolean", + "desc": "在输入没有任何匹配建议的情况下,按下回车是否触发 select 事件", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "label", + "sample": "", + "type": "String", + "desc": "输入框关联的label文字", + "defaultValue": "" + }, + { + "name": "prefix-icon", + "sample": "custom-icon", + "type": "String", + "desc": "输入框头部图标", + "defaultValue": "" + }, + { + "name": "suffix-icon", + "sample": "custom-icon", + "type": "String", + "desc": "输入框尾部图标", + "defaultValue": "" + }, + { + "name": "hide-loading", + "sample": "hide-loading", + "type": "Boolean", + "desc": "是否隐藏远程加载时的加载图标", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "popper-append-to-body", + "sample": "popper-class", + "type": "Boolean", + "desc": "是否将下拉列表插入至 body 元素。在下拉列表的定位出现问题时,可将该属性设置为 false", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "fetch-suggestions", + "sample": "remote-search", + "type": "Function(queryString, callback)", + "desc": "返回输入建议的方法,仅当你的输入建议数据 resolve 时,通过调用 callback(data:[]) 来返回它", + "defaultValue": "" + }, + { + "name": "highlight-first-item", + "sample": "highlight-first-item", + "type": "Boolean", + "desc": "是否默认突出显示远程搜索建议中的第一项", + "defaultValue": "该属性的默认值为 false" + } + ], + "slots": [ + { + "name": "prefix", + "sample": "custom-icon", + "type": "", + "desc": "输入框头部内容", + "defaultValue": "" + }, + { + "name": "suffix", + "sample": "custom-icon", + "type": "", + "desc": "输入框尾部内容", + "defaultValue": "" + }, + { + "name": "prepend", + "sample": "append-prepend", + "type": "", + "desc": "输入框前置内容", + "defaultValue": "" + }, + { + "name": "append", + "sample": "append-prepend", + "type": "", + "desc": "输入框后置内容", + "defaultValue": "" + } + ], + "events": [ + { + "name": "select", + "sample": "select-event", + "type": "", + "desc": "点击选中建议项时触发。回调参数为:选中建议项", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/badge.json b/examples/docs/resources/pc/api/zh-CN/badge.json new file mode 100644 index 000000000..334d7bd13 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/badge.json @@ -0,0 +1,69 @@ +{ + "attrs": [ + { + "name": "value", + "sample": "type", + "type": "Number | String", + "desc": "数据集对象,支持静态及动态数据。;显示值", + "defaultValue": "" + }, + { + "name": "href", + "sample": "target", + "type": "String", + "desc": "指定跳转的目标页面地址。", + "defaultValue": "" + }, + { + "name": "max", + "sample": "max", + "type": "Number", + "desc": "指定徽章显示的最大值,如果实际获取的徽章值超过该最大值,则以最大值后接一个\"+\"的形式显示徽章数;最大值,超过最大值会显示 '{max}+',要求 value 是 Number 类型", + "defaultValue": "" + }, + { + "name": "is-dot", + "sample": "is-dot", + "type": "Boolean", + "desc": "设置是否有默认的新消息提示。;小圆点", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "hidden", + "sample": "dynamic-hidden", + "type": "Boolean", + "desc": "隐藏 badge", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "type", + "sample": "type", + "type": "String", + "desc": "该属性的可选值为 primary / success / warning / danger / info", + "defaultValue": "" + }, + { + "name": "target", + "sample": "target", + "type": "String", + "desc": "指定点击徽章 Dom 节点时链接到目标页面的跳转方式,仅在 href 属性存在时使用。", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "slot-default", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + }, + { + "name": "content", + "sample": "slot-content", + "type": "", + "desc": "消息提示内容", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/breadcrumb-item.json b/examples/docs/resources/pc/api/zh-CN/breadcrumb-item.json new file mode 100644 index 000000000..a9d5f22c8 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/breadcrumb-item.json @@ -0,0 +1,36 @@ +{ + "attrs": [ + { + "name": "to", + "sample": "slot-default", + "type": "String , Object", + "desc": "路由跳转对象,同 vue-router 的 to", + "defaultValue": "" + }, + { + "name": "replace", + "sample": "slot-default", + "type": "Boolean", + "desc": "在使用 to 进行路由跳转时,启用 replace 将不会向 history 添加新记录", + "defaultValue": "该属性的默认值为 false" + } + ], + "slots": [ + { + "name": "default", + "sample": "slot-default", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + } + ], + "events": [ + { + "name": "select", + "sample": "select", + "type": "", + "desc": "点击 breadcrumb-item 时触发", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/breadcrumb.json b/examples/docs/resources/pc/api/zh-CN/breadcrumb.json new file mode 100644 index 000000000..d1d7d0091 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/breadcrumb.json @@ -0,0 +1,91 @@ +{ + "attrs": [ + { + "name": "separator", + "sample": "separator", + "type": "String", + "desc": "分隔符", + "defaultValue": "该属性的默认值为 /" + }, + { + "name": "separator-icon", + "sample": "separator", + "type": "Object", + "desc": "图标分隔符 class", + "defaultValue": "" + }, + { + "name": "options", + "sample": "options", + "type": "Array", + "desc": "配置 options ,可以单独使用 tiny-breadcrumb 组件", + "defaultValue": "[]" + }, + { + "name": "textField", + "sample": "options", + "type": "Array", + "desc": "指定面包屑的显示字段,结合 options 使用,组件默认 label ", + "defaultValue": "[]" + } + ], + "events": [ + { + "name": "select", + "sample": "base", + "type": "Function", + "desc": "点击 breadcrumb-item 时触发", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "slot-default", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + } + ], + "breadcrumbItemAttrs": [ + { + "name": "to", + "sample": "slot-default", + "type": "String , Object", + "desc": "路由跳转对象,同 vue-router 的 to", + "defaultValue": "" + }, + { + "name": "replace", + "sample": "slot-default", + "type": "Boolean", + "desc": "在使用 to 进行路由跳转时,启用 replace 将不会向 history 添加新记录", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "label", + "sample": "base", + "type": "String", + "desc": "定义面包屑的显示值", + "defaultValue": "" + } + ], + "breadcrumbItemSlots": [ + { + "name": "default", + "sample": "slot-default", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + } + ], + "breadcrumbItemEvents": [ + { + "name": "select", + "sample": "base", + "type": "", + "desc": "点击 breadcrumb-item 时触发", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/bulletin-board.json b/examples/docs/resources/pc/api/zh-CN/bulletin-board.json new file mode 100644 index 000000000..8adcc3b26 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/bulletin-board.json @@ -0,0 +1,53 @@ +{ + "attrs": [ + { + "name": "active-name", + "sample": "active-name", + "type": "String", + "desc": "默认显示第1栏,可选'1' '2' '3'等", + "defaultValue": "该属性的默认值为 1" + }, + { + "name": "data", + "sample": "base", + "type": "Array", + "desc": "tab-item 数据;tab-item 数据", + "defaultValue": "" + }, + { + "name": "icon", + "sample": "icon", + "type": "Object , String", + "desc": "tab-item中第一条信息的字体图标;tab-item中第一条信息的字体图标", + "defaultValue": "" + }, + { + "name": "show-more", + "sample": "more-link", + "type": "Boolean", + "desc": "是否显示更多按钮,默认显示,需要与 more-link 同时使用", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "more-link", + "sample": "more-link", + "type": "Object", + "desc": "更多按钮跳转地址,show-more 为true 的时候生效;moreLink: { url: 'localhost:3000/', // 跳转地址,url 和 route 属性二选一,url优先级高 route: 'Alert', // 跳转路由,url 和 route 属性二选一,url优先级高 target: '_blank', // 跳转方式 text: '更多' // 链接文本 }", + "defaultValue": "" + }, + { + "name": "tab-title", + "sample": "tab-title", + "type": "Array", + "desc": "tab栏数据", + "defaultValue": "" + }, + { + "name": "title", + "sample": "title", + "type": "String", + "desc": "公告牌的标题", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/button-group.json b/examples/docs/resources/pc/api/zh-CN/button-group.json new file mode 100644 index 000000000..0b47aebd0 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/button-group.json @@ -0,0 +1,85 @@ +{ + "attrs": [ + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "设置按钮组是否被禁用。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "设置组件大小", + "defaultValue": "" + }, + { + "name": "data", + "sample": "data", + "type": "Array", + "desc": "按钮组数据。例:[{text: '', value: ''}]", + "defaultValue": "" + }, + { + "name": "value-field", + "sample": "text-value-field", + "type": "String", + "desc": "按钮值的字段值。", + "defaultValue": "该属性的默认值为 value" + }, + { + "name": "text-field", + "sample": "text-value-field", + "type": "String", + "desc": "按钮显示文字的字段值。", + "defaultValue": "该属性的默认值为 text" + }, + { + "name": "modelValue / v-model", + "sample": "base", + "type": "Number , String", + "desc": "默认选中按钮的值。", + "defaultValue": "" + }, + { + "name": "plain", + "sample": "plain", + "type": "Boolean", + "desc": "是否朴素按钮。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "show-more", + "sample": "show-more", + "type": "Number", + "desc": "设置超过多少个显示更多按钮。", + "defaultValue": "" + }, + { + "name": "show-edit", + "sample": "show-edit", + "type": "Boolean", + "desc": "是否显示编辑按钮,只有在显示更多的情况下生效。", + "defaultValue": "该属性的默认值为 false" + } + ], + "slots": [ + { + "name": "default", + "sample": "slot-default", + "type": "", + "desc": "按钮组内容。", + "defaultValue": "" + } + ], + "events": [ + { + "name": "edit", + "sample": "edit", + "type": "", + "desc": "设置当编辑按钮被点击时触发的回调函数。", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/button.json b/examples/docs/resources/pc/api/zh-CN/button.json new file mode 100644 index 000000000..e5b049684 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/button.json @@ -0,0 +1,106 @@ +{ + "attrs": [ + { + "name": "disabled", + "sample": "dynamic-disabled", + "type": "Boolean", + "desc": "设置按钮是否被禁用。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "native-type", + "sample": "icon", + "type": "String", + "desc": "设置 button、image 两种按钮的表单类型。该属性仅当属性 type 为 button 或 image 时使用。;原生 type 属性;该属性的可选值为 button / submit / reset", + "defaultValue": "该属性的默认值为 button" + }, + { + "name": "reset-time", + "sample": "reset-time", + "type": "Number", + "desc": "设置按钮禁用时间,防止重复提交,单位毫秒", + "defaultValue": "该属性的默认值为 1000" + }, + { + "name": "text", + "sample": "text", + "type": "String", + "desc": "设置按钮显示的文本,可配置国际化。", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "定义按钮尺寸;该属性的可选值为 large / medium / small / mini", + "defaultValue": "" + }, + { + "name": "type", + "sample": "type", + "type": "String", + "desc": "展示按钮不同的状态;该属性的可选值为 primary / success / warning / danger / info / text", + "defaultValue": "" + }, + { + "name": "plain", + "sample": "plain", + "type": "Boolean", + "desc": "是否朴素按钮", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "round", + "sample": "round", + "type": "Boolean", + "desc": "是否圆角按钮", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "circle", + "sample": "circle", + "type": "Boolean", + "desc": "是否圆形按钮", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "loading", + "sample": "loading", + "type": "Boolean", + "desc": "是否加载中状态", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "icon", + "sample": "icon", + "type": "Object , String", + "desc": "svg 图片对象", + "defaultValue": "" + }, + { + "name": "autofocus", + "sample": "autofocus", + "type": "Boolean", + "desc": "是否默认聚焦", + "defaultValue": "该属性的默认值为 false" + } + ], + "slots": [ + { + "name": "default", + "sample": "image", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + } + ], + "events": [ + { + "name": "click", + "sample": "click", + "type": "", + "desc": "设置当按钮被点击时触发的回调函数。", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/calendar.json b/examples/docs/resources/pc/api/zh-CN/calendar.json new file mode 100644 index 000000000..5ffb77111 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/calendar.json @@ -0,0 +1,55 @@ +{ + "attrs": [ + { + "name": "events", + "sample": "dynamic-add-schedule", + "type": "Array", + "desc": "事件列表", + "defaultValue": "" + }, + { + "name": "mode", + "sample": "calendar-mode", + "type": "String", + "desc": "显示模式,month / year 可选,默认 month", + "defaultValue": "" + }, + { + "name": "month", + "sample": "custom-day-cell", + "type": "Number", + "desc": "指定月份,默认当月", + "defaultValue": "" + }, + { + "name": "show-selected", + "sample": "show-selected-date", + "type": "Boolean", + "desc": "显示选中的日期", + "defaultValue": "" + }, + { + "name": "year", + "sample": "custom-day-cell", + "type": "Number", + "desc": "指定年份,默认今年", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "day", + "sample": "custom-day-cell", + "type": "", + "desc": "日期单元格插槽", + "defaultValue": "" + }, + { + "name": "tool", + "sample": "custom-calendar-toolbar", + "type": "", + "desc": "日历工具栏插槽", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/card-template.json b/examples/docs/resources/pc/api/zh-CN/card-template.json new file mode 100644 index 000000000..66b7c5b4a --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/card-template.json @@ -0,0 +1,41 @@ +{ + "attrs": [ + { + "name": "body-style", + "sample": "", + "type": "", + "desc": "设置卡片 body 部分的样式;该属性的可选值为 --", + "defaultValue": "该属性的默认值为 --" + }, + { + "name": "header-line", + "sample": "", + "type": "Boolean", + "desc": "设置卡片头部是否显示分割线,默认为 true 。", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "header", + "sample": "", + "type": "", + "desc": "设置卡片头部内容,比如标题。", + "defaultValue": "" + }, + { + "name": "footer", + "sample": "", + "type": "", + "desc": "设置卡片 footer 部分的内容。", + "defaultValue": "" + }, + { + "name": "default", + "sample": "", + "type": "", + "desc": "默认插槽,设置卡片 body 部分的内容。", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/carousel-item.json b/examples/docs/resources/pc/api/zh-CN/carousel-item.json new file mode 100644 index 000000000..cfb814cd3 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/carousel-item.json @@ -0,0 +1,27 @@ +{ + "attrs": [ + { + "name": "name", + "sample": "manual-play", + "type": "String", + "desc": "幻灯片的名字,可用作 setActiveItem 的参数", + "defaultValue": "" + }, + { + "name": "title", + "sample": "show-title", + "type": "String", + "desc": "幻灯片的标题 。", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "manual-play", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/carousel.json b/examples/docs/resources/pc/api/zh-CN/carousel.json new file mode 100644 index 000000000..f01fa4bd4 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/carousel.json @@ -0,0 +1,115 @@ +{ + "attrs": [ + { + "name": "arrow", + "sample": "up-down-carousel", + "type": "String", + "desc": "切换箭头的显示时机;该属性的可选值为 always / hover / never", + "defaultValue": "该属性的默认值为 hover" + }, + { + "name": "autoplay", + "sample": "autoplay", + "type": "Boolean", + "desc": "是否自动切换。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "height", + "sample": "indicator-trigger", + "type": "String", + "desc": "走马灯的高度。", + "defaultValue": "" + }, + { + "name": "indicator-position", + "sample": "indicator-trigger", + "type": "String", + "desc": "指示器的位置。该属性的可选值为 outside / none", + "defaultValue": "" + }, + { + "name": "initial-index", + "sample": "manual-play", + "type": "Number", + "desc": "初始状态激活的幻灯片的索引,从 0 开始 。", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "interval", + "sample": "play-interval", + "type": "Number", + "desc": "自动切换的时间间隔,单位为毫秒。", + "defaultValue": "该属性的默认值为 3000" + }, + { + "name": "show-title", + "sample": "show-title", + "type": "Boolean", + "desc": "是否显示标题。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "trigger", + "sample": "indicator-trigger", + "type": "String", + "desc": "指示器的触发方式,默认为 hover。;该属性的可选值为 click", + "defaultValue": "该属性的默认值为 hover" + }, + { + "name": "type", + "sample": "card-mode", + "type": "String", + "desc": "走马灯的类型;该属性的可选值为 horizontal / vertical / card", + "defaultValue": "该属性的默认值为 horizontal" + }, + { + "name": "loop", + "sample": "close-loop", + "type": "Boolean", + "desc": "是否循环显示", + "defaultValue": "该属性的默认值为 true" + } + ], + "slots": [ + { + "name": "default", + "sample": "manual-play", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "next", + "sample": "manual-play", + "type": "", + "desc": "切换至下一张幻灯片。", + "defaultValue": "" + }, + { + "name": "prev", + "sample": "manual-play", + "type": "", + "desc": "切换至上一张幻灯片", + "defaultValue": "" + }, + { + "name": "setActiveItem", + "sample": "manual-play", + "type": "", + "desc": "手动切换幻灯片", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "manual-play", + "type": "", + "desc": "幻灯片切换时触发", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/cascader-panel.json b/examples/docs/resources/pc/api/zh-CN/cascader-panel.json new file mode 100644 index 000000000..d152d69fe --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/cascader-panel.json @@ -0,0 +1,145 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "", + "desc": "选中项绑定值", + "defaultValue": "" + }, + { + "name": "options", + "sample": "change", + "type": "Array", + "desc": "可选项数据源,键名可通过 Props 属性配置", + "defaultValue": "" + }, + { + "name": "props", + "sample": "cascader-panel-props", + "type": "Object", + "desc": "配置选项,具体见 CascaderPanel Props 表 ", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-option-content", + "type": "", + "desc": "自定义备选项的节点内容,参数为 { node, data },分别为当前节点的 Node 对象和数据", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "getCheckedNodes", + "sample": "change", + "type": "", + "desc": "获取选中的节点;参数为 (leafOnly) 是否只是获取子节点,默认值为 false", + "defaultValue": "" + }, + { + "name": "clearCheckedNodes", + "sample": "change", + "type": "", + "desc": "清空选中的节点", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "change", + "type": "Function(arg)", + "desc": "当选中节点变化时触发;arg:回调参数为 选中节点的值 (Array类型)", + "defaultValue": "" + }, + { + "name": "expand-change", + "sample": "change", + "type": "Functon(arg)", + "desc": "当展开节点发生变化时触发;arg:回调参数为 各父级选项值组成的数组 (Array类型)", + "defaultValue": "" + } + ], + "caspanelprops": [ + { + "name": "expandTrigger", + "sample": "basic-usage", + "type": "String", + "desc": "次级菜单的展开方式;该属性的可选值为 click / hover", + "defaultValue": "click" + }, + { + "name": "multiple", + "sample": "default-multiple", + "type": "Boolean", + "desc": "是否多选", + "defaultValue": "false" + }, + { + "name": "checkStrictly", + "sample": "check-strictly", + "type": "Boolean", + "desc": "是否严格的遵守父子节点不互相关联", + "defaultValue": " false" + }, + { + "name": "emitPath", + "sample": "events", + "type": "Boolean", + "desc": "在选中节点改变时,是否返回由该节点所在的各级菜单的值所组成的数组,若设置 false,则只返回该节点的值", + "defaultValue": " true" + }, + { + "name": "lazy", + "sample": "auto-load", + "type": "Boolean", + "desc": "是否动态加载子节点,需与 lazyLoad 方法结合使用", + "defaultValue": "false" + }, + { + "name": "lazyLoad", + "sample": "auto-load", + "type": "Function(node, resolve)", + "desc": "加载动态数据的方法,仅在 lazy 为 true 时有效;参数说明: node为当前点击的节点,resolve为数据加载完成的回调(必须调用)", + "defaultValue": "" + }, + { + "name": "value", + "sample": "props-children", + "type": "String", + "desc": "指定选项的值为选项对象的某个属性值", + "defaultValue": "'value'" + }, + { + "name": "label", + "sample": "props-children", + "type": "String", + "desc": "指定选项标签为选项对象的某个属性值", + "defaultValue": "'label'" + }, + { + "name": "children", + "sample": "props-children", + "type": "String", + "desc": "指定选项的子选项为选项对象的某个属性值", + "defaultValue": "'children'" + }, + { + "name": "disabled", + "sample": "disabled-items", + "type": "String", + "desc": "指定选项的禁用为选项对象的某个属性值", + "defaultValue": "'disabled'" + }, + { + "name": "leaf", + "sample": "check-strictly", + "type": "String", + "desc": "指定选项的叶子节点的标志位为选项对象的某个属性值", + "defaultValue": "'leaf'" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/cascader.json b/examples/docs/resources/pc/api/zh-CN/cascader.json new file mode 100644 index 000000000..89daad15b --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/cascader.json @@ -0,0 +1,264 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "clearable", + "type": "", + "desc": "选中项绑定值", + "defaultValue": "" + }, + { + "name": "options", + "sample": "disabled-items", + "type": "Array", + "desc": "可选项数据源,键名可通过 Props 属性配置", + "defaultValue": "" + }, + { + "name": "props", + "sample": "props-children", + "type": "Object", + "desc": "配置选项,具体见 Cascader Props 表", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "为 popper 添加类名(可参考 popover 组件)", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false (可参考 select 组件)", + "defaultValue": "true" + }, + { + "name": "size", + "sample": "clearable2", + "type": "String", + "desc": "尺寸;该属性的可选值为 medium / small / mini", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "filterable-multiple1", + "type": "String", + "desc": "输入框占位文本", + "defaultValue": "请选择" + }, + { + "name": "disabled", + "sample": "disabled-items", + "type": "Boolean", + "desc": "是否禁用", + "defaultValue": "false" + }, + { + "name": "clearable", + "sample": "clearable", + "type": "Boolean", + "desc": "是否支持清空选项", + "defaultValue": "false" + }, + { + "name": "show-all-levels", + "sample": "show-all-levels", + "type": "Boolean", + "desc": "输入框中是否显示选中值的完整路径", + "defaultValue": "true" + }, + { + "name": "collapse-tags", + "sample": "collapse-tags", + "type": "Boolean", + "desc": "多选模式下是否折叠Tag", + "defaultValue": "false" + }, + { + "name": "separator", + "sample": "clearable1", + "type": "String", + "desc": "选项分隔符", + "defaultValue": "/" + }, + { + "name": "filterable", + "sample": "filterable", + "type": "Boolean", + "desc": "是否可搜索选项", + "defaultValue": "" + }, + { + "name": "filter-method", + "sample": "filter-method", + "type": "Function(node, keyword)", + "desc": "自定义搜索逻辑,第一个参数是节点 node,第二个参数是搜索关键词 keyword,通过返回布尔值表示是否命中", + "defaultValue": "" + }, + { + "name": "debounce", + "sample": "filterable", + "type": "Number", + "desc": "搜索关键词输入的去抖延迟,单位毫秒", + "defaultValue": "300" + }, + { + "name": "before-filter", + "sample": "filter-method", + "type": "Function(value)", + "desc": "筛选之前的钩子,参数为输入的值,若返回 false 或者返回 Promise 且被 reject,则停止筛选", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "自定义浮层类名", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "empty", + "sample": "filterable", + "type": "", + "desc": "无匹配选项时的内容", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "getCheckedNodes", + "sample": "events", + "type": "", + "desc": "获取选中的节点;参数为 (leafOnly) 是否只是获取子节点,默认值为 false", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "events", + "type": "Fuction(arg)", + "desc": "当选中节点变化时触发;arg:回调参数为 选中节点的值(Array类型)", + "defaultValue": "" + }, + { + "name": "expand-change", + "sample": "events", + "type": "Fuction(arg)", + "desc": "当展开节点发生变化时触发;arg:回调参数为 各父级选项值组成的数组(Array类型)", + "defaultValue": "" + }, + { + "name": "blur", + "sample": "events", + "type": "Fuction(arg)", + "desc": "当失去焦点时触发;arg:回调参数为 (event: Event, 类型:Object)", + "defaultValue": "" + }, + { + "name": "focus", + "sample": "events", + "type": "Fuction(arg)", + "desc": "当获得焦点时触发;arg:回调参数为 (event: Event, 类型:Object)", + "defaultValue": "" + }, + { + "name": "visible-change", + "sample": "events", + "type": "Fuction(arg)", + "desc": "下拉框出现/隐藏时触发;arg:回调参数为 出现则为 true,隐藏则为 false(布尔类型)", + "defaultValue": "" + }, + { + "name": "remove-tag", + "sample": "default-multiple", + "type": "Fuction(arg)", + "desc": "在多选模式下,移除Tag时触发;arg:回调参数为 移除的Tag对应的节点的值(Array类型)", + "defaultValue": "" + } + ], + "casprops": [ + { + "name": "expandTrigger", + "sample": "basic-usage", + "type": "String", + "desc": "次级菜单的展开方式;该属性的可选值为 click / hover", + "defaultValue": "click" + }, + { + "name": "multiple", + "sample": "default-multiple", + "type": "Boolean", + "desc": "是否多选", + "defaultValue": "false" + }, + { + "name": "checkStrictly", + "sample": "check-strictly", + "type": "Boolean", + "desc": "是否严格的遵守父子节点不互相关联", + "defaultValue": " false" + }, + { + "name": "emitPath", + "sample": "events", + "type": "Boolean", + "desc": "在选中节点改变时,是否返回由该节点所在的各级菜单的值所组成的数组,若设置 false,则只返回该节点的值", + "defaultValue": " true" + }, + { + "name": "lazy", + "sample": "auto-load", + "type": "Boolean", + "desc": "是否动态加载子节点,需与 lazyLoad 方法结合使用", + "defaultValue": "false" + }, + { + "name": "lazyLoad", + "sample": "auto-load", + "type": "Function(node, resolve)", + "desc": "加载动态数据的方法,仅在 lazy 为 true 时有效;参数说明: node为当前点击的节点,resolve为数据加载完成的回调(必须调用)", + "defaultValue": "" + }, + { + "name": "value", + "sample": "props-children", + "type": "String", + "desc": "指定选项的值为选项对象的某个属性值", + "defaultValue": "'value'" + }, + { + "name": "label", + "sample": "props-children", + "type": "String", + "desc": "指定选项标签为选项对象的某个属性值", + "defaultValue": "'label'" + }, + { + "name": "children", + "sample": "props-children", + "type": "String", + "desc": "指定选项的子选项为选项对象的某个属性值", + "defaultValue": "'children'" + }, + { + "name": "disabled", + "sample": "disabled-items", + "type": "String", + "desc": "指定选项的禁用为选项对象的某个属性值", + "defaultValue": "'disabled'" + }, + { + "name": "leaf", + "sample": "check-strictly", + "type": "String", + "desc": "指定选项的叶子节点的标志位为选项对象的某个属性值", + "defaultValue": "'leaf'" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/chart-data.json b/examples/docs/resources/pc/api/zh-CN/chart-data.json new file mode 100644 index 000000000..7a041deed --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/chart-data.json @@ -0,0 +1,18 @@ +{ + "attrs": [ + { + "name": "columns", + "sample": "", + "type": "array", + "desc": "维度和指标的集合,chart 中的大部分图表都是单维度多指标,所以默认第一个值为 维度,剩余的值为指标", + "defaultValue": "" + }, + { + "name": "rows", + "sample": "", + "type": "array", + "desc": "数据的集合", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/chart-pie.json b/examples/docs/resources/pc/api/zh-CN/chart-pie.json new file mode 100644 index 000000000..c6992f300 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/chart-pie.json @@ -0,0 +1,109 @@ +{ + "attrs": [ + { + "name": "dimension", + "sample": "", + "type": "String", + "desc": "维度,默认columns第一项为维度", + "defaultValue": "" + }, + { + "name": "metrics", + "sample": "", + "type": "String", + "desc": "指标,默认columns第二项为指标", + "defaultValue": "" + }, + { + "name": "dataType", + "sample": "", + "type": "String", + "desc": "数据类型;该属性的可选值为 KMB, normal, percent", + "defaultValue": "" + }, + { + "name": "legendLimit", + "sample": "", + "type": "Number", + "desc": "legend显示数量限制,legend数量过多会导致饼图样式错误,限制legend最大值并且当超过此值时,隐藏legend可以解决这个问题", + "defaultValue": "" + }, + { + "name": "selectedMode", + "sample": "", + "type": "Number", + "desc": "选中模式;该属性的可选值为 single, multiple", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "hoverAnimation", + "sample": "", + "type": "Boolean", + "desc": "是否开启 hover 在扇区上的放大动画效果", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "radius", + "sample": "", + "type": "Number", + "desc": "饼图半径", + "defaultValue": "" + }, + { + "name": "offsetY", + "sample": "", + "type": "Number", + "desc": "纵向偏移量", + "defaultValue": "" + }, + { + "name": "digit", + "sample": "", + "type": "Number", + "desc": "设置数据类型为percent时保留的位数", + "defaultValue": "该属性的默认值为 2" + }, + { + "name": "roseType", + "sample": "", + "type": "String", + "desc": "显示为南丁格尔玫瑰图,默认不展示为南丁格尔玫瑰图", + "defaultValue": "该属性的默认值为 radius, area" + }, + { + "name": "label", + "sample": "", + "type": "Object", + "desc": "饼图图形上的文本标签", + "defaultValue": "" + }, + { + "name": "labelLine", + "sample": "", + "type": "Object", + "desc": "标签的视觉引导线样式", + "defaultValue": "" + }, + { + "name": "itemStyle", + "sample": "", + "type": "Object", + "desc": "图形样式", + "defaultValue": "" + }, + { + "name": "level", + "sample": "", + "type": "array", + "desc": "多圆饼图时设置", + "defaultValue": "" + }, + { + "name": "limitShowNum", + "sample": "", + "type": "Number", + "desc": "设置超过此数字时使用‘其他’代替,此时数据会按照由大到小顺序显示", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/chart.json b/examples/docs/resources/pc/api/zh-CN/chart.json new file mode 100644 index 000000000..7eebe8582 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/chart.json @@ -0,0 +1,130 @@ +{ + "attrs": [ + { + "name": "data ", + "sample": "chart/attributes-demo#props-demo10", + "type": "Object ", + "desc": "数据由指标和维度组成,“维度” 指的是数据的属性,“指标” 是量化衡量标准", + "defaultValue": "" + }, + { + "name": "settings ", + "sample": "", + "type": "Object ", + "desc": "配置项,各图表 Settings 属性配置请查阅各图表详情页面", + "defaultValue": "" + }, + { + "name": "width", + "sample": "chart/attributes-demo#props-demo10", + "type": "String", + "desc": "设置图表容器的宽度。", + "defaultValue": "该属性的默认值为 auto" + }, + { + "name": "height", + "sample": "chart/attributes-demo#props-demo10", + "type": "String", + "desc": "设置图表容器的高度。", + "defaultValue": "该属性的默认值为 400px" + }, + { + "name": "events", + "sample": "chart/events#events-base", + "type": "Object", + "desc": "事件绑定", + "defaultValue": "" + }, + { + "name": "init-options", + "sample": "chart/attributes-demo#props-demo10", + "type": "Object", + "desc": "init 附加参数", + "defaultValue": "" + }, + { + "name": "tooltip-visible", + "sample": "chart/attributes-demo#props-demo10", + "type": "Boolean", + "desc": "是否显示提示框", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "legend-visible", + "sample": "chart/attributes-demo#props-demo10", + "type": "Boolean", + "desc": "是否显示图例", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "theme", + "sample": "chart#base", + "type": "Object", + "desc": "自定义主题名称。;自定义主题对象。", + "defaultValue": "" + }, + { + "name": "theme-name", + "sample": "chart#base", + "type": "String", + "desc": "自定义主题名称,如果设置了theme-name,则theme无效", + "defaultValue": "" + }, + { + "name": "judge-width", + "sample": "chart/events#events-base", + "type": "Boolean", + "desc": "是否处理生成图表时的宽度问题", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "width-change-delay", + "sample": "chart/question#question-base", + "type": "Number", + "desc": "容器宽度变化的延迟", + "defaultValue": "该属性的默认值为 300" + }, + { + "name": "resizeable", + "sample": "chart/question#question-base", + "type": "Boolean", + "desc": "是否处理窗口 resize 事件", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "cancel-resize-check", + "sample": "chart/question#question-base", + "type": "Boolean", + "desc": "是否禁用 resize 时的容器检测", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "resize-delay", + "sample": "chart/attributes-demo#props-demo10", + "type": "Number", + "desc": "窗口 resize 事件回调的延迟", + "defaultValue": "该属性的默认值为 200" + }, + { + "name": "change-delay", + "sample": "chart/question#question-base", + "type": "Number", + "desc": "属性修改触发图表重绘回调的延迟", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "set-option-opts", + "sample": "", + "type": "Boolean , Object", + "desc": "echarts setOption 的第二个参数", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "not-set-unchange", + "sample": "", + "type": "Array", + "desc": "未发生变化时不参加 setOption 的属性", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/checkbox-button.json b/examples/docs/resources/pc/api/zh-CN/checkbox-button.json new file mode 100644 index 000000000..6a309b06a --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/checkbox-button.json @@ -0,0 +1,76 @@ +{ + "attrs": [ + { + "name": "label", + "sample": "checkbox-group", + "type": "String , Number , Boolean", + "desc": "选中状态的值(只有在checkbox-group或者绑定对象类型为array时有效);该属性的可选值为 medium-", + "defaultValue": "" + }, + { + "name": "true-label", + "sample": "text", + "type": "String , Number", + "desc": "选中时的值", + "defaultValue": "" + }, + { + "name": "false-label", + "sample": "text", + "type": "String , Number", + "desc": "没有选中时的值", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "with-border", + "type": "Boolean", + "desc": "是否禁用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "name", + "sample": "checkbox-group", + "type": "String", + "desc": "原生 name 属性", + "defaultValue": "" + }, + { + "name": "text", + "sample": "text", + "type": "String", + "desc": "文本", + "defaultValue": "该属性的默认值为 Function" + }, + { + "name": "modelValue / v-model", + "sample": "checkbox-button", + "type": "String , Number , Boolean", + "desc": "绑定值", + "defaultValue": "" + }, + { + "name": "events", + "sample": "checkbox-group", + "type": "Object", + "desc": "原生事件", + "defaultValue": "" + }, + { + "name": "checked", + "sample": "checkbox-button", + "type": "Boolean", + "desc": "当前是否勾选", + "defaultValue": "该属性的默认值为 false" + } + ], + "slots": [ + { + "name": "default", + "sample": "with-border", + "type": "", + "desc": "Checkbox-button的内容", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/checkbox-group.json b/examples/docs/resources/pc/api/zh-CN/checkbox-group.json new file mode 100644 index 000000000..458e42775 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/checkbox-group.json @@ -0,0 +1,92 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "checkbox-group", + "type": "Array", + "desc": "绑定值", + "defaultValue": "" + }, + { + "name": "size", + "sample": "with-border", + "type": "String", + "desc": "多选框组尺寸,仅对按钮形式的 Checkbox 或带有边框的 Checkbox 有效;该属性的可选值为 medium / small / mini", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "with-border", + "type": "Boolean", + "desc": "是否禁用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "min", + "sample": "min-max", + "type": "Number", + "desc": "可被勾选的 checkbox 的最小数量", + "defaultValue": "" + }, + { + "name": "max", + "sample": "min-max", + "type": "Number", + "desc": "可被勾选的 checkbox 的最大数量", + "defaultValue": "" + }, + { + "name": "text-color", + "sample": "vertical-checkbox", + "type": "String", + "desc": "按钮形式的 Checkbox 激活时的文本颜色", + "defaultValue": "该属性的默认值为 #ffffff" + }, + { + "name": "fill", + "sample": "checkbox-button", + "type": "String", + "desc": "按钮形式的 Checkbox 激活时的填充色和边框色", + "defaultValue": "该属性的默认值为 #409EFF" + }, + { + "name": "options", + "sample": "checkbox-group", + "type": "Array", + "desc": "checkbox组件列表", + "defaultValue": "" + }, + { + "name": "type", + "sample": "checkbox-group", + "type": "String", + "desc": " checkbox组件类型(button/checkbox)", + "defaultValue": "该属性的默认值为 checkbox,配合 options 属性一起使用" + }, + { + "name": "vertical", + "sample": "vertical-checkbox", + "type": "Boolean", + "desc": "设置组件排列方式;设置复选框是否垂直排列;该属性的可选值为 true / false", + "defaultValue": "该属性的默认值为 false" + } + ], + "slots": [ + { + "name": "default", + "sample": "checkbox-group", + "type": "", + "desc": "checkbox选项组", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "dynamic-create-checkbox", + "type": "", + "desc": "当绑定值变化时触发的事件", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/checkbox.json b/examples/docs/resources/pc/api/zh-CN/checkbox.json new file mode 100644 index 000000000..931565e96 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/checkbox.json @@ -0,0 +1,99 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "checkbox-group", + "type": "String , Number , Boolean", + "desc": "绑定值", + "defaultValue": "" + }, + { + "name": "label", + "sample": "indeterminate", + "type": "String , Number , Boolean", + "desc": "选中状态的值(只有在checkbox-group或者绑定对象类型为array时有效)", + "defaultValue": "" + }, + { + "name": "true-label", + "sample": "text", + "type": "String , Number", + "desc": "选中时的值", + "defaultValue": "" + }, + { + "name": "false-label", + "sample": "text", + "type": "String , Number", + "desc": "没有选中时的值", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "checked", + "type": "Boolean", + "desc": "是否禁用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "border", + "sample": "content-overflow", + "type": "Boolean", + "desc": "是否显示边框", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "size", + "sample": "with-border", + "type": "String", + "desc": "Checkbox 的尺寸,仅在 border 为真时有效;该属性的可选值为 medium / small / mini", + "defaultValue": "" + }, + { + "name": "name", + "sample": "checkbox-group", + "type": "String", + "desc": "原生 name 属性", + "defaultValue": "" + }, + { + "name": "checked", + "sample": "checked", + "type": "Boolean", + "desc": "当前是否勾选", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "indeterminate", + "sample": "indeterminate", + "type": "Boolean", + "desc": "设置 indeterminate 状态,只负责样式控制", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "text", + "sample": "text", + "type": "String", + "desc": "复选框显示的文本", + "defaultValue": "该属性的默认值为空" + } + ], + "slots": [ + { + "name": "default", + "sample": "checkbox-slot", + "type": "", + "desc": "Checkbox的内容", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "checkbox-events", + "type": "", + "desc": "当绑定值变化时触发的事件", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/col.json b/examples/docs/resources/pc/api/zh-CN/col.json new file mode 100644 index 000000000..ccb6cb1c6 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/col.json @@ -0,0 +1,83 @@ +{ + "attrs": [ + { + "name": "lg", + "sample": "base", + "type": "Number , Object", + "desc": "≥1200px 响应式栅格数或者栅格属性对象,例如: {span: 4, offset: 4} 。", + "defaultValue": "" + }, + { + "name": "md", + "sample": "base", + "type": "Number , Object", + "desc": "≥992px 响应式栅格数或者栅格属性对象,例如: {span: 4, offset: 4} 。", + "defaultValue": "" + }, + { + "name": "no", + "sample": "base", + "type": "Number", + "desc": "排序编号(row中启用order生效),默认值为 0 。", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "offset", + "sample": "base", + "type": "Number", + "desc": "栅格左侧的间隔格数,默认为 0 。", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "sm", + "sample": "base", + "type": "Number , Object", + "desc": "≥768px 响应式栅格数或者栅格属性对象,例如: {span: 4, offset: 4} 。", + "defaultValue": "" + }, + { + "name": "span", + "sample": "base", + "type": "Number", + "desc": "栅格占据的列数", + "defaultValue": "该属性的默认值为 12" + }, + { + "name": "tag", + "sample": "base", + "type": "String", + "desc": "自定义元素标签,可选任意标签;该属性的可选值为 *", + "defaultValue": "该属性的默认值为 div" + }, + { + "name": "xl", + "sample": "base", + "type": "Number , Object", + "desc": "≥1920px 响应式栅格数或者栅格属性对象,例如: {span: 4, offset: 4} 。", + "defaultValue": "" + }, + { + "name": "xs", + "sample": "base", + "type": "Number , Object", + "desc": "<768px 响应式栅格数或者栅格属性对象,例如: {span: 4, offset: 4} 。", + "defaultValue": "" + }, + { + "name": "move", + "sample": "base", + "type": "Number", + "desc": "栅格左右移动格数(正数向右,负数向左)", + "defaultValue": "该属性的默认值为 0" + } + ], + "slots": [ + { + "name": "default", + "sample": "base", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/collapse-item.json b/examples/docs/resources/pc/api/zh-CN/collapse-item.json new file mode 100644 index 000000000..a52c69bac --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/collapse-item.json @@ -0,0 +1,48 @@ +{ + "attrs": [ + { + "name": "name", + "sample": "accordion", + "type": "String | Number", + "desc": "唯一标志符", + "defaultValue": "" + }, + { + "name": "title", + "sample": "custom-collapse-title", + "type": "String", + "desc": "面板标题", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "是否禁用", + "defaultValue": "该属性的默认值为 false" + } + ], + "slots": [ + { + "name": "default", + "sample": "dynamic-disable", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + }, + { + "name": "title", + "sample": "custom-collapse-title", + "type": "", + "desc": "标题", + "defaultValue": "" + }, + { + "name": "icon", + "sample": "custom-collapse-icon", + "type": "", + "desc": "展开折叠 icon 图标", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/collapse.json b/examples/docs/resources/pc/api/zh-CN/collapse.json new file mode 100644 index 000000000..937252143 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/collapse.json @@ -0,0 +1,43 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "accordion", + "type": "String , Array , Number", + "desc": "当前激活的面板(如果是手风琴模式,绑定值类型需要为String,否则为array)", + "defaultValue": "" + }, + { + "name": "accordion", + "sample": "accordion", + "type": "Boolean", + "desc": "是否手风琴模式", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "before-close", + "sample": "block-close", + "type": "Function", + "desc": "阻止折叠面板关闭事件", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "dynamic-disable", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "collapse-events", + "type": "", + "desc": "当前激活面板改变时触发(如果是手风琴模式,参数 activeNames 类型为String,否则为array)", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/company.json b/examples/docs/resources/pc/api/zh-CN/company.json new file mode 100644 index 000000000..fb72ecb49 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/company.json @@ -0,0 +1,67 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "custom-show-num", + "type": "String , Number", + "desc": "设置下拉框的值。", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "custom-service", + "type": "String", + "desc": "设置输入框内的提示占位文本。", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "为 popper 添加类名(可参考 popover 组件)", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false (可参考 select 组件)", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "max", + "sample": "custom-show-num", + "type": "Number", + "desc": "原生属性,设置最大值", + "defaultValue": "该属性的默认值为 1000" + }, + { + "name": "fetchCompany", + "sample": "custom-service", + "type": "Function", + "desc": "自定义公司查询接口,fetchCompany返回一个Promise对象", + "defaultValue": "" + }, + { + "name": "fields", + "sample": "custom-service", + "type": "Object", + "desc": "自定义公司数据映射,未使用框架服务时必填", + "defaultValue": "" + }, + { + "name": "clearable", + "sample": "custom-show-num", + "type": "Boolean", + "desc": "是否显示清除按钮;是否可清空", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "disabled", + "sample": "", + "type": "Boolean", + "desc": "禁用", + "defaultValue": "该属性的默认值为 false" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/container.json b/examples/docs/resources/pc/api/zh-CN/container.json new file mode 100644 index 000000000..b3c7711b3 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/container.json @@ -0,0 +1,62 @@ +{ + "attrs": [ + { + "name": "aside-width", + "sample": "custom-with-height", + "type": "Number , String", + "desc": "左侧宽度", + "defaultValue": "该属性的默认值为 200" + }, + { + "name": "footer-height", + "sample": "custom-with-height", + "type": "Number , String", + "desc": "底部高度", + "defaultValue": "该属性的默认值为 60" + }, + { + "name": "header-height", + "sample": "custom-with-height", + "type": "Number , String", + "desc": "头部高度", + "defaultValue": "该属性的默认值为 60" + }, + { + "name": "pattern", + "sample": "custom-container", + "type": "String", + "desc": "版型类型;该属性的可选值为 default / simple / legend / classic / fashion", + "defaultValue": "该属性的默认值为 default" + } + ], + "slots": [ + { + "name": "default", + "sample": "basic-usage", + "type": "", + "desc": "主要内容", + "defaultValue": "" + }, + { + "name": "header", + "sample": "basic-usage", + "type": "", + "desc": "头部内容", + "defaultValue": "" + }, + { + "name": "aside", + "sample": "basic-usage", + "type": "", + "desc": "侧边内容", + "defaultValue": "" + }, + { + "name": "footer", + "sample": "classic", + "type": "", + "desc": "底部内容", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/country.json b/examples/docs/resources/pc/api/zh-CN/country.json new file mode 100644 index 000000000..3c0e8dd4c --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/country.json @@ -0,0 +1,60 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "String , number", + "desc": "设置下拉框的值。", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "basic-usage", + "type": "String", + "desc": "设置输入框内的提示占位文本。", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "为 popper 添加类名(可参考 popover 组件)", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false (可参考 select 组件)", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "fetchCountry", + "sample": "custom-service", + "type": "Function", + "desc": "自定义国家查询接口,返回一个Promise对象,未使用框架服务时必填", + "defaultValue": "" + }, + { + "name": "fields", + "sample": "custom-service", + "type": "Object", + "desc": "自定义数据映射,未使用框架服务时必填", + "defaultValue": "" + }, + { + "name": "clearable", + "sample": "custom-service", + "type": "Boolean", + "desc": "是否显示清除按钮;是否可清空", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "disabled", + "sample": "", + "type": "Boolean", + "desc": "禁用", + "defaultValue": "该属性的默认值为 false" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/credit-card-form.json b/examples/docs/resources/pc/api/zh-CN/credit-card-form.json new file mode 100644 index 000000000..eab3d4afa --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/credit-card-form.json @@ -0,0 +1,62 @@ +{ + "attrs": [ + { + "name": "background-image", + "sample": "background-image", + "type": "String , Object", + "desc": "设置卡片的背景图片;", + "defaultValue": "" + }, + { + "name": "form-data", + "sample": "basic-usage", + "type": "Object", + "desc": "设置信用卡显示数据", + "defaultValue": "// 该属性的默认值为 \n{cardCvv: '', cardName: '', cardYear: '', cardMonth: '', cardNumber: ''}" + } + ], + "events": [ + { + "name": "submit", + "sample": "credit-card-form-events", + "type": "", + "desc": "提交时触发的事件", + "defaultValue": "" + }, + { + "name": "input-card-number", + "sample": "credit-card-form-events", + "type": "", + "desc": "输入卡号时触发的事件", + "defaultValue": "" + }, + { + "name": "input-card-name", + "sample": "credit-card-form-events", + "type": "", + "desc": "输入卡持有者时触发的事件", + "defaultValue": "" + }, + { + "name": "input-card-month", + "sample": "credit-card-form-events", + "type": "", + "desc": "选择月时触发的事件", + "defaultValue": "" + }, + { + "name": "input-card-year", + "sample": "credit-card-form-events", + "type": "", + "desc": "选择年时触发的事件", + "defaultValue": "" + }, + { + "name": "input-card-cvv", + "sample": "credit-card-form-events", + "type": "", + "desc": "输入 cvv 时触发的事件", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/credit-card.json b/examples/docs/resources/pc/api/zh-CN/credit-card.json new file mode 100644 index 000000000..30d37d79c --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/credit-card.json @@ -0,0 +1,32 @@ +{ + "attrs": [ + { + "name": "background-image", + "sample": "", + "type": "String , Object", + "desc": "设置卡片的背景图片", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "lables", + "sample": "", + "type": "Object", + "desc": "设置信用卡显示数据", + "defaultValue": "// 该属性的默认值为 \n{cardCvv: '', cardName: '', cardYear: '', cardMonth: '', cardNumber: ''}" + }, + { + "name": "fields", + "sample": "", + "type": "Object", + "desc": "卡片显示的条目对应表单内的输入框 ID", + "defaultValue": "" + }, + { + "name": "is-card-number-masked", + "sample": "", + "type": "Boolean", + "desc": "卡号是否打码", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/crop.json b/examples/docs/resources/pc/api/zh-CN/crop.json new file mode 100644 index 000000000..27e157a77 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/crop.json @@ -0,0 +1,302 @@ +{ + "attrs": [ + { + "name": "crop-type", + "sample": "get-cropped-canvas", + "type": "String", + "desc": "设置图片裁剪后返回的类型,可配置为 blob 和 base64,默认为 base64 。", + "defaultValue": "" + }, + { + "name": "preview", + "sample": "", + "type": "Boolean", + "desc": "设置裁剪区域图片是否可预览,默认为 false 。", + "defaultValue": "" + }, + { + "name": "quality", + "sample": "", + "type": "Number", + "desc": "设置图片裁剪后的压缩比例,值在 0-1 之间,默认为 0.92 。", + "defaultValue": "" + }, + { + "name": "src", + "sample": "no-background", + "type": "String", + "desc": "默认裁剪的源图片", + "defaultValue": "" + }, + { + "name": "view-mode", + "sample": "view-mode", + "type": "Number", + "desc": "定义 cropper 的视图模式;默认为 0;0:没有限制,3 可以移动到 2 外。1:3 只能在 2 内移动。2:2 图片不全部铺满 1 (即缩小时可以有一边出现空隙)。3:2 图片填充整个 1 。", + "defaultValue": "" + }, + { + "name": "drag-mode", + "sample": "drag-mode", + "type": "String", + "desc": "定义 cropper 的拖拽模式;默认为 'crop';'crop': 可以产生一个新的裁剪框 3 。'move':只可以移动图片 3 。'none': 什么也不处理。", + "defaultValue": "" + }, + { + "name": "aspect-ratio", + "sample": "aspect-ratio", + "type": "Number", + "desc": "裁剪框的宽高比;默认为 16 / 9", + "defaultValue": "" + }, + { + "name": "max-size", + "sample": "", + "type": "String", + "desc": "设置待裁剪图片的最大大小,默认为 1M ;默认为 1M", + "defaultValue": "" + }, + { + "name": "modal", + "sample": "no-modal", + "type": "Boolean", + "desc": "是否显示图片上方裁剪框下方的黑色模态;默认为 true", + "defaultValue": "" + }, + { + "name": "guides", + "sample": "no-guides", + "type": "Boolean", + "desc": "是否在裁剪框上方显示虚线;默认为 true", + "defaultValue": "" + }, + { + "name": "center", + "sample": "aspect-ratio", + "type": "Boolean", + "desc": "裁剪框是否在图片正中心;默认为 true", + "defaultValue": "" + }, + { + "name": "background", + "sample": "no-background", + "type": "Boolean", + "desc": "是否显示容器的网格背景;默认为 true", + "defaultValue": "" + }, + { + "name": "movable", + "sample": "drag-mode", + "type": "Boolean", + "desc": "是否允许可以移动后面的图片;默认为 true", + "defaultValue": "" + }, + { + "name": "rotatable", + "sample": "replace-image", + "type": "Boolean", + "desc": "是否允许旋转图像;默认为 true", + "defaultValue": "" + }, + { + "name": "zoomable", + "sample": "replace-image", + "type": "Boolean", + "desc": "是否允许放大图像;默认为 true", + "defaultValue": "" + }, + { + "name": "zoom-on-wheel", + "sample": "zoom-on-wheel", + "type": "Boolean", + "desc": "是否可以通过滚动鼠标滚轮来缩放图像;默认为 true", + "defaultValue": "" + }, + { + "name": "wheel-zoom-ratio", + "sample": "wheel-zoom-ratio", + "type": "Number", + "desc": "用鼠标移动图像时,定义缩放比例;默认为 0.1", + "defaultValue": "" + }, + { + "name": "min-container-width", + "sample": "min-crop-box-width-height", + "type": "Number", + "desc": "容器的最小宽度;默认为 652", + "defaultValue": "" + }, + { + "name": "min-container-height", + "sample": "min-crop-box-width-height", + "type": "Number", + "desc": "容器的最小高度;默认为 300", + "defaultValue": "" + }, + { + "name": "min-crop-box-width", + "sample": "min-crop-box-width-height", + "type": "Number", + "desc": "裁剪层的最小宽度;默认为 0", + "defaultValue": "" + }, + { + "name": "min-crop-box-height", + "sample": "min-crop-box-width-height", + "type": "Number", + "desc": "裁剪层的最小高度;默认为 0", + "defaultValue": "" + }, + { + "name": "auto-crop", + "sample": "auto-crop-area", + "type": "Boolean", + "desc": "初始化时,是否自动显示裁剪框;默认为 true", + "defaultValue": "" + }, + { + "name": "auto-crop-area", + "sample": "auto-crop-area", + "type": "Number", + "desc": "定义自动裁剪面积大小(百分比);默认为 0.8", + "defaultValue": "" + }, + { + "name": "cropvisible", + "sample": "min-crop-box-width-height", + "type": "Boolean", + "desc": "设置裁剪弹框是否可见;默认为 false", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "getCroppedCanvas", + "sample": "get-cropped-canvas", + "type": "", + "desc": "获取裁剪后的图片数据;.getCroppedCanvas().toDataURL():转成 base64 图片;.getCroppedCanvas().toBlob():生成 Blob 图片数据", + "defaultValue": "" + }, + { + "name": "replace", + "sample": "replace-image", + "type": "", + "desc": "替换图像的 src 并重新构建 cropper;参数为 图片 URL ", + "defaultValue": "" + }, + { + "name": "clear", + "sample": "get-data", + "type": "", + "desc": "清除裁切框", + "defaultValue": "" + }, + { + "name": "getData", + "sample": "get-data", + "type": "", + "desc": "获取最终裁剪的区域位置和大小数据(根据原始图像的自然大小);参数为 (rounded) ,默认 false,设置 true 可以获取其所有数据;返回的数据类型为 Object", + "defaultValue": "" + }, + { + "name": "getContainerData", + "sample": "get-container-data", + "type": "", + "desc": "获取 container 容器大小数据;返回的数据类型为 Object", + "defaultValue": "" + }, + { + "name": "getImageData", + "sample": "get-image-data", + "type": "", + "desc": "获取图像 image 位置、大小和其他相关数据;返回的数据类型为 Object", + "defaultValue": "" + }, + { + "name": "getCanvasData", + "sample": "get-image-data", + "type": "", + "desc": "获取画布 Canvas(图像包装器)位置和大小数据;返回的数据类型为 Object", + "defaultValue": "" + }, + { + "name": "getCropBoxData", + "sample": "get-crop-box-data", + "type": "", + "desc": "获取剪切框的位置和大小数据;返回的数据类型为 Object", + "defaultValue": "" + }, + { + "name": "setAspectRatio", + "sample": "aspect-ratio", + "type": "", + "desc": "改变裁切框的宽高比;参数为(aspectRatio),类型 Number,是一个正数", + "defaultValue": "" + }, + { + "name": "disable", + "sample": "crop-meth", + "type": "", + "desc": "禁用裁切框(裁切框不可移动)", + "defaultValue": "" + }, + { + "name": "enable", + "sample": "event-ready", + "type": "", + "desc": "启用裁切框", + "defaultValue": "" + }, + { + "name": "destroy", + "sample": "event-ready", + "type": "", + "desc": "销毁 cropper 并从图像中删除整个 cropper", + "defaultValue": "" + } + ], + "events": [ + { + "name": "ready", + "sample": "event-ready", + "type": "", + "desc": "当一个 cropper 实例完全构建时触发", + "defaultValue": "" + }, + { + "name": "cropdata", + "sample": "event-about-crop", + "type": "Function(data)", + "desc": "cropdata 事件回调函数中可以拿到裁剪后的数据,默认为 base64 数据", + "defaultValue": "" + }, + { + "name": "cropstart", + "sample": "event-about-crop", + "type": "", + "desc": "当画布(图像包装器)或剪切框开始发生变化时触发;回调参数为 (event: Event)", + "defaultValue": "" + }, + { + "name": "cropmove", + "sample": "event-about-crop", + "type": "", + "desc": "当画布(图像包装器)或剪切框正在发生变化时触发;回调参数为 (event: Event)", + "defaultValue": "" + }, + { + "name": "cropend", + "sample": "event-about-crop", + "type": "", + "desc": "当画布(图像包装器)或剪切框发生变化结束时触发;回调参数为 (event: Event)", + "defaultValue": "" + }, + { + "name": "crop", + "sample": "event-about-crop", + "type": "Function(value)", + "desc": "当画布(图像包装器)或裁剪框发生改变时触发;回调参数为 (event: Event),原生事件", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/currency.json b/examples/docs/resources/pc/api/zh-CN/currency.json new file mode 100644 index 000000000..b23ce0369 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/currency.json @@ -0,0 +1,67 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "String , Number", + "desc": "设置下拉框的值。", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "disable-currency", + "type": "String", + "desc": "设置输入框内的提示占位文本。", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "为 popper 添加类名(可参考 popover 组件)", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false (可参考 select 组件)", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "fetch-currency", + "sample": "custom-service", + "type": "Function", + "desc": "自定义金额查询接口,返回一个Promise对象", + "defaultValue": "" + }, + { + "name": "fields", + "sample": "custom-service", + "type": "Object", + "desc": "自定义数据映射,在没有使用框架服务时必填", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "输入框尺寸,只在 type!=\"textarea\" 时有效;该属性的可选值为 medium / small / mini", + "defaultValue": "" + }, + { + "name": "clearable", + "sample": "custom-service", + "type": "Boolean", + "desc": "是否显示清除按钮;是否可清空", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "disabled", + "sample": "disable-currency", + "type": "Boolen", + "desc": "禁用", + "defaultValue": "该属性的默认值为 false" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/date-picker-date-format.json b/examples/docs/resources/pc/api/zh-CN/date-picker-date-format.json new file mode 100644 index 000000000..2e0fc718f --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/date-picker-date-format.json @@ -0,0 +1,137 @@ +{ + "attrs": [ + { + "name": "yyyy", + "sample": "date", + "type": "", + "desc": "年", + "defaultValue": "该属性的默认值为 2017" + }, + { + "name": "M", + "sample": "date", + "type": "不补0", + "desc": "月", + "defaultValue": "该属性的默认值为 1" + }, + { + "name": "MM", + "sample": "date", + "type": "", + "desc": "月", + "defaultValue": "该属性的默认值为 01" + }, + { + "name": "W", + "sample": "date", + "type": "仅周选择器的 format 可用;不补0", + "desc": "周", + "defaultValue": "该属性的默认值为 1" + }, + { + "name": "WW", + "sample": "date", + "type": "仅周选择器的 format 可用", + "desc": "周", + "defaultValue": "该属性的默认值为 01" + }, + { + "name": "d", + "sample": "date", + "type": "不补0", + "desc": "日", + "defaultValue": "该属性的默认值为 1" + }, + { + "name": "dd", + "sample": "date", + "type": "", + "desc": "日", + "defaultValue": "该属性的默认值为 01" + }, + { + "name": "H", + "sample": "time-low", + "type": "24小时制;不补0", + "desc": "小时", + "defaultValue": "该属性的默认值为 1" + }, + { + "name": "HH", + "sample": "time-low", + "type": "24小时制", + "desc": "小时", + "defaultValue": "该属性的默认值为 01" + }, + { + "name": "h", + "sample": "time-low", + "type": "12小时制,须和 A 或 a 使用;不补0", + "desc": "小时", + "defaultValue": "该属性的默认值为 1" + }, + { + "name": "hh", + "sample": "time-low", + "type": "12小时制,须和 A 或 a 使用", + "desc": "小时", + "defaultValue": "该属性的默认值为 01" + }, + { + "name": "m", + "sample": "time-low", + "type": "不补0", + "desc": "分钟", + "defaultValue": "该属性的默认值为 4" + }, + { + "name": "mm", + "sample": "time-low", + "type": "", + "desc": "分钟", + "defaultValue": "该属性的默认值为 04" + }, + { + "name": "s", + "sample": "time-low", + "type": "不补0", + "desc": "秒", + "defaultValue": "该属性的默认值为 4" + }, + { + "name": "ss", + "sample": "time-low", + "type": "", + "desc": "秒", + "defaultValue": "该属性的默认值为 04" + }, + { + "name": "A", + "sample": "time-low", + "type": "仅 format 可用,大写", + "desc": "AM/PM", + "defaultValue": "该属性的默认值为 AM" + }, + { + "name": "a", + "sample": "time-low", + "type": "仅 format 可用,小写", + "desc": "am/pm", + "defaultValue": "该属性的默认值为 am" + }, + { + "name": "timestamp", + "sample": "format", + "type": "仅 value-format 可用;组件绑定值为number类型", + "desc": "JS时间戳", + "defaultValue": "该属性的默认值为 1483326245000" + }, + { + "name": "[MM]", + "sample": "", + "type": "使用方括号标识不需要格式化的字符 (如 [A] [MM])", + "desc": "不需要格式化字符", + "defaultValue": "该属性的默认值为 MM" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/date-picker-options.json b/examples/docs/resources/pc/api/zh-CN/date-picker-options.json new file mode 100644 index 000000000..4f38ef687 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/date-picker-options.json @@ -0,0 +1,32 @@ +{ + "attrs": [ + { + "name": "shortcuts", + "sample": "date-shortcuts", + "type": "Object", + "desc": "设置快捷选项,需要传入 { text, onClick } 对象用法参考 demo 或下表", + "defaultValue": "" + }, + { + "name": "disabledDate", + "sample": "max-min", + "type": "Function", + "desc": "设置禁用状态,参数为当前日期,要求返回 Boolean", + "defaultValue": "" + }, + { + "name": "firstDayOfWeek", + "sample": "date-range-shortcuts", + "type": "Number", + "desc": "周起始日;该属性的可选值为 1 到 7", + "defaultValue": "该属性的默认值为 7" + }, + { + "name": "onPick", + "sample": "date-range", + "type": "Function({ maxDate, minDate })", + "desc": "选中日期后会执行的回调,只有当 daterange 或 datetimerange 才生效", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/date-picker-shortcuts.json b/examples/docs/resources/pc/api/zh-CN/date-picker-shortcuts.json new file mode 100644 index 000000000..10aa162f6 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/date-picker-shortcuts.json @@ -0,0 +1,18 @@ +{ + "attrs": [ + { + "name": "text", + "sample": "date-shortcuts", + "type": "String", + "desc": "标题文本", + "defaultValue": "" + }, + { + "name": "onClick", + "sample": "date-shortcuts", + "type": "Function", + "desc": "选中后的回调函数,参数是 vm,可通过触发 'pick' 事件设置选择器的值。例如 vm.$emit('pick', new Date())", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/date-picker.json b/examples/docs/resources/pc/api/zh-CN/date-picker.json new file mode 100644 index 000000000..1cc5f0368 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/date-picker.json @@ -0,0 +1,232 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "Date / Array", + "desc": "设置日历组件的初始值。;绑定值", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "focus", + "type": "Boolean", + "desc": "禁用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "popper-append-to-body", + "sample": "popup-style-position", + "type": "Boolean", + "desc": "是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false (可参考 select 组件)", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "readonly", + "sample": "readonly", + "type": "Boolean", + "desc": "设置日历组件是否只读。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "editable", + "sample": "editable", + "type": "Boolean", + "desc": "文本框可输入", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "clearable", + "sample": "about-clear", + "type": "Boolean", + "desc": "是否显示清除按钮", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "size", + "sample": "set-size", + "type": "String", + "desc": "输入框尺寸;该属性的可选值为 medium,small, mini", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "other-picker-type", + "type": "String", + "desc": "非范围选择时的占位内容", + "defaultValue": "该属性的默认值为 []" + }, + { + "name": "start-placeholder", + "sample": "custom-range", + "type": "String", + "desc": "范围选择时开始日期的占位内容", + "defaultValue": "" + }, + { + "name": "end-placeholder", + "sample": "custom-range", + "type": "String", + "desc": "范围选择时结束日期的占位内容", + "defaultValue": "" + }, + { + "name": "type", + "sample": "other-picker-type", + "type": "String", + "desc": "显示类型;该属性的可选值为 year / month / dates / week / daterange / date / datetime / datetimerange / monthrange", + "defaultValue": "该属性的默认值为 date" + }, + { + "name": "format", + "sample": "about-format", + "type": "String", + "desc": "显示在输入框中的格式", + "defaultValue": "该属性的默认值为 yyyy-MM-dd" + }, + { + "name": "value-format", + "sample": "about-format", + "type": "String", + "desc": "指定绑定值的格式。不指定则绑定值为 Date 对象", + "defaultValue": "该属性的默认值为 Date 对象" + }, + { + "name": "time-format", + "sample": "", + "type": "String", + "desc": "当自定义的format格式无法自动区分时间与日期时可配置该选项用来辅助确定格式", + "defaultValue": "" + }, + { + "name": "isutc8", + "sample": "utc8", + "type": "Boolean", + "desc": "默认值为 false ,设置为 true 时切换系统默认时区,时间依然显示为东八区时间。适用场景为海外地区显示东八区时间", + "defaultValue": "" + }, + { + "name": "align", + "sample": "align", + "type": "String", + "desc": "对齐方式;该属性的可选值为 left / center / right", + "defaultValue": "该属性的默认值为 left" + }, + { + "name": "show-timezone", + "sample": "timezone", + "type": "Boolean", + "desc": "是否开启设置日期选择面板时区选择", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "popper-class", + "sample": "custom-suffix-icon1", + "type": "String", + "desc": "为 DatePicker 下拉弹框添加的 class 类名", + "defaultValue": "" + }, + { + "name": "picker-options", + "sample": "date-range-shortcuts", + "type": "Object", + "desc": "当前时间日期选择器特有的选项参考下表", + "defaultValue": "该属性的默认值为 {}" + }, + { + "name": "range-separator", + "sample": "custom-range", + "type": "String", + "desc": "选择范围时的分隔符", + "defaultValue": "该属性的默认值为 - " + }, + { + "name": "default-value", + "sample": "default-value", + "type": "Date", + "desc": "可选,当选中的日期值为空时,选择器面板打开时默认显示的时间,需设置为可被new Date()解析的值", + "defaultValue": "" + }, + { + "name": "default-time", + "sample": "default-time-of-range", + "type": "String", + "desc": "范围选择时选中日期所使用的当日内具体时刻;该属性的可选值为 见日期格式", + "defaultValue": "" + }, + { + "name": "name", + "sample": "timezone", + "type": "String", + "desc": "原生属性", + "defaultValue": "" + }, + { + "name": "unlink-panels", + "sample": "unlink-panels", + "type": "Boolean", + "desc": "在范围选择器里取消两个日期面板之间的联动", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "suffix-icon ", + "sample": "custom-suffix-icon", + "type": "Object", + "desc": "自定义选择器的后置图标", + "defaultValue": "该属性的默认值为 IconCalendar," + }, + { + "name": "clear-icon", + "sample": "about-clear", + "type": "String", + "desc": "自定义清空图标", + "defaultValue": "该属性的默认值为 IconOperationfaild" + }, + { + "name": "time-arrow-control", + "sample": "time-arrow-control", + "type": "Boolean", + "desc": "通过箭头按钮控制时间选择,当 type 为 datetime、datetimerange 时使用;默认为 通过鼠标滚轮滚动选择时间", + "defaultValue": "" + }, + { + "name": "validate-event", + "sample": "validate-event", + "type": "Boolean", + "desc": "设置日期选择器在输入时是否会触发表单校验;默认为 true", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "focus", + "sample": "focus", + "type": "", + "desc": "使 input 获取焦点", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "date-picker-events", + "type": "Function(arg1)", + "desc": "用户确认选定的值时触发;change(arg1){ // arg1为datepicker改变后的日期或者是日期集}", + "defaultValue": "" + }, + { + "name": "blur", + "sample": "date-picker-events", + "type": "Function", + "desc": "当 input 失去焦点时触发;blur() { \n//do something you want...\n}", + "defaultValue": "" + }, + { + "name": "focus", + "sample": "date-picker-events", + "type": "Function(arg1)", + "desc": "当 input 获得焦点时触发;focus(arg1}{ \n// arg1 = 对组件vue实例 \n//do something you want...\n}", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/dept.json b/examples/docs/resources/pc/api/zh-CN/dept.json new file mode 100644 index 000000000..4e75ac4c5 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/dept.json @@ -0,0 +1,120 @@ +{ + "attrs": [ + { + "name": "value", + "sample": "size", + "type": "String ", + "desc": "设置部门组件的初始化时的显示值。", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String ", + "desc": "设置组件大小", + "defaultValue": "" + }, + { + "name": "title", + "sample": "", + "type": "String ", + "desc": "设置弹窗标题", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolen", + "desc": "禁用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "autoSelect", + "sample": "auto-select", + "type": "Boolen", + "desc": "设置当部门信息仅一条数据时时自动补全选中", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "fetchDeptList", + "sample": "custom-service", + "type": "Function", + "desc": "自定义部门列表查询接口,返回一个Promise对象,未使用框架服务时必填", + "defaultValue": "" + }, + { + "name": "fetchDeptByValue", + "sample": "custom-service", + "type": "Function", + "desc": "自定义部门详情查询接口,返回一个Promise对象,未使用框架服务时必填", + "defaultValue": "" + }, + { + "name": "fetchDept", + "sample": "custom-service", + "type": "Function", + "desc": "自定义部门搜索查询接口,返回一个Promise对象,未使用框架服务时必填", + "defaultValue": "" + }, + { + "name": "beforeConfirm", + "sample": "before-confirm", + "type": "Function", + "desc": "确认之前的钩子,若返回 false 或者返回 Promise 且被 reject,则阻止弹框关闭", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "hrapprover", + "sample": "slot-hrapprover", + "type": "", + "desc": "权签人", + "defaultValue": "" + } + ], + "events": [ + { + "name": "confirm", + "sample": "dept-confirm", + "type": "Function", + "desc": "点击确认按钮触发的事件。", + "defaultValue": "" + }, + { + "name": "cancel", + "sample": "dept-cancel", + "type": "Function", + "desc": "点击取消按钮触发的事件。", + "defaultValue": "" + }, + { + "name": "selected", + "sample": "dept-selected", + "type": "Function(value)", + "desc": "点击选中部门触发的事件,回调参数为选中的部门编码。", + "defaultValue": "" + }, + { + "name": "open", + "sample": "dept-events", + "type": "Function", + "desc": "点击弹出弹框触发的事件。", + "defaultValue": "" + }, + { + "name": "change", + "sample": "dept-events", + "type": "Function(value)", + "desc": "选择的部门值改变时触发,回调参数为改变后的部门编码。;value: 改变后的值", + "defaultValue": "" + }, + { + "name": "close", + "sample": "dept-close", + "type": "Function", + "desc": "关闭部门弹出框时触发该事件。", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/detail-page.json b/examples/docs/resources/pc/api/zh-CN/detail-page.json new file mode 100644 index 000000000..fee8024df --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/detail-page.json @@ -0,0 +1,67 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "", + "type": "Array", + "desc": "设置表头详情栏的数据", + "defaultValue": "" + }, + { + "name": "title", + "sample": "custom-show-text", + "type": "String", + "desc": "详情栏标题;默认为 '带表头的详情栏'", + "defaultValue": "" + }, + { + "name": "text-split", + "sample": "custom-show-text", + "type": "String", + "desc": "详情栏标题分隔符;默认为 ':'", + "defaultValue": "" + }, + { + "name": "dialog-title", + "sample": "custom-show-text", + "type": "String", + "desc": "个性化弹窗标题;默认为 '个性化设置'", + "defaultValue": "" + }, + { + "name": "label-title", + "sample": "custom-show-text", + "type": "String", + "desc": "个性化弹窗表头文本标题栏字段;默认为 '字段'", + "defaultValue": "" + }, + { + "name": "tips", + "sample": "custom-show-text", + "type": "String", + "desc": "提示不能全部隐藏的提示语;默认为 '至少显示一个'", + "defaultValue": "" + }, + { + "name": "value-title", + "sample": "custom-show-text", + "type": "String", + "desc": "个性化弹窗表头文本操作栏字段;默认为 '隐藏'", + "defaultValue": "" + }, + { + "name": "save-button", + "sample": "custom-show-text", + "type": "String", + "desc": "个性化弹窗确定按钮的文本;默认为 '确 定'", + "defaultValue": "" + }, + { + "name": "cancel-button", + "sample": "custom-show-text", + "type": "String", + "desc": "个性化弹窗取消按钮的文本;默认为 '取 消'", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/dialog-box.json b/examples/docs/resources/pc/api/zh-CN/dialog-box.json new file mode 100644 index 000000000..5010b6a7c --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/dialog-box.json @@ -0,0 +1,204 @@ +{ + "attrs": [ + { + "name": "center", + "sample": "center", + "type": "Boolean", + "desc": "设置为 true 时 弹出框的头部与底部内容会自动居中", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "is-form-reset", + "sample": "form-in-dialog", + "type": "Boolean", + "desc": "关闭弹窗,默认重置表单数据", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "show-close", + "sample": "hidden-close-buttons", + "type": "Boolean", + "desc": "是否显示关闭按钮", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "draggable", + "sample": "draggable", + "type": "Boolean", + "desc": "是否开启弹窗的拖拽功能,默认值为 false 。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "fullscreen", + "sample": "fullscreen", + "type": "Boolean", + "desc": "弹出框是否全屏", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "modal", + "sample": "no-modal", + "type": "Boolean", + "desc": "是否启用遮罩层", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "close-on-click-modal", + "sample": "close-on-click-modal", + "type": "Boolean", + "desc": "是否可以通过点击遮罩层关闭弹窗,默认为 true ,可以在标签上设置:modal-closable=\"false\"不能通过点击遮罩层关闭弹窗。", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "close-on-press-escape", + "sample": "close-on-press-escape", + "type": "Boolean", + "desc": "是否可以通过 ESC 键关闭遮罩层", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "modal-append-to-body", + "sample": "right-dialog", + "type": "Boolean", + "desc": "遮罩层是否应用到 body 上,为 false 时遮罩层会应用到 DialogBox 的父元素上", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "append-to-body", + "sample": "secondary-dialog", + "type": "Boolean", + "desc": "DialogBox 本身是否插入到 body 上,嵌套的 Dialog 必须指定该属性并赋值为 true", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "right-slide", + "sample": "right-dialog", + "type": "Boolean", + "desc": "是否开启弹出右侧滑出功能,默认值为 false 。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "lock-scroll", + "sample": "lock-scroll", + "type": "Boolean", + "desc": "Dialog弹出时是否禁用滚动条", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "show-header", + "sample": "hidden-header", + "type": "Boolean", + "desc": "是否显示弹窗头部 header,默认值为 true 。", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "title", + "sample": "custom-dialog-title", + "type": "String", + "desc": "弹出框标题。", + "defaultValue": "" + }, + { + "name": "top", + "sample": "dialog-top-height", + "type": "String", + "desc": "设置弹出框距离窗口顶部的高度,默认为屏高的 15%", + "defaultValue": "该属性的默认值为 15vh" + }, + { + "name": "visible", + "sample": "basic-usage", + "type": "Boolean", + "desc": "控制弹出框显示与关闭", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "width", + "sample": "dialog-width", + "type": "String", + "desc": "弹出框的宽度。", + "defaultValue": "该属性的默认值为 500px" + }, + { + "name": "dialog-class", + "sample": "dialog-width", + "type": "String", + "desc": "自定义配置弹窗类名", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-dialog-content", + "type": "", + "desc": "Dialog 的内容", + "defaultValue": "" + }, + { + "name": "title", + "sample": "custom-dialog-title", + "type": "", + "desc": "Dialog 标题区的内容", + "defaultValue": "" + }, + { + "name": "footer", + "sample": "custom-dialog-footer", + "type": "", + "desc": "Dialog 按钮操作区的内容", + "defaultValue": "" + } + ], + "events": [ + { + "name": "close", + "sample": "open-close-events", + "type": "Function()", + "desc": "Dialog 关闭的回调;Dialog 关闭的回调;无arguments", + "defaultValue": "" + }, + { + "name": "open", + "sample": "open-close-events", + "type": "Function()", + "desc": "Dialog 打开的回调;Dialog 打开的回调;无arguments", + "defaultValue": "" + }, + { + "name": "opened", + "sample": "open-close-events", + "type": "Function()", + "desc": "Dialog 打开动画结束时的回调;无arguments", + "defaultValue": "" + }, + { + "name": "closed", + "sample": "open-close-events", + "type": "Function()", + "desc": "Dialog 关闭动画结束时的回调;无arguments", + "defaultValue": "" + }, + { + "name": "drag-start", + "sample": "draggable", + "type": "Function(arg)", + "desc": "Dialog 拖拽开始事件;arg:event(包含弹窗的位置等信息)", + "defaultValue": "" + }, + { + "name": "drag-move", + "sample": "draggable", + "type": "Function(arg)", + "desc": "Dialog 拖拽移动事件;arg:event(包含弹窗的位置等信息)", + "defaultValue": "" + }, + { + "name": "drag-end", + "sample": "draggable", + "type": "Function(arg)", + "desc": "Dialog 拖拽结束事件;arg:event(包含弹窗的位置等信息)", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/drop-roles.json b/examples/docs/resources/pc/api/zh-CN/drop-roles.json new file mode 100644 index 000000000..c2362d1c2 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/drop-roles.json @@ -0,0 +1,69 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "change-role-event", + "type": "String , Number", + "desc": "设置文本显示的值。;绑定值", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "设置组件大小", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "custom-service", + "type": "String", + "desc": "设置输入框内的提示占位文本。", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "为 popper 添加类名(可参考 popover 组件)", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false (可参考 select 组件)", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "fetchRole", + "sample": "custom-service", + "type": "Object", + "desc": "自定义获取角色列表接口,未使用框架服务时必填", + "defaultValue": "" + }, + { + "name": "fetchCurrentRole", + "sample": "custom-service", + "type": "Object", + "desc": "自定义获取当前用户角色接口,未使用框架服务时必填", + "defaultValue": "" + }, + { + "name": "fields", + "sample": "custom-service", + "type": "Object", + "desc": "自定义数据映射,未使用框架服务时必填", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "change-role-event", + "type": "", + "desc": "当前角色切换后触发", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/drop-times.json b/examples/docs/resources/pc/api/zh-CN/drop-times.json new file mode 100644 index 000000000..c2b921dd4 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/drop-times.json @@ -0,0 +1,69 @@ +{ + "attrs": [ + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "设置组件大小,可以设置为:medium,small,mini", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "为 DropTimes 下拉弹框添加的 class 类名", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false (可参考 select 组件)", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "modelValue / v-model", + "sample": "start-end-step", + "type": "—", + "desc": "绑定值", + "defaultValue": "该属性的默认值为 {}" + }, + { + "name": "placeholder", + "sample": "start-end-step", + "type": "String", + "desc": "设置输入框内的提示占位文本", + "defaultValue": "" + }, + { + "name": "end", + "sample": "start-end-step", + "type": "Number", + "desc": "结束时间,以分钟计算,默认值为 1440。", + "defaultValue": "该属性的默认值为 1440" + }, + { + "name": "start", + "sample": "start-end-step", + "type": "Number", + "desc": "开始时间,以分钟计算,默认值为 0。", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "step", + "sample": "start-end-step", + "type": "Number", + "desc": "间隔时间,以分钟计算,默认值为 15。", + "defaultValue": "该属性的默认值为 15" + } + ], + "events": [ + { + "name": "change", + "sample": "start-end-step", + "type": "", + "desc": "下拉切换当前时间后触发该事件", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/dropdown-item.json b/examples/docs/resources/pc/api/zh-CN/dropdown-item.json new file mode 100644 index 000000000..def0a25b8 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/dropdown-item.json @@ -0,0 +1,41 @@ +{ + "attrs": [ + { + "name": "type", + "sample": "events", + "type": "", + "desc": " 组件绑定 item-click 时能获取的数据。", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "", + "desc": "禁用。默认:false", + "defaultValue": "" + }, + { + "name": "divided", + "sample": "hide-on-click", + "type": "", + "desc": "显示分割线。默认值:false", + "defaultValue": "" + }, + { + "name": "icon", + "sample": "trigger", + "type": "", + "desc": "内嵌图标。", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "basic-usage", + "type": "", + "desc": "下拉列表选项内容。", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/dropdown-menu.json b/examples/docs/resources/pc/api/zh-CN/dropdown-menu.json new file mode 100644 index 000000000..00854ca80 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/dropdown-menu.json @@ -0,0 +1,48 @@ +{ + "attrs": [ + { + "name": "type", + "sample": "basic-usage", + "type": "", + "desc": "设置弹出下拉是否显示箭头。", + "defaultValue": "" + }, + { + "name": "arrow-offset", + "sample": "basic-usage", + "type": "", + "desc": "设置弹出下拉箭头偏移量,默认:0", + "defaultValue": "" + }, + { + "name": "placement", + "sample": "basic-usage", + "type": "", + "desc": "菜单弹出位置。可选值(top/top-start/top-end/bottom/bottom-start/bottom-end),默认:bottom-end", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "basic-usage", + "type": "", + "desc": "设置弹出下拉自定义样式。", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "basic-usage", + "type": "", + "desc": "设置弹出下拉是否创建在 body 元素下方。", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "basic-usage", + "type": "", + "desc": "下拉列表选项通常是 组件。", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/dropdown.json b/examples/docs/resources/pc/api/zh-CN/dropdown.json new file mode 100644 index 000000000..a1d8316b6 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/dropdown.json @@ -0,0 +1,198 @@ +{ + "attrs": [ + { + "name": "type", + "sample": "split-button", + "type": "String", + "desc": "菜单按钮类型,同 Button 组件(只在split-button为 true 的情况下有效)。", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "菜单尺寸,在split-button为 true 的情况下也对触发按钮生效。可选值(medium / small / mini)", + "defaultValue": "" + }, + { + "name": "split-button", + "sample": "split-button", + "type": "Boolean", + "desc": "下拉触发元素呈现为按钮组。默认值:false", + "defaultValue": "false" + }, + { + "name": "trigger", + "sample": "trigger", + "type": "String", + "desc": "触发下拉的行为。可选值(hover, click),默认值:hover", + "defaultValue": "hover" + }, + { + "name": "hide-on-click", + "sample": "hide-on-click", + "type": "Boolean", + "desc": "是否在点击菜单项后隐藏菜单。默认为 true。", + "defaultValue": "true" + }, + { + "name": "show-timeout", + "sample": "trigger", + "type": "Number", + "desc": "展开下拉菜单的延时(仅在 trigger 为 hover 时有效)。默认:250 毫秒", + "defaultValue": "" + }, + { + "name": "hide-timeout", + "sample": "trigger", + "type": "Number", + "desc": "收起下拉菜单的延时(仅在 trigger 为 hover 时有效)。默认:150 毫秒", + "defaultValue": "" + }, + { + "name": "tabindex", + "sample": "basic-usage", + "type": "Number", + "desc": "Dropdown 组件的 tabindex。", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "是否禁用。默认值:false", + "defaultValue": "false" + }, + { + "name": "menu-options", + "sample": "options", + "type": "Object", + "desc": "配置式配置 DropdownMenu 属性", + "defaultValue": "{\"options\":[],\"textField\":\"label\",\"popper-class\":\"\",\"placement\":\"bottom-end\"}" + }, + { + "name": "title", + "sample": "options", + "type": "String", + "desc": "不使用默认插槽时,title属性可以配置菜单标题", + "defaultValue": "下拉菜单" + } + ], + "slots": [ + { + "name": "default", + "sample": "basic-usage", + "type": "", + "desc": "触发下拉列表显示的元素。 注意: 必须是一个元素或者或者组件。", + "defaultValue": "" + }, + { + "name": "dropdown", + "sample": "basic-usage", + "type": "", + "desc": "下拉列表,通常是 组件。", + "defaultValue": "" + } + ], + "events": [ + { + "name": "button-click", + "sample": "events", + "type": "Function", + "desc": "split-button 为 true 时,点击左侧按钮的事件回调。", + "defaultValue": "Function" + }, + { + "name": "item-click", + "sample": "events", + "type": "Function", + "desc": "点击菜单项触发的事件回调。返回数据data为Object类型,对象包含字段 itemData 和 vm 字段,itemData 为当前选中项的数据(仅配置式时生效),vm 为当前选中项的实例", + "defaultValue": "Function(data:Object)" + }, + { + "name": "visible-change", + "sample": "events", + "type": "Function", + "desc": "下拉框显示/隐藏时触发。回调参数 status 为 Boolean 类型,true 表示显示,false 表示隐藏", + "defaultValue": "Function(status:Boolean)" + } + ], + "dropdownMenuattrs": [ + { + "name": "placement", + "sample": "basic-usage", + "type": "String", + "desc": "菜单弹出位置。可选值(top/top-start/top-end/bottom/bottom-start/bottom-end),默认:bottom-end", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "basic-usage", + "type": "", + "desc": "设置弹出下拉自定义样式。", + "defaultValue": "" + }, + { + "name": "options", + "sample": "options", + "type": "Array", + "desc": "通过配置式设置菜单项的属性", + "defaultValue": "[]" + }, + { + "name": "text-field", + "sample": "options", + "type": "String", + "desc": "结合options 属性使用,指定菜单项的显示文案的字段,默认字段为 label", + "defaultValue": "label" + } + ], + "dropdownMenuslots": [ + { + "name": "default", + "sample": "basic-usage", + "type": "", + "desc": "下拉列表选项通常是 组件。", + "defaultValue": "" + } + ], + "dropdownItemattrs": [ + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "禁用。默认:false", + "defaultValue": "false" + }, + { + "name": "divided", + "sample": "hide-on-click", + "type": "Boolean", + "desc": "显示分割线。默认值:false", + "defaultValue": "false" + }, + { + "name": "icon", + "sample": "trigger", + "type": "Object", + "desc": "内嵌图标。", + "defaultValue": "" + }, + { + "name": "label", + "sample": "basic-usage", + "type": "String", + "desc": "菜单项的显示值", + "defaultValue": "" + } + ], + "dropdownItemslots": [ + { + "name": "default", + "sample": "basic-usage", + "type": "", + "desc": "下拉列表选项内容。", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/espace.json b/examples/docs/resources/pc/api/zh-CN/espace.json new file mode 100644 index 000000000..9981b2d7d --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/espace.json @@ -0,0 +1,11 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "support-open-espace", + "type": "Array , Object", + "desc": "设置组件数据,数组对象中包含选项有 type、value、icon。type 的可选择值有:im、sip、mailto", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/fall-menu.json b/examples/docs/resources/pc/api/zh-CN/fall-menu.json new file mode 100644 index 000000000..7665a3706 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/fall-menu.json @@ -0,0 +1,48 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "data-resource", + "type": "Object , Array", + "desc": "设置瀑布菜单的数据。;设置瀑布菜单的数据。", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "level1", + "sample": "custom-menuitem", + "type": "", + "desc": "自定义一级菜单", + "defaultValue": "" + }, + { + "name": "level2", + "sample": "custom-menuitem", + "type": "", + "desc": "自定义二级菜单", + "defaultValue": "" + }, + { + "name": "level3", + "sample": "custom-menuitem", + "type": "", + "desc": "自定义三级菜单", + "defaultValue": "" + }, + { + "name": "left", + "sample": "custom-slider-icon", + "type": "", + "desc": "自定义左侧切换图标", + "defaultValue": "" + }, + { + "name": "right", + "sample": "custom-slider-icon", + "type": "", + "desc": "自定义右侧切换图标", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/file-upload.json b/examples/docs/resources/pc/api/zh-CN/file-upload.json new file mode 100644 index 000000000..97a78e395 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/file-upload.json @@ -0,0 +1,332 @@ +{ + "attrs": [ + { + "name": "action", + "sample": "basic-usage", + "type": "String", + "desc": "上传的地址,当不配置 action 时,会生成默认网关链接", + "defaultValue": "" + }, + { + "name": "open-download-file", + "sample": "upload-file-list", + "type": "Boolean", + "desc": "是否开启点击下载文件,默认不开启 false", + "defaultValue": "" + }, + { + "name": "headers", + "sample": "custom-upload-request", + "type": "Object", + "desc": "设置上传的请求头部;可通过配置 headers 为头部请求信息, 例如 ①:headers='headers' ②headers:{'Accept-Language': 'en,zh',Authorization: 'Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ=='}", + "defaultValue": "" + }, + { + "name": "multiple", + "sample": "multiple-file", + "type": "Boolean", + "desc": "是否支持多选文件", + "defaultValue": "" + }, + { + "name": "data", + "sample": "basic-usage", + "type": "Object", + "desc": "上传时附带的额外参数", + "defaultValue": "" + }, + { + "name": "name", + "sample": "upload-file-list", + "type": "String", + "desc": "上传的文件字段名", + "defaultValue": "该属性的默认值为 file" + }, + { + "name": "with-credentials", + "sample": "upload-request1", + "type": "Boolean", + "desc": "支持发送 cookie 凭证信息", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "show-file-list", + "sample": "upload-file-list", + "type": "Boolean", + "desc": "是否显示已上传文件列表", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "drag", + "sample": "drag-upload", + "type": "Boolean", + "desc": "是否启用拖拽上传", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "accept", + "sample": "accept-file-image", + "type": "String", + "desc": "接受上传的文件类型(thumbnail-mode 模式下此参数无效)", + "defaultValue": "" + }, + { + "name": "before-upload", + "sample": "prevent-upload-file", + "type": "Function(file)", + "desc": "上传文件之前的钩子,参数为上传的文件,若返回 false 或者返回 Promise 且被 reject,则停止上传。", + "defaultValue": "" + }, + { + "name": "list-type", + "sample": "picture-card", + "type": "String", + "desc": "文件列表的类型;该属性的可选值为 text / picture / picture-card / thumb", + "defaultValue": "该属性的默认值为 text" + }, + { + "name": "thumb-option", + "sample": "upload-file-list-thumb", + "type": "Object", + "desc": "文件列表的显示类型为 thumb 时,相关配置;popperClass 弹窗列表自定义类名;width 弹窗宽度,默认270,number类型;showDownload 是否显示下载按钮,布尔值默认为false;showDel 是否显示删除按钮,布尔值默认为false;downloadFile 点击下载按钮执行函数,开启 EDM 模式配置必要的token后即可下载,可省略该配置;show-tooltip 文件名超出隐藏显示时是否启用tip,默认值为false;列表结果前 icon,默认为 icon-attachment", + "defaultValue": "" + }, + { + "name": "before-remove", + "sample": "prevent-delete-file", + "type": "Function(file, fileList)", + "desc": "删除文件之前的钩子,参数为上传的文件和文件列表,若返回 false 或者返回 Promise 且被 reject,则停止删除", + "defaultValue": "" + }, + { + "name": "auto-upload", + "sample": "manual-upload", + "type": "Boolean", + "desc": "是否在选取文件后立即进行上传", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "file-list", + "sample": "accept-file-image", + "type": "Array", + "desc": "上传的文件列表, 例如: [{name: 'food.jpg', url: 'https://xxx.cdn.com/xxx.jpg'}]", + "defaultValue": "" + }, + { + "name": "http-request", + "sample": "http-request", + "type": "Function", + "desc": "覆盖默认的上传行为,可以自定义上传的实现;httpRequest: () => {this.$service.network.post('localhost:3000/tiny/upload', ['data']).then(res => {// 此处服务为自定义服务,由于 TinyVue 官网为 Mock 上传不能执行上传})}", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "", + "type": "Boolean", + "desc": "是否禁用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "limit", + "sample": "upload-limit", + "type": "Number", + "desc": "最大允许上传个数", + "defaultValue": "" + }, + { + "name": "edm", + "sample": "", + "type": "Object", + "desc": "使用 EDM 的上传下载预览功能,可在该对象里边配置上传、下载、预览功能的参数", + "defaultValue": "" + }, + { + "name": "token", + "sample": "", + "type": "Function", + "desc": "使用 EDM 上传下载预览所需的token,返回值为 Promise", + "defaultValue": "" + }, + { + "name": "isFolder", + "sample": "edm-folder-upload", + "type": "Boolean", + "desc": "配置为 true,启用 EDM 上传文件夹的功能,最多只能上传 5 层;{edm:upload:{plugin:sha256,isFolder:true,token:()=>{}}}", + "defaultValue": "" + }, + { + "name": "fileSize", + "sample": "", + "type": "Number | Array", + "desc": "限制文件大,小单位为 KB;启用 EDM 上传时设置有效;当为 Number 类型时,小于该值停止上传;为数组时[min,max] 设置上传范围,值为 Number 类型;最大值不能超过 2G;设置为数组时最大值将与 EDM 服务侧设置的值做对比,取最小值", + "defaultValue": "" + }, + { + "name": "packageToken", + "sample": "", + "type": "Function", + "desc": "配置 EDM 批量打包下载的 token;配置结构为 edm:{download:packageToken:()=>{}},返回一个 Promise", + "defaultValue": "" + }, + { + "name": "upload", + "sample": "", + "type": "Object", + "desc": "配置 EDM 上传功能所需的参数,例如:edm:{upload:{plugin:sha256,token:()=>{}}},plugin 为第三方依赖可生成文档内容校验 hash 值,token为鉴权token,类型为Function,返回 Promise", + "defaultValue": "" + }, + { + "name": "download", + "sample": "", + "type": "Object", + "desc": "配置 EDM 下载功能所需的参数,例如:edm:{download:{token:()=>{}}},token为鉴权token", + "defaultValue": "" + }, + { + "name": "preivew", + "sample": "", + "type": "Object", + "desc": "配置 EDM 预览功能所需的参数,例如:edm:{preview:{plugin:util.default,previewUrl:./_index.html?appid=应用Id,packageName: 'jslib',token:()=>{}}}", + "defaultValue": "" + }, + { + "name": "mergeService", + "sample": "", + "type": "Boolean", + "desc": "配置 mergeService 为true 且开启多文件上传走默认服务会将多个上传服务合并为一个服务上传", + "defaultValue": "" + }, + { + "name": "updateId", + "sample": "", + "type": "String", + "desc": "EDM 需要更新文档的 docId", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "trigger", + "sample": "custom-trigger", + "type": "", + "desc": "触发文件选择框的内容", + "defaultValue": "" + }, + { + "name": "tip", + "sample": "custom-upload-tip", + "type": "", + "desc": "提示说明文字", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "clearFiles", + "sample": "clear-files", + "type": "", + "desc": "清空已上传的文件列表(该方法不支持在 before-upload 中调用)", + "defaultValue": "" + }, + { + "name": "abort", + "sample": "abort-quest", + "type": "", + "desc": "取消上传请求", + "defaultValue": "" + }, + { + "name": "submit", + "sample": "manual-upload", + "type": "", + "desc": "手动上传文件列表", + "defaultValue": "" + }, + { + "name": "downloadFile", + "sample": "", + "type": "", + "desc": "下载 EDM 文件", + "defaultValue": "" + }, + { + "name": "previewFile", + "sample": "", + "type": "", + "desc": "预览 EDM 文件", + "defaultValue": "" + }, + { + "name": "getNewTabPreviewUrl", + "sample": "", + "type": "", + "desc": "预览 EDM 文件预览的 Url,返回值为 Promise", + "defaultValue": "" + }, + { + "name": "handleRemove", + "sample": "", + "type": "", + "desc": "手动移除 EDM 文件", + "defaultValue": "" + } + ], + "events": [ + { + "name": "drop-error", + "sample": "drag-upload", + "type": "Function(arg1)", + "desc": "拖拽文件失败时触发的事件,开启拖拽时有效。;dropError(arg1){\n// arg1 上传失败文件信息\n {name: 上传文件名,\npercentage: 上传进度百分比,\nraw: 文件信息,\nsize: 文件大小,\nstatus: 上传状态,\nuid: uid} \n// do something you want... }", + "defaultValue": "" + }, + { + "name": "preview", + "sample": "upload-events", + "type": "Function(arg1)", + "desc": "点击文件列表中已上传的文件时触发的事件;preview(arg1){\n arg1 = {name: 上传文件名,percentage: 上传进度百分比,raw: 文件信息,size: 文件大小,status: 上传状态,uid: uid}}", + "defaultValue": "" + }, + { + "name": "remove", + "sample": "upload-events", + "type": "Function(arg1)", + "desc": "从文件列表移除文件时触发的事件;onRomove(arg1){\n //arg1当前移除的文件信息:\n{name: 上传文件名,percentage: 上传进度百分比,raw: 文件信息,size: 文件大小,status: 上传状态,uid: uid }\n// do something you want...}", + "defaultValue": "" + }, + { + "name": "error", + "sample": "upload-events", + "type": "Function(arg1,arg2,arg3)", + "desc": "文件上传失败时触发的事件;onError(arg1,arg2, arg3 ){\n arg1 = 错误信息\n arg2 = {name: 上传文件名,percentage: 上传进度百分比,raw: 文件信息,size: 文件大小,status: 上传状态,uid: uid } arg2为当前上传失败文件信息// arg3 = [] 数组类型Array 上传成功file数组// do something you want...}", + "defaultValue": "" + }, + { + "name": "exceed", + "sample": "upload-events", + "type": "", + "desc": "文件超出个数限制时触发的事件", + "defaultValue": "" + }, + { + "name": "progress", + "sample": "upload-events", + "type": "Function(arg1,arg2)", + "desc": "文件上传时触发的事件;progress(arg1,arg2){\narg1 = event 对象 当前event对象\n arg2 = {name: 上传文件名,percentage: 上传进度百分比,raw: 文件信息,size: 文件大小, status: 上传状态,uid: uid } arg2为上传的文件信息\n// do something you want...}", + "defaultValue": "" + }, + { + "name": "change", + "sample": "upload-events", + "type": "Function(file, fileList)", + "desc": "文件状态改变时触发的事件,添加文件、上传成功和上传失败时都会被触发;change(file, fileList)\n//file 当前上传成功文件信息 \n {name: 上传文件名,percentage: 上传进度百分比,raw: 文件信息,size: 文件大小,status: 上传状态,uid: uid } \n// fileList: 数组类型Array 上传成功file数\n}", + "defaultValue": "" + }, + { + "name": "success", + "sample": "upload-events", + "type": "Function(arg1,arg2,arg3)", + "desc": "文件上传成功时触发的事件;success(arg1,arg2,arg3){// arg1 = res arg1为上传成功后的响应信息// arg2 = {name: 上传文件名,percentage: 上传进度百分比,raw: 文件信息,size: 文件大小,status: 上传状态,uid: uid} arg2为当前上传的文件// arg3 = [ ] arg3为所有上传文件数组// do something you want...}", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/floatbar.json b/examples/docs/resources/pc/api/zh-CN/floatbar.json new file mode 100644 index 000000000..32f04010e --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/floatbar.json @@ -0,0 +1,11 @@ +{ + "slots": [ + { + "name": "default", + "sample": "custom-style", + "type": "", + "desc": "浮动块内容。", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/form-item.json b/examples/docs/resources/pc/api/zh-CN/form-item.json new file mode 100644 index 000000000..f1140533f --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/form-item.json @@ -0,0 +1,122 @@ +{ + "attrs": [ + { + "name": "prop", + "sample": "form-validation", + "type": "String", + "desc": "表单域 model 字段,在使用 validate、resetFields 方法的情况下,该属性是必填的;该属性的可选值为 -", + "defaultValue": "该属性的默认值为 传入 Form 组件的 model 中的字段" + }, + { + "name": "label", + "sample": "form-validation", + "type": "String", + "desc": "标签文本;该属性的可选值为 -", + "defaultValue": "该属性的默认值为 -" + }, + { + "name": "label-width", + "sample": "form-clear-validate", + "type": "String", + "desc": "表单域标签的的宽度,例如 '50px'。支持 auto。;该属性的可选值为 -", + "defaultValue": "该属性的默认值为 -" + }, + { + "name": "required", + "sample": "form-clear-validate", + "type": "Boolean", + "desc": "是否必填,如不设置,则会根据校验规则自动生成;该属性的可选值为 -", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "rules", + "sample": "form-clear-validate", + "type": "Object", + "desc": "表单验证规则;该属性的可选值为 -", + "defaultValue": "该属性的默认值为 -" + }, + { + "name": "error", + "sample": "", + "type": "String", + "desc": "表单域验证错误信息, 设置该值会使表单验证状态变为error,并显示该错误信息;该属性的可选值为 -", + "defaultValue": "该属性的默认值为 -" + }, + { + "name": "show-message", + "sample": "form-validation", + "type": "Boolean", + "desc": "是否显示校验错误信息;该属性的可选值为 -", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "inline-message", + "sample": "", + "type": "Boolean", + "desc": "以行内形式展示校验信息;该属性的可选值为 -", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "size", + "sample": "", + "type": "String", + "desc": "用于控制该表单域下组件的尺寸;该属性的可选值为 medium / small / mini", + "defaultValue": "该属性的默认值为空" + }, + { + "name": "validate-position", + "sample": "form-validation", + "type": "String", + "desc": "指定校验提示框显示的位置;该属性的可选值有 top-start / top / top-end / left-start / left / left-end / right-start / right / right-end / bottom-start / bottom / bottom-end", + "defaultValue": "该属性的默认值为 top-end" + }, + { + "name": "validate-type", + "sample": "validate-type", + "type": "String", + "desc": "校验类型;该属性的可选值有 tip / text", + "defaultValue": "该属性的默认值为 tip" + } + ], + "slots": [ + { + "name": "default", + "sample": "size", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + }, + { + "name": "label", + "sample": "slot-label", + "type": "", + "desc": "标签文本的内容", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "resetField", + "sample": "form-validation", + "type": "", + "desc": "对该表单项进行重置,将其值重置为初始值并移除校验结果", + "defaultValue": "" + }, + { + "name": "clearValidate", + "sample": "form-clear-validate", + "type": "", + "desc": "移除该表单项的校验结果", + "defaultValue": "" + } + ], + "events": [ + { + "name": "validate", + "sample": "form-validation", + "type": "", + "desc": "任一表单项被校验后触发。", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/form.json b/examples/docs/resources/pc/api/zh-CN/form.json new file mode 100644 index 000000000..f9dc837d8 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/form.json @@ -0,0 +1,305 @@ +{ + "formattrs": [ + { + "name": "form-item", + "sample": "form-in-row", + "type": "Object", + "desc": "Form 下的 FormItem 组件,请参看 FormItem 的属性配置 tiny.Widget.Form.FormItem ", + "defaultValue": "" + }, + { + "name": "model", + "sample": "form-validation", + "type": "Object", + "desc": "表单数据对象", + "defaultValue": "" + }, + { + "name": "rules", + "sample": "form-validation", + "type": "Object", + "desc": "表单验证规则", + "defaultValue": "" + }, + { + "name": "inline", + "sample": "form-in-row", + "type": "Boolean", + "desc": "行内布局模式,默认为 false ", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "label-position", + "sample": "size", + "type": "String", + "desc": "表单中标签的布局位置;该属性的可选值为 right / left / top", + "defaultValue": "该属性的默认值为 right" + }, + { + "name": "label-suffix", + "sample": "frequently-used-form", + "type": "String", + "desc": "表单中标签后缀", + "defaultValue": "" + }, + { + "name": "label-width", + "sample": "frequently-used-form", + "type": "String", + "desc": "表单中标签占位宽度,默认为 80px ", + "defaultValue": "该属性的默认值为 80px" + }, + { + "name": "label-align", + "sample": "label-align", + "type": "Boolean", + "desc": "表单中在配件显示必填字段的标签旁边的红色星号时,文本是否对齐 ", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "hide-required-asterisk", + "sample": "form-validation", + "type": "Boolean", + "desc": "是否显示必填字段的标签旁边的红色星号", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "show-message", + "sample": "form-validation", + "type": "Boolean", + "desc": "是否显示校验错误信息", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "inline-message", + "sample": "", + "type": "Boolean", + "desc": "是否以行内形式展示校验信息", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "validate-on-rule-change", + "sample": "custom-validation-rule", + "type": "Boolean", + "desc": "是否在 rules 属性改变后立即触发一次验证", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "用于控制该表单内组件的尺寸;该属性的可选值为 medium / small / mini", + "defaultValue": "该属性的默认值为空" + }, + { + "name": "disabled", + "sample": "size", + "type": "Boolean", + "desc": "是否禁用该表单内的所有组件若设置为 true,则表单内组件上的 disabled 属性不再生效", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "novalid-tip", + "sample": "novalid-tip", + "type": "String", + "desc": "是否显示校验提示框的tip内容提示", + "defaultValue": "" + }, + { + "name": "validate-position", + "sample": "validation-position", + "type": "String", + "desc": "指定校验提示框显示的位置;该属性的可选值有 top-start / top / top-end / left-start / left / left-end / right-start / right / right-end / bottom-start / bottom / bottom-end", + "defaultValue": "该属性的默认值为 right" + }, + { + "name": "validate-type", + "sample": "validate-type", + "type": "String", + "desc": "校验类型;该属性的可选值有 tip / text", + "defaultValue": "该属性的默认值为 tip" + } + ], + "formslots": [ + { + "name": "default", + "sample": "form-validation", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + }, + { + "name": "label", + "sample": "slot-label", + "type": "", + "desc": "标签文本插槽", + "defaultValue": "" + } + ], + "formmethods": [ + { + "name": "validate", + "sample": "form-validation", + "type": "", + "desc": "对整个表单进行校验的方法,参数为一个回调函数该回调函数会在校验结束后被调用,并传入两个参数:是否校验成功和未通过校验的字段若不传入回调函数,则会返回一个 promise", + "defaultValue": "" + }, + { + "name": "validateField", + "sample": "form-validation", + "type": "", + "desc": "对部分表单字段进行校验的方法", + "defaultValue": "" + }, + { + "name": "resetFields", + "sample": "form-validation", + "type": "", + "desc": "对整个表单进行重置,将所有字段值重置为初始值并移除校验结果", + "defaultValue": "" + }, + { + "name": "clearValidate", + "sample": "form-clear-validate", + "type": "", + "desc": "移除表单项的校验结果传入待移除的表单项的 prop 属性或者 prop 组成的数组,如不传则移除整个表单的校验结果", + "defaultValue": "" + } + ], + "formevents": [ + { + "name": "validate", + "sample": "form-validation", + "type": "", + "desc": "任一表单项被校验后触发", + "defaultValue": "" + } + ], + "formItemattrs": [ + { + "name": "prop", + "sample": "form-validation", + "type": "String", + "desc": "表单域 model 字段,在使用 validate、resetFields 方法的情况下,该属性是必填的;该属性的可选值为 -", + "defaultValue": "该属性的默认值为 传入 Form 组件的 model 中的字段" + }, + { + "name": "label", + "sample": "form-validation", + "type": "String", + "desc": "标签文本;该属性的可选值为 -", + "defaultValue": "该属性的默认值为 -" + }, + { + "name": "label-width", + "sample": "form-clear-validate", + "type": "String", + "desc": "表单域标签的的宽度,例如 '50px'。支持 auto。;该属性的可选值为 -", + "defaultValue": "该属性的默认值为 -" + }, + { + "name": "required", + "sample": "form-clear-validate", + "type": "Boolean", + "desc": "是否必填,如不设置,则会根据校验规则自动生成;该属性的可选值为 -", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "rules", + "sample": "form-clear-validate", + "type": "Object", + "desc": "表单验证规则;该属性的可选值为 -", + "defaultValue": "该属性的默认值为 -" + }, + { + "name": "error", + "sample": "", + "type": "String", + "desc": "表单域验证错误信息, 设置该值会使表单验证状态变为error,并显示该错误信息;该属性的可选值为 -", + "defaultValue": "该属性的默认值为 -" + }, + { + "name": "show-message", + "sample": "form-validation", + "type": "Boolean", + "desc": "是否显示校验错误信息;该属性的可选值为 -", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "inline-message", + "sample": "", + "type": "Boolean", + "desc": "以行内形式展示校验信息;该属性的可选值为 -", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "size", + "sample": "", + "type": "String", + "desc": "用于控制该表单域下组件的尺寸;该属性的可选值为 medium / small / mini", + "defaultValue": "该属性的默认值为空" + }, + { + "name": "validate-position", + "sample": "form-validation", + "type": "String", + "desc": "指定校验提示框显示的位置;该属性的可选值有 top-start / top / top-end / left-start / left / left-end / right-start / right / right-end / bottom-start / bottom / bottom-end", + "defaultValue": "该属性的默认值为 top-end" + }, + { + "name": "validate-type", + "sample": "validate-type", + "type": "String", + "desc": "校验类型;该属性的可选值有 tip / text", + "defaultValue": "该属性的默认值为 tip" + }, + { + "name": "validate-icon", + "sample": "form-validation", + "type": "Object", + "desc": "校验提示框的图标 ;该属性的可传入任意图标", + "defaultValue": "该属性的默认值为 null" + } + ], + "formItemslots": [ + { + "name": "default", + "sample": "size", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + }, + { + "name": "label", + "sample": "slot-label", + "type": "", + "desc": "标签文本的内容", + "defaultValue": "" + } + ], + "formItemmethods": [ + { + "name": "resetField", + "sample": "form-validation", + "type": "", + "desc": "对该表单项进行重置,将其值重置为初始值并移除校验结果", + "defaultValue": "" + }, + { + "name": "clearValidate", + "sample": "form-clear-validate", + "type": "", + "desc": "移除该表单项的校验结果", + "defaultValue": "" + } + ], + "formItemevents": [ + { + "name": "validate", + "sample": "form-validation", + "type": "", + "desc": "任一表单项被校验后触发。", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/fullscreen.json b/examples/docs/resources/pc/api/zh-CN/fullscreen.json new file mode 100644 index 000000000..05e7f3fb3 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/fullscreen.json @@ -0,0 +1,73 @@ +{ + "attrs": [ + { + "name": "page-only", + "sample": "example-component", + "type": "Boolean", + "desc": "显示模式。true 为网页全屏,false 为浏览器全屏。默认值为 false", + "defaultValue": "" + }, + { + "name": "teleport", + "sample": "example-component", + "type": "Boolean", + "desc": "是否将目标元素移动到 body 下。true 为移动,false 为不移动。默认值为 false", + "defaultValue": "" + }, + { + "name": "z-index", + "sample": "example-component", + "type": "Number", + "desc": "在全屏显示时,目标元素的 zIndex", + "defaultValue": "" + }, + { + "name": "fullscreen-class", + "sample": "example-component", + "type": "String", + "desc": "自定义组件 wrapper 的样式类名", + "defaultValue": "" + }, + { + "name": "fullscreen", + "sample": "example-component", + "type": "Boolean", + "desc": "组件式使用时,控制组件是否全屏显示。默认为 false", + "defaultValue": "" + }, + { + "name": "exit-on-click-wrapper", + "sample": "example-component", + "type": "Boolean", + "desc": "组件式使用时,点击组件 wrapper 是否关闭全屏显示。默认为 true", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "example-component", + "type": "", + "desc": "自定义内容,需要在 layout 中列出 slot", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "toggle", + "sample": "example-component", + "type": "", + "desc": "函数式使用时,切换全屏模式", + "defaultValue": "" + } + ], + "events": [ + { + "name": "update:fullscreen", + "sample": "example-component", + "type": "", + "desc": "组件式使用时,更新 fullscreen 属性", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/gantt.json b/examples/docs/resources/pc/api/zh-CN/gantt.json new file mode 100644 index 000000000..1e2cd5beb --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/gantt.json @@ -0,0 +1,76 @@ +{ + "attrs": [ + { + "name": "configs", + "sample": "", + "type": "Object", + "desc": "dates,scale,controls等的配置选项", + "defaultValue": "" + }, + { + "name": "columns", + "sample": "", + "type": "Array", + "desc": "甘特图列配置", + "defaultValue": "" + }, + { + "name": "scale", + "sample": "", + "type": "Object", + "desc": "刻度,可以配置数组中设置对象来指定任意数量的刻度", + "defaultValue": "" + }, + { + "name": "subscales", + "sample": "", + "type": "Array", + "desc": "指定第二时间刻度", + "defaultValue": "" + }, + { + "name": "events", + "sample": "", + "type": "Object", + "desc": "包括所有处理事件", + "defaultValue": "" + }, + { + "name": "locale", + "sample": "", + "type": "Object", + "desc": "设置组件的国际化", + "defaultValue": "" + }, + { + "name": "tasks", + "sample": "", + "type": "Object", + "desc": "设置数据集;设置任务项,包含links(存储链接依赖关系的类型) 和 data(数据)", + "defaultValue": "" + }, + { + "name": "skin", + "sample": "", + "type": "String", + "desc": "设置甘特图皮肤", + "defaultValue": "" + }, + { + "name": "width", + "sample": "", + "type": "String", + "desc": "设置甘特图的宽度,不设置时,甘特图宽度自适应。;设置甘特图的宽度", + "defaultValue": "该属性的默认值为 500px" + } + ], + "events": [ + { + "name": "ready", + "sample": "", + "type": "", + "desc": "甘特图渲染完成后触发的事件", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/grid-column.json b/examples/docs/resources/pc/api/zh-CN/grid-column.json new file mode 100644 index 000000000..d04a5147a --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/grid-column.json @@ -0,0 +1,286 @@ +{ + "attrs": [ + { + "name": "align", + "sample": "grid-align#align-column-align", + "type": "String", + "desc": "列对其方式;该属性的可选值为 left(左对其), center(居中对其), right(右对齐)", + "defaultValue": "该属性的默认值为 继承 table 的 align" + }, + { + "name": "class-name", + "sample": "grid-custom-style#custom-style-cell-style", + "type": "String, Function", + "desc": "给单元格附加 className,也可以是函数 Function({seq, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "multi", + "sample": "grid-filter#filter-default-filter", + "type": "Boolean", + "desc": "是 filter 对象内置的属性,筛选是否允许多选;设置选择列是否显示复选框。当 columnType 为 'select' 时有效。", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "method", + "sample": "grid-filter#filter-custom-filter", + "type": "Function", + "desc": "是 filter 对象内置的自定义筛选方法 Function({value, row, column})", + "defaultValue": "" + }, + { + "name": "fixed", + "sample": "grid-fixed#fixed-left-fixed", + "type": "String", + "desc": "将列固定在左侧,其中 freezable 可冻结可解冻,在表格个性化面板中可操作,而 frozen 只能冻结不能解冻,在个性化面板中不可操作;将列固定在左侧或者右侧(注意:固定列应该放在左右两侧的位置);该属性的可选值为 left(固定左侧), right(固定右侧)", + "defaultValue": "" + }, + { + "name": "footer-align", + "sample": "grid-align#align-footer-align-left-footer-align", + "type": "String", + "desc": "表尾列的对齐方式;该属性的可选值为 left(左对其), center(居中对其), right(右对齐)", + "defaultValue": "该属性的默认值为 继承 align > 继承 table 的 footer-align" + }, + { + "name": "footer-class-name", + "sample": "grid-footer#footer-footer-class-name", + "type": "String, Function", + "desc": "给表尾的单元格附加 className,也可以是函数 Function({$rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "header-align", + "sample": "grid-align#align-header-align-left-header-align", + "type": "String", + "desc": "表头列的对齐方式;该属性的可选值为 left(左对其), center(居中对其), right(右对齐)", + "defaultValue": "该属性的默认值为 继承 align > 继承 table 的 header-align" + }, + { + "name": "header-class-name", + "sample": "grid-header#header-header-class-name", + "type": "String, Function", + "desc": "设置列头样式名称;给表头的单元格附加 className,也可以是函数 Function({$rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "index-method", + "sample": "grid-serial-column#tiny-first-menu-custom-serial-column", + "type": "Function", + "desc": "只对 type=index 有效,自定义索引方法 Function({row, rowIndex, column, columnIndex})", + "defaultValue": "" + }, + { + "name": "min-width", + "sample": "grid-width-height#tiny-first-menu-min-width", + "type": "Number, String", + "desc": "最小列宽度;会自动将剩余空间按比例分配;该属性的可选值为 整数, px,%", + "defaultValue": "该属性的默认值为 继承 table 的 column-min-width" + }, + { + "name": "show-icon", + "sample": "grid-edit#tiny-first-menu-cell-editing", + "type": "Boolean", + "desc": "是否显示列头编辑图标,在编辑时有效", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "params", + "sample": "grid-filter#filter-default-filter", + "type": "Object", + "desc": "额外的参数(自定义一些数据参数,对于某些特殊的场景可能会用到)", + "defaultValue": "" + }, + { + "name": "remote-sort", + "sample": "grid-sort#sort-server-sort", + "type": "Boolean", + "desc": "是否使用服务端排序,如果设置为 true 则不会对数据进行处理", + "defaultValue": "该属性的默认值为 继承 table 的 remote-sort" + }, + { + "name": "resizable", + "sample": "grid-width-height#tiny-first-menu-resize-column-width", + "type": "Boolean", + "desc": "设置该列是否可以调整列宽;列是否允许拖动列宽调整大小", + "defaultValue": "该属性的默认值为 继承 table 的 resizable" + }, + { + "name": "show-header-overflow", + "sample": "grid-tip#tip-column-header-tip", + "type": "String,Boolean", + "desc": "当表头内容过长时显示为省略号;该属性的可选值为 ellipsis(只显示省略号), title(并且显示为原生 title), tooltip(并且显示为 tooltip 提示)", + "defaultValue": "该属性的默认值为 继承 table 的 show-header-overflow" + }, + { + "name": "show-overflow", + "sample": "grid-tip#tip-cell-tip", + "type": "String,Boolean", + "desc": "当内容过长时显示为省略号;该属性的可选值为 ellipsis(只显示省略号), title(并且显示为原生 title), tooltip(并且显示为 tooltip 提示)", + "defaultValue": "该属性的默认值为 继承 table 的 show-overflow" + }, + { + "name": "sort-by", + "sample": "grid-sort#sort-combinations-sort", + "type": "String, Array", + "desc": "只对 sortable 有效,自定义排序的属性", + "defaultValue": "" + }, + { + "name": "rules", + "sample": "", + "type": "Object", + "desc": "表单的验证功能", + "defaultValue": "" + }, + { + "name": "required", + "sample": "grid-validation#grid_Example-gridValid-editing-validation", + "type": "Boolean", + "desc": "是否必填,如不设置,则会根据校验规则自动生成", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "sort-method", + "sample": "grid-sort#sort-custom-sort", + "type": "Function", + "desc": "自定义所有列的排序方法,当触发排序时会调用该函数 Function({ data, column, property, order }) 返回排序后的结果", + "defaultValue": "" + }, + { + "name": "sortable", + "sample": "grid-sort#sort-default-sort", + "type": "Boolean", + "desc": "设置该列数据是否可以排序。;是否允许列排序", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "title", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "String , Function", + "desc": "列标题(支持开启国际化),可以是函数 Function(h, params)", + "defaultValue": "" + }, + { + "name": "tree-node", + "sample": "grid-tree-grid#tree-table-tree-grid-base", + "type": "Boolean", + "desc": "只对 tree-config 配置时有效,指定为树节点", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "format-value", + "sample": "grid-edit#tiny-first-menu-format-value", + "type": "Function", + "desc": "格式化单元格编辑器组件的传入值", + "defaultValue": "" + }, + { + "name": "format-text", + "sample": "grid-renderer#grid_Example-gridRenderer-inner-renderer", + "type": "String , Function", + "desc": "设置当前表格列的显示获取编辑类型;设置当前表格列的显示获取编辑类型,也可以是函数 Function(params);该属性的可选值为 money / enum / select / number / integer / filesize / date / dateTime / longDateTime / time / longTime / yearMonth / ellipsis / rate / boole", + "defaultValue": "" + }, + { + "name": "type", + "sample": "grid-serial-column#tiny-first-menu-default-serial-column", + "type": "String", + "desc": "设置内置列的类型;设置内置列的类型;该属性的可选值为 index(序号)/ selection(复选框)/ radio(单选框)/ expand(展开行)", + "defaultValue": "" + }, + { + "name": "width", + "sample": "grid-width-height#tiny-first-menu-fixed-column-width", + "type": "Number , String", + "desc": "设置列的宽度,可以是像素或者百分比或者'auto',设置为'auto'时,列宽会自动适应。;列宽度;该属性的可选值为 整数 / px /%", + "defaultValue": "该属性的默认值为 继承 table 的 column-width" + }, + { + "name": "format-config", + "sample": "grid-data-source#tiny-first-menu-column-asyn-rendering", + "type": "Object", + "desc": "开启该列数据异步渲染。;{data: [], // 列数据源\n type: '', // 内置渲染器类型,与 format-text 属性取值相同\n async: true, // 配置为 true 后,支持动态修改 data 的数据。还可以配置为对象,配置为对象时,对象中可以配置 splitConfig.enabled(是否启用分隔配置)、splitConfig.valueSplit(指定 value 值的分隔符)、splitConfig.textSplit(指定 text 的分隔符)、fetch(列数据异步渲染,请求数据)\n label: '' // 单元格显示内容的映射\n value: '' // 单元格取值的映射}", + "defaultValue": "" + }, + { + "name": "class-name", + "sample": "grid-custom-style#custom-style-cell-style", + "type": "String, Function", + "desc": "给单元格附加 className,也可以是函数 Function({seq, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "editor", + "sample": "grid-edit#tiny-first-menu-custom-editing", + "type": "Object , Function", + "desc": "单元格编辑渲染配置项,也可以是函数 Function(h, params);设置表格列的编辑类型。当 editMode 为 true,并且 editabele 为 true 是有效。", + "defaultValue": "" + }, + { + "name": "field", + "sample": "grid-align#align-column-align", + "type": "String", + "desc": "设置表格列对应数据源的字段名,注意:该属性配置不支持含'.',数字开头的字符串,不支持中文,不支持列字段重复(会导致配置个性化设置,自定义列拖动无效)", + "defaultValue": "" + }, + { + "name": "filter", + "sample": "grid-filter#filter-default-filter", + "type": "Boolean , Object", + "desc": "设置表格列的筛选配置信息。默认值为 false 不配置筛选信息。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "renderer", + "sample": "grid-renderer#grid_Example-gridRenderer-custom-renderer", + "type": "Object , Function", + "desc": "设置表格列的渲染类型。其优先级高于列的 type 属性配置;单元格渲染配置项,其优先级高于列的 formatText 属性配置,也可以是函数 Function(h, params)", + "defaultValue": "" + }, + { + "name": "show-tip", + "sample": "grid-tip#tip-cell-tip", + "type": "Boolean", + "desc": "表格列单元格是否需要提示", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "show-header-tip", + "sample": "grid-tip#tip-column-header-tip", + "type": "Boolean", + "desc": "表格列头是否需要提示", + "defaultValue": "该属性的默认值为 false" + } + ], + "slots": [ + { + "name": "default", + "sample": "grid-header#header-custom-grid-header", + "type": "", + "desc": "自定义显示内容模板", + "defaultValue": "" + }, + { + "name": "edit", + "sample": "grid-editor#grid_Example-gridEdit-custom-editor-select", + "type": "", + "desc": "自定义可编辑组件模板", + "defaultValue": "" + }, + { + "name": "filter", + "sample": "grid-filter#filter-custom-filter", + "type": "", + "desc": "自定义筛选模板", + "defaultValue": "" + }, + { + "name": "header", + "sample": "grid-header#header-slot-header", + "type": "", + "desc": "自定义表头内容的模板", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/grid-table.json b/examples/docs/resources/pc/api/zh-CN/grid-table.json new file mode 100644 index 000000000..ccc602616 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/grid-table.json @@ -0,0 +1,1368 @@ +{ + "attrs": [ + { + "name": "pager", + "sample": "grid-pager#pager-inner-pager", + "type": "Object", + "desc": "设置分页配置项。通过 pager 的属性 {component: Pager} 注入分页组件,{attrs:{currentPage: 1,pageSize: 5,pageSizes: [5, 10], total: 0,layout: 'total, prev, pager, next, jumper, sizes'}}配置分页", + "defaultValue": "" + }, + { + "name": "fetch-data", + "sample": "grid-data-source#tiny-first-menu-request-service", + "type": "Object", + "desc": "服务端数据查询方法", + "defaultValue": "" + }, + { + "name": "save-data", + "sample": "grid-toolbar#tiny-first-menu-save-data", + "type": "Object", + "desc": "服务端数据保存方法", + "defaultValue": "" + }, + { + "name": "delete-data", + "sample": "", + "type": "Object", + "desc": "服务端数据删除方法", + "defaultValue": "" + }, + { + "name": "row-group", + "sample": "grid-row-grouping#row-grouping", + "type": "Object", + "desc": "设置行分组", + "defaultValue": "" + }, + { + "name": "toolbar", + "sample": "", + "type": "Object", + "desc": "工具栏配置", + "defaultValue": "" + }, + { + "name": "align", + "sample": "grid-align#align-grid-align-left-grid-align", + "type": "String", + "desc": "所有的列对其方式;该属性的可选值为 left(左对其), center(居中对其), right(右对齐)", + "defaultValue": "该属性的默认值为 left" + }, + { + "name": "auto-resize", + "sample": "grid-width-height#tiny-first-menu-adaptive-grid-width-height", + "type": "Boolean", + "desc": "父元素响应式监听(对于父元素可能存在动态变化的场景可能会用到)", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "border", + "sample": "grid-grid-border#tiny-first-menu-grid-border", + "type": "Boolean", + "desc": "是否带有纵向边框", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "cell-class-name", + "sample": "grid-custom-style#custom-style-cell-style", + "type": "String, Function", + "desc": "给单元格附加 className,也可以是函数 Function({seq, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "column-key", + "sample": "grid-operation-column#tiny-first-menu-column-key", + "type": "Boolean", + "desc": "是否需要为每一列的 VNode 设置 key 属性(非特殊情况下不需要使用)", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "column-min-width", + "sample": "grid-width-height#tiny-first-menu-column-min-width", + "type": "Number , String", + "desc": "设置可以调整到的最小宽度,不设置时默认为列头 span 的宽度 + 36(头部固定宽度)。 ;所有最小列宽度;会自动将剩余空间按比例分配;该属性的可选值为 整数, px,%", + "defaultValue": "" + }, + { + "name": "column-width", + "sample": "grid-width-height#tiny-first-menu-column-width", + "type": "Number, String", + "desc": "所有列宽度;该属性的可选值为 整数, px,%", + "defaultValue": "该属性的默认值为 默认均匀分配" + }, + { + "name": "context-menu", + "sample": "grid-context-menu#grid_Example-shortcutMenu-footer-menu", + "type": "Object", + "desc": "快捷菜单配置项", + "defaultValue": "" + }, + { + "name": "edit-rules", + "sample": "grid-validation#grid_Example-gridValid-editing-validation", + "type": "Object", + "desc": "校验规则配置项", + "defaultValue": "" + }, + { + "name": "expand-config", + "sample": "grid-tree-grid#tree-table-tree-grid-expand-config", + "type": "Object", + "desc": "展开行配置项", + "defaultValue": "" + }, + { + "name": "fit", + "sample": "grid-width-height#tiny-first-menu-adaptive-column-width", + "type": "Boolean", + "desc": "所有列的宽度是否自撑开", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "footer-align", + "sample": "grid-align#align-footer-align-left-footer-align", + "type": "String", + "desc": "所有的表尾列的对齐方式;该属性的可选值为 left(左对其), center(居中对其), right(右对齐)", + "defaultValue": "该属性的默认值为 继承 align" + }, + { + "name": "optimization", + "sample": "grid-grid-optimization#tiny-first-menu-grid-optimization", + "type": "Object", + "desc": "优化配置项", + "defaultValue": "该属性的默认值为 { animat: true, delayHover: 250, scrollX: { gt: 100 }, scrollY: { gt: 500 }" + }, + { + "name": "params", + "sample": "", + "type": "Object", + "desc": "额外的参数", + "defaultValue": "" + }, + { + "name": "footer-cell-class-name", + "sample": "grid-custom-style#custom-style-footer-style-footer-cell-style", + "type": "String, Function", + "desc": "给表尾的单元格附加 className,也可以是函数 Function({$rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "footer-method", + "sample": "grid-summary#summary-custom-summary", + "type": "Function", + "desc": "表尾合计的计算方法 Function({columns, data})", + "defaultValue": "" + }, + { + "name": "footer-row-class-name", + "sample": "grid-custom-style#custom-style-footer-style-footer-cell-style", + "type": "String, Function", + "desc": "给表尾的行附加 className,也可以是函数 Function({$rowIndex})", + "defaultValue": "" + }, + { + "name": "footer-span-method", + "sample": "grid-footer#footer-footer-row-or-column-span", + "type": "Object", + "desc": "表尾合并行或列,该函数 Function({$rowIndex, column, columnIndex, $columnIndex, data}) 返回计算后的值", + "defaultValue": "该属性的默认值为 { rowspan: 1, colspan: 1}" + }, + { + "name": "header-align", + "sample": "grid-align#align-header-align-left-header-align", + "type": "String", + "desc": "所有的表头列的对齐方式;该属性的可选值为 left(左对其), center(居中对其), right(右对齐)", + "defaultValue": "该属性的默认值为 继承 align" + }, + { + "name": "header-cell-class-name", + "sample": "grid-custom-style#custom-style-header-style-header-cell-style", + "type": "String, Function", + "desc": "给表头的单元格附加 className,也可以是函数 Function({$rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "header-row-class-name", + "sample": "grid-custom-style#custom-style-header-style-header-cell-style", + "type": "String, Function", + "desc": "给表头的行附加 className,也可以是函数 Function({$rowIndex})", + "defaultValue": "" + }, + { + "name": "height", + "sample": "grid-width-height#tiny-first-menu-fixed-grid-height", + "type": "Number , String", + "desc": "设置表格内容区域(不含表格头部,底部)的高度。 不设置时,表格内容区域的高度度自适应。 ;表格的高度;支持铺满父容器或者固定宽高;该属性的可选值为 整数, px,%", + "defaultValue": "" + }, + { + "name": "highlight-cell", + "sample": "grid-highlight#highlight-highlight-cell", + "type": "Boolean", + "desc": "只对 editConfig 配置时有效,是否在编辑时高亮单元格边框", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "highlight-current-column", + "sample": "grid-highlight#highlight-highlight-current-column", + "type": "Boolean", + "desc": "是否要高亮当前列", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "highlight-current-row", + "sample": "grid-highlight#highlight-highlight-current-row", + "type": "Boolean", + "desc": "是否要高亮当前行", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "highlight-hover-column", + "sample": "grid-highlight#highlight-highlight-hover-column", + "type": "Boolean", + "desc": "鼠标移到列是否要高亮显示", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "highlight-hover-row", + "sample": "grid-highlight#highlight-highlight-hover-row", + "type": "Boolean", + "desc": "鼠标移到行是否要高亮显示", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "keyboard-config", + "sample": "grid-tree-grid#tree-table-tree-grid-keyboard-operation", + "type": "Object", + "desc": "按键配置项", + "defaultValue": "" + }, + { + "name": "loading", + "sample": "grid-grid-loading-tip#tiny-first-menu-grid-loading-off-tip", + "type": "Boolean", + "desc": "表格是否显示加载中", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "max-height", + "sample": "grid-width-height#tiny-first-menu-min-grid-height", + "type": "Number , String", + "desc": "设置表格内容区域(不含表格头部,底部)的最大高度。;该属性的可选值为 整数, px,%", + "defaultValue": "" + }, + { + "name": "mouse-config", + "sample": "grid-keyboard#mouse-config", + "type": "Object", + "desc": "鼠标配置项", + "defaultValue": "" + }, + { + "name": "radio-config", + "sample": "grid-operation-column#tiny-first-menu-default-serial-column", + "type": "Object", + "desc": "单选框配置项", + "defaultValue": "" + }, + { + "name": "remote-filter", + "sample": "grid-filter#filter-server-filter", + "type": "Boolean", + "desc": "所有列是否使用服务端筛选,如果设置为 true 则不会对数据进行处理", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "remote-sort", + "sample": "grid-filter#filter-server-filter", + "type": "Boolean", + "desc": "是否将服务端的全部数据进行排序。默认为 false 不进行服务端排序。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "resizable", + "sample": "grid-width-height#tiny-first-menu-resize-column-width", + "type": "Boolean", + "desc": "设置是否允许调整列宽", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "row-class-name", + "sample": "grid-custom-style#custom-style-row-style", + "type": "String, Function", + "desc": "给行附加 className,也可以是函数 Function({seq, row, rowIndex, $rowIndex})", + "defaultValue": "" + }, + { + "name": "row-id", + "sample": "", + "type": "String", + "desc": "自定义行数据唯一主键的字段名(行数据必须要有唯一主键,默认自动生成)", + "defaultValue": "该属性的默认值为 _XID" + }, + { + "name": "row-key", + "sample": "", + "type": "Boolean", + "desc": "是否需要为每一行的 VNode 设置 key 属性(非特殊情况下没必要设置)", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "select-config", + "sample": "grid-tree-grid#tree-table-tree-grid-operation-column", + "type": "Object", + "desc": "复选框配置项", + "defaultValue": "" + }, + { + "name": "show-footer", + "sample": "grid-summary#summary-custom-summary", + "type": "Boolean", + "desc": "是否显示表尾合计", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "show-header", + "sample": "grid-header#header-hide-grid-header", + "type": "Boolean", + "desc": "是否显示表头", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "show-header-overflow", + "sample": "grid-tip#tip-column-header-tip", + "type": "Boolean, String", + "desc": "设置表头所有内容过长时显示为省略号;该属性的可选值为 ellipsis(只显示省略号),title(并且显示为原生 title),tooltip(并且显示为 tooltip 提示)", + "defaultValue": "" + }, + { + "name": "show-overflow", + "sample": "grid-tip#tip-cell-tip", + "type": "Boolean, String", + "desc": "设置所有内容过长时显示为省略号(如果是固定列建议设置该值,提升渲染速度);该属性的可选值为 ellipsis(只显示省略号),title(并且显示为原生 title),tooltip(并且显示为 tooltip 提示)", + "defaultValue": "" + }, + { + "name": "size", + "sample": "grid-grid-size#tiny-first-menu-grid-size", + "type": "String", + "desc": "表格的尺寸;该属性的可选值为 medium, small, mini", + "defaultValue": "" + }, + { + "name": "sort-config", + "sample": "grid-sort#sort-default-sort", + "type": "Object", + "desc": "排序配置项", + "defaultValue": "" + }, + { + "name": "sort-method", + "sample": "grid-sort#sort-custom-sort", + "type": "Function", + "desc": "自定义所有列的排序方法,当触发排序时会调用该函数 Function({ data, column, property, order }) 返回排序后的结果", + "defaultValue": "" + }, + { + "name": "span-method", + "sample": "grid-span#span-column-span", + "type": "Object", + "desc": "合并行或列,该函数 Function({seq, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, data}) 返回计算后的值", + "defaultValue": "该属性的默认值为 { rowspan: 1, colspan: 1}" + }, + { + "name": "start-index", + "sample": "grid-serial-column#tiny-first-menu-custom-serial-column", + "type": "Number", + "desc": "只对 type=index 的列有效,动态索引的起始值", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "stripe", + "sample": "grid-grid-stripe#stripe-stripe", + "type": "Boolean", + "desc": "是否带有斑马纹", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "sync-resize", + "sample": "grid-width-height#tiny-first-menu-adaptive-grid-width-height", + "type": "Boolean", + "desc": "响应式跟随某个属性(对于通过某个属性来控制显示/隐藏切换的场景可能会用到)", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "tree-config", + "sample": "grid-tree-grid#tree-table-tree-grid-base", + "type": "Object", + "desc": "树形结构配置项", + "defaultValue": "" + }, + { + "name": "valid-config", + "sample": "grid-validation#grid_Example-gridValid-editing-validation", + "type": "Object", + "desc": "校验配置项", + "defaultValue": "" + }, + { + "name": "summary-config", + "sample": "grid-summary#summary-configuration-summary", + "type": "Object", + "desc": "表格统计功能的配置信息", + "defaultValue": "" + }, + { + "name": "sortable", + "sample": "grid-customized#custom-column-sort", + "type": "Boolean", + "desc": "设置是否允许列数据排序。默认为 true 可排序", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "auto-load", + "sample": "grid-data-source#tiny-first-menu-auto-load", + "type": "Boolean", + "desc": "", + "defaultValue": "是否开启自动请求服务,配置 fetch-data 时有效,该属性的默认值为 true" + }, + { + "name": "is-async-column", + "sample": "grid-data-source#tiny-first-menu-column-asyn-rendering", + "type": "Boolean", + "desc": "设置表格的列是否延迟加载;是否开启异步列功能,配合 scrollLoad 一起使用", + "defaultValue": "" + }, + { + "name": "columns", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "Array", + "desc": "表格列的配置信息,具体参考列配置项", + "defaultValue": "" + }, + { + "name": "scroll-load", + "sample": "grid-large-data#tiny-first-menu-scroll-paging", + "type": "Object", + "desc": "滚动加载配置;设置是否滚动加载分页,当 showPager 为 true 时有效。", + "defaultValue": "" + }, + { + "name": "row-span", + "sample": "grid-span#span-row-span-row-span-easy", + "type": "Array", + "desc": "设置行合并", + "defaultValue": "" + }, + { + "name": "render-empty", + "sample": "", + "type": "Function", + "desc": "空数据渲染", + "defaultValue": "" + }, + { + "name": "events", + "sample": "grid-event#event-grid-events", + "type": "Object", + "desc": "事件对象", + "defaultValue": "" + }, + { + "name": "data", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "Array", + "desc": "设置表格的数据;", + "defaultValue": "" + }, + { + "name": "expand-last-column", + "sample": "", + "type": "Boolean", + "desc": "横向滚动时,最后一列是否会填充整个表格,默认为 false 最后一列不填充整个表格。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "head-custom", + "sample": "", + "type": "String", + "desc": "设置自定义表头的容器选择器。;通过 columns 内部层级或者 嵌套实现自定义表头", + "defaultValue": "" + }, + { + "name": "summary-config", + "sample": "grid-summary#summary-configuration-summary", + "type": "Object", + "desc": "设置表格统计功能。", + "defaultValue": "" + }, + { + "name": "context-menu", + "sample": "grid-context-menu#grid_Example-shortcutMenu-header-menu", + "type": "Object", + "desc": "菜单的配置信息。", + "defaultValue": "" + }, + { + "name": "min-height", + "sample": "grid-width-height#tiny-first-menu-min-grid-height", + "type": "Number , String", + "desc": "设置表格内容区域(不含表格头部,底部)的最小高度。", + "defaultValue": "" + }, + { + "name": "operation", + "sample": "", + "type": "Object", + "desc": "表格操作列配置信息;通过设置 columns 的 renderer 来实现自定义列内容或者使用 内嵌组件实现", + "defaultValue": "" + }, + { + "name": "render-util", + "sample": "", + "type": "Object", + "desc": "grid渲染是传入的模板工具方法对象, renderer和content渲染器中都可以使用。;使用列配置的 renderer 配置自定义内容显示", + "defaultValue": "" + }, + { + "name": "drop-config", + "sample": "grid-drag#drag-row-drag", + "type": "Object", + "desc": "表格行上下拖拽配置信息。", + "defaultValue": "" + }, + { + "name": "edit-config", + "sample": "grid-editor#grid_Example-gridEdit-inner-editor", + "type": "Object", + "desc": "设置是否启用行编辑,即每个单元格都显示编辑状态。当 editMode 为 true 时有效。;设置 mode = row 启用行编辑", + "defaultValue": "" + }, + { + "name": "seq-serial", + "sample": "grid-pager#pager-inner-pager", + "type": "Boolean", + "desc": "设置行序号是否连续,seqSerial 当 showSeq 为 true 时有效。", + "defaultValue": "设置行序号是否连续,开启分页时有效,该属性的默认值为 false" + }, + { + "name": "tooltip-config", + "sample": "", + "type": "Object", + "desc": "组件的配置信息,具体参考 Hae.Widget.Tip.op。;Grid 内置 Tip 配置信息", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "", + "type": "", + "desc": "默认插槽(表格列 )", + "defaultValue": "" + }, + { + "name": "toolbar", + "sample": "", + "type": "", + "desc": "工具栏,(包含:缩放、个性化、刷新表格、自定义按钮)", + "defaultValue": "" + }, + { + "name": "pager", + "sample": "grid-pager#pager-inner-pager", + "type": "", + "desc": "分页插件,", + "defaultValue": "" + }, + { + "name": "empty", + "sample": "grid-empty-data-tip#tiny-first-menu-empty-data-tip", + "type": "", + "desc": "空数据时显示的文本内容", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "clearActived()", + "sample": "grid-edit#tiny-first-menu-trigger-mode-for-editing", + "type": "", + "desc": "手动清除单元格激活状态", + "defaultValue": "" + }, + { + "name": "clearAll()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "手动清除表格所有条件,还原到初始状态(对于增删改查的场景中可能会用到,比如在数据保存之后清除表格缓存)", + "defaultValue": "" + }, + { + "name": "clearCurrentColumn()", + "sample": "grid-highlight#highlight-highlight-current-column", + "type": "", + "desc": "用于当前列,手动清空当前高亮的状态", + "defaultValue": "" + }, + { + "name": "clearCurrentRow()", + "sample": "grid-highlight#highlight-highlight-current-row", + "type": "", + "desc": "用于当前行,手动清空当前高亮的状态", + "defaultValue": "" + }, + { + "name": "clearData(rows, field)", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "手动清空单元格内容,如果不传参数,则清空整个表格内容,如果传了行则清空指定行内容,如果传了指定字段,则清空该字段内容", + "defaultValue": "" + }, + { + "name": "clearFilter(field)", + "sample": "grid-filter#filter-default-filter", + "type": "", + "desc": "手动清空筛选条件(如果不传 field 则清空所有筛选条件),数据会恢复成未筛选的状态", + "defaultValue": "" + }, + { + "name": "clearRadioRow()", + "sample": "grid-operation-column#tiny-first-menu-default-serial-column", + "type": "", + "desc": "用于单选行,手动清空用户的选择", + "defaultValue": "" + }, + { + "name": "clearRowExpand()", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "手动清空展开行状态,数据会恢复成未展开的状态", + "defaultValue": "" + }, + { + "name": "clearScroll()", + "sample": "grid-width-height#tiny-first-menu-min-grid-height", + "type": "", + "desc": "手动清除滚动相关信息,还原到初始状态", + "defaultValue": "" + }, + { + "name": "clearSelected()", + "sample": "grid-highlight#highlight-highlight-cell", + "type": "", + "desc": "手动清除单元格选中状态", + "defaultValue": "" + }, + { + "name": "clearSelection()", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "用于多选行,手动清空用户的选择", + "defaultValue": "" + }, + { + "name": "clearSort()", + "sample": "grid-sort#sort-default-sort", + "type": "", + "desc": "手动清空排序条件,数据会恢复成未排序的状态", + "defaultValue": "" + }, + { + "name": "clearTreeExpand()", + "sample": "grid-tree-grid#tree-table-tree-grid-insert-delete-update", + "type": "", + "desc": "手动清空树形节点的展开状态,数据会恢复成未展开的状态", + "defaultValue": "" + }, + { + "name": "closeFilter()", + "sample": "grid-filter#filter-default-filter", + "type": "", + "desc": "手动关闭筛选面板(某些特殊场景可能会用到)", + "defaultValue": "" + }, + { + "name": "closeMenu()", + "sample": "grid-context-menu#grid_Example-shortcutMenu-header-menu", + "type": "", + "desc": "手动关闭快捷菜单(某些特殊场景可能会用到)", + "defaultValue": "" + }, + { + "name": "createData(records)", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "", + "desc": "创建 data 对象(对于某些特殊场景可能会用到,会自动对数据的字段名进行检测,如果不存在就自动定义)", + "defaultValue": "" + }, + { + "name": "createRow(records)", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "", + "desc": "创建 Row|Rows 对象(对于某些特殊场景需要对数据进行手动插入时可能会用到)", + "defaultValue": "" + }, + { + "name": "exportCsv(options)", + "sample": "grid-import-export#tiny-first-menu-export-excel", + "type": "", + "desc": "将表格数据导出为 .csv 文件(支持所有主流的浏览器,不支持合并行或列)", + "defaultValue": "" + }, + { + "name": "fullValidate(rows, callback)", + "sample": "grid-validation#grid_Example-gridValid-before-submit-validation", + "type": "", + "desc": "表格完整校验函数,和 validate 的区别就是会对全量数据的所有规则进行完整校验", + "defaultValue": "" + }, + { + "name": "getActiveRow()", + "sample": "grid-edit#tiny-first-menu-trigger-mode-for-editing", + "type": "", + "desc": "获取已激活的行数据", + "defaultValue": "" + }, + { + "name": "getColumnByField(field)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "根据列的字段名获取列", + "defaultValue": "" + }, + { + "name": "getColumnById(colid)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "根据列的唯一主键获取列", + "defaultValue": "" + }, + { + "name": "getColumnIndex(column)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "根据 column 获取相对于 columns 中的索引", + "defaultValue": "" + }, + { + "name": "getColumnNode(cell)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "根据 th/td 元素获取对应的 column 信息", + "defaultValue": "" + }, + { + "name": "getColumns(columnIndex)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "获取表格的可视列,也可以指定索引获取列", + "defaultValue": "" + }, + { + "name": "getCurrentRow()", + "sample": "", + "type": "", + "desc": "用于当前行,获取当前行的数据", + "defaultValue": "" + }, + { + "name": "getData(rowIndex)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "获取数据,和 data 的行为一致,也可以指定索引获取数据", + "defaultValue": "" + }, + { + "name": "getInsertRecords()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "获取新增的数据", + "defaultValue": "" + }, + { + "name": "getRadioRow()", + "sample": "", + "type": "", + "desc": "用于单选行,获取当已选中的数据", + "defaultValue": "" + }, + { + "name": "getRecordset()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "获取表格数据集(获取新增、删除、更改的数据,对于增删改查表格非常方便)", + "defaultValue": "" + }, + { + "name": "getRemoveRecords()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "获取已删除的数据", + "defaultValue": "" + }, + { + "name": "getRowById(rowid)", + "sample": "", + "type": "", + "desc": "根据行的唯一主键获取行", + "defaultValue": "" + }, + { + "name": "getRowIndex(row:Object)", + "sample": "", + "type": "", + "desc": "根据 row 获取相对于 data 中的索引", + "defaultValue": "" + }, + { + "name": "getRowNode(tr)", + "sample": "", + "type": "", + "desc": "根据 tr 元素获取对应的 row 信息", + "defaultValue": "" + }, + { + "name": "getSelectRecords()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "用于多选行,获取已选中的数据", + "defaultValue": "" + }, + { + "name": "getTableColumn()", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "", + "desc": "获取当前表格的列(完整的全量表头列、处理条件之后的全量表头列、当前渲染中的表头列)", + "defaultValue": "" + }, + { + "name": "getTableData()", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "", + "desc": "获取当前表格的数据(完整的全量表体数据、处理条件之后的全量表体数据、当前渲染中的表体数据、当前渲染中的表尾数据)", + "defaultValue": "" + }, + { + "name": "getUpdateRecords()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "获取已修改的数据", + "defaultValue": "" + }, + { + "name": "hasActiveRow(row)", + "sample": "grid-edit#tiny-first-menu-trigger-mode-for-editing", + "type": "", + "desc": "检查行是否已激活为编辑状态", + "defaultValue": "" + }, + { + "name": "hasRowChange(row, field)", + "sample": "grid-edit#tiny-first-menu-row-editing", + "type": "", + "desc": "检查行或列数据是否发生改变", + "defaultValue": "" + }, + { + "name": "hasRowExpand(row)", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "检查行是否已展开", + "defaultValue": "" + }, + { + "name": "hasTreeExpand(row)", + "sample": "grid-tree-grid#tree-table-tree-grid-expand", + "type": "", + "desc": "检查树节点是否已展开", + "defaultValue": "" + }, + { + "name": "hideColumn(column)", + "sample": "grid-customized#custom-column-visible-hidden", + "type": "", + "desc": "隐藏指定列", + "defaultValue": "" + }, + { + "name": "insert(records)", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "在表格中新增数据。 ;往表格插入数据,从第一行新增一行或多行新数据", + "defaultValue": "" + }, + { + "name": "insertAt(records, row)", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "往表格插入数据,从指定位置插入一行或多行;第二个参数:row 指定位置(不支持树表格)、null从第一行插入、-1 从最后插入", + "defaultValue": "" + }, + { + "name": "loadColumn(columns)", + "sample": "grid-large-data#large-data-load-column", + "type": "", + "desc": "加载列配置(对于表格列需要重载、局部递增场景下可能会用到)", + "defaultValue": "" + }, + { + "name": "loadData(data)", + "sample": "grid-large-data#tiny-first-menu-full-data-loading", + "type": "", + "desc": "加载数据(对于表格数据需要重载、局部递增场景下可能会用到)", + "defaultValue": "" + }, + { + "name": "recalculate()", + "sample": "grid-width-height#recalculate", + "type": "", + "desc": "重新计算表格(对于某些特殊场景可能会用到,比如隐藏的表格、更新列宽...等)", + "defaultValue": "" + }, + { + "name": "refreshColumn()", + "sample": "grid-customized#custom-column-visible-hidden", + "type": "", + "desc": "刷新列配置(对于显示/隐藏列场景下可能会用到)", + "defaultValue": "" + }, + { + "name": "refreshData()", + "sample": "grid-tree-grid#tree-table-tree-grid-insert-delete-update", + "type": "", + "desc": "同步刷新 data 数据;如果用了该方法,那么组件将不再记录增删改的状态,只能自行实现对应逻辑(对于某些特殊的场景,比如深层树节点元素发生变动时可能会用到)", + "defaultValue": "" + }, + { + "name": "reloadCustoms(customs)", + "sample": "grid-customized#custom-server-storage", + "type": "", + "desc": "初始化加载显示/隐藏列(对于异步更新的场景下可能会用到)", + "defaultValue": "" + }, + { + "name": "remove(rows)", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "删除指定行数据,指定 row 或 [row, ...] 删除多条数据,如果为空则删除所有数据", + "defaultValue": "" + }, + { + "name": "removeSelecteds()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "删除已选中的所有行数据", + "defaultValue": "" + }, + { + "name": "resetAll()", + "sample": "grid-customized#custom-column-width", + "type": "", + "desc": "手动重置列的所有操作,还原到初始状态(如果已关联工具栏,则会同步更新)", + "defaultValue": "" + }, + { + "name": "resetCustoms()", + "sample": "grid-customized#custom-column-width", + "type": "", + "desc": "手动重置列的显示/隐藏操作,还原到初始状态(如果已关联工具栏,则会同步更新)", + "defaultValue": "" + }, + { + "name": "resetResizable()", + "sample": "grid-customized#custom-column-width", + "type": "", + "desc": "手动重置列宽拖动的操作,还原到初始状态(如果已关联工具栏,则会同步更新)", + "defaultValue": "" + }, + { + "name": "revertData(rows, field)", + "sample": "grid-edit#tiny-first-menu-row-editing", + "type": "", + "desc": "还原更改,还原指定行 row 或者整个表格的数据", + "defaultValue": "" + }, + { + "name": "scrollTo(scrollLeft, scrollTop)", + "sample": "grid-large-data#large-data-scroll-to", + "type": "", + "desc": "如果有滚动条,则滚动到对应的位置", + "defaultValue": "" + }, + { + "name": "scrollToColumn(column)", + "sample": "grid-large-data#large-data-scroll-to", + "type": "", + "desc": "如果有滚动条,则滚动到对应的列", + "defaultValue": "" + }, + { + "name": "scrollToRow(row)", + "sample": "grid-large-data#large-data-scroll-to", + "type": "", + "desc": "如果有滚动条,则滚动到对应的行", + "defaultValue": "" + }, + { + "name": "setActiveCell(row, field)", + "sample": "grid-edit#tiny-first-menu-cell-editing", + "type": "", + "desc": "激活单元格编辑", + "defaultValue": "" + }, + { + "name": "setActiveRow(row)", + "sample": "grid-edit#tiny-first-menu-cell-editing", + "type": "", + "desc": "激活行编辑,如果是 mode=cell 则默认激活第一个单元格", + "defaultValue": "" + }, + { + "name": "setAllRowExpansion(checked)", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "设置所有行的展开与否", + "defaultValue": "" + }, + { + "name": "setAllSelection(checked)", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "用于多选行,设置所有行的选中状态", + "defaultValue": "" + }, + { + "name": "setAllTreeExpansion(checked)", + "sample": "grid-tree-grid#tree-table-tree-grid-operation-column", + "type": "", + "desc": "设置所有树节点的展开与否", + "defaultValue": "" + }, + { + "name": "setCurrentRow(row)", + "sample": "grid-highlight#highlight-highlight-hover-row", + "type": "", + "desc": "用于当前行,设置某一行为高亮状态", + "defaultValue": "" + }, + { + "name": "setRadioRow(row)", + "sample": "grid-operation-column#tiny-first-menu-default-serial-column", + "type": "", + "desc": "用于单选行,设置某一行为选中状态", + "defaultValue": "" + }, + { + "name": "setRowExpansion(rows, checked)", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "设置展开行,二个参数设置这一行展开与否", + "defaultValue": "" + }, + { + "name": "setSelection(rows, checked)", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "用于多选行,设置行为选中状态,第二个参数为选中与否", + "defaultValue": "" + }, + { + "name": "setTreeExpansion(rows, checked)", + "sample": "grid-tree-grid#tree-table-tree-grid-operation-column", + "type": "", + "desc": "设置展开树形节点,二个参数设置这一行展开与否", + "defaultValue": "" + }, + { + "name": "showColumn(column)", + "sample": "grid-customized#custom-column-visible-hidden", + "type": "", + "desc": "显示指定列", + "defaultValue": "" + }, + { + "name": "sort(field, order)", + "sample": "grid-sort#sort-custom-sort", + "type": "", + "desc": "手动对表格进行排序(如果 order 为空则自动切换排序)", + "defaultValue": "" + }, + { + "name": "toggleAllSelection()", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "用于多选行,切换所有行的选中状态", + "defaultValue": "" + }, + { + "name": "toggleRowExpansion(row)", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "用于可展开表格,切换展开行", + "defaultValue": "" + }, + { + "name": "toggleRowSelection(row)", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "用于多选行,切换某一行的选中状态", + "defaultValue": "" + }, + { + "name": "toggleTreeExpansion(row)", + "sample": "grid-tree-grid#tree-table-tree-grid-operation-column", + "type": "", + "desc": "用于可树形表格,切换展开树形节点", + "defaultValue": "" + }, + { + "name": "validate(rows, callback)", + "sample": "grid-validation#grid_Example-gridValid-before-submit-validation", + "type": "", + "desc": "表格校验函数,如果指定 row 或 rows 则校验指定一行或多行,否则校验整个表格。该回调函数会在校验结束后被调用,并传入两个参数:(是否校验成功,最近一列未通过校验的字段)。若不传入回调函数,则会返回一个 promise", + "defaultValue": "" + }, + { + "name": "getSelectRecords", + "sample": "", + "type": "", + "desc": "获取选中标识的数据。", + "defaultValue": "" + }, + { + "name": "getUpdateRecords", + "sample": "", + "type": "", + "desc": "获取更新标识的数据(不包括删除与新增标识的数据)", + "defaultValue": "" + }, + { + "name": "renderSort", + "sample": "", + "type": "", + "desc": "分组/合并渲染排序。 前置条件:已进行分组/合并数据处理。", + "defaultValue": "" + } + ], + "events": [ + { + "name": "current-page-change", + "sample": "", + "type": "", + "desc": "只对 pager-config 配置时有效,当前页发生改变时会触发该事件", + "defaultValue": "" + }, + { + "name": "page-change", + "sample": "", + "type": "", + "desc": "只对 pager-config 配置时有效,分页发生改变时会触发该事件", + "defaultValue": "" + }, + { + "name": "toolbar-button-click", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "只对 toolbar.buttons 配置时有效,当工具栏的按钮被点击时会后触发该事件", + "defaultValue": "" + }, + { + "name": "cell-click", + "sample": "grid-event#event-cell-click-event", + "type": "", + "desc": "单元格被点击时会触发该事件", + "defaultValue": "" + }, + { + "name": "cell-context-menu", + "sample": "grid-context-menu#grid_Example-shortcutMenu-menu-permissions", + "type": "", + "desc": "单元格被鼠标右键点击时触发该事件", + "defaultValue": "" + }, + { + "name": "cell-dblclick", + "sample": "grid-event#event-cell-dblclick-event", + "type": "", + "desc": "单元格被双击时会触发该事件", + "defaultValue": "" + }, + { + "name": "cell-mouseenter", + "sample": "grid-event#event-cell-mouseenter-event", + "type": "", + "desc": "当单元格 hover 进入时会触发该事件", + "defaultValue": "" + }, + { + "name": "cell-mouseleave", + "sample": "grid-event#event-cell-mouseleave-event", + "type": "", + "desc": "当单元格 hover 退出时会触发该事件", + "defaultValue": "" + }, + { + "name": "context-menu-click", + "sample": "grid-context-menu#grid_Example-shortcutMenu-header-menu", + "type": "", + "desc": "只对 context-menu 配置时有效,当点击快捷菜单时会触发该事件", + "defaultValue": "" + }, + { + "name": "current-change", + "sample": "", + "type": "", + "desc": "只对 highlightCurrentRow 有效,当手动选中行并且值发生改变时触发的事件", + "defaultValue": "" + }, + { + "name": "edit-actived", + "sample": "grid-event#event-edit-actived-event", + "type": "", + "desc": "单元格被激活编辑时会触发该事件", + "defaultValue": "" + }, + { + "name": "edit-closed", + "sample": "grid-event#event-edit-closed-event", + "type": "", + "desc": "单元格编辑状态下被关闭时会触发该事件", + "defaultValue": "" + }, + { + "name": "edit-disabled", + "sample": "grid-event#event-edit-disabled-event", + "type": "", + "desc": "当单元格激活时如果是禁用状态时会触发该事件", + "defaultValue": "" + }, + { + "name": "filter-change", + "sample": "grid-filter#filter-server-filter", + "type": "", + "desc": "当筛选条件发生变化时会触发该事件", + "defaultValue": "" + }, + { + "name": "footer-cell-click", + "sample": "", + "type": "", + "desc": "表尾单元格被点击时会触发该事件", + "defaultValue": "" + }, + { + "name": "footer-cell-context-menu", + "sample": "grid-context-menu#grid_Example-shortcutMenu-cell-menu", + "type": "", + "desc": "表尾单元格被鼠标右键点击时触发该事件", + "defaultValue": "" + }, + { + "name": "footer-cell-dblclick", + "sample": "", + "type": "", + "desc": "表尾单元格被双击时会触发该事件", + "defaultValue": "" + }, + { + "name": "header-cell-click", + "sample": "grid-event#event-header-click-event", + "type": "", + "desc": "表头单元格被点击时会触发该事件", + "defaultValue": "" + }, + { + "name": "header-cell-context-menu", + "sample": "", + "type": "", + "desc": "表头单元格被鼠标右键点击时触发该事件", + "defaultValue": "" + }, + { + "name": "header-cell-dblclick", + "sample": "grid-event#event-header-dblclick-event", + "type": "", + "desc": "表头单元格被双击时会触发该事件", + "defaultValue": "" + }, + { + "name": "radio-change", + "sample": "", + "type": "", + "desc": "只对 type=radio 有效,当手动勾选并且值发生改变时触发的事件", + "defaultValue": "" + }, + { + "name": "resizable-change", + "sample": "", + "type": "", + "desc": "当列宽拖动发生变化时会触发该事件", + "defaultValue": "" + }, + { + "name": "scroll", + "sample": "grid-event#event-grid-scroll-event", + "type": "", + "desc": "表格滚动时会触发该事件", + "defaultValue": "" + }, + { + "name": "select-all", + "sample": "", + "type": "", + "desc": "只对 type=selection 有效,当手动勾选全选时触发的事件", + "defaultValue": "" + }, + { + "name": "select-change", + "sample": "", + "type": "", + "desc": "只对 type=selection 有效,当手动勾选并且值发生改变时触发的事件", + "defaultValue": "" + }, + { + "name": "toggle-expand-change", + "sample": "", + "type": "", + "desc": "当行展开或收起时会触发该事件", + "defaultValue": "" + }, + { + "name": "toggle-tree-change", + "sample": "", + "type": "", + "desc": "当树节点展开或收起时会触发该事件", + "defaultValue": "" + }, + { + "name": "valid-error", + "sample": "", + "type": "", + "desc": "当数据校验不通过时会触发该事件", + "defaultValue": "" + }, + { + "name": "BeforeEdit", + "sample": "", + "type": "", + "desc": "点击单元格,显示编辑组件前触发的事件。;点击单元格,显示编辑组件前触发的事件 —— edit-config 中的 activeMethod 方法", + "defaultValue": "" + }, + { + "name": "CellClick", + "sample": "", + "type": "", + "desc": "点击单元格触发的事件。", + "defaultValue": "" + }, + { + "name": "sort-change", + "sample": "grid-sort#sort-server-sort", + "type": "", + "desc": "点击列头,执行数据排序前触发的事件。;当排序条件发生变化时会触发该事件", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/grid-toolbar.json b/examples/docs/resources/pc/api/zh-CN/grid-toolbar.json new file mode 100644 index 000000000..1b5b0f11d --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/grid-toolbar.json @@ -0,0 +1,113 @@ +{ + "attrs": [ + { + "name": "buttons", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "Array", + "desc": "按钮列表", + "defaultValue": "" + }, + { + "name": "id", + "sample": "grid-customized#custom-column-width", + "type": "String", + "desc": "唯一 ID 标识", + "defaultValue": "" + }, + { + "name": "loading", + "sample": "grid-toolbar#tiny-first-menu-refresh-grid", + "type": "Boolean", + "desc": "是否加载中", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "refresh", + "sample": "grid-toolbar#tiny-first-menu-refresh-grid", + "type": "Boolean", + "desc": "工具栏组件开启表格刷新功能。", + "defaultValue": "" + }, + { + "name": "resizable", + "sample": "grid-customized#custom-column-width", + "type": "Boolean,Object", + "desc": "列宽拖动配置(需要设置 id)", + "defaultValue": "" + }, + { + "name": "setting", + "sample": "grid-customized#custom-column-width", + "type": "Boolean/Object", + "desc": "设置表格属性是否显示个性化面板,当设置表格的name属性时有效;设置工具栏属性是否显示个性化配置(需要设置 id)", + "defaultValue": "" + }, + { + "name": "full-screen", + "sample": "grid-toolbar#tiny-first-menu-grid-full-screen", + "type": "Boolean", + "desc": "设置表格是否可以全屏,或者需要全屏的容器。;设置工具栏属性是否显示全屏按钮", + "defaultValue": "" + }, + { + "name": "size", + "sample": "grid-toolbar#tiny-first-menu-copy-row-data", + "type": "String", + "desc": "尺寸;该属性的可选值为 medium,small,mini", + "defaultValue": "" + }, + { + "name": "before-open-full-screen", + "sample": "grid-toolbar#tiny-first-menu-grid-full-screen", + "type": "Function", + "desc": "全屏前的拦截方法 Function():Boolean,返回 false 则阻止全屏,返回 true 则不阻止", + "defaultValue": "" + }, + { + "name": "before-close-full-screen", + "sample": "grid-toolbar#tiny-first-menu-grid-full-screen", + "type": "Function", + "desc": "关闭全屏前的拦截方法 Function():Boolean,返回 false 则阻止关闭全屏,返回 true 则不阻止", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "toolbar", + "sample": "grid-toolbar#tiny-first-menu-custom-toolbar", + "type": "", + "desc": "工具栏插槽", + "defaultValue": "" + }, + { + "name": "buttons", + "sample": "grid-toolbar#tiny-first-menu-export-excel", + "type": "", + "desc": "按钮列表", + "defaultValue": "" + }, + { + "name": "tools", + "sample": "grid-toolbar#tiny-first-menu-custom-toolbar", + "type": "", + "desc": "右侧工具列表", + "defaultValue": "" + } + ], + "events": [ + { + "name": "button-click", + "sample": "grid-validation#grid_Example-gridValid-before-submit-validation", + "type": "Function(arg,event)", + "desc": "当工具栏的按钮被点击时会后触发该事件;arg1:{ $grid: VueComponent 表格组件实例对象信息 $table: VueComponent 表实例对象组件信息 button:按钮列表信息对象 code: 按钮类型 } arg2:event", + "defaultValue": "" + }, + { + "name": "on-before-move", + "sample": "grid-validation#grid_Example-gridValid-before-submit-validation", + "type": "Function(arg1,arg2)", + "desc": "个性化面板拖拽前事件;arg1:拖拽类型 arg2:拖拽行信息", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/grid.json b/examples/docs/resources/pc/api/zh-CN/grid.json new file mode 100644 index 000000000..00c1f8136 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/grid.json @@ -0,0 +1,1728 @@ +{ + "gridattrs": [ + { + "name": "pager", + "sample": "grid-pager#pager-inner-pager", + "type": "Object", + "desc": "设置分页配置项。通过 pager 的属性 {component: Pager} 注入分页组件,{attrs:{currentPage: 1,pageSize: 5,pageSizes: [5, 10], total: 0,layout: 'total, prev, pager, next, jumper, sizes'}}配置分页", + "defaultValue": "" + }, + { + "name": "fetch-data", + "sample": "grid-data-source#tiny-first-menu-request-service", + "type": "Object", + "desc": "服务端数据查询方法", + "defaultValue": "" + }, + { + "name": "save-data", + "sample": "grid-toolbar#tiny-first-menu-save-data", + "type": "Object", + "desc": "服务端数据保存方法", + "defaultValue": "" + }, + { + "name": "delete-data", + "sample": "grid-toolbar#tiny-first-menu-save-data", + "type": "Object", + "desc": "服务端数据删除方法;({$grid,changeRecords},...args)=>{return new Promise((resolve,reject)=>{setTimeout(()=>{resolve()},300)})}", + "defaultValue": "" + }, + { + "name": "row-group", + "sample": "grid-row-grouping#row-grouping", + "type": "Object", + "desc": "row-group 属性可以配置行分组,行分组会将具有相同值的列进行分组展示。", + "defaultValue": "" + }, + { + "name": "toolbar", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "Object", + "desc": "工具栏配置", + "defaultValue": "" + }, + { + "name": "align", + "sample": "grid-align#align-grid-align-left-grid-align", + "type": "String", + "desc": "所有的列对齐方式;该属性的可选值为 left(左对齐), center(居中对齐), right(右对齐)", + "defaultValue": "该属性的默认值为 left" + }, + { + "name": "auto-resize", + "sample": "grid-width-height#tiny-first-menu-adaptive-grid-width-height", + "type": "Boolean", + "desc": "父元素响应式监听(对于父元素可能存在动态变化的场景可能会用到)", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "border", + "sample": "grid-grid-border#tiny-first-menu-grid-border", + "type": "Boolean", + "desc": "是否带有纵向边框", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "is-before-page-change", + "sample": "grid-event#event-page-change-event", + "type": "Boolean", + "desc": "是否打开页面改变时的前置处理特性。在值为true时,翻页操作或者改变页大小操作不会立即生效,留给用户处理业务逻辑,之后通过调用预留的callback或者rollback使之生效或者失效,详看事件before-page-change", + "defaultValue": "" + }, + { + "name": "cell-class-name", + "sample": "grid-custom-style#custom-style-cell-style", + "type": "String, Function", + "desc": "给单元格附加 className,也可以是函数 Function({seq, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "column-key", + "sample": "grid-operation-column#tiny-first-menu-column-key", + "type": "Boolean", + "desc": "是否需要为每一列的 VNode 设置 key 属性(非特殊情况下不需要使用)", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "column-min-width", + "sample": "grid-width-height#tiny-first-menu-column-min-width", + "type": "Number , String", + "desc": "设置可以调整到的最小宽度,不设置时默认为列头 span 的宽度 + 36(头部固定宽度)。 ;所有最小列宽度;会自动将剩余空间按比例分配;该属性的可选值为 整数, px,%", + "defaultValue": "" + }, + { + "name": "column-width", + "sample": "grid-width-height#tiny-first-menu-column-width", + "type": "Number, String", + "desc": "所有列宽度;该属性的可选值为 整数, px,%", + "defaultValue": "该属性的默认值为 默认均匀分配" + }, + { + "name": "context-menu", + "sample": "grid-context-menu#grid_Example-shortcutMenu-footer-menu", + "type": "Object", + "desc": "快捷菜单配置项", + "defaultValue": "" + }, + { + "name": "edit-rules", + "sample": "grid-validation#grid_Example-gridValid-editing-validation", + "type": "Object", + "desc": "校验规则配置项", + "defaultValue": "" + }, + { + "name": "expand-config", + "sample": "grid-tree-grid#tree-table-tree-grid-expand-config", + "type": "Object", + "desc": "展开行配置项;{expandAll: false, // 是否默认展开所有行\n trigger: 'row', // 展开行的触发方式,可选项包括 cell(单击图标所在单元格触发) / row (点击行触发),默认点击图标触发\n expandRowKeys: [], // 默认展开指定行(需要有 row-id\n accordion: false // 对于同一级的节点,是否每次只能展开一个\n activeMethod: Function () {} // 自定义展开规则}", + "defaultValue": "" + }, + { + "name": "fit", + "sample": "grid-width-height#tiny-first-menu-adaptive-column-width", + "type": "Boolean", + "desc": "所有列的宽度是否自撑开", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "footer-align", + "sample": "grid-align#align-footer-align-left-footer-align", + "type": "String", + "desc": "所有的表尾列的对齐方式;该属性的可选值为 left(左对齐), center(居中对齐), right(右对齐)", + "defaultValue": "该属性的默认值为 继承 align" + }, + { + "name": "optimization", + "sample": "grid-grid-optimization#tiny-first-menu-grid-optimization", + "type": "Object", + "desc": "优化配置项", + "defaultValue": "该属性的默认值为 animat: true,delayHover: 250,scrollX: {gt: 100, 指定大于多少范围时自动启动虚拟滚动(启用 X 虚拟滚动,必须固定所有列宽,否则无法兼容)默认100, oSize: 2, 当剩余数据少于指定范围时触发重新渲染 默认自动计算 rSize: 2, 每次渲染条数 默认自动计算 vSize: 5 指定可视区域条数 }, scrollY: { gt: 500, 指定大于多少范围时自动启动虚拟滚动(启用 Y 虚拟滚动,必须固定所有行高,否则无法兼容)默认500 oSize: 2, 当剩余数据少于指定范围时触发重新渲染 默认自动计算 rSize: 2, 每次渲染条数 默认自动计算 vSize: 5, 指定可视区域条数 默认自动计算 rHeight: 50, 指定行高 默认自动计算adaptive: true 自动适配最优的渲染方式 默认true }" + }, + { + "name": "params", + "sample": "grid-filter#grid-params", + "type": "Object", + "desc": "额外的参数", + "defaultValue": "" + }, + { + "name": "footer-cell-class-name", + "sample": "grid-custom-style#custom-style-footer-style-footer-cell-style", + "type": "String, Function", + "desc": "给表尾的单元格附加 className,也可以是函数 Function({$rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "footer-method", + "sample": "grid-summary#summary-custom-summary", + "type": "Function", + "desc": "表尾合计的计算方法 Function({columns, data});params:{columns:所有的列配置数据 data: 当前所有的表格数据}", + "defaultValue": "" + }, + { + "name": "footer-row-class-name", + "sample": "grid-custom-style#custom-style-footer-style-footer-cell-style", + "type": "String, Function", + "desc": "给表尾的行附加 className,也可以是函数 Function({$rowIndex});通过 footer-cell-class-name 和 footer-row-class-name 设置表尾的单元格和行样式 params:{$rowIndex:行标}", + "defaultValue": "" + }, + { + "name": "footer-span-method", + "sample": "grid-footer#footer-footer-row-or-column-span", + "type": "Function", + "desc": "表尾合并行或列,该函数 Function({$rowIndex, column, columnIndex, $columnIndex, data}) 返回计算后的值;通过 footer-method 和 footer-span-method 设置表尾合计行或列逻辑 必须配置 show-footer。 parmas:{ $rowIndex: 行标 column:列数据 columnIndex:列下标 data:一个数组,保存了当前合并和计算的数据}", + "defaultValue": "" + }, + { + "name": "header-align", + "sample": "grid-align#align-header-align-left-header-align", + "type": "String", + "desc": "所有的表头列的对齐方式;该属性的可选值为 left(左对齐), center(居中对齐), right(右对齐)", + "defaultValue": "该属性的默认值为 继承 align" + }, + { + "name": "header-cell-class-name", + "sample": "grid-custom-style#custom-style-header-style-header-cell-style", + "type": "String, Function", + "desc": "给表头的单元格附加 className,也可以是函数 Function({$rowIndex, column, columnIndex, $columnIndex});参数说明 params{$rowIndex:行标,column:列数据, columnIndex:列下标, $columnIndex:列下标 }", + "defaultValue": "" + }, + { + "name": "header-row-class-name", + "sample": "grid-custom-style#custom-style-header-style-header-cell-style", + "type": "String, Function", + "desc": "表头的行附加 className,也可以是函数 Function({$rowIndex});params:{$rowIndex:行标}", + "defaultValue": "" + }, + { + "name": "height", + "sample": "grid-width-height#tiny-first-menu-fixed-grid-height", + "type": "Number , String", + "desc": "设置表格内容区域(不含表格头部,底部)的高度。 不设置时,表格内容区域的高度度自适应。 ;表格的高度;支持铺满父容器或者固定宽高;该属性的可选值为 整数, px,%", + "defaultValue": "" + }, + { + "name": "highlight-cell", + "sample": "grid-highlight#highlight-highlight-cell", + "type": "Boolean", + "desc": "只对 editConfig 配置时有效,是否在编辑时高亮单元格边框", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "highlight-current-column", + "sample": "grid-highlight#highlight-highlight-current-column", + "type": "Boolean", + "desc": "是否要高亮当前列", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "highlight-current-row", + "sample": "grid-highlight#highlight-highlight-current-row", + "type": "Boolean", + "desc": "是否要高亮当前行", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "highlight-hover-column", + "sample": "grid-highlight#highlight-highlight-hover-column", + "type": "Boolean", + "desc": "鼠标移到列是否要高亮显示", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "highlight-hover-row", + "sample": "grid-highlight#highlight-highlight-hover-row", + "type": "Boolean", + "desc": "鼠标移到行是否要高亮显示", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "keyboard-config", + "sample": "grid-keyboard#keyboard-navigation", + "type": "Object", + "desc": "按键配置项;{isArrow: true // 启用方向键功能}", + "defaultValue": "" + }, + { + "name": "loading", + "sample": "grid-grid-loading-tip#tiny-first-menu-grid-loading-off-tip", + "type": "Boolean", + "desc": "表格是否显示加载中", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "max-height", + "sample": "grid-width-height#tiny-first-menu-min-grid-height", + "type": "Number , String", + "desc": "设置表格内容区域(不含表格头部,底部)的最大高度。;该属性的可选值为 整数, px,%", + "defaultValue": "" + }, + { + "name": "mouse-config", + "sample": "grid-keyboard#mouse-config", + "type": "Object", + "desc": "鼠标配置项;{selected: true // 是否开启左键选中单元格功能(只对 edit-config.mode=cell 有效),默认为 false}", + "defaultValue": "" + }, + { + "name": "radio-config", + "sample": "grid-operation-column#tiny-first-menu-radio-config", + "type": "Object", + "desc": "单选框配置项;{trigger: 'cell', // 触发选中的方式,可选项包括 cell(单击图标所在单元格触发) / row(点击行触发),默认点击图标触发 \n labelField: '', // 单选框显示的字段名,可以直接显示在单选框中\n checkRowKey: '', // 默认选中指定行(只会在初始化时被触发一次,需要有 row-id)\n checkMethod: Function() {} // 是否允许选中的方法,该方法的返回值用来决定这一行的 Radio 是否可以选中}", + "defaultValue": "" + }, + { + "name": "remote-filter", + "sample": "grid-filter#filter-server-filter", + "type": "Boolean", + "desc": "所有列是否使用服务端筛选,如果设置为 true 则不会对数据进行处理", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "remote-sort", + "sample": "grid-sort#sort-server-sort", + "type": "Boolean", + "desc": "是否将服务端的全部数据进行排序。默认为 false 不进行服务端排序。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "resizable", + "sample": "grid-width-height#tiny-first-menu-resize-column-width", + "type": "Boolean", + "desc": "设置是否允许调整列宽", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "row-class-name", + "sample": "grid-custom-style#custom-style-row-style", + "type": "String, Function", + "desc": "自定义表格行类名,用于自定义表格的行样式的场景。可以直接设置字符串类名,也可以是用函数 Function({seq, row, rowIndex, $rowIndex})返回类名", + "defaultValue": "" + }, + { + "name": "row-id", + "sample": "grid-sort#tiny-first-menu-row-id", + "type": "String", + "desc": "自定义行数据唯一主键的字段名(行数据必须要有唯一主键,默认自动生成)", + "defaultValue": "该属性的默认值为 _RID" + }, + { + "name": "row-key", + "sample": "", + "type": "Boolean", + "desc": "是否需要为每一行的 VNode 设置 key 属性(非特殊情况下没必要设置)", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "select-config", + "sample": "grid-operation-column#disable-selection", + "type": "Object", + "desc": "复选框配置项;{trigger: 'cell', // 触发选中的方式,可选项包括 cell(单击图标所在单元格触发) / row(点击行触发),默认点击图标触发 \n labelField: '', // 复选框显示的字段名,可以直接显示在复选框中\n checkRowKeys: [], // 默认勾选开指定行(只会在初始化时被触发一次,需要有 row-id)\n checkMethod: Function() {}, // 是否允许选中的方法,该方法的返回值用来决定这一行的 checkbox 是否可以勾选\n checkAll: true, // 默认勾选所有(只会在初始化时被触发一次)}\n showHeader: true, // 是否显示全选按钮(如果 checkStrictly=true 则默认为 false)\n checkStrictly: false, // 是否严格的遵循父子不互相关联的做法 \n reserve: false // 翻页操作是否保留历史选择数据}", + "defaultValue": "" + }, + { + "name": "show-footer", + "sample": "grid-summary#summary-cus tom-summary", + "type": "Boolean", + "desc": "是否显示表尾合计", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "show-header", + "sample": "grid-header#header-hide-grid-header", + "type": "Boolean", + "desc": "是否显示表头", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "show-header-overflow", + "sample": "grid-tip#tip-column-header-tip", + "type": "Boolean, String", + "desc": "设置表头所有内容过长时显示为省略号;该属性的可选值为 ellipsis(只显示省略号),title(并且显示为原生 title),tooltip(并且显示为 tooltip 提示)", + "defaultValue": "" + }, + { + "name": "show-overflow", + "sample": "grid-tip#tip-cell-tip", + "type": "Boolean, String", + "desc": "设置所有内容过长时显示为省略号(如果是固定列建议设置该值,提升渲染速度);该属性的可选值为 ellipsis(只显示省略号),title(并且显示为原生 title),tooltip(并且显示为 tooltip 提示)", + "defaultValue": "" + }, + { + "name": "size", + "sample": "grid-grid-size#tiny-first-menu-grid-size", + "type": "String", + "desc": "表格的尺寸;该属性的可选值为 medium, small, mini", + "defaultValue": "" + }, + { + "name": "sort-config", + "sample": "grid-sort#sort-default-sort", + "type": "Object", + "desc": "排序配置项;{trigger: 'cell' // 排序触发方式,可配置为 cell(点击头部单元格触发排序),不配置时默认为点击上下箭头触发排序}", + "defaultValue": "" + }, + { + "name": "sort-method", + "sample": "grid-sort#sort-custom-sort", + "type": "Function(arg1,arg2)", + "desc": "自定义所有列的排序方法,当触发排序时会调用该函数 Function(arg1, arg2) 返回排序后的结果;自定义排序方法,类似原生的sort排序,入参arguments: (arg1, arg2) arg1: 前一个比较数据项 arg2: 后一个比较数据项", + "defaultValue": "" + }, + { + "name": "span-method", + "sample": "grid-span#span-row-span-row-span", + "type": "Function", + "desc": "合并行或列,该函数 Function({seq, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, data}) 返回计算后的值", + "defaultValue": "该属性的默认值为 { rowspan: 1, colspan: 1}" + }, + { + "name": "start-index", + "sample": "grid-serial-column#tiny-first-menu-start-index", + "type": "Number", + "desc": "只对 type=index 的列有效,动态索引的起始值", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "stripe", + "sample": "grid-grid-stripe#stripe-stripe", + "type": "Boolean", + "desc": "是否带有斑马纹", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "sync-resize", + "sample": "grid-width-height#tiny-first-menu-adaptive-grid-width-height", + "type": "Boolean", + "desc": "响应式跟随某个属性(对于通过某个属性来控制显示/隐藏切换的场景可能会用到)", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "tree-config", + "sample": "grid-tree-grid#tree-table-tree-grid-base", + "type": "Object", + "desc": "树形结构配置项,tree-config:{children:'children'} children: 树表结构数据中用来定义数据下一级与子集的标识字符 ;{trigger: 'default', // 展开子级触发方式:'default'(点击按钮触发);'cell'(点击单元格触发);'row'(点击行触发)\nordered: true, // 子级索引是否按数字递增显示:true(子级索引按数字递增显示,父级1,子级2);false(子级索引在父级索引基础上增加,父级1,子级1.1)\nindent: 16, // 控制水平缩进距离,默认 16,单位 px\nchildren: 'children', // 指定子级数据的字段名\nexpandAll: false, // 是否展开所有行\nexpandRowKeys: [], // 默认展开所给数组中的指定行,需要有row-id,可以由行的'_RID'属性获取\naccordion: false, // 对于同一级的多个子节点,是否只能同时展开一个子节点}", + "defaultValue": "" + }, + { + "name": "valid-config", + "sample": "grid-validation#grid_Example-gridValid-valid-config", + "type": "Object", + "desc": "校验配置项;{message: 'inline'// 校验提示类型,'inline'(内置提示);'tooltip'(tooltip文字提示)}", + "defaultValue": "" + }, + { + "name": "summary-config", + "sample": "grid-summary#summary-configuration-summary", + "type": "Object", + "desc": "表格统计功能配置项;{ fields: ['employees'], // 统计字段名\n fraction: 2, // 小数点后保留的小数位\n truncate: false, // 是否截断,默认为四舍五入,不截断\n text: '' // 统计显示的文本 }", + "defaultValue": "" + }, + { + "name": "sortable", + "sample": "grid-customized#custom-column-sort", + "type": "Boolean", + "desc": "设置是否允许列数据排序。默认为 true 可排序", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "auto-load", + "sample": "grid-data-source#tiny-first-menu-auto-load", + "type": "Boolean", + "desc": "", + "defaultValue": "是否开启自动请求服务,配置 fetch-data 时有效,该属性的默认值为 true" + }, + { + "name": "is-async-column", + "sample": "grid-data-source#tiny-first-menu-column-asyn-rendering", + "type": "Boolean", + "desc": "设置表格的列是否延迟加载;是否开启异步列功能,配合 scrollLoad 一起使用", + "defaultValue": "" + }, + { + "name": "columns", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "Array", + "desc": "表格列的配置信息,具体参考列配置项", + "defaultValue": "" + }, + { + "name": "scroll-load", + "sample": "grid-large-data#tiny-first-menu-scroll-paging", + "type": "Object", + "desc": "滚动加载配置;scrollLoad={ isInfinity: false //是否连续 , \npageSize: 10 //每次加载多少条};设置是否滚动加载分页,当 showPager 为 true 时有效。", + "defaultValue": "" + }, + { + "name": "row-span", + "sample": "grid-span#span-row-span-row-span-easy", + "type": "Array", + "desc": "设置行合并,该属性仅适用于普通表格,不可与 tree-config 同时使用", + "defaultValue": "" + }, + { + "name": "render-empty", + "sample": "grid-empty-data-tip#tiny-first-menu-empty-data-tip", + "type": "Function", + "desc": "空数据渲染", + "defaultValue": "" + }, + { + "name": "events", + "sample": "grid-event#event-grid-events", + "type": "Object", + "desc": "事件对象", + "defaultValue": "" + }, + { + "name": "data", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "Array", + "desc": "设置表格的数据;", + "defaultValue": "" + }, + { + "name": "min-height", + "sample": "grid-width-height#tiny-first-menu-min-grid-height", + "type": "Number , String", + "desc": "设置表格内容区域(不含表格头部,底部)的最小高度。", + "defaultValue": "" + }, + { + "name": "drop-config", + "sample": "grid-drag#drag-row-drag", + "type": "Object", + "desc": "表格拖拽配置项;{plugin: Sortable, // sortablejs 插件\n row: true, // 开启行拖拽\n column: true, // 开启列拖拽\n onBeforeMove: Function() {return false}, // 拖拽前函数,返回 false 取消拖动\n filter: '.row__drag-disable', // 根据行的类名来控制是否可以拖动\n refresh: true // 如果变动了树层级,可以指定是否需要刷新数据}", + "defaultValue": "" + }, + { + "name": "edit-config", + "sample": "grid-editor#grid_Example-gridEdit-inner-editor", + "type": "Object , Boolean", + "desc": "表格编辑配置项,当配置为 Object 时,可配置如下字段:;{trigger: 'click', // 激活触发方式,可选项包括 click / dblclick / manual\n mode: 'cell', // 激活类型单元格激活或者行,可选项包括 cell / row\n showStatus: true, // 是否显示状态\n activeMethod: Function () {} // 自定义编辑规则}", + "defaultValue": "" + }, + { + "name": "seq-serial", + "sample": "grid-pager#pager-inner-pager", + "type": "Boolean", + "desc": "设置行序号是否连续,seqSerial 当 showSeq 为 true 时有效。", + "defaultValue": "设置行序号是否连续,开启分页时有效,该属性的默认值为 false" + }, + { + "name": "show-save-msg", + "sample": "grid-pager#pager-showSaveMsg", + "type": "Boolean", + "desc": "切换分页时有未保存的数据时是否进行提示", + "defaultValue": "" + }, + { + "name": "tooltip-config", + "sample": "grid-tip#tip-cell-tip", + "type": "Object", + "desc": "Grid 内置 tooltip 配置项,请参考 Tooltip 组件属性说明", + "defaultValue": "" + } + ], + "gridslots": [ + { + "name": "default", + "sample": "grid-slot#slot-default-slot", + "type": "", + "desc": "默认插槽(表格列 )", + "defaultValue": "" + }, + { + "name": "toolbar", + "sample": "grid-slot#slot-buttons-slot", + "type": "", + "desc": "工具栏,(包含:缩放、个性化、刷新表格、自定义按钮)", + "defaultValue": "" + }, + { + "name": "pager", + "sample": "grid-pager#pager-inner-pager", + "type": "", + "desc": "分页插件,", + "defaultValue": "" + }, + { + "name": "empty", + "sample": "grid-empty-data-tip#tiny-first-menu-empty-data-tip", + "type": "", + "desc": "空数据时显示的文本内容", + "defaultValue": "" + } + ], + "gridmethods": [ + { + "name": "clearActived()", + "sample": "grid-edit#tiny-first-menu-trigger-mode-for-editing", + "type": "", + "desc": "手动清除单元格激活状态", + "defaultValue": "" + }, + { + "name": "clearAll()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "手动清除表格所有条件,还原到初始状态(对于增删改查的场景中可能会用到,比如在数据保存之后清除表格缓存)", + "defaultValue": "" + }, + { + "name": "clearCurrentColumn()", + "sample": "grid-highlight#highlight-highlight-current-column", + "type": "", + "desc": "用于当前列,手动清空当前高亮的状态", + "defaultValue": "" + }, + { + "name": "clearCurrentRow()", + "sample": "grid-highlight#highlight-highlight-current-row", + "type": "", + "desc": "用于当前行,手动清空当前高亮的状态", + "defaultValue": "" + }, + { + "name": "clearData(rows, field)", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "手动清空单元格内容,如果不传参数,则清空整个表格内容,如果传了行则清空指定行内容,如果传了指定字段,则清空该字段内容", + "defaultValue": "" + }, + { + "name": "clearFilter(field)", + "sample": "grid-filter#filter-default-filter", + "type": "", + "desc": "手动清空筛选条件(如果不传 field 则清空所有筛选条件),数据会恢复成未筛选的状态", + "defaultValue": "" + }, + { + "name": "clearRadioRow()", + "sample": "grid-operation-column#tiny-first-menu-default-serial-column", + "type": "", + "desc": "用于单选行,手动清空用户的选择", + "defaultValue": "" + }, + { + "name": "clearRowExpand()", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "手动清空展开行状态,数据会恢复成未展开的状态", + "defaultValue": "" + }, + { + "name": "clearScroll()", + "sample": "grid-width-height#tiny-first-menu-min-grid-height", + "type": "", + "desc": "手动清除滚动相关信息,还原到初始状态", + "defaultValue": "" + }, + { + "name": "clearSelected()", + "sample": "grid-highlight#highlight-highlight-cell", + "type": "", + "desc": "手动清除单元格选中状态", + "defaultValue": "" + }, + { + "name": "clearSelection()", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "用于多选行,手动清空用户的选择", + "defaultValue": "" + }, + { + "name": "clearSort()", + "sample": "grid-sort#sort-default-sort", + "type": "", + "desc": "手动清空排序条件,数据会恢复成未排序的状态", + "defaultValue": "" + }, + { + "name": "clearTreeExpand()", + "sample": "grid-tree-grid#tree-table-tree-grid-insert-delete-update", + "type": "", + "desc": "手动清空树形节点的展开状态,数据会恢复成未展开的状态", + "defaultValue": "" + }, + { + "name": "closeFilter()", + "sample": "grid-filter#filter-default-filter", + "type": "", + "desc": "手动关闭筛选面板(某些特殊场景可能会用到)", + "defaultValue": "" + }, + { + "name": "closeMenu()", + "sample": "grid-context-menu#grid_Example-shortcutMenu-cell-menu", + "type": "", + "desc": "手动关闭快捷菜单(某些特殊场景可能会用到)", + "defaultValue": "" + }, + { + "name": "createData(records)", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "", + "desc": "创建 data 对象(对于某些特殊场景可能会用到,会自动对数据的字段名进行检测,如果不存在就自动定义)", + "defaultValue": "" + }, + { + "name": "createRow(records)", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "", + "desc": "创建 Row|Rows 对象(对于某些特殊场景需要对数据进行手动插入时可能会用到)", + "defaultValue": "" + }, + { + "name": "exportCsv(options)", + "sample": "grid-import-export#tiny-first-menu-export-excel", + "type": "", + "desc": "将表格数据导出为 .csv 文件(支持所有主流的浏览器,不支持合并行或列)", + "defaultValue": "" + }, + { + "name": "fullValidate(rows, callback)", + "sample": "grid-validation#grid_Example-gridValid-before-submit-validation", + "type": "", + "desc": "表格完整校验函数,和 validate 的区别就是会对全量数据的所有规则进行完整校验", + "defaultValue": "" + }, + { + "name": "getActiveRow()", + "sample": "grid-edit#tiny-first-menu-trigger-mode-for-editing", + "type": "", + "desc": "获取已激活的行数据", + "defaultValue": "" + }, + { + "name": "getColumnByField(field)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "根据列的字段名获取列", + "defaultValue": "" + }, + { + "name": "getColumnById(colid)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "根据列的唯一主键获取列", + "defaultValue": "" + }, + { + "name": "getColumnIndex(column)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "根据 column 获取相对于 columns 中的索引", + "defaultValue": "" + }, + { + "name": "getColumnNode(cell)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "根据 th/td 元素获取对应的 column 信息", + "defaultValue": "" + }, + { + "name": "getColumns(columnIndex)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "获取表格的可视列,也可以指定索引获取列", + "defaultValue": "" + }, + { + "name": "getCurrentRow()", + "sample": "grid-event#tiny-first-menu-get-row-method", + "type": "", + "desc": "用于当前行,获取当前行的数据", + "defaultValue": "" + }, + { + "name": "getData(rowIndex)", + "sample": "grid-data-source#tiny-first-menu-columns", + "type": "", + "desc": "获取数据,和 data 的行为一致,也可以指定索引获取数据", + "defaultValue": "" + }, + { + "name": "getInsertRecords()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "获取新增的数据", + "defaultValue": "" + }, + { + "name": "getRadioRow()", + "sample": "grid-event#tiny-first-menu-get-row-method", + "type": "", + "desc": "用于单选行,获取当已选中的数据", + "defaultValue": "" + }, + { + "name": "getRecordset()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "获取表格数据集(获取新增、删除、更改的数据,对于增删改查表格非常方便)", + "defaultValue": "" + }, + { + "name": "getRemoveRecords()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "获取已删除的数据", + "defaultValue": "" + }, + { + "name": "getRowById(rowid)", + "sample": "grid-event#tiny-first-menu-get-row-method", + "type": "", + "desc": "根据行的唯一主键获取行", + "defaultValue": "" + }, + { + "name": "getRowIndex(row:Object)", + "sample": "grid-event#tiny-first-menu-get-row-method", + "type": "", + "desc": "根据 row 获取相对于 data 中的索引", + "defaultValue": "" + }, + { + "name": "getRowNode(tr)", + "sample": "grid-event#tiny-first-menu-get-row-method", + "type": "", + "desc": "根据 tr 元素获取对应的 row 信息", + "defaultValue": "" + }, + { + "name": "getSelectRecords()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "用于多选行,获取已选中的数据", + "defaultValue": "" + }, + { + "name": "getTableColumn()", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "", + "desc": "获取当前表格的列(完整的全量表头列、处理条件之后的全量表头列、当前渲染中的表头列)", + "defaultValue": "" + }, + { + "name": "getTableData()", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "", + "desc": "获取当前表格的数据(完整的全量表体数据、处理条件之后的全量表体数据、当前渲染中的表体数据、当前渲染中的表尾数据)", + "defaultValue": "" + }, + { + "name": "getUpdateRecords()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "获取已修改的数据", + "defaultValue": "" + }, + { + "name": "handleFetch()", + "sample": "grid-data-source#tiny-first-menu-request-service", + "type": "", + "desc": "触发表格的fetch-data", + "defaultValue": "" + }, + { + "name": "hasActiveRow(row)", + "sample": "grid-edit#tiny-first-menu-trigger-mode-for-editing", + "type": "", + "desc": "检查行是否已激活为编辑状态", + "defaultValue": "" + }, + { + "name": "hasRowChange(row, field)", + "sample": "grid-edit#tiny-first-menu-row-editing", + "type": "", + "desc": "检查行或列数据是否发生改变", + "defaultValue": "" + }, + { + "name": "hasRowExpand(row)", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "检查行是否已展开", + "defaultValue": "" + }, + { + "name": "hasTreeExpand(row)", + "sample": "grid-tree-grid#tree-table-hasTreeExpand", + "type": "", + "desc": "检查树节点是否已展开", + "defaultValue": "" + }, + { + "name": "hideColumn(column)", + "sample": "grid-customized#custom-column-visible-hidden", + "type": "", + "desc": "隐藏指定列", + "defaultValue": "" + }, + { + "name": "insert(records)", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "在表格中新增数据。 ;往表格插入数据,从第一行新增一行或多行新数据", + "defaultValue": "" + }, + { + "name": "insertAt(records, row)", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "往表格插入数据,从指定位置插入一行或多行;第二个参数:row 指定位置(不支持树表格)、null从第一行插入、-1 从最后插入", + "defaultValue": "" + }, + { + "name": "loadColumn(columns)", + "sample": "grid-large-data#large-data-load-column", + "type": "", + "desc": "加载列配置(对于表格列需要重载、局部递增场景下可能会用到)", + "defaultValue": "" + }, + { + "name": "loadData(data)", + "sample": "grid-large-data#tiny-first-menu-full-data-loading", + "type": "", + "desc": "加载数据(对于表格数据需要重载、局部递增场景下可能会用到)", + "defaultValue": "" + }, + { + "name": "recalculate()", + "sample": "grid-width-height#recalculate", + "type": "", + "desc": "重新计算表格(对于某些特殊场景可能会用到,比如隐藏的表格、更新列宽...等)", + "defaultValue": "" + }, + { + "name": "refreshColumn()", + "sample": "grid-customized#custom-column-visible-hidden", + "type": "", + "desc": "刷新列配置(对于显示/隐藏列场景下可能会用到)", + "defaultValue": "" + }, + { + "name": "refreshData()", + "sample": "grid-tree-grid#tree-table-tree-grid-insert-delete-update", + "type": "", + "desc": "同步刷新 data 数据;如果用了该方法,那么组件将不再记录增删改的状态,只能自行实现对应逻辑(对于某些特殊的场景,比如深层树节点元素发生变动时可能会用到)", + "defaultValue": "" + }, + { + "name": "reloadCustoms(customs)", + "sample": "grid-customized#custom-server-storage", + "type": "", + "desc": "初始化加载显示/隐藏列(对于异步更新的场景下可能会用到)", + "defaultValue": "" + }, + { + "name": "remove(rows)", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "删除指定行数据,指定 row 或 [row, ...] 删除多条数据,如果为空则删除所有数据", + "defaultValue": "" + }, + { + "name": "removeSelecteds()", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "", + "desc": "删除已选中的所有行数据", + "defaultValue": "" + }, + { + "name": "resetAll()", + "sample": "grid-customized#custom-column-width", + "type": "", + "desc": "手动重置列的所有操作,还原到初始状态(如果已关联工具栏,则会同步更新)", + "defaultValue": "" + }, + { + "name": "resetCustoms()", + "sample": "grid-customized#custom-column-width", + "type": "", + "desc": "手动重置列的显示/隐藏操作,还原到初始状态(如果已关联工具栏,则会同步更新)", + "defaultValue": "" + }, + { + "name": "resetResizable()", + "sample": "grid-customized#custom-column-width", + "type": "", + "desc": "手动重置列宽拖动的操作,还原到初始状态(如果已关联工具栏,则会同步更新)", + "defaultValue": "" + }, + { + "name": "revertData(rows, field)", + "sample": "grid-edit#tiny-first-menu-row-editing", + "type": "", + "desc": "还原更改,还原指定行 row 或者整个表格的数据", + "defaultValue": "" + }, + { + "name": "scrollTo(scrollLeft, scrollTop)", + "sample": "grid-large-data#large-data-scroll-to", + "type": "", + "desc": "如果有滚动条,则滚动到对应的位置", + "defaultValue": "" + }, + { + "name": "scrollToColumn(column)", + "sample": "grid-large-data#large-data-scroll-to", + "type": "", + "desc": "如果有滚动条,则滚动到对应的列", + "defaultValue": "" + }, + { + "name": "scrollToRow(row)", + "sample": "grid-large-data#large-data-scroll-to", + "type": "", + "desc": "如果有滚动条,则滚动到对应的行", + "defaultValue": "" + }, + { + "name": "setActiveCell(row, field)", + "sample": "grid-edit#tiny-first-menu-cell-editing", + "type": "", + "desc": "激活单元格编辑", + "defaultValue": "" + }, + { + "name": "setActiveRow(row)", + "sample": "grid-edit#tiny-first-menu-cell-editing", + "type": "", + "desc": "激活行编辑,如果是 mode=cell 则默认激活第一个单元格", + "defaultValue": "" + }, + { + "name": "setAllRowExpansion(checked)", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "设置所有行的展开与否", + "defaultValue": "" + }, + { + "name": "setAllSelection(checked)", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "入参为boolean,用于多选行,设置所有行的选中状态,", + "defaultValue": "" + }, + { + "name": "setAllTreeExpansion(checked)", + "sample": "grid-tree-grid#tree-table-tree-grid-operation-column", + "type": "", + "desc": "设置所有树节点的展开与否", + "defaultValue": "" + }, + { + "name": "setCurrentRow(row)", + "sample": "grid-highlight#highlight-highlight-hover-row", + "type": "", + "desc": "用于当前行,设置某一行为高亮状态", + "defaultValue": "" + }, + { + "name": "setRadioRow(row)", + "sample": "grid-operation-column#tiny-first-menu-default-serial-column", + "type": "", + "desc": "用于单选行,设置某一行为选中状态", + "defaultValue": "" + }, + { + "name": "setRowExpansion(rows, checked)", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "设置展开行,二个参数设置这一行展开与否", + "defaultValue": "" + }, + { + "name": "setSelection(rows, checked)", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "用于多选行,设置行为选中状态,第二个参数为选中与否", + "defaultValue": "" + }, + { + "name": "setTreeExpansion(rows, checked)", + "sample": "grid-tree-grid#tree-table-tree-grid-operation-column", + "type": "", + "desc": "设置展开树形节点,二个参数设置这一行展开与否", + "defaultValue": "" + }, + { + "name": "showColumn(column)", + "sample": "grid-customized#custom-column-visible-hidden", + "type": "", + "desc": "显示指定列", + "defaultValue": "" + }, + { + "name": "sort(field, order)", + "sample": "grid-sort#sort-custom-sort", + "type": "", + "desc": "手动对表格进行排序(如果 order 为空则自动切换排序)", + "defaultValue": "" + }, + { + "name": "toggleAllSelection()", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "用于多选行,切换所有行的选中状态", + "defaultValue": "" + }, + { + "name": "toggleRowExpansion(row)", + "sample": "grid-nested-grid#grid_Example-nestedGrid", + "type": "", + "desc": "用于可展开表格,切换展开行", + "defaultValue": "" + }, + { + "name": "toggleRowSelection(row)", + "sample": "grid-operation-column#tiny-first-menu-custom-serial-column", + "type": "", + "desc": "用于多选行,切换某一行的选中状态", + "defaultValue": "" + }, + { + "name": "toggleTreeExpansion(row)", + "sample": "grid-tree-grid#tree-table-tree-grid-operation-column", + "type": "", + "desc": "用于可树形表格,切换展开树形节点", + "defaultValue": "" + }, + { + "name": "validate(rows, callback)", + "sample": "grid-validation#grid_Example-gridValid-before-submit-validation", + "type": "", + "desc": "表格校验函数,如果指定 row 或 rows 则校验指定一行或多行,否则校验整个表格。该回调函数会在校验结束后被调用,并传入两个参数:(是否校验成功,最近一列未通过校验的字段)。若不传入回调函数,则会返回一个 promise", + "defaultValue": "" + } + ], + "gridevents": [ + { + "name": "page-change", + "sample": "grid-event#event-page-change-event", + "type": "Object(arg)", + "desc": "只对 pager-config 配置时有效,分页发生改变时会触发该事件;//参数arg\n { $grid: VueComponent, //table组件vue实例 \ncurrentPage: 1 //当前页码 \nlayout: 'total, prev, pager, next, jumper, sizes' //当前分页组件布局信息 \npageSize: 10// 当前每页显示条数 \npageSizes:[5, 10] //可切换的每页条数 \ntotal: 10 //总数据条数 }", + "defaultValue": "" + }, + { + "name": "before-page-change", + "sample": "grid-event#event-page-change-event", + "type": "Function(arg)", + "desc": "在打开页面改变时的前置处理特性,并且进行翻页操作或者改变页大小操作时触发;//参数arg:\n{ newPage, //新页码\nnewPageSize//为新的页大小\ncurrentPage,//当前页码\ncurrentPageSize, //当前的页大小\ncallback,//生效回调\nrollback//失效回调\nrollback,//回退,可能不存在}", + "defaultValue": "" + }, + { + "name": "toolbar-button-click", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "Function(arg, event)", + "desc": "只对 toolbar.buttons 配置时有效,当工具栏的按钮被点击时会后触发该事件;//arg1:\n{ $grid: VueComponent, //表格组件实例对象信息 \nbutton, //按钮信息对象 \ncode// 按钮功能类型 \n}\n //arg2:\nevent//原生点击事件", + "defaultValue": "" + }, + { + "name": "cell-click", + "sample": "grid-event#event-cell-click-event", + "type": "Function(arg1, event)", + "desc": "单元格被点击时会触发该事件;arg1:{row: 当前行,rowIndex: 当前行的下标,column: 当前列,columnIndex: 当前列的下标}", + "defaultValue": "" + }, + { + "name": "cancel-page-change", + "sample": "grid-pager#pager-inner-pager", + "type": "Function()", + "desc": "切换分页时有未保存的数据时,提示框确定按钮事件", + "defaultValue": "" + }, + { + "name": "cell-context-menu", + "sample": "grid-context-menu#grid_Example-shortcutMenu-menu-permissions", + "type": "Function(arg)", + "desc": "单元格被鼠标右键点击时触发该事件,arg:{row:当前行}", + "defaultValue": "" + }, + { + "name": "cell-dblclick", + "sample": "grid-event#event-cell-dblclick-event", + "type": "Function(arg1,event)", + "desc": "单元格被双击时会触发该事件;//arg1\n{row, //当前行\nrowIndex, //当前行的下标\ncolumn, // 当前列\ncolumnIndex// 当前列的下标\n},\nevent //点击事件", + "defaultValue": "" + }, + { + "name": "cell-mouseenter", + "sample": "grid-event#event-cell-mouseenter-event", + "type": "Function(arg1,event)", + "desc": "当单元格 hover 进入时会触发该事件;//arg1\n{row, //当前行\nrowIndex, //当前行的下标\ncolumn, // 当前列\ncolumnIndex// 当前列的下标\n},\nevent //原生事件", + "defaultValue": "" + }, + { + "name": "cell-mouseleave", + "sample": "grid-event#event-cell-mouseleave-event", + "type": "", + "desc": "当单元格 hover 退出时会触发该事件", + "defaultValue": "" + }, + { + "name": "context-menu-click", + "sample": "grid-context-menu#grid_Example-shortcutMenu-header-menu", + "type": "Function(arg1)", + "desc": "只对 context-menu 配置时有效,当点击快捷菜单时会触发该事件;//arg1\n{table: VueComponent, //table组件vue实例\ncell, //点击的单元格dom\ncolumn, // 列配置信息\ncolumnIndex:Number,// 点击所在列的索引\ncolumns: Array,//所有列信息},\nmenu: Object,// 当前显示上下文菜单的配置,options: Arry,// 上下文菜单的配置列表\nrow: Object, // 点击的单元格所在行的数据\nrowIndex: 1,// 点击的单元格所在行的索引\ntype: 'body'// 上下文菜单的显示位置}", + "defaultValue": "" + }, + { + "name": "current-change", + "sample": "grid-highlight#highlight-highlight-cell", + "type": "Function(arg1,arg2)", + "desc": "只对 highlightCurrentRow 有效,当手动选中行并且值发生改变时触发的事件,arg1:Object 手动选中行的相关信息对象,arg2:event", + "defaultValue": "" + }, + { + "name": "edit-actived", + "sample": "grid-event#event-edit-actived-event", + "type": "Function(arg1,arg2)", + "desc": "单元格被激活编辑时会触发该事件,arg1:Object 激活编辑单元格的相关信息对象,arg2:event", + "defaultValue": "" + }, + { + "name": "edit-closed", + "sample": "grid-event#event-edit-closed-event", + "type": "Function(arg1,arg2)", + "desc": "单元格编辑状态下被关闭时会触发该事件,arg1:Object 激活编辑单元格的相关信息对象,arg2:event", + "defaultValue": "" + }, + { + "name": "edit-disabled", + "sample": "grid-event#event-edit-disabled-event", + "type": "Function(arg1,arg2)", + "desc": "当单元格激活时如果是禁用状态时会触发该事件,arg1:Object 激活编辑单元格的相关信息对象,arg2:event", + "defaultValue": "" + }, + { + "name": "filter-change", + "sample": "grid-filter#filter-server-filter", + "type": "Function(arg1,arg2)", + "desc": "当筛选条件发生变化时会触发该事件;//arg1:\n{$table:Object, //表格的信息对象\nfilters,//过滤列的过滤数据信息},//\narg2:\n{ $table:Object,// 表格的信息对象 \nfilters,//过滤列的过滤数据信息}", + "defaultValue": "" + }, + { + "name": "footer-cell-click", + "sample": "grid-event#event-footer-cell-context-menu-event", + "type": "Function(arg1,arg2)", + "desc": "表尾单元格被点击时会触发该事件;//arg1:当前表过table对象\n{\n$columnIndex: 2,$rowIndex: 0,$table: VueComponent, //table组件vue实例\ncell,// 当前单元格节点\ncolumn: ColumnConfig,// 当前列信息\ncolumnIndex: 2}\n//arg2:event //原生事件", + "defaultValue": "" + }, + { + "name": "footer-cell-context-menu", + "sample": "grid-context-menu#grid_Example-shortcutMenu-cell-menu", + "type": "Function(arg1,arg2)", + "desc": "表尾单元格被鼠标右键点击时触发该事件;//arg1:当前表过table对象\n{\n$columnIndex: 2,$rowIndex: 0,$table: VueComponent, //table组件vue实例\ncell,// 当前单元格节点\ncolumn: ColumnConfig,// 当前列信息\ncolumnIndex: 2, \noptions:Array,//配置清除等功能信息\ntype: 'footer'//表格区域类型\n}\n//arg2:event //原生事件", + "defaultValue": "" + }, + { + "name": "footer-cell-dblclick", + "sample": "grid-footer#footer-footer-summation", + "type": "Function(arg1,arg2)", + "desc": "表尾单元格被双击时会触发该事件;//arg1:当前表过table对象\n{\n$columnIndex: 2,$rowIndex: 0,$table: VueComponent, //table组件vue实例\ncell,// 当前单元格节点\ncolumn: ColumnConfig,// 当前列信息\ncolumnIndex: 2}\n//arg2:event //原生事件", + "defaultValue": "" + }, + { + "name": "header-cell-click", + "sample": "grid-event#event-header-click-event", + "type": "Function(arg1,arg2)", + "desc": "表头单元格被点击时会触发该事件;//arg1:当前表过table对象\n{\n$columnIndex: 2,$rowIndex: 0,$table: VueComponent, //table组件vue实例\ncell,// 点击表头单元格\ncolumn: ColumnConfig,// 当前列信息\ncolumnIndex: 2,\ntriggerFilter:false,//当前点击节点过滤标识\ntriggerSort:false,//当前点击节点排序标识}\n//arg2:event //原生事件", + "defaultValue": "" + }, + { + "name": "header-cell-context-menu", + "sample": "grid-event#event-header-cell-context-menu-event", + "type": "Function(arg1,arg2)", + "desc": "表头单元格被鼠标右键点击时触发该事件;//arg1:当前表过table对象\n{\n$columnIndex: 2,$rowIndex: 0,$table: VueComponent, //table组件vue实例\ncell,// 当前单元格节点\ncolumn: ColumnConfig,// 当前列信息\ncolumnIndex: 2, \noptions:Array,//配置清除等功能信息\ntype: 'header'//表格区域类型\n}\n//arg2:event //原生事件", + "defaultValue": "" + }, + { + "name": "header-cell-dblclick", + "sample": "grid-event#event-header-dblclick-event", + "type": "Function(arg1,arg2)", + "desc": "表头单元格被双击时会触发该事件;//arg1:\n{column, // 列数据\ncolumnIndex, // 列索引\n$table, // table组件 vue实例\ncell// 点击的单元格dom\n}\n//arg2:\nevent//原生事件", + "defaultValue": "" + }, + { + "name": "radio-change", + "sample": "grid-event#event-radio-change-event", + "type": "Function(arg1,arg2)", + "desc": "只对 type=radio 有效,当手动勾选并且值发生改变时触发的事件;//参数描述:\narg1 $table: VueComponent table组件vue实例\n arg2 event 原生radio的change事件对象", + "defaultValue": "" + }, + { + "name": "resizable-change", + "sample": "grid-event#event-resizable-change-event", + "type": "Function(arg1)", + "desc": "当列宽拖动发生变化时会触发该事件;//参数描述 arg1\n{$table: VueComponent,// table组件的vue 实例 \ncolumn, //列配置信息 \ncolumnIndex:1//拖动列的索引\nfixed// 是否固定列}", + "defaultValue": "" + }, + { + "name": "scroll", + "sample": "grid-event#event-grid-scroll-event", + "type": "Function(arg, event)", + "desc": "表格滚动时会触发该事件;//arg1:\n{\n $table: VueComponent(表格实例对象信息)\n fixed: undefined\n isX: false :(X轴滚动)\n isY: true(Y轴滚动)\n scrollLeft: 0(X轴滚动距离)\n scrollTop: 66 (Y轴滚动距离)\n type: 'body'\n }\n arg2:event", + "defaultValue": "" + }, + { + "name": "select-all", + "sample": "grid-event#event-select-all-event", + "type": "Function(arg,event)", + "desc": "只对 type=selection 有效,当手动勾选全选时触发的事件;//arg1:\n{\n $table: VueComponent 表格实例对象信息\n checked: 勾选状态\n selection: 选中的表格数据数组\n }\n arg2:event", + "defaultValue": "" + }, + { + "name": "select-change", + "sample": "grid-event#event-select-change-event", + "type": "Function(arg,event)", + "desc": "只对 type=selection 有效,当手动勾选并且值发生改变时触发的事件;//arg1:\n{\n $columnIndex: 0\n $rowIndex: 0\n $seq: ''\n $table: VueComponent (表格实例对象信息)\n checked: true (勾选状态)\n column: ColumnConfig {…} (列信息)\n columnIndex: 0 (列下标)\n data: [{…}, {…}, {…}, {…}, {…}, {…}] (表格数据)\n fixed: undefined\n isHidden: undefined\n level: 0\n row: {…} (勾选项的行数据信息)\n rowIndex: 0 (勾选项的行下标)\n selection: [{…}] (选中的数据)\n seq: 1\n }\n arg2:event ", + "defaultValue": "" + }, + { + "name": "toggle-expand-change", + "sample": "grid-event#event-toggle-expand-change-event", + "type": "Function(arg,event)", + "desc": "当行展开或收起时会触发该事件;//参数arg1:\n{ $table: VueComponent,// 表格实例对象信息\nrow, //点击展开行的数据信息对象\nrowIndex,// 点击展开行的下标 } \n //参数arg2:\nevent//事件对象", + "defaultValue": "" + }, + { + "name": "toggle-tree-change", + "sample": "grid-event#event-toggle-tree-change-event", + "type": "Function(arg,event)", + "desc": "当树节点展开或收起时会触发该事件;//参数 arg1:\n{ $table: VueComponent,// 表格实例对象信息\nrow,// 点击展开行的数据信息对象\nrowIndex,// 点击展开行的下标\n} \n//参数 arg2:\nevent:事件对象", + "defaultValue": "" + }, + { + "name": "valid-error", + "sample": "grid-event#event-valid-error-event", + "type": "Function(arg)", + "desc": "当数据校验不通过时会触发该事件;//参数arg:\n{ cell,//校验的单元格信息对象\ncolumn,//校验单元格所在列的列配置信息对象\nrow,//校验单元格所在行的信息对象\nrule// 校验规则信息对象 }", + "defaultValue": "" + }, + { + "name": "BeforeEdit", + "sample": "grid-event#event-edit-disabled-event", + "type": "", + "desc": "点击单元格,显示编辑组件前触发的事件。;点击单元格,显示编辑组件前触发的事件 —— edit-config 中的 activeMethod 方法", + "defaultValue": "" + }, + { + "name": "CellClick", + "sample": "grid-event#event-cell-click-event", + "type": "Function(arg1,event)", + "desc": "点击单元格触发的事件。arg1:{row: 当前行,rowIndex: 当前行的下标,column: 当前列,columnIndex: 当前列的下标},event:点击事件", + "defaultValue": "" + }, + { + "name": "sort-change", + "sample": "grid-sort#sort-server-sort", + "type": "Function(arg)", + "desc": "点击列头,执行数据排序前触发的事件。;//参数arg1:\n{ $grid: VueComponent,// (表格实例对象信息\ncolumn: ColumnConfign,// (列信息) \nfield: 'name',// (排序的字段名) \norder: 'asc',//(排序类型升序或降序) \nprop: 'name',\n property: 'name'}", + "defaultValue": "" + }, + { + "name": "fullscreen", + "sample": "grid-toolbar#tiny-first-menu-grid-full-screen", + "type": "", + "desc": "全屏时或关闭全屏时触发的时间", + "defaultValue": "" + } + ], + "columnattrs": [ + { + "name": "align", + "sample": "grid-align#align-column-align", + "type": "String", + "desc": "列对其方式;该属性的可选值为 left(左对其), center(居中对其), right(右对齐)", + "defaultValue": "该属性的默认值为 继承 table 的 align" + }, + { + "name": "class-name", + "sample": "grid-custom-style#custom-style-cell-style", + "type": "String, Function", + "desc": "给单元格附加 className,也可以是函数 Function({seq, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "multi", + "sample": "grid-filter#filter-default-filter", + "type": "Boolean", + "desc": "是 filter 对象内置的属性,筛选是否允许多选;设置选择列是否显示复选框。当 columnType 为 'select' 时有效。", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "method", + "sample": "grid-filter#filter-custom-filter", + "type": "Function", + "desc": "是 filter 对象内置的自定义筛选方法 Function({value, row, column})", + "defaultValue": "" + }, + { + "name": "fixed", + "sample": "grid-fixed#fixed-left-fixed", + "type": "String", + "desc": "将列固定在左侧,其中 freezable 可冻结可解冻,在表格个性化面板中可操作,而 frozen 只能冻结不能解冻,在个性化面板中不可操作;将列固定在左侧或者右侧(注意:固定列应该放在左右两侧的位置);该属性的可选值为 left(固定左侧), right(固定右侧)", + "defaultValue": "" + }, + { + "name": "footer-align", + "sample": "grid-align#align-footer-align-left-footer-align", + "type": "String", + "desc": "表尾列的对齐方式;该属性的可选值为 left(左对其), center(居中对其), right(右对齐)", + "defaultValue": "该属性的默认值为 继承 align > 继承 table 的 footer-align" + }, + { + "name": "footer-class-name", + "sample": "grid-footer#footer-footer-class-name", + "type": "String, Function", + "desc": "给表尾的单元格附加 className,也可以是函数 Function({$rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "header-align", + "sample": "grid-align#align-header-align-left-header-align", + "type": "String", + "desc": "表头列的对齐方式;该属性的可选值为 left(左对其), center(居中对其), right(右对齐)", + "defaultValue": "该属性的默认值为 继承 align > 继承 table 的 header-align" + }, + { + "name": "header-class-name", + "sample": "grid-header#header-header-class-name", + "type": "String, Function", + "desc": "设置列头样式名称;给表头的单元格附加 className,也可以是函数 Function({$rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "index-method", + "sample": "grid-serial-column#tiny-first-menu-custom-serial-column", + "type": "Function", + "desc": "只对 type=index 有效,自定义索引方法 Function({row, rowIndex, column, columnIndex})", + "defaultValue": "" + }, + { + "name": "min-width", + "sample": "grid-width-height#tiny-first-menu-min-width", + "type": "Number, String", + "desc": "最小列宽度;会自动将剩余空间按比例分配;该属性的可选值为 整数, px,%", + "defaultValue": "该属性的默认值为 继承 table 的 column-min-width" + }, + { + "name": "show-icon", + "sample": "grid-edit#tiny-first-menu-cell-editing", + "type": "Boolean", + "desc": "是否显示列头编辑图标,在编辑时有效", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "params", + "sample": "grid-filter#column-column-params", + "type": "Object", + "desc": "额外的参数(自定义一些数据参数,对于某些特殊的场景可能会用到)", + "defaultValue": "" + }, + { + "name": "remote-sort", + "sample": "grid-sort#sort-server-sort", + "type": "Boolean", + "desc": "是否使用服务端排序,如果设置为 true 则不会对数据进行处理", + "defaultValue": "该属性的默认值为 继承 table 的 remote-sort" + }, + { + "name": "resizable", + "sample": "grid-width-height#tiny-first-menu-resize-column-width", + "type": "Boolean", + "desc": "设置该列是否可以调整列宽;列是否允许拖动列宽调整大小", + "defaultValue": "该属性的默认值为 继承 table 的 resizable" + }, + { + "name": "show-header-overflow", + "sample": "grid-tip#tip-column-header-tip", + "type": "String,Boolean", + "desc": "当表头内容过长时显示为省略号;该属性的可选值为 ellipsis(只显示省略号), title(并且显示为原生 title), tooltip(并且显示为 tooltip 提示)", + "defaultValue": "该属性的默认值为 继承 table 的 show-header-overflow" + }, + { + "name": "show-overflow", + "sample": "grid-tip#tip-cell-tip", + "type": "String,Boolean", + "desc": "当内容过长时显示为省略号;该属性的可选值为 ellipsis(只显示省略号), title(并且显示为原生 title), tooltip(并且显示为 tooltip 提示)", + "defaultValue": "该属性的默认值为 继承 table 的 show-overflow" + }, + { + "name": "sort-by", + "sample": "grid-sort#sort-combinations-sort", + "type": "String, Array", + "desc": "只对 sortable 有效,自定义排序的属性", + "defaultValue": "" + }, + { + "name": "rules", + "sample": "", + "type": "Object", + "desc": "表单的验证功能", + "defaultValue": "" + }, + { + "name": "required", + "sample": "grid-validation#grid_Example-gridValid-editing-validation", + "type": "Boolean", + "desc": "是否必填,如不设置,则会根据校验规则自动生成", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "sort-method", + "sample": "grid-sort#sort-custom-sort", + "type": "Function", + "desc": "自定义所有列的排序方法,当触发排序时会调用该函数 Function({ data, column, property, order }) 返回排序后的结果", + "defaultValue": "" + }, + { + "name": "sortable", + "sample": "grid-sort#sort-default-sort", + "type": "Boolean", + "desc": "设置该列数据是否可以排序。;是否允许列排序", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "title", + "sample": "grid-data-source#tiny-first-menu-static-data", + "type": "String , Function", + "desc": "列标题(支持开启国际化),可以是函数 Function(h, params)", + "defaultValue": "" + }, + { + "name": "tree-node", + "sample": "grid-tree-grid#tree-table-tree-grid-base", + "type": "Boolean", + "desc": "只对 tree-config 配置时有效,指定为树节点", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "format-value", + "sample": "grid-edit#tiny-first-menu-format-value", + "type": "Function", + "desc": "格式化单元格编辑器组件的传入值", + "defaultValue": "" + }, + { + "name": "format-text", + "sample": "grid-renderer#grid_Example-gridRenderer-inner-renderer", + "type": "String , Function", + "desc": "设置当前表格列的显示获取编辑类型;设置当前表格列的显示获取编辑类型,也可以是函数 Function(params);该属性的可选值为 money / enum / select / number / integer / filesize / date / dateTime / longDateTime / time / longTime / yearMonth / ellipsis / rate / boole", + "defaultValue": "" + }, + { + "name": "type", + "sample": "grid-serial-column#tiny-first-menu-default-serial-column", + "type": "String", + "desc": "设置内置列的类型;设置内置列的类型;该属性的可选值为 index(序号)/ selection(复选框)/ radio(单选框)/ expand(展开行)", + "defaultValue": "" + }, + { + "name": "width", + "sample": "grid-width-height#tiny-first-menu-fixed-column-width", + "type": "Number , String", + "desc": "设置列的宽度,可以是像素或者百分比或者'auto',设置为'auto'时,列宽会自动适应。;列宽度;该属性的可选值为 整数 / px /%", + "defaultValue": "该属性的默认值为 继承 table 的 column-width" + }, + { + "name": "format-config", + "sample": "grid-data-source#tiny-first-menu-column-asyn-rendering", + "type": "Object", + "desc": "开启该列数据异步渲染。;{data: [], // 列数据源\n type: '', // 内置渲染器类型,与 format-text 属性取值相同\n async: true, // 配置为 true 后,支持动态修改 data 的数据。还可以配置为对象,配置为对象时,对象中可以配置 splitConfig.enabled(是否启用分隔配置)、splitConfig.valueSplit(指定 value 值的分隔符)、splitConfig.textSplit(指定 text 的分隔符)、fetch(列数据异步渲染,请求数据)\n label: '' // 单元格显示内容的映射\n value: '' // 单元格取值的映射}", + "defaultValue": "" + }, + { + "name": "class-name", + "sample": "grid-custom-style#custom-style-cell-style", + "type": "String, Function", + "desc": "给单元格附加 className,也可以是函数 Function({seq, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex})", + "defaultValue": "" + }, + { + "name": "editor", + "sample": "grid-edit#tiny-first-menu-custom-editing", + "type": "Object , Function", + "desc": "单元格编辑渲染配置项,也可以是函数 Function(h, params);设置表格列的编辑类型。当 editMode 为 true,并且 editabele 为 true 是有效。", + "defaultValue": "" + }, + { + "name": "filter", + "sample": "grid-filter#filter-default-filter", + "type": "Boolean , Object", + "desc": "设置表格列的筛选配置信息。默认值为 false 不配置筛选信息。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "renderer", + "sample": "grid-renderer#grid_Example-gridRenderer-custom-renderer", + "type": "Object , Function", + "desc": "设置表格列的渲染类型。其优先级高于列的 type 属性配置;单元格渲染配置项,其优先级高于列的 formatText 属性配置,也可以是函数 Function(h, params)", + "defaultValue": "" + }, + { + "name": "show-tip", + "sample": "grid-tip#tip-cell-tip", + "type": "Boolean", + "desc": "表格列单元格是否需要提示", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "show-header-tip", + "sample": "grid-tip#tip-column-header-tip", + "type": "Boolean", + "desc": "表格列头是否需要提示", + "defaultValue": "该属性的默认值为 false" + } + ], + "columnslots": [ + { + "name": "default", + "sample": "grid-header#header-custom-grid-header", + "type": "", + "desc": "自定义显示内容模板", + "defaultValue": "" + }, + { + "name": "edit", + "sample": "grid-editor#grid_Example-gridEdit-custom-editor-select", + "type": "", + "desc": "自定义可编辑组件模板", + "defaultValue": "" + }, + { + "name": "filter", + "sample": "grid-filter#filter-custom-filter", + "type": "", + "desc": "自定义筛选模板", + "defaultValue": "" + }, + { + "name": "header", + "sample": "grid-header#header-slot-header", + "type": "", + "desc": "自定义表头内容的模板", + "defaultValue": "" + } + ], + "toolbarattrs": [ + { + "name": "buttons", + "sample": "grid-toolbar#tiny-first-menu-insert-delete-update", + "type": "Array", + "desc": "按钮列表", + "defaultValue": "" + }, + { + "name": "id", + "sample": "grid-customized#custom-column-width", + "type": "String", + "desc": "唯一 ID 标识", + "defaultValue": "" + }, + { + "name": "loading", + "sample": "grid-toolbar#tiny-first-menu-refresh-grid", + "type": "Boolean", + "desc": "是否加载中", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "refresh", + "sample": "grid-toolbar#tiny-first-menu-refresh-grid", + "type": "Boolean", + "desc": "工具栏组件开启表格刷新功能。", + "defaultValue": "" + }, + { + "name": "resizable", + "sample": "grid-customized#custom-column-width", + "type": "Boolean,Object", + "desc": "列宽拖动配置(需要设置 id)", + "defaultValue": "" + }, + { + "name": "setting", + "sample": "grid-customized#custom-column-width", + "type": "Boolean/Object", + "desc": "设置表格属性是否显示个性化面板,当设置表格的name属性时有效;设置工具栏属性是否显示个性化配置(需要设置 id)", + "defaultValue": "" + }, + { + "name": "full-screen", + "sample": "grid-toolbar#tiny-first-menu-grid-full-screen", + "type": "Boolean", + "desc": "设置表格是否可以全屏,或者需要全屏的容器。;设置工具栏属性是否显示全屏按钮", + "defaultValue": "" + }, + { + "name": "size", + "sample": "grid-toolbar#tiny-first-menu-copy-row-data", + "type": "String", + "desc": "尺寸;该属性的可选值为 medium,small,mini", + "defaultValue": "" + }, + { + "name": "before-open-full-screen", + "sample": "grid-toolbar#tiny-first-menu-grid-full-screen", + "type": "Function", + "desc": "全屏前的拦截方法 Function():Boolean,返回 false 则阻止全屏,返回 true 则不阻止", + "defaultValue": "" + }, + { + "name": "before-close-full-screen", + "sample": "grid-toolbar#tiny-first-menu-grid-full-screen", + "type": "Function", + "desc": "关闭全屏前的拦截方法 Function():Boolean,返回 false 则阻止关闭全屏,返回 true 则不阻止", + "defaultValue": "" + } + ], + "toolbarslots": [ + { + "name": "toolbar", + "sample": "grid-toolbar#tiny-first-menu-custom-toolbar", + "type": "", + "desc": "工具栏插槽", + "defaultValue": "" + }, + { + "name": "buttons", + "sample": "grid-toolbar#tiny-first-menu-export-excel", + "type": "", + "desc": "按钮列表", + "defaultValue": "" + }, + { + "name": "tools", + "sample": "grid-toolbar#tiny-first-menu-custom-toolbar", + "type": "", + "desc": "右侧工具列表", + "defaultValue": "" + } + ], + "toolbarevents": [ + { + "name": "button-click", + "sample": "grid-event#event-toolbar-button-click-event", + "type": "Function(arg,event)", + "desc": "当工具栏的按钮被点击时会后触发该事件;arg1:{ $grid: VueComponent 表格组件实例对象信息 $table: VueComponent 表实例对象组件信息 button:按钮列表信息对象 code: 按钮类型 } arg2:event", + "defaultValue": "" + }, + { + "name": "on-before-move", + "sample": "grid-customized#custom-prsonalized-drag", + "type": "Function(arg1,arg2)", + "desc": "个性化面板拖拽前事件;arg1:拖拽类型 arg2:拖拽行信息", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/hrapprover.json b/examples/docs/resources/pc/api/zh-CN/hrapprover.json new file mode 100644 index 000000000..eeef2a4cd --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/hrapprover.json @@ -0,0 +1,46 @@ +{ + "attrs": [ + { + "name": "value", + "sample": "disabled", + "type": "String ", + "desc": "设置权签人的值。", + "defaultValue": "" + }, + { + "name": "approval-person", + "sample": "category-type", + "type": "String", + "desc": "权签人", + "defaultValue": "" + }, + { + "name": "title", + "sample": "", + "type": "String ", + "desc": "设置弹窗标题", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "设置组件是否为禁用状态。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "category", + "sample": "category-type", + "type": "String", + "desc": "默认权签类别。", + "defaultValue": "该属性的默认值为 0303" + }, + { + "name": "fetchHrapprover", + "sample": "custom-service", + "type": "Function", + "desc": "自定义获取权签人信息接口,未使用框架服务时必填,自定义其它属性同dept部门组件", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/image.json b/examples/docs/resources/pc/api/zh-CN/image.json new file mode 100644 index 000000000..3fef29f02 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/image.json @@ -0,0 +1,78 @@ +{ + "attrs": [ + { + "name": "src", + "sample": "basic-usage", + "type": "String", + "desc": "设置预览图片路径;图片源,同原生", + "defaultValue": "" + }, + { + "name": "fit", + "sample": "auto-fit-container-size", + "type": "String ", + "desc": "确定图片如何适应容器框,同原生 object-fit;该属性的可选值为 fill / contain / cover / none / scale-down", + "defaultValue": "" + }, + { + "name": "lazy", + "sample": "lazy-load", + "type": "Boolean", + "desc": "是否开启懒加载", + "defaultValue": "" + }, + { + "name": "scroll-container", + "sample": "lazy-load", + "type": "String , HTMLElement", + "desc": "开启懒加载后,监听 scroll 事件的容器", + "defaultValue": "该属性的默认值为 最近一个 overflow 值为 auto 或 scroll 的父元素" + }, + { + "name": "preview-src-list", + "sample": "preview-src-list", + "type": "Array", + "desc": "开启图片预览功能", + "defaultValue": "" + }, + { + "name": "z-index", + "sample": "preview-z-index", + "type": "Number", + "desc": "设置图片预览的 z-index", + "defaultValue": "该属性的默认值为 2000" + } + ], + "slots": [ + { + "name": "placeholder", + "sample": "custom-placeholder", + "type": "", + "desc": "图片未加载的占位内容", + "defaultValue": "" + }, + { + "name": "error", + "sample": "custom-load-failed-text", + "type": "", + "desc": "加载失败的内容", + "defaultValue": "" + } + ], + "events": [ + { + "name": "load", + "sample": "load-event", + "type": "", + "desc": "图片加载成功触发", + "defaultValue": "" + }, + { + "name": "error", + "sample": "load-error", + "type": "", + "desc": "图片加载失败触发", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/input.json b/examples/docs/resources/pc/api/zh-CN/input.json new file mode 100644 index 000000000..194fed306 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/input.json @@ -0,0 +1,290 @@ +{ + "attrs": [ + { + "name": "disabled", + "sample": "", + "type": "Boolean", + "desc": "是否禁用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "suffix-icon", + "sample": "prefix-icon", + "type": "String", + "desc": "input输入框后置图标html。;输入框尾部图标", + "defaultValue": "" + }, + { + "name": "maxlength", + "sample": "maxlength", + "type": "Number", + "desc": "设置input框的maxLength属性,最大输入长度。;原生属性,最大输入长度", + "defaultValue": "" + }, + { + "name": "prefix-icon", + "sample": "prefix-icon", + "type": "String", + "desc": "input输入框前置图标html。;输入框头部图标", + "defaultValue": "" + }, + { + "name": "readonly", + "sample": "", + "type": "Boolean", + "desc": "设置文本的只读属性,默认为 false。;原生属性,是否只读", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "clearable", + "sample": "clearable", + "type": "Boolean", + "desc": "是否显示清除按钮,该属性不适用于 type=\"textarea\" ;是否可清空", + "defaultValue": "" + }, + { + "name": "type", + "sample": "show-password", + "type": "String", + "desc": "设置input框的type属性,默认为 text,可选值 password, text。;该属性的可选值为 text,textarea 和其他 原生 input 的 type 值", + "defaultValue": "该属性的默认值为 text" + }, + { + "name": "modelValue / v-model", + "sample": "clearable", + "type": "String , Number", + "desc": "设置文本显示的默认值。;绑定值", + "defaultValue": "" + }, + { + "name": "show-word-limit", + "sample": "show-word-limit", + "type": "Boolean", + "desc": "是否显示输入字数统计,只在 type = \"text\" 或 type = \"textarea\" 时有效", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "placeholder", + "sample": "event-blur", + "type": "String", + "desc": "输入框占位文本", + "defaultValue": "" + }, + { + "name": "show-password", + "sample": "show-password", + "type": "Boolean", + "desc": "是否显示切换密码图标", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "输入框尺寸,只在 type!=\"textarea\" 时有效;该属性的可选值为 medium / small / mini", + "defaultValue": "" + }, + { + "name": "cols", + "sample": "rows", + "type": "String", + "desc": "原生属性,设置宽度,在 type =\"textarea\" 时有效", + "defaultValue": "" + }, + { + "name": "rows", + "sample": "rows", + "type": "Number", + "desc": "输入框行数,只对 type=\"textarea\" 有效", + "defaultValue": "该属性的默认值为 2" + }, + { + "name": "autosize", + "sample": "autosize", + "type": "Boolean , Object", + "desc": "自适应内容高度,只对 type=\"textarea\" 有效,可传入对象,如,{ minRows: 2, maxRows: 6 }", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "autocomplete", + "sample": "autocomplete", + "type": "String", + "desc": "原生属性,自动补全;该属性的可选值为 on, off", + "defaultValue": "该属性的默认值为 off" + }, + { + "name": "name", + "sample": "name", + "type": "String", + "desc": "原生属性", + "defaultValue": "" + }, + { + "name": "max", + "sample": "max", + "type": "Number", + "desc": "原生属性,设置最大值", + "defaultValue": "" + }, + { + "name": "min", + "sample": "min", + "type": "Number", + "desc": "原生属性,设置最小值", + "defaultValue": "" + }, + { + "name": "step", + "sample": "step", + "type": "Number", + "desc": "原生属性,设置输入字段的合法数字间隔", + "defaultValue": "" + }, + { + "name": "resize", + "sample": "resize", + "type": "String", + "desc": "控制是否能被用户缩放;该属性的可选值为 none, both, horizontal, vertical", + "defaultValue": "" + }, + { + "name": "autofocus", + "sample": "autofocus", + "type": "Boolean", + "desc": "原生属性,自动获取焦点", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "form", + "sample": "form", + "type": "String", + "desc": "原生属性", + "defaultValue": "" + }, + { + "name": "label", + "sample": "label", + "type": "String", + "desc": "输入框关联的label文字", + "defaultValue": "" + }, + { + "name": "tabindex", + "sample": "tabindex", + "type": "String", + "desc": "输入框的tabindex", + "defaultValue": "" + }, + { + "name": "validate-event", + "sample": "validate-event", + "type": "Boolean", + "desc": "输入时是否触发表单的校验", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "counter", + "sample": "counter", + "type": "Boolean", + "desc": "是否显示字数统计,只在 type = \"text\" 或 type = \"textarea\" 时有效", + "defaultValue": "该属性的默认值为 false" + } + ], + "slots": [ + { + "name": "prefix", + "sample": "slot-prepend", + "type": "", + "desc": "输入框头部内容,只对 type=\"text\" 有效", + "defaultValue": "" + }, + { + "name": "suffix", + "sample": "slot-suffix", + "type": "", + "desc": "输入框尾部内容,只对 type=\"text\" 有效", + "defaultValue": "" + }, + { + "name": "prepend", + "sample": "slot-prepend", + "type": "", + "desc": "输入框前置内容,只对 type=\"text\" 有效", + "defaultValue": "" + }, + { + "name": "append", + "sample": "slot-append", + "type": "", + "desc": "输入框后置内容,只对 type=\"text\" 有效", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "focus", + "sample": "method-focus", + "type": "", + "desc": "使 input 获取焦点", + "defaultValue": "" + }, + { + "name": "blur", + "sample": "method-blur", + "type": "", + "desc": "使 input 失去焦点", + "defaultValue": "" + }, + { + "name": "select", + "sample": "method-select", + "type": "", + "desc": "选中 input 中的文字", + "defaultValue": "" + }, + { + "name": "addMemory", + "sample": "method-addMemory", + "type": "", + "desc": "历史输入内容的记忆方法", + "defaultValue": "" + } + ], + "events": [ + { + "name": "input", + "sample": "event-input", + "type": "Function(arg1)", + "desc": "输入值时触发事件;onInput(arg1){\n// arg1 = event.target.value 输入框的值 \n// do something you want...}", + "defaultValue": "" + }, + { + "name": "blur", + "sample": "event-blur", + "type": "Function(arg1)", + "desc": "在 Input 失去焦点时触发;onBlur(arg1){ \n// arg1 = event\n// do something you want...}", + "defaultValue": "" + }, + { + "name": "focus", + "sample": "event-focus", + "type": "Function(arg1)", + "desc": "在 Input 获得焦点时触发;onFocus(arg1){\n// arg1 = event} \n// do something you want...}", + "defaultValue": "" + }, + { + "name": "change", + "sample": "event-change", + "type": "Function(arg1)", + "desc": "在 Input 值改变时触发;onChange(arg1){\n// arg1 = event.target.value 输入框改变后的值 }\n// do something you want...}", + "defaultValue": "" + }, + { + "name": "clear", + "sample": "event-clear", + "type": "Function", + "desc": "在点击由 clearable 属性生成的清空按钮时触发;onClear(){ // do something you want...}", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/ip-address.json b/examples/docs/resources/pc/api/zh-CN/ip-address.json new file mode 100644 index 000000000..15ad0b640 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/ip-address.json @@ -0,0 +1,92 @@ +{ + "attrs": [ + { + "name": "delimiter", + "sample": "delimiter", + "type": "String,Object", + "desc": "设置IP段之间的分隔符,默认为 '.' 。;设置IP段之间的分隔符类名,默认为 'icon-dot-ipv4' 。", + "defaultValue": "该属性的默认值为 icon-dot-ipv4" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "设置组件大小;该属性的可选值为 medium / small / mini", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "设置文本的禁用属性,默认为 false 。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "readonly", + "sample": "readonly", + "type": "Boolean", + "desc": "设置文本的只读属性,默认为 false 。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "type", + "sample": "ipv4-type", + "type": "String", + "desc": "设置 IpAddress 框的 type 属性,默认为 IPv4,可选值 IPv6 。;该属性的可选值为 IPv4 / IPv6", + "defaultValue": "该属性的默认值为 IPv4" + }, + { + "name": "value", + "sample": "ipv4-type", + "type": "String", + "desc": "设置文本显示的默认值 。", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "slots", + "type": "", + "desc": "IP段之间的分隔符", + "defaultValue": "" + } + ], + "events": [ + { + "name": "blur", + "sample": "blur", + "type": "Function", + "desc": "文本框失去焦点时触发事件 ;onBlur(){\n// do something you want...}", + "defaultValue": "" + }, + { + "name": "focus", + "sample": "focus", + "type": "Function", + "desc": "文本框获取焦点时触发事件;onFocus(){\n// do something you want...}", + "defaultValue": "" + }, + { + "name": "change", + "sample": "change", + "type": "Function(arg1)", + "desc": "文本框内容改变后事件 ;onChange(arg1){\n// arg1 = value IP值 \n// do something you want...}", + "defaultValue": "" + }, + { + "name": "input", + "sample": "input", + "type": "Function(arg1,arg2)", + "desc": "文本框内容输入时触发事件 ;onInput(arg1, arg2){\n// arg1 = value IP地址输入框改变的值 \n// arg2 = index 更改值所在IP输入框的索引 \n// do something you want...}", + "defaultValue": "" + }, + { + "name": "select", + "sample": "select", + "type": "Function(arg1)", + "desc": "文本框内容选中时触发事件;onSelect(arg1){ \n// arg1 = target.value 选中框所在位置的值 \n// do something you want...}", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/layout.json b/examples/docs/resources/pc/api/zh-CN/layout.json new file mode 100644 index 000000000..dde10663f --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/layout.json @@ -0,0 +1,122 @@ +{ + "layoutattrs": [ + { + "name": "tag", + "sample": "tag1", + "type": "String", + "desc": "标签", + "defaultValue": "该属性的默认值为 div" + }, + { + "name": "size", + "sample": "", + "type": "String", + "desc": "大小;该属性的可选值为 medium / small / mini", + "defaultValue": "该属性的默认值为 medium" + } + ], + "layoutslots": [ + { + "name": "default", + "sample": "base", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + } + ], + "rowattrs": [ + { + "name": "flex", + "sample": "alignment", + "type": "Boolean", + "desc": "是否为flex容器", + "defaultValue": "false" + }, + { + "name": "gutter", + "sample": "gutter", + "type": "number", + "desc": "子项的间隔的像素", + "defaultValue": "0" + }, + { + "name": "justify", + "sample": "alignment", + "type": "String", + "desc": "子项的主轴对齐方向,可取值:'start', 'center', 'end', 'space-between', 'space-around'", + "defaultValue": "start" + }, + { + "name": "align", + "sample": "alignment", + "type": "String", + "desc": "子项的副轴对齐方向,可取值:'top', 'middle', 'bottom'", + "defaultValue": "top" + }, + { + "name": "order", + "sample": "order1", + "type": "String", + "desc": "子项的排序方式,可取值:'asc', 'des'。 不设置时,保留子项在模板中的顺序。", + "defaultValue": "" + }, + { + "name": "tag", + "sample": "tag1", + "type": "String", + "desc": "定义 Row 元素的渲染后的标签,默认为div", + "defaultValue": "div" + }, + { + "name": "noSpace", + "sample": "", + "type": "Boolean", + "desc": "子项没有间隔,相当于gutter=0的时候", + "defaultValue": "false" + } + ], + "colattrs": [ + { + "name": "span", + "sample": "base", + "type": "Number", + "desc": "子项占据的列数", + "defaultValue": "12" + }, + { + "name": "offset", + "sample": "offset", + "type": "Number", + "desc": "子项的左偏移量", + "defaultValue": "0" + }, + { + "name": "no", + "sample": "order1", + "type": "Number", + "desc": "子项排序编号", + "defaultValue": "0" + }, + { + "name": "move", + "sample": "col-move", + "type": "Number", + "desc": "子项的右偏移量", + "defaultValue": "0" + }, + { + "name": "xs/sm/md/lg/xl", + "sample": "responsive-layout", + "type": "Number, Object", + "desc": "响应式栅格数或者栅格属性对象", + "defaultValue": "" + }, + { + "name": "tag", + "sample": "", + "type": "String", + "desc": "子项渲染后的标签", + "defaultValue": "div" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/link-menu.json b/examples/docs/resources/pc/api/zh-CN/link-menu.json new file mode 100644 index 000000000..155488e78 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/link-menu.json @@ -0,0 +1,99 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "data-resource1", + "type": "Array", + "desc": "设置收藏夹菜单的数据。", + "defaultValue": "" + }, + { + "name": "icon", + "sample": "custom-icon", + "type": "Object", + "desc": "自定义节点展开折叠的图标。", + "defaultValue": "" + }, + { + "name": "max-item", + "sample": "menu-items", + "type": "Number", + "desc": "设置可收藏的栏目的最大数量。", + "defaultValue": "" + }, + { + "name": "titile", + "sample": "data-resource", + "type": "String", + "desc": "设置收藏夹菜单的标题,默认为空。", + "defaultValue": "" + }, + { + "name": "default-expand-all", + "sample": "menu-items", + "type": "Boolean", + "desc": "设置打开菜单弹窗时默认是否展开所有节点,默认为 true 。", + "defaultValue": "" + }, + { + "name": "search-icon", + "sample": "custom-icon", + "type": "Object", + "desc": "自定义搜索图标。", + "defaultValue": "" + }, + { + "name": "ellipsis", + "sample": "custom-icon1", + "type": "Boolean", + "desc": "菜单内容超长时省略显示,默认为 true 。", + "defaultValue": "" + }, + { + "name": "wrap", + "sample": "data-resource", + "type": "Boolean", + "desc": "菜单内容超长时换行显示,默认为 false 。", + "defaultValue": "" + }, + { + "name": "keep-selected-nodes", + "sample": "", + "type": "Boolean", + "desc": "树节点勾选内容后,点击取消按钮,再次打开弹窗是否保留取消前勾选的内容的状态,默认为 true 。", + "defaultValue": "" + }, + { + "name": "get-menu-data-sync", + "sample": "get-menu-data-sync", + "type": "Function", + "desc": "自定义菜单数据服务,直接返回数据", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "foot", + "sample": "custom-foot", + "type": "", + "desc": "菜单弹窗底部插槽", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "sureNodevalue", + "sample": "custom-foot", + "type": "", + "desc": "获取选中的菜单节点并关闭菜单弹窗,同时展示选中的菜单。", + "defaultValue": "" + }, + { + "name": "hideDialog", + "sample": "custom-foot", + "type": "", + "desc": "关闭菜单弹窗。", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/link.json b/examples/docs/resources/pc/api/zh-CN/link.json new file mode 100644 index 000000000..21d9d9c3f --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/link.json @@ -0,0 +1,55 @@ +{ + "attrs": [ + { + "name": "type", + "sample": "link-style", + "type": "String", + "desc": "该属性的可选值为 primary / success / warning / danger / info", + "defaultValue": "该属性的默认值为 default" + }, + { + "name": "underline", + "sample": "focus-no-underline", + "type": "Boolean", + "desc": "是否下划线", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "是否禁用状态", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "href", + "sample": "config-href", + "type": "String", + "desc": "原生 href 属性", + "defaultValue": "" + }, + { + "name": "icon", + "sample": "custom-icon", + "type": "Object , String", + "desc": "图标类名", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-icon", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + }, + { + "name": "icon", + "sample": "custom-icon", + "type": "", + "desc": "图标", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/loading.json b/examples/docs/resources/pc/api/zh-CN/loading.json new file mode 100644 index 000000000..2a69de34c --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/loading.json @@ -0,0 +1,60 @@ +{ + "attrs": [ + { + "name": "text", + "sample": "loading-tip-text", + "type": "String", + "desc": "通过 value 属性设置文字;显示在加载图标下方的加载文案", + "defaultValue": "" + }, + { + "name": "fullscreen", + "sample": "fullscreen", + "type": "Boolean", + "desc": "设置 type 属性为 true 显示全屏;同 v-loading 指令中的 fullscreen 修饰符", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "target", + "sample": "target", + "type": "Object/String", + "desc": "Loading 需要覆盖的 DOM 节点。可传入一个 DOM 对象或字符串;若传入字符串,则会将其作为参数传入 document.querySelector以获取到对应 DOM 节点", + "defaultValue": "该属性的默认值为 document.body" + }, + { + "name": "body", + "sample": "body", + "type": "Boolean", + "desc": "同 v-loading 指令中的 body 修饰符", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "lock", + "sample": "fullscreen", + "type": "Boolean", + "desc": "同 v-loading 指令中的 lock 修饰符", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "spinner", + "sample": "spinner", + "type": "String", + "desc": "自定义加载图标类名", + "defaultValue": "" + }, + { + "name": "background", + "sample": "background", + "type": "String", + "desc": "遮罩背景色", + "defaultValue": "" + }, + { + "name": "customClass", + "sample": "custom-class", + "type": "String", + "desc": "Loading 的自定义类名", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/locales.json b/examples/docs/resources/pc/api/zh-CN/locales.json new file mode 100644 index 000000000..b932d1d8f --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/locales.json @@ -0,0 +1,53 @@ +{ + "attrs": [ + { + "name": "local", + "sample": "basic-usage", + "type": "Boolean", + "desc": "是否本地", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "change-lang", + "sample": "change-lang", + "type": "Function", + "desc": "切换语言", + "defaultValue": "" + }, + { + "name": "getLocale", + "sample": "custom-service", + "type": "Function", + "desc": "自定义获取系统语言列表接口,未使用框架服务时必填", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "为 popper 添加类名(可参考 popover 组件)", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false (可参考 select 组件)", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "getCurrentLocale", + "sample": "custom-service", + "type": "Function", + "desc": "自定义获取当前语种接口,未使用框架服务时必填", + "defaultValue": "" + }, + { + "name": "getChangeLocaleUrl", + "sample": "custom-service", + "type": "Function", + "desc": "自定义更新语言服务接口,未使用框架服务并且未配置 change-lang 时必填", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/logon-user.json b/examples/docs/resources/pc/api/zh-CN/logon-user.json new file mode 100644 index 000000000..dacb9b5c0 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/logon-user.json @@ -0,0 +1,11 @@ +{ + "attrs": [ + { + "name": "getUserInfo", + "sample": "custom-service", + "type": "Function", + "desc": "配置查询系统当前用户接口", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/logout.json b/examples/docs/resources/pc/api/zh-CN/logout.json new file mode 100644 index 000000000..bdc6d03ff --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/logout.json @@ -0,0 +1,25 @@ +{ + "attrs": [ + { + "name": "getLogoutUrl", + "sample": "custom-service", + "type": "Function", + "desc": "自定义获取注销服务接口", + "defaultValue": "" + }, + { + "name": "redirectUrl", + "sample": "redirecturl", + "type": "String", + "desc": "自定义配置注销后跳转地址", + "defaultValue": "" + }, + { + "name": "beforeLogout", + "sample": "", + "type": "Function(params)", + "desc": "注销前的回调函数", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/menu-bar.json b/examples/docs/resources/pc/api/zh-CN/menu-bar.json new file mode 100644 index 000000000..9e26dfeeb --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/menu-bar.json @@ -0,0 +1 @@ +{} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/milestone.json b/examples/docs/resources/pc/api/zh-CN/milestone.json new file mode 100644 index 000000000..f7594eb14 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/milestone.json @@ -0,0 +1,169 @@ +{ + "attrs": [ + { + "name": "completed-field", + "sample": "data-field-mapping", + "type": "String", + "desc": "设置里程碑完成状态对应的取值,默认为 'completed'", + "defaultValue": "该属性的默认值为 completed" + }, + { + "name": "data", + "sample": "data-source", + "type": "Object , Array", + "desc": "设置步骤条的数据 。;设置步骤条的数据 。", + "defaultValue": "" + }, + { + "name": "flag-before", + "sample": "flag-before", + "type": "Boolean", + "desc": "设置里程碑上活动即旗子上的数据从前面还是后面节点上获取,默认为 false 取后面节点上的数据。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "flag-content-field", + "sample": "data-field-mapping", + "type": "String", + "desc": "设置节点旗子数据中描述对应的字段名,默认为 'content'", + "defaultValue": "该属性的默认值为 content" + }, + { + "name": "flag-status-field", + "sample": "data-field-mapping", + "type": "String", + "desc": "设置节点旗子数据中状态对应的字段名,默认为 'status'", + "defaultValue": "该属性的默认值为 status" + }, + { + "name": "flag-field", + "sample": "data-field-mapping", + "type": "String", + "desc": "设置节点信息中旗子数据所在字段名,默认为 'flags'", + "defaultValue": "该属性的默认值为 flags" + }, + { + "name": "flag-name-field", + "sample": "data-field-mapping", + "type": "String", + "desc": "设置节点旗子数据中名称对应的字段名,默认为 'name'", + "defaultValue": "该属性的默认值为 name" + }, + { + "name": "line-style", + "sample": "line-style", + "type": "String , Number", + "desc": "在里程碑模式下,设置线条颜色取值模式,默认为1,采用两种颜色区分完成与未完成状态,完成状态的线条颜色与milestonesStatus定义的完成颜色一致。\n设置为 2 时线条颜色根随节点状态。\n设置为 16进制的色值 如:#1890ff 时,线条不区分状态,全部为所设置的颜色。", + "defaultValue": "该属性的默认值为 1" + }, + { + "name": "milestones-status", + "sample": "milestones-status", + "type": "Object", + "desc": "定义里程碑的状态与颜色对应关系,颜色取值必需为 16进制 如:{completed: '#1890FF'}", + "defaultValue": "该属性的默认值为 Function" + }, + { + "name": "name-field", + "sample": "data-field-mapping", + "type": "String", + "desc": "设置节点信息中名称对应的字段名,默认为 'name'", + "defaultValue": "该属性的默认值为 name" + }, + { + "name": "show-number", + "sample": "show-number", + "type": "Boolean", + "desc": "设置未完成的状态是否显示序号,默认为 true", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "solid", + "sample": "solid-style", + "type": "Boolean", + "desc": "在里程碑模式下,设置已经完成节点显示为实心,且光晕不透明,默认为 false", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "space", + "sample": "milestone-space", + "type": "Number", + "desc": "设置步骤条的宽度。", + "defaultValue": "" + }, + { + "name": "start", + "sample": "start-index", + "type": "Number", + "desc": "设置步骤条序号起始值,默认为 -1 。", + "defaultValue": "该属性的默认值为 -1" + }, + { + "name": "status-field", + "sample": "data-field-mapping", + "type": "String", + "desc": "设置数据状态对应的字段名,默认为 'status'", + "defaultValue": "该属性的默认值为 status" + }, + { + "name": "time-field", + "sample": "data-field-mapping", + "type": "String", + "desc": "设置节点时间信息对应的字段名,默认为 'time'", + "defaultValue": "该属性的默认值为 time" + } + ], + "slots": [ + { + "name": "top", + "sample": "custom-top", + "type": "", + "desc": "节点上方内容", + "defaultValue": "" + }, + { + "name": "flag", + "sample": "custom-flag", + "type": "", + "desc": "旗帜内容", + "defaultValue": "" + }, + { + "name": "bottom", + "sample": "custom-bottom", + "type": "", + "desc": "节点下方内容", + "defaultValue": "" + }, + { + "name": "icon", + "sample": "custom-icon-slot", + "type": "", + "desc": "节点图标", + "defaultValue": "" + } + ], + "events": [ + { + "name": "click", + "sample": "milestone-events", + "type": "", + "desc": "节点的点击事件,参数(index:节点索引, node:节点数据信息)", + "defaultValue": "" + }, + { + "name": "flagclick", + "sample": "milestone-events", + "type": "", + "desc": "[deprecated v3.5.0废弃,v3.17.0移除;移除原因:命名规范,建议使用flag-click代替]", + "defaultValue": "" + }, + { + "name": "flag-click", + "sample": "milestone-events", + "type": "", + "desc": "里程碑模式下,活动旗子的点击事件,参数(index:节点内旗子的索引, node:节点上旗子的数据信息)", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/modal.json b/examples/docs/resources/pc/api/zh-CN/modal.json new file mode 100644 index 000000000..129a8cc8c --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/modal.json @@ -0,0 +1,225 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "value", + "type": "Boolean", + "desc": "绑定值", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "id", + "sample": "id", + "type": "String", + "desc": "只对 type=message 有效,如果不想窗口重复点击,可以设置唯一的 id 防止重复提示", + "defaultValue": "" + }, + { + "name": "is-form-reset", + "sample": "is-form-reset", + "type": "Boolean", + "desc": "关闭弹窗,默认重置表单数据", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "title", + "sample": "title", + "type": "String", + "desc": "窗口的标题(支持开启国际化)", + "defaultValue": "" + }, + { + "name": "type", + "sample": "type", + "type": "String", + "desc": "窗口类型;该属性的可选值为 alert, confirm, message", + "defaultValue": "该属性的默认值为 alert" + }, + { + "name": "status", + "sample": "status", + "type": "String", + "desc": "只对 type=alert | confirm | message 有效,消息状态;该属性的可选值为 info, success, warning, error, loading", + "defaultValue": "该属性的默认值为 info" + }, + { + "name": "message", + "sample": "message", + "type": "[String, Function,VNode]", + "desc": "窗口的内容,类型为:纯文本/VNode,或返回纯文本/VNode的函数", + "defaultValue": "" + }, + { + "name": "show-header", + "sample": "showHeader", + "type": "Boolean", + "desc": "是否显示头部", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "showFooter", + "sample": "showFooter", + "type": "Boolean", + "desc": "是否显示底部", + "defaultValue": "" + }, + { + "name": "lock-view", + "sample": "lock-view", + "type": "Boolean", + "desc": "是否锁住页面,不允许窗口之外的任何操作", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "lock-scroll", + "sample": "lock-scroll", + "type": "Boolean", + "desc": "是否锁住滚动条,不允许页面滚动", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "mask", + "sample": "lock-view1", + "type": "Boolean", + "desc": "是否显示遮罩层", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "mask-closable", + "sample": "mask-closable", + "type": "Boolean", + "desc": "是否允许点击遮罩层关闭窗口", + "defaultValue": "" + }, + { + "name": "esc-closable", + "sample": "esc-closable", + "type": "Boolean", + "desc": "是否允许按 Esc 键关闭窗口", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "resize", + "sample": "resize", + "type": "Boolean", + "desc": "是否允许拖动调整窗口大小", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "duration", + "sample": "duration", + "type": "[Number, String]", + "desc": "只对 type=message 有效,自动关闭的延时", + "defaultValue": "该属性的默认值为 3000" + }, + { + "name": "width", + "sample": "resize", + "type": "[Number, String]", + "desc": "窗口的宽度", + "defaultValue": "" + }, + { + "name": "height", + "sample": "resize", + "type": "[Number, String]", + "desc": "窗口的高度", + "defaultValue": "" + }, + { + "name": "min-width", + "sample": "min-width", + "type": "[Number, String]", + "desc": "窗口的最小宽度", + "defaultValue": "" + }, + { + "name": "min-height", + "sample": "min-height", + "type": "[Number, String]", + "desc": "窗口的最小高度", + "defaultValue": "" + }, + { + "name": "top", + "sample": "top", + "type": "[Number, String]", + "desc": "只对 type=message 有效,消息距离顶部的位置", + "defaultValue": "该属性的默认值为 15" + }, + { + "name": "zIndex", + "sample": "zIndex", + "type": "Number", + "desc": "自定义堆叠顺序(对于某些特殊场景,比如被遮挡时可能会用到)", + "defaultValue": "该属性的默认值为 3000" + }, + { + "name": "fullscreen", + "sample": "fullscreen", + "type": "Boolean", + "desc": "默认最大化显示", + "defaultValue": "该属性的默认值为 false" + } + ], + "slots": [ + { + "name": "default", + "sample": "value1", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + }, + { + "name": "footer", + "sample": "footer-slot", + "type": "", + "desc": "窗口底部的模板", + "defaultValue": "" + } + ], + "events": [ + { + "name": "show", + "sample": "show-event", + "type": "Function(params)", + "desc": "在窗口显示时会触发该事件;params: { type // 事件类型,$modal // 组件实例 }", + "defaultValue": "" + }, + { + "name": "hide", + "sample": "hide-event", + "type": "Function(params)", + "desc": "在窗口关闭时会触发该事件;params: { type // 事件类型,$modal // 组件实例 }", + "defaultValue": "" + }, + { + "name": "confirm", + "sample": "confirm-event", + "type": "Function(params, event)", + "desc": "点击确定按钮时会触发该事件;params: { type // 事件类型,$modal // 组件实例 },event: 原生事件", + "defaultValue": "" + }, + { + "name": "close", + "sample": "close-event", + "type": "Function(params, event)", + "desc": "点击关闭按钮时会触发该事件;params: { type // 事件类型,$modal // 组件实例 },event: 原生事件", + "defaultValue": "" + }, + { + "name": "cancel", + "sample": "cancel-event", + "type": "Function(params, event)", + "desc": "点击取消按钮时会触发该事件;params: { type // 事件类型,$modal // 组件实例 },event: 原生事件", + "defaultValue": "" + }, + { + "name": "zoom", + "sample": "zoom-event", + "type": "Function(params, event)", + "desc": "窗口缩放时会触发该事件;params: { type // 事件类型,$modal // 组件实例 },event: 原生事件", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/nav-menu.json b/examples/docs/resources/pc/api/zh-CN/nav-menu.json new file mode 100644 index 000000000..fa1f8d9de --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/nav-menu.json @@ -0,0 +1,48 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "data-resource", + "type": "Array", + "desc": "设置导航菜单的数据。", + "defaultValue": "" + }, + { + "name": "overflow", + "sample": "overflow", + "type": "String", + "desc": "设置一级菜单无法在当前菜单容器里显示完全时的处理策略。;可选项有 auto / retract / fixed / hidden;默认值为 auto", + "defaultValue": "" + }, + { + "name": "before-skip", + "sample": "before-skip", + "type": "Function", + "desc": "点击菜单跳转前的钩子函数,返回 false 将无法跳转。", + "defaultValue": "" + }, + { + "name": "fetch-menu-data", + "sample": "custom-service", + "type": "Function", + "desc": "自定义菜单数据加载服务,返回一个Promise对象。", + "defaultValue": "" + }, + { + "name": "fields", + "sample": "custom-service", + "type": "Object", + "desc": "自定义菜单数据的映射。", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "logo", + "sample": "slot-logo", + "type": "", + "desc": "菜单栏 Logo 插槽", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/notify.json b/examples/docs/resources/pc/api/zh-CN/notify.json new file mode 100644 index 000000000..4a4ac74c7 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/notify.json @@ -0,0 +1,104 @@ +{ + "attrs": [ + { + "name": "type", + "sample": "type", + "type": "String", + "desc": "通知消息类型,可选值为 info、success、warning、error", + "defaultValue": "info" + }, + { + "name": "title", + "sample": "title", + "type": "[String, Function]", + "desc": "通知消息标题,可用 jsx 定制", + "defaultValue": "undefined" + }, + { + "name": "message", + "sample": "message", + "type": "[String, Function]", + "desc": "通知消息文本,可用 jsx 定制", + "defaultValue": "undefined" + }, + { + "name": "position", + "sample": "position", + "type": "String", + "desc": "通知显示位置,可选值为 top-right、bottom-right", + "defaultValue": "bottom-right" + }, + { + "name": "duration", + "sample": "duration", + "type": "Number", + "desc": "自动关闭延时毫秒数", + "defaultValue": "4500" + }, + { + "name": "customClass", + "sample": "basic-usage", + "type": "[String, Object]", + "desc": "自定义样式类", + "defaultValue": "undefined" + }, + { + "name": "showClose", + "sample": "showClose", + "type": "Boolean", + "desc": "是否显示关闭按钮", + "defaultValue": "true" + }, + { + "name": "showIcon", + "sample": "showIcon", + "type": "Boolean", + "desc": "是否显示类型图标", + "defaultValue": "true" + }, + { + "name": "closeIcon", + "sample": "closeIcon", + "type": "Object", + "desc": "关闭图标组件对象", + "defaultValue": "IconClose" + }, + { + "name": "statusIcon", + "sample": "statusIcon", + "type": "Object", + "desc": "类型图标组件对象", + "defaultValue": "IconInfoSolid" + }, + { + "name": "debounceDelay", + "sample": "debounceDelay", + "type": "Number", + "desc": "启用防抖", + "defaultValue": "0" + }, + { + "name": "verticalOffset", + "sample": "verticalOffset", + "type": "[Number,String]", + "desc": "设置垂直方向偏离距离,单位px", + "defaultValue": 16 + } + ], + "events": [ + { + "name": "beforeClose", + "sample": "beforeClose", + "type": "Function", + "desc": "关闭前回调方法,返回 false 可阻止关闭", + "defaultValue": "undefined" + }, + { + "name": "close", + "sample": "close", + "type": "Object", + "desc": "关闭 notify 时触发的事件", + "defaultValue": "undefined" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/numeric.json b/examples/docs/resources/pc/api/zh-CN/numeric.json new file mode 100644 index 000000000..2fd2af1fa --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/numeric.json @@ -0,0 +1,146 @@ +{ + "attrs": [ + { + "name": "circulate", + "sample": "max-min", + "type": "Boolean", + "desc": "向上到达最大值后从最小值开始,或反过来", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "mouse-wheel", + "sample": "mouse-wheel", + "type": "Boolean", + "desc": "设置鼠标滚动滑轮是否改变数值", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "v-model", + "sample": "basic-usage", + "type": "Number", + "desc": "设置输入组件的默认值,默认为 0。", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "min", + "sample": "max-min", + "type": "Number", + "desc": "规定组件可输入的最小数值,来创建合法值的范围,支持整数和小数。;设置计数器允许的最小值", + "defaultValue": "该属性的默认值为 -Infinity" + }, + { + "name": "max", + "sample": "max-min", + "type": "Number", + "desc": "规定组件可输入的最大数值,来创建合法值的范围,支持整数和小数。;设置计数器允许的最大值", + "defaultValue": "该属性的默认值为 Infinity" + }, + { + "name": "step", + "sample": "about-step", + "type": "Number", + "desc": "设置按上下方向键或点击上下按钮增减的数值,默认步长为 1。", + "defaultValue": "该属性的默认值为 1" + }, + { + "name": "step-strictly", + "sample": "about-step", + "type": "Boolean", + "desc": "是否只能输入 step 的倍数", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "size", + "sample": "numeric-size", + "type": "String", + "desc": "计数器尺寸;该属性的可选值为 medium / small / mini", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "dynamic-disabled", + "type": "Boolean", + "desc": "是否禁用计数器", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "controls", + "sample": "controls", + "type": "Boolean", + "desc": "是否使用控制按钮", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "controls-position", + "sample": "controls", + "type": "String", + "desc": "控制按钮位置;该属性的可选值为 right", + "defaultValue": "" + }, + { + "name": "name", + "sample": "controls2", + "type": "String", + "desc": "原生属性", + "defaultValue": "" + }, + { + "name": "label", + "sample": "controls", + "type": "String", + "desc": "输入框关联的label文字", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "calculate-according-to-num-of-goods", + "type": "String", + "desc": "设置输入框内的提示占位文本 。", + "defaultValue": "" + }, + { + "name": "precision", + "sample": "precision", + "type": "Number", + "desc": "数值精度", + "defaultValue": "" + }, + { + "name": "format", + "sample": "", + "type": "Object", + "desc": "数字格式化置项,可配置如下字段:;{\n fraction: 4, // 保留小数位数\n rounding: 0, // 舍入点,0-9之间的数字,如配置为7时则为6舍7入,默认为5(四舍五入);配置为0或>9将会进行截取\n prefix: '$', // 前置标识\n groupSize: 3, // 整数部分分组间隔,即第一个分组位数\n secondaryGroupSize: 2, // 整数部分第二级分组间隔,不设置或为0时 自动取groupSize\n groupSeparator: ',', // 整数部分分组分隔符\n decimalSeparator: '.', // 小数点符号\n fractionGroupSize: 0, // 小数部分分组间隔\n fractionGroupSeparator: ' ', // 小数分组分隔符\n suffix: '@' // 后置标识\n }", + "defaultValue": "" + }, + { + "name": "allow-empty", + "sample": "allow-empty", + "type": "Boolean", + "desc": "计数器内容的可清空", + "defaultValue": "该属性的默认值为 false,表示不可清空" + } + ], + "events": [ + { + "name": "focus", + "sample": "focus-event", + "type": "Function(arg1)", + "desc": "设置组件获得焦点时触发的回调函数。;onFocus(arg1){\n// arg1 = event // do something you want... }", + "defaultValue": "" + }, + { + "name": "blur", + "sample": "blur-event", + "type": "Function(arg1)", + "desc": "设置组件失去焦点时触发的回调函数。;onBlur(arg1){\n// arg1 = event arg1为event对象\n// do something you want...}", + "defaultValue": "" + }, + { + "name": "change", + "sample": "change-event", + "type": "Function(arg1,arg2)", + "desc": "设置组件的值变化时触发的回调函数。;onChange(arg1, arg2){\n// arg1 = newVal/\n/arg2 = oldVal\n// do something you want...}", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/option-group.json b/examples/docs/resources/pc/api/zh-CN/option-group.json new file mode 100644 index 000000000..cd87b34dd --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/option-group.json @@ -0,0 +1,27 @@ +{ + "attrs": [ + { + "name": "label", + "sample": "option-group", + "type": "String", + "desc": "分组的组名", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "option-group", + "type": "Boolean", + "desc": "是否将该分组下所有选项置为禁用", + "defaultValue": "该属性的默认值为 false" + } + ], + "slots": [ + { + "name": "default", + "sample": "option-group", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/option.json b/examples/docs/resources/pc/api/zh-CN/option.json new file mode 100644 index 000000000..2e09c4514 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/option.json @@ -0,0 +1,41 @@ +{ + "attrs": [ + { + "name": "value", + "sample": "filter-method", + "type": "String/number/object", + "desc": "选项的值", + "defaultValue": "" + }, + { + "name": "label", + "sample": "filter-method", + "type": "String/number", + "desc": "选项的标签,若不设置则默认与 value 相同", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "是否禁用该选项", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "highlight-class", + "sample": "", + "type": "String", + "desc": "自定义高亮类名", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-options", + "type": "", + "desc": "默认插槽(将自定义的 HTML 模板插入 tiny-option 中)", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/pager.json b/examples/docs/resources/pc/api/zh-CN/pager.json new file mode 100644 index 000000000..7ea759dd3 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/pager.json @@ -0,0 +1,148 @@ +{ + "attrs": [ + { + "name": "page-size", + "sample": "pager-events", + "type": "Number", + "desc": "每页显示条目个数,支持 .sync 修饰符", + "defaultValue": "该属性的默认值为 10" + }, + { + "name": "is-before-page-change", + "sample": "before-page-change", + "type": "Boolean", + "desc": "是否打开页面改变时的前置处理特性。在值为true时,翻页操作或者改变页大小操作不会立即生效,留给用户处理业务逻辑,之后通过调用预留的callback或者rollback使之生效或者失效,详看事件before-page-change", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "为 popper 添加类名(可参考 popover 组件)", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false (可参考 select 组件)", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "total", + "sample": "current-page", + "type": "Number", + "desc": "总条目数", + "defaultValue": "" + }, + { + "name": "page-count", + "sample": "page-count", + "type": "Number", + "desc": "总页数,total 和 page-count 设置任意一个就可以达到显示页码的功能;如果要支持 page-sizes 的更改,则需要使用 total 属性", + "defaultValue": "" + }, + { + "name": "pager-count", + "sample": "pager-count", + "type": "Number", + "desc": "数字分页(number/complete)的模式下中间的页码按钮需要显示的最多个数;页码按钮的数量,当总页数超过该值时会折叠;该属性的可选值为 大于等于 5 且小于等于 21 的奇数", + "defaultValue": "该属性的默认值为 7" + }, + { + "name": "current-page", + "sample": "current-page", + "type": "Number", + "desc": "当前页数,支持 .sync 修饰符", + "defaultValue": "该属性的默认值为 1" + }, + { + "name": "layout", + "sample": "current-page", + "type": "String", + "desc": "组件布局,子组件名用逗号分隔;该属性的可选值为 sizes, prev, pager, next, jumper, ->, total, slot", + "defaultValue": "该属性的默认值为 prev, pager, next, jumper, ->, total" + }, + { + "name": "page-sizes", + "sample": "page-size", + "type": "Array", + "desc": "设置指定可选择的每页显示条数;每页显示个数选择器的选项设置", + "defaultValue": "该属性的默认值为 [10, 20, 30, 40, 50, 100]" + }, + { + "name": "prev-text", + "sample": "custom-next-prev-text", + "type": "String", + "desc": "替代图标显示的上一页文字", + "defaultValue": "" + }, + { + "name": "next-text", + "sample": "custom-next-prev-text", + "type": "String", + "desc": "替代图标显示的下一页文字", + "defaultValue": "" + }, + { + "name": "hide-on-single-page", + "sample": "hide-on-single-page", + "type": "Boolean", + "desc": "只有一页时是否隐藏", + "defaultValue": "" + }, + { + "name": "mode", + "sample": "pager-mode-number", + "type": "String", + "desc": "设置分页显示模式,默认为number;设置分页显示模式;该属性的可选值为 number / simple / complete / fixed", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-layout", + "type": "", + "desc": "自定义内容,需要在 layout 中列出 slot", + "defaultValue": "" + } + ], + "events": [ + { + "name": "before-page-change", + "sample": "before-page-change", + "type": "", + "desc": "在打开页面改变时的前置处理特性,并且进行翻页操作或者改变页大小操作时触发。;//参数arg\n { $grid: VueComponent, //table组件vue实例 \ncurrentPage: 1 //当前页码 \nlayout: 'total, prev, pager, next, jumper, sizes' //当前分页组件布局信息 \npageSize: 10// 当前每页显示条数 \npageSizes:[5, 10] //可切换的每页条数 \ntotal: 10 //总数据条数 }", + "defaultValue": "" + }, + { + "name": "size-change", + "sample": "pager-events", + "type": "Function(arg1)", + "desc": "设置分页跳转后的事件;pageSize 改变时会触发;arg1: pageSize 新的当前值", + "defaultValue": "" + }, + { + "name": "current-change", + "sample": "pager-events-current-change", + "type": "Function(arg1)", + "desc": "currentPage 改变时会触发;arg1: 新的当前页的值", + "defaultValue": "" + }, + { + "name": "prev-click", + "sample": "pager-events-prev-click", + "type": "Function(arg1)", + "desc": "用户点击上一页按钮改变当前页后触发;arg1: 新的当前页的值", + "defaultValue": "" + }, + { + "name": "next-click", + "sample": "pager-events-nextclick", + "type": "Function(arg1)", + "desc": "用户点击下一页按钮改变当前页后触发;arg1: Number 新的当前页的值", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/panel.json b/examples/docs/resources/pc/api/zh-CN/panel.json new file mode 100644 index 000000000..0dfe6d788 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/panel.json @@ -0,0 +1,113 @@ +{ + "attrs": [ + { + "name": "transition", + "sample": "", + "type": "String", + "desc": "是否开启动画效果,默认为 true 开启。;动画样式类名称。;该属性的可选值为 --", + "defaultValue": "该属性的默认值为 panel" + }, + { + "name": "expand", + "sample": "", + "type": "Boolean", + "desc": "初始化时是否默认展开内容区,默认为 true 展开,false 则为收起。;初始化时是否默认展开内容区,默认为 true 展开,false 则为收起。;该属性的可选值为 --", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "foot", + "sample": "", + "type": "String", + "desc": "指定底部内容,可输入 i18n 内容。;该属性的可选值为 --", + "defaultValue": "该属性的默认值为 --" + }, + { + "name": "head", + "sample": "", + "type": "String", + "desc": "指定头部内容,可输入 i18n 内容。;该属性的可选值为 --", + "defaultValue": "该属性的默认值为 --" + }, + { + "name": "isToggle", + "sample": "", + "type": "Boolean", + "desc": "是否可收缩模式,默认为 true 可以收缩。\n;该属性的可选值为 --", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "iconOpen", + "sample": "", + "type": "String", + "desc": "展开时的 icon,提供 icon-font 的样式类名称。;该属性的可选值为 --", + "defaultValue": "该属性的默认值为 icon-chevron-right" + }, + { + "name": "iconClose", + "sample": "", + "type": "String", + "desc": "收缩时的 icon,提供 icon-font 的样式类名称;该属性的可选值为 --", + "defaultValue": "该属性的默认值为 icon-chevron-down" + } + ], + "slots": [ + { + "name": "default", + "sample": "", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + }, + { + "name": "collapse", + "sample": "", + "type": "", + "desc": "内容", + "defaultValue": "" + }, + { + "name": "header", + "sample": "", + "type": "", + "desc": "头部", + "defaultValue": "" + }, + { + "name": "footer", + "sample": "", + "type": "", + "desc": "底部", + "defaultValue": "" + } + ], + "events": [ + { + "name": "beforeCollapse", + "sample": "", + "type": "", + "desc": "收缩前的事件。", + "defaultValue": "" + }, + { + "name": "beforeExpand", + "sample": "", + "type": "", + "desc": "展开前的事件,return false 可阻止展开。", + "defaultValue": "" + }, + { + "name": "collapse", + "sample": "", + "type": "", + "desc": "收缩后的事件。", + "defaultValue": "" + }, + { + "name": "expand", + "sample": "", + "type": "", + "desc": "展开后的事件。", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/pop-upload.json b/examples/docs/resources/pc/api/zh-CN/pop-upload.json new file mode 100644 index 000000000..cf2f9325b --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/pop-upload.json @@ -0,0 +1,137 @@ +{ + "attrs": [ + { + "name": "dialog-title", + "sample": "fill-button-text1", + "type": "String", + "desc": "设置文件上传弹框的标题;默认为 文件上传", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "设置组件大小", + "defaultValue": "" + }, + { + "name": "submit-button-text", + "sample": "fill-button-text2", + "type": "String", + "desc": "设置文件上传弹框中提交按钮的文本;默认为 开始上传", + "defaultValue": "" + }, + { + "name": "cancel-button-text", + "sample": "fill-button-text1", + "type": "String", + "desc": "设置文件上传弹框中取消按钮的文本;默认为 取消", + "defaultValue": "" + }, + { + "name": "action", + "sample": "custom-request-headers", + "type": "String", + "desc": "必选参数,设置上传的地址", + "defaultValue": "" + }, + { + "name": "headers", + "sample": "custom-request-headers", + "type": "Object", + "desc": "设置上传的请求头部", + "defaultValue": "" + }, + { + "name": "limit", + "sample": "file-limit", + "type": "Number", + "desc": "最大允许上传个数", + "defaultValue": "" + }, + { + "name": "multiple", + "sample": "file-limit", + "type": "Boolean", + "desc": "是否支持多选文件", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "size", + "type": "Boolean", + "desc": "是否禁用;默认为 false", + "defaultValue": "" + }, + { + "name": "accept", + "sample": "file-type", + "type": "String", + "desc": "接受上传的文件类型", + "defaultValue": "" + }, + { + "name": "upload-file-type", + "sample": "file-type", + "type": "Array", + "desc": "对上传文件进行校验的类型,比如 ['.png', '.jpg']", + "defaultValue": "" + }, + { + "name": "max-upload-file-size", + "sample": "max-upload-file-size", + "type": "Number", + "desc": "最大上传文件大小", + "defaultValue": "" + }, + { + "name": "upload-name", + "sample": "upload-name", + "type": "String", + "desc": "上传的文件字段名", + "defaultValue": "该属性的默认值为 file" + }, + { + "name": "upload-button-text", + "sample": "fill-button-text4", + "type": "String", + "desc": "打开弹出框的按钮的文本配置属性", + "defaultValue": "该属性的默认值为 选择文件" + }, + { + "name": "with-credentials", + "sample": "upload-name", + "type": "Boolean", + "desc": "支持发送 cookie 凭证信息", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "before-remove", + "sample": "prevent-delete-file", + "type": "Function(arg1)", + "desc": "在上传文件列表点击删除成功前触发;arg1:{Object 点击删除的文件信息}", + "defaultValue": "" + }, + { + "name": "before-upload", + "sample": "before-upload", + "type": "Function(arg1)", + "desc": "上传文件之前的钩子,参数为上传的文件,若返回 false 或者返回 Promise 且被 reject,则停止上传。;arg1:{Object 上传的文件信息}", + "defaultValue": "" + }, + { + "name": "http-request", + "sample": "http-request", + "type": "Function", + "desc": "覆盖默认的上传行为,可以自定义上传的实现", + "defaultValue": "" + }, + { + "name": "data", + "sample": "", + "type": "Object", + "desc": "上传时附带的额外参数", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/popeditor.json b/examples/docs/resources/pc/api/zh-CN/popeditor.json new file mode 100644 index 000000000..236b07345 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/popeditor.json @@ -0,0 +1,232 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "base", + "type": "String", + "desc": "绑定值", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "base", + "type": "String", + "desc": "占位符", + "defaultValue": "" + }, + { + "name": "tabindex", + "sample": "tabindex", + "type": "String", + "desc": "设置是否可通过 Tab 键获焦及获焦顺序(readonly 属性设置为 false 时有效)", + "defaultValue": "该属性的默认值为 1" + }, + { + "name": "remote-search", + "sample": "remote-search", + "type": "Function({ page, conditions })", + "desc": "配置远程搜索", + "defaultValue": "" + }, + { + "name": "before-reset", + "sample": "before-reset", + "type": "Function", + "desc": "重置前的钩子函数", + "defaultValue": "" + }, + { + "name": "resize", + "sample": "resize", + "type": "Boolean", + "desc": "是否显示弹框全屏按钮", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "draggable", + "sample": "draggable", + "type": "Boolean", + "desc": "设置弹出窗口是否可拖动", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "showOverflow", + "sample": "showOverflow", + "type": "String,Object", + "desc": "(popeditor 嵌套 grid 表格时,配置在gridOp属性的columns中)设置表格数据过长出现的展示问题,值可为:tooltip,title,ellipsis;①tooltip:内容超出部分显示 ...,左侧/右侧弹出提示层显示全部信息。②title:和原生标签的 title 属性一致。③ellipsis:内容超出部分显示 ...,没有提示。④true:为 true 时,效果和 tooltip 一致。", + "defaultValue": "" + }, + { + "name": "size", + "sample": "size", + "type": "String", + "desc": "设置组件的size大小,三种类型可以选择:medium,small,mini", + "defaultValue": "" + }, + { + "name": "trigger", + "sample": "trigger", + "type": "String", + "desc": "弹框表格中为单选时radio的选中配置,可配置:default(默认), cell(点击单元格触发), row(点击行触发)", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "设置组件是否为禁用状态。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "conditions", + "sample": "conditions", + "type": "Array", + "desc": "当弹出面板配置的是表格时,设置弹出面板中的表单查询项。", + "defaultValue": "" + }, + { + "name": "grid-op", + "sample": "grid", + "type": "Object", + "desc": "设置弹出面板中表格组件的配置信息。", + "defaultValue": "" + }, + { + "name": "pager-op", + "sample": "pager", + "type": "Object", + "desc": "设置分页配置", + "defaultValue": "" + }, + { + "name": "icon", + "sample": "icon", + "type": "Object", + "desc": "popEditor 组件的 Icon 图标设置。默认为 svg 组件", + "defaultValue": "" + }, + { + "name": "multi", + "sample": "multi", + "type": "Boolean", + "desc": "设置弹出面板中的数据是否可多选。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "popseletor", + "sample": "tree", + "type": "String", + "desc": "设置弹出面板中可显示的树或者表格组件。", + "defaultValue": "该属性的默认值为 grid" + }, + { + "name": "readonly", + "sample": "readonly", + "type": "Boolean", + "desc": "设置是否只读,【3.0】设置为 false 后点击 Ipunt 框可以弹出选择框", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "show-clear-btn", + "sample": "showClearBtn", + "type": "Boolean", + "desc": "设置输入框中右侧是否显示清除按钮。", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "show-pager", + "sample": "pager", + "type": "Boolean", + "desc": "展示分页", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "show-history", + "sample": "show-history", + "type": "Boolean", + "desc": "当弹出面板配置的是表格时,设置历史记录标签页是否显示表格。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "text-field", + "sample": "textField", + "type": "String", + "desc": "设置输入框中显示文本的字段,提交数据时,不提交该显示文本。", + "defaultValue": "该属性的默认值为 label" + }, + { + "name": "text-split", + "sample": "multi", + "type": "String", + "desc": "在多选的情况下,设置输入框中要显示多个数据时的分隔符。", + "defaultValue": "该属性的默认值为 /" + }, + { + "name": "title", + "sample": "title", + "type": "String", + "desc": "设置弹出面板的标题,并且支持国际化。", + "defaultValue": "" + }, + { + "name": "value-field", + "sample": "title", + "type": "String", + "desc": "设置输入框要提交数据的字段。", + "defaultValue": "该属性的默认值为 id" + }, + { + "name": "value-split", + "sample": "multi", + "type": "String", + "desc": "在多选的情况下,设置输入框要提交多个数据时的分隔符。", + "defaultValue": "该属性的默认值为 ;" + }, + { + "name": "width", + "sample": "width", + "type": "Number , String", + "desc": "设置弹出面板的宽度(单位像素)。当组件的 multi = true 时,宽度最小为900px;否则宽度最小为600px;", + "defaultValue": "" + }, + { + "name": "dialog-class", + "sample": "width", + "type": "String", + "desc": "自定义配置弹窗类名", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "search", + "sample": "slot", + "type": "", + "desc": "查询条件插槽", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "events", + "type": "Function(arg1,arg2)", + "desc": "Popeditor 组件 Input 框的 change 事件。;onChange(arg1,arg2){\n// arg1 = state.commitValue arg1为提交信息索引\n// arg2 = state.selectedDatas arg2为提交信息数据\n// do something you want... }", + "defaultValue": "" + }, + { + "name": "close", + "sample": "events", + "type": "Function", + "desc": "Popeditor 组件弹框关闭时触发的事件。", + "defaultValue": "" + }, + { + "name": "page-change", + "sample": "events", + "type": "Function(arg1)", + "desc": "Popeditor 组件表格模式带分页切换事件。;onPageChange(arg1){// arg1 = val arg1为分页切换页码// do something you want... }", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/popover.json b/examples/docs/resources/pc/api/zh-CN/popover.json new file mode 100644 index 000000000..8262b7e32 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/popover.json @@ -0,0 +1,176 @@ +{ + "attrs": [ + { + "name": "trigger", + "sample": "trigger-mode", + "type": "String", + "desc": "触发方式;该属性的可选值为 click / focus / hover / manual", + "defaultValue": "该属性的默认值为 click" + }, + { + "name": "title", + "sample": "custom-tip-text", + "type": "String", + "desc": "标题", + "defaultValue": "" + }, + { + "name": "content", + "sample": "popover-content", + "type": "String", + "desc": "显示的内容,也可以通过 slot 传入 DOM", + "defaultValue": "" + }, + { + "name": "width", + "sample": "popover-width", + "type": "String , Number", + "desc": "宽度", + "defaultValue": "该属性的默认值为auto,最小宽度 150px" + }, + { + "name": "height", + "sample": "popover-width", + "type": "String , Number", + "desc": "高度", + "defaultValue": "该属性的默认值为auto" + }, + { + "name": "placement", + "sample": "popover-placement", + "type": "String", + "desc": "出现位置;该属性的可选值为 top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end", + "defaultValue": "该属性的默认值为 bottom" + }, + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "Popover 是否可用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "modelValue / v-model", + "sample": "trigger-mode", + "type": "Boolean", + "desc": "状态是否可见", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "offset", + "sample": "frame-offset", + "type": "Number", + "desc": "出现位置的偏移量", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "arrow-offset", + "sample": "arrow-offset", + "type": "Number", + "desc": "箭头的位置偏移", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "transform-origin", + "sample": "", + "type": "Boolean , String", + "desc": "组件的旋转中心点 ", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "append-to-body", + "sample": "basic-usage", + "type": "Boolean", + "desc": "是否添加到body上", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "transition", + "sample": "custom-transition", + "type": "String", + "desc": "定义渐变动画", + "defaultValue": "该属性的默认值为 fade-in-linear" + }, + { + "name": "visible-arrow", + "sample": "hidden-arrow", + "type": "Boolean", + "desc": "是否显示 Tooltip 箭头", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "popper-options", + "sample": "popper-options", + "type": "Object", + "desc": "popper.js 的参数;该属性的可选值为 参考popper.js文档", + "defaultValue": "该属性的默认值为 { boundariesElement: 'body', gpuAcceleration: false }" + }, + { + "name": "popper-class", + "sample": "popper-class", + "type": "String", + "desc": "为 popper 添加类名", + "defaultValue": "" + }, + { + "name": "open-delay", + "sample": "open-delay", + "type": "Number", + "desc": "触发方式为 hover 时的显示延迟,单位为毫秒", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "close-delay", + "sample": "close-delay", + "type": "Number", + "desc": "触发方式为 hover 时的隐藏延迟,单位为毫秒", + "defaultValue": "该属性的默认值为 200" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-tip-text", + "type": "", + "desc": "Popover 内嵌 HTML 文本", + "defaultValue": "" + }, + { + "name": "reference", + "sample": "popover-events", + "type": "", + "desc": "触发 Popover 显示的 HTML 元素", + "defaultValue": "" + } + ], + "events": [ + { + "name": "show", + "sample": "popover-events", + "type": "Function()", + "desc": "显示时触发", + "defaultValue": "" + }, + { + "name": "hide", + "sample": "popover-events", + "type": "Function()", + "desc": "隐藏时触发", + "defaultValue": "" + }, + { + "name": "after-enter", + "sample": "popover-events", + "type": "Function", + "desc": "显示动画播放完毕后触发", + "defaultValue": "" + }, + { + "name": "after-leave", + "sample": "popover-events", + "type": "Function()", + "desc": "隐藏动画播放完毕后触发", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/popup-load.json b/examples/docs/resources/pc/api/zh-CN/popup-load.json new file mode 100644 index 000000000..9e26dfeeb --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/popup-load.json @@ -0,0 +1 @@ +{} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/progress.json b/examples/docs/resources/pc/api/zh-CN/progress.json new file mode 100644 index 000000000..8dd948a0a --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/progress.json @@ -0,0 +1,67 @@ +{ + "attrs": [ + { + "name": "percentage", + "sample": "basic-usage", + "type": "Number", + "desc": "百分比(必填);该属性的可选值为 0-100", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "type", + "sample": "progress-type", + "type": "String", + "desc": "进度条类型;该属性的可选值为 line / circle / dashboard", + "defaultValue": "该属性的默认值为 line" + }, + { + "name": "stroke-width", + "sample": "progress-width", + "type": "Number", + "desc": "进度条的宽度,单位 px", + "defaultValue": "该属性的默认值为 6" + }, + { + "name": "text-inside", + "sample": "progress-width", + "type": "Boolean", + "desc": "进度条显示文字内置在进度条内(只在 type=line 时可用)", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "status", + "sample": "progress-status", + "type": "String", + "desc": "进度条当前状态;该属性的可选值为 success / exception / warning", + "defaultValue": "" + }, + { + "name": "color", + "sample": "custom-color", + "type": "String , Function , Array", + "desc": "进度条背景色(会覆盖 status 状态颜色)", + "defaultValue": "" + }, + { + "name": "width", + "sample": "progress-width", + "type": "Number", + "desc": "环形进度条画布宽度(只在 type 为 circle 或 dashboard 时可用)", + "defaultValue": "该属性的默认值为 126" + }, + { + "name": "show-text", + "sample": "text-inside-or-no-text", + "type": "Boolean", + "desc": "是否显示进度条文字内容", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "format", + "sample": "format-text", + "type": "Function", + "desc": "自定义进度条的文字", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/radio-button.json b/examples/docs/resources/pc/api/zh-CN/radio-button.json new file mode 100644 index 000000000..9bf55525d --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/radio-button.json @@ -0,0 +1,34 @@ +{ + "attrs": [ + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "是否禁用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "name", + "sample": "radio-text", + "type": "String", + "desc": "原生 name 属性", + "defaultValue": "" + }, + { + "name": "label", + "sample": "radio-text", + "type": "String | Number", + "desc": "Radio 的 value", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "dynamic-disable", + "type": "", + "desc": "button按钮的内容", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/radio-group.json b/examples/docs/resources/pc/api/zh-CN/radio-group.json new file mode 100644 index 000000000..9db407158 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/radio-group.json @@ -0,0 +1,71 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "vertical", + "type": "—", + "desc": "绑定值", + "defaultValue": "" + }, + { + "name": "text-color", + "sample": "active-color", + "type": "String", + "desc": "按钮形式的 Radio 激活时的文本颜色", + "defaultValue": "该属性的默认值为 #fff" + }, + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "是否禁用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "size", + "sample": "radio-size", + "type": "String", + "desc": "单选框组尺寸,仅对按钮形式的 Radio 或带有边框的 Radio 有效;该属性的可选值为 medium / small / mini", + "defaultValue": "" + }, + { + "name": "fill", + "sample": "active-color", + "type": "String", + "desc": "按钮形式的 Radio 激活时的填充色和边框色", + "defaultValue": "" + }, + { + "name": "vertical", + "sample": "vertical", + "type": "Boolean", + "desc": "设置组件排列方式", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "options", + "sample": "group-options", + "type": "Array", + "desc": "循环配置 Radio", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "vertical", + "type": "", + "desc": "radio默认插槽", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "vertical", + "type": "", + "desc": "绑定值变化时触发的事件", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/radio.json b/examples/docs/resources/pc/api/zh-CN/radio.json new file mode 100644 index 000000000..1b22b2401 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/radio.json @@ -0,0 +1,71 @@ +{ + "attrs": [ + { + "name": "label", + "sample": "with-border", + "type": "Boolean|Number|String", + "desc": "Radio 的 value", + "defaultValue": "" + }, + { + "name": "modelValue / v-model", + "sample": "with-border", + "type": "—", + "desc": "绑定值", + "defaultValue": "" + }, + { + "name": "text", + "sample": "radio-text", + "type": "String", + "desc": "文本", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "是否禁用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "border", + "sample": "with-border", + "type": "Boolean", + "desc": "是否显示边框", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "size", + "sample": "radio-size", + "type": "String", + "desc": "Radio 的尺寸,仅在 border 为真时有效;该属性的可选值为 medium / small / mini", + "defaultValue": "" + }, + { + "name": "name", + "sample": "radio-button1", + "type": "String", + "desc": "原生 name 属性", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "radio-default", + "type": "", + "desc": "Radio的默认插槽", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "radio-events", + "type": "", + "desc": "绑定值变化时触发的事件", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/rate.json b/examples/docs/resources/pc/api/zh-CN/rate.json new file mode 100644 index 000000000..effd18b60 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/rate.json @@ -0,0 +1,160 @@ +{ + "attrs": [ + { + "name": "max", + "sample": "max-score", + "type": "Number", + "desc": "最大分值", + "defaultValue": "该属性的默认值为 5" + }, + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "是否为只读", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "allow-half", + "sample": "allow-half", + "type": "Boolean", + "desc": "是否允许半选", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "colors", + "sample": "custom-3-threshold-colors", + "type": "Array", + "desc": "icon 的颜色数组,为 Threshold 3 个分段所对应的颜色", + "defaultValue": "该属性的默认值为 ['#FADB14', '#FADB14', '#FADB14']" + }, + { + "name": "disabled-void-color", + "sample": "disabled-not-selected-color", + "type": "String", + "desc": "禁用状态下未选中 icon 的颜色", + "defaultValue": "该属性的默认值为 #D9D9D9" + }, + { + "name": "disabled-void-icon-class", + "sample": "disabled-not-selected-color", + "type": "String", + "desc": "只读状态下未选中的图标样式名", + "defaultValue": "该属性的默认值为 icon-stardisable" + }, + { + "name": "high-threshold", + "sample": "threshold-value", + "type": "Number", + "desc": "高分和中等分数的界限值,值本身被划分在高分中", + "defaultValue": "该属性的默认值为 4" + }, + { + "name": "icon-classes", + "sample": "custom-3-threshold-icon", + "type": "Array", + "desc": "三个分段对应的图标样式名", + "defaultValue": "该属性的默认值为 ['icon-starActive', 'icon-starActive', 'icon-starActive']" + }, + { + "name": "low-threshold", + "sample": "threshold-value", + "type": "Number", + "desc": "低分和中等分数的界限值,值本身被划分在低分中", + "defaultValue": "该属性的默认值为 2" + }, + { + "name": "score-template", + "sample": "show-score", + "type": "String", + "desc": "分数显示模板", + "defaultValue": "该属性的默认值为 {value}" + }, + { + "name": "show-score", + "sample": "show-score", + "type": "Boolean", + "desc": "是否显示当前分数,show-score 和 show-text 不能同时为真", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "show-text", + "sample": "texts-and-text-color", + "type": "Boolean", + "desc": "是否显示辅助文字,若为真,则会从 texts 数组中选取当前分数对应的文字内容", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "text-color", + "sample": "texts-and-text-color", + "type": "String", + "desc": "辅助文字的颜色", + "defaultValue": "该属性的默认值为 #666666" + }, + { + "name": "texts", + "sample": "texts-and-text-color", + "type": "Array", + "desc": "辅助文字数组", + "defaultValue": "该属性的默认值为 ['很差', '差', '一般', '好', '很好']" + }, + { + "name": "void-color", + "sample": "not-selected-color", + "type": "String", + "desc": "未选中 icon 的颜色", + "defaultValue": "该属性的默认值为 #BFBFBF" + }, + { + "name": "void-icon-class", + "sample": "not-selected-class", + "type": "String", + "desc": "未选中 icon 的类名", + "defaultValue": "该属性的默认值为 icon-stardisable" + }, + { + "name": "radio", + "sample": "radio-rate", + "type": "Boolean", + "desc": "评分其他形态单选", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "size", + "sample": "size-and-space", + "type": "String", + "desc": "图标字体大小", + "defaultValue": "该属性的默认值为 18px" + }, + { + "name": "space", + "sample": "size-and-space", + "type": "String", + "desc": "每个图标所占宽度", + "defaultValue": "该属性的默认值为 24px" + }, + { + "name": "text-on-bottom", + "sample": "text-on-bottom", + "type": "Boolean", + "desc": "是否在图标下显示对应的文字", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "Number", + "desc": "绑定值", + "defaultValue": "该属性的默认值为 0" + } + ], + "events": [ + { + "name": "change", + "sample": "rate-events", + "type": "", + "desc": "分值改变时触发", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/roles.json b/examples/docs/resources/pc/api/zh-CN/roles.json new file mode 100644 index 000000000..f5d726760 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/roles.json @@ -0,0 +1,20 @@ +{ + "attrs": [ + { + "name": "fetch-role", + "sample": "fetch-role", + "type": "Function", + "desc": "自定义接口,返回一个Promise对象,未使用框架服务时必填。", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "base", + "type": "", + "desc": "选中值发生变化时触发", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/row.json b/examples/docs/resources/pc/api/zh-CN/row.json new file mode 100644 index 000000000..398cfdf01 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/row.json @@ -0,0 +1,55 @@ +{ + "attrs": [ + { + "name": "align", + "sample": "align", + "type": "String", + "desc": "flex 布局下的垂直排列方式;该属性的可选值为 top / middle / bottom", + "defaultValue": "该属性的默认值为 top" + }, + { + "name": "flex", + "sample": "", + "type": "Boolean", + "desc": "启用 flex 布局模式,现代浏览器下有效", + "defaultValue": "" + }, + { + "name": "gutter", + "sample": "align", + "type": "Number", + "desc": "栅格间隔", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "justify", + "sample": "align", + "type": "String", + "desc": "flex 布局下的水平排列方式;该属性的可选值为 start / end / center / space-around / space-between", + "defaultValue": "该属性的默认值为 start" + }, + { + "name": "order", + "sample": "align", + "type": "String", + "desc": "flex 布局下排序方式;该属性的可选值为 asc / des", + "defaultValue": "" + }, + { + "name": "tag", + "sample": "align", + "type": "String", + "desc": "自定义元素标签,可选任意标签;该属性的可选值为 *", + "defaultValue": "该属性的默认值为 div" + } + ], + "slots": [ + { + "name": "default", + "sample": "base", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/scroll-text.json b/examples/docs/resources/pc/api/zh-CN/scroll-text.json new file mode 100644 index 000000000..2f514f66f --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/scroll-text.json @@ -0,0 +1,41 @@ +{ + "attrs": [ + { + "name": "direction", + "sample": "scroll-direction", + "type": "String", + "desc": "滚动的方向;该属性的可选值为 up / left / down / right", + "defaultValue": "该属性的默认值为 left" + }, + { + "name": "hover-stop", + "sample": "hover-stop", + "type": "Boolean", + "desc": "hover 滚动是否停止,可选值为 false 或 true;默认值true。", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "time", + "sample": "scroll-time", + "type": "Number", + "desc": "整个滚动过程所用的时间,默认值 5s 。", + "defaultValue": "该属性的默认值为 5" + }, + { + "name": "text", + "sample": "custom-scroll-text", + "type": "String", + "desc": "滚动的文本内容", + "defaultValue": "该属性的默认值为 ScrollText" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-scroll-text", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/scrollbar.json b/examples/docs/resources/pc/api/zh-CN/scrollbar.json new file mode 100644 index 000000000..7561e5980 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/scrollbar.json @@ -0,0 +1,11 @@ +{ + "slots": [ + { + "name": "default", + "sample": "", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/search.json b/examples/docs/resources/pc/api/zh-CN/search.json new file mode 100644 index 000000000..0eeecac03 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/search.json @@ -0,0 +1,99 @@ +{ + "attrs": [ + { + "name": "default-value", + "sample": "", + "type": "String", + "desc": "设置搜索输入框内的默认搜索值。", + "defaultValue": "" + }, + { + "name": "clearable", + "sample": "clearable", + "type": "Boolean", + "desc": " 属性设置显示清空图标按钮", + "defaultValue": "" + }, + { + "name": "v-model", + "sample": "basic-usage", + "type": "String", + "desc": "设置绑定的值。", + "defaultValue": "" + }, + { + "name": "mini", + "sample": "mini-mode", + "type": "Boolean", + "desc": "迷你模式,配置为true时,搜索默认显示为一个带图标的圆形按钮,点击后展开,默认 false 。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "placeholder", + "sample": "basic-usage", + "type": "String", + "desc": "设置搜索输入框内的提示占位文本 。", + "defaultValue": "" + }, + { + "name": "search-types", + "sample": "search-types", + "type": "Array", + "desc": "搜索的类型选项,格式为[{text:'文档',value:1},...],不配置时类型选择固定显示为All 。", + "defaultValue": "" + }, + { + "name": "is-enter-search", + "sample": "search-events", + "type": "Boolean", + "desc": "是否在按下键盘Enter键的时候触发search事件", + "defaultValue": "" + }, + { + "name": "transparent", + "sample": "transparent-mode", + "type": "Boolean", + "desc": "设置为透明模式,配置为true时,边框变为透明且收缩后半透明显示,一般用在带有背景的场景,默认 false 。", + "defaultValue": "该属性的默认值为 false" + } + ], + "slots": [ + { + "name": "poplist", + "sample": "custom-search-types", + "type": "", + "desc": "搜索的弹出列表插槽", + "defaultValue": "" + }, + { + "name": "text", + "sample": "show-selected-types", + "type": "", + "desc": "默认搜索类型插槽", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "change-events", + "type": "Function(arg1,arg2)", + "desc": "在 input 框中输入完成时触发的回调函数;arg1:{Object 搜索类型},arg2:{String 当前input框中值}", + "defaultValue": "" + }, + { + "name": "search", + "sample": "search-events", + "type": "Function(arg1,arg2)", + "desc": "在展开状态点击搜索按钮时触发的回调函数;arg1:{Object 搜索类型},arg2:{String 当前input框中值}", + "defaultValue": "" + }, + { + "name": "select", + "sample": "select-events", + "type": "Function(arg1)", + "desc": "在search组件切换类型时触发的回调函数;arg1:{Object 搜索类型}", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/select-dropdown.json b/examples/docs/resources/pc/api/zh-CN/select-dropdown.json new file mode 100644 index 000000000..9e26dfeeb --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/select-dropdown.json @@ -0,0 +1 @@ +{} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/select.json b/examples/docs/resources/pc/api/zh-CN/select.json new file mode 100644 index 000000000..60d401ee6 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/select.json @@ -0,0 +1,381 @@ +{ + "attrs": [ + { + "name": "tag-selectable", + "sample": "tag-select", + "type": "String", + "desc": "下拉框内选中项支持复制功能", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "是否禁用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "multiple", + "sample": "multiple", + "type": "Boolean", + "desc": "设置是否允许输入框输入或选择多个项,默认为 false。;是否多选", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "placement", + "sample": "popup-style-position", + "type": "String", + "desc": "tip 相对于创建 tip 的 dom 节点的位置。;该属性的可选值为 top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end", + "defaultValue": "" + }, + { + "name": "clearable", + "sample": "clearable", + "type": "Boolean", + "desc": "设置是否显示清除文本的按钮,默认为 true。;是否可以清空选项", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "text-field", + "sample": "nest-checkbox-grid1", + "type": "String", + "desc": "设置下拉框的文本对应的数据源的字段名称。", + "defaultValue": "" + }, + { + "name": "modelValue / v-model", + "sample": "multiple", + "type": "Boolean , String , Number", + "desc": "设置下拉框的默认值。;绑定值", + "defaultValue": "" + }, + { + "name": "value-field", + "sample": "nest-checkbox-grid2", + "type": "String", + "desc": "设置下拉框的值所对应数据源的字段名称,下拉框的值用于提交到服务器。", + "defaultValue": "" + }, + { + "name": "value-key", + "sample": "binding-obj", + "type": "String", + "desc": "作为 value 唯一标识的键名,绑定值为对象类型时必填", + "defaultValue": "该属性的默认值为 value" + }, + { + "name": "size", + "sample": "size-medium", + "type": "String", + "desc": "输入框尺寸;该属性的可选值为 medium/small/mini", + "defaultValue": "" + }, + { + "name": "collapse-tags", + "sample": "collapse-tags", + "type": "Boolean", + "desc": "多选时是否将选中值按文字的形式展示", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "multiple-limit", + "sample": "multiple", + "type": "Number", + "desc": "多选时用户最多可以选择的项目数,为 0 则不限制", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "name", + "sample": "name", + "type": "String", + "desc": "select input 的 name 属性", + "defaultValue": "" + }, + { + "name": "autocomplete", + "sample": "", + "type": "String", + "desc": "select input 的 autocomplete 属性", + "defaultValue": "该属性的默认值为 off" + }, + { + "name": "placeholder", + "sample": "basic-usage", + "type": "String", + "desc": "占位符", + "defaultValue": "该属性的默认值为 请选择" + }, + { + "name": "filterable", + "sample": "filter-method", + "type": "Boolean", + "desc": "是否可搜索", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "searchable", + "sample": "searchable", + "type": "Boolean", + "desc": "是否下拉面板可搜索", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "allow-create", + "sample": "allow-create", + "type": "Boolean", + "desc": "是否允许用户创建新条目,需配合 filterable 使用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "filter-method", + "sample": "filter-method", + "type": "Function(arg1,arg2)", + "desc": "自定义搜索方法;arg1:{String 当前input框中值},arg2:{Object 树的某个节点}", + "defaultValue": "" + }, + { + "name": "remote", + "sample": "remote-method", + "type": "Boolean", + "desc": "是否为远程搜索", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "remote-method", + "sample": "remote-method", + "type": "Function", + "desc": "远程搜索方法", + "defaultValue": "" + }, + { + "name": "loading", + "sample": "remote-method", + "type": "Boolean", + "desc": "是否正在从远程获取数据", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "loading-text", + "sample": "remote-method", + "type": "String", + "desc": "远程加载时显示的文字", + "defaultValue": "该属性的默认值为 加载中" + }, + { + "name": "no-match-text", + "sample": "no-match-text", + "type": "String", + "desc": "搜索条件无匹配时显示的文字,也可以使用slot=\"empty\"设置", + "defaultValue": "该属性的默认值为 无匹配数据" + }, + { + "name": "no-data-text", + "sample": "no-data-text", + "type": "String", + "desc": "选项为空时显示的文字,也可以使用slot=\"empty\"设置", + "defaultValue": "该属性的默认值为 无数据" + }, + { + "name": "popper-class", + "sample": "popup-style-position", + "type": "String", + "desc": "Select 下拉框的类名", + "defaultValue": "该属性的默认值为空" + }, + { + "name": "reserve-keyword", + "sample": "remote-method", + "type": "Boolean", + "desc": "多选且可搜索时,是否在选中一个选项后保留当前的搜索关键词", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "default-first-option", + "sample": "allow-create", + "type": "Boolean", + "desc": "在输入框按下回车,选择第一个匹配项。需配合 filterable 或 remote 使用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "popper-append-to-body", + "sample": "popup-style-position", + "type": "Boolean", + "desc": "是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "automatic-dropdown", + "sample": "automatic-dropdown", + "type": "Boolean", + "desc": "对于不可搜索的 Select,是否在输入框获得焦点后自动弹出选项菜单", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "options", + "sample": "size-medium", + "type": "Array", + "desc": "配置 Select 数据项,使用后不需要再配置 tiny-option。", + "defaultValue": "" + }, + { + "name": "show-alloption", + "sample": "show-alloption", + "type": "Boolean", + "desc": "展示 `全选` 选项,默认为 true 。", + "defaultValue": "" + }, + { + "name": "is-drop-inherit-width", + "sample": "is-drop-inherit-width", + "type": "Boolean", + "desc": "设置下拉列表的宽度是否跟随输入框的宽度进行展示,默认为 false;设置值为 false 时,表示不跟随,下拉列表宽度由选项内容的长度决定;设置值为 true 时,表示跟随输入框的宽度进行展示", + "defaultValue": "" + }, + { + "name": "cache-op", + "sample": "cache-usage", + "type": "Object", + "desc": "开启 select 本地缓存功能(根据用户点击选择的次数、最后时间继续存储排序);cache-op.key (必填)本地缓存的唯一 key 值;cache-op.sortBy 排序的字段,默认 frequency (频次),可选值:frequency、time;cache-op.sort 排序方式,默认 desc (降序),可选值:desc、asc;cache-op.dataKey 数据中的唯一标识的 key 名称,默认: value;cache-op.highlightClass 个性化高亮 class 名称,默认:memorize-highlight;cache-op.highlightNum 高亮个性化的条数,默认:Infinity;cache-op.cacheNum 存储个性化的条数,默认:Infinity;cache-op.serialize 本地存储序列化方法,默认:JSON.Stringify;cache-op.deserialize 本地存储序反列化方法,默认:JSON.parse", + "defaultValue": "" + }, + { + "name": "render-type", + "sample": "nest-radio-grid", + "type": "String", + "desc": "设置下拉列表嵌套 Grid 或 Tree 时的组件类型", + "defaultValue": "" + }, + { + "name": "grid-op", + "sample": "nest-radio-grid", + "type": "Object", + "desc": "下拉列表嵌套 Grid 组件时,用来配置 Grid 的数据信息", + "defaultValue": "" + }, + { + "name": "tree-op", + "sample": "nest-radio-tree", + "type": "Object", + "desc": "下拉列表嵌套 Tree 组件时,用来配置 Tree 的数据信息", + "defaultValue": "" + }, + { + "name": "allow-copy", + "sample": "search-allow-copy", + "type": "Boolean", + "desc": "搜索单选场景,是否允许复制输入框的内容", + "defaultValue": "该属性的默认值为 false,表示不能复制" + }, + { + "name": "copyable", + "sample": "search-allow-copy", + "type": "Boolean", + "desc": "是开启复制功能,配置后会在输入框右侧鼠标上浮后有个复制按钮。(值能用于多选模式)", + "defaultValue": "" + }, + { + "name": "text-split", + "sample": "", + "type": "String", + "desc": "在配置 copyable 的情况下可相当于选中项的分隔符", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "slot-default", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + }, + { + "name": "reference", + "sample": "custom-reference-slot", + "type": "", + "desc": "Select 组件触发源", + "defaultValue": "" + }, + { + "name": "prefix", + "sample": "custom-prefix", + "type": "", + "desc": "Select 组件头部内容", + "defaultValue": "" + }, + { + "name": "empty", + "sample": "slot-empty", + "type": "", + "desc": "无选项时的列表", + "defaultValue": "" + }, + { + "name": "footer", + "sample": "slot-footer", + "type": "", + "desc": "底部插槽", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "focus", + "sample": "manual-focus-blur", + "type": "", + "desc": "使 input 获取焦点", + "defaultValue": "" + }, + { + "name": "blur", + "sample": "manual-focus-blur", + "type": "", + "desc": "使 input 失去焦点,并隐藏下拉框", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "envts-change", + "type": "Function(arg1,arg2)", + "desc": "设置下拉框值更新后触发的事件。;arg1:{Any|Array 单选并且未指定渲染类型时,是选中项的值字段,此时没有arg2参数;多选并且未指定渲染类型时,是选中项值字段组成的数组,此时没有arg2参数;单选并且渲染类型为树或者表格时,是选中项对象,此时没有arg2参数;多选并且渲染类型为树或者表格时,是选中项对象值字段组成的数组,此时有arg2参数;},arg2:{Array 多选并且渲染类型为树或者表格时,是选中项对象组成的数组}", + "defaultValue": "" + }, + { + "name": "clear", + "sample": "envts-change", + "type": "Function", + "desc": "设置内容清除后触发的事件。;可清空的单选模式下用户点击清空按钮时触发", + "defaultValue": "" + }, + { + "name": "visible-change", + "sample": "envts-change", + "type": "Function(arg)", + "desc": "下拉框出现/隐藏时触发;arg:{Boolean 下拉框出现时为true;下拉框隐藏时为false}", + "defaultValue": "" + }, + { + "name": "remove-tag", + "sample": "envts-change", + "type": "Function(arg)", + "desc": "多选模式下移除tag时触发;arg:{Any 被移除Tag对应数据项的值字段}", + "defaultValue": "" + }, + { + "name": "blur", + "sample": "envts-change", + "type": "Function(arg)", + "desc": "当 input 失去焦点时触发;arg:{FocusEvent 原生blur事件对象}", + "defaultValue": "" + }, + { + "name": "focus", + "sample": "envts-change", + "type": "Function(arg)", + "desc": "当 input 获得焦点时触发;arg:{FocusEvent 原生focus事件对象}", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/slide-bar.json b/examples/docs/resources/pc/api/zh-CN/slide-bar.json new file mode 100644 index 000000000..b964ebe0b --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/slide-bar.json @@ -0,0 +1,64 @@ +{ + "attrs": [ + { + "name": "value", + "sample": "wheel-blocks", + "type": "Array", + "desc": "调用服务时候获取数据的来源。", + "defaultValue": "" + }, + { + "name": "init-blocks", + "sample": "wheel-blocks", + "type": "Number", + "desc": "初始时需要显示的块数。", + "defaultValue": "" + }, + { + "name": "wheel-blocks", + "sample": "wheel-blocks", + "type": "Number", + "desc": "鼠标滚轮上下滚动的时候,滚动的块数长度。", + "defaultValue": "该属性的默认值为 1" + }, + { + "name": "tag", + "sample": "custom-tag", + "type": "String", + "desc": "设置组件的 Dom 标签", + "defaultValue": "该属性的默认值为 ul" + }, + { + "name": "sub-tag", + "sample": "custom-tag", + "type": "String", + "desc": "设置组件的子级 Dom 标签", + "defaultValue": "该属性的默认值为 li" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-content", + "type": "", + "desc": "默认的作用域插槽", + "defaultValue": "" + } + ], + "events": [ + { + "name": "before-click", + "sample": "slide-bar-events", + "type": "Function(value)", + "desc": "滑动点击前触发的事件;event: 原生事件", + "defaultValue": "" + }, + { + "name": "click", + "sample": "slide-bar-events", + "type": "Function(data, index)", + "desc": "滑动块点击事件;data: 点击的滑块数据,index: 点击的滑块索引值", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/slider.json b/examples/docs/resources/pc/api/zh-CN/slider.json new file mode 100644 index 000000000..d8b7a6022 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/slider.json @@ -0,0 +1,113 @@ +{ + "attrs": [ + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "是否禁用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "min", + "sample": "max-min", + "type": "Number", + "desc": "设置最小值。", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "max", + "sample": "max-min", + "type": "Number", + "desc": "设置最大值。必需是整数,可以负数。必需大于所设置的最小值。", + "defaultValue": "该属性的默认值为 100" + }, + { + "name": "step", + "sample": "about-step", + "type": "Number", + "desc": "设置滑块移动时,每步位移距离,必需是大于0的正整数。", + "defaultValue": "该属性的默认值为 1" + }, + { + "name": "show-input", + "sample": "show-iput", + "type": "Boolean", + "desc": "是否显示输入框,仅在非范围选择时有效", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "format-tooltip", + "sample": "show-tip", + "type": "Function(value)", + "desc": "格式化 tooltip message", + "defaultValue": "" + }, + { + "name": "vertical", + "sample": "vertical-mode", + "type": "Boolean", + "desc": "是否竖向模式", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "height", + "sample": "vertical-mode", + "type": "String", + "desc": "Slider 高度", + "defaultValue": "该属性的默认值为 300px" + }, + { + "name": "value", + "sample": "range-select", + "type": "Number", + "desc": "设置单滑块的当前值,必需是整数或数组。;绑定值", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "num-pages", + "sample": "shortcut-operation", + "type": "Number", + "desc": "设置总步数,即按快捷键 PageDown/PageUp 时,每次移动的距离是(最大值-最小值)/分页数;该属性的可选值为 0", + "defaultValue": "该属性的默认值为 1" + }, + { + "name": "show-tip", + "sample": "show-tip", + "type": "Boolean", + "desc": "是否显示 tooltip", + "defaultValue": "该属性的默认值为 true" + } + ], + "slots": [ + { + "name": "default", + "sample": "slider-slot", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "slider-event-change", + "type": "Function(arg)", + "desc": "值改变时触发(使用鼠标拖曳时,只在松开鼠标后触发);arg:{Number|Array 滑块非范围选择时,是滑块当前值;滑块是范围选择时,是滑块当前值数组}", + "defaultValue": "" + }, + { + "name": "Start", + "sample": "slider-event-start", + "type": "Function(arg)", + "desc": "设置滑块滑动开始时,触发该事件;arg:{Number|Array 滑块非范围选择时,是滑块当前值;滑块是范围选择时,是滑块当前值数组}", + "defaultValue": "" + }, + { + "name": "Stop", + "sample": "slider-event-stop", + "type": "Function(arg)", + "desc": "设置滑块滑动结束时,触发该事件;arg:{Number|Array 滑块非范围选择时,是滑块当前值;滑块是范围选择时,是滑块当前值数组}", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/split.json b/examples/docs/resources/pc/api/zh-CN/split.json new file mode 100644 index 000000000..047c6659e --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/split.json @@ -0,0 +1,92 @@ +{ + "attrs": [ + { + "name": "left-top-min", + "sample": "split-threshold", + "type": "Number , String", + "desc": "左面板 / 上面板最小阈值。", + "defaultValue": "该属性的默认值为 40px" + }, + { + "name": "mode", + "sample": "split-mode", + "type": "String", + "desc": "分割类型,可选值为 horizontal 或 vertical;默认值horizontal。;该属性的可选值为 horizontal / vertical", + "defaultValue": "该属性的默认值为 horizontal" + }, + { + "name": "right-bottom-min", + "sample": "split-threshold", + "type": "Number , String", + "desc": "右面板 / 下面板最小阈值。", + "defaultValue": "该属性的默认值为 40px" + }, + { + "name": "modelValue", + "sample": "basic-usage", + "type": "Number , String", + "desc": "分割面板的位置。", + "defaultValue": "该属性的默认值为 0.5" + } + ], + "slots": [ + { + "name": "left", + "sample": "left-right-slot", + "type": "", + "desc": "左面板插槽", + "defaultValue": "" + }, + { + "name": "right", + "sample": "left-right-slot", + "type": "", + "desc": "右面板插槽", + "defaultValue": "" + }, + { + "name": "top", + "sample": "top-bottom-slot", + "type": "", + "desc": "上面板插槽", + "defaultValue": "" + }, + { + "name": "bottom", + "sample": "top-bottom-slot", + "type": "", + "desc": "下面板插槽", + "defaultValue": "" + }, + { + "name": "trigger", + "sample": "trigger-slot", + "type": "", + "desc": "拖拽插槽", + "defaultValue": "" + } + ], + "events": [ + { + "name": "moveend", + "sample": "moveend-event", + "type": "Function()", + "desc": "拖拽结束的事件。;拖拽结束的事件。;无arguments", + "defaultValue": "" + }, + { + "name": "movestart", + "sample": "movestart-event", + "type": "Function()", + "desc": "拖拽开始的事件。;拖拽开始的事件。;无arguments", + "defaultValue": "" + }, + { + "name": "moving", + "sample": "moving-event", + "type": "Function(arg)", + "desc": "拖拽中的事件。;拖拽中的事件。;arg1:event (类型Object)", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/steps.json b/examples/docs/resources/pc/api/zh-CN/steps.json new file mode 100644 index 000000000..3c23483fa --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/steps.json @@ -0,0 +1,64 @@ +{ + "attrs": [ + { + "name": "active", + "sample": "advanced-steps", + "type": "Number", + "desc": "设置步骤条的选中步骤,默认为-1 。", + "defaultValue": "该属性的默认值为 -1" + }, + { + "name": "count-field", + "sample": "custom-steps-item", + "type": "String", + "desc": "设置高级向导里徽标计数对应的字段名,默认为 'count'", + "defaultValue": "该属性的默认值为 count" + }, + { + "name": "data", + "sample": "data-resource", + "type": "Object , Array", + "desc": "设置步骤条的数据 。", + "defaultValue": "" + }, + { + "name": "name-field", + "sample": "custom-steps-item", + "type": "String", + "desc": "设置节点信息中名称对应的字段名,默认为 'name'", + "defaultValue": "该属性的默认值为 name" + }, + { + "name": "space", + "sample": "order-progress", + "type": "Number", + "desc": "设置步骤条的宽度。", + "defaultValue": "" + }, + { + "name": "status-field", + "sample": "custom-steps-item", + "type": "String", + "desc": "设置数据状态对应的字段名,默认为 'status'", + "defaultValue": "该属性的默认值为 status" + } + ], + "slots": [ + { + "name": "item", + "sample": "slot", + "type": "", + "desc": "步骤条数据项插槽", + "defaultValue": "" + } + ], + "events": [ + { + "name": "click", + "sample": "click", + "type": "", + "desc": "节点的点击事件,参数(index:节点索引, node:节点数据信息)", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/svg-icon.json b/examples/docs/resources/pc/api/zh-CN/svg-icon.json new file mode 100644 index 000000000..f721b7c27 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/svg-icon.json @@ -0,0 +1,32 @@ +{ + "attrs": [ + { + "name": "src", + "sample": "", + "type": "String", + "desc": " ", + "defaultValue": "" + }, + { + "name": "width", + "sample": "", + "type": "String", + "desc": "宽度", + "defaultValue": "" + }, + { + "name": "height", + "sample": "", + "type": "String", + "desc": "高度", + "defaultValue": "" + }, + { + "name": "fill", + "sample": "", + "type": "String", + "desc": "铺满", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/switch.json b/examples/docs/resources/pc/api/zh-CN/switch.json new file mode 100644 index 000000000..3f330cf90 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/switch.json @@ -0,0 +1,71 @@ +{ + "attrs": [ + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "是否禁用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "false-value", + "sample": "custom-true-false-value", + "type": "Boolean , String , Number", + "desc": "switch 关闭时的值", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "true-value", + "sample": "custom-true-false-value", + "type": "Boolean , String , Number", + "desc": "switch 打开时的值", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "show-text", + "sample": "custom-open-close", + "type": "Boolean", + "desc": "switch 是否显示内容里面的文字", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "mini", + "sample": "mini-mode", + "type": "Boolean", + "desc": "设置是否显示为 mini 模式。mini 模式下不会显示 slot 的内容。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "Boolean , String , Number", + "desc": "绑定值", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "open", + "sample": "custom-open-close", + "type": "", + "desc": "开启内容", + "defaultValue": "" + }, + { + "name": "close", + "sample": "custom-open-close", + "type": "", + "desc": "关闭内容", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "enent", + "type": "", + "desc": "switch发生变化的回调函数", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/tabs.json b/examples/docs/resources/pc/api/zh-CN/tabs.json new file mode 100644 index 000000000..f50bd439e --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/tabs.json @@ -0,0 +1,134 @@ +{ + "attrs": [ + { + "name": "tab-style", + "sample": "tab-style-card", + "type": "String", + "desc": "标签页样式;该属性的可选值为 card / border-card", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "为 popper 添加类名(可参考 popover 组件)", + "defaultValue": "" + }, + { + "name": "with-add", + "sample": "with-add", + "type": "Boolean", + "desc": "标签是否可增加", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "with-close", + "sample": "tabs-events-close", + "type": "Boolean", + "desc": "标签是否可关闭;标签是否可关闭", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "editable", + "sample": "tabs-events-add", + "type": "Boolean", + "desc": "标签是否同时可增加和关闭", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "show-more-tabs", + "sample": "with-add", + "type": "Boolean", + "desc": "当标签页超过一定宽度时将显示 更多 ,鼠标悬停到 更多 时,将显示超出宽度的标签页。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "String", + "desc": "绑定值,选中选项卡的 name", + "defaultValue": "该属性的默认值为 第一个选项卡的 name" + }, + { + "name": "position", + "sample": "position", + "type": "String", + "desc": "选项卡所在位置;该属性的可选值为 top/right/bottom/left", + "defaultValue": "该属性的默认值为 top" + }, + { + "name": "stretch", + "sample": "stretch-wh", + "type": "Boolean", + "desc": "标签的宽度是否自撑开", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "before-leave", + "sample": "before-leave", + "type": "Function(activeName, oldActiveName)", + "desc": "切换标签之前的钩子,若返回 false 或者返回 Promise 且被 reject,则阻止切换", + "defaultValue": "" + }, + { + "name": "active-name", + "sample": "tab-style-card", + "type": "String", + "desc": "激活当前页面", + "defaultValue": "" + }, + { + "name": "size", + "sample": "tab-style-card", + "type": "String", + "desc": "设置 tabs 标签页尺寸,当与 tabStyle 为 card 或者 border-card 时生效, 该属性可选值为 small", + "defaultValue": "" + }, + { + "name": "tooltip-config", + "sample": "position-left", + "type": "Object , String", + "desc": "设置文字超出提示, Object类型的值参考tooltip组件配置,如果想使用默认的title属性,可设置为String 类型,值为title,【3.8.0版本新增】", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "title", + "sample": "custom-tab-title", + "type": "", + "desc": "自定义titl内容", + "defaultValue": "" + } + ], + "events": [ + { + "name": "add", + "sample": "tabs-events-add", + "type": "Function()", + "desc": "增加tabitem时触发事件;点击 tabs 的新增按钮后触发;无arguments", + "defaultValue": "" + }, + { + "name": "click", + "sample": "tabs-events-click", + "type": "Function(arg1,arg2)", + "desc": "点击tabitem时触发事件;tab 被选中时触发;arguments: arg1:VueComponent 点击tab的compent对象信息, arg2:event ", + "defaultValue": "" + }, + { + "name": "close", + "sample": "tabs-events-close", + "type": "Function(arg)", + "desc": "删除tabitem时触发事件;点击 tab 移除按钮后触发;arguments: arg1:删除的tab名称", + "defaultValue": "" + }, + { + "name": "edit", + "sample": "tabs-events-edit", + "type": "Function(arg1,arg2)", + "desc": "点击 tabs 的新增按钮或 tab 被关闭后触发;arguments: arg1:null或删除的tab名称, arg2:'add' 或者 'remove'", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/tag.json b/examples/docs/resources/pc/api/zh-CN/tag.json new file mode 100644 index 000000000..2f1ee595b --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/tag.json @@ -0,0 +1,71 @@ +{ + "attrs": [ + { + "name": "hit", + "sample": "hit", + "type": "Boolean", + "desc": "是否有边框描边", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "closeable", + "sample": "create", + "type": "Boolean", + "desc": "是否可关闭", + "defaultValue": "" + }, + { + "name": "color", + "sample": "color3", + "type": "String", + "desc": "颜色,支持 rgb,rgba,hex 三种格式;背景色", + "defaultValue": "" + }, + { + "name": "type", + "sample": "effect", + "type": "String", + "desc": "显示类型;该属性的可选值为 success / info / warning / danger", + "defaultValue": "" + }, + { + "name": "size", + "sample": "tag-size", + "type": "String", + "desc": "尺寸;该属性的可选值为 medium / small / mini", + "defaultValue": "" + }, + { + "name": "effect", + "sample": "effect", + "type": "String", + "desc": "主题;该属性的可选值为 dark / light / plain", + "defaultValue": "该属性的默认值为 light" + } + ], + "slots": [ + { + "name": "default", + "sample": "effect", + "type": "", + "desc": "标签内容", + "defaultValue": "" + } + ], + "events": [ + { + "name": "close", + "sample": "tag-event-close", + "type": "Function(event)", + "desc": "关闭 Tag 时触发的事件;event: 原生事件", + "defaultValue": "" + }, + { + "name": "click", + "sample": "tag-event-click", + "type": "Function(value, vm)", + "desc": "点击 Tag 时触发的事件;event: 原生事件", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/text-popup.json b/examples/docs/resources/pc/api/zh-CN/text-popup.json new file mode 100644 index 000000000..8f25e995b --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/text-popup.json @@ -0,0 +1,39 @@ +{ + "attrs": [ + { + "name": "value", + "sample": "value", + "type": "String", + "desc": "绑定值", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "placeholder", + "type": "String", + "desc": "设置输入框内的提示占位文本", + "defaultValue": "" + }, + { + "name": "readonly", + "sample": "readonly", + "type": "Boolean", + "desc": "设置是否只读", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "width", + "sample": "width", + "type": "Number , String", + "desc": "设置宽度", + "defaultValue": "该属性的默认值为 150" + }, + { + "name": "separtor", + "sample": "separtor", + "type": "String", + "desc": "分隔符", + "defaultValue": "该属性的默认值为 ," + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/time-line.json b/examples/docs/resources/pc/api/zh-CN/time-line.json new file mode 100644 index 000000000..213efc191 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/time-line.json @@ -0,0 +1,113 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "basic-usage", + "type": "Array", + "desc": "设置时间线步骤条数据", + "defaultValue": "" + }, + { + "name": "vertical", + "sample": "vertical-step", + "type": "Boolean", + "desc": "竖式步骤条", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "horizontal", + "sample": "horizontal-step", + "type": "Boolean", + "desc": "是否为横向步骤条", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "show-number", + "sample": "show-number", + "type": "Boolean", + "desc": "设置未完成的状态是否显示序号", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "name-field", + "sample": "different-data", + "type": "String", + "desc": "设置节点信息中名称对应的字段名", + "defaultValue": "该属性的默认值为 name" + }, + { + "name": "time-field", + "sample": "different-data", + "type": "String", + "desc": "设置节点时间信息对应的字段名", + "defaultValue": "该属性的默认值为 time" + }, + { + "name": "start", + "sample": "set-start-value", + "type": "Number", + "desc": "设置步骤条序号起始值", + "defaultValue": "该属性的默认值为 1" + }, + { + "name": "space", + "sample": "set-step-width", + "type": "Number", + "desc": "设置步骤条的宽度", + "defaultValue": "" + }, + { + "name": "active", + "sample": "basic-usage", + "type": "Number", + "desc": "设置步骤条的选中步骤", + "defaultValue": "该属性的默认值为 -1" + }, + { + "name": "reverse", + "sample": "vertical-step-reverse", + "type": "Boolean", + "desc": "设置竖向步骤条的方向", + "defaultValue": "该属性的默认值为 false" + } + ], + "slots": [ + { + "name": "top", + "sample": "custom-normal-step", + "type": "", + "desc": "定义步骤条顶部", + "defaultValue": "" + }, + { + "name": "bottom", + "sample": "custom-normal-step", + "type": "", + "desc": "定义步骤条底部", + "defaultValue": "" + }, + { + "name": "left", + "sample": "custom-vertical-step", + "type": "", + "desc": "定义步骤条左侧内容", + "defaultValue": "" + }, + { + "name": "right", + "sample": "custom-vertical-step", + "type": "", + "desc": "定义步骤条右侧内容", + "defaultValue": "" + } + ], + "events": [ + { + "name": "click", + "sample": "vertical-step-reverse1", + "type": "Function(arg1,arg2)", + "desc": "节点的点击事件;arguments: arg1:点击节点的下标, arg2:{ name: 节点名称, time: 时间 }", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/time-picker-options.json b/examples/docs/resources/pc/api/zh-CN/time-picker-options.json new file mode 100644 index 000000000..799fc7b33 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/time-picker-options.json @@ -0,0 +1,18 @@ +{ + "attrs": [ + { + "name": "selectableRange", + "sample": "basic-usage", + "type": "String/Array", + "desc": "可选时间段,例如'18:30:00 - 20:30:00'或者传入数组['09:30:00 - 12:00:00', '14:30:00 - 18:30:00']", + "defaultValue": "" + }, + { + "name": "format", + "sample": "format", + "type": "String", + "desc": "时间格式化(TimePicker);该属性的可选值为 小时:HH,分:mm,秒:ss,AM/PM A", + "defaultValue": "该属性的默认值为 'HH:mm:ss'" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/time-picker.json b/examples/docs/resources/pc/api/zh-CN/time-picker.json new file mode 100644 index 000000000..2da442dbc --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/time-picker.json @@ -0,0 +1,162 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "date(DatePicker) / array(DateRangePicker)", + "desc": "日期选择器选中的日期值,可设置选择器的初始值", + "defaultValue": "" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "禁用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "editable", + "sample": "editable", + "type": "Boolean", + "desc": "文本框可输入", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "clearable", + "sample": "clearable", + "type": "Boolean", + "desc": "是否显示清除按钮", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "size", + "sample": "size-medium", + "type": "String", + "desc": "输入框尺寸;该属性的可选值为 medium,small, mini", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "basic-usage", + "type": "String", + "desc": "非范围选择时的占位内容", + "defaultValue": "该属性的默认值为空" + }, + { + "name": "start-placeholder", + "sample": "size-medium", + "type": "String", + "desc": "范围选择时开始日期的占位内容", + "defaultValue": "" + }, + { + "name": "end-placeholder", + "sample": "size-medium", + "type": "String", + "desc": "范围选择时结束日期的占位内容", + "defaultValue": "" + }, + { + "name": "is-range", + "sample": "is-range", + "type": "Boolean", + "desc": "是否为时间范围选择,仅对有效", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "arrow-control", + "sample": "clearable", + "type": "Boolean", + "desc": "是否使用箭头进行时间选择,仅对有效", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "popper-class", + "sample": "popper-class", + "type": "String", + "desc": "TimePicker 下拉框的 class 类名", + "defaultValue": "" + }, + { + "name": "picker-options", + "sample": "basic-usage1", + "type": "Object", + "desc": "当前时间日期选择器特有的选项参考下表", + "defaultValue": "该属性的默认值为 {}" + }, + { + "name": "range-separator", + "sample": "is-range", + "type": "String", + "desc": "选择范围时的分隔符", + "defaultValue": "该属性的默认值为 - " + }, + { + "name": "default-value", + "sample": "default-value", + "type": "Date", + "desc": "可选,当选中的日期值为空时,选择器面板打开时默认显示的时间,需设置为可被new Date()解析的值", + "defaultValue": "" + }, + { + "name": "name", + "sample": "name", + "type": "String", + "desc": "原生属性", + "defaultValue": "" + }, + { + "name": "suffix-icon", + "sample": "suffix-icon", + "type": "String", + "desc": "自定义头部图标的类名", + "defaultValue": "该自定后置图标, 该属性的默认值为 IconCalendar" + }, + { + "name": "clear-icon", + "sample": "clear-icon", + "type": "String", + "desc": "自定义清空图标", + "defaultValue": "该属性的默认值为 IconOperationfaild" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false", + "defaultValue": "该属性的默认值为 true" + } + ], + "methods": [ + { + "name": "focus", + "sample": "event-blur", + "type": "", + "desc": "使 input 获取焦点", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "event-blur", + "type": "Function(arg)", + "desc": "用户确认选定的值时触发;arg:{Date|Array 非范围选择时,是当前选定值的时间对象;范围选择时,是当前选定值的时间对象数组}", + "defaultValue": "" + }, + { + "name": "blur", + "sample": "event-blur", + "type": "Function(arg)", + "desc": "当 input 失去焦点时触发;arg:{Object 时间组件Vue对象}", + "defaultValue": "" + }, + { + "name": "focus", + "sample": "event-blur", + "type": "Function(arg)", + "desc": "当 input 获得焦点时触发;arg:{Object 时间组件Vue对象}", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/time-select-options.json b/examples/docs/resources/pc/api/zh-CN/time-select-options.json new file mode 100644 index 000000000..304e932fa --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/time-select-options.json @@ -0,0 +1,39 @@ +{ + "attrs": [ + { + "name": "start", + "sample": "picker-options", + "type": "String", + "desc": "开始时间", + "defaultValue": "该属性的默认值为 9:00" + }, + { + "name": "end", + "sample": "picker-options", + "type": "String", + "desc": "结束时间", + "defaultValue": "该属性的默认值为 18:00" + }, + { + "name": "step", + "sample": "picker-options", + "type": "String", + "desc": "间隔时间", + "defaultValue": "该属性的默认值为 00:30" + }, + { + "name": "minTime", + "sample": "picker-options", + "type": "String", + "desc": "最小时间,小于该时间的时间段将被禁用", + "defaultValue": "该属性的默认值为 00:00" + }, + { + "name": "maxTime", + "sample": "picker-options", + "type": "String", + "desc": "最大时间,大于该时间的时间段将被禁用", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/time-select.json b/examples/docs/resources/pc/api/zh-CN/time-select.json new file mode 100644 index 000000000..463909e3e --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/time-select.json @@ -0,0 +1,127 @@ +{ + "attrs": [ + { + "name": "modelValue / v-model", + "sample": "basic-usage", + "type": "date(DatePicker) / array(DateRangePicker)", + "desc": "绑定值", + "defaultValue": "日期选择器选中的日期值,可设置选择器的初始值" + }, + { + "name": "disabled", + "sample": "disabled", + "type": "Boolean", + "desc": "禁用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "editable", + "sample": "basic-usage", + "type": "Boolean", + "desc": "文本框可输入", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "clearable", + "sample": "clear-icon", + "type": "Boolean", + "desc": "是否显示清除按钮", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "size", + "sample": "size-mini", + "type": "String", + "desc": "输入框尺寸;该属性的可选值为 medium,small, mini", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "basic-usage", + "type": "String", + "desc": "非范围选择时的占位内容", + "defaultValue": "该属性的默认值为空" + }, + { + "name": "popper-class", + "sample": "popper-class", + "type": "String", + "desc": "TimePicker 下拉框的 class 类名", + "defaultValue": "" + }, + { + "name": "picker-options", + "sample": "picker-options", + "type": "Object", + "desc": "当前时间日期选择器特有的选项参考下表", + "defaultValue": "该属性的默认值为 {}" + }, + { + "name": "default-value", + "sample": "default-value", + "type": "Date", + "desc": "可选,当选中的日期值为空时,选择器面板打开时默认显示的时间,需设置为可被new Date()解析的值", + "defaultValue": "" + }, + { + "name": "name", + "sample": "name", + "type": "String", + "desc": "原生属性", + "defaultValue": "" + }, + { + "name": "suffix-icon", + "sample": "suffix-icon", + "type": "String", + "desc": "自定义头部图标", + "defaultValue": "该自定后置图标,该属性的默认值为 IconCalendar" + }, + { + "name": "clear-icon", + "sample": "clear-icon", + "type": "String", + "desc": "自定义清空图标", + "defaultValue": "该属性的默认值为 IconOperationfaild" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false", + "defaultValue": "该属性的默认值为 true" + } + ], + "methods": [ + { + "name": "focus", + "sample": "focus", + "type": "", + "desc": "使 input 获取焦点", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "event-blur", + "type": "", + "desc": "用户确认选定的值时触发", + "defaultValue": "" + }, + { + "name": "blur", + "sample": "event-blur", + "type": "", + "desc": "当 input 失去焦点时触发", + "defaultValue": "" + }, + { + "name": "focus", + "sample": "event-blur", + "type": "", + "desc": "当 input 获得焦点时触发", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/toggle-menu.json b/examples/docs/resources/pc/api/zh-CN/toggle-menu.json new file mode 100644 index 000000000..f1fffacd3 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/toggle-menu.json @@ -0,0 +1,169 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "basic-usage", + "type": "Array", + "desc": "设置收缩菜单的数据。", + "defaultValue": "" + }, + { + "name": "dragable", + "sample": "dragable", + "type": "Boolean", + "desc": "设置是否开启拖拽节点的功能,默认值为 `false`", + "defaultValue": "" + }, + { + "name": "show-filter", + "sample": "show-filter", + "type": "Boolean", + "desc": "设置是否展示过滤搜索框,默认为 `true`。", + "defaultValue": "" + }, + { + "name": "icon", + "sample": "custom-icon", + "type": "Object", + "desc": "自定义菜单左侧图标。", + "defaultValue": "" + }, + { + "name": "default-expand-all", + "sample": "default-expand-all", + "type": "Boolean", + "desc": "设置菜单默认是否展开所有节点,默认为 false 。", + "defaultValue": "" + }, + { + "name": "expand-on-click-node", + "sample": "default-expand-all", + "type": "Boolean", + "desc": "设置是否可以通过点击节点展开/收起菜单,默认为 false。", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "show-filter", + "type": "String", + "desc": "输入框占位符。", + "defaultValue": "" + }, + { + "name": "ellipsis", + "sample": "dragable", + "type": "Boolean", + "desc": "菜单内容超长时省略显示,默认为 false 。", + "defaultValue": "" + }, + { + "name": "wrap", + "sample": "show-filter", + "type": "Boolean", + "desc": "菜单内容超长时换行显示,默认为 false 。", + "defaultValue": "" + }, + { + "name": "automatic-filtering", + "sample": "automatic-filtering", + "type": "Boolean", + "desc": "输入框输入内容时是否自动过滤内容,默认是 true 。", + "defaultValue": "" + }, + { + "name": "props", + "sample": "toggle-props", + "type": "Object", + "desc": "配置数据选项的映射字段名称", + "defaultValue": "该属性的默认值为 {children: 'children',label: 'label',disabled: 'disabled'}" + }, + { + "name": "get-menu-data-sync", + "sample": "get-menu-data-sync", + "type": "Function", + "desc": "自定义菜单数据服务,直接返回数据(deprecated v3.4.0废弃, v3.16.0移除;移除原因:如果是同步数据则和:data功能重复)", + "defaultValue": "" + }, + { + "name": "get-menu-data-async", + "sample": "get-menu-data-aync", + "type": "Function", + "desc": "自定义菜单数据服务,返回异步数据,需返回Promise对象", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "node", + "sample": "toggle-props", + "type": "", + "desc": "自定义插槽", + "defaultValue": "" + } + ], + "events": [ + { + "name": "node-click", + "sample": "node-click", + "type": "Function(arg1,arg2)", + "desc": "点击节点后的事件。;点击节点后触发的回调函数;//参数arg1:\n{children: 点击节点的子节点, id: 点击节点的id ,label: 点击节点的title} \n//参数arg2:\n Object 当前点击节点的数据信息对象 ", + "defaultValue": "" + }, + { + "name": "node-expand", + "sample": "node-expand", + "type": "Function(arg1,arg2,arg3)", + "desc": "展开节点后的事件。;节点被展开时触发的事件;//参数arg1:\n{children: 点击节点的子节点, id: 点击节点的id, label: 点击节点的title}\n//参数arg2:\nVueComponent 点击节点的componet对象信息\n//参数arg3:\n{ children: 点击节点的子节点id: 点击节点的id, label: 点击节点的title}", + "defaultValue": "" + }, + { + "name": "node-collapse", + "sample": "node-collapse", + "type": "Function(arg1,arg2)", + "desc": "收缩节点后的事件。;节点被关闭时触发的事件;//参数arg1:Object \n{children: 点击节点的子节点,id: 点击节点的id,label: 点击节点的title}\n//参数arg2:Object 当前点击节点的数据信息对象", + "defaultValue": "" + }, + { + "name": "node-drag-start", + "sample": "drag-events", + "type": "Function(arg1,arg2)", + "desc": "节点开始拖拽时触发的事件。;节点开始拖拽时触发的事件。;//参数: \narg1:Object 当前拖拽节点的数据信息对象\narg2:event ", + "defaultValue": "" + }, + { + "name": "node-drag-enter", + "sample": "drag-events", + "type": "Function(arg1,arg2)", + "desc": "拖拽进入其他节点时触发的事件;拖拽进入其他节点时触发的事件;//参数\narg1:Object 当前拖拽节点的数据信息对象\narg2: Object 当前点击节点拖拽后位置的节点数据信息对象", + "defaultValue": "" + }, + { + "name": "node-drag-leave", + "sample": "drag-events", + "type": "Function(arg1,arg2)", + "desc": "拖拽离开某个节点时触发的事件;拖拽离开某个节点时触发的事件;//参数\narg1:Object 当前拖拽节点的数据信息对象\narg2: Object 当前拖出后节点的数据信息对象", + "defaultValue": "" + }, + { + "name": "node-drag-over", + "sample": "drag-events", + "type": "Function(arg1,arg2,arg3)", + "desc": "在拖拽节点时触发的事件(类似浏览器的 mouseover 事件);在拖拽节点时触发的事件(类似浏览器的 mouseover 事件);//参数\narg1:Object 当前拖拽节点的数据信息对象\narg2:Object 当前拖拽节点拖拽时节点的数据信息对象\n arg3:event ", + "defaultValue": "" + }, + { + "name": "node-drag-end", + "sample": "drag-events", + "type": "Function(arg1,arg2,arg3,arg4)", + "desc": "拖拽结束时(r可能未成功)触发的事件;拖拽成功完成时触发的事件;//参数\narg1: Object当前拖拽节点的数据信息对象\narg2: Object当前点击节点拖拽后位置的节点数据信息对象\narg3: 拖拽的类型,如:'inner'\narg4:event ", + "defaultValue": "" + }, + { + "name": "node-drop", + "sample": "node-drop", + "type": "Function(arg1,arg2)", + "desc": "拖放节点后的事件。开启 dragable 属性为 true 有效。;拖放节点后的事件。开启 dragable 属性为 true 有效。;//参数\narg1:Object 当前拖拽节点的数据信息对象\n arg2:Object 当前点击节点拖拽后的位置节点的数据信息对象\narg3: 拖拽的类型\narg4:event ", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/tooltip.json b/examples/docs/resources/pc/api/zh-CN/tooltip.json new file mode 100644 index 000000000..f4f10fe7c --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/tooltip.json @@ -0,0 +1,146 @@ +{ + "attrs": [ + { + "name": "effect", + "sample": "tooltip-theme", + "type": "String", + "desc": "默认提供的主题;该属性的可选值为 dark/light", + "defaultValue": "该属性的默认值为 dark" + }, + { + "name": "content", + "sample": "basic-usage", + "type": "String", + "desc": "显示的内容,也可以通过 slot#content 传入 DOM", + "defaultValue": "" + }, + { + "name": "append-to-body", + "sample": "", + "type": "Boolean", + "desc": "是否添加到body上", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "placement", + "sample": "basic-usage", + "type": "String", + "desc": "Tooltip 的出现位置;该属性的可选值为 top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end", + "defaultValue": "该属性的默认值为 bottom" + }, + { + "name": "modelValue / v-model", + "sample": "manual-control-tip", + "type": "Boolean", + "desc": "状态是否可见", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "Tooltip 是否可用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "offset", + "sample": "tooltip-offset", + "type": "Number", + "desc": "出现位置的偏移量", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "transition", + "sample": "custom-transition", + "type": "String", + "desc": "定义渐变动画", + "defaultValue": "该属性的默认值为 tiny-fade-in-linear" + }, + { + "name": "visible-arrow", + "sample": "visible-arrow", + "type": "Boolean", + "desc": "是否显示 Tooltip 箭头,popper.js 的参数", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "popper-options", + "sample": "popper-options", + "type": "Object", + "desc": "popper.js 的参数;该属性的可选值为 参考 popper.js 文档", + "defaultValue": "该属性的默认值为 { boundariesCBG XUI: 'body', gpuAcceleration: false }" + }, + { + "name": "open-delay", + "sample": "open-delay", + "type": "Number", + "desc": "延迟出现,单位毫秒", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "manual", + "sample": "manual-control-tip", + "type": "Boolean", + "desc": "手动控制模式,设置为 true 后,mouseenter 和 mouseleave 事件将不会生效", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "visible", + "sample": "visible-show", + "type": "String", + "desc": "提示的智能出现的模式;该属性的可选值为 auto/always", + "defaultValue": "该属性的默认值为 always" + }, + { + "name": "popper-class", + "sample": "popper-class", + "type": "String", + "desc": "为 Tooltip 的 popper 添加类名", + "defaultValue": "" + }, + { + "name": "enterable", + "sample": "enterable", + "type": "Boolean", + "desc": "鼠标是否可进入到 tooltip 中", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "hide-after", + "sample": "open-delay", + "type": "Number", + "desc": "Tooltip 出现后自动隐藏延时,单位毫秒,为 0 则不会自动隐藏", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "tabindex", + "sample": "tabindex", + "type": "Number", + "desc": "配置该元素,配置的属性会自动添加到该组件的触发原上", + "defaultValue": "" + }, + { + "name": "renderContent", + "sample": "tooltip-render-content", + "type": "Function(arg1,arg2)", + "desc": "自定义渲染函数,返回需要渲染的节点内容 arg1:Vue的渲染函数h arg2:传递给组件的content文本", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "tooltip-content", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + }, + { + "name": "content", + "sample": "tooltip-content", + "type": "", + "desc": "内容", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/top-box.json b/examples/docs/resources/pc/api/zh-CN/top-box.json new file mode 100644 index 000000000..9e26dfeeb --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/top-box.json @@ -0,0 +1 @@ +{} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/transfer.json b/examples/docs/resources/pc/api/zh-CN/transfer.json new file mode 100644 index 000000000..6be53c3ff --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/transfer.json @@ -0,0 +1,241 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "data-source", + "type": "Array", + "desc": "Transfer 的数据源", + "defaultValue": "" + }, + { + "name": "modelValue / v-model", + "sample": "data-source", + "type": "Array", + "desc": "绑定值", + "defaultValue": "" + }, + { + "name": "filterable", + "sample": "filterable", + "type": "Boolean", + "desc": "是否可搜索", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "filter-placeholder", + "sample": "filter-placeholder", + "type": "String", + "desc": "搜索框占位符", + "defaultValue": "该属性的默认值为 请输入搜索内容" + }, + { + "name": "filter-method", + "sample": "custom-filter-method", + "type": "Function(arg1,arg2)", + "desc": "设置穿梭框的搜索过滤字段, 此属性只在渲染类型(renderType)为 table 时生效;// 自定义搜索方法参数 \narg1:String 输入的过滤字串\narg2:Object 每一个数据项", + "defaultValue": "" + }, + { + "name": "titles", + "sample": "custom-transfer-titles", + "type": "Array", + "desc": "自定义列表标题", + "defaultValue": "该属性的默认值为 ['列表 1', '列表 2']" + }, + { + "name": "button-texts", + "sample": "custom-button-texts", + "type": "Array", + "desc": "自定义按钮文案", + "defaultValue": "该属性的默认值为 []" + }, + { + "name": "render-content", + "sample": "custom-render-content", + "type": "Function(arg1,arg2)", + "desc": "自定义数据项渲染函数;arg1:{Function 创建虚拟节点的函数},arg2:{Object 数据项}", + "defaultValue": "" + }, + { + "name": "format", + "sample": "checked-format-text", + "type": "Object", + "desc": "列表顶部勾选状态文案", + "defaultValue": "该属性的默认值为 { noChecked: '${checked}/${total}', hasChecked: '${checked}/${total}' }" + }, + { + "name": "props", + "sample": "props-of-data-source", + "type": "Object", + "desc": "数据源的字段别名", + "defaultValue": "" + }, + { + "name": "left-default-checked", + "sample": "default-checked", + "type": "Array", + "desc": "初始状态下左侧列表的已勾选项的 key 数组", + "defaultValue": "该属性的默认值为 []" + }, + { + "name": "right-default-checked", + "sample": "default-checked", + "type": "Array", + "desc": "初始状态下右侧列表的已勾选项的 key 数组", + "defaultValue": "该属性的默认值为 []" + }, + { + "name": "target-order", + "sample": "target-order", + "type": "String", + "desc": "右侧列表元素的排序策略:若为 original,则保持与数据源相同的顺序;若为 push,则新加入的元素排在最后;若为 unshift,则新加入的元素排在最前;该属性的可选值为 original / push / unshift", + "defaultValue": "该属性的默认值为 original" + }, + { + "name": "to-left-disable", + "sample": "data-source", + "type": "Boolean", + "desc": "提供给用户控制穿梭框按钮禁用状态的属性,组件初始化状态下未选中时显示禁用状态,默认值为true", + "defaultValue": "" + }, + { + "name": "to-right-disable", + "sample": "data-source", + "type": "Boolean", + "desc": "提供给用户控制穿梭框按钮禁用状态的属性,组件初始化状态下未选中时显示禁用状态,默认值为true", + "defaultValue": "" + }, + { + "name": "show-all-btn", + "sample": "show-all-btn", + "type": "Boolean", + "desc": "展示全部移动按钮", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "drop-config", + "sample": "drop-config", + "type": "Object", + "desc": "设置穿梭框列表项可拖拽", + "defaultValue": "" + }, + { + "name": "columns", + "sample": "nested-table", + "type": "Array", + "desc": "设置穿梭框的表格列配置, 此属性只在渲染类型(renderType)为 table 时生效;设置穿梭框的表格列配置, 此属性只在渲染类型(renderType)为 grid 时生效", + "defaultValue": "" + }, + { + "name": "page-vo", + "sample": "nested-table", + "type": "Object", + "desc": "设置分页配置,此属性只在渲染类型为 grid 时生效,需要与 pager-op 一起使用", + "defaultValue": "该属性的默认值为 {currentPage:1,pageSize:10}" + }, + { + "name": "show-pager", + "sample": "nested-table", + "type": "Boolean", + "desc": "设置是否显示分页,当渲染为表格时有效", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "pager-op", + "sample": "nested-table", + "type": "Object", + "desc": "设置分页配置,当渲染为表格时有效", + "defaultValue": "该属性的默认值为 {mode: 'fixed',pageVO: {currentPage: 1,pageSize: 10}" + }, + { + "name": "render", + "sample": "nested-table", + "type": "Object", + "desc": "当plugin设置为Table时设置渲染为表格;当plugin设置为Tree渲染为树", + "defaultValue": "" + }, + { + "name": "tree-op", + "sample": "nested-tree", + "type": "Object", + "desc": "当plugin设置为Tree渲染为树时,设置树的相关配置属性", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "left-footer", + "sample": "custom-footer", + "type": "", + "desc": "左侧列表底部的内容", + "defaultValue": "" + }, + { + "name": "right-footer", + "sample": "custom-footer", + "type": "", + "desc": "右侧列表底部的内容", + "defaultValue": "" + }, + { + "name": "button", + "sample": "panel-slot", + "type": "", + "desc": "自定义穿梭按钮", + "defaultValue": "" + }, + { + "name": "default", + "sample": "custom-render-content", + "type": "", + "desc": "自定义数据项的内容,参数为 { option }", + "defaultValue": "" + }, + { + "name": "leftPanel", + "sample": "", + "type": "", + "desc": "左侧自定义内容", + "defaultValue": "" + }, + { + "name": "rightPanel", + "sample": "", + "type": "", + "desc": "右侧自定义内容", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "clearQuery", + "sample": "manual-clear-query", + "type": "", + "desc": "清空某个面板的搜索关键词", + "defaultValue": "" + } + ], + "events": [ + { + "name": "change", + "sample": "transfer-events", + "type": "Function(arg1,arg2,arg3)", + "desc": "右侧列表元素变化时触发;//参数arg1:Array 穿梭框右侧数据值列表\n//参数arg2:String 数据移动方向,是left或者right\n//参数arg3:Array 被移动的数据值列表", + "defaultValue": "" + }, + { + "name": "left-check-change", + "sample": "transfer-events", + "type": "Function(arg1,arg2)", + "desc": "左侧列表元素被用户选中 / 取消选中时触发;//参数arg1:Array 穿梭框左侧被选中的数据值列表\n//参数arg2:Array 穿梭框左侧选中状态发生变化的数据值列表", + "defaultValue": "" + }, + { + "name": "right-check-change", + "sample": "transfer-events", + "type": "Function(arg1,arg2)", + "desc": "右侧列表元素被用户选中 / 取消选中时触发;//参数arg1:Array 穿梭框右侧被选中的数据值列表\n//参数arg2:Array 穿梭框右侧选中状态发生变化的数据值列表", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/tree-menu.json b/examples/docs/resources/pc/api/zh-CN/tree-menu.json new file mode 100644 index 000000000..06dd6cff2 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/tree-menu.json @@ -0,0 +1,232 @@ +{ + "attrs": [ + { + "name": "accordion", + "sample": "accordion", + "type": "Boolean", + "desc": "是否展示手风琴效果,默认值为 false", + "defaultValue": "" + }, + { + "name": "allow-drag", + "sample": "", + "type": "Function(params)", + "desc": "拖拽菜单回调事件,需配置draggable使用,return false(阻止拖动),true(允许拖动);params1:拖拽的节点数据信息对象", + "defaultValue": "" + }, + { + "name": "allow-drop", + "sample": "", + "type": "Function(params1,params2,params3)", + "desc": "拖拽菜单回调事件,需配置draggable使用,return false(阻止拖放),true(允许拖放);//params1:Object 拖拽的节点数据信息对象\n//params2:Object 拖拽的节点数据信息对象\n//params3:'prev'或者'inner'或者'next'", + "defaultValue": "" + }, + { + "name": "show-title", + "sample": "text-wrap", + "type": "Boolean", + "desc": "是否显示节点的 title 提示,鼠标悬浮节点之上触发。", + "defaultValue": "" + }, + { + "name": "show-filter", + "sample": "text-wrap", + "type": "Boolean", + "desc": "是否开启输入框进行输入筛选节点,默认值为 true", + "defaultValue": "" + }, + { + "name": "data", + "sample": "data-resource", + "type": "Array", + "desc": "展示数据", + "defaultValue": "" + }, + { + "name": "empty-text", + "sample": "empty-text", + "type": "String", + "desc": "内容为空的时候展示的文本", + "defaultValue": "" + }, + { + "name": "filter-node-method", + "sample": "filter-node-method", + "type": "Function(value, data, node)", + "desc": "对树节点进行筛选时执行的方法,返回 true 表示这个节点可以显示,返回 false 则表示这个节点会被隐藏", + "defaultValue": "" + }, + { + "name": "expand-on-click-node", + "sample": "expand-on-click-node", + "type": "", + "desc": "配置点击菜单文字是否能展开菜单", + "defaultValue": "" + }, + { + "name": "ellipsis", + "sample": "text-ellipsis", + "type": "Boolean", + "desc": "是否省略显示。优先级高于wrap。配置为 true,节点文字显示需要的宽度超过容器的宽度,节点文字不换行,也不会出现横向滚动条,超出部分文字显示为'...'", + "defaultValue": "" + }, + { + "name": "indent", + "sample": "tree-menu-indent", + "type": "Number", + "desc": "相邻级节点间的水平缩进,单位为像素", + "defaultValue": "" + }, + { + "name": "default-expand-all", + "sample": "default-expand-all", + "type": "", + "desc": "初始化展开所有子节点", + "defaultValue": "" + }, + { + "name": "draggable", + "sample": "can-draggable", + "type": "", + "desc": "拖动菜单", + "defaultValue": "" + }, + { + "name": "wrap", + "sample": "text-wrap", + "type": "Boolean", + "desc": "是否换行显示。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "default-expanded-keys", + "sample": "default-expanded-keys", + "type": "Array", + "desc": "默认展开的节点的 key 的数组", + "defaultValue": "" + }, + { + "name": "node-key", + "sample": "default-expand-all", + "type": "String", + "desc": "每个树节点用来作为唯一标识的属性,整棵树应该是唯一的", + "defaultValue": "" + }, + { + "name": "prefix-icon", + "sample": "text-ellipsis", + "type": "Object", + "desc": "自定义前置图标。", + "defaultValue": "" + }, + { + "name": "search-icon", + "sample": "search-icon", + "type": "Object", + "desc": "自定义搜索图标。", + "defaultValue": "" + }, + { + "name": "check-strictly", + "sample": "check-strictly", + "type": "Boolean", + "desc": "在显示复选框的情况下,是否严格的遵循父子不互相关联的做法,默认为 false, 需要与 show-checkbox 一起使用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "lazy", + "sample": "lazy-load", + "type": "Boolean", + "desc": "是否懒加载子节点,需与 load 方法结合使用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "load", + "sample": "lazy-load", + "type": "Function(node, resolve)", + "desc": "加载子树数据的方法,仅当 lazy 属性为true 时生效", + "defaultValue": "" + }, + { + "name": "show-checkbox", + "sample": "check-strictly", + "type": "Boolean", + "desc": "节点是否可被选择", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "default-checked-keys", + "sample": "default-expand-all", + "type": "Array", + "desc": "默认勾选的节点的 key 的数组", + "defaultValue": "" + }, + { + "name": "get-menu-data-sync", + "sample": "get-menu-data-sync", + "type": "Function", + "desc": "自定义菜单数据服务,返回一个Promise对象。", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "tree-menu-slot", + "type": "", + "desc": "自定义树节点的内容,参数为 { node, data }", + "defaultValue": "" + } + ], + "events": [ + { + "name": "node-click", + "sample": "event-current-change", + "type": "Function(arg1,arg2)", + "desc": "节点被点击时的回调;//参数: arg1:Object \n{ children: 点击节点的子节点, id: 点击节点的id, label: 点击节点的title }\n// arg2:Object // 当前点击节点的数据信息对象", + "defaultValue": "" + }, + { + "name": "current-change", + "sample": "event-current-change", + "type": "Function(arg1,arg2)", + "desc": "当前选中节点变化时触发的事件;//参数: arg1:Object \n{ children: 点击节点的子节点, id: 点击节点的id, label: 点击节点的title }\n// arg2:Object // 当前点击节点的数据信息对象", + "defaultValue": "" + }, + { + "name": "node-expand", + "sample": "event-node-expand", + "type": "Function(arg1,arg2)", + "desc": "节点被展开时触发的事件;//参数: arg1:Object \n{ children: 点击节点的子节点, id: 点击节点的id, label: 点击节点的title }\n// arg2:Object // 当前点击节点的数据信息对象", + "defaultValue": "" + }, + { + "name": "node-collapse", + "sample": "event-node-collapse", + "type": "Function(arg1,arg2)", + "desc": "节点被关闭时触发的事件;//参数: arg1:Object \n{ children: 点击节点的子节点, id: 点击节点的id, label: 点击节点的title }\n// arg2:Object // 当前点击节点的数据信息对象", + "defaultValue": "" + }, + { + "name": "check-change", + "sample": "event-check-change", + "type": "Function(arg1,arg2,arg3)", + "desc": "节点选中状态发生变化时的回调;//参数: arg1:Object \n{ children: 点击节点的子节点, id: 点击节点的id, label: 点击节点的title }\n// arg2:Boolean // 当前点击节点的勾选状态\n // arg3:Boolean // 当前点击节点之前的勾选状态", + "defaultValue": "" + }, + { + "name": "node-drag-start", + "sample": "event-allow-draggable", + "type": "Function(node, event)", + "desc": "节点开始拖拽时触发的事件;节点开始拖拽时触发的事件;node: 拖拽节点,event: 原生事件", + "defaultValue": "" + }, + { + "name": "node-drag-end", + "sample": "event-allow-draggable", + "type": "Function(draggingNode, targetNode, dropType, event)", + "desc": "拖拽结束时(可能未成功)触发的事件;//参数\n{draggingNode: 拖拽节点,targetNode: 目标节点,dropType: 拖拽类型, //拖拽节点在目标节点对应关系(before/after/inner/none)\nevent: 原生事件}", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/tree-node.json b/examples/docs/resources/pc/api/zh-CN/tree-node.json new file mode 100644 index 000000000..9e26dfeeb --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/tree-node.json @@ -0,0 +1 @@ +{} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/tree.json b/examples/docs/resources/pc/api/zh-CN/tree.json new file mode 100644 index 000000000..621ee0e07 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/tree.json @@ -0,0 +1,444 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "data-source", + "type": "Array", + "desc": "设置数据源。可配置静态数据源和动态数据源。;展示数据", + "defaultValue": "" + }, + { + "name": "expand-icon", + "sample": "set-tree-icon", + "type": "Object", + "desc": "指示展开的图标", + "defaultValue": "" + }, + { + "name": "icon-trigger-click-node", + "sample": "check-on-click-node", + "type": "Boolean", + "desc": "点击图标展开节点时是否触发 node-click 事件", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "show-contextmenu", + "sample": "contextmenu", + "type": "Boolean", + "desc": "右键点击节点是否弹窗自定义菜单,默认值为 false", + "defaultValue": "" + }, + { + "name": "shrink-icon", + "sample": "set-tree-icon", + "type": "Object", + "desc": "指示收缩的图标", + "defaultValue": "" + }, + { + "name": "empty-text", + "sample": "custom-empty-text", + "type": "String", + "desc": "内容为空的时候展示的文本", + "defaultValue": "" + }, + { + "name": "render-after-expand", + "sample": "render-after-expand", + "type": "Boolean", + "desc": "是否在第一次展开某个树节点后才渲染其子节点", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "node-key", + "sample": "node-key", + "type": "String", + "desc": "节点唯一标识属性名称。;每个树节点用来作为唯一标识的属性,整棵树应该是唯一的", + "defaultValue": "" + }, + { + "name": "check-strictly", + "sample": "check-strictly", + "type": "Boolean", + "desc": "在显示复选框的情况下,是否严格的遵循父子不互相关联的做法,默认为 false", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "default-expand-all", + "sample": "default-expand-all", + "type": "Boolean", + "desc": "是否默认展开所有节点", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "expand-on-click-node", + "sample": "expand-on-click-node", + "type": "Boolean", + "desc": "点击节点展开收起开关。当设置为true: 点击节点内容时可展开/收起节点。设置为false: 只有点击节点名称前面的展开/收起图标才能进行节点展开/收起。;是否在点击节点的时候展开或者收缩节点, 默认值为 true,如果为 false,则只有点箭头图标的时候才会展开或者收缩节点。", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "check-on-click-node", + "sample": "check-on-click-node", + "type": "Boolean", + "desc": "是否在点击节点的时候选中节点,默认值为 false,即只有在点击复选框时才会选中节点。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "auto-expand-parent", + "sample": "auto-expand-parent", + "type": "Boolean", + "desc": "展开子节点的时候是否自动展开父节点", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "default-checked-keys", + "sample": "default-checked-keys", + "type": "Array", + "desc": "配置默认选中。取值为 key 在数据源 dataset 中所对应的值。组件生成后会默认将 defaultValue 中所对应的节点选中。;默认勾选的节点的 key 的数组", + "defaultValue": "" + }, + { + "name": "default-expanded-keys", + "sample": "default-expanded-keys", + "type": "Array", + "desc": "默认展开的节点的 key 的数组", + "defaultValue": "" + }, + { + "name": "render-content", + "sample": "render-content", + "type": "Function(h, { node, data, store }", + "desc": "树节点的内容区的渲染 Function", + "defaultValue": "" + }, + { + "name": "show-checkbox", + "sample": "show-checkbox", + "type": "Boolean", + "desc": "节点是否可被选择", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "draggable", + "sample": "node-draggable", + "type": "Boolean", + "desc": "是否开启节点拖拽,节点的位置可任意拖放,改变原来的节点的父子结构。;是否开启拖拽节点功能", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "allow-drag", + "sample": "allow-drag", + "type": "Function(node)", + "desc": "判断节点能否被拖拽", + "defaultValue": "" + }, + { + "name": "allow-drop", + "sample": "allow-drop", + "type": "Function(draggingNode, dropNode, type)", + "desc": "拖拽时判定目标节点能否被放置。type 参数有三种情况:'prev'、'inner' 和 'next',分别表示放置在目标节点前、插入至目标节点和放置在目标节点后", + "defaultValue": "" + }, + { + "name": "props", + "sample": "node-props-config", + "type": "Object", + "desc": "配置选项,具体看下表", + "defaultValue": "该属性的默认值为 {children: 'children',label: 'label',disabled: 'disabled'}" + }, + { + "name": "highlight-current", + "sample": "highlight-current", + "type": "Boolean", + "desc": "是否高亮当前选中节点", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "lazy", + "sample": "lazy-load-node", + "type": "Boolean", + "desc": "异步加载模式,展开节点时再请求数据。需要服务支持。;是否懒加载子节点,需与 load 方法结合使用", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "load", + "sample": "lazy-load-node", + "type": "Function(node, resolve)", + "desc": "加载子树数据的方法,仅当 lazy 属性为true 时生效", + "defaultValue": "" + }, + { + "name": "filter-node-method", + "sample": "filter-node", + "type": "Function(value, data, node)", + "desc": "指定输入筛选时匹配的节点的字段值。showFilter 为 false时无效。;对树节点进行筛选时执行的方法,返回 true 表示这个节点可以显示,返回 false 则表示这个节点会被隐藏", + "defaultValue": "" + }, + { + "name": "accordion", + "sample": "accordion-mode", + "type": "Boolean", + "desc": "是否为单一路径。为 true 时,全部层级的节点同级互斥,为数字时,不大于该值的节点同级互斥。;是否每次只打开一个同级树节点展开", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "indent", + "sample": "indent", + "type": "Number", + "desc": "相邻级节点间的水平缩进,单位为像素", + "defaultValue": "该属性的默认值为 18" + }, + { + "name": "icon", + "sample": "custom-node-icon", + "type": "Object", + "desc": "自定义图标。css : String(图标的总样式名),child : String(叶子节点图标),parent : String(父节点图标,open 打开,close,关闭),expand : String(展开节点图标),collapse : String(收缩节点图标);自定义树节点的图标", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "slot-deffault", + "type": "", + "desc": "自定义树节点的内容,参数为 { node, data }", + "defaultValue": "" + }, + { + "name": "empty", + "sample": "custom-empty-text", + "type": "", + "desc": "自定义空数据文本", + "defaultValue": "" + } + ], + "methods": [ + { + "name": "filter", + "sample": "filter-node", + "type": "(value) => void", + "desc": "对树节点进行筛选操作", + "defaultValue": "" + }, + { + "name": "updateKeyChildren", + "sample": "show-checkbox", + "type": "(key, data) => void", + "desc": "通过 keys 设置节点子元素,使用此方法必须设置 node-key 属性", + "defaultValue": "" + }, + { + "name": "getCheckedNodes", + "sample": "check-on-click-node", + "type": "(leafOnly, includeHalfChecked) => result", + "desc": "获取选中标识的数据。;若节点可被选择(即 show-checkbox 为 true),则返回目前被选中的节点所组成的数组,仅配置多选时生效", + "defaultValue": "" + }, + { + "name": "setCheckedNodes", + "sample": "show-checkbox", + "type": "(keys, leafOnly) => void", + "desc": "设置目前勾选的节点,使用此方法必须设置 node-key 属性", + "defaultValue": "" + }, + { + "name": "getCheckedKeys", + "sample": "check-on-click-node", + "type": "(leafOnly) => result", + "desc": "若节点可被选择(即 show-checkbox 为 true),则返回目前被选中的节点的 key 所组成的数组, 仅配置多选时生效", + "defaultValue": "" + }, + { + "name": "setCheckedKeys", + "sample": "show-checkbox", + "type": "(keys, leafOnly) => void", + "desc": "通过 keys 设置目前勾选的节点,使用此方法必须设置 node-key 属性", + "defaultValue": "" + }, + { + "name": "setChecked", + "sample": "show-checkbox", + "type": "(data,checked,deep) => void", + "desc": "通过 key / data 设置某个节点的勾选状态,使用此方法必须设置 node-key 属性。通过第3个参数,可以递归设置所有子节点的勾选状态!", + "defaultValue": "" + }, + { + "name": "closeMenu", + "sample": "contextmenu", + "type": "() => void", + "desc": "关闭右键点击节点弹窗自定义菜单", + "defaultValue": "" + }, + { + "name": "getHalfCheckedNodes", + "sample": "check-on-click-node", + "type": "() => result", + "desc": "若节点可被选择(即 show-checkbox 为 true),则返回目前半选中的节点所组成的数组,仅配置多选时生效。", + "defaultValue": "" + }, + { + "name": "getHalfCheckedKeys", + "sample": "check-on-click-node", + "type": "() => result", + "desc": "若节点可被选择(即 show-checkbox 为 true),则返回目前半选中的节点的 key 所组成的数组,仅配置多选时生效。", + "defaultValue": "" + }, + { + "name": "getCurrentKey", + "sample": "node-key", + "type": "() => result", + "desc": "获取当前被选中节点的 key,使用此方法必须设置 node-key 属性,若没有节点被选中则返回 ,仅配置单选时生效", + "defaultValue": "" + }, + { + "name": "getCurrentNode", + "sample": "node-key", + "type": "() => result", + "desc": "获得当前的选中的节点,仅单选模式下生效;获取当前被选中节点的 data,若没有节点被选中则返回 null", + "defaultValue": "" + }, + { + "name": "setCurrentKey", + "sample": "node-key", + "type": "(key) => void", + "desc": "通过 key 设置某个节点的当前选中状态,使用此方法必须设置 node-key 属性", + "defaultValue": "" + }, + { + "name": "setCurrentNode", + "sample": "node-key", + "type": "(key) => void", + "desc": "通过 node 设置某个节点的当前选中状态,使用此方法必须设置 node-key 属性", + "defaultValue": "" + }, + { + "name": "getNode", + "sample": "show-checkbox", + "type": "(data) => result", + "desc": "根据 data 或者 key 拿到 Tree 组件中的 node", + "defaultValue": "" + }, + { + "name": "remove", + "sample": "", + "type": "(data) => void", + "desc": "删除节点。;删除 Tree 中的一个节点,使用此方法必须设置 node-key 属性", + "defaultValue": "" + }, + { + "name": "append", + "sample": "node-key", + "type": "(data, parentNode) => void", + "desc": "为 Tree 中的一个节点追加一个子节点", + "defaultValue": "" + }, + { + "name": "insertBefore", + "sample": "node-key", + "type": "(data, refNode) => void", + "desc": "为 Tree 的一个节点的前面增加一个节点", + "defaultValue": "" + }, + { + "name": "insertAfter", + "sample": "node-key", + "type": "(data, refNode) => void", + "desc": "根据节点数据在父节点下插入一个子节点。为 Tree 的一个节点的后面增加一个节点", + "defaultValue": "" + } + ], + "events": [ + { + "name": "node-click", + "sample": "check-on-click-node", + "type": "Function(data, node, vm)", + "desc": "点击节点后的事件。;节点被点击时的回调;//参数说明\n{data: 节点数据,node: 节点状态信息(包括数据),vm: 组件实例}", + "defaultValue": "" + }, + { + "name": "node-contextmenu", + "sample": "node-contextmenu", + "type": "Function(event, data, node, vm)", + "desc": "当某一节点被鼠标右键点击时会触发该事件;//参数说明\n{data: 节点数据,node: 节点状态信息(包括数据),vm: 组件实例,event:原生事件}", + "defaultValue": "" + }, + { + "name": "check-change", + "sample": "node-events", + "type": "Function(data, node, vm)", + "desc": "节点选中状态发生变化时的回调;//参数说明\n{node: 节点状态信息(包括数据),checked:当前点击节点的勾选状态,indeterminate}", + "defaultValue": "" + }, + { + "name": "check", + "sample": "drag-events", + "type": "Function(data, currentNode)", + "desc": "勾选节点后的事件;当复选框被点击的时候触发;//回调参数:\n{data: Object,// 当前选中节点信息\ncurrentNode:Object//树组件目前的选中状态信息,包含 checkedNodes、checkedKeys、halfCheckedNodes、halfCheckedKeys 四个属性}", + "defaultValue": "" + }, + { + "name": "current-change", + "sample": "drag-events", + "type": "Function(data, currentNode)", + "desc": "当前选中节点变化时触发的事件;//参数说明\n{data: 节点数据,currentNode: 节点状态信息(包括数据)}", + "defaultValue": "" + }, + { + "name": "node-expand", + "sample": "default-expanded-keys", + "type": "Function(data, node, vm)", + "desc": "展开节点后的事件。;节点被展开时触发的事件;//参数说明\n{data: 节点数据,node: 节点状态信息(包括数据,vm: 当前组件实例}", + "defaultValue": "" + }, + { + "name": "node-collapse", + "sample": "default-expanded-keys", + "type": "Function(data, node, vm)", + "desc": "收缩节点后的事件;节点被关闭时触发的事件;//参数说明\n{data: 节点数据,node: 节点状态信息(包括数据),vm: 当前组件实例}", + "defaultValue": "" + }, + { + "name": "node-drag-start", + "sample": "drag-events", + "type": "Function(node, event)", + "desc": "节点开始拖拽时触发的事件;节点开始拖拽时触发的事件;node: 拖拽节点,event: 原生事件", + "defaultValue": "" + }, + { + "name": "node-drag-enter", + "sample": "drag-events", + "type": "Function(draggingNode, targetNode, dropType, event)", + "desc": "拖拽进入其他节点时触发的事件;//参数\n{draggingNode: 拖拽节点,targetNode: 目标节点,dropType: 拖拽类型, //拖拽节点在目标节点对应关系(before/after/inner/none)\nevent: 原生事件}", + "defaultValue": "" + }, + { + "name": "node-drag-leave", + "sample": "drag-events", + "type": "Function(draggingNode, targetNode, dropType, event)", + "desc": "拖拽离开某个节点时触发的事件;//参数\n{draggingNode: 拖拽节点,targetNode: 目标节点,dropType: 拖拽类型,//拖拽节点在目标节点对应关系(before/after/inner/none)\nevent: 原生事件}", + "defaultValue": "" + }, + { + "name": "node-drag-over", + "sample": "drag-events", + "type": "Function(raggingNode, targetNode, dropType, event)", + "desc": "在拖拽节点时触发的事件(类似浏览器的 mouseover 事件);//参数\n{draggingNode: 拖拽节点,targetNode: 目标节点,dropType: 拖拽类型, //拖拽节点在目标节点对应关系(before/after/inner/none)\nevent: 原生事件}", + "defaultValue": "" + }, + { + "name": "node-drag-end", + "sample": "drag-events", + "type": "Function(draggingNode, targetNode, dropType, event)", + "desc": "拖拽结束时(可能未成功)触发的事件;//参数\n{draggingNode: 拖拽节点,targetNode: 目标节点,dropType: 拖拽类型, //拖拽节点在目标节点对应关系(before/after/inner/none)\nevent: 原生事件}", + "defaultValue": "" + }, + { + "name": "node-drop", + "sample": "node-draggable", + "type": "Function(draggingNode, targetNode, dropType, event)", + "desc": "拖放节点后的事件。开启 dragable 属性为 true 有效。;拖拽成功完成时触发的事件;//参数\n{draggingNode: 拖拽节点,targetNode: 目标节点,dropType: 拖拽类型, //拖拽节点在目标节点对应关系(before/after/inner/none)\nevent: 原生事件}", + "defaultValue": "" + } + ] +} diff --git a/examples/docs/resources/pc/api/zh-CN/user-account.json b/examples/docs/resources/pc/api/zh-CN/user-account.json new file mode 100644 index 000000000..46a5cf467 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/user-account.json @@ -0,0 +1,55 @@ +{ + "attrs": [ + { + "name": "getUserInfo", + "sample": "custom-service", + "type": "Function", + "desc": "自定义配置用户查询服务", + "defaultValue": "" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "为 popper 添加类名(可参考 popover 组件)", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false (可参考 select 组件)", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "getUserImageUrl", + "sample": "custom-service", + "type": "Function", + "desc": "自定义配置获取用户头像服务", + "defaultValue": "" + }, + { + "name": "showArrow", + "sample": "custom-service", + "type": "Boolean", + "desc": "设置为true时,箭头会与Roles组件的箭头方向保持一致", + "defaultValue": "" + }, + { + "name": "beforeLogout", + "sample": "", + "type": "Function(params)", + "desc": "注销前的回调函数", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-operation", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/user-contact.json b/examples/docs/resources/pc/api/zh-CN/user-contact.json new file mode 100644 index 000000000..3cabbc278 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/user-contact.json @@ -0,0 +1,62 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "data-source", + "type": "Object", + "desc": "设置的数据;数据设置", + "defaultValue": "" + }, + { + "name": "show-img", + "sample": "not-displayed-content", + "type": "Boolean", + "desc": "是否显示头像,默认 true", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "show-name", + "sample": "not-displayed-content", + "type": "Boolean", + "desc": "是否显示姓名 userName,默认 true", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "show-number", + "sample": "not-displayed-content", + "type": "Boolean", + "desc": "是否显示工号 roleNumber,默认 true", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "为 popper 添加类名(可参考 popover 组件)", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false (可参考 select 组件)", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "espace", + "sample": "support-open-espace", + "type": "Array", + "desc": "espace 信息配置", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "slots-usercontact", + "type": "", + "desc": "默认插槽", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/user-head.json b/examples/docs/resources/pc/api/zh-CN/user-head.json new file mode 100644 index 000000000..05c5ec0bc --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/user-head.json @@ -0,0 +1,76 @@ +{ + "attrs": [ + { + "name": "background-color", + "sample": "custom-background-color", + "type": "String", + "desc": "背景色 。", + "defaultValue": "该属性的默认值为 #d9d9d9" + }, + { + "name": "color", + "sample": "color", + "type": "String", + "desc": "文字颜色 。", + "defaultValue": "该属性的默认值为 #ffffff" + }, + { + "name": "message-total", + "sample": "message-count-total", + "type": "Number", + "desc": "消息计数 。", + "defaultValue": "" + }, + { + "name": "message-type", + "sample": "message-count-type", + "type": "String", + "desc": "消息类型 details|basic 可选 。;该属性的可选值为 details / basic", + "defaultValue": "该属性的默认值为 details" + }, + { + "name": "message-upper-limit", + "sample": "message-count-limit", + "type": "Number", + "desc": "消息显示上限 。", + "defaultValue": "该属性的默认值为 0" + }, + { + "name": "min", + "sample": "min-user-head", + "type": "Boolean", + "desc": "小尺寸模式 。", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "round", + "sample": "round-user-head", + "type": "Boolean", + "desc": "圆形模式 。", + "defaultValue": "" + }, + { + "name": "type", + "sample": "image-user-head", + "type": "String", + "desc": "头像类型,icon|image|label 可选。;该属性的可选值为 icon / image / label", + "defaultValue": "该属性的默认值为 label" + }, + { + "name": "value", + "sample": "icon-user-head", + "type": "String", + "desc": "type=icon 时为图标类名,type=label时为字体串,type=image时为资源路径", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "default", + "sample": "custom-user-head-content", + "type": "", + "desc": "自定义图像内容", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/user-link.json b/examples/docs/resources/pc/api/zh-CN/user-link.json new file mode 100644 index 000000000..b9e0f4e68 --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/user-link.json @@ -0,0 +1,81 @@ +{ + "attrs": [ + { + "name": "value", + "sample": "custom-service", + "type": "String", + "desc": "配置默认值,默认为空", + "defaultValue": "" + }, + { + "name": "cache", + "sample": "cache-users", + "type": "Boolean", + "desc": "是否开启用户数据缓存,默认为 ture 缓存用户数据", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "cache-key", + "sample": "cache-users", + "type": "String", + "desc": "自定义缓存 key 默认值为 tiny-user", + "defaultValue": "该属性的默认值为 tiny-user" + }, + { + "name": "cache-fields", + "sample": "cache-users", + "type": "Array", + "desc": "自定义缓存的字段", + "defaultValue": "" + }, + { + "name": "value-split", + "sample": "value-split", + "type": "String", + "desc": "在多选的情况下,设置输入框显示多个文本时的分隔符,默认为 ; 分号;在多选的情况下,设置输入框显示多个文本时的分隔符,默认为 , 逗号", + "defaultValue": "该属性的默认值为 ," + }, + { + "name": "value-field", + "sample": "value-field", + "type": "String", + "desc": "设置下拉框的值所对应数据源的字段名称", + "defaultValue": "该属性的默认值为 userId" + }, + { + "name": "text-split", + "sample": "text-split", + "type": "String", + "desc": "在多选的情况下,设置输入框显示多个文本时的分隔符", + "defaultValue": "该属性的默认值为 ," + }, + { + "name": "text-field", + "sample": "text-field", + "type": "String", + "desc": "设置下拉框的文本对应的数据源的字段名称", + "defaultValue": "该属性的默认值为 userCN" + }, + { + "name": "fetchUser", + "sample": "custom-service", + "type": "Function", + "desc": "配置通过员区号查询用户信息(展示在卡片上)", + "defaultValue": "" + }, + { + "name": "fetchW3Accounts", + "sample": "custom-service", + "type": "Function", + "desc": "自定义配置批量查询用户信息服务", + "defaultValue": "" + }, + { + "name": "getUserImageUrl", + "sample": "custom-service", + "type": "Function", + "desc": "自定义配置获取用户头像服务", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/user.json b/examples/docs/resources/pc/api/zh-CN/user.json new file mode 100644 index 000000000..4295273dd --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/user.json @@ -0,0 +1,197 @@ +{ + "attrs": [ + { + "name": "value", + "sample": "basic-usage", + "type": "String", + "desc": "配置默认值", + "defaultValue": "" + }, + { + "name": "tag-selectable", + "sample": "tag-copy", + "type": "Boolean", + "desc": "是否开启输入框中已选择的选项可复制", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "multiple", + "sample": "multiple-users", + "type": "Boolean", + "desc": "是否开启多用户形式,默认为 false ", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "disabled", + "sample": "dynamic-disable", + "type": "Boolean", + "desc": "是否禁用户组件", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "value-split", + "sample": "value-split", + "type": "String", + "desc": "值分隔符", + "defaultValue": "该属性的默认值为 ," + }, + { + "name": "popper-class", + "sample": "", + "type": "String", + "desc": "为 popper 添加类名(可参考 popover 组件)", + "defaultValue": "" + }, + { + "name": "popper-append-to-body", + "sample": "", + "type": "Boolean", + "desc": "是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false (可参考 select 组件)", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "sort-by-fetch-data", + "sample": "custom-service", + "type": "Boolean", + "desc": "联想时下拉框的数据顺序和接口返回的数据顺序一致", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "textSplit", + "sample": "value-split", + "type": "String", + "desc": "文本分隔符", + "defaultValue": "文本粘贴复制查询时的分割符,该属性的默认值为 ," + }, + { + "name": "value-field", + "sample": "value-field", + "type": "String", + "desc": "取值字段映射", + "defaultValue": "该属性的默认值为 userId" + }, + { + "name": "text-field", + "sample": "text-field", + "type": "String", + "desc": "显示字段映射", + "defaultValue": "该属性的默认值为 userCN" + }, + { + "name": "cache", + "sample": "cache-users", + "type": "Boolean", + "desc": "是否缓存用户数据", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "cache-key", + "sample": "cache-users", + "type": "String", + "desc": "设置缓存数据的 key 值", + "defaultValue": "该属性的默认值为 tiny-user" + }, + { + "name": "delay", + "sample": "delay-load", + "type": "Number", + "desc": "设置延时加载的时间", + "defaultValue": "该属性的默认值为 600 毫秒" + }, + { + "name": "suggest-length", + "sample": "load-after-input-the-length", + "type": "Number", + "desc": "设置输入指定长度完成后进行加载", + "defaultValue": "该属性的默认值为 3" + }, + { + "name": "cache-fields", + "sample": "cache-users", + "type": "Array", + "desc": "设置需要缓存的用户数据", + "defaultValue": "该属性的默认值为 []" + }, + { + "name": "fetchW3Accounts", + "sample": "custom-service", + "type": "Function", + "desc": "自定义批量查询用户服务", + "defaultValue": "" + }, + { + "name": "fetchSuggestUser", + "sample": "custom-service", + "type": "Function", + "desc": "自定义输入查询服务", + "defaultValue": "" + }, + { + "name": "placeholder", + "sample": "basic-usage", + "type": "String", + "desc": "设置输入框占位文本", + "defaultValue": "" + }, + { + "name": "collapse-tags", + "sample": "multiple-users-tag", + "type": "Boolean", + "desc": "多用户时是否折叠标签", + "defaultValue": "该属性的默认值为 false" + }, + { + "name": "collapse-show-overflow-tooltip", + "sample": "collapse-show-overflow-tooltip", + "type": "Boolean", + "desc": "是否省略显示超出一行的数据并有tooltip提示", + "defaultValue": "该属性的默认值为 true" + }, + { + "name": "sortable", + "sample": "custom-sort", + "type": "Function", + "desc": "自定义用户拖拽排序,该属性引用 sortablejs 插件进行排序", + "defaultValue": "" + }, + { + "name": "size", + "sample": "user-select-size", + "type": "String", + "desc": "设置用户组件尺寸", + "defaultValue": "" + }, + { + "name": "allow-copy", + "sample": "", + "type": "Boolean", + "desc": "搜索单选场景,是否允许复制输入框的内容;属性会透传给内部的 Select 组件,参考 Select 示例", + "defaultValue": "该属性的默认值为 false,表示不能复制" + } + ], + "slots": [ + { + "name": "options", + "sample": "user-options", + "type": "", + "desc": "选项文本", + "defaultValue": "" + } + ], + "events": [ + { + "name": "error", + "sample": "event-error", + "type": "", + "desc": "输入未匹配到用户信息时触发", + "defaultValue": "" + }, + { + "name": "change", + "sample": "event-change", + "type": "", + "desc": "值发生变化时触发", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/api/zh-CN/wizard.json b/examples/docs/resources/pc/api/zh-CN/wizard.json new file mode 100644 index 000000000..06f1bb39f --- /dev/null +++ b/examples/docs/resources/pc/api/zh-CN/wizard.json @@ -0,0 +1,55 @@ +{ + "attrs": [ + { + "name": "data", + "sample": "base-flow", + "type": "Array", + "desc": "设置流程图的数据", + "defaultValue": "" + }, + { + "name": "base-flow", + "sample": "base-flow", + "type": "Boolean", + "desc": "设置流程图为基本流程图模式", + "defaultValue": "" + }, + { + "name": "page-guide", + "sample": "page-guide", + "type": "Boolean", + "desc": "设置流程图为页向导流程图,配合 base-flow 属性使用", + "defaultValue": "" + }, + { + "name": "vertical", + "sample": "vertical", + "type": "Boolean", + "desc": "设置流程图为垂直流程图", + "defaultValue": "" + }, + { + "name": "time-line-flow", + "sample": "time-line-flow", + "type": "Boolean", + "desc": "设置流程图为时间线流程图", + "defaultValue": "" + } + ], + "slots": [ + { + "name": "base", + "sample": "slot-base", + "type": "", + "desc": "基本流程图插槽", + "defaultValue": "" + }, + { + "name": "stepbutton", + "sample": "slot-step-button", + "type": "", + "desc": "页向导流程图按钮插槽", + "defaultValue": "" + } + ] +} \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/action-menu.json b/examples/docs/resources/pc/demo-config/en-US/action-menu.json new file mode 100644 index 000000000..495460ba6 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/action-menu.json @@ -0,0 +1,82 @@ +[ + { + "title": "Basic Usage", + "content": "Basic usage of the ActionMenu component.", + "link": "action-menu/basic-usage", + "component": " ActionMenu", + "findIntroStr": "ActionMenu", + "demoId": "basic-usage" + }, + { + "title": "Disabled", + "content": "Use the disabled field to configure whether the current drop-down list box is disabled.", + "link": "action-menu/disabled", + "component": "ActionMenu button", + "findIntroStr": "ActionMenu", + "demoId": "disabled" + }, + { + "title": "Display Text", + "content": "Use the text-field attribute to configure the key value of the text to be displayed. The default value is label.", + "link": "action-menu/text-field", + "component": " ActionMenu", + "findIntroStr": "ActionMenu", + "demoId": "text-field" + }, + { + "title": "The text of the drop-down button is displayed.", + "content": "Use the attribute more-text to configure the text to be displayed in the drop-down list box. The default value is Morespacing attribute is used to configure the spacing between menu buttons. The default value is 5px.", + "link": "action-menu/spacing", + "component": " ActionMenu", + "findIntroStr": "ActionMenu", + "demoId": "spacing" + }, + { + "title": "Customize drop-down panel style", + "content": "Set the class name and style of the drop-down panel through the popper-class attribute.", + "link": "action-menu/popper-class", + "component": " ActionMenu", + "findIntroStr": "ActionMenu", + "demoId": "popper-class" + }, + { + "title": "Displayed Number", + "content": "The max-show-num attribute specifies the maximum number of displayed menu buttons. The default value is 2", + "link": "action-menu/max-show-num", + "component": " ActionMenu", + "findIntroStr": "ActionMenu", + "demoId": "max-show-num" + }, + { + "title": "Menu Item Click Event", + "content": "When a menu item is selected, the item-click event is triggered. The transferred parameter is the data of the selected item.", + "link": "action-menu/item-click", + "component": " ActionMenu", + "findIntroStr": "ActionMenu", + "demoId": "item-click" + }, + { + "title": "More button click event", + "content": "The more-click event is triggered when a drop-down list button is clicked.", + "link": "action-menu/more-click", + "component": " ActionMenu", + "findIntroStr": "ActionMenu", + "demoId": "more-click" + }, + { + "title": "Menu Slot", + "content": "Use #item to configure the template for the options in the drop-down list box.", + "link": "action-menu/slot-item", + "component": " ActionMenu", + "findIntroStr": "ActionMenu", + "demoId": "slot-item" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/alert.json b/examples/docs/resources/pc/demo-config/en-US/alert.json new file mode 100644 index 000000000..f20d8574b --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/alert.json @@ -0,0 +1,106 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "alert/base", + "component": "Alert", + "findIntroStr": "Alert alarms, including warning, error, info, and success.", + "demoId": "base" + }, + { + "title": "Type", + "content": "

Set different types through type. The options are success, warning, info, and error. The default value is info.

\n", + "link": "alert/type", + "component": "Alert", + "findIntroStr": "Alert alarms, including warning, error, info, and success.", + "demoId": "type" + }, + { + "title": "Large Size", + "content": "

Set different sizes through the size attribute. The options are nomal and large. The default value is nomal.

\n", + "link": "alert/size", + "component": "Alert", + "findIntroStr": "Alert alarms, including warning, error, info, and success.", + "demoId": "size" + }, + { + "title": "Custom Title", + "content": "

When size is set to large, the title is displayed. You can set title or slot to customize the title. The default title is displayed according to the set type.

\n", + "link": "alert/title", + "component": "Alert", + "findIntroStr": "Alert alarms, including warning, error, info, and success.", + "demoId": "title" + }, + { + "title": "Center text", + "content": "

You can use the center property to center the text.

\n", + "link": "alert/center", + "component": "Alert", + "findIntroStr": "Alert alarms, including warning, error, info, and success.", + "demoId": "center" + }, + { + "title": "Customize the close button text", + "content": "

Customize the close button text through the close-text attribute.

\n", + "link": "alert/close-text", + "component": "Alert", + "findIntroStr": "Alert alarms, including warning, error, info, and success.", + "demoId": "close-text" + }, + { + "title": "Customized warning icon", + "content": "

Customize the icon through the icon attribute.

\n", + "link": "alert/icon", + "component": "Alert", + "findIntroStr": "Alert alarms, including warning, error, info, and success.", + "demoId": "icon" + }, + { + "title": "Cannot be closed", + "content": "

You can set whether to display the close button through the closable attribute. If there is no close button, the warning box cannot be closed.

\n", + "link": "alert/closable", + "component": "Alert", + "findIntroStr": "Alert alarms, including warning, error, info, and success.", + "demoId": "closable" + }, + { + "title": "Customized prompt content", + "content": "

When size is set to large, you can customize the prompt content through the description attribute or slot.

\n", + "link": "alert/custom-description", + "component": "Alert", + "findIntroStr": "Alert alarms, including warning, error, info, and success.", + "demoId": "custom-description" + }, + { + "title": "Customized Interaction", + "content": "

When size is large, set the default slot custom interaction operation.

\n", + "link": "alert/slot-default", + "component": "Alert", + "findIntroStr": "Alert alarms, including warning, error, info, and success.", + "demoId": "slot-default" + }, + { + "title": "Close Event", + "content": "

close event, triggered when the warning dialog box is closed.

\n", + "link": "alert/close", + "component": "Alert", + "findIntroStr": "Alert alarms, including warning, error, info, and success.", + "demoId": "close-events" + }, + { + "title": "Form submission result feedback", + "content": "

When size is set to large, the description attribute is used together with the default slot to render the feedback submission interface.

\n", + "link": "alert/feedback-of-result", + "component": "Alert", + "findIntroStr": "Alert alarms, including warning, error, info, and success.", + "demoId": "feedback-of-result" + }, + { + "title": "Display icon", + "content": "

You can set the show-icon attribute to control whether to display the icon.

\n", + "link": "alert/show-icon", + "component": "Alert", + "findIntroStr": "Alert alarms, including warning, error, info, and success.", + "demoId": "show-icon" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/amount.json b/examples/docs/resources/pc/demo-config/en-US/amount.json new file mode 100644 index 000000000..df540ef7a --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/amount.json @@ -0,0 +1,58 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example ", + "link": "amount/basic-usage", + "component": "Amount", + "findIntroStr": "Used to process currency, amount, and related time. Select a currency type and enter the number and time. You can also set the service. Customized currency type. ", + "demoId": "basic-usage" + }, + { + "title": "Set Date", + "content": "

After the date is set through the date attribute, the date box is displayed in the amount component. The value can be of the String or Date() type. \n Obtain the changed value through change.

\n", + "link": "amount/set-date", + "component": "Amount", + "findIntroStr": "is used to process currency, amount, and related time. Select a currency type and enter the number and time. You can also customize the currency type by setting services. ", + "demoId": "set-date" + }, + { + "title": "editing box size", + "content": "

The options are as follows:medium,small, mini

\n", + "link": "amount/size", + "component": "Amount", + "findIntroStr": "Used to process currency, amount, and time. Select a currency type and enter the number and time. You can also customize the currency type by setting services. ", + "demoId": "size" + }, + { + "title": "Specified Currency", + "content": "

The default currency is CNY. You can use currency to specify the currency. If the specified currency does not exist in the returned service data, the currency is not displayed in the Currency drop-down list box.

\n", + "link": "amount/custom-currency", + "component": "Amount", + "findIntroStr": "is used to process currency, amount, and related time. Select a currency type and enter the number and time. You can also customize the currency type by setting services. ", + "demoId": "custom-currency" + }, + { + "title": "Amount Setting", + "content": "

Set the digits attribute to specify the number of decimal places of the amount. The default value is 2. Set the max-len attribute to specify the maximum length of an integer. The default value is 15.

\n", + "link": "amount/digits-maxlen", + "component": "Amount", + "findIntroStr": "is used to process currency, amount, and related time. Select a currency type and enter the number and time. You can also customize the currency type by setting services. ", + "demoId": "digits-maxlen" + }, + { + "title": "Custom Service ", + "content": "

fetchCurrency specifies the custom service. fields can specify the field mapping of the display field and value settings in the service data.

\n", + "link": "amount/custom-service", + "component": "Amount", + "findIntroStr": "is used to process currency, amount, and related time. Select a currency type and enter the number and time. You can also customize the currency type by setting services. ", + "demoId": "custom-service" + }, + { + "title": "Disable", + "content": "

You can disable the Amount component by using disabled.

\n", + "link": "amount/amount-disable", + "component": "Amount", + "findIntroStr": "Used to process the currency, amount, and related time. Select the currency type and fill in the number and time. You can also customize the currency type by setting the service. ", + "demoId": "amount-disable" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/anchor.json b/examples/docs/resources/pc/demo-config/en-US/anchor.json new file mode 100644 index 000000000..af1dfa2e7 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/anchor.json @@ -0,0 +1,34 @@ +[ + { + "title": "Basic Usage", + "content": "Attribute links: input data rendering", + "link": "anchor/basic-usage", + "component": "Anchor", + "findIntroStr": "Used to jump to the specified position on the page", + "demoId": "basic-usage" + }, + { + "title": "Fixed mode", + "content": "Set the is-affix attribute to true so that the anchor does not scroll with the page.", + "link": "anchor/is-affix", + "component": "Anchor", + "findIntroStr": "Used to jump to the specified position on the page", + "demoId": "is-affix" + }, + { + "title": "Rolling Container", + "content": "Use the container-id attribute to specify the scrolling container. link-click listens to anchor click events and prevents the default browser behavior. Implement intra-page redirection in single-page hash routing mode so that the page scrolls only in the specified container. Set the custom class name through the mask-class attribute to highlight the scrolling target element", + "link": "anchor/set-container", + "component": "Anchor", + "findIntroStr": "Used to jump to the specified position on the page", + "demoId": "set-container" + }, + { + "title": "change event", + "content": "on-change event. Callback is triggered when the anchor link changes.", + "link": "anchor/on-change", + "component": "Anchor", + "findIntroStr": "Used to jump to the specified position on the page", + "demoId": "on-change" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/area.json b/examples/docs/resources/pc/demo-config/en-US/area.json new file mode 100644 index 000000000..69568184b --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/area.json @@ -0,0 +1,42 @@ +[ + { + "title": "Basic Usage", + "content": "

Sets the default value through the v-model / value property.

\n", + "link": "area/basic-usage", + "component": "Area", + "findIntroStr": "Displays the region name. The options are obtained by configuring the region and data source.", + "demoId": "basic-usage" + }, + { + "title": "Custom Service", + "content": "

You can use fetch-jcr to customize services to obtain regional JCR data, and fetch-rigion to obtain regional region data. fetch-rep is used to obtain the data of rep offices, and fetch-office is used to obtain the data of offices. In addition, when the data field is not the default name_cn org_id, you can set the mapping field of the data through the props attribute.

\n", + "link": "area/custom-service", + "component": "Area", + "findIntroStr": "Displays the region name. The options are obtained by configuring the region and data source.", + "demoId": "custom-service" + }, + { + "title": "Set Component Size", + "content": "

The options are as follows: medium, small, mini

\n", + "link": "area/size", + "component": "Area", + "findIntroStr": "Displays the region name. The options are obtained by configuring the region and data source.", + "demoId": "size" + }, + { + "title": "Event", + "content": "The change-region event is triggered when the value of the Region drop-down list box changes. The change-rep event is triggered when the value of the Rep drop-down list box changes. The change-office event is triggered when the value of the Office drop-down list box changes.

\n", + "link": "area/area-events", + "component": "Area", + "findIntroStr": "Displays the region name. The options are obtained by configuring the region and data source.", + "demoId": "area-events" + }, + { + "title": "Set Component Size", + "content": "

Use disabled to disable the component. The default value is false.

\n", + "link": "area/disabled", + "component": "Area", + "findIntroStr": "Displays the region name. The options are obtained by configuring the region and data source.", + "demoId": "disabled" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/autocomplete.json b/examples/docs/resources/pc/demo-config/en-US/autocomplete.json new file mode 100644 index 000000000..32957d1be --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/autocomplete.json @@ -0,0 +1,154 @@ +[ + { + "title": "Disabled", + "content": "

The disabled attribute can be set to the disabled state.

\n", + "link": "autocomplete/disabled", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "disabled1" + }, + { + "title": "Native Attribute", + "content": "For details, see the following example.", + "link": "autocomplete/disabled", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "disabled" + }, + { + "title": "Text box size", + "content": "

The value can be medium, small, or mini

\n", + "link": "autocomplete/size", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "size" + }, + { + "title": "Can be cleared", + "content": "

After the clearable attribute is configured, the clear icon is displayed after you enter content. You can click to clear the content in the text box.

\n", + "link": "autocomplete/clearable", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "clearable" + }, + { + "title": "Pre-content in the text box", + "content": "

Configure the prepend attribute to set the front content of the text box.

\n", + "link": "autocomplete/append-prepend", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "append-prepend" + }, + { + "title": "Content after the text box", + "content": "

Configure the append attribute to set the content behind the text box.

\n", + "link": "autocomplete/append-prepend", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "append-append" + }, + { + "title": "Custom Icon", + "content": "

Configure the prefix-icon and suffix-icon attributes to customize the icons before and after the text box.

\n", + "link": "autocomplete/custom-icon", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "custom-icon" + }, + { + "title": "Customize icons by slot", + "content": "

You can also customize the front and rear icons of the text box through the prefix and suffix slots.

\n", + "link": "autocomplete/prefix-suffix-slot", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "prefix-suffix-slot" + }, + { + "title": "Debounce Delay", + "content": "

You can set the dejitter delay for obtaining input suggestions through the debounce attribute. The default value is 300 ms.

\n", + "link": "autocomplete/debounce", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "debounce" + }, + { + "title": "Hide the loading icon", + "content": "

Set hide-loading to true to hide the loading icon.

\n", + "link": "autocomplete/hide-loading", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "hide-loading" + }, + { + "title": "Placeholder text in the text box", + "content": "

Use the placeholder attribute to set the placeholder text in the text box.

\n", + "link": "autocomplete/hide-loading", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "hide-loading1" + }, + { + "title": "Custom Template", + "content": "

You can customize the input suggestion template through the scope slot.

\n", + "link": "autocomplete/cust-template", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "cust-template" + }, + { + "title": "Remote Search", + "content": "

Set the remote search through the fetch-suggestions attribute.

\n", + "link": "autocomplete/remote-search", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "remote-search" + }, + { + "title": "Specify the key name to be displayed.", + "content": "

After you enter content, the value corresponding to the value key name of the input object is displayed in the suggestion list by default. If the object does not have a value key name, you can specify the key name by using the value-key attribute.

\n", + "link": "autocomplete/value-key", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "value-key" + }, + { + "title": "Custom List Style", + "content": "

popper-class property specifies a style class name to customize the style of the suggestion list. The \npopper-append-to-body property sets whether the drop-down list is inserted into the body element. You can set this property to false when a problem occurs in locating the drop-down list.

\n", + "link": "autocomplete/popper-class", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "popper-class" + }, + { + "title": "Set menu pop-up position", + "content": "

placement property can be used to set the menu pop-up position. The default value is bottom-start. The options are top, top-start, top-end, bottom, bottom-start, and bottom-end.

\n", + "link": "autocomplete/placement", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "placement" + }, + { + "title": "Highlight the first item", + "content": "

Set the highlight-first-item attribute to true to highlight the first item in the remote search suggestion.

\n", + "link": "autocomplete/highlight-first-item", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "highlight-first-item" + }, + { + "title": "Focus does not display the suggestion list", + "content": "

By default, all suggestions are displayed when the input box is focused. However, if trigger-on-focus is set to false, the list of matched suggestions is displayed only after the input suggestions are matched.

\n", + "link": "autocomplete/no-trigger-on-focus", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "no-trigger-on-focus" + }, + { + "title": "Event", + "content": "

Autocomplete provides the select event, which is triggered when a suggestion item is selected. The callback parameter is the suggestion item selected. \n Use select-when-unmatched to set whether to trigger the select event when you press Enter when no matching value is entered. The default value is false.

\n", + "link": "autocomplete/select-event", + "component": "Autocomplete", + "findIntroStr": "Provide input suggestions based on the input content.", + "demoId": "select-event" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/badge.json b/examples/docs/resources/pc/demo-config/en-US/badge.json new file mode 100644 index 000000000..713ce5b3c --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/badge.json @@ -0,0 +1,66 @@ +[ + { + "title": "Basic Usage", + "content": "

Badge Displays specified data, such as the number of to-do tasks and the number of new tasks.

\n", + "link": "badge/base", + "component": "Badge flag", + "findIntroStr": "Badge displays specified data, such as the number of to-do tasks and the number of new tasks.", + "demoId": "base" + }, + { + "title": "Theme Style", + "content": "

type Set the display theme. The options are primary, success, warning, danger, and info. The default value is danger

\n", + "link": "badge/type", + "component": "Badge flag", + "findIntroStr": "Badge displays specified data, such as the number of to-do tasks and the number of new tasks.", + "demoId": "type" + }, + { + "title": "Small dot mark", + "content": "

is-dot Display small dot mark

\n", + "link": "badge/is-dot", + "component": "Badge flag", + "findIntroStr": "Badge displays specified data, such as the number of to-do tasks and the number of new tasks.", + "demoId": "is-dot" + }, + { + "title": "Maximum count value", + "content": "

max exceeds the maximum value, '{max}+'

\n is displayed", + "link": "badge/max", + "component": "Badge flag", + "findIntroStr": "Badge displays specified data, such as the number of to-do tasks and the number of new tasks.", + "demoId": "max" + }, + { + "title": "Link", + "content": "

href Define Jump Link

\n", + "link": "badge/target", + "component": "Badge flag", + "findIntroStr": "Badge displays specified data, such as the number of to-do tasks and the number of new tasks.", + "demoId": "target" + }, + { + "title": "Custom Tag Target", + "content": "

default slot Tag Content Custom

\n", + "link": "badge/slot-default", + "component": "Badge flag", + "findIntroStr": "Badge displays specified data, such as the number of to-do tasks and the number of new tasks.", + "demoId": "slot-default" + }, + { + "title": "Customized prompt content", + "content": "

content slot Custom Prompt Content

\n", + "link": "badge/slot-content", + "component": "Badge flag", + "findIntroStr": "Badge displays specified data, such as the number of to-do tasks and the number of new tasks.", + "demoId": "slot-content" + }, + { + "title": "Dynamic hiding flag of read messages", + "content": "

hidden Hide Tag

\n", + "link": "badge/dynamic-hidden", + "component": "Badge flag", + "findIntroStr": "Badge displays specified data, such as the number of to-do tasks and the number of new tasks.", + "demoId": "dynamic-hidden" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/breadcrumb.json b/examples/docs/resources/pc/demo-config/en-US/breadcrumb.json new file mode 100644 index 000000000..aa0f844e2 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/breadcrumb.json @@ -0,0 +1,34 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "breadcrumb/base", + "component": "Breadcrumb", + "findIntroStr": "Breadcrumb navigation, which tells visitors where they are currently on the site and how to get back.", + "demoId": "base" + }, + { + "title": "Custom Node", + "content": "

Sets the default slot of the subcomponent BreadcrumbItem and customizes the node content. to sets the object of route redirection. After replace is set, no new record is added to history.

\n", + "link": "breadcrumb/slot-default", + "component": "Breadcrumb", + "findIntroStr": "Breadcrumb navigation, which tells visitors where they are currently on the site and how to get back.", + "demoId": "slot-default" + }, + { + "title": "Custom separator", + "content": "

Set the separator or separator-icon attribute to customize the separator.

\n", + "link": "breadcrumb/separator", + "component": "Breadcrumb", + "findIntroStr": "Breadcrumb navigation, which tells visitors where they are currently on the site and how to get back.", + "demoId": "separator" + }, + { + "title": "options configuration", + "content": "

Totally configure each BreadcrumbItem via options.

Set textField to specify the field to be displayed. The default field to be displayed is label\n", + "link": "breadcrumb/options", + "component": "Breadcrumb", + "findIntroStr": "Breadcrumb navigation, which tells visitors where they are currently on the site and how to get back.", + "demoId": "options" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/bulletin-board.json b/examples/docs/resources/pc/demo-config/en-US/bulletin-board.json new file mode 100644 index 000000000..005e7dd06 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/bulletin-board.json @@ -0,0 +1,66 @@ +[ + { + "title": "Basic Usage", + "content": "

The data attribute must be set to set the bulletin information data, and the tab-title attribute must be set to set the title of each bulletin board.

\n", + "link": "bulletin-board/base", + "component": "BulletinBoard", + "findIntroStr": "BulletinBoard bulletin board component, which displays the information that needs to be paid attention to.", + "demoId": "base" + }, + { + "title": "Billboard Title", + "content": "

You can use title to set the bulletin board title.

\n", + "link": "bulletin-board/title", + "component": "BulletinBoard", + "findIntroStr": "BulletinBoard bulletin board component, which displays the information that needs to be paid attention to.", + "demoId": "title" + }, + { + "title": "Default Activated Tab", + "content": "

You can set the default active tab by active-name, starting from 1.

\n", + "link": "bulletin-board/active-name", + "component": "BulletinBoard", + "findIntroStr": "BulletinBoard bulletin board component, which displays the information that needs to be paid attention to.", + "demoId": "active-name" + }, + { + "title": "Tab Title", + "content": "

You can customize the tab title by using the tab-title attribute.

\n", + "link": "bulletin-board/tab-title", + "component": "BulletinBoard", + "findIntroStr": "BulletinBoard bulletin board component, which displays the information that needs to be paid attention to.", + "demoId": "tab-title" + }, + { + "title": "URL-based redirection", + "content": "

The URL-based redirection is based on the url and target fields in the data.

\n", + "link": "bulletin-board/url", + "component": "BulletinBoard", + "findIntroStr": "BulletinBoard bulletin board component, which displays the information that needs to be paid attention to.", + "demoId": "url" + }, + { + "title": "Route-based redirection", + "content": "

Route-based redirection is performed based on the route field in the data.

\n", + "link": "bulletin-board/route", + "component": "BulletinBoard", + "findIntroStr": "BulletinBoard bulletin board component, which displays the information that needs to be paid attention to.", + "demoId": "route" + }, + { + "title": "Show More links", + "content": "

You can use more-link to display and set more links. show-more Sets whether to display the More button. The default value is true.

\n", + "link": "bulletin-board/more-link", + "component": "BulletinBoard", + "findIntroStr": "BulletinBoard bulletin board component, which displays the information that needs to be paid attention to.", + "demoId": "more-link" + }, + { + "title": "User-defined bulletin prefix", + "content": "

You can use icon to customize the new bulletin prefix icon.

\n", + "link": "bulletin-board/icon", + "component": "BulletinBoard", + "findIntroStr": "BulletinBoard bulletin board component, which displays the information that needs to be paid attention to.", + "demoId": "icon" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/button-group.json b/examples/docs/resources/pc/demo-config/en-US/button-group.json new file mode 100644 index 000000000..a92d9d136 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/button-group.json @@ -0,0 +1,82 @@ +[ + { + "title": "Basic Usage", + "content": "

Use v-model to set the default selected button and implement bidirectional binding. You can also set the default selected button through value, but bidirectional binding cannot be performed.

\n", + "link": "button-group/base", + "component": "ButtonGroup", + "findIntroStr": "A button group is used for multiple similar operations.", + "demoId": "base" + }, + { + "title": "button group data", + "content": "

Sets the button group data through the data attribute. In the object, text is the button display text, and value is the value specified during bidirectional binding.

\n", + "link": "button-group/data", + "component": "Buttongroup", + "findIntroStr": "A button group is used for multiple similar operations.", + "demoId": "data" + }, + { + "title": "Set Component Size", + "content": "

can be set to medium, small, mini

\n", + "link": "button-group/size", + "component": "ButtonGroup", + "findIntroStr": "A button group is used for multiple similar operations.", + "demoId": "size" + }, + { + "title": "Disabled", + "content": "

Set disabled to true to disable the entire button group.

\n", + "link": "button-group/disabled", + "component": "Buttongroup", + "findIntroStr": "A button group is used for multiple similar operations.", + "demoId": "disabled" + }, + { + "title": "Simple button", + "content": "

Set plain to true to display the simple button style.

\n", + "link": "button-group/plain", + "component": "Buttongroup", + "findIntroStr": "A button group is used for multiple similar operations.", + "demoId": "plain" + }, + { + "title": "Data Field Mapping", + "content": "

If the fields in the button group data object are not the default text and value, the text-field and value-field attributes can be used for mapping.

\n", + "link": "button-group/text-value-field", + "component": "Buttongroup", + "findIntroStr": "A button group is used for multiple similar operations.", + "demoId": "text-value-field" + }, + { + "title": "Display More Buttons", + "content": "

Set the show-more attribute to a value greater than 0 and less than the button group data to display more buttons.

\n", + "link": "button-group/show-more", + "component": "Buttongroup", + "findIntroStr": "A button group is used for multiple similar operations.", + "demoId": "show-more" + }, + { + "title": "Display Edit Button", + "content": "

Set show-edit to true to display the edit button.

\n", + "link": "button-group/show-edit", + "component": "Buttongroup", + "findIntroStr": "A button group is used for multiple similar operations.", + "demoId": "show-edit" + }, + { + "title": "Edit Event", + "content": "

The edit event is triggered when the value of the check box is changed.

\n", + "link": "button-group/event-edit", + "component": "Buttongroup", + "findIntroStr": "A button group is used for multiple similar operations.", + "demoId": "event-edit" + }, + { + "title": "Default slot", + "content": "

When the default slot mode is used, the data, text-field, value-field, value / v-model, and size attributes of the ButtonGroup do not take effect for buttons in the slot. \n However, you can set different attributes for different buttons on the Button component tag based on the application scenario. For details, see Button Component Attributes.

\n", + "link": "button-group/slot-default", + "component": "Buttongroup", + "findIntroStr": "A button group is used for multiple similar operations.", + "demoId": "slot-default" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/button.json b/examples/docs/resources/pc/demo-config/en-US/button.json new file mode 100644 index 000000000..8326dd606 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/button.json @@ -0,0 +1,114 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "button/base", + "component": "Button", + "findIntroStr": "Common operation buttons, including default buttons, icon buttons, picture buttons, and drop-down buttons.", + "demoId": "base" + }, + { + "title": "Icon Button", + "content": "

Specify the icon attribute value to display the icon as an icon button.

\n

Icon Icon Usage

\n

Import the required Icon from @opentiny/vue-icon, initialize the Icon component in the data function, and assign a value to an attribute. Use the icon attribute to reference the template. \n Use native-type to set the form type of the button and image buttons. This attribute is used only when type is set to button or image. The optional values of this attribute are button / submit / reset.

\n
\n", + "link": "button/icon", + "component": "Button", + "findIntroStr": "Common operation buttons, including default buttons, icon buttons, picture buttons, and drop-down buttons.", + "demoId": "icon" + }, + { + "title": "Text button", + "content": "

Set the type attribute to text, which is a text button. You can set the content to be displayed at the tag child level or through the text attribute.

\n", + "link": "button/text", + "component": "Button", + "findIntroStr": "Common operation buttons, including default buttons, icon buttons, picture buttons, and drop-down buttons.", + "demoId": "text" + }, + { + "title": "Button Fillet", + "content": "

The round attribute is used to set whether to round the button.

\n", + "link": "button/round", + "component": "Button", + "findIntroStr": "Common operation buttons, including default buttons, icon buttons, picture buttons, and drop-down buttons.", + "demoId": "round" + }, + { + "title": "Picture button", + "content": "

Embeds the img tag with the default slot usage and introduces the image.

\n", + "link": "button/image", + "component": "Button", + "findIntroStr": "Common operation buttons, including default buttons, icon buttons, picture buttons, and drop-down buttons.", + "demoId": "image" + }, + { + "title": "Theme Style", + "content": "

You can set different theme styles through the type attribute, including primary, success, info, warning, danger, and text.

\n", + "link": "button/type", + "component": "Button", + "findIntroStr": "Common operation buttons, including default buttons, icon buttons, picture buttons, and drop-down buttons.", + "demoId": "type" + }, + { + "title": "Display Loading", + "content": "

Set loading to true to display the style being loaded.

\n", + "link": "button/loading", + "component": "Button", + "findIntroStr": "Common operation buttons, including default buttons, icon buttons, picture buttons, and drop-down buttons.", + "demoId": "loading" + }, + { + "title": "Dimension", + "content": "

Use the size attribute to set the button size, including large, medium, small, and mini. If this parameter is not set, the default size is used.

\n", + "link": "button/size", + "component": "Button", + "findIntroStr": "Common operation buttons, including default buttons, icon buttons, picture buttons, and drop-down buttons.", + "demoId": "size" + }, + { + "title": "Round Button", + "content": "

Set the circle attribute to true. The button is displayed as a round button.

\n", + "link": "button/circle", + "component": "Button", + "findIntroStr": "Common operation buttons, including default buttons, icon buttons, picture buttons, and drop-down buttons.", + "demoId": "circle" + }, + { + "title": "Simple button", + "content": "

Set the plain attribute to true. The button is displayed as a simple button.

\n", + "link": "button/plain", + "component": "Button", + "findIntroStr": "Common operation buttons, including default buttons, icon buttons, picture buttons, and drop-down buttons.", + "demoId": "plain" + }, + { + "title": "Prevent repeated submission of forms", + "content": "

You can use the reset-time attribute to set the duration for which the button is disabled. The default duration is 1000 ms. \n This parameter can be used to prevent repeated submission of the form when you click the button continuously.

\n", + "link": "button/reset-time", + "component": "Button", + "findIntroStr": "Common operation buttons, including default buttons, icon buttons, picture buttons, and drop-down buttons.", + "demoId": "reset-time" + }, + { + "title": "Default Focus", + "content": "

The autofocus attribute button is displayed in the focused state by default.

\n", + "link": "button/autofocus", + "component": "Button", + "findIntroStr": "Common operation buttons, including default buttons, icon buttons, picture buttons, and drop-down buttons.", + "demoId": "autofocus" + }, + { + "title": "Event", + "content": "Click event of the

button. In this example, a message is displayed when a button is clicked.

\n", + "link": "button/click", + "component": "Button", + "findIntroStr": "Common operation buttons, including default buttons, icon buttons, picture buttons, and drop-down buttons.", + "demoId": "click" + }, + { + "title": "Dynamic Disable Button", + "content": "

After disabled is set to true, the button can be disabled.

\n", + "link": "button/dynamic-disabled", + "component": "Button", + "findIntroStr": "Common operation buttons, including default buttons, icon buttons, picture buttons, and drop-down buttons.", + "demoId": "dynamic-disabled" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/calendar.json b/examples/docs/resources/pc/demo-config/en-US/calendar.json new file mode 100644 index 000000000..64aad3e6c --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/calendar.json @@ -0,0 +1,50 @@ +[ + { + "title": "Basic Usage", + "content": "

By default, each day of the current month is displayed in the form of month.

\n", + "link": "calendar/basic-usage", + "component": "Calendar", + "findIntroStr": "Container for displaying data in calendar format.", + "demoId": "basic-usage" + }, + { + "title": "Display mode", + "content": "

The mode attribute specifies that each month of the current year is displayed. The options are year and month.

\n", + "link": "calendar/calendar-mode", + "component": "Calendar", + "findIntroStr": "Container for displaying data in calendar format.", + "demoId": "calendar-mode" + }, + { + "title": "Display Selected Date", + "content": "

When the date is displayed in the format of month, the selected date is displayed above the calendar box after the show-selected attribute is specified and the date cell is clicked.

\n", + "link": "calendar/show-selected-date", + "component": "Calendar", + "findIntroStr": "Container for displaying data in calendar format.", + "demoId": "show-selected-date" + }, + { + "title": "Custom Date Cell", + "content": "

Customize the date cell through the scope slot day.

\n", + "link": "calendar/custom-day-cell", + "component": "Calendar", + "findIntroStr": "Container for displaying data in calendar format.", + "demoId": "custom-day-cell" + }, + { + "title": "Custom Toolbar", + "content": "

Customize the required toolbar through the scope slot tool.

\n", + "link": "calendar/custom-calendar-toolbar", + "component": "Calendar", + "findIntroStr": "Container for displaying data in calendar format.", + "demoId": "custom-calendar-toolbar" + }, + { + "title": "Add Schedule Event", + "content": "

You can use the events attribute to specify the event list. It is an object array that contains the following fields:

\n

events Description

\n

time: specifies the date of the event to be displayed.\ntitle: Specifies the event title. \ncontent: specifies the event content. type: specifies the theme of the dialog box that displays the event content when you hover the cursor over the event title. The options are warning, error, info, and success

\n
\n", + "link": "calendar/dynamic-add-schedule", + "component": "Calendar", + "findIntroStr": "Container for displaying data in calendar format.", + "demoId": "dynamic-add-schedule" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/carousel.json b/examples/docs/resources/pc/demo-config/en-US/carousel.json new file mode 100644 index 000000000..3ef80fb89 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/carousel.json @@ -0,0 +1,98 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "carousel/basic-usage", + "component": "Carousel Horse Lantern", + "findIntroStr": "This mode is used to display a group of pictures or cards in carousel mode. When the content space is insufficient, you can store the pictures or cards in carousel mode.", + "demoId": "basic-usage" + }, + { + "title": "Indicator and Trigger Mode", + "content": "

The walk indicator is displayed on the slide by default. After indicator-position is set to outside, the indicator is displayed outside. \n Set trigger to click. You can change the indicator triggering mode to click. By default, when you hover the cursor over an indicator, the slideshow is switched accordingly.

\n", + "link": "carousel/indicator-trigger", + "component": "Carousel Horse Lantern", + "findIntroStr": "This mode is used to display a group of pictures or cards in carousel mode. When the content space is insufficient, you can store the pictures or cards in carousel mode.", + "demoId": "indicator-trigger" + }, + { + "title": "Manual Carousel", + "content": "

Invoke the setActiveItem(), next(), and prev() methods to perform NVOD as required. The initial-index property specifies the slide index that is initially activated.

\n", + "link": "carousel/manual-play", + "component": "Carousel Horse Lantern", + "findIntroStr": "This mode is used to display a group of pictures or cards in carousel mode. When the content space is insufficient, you can store the pictures or cards in carousel mode.", + "demoId": "manual-play" + }, + { + "title": "Disable cyclic NVOD.", + "content": "

After the loop attribute is set to false, if the slide is switched to the last item, the slide cannot be switched cyclically from the first item. That is, when switching to the last item, the right toggle arrow is no longer displayed, and when switching to the first item, the left toggle arrow is no longer displayed.

\n", + "link": "carousel/close-loop", + "component": "Carousel Horse Lantern", + "findIntroStr": "This mode is used to display a group of pictures or cards in carousel mode. When the content space is insufficient, you can store the pictures or cards in carousel mode.", + "demoId": "close-loop" + }, + { + "title": "Automatic switchover", + "content": "

After autoplay is set to true, the slide content of the walk-through is automatically switched in rotation.

\n", + "link": "carousel/autoplay", + "component": "Carousel Horse Lantern", + "findIntroStr": "This mode is used to display a group of pictures or cards in carousel mode. When the content space is insufficient, you can store the pictures or cards in carousel mode.", + "demoId": "autoplay" + }, + { + "title": "NVOD Interval", + "content": "

The interval is 3000 ms by default, which can be customized through the interval attribute.

\n", + "link": "carousel/play-interval", + "component": "Carousel Horse Lantern", + "findIntroStr": "This mode is used to display a group of pictures or cards in carousel mode. When the content space is insufficient, you can store the pictures or cards in carousel mode.", + "demoId": "play-interval" + }, + { + "title": "vertical carousel", + "content": "

Set type to vertical to implement vertical rotation.

\n", + "link": "carousel/up-down-carousel", + "component": "Carousel Horse Lantern", + "findIntroStr": "This mode is used to display a group of pictures or cards in carousel mode. When the content space is insufficient, you can store the pictures or cards in carousel mode.", + "demoId": "up-down-carousel" + }, + { + "title": "Display Title", + "content": "

Use title to configure the display title. This parameter must be used together with show-title.

\n", + "link": "carousel/show-title", + "component": "Carousel Horse Lantern", + "findIntroStr": "This mode is used to display a group of pictures or cards in carousel mode. When the content space is insufficient, you can store the pictures or cards in carousel mode.", + "demoId": "show-title" + }, + { + "title": "Always show the switch arrow", + "content": "For details, see the following example.", + "link": "carousel/carousel-arrow-always", + "component": "Carousel Horse Lantern", + "findIntroStr": "This mode is used to display a group of pictures or cards in carousel mode. When the content space is insufficient, you can store the pictures or cards in carousel mode.", + "demoId": "carousel-arrow-always" + }, + { + "title": "The switch arrow is displayed during Hover.", + "content": "For details, see the following example.", + "link": "carousel/carousel-arrow-hover", + "component": "Carousel Horse Lantern", + "findIntroStr": "This mode is used to display a group of pictures or cards in carousel mode. When the content space is insufficient, you can store the pictures or cards in carousel mode.", + "demoId": "carousel-arrow-hover" + }, + { + "title": "Hide the switch arrow", + "content": "For details, see the following example.", + "link": "carousel/carousel-arrow-never", + "component": "Carousel Horse Lantern", + "findIntroStr": "This mode is used to display a group of pictures or cards in carousel mode. When the content space is insufficient, you can store the pictures or cards in carousel mode.", + "demoId": "carousel-arrow-never" + }, + { + "title": "Card Mode", + "content": "

After the type attribute is set to card, the lantern is displayed as a card.

\n", + "link": "carousel/card-mode", + "component": "Carousel Horse Lantern", + "findIntroStr": "This mode is used to display a group of pictures or cards in carousel mode. When the content space is insufficient, you can store the pictures or cards in carousel mode.", + "demoId": "card-mode" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/cascader-panel.json b/examples/docs/resources/pc/demo-config/en-US/cascader-panel.json new file mode 100644 index 000000000..f5445cfb2 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/cascader-panel.json @@ -0,0 +1,42 @@ +[ + { + "title": "Basic Usage", + "content": "

Use options to specify options. You can also use props to set functions such as multiple selection and dynamic loading. For details, see the API table below.

\n", + "link": "cascader-panel/basic-usage", + "component": "CascaderPanel", + "findIntroStr": "Like the cascading selector, the cascading panel has multiple functions, such as single selection, multiple selection, and dynamic loading.", + "demoId": "basic-usage" + }, + { + "title": "Selected node changes", + "content": "

The event is triggered after a node is clicked through change. The callback parameter is the value of the selected node.\nYou can clear the selected node through clearCheckedNodes. \n Obtain the selected node through getCheckedNodes.

\n", + "link": "cascader-panel/change", + "component": "CascaderPanel", + "findIntroStr": "Like the cascading selector, the cascading panel has multiple functions, such as single selection, multiple selection, and dynamic loading.", + "demoId": "change" + }, + { + "title": "The expanded node changes.", + "content": "

This event is triggered when you click expand-change to expand a node. The callback parameter is an array consisting of parent option values

\n", + "link": "cascader-panel/expand-change", + "component": "CascaderPanel", + "findIntroStr": "Like the cascading selector, the cascading panel has multiple functions, such as single selection, multiple selection, and dynamic loading.", + "demoId": "expand-change" + }, + { + "title": "Custom Node Content", + "content": "

You can use scoped slot to customize the node content of the options of the cascading panel. scoped slot transfers two fields: node and data, indicating the node object and data of the current node, respectively.

\n", + "link": "cascader-panel/custom-option-content", + "component": "CascaderPanel", + "findIntroStr": "Like the cascading selector, the cascading panel has multiple functions, such as single selection, multiple selection, and dynamic loading.", + "demoId": "custom-option-content" + }, + { + "title": "Props Options", + "content": "

Props

\n

specifies child options with children. The default value is children. \n Indicates whether to return an array consisting of the values of the menus where the node is located through emitPath. \n Use label to specify the label value of the display option. The default value is label. \n Use value to specify the value of the value option. The default value is value

\n
\n", + "link": "cascader-panel/cascader-panel-props", + "component": "CascaderPanel", + "findIntroStr": "Like the cascading selector, the cascading panel has multiple functions, such as single selection, multiple selection, and dynamic loading.", + "demoId": "cascader-panel-props" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/cascader.json b/examples/docs/resources/pc/demo-config/en-US/cascader.json new file mode 100644 index 000000000..d660344ba --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/cascader.json @@ -0,0 +1,178 @@ +[ + { + "title": "Basic Usage", + "content": "

Renders a cascade selector by specifying an array of options with the options attribute.

\n", + "link": "cascader/basic-usage", + "component": "Cascader cascading selector", + "findIntroStr": "When a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "basic-usage" + }, + { + "title": "Hover Triggering Submenu", + "content": "

You can use props.expandTrigger to specify the triggering mode of expanding a submenu as hover. The default triggering mode is click.

\n", + "link": "cascader/expand-trigger", + "component": "Cascader cascading selector", + "findIntroStr": "When a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "expand-trigger" + }, + { + "title": "Disable Options", + "content": "

declares that this option is disabled by setting the disabled field in the data source, in this case, The first element in the array specified by options contains a disabled: true key-value pair and is therefore disabled. By default, Cascader checks whether the disabled field of each item in the data is true. If the name of the field that indicates the disabled meaning in your data is not disabled, you can use the props.disabled property to specify it. For details, see the API table of Cascader Props. Certainly, value, label, and children may also be specified in the same way.

\n", + "link": "cascader/disabled-items", + "component": "Cascader cascading selector", + "findIntroStr": "When a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "disabled-items" + }, + { + "title": "Specify Attribute Value", + "content": "

Sets the attribute value mapping through the props attribute.

\n", + "link": "cascader/disabled-items", + "component": "Cascader cascading selector", + "findIntroStr": "When a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "disabled-items1" + }, + { + "title": "Can be cleared", + "content": "

You can clear the text box by setting the clearable attribute.

\n", + "link": "cascader/clearable", + "component": "Cascader cascading selector", + "findIntroStr": "When a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "clearable" + }, + { + "title": "Separator", + "content": "

Set the separator through the separator attribute.

\n", + "link": "cascader/clearable", + "component": "Cascader cascading selector", + "findIntroStr": "When a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "clearable1" + }, + { + "title": "Dimension", + "content": "

Sets the size through the size attribute.

\n", + "link": "cascader/clearable", + "component": "Cascader cascading selector", + "findIntroStr": "When a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "clearable2" + }, + { + "title": "Multiple Choices", + "content": "

Use props.multiple = true to enable the multi-selection mode.

\n", + "link": "cascader/default-multiple", + "component": "Cascader cascading selector", + "findIntroStr": "When a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "default-multiple" + }, + { + "title": "Fold Tag", + "content": "

After the multi-selection mode is enabled, tags of all selected options are displayed by default. You can use collapse-tags to collapse tags. \n Use disabled to set whether to disable the component. The default value is false.

\n", + "link": "cascader/collapse-tags", + "component": "Cascader cascading selector", + "findIntroStr": "When a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "collapse-tags" + }, + { + "title": "The parent and child levels are not associated.", + "content": "

The props.checkStrictly = true is used to set the association between the parent and child nodes. In this way, any level of options can be selected. In the default single-choice mode, only leaf nodes can be selected.

\n", + "link": "cascader/check-strictly", + "component": "Cascader cascading selector", + "findIntroStr": "When a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "check-strictly" + }, + { + "title": "Select any level of options from multiple options.", + "content": "

In multi-selection mode, cancel the association between parent and child nodes and select any level of options.

\n", + "link": "cascader/check-strictly-multiple", + "component": "Cascader cascading selector", + "findIntroStr": "When a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "check-strictly-multiple" + }, + { + "title": "Dynamic loading", + "content": "

When a level is selected, the options under the level are dynamically loaded. Use lazy in the props attribute to enable dynamic loading, and use lazyload to set the method for loading data sources. The lazyload method has two parameters. The first parameter node is the node that is clicked currently, and the second parameter resolve is the callback for data loading completion (mandatory). To display the status of a node more accurately, a flag bit indicating whether the node is a leaf node may be added to the node data. (The default field is leaf, which can be modified using props.leaf.) Otherwise, the system determines whether a node is a leaf node based on whether there are subnodes.

\n", + "link": "cascader/auto-load", + "component": "Cascader cascading selector", + "findIntroStr": "When a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "auto-load" + }, + { + "title": "Dynamic loading with no parent-child association", + "content": "

When a level is selected, the options under the level are dynamically loaded. Use lazy in the props attribute to enable dynamic loading, and use lazyload to set the method for loading data sources. Use checkStrictly in the props attribute to enable parent-child disassociation.

\n", + "link": "cascader/auto-load-checkStrictly", + "component": "Cascader cascading selector", + "findIntroStr": "When a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "auto-load-checkStrictly" + }, + { + "title": "Specify Options", + "content": "

Props

\n

uses children to specify the sub-option of the option. The default value is children. \n Use value to specify the value of a specified option. The default value is value. \nUse label to specify the option label. The default value is label.

\n
\n", + "link": "cascader/props-children", + "component": "Cascader cascading selector", + "findIntroStr": "When a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "props-children" + }, + { + "title": "Searchable", + "content": "

Set filterable to true to enable the search function. By default, the label of the node or the options containing the input value in label of all parent nodes (determined by show-all-levels). emptyContent displayed when no matching option

\n", + "link": "cascader/filterable", + "component": "Cascader cascading selector", + "findIntroStr": "If a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "filterable" + }, + { + "title": "Search Delay", + "content": "For details, see the following example.", + "link": "cascader/filterable", + "component": "Cascader cascading selector", + "findIntroStr": "If a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "filterable2" + }, + { + "title": "Multiple choices can be searched", + "content": "

Enable the search function in multi-choice mode.

\n", + "link": "cascader/filterable-multiple", + "component": "Cascader cascading selector", + "findIntroStr": "If a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "filterable-multiple" + }, + { + "title": "Customized search logic", + "content": "

filter-method customizes the search logic. The first parameter is node, and the second parameter is keyword. A Boolean value is returned to indicate whether the search is hit. To select a parent, set props.checkStrictly = true to deselect the parent and child nodes. In this way, the purpose of selecting any level of option is achieved. In the default single-choice mode, only leaf nodes can be selected.

\n", + "link": "cascader/filter-method", + "component": "Cascader cascading selector", + "findIntroStr": "If a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "filter-method" + }, + { + "title": "Placeholder Text", + "content": "For details, see the following example.", + "link": "cascader/filterable-multiple", + "component": "Cascader cascading selector", + "findIntroStr": "If a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "filterable-multiple1" + }, + { + "title": "Only the last level is displayed.", + "content": "

The show-all-levels attribute defines whether to display the complete path. If it is set to false, only the last level is displayed. The default value is true, indicating that the full path of the selected item is displayed.

\n", + "link": "cascader/show-all-levels", + "component": "Cascader cascading selector", + "findIntroStr": "If a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "show-all-levels" + }, + { + "title": "Event", + "content": "

Cascader cascade selector events include: change, expand-change, blur, focus, < code>visible-change.

\n", + "link": "cascader/events", + "component": "Cascader cascading selector", + "findIntroStr": "If a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "events" + }, + { + "title": "Data type returned by a node", + "content": "For details, see the following example.", + "link": "cascader/events", + "component": "Cascader cascading selector", + "findIntroStr": "If a data set has a clear hierarchy, you can use the cascading selector to view and select a data set level by level.", + "demoId": "events1" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-attributes-demo.json b/examples/docs/resources/pc/demo-config/en-US/chart-attributes-demo.json new file mode 100644 index 000000000..520e022c2 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-attributes-demo.json @@ -0,0 +1,98 @@ +[ + { + "title": "Attribute Configuration Example", + "content": "

If an attribute does not take effect after being added or removed, it is likely that the corresponding module is not introduced. For example,

\n

When using the dataZoom component, you need to import the dataZoom module resource import'echarts/lib/component/dataZoom'.

\n
\n

1 Setting the Region Scaling Component

\n

You can run the init-options command to configure the additional initialization parameters of the component. For details, see the document

\n", + "link": "chart/props/demo10", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "props-demo10" + }, + { + "title": "1 Setting the Region Zoom Component", + "content": "For details, see the following example.", + "link": "chart/props/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "props-base" + }, + { + "title": "2 Set the extend configuration item", + "content": "For details, see the following example.", + "link": "chart/props/demo12", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "props-demo12" + }, + { + "title": "3 Modify the color list", + "content": "For details, see the following example.", + "link": "chart/props/demo4", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "props-demo4" + }, + { + "title": "4 Set the status of no data.", + "content": "For details, see the following example.", + "link": "chart/props/demo5", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "props-demo5" + }, + { + "title": "5 Add Custom Content", + "content": "For details, see the following example.", + "link": "chart/props/demo6", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "props-demo6" + }, + { + "title": "6 Hide dialog box and legend", + "content": "For details, see the following example.", + "link": "chart/props/demo7", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "props-demo7" + }, + { + "title": "7 Set chart container style", + "content": "For details, see the following example.", + "link": "chart/props/demo8", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "props-demo8" + }, + { + "title": "8 Set the chart line and punctuation point", + "content": "For details, see the following example.", + "link": "chart/props/demo9", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "props-demo9" + }, + { + "title": "9 Setting the Visual Mapping Component", + "content": "For details, see the following example.", + "link": "chart/props/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "props-demo2" + }, + { + "title": "10 Set the afterConfig function", + "content": "For details, see the following example.", + "link": "chart/props/demo11", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "props-demo11" + }, + { + "title": "11 Setting Toolbox", + "content": "For details, see the following example.", + "link": "chart/props/demo3", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "props-demo3" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-attributes.json b/examples/docs/resources/pc/demo-config/en-US/chart-attributes.json new file mode 100644 index 000000000..fe51488c7 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-attributes.json @@ -0,0 +1 @@ +[] diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-autonavi-map.json b/examples/docs/resources/pc/demo-config/en-US/chart-autonavi-map.json new file mode 100644 index 000000000..e83aab59d --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-autonavi-map.json @@ -0,0 +1,10 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts. AutoNavi Map requires the access permission from the external network. \n

\n", + "link": "chart/amap/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "amap-base" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-baidu-map.json b/examples/docs/resources/pc/demo-config/en-US/chart-baidu-map.json new file mode 100644 index 000000000..1aeb6f479 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-baidu-map.json @@ -0,0 +1,10 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts. \n Baidu Map requires the external network access permission. \n

\n", + "link": "chart/bmap/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "bmap-base" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-bar.json b/examples/docs/resources/pc/demo-config/en-US/chart-bar.json new file mode 100644 index 000000000..0368fbe99 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-bar.json @@ -0,0 +1,58 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts.

\n", + "link": "chart/bar/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "bar-base" + }, + { + "title": "Specify Indicator Dimension", + "content": "For details, see the following example.", + "link": "chart/bar/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "bar-demo2" + }, + { + "title": "Sort Bar", + "content": "For details, see the following example.", + "link": "chart/bar/demo3", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "bar-demo3" + }, + { + "title": "The bar axis is configured with two y-axises.", + "content": "For details, see the following example.", + "link": "chart/bar/demo4", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "bar-demo4" + }, + { + "title": "Set legend alias", + "content": "For details, see the following example.", + "link": "chart/bar/demo5", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "bar-demo5" + }, + { + "title": "Stack Bar", + "content": "For details, see the following example.", + "link": "chart/bar/demo6", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "bar-demo6" + }, + { + "title": "Set the vertical axis to a continuous value axis.", + "content": "For details, see the following example.", + "link": "chart/bar/demo7", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "bar-demo7" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-boxplot.json b/examples/docs/resources/pc/demo-config/en-US/chart-boxplot.json new file mode 100644 index 000000000..5879f90d3 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-boxplot.json @@ -0,0 +1,26 @@ +[ + { + "title": "Basic Usage", + "content": "

Boxplot Chinese can be called box diagram, box diagram. A statistical chart used to show a set of data dispersion. It displays the maximum, minimum, median, lower quartile, and upper quartile of a set of data.

\n", + "link": "chart/boxplot/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "boxplot-base" + }, + { + "title": "Multi-data display", + "content": "

boxplot provides the data conversion method prepareBoxplotData to convert source data into {axisData: [...], boxData: [...], outliers: [...]} formatted data.

\n", + "link": "chart/boxplot/multiple", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "boxplot-multiple" + }, + { + "title": "vertical display", + "content": "

The extend attribute is used to configure the echarts mode.

\n", + "link": "chart/boxplot/vertical", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "boxplot-vertical" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-candle.json b/examples/docs/resources/pc/demo-config/en-US/chart-candle.json new file mode 100644 index 000000000..309b8b990 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-candle.json @@ -0,0 +1,58 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts.

\n", + "link": "chart/candle/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "candle-base" + }, + { + "title": "Use simplified data format", + "content": "For details, see the following example.", + "link": "chart/candle/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "candle-demo2" + }, + { + "title": "Set the data format", + "content": "For details, see the following example.", + "link": "chart/candle/demo3", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "candle-demo3" + }, + { + "title": "Display MA, VOL", + "content": "For details, see the following example.", + "link": "chart/candle/demo4", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "candle-demo4" + }, + { + "title": "Modify the KQI/KPI Name and Legend Text", + "content": "For details, see the following example.", + "link": "chart/candle/demo5", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "candle-demo5" + }, + { + "title": "Modify the MA display period", + "content": "For details, see the following example.", + "link": "chart/candle/demo6", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "candle-demo6" + }, + { + "title": "Set the dataRoom control", + "content": "For details, see the following example.", + "link": "chart/candle/demo7", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "candle-demo7" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-data-config.json b/examples/docs/resources/pc/demo-config/en-US/chart-data-config.json new file mode 100644 index 000000000..fe51488c7 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-data-config.json @@ -0,0 +1 @@ +[] diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-events.json b/examples/docs/resources/pc/demo-config/en-US/chart-events.json new file mode 100644 index 000000000..0f597a5ce --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-events.json @@ -0,0 +1,10 @@ +[ + { + "title": "Event Listening", + "content": "

A binding event is implemented by transferring an event name and an object of the corresponding callback function. The parameter in the callback function is the echarts module, which can be processed accordingly.

\n

Example

\n", + "link": "chart/events/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "events-base" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-funnel.json b/examples/docs/resources/pc/demo-config/en-US/chart-funnel.json new file mode 100644 index 000000000..53031ec40 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-funnel.json @@ -0,0 +1,58 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts.

\n", + "link": "chart/funnel/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "funnel-base" + }, + { + "title": "Specify Indicator Dimension", + "content": "For details, see the following example.", + "link": "chart/funnel/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "funnel-demo2" + }, + { + "title": "Automatically sorted by value and filtered by value 0", + "content": "For details, see the following example.", + "link": "chart/funnel/demo3", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "funnel-demo3" + }, + { + "title": "Customized sequence funnel chart", + "content": "For details, see the following example.", + "link": "chart/funnel/demo4", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "funnel-demo4" + }, + { + "title": "Funnel chart of a specified data type", + "content": "For details, see the following example.", + "link": "chart/funnel/demo5", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "funnel-demo5" + }, + { + "title": "Modify legend alias funnel chart", + "content": "For details, see the following example.", + "link": "chart/funnel/demo6", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "funnel-demo6" + }, + { + "title": "Pyramid", + "content": "For details, see the following example.", + "link": "chart/funnel/demo7", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "funnel-demo7" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-gauge.json b/examples/docs/resources/pc/demo-config/en-US/chart-gauge.json new file mode 100644 index 000000000..74e629ab3 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-gauge.json @@ -0,0 +1,42 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts.

\n", + "link": "chart/gauge/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "gauge-base" + }, + { + "title": "KQI/KPI Dimension Configuration", + "content": "For details, see the following example.", + "link": "chart/gauge/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "gauge-demo2" + }, + { + "title": "Set Data Type", + "content": "For details, see the following example.", + "link": "chart/gauge/demo3", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "gauge-demo3" + }, + { + "title": "Set the counter alias and unit", + "content": "For details, see the following example.", + "link": "chart/gauge/demo4", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "gauge-demo4" + }, + { + "title": "Set multiple watch faces and modify the style", + "content": "For details, see the following example.", + "link": "chart/gauge/demo5", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "gauge-demo5" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-graph.json b/examples/docs/resources/pc/demo-config/en-US/chart-graph.json new file mode 100644 index 000000000..e8e7f31ad --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-graph.json @@ -0,0 +1,26 @@ +[ + { + "title": "Basic Usage", + "content": "

It can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts. The

\n
\n

diagram supports only the extend configuration. The usage and attributes of the diagram are the same as those of the eCharts. For details, see the

\n
\n", + "link": "chart/graph/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "graph-base" + }, + { + "title": "Graph in Cartesian coordinate system", + "content": "For details, see the following example.", + "link": "chart/graph/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "graph-demo2" + }, + { + "title": "Extend events in the topology view", + "content": "For details, see the following example.", + "link": "chart/graph/demo3", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "graph-demo3" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-heatmap.json b/examples/docs/resources/pc/demo-config/en-US/chart-heatmap.json new file mode 100644 index 000000000..bdeacd3c2 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-heatmap.json @@ -0,0 +1,42 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts.

\n", + "link": "chart/heatmap/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "heatmap-base" + }, + { + "title": "Configure the coordinate axis", + "content": "For details, see the following example.", + "link": "chart/heatmap/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "heatmap-demo2" + }, + { + "title": "Customized visualMap", + "content": "For details, see the following example.", + "link": "chart/heatmap/demo3", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "heatmap-demo3" + }, + { + "title": "Map heat map", + "content": "For details, see the following example.", + "link": "chart/heatmap/demo4", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "heatmap-demo4" + }, + { + "title": "Baidu Map Heat Map", + "content": "

Baidu Map and AutoNavi Map require the external network access permission.\n

\n", + "link": "chart/heatmap/demo5", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "heatmap-demo5" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-histogram.json b/examples/docs/resources/pc/demo-config/en-US/chart-histogram.json new file mode 100644 index 000000000..9d987e865 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-histogram.json @@ -0,0 +1,66 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts.

\n", + "link": "chart/histogram/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "histogram-base" + }, + { + "title": "Set the KQI/KPI dimension to be displayed.", + "content": "For details, see the following example.", + "link": "chart/histogram/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "histogram-demo2" + }, + { + "title": "Set the two y axes", + "content": "For details, see the following example.", + "link": "chart/histogram/demo3", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "histogram-demo3" + }, + { + "title": "Bar chart + Line chart", + "content": "For details, see the following example.", + "link": "chart/histogram/demo4", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "histogram-demo4" + }, + { + "title": "Stacked Bar Chart", + "content": "For details, see the following example.", + "link": "chart/histogram/demo5", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "histogram-demo5" + }, + { + "title": "By default, bar chart data is displayed.", + "content": "For details, see the following example.", + "link": "chart/histogram/demo6", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "histogram-demo6" + }, + { + "title": "Modify Alias", + "content": "For details, see the following example.", + "link": "chart/histogram/demo7", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "histogram-demo7" + }, + { + "title": "Set the horizontal axis to a continuous value axis", + "content": "For details, see the following example.", + "link": "chart/histogram/demo8", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "histogram-demo8" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-line.json b/examples/docs/resources/pc/demo-config/en-US/chart-line.json new file mode 100644 index 000000000..252b9ee6e --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-line.json @@ -0,0 +1,74 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts.

\n", + "link": "chart/line/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "line-base" + }, + { + "title": "Set the KQI/KPI dimension to be displayed", + "content": "For details, see the following example.", + "link": "chart/line/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "line-demo2" + }, + { + "title": "Set the two y axes", + "content": "For details, see the following example.", + "link": "chart/line/demo3", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "line-demo3" + }, + { + "title": "Slant of the horizontal coordinate", + "content": "For details, see the following example.", + "link": "chart/line/demo4", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "line-demo4" + }, + { + "title": "Stack Area Chart", + "content": "For details, see the following example.", + "link": "chart/line/demo5", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "line-demo5" + }, + { + "title": "Set Alias", + "content": "For details, see the following example.", + "link": "chart/line/demo6", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "line-demo6" + }, + { + "title": "Display Indicator Value", + "content": "For details, see the following example.", + "link": "chart/line/demo7", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "line-demo7" + }, + { + "title": "Set the horizontal axis to a continuous value axis", + "content": "For details, see the following example.", + "link": "chart/line/demo8", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "line-demo8" + }, + { + "title": "Set the horizontal axis to a continuous time axis.", + "content": "For details, see the following example.", + "link": "chart/line/demo9", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "line-demo9" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-liquidfill.json b/examples/docs/resources/pc/demo-config/en-US/chart-liquidfill.json new file mode 100644 index 000000000..4af09e91b --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-liquidfill.json @@ -0,0 +1,42 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts.

\n", + "link": "chart/liquidfill/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "liquidfill-base" + }, + { + "title": "Layered water balloon chart", + "content": "For details, see the following example.", + "link": "chart/liquidfill/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "liquidfill-demo2" + }, + { + "title": "Set multiple water balloons", + "content": "For details, see the following example.", + "link": "chart/liquidfill/demo3", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "liquidfill-demo3" + }, + { + "title": "Set the shape of the water balloon chart", + "content": "For details, see the following example.", + "link": "chart/liquidfill/demo4", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "liquidfill-demo4" + }, + { + "title": "Set the text label and style of the water balloon diagram", + "content": "For details, see the following example.", + "link": "chart/liquidfill/demo5", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "liquidfill-demo5" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-map.json b/examples/docs/resources/pc/demo-config/en-US/chart-map.json new file mode 100644 index 000000000..85783c034 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-map.json @@ -0,0 +1,10 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "chart/map/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "map-base" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-pie.json b/examples/docs/resources/pc/demo-config/en-US/chart-pie.json new file mode 100644 index 000000000..882fc7ac5 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-pie.json @@ -0,0 +1,58 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts.

\n", + "link": "chart/pie/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "pie-base" + }, + { + "title": "Set KQI/KPI Dimension", + "content": "For details, see the following example.", + "link": "chart/pie/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "pie-demo2" + }, + { + "title": "Rose", + "content": "For details, see the following example.", + "link": "chart/pie/demo3", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "pie-demo3" + }, + { + "title": "Restrict the number of pie charts to be displayed.", + "content": "For details, see the following example.", + "link": "chart/pie/demo4", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "pie-demo4" + }, + { + "title": "Multi-Round Pie Chart", + "content": "For details, see the following example.", + "link": "chart/pie/demo5", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "pie-demo5" + }, + { + "title": "Set Data Type", + "content": "For details, see the following example.", + "link": "chart/pie/demo6", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "pie-demo6" + }, + { + "title": "Set the radius margin of the pie chart", + "content": "For details, see the following example.", + "link": "chart/pie/demo7", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "pie-demo7" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-question.json b/examples/docs/resources/pc/demo-config/en-US/chart-question.json new file mode 100644 index 000000000..54f08397c --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-question.json @@ -0,0 +1,34 @@ +[ + { + "title": "Frequently Asked Questions", + "content": "

The initial width of the parent element is unknown

\n

When drawing a chart in a container whose initial width is unknown, the chart fails to be drawn because the width cannot be obtained. The solution is to obtain the width after the container width is known. \nInvoke the resize method of echarts. \n cancel-resize-check is used to check whether a component element exists and whether the element has width and height before resize. If no, the component element does not have width and height.

\n", + "link": "chart/question/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "question-base" + }, + { + "title": "The initial width of the parent element is unknown.", + "content": "For details, see the following example.", + "link": "chart/question/demo5", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "question-demo5" + }, + { + "title": "Automatically update the data change view", + "content": "

The chart is developed based on the Vue and also supports bidirectional data binding. If the chart data (chartData.row in the example) is changed, the view is automatically updated.

\n", + "link": "chart/question/demo4", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "question-demo4" + }, + { + "title": "Decimal display precision", + "content": "

When processing data types, two valid digits are reserved by default. However, when the number is small and the percentage type is set, this method may cause display problems, for example,

\n", + "link": "chart/question/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "question-demo2" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-radar.json b/examples/docs/resources/pc/demo-config/en-US/chart-radar.json new file mode 100644 index 000000000..6b717f772 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-radar.json @@ -0,0 +1,26 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts.

\n", + "link": "chart/radar/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "radar-base" + }, + { + "title": "Set the KQI/KPI dimension to be displayed", + "content": "For details, see the following example.", + "link": "chart/radar/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "radar-demo2" + }, + { + "title": "Change KQI/KPI Name", + "content": "For details, see the following example.", + "link": "chart/radar/demo3", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "radar-demo3" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-ring.json b/examples/docs/resources/pc/demo-config/en-US/chart-ring.json new file mode 100644 index 000000000..fcb0210c2 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-ring.json @@ -0,0 +1,58 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts.

\n", + "link": "chart/ring/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "ring-base" + }, + { + "title": "Set KQI/KPI Dimension", + "content": "For details, see the following example.", + "link": "chart/ring/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "ring-demo2" + }, + { + "title": "Rose", + "content": "For details, see the following example.", + "link": "chart/ring/demo3", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "ring-demo3" + }, + { + "title": "Restrict the number of records to be displayed.", + "content": "For details, see the following example.", + "link": "chart/ring/demo4", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "ring-demo4" + }, + { + "title": "Set Data Type", + "content": "For details, see the following example.", + "link": "chart/ring/demo5", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "ring-demo5" + }, + { + "title": "Set ring radius", + "content": "For details, see the following example.", + "link": "chart/ring/demo6", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "ring-demo6" + }, + { + "title": "Set the position of the ring chart title.", + "content": "For details, see the following example.", + "link": "chart/ring/ring-title", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "ring-ring-title" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-sankey.json b/examples/docs/resources/pc/demo-config/en-US/chart-sankey.json new file mode 100644 index 000000000..ce52b7559 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-sankey.json @@ -0,0 +1,18 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts.

\n", + "link": "chart/sankey/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "sankey-base" + }, + { + "title": "Set Data Type", + "content": "For details, see the following example.", + "link": "chart/sankey/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "sankey-demo2" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-scatter.json b/examples/docs/resources/pc/demo-config/en-US/chart-scatter.json new file mode 100644 index 000000000..fe877ea20 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-scatter.json @@ -0,0 +1,66 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts.

\n", + "link": "chart/scatter/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "scatter-base" + }, + { + "title": "Example of a two-dimensional multi-indicator scatter chart", + "content": "For details, see the following example.", + "link": "chart/scatter/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "scatter-demo2" + }, + { + "title": "KQI/KPI Dimension Configuration", + "content": "For details, see the following example.", + "link": "chart/scatter/demo3", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "scatter-demo3" + }, + { + "title": "Data Type Configuration", + "content": "For details, see the following example.", + "link": "chart/scatter/demo4", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "scatter-demo4" + }, + { + "title": "Attribute Name Configuration", + "content": "For details, see the following example.", + "link": "chart/scatter/demo5", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "scatter-demo5" + }, + { + "title": "Zooming Configuration", + "content": "For details, see the following example.", + "link": "chart/scatter/demo6", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "scatter-demo6" + }, + { + "title": "Scatter Style Configuration", + "content": "For details, see the following example.", + "link": "chart/scatter/demo7", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "scatter-demo7" + }, + { + "title": "When the scatter is overwritten, the dialog box can be triggered by the coordinate axis.", + "content": "For details, see the following example.", + "link": "chart/scatter/demo8", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "scatter-demo8" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-sunburst.json b/examples/docs/resources/pc/demo-config/en-US/chart-sunburst.json new file mode 100644 index 000000000..0e79e442c --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-sunburst.json @@ -0,0 +1,18 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts. The

\n
\n

diagram supports only the extend configuration. The usage and attributes of the diagram are the same as those of the eCharts. For details, see the

\n
\n configuration of the eCharts", + "link": "chart/sunburst/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "sunburst-base" + }, + { + "title": "Complex Example", + "content": "For details, see the following example.", + "link": "chart/sunburst/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "sunburst-demo2" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-tree.json b/examples/docs/resources/pc/demo-config/en-US/chart-tree.json new file mode 100644 index 000000000..83bc0d73f --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-tree.json @@ -0,0 +1,42 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts.

\n", + "link": "chart/tree/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "tree-base" + }, + { + "title": "Multi-Tree", + "content": "For details, see the following example.", + "link": "chart/tree/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "tree-demo2" + }, + { + "title": "Radial Tree", + "content": "For details, see the following example.", + "link": "chart/tree/demo3", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "tree-demo3" + }, + { + "title": "Longitudinal tree view", + "content": "For details, see the following example.", + "link": "chart/tree/demo4", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "tree-demo4" + }, + { + "title": "Customized dialog box content", + "content": "For details, see the following example.", + "link": "chart/tree/demo5", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "tree-demo5" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-waterfall.json b/examples/docs/resources/pc/demo-config/en-US/chart-waterfall.json new file mode 100644 index 000000000..9ed7d0ca5 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-waterfall.json @@ -0,0 +1,42 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts.

\n", + "link": "chart/waterfall/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "waterfall-base" + }, + { + "title": "Set KQI/KPI Dimension", + "content": "For details, see the following example.", + "link": "chart/waterfall/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "waterfall-demo2" + }, + { + "title": "Set Data Type", + "content": "For details, see the following example.", + "link": "chart/waterfall/demo3", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "waterfall-demo3" + }, + { + "title": "Change Indicator Name", + "content": "For details, see the following example.", + "link": "chart/waterfall/demo4", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "waterfall-demo4" + }, + { + "title": "Set the total and remaining names", + "content": "For details, see the following example.", + "link": "chart/waterfall/demo5", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "waterfall-demo5" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart-wordcloud.json b/examples/docs/resources/pc/demo-config/en-US/chart-wordcloud.json new file mode 100644 index 000000000..534cf910a --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart-wordcloud.json @@ -0,0 +1,34 @@ +[ + { + "title": "Basic Usage", + "content": "

can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts.

\n", + "link": "chart/wordcloud/base", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "wordcloud-base" + }, + { + "title": "Set the color of the word cloud map", + "content": "For details, see the following example.", + "link": "chart/wordcloud/demo2", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "wordcloud-demo2" + }, + { + "title": "Set the shape of the word cloud map", + "content": "For details, see the following example.", + "link": "chart/wordcloud/demo3", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "wordcloud-demo3" + }, + { + "title": "Set the font size range of the word cloud map", + "content": "For details, see the following example.", + "link": "chart/wordcloud/demo4", + "component": "Chart", + "findIntroStr": "Encapsulated based on eCharts, a pure Javascript chart library.", + "demoId": "wordcloud-demo4" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/chart.json b/examples/docs/resources/pc/demo-config/en-US/chart.json new file mode 100644 index 000000000..e19c693b6 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/chart.json @@ -0,0 +1,10 @@ +[ + { + "title": "Basic Usage", + "content": "

The chart component supports bidirectional data binding, which can run smoothly on PCs and mobile devices and is compatible with most browsers. (Internet Explorer 9/10/11, Chrome, Firefox, Safari, etc.) The bottom layer relies on the lightweight Canvas class library ZRender to provide intuitive, vivid, interactive, and highly personalized data visualization charts. \nYou can use theme to customize themes. \nBaidu Maps and AutoNavi Maps require external network access. \n

\n", + "link": "chart/base", + "component": "Chart", + "findIntroStr": "A pure JavaScript chart library encapsulated based on `eCharts v5.2.1`.", + "demoId": "base" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/checkbox.json b/examples/docs/resources/pc/demo-config/en-US/checkbox.json new file mode 100644 index 000000000..bed9c5c4d --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/checkbox.json @@ -0,0 +1,122 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "checkbox/basic-usage", + "component": "Checkbox check box", + "findIntroStr": "Used to configure options for different scenarios. Users can select multiple options from a group of options.", + "demoId": "basic-usage" + }, + { + "title": "Checkbox Group", + "content": "

Manages multiple checkbox elements into a group through the checkbox-group element. In checkbox-group, use v-model to bind variables of the Array type to implement bidirectional binding. The label attribute of the checkbox is its corresponding value. If there is no content in the tag, the attribute also serves as the introduction after the checkbox. label corresponds to the element value in the array. If the specified value exists, the value is selected. Otherwise, the value is not selected.

\n", + "link": "checkbox/checkbox-group", + "component": "Checkbox check box", + "findIntroStr": "Used to configure options for different scenarios. Users can select multiple options from a group of options.", + "demoId": "checkbox-group" + }, + { + "title": "Profile Checkbox Group", + "content": "

Provides the options attribute. You can render a check box group by configuring object array data. With this attribute, you no longer need to insert the checkbox or checkbox-button element as a slot in the tag. \n\nThe options object array contains three fields: label, text, and events. \n\n The type attribute is also provided, which is used with the options attribute. The default value is checkbox. You can also set this parameter to button. After the configuration, the check box group is displayed as a button.

\n", + "link": "checkbox/group-options", + "component": "Checkbox check box", + "findIntroStr": "Used to configure options for different scenarios. Users can select multiple options from a group of options.", + "demoId": "group-options" + }, + { + "title": "All and Half", + "content": "

After the indeterminate attribute is set to true in the checkbox element, the check box is displayed as half-selected.

\n", + "link": "checkbox/indeterminate", + "component": "Checkbox check box", + "findIntroStr": "Used to configure options for different scenarios. Users can select multiple options from a group of options.", + "demoId": "indeterminate" + }, + { + "title": "Quantity Limit", + "content": "

On the checkbox-group, the min and max attributes can be used to specify the minimum and maximum values of the options that can be selected.

\n", + "link": "checkbox/min-max", + "component": "Checkbox check box", + "findIntroStr": "Used to configure options for different scenarios. Users can select multiple options from a group of options.", + "demoId": "min-max" + }, + { + "title": "Currently selected", + "content": "

Whether to select checked. You can set disabled to disable the component.

\n", + "link": "checkbox/checked", + "component": "Checkbox check box", + "findIntroStr": "Configure options for different scenarios. Users can select multiple options from a group of options.", + "demoId": "checked" + }, + { + "title": "button form check box", + "content": "

Embed checkbox-button into the checkbox-group element to implement a checkbox group in the form of a button. \n Fill color and border color when the checkbox is activated by pressing the fill button. The default value is #409EFF.

\n", + "link": "checkbox/checkbox-button", + "component": "Checkbox check box", + "findIntroStr": "Configure options for different scenarios. Users can select multiple options from a group of options.", + "demoId": "checkbox-button" + }, + { + "title": "vertical layout", + "content": "

Set vertical to true on the checkbox-group element, The checkbox-button or checkbox managed by it is displayed as a vertical layout.

\n", + "link": "checkbox/vertical-checkbox", + "component": "Checkbox check box", + "findIntroStr": "Configure options for different scenarios. Users can select multiple options from a group of options.", + "demoId": "vertical-checkbox" + }, + { + "title": "Dynamicly generate check box groups", + "content": "

The data required by the check box group can be obtained from the background through the request service and then dynamically generated.

\n", + "link": "checkbox/dynamic-create-checkbox", + "component": "Checkbox check box", + "findIntroStr": "Configure options for different scenarios. Users can select multiple options from a group of options.", + "demoId": "dynamic-create-checkbox" + }, + { + "title": "Prompt message when the content exceeds the upper limit", + "content": "

If the introduction text next to the check box exceeds the limit, you can use the Tooltip component to add a prompt. When you hover the cursor over the tooltip component, you can prompt all the contents. \n\n Set the border attribute to true on the checkbox element to display the border.

\n", + "link": "checkbox/content-overflow", + "component": "Checkbox check box", + "findIntroStr": "Configure options for different scenarios. Users can select multiple options from a group of options.", + "demoId": "content-overflow" + }, + { + "title": "Text", + "content": "

Set the text content in the text attribute.\nUse true-label to set the selected value, and false-label to set the unselected value.

\n", + "link": "checkbox/text", + "component": "Checkbox check box", + "findIntroStr": "Configure options for different scenarios. Users can select multiple options from a group of options.", + "demoId": "text" + }, + { + "title": "Text Selection", + "content": "

uses true-label to set the selected value and false-label to set the unselected value.

\n", + "link": "checkbox/button-chek-box", + "component": "Checkbox check box", + "findIntroStr": "Configure options for different scenarios. Users can select multiple options from a group of options.", + "demoId": "button-chek-box" + }, + { + "title": "Dimension", + "content": "

When the check box is a button, you can set the size of the button through the size attribute. The options are medium, small, and mini. \n\n Setting the disabled property on checkbox-button will disable a check button. If the disabled attribute is configured on the checkbox-group tab, all check buttons are disabled.

\n", + "link": "checkbox/with-border", + "component": "Checkbox check box", + "findIntroStr": "Configure options for different scenarios. Users can select multiple options from a group of options.", + "demoId": "with-border" + }, + { + "title": "Event", + "content": "

The change event is triggered when the value of the check box is changed.

\n", + "link": "checkbox/checkbox-events", + "component": "Checkbox check box", + "findIntroStr": "Configure options for different scenarios. Users can select multiple options from a group of options.", + "demoId": "checkbox-events" + }, + { + "title": "Slot", + "content": "

Content of Checkbox

\n", + "link": "checkbox/checkbox-slot", + "component": "Checkbox check box", + "findIntroStr": "Configure options for different scenarios. Users can select multiple options from a group of options.", + "demoId": "checkbox-slot" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/collapse.json b/examples/docs/resources/pc/demo-config/en-US/collapse.json new file mode 100644 index 000000000..78156532b --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/collapse.json @@ -0,0 +1,74 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "collapse/basic-usage", + "component": "Collapse Panel", + "findIntroStr": "You can specify dynamic pages or customized HTML files in the content area. The content area can be expanded and collapsed.", + "demoId": "basic-usage" + }, + { + "title": "Accordion Effect", + "content": "

After accordion is set to true, the collapsed panel displays the accordion effect. \nConfigure v-model to set the currently active panel. (In accordion mode, the binding value type must be string. Otherwise, the binding value type is array.) \nchange event, which is triggered when the current active panel changes. The parameter is the current value.\n Configure the name attribute as the unique identifier of each collapse-item.

\n", + "link": "collapse/accordion", + "component": "Collapse Panel", + "findIntroStr": "You can specify dynamic pages or customized HTML files in the content area. The content area can be expanded and collapsed.", + "demoId": "accordion" + }, + { + "title": "Disabled", + "content": "

When the disabled attribute is set to true on the collapse-item element, the specified collapse panel item is disabled.

\n", + "link": "collapse/dynamic-disable", + "component": "Collapse Panel", + "findIntroStr": "You can specify dynamic pages or customized HTML files in the content area. The content area can be expanded and collapsed.", + "demoId": "dynamic-disable" + }, + { + "title": "Custom Panel Title", + "content": "

Configure the title attribute on the collapse-item element to specify the title of each collapse panel item. However, you can also customize the panel title by using the title slot, for example, adding an icon before the title.

\n", + "link": "collapse/custom-collapse-title", + "component": "Collapse Panel", + "findIntroStr": "You can specify dynamic pages or customized HTML files in the content area. The content area can be expanded and collapsed.", + "demoId": "custom-collapse-title" + }, + { + "title": "Customize the expansion and collapse icon", + "content": "

On the collapse-item element, you can customize the folding icon icon by using the icon slot.

\n", + "link": "collapse/custom-collapse-icon", + "component": "Collapse Panel", + "findIntroStr": "You can specify dynamic pages or customized HTML files in the content area. The content area can be expanded and collapsed.", + "demoId": "custom-collapse-icon" + }, + { + "title": "Fold Panel Event", + "content": "

When the value of the active panel changes, the change event is triggered.

\n", + "link": "collapse/collapse-events", + "component": "Collapse Panel", + "findIntroStr": "You can specify dynamic pages or customized HTML files in the content area. The content area can be expanded and collapsed.", + "demoId": "collapse-events" + }, + { + "title": "Prevent the event of closing the folding panel", + "content": "

:before-close event before closing the folding panel. In the method, return true/false indicates whether the folding panel can be closed.

\n", + "link": "collapse/block-close", + "component": "Collapse Panel", + "findIntroStr": "You can specify dynamic pages or customized HTML files in the content area. The content area can be expanded and collapsed.", + "demoId": "block-close" + }, + { + "title": "Nested Table", + "content": "

Embeds the table through the default slot of the collapse-item element.

\n", + "link": "collapse/nested-grid", + "component": "Collapse Panel", + "findIntroStr": "You can specify dynamic pages or customized HTML files in the content area. The content area can be expanded and collapsed.", + "demoId": "nested-grid" + }, + { + "title": "Nested Form", + "content": "

Embed the form through the default slot of the collapse-item element.

\n", + "link": "collapse/nested-form", + "component": "Collapse Panel", + "findIntroStr": "You can specify dynamic pages or customized HTML files in the content area. The content area can be expanded and collapsed.", + "demoId": "nested-form" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/color.json b/examples/docs/resources/pc/demo-config/en-US/color.json new file mode 100644 index 000000000..3398f831c --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/color.json @@ -0,0 +1,26 @@ +[ + { + "title": "Main Color", + "content": "For details, see the following example.", + "link": "color/main-color", + "component": "Color", + "findIntroStr": "Color", + "demoId": "main-color" + }, + { + "title": "Auxiliary Color", + "content": "For details, see the following example.", + "link": "color/auxiliary-color", + "component": "Color", + "findIntroStr": "Color", + "demoId": "auxiliary-color" + }, + { + "title": "Neutral Color", + "content": "For details, see the following example.", + "link": "color/neutral-color", + "component": "Color", + "findIntroStr": "Color", + "demoId": "neutral-color" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/company.json b/examples/docs/resources/pc/demo-config/en-US/company.json new file mode 100644 index 000000000..ae616c058 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/company.json @@ -0,0 +1,26 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "company/basic-usage", + "component": "Company", + "findIntroStr": "Company gadget, which is used to display and select company names. The options are obtained by configuring the data source.", + "demoId": "basic-usage" + }, + { + "title": "User-defined number of data to be displayed", + "content": "

You can set the maximum number of records displayed in the drop-down list box through the max attribute. clearableIndicates whether to display the Clear button. The default value is true.

\n", + "link": "company/custom-show-num", + "component": "Company", + "findIntroStr": "Company gadget, which is used to display and select company names. The options are obtained by configuring the data source.", + "demoId": "custom-show-num" + }, + { + "title": "Custom Service", + "content": "

You can use the fetch-company attribute to specify a method in which the service customized by the request can be implemented.

\n", + "link": "company/custom-service", + "component": "Company", + "findIntroStr": "Company gadget, which is used to display and select company names. The options are obtained by configuring the data source.", + "demoId": "custom-service" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/container.json b/examples/docs/resources/pc/demo-config/en-US/container.json new file mode 100644 index 000000000..6e4ef0b11 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/container.json @@ -0,0 +1,58 @@ +[ + { + "title": "Default Layout", + "content": "For details, see the following example.", + "link": "container/basic-usage", + "component": "Container dimension", + "findIntroStr": "Container component for layout, which facilitates page layout creation.", + "demoId": "basic-usage" + }, + { + "title": "Simple Layout", + "content": "For details, see the following example.", + "link": "container/simple", + "component": "Container dimension", + "findIntroStr": "Container component for layout, which facilitates page layout creation.", + "demoId": "simple" + }, + { + "title": "Classic Layout", + "content": "For details, see the following example.", + "link": "container/classic", + "component": "Container dimension", + "findIntroStr": "Container component for layout, which facilitates page layout creation.", + "demoId": "classic" + }, + { + "title": "Fashion Layout", + "content": "For details, see the following example.", + "link": "container/fashion", + "component": "Container dimension", + "findIntroStr": "Container component for layout, which facilitates page layout creation.", + "demoId": "fashionid" + }, + { + "title": "Legendary Layout", + "content": "For details, see the following example.", + "link": "container/legend", + "component": "Container dimension", + "findIntroStr": "Container component for layout, which facilitates page layout creation.", + "demoId": "legend" + }, + { + "title": "Custom width and height", + "content": "

Container layout container allows users to control header by setting attributes such as headerHeight, footerHeight, and asideWidth (Header area), footer (bottom area), and aside (left area). The width and height of main (main area) are adaptive.

\n", + "link": "container/custom-with-height", + "component": "Container dimension", + "findIntroStr": "Container component for layout, which facilitates page layout creation.", + "demoId": "custom-with-height" + }, + { + "title": "Switch", + "content": "For details, see the following example.", + "link": "container/custom-container", + "component": "Container dimension", + "findIntroStr": "Container component for layout, which facilitates page layout creation.", + "demoId": "custom-container" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/country.json b/examples/docs/resources/pc/demo-config/en-US/country.json new file mode 100644 index 000000000..bac2d301c --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/country.json @@ -0,0 +1,18 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "country/basic-usage", + "component": "Country", + "findIntroStr": "Country: country/region component, which is used to display and select country/region names. The options are obtained by configuring the data source.", + "demoId": "basic-usage" + }, + { + "title": "Custom Service", + "content": "

You can use the fetch-country attribute to specify a method in which the service customized by the request can be implemented. clearable: indicates whether data can be cleared. The default value is true.

\n", + "link": "country/custom-service", + "component": "Country", + "findIntroStr": "Country: country/region component, which is used to display and select country/region names. The options are obtained by configuring the data source.", + "demoId": "custom-service" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/credit-card-form.json b/examples/docs/resources/pc/demo-config/en-US/credit-card-form.json new file mode 100644 index 000000000..e228d6726 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/credit-card-form.json @@ -0,0 +1,26 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "credit-card-form/basic-usage", + "component": "CreditCardForm", + "findIntroStr": "Change information about credit cards in real time through form input.", + "demoId": "basic-usage" + }, + { + "title": "Background Image", + "content": "

Use background-image to set the credit card background image.

\n", + "link": "credit-card-form/background-image", + "component": "CreditCardForm", + "findIntroStr": "Change information about credit cards in real time through form input.", + "demoId": "background-image" + }, + { + "title": "Event", + "content": "For details, see the following example.", + "link": "credit-card-form/credit-card-form-events", + "component": "CreditCardForm", + "findIntroStr": "Change information about credit cards in real time through form input.", + "demoId": "credit-card-form-events" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/crop.json b/examples/docs/resources/pc/demo-config/en-US/crop.json new file mode 100644 index 000000000..af00e7c9e --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/crop.json @@ -0,0 +1,170 @@ +[ + { + "title": "Basic Usage", + "content": "

The src attribute is used to set the default cropping image source path, and the cropvisible attribute is used to control whether the cropping dialog box is visible.

\n", + "link": "crop/basic-usage", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "basic-usage" + }, + { + "title": "Aspect-to-height ratio of the crop box", + "content": "

You can use the aspect-ratio attribute to set the aspect ratio of the crop box. The default value is 16 / 9. You can also set the aspect ratio of the trim box by calling the setAspectRatio method. \nThe center attribute can be used to set whether the crop frame is in the center of the image.

\n", + "link": "crop/aspect-ratio", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "aspect-ratio" + }, + { + "title": "Minimum width and height of the crop box", + "content": "

Set the minimum width and height of the cropping frame through the min-crop-box-width and min-crop-box-height attributes. After this parameter is set, the width and height of the cropping box cannot be adjusted after the width and height are adjusted to the minimum value. \n Set the minimum width and height of the container through the mmin-container-width and min-container-height attributes.

\n", + "link": "crop/min-crop-box-width-height", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "min-crop-box-width-height" + }, + { + "title": "Do not display the grid background.", + "content": "

When background is set to false, the grid background of the container is not displayed.

\n", + "link": "crop/no-background", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "no-background" + }, + { + "title": "Do not display dotted lines.", + "content": "

Setting guides to false will cancel the dotted line above the crop box.

\n", + "link": "crop/no-guides", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "no-guides" + }, + { + "title": "Do not display modal", + "content": "

Setting modal to false cancels the display of the modal layer above the image below the crop box.

\n", + "link": "crop/no-modal", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "no-modal" + }, + { + "title": "View mode", + "content": "

You can set the view mode of the crop box through the view-mode attribute. There are four options: 0, 1, 2, and 3. The default value is 0.

\n

view-mode option description

\n

0: The crop box can be moved outside the image. \n1: The crop box can only be moved within the image. \n2: The image is not completely covered in the container. A gap may appear on one side when the image is zoomed out. \n3: fills the entire container with an image.

\n
\n", + "link": "crop/view-mode", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "view-mode" + }, + { + "title": "Drag Mode", + "content": "

You can set the drag mode of the crop box through the drag-mode attribute. There are three options: crop, move, and none. The default value is crop.

\n

drag-mode Option Description

\n

crop: After the cropping box is canceled, hold down the left mouse button and drag it in the image area to generate a new cropping box. \nmove: After the cropping box is canceled, hold down the left mouse button to move the image. \nnone: After the crop box is canceled, the image cannot be cropped or moved. \nmovable specifies whether an image can be moved. The default value is true.

\n
\n", + "link": "crop/drag-mode", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "drag-mode" + }, + { + "title": "Automatically Cropped Area", + "content": "

During initialization, the auto-crop-area attribute can be used to set the area of the cropping box. The default value is 0.8. This parameter is valid only when auto-crop is set to true.

\n", + "link": "crop/auto-crop-area", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "auto-crop-area" + }, + { + "title": "Obtain container data", + "content": "

Invoke the getContainerData method to obtain the container size data.

\n", + "link": "crop/get-container-data", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "get-container-data" + }, + { + "title": "Obtain clip box data", + "content": "

Invoke the getCropBoxData method to obtain the position and size of the clip box.

\n", + "link": "crop/get-crop-box-data", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "get-crop-box-data" + }, + { + "title": "Obtain the cropped image data", + "content": "

Invoke the getCroppedCanvas method to obtain the cropped image data. Use the toDataURL method to convert the cropped image data to Base64 image data. Use the toBlob method to generate Blob image data.

\n", + "link": "crop/get-cropped-canvas", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "get-cropped-canvas" + }, + { + "title": "Obtain crop area data", + "content": "

Invoke the getData method to obtain the position and size of the cropping area.

\n", + "link": "crop/get-data", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "get-data" + }, + { + "title": "Obtain Image Data", + "content": "

Invoke the getImageData method to obtain the image position, size, and other related data. To obtain the canvas position and size data, call the getCanvasData method.

\n", + "link": "crop/get-image-data", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "get-image-data" + }, + { + "title": "Replace Image", + "content": "

Invoke the replace method to replace the image src and rebuild the cropper. The rotatable attribute is used to control image rotation. The default value is true.

\n", + "link": "crop/replace-image", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "replace-image" + }, + { + "title": "Enlarge Image", + "content": "For details, see the following example.", + "link": "crop/replace-image", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "replace-image1" + }, + { + "title": "Scale when the mouse wheel is used to zoom in or out an image", + "content": "

zoom-on-wheel attribute is set to true, you can use the wheel-zoom-ratio attribute to set the scaling ratio. The default value is 0.1.

\n", + "link": "crop/wheel-zoom-ratio", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "wheel-zoom-ratio" + }, + { + "title": "Disable the mouse wheel to zoom in or out the image.", + "content": "

After the zoom-on-wheel attribute is set to false, the image cannot be zoomed in or out by scrolling the mouse wheel.

\n", + "link": "crop/zoom-on-wheel", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "zoom-on-wheel" + }, + { + "title": "ready event", + "content": "

When a cropper instance is completely built, the ready event is triggered.

\n", + "link": "crop/event-ready", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "event-ready" + }, + { + "title": "Crop box method event", + "content": "

When a cropper instance is completely built, the disable method is triggered to disable the cropping box. When the enable method is triggered to enable the cropping box

\n", + "link": "crop/crop-meth", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "crop-meth" + }, + { + "title": "Cutout Event", + "content": "

TIP

\n

Description: The cropstart event is triggered when the canvas or clipping box starts to change.\nThe cropmove event is triggered when the canvas or clipping box is changed.\nThe cropen event is triggered when the canvas or clipping box ends. dEvent\nThe crop event is triggered when the canvas or crop box changes. \nThe getCanvasData event is triggered to obtain the position and size data of the canvas (image wrapper)

\n
\n", + "link": "crop/event-about-crop", + "component": "Crop Image Crop", + "findIntroStr": "Crop image cropping, preview, JPG and PNG formats are supported. You can manually adjust the selected avatar area when browsing images.", + "demoId": "event-about-crop" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/currency.json b/examples/docs/resources/pc/demo-config/en-US/currency.json new file mode 100644 index 000000000..233bdfefa --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/currency.json @@ -0,0 +1,34 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "currency/basic-usage", + "component": "Currency", + "findIntroStr": "Currency component, which is used to display and select currency names. The options are obtained by configuring the data source.", + "demoId": "basic-usage" + }, + { + "title": "Disabled", + "content": "

The disabled attribute is used to set whether to disable the component. The default value is false.

\n", + "link": "currency/disable-currency", + "component": "Currency", + "findIntroStr": "Currency component, which is used to display and select currency names. The options are obtained by configuring the data source.", + "demoId": "disable-currency" + }, + { + "title": "Custom Service", + "content": "

You can use the fetch-currency attribute to specify a method in which the service customized by the request can be implemented. \n The clearable attribute is used to set whether data can be cleared. The default value is true.

\n", + "link": "currency/custom-service", + "component": "Currency", + "findIntroStr": "Currency component, which is used to display and select currency names. The options are obtained by configuring the data source.", + "demoId": "custom-service" + }, + { + "title": "Set Component Size", + "content": "

can be set to medium, small, mini

\n", + "link": "currency/size", + "component": "Currency", + "findIntroStr": "Currency component, which is used to display and select currency names. The options are obtained by configuring the data source.", + "demoId": "size" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/date-picker.json b/examples/docs/resources/pc/demo-config/en-US/date-picker.json new file mode 100644 index 000000000..7be9dbe74 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/date-picker.json @@ -0,0 +1,218 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "date-picker/basic-usage", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "basic-usage" + }, + { + "title": "Select the shortcut option of the day band", + "content": "

With the picker-options attribute, which is an object in which you specify an array of shortcuts objects to set shortcut options. In addition, you can set the date when the disabledDate method is disabled as required.

\n", + "link": "date-picker/date-shortcuts", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "date-shortcuts" + }, + { + "title": "Other date units", + "content": "

You can set different date units through the type attribute. In the following example, the date units are week, year, month, and dates.

\n", + "link": "date-picker/other-picker-type", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "other-picker-type" + }, + { + "title": "Time Zone Selection", + "content": "

You can set the time zone of the date selection panel through the show-timezone attribute, and import timezoneData time zone data

\n", + "link": "date-picker/timezone", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "timezone" + }, + { + "title": "Select Date Range", + "content": "

Set type to daterange. You can select a date range. \n Callback that will be executed after the selected date is obtained through onPick. The callback takes effect only when daterange or datetimerange is used. This parameter must be configured in picker-options.

\n", + "link": "date-picker/date-range", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "date-range" + }, + { + "title": "Date Range Shortcut Options", + "content": "

Sets the date range shortcut through the picker-options object. \n firstDayOfWeek. The value ranges from 1 to 7. The default value is 7.

\n", + "link": "date-picker/date-range-shortcuts", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "date-range-shortcuts" + }, + { + "title": "Default Time of the Date Range", + "content": "

When using datetimerange to set the date range, you can use default-time to set the start and end time. The default time is 00:00 on the selected date. 00 as the start and end time. default-time takes an array. Each item in the array is a string. The first item controls the time of the start date and the second item controls the time of the end date.

\n", + "link": "date-picker/default-time-of-range", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "default-time-of-range" + }, + { + "title": "Select Month Range", + "content": "

Set the type attribute to monthrange. You can set the value to a month range.

\n", + "link": "date-picker/month-range", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "month-range" + }, + { + "title": "Month Range Shortcut Options", + "content": "

Also, the picker-options object is used to set the month range shortcut options.

\n", + "link": "date-picker/month-range-shortcuts", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "month-range-shortcuts" + }, + { + "title": "Read-only", + "content": "

Sets whether the calendar component is read-only through the readonly property.

\n", + "link": "date-picker/readonly", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "readonly" + }, + { + "title": "Maximum/Minimum", + "content": "

Configure the picker-options attribute to disable the specified date segment based on the date in the disabledDate method of the object. In this way, the maximum and minimum values are implemented.

\n", + "link": "date-picker/max-min", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "max-min" + }, + { + "title": "Alignment", + "content": "

You can use the align attribute to set the alignment mode between the date selection panel and the text box. The options are left, right, and center. The default value is left.

\n", + "link": "date-picker/align", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "align" + }, + { + "title": "Size Settings", + "content": "

You can set the size of the date text box through the size attribute. The options are medium, small, and mini.

\n", + "link": "date-picker/set-size", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "set-size" + }, + { + "title": "Clear Input", + "content": "

After you select a date, the clear icon is displayed by default when you hover the cursor over the text box. You can click the icon to clear the text box. If clearable is set to false, the clear icon is not displayed and cannot be cleared. The clear-icon property allows you to customize the clear icon.

\n", + "link": "date-picker/about-clear", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "about-clear" + }, + { + "title": "Formatting", + "content": "

uses the format attribute to set the format of the text box, and the value-format attribute to set the format of the bound value. Date Format Attribute List

", + "link": "date-picker/about-format", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "about-format" + }, + { + "title": "timeFormat formatting", + "content": "

Set the time display format of the date selection panel through the time-format attribute

", + "link": "date-picker/time-format", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "time-format" + }, + { + "title": "Customized rear icon", + "content": "

uses the suffix-icon attribute to set the icon behind the date text box. An icon is imported from the @opentiny/vue-icon, initialized, and transferred to the suffix-icon.

\n", + "link": "date-picker/custom-suffix-icon", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "custom-suffix-icon" + }, + { + "title": "Class name of the customized drop-down list box", + "content": "For details, see the following example.", + "link": "date-picker/custom-suffix-icon", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "custom-suffix-icon1" + }, + { + "title": "Select Customized", + "content": "

When the range is selected, the start-placeholder and end-placeholder attributes can specify the placeholders of the start date and end date text boxes, respectively. The range-separator property specifies the separator between the start date and end date input boxes.

\n", + "link": "date-picker/custom-range", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "custom-range" + }, + { + "title": "Select a range to cancel panel linkage", + "content": "

When the range is selected, by default, when you click the previous month or previous year arrow icon in the start date panel, the date in the end date panel is also switched to the previous month or previous year. When you switch the next month or the next year in the end date panel, the start date panel is also linked. However, if unlink-panels is set to true, panels are not associated with each other. When the year and month are changed, the change takes effect only for the current panel.

\n", + "link": "date-picker/unlink-panels", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "unlink-panels" + }, + { + "title": "Default time setting when the selector is enabled", + "content": "

default-value property specifies the date that is selected by default when the date picker panel opens.

\n", + "link": "date-picker/default-value", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "default-value" + }, + { + "title": "The text box cannot be entered.", + "content": "By default, you can enter a date in the

Date text box. If you set editable to false, you cannot enter a date in the

Date text box.

\n", + "link": "date-picker/editable", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "editable" + }, + { + "title": "Event", + "content": "

The main events include change, blur, and focus.

\n", + "link": "date-picker/date-picker-events", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "date-picker-events" + }, + { + "title": "Focus", + "content": "

Use the focus method to enable the input to obtain the focus.

\n", + "link": "date-picker/focus", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "focus" + }, + { + "title": "The arrow button controls the time selection.", + "content": "

When type is set to datetime or datetimerange, set time-arrow-control to true. The arrow button is displayed on the time panel to control the time selection. By default, the scrolling selection time is selected.

\n", + "link": "date-picker/time-arrow-control", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "time-arrow-control" + }, + { + "title": "Do not trigger form validation", + "content": "

The date selector triggers form validation by default. The triggering modes include blur and change. If validate-event is set to false, form validation is not triggered.

\n", + "link": "date-picker/validate-event", + "component": "DatePicker Date Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "validate-event" + }, + { + "title": "Set whether to display the GMT+8 time", + "content": "

You can use the isutc8 attribute to set whether to display the GMT+8 time.

\n", + "link": "date-picker/utc8", + "component": "DatePicker displays the GMT+8 time outside China", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "utc8" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/dept.json b/examples/docs/resources/pc/demo-config/en-US/dept.json new file mode 100644 index 000000000..c23bf8549 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/dept.json @@ -0,0 +1,106 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "dept/basic-usage", + "component": "Department", + "findIntroStr": "The department component is used to query and select Huawei departments. The default value is the department to which the current login user belongs.", + "demoId": "basic-usage" + }, + { + "title": "open and change events", + "content": "For details, see the following example.", + "link": "dept/dept-events", + "component": "Department", + "findIntroStr": "The department component is used to query and select Huawei departments. The default value is the department to which the current login user belongs.", + "demoId": "dept-events" + }, + { + "title": "selected event", + "content": "For details, see the following example.", + "link": "dept/dept-selected", + "component": "Department", + "findIntroStr": "The department component is used to query and select Huawei departments. The default value is the department to which the current login user belongs.", + "demoId": "dept-selected" + }, + { + "title": "close event", + "content": "For details, see the following example.", + "link": "dept/dept-close", + "component": "Department", + "findIntroStr": "The department component is used to query and select Huawei departments. The default value is the department to which the current login user belongs.", + "demoId": "dept-close" + }, + { + "title": "confirm event", + "content": "For details, see the following example.", + "link": "dept/dept-confirm", + "component": "Department", + "findIntroStr": "The department component is used to query and select Huawei departments. The default value is the department to which the current login user belongs.", + "demoId": "dept-confirm" + }, + { + "title": "cancel event", + "content": "For details, see the following example.", + "link": "dept/dept-cancel", + "component": "Department", + "findIntroStr": "The department component is used to query and select Huawei departments. The default value is the department to which the current login user belongs.", + "demoId": "dept-cancel" + }, + { + "title": "Set Component Size", + "content": "

can be set to medium, small, mini

\n", + "link": "dept/size", + "component": "Department", + "findIntroStr": "The department component is used to query and select Huawei departments. The default value is the department to which the current login user belongs.", + "demoId": "size" + }, + { + "title": "Prevent pop-up dialog box closing", + "content": "

before-confirm (callback event before confirmation). In the method, return true/false indicates whether to close the dialog box.

\n", + "link": "dept/before-confirm", + "component": "Department", + "findIntroStr": "The department component is used to query and select Huawei departments. The default value is the department to which the current login user belongs.", + "demoId": "before-confirm" + }, + { + "title": "Department information is automatically selected.", + "content": "The default value of

auto-select is true. If this parameter is set to false, the system automatically supplements the selected information when there is only one department.

\n", + "link": "dept/auto-select", + "component": "Department", + "findIntroStr": "The department component is used to query and select Huawei departments. The default value is the department to which the current login user belongs.", + "demoId": "auto-select" + }, + { + "title": "Customized Service Data", + "content": "

provides the fetch-dept-by-value, fetch-dept, and fetch-dept-list attributes for customizing department services.

\n", + "link": "dept/custom-service", + "component": "Department", + "findIntroStr": "The department component is used to query and select Huawei departments. The default value is the department to which the current login user belongs.", + "demoId": "custom-service" + }, + { + "title": "Disabled", + "content": "

You can use disabled to set whether to disable the function. The default value is fase

\n", + "link": "dept/dynamic-disable", + "component": "Department", + "findIntroStr": "The department component is used to query and select Huawei departments. The default value is the department to which the current login user belongs.", + "demoId": "dynamic-disable" + }, + { + "title": "Set the dialog box title.", + "content": "

Customized dialog box title. The default value of this attribute is null.

\n", + "link": "dept/title", + "component": "Department", + "findIntroStr": "The department component is used to query and select Huawei departments. The default value is the department to which the current login user belongs.", + "demoId": "title" + }, + { + "title": "Approval Slot", + "content": "For details, see the following example.", + "link": "dept/slot-hrapprover", + "component": "Department", + "findIntroStr": "The department component is used to query and select Huawei departments. The default value is the department to which the current login user belongs.", + "demoId": "slot-hrapprover" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/detail-page.json b/examples/docs/resources/pc/demo-config/en-US/detail-page.json new file mode 100644 index 000000000..c1cedf4f2 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/detail-page.json @@ -0,0 +1,18 @@ +[ + { + "title": "Basic Usage", + "content": "

You can set hidden: true in the data object to specify the data to be hidden by default.

\n", + "link": "detail-page/basic-usage", + "component": "DetailPage header details column", + "findIntroStr": "DetailPage detail bar component with a table header.", + "demoId": "basic-usage" + }, + { + "title": "Custom Text", + "content": "

via title, text-split, dialog-title, label-title, value-title The , tips, save-button, and cancel-button attributes specify the display text in different positions of the header details bar component.

\n", + "link": "detail-page/custom-show-text", + "component": "DetailPage header details column", + "findIntroStr": "DetailPage detail bar component with a table header.", + "demoId": "custom-show-text" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/dialog-box.json b/examples/docs/resources/pc/demo-config/en-US/dialog-box.json new file mode 100644 index 000000000..abe7f6c93 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/dialog-box.json @@ -0,0 +1,154 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "dialog-box/basic-usage", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "basic-usage" + }, + { + "title": "Level-2 pop-up window", + "content": "

The default slot and buttons in the operation area at the bottom are used to implement the level-2 pop-up window. After the append-to-body attribute is set, the entity DOM structure of the level-2 pop-up window is appended to the body element.

\n", + "link": "dialog-box/secondary-dialog", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "secondary-dialog" + }, + { + "title": "Custom Title", + "content": "

In addition to the title attribute, you can set the pop-up window title and customize the content in the pop-up window title area through the title slot.

\n", + "link": "dialog-box/custom-dialog-title", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "custom-dialog-title" + }, + { + "title": "Custom Content", + "content": "

The default slot is used to customize the content of the main part of the pop-up window.

\n", + "link": "dialog-box/custom-dialog-content", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "custom-dialog-content" + }, + { + "title": "Custom bottom", + "content": "

Customize the content in the operation area at the bottom of the pop-up window through the footer slot.

\n", + "link": "dialog-box/custom-dialog-footer", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "custom-dialog-footer" + }, + { + "title": "Hide the close button", + "content": "

The close icon is displayed in the upper right corner of the default pop-up window. You can click this icon to close the pop-up window. If show-close is set to false, the close icon is hidden. To close the pop-up window, you can switch the value of visible to false by clicking the button in the operation area.

\n", + "link": "dialog-box/hidden-close-buttons", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "hidden-close-buttons" + }, + { + "title": "Disable ESC.", + "content": "

After the default pop-up window is opened, you can press Esc to close the pop-up window. If close-on-press-escape is set to false, this function is disabled.

\n", + "link": "dialog-box/close-on-press-escape", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "close-on-press-escape" + }, + { + "title": "Height between the pop-up window and the top", + "content": "

The top attribute specifies the height of the pop-up window from the top of the window. The default value is 15% of the screen height.

\n", + "link": "dialog-box/dialog-top-height", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "dialog-top-height" + }, + { + "title": "Wideness of the pop-up window", + "content": "

The width attribute specifies the width of the pop-up window.

\n", + "link": "dialog-box/dialog-width", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "dialog-width" + }, + { + "title": "The pop-up window is not closed when the mask is clicked.", + "content": "

After the default pop-up window is opened, you can click the mask layer to close the pop-up window. If close-on-click-modal is set to false, this function is disabled.

\n", + "link": "dialog-box/close-on-click-modal", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "close-on-click-modal" + }, + { + "title": "Disable the mask layer", + "content": "

The mask layer is displayed when the pop-up window is opened by default. If modal is set to false, the mask layer is not enabled. If there is no mask layer, you can click the outer area of the pop-up window to close the pop-up window.

\n", + "link": "dialog-box/no-modal", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "no-modal" + }, + { + "title": "Right pop-up window", + "content": "

After right-slide is set to true, a pop-up window is displayed from the right of the window. \nSet the modal-append-to-body attribute to true by default. The mask layer is applied to the body.

\n", + "link": "dialog-box/right-dialog", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "right-dialog" + }, + { + "title": "Hidden title area", + "content": "

The pop-up window has a title area by default. If show-header is set to false, the title area is hidden.

\n", + "link": "dialog-box/hidden-header", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "hidden-header" + }, + { + "title": "Disable scrolling when pop-up", + "content": "

After a pop-up window is displayed, the background page cannot be scrolled by default. If lock-scroll is set to fasle, the scrolling of the masked content is not locked.

\n", + "link": "dialog-box/lock-scroll", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "lock-scroll" + }, + { + "title": "The head and bottom are horizontally centered", + "content": "The

header is displayed on the left of the area by default. If center is set to true, the header is displayed in the center.

\n", + "link": "dialog-box/center", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "center" + }, + { + "title": "Dragable pop-up window", + "content": "

By default, the pop-up window cannot be dragged. Set draggable to true and move the cursor to the title area to drag the pop-up window. Drag events include @drag-start, drag-move, and drag-end.

\n", + "link": "dialog-box/draggable", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "draggable" + }, + { + "title": "Full-screen pop-up window", + "content": "

Set fullscreen to true to display the full-screen pop-up window. The default pop-up window width is 500px. In this case, the width setting does not take effect.

\n", + "link": "dialog-box/fullscreen", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "fullscreen" + }, + { + "title": "Pop-up and Close Event", + "content": "

open: triggered when the dialog box is opened. opened: triggered when the animation ends. close: triggered when the dialog box is closed. closed: triggered when the animation ends.

\n", + "link": "dialog-box/open-close-events", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "open-close-events" + }, + { + "title": "Pop-up Window Form", + "content": "

The default slot is used to implement nested forms and form submission logic.

\n

By default, the form is reset when the pop-up window is closed. If is-form-reset is set to false, the form is not reset when the pop-up window is closed.

", + "link": "dialog-box/form-in-dialog", + "component": "DialogBox", + "findIntroStr": "The modal dialog box is displayed in the floating layer to guide users to perform related operations.", + "demoId": "form-in-dialog" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/drop-roles.json b/examples/docs/resources/pc/demo-config/en-US/drop-roles.json new file mode 100644 index 000000000..5d27c2eb6 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/drop-roles.json @@ -0,0 +1,34 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "drop-roles/basic-usage", + "component": "DropRoles drop-down role", + "findIntroStr": "DropRoles: provides the role list of the current user and allows users to switch between roles.", + "demoId": "basic-usage" + }, + { + "title": "change event", + "content": "

The change event is triggered when the drop-down role is switched. The change event callback method needs to be used to send the request.

\n", + "link": "drop-roles/change-role-event", + "component": "DropRoles drop-down role", + "findIntroStr": "DropRoles: provides the role list of the current user and allows users to switch between roles.", + "demoId": "change-role-event" + }, + { + "title": "Set Component Size", + "content": "

can be set to medium, small, mini

\n", + "link": "drop-roles/size", + "component": "DropRoles drop-down role", + "findIntroStr": "DropRoles: provides the role list of the current user and allows users to switch between roles.", + "demoId": "size" + }, + { + "title": "Custom Service", + "content": "

You can use the fetch-role and fetch-current-role methods to customize services. In addition, you can use the fields attribute to specify the fields corresponding to the display and binding values. \n You can use placeholder to display placeholders.

\n", + "link": "drop-roles/custom-service", + "component": "DropRoles drop-down role", + "findIntroStr": "DropRoles: provides the role list of the current user and allows users to switch between roles.", + "demoId": "custom-service" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/drop-times.json b/examples/docs/resources/pc/demo-config/en-US/drop-times.json new file mode 100644 index 000000000..6a965a4d9 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/drop-times.json @@ -0,0 +1,26 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "drop-times/basic-usage", + "component": "dropTimes drop-down time", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "basic-usage" + }, + { + "title": "Step and Time Range", + "content": "

start: indicates the start time of the interval. The default value is 0. end indicates the end time of the interval. The default value is 24 x 60. step indicates the step of the interval. The default value is 15.

\n", + "link": "drop-times/start-end-step", + "component": "dropTimes drop-down time", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "start-end-step" + }, + { + "title": "Set the size attribute of the component size", + "content": "

The value can be medium, small, or mini

\n", + "link": "drop-times/size", + "component": "dropTimes drop-down time", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "size" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/dropdown.json b/examples/docs/resources/pc/demo-config/en-US/dropdown.json new file mode 100644 index 000000000..73933790b --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/dropdown.json @@ -0,0 +1,66 @@ +[ + { + "title": "Basic Usage", + "content": "

Basic Usage

\n", + "link": "dropdown/basic-usage", + "component": "Dropdown drop-down list", + "findIntroStr": "Dropdown drop-down list.", + "demoId": "basic-usage" + }, + { + "title": "Trigger Object", + "content": "

Configure the split-button attribute. You can use the built-in button to trigger the drop-down menu. In addition, you can use the type attribute to configure the button status. The usage is the same as that of the Button component

\n", + "link": "dropdown/split-button", + "component": "Dropdown drop-down list", + "findIntroStr": "Dropdown drop-down list.", + "demoId": "split-button" + }, + { + "title": "Trigger Mode", + "content": "

You can configure click or hover to activate

\n", + "link": "dropdown/trigger", + "component": "Dropdown drop-down list", + "findIntroStr": "Dropdown drop-down list.", + "demoId": "trigger" + }, + { + "title": "Menu hiding mode", + "content": "The

drop-down menu is hidden by default after a menu item is clicked. You can disable this function by setting hide-on-click to false.

\n", + "link": "dropdown/hide-on-click", + "component": "Dropdown drop-down list", + "findIntroStr": "Dropdown drop-down list.", + "demoId": "hide-on-click" + }, + { + "title": "Disabled", + "content": "The

Dropdown and DropdownItem components can be disabled through the disabled attribute.

\n", + "link": "dropdown/disabled", + "component": "Dropdown drop-down list", + "findIntroStr": "Dropdown drop-down list.", + "demoId": "disabled" + }, + { + "title": "Different Sizes", + "content": "

Additional sizes: medium, small, mini, configured by setting the size property.

\n", + "link": "dropdown/size", + "component": "Dropdown drop-down list", + "findIntroStr": "Dropdown drop-down list.", + "demoId": "size" + }, + { + "title": "Use Profile", + "content": "

DropdownYou can configure the attributes of DropdownMenu through the menu-options attribute. titleConfigure the name of the trigger source

DropdownMenu You can configure the attributes of DropdownItem through the options attribute. text-field is used in conjunction with options to specify the fields displayed in the menu copywriting. text-field The default value is label

\n", + "link": "dropdown/options", + "component": "Dropdown drop-down list", + "findIntroStr": "Dropdown drop-down list.", + "demoId": "options" + }, + { + "title": "Internal Event", + "content": "

The built-in events include the button-click, item-click, and visible-change events.

\n", + "link": "dropdown/events", + "component": "Dropdown drop-down list", + "findIntroStr": "Dropdown drop-down list.", + "demoId": "events" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/espace.json b/examples/docs/resources/pc/demo-config/en-US/espace.json new file mode 100644 index 000000000..b7ed8ed60 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/espace.json @@ -0,0 +1,18 @@ +[ + { + "title": "Basic Usage", + "content": "The

data attribute sets the component data. The array object contains the options type, value, and icon. The value of type can be im, sip, or mailto. Click to open the external application corresponding to the value of type.

\n", + "link": "espace/data", + "component": "Espace message dialog box", + "findIntroStr": "Used together with the UserContact component to quickly open the eSpace pop-up window, eSpace call, and email applications of the corresponding user.", + "demoId": "data" + }, + { + "title": "User Contacts Use eSpace", + "content": "

The UserContact component provides the data required for configuring the espace attribute. This component actually uses the eSpace component.

\n", + "link": "user-contact/support-open-espace", + "component": "Espace message dialog box", + "findIntroStr": "Used together with the UserContact component to quickly open the eSpace pop-up window, eSpace call, and email applications of the corresponding user.", + "demoId": "support-open-espace" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/fall-menu.json b/examples/docs/resources/pc/demo-config/en-US/fall-menu.json new file mode 100644 index 000000000..4f167e191 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/fall-menu.json @@ -0,0 +1,34 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "fall-menu/data-resource", + "component": "FallMenu Waterfall Menu", + "findIntroStr": "The FallMenu waterfall menu is displayed horizontally and supports three-level menu configuration. It is applicable to version customization and is displayed in pop-up mode.", + "demoId": "data-resource" + }, + { + "title": "Data Source", + "content": "

Set the data of the waterfall menu through data.

\n", + "link": "fall-menu/data-resource", + "component": "FallMenu Waterfall Menu", + "findIntroStr": "The FallMenu waterfall menu is displayed horizontally and supports three-level menu configuration. It is applicable to version customization and is displayed in pop-up mode.", + "demoId": "data-resource1" + }, + { + "title": "Customizing Left/Right Icons", + "content": "

Use the left slot to set the left switch icon to IconLeft, and use the right slot to set the right switch icon to IconRight.

\n", + "link": "fall-menu/custom-slider-icon", + "component": "FallMenu Waterfall Menu", + "findIntroStr": "The FallMenu waterfall menu is displayed horizontally and supports three-level menu configuration. It is applicable to version customization and is displayed in pop-up mode.", + "demoId": "custom-slider-icon" + }, + { + "title": "Custom Content", + "content": "

The level-1 menu content is customized through the level1 slot, the level-2 menu content is customized through the level2 slot, and the level-3 menu content is customized through the level3 slot.

\n", + "link": "fall-menu/custom-menuitem", + "component": "FallMenu Waterfall Menu", + "findIntroStr": "The FallMenu waterfall menu is displayed horizontally and supports three-level menu configuration. It is applicable to version customization and is displayed in pop-up mode.", + "demoId": "custom-menuitem" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/file-upload.json b/examples/docs/resources/pc/demo-config/en-US/file-upload.json new file mode 100644 index 000000000..f392b87af --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/file-upload.json @@ -0,0 +1,234 @@ +[ + { + "title": "Basic Usage", + "content": "

Attribute action (type: String) upload server address.

\n", + "link": "file-upload/basic-usage", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "basic-usage" + }, + { + "title": "Set Component Size", + "content": "

The options are large, medium, small, and mini

\n", + "link": "file-upload/size", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "size" + }, + { + "title": "File types that can be uploaded", + "content": "

You can configure accept(image) to restrict the format of uploaded files to image

\n", + "link": "file-upload/accept-file-image", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "accept-file-image" + }, + { + "title": "Manual Upload", + "content": "

Configure the upload address through action and manually upload through submit

\n", + "link": "file-upload/manual-upload", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "manual-upload" + }, + { + "title": "Do not delete files", + "content": "

:before-remove (callback event before removing a file). In the method, return true/false indicates whether the file can be deleted.

\n", + "link": "file-upload/prevent-delete-file", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "prevent-delete-file" + }, + { + "title": "Do not upload files", + "content": "

before-upload (callback event before upload). In the method, return true/false indicates whether files can be uploaded.

\n", + "link": "file-upload/prevent-upload-file", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "prevent-upload-file" + }, + { + "title": "Upload Request", + "content": "

You can set action to the upload address and headers to the header request information

\n", + "link": "file-upload/upload-request", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "upload-request" + }, + { + "title": "mini mode", + "content": "

\nYou can configure mini-mode to set the display mode.

\n", + "link": "file-upload/mini-mode", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "mini-mode" + }, + { + "title": "Whether files can be uploaded by dragging", + "content": "

drag(type:boolean) can be configured to control whether a component can drag files to upload. If the accept attribute is configured, the @drop-error event can be used to obtain non-compliant dragged files.

\n", + "link": "file-upload/drag-upload", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "drag-upload" + }, + { + "title": "Drag Upload", + "content": "

The drag(type:boolean) parameter can be set to control whether the component can drag files.

\n", + "link": "file-upload/drag-select-file", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "drag-select-file" + }, + { + "title": "Uploaded File List", + "content": "

You can use show-file-list to configure whether to display the list of uploaded files. The default value is true. This parameter must be used together with file-list.\nYou can configure :file-list (type: Object) to display the name and address of the uploaded file

\n", + "link": "file-upload/upload-file-list", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "upload-file-list" + }, + { + "title": "The list of uploaded files is displayed.", + "content": "

Use list-type = thumb to enable the display of the file list pop-up window, and thumbOption to set the data related to the pop-up window.

\n", + "link": "file-upload/upload-file-list-thumb", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "upload-file-list-thumb" + }, + { + "title": "Customized upload request", + "content": "

Configure headers to customize the upload request header information

\n", + "link": "file-upload/custom-upload-request", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "custom-upload-request" + }, + { + "title": "Override the default request", + "content": "

You can configure http-request to overwrite the default upload behavior. You can customize the upload implementation

\n", + "link": "file-upload/http-request", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "http-request" + }, + { + "title": "Maximum Upload Limit", + "content": "

Configurable: before-upload (event callback before upload), restricting the file type and size

\n", + "link": "file-upload/upload-limit", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "upload-limit" + }, + { + "title": "Photo Wall", + "content": "

Set list-type to 'picture-card' to enable the photo wall mode

\n", + "link": "file-upload/picture-card", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "picture-card" + }, + { + "title": "File Thumbnail", + "content": "For details, see the following example.", + "link": "file-upload/file-picture-card", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "file-picture-card" + }, + { + "title": "Image List Thumbnail", + "content": "

\nYou can set list-type to "picture" to display the picture list thumbnail

\n", + "link": "file-upload/picture-list", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "picture-list" + }, + { + "title": "Maximum number of files to be uploaded", + "content": "

\nYou can set limit (type:Number, an integer greater than 0) to limit the number of files to be uploaded.

\n", + "link": "file-upload/max-file-count", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "max-file-count" + }, + { + "title": "Multiple File Selection", + "content": "

The default file selection is single. \nYou can set multiple to'true' to select multiple files.

\n", + "link": "file-upload/multiple-file", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "multiple-file" + }, + { + "title": "Hook Function", + "content": "

before-remove: indicates the hook before deleting files. The parameters are the uploaded files and file list. If false is returned or Promise is returned and rejected, the deletion stops. before-upload Hook before uploading a file. The parameter is the uploaded file. If false is returned or Promise is returned and rejected, the upload stops.

\n", + "link": "file-upload/custom-prefix", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "custom-prefix" + }, + { + "title": "Event", + "content": "

preview Event triggered when an uploaded file is clicked in the file list. \nremoveEvent triggered when a file is removed from the file list. \nerrorEvent triggered when a file fails to be uploaded. \nexceed Event triggered when the number of files exceeds the upper limit. \nprogressEvent triggered when a file is uploaded. \nchangeThis event is triggered when the file status changes. It is triggered when a file is added, uploaded successfully, or uploaded unsuccessfully. \nsuccess Event triggered when a file is successfully uploaded.

\n", + "link": "file-upload/upload-events", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "upload-events" + }, + { + "title": "Cookie credential information can be sent.", + "content": "

You can set with-credentials ='true' to enable the server to carry cookies. The default value is false.

\n", + "link": "file-upload/upload-request", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "upload-request1" + }, + { + "title": "Manually clear the list of uploaded files.", + "content": "

Invoke the clearFiles method of the component to clear the list of uploaded files. (This method cannot be invoked in before-upload.)

\n", + "link": "file-upload/clear-files", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "clear-files" + }, + { + "title": "Manually cancel the upload request", + "content": "

Invoke the abort method of the component to cancel the upload request

\n", + "link": "file-upload/abort-quest", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "abort-quest" + }, + { + "title": "Customized Upload Prompt", + "content": "

You can customize the upload prompt through the tip slot

\n", + "link": "file-upload/custom-upload-tip", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "custom-upload-tip" + }, + { + "title": "Customized trigger file option box", + "content": "

You can write a slot named trigger in the component to trigger the pop-up file selection box

\n", + "link": "file-upload/custom-trigger", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "custom-trigger" + }, + { + "title": "User avatar upload", + "content": "For details, see the following example.", + "link": "file-upload/upload-user-head", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "upload-user-head" + }, + { + "title": "Obtain the original size of the uploaded video.", + "content": "

\nObtain the original size of the uploaded video

\n", + "link": "file-upload/image-size", + "component": "FileUpload", + "findIntroStr": "You can set the file type and number of uploaded files. You can customize the upload service.", + "demoId": "image-size" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/floatbar.json b/examples/docs/resources/pc/demo-config/en-US/floatbar.json new file mode 100644 index 000000000..5f34eceab --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/floatbar.json @@ -0,0 +1,34 @@ +[ + { + "title": "Basic Usage", + "content": "

Fixed on the right of the screen by default

\n", + "link": "floatbar/base", + "component": "Floatbar floating block", + "findIntroStr": "The module always floats at a certain position on the screen and does not leave the screen due to web page scrolling.", + "demoId": "base" + }, + { + "title": "Custom Style", + "content": "

You can configure the CSS style to set the floating block style

\n", + "link": "floatbar/custom-style", + "component": "Floatbar floating block", + "findIntroStr": "The module always floats at a certain position on the screen and does not leave the screen due to web page scrolling.", + "demoId": "custom-style" + }, + { + "title": "Custom Content", + "content": "

Set the content of the floating block through the default slot

\n", + "link": "floatbar/custom-floatbar-item", + "component": "Floatbar floating block", + "findIntroStr": "The module always floats at a certain position on the screen and does not leave the screen due to web page scrolling.", + "demoId": "custom-floatbar-item" + }, + { + "title": "Operation floating block content", + "content": "For details, see the following example.", + "link": "floatbar/operation-floatbar-item", + "component": "Floatbar floating block", + "findIntroStr": "The module always floats at a certain position on the screen and does not leave the screen due to web page scrolling.", + "demoId": "operation-floatbar-item" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/font.json b/examples/docs/resources/pc/demo-config/en-US/font.json new file mode 100644 index 000000000..806acb7f8 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/font.json @@ -0,0 +1,26 @@ +[ + { + "title": "Chinese font set", + "content": "For details, see the following example.", + "link": "font/chinese-font-set", + "component": "Font", + "findIntroStr": "Font", + "demoId": "chinese-font-set" + }, + { + "title": "English font", + "content": "For details, see the following example.", + "link": "font/english-fonts", + "component": "Font", + "findIntroStr": "Font", + "demoId": "english-fonts" + }, + { + "title": "Font Usage Specifications", + "content": "For details, see the following example.", + "link": "font/Font-usage-specifications", + "component": "Font", + "findIntroStr": "Font", + "demoId": "Font-usage-specifications" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/form.json b/examples/docs/resources/pc/demo-config/en-US/form.json new file mode 100644 index 000000000..73320b22a --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/form.json @@ -0,0 +1,114 @@ +[ + { + "title": "Common Forms", + "content": "

In the Form component, each form field consists of a FormItem component. Various types of form controls can be placed in the form field, including Input, Select, Checkbox, Radio, Switch, DatePicker, and TimePicker.

\n", + "link": "form/frequently-used-form", + "component": "Form", + "findIntroStr": "It consists of buttons, text boxes, selectors, option buttons, and check boxes. It is used to collect, verify, and submit data.", + "demoId": "frequently-used-form" + }, + { + "title": "Inline Form", + "content": "

When the vertical space is limited and the form is simple, you can place the form in a line. You can set the inline property to change the form field to the form field in the line.

\n", + "link": "form/form-in-row", + "component": "FormItem", + "findIntroStr": "FormItem configuration in the Form component.", + "demoId": "form-in-row" + }, + { + "title": "Form Validation", + "content": "

Includes common verification rules such as mandatory fields, date, time, URL, and email. Use trigger to configure the mode of triggering the validation rule. If change is used, the validation is triggered when the value in the text box changes. If blur is used, the validation is triggered after the focus is lost.

\n", + "link": "form/form-validation", + "component": "Form", + "findIntroStr": "It consists of buttons, text boxes, selectors, option buttons, and check boxes. It is used to collect, verify, and submit data.", + "demoId": "form-validation" + }, + { + "title": "Customized Verification Rule", + "content": "

Use the validator option to perform customized validation. In the validation method, callback must be invoked. Configure the validate-on-rule-change attribute to determine whether to trigger a verification immediately after the rules attribute is changed.

\n", + "link": "form/custom-validation-rule", + "component": "Form", + "findIntroStr": "It consists of buttons, text boxes, selectors, option buttons, and check boxes. It is used to collect, verify, and submit data.", + "demoId": "custom-validation-rule" + }, + { + "title": "Text Alignment", + "content": "

Set the label-align attribute to determine whether to align text

\n", + "link": "form/label-align", + "component": "Form", + "findIntroStr": "It consists of buttons, text boxes, selectors, option buttons, and check boxes. It is used to collect, verify, and submit data.", + "demoId": "label-align" + }, + { + "title": "Verification prompt position", + "content": "

You can use validate-position to customize the position where the error message appears. After this parameter is set on the Form component, the subcomponent FormItem inherits the setting of the parent component. The setting on the FormItem component takes precedence over the setting on the From component.

\n", + "link": "form/validation-position", + "component": "Form", + "findIntroStr": "It consists of buttons, text boxes, selectors, option buttons, and check boxes. It is used to collect, verify, and submit data.", + "demoId": "validation-position" + }, + { + "title": "Add a verification method for a component without verification.", + "content": "For details, see the following example.", + "link": "form/no-validate-to-add", + "component": "Form", + "findIntroStr": "It consists of buttons, text boxes, selectors, option buttons, and check boxes. It is used to collect, verify, and submit data.", + "demoId": "no-validate-to-add" + }, + { + "title": "Form Size", + "content": "

You can change the size of a component in a form by setting the size attribute on the tiny-form tab. You can set the disabled attribute to change the disabled status of components in the form.

\n", + "link": "form/size", + "component": "FormItem", + "findIntroStr": "It consists of buttons, text boxes, selectors, option buttons, and check boxes. It is used to collect, verify, and submit data.", + "demoId": "size" + }, + { + "title": "Remove the verification result of a form item.", + "content": "

Invoke the clearValidate method to remove the verification result of a form item. Transfer the prop attribute of the form item to be removed or the array consisting of prop. If this parameter is not transferred, the verification result of the entire form is removed.

\n", + "link": "form/form-clear-validate", + "component": "Remove the verification result of a form item.", + "findIntroStr": "Method for removing the verification result of a form item in the Form component.", + "demoId": "form-clear-validate" + }, + { + "title": "Label Text Slot", + "content": "

Customize the content of the label text in the label slot

\n", + "link": "form/slot-label", + "component": "FormItem", + "findIntroStr": "It consists of buttons, text boxes, selectors, option buttons, and check boxes. It is used to collect, verify, and submit data.", + "demoId": "slot-label" + }, + { + "title": "Hide Form Item Verification Prompt", + "content": "

You can configure novalid-tip to determine whether to display the tip in the verification dialog box.

\n", + "link": "form/novalid-tip", + "component": "Form", + "findIntroStr": "Whether to display the tip of the verification dialog box", + "demoId": "novalid-tip" + }, + { + "title": "Verification prompt format", + "content": "

You can use validate-type to set whether the verification prompt information is displayed in text or tip format. The default value is tip. You can also configure the verification prompt mode of a certain item on a certain <form-item> .

\n", + "link": "form/validate-type", + "component": "Form", + "findIntroStr": "It consists of buttons, text boxes, selectors, option buttons, and check boxes. It is used to collect, verify, and submit data.", + "demoId": "validate-type" + }, + { + "title": "Disable form", + "content": "

You can set whether to disable the form by disabled. The default value is false.

\n", + "link": "form/form-disabled", + "component": "Form", + "findIntroStr": "It consists of buttons, text boxes, selectors, option buttons, and check boxes. It is used to collect, verify, and submit data.", + "demoId": "form-disabled" + }, + { + "title": "Complex Layout", + "content": "

Complex layouts are implemented by working with the Row and Col component.

\n", + "link": "form/form-row-col", + "component": " Form", + "findIntroStr": "It consists of buttons, text boxes, selectors, option buttons, and check boxes. It is used to collect, verify, and submit data.", + "demoId": "form-row-col" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/fullscreen.json b/examples/docs/resources/pc/demo-config/en-US/fullscreen.json new file mode 100644 index 000000000..96f51fe1e --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/fullscreen.json @@ -0,0 +1,18 @@ +[ + { + "title": "Component Use", + "content": "For details, see the following example.", + "link": "fullscreen/example-component", + "component": "Fullscreen", + "findIntroStr": "Fullscreen", + "demoId": "example-component" + }, + { + "title": "Functional use", + "content": "For details, see the following example.", + "link": "fullscreen/example-api", + "component": "Fullscreen", + "findIntroStr": "Fullscreen", + "demoId": "example-api" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-align.json b/examples/docs/resources/pc/demo-config/en-US/grid-align.json new file mode 100644 index 000000000..58d764de7 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-align.json @@ -0,0 +1,82 @@ +[ + { + "title": "Column Alignment", + "content": "

align Sets the alignment mode of a separate column. The options are left center right. The default value is left. align set in the

\n

TIP

\n

column will overwrite align

\n
\n set in the table", + "link": "grid/align/column-align", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "align-column-align" + }, + { + "title": "Left-aligned table header", + "content": "

header-align Sets the table header alignment mode. The value can be left center right. The default value is left. header-align configured in the

\n

TIP

\n

table will be overwritten by header-align configured in the column

\n
\n", + "link": "grid/align/header-align/left-header-align", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "align-header-align-left-header-align" + }, + { + "title": "Right-aligned table header", + "content": "For details, see the following example.", + "link": "grid/align/header-align/right-header-align", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "align-header-align-right-header-align" + }, + { + "title": "Table header center alignment", + "content": "For details, see the following example.", + "link": "grid/align/header-align/center-header-align", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "align-header-align-center-header-align" + }, + { + "title": "Left-aligned table tail", + "content": "The value of

footer-align is left center right. The default value is left. footer-align configured in the

\n

TIP

\n

table will be replaced by footer-align configured in the column

\n
\n", + "link": "grid/align/footer-align/left-footer-align", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "align-footer-align-left-footer-align" + }, + { + "title": "Right-aligned table tail", + "content": "For details, see the following example.", + "link": "grid/align/footer-align/right-footer-align", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "align-footer-align-right-footer-align" + }, + { + "title": "Table tail center alignment", + "content": "For details, see the following example.", + "link": "grid/align/footer-align/center-footer-align", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "align-footer-align-center-footer-align" + }, + { + "title": "Left-aligned table", + "content": "

align Sets the alignment mode of all columns. The options are left center right. The default value is left. The alignment mode configured in the

\n

TIP

\n

table has the lowest priority. The alignment mode configured in the

\n

TIP

\n

table will overwrite the

\n
\n", + "link": "grid/align/grid-align/left-grid-align", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "align-grid-align-left-grid-align" + }, + { + "title": "Right-aligned table", + "content": "For details, see the following example.", + "link": "grid/align/grid-align/right-grid-align", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "align-grid-align-right-grid-align" + }, + { + "title": "Table center alignment", + "content": "For details, see the following example.", + "link": "grid/align/grid-align/center-grid-align", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "align-grid-align-center-grid-align" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-cascade.json b/examples/docs/resources/pc/demo-config/en-US/grid-cascade.json new file mode 100644 index 000000000..a7fdffd14 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-cascade.json @@ -0,0 +1,18 @@ +[ + { + "title": "Grid-data concatenation-normal column concatenation", + "content": "

You need to configure the edit-config object on the grid tag, and activeMethod before editing the event processing edit item data set. \nThe editor object is configured in the grid-column column. component is used to render the editing component. \nattrsConfigure cascading data. \nevents to set events. \nFor details, see the following example.

\n", + "link": "grid/grid_Example/dataCascading/cascade", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-dataCascading-cascade" + }, + { + "title": "Grid-data concatenation-any parent concatenation", + "content": "

You need to configure the edit-config object on the grid tag, and activeMethod before editing the event processing edit item data set. \nThe editor object is configured in the grid-column column. component is used to render the editing component. \nattrsConfigure cascading data. \nevents to set events. \nFor details, see the following example.

\n", + "link": "grid/grid_Example/dataCascading/arbitraryCascade", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-dataCascading-arbitraryCascade" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-context-menu.json b/examples/docs/resources/pc/demo-config/en-US/grid-context-menu.json new file mode 100644 index 000000000..fc313b44a --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-context-menu.json @@ -0,0 +1,34 @@ +[ + { + "title": "Grid-right-click menu-header menu", + "content": "

Configure the :context-menu="{header: {options: headerMenus}, visibleMethod}" object to control the table header menu. In the \nheaderMenus, configure visible whether to display the menu and disabled whether to disable the menu. \n The visibleMethod method can be used to control menu permissions. \n@context-menu-click monitoring menu click event. \nFor details, see the following example.

\n", + "link": "grid/grid_Example/shortcutMenu/header-menu", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-shortcutMenu-header-menu" + }, + { + "title": "Grid-right-click menu-table tail menu", + "content": "

The table footer menu can be displayed only when :context-menu="{body: {options: bodyMenus}}", show-footer, and :footer-method="footerMethod" are configured. \nThe :context-menu="{body: {options: bodyMenus}, footer: {options: footerMenus}, visibleMethod}&; objects are configured to control the table header menu. In the \nfooterMenus, configure visible whether to display the menu and disabled whether to disable the menu. \n The visibleMethod method can be used to control menu permissions. \n@context-menu-click monitoring menu click event. \nFor details, see the following example.

\n", + "link": "grid/grid_Example/shortcutMenu/footer-menu", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-shortcutMenu-footer-menu" + }, + { + "title": "Grid-right-click menu-cell menu", + "content": "

Configure the context-menu="{body: {options: bodyMenus}, visibleMethod}" object to control the cell menu. In \nbodyMenus, set visible to display menus and disabled to disable menus. \n The visibleMethod method can be used to control menu permissions. Event triggered before the \n@cell-context-menu monitoring menu is displayed. \n@context-menu-click monitoring menu click event. \nFor details, see the following example.

\n", + "link": "grid/grid_Example/shortcutMenu/cell-menu", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-shortcutMenu-cell-menu" + }, + { + "title": "Grid-Right-click Menu-Menu Permission", + "content": "

Configure the :context-menu="{header: {options: headerMenus},body: {options: bodyMenus}, footer: {options: footerMenus},visibleMethod}" object to control the table header menu. \nheader, bodyMenus, footer: visible indicates whether to display menus and disabled indicates whether to disable menus. \nUse the visibleMethod method to control menu permissions. Event triggered before the \n@cell-context-menu monitoring menu is displayed. \n@context-menu-click monitoring menu click event. \nFor details, see the following example.

\n", + "link": "grid/grid_Example/shortcutMenu/menu-permissions", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-shortcutMenu-menu-permissions" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-custom-style.json b/examples/docs/resources/pc/demo-config/en-US/grid-custom-style.json new file mode 100644 index 000000000..22d94f088 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-custom-style.json @@ -0,0 +1,58 @@ +[ + { + "title": "Set Row Style", + "content": "

Set the row style of the table by row-class-name

\n

Set the row style

\n", + "link": "grid/custom-style/row-style", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "custom-style-row-style" + }, + { + "title": "Set the table header style", + "content": "

Set the cell and row styles of the table header through header-cell-class-name and header-row-class-name

\n

Set the cell style of the table header

\n", + "link": "grid/custom-style/header-style/header-cell-style", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "custom-style-header-style-header-cell-style" + }, + { + "title": "Set the table header cell style", + "content": "For details, see the following example.", + "link": "grid/custom-style/header-style/header-row-style", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "custom-style-header-style-header-row-style" + }, + { + "title": "Table tail style (customized table tail row style)", + "content": "

Use footer-cell-class-name and footer-row-class-name to set the cell and row styles at the end of the table

\n", + "link": "grid/custom-style/footer-style/footer-cell-style", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "custom-style-footer-style-footer-cell-style" + }, + { + "title": "Table tail style (customized table tail cell style)", + "content": "For details, see the following example.", + "link": "grid/custom-style/footer-style/footer-row-style", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "custom-style-footer-style-footer-row-style" + }, + { + "title": "Cell Style", + "content": "

Set the cell style of the table by cell-class-name

\n", + "link": "grid/custom-style/cell-style", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "custom-style-cell-style" + }, + { + "title": "Column Style", + "content": "

Set the column style of the table by class-name

\n", + "link": "grid/column/class-name", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "column-class-name" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-customized.json b/examples/docs/resources/pc/demo-config/en-US/grid-customized.json new file mode 100644 index 000000000..2f20a3655 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-customized.json @@ -0,0 +1,106 @@ +[ + { + "title": "Column Width", + "content": "

Configure resizable="true" on the grid tag to adjust the column width, and configure resizable="{storage: true}" on the toolbar tag to save the column width in localStroage on the local host. The column width of the table on the refreshed page is displayed based on the column width after being dragged.

\n", + "link": "grid/custom/column-width", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "custom-column-width" + }, + { + "title": "Manually Reset Columns", + "content": "Description of the

method

\n

resetResizable(): Manually reset the column width and drag the operation to the initial state \nresetCustoms(): Manually reset the display/hide operation of the column to the initial state.\nresetAll(): Manually reset all operations of the column. Restore to the initial state

\n
\n

Drag the column width or hide the column, and then click the corresponding button to view the effect.

\n", + "link": "grid/custom/resetResizable", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "custom-resetResizable" + }, + { + "title": "Sort", + "content": "

Configure sortable on the column label to sort data. (For columns that are not configured, the sorting icon in the personalization panel is hidden.) and configure setting on the toolbar tab to enable personalized settings. Sort the settings in the personalized panel. The sorting results are saved in the local localStroage. Refresh the page. The sorted data is displayed on the page.

\n", + "link": "grid/custom/column-sort", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "custom-column-sort" + }, + { + "title": "Sort Type", + "content": "

Configure sortable on the column tab to enable sorting, and configure setting on the toolbar tab to enable personalized settings. In the Personalization panel, select Other Settings. In Other Settings, you can select the sorting type. The sorting type includes the sorting on the current page and sorting on all data. The default value is Sort on the current page.

\n", + "link": "grid/custom/sort-type", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "custom-sort-type" + }, + { + "title": "Column Freeze", + "content": "

Configure the fixed="left" on the column tag to be fixed on the left, and configure setting on the toolbar tag to enable personalized settings. In the personalized panel, you can set whether the column is fixed.

\n", + "link": "grid/custom/column-fixed", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "custom-column-fixed" + }, + { + "title": "Local Records", + "content": "

Set sortable of setting to sortablejs to implement the drag-and-drop sorting function. This function is invalid under multi-level column headers

\n", + "link": "grid/custom/ordercolumn-local", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "custom-ordercolumn-local" + }, + { + "title": "Load Remote Data", + "content": "

Use the reloadCustoms method and set the second parameter to true to load columns in sequence

\n", + "link": "grid/custom/ordercolumn-remote", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "custom-ordercolumn-remote" + }, + { + "title": "Display and hide columns", + "content": "

Configure setting on the toolbar tab to enable personalized settings. In the personalized panel, you can set whether to display or hide columns

\n", + "link": "grid/custom/column-visible-hidden", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "custom-column-visible-hidden" + }, + { + "title": "Manually hide the displayed column", + "content": "

Invoke the hideColumn(column) method to hide the specified column, and the showColumn(column) method to display the specified column. When you use the two methods to hide or display a column, you need to invoke the refreshColumn() method to refresh the column configuration for the modification to take effect.

\n", + "link": "grid/hide/hideColumn", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "hide-hideColumn" + }, + { + "title": "Event triggered before dragging the personalized panel", + "content": "

Configure setting on the toolbar tab to enable personalized settings, and configure the onBeforeMove event before dragging on the personalized panel. You can also configure filter to set the class name. If you drag a line on the personalized panel, the event before dragging the personalized panel is triggered.

\n", + "link": "grid/custom/prsonalized-drag", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "custom-prsonalized-drag" + }, + { + "title": "Number of records on each page", + "content": "

On the toolbar tab, configure setting to enable personalized settings. In the personalized panel, select other settings. You can select the number of records to be displayed on each page. You can use the other attribute of setting to control the display of other settings. The default value of Boolean is true

\n", + "link": "grid/custom/page-size", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "custom-page-size" + }, + { + "title": "Local Storage", + "content": "

Configure :setting="{storage:'local'}" on the toolbar tag Enable personalization and save to local localSotrage

\n
\n
\n", + "link": "grid/custom/local-storage", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "custom-local-storage" + }, + { + "title": "Server Storage", + "content": "

Configure :setting="{storage:'remote'}" on the toolbar tab to enable personalization and remote services to obtain personalized data. Configure @remote-setting to invoke the reloadCustoms method to update personalized data. \n Note\n If the column is displayed or hidden based on the server data, you need to manually invoke the reloadCustoms method to update the personalized data after invoking the interface. In \n

\n
\n
\n", + "link": "grid/custom/server-storage", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "custom-server-storage" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-data-source.json b/examples/docs/resources/pc/demo-config/en-US/grid-data-source.json new file mode 100644 index 000000000..cc7560d72 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-data-source.json @@ -0,0 +1,42 @@ +[ + { + "title": "Bound static data", + "content": "

Table attribute settingdataEnable bidirectional binding of static data.

\n", + "link": "grid/tiny-first-menu/static-data", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-static-data" + }, + { + "title": "Open Service Request", + "content": "

Table attribute setting fetch-data enables the service request.

\n", + "link": "grid/tiny-first-menu/request-service", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-request-service" + }, + { + "title": "Automatically load data", + "content": "

Table attribute auto-load specifies whether to enable the automatic request service. This parameter is valid when fetch-data is configured. In the following example, if auto-load is set to false, data will not be automatically loaded.

\n", + "link": "grid/tiny-first-menu/auto-load", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-auto-load" + }, + { + "title": "Table column configuration information", + "content": "

Set the configuration information of table columns through the table attribute columns

\n", + "link": "grid/tiny-first-menu/columns", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-columns" + }, + { + "title": "Enable asynchronous rendering", + "content": "

Asynchronous rendering configuration procedure:\n1. Set the table attribute is-async-column to enable asynchronous rendering. \n2. Set format-config to enable asynchronous rendering of data in the column.

\n", + "link": "grid/tiny-first-menu/column-asyn-rendering", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-column-asyn-rendering" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-drag.json b/examples/docs/resources/pc/demo-config/en-US/grid-drag.json new file mode 100644 index 000000000..9e71e3e24 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-drag.json @@ -0,0 +1,26 @@ +[ + { + "title": "Drag Row", + "content": "

You can set the row attribute of drop-config to control row dragging. By default, row dragging is enabled. Row drag events include @row-drop-start, row-drop-move, and row-drop-end.

\n", + "link": "grid/drag/row-drag", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "drag-row-drag" + }, + { + "title": "Drag Control", + "content": "

You can set the onBeforeMove event of drop-config to control row dragging. You can also configure filter of drop-config in conjunction with a custom style to restrict drag

\n", + "link": "grid/drag/row-drag-ctrl", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "drag-row-drag-ctrl" + }, + { + "title": "Drag Column", + "content": "

You can set the column attribute of drop-config to control column dragging. Column dragging is enabled by default. Column drag events include @column-drop-start, column-drop-move, and column-drop-end.

\n", + "link": "grid/drag/column-drag", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "drag-column-drag" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-dynamically-columns.json b/examples/docs/resources/pc/demo-config/en-US/grid-dynamically-columns.json new file mode 100644 index 000000000..68b4cd294 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-dynamically-columns.json @@ -0,0 +1,10 @@ +[ + { + "title": "Grid-Dynamic column generation based on the selected date", + "content": "For details, see the following example.", + "link": "grid/grid_Example/dynamicallyColumns", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-dynamicallyColumns" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-edit.json b/examples/docs/resources/pc/demo-config/en-US/grid-edit.json new file mode 100644 index 000000000..37f8a6451 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-edit.json @@ -0,0 +1,106 @@ +[ + { + "title": "Line Edit", + "content": "

Table attribute setting edit-configEnable the editing mode, and then set mode:'row' in the attribute object to enable row editing, that is, :edit-config="{mode:'row'}&; .

\n", + "link": "grid/tiny-first-menu/row-editing", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-row-editing" + }, + { + "title": "Restore Changes", + "content": "

Invoke the revertData(rows, field) method to restore the data of a specified row or the entire table. If rows is an object, one row of data is restored. If rows is an array, multiple rows of data are restored. The field is optional. If no parameter is specified, the entire table data is restored.

\n", + "link": "grid/edit/revertData", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "edit-revertData" + }, + { + "title": "Check whether data is changed.", + "content": "

hasRowChange(row, field) Checks whether the row or column data is changed. The field is optional.

\n", + "link": "grid/edit/hasRowChange", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "edit-hasRowChange" + }, + { + "title": "Cell Edit", + "content": "

Table attribute setting edit-configEnable the editing mode, and then set mode:'cell' in the attribute object to enable line editing, that is, :edit-config="{mode: 'cell'}&; . \nTable Column Attribute Settingsshow-icon Sets whether to display the editing icon in the column header. This parameter is valid during editing.

\n", + "link": "grid/tiny-first-menu/cell-editing", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-cell-editing" + }, + { + "title": "Manually Activate Edit", + "content": "The

setActiveCell(row, field) method activates editing of the specified cell. The setActiveRow(row) method activates row editing. If mode=cell is used, the first cell is activated by default.

\n", + "link": "grid/methods/set-active-cell", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "methods-set-active-cell" + }, + { + "title": "Format Cell", + "content": "

Table Column Properties format-value Format the input value of the Cell Editor component.

\n", + "link": "grid/tiny-first-menu/format-value", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-format-value" + }, + { + "title": "Custom Editing Rule", + "content": "

Table attribute settingedit-configEnable the editing mode, and then set activeMethod custom editing rules in the attribute object.

\n", + "link": "grid/tiny-first-menu/custom-editing", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-custom-editing" + }, + { + "title": "Customized Editing Verification Rule", + "content": "

Table attribute settingedit-configEnable the editing mode and configure the edit-rules object to set the validation object and validation rule. Set isValidAlways in the editor object to enable real-time editing verification.

\n", + "link": "grid/tiny-first-menu/editor-is-salid-always", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-editor-is-salid-always" + }, + { + "title": "Enable editing", + "content": "

Table attribute settingsedit-configEnable the editing mode, Set showStatus in the attribute object to enable or disable the cell update status (inverted triangle update flag in the upper left corner of the cell). The default value is true.

\n", + "link": "grid/tiny-first-menu/status-of-editing", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-status-of-editing" + }, + { + "title": "Disable editing", + "content": "For details, see the following example.", + "link": "grid/tiny-first-menu/status-of-noediting", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-status-of-noediting" + }, + { + "title": "Click to trigger editing", + "content": "

Table attribute settingedit-configEnable the editing mode, and then set trigger in the attribute object to modify the triggering mode. The options are as follows: click trigger (click), double-click trigger (dblclick), and manual trigger (manual). The default value is click trigger.

\n", + "link": "grid/tiny-first-menu/trigger-mode-for-editing", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-trigger-mode-for-editing" + }, + { + "title": "Double-click to trigger editing", + "content": "For details, see the following example.", + "link": "grid/tiny-first-menu/trigger-mode-db-editing", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-trigger-mode-db-editing" + }, + { + "title": "Manually triggered editing", + "content": "For details, see the following example.", + "link": "grid/tiny-first-menu/trigger-mode-hm-editing", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-trigger-mode-hm-editing" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-editor.json b/examples/docs/resources/pc/demo-config/en-US/grid-editor.json new file mode 100644 index 000000000..ad9fce2d4 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-editor.json @@ -0,0 +1,58 @@ +[ + { + "title": "Grid-editor-built-in editor", + "content": "Configure edit-config on the

grid label. In the grid-column column, configure the editor object, component render the built-in editing component, and events configure component events. For details, see the following example.

\n

Description

\n

The built-in editor supports only the Input and Select components. For details about how to use other components, see the custom editor

\n
\n", + "link": "grid/grid_Example/gridEdit/inner-editor", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-gridEdit-inner-editor" + }, + { + "title": "Grid-Editor-Custom Editor", + "content": "Configure edit-config on the

grid label. \n Configure the editor object in the grid-column column and render the custom editing component. \nThe default edit box is a small box. You can modify the edit box based on the style. \nFor details, see the following example.

\n", + "link": "grid/grid_Example/gridEdit/custom-editor", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-gridEdit-custom-editor" + }, + { + "title": "Introducing the 3.0 component as the editor", + "content": "

Introduces the TinyVue Select component through attribute configuration.

\n", + "link": "grid/grid_Example/gridEdit/custom-editor-select", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-gridEdit-custom-editor-select" + }, + { + "title": "Grid-editor-drop-down list", + "content": "

When multiple options are selected from the drop-down list box, cell rendering needs to be implemented. In the following example, format-text is used to render multiple enumerated values. You can also use renderer to implement customized components for rendering.

\n", + "link": "grid/edit/mutil-render", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "edit-mutil-render" + }, + { + "title": "Grid-Editor-Custom Editor", + "content": "Configure edit-config on the

grid label. \n Configure the editor object in the grid-column column, component render the custom editing component, and configure the events of the editor component through its events option. \nThe default edit box is a small box. You can modify the edit box based on the style. \nFor details, see the following example.

\n", + "link": "grid/news/editor-events", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "news-editor-events" + }, + { + "title": "Popeditor pop-up window editing", + "content": "

Configure the editor attribute on the grid-column column element. In this object, you can specify component as Popeditor and attrs as attributes of the Popeditor component. Note that after the Popeditor component is introduced, it needs to be instantiated in data().

\n", + "link": "grid/grid_Example/gridEdit/popeditor-in-grid", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-gridEdit-popeditor-in-grid" + }, + { + "title": "Edit the Popeditor pop-up window and configure remote search.", + "content": "For details, see the following example.", + "link": "grid/grid_Example/gridEdit/popeditor-in-grid-remote-search", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-gridEdit-popeditor-in-grid-remote-search" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-empty-data-tip.json b/examples/docs/resources/pc/demo-config/en-US/grid-empty-data-tip.json new file mode 100644 index 000000000..a9e329a39 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-empty-data-tip.json @@ -0,0 +1,26 @@ +[ + { + "title": "Custom Prompt", + "content": "

When the data is empty, the icon + text prompt is displayed by default. You can also set the slot v-slot:empty or the render-empty attribute to define the prompt content.

\n", + "link": "grid/tiny-first-menu/empty-data-tip", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-empty-data-tip" + }, + { + "title": "Default Prompt", + "content": "For details, see the following example.", + "link": "grid/tiny-first-menu/empty-data-default-tip", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-empty-data-default-tip" + }, + { + "title": "Fix Center", + "content": "

When is-center-empty is set to true, drag the horizontal scroll bar to keep the empty data prompt so that the final data is displayed in the center of the table width

\n", + "link": "grid/tiny-first-menu/empty-data-iscenter", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-empty-data-iscenter" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-event.json b/examples/docs/resources/pc/demo-config/en-US/grid-event.json new file mode 100644 index 000000000..88bbc5666 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-event.json @@ -0,0 +1,210 @@ +[ + { + "title": "Table header click event", + "content": "

Configure header-cell-click on the grid tag to listen to the click event of the table header

\n", + "link": "grid/event/header-click-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-header-click-event" + }, + { + "title": "Table header double-click event", + "content": "

Configure header-cell-dblclick on the grid tag to listen to the double-click event of the table header

\n", + "link": "grid/event/header-dblclick-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-header-dblclick-event" + }, + { + "title": "Cell Click Event", + "content": "

Configure cell-click on the grid tab to listen to the click event of a cell

\n", + "link": "grid/event/cell-click-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-cell-click-event" + }, + { + "title": "Cell Double-Click Event", + "content": "

Configure cell-dblclick on the grid tab to listen to the double-click event of a cell

\n", + "link": "grid/event/cell-dblclick-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-cell-dblclick-event" + }, + { + "title": "Indicates that the mouse moves to a cell.", + "content": "

Configure cell-dblclick on the grid tab to listen to the double-click event of a cell

\n", + "link": "grid/event/cell-mouseenter-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-cell-mouseenter-event" + }, + { + "title": "Event indicating that the mouse moves away from a cell", + "content": "

Configure cell-mouseleave on the grid tag to listen to the event that the mouse leaves the cell

\n", + "link": "grid/event/cell-mouseleave-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-cell-mouseleave-event" + }, + { + "title": "Event", + "content": "

Configure the scroll event on the grid tag to listen to the scrolling of the table

\n", + "link": "grid/event/grid-scroll-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-grid-scroll-event" + }, + { + "title": "Event Object", + "content": "

Table PropertiesenventsSets the event object of the table. \n

\n", + "link": "grid/event/grid-events", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-grid-events" + }, + { + "title": "Row Selection Event", + "content": "

This event is triggered when a row is manually selected and is valid only when highlightCurrentRow is configured on the grid tag.

\n", + "link": "grid/event/current-change-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-current-change-event" + }, + { + "title": "This event is triggered when a cell is activated for editing.", + "content": "

This event is triggered when you configure edit-actived on the grid tag.

\n", + "link": "grid/event/edit-actived-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-edit-actived-event" + }, + { + "title": "This event is triggered when a cell is edited.", + "content": "

This event is valid only when edit-closed is configured on the grid tag. After a cell is edited, this event is triggered.

\n", + "link": "grid/event/edit-closed-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-edit-closed-event" + }, + { + "title": "The data in two tables is associated with each other.", + "content": "For details, see the following example.", + "link": "grid/event/table-data-association", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-table-data-association" + }, + { + "title": "This event is triggered when a cell is activated and the cell is disabled.", + "content": "

is valid only when edit-disabled-event is configured on the grid tag. In addition, the activeMethod method in the edit-config configuration needs to be used to control whether the cell can be edited (return true to edit the cell, and vice versa).

\n", + "link": "grid/event/edit-disabled-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-edit-disabled-event" + }, + { + "title": "Event of right-clicking a cell at the end of the table", + "content": "

On the grid tab, configure the footer-cell-context-menu event of right-clicking a cell at the end of the table. Configure footer-cell-click to trigger the event of clicking a cell at the end of the table.

\n", + "link": "grid/event/footer-cell-context-menu-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-footer-cell-context-menu-event" + }, + { + "title": "Event of Right-clicking a Table Header", + "content": "

Only the header-cell-context-menu configured on the grid tag can listen to the right-click event of the table header.

\n", + "link": "grid/event/header-cell-context-menu-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-header-cell-context-menu-event" + }, + { + "title": "Paging change event", + "content": "

You can only configure page-change on the grid tag to listen to page change events.

\n", + "link": "grid/event/page-change-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-page-change-event" + }, + { + "title": "Event before pagination changes", + "content": "

You can configure is-before-page-change on the grid tab to determine whether to enable the pre-processing feature when the page changes. When the value is set to true, the page turning operation or page size change operation does not take effect immediately and is left to the user to process the service logic. Then, the reserved callback or rollback is invoked to make it take effect or invalid. The before-page-change event is triggered when the page turning operation or page size change operation is performed, and then whether to jump to the page is controlled.

\n", + "link": "grid/event/page-before-change-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-page-before-change-event" + }, + { + "title": "Line Selection Event", + "content": "

Configure radio-change on the grid tag to listen to the selected row event.\nThis parameter is valid only for type=radio. Event triggered when manually selected and the value changes

\n", + "link": "grid/event/radio-change-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-radio-change-event" + }, + { + "title": "Column width change event", + "content": "

Configure resizable-change on the grid tag to listen to column width change events

\n", + "link": "grid/event/resizable-change-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-resizable-change-event" + }, + { + "title": "Event triggered when all options are selected manually", + "content": "

The configuration of select-all on the grid tag is valid.\nThis parameter is valid only when type=selection is selected. This event is triggered when all is selected manually

\n", + "link": "grid/event/select-all-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-select-all-event" + }, + { + "title": "Line Selection Event", + "content": "

You can configure select-change on the grid tag to listen to the selected row event.\nThis parameter is valid only for type=selection. Event triggered when manually selected and the value changes

\n", + "link": "grid/event/select-change-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-select-change-event" + }, + { + "title": "Line expansion and collapse event", + "content": "

Configure toggle-expand-change on the grid tag to listen to the row expansion and collapse event

\n", + "link": "grid/event/toggle-expand-change-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-toggle-expand-change-event" + }, + { + "title": "Tree Node Expansion and Collapse Event", + "content": "

Configure toggle-tree-change on the grid tag to listen to tree node expansion and collapse events

\n", + "link": "grid/event/toggle-tree-change-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-toggle-tree-change-event" + }, + { + "title": "Toolbar click event", + "content": "

Configure resizable-change on the grid tab to listen to toolbar click events

\n", + "link": "grid/event/toolbar-button-click-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-toolbar-button-click-event" + }, + { + "title": "Verification failure event", + "content": "

Configure valid-error on the grid tag to listen to verification failure events

\n", + "link": "grid/event/valid-error-event", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "event-valid-error-event" + }, + { + "title": "Obtain table row method", + "content": "

Method for obtaining a row:

\n

getCurrentRow Obtain the current row \ngetRowIndex Obtain the current row number \ngetRadioRow Radio Select a single row \ngetRowById Obtain the current row based on the row ID \ngetRowNode Obtain the row information based on the tr element

\n
\n", + "link": "grid/tiny-first-menu/get-row-method", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-get-row-method" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-faq.json b/examples/docs/resources/pc/demo-config/en-US/grid-faq.json new file mode 100644 index 000000000..ffac68cfd --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-faq.json @@ -0,0 +1,10 @@ +[ + { + "title": "Table column headers and cells are misplaced", + "content": "

When the grid table header is misplaced with the table body cell, You can perform the following operations as required.\n1. Set the column width for each column.\n2. Set show-overflow and show-header-overflow to true\n3. Set table-layoutauto

\n", + "link": "grid/faq/unbalanced", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "faq-unbalanced" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-filter.json b/examples/docs/resources/pc/demo-config/en-US/grid-filter.json new file mode 100644 index 000000000..c1c50e882 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-filter.json @@ -0,0 +1,58 @@ +[ + { + "title": "Filter", + "content": "

filter Configuration

\n

Customize filtering rules based on the scope slot of the customized filter.\nConfigurable items:\nMulti specifies whether to select multiple enumeration options. This parameter is valid only when enable:true is selected. \nenumable Sets the display of enumeration options in the filter panel. \ninputFilter Sets the display of the input filtered items in the filter panel. \ndefaultFilter Sets the default filter criteria to be displayed in the filter panel. \nvalues specifies the static data source under the display enumeration option function (enumable). \nlabel Sets the display value attribute field of enumerated data. The default value is label. \nvalue Sets the actual value attribute field of the enumerated data. The default value is'value'.

\n
\n", + "link": "grid/filter/default-filter", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "filter-default-filter" + }, + { + "title": "Custom Parameter", + "content": "

Add custom parameters by params

\n", + "link": "grid/column/column-params", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "column-column-params" + }, + { + "title": "Advanced Filter Settings", + "content": "

You can use inputFilter to configure custom components and conditions for the input filter area, and use extends to add a shortcut filter list

\n", + "link": "grid/filter/advanced-filter", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "filter-advanced-filter" + }, + { + "title": "Set Column Filtering Rules", + "content": "

Set the column filtering rule through the filter attribute

\n", + "link": "grid/filter/custom-filter", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "filter-custom-filter" + }, + { + "title": "Custom Filter", + "content": "

Set additional parameters through the params attribute

\n", + "link": "grid/grid-params", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid-params" + }, + { + "title": "Server Filter", + "content": "

Configure remote-filter to enable server-side filtering. The server-side filtering invokes the fetch-data table for query. The filter-change event is triggered after the server-side filtering.\nThe services/getGridMockData service in this example needs to be implemented. The example simulates the data returned by a remote service \n

\n", + "link": "grid/filter/server-filter", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "filter-server-filter" + }, + { + "title": "Enter the default filtering options.", + "content": "

Set the default input filtering options through the inputFilter.relation attribute. \n Enter the built-in options for filtering: equals, unequal, greaterThan, lessThan, equalToGreaterThan, equalToLessThan, contains, startwith, endwith; Custom options can also be configured. \n When configuring custom options, you need to configure the filtering method through the inputFilter.method attribute.

\n", + "link": "grid/filter/default-relation", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "filter-default-relation" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-fixed.json b/examples/docs/resources/pc/demo-config/en-US/grid-fixed.json new file mode 100644 index 000000000..19a404702 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-fixed.json @@ -0,0 +1,26 @@ +[ + { + "title": "Left Freeze", + "content": "

Sets column freezing through the fixed property. The options are as follows: left rightThe default value is left

\n", + "link": "grid/fixed/left-fixed", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "fixed-left-fixed" + }, + { + "title": "Right Freeze", + "content": "

Sets column freezing through the fixed property. The options are as follows: left rightThe default value is left

\n", + "link": "grid/fixed/right-fixed", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "fixed-right-fixed" + }, + { + "title": "Frozen Operation Column", + "content": "

Sets column freezing through the fixed property. The options are as follows: left rightThe default value is left

\n", + "link": "grid/fixed/multi-column-fixed", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "fixed-multi-column-fixed" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-footer.json b/examples/docs/resources/pc/demo-config/en-US/grid-footer.json new file mode 100644 index 000000000..ae7d654ad --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-footer.json @@ -0,0 +1,34 @@ +[ + { + "title": "Table tail statistics", + "content": "For details, see the following example.", + "link": "grid/footer/footer-summation", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "footer-footer-summation" + }, + { + "title": "Table tail statistics (empty data)", + "content": "For details, see the following example.", + "link": "grid/footer/footer-summation-empty", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "footer-footer-summation-empty" + }, + { + "title": "Table tail class name", + "content": "

\nAdd a class name to the cell at the end of the table through the table column attribute footer-class-name or the function Function({$rowIndex, column, columnIndex, $columnIndex}) . \n

\n", + "link": "grid/footer/footer-class-name", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "footer-footer-class-name" + }, + { + "title": "Merge Rows or Columns at the Table Foot", + "content": "

Use footer-method and footer-span-method to set the total row or column logic of the table tail. show-footer

\n must be configured", + "link": "grid/footer/footer-row-or-column-span", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "footer-footer-row-or-column-span" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-grid-border.json b/examples/docs/resources/pc/demo-config/en-US/grid-grid-border.json new file mode 100644 index 000000000..c8f040233 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-grid-border.json @@ -0,0 +1,10 @@ +[ + { + "title": "Basic Usage", + "content": "

Table property setting borderAdds a border to the table.

\n", + "link": "grid/tiny-first-menu/grid-border", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-grid-border" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-grid-loading-tip.json b/examples/docs/resources/pc/demo-config/en-US/grid-grid-loading-tip.json new file mode 100644 index 000000000..2385ea561 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-grid-loading-tip.json @@ -0,0 +1,18 @@ +[ + { + "title": "Disable loading status", + "content": "

Table attribute setting loading Enables or disables loading. The default value is false.

\n", + "link": "grid/tiny-first-menu/grid-loading-off-tip", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-grid-loading-off-tip" + }, + { + "title": "Enable loading status", + "content": "For details, see the following example.", + "link": "grid/tiny-first-menu/grid-loading-tip", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-grid-loading-tip" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-grid-optimization.json b/examples/docs/resources/pc/demo-config/en-US/grid-grid-optimization.json new file mode 100644 index 000000000..c63729c33 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-grid-optimization.json @@ -0,0 +1,10 @@ +[ + { + "title": "Optimized Configuration Items", + "content": "

optimization(Object) Configuration Description

\n

| animat(Boolean) | Table animation effect switch. The default value is true. |\n| delayHover(Number) | When the table is dragged or scrolled, Minimum milliseconds after which the hover event can be triggered. The default value is 250 ms. |\n| scrollX(Object) | Horizontal X virtual scrolling configuration (for manual optimization in special scenarios). Example: {gt: 100} |\n| scrollY(Object) | Vertical Y virtual scrolling configuration (for manual optimization in special scenarios) Example: {gt: 500} |

\n
\n

\n", + "link": "grid/tiny-first-menu/grid-optimization", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-grid-optimization" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-grid-size.json b/examples/docs/resources/pc/demo-config/en-US/grid-grid-size.json new file mode 100644 index 000000000..1c51b964e --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-grid-size.json @@ -0,0 +1,26 @@ +[ + { + "title": "medium", + "content": "

Table settingssize property adjusts the table size.

\n", + "link": "grid/tiny-first-menu/grid-size", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-grid-size" + }, + { + "title": "small", + "content": "For details, see the following example.", + "link": "grid/tiny-first-menu/grid-size-small", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-grid-size-small" + }, + { + "title": "mini", + "content": "For details, see the following example.", + "link": "grid/tiny-first-menu/grid-size-mini", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-grid-size-mini" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-grid-stripe.json b/examples/docs/resources/pc/demo-config/en-US/grid-grid-stripe.json new file mode 100644 index 000000000..75d937f2b --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-grid-stripe.json @@ -0,0 +1,10 @@ +[ + { + "title": "Basic Usage", + "content": "Whether the

stripe has zebra prints is disabled by default. Enabled when :stripe=\"true\" is set. (Note: In the editable table scenario, the data inserted temporarily does not have the zebra pattern.)

\n", + "link": "grid/stripe/stripe", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "stripe-stripe" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-header.json b/examples/docs/resources/pc/demo-config/en-US/grid-header.json new file mode 100644 index 000000000..fbfbf763c --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-header.json @@ -0,0 +1,34 @@ +[ + { + "title": "Hide table headers.", + "content": "

Set showHeader to fasle to control the hidden table header. The default value is true.

\n", + "link": "grid/header/hide-grid-header", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "header-hide-grid-header" + }, + { + "title": "User-defined table header", + "content": "

Customize the table header by column slot slot

\n", + "link": "grid/header/custom-grid-header", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "header-custom-grid-header" + }, + { + "title": "Configure the template for customizing table header content", + "content": "

Set the header slot and configure the template of the customized table header content.

\n", + "link": "grid/header/slot-header", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "header-slot-header" + }, + { + "title": "Basic Description", + "content": "

Add the class name to the cell of the table header through the column attribute header-class-name, or the function Function({$rowIndex, column, columnIndex, $columnIndex}) . \n

\n", + "link": "grid/header/header-class-name", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "header-header-class-name" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-highlight.json b/examples/docs/resources/pc/demo-config/en-US/grid-highlight.json new file mode 100644 index 000000000..7736ea328 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-highlight.json @@ -0,0 +1,50 @@ +[ + { + "title": "Highlight Hover Line", + "content": "

Set the highlight-hover-row attribute to control whether to enable the highlight function when the cursor is moved to the current line. The default value is true. If you do not need to hover and highlight, set highlight-hover-row to false.

\n", + "link": "grid/highlight/highlight-hover-row", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "highlight-highlight-hover-row" + }, + { + "title": "Highlight a specified line", + "content": "The

setCurrentRow(row) can be used to set the highlight status of a line.

\n", + "link": "grid/methods/set-current-row", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "methods-set-current-row" + }, + { + "title": "Enable the selected row to be highlighted", + "content": "

Set the highlight-current-row attribute to control whether to highlight selected lines.

\n

\nThe lines with zebra crossings are not highlighted.\n

\n", + "link": "grid/highlight/highlight-current-row", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "highlight-highlight-current-row" + }, + { + "title": "Whether to highlight the column header", + "content": "

Set the highlight-hover-column attribute to control whether to enable the highlight function when the cursor is moved to the column header of the current column.

\n", + "link": "grid/highlight/highlight-hover-column", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "highlight-highlight-hover-column" + }, + { + "title": "Specifies whether to highlight the selected column.", + "content": "

Set the highlight-current-column attribute to determine whether to highlight the current column.

\n", + "link": "grid/highlight/highlight-current-column", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "highlight-highlight-current-column" + }, + { + "title": "Highlight cell borders during editing", + "content": "

Sets whether highlight-cell highlights the cell border during editing. This parameter is valid only when editConfig is configured

\n", + "link": "grid/highlight/highlight-cell", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "highlight-highlight-cell" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-import-export.json b/examples/docs/resources/pc/demo-config/en-US/grid-import-export.json new file mode 100644 index 000000000..d0ed66692 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-import-export.json @@ -0,0 +1,10 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "grid/tiny-first-menu/export-excel", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-export-excel" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-keyboard.json b/examples/docs/resources/pc/demo-config/en-US/grid-keyboard.json new file mode 100644 index 000000000..0703458ac --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-keyboard.json @@ -0,0 +1,26 @@ +[ + { + "title": "Keyboard Navigation", + "content": "

Key Description

\n

| Arrow Up ↑ | Moves to the cell above the current active cell |\n| Arrow Down ← | Moves to the cell below the current active cell |\n| Arrow Left ← | Moves to the cell on the left of the current active cell |\n| Arrow Right → | Moves to the right of the current active cell |\n| Tab | Moves to the cell on the right of the selected or active cell. If the last column is displayed and the next row exists, move from the next row. |\n| Tab + Shift | Moves to the cell on the left of the selected or active cell. If the first column is displayed and there is a previous row, move the cell from the previous row. |\n| Spacebar | If the cell is a check box or option button, switch the selected status. |\n| Enter | Cancel the editing and move the cell to the cell under the current active cell. |\n| Delete | Clear the content. | \n| Backspace | Clear the contents and activate the selected cell to the editing state. |\n| F2 | Activate cell editing. |\n| Esc | Cancel cell editing. |\n| Page Up | Page Up | Page Down | Page Down | Page Down | Page Down | \n| Home | Scroll to the top |\n| End | Scroll to the bottom |

\n
\n", + "link": "grid/keyboard-navigation", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "keyboard-navigation" + }, + { + "title": "Set key configuration items", + "content": "

Table propertykeyboard-configSet key configuration items. \n

\n", + "link": "grid/keyboard-config", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "keyboard-config" + }, + { + "title": "Setting Mouse Configuration Items", + "content": "

Table propertymouse-configSet the mouse configuration item. \n

\n", + "link": "grid/mouse-config", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "mouse-config" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-large-data.json b/examples/docs/resources/pc/demo-config/en-US/grid-large-data.json new file mode 100644 index 000000000..16e17f8e6 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-large-data.json @@ -0,0 +1,50 @@ +[ + { + "title": "Scroll Pagination", + "content": "

Scrolling pagination configuration procedure:\n1. Set the table attribute fetch-data to enable the service request. \n2. Set scroll-load to enable scrolling.

\n", + "link": "grid/tiny-first-menu/scroll-paging", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-scroll-paging" + }, + { + "title": "Virtual Scrolling", + "content": "

Virtual scrolling configuration procedure:\n1. Set height to a fixed height for table attributes. \n2. Set optimization to enable virtual scrolling.

\n

optimization(Object) configuration description:

\n

| delayHover(Number) | (ms) after which the hover event can be triggered when a table is dragged or scrolled. The default value is 250 ms. |\n| scrollX(Object) | Horizontal X virtual scrolling configuration (for manual optimization in special scenarios) Example: {gt: 100} |\n| scrollY(Object) | Vertical Y Virtual Scrolling Configuration (for manual optimization in special scenarios) For example, {gt: 500} |

\n
\n

Precautions for enabling virtual scrolling

\n

1. Before enabling virtual scrolling, ensure that the width of each column is the same. You can configure the uniform width by setting the column-width attribute on the <tiny-grid> tag. \n2. Enabling virtual scrolling will disable the column width adjustment function. Column dragging will change the column width. As a result, the number of columns in virtual scrolling rendering is incorrectly calculated and the table style is disordered. Therefore, column dragging is prohibited.

\n
\n", + "link": "grid/tiny-first-menu/virtual-rolling", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-virtual-rolling" + }, + { + "title": "Virtual scrolling of the tree table", + "content": "

Default Value
NameTypeDescription
optimization.scrollX.gt Number Specifies the number of columns to be automatically started when the number of columns is greater than X Virtual scrolling 100
optimization.scrollX.rSize Number Number of columns to be rendered each time
optimization.scrollX.vSize Number Number of columns in the visible area
optimization.scrollX.adaptive Boolean Automatically adapts to the optimal rendering mode (If this parameter is set to false, the column array is intercepted only once after the scrolling is complete, which improves the performance in big data scenarios. However, the white screen will be displayed for a short time and will be restored after the rendering is complete.) true
optimization.scrollY.gt Number specifies the number of lines. Y: The virtual scrolling function is automatically enabled. 500
optimization.scrollY.rSize Number : number of lines to be rendered each time.
optimization.scrollY.adaptive Boolean : automatically adapts to the optimal rendering mode. (If this parameter is set to false, the row array is captured only once after the scrolling is complete, which improves the performance in big data scenarios. However, white screen will be displayed for a short time and will be restored after the rendering is complete.) true

\n
\n", + "link": "grid/tiny-first-menu/grid-large-tree-data", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-grid-large-tree-data" + }, + { + "title": "Full Load", + "content": "

Performance problems may occur when there is too much data in a table. You can use $refs to obtain table objects and set the loadData method of the table objects to enable full loading to optimize performance.

\n", + "link": "grid/tiny-first-menu/full-data-loading", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-full-data-loading" + }, + { + "title": "Generate 1000 columns", + "content": "

You can use the loadColumn(columns) method to load column configurations. This method may be used in scenarios where columns need to be reloaded.

\n", + "link": "grid/large-data/load-column", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "large-data-load-column" + }, + { + "title": "Scroll to the specified position", + "content": "

Method Description

\n

scrollTo(scrollLeft, scrollTop): Scroll to the corresponding position \nscrollToRow(row): Scroll to the corresponding row \nscrollToColumn(column): Scroll to the corresponding column

\n
\n", + "link": "grid/large-data/scroll-to", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "large-data-scroll-to" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-nested-grid.json b/examples/docs/resources/pc/demo-config/en-US/grid-nested-grid.json new file mode 100644 index 000000000..b6839e026 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-nested-grid.json @@ -0,0 +1,42 @@ +[ + { + "title": "Nested Table", + "content": "

Implements the nested table function by using the table component in the default slot default.

\n", + "link": "grid/grid_Example/nestedGrid", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-nestedGrid" + }, + { + "title": "Check whether the row is expanded.", + "content": "

You can invoke the hasRowExpand(row) method to check whether a row is expanded. The row parameter is the row data object.

\n", + "link": "grid/expand/hasRowExpand", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "expand-hasRowExpand" + }, + { + "title": "Set to expand all lines", + "content": "

You can invoke the setAllRowExpansion(checked) method to set whether to expand or not all rows.

\n", + "link": "grid/methods/set-all-row-expansion", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "methods-set-all-row-expansion" + }, + { + "title": "Set to expand a specified line", + "content": "

You can invoke the setRowExpansion(rows, checked) method to expand a specified row. The second parameter specifies whether to expand a specified row. When expanding a specified row, you can invoke the clearRowExpand() method to close the expanded row.

\n", + "link": "grid/methods/set-row-expansion", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "methods-set-row-expansion" + }, + { + "title": "Manually switch to expand rows", + "content": "

You can manually switch between expanded rows by invoking the toggleRowExpansion(row) method.

\n", + "link": "grid/methods/toggle-row-expansion", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "methods-toggle-row-expansion" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-operation-column.json b/examples/docs/resources/pc/demo-config/en-US/grid-operation-column.json new file mode 100644 index 000000000..2bb7a6dac --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-operation-column.json @@ -0,0 +1,106 @@ +[ + { + "title": "Basic Usage", + "content": "

Table column property setting type="radio" Display radio columns.

\n", + "link": "grid/tiny-first-menu/default-serial-column", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-default-serial-column" + }, + { + "title": "Manually Canceling a Row", + "content": "For details, see the following example.", + "link": "grid/tiny-first-menu/clearRadioRow", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-clearRadioRow" + }, + { + "title": "Manually select a line", + "content": "

setRadioRow(row) is used to select a single line and set the selected status of a line.

\n", + "link": "grid/methods/set-radio-row", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "methods-set-radio-row" + }, + { + "title": "Single-choice configuration item", + "content": "The

radio-config configuration item can be used to configure the default selected and disabled options of the option button.

\n", + "link": "grid/tiny-first-menu/radio-config", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-radio-config" + }, + { + "title": "Disable a single option", + "content": "

Single choice mode. The attribute checkMethod of the radio-config configuration item is used to determine which data items are disabled. The method determines each data item. If the return value is true or false, the data item is enabled or disabled.

\n", + "link": "grid/disable-radio", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "disable-radio" + }, + { + "title": "Display Multiple Select Columns", + "content": "

Table column attribute setting type="selection" Display multiple columns.

\n", + "link": "grid/tiny-first-menu/custom-serial-column", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-custom-serial-column" + }, + { + "title": "Manually Cancel Multiple Rows", + "content": "For details, see the following example.", + "link": "grid/tiny-first-menu/clearSelection", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-clearSelection" + }, + { + "title": "Manually select all lines", + "content": "

setAllSelection(checked) is used to select multiple rows. You can set the selected status of all rows.

\n", + "link": "grid/methods/set-all-selection", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "methods-set-all-selection" + }, + { + "title": "Manually select a specified line", + "content": "

setSelection(rows, checked) is used to select multiple lines. You can set the selected status of a specified line. The first parameter can be transferred to an object or array. If an object is used, select a single line. If an array is used, select multiple lines. The second parameter indicates whether to select or not. The

\n

TIP

\n

setSelection method does not trigger the select-change event. It is triggered only when you click it.

In multi-selection mode, the checkField attribute of the select-config configuration item determines the selection status of a row of data. (and the selected state and this field are bidirectionally bound).

\n
\n", + "link": "grid/methods/set-selection", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "methods-set-selection" + }, + { + "title": "Manually switch the selection status of all rows.", + "content": "The

toggleAllSelection() method directly switches the selection status of all rows.

\n", + "link": "grid/methods/toggle-all-selection", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "methods-toggle-all-selection" + }, + { + "title": "Manually switch the selected status of a specified row.", + "content": "The

toggleRowSelection(row) method directly switches the selection status of a row.

\n", + "link": "grid/methods/toggle-row-selection", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "methods-toggle-row-selection" + }, + { + "title": "Multi-choice disabled", + "content": "

Multi-choice mode. The attribute checkMethod of the select-config configuration item is used to determine which data items are disabled. The method determines each data item. If the return value is true or false, the data item is enabled or disabled.

\n", + "link": "grid/disable-selection", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "disable-selection" + }, + { + "title": "User-defined Operation Column Content", + "content": "

Set the customized operation column by slot, that is, <tiny-grid-column> customized operation column content </tiny-grid-column> .

\n", + "link": "grid/tiny-first-menu/custom-operation-column", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-custom-operation-column" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-pager.json b/examples/docs/resources/pc/demo-config/en-US/grid-pager.json new file mode 100644 index 000000000..d04aa6f90 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-pager.json @@ -0,0 +1,18 @@ +[ + { + "title": "Basic Usage", + "content": "

To ensure that the table is lightweight and open, the table is modularized and split. The core code is lightweight. The paging component needs to be introduced to the paging function. The built-in paging configuration procedure is as follows: \n1. import introduces the official Pager component. That is, import Pager from '@opentiny/vue-pager' or {Pager} from '@opentiny/vue'. \n2. Pager is transferred to the data() function and stored for use in the template. \n3. Set the table attribute pager to configure pagination and inject the pagination component through the {component: Pager} attribute of pager. \n4. Configure the seq-serial attribute to set the sequence number to be displayed consecutively after page turning. By default, the sequence number is displayed discontinuously.

\n", + "link": "grid/pager/inner-pager", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "pager-inner-pager" + }, + { + "title": "The system prompts you to save data.", + "content": "

Configure the showSaveMsg attribute. When the table data is modified, the system prompts you to save the modification.

\n", + "link": "grid/pager/showSaveMsg", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "pager-showSaveMsg" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-renderer.json b/examples/docs/resources/pc/demo-config/en-US/grid-renderer.json new file mode 100644 index 000000000..32dceb689 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-renderer.json @@ -0,0 +1,26 @@ +[ + { + "title": "Built-in Renderer", + "content": "

The built-in renderer sets the display obtaining type of the current table column. \n Configure the format-text object in the grid-column column to control the data format. The options of

\n

TIP

\n

format-text are as follows:

\n
    \n
  • integer: displayed as an integer.
  • \n
  • number: The value is displayed as a decimal.
  • \n
  • money: displays the amount of money.
  • \n
  • rate: The data is displayed as a percentage.
  • \n
  • filesize: indicates the file size.
  • \n
  • boole: displays the icon with a pair or cross.
  • \n
  • date: indicates the year, month, and day.
  • \n
  • dateTime: indicates the year, month, day, hour, and minute.
  • \n
  • longDateTime: year, month, day, hour, minute, and second.
  • \n
  • time: time and hour.
  • \n
  • longTime: hour, minute, and second.
  • \n
  • yearMonth: displays the adult month.
  • \n
  • enum: Queries the text to be displayed based on the data value.
  • \n
  • ellipsis: displays the omitted content. When you move the cursor to the cell, the complete content is displayed. The len attribute of format must also be configured.
  • \n
\n
\n", + "link": "grid/grid_Example/gridRenderer/inner-renderer", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-gridRenderer-inner-renderer" + }, + { + "title": "Custom Renderer", + "content": "

The custom renderer can customize the rendering of cells or a vue component. Configure renderer in the grid-column column to support method and object configuration. For details, see the following example.

\n", + "link": "grid/grid_Example/gridRenderer/custom-renderer", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-gridRenderer-custom-renderer" + }, + { + "title": "Column Asynchronous Data Rendering", + "content": "

After the async attribute of the format-config column is set to true, the data data can be dynamically modified for automatic rendering. Generally, type is set to enum, and value and label can be used to configure the mapping of rendering cells.

\n", + "link": "grid/news/async-colunm-render", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "news-async-colunm-render" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-reverse-column-row.json b/examples/docs/resources/pc/demo-config/en-US/grid-reverse-column-row.json new file mode 100644 index 000000000..c772c703a --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-reverse-column-row.json @@ -0,0 +1,10 @@ +[ + { + "title": "Grid-Inverting Rows and Columns in a Table", + "content": "

You need to configure :columns="tableColumn" :show-header="false" on the grid tag. Click the 'Reverse Table' button to view the effect. Currently, the operation can only be performed once. If the operation is performed multiple times, problems may occur. For details, see the following example.

\n", + "link": "grid/grid_Example/reverseRow", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-reverseRow" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-row-grouping.json b/examples/docs/resources/pc/demo-config/en-US/grid-row-grouping.json new file mode 100644 index 000000000..e62554eef --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-row-grouping.json @@ -0,0 +1,18 @@ +[ + { + "title": "Basic Usage", + "content": "Row groups can be configured for the

row-group attribute. Columns with the same value are displayed in groups.

\n", + "link": "grid/row-grouping", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "row-grouping" + }, + { + "title": "Customized Group", + "content": "The

row-group configuration item render can be used to customize group content rendering, and closeable can be used to control whether group lines can be collapsed.

\n", + "link": "grid/rowGroupRender", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "rowGroupRender" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-serial-column.json b/examples/docs/resources/pc/demo-config/en-US/grid-serial-column.json new file mode 100644 index 000000000..31b57a7bd --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-serial-column.json @@ -0,0 +1,26 @@ +[ + { + "title": "Basic Usage", + "content": "

Table column attribute setting type="index" Display sequence number column.

\n", + "link": "grid/tiny-first-menu/default-serial-column", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-default-serial-column" + }, + { + "title": "User-defined sequence number rule", + "content": "

The table column attribute sets type="index" to display the sequence number column. The index-method method sets the user-defined sequence number rule.

\n", + "link": "grid/tiny-first-menu/custom-serial-column", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-custom-serial-column" + }, + { + "title": "Start value of the user-defined sequence number column", + "content": "

Set the table column attribute type="index" to display the sequence number column, and start-index to set the start value of the customized sequence number column.

\n", + "link": "grid/tiny-first-menu/start-index", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-start-index" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-slot.json b/examples/docs/resources/pc/demo-config/en-US/grid-slot.json new file mode 100644 index 000000000..d20b05a9a --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-slot.json @@ -0,0 +1,26 @@ +[ + { + "title": "Default slot", + "content": "For details, see the following example.", + "link": "grid/slot/default-slot", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "slot-default-slot" + }, + { + "title": "Toolbar slot", + "content": "For details, see the following example.", + "link": "grid/slot/buttons-slot", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "slot-buttons-slot" + }, + { + "title": "Empty data display slot", + "content": "For details, see the following example.", + "link": "grid/slot/empty-slot", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "slot-empty-slot" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-sort.json b/examples/docs/resources/pc/demo-config/en-US/grid-sort.json new file mode 100644 index 000000000..03bc78eab --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-sort.json @@ -0,0 +1,50 @@ +[ + { + "title": "Default Sorting", + "content": "

Enable the sorting function by setting the sortable attribute of the table column.

\n", + "link": "grid/sort/default-sort", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "sort-default-sort" + }, + { + "title": "Unique Primary Key", + "content": "

Set the row-id field name of the unique primary key of user-defined row data in a table. The default value of this property is _XID

\n", + "link": "grid/tiny-first-menu/row-id", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-row-id" + }, + { + "title": "Multi-field sorting", + "content": "

Set the sortable attribute of the table column to enable the sorting function of the column, and then set the sort-by attribute to implement multi-field sorting. An array list is a sorted list of fields.

\n", + "link": "grid/sort/combinations-sort", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "sort-combinations-sort" + }, + { + "title": "Custom Sorting", + "content": "

Set the sortable attribute of the table column to enable the sorting function for the column, and then set the sort-method method to implement user-defined sorting.

\n", + "link": "grid/sort/custom-sort", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "sort-custom-sort" + }, + { + "title": "Manual Sorting", + "content": "

You can use the sort(field, order) method to manually sort tables. If order is empty, the sorting is automatically switched.

\n", + "link": "grid/methods/sort", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "methods-sort" + }, + { + "title": "Table server sorting", + "content": "

Set the sortable attribute of the table column to enable the sorting function, and then set the remote-sort method to enable the sorting function on the server. \nIn this example, the services/getGridMockData service needs to be implemented. The example simulates the data returned by the remote service.\n

\n", + "link": "grid/sort/server-sort", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "sort-server-sort" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-span.json b/examples/docs/resources/pc/demo-config/en-US/grid-span.json new file mode 100644 index 000000000..c629c2743 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-span.json @@ -0,0 +1,26 @@ +[ + { + "title": "Basic Usage", + "content": "

Set the built-in row combination rule through the table column attribute row-span. This attribute applies only to common tables and does not apply to nested tree tables.

\n", + "link": "grid/span/row-span/row-span-easy", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "span-row-span-row-span-easy" + }, + { + "title": "Custom Combination Rule", + "content": "

Set a custom combination rule through the table column attribute span-method.

\n", + "link": "grid/span/row-span/row-span", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "span-row-span-row-span" + }, + { + "title": "Column Merge", + "content": "

Column combination is a user-defined combination rule implemented by using the span-method table column setting method. For example,

\n
\n

can combine two columns into

\n
\n", + "link": "grid/span/column-span", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "span-column-span" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-summary.json b/examples/docs/resources/pc/demo-config/en-US/grid-summary.json new file mode 100644 index 000000000..fe4604d74 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-summary.json @@ -0,0 +1,18 @@ +[ + { + "title": "Basic Usage", + "content": "

Configure custom statistics through footer-method and show-footer.

\n", + "link": "grid/summary/custom-summary", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "summary-custom-summary" + }, + { + "title": "Set Profile Statistics", + "content": "

Set the profile statistics using summary-config.

\n", + "link": "grid/summary/configuration-summary", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "summary-configuration-summary" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-tip.json b/examples/docs/resources/pc/demo-config/en-US/grid-tip.json new file mode 100644 index 000000000..4cf553e10 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-tip.json @@ -0,0 +1,18 @@ +[ + { + "title": "Column Header Prompt", + "content": "

There are two types of column header prompts. One is show-header-tip prompt (a prompt is displayed regardless of whether the content exceeds the value of show-header-overflow). The other is hidden and prompt when the content exceeds the current line. The options of

\n

TIP

\n

show-header-overflow are as follows:

\n
    \n
  • tooltip: displays the content that exceeds the value of ..., displays all information at the prompt layer on the left or right, and displays the default prompt when show-overflow is enabled.
  • \n
  • title: Same as the title attribute of the native tag.
  • \n
  • ellipsis: ... is displayed for the extra content, and
  • \n
\n
\n is not displayed", + "link": "grid/tip/column-header-tip", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tip-column-header-tip" + }, + { + "title": "Cell Prompt", + "content": "

There are two types of cell prompts. One is the show-tip prompt (a prompt is displayed regardless of whether the content exceeds the current line). The other is the show-overflow prompt is hidden and displayed when the content exceeds the current line. The options of

\n

TIP

\n

show-overflow are as follows:

\n
    \n
  • title: consistent with the title attribute of the native tag
  • \n
  • ellipsis: ... is displayed for the extra content.
  • \n
  • tooltip: ... is displayed for the extra content. The left/right pop-up prompt layer displays all information. The default prompt when show-overflow is enabled\ntooltip can be prompted through the Grid property : Configure tooltip-config. For details about the configuration method, see
  • \n
\n
\n of the Tooltip
component", + "link": "grid/tip/cell-tip", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tip-cell-tip" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-toolbar.json b/examples/docs/resources/pc/demo-config/en-US/grid-toolbar.json new file mode 100644 index 000000000..20fa4f82d --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-toolbar.json @@ -0,0 +1,90 @@ +[ + { + "title": "Basic Usage", + "content": "

Toolbar configuration procedure:\n1. Import the table toolbar component GridToolbar in slot mode and set the toolbar component attribute slot="toolbar" . \n2. Set the toolbar component attribute buttons and configure the button group. \n3. Table event setting: The @toolbar-button-click obtains the buttons event on the toolbar. Users can customize the service logic for adding, deleting, and modifying operations. To mark a new line in the

\n

state, set markInsert in edit-config to true

\n
\n", + "link": "grid/tiny-first-menu/insert-delete-update", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-insert-delete-update" + }, + { + "title": "Cancel deletion", + "content": "

Configure the code of mark_cancel on the toolbar, select the data, and click Delete/Undelete. The selected data is marked with strikethrough. Then click the Save button to request the service to delete the marked data. Select the data marked with strikethrough and click Delete/Undelete again to cancel the strikethrough. \nThe effect of marking and canceling strikethrough is available only when the fetch-data request service is configured.\n

\n", + "link": "grid/toolbar/cancel-delete", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "toolbar-cancel-delete" + }, + { + "title": "Clear Data", + "content": "

clearData method manually clears the cell content. If no parameter is transferred, the entire table content is cleared. If a line is transferred, the specified line is cleared. If a field is transferred, the field is cleared. For details, see the following example.

\n", + "link": "grid/tiny-first-menu/clearData", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-clearData" + }, + { + "title": "Insert data to a specified row and delete a specified row", + "content": "

You can use the insertAt(records, row) method to insert one or more rows of data to a specified row. The remove(rows) method can be used to delete one or more specified rows of data. If rows is an object, it is one row. If an array is an array, it is multiple rows of data. If the value is empty, all data is deleted.

\n", + "link": "grid/toolbar/insert-remove-rows", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "toolbar-insert-remove-rows" + }, + { + "title": "Saving and Deleting Server Data", + "content": "

Use the table attribute save-data to save server data. \n Use the table attribute delete-data to delete server data.

\n", + "link": "grid/tiny-first-menu/save-data", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-save-data" + }, + { + "title": "Set the toolbar size", + "content": "

Toolbar configuration procedure:\n1. Import the table toolbar component GridToolbar in slot mode and set the toolbar component attribute slot="toolbar" . \n2. Set the toolbar component attribute buttons and configure the button group. \n3. Set the table event @toolbar-button-click to obtain the buttons event on the toolbar. You can customize the service logic for copying rows. The

\n
    \n
  • size property specifies the size of the toolbar. The options are large, medium, small, and mini. If this parameter is not set, the default size is used.
  • \n
\n", + "link": "grid/tiny-first-menu/copy-row-data", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-copy-row-data" + }, + { + "title": "Enable the table refresh function", + "content": "

Toolbar configuration procedure:\n1. Import the table toolbar component GridToolbar in slot mode and set the toolbar component attribute slot="toolbar" . \n2. Set the toolbar component attribute refresh to enable the table refresh function.

\n
    \n
  • Setting Toolbar Properties loadingEnable/Disable Loading. \n handleFetch('reload')
  • \n
\n is invoked when the customized implementation is refreshed", + "link": "grid/tiny-first-menu/refresh-grid", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-refresh-grid" + }, + { + "title": "Enable the full-screen function of the table.", + "content": "

Toolbar configuration procedure:\n1. Import the table toolbar component GridToolbar in slot mode and set the toolbar component attribute slot="toolbar" . \n2. Set the toolbar component attribute full-screen to enable the full-screen function.

\n", + "link": "grid/tiny-first-menu/grid-full-screen", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-grid-full-screen" + }, + { + "title": "Change the table height in full screen mode", + "content": "For details, see the following example.", + "link": "grid/tiny-first-menu/grid-full-screen-height", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-grid-full-screen-height" + }, + { + "title": "Toolbar Custom Slot", + "content": "

Toolbar configuration procedure:\n1. Import the table toolbar component GridToolbar in slot mode and set the toolbar component slot #toolbar. \n2. Customize content through the slot #buttons of the toolbar component.

\n", + "link": "grid/tiny-first-menu/custom-toolbar", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-custom-toolbar" + }, + { + "title": "Profile", + "content": "

The v-bind is bound to an object to implement the profile. In the bound object, the toolbar field is used to configure the toolbar. The events field can be used to configure the toolbarButtonClick event for buttons on the toolbar. In addition, the pager field is used for pagination configuration, and the fetchData field is used for service request.

\n", + "link": "grid/toolbar/toolbar-op-config", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "toolbar-toolbar-op-config" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-tree-grid.json b/examples/docs/resources/pc/demo-config/en-US/grid-tree-grid.json new file mode 100644 index 000000000..8298c9b7a --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-tree-grid.json @@ -0,0 +1,106 @@ +[ + { + "title": "Data structure with children", + "content": "

Configure tree-config="{children:'children'}" on the grid tab to display data in a tree. In addition, you need to configure the tree-node attribute

\n on the field that displays the tree node", + "link": "grid/tree-table/tree-grid-base", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tree-table-tree-grid-base" + }, + { + "title": "Flat Data Structure", + "content": "

Note: For a flattened data structure, you need to invoke the aggregateTableData method to convert data into data with sublevels to display the tree table structure.

\n", + "link": "grid/tree-table/tree-grid-data", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tree-table-tree-grid-data" + }, + { + "title": "Operation Column", + "content": "In the

column, you can set type="radio" to enable single selection and type="selection" to enable multiple selection

\n", + "link": "grid/tree-table/tree-grid-operation-column", + "component": "Tree Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tree-table-tree-grid-operation-column" + }, + { + "title": "Manually expand all tree nodes", + "content": "

setAllTreeExpansion(checked) can be used to set whether all tree nodes are expanded or not.

\n", + "link": "grid/methods/set-all-tree-expansion", + "component": "Tree Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "methods-set-all-tree-expansion" + }, + { + "title": "Manually expand a specified tree node", + "content": "You can set

setTreeExpansion(rows, checked) to expand the specified tree node. The second parameter specifies whether to expand the row.

\n", + "link": "grid/methods/set-tree-expansion", + "component": "Tree Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "methods-set-tree-expansion" + }, + { + "title": "Manually switch and expand tree nodes", + "content": "The

toggleTreeExpansion(row) can be set to switch to expand the tree node.

\n", + "link": "grid/methods/toggle-tree-expansion", + "component": "Tree Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "methods-toggle-tree-expansion" + }, + { + "title": "Frozen Column", + "content": "

On the column label, you can set the fixed="left" attribute to fix the column on the left, and set the fixed="right" attribute to fix the column on the right

\n", + "link": "grid/tree-table/tree-grid-fixed-column", + "component": "Tree Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tree-table-tree-grid-fixed-column" + }, + { + "title": "Expand Row", + "content": "

Configure type="expand" on the column label to expand the line. You can insert the required template information through the v-slot slot

\n", + "link": "grid/tree-table/tree-grid-expand", + "component": "Tree Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tree-table-tree-grid-expand" + }, + { + "title": "Check whether the tree node is expanded.", + "content": "

You can use the hasTreeExpand(row) method to check whether a tree node is expanded. The row parameter indicates the row data object.

\n", + "link": "grid/tree-table/hasTreeExpand", + "component": "Tree Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tree-table-hasTreeExpand" + }, + { + "title": "Expand Row No. Column Configuration", + "content": "

In the treeConfig attribute, set ordered to false to expand rows. The sequence number column is sorted by parent-child structure. By default, the ordered attribute is true. After the row is expanded, the sequence number column is sorted by sequence number.

\n", + "link": "grid/tree-table/tree-grid-index", + "component": "Tree Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tree-table-tree-grid-index" + }, + { + "title": "Basic Usage", + "content": "

Table propertyexpand-configSet the configuration item of the expanded line.

\n", + "link": "grid/tree-table/tree-grid-expand-config", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tree-table-tree-grid-expand-config" + }, + { + "title": "Add, Delete, and Modify", + "content": "

Set slot="toolbar" on the grid-toolbar tab, and configure related operation buttons. Note: To add data, you need to configure the edit-config text box on the grid tab. In addition, the component instance invokes methods through ref to perform related operations. findTree and filterTree are search and filter methods in the tool class. Due to the special structure of tree data, the getInsertRecords and getRecordset methods of the grid cannot obtain new data. Such data needs to be processed by users.

\n", + "link": "grid/tree-table/tree-grid-insert-delete-update", + "component": "Tree Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tree-table-tree-grid-insert-delete-update" + }, + { + "title": "Keyboard operation", + "content": "

Move the highlighted row, set stripe to false, highlight-hover-row to false, and highlight-current-row to false. Configure the keyboard-config={isArrow: true} attribute to enable the arrow keys function.\n | Arrow Up | Move to the previous line of the highlighted line\n | Arrow Down | Move to the next line of the highlighted line\n | Enter | Expand the node. Enter the child node\n | Backspace | Close the node and return to the parent node

\n", + "link": "grid/tree-table/tree-grid-keyboard-operation", + "component": "Tree Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tree-table-tree-grid-keyboard-operation" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-validation.json b/examples/docs/resources/pc/demo-config/en-US/grid-validation.json new file mode 100644 index 000000000..d9f187a35 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-validation.json @@ -0,0 +1,66 @@ +[ + { + "title": "Verify during editing", + "content": "The

grid tag configures the edit-config object, and configures the edit-rules object to set the validation object and validation rule. For details, see the following example.

\n", + "link": "grid/grid_Example/gridValid/editing-validation", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-gridValid-editing-validation" + }, + { + "title": "Verify hidden columns during editing", + "content": "

When the edit-config object is configured for the grid tag, type is set to visible, and isValidAlways is configured for the column, that is, the column is always editable, verification during editing is supported. Configure the edit-rules object to set the verification object and verification rule. For details, see the following example.

\n", + "link": "grid/grid_Example/gridValid/editing-isvalidalways-validation", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-gridValid-editing-isvalidalways-validation" + }, + { + "title": "Data Association Verification", + "content": "

During customized validation, the validator method rule parameter can obtain the current row and column information. The verification logic of data association can be implemented based on service requirements.

\n", + "link": "grid/grid_Example/gridValid/row-data-valid", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-gridValid-row-data-valid" + }, + { + "title": "Verify the customized component with the slot editor", + "content": "

When using a custom component, the component needs to implement the v-model function. If you want to verify the slot in real time, you need to manually trigger the verification method of the component.

\n", + "link": "grid/grid_Example/gridValid/custcomp", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-gridValid-custcomp" + }, + { + "title": "Verify when selected", + "content": "The

grid tag configures the edit-config object, configures the edit-rules object to set the validation object and validation rule, and invokes the this.$refs.basicGrid.validate() method to trigger table validation through the button click event. For details, see the following example.

\n", + "link": "grid/grid_Example/gridValid/select-validation", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-gridValid-select-validation" + }, + { + "title": "Verify Before Submission", + "content": "The

grid tag configures the edit-config object, configures the edit-rules object to set the validation object and validation rule, and invokes the this.$refs.basicGrid.validate() method to trigger table validation through the button click event. For details, see the following example.

\n", + "link": "grid/grid_Example/gridValid/before-submit-validation", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-gridValid-before-submit-validation" + }, + { + "title": "When the verification is triggered, the current verification cell is automatically located.", + "content": "

The grid editor introduces the tiny.0 component, configures the edit-config object in the tag, and configures the edit-rules object to set the verification object and verification rule. Invoke the this.$refs.basicGrid.validate() method through the button click event to trigger table validation. For details, see the following example.

\n", + "link": "grid/grid_Example/gridValid/validation-scroll-to-col", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-gridValid-validation-scroll-to-col" + }, + { + "title": "Error prompt configuration item", + "content": "

The default error message is displayed on body. You can set appendTobody in tooltip-config to false to solve the problem that the tip position is incorrect during page scrolling. Set the placement property to adjust the default display direction. For details about the tooltip-config configuration, see the tooltip component

\n", + "link": "grid/grid_Example/gridValid/tipconfig", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "grid_Example-gridValid-tipconfig" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid-width-height.json b/examples/docs/resources/pc/demo-config/en-US/grid-width-height.json new file mode 100644 index 000000000..22eacfba7 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid-width-height.json @@ -0,0 +1,106 @@ +[ + { + "title": "Enable column width dragging", + "content": "

Column width is enabled by default. To disable this function, set resizable to false

\n", + "link": "grid/tiny-first-menu/resize-column-width", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-resize-column-width" + }, + { + "title": "Table column attribute width", + "content": "

The fixed width of the table column attribute is set. Values and percentages are supported.

\n", + "link": "grid/tiny-first-menu/fixed-column-width", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-fixed-column-width" + }, + { + "title": "Adaptive expansion of column width", + "content": "

The table attribute is set to automatically expand fit. The default value is true, and adaptive expansion is enabled. If the value is false, the column width must be set. Otherwise, the table width is expanded by the cell content.

\n", + "link": "grid/tiny-first-menu/adaptive-column-width", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-adaptive-column-width" + }, + { + "title": "The column width is not adaptively extended", + "content": "For details, see the following example.", + "link": "grid/tiny-first-menu/adaptive-un-column-width", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-adaptive-un-column-width" + }, + { + "title": "Table Attribute Setting Height", + "content": "

Table attribute setting height Fixed table height.

\n", + "link": "grid/tiny-first-menu/fixed-grid-height", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-fixed-grid-height" + }, + { + "title": "Disable responsive table width and height", + "content": "For details, see the following example.", + "link": "grid/tiny-first-menu/adaptive-grid-off-width-height", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-adaptive-grid-off-width-height" + }, + { + "title": "Enable responsive table width and height", + "content": "

Table property setting autoResize property enabling responsive table width and height, set height heigh to auto to automatically follow the height of the parent container.

\n", + "link": "grid/news/auto-height", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "news-auto-height" + }, + { + "title": "Set the minimum height of minHeight", + "content": "

Set minHeight to the minimum height and maxHeight to the maximum height.

\n", + "link": "grid/tiny-first-menu/min-grid-height", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-min-grid-height" + }, + { + "title": "Set the maximum height of maxHeight", + "content": "For details, see the following example.", + "link": "grid/tiny-first-menu/max-min-grid-height", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-max-min-grid-height" + }, + { + "title": "Set the overall column width", + "content": "

Set the minimum width of the overall column by using the column-min-width attribute. If this parameter is not set, the width of the column header span plus 36 (fixed width of the header) is used by default. \n

\n", + "link": "grid/tiny-first-menu/column-min-width", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-column-min-width" + }, + { + "title": "Minimum width of this column", + "content": "

Minimum width of this column based on the table column attribute min-width; The automatically allocates the remaining space proportionally. \n

\n", + "link": "grid/tiny-first-menu/min-width", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-min-width" + }, + { + "title": "Set the width of all columns", + "content": "

Set the width of all columns through the column-width attribute. The default value is even distribution. \n

\n", + "link": "grid/tiny-first-menu/column-width", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "tiny-first-menu-column-width" + }, + { + "title": "Recalculate Table", + "content": "

The recalculate() method can be used to recalculate the table when the width of the parent container changes.

\n", + "link": "grid/recalculate", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "recalculate" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/grid.json b/examples/docs/resources/pc/demo-config/en-US/grid.json new file mode 100644 index 000000000..5a53675d3 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/grid.json @@ -0,0 +1,18 @@ +[ + { + "title": "Label", + "content": "For details, see the following example.", + "link": "grid/basicUsage", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "basicUsage" + }, + { + "title": "Profile", + "content": "For details, see the following example.", + "link": "grid/basicUsage-conf", + "component": "Grid Table", + "findIntroStr": "Table component, which provides powerful data table functions. In Grid, data lists can be displayed, selected, and edited.", + "demoId": "basicUsage-conf" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/hrapprover.json b/examples/docs/resources/pc/demo-config/en-US/hrapprover.json new file mode 100644 index 000000000..aa1dfe7c9 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/hrapprover.json @@ -0,0 +1,34 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "hrapprover/basic-usage", + "component": "Hrapprover approver", + "findIntroStr": "The approver business component is used to query approvers by department.", + "demoId": "basic-usage" + }, + { + "title": "Approval Type", + "content": "

You can set the approval type through category. The default value is 0303, which is the category parameter of the request sent by the approver.

\n", + "link": "hrapprover/category-type", + "component": "Hrapprover approver", + "findIntroStr": "The approver business component is used to query approvers by department.", + "demoId": "category-type" + }, + { + "title": "Disabled", + "content": "

Use value to set the value of the approver. Use disabled to set whether to disable the component. The default value is false.

\n", + "link": "hrapprover/disabled", + "component": "Hrapprover approver", + "findIntroStr": "The approver business component is used to query approvers by department.", + "demoId": "disabled" + }, + { + "title": "Custom Service", + "content": "

You can use the fetch-hrapprover attribute to specify a method in which the service customized by the request can be implemented.

\n", + "link": "hrapprover/custom-service", + "component": "Hrapprover approver", + "findIntroStr": "The approver business component is used to query approvers by department.", + "demoId": "custom-service" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/icon.json b/examples/docs/resources/pc/demo-config/en-US/icon.json new file mode 100644 index 000000000..54180481e --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/icon.json @@ -0,0 +1,26 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "icon/basic-usage", + "component": "Icon", + "findIntroStr": "Provides a set of common icons, which can be used by setting the class name `icon-iconName`.", + "demoId": "basic-usage" + }, + { + "title": "Display Title", + "content": "

The title attribute is added to the parent element of an icon to add a title to the icon.

\n", + "link": "icon/show-title", + "component": "Icon", + "findIntroStr": "Provides a set of common icons, which can be used by setting the class name `icon-iconName`.", + "demoId": "show-title" + }, + { + "title": "Icon Set", + "content": "For details, see the following example.", + "link": "icon/list", + "component": "Icon", + "findIntroStr": "Provides a set of common icons, which can be used by setting the class name `icon-iconName`.", + "demoId": "list" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/image.json b/examples/docs/resources/pc/demo-config/en-US/image.json new file mode 100644 index 000000000..0a8de0155 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/image.json @@ -0,0 +1,82 @@ +[ + { + "title": "Basic Usage", + "content": "

Set the preview image path through src.

\n", + "link": "image/basic-usage", + "component": "Image preview", + "findIntroStr": "Image container, which supports lazy loading, customized placeholder, and loading failure while retaining the native IMG feature.", + "demoId": "basic-usage" + }, + { + "title": "Adaptive Container Size", + "content": "

You can use the fit attribute to determine how an image adapts to the container box, which is the same as the object-fit attribute of the native CSS.

\n

object-fit Description

\n

fill: The replaced content will be scaled to maintain its aspect ratio when filling the content box of the element\ncontain: The size of the replaced content can fill the content box of the element\ncover: The size of the replaced content maintains its aspect ratio while filling the entire content box of the element\nnone: The size of the replaced content is not changed\nscale-down: The size of the content is as if none or contain were specified, depending on which would result in a smaller object size.

\n
\n", + "link": "image/auto-fit-container-size", + "component": "Image preview", + "findIntroStr": "Image container, which supports lazy loading, customized placeholder, and loading failure while retaining the native IMG feature.", + "demoId": "auto-fit-container-size" + }, + { + "title": "Placeholder", + "content": "

You can use slot = placeholder to customize the placeholder.

\n", + "link": "image/custom-placeholder", + "component": "Image preview", + "findIntroStr": "Image container, which supports lazy loading, customized placeholder, and loading failure while retaining the native IMG feature.", + "demoId": "custom-placeholder" + }, + { + "title": "Lazy Loading", + "content": "

You can use lazy to enable lazy loading. Images are loaded only when they are scrolled to the visible range. You can use scroll-container to set the scroll container. If the scroll container is not defined, the scroll container is the parent element whose latest overflow value is auto or scroll.

\n

Prompt

\n

The lazy loaded image must be a remote image. Lazy loading of static images is not supported.

\n
\n", + "link": "image/lazy-load", + "component": "Image preview", + "findIntroStr": "Image container, which supports lazy loading, customized placeholder, and loading failure while retaining the native IMG feature.", + "demoId": "lazy-load" + }, + { + "title": "Preview Large Image", + "content": "

Enable the large image preview function through preview-src-list .

\n", + "link": "image/preview-src-list", + "component": "Image preview", + "findIntroStr": "Image container, which supports lazy loading, customized placeholder, and loading failure while retaining the native IMG feature.", + "demoId": "preview-src-list" + }, + { + "title": "Image preview level", + "content": "

You can use z-index to set the level of the preview image.

\n", + "link": "image/preview-z-index", + "component": "Image preview", + "findIntroStr": "Image container, which supports lazy loading, customized placeholder, and loading failure while retaining the native IMG feature.", + "demoId": "preview-z-index" + }, + { + "title": "Load success event", + "content": "

The load event is triggered when the image is successfully loaded.

\n", + "link": "image/load-event", + "component": "Image preview", + "findIntroStr": "Image container, which supports lazy loading, customized placeholder, and loading failure while retaining the native IMG feature.", + "demoId": "load-event" + }, + { + "title": "Loading failure event", + "content": "

The error event is triggered when the image fails to be loaded.

\n", + "link": "image/load-error", + "component": "Image preview", + "findIntroStr": "Image container, which supports lazy loading, customized placeholder, and loading failure while retaining the native IMG feature.", + "demoId": "load-error" + }, + { + "title": "Loading failed", + "content": "

You can set slot = error to customize the content that fails to be loaded.

\n", + "link": "image/custom-load-failed-text", + "component": "Image preview", + "findIntroStr": "Image container, which supports lazy loading, customized placeholder, and loading failure while retaining the native IMG feature.", + "demoId": "custom-load-failed-text" + }, + { + "title": "Preview image in a dialog box", + "content": "

Embed image in the dialog-box element for image preview.

\n", + "link": "image/preview-in-dialog", + "component": "Image preview", + "findIntroStr": "Image container, which supports lazy loading, customized placeholder, and loading failure while retaining the native IMG feature.", + "demoId": "preview-in-dialog" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/input.json b/examples/docs/resources/pc/demo-config/en-US/input.json new file mode 100644 index 000000000..a321f6de3 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/input.json @@ -0,0 +1,290 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "input/basic-usage", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "basic-usage" + }, + { + "title": "Can be cleared", + "content": "

You can set the clearable attribute to display the clear icon button in the text box.

\n", + "link": "input/clearable", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "clearable" + }, + { + "title": "Password Display", + "content": "

When type is set to password, you can set the show-password attribute to display or hide the password switch button in the text box.

\n", + "link": "input/show-password", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "show-password" + }, + { + "title": "type attribute", + "content": "

You can set the corresponding type through the corresponding type attribute. The default value is text. The options are text, textarea, and other type values of the native input

\n", + "link": "input/type", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "type" + }, + { + "title": "Dimension", + "content": "

You can set the size through the size attribute. The options are as follows: medium, small, and mini. Note: This parameter is valid only when type!="textarea" is used.

\n", + "link": "input/size", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "size" + }, + { + "title": "form", + "content": "

You can set the native attribute form through the form attribute.

\n", + "link": "input/form", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "form" + }, + { + "title": "Native Attribute", + "content": "

You can set native attributes such as name disabled readonly .

\n", + "link": "input/name", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "name" + }, + { + "title": "Text associated with the text box", + "content": "

You can set the label text associated with the text box through the label attribute.

\n", + "link": "input/label", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "label" + }, + { + "title": "Head icon", + "content": "

You can set the header icon of the text box through the prefix-icon attribute.

\n", + "link": "input/prefix-icon", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "prefix-icon" + }, + { + "title": "Fall icon", + "content": "

You can set the icon at the end of the text box through the suffix-icon attribute.

\n", + "link": "input/suffix-icon", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "suffix-icon" + }, + { + "title": "Scalable Text Field", + "content": "

You can use the resize property to set the zoom of the text field. The value can be none / both / horizontal / vertical . Note: This parameter is valid only when type="textarea" is used.

\n", + "link": "input/resize", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "resize" + }, + { + "title": "Lines of the text field", + "content": "

You can set the number of lines displayed in the text field through the rows property. Note: This parameter is valid only when text="textarea" is used.

\n", + "link": "input/rows", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "rows" + }, + { + "title": "Text Field Width", + "content": "

You can set the width of the text field through the cols attribute. Note: This parameter is valid only when text="textarea" is used.

\n", + "link": "input/cols", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "cols" + }, + { + "title": "Text field that can adapt to the text height", + "content": "

You can use the autosize attribute to set the text field to adapt to the content height. You can transfer an object, for example, {minRows: 2, maxRows: 6} . Note: This parameter is valid only for type="textarea" .

\n", + "link": "input/autosize", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "autosize" + }, + { + "title": "tabindex of the text box", + "content": "

You can use the tabindex attribute to set the tabindex

\n", + "link": "input/tabindex", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "tabindex" + }, + { + "title": "Pre-content", + "content": "

Configure prepend slot to set the front content of the text box. Note: This parameter is valid only for type="text" .

\n", + "link": "input/slot-prepend", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "slot-prepend" + }, + { + "title": "Post Content", + "content": "

Configure append slot and set the content after the text box. Note: This parameter is valid only for type="text" .

\n", + "link": "input/slot-append", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "slot-append" + }, + { + "title": "Header Content", + "content": "

Configure prefix slot to set the text box header content. Note: This parameter is valid only for type="text" .

\n", + "link": "input/slot-prefix", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "slot-prefix" + }, + { + "title": "Follow Content", + "content": "

Configure the suffix slot and set the content at the end of the text box. Note: This parameter is valid only for type="text" .

\n", + "link": "input/slot-suffix", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "slot-suffix" + }, + { + "title": "Maximum value", + "content": "

You can set the maximum value of the text box through the max attribute. max is a native attribute.

\n", + "link": "input/max", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "max" + }, + { + "title": "Minimum value", + "content": "

You can set the minimum value of the text box through the min attribute. min is a native attribute.

\n", + "link": "input/min", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "min" + }, + { + "title": "Maximum input length", + "content": "

You can set the maximum length of the text box through the maxlength attribute. maxlength is a native attribute.

\n", + "link": "input/maxlength", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "maxlength" + }, + { + "title": "Input word count", + "content": "

The show-word-limit attribute can be used to set whether to display the input word statistics, only when type = "text" or type = "textarea" is valid

\n", + "link": "input/show-word-limit", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "show-word-limit" + }, + { + "title": "Counter", + "content": "

You can use the counter attribute to set the character counter for displaying the text box.

\n", + "link": "input/counter", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "counter" + }, + { + "title": "Valid interval between digits in the input field", + "content": "

You can use the step attribute to set the valid digit interval of the input field. step is a native attribute.

\n", + "link": "input/step", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "step" + }, + { + "title": "Form validation triggered upon input", + "content": "

You can set the validate-event attribute to trigger form validation upon input. Use trigger to configure the mode of triggering the validation rule. If change is used, the validation is triggered when the value in the text box changes. If blur is used, the validation is triggered after the focus is lost.

\n", + "link": "input/validate-event", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "validate-event" + }, + { + "title": "Obtain focus automatically", + "content": "

You can set the autofocus attribute to automatically obtain the focus. autofocus is a native attribute.

\n", + "link": "input/autofocus", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "autofocus" + }, + { + "title": "Auto Complete", + "content": "

The autocomplete attribute can be used to set automatic completion. The default value is off, and the option is on.

\n", + "link": "input/autocomplete", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "autocomplete" + }, + { + "title": "Out of Focus Event", + "content": "The blur event is triggered when the text box loses focus.

\n", + "link": "input/event-blur", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "event-blur" + }, + { + "title": "Value change event", + "content": "The change event is triggered when the value of the text box changes.

\n", + "link": "input/event-change", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "event-change" + }, + { + "title": "Clear Event", + "content": "

The clear event is triggered when the clear button in the text box is clicked.

\n", + "link": "input/event-clear", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "event-clear" + }, + { + "title": "Focus Event", + "content": "The focus event is triggered when the text box obtains the focus.

\n", + "link": "input/event-focus", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "event-focus" + }, + { + "title": "Memory History Input", + "content": "For details, see the following example.", + "link": "input/method-addMemory", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "method-addMemory" + }, + { + "title": "Lost Focus", + "content": "For details, see the following example.", + "link": "input/method-blur", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "method-blur" + }, + { + "title": "Focus", + "content": "For details, see the following example.", + "link": "input/method-focus", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "method-focus" + }, + { + "title": "Select text in the text box", + "content": "For details, see the following example.", + "link": "input/method-select", + "component": "Input text box", + "findIntroStr": "Enter characters using the mouse or keyboard.", + "demoId": "method-select" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/ip-address.json b/examples/docs/resources/pc/demo-config/en-US/ip-address.json new file mode 100644 index 000000000..562de0a8e --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/ip-address.json @@ -0,0 +1,90 @@ +[ + { + "title": "IPv4 Type", + "content": "

You can use the type attribute to configure the IPv4 type. The default value is IPv4.

\n", + "link": "ip-address/ipv4-type", + "component": "IpAddress text box", + "findIntroStr": "The IP address text box is the same as that of the native IpAddress component of the HTML. In addition, the data binding function is provided.", + "demoId": "ipv4-type" + }, + { + "title": "IPv6 Type", + "content": "

The value can be set to IPv6 through type. The default value is IPv4.

\n", + "link": "ip-address/ipv6-type", + "component": "IpAddress text box", + "findIntroStr": "The IP address text box is the same as that of the native IpAddress component of the HTML. In addition, the data binding function is provided.", + "demoId": "ipv6-type" + }, + { + "title": "Read-only text", + "content": "

Use the readonly attribute to set the read-only line of the text. The default value is false.

\n", + "link": "ip-address/readonly", + "component": "IpAddress text box", + "findIntroStr": "The IP address text box is the same as that of the native IpAddress component of the HTML. In addition, the data binding function is provided.", + "demoId": "readonly" + }, + { + "title": "Disabled", + "content": "

The disabled attribute is used to set whether to disable text. The default value is false.

\n", + "link": "ip-address/disabled", + "component": "IpAddress text box", + "findIntroStr": "The IP address text box is the same as that of the native IpAddress component of the HTML. In addition, the data binding function is provided.", + "demoId": "disabled" + }, + { + "title": "Text box size", + "content": "

can be set to medium, small, mini

\n", + "link": "ip-address/size", + "component": "IpAddress text box", + "findIntroStr": "The IP address text box is the same as that of the native IpAddress component of the HTML. In addition, the data binding function is provided.", + "demoId": "size" + }, + { + "title": "Property Setting Separator", + "content": "

You can set the separator (icon class) through the delimiter attribute.

\n", + "link": "ip-address/delimiter", + "component": "IpAddress text box", + "findIntroStr": "The IP address text box is the same as that of the native IpAddress component of the HTML. In addition, the data binding function is provided.", + "demoId": "delimiter" + }, + { + "title": "Default slot", + "content": "

The separator can be set through the default slot.

\n", + "link": "ip-address/slots", + "component": "IpAddress text box", + "findIntroStr": "The IP address text box is the same as that of the native IpAddress component of the HTML. In addition, the data binding function is provided.", + "demoId": "slots" + }, + { + "title": "focus event", + "content": "The focus event is triggered when the text box obtains the focus.

\n", + "link": "ip-address/focus", + "component": "IpAddress text box", + "findIntroStr": "The IP address text box is the same as that of the native IpAddress component of the HTML. In addition, the data binding function is provided.", + "demoId": "focus" + }, + { + "title": "blur event", + "content": "The blur event is triggered when the text box loses focus.

\n", + "link": "ip-address/blur", + "component": "IpAddress text box", + "findIntroStr": "The IP address text box is the same as that of the native IpAddress component of the HTML. In addition, the data binding function is provided.", + "demoId": "blur" + }, + { + "title": "change event", + "content": "The change event is triggered when the text box content changes.

\n", + "link": "ip-address/change", + "component": "IpAddress text box", + "findIntroStr": "The IP address text box is the same as that of the native IpAddress component of the HTML. In addition, the data binding function is provided.", + "demoId": "change" + }, + { + "title": "select event", + "content": "The select event is triggered when the text box content is selected.

\n", + "link": "ip-address/select", + "component": "IpAddress text box", + "findIntroStr": "The IP address text box is the same as that of the native IpAddress component of the HTML. In addition, the data binding function is provided.", + "demoId": "select" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/layout.json b/examples/docs/resources/pc/demo-config/en-US/layout.json new file mode 100644 index 000000000..66d9291ff --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/layout.json @@ -0,0 +1,98 @@ +[ + { + "title": "Grid Layout", + "content": "

The grid system layout is implemented by using the span attribute of the Row, Col component.

\n", + "link": "layout/base", + "component": "Layout", + "findIntroStr": "The grid layout makes the layout simple and clear.", + "demoId": "base" + }, + { + "title": "Alignment", + "content": "

Enable the flex layout by setting the flex property to true. The justify and align attributes are used to adjust the alignment of the child elements.

\n

Prompt

\n

The flex layout has Internet Explorer compatibility issues and can only run on Internet Explorer 10 or later.

\n
\n", + "link": "layout/alignment", + "component": "Layout", + "findIntroStr": "The grid layout makes the layout simple and clear.", + "demoId": "alignment" + }, + { + "title": "Sort", + "content": "

When enabling the flex layout, you can set the order attribute of the Row component. Sorts the col with the no attribute.

\n

Prompt

\n

The flex layout has Internet Explorer compatibility issues and can only run on Internet Explorer 10 or later.

\n
\n", + "link": "layout/order", + "component": "Layout", + "findIntroStr": "The grid layout makes the layout simple and clear.", + "demoId": "order" + }, + { + "title": "Offset", + "content": "

Specifies the number of columns offset by setting the offset property of the Col component.

\n", + "link": "layout/offset", + "component": "Layout", + "findIntroStr": "The grid layout makes the layout simple and clear.", + "demoId": "offset" + }, + { + "title": "vertical arrangement", + "content": "

Use the align attribute of the Row component to implement the vertical arrangement in \tflex layout.

\n", + "link": "row/align", + "component": "Row configuration", + "findIntroStr": "Defines the layout line configuration.", + "demoId": "align" + }, + { + "title": "Grid Interval", + "content": "

The grid spacing is implemented by using the gutter attribute of the Row component.

\n", + "link": "row/gutter", + "component": "Row configuration", + "findIntroStr": "Defines the layout line configuration.", + "demoId": "gutter" + }, + { + "title": "horizontal arrangement", + "content": "

The justify attribute of the Row component is used to implement horizontal arrangement in the flex layout.

\n", + "link": "row/justify", + "component": "Row configuration", + "findIntroStr": "Defines the layout line configuration.", + "demoId": "justify" + }, + { + "title": "Sort by", + "content": "

The order attribute of the Row component is used to implement the sorting mode in the flex layout.

\n", + "link": "row/order", + "component": "Row configuration", + "findIntroStr": "Defines the layout line configuration.", + "demoId": "order1" + }, + { + "title": "Custom Element Label", + "content": "

The tag attribute of the Row component is used to customize element tags. Any tag is optional.

\n", + "link": "row/tag1", + "component": "Row configuration", + "findIntroStr": "Defines the layout line configuration.", + "demoId": "tag1" + }, + { + "title": "Move", + "content": "

Specifies the number of columns offset by setting the move property of the Col component.

\n", + "link": "col/col-move", + "component": "Col column configuration", + "findIntroStr": "Defines the column configuration information of the layout.", + "demoId": "col-move" + }, + { + "title": "Responsive Layout", + "content": "

Referring to the responsive design of Bootstrap, five response sizes are preset: xs, sm, md, lg, and xl.

\n", + "link": "layout/responsive-layout", + "component": "Col column configuration", + "findIntroStr": "Defines the column configuration information of the layout.", + "demoId": "responsive-layout" + }, + { + "title": "Custom Element Label", + "content": "

The value can be any tag.

\n", + "link": "col/tag", + "component": "Col column configuration", + "findIntroStr": "Defines the column configuration information of the layout.", + "demoId": "tag" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/link-menu.json b/examples/docs/resources/pc/demo-config/en-US/link-menu.json new file mode 100644 index 000000000..dbe423711 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/link-menu.json @@ -0,0 +1,66 @@ +[ + { + "title": "Data Source", + "content": "

Set the data source of the menu through the data attribute. In addition, you can set whether the node can be selected through disabled in the data object.

\n", + "link": "link-menu/data-resource", + "component": "LinkMenu Favorites Menu", + "findIntroStr": "LinkMenu favorites menu, which supports configurable menu items.", + "demoId": "data-resource1" + }, + { + "title": "Collection Menu Title", + "content": "

The title attribute defines the title of the favorites menu.

\n", + "link": "link-menu/data-resource", + "component": "LinkMenu Favorites Menu", + "findIntroStr": "LinkMenu favorites menu, which supports configurable menu items.", + "demoId": "data-resource" + }, + { + "title": "The menu content is displayed in a new line when it is too long.", + "content": "

The wrap attribute is used to set the menu content to be displayed in a line wrap when the menu content is too long.

\n", + "link": "link-menu/data-resource", + "component": "LinkMenu Favorites Menu", + "findIntroStr": "LinkMenu favorites menu, which supports configurable menu items.", + "demoId": "data-resource2" + }, + { + "title": "Number of categories that can be added to favorites", + "content": "

The max-item attribute specifies the number of categories that can be selected and added to favorites. If default-expand-all is set to false, all nodes are collapsed when a menu pop-up window is opened.

\n", + "link": "link-menu/menu-items", + "component": "LinkMenu Favorites Menu", + "findIntroStr": "LinkMenu favorites menu, which supports configurable menu items.", + "demoId": "menu-items" + }, + { + "title": "Customized menu data service", + "content": "

Customize the menu data service through get-menu-data-sync .

\n", + "link": "link-menu/get-menu-data-sync", + "component": "LinkMenu Favorites Menu", + "findIntroStr": "LinkMenu favorites menu, which supports configurable menu items.", + "demoId": "get-menu-data-sync" + }, + { + "title": "Customize the folding and unfolding icon", + "content": "

Customize the expansion icon through the icon attribute. Use the search-icon attribute to customize the search icon.

\n", + "link": "link-menu/custom-icon", + "component": "LinkMenu Favorites Menu", + "findIntroStr": "LinkMenu favorites menu, which supports configurable menu items.", + "demoId": "custom-icon" + }, + { + "title": "Omitted if the menu content is too long.", + "content": "

You can set the ellipsis attribute to omit the display when the menu content is too long.

\n", + "link": "link-menu/custom-icon", + "component": "LinkMenu Favorites Menu", + "findIntroStr": "LinkMenu favorites menu, which supports configurable menu items.", + "demoId": "custom-icon1" + }, + { + "title": "Customize the bottom of the pop-up window", + "content": "

Customize the bottom of the menu pop-up window through the foot slot. The sureNodevalue method is used to obtain the selected menu node, close the menu pop-up window, and display the selected menu. The hideDialog method is used to close a pop-up window. Slots can be used in combination with both methods.

\n", + "link": "link-menu/custom-foot", + "component": "LinkMenu Favorites Menu", + "findIntroStr": "LinkMenu favorites menu, which supports configurable menu items.", + "demoId": "custom-foot" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/link.json b/examples/docs/resources/pc/demo-config/en-US/link.json new file mode 100644 index 000000000..5d6fe5346 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/link.json @@ -0,0 +1,50 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "link/basic-usage", + "component": "Link Text Link", + "findIntroStr": "Text hyperlink.", + "demoId": "basic-usage" + }, + { + "title": "Theme Style", + "content": "

Set the topic type of the link through the type attribute.

\n", + "link": "link/link-style", + "component": "Link Text Link", + "findIntroStr": "Text hyperlink.", + "demoId": "link-style" + }, + { + "title": "Disable links", + "content": "

You can use the disabled attribute to specify whether to disable links.

\n", + "link": "link/dynamic-disable", + "component": "Link Text Link", + "findIntroStr": "Text hyperlink.", + "demoId": "dynamic-disable" + }, + { + "title": "Do not display underscores when focusing.", + "content": "

When you hover the cursor over a link, the underline is displayed by default. If underline is set to false, the underline is not displayed when you focus.

\n", + "link": "link/focus-no-underline", + "component": "Link Text Link", + "findIntroStr": "Text hyperlink.", + "demoId": "focus-no-underline" + }, + { + "title": "Custom Icon", + "content": "

Icon can be customized by attribute icon, default slot, and icon slot.

\n", + "link": "link/custom-icon", + "component": "Link Text Link", + "findIntroStr": "Text hyperlink.", + "demoId": "custom-icon" + }, + { + "title": "Link", + "content": "

Use the href attribute to specify the URL to be redirected to. This attribute can be used together with the native attribute target.

\n", + "link": "link/config-href", + "component": "Link Text Link", + "findIntroStr": "Text hyperlink.", + "demoId": "config-href" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/loading.json b/examples/docs/resources/pc/demo-config/en-US/loading.json new file mode 100644 index 000000000..5df226e4e --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/loading.json @@ -0,0 +1,66 @@ +[ + { + "title": "Basic Usage", + "content": "

Sets loading on the specified target using the static method Loading.service.

\n", + "link": "loading/basic-usage", + "component": "Loading", + "findIntroStr": "Animation effect displayed when data is loaded.", + "demoId": "basic-usage" + }, + { + "title": "Customized loading prompt text", + "content": "

Customize the prompt text of the loaded text through text.

\n", + "link": "loading/loading-tip-text", + "component": "Loading", + "findIntroStr": "Animation effect displayed when data is loaded.", + "demoId": "loading-tip-text" + }, + { + "title": "Custom mask background color", + "content": "

Customize the background color and transparency through background.

\n", + "link": "loading/background", + "component": "Loading", + "findIntroStr": "Animation effect displayed when data is loaded.", + "demoId": "background" + }, + { + "title": "Custom Style", + "content": "

Use customClass to specify the class name to modify the style.

\n", + "link": "loading/custom-class", + "component": "Loading", + "findIntroStr": "Animation effect displayed when data is loaded.", + "demoId": "custom-class" + }, + { + "title": "Modifier", + "content": "For details, see the following example.", + "link": "loading/body", + "component": "Loading", + "findIntroStr": "Animation effect displayed when data is loaded.", + "demoId": "body" + }, + { + "title": "Global loading", + "content": "

The v-loading.lock.fullscreen command mode or service mode is used for global loading. To use the command mode for global loading, perform the following operations: \n Add Vue.use(Loading)\n in the Vue 2 environment and app.use(Loading)

\n in the Vue 3 environment", + "link": "loading/fullscreen", + "component": "Loading", + "findIntroStr": "Animation effect displayed when data is loaded.", + "demoId": "fullscreen" + }, + { + "title": "Customized loading icon", + "content": "

Customize the loading icon through spinner.

\n", + "link": "loading/spinner", + "component": "Loading", + "findIntroStr": "Animation effect displayed when data is loaded.", + "demoId": "spinner" + }, + { + "title": "Load Region", + "content": "

Use target to specify the DOM node to be overwritten by Loading.

\n", + "link": "loading/target", + "component": "Loading", + "findIntroStr": "Animation effect displayed when data is loaded.", + "demoId": "target" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/locales.json b/examples/docs/resources/pc/demo-config/en-US/locales.json new file mode 100644 index 000000000..bb4f0d5f5 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/locales.json @@ -0,0 +1,26 @@ +[ + { + "title": "Basic Usage", + "content": "

After the local attribute is configured, the service is not automatically invoked. It is only used to switch the current language and does not refresh the page.

\n", + "link": "locales/basic-usage", + "component": "Locales Language Selection", + "findIntroStr": "Locales language selection component. When there are two languages, the language is displayed directly. When there are more than two languages, a drop-down list is displayed.", + "demoId": "basic-usage" + }, + { + "title": "Custom Service", + "content": "

get-locale can be used to customize all languages. get-current-locale is used to obtain the current language. get-change-locale-url is used to obtain the URL after the language is changed. The parameter is the language after the language is changed.

\n", + "link": "locales/custom-service", + "component": "Locales Language Selection", + "findIntroStr": "Locales language selection component. When there are two languages, the language is displayed directly. When there are more than two languages, a drop-down list is displayed.", + "demoId": "custom-service" + }, + { + "title": "Switch Language", + "content": "

Provides the change-lang function to customize the language switching logic. If this function is not set, the built-in switching method is used.

\n", + "link": "locales/change-lang", + "component": "Locales Language Selection", + "findIntroStr": "Locales language selection component. When there are two languages, the language is displayed directly. When there are more than two languages, a drop-down list is displayed.", + "demoId": "change-lang" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/logon-user.json b/examples/docs/resources/pc/demo-config/en-US/logon-user.json new file mode 100644 index 000000000..45594db91 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/logon-user.json @@ -0,0 +1,18 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "logon-user/basic-usage", + "component": "LogonUser", + "findIntroStr": "LogonUser is used to display the display name or userCN of the current login user.", + "demoId": "basic-usage" + }, + { + "title": "Custom Service", + "content": "

You can set a custom service through the service attribute.

\n", + "link": "logon-user/custom-service", + "component": "LogonUser", + "findIntroStr": "LogonUser is used to display the display name or userCN of the current login user.", + "demoId": "custom-service" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/logout.json b/examples/docs/resources/pc/demo-config/en-US/logout.json new file mode 100644 index 000000000..4696547a7 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/logout.json @@ -0,0 +1,26 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "logout/basic-usage", + "component": "Logout", + "findIntroStr": "Logout login or logout link.", + "demoId": "basic-usage" + }, + { + "title": "Custom Service", + "content": "

You can set a custom service through the service attribute.

\n", + "link": "logout/custom-service", + "component": "Logout", + "findIntroStr": "Logout login or logout link.", + "demoId": "custom-service" + }, + { + "title": "User-defined redirection address after deregistration", + "content": "For details, see the following example.", + "link": "logout/redirecturl", + "component": "Logout", + "findIntroStr": "Logout login or logout link.", + "demoId": "redirecturl" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/milestone.json b/examples/docs/resources/pc/demo-config/en-US/milestone.json new file mode 100644 index 000000000..179c4e766 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/milestone.json @@ -0,0 +1,122 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "milestone/basic-usage", + "component": " Milestone", + "findIntroStr": "The milestone mode is a highly customized component. Users can customize the component status, node color, and line color. Activity flags can be inserted between nodes. The tip displays activity information.", + "demoId": "basic-usage" + }, + { + "title": "Data Source", + "content": "

Set milestone data through the data attribute.

\n", + "link": "milestone/data-source", + "component": " Milestone", + "findIntroStr": "The milestone mode is a highly customized component. Users can customize the component status, node color, and line color. Activity flags can be inserted between nodes. The tip displays activity information.", + "demoId": "data-source" + }, + { + "title": "Data Field Mapping", + "content": "

Data Field Mapping Attribute Description

\n

completed-field: Set the value corresponding to the milestone completion status. The default value is completed\nflag-content-field: Set the field name corresponding to the description in the node flag data. The default value is content\nflag-field: Set the field name of the node flag data. The default value is flags\nflag-name-field. Set the field name corresponding to the name in the node flag data. The default value is name\nflag-status-field: Set the field name corresponding to the status in the node flag data. The default value is status\nname-field: Set the field name corresponding to the name in the node information. The default value is name\nstatus-field: Set the field name corresponding to the data status. The default value is status\ntime-field. Field name corresponding to the node time information. The default value is time

\n
\n", + "link": "milestone/data-field-mapping", + "component": " Milestone", + "findIntroStr": "The milestone mode is a highly customized component. Users can customize the component status, node color, and line color. Activity flags can be inserted between nodes. The tip displays activity information.", + "demoId": "data-field-mapping" + }, + { + "title": "Flag data source node", + "content": "

You can use flag-before to set whether the data of the activity (i.e. flag) on the milestone is obtained from the previous node or the subsequent node. The default value is false to obtain the data of the subsequent node.

\n", + "link": "milestone/flag-before", + "component": " Milestone", + "findIntroStr": "The milestone mode is a highly customized component. Users can customize the component status, node color, and line color. Activity flags can be inserted between nodes. The tip displays activity information.", + "demoId": "flag-before" + }, + { + "title": "Progress bar color", + "content": "

Sets the line color through the line-style attribute.

\n", + "link": "milestone/line-style", + "component": " Milestone", + "findIntroStr": "The milestone mode is a highly customized component. Users can customize the component status, node color, and line color. Activity flags can be inserted between nodes. The tip displays activity information.", + "demoId": "line-style" + }, + { + "title": "Mapping Between Status and Color", + "content": "In the

milestones-status attribute object, the key corresponds to the status field in the data of the data attribute, and then controls the mapping between different states and colors.

\n", + "link": "milestone/milestones-status", + "component": " Milestone", + "findIntroStr": "The milestone mode is a highly customized component. Users can customize the component status, node color, and line color. Activity flags can be inserted between nodes. The tip displays activity information.", + "demoId": "milestones-status" + }, + { + "title": "Cancel the display of the sequence number in the unfinished state.", + "content": "

After show-number is set to false, the sequence number is not displayed on the node where the milestone is not completed. The default value is true.

\n", + "link": "milestone/show-number", + "component": " Milestone", + "findIntroStr": "The milestone mode is a highly customized component. Users can customize the component status, node color, and line color. Activity flags can be inserted between nodes. The tip displays activity information.", + "demoId": "show-number" + }, + { + "title": "Completed node solid display", + "content": "

You can set the solid attribute to true to set the completed node to be displayed as solid and the halo is opaque. The default value is false.

\n", + "link": "milestone/solid-style", + "component": " Milestone", + "findIntroStr": "The milestone mode is a highly customized component. Users can customize the component status, node color, and line color. Activity flags can be inserted between nodes. The tip displays activity information.", + "demoId": "solid-style" + }, + { + "title": "Width", + "content": "

Use the space attribute to set the width of the step bar.

\n", + "link": "milestone/milestone-space", + "component": " Milestone", + "findIntroStr": "The milestone mode is a highly customized component. Users can customize the component status, node color, and line color. Activity flags can be inserted between nodes. The tip displays activity information.", + "demoId": "milestone-space" + }, + { + "title": "Start sequence number", + "content": "

Set the start sequence number of the milestone node through the start attribute. The default value is - 1.

\n", + "link": "milestone/start-index", + "component": " Milestone", + "findIntroStr": "The milestone mode is a highly customized component. Users can customize the component status, node color, and line color. Activity flags can be inserted between nodes. The tip displays activity information.", + "demoId": "start-index" + }, + { + "title": "Custom Node Icons", + "content": "

The icon can be customized through the iconscope slot.

\n", + "link": "milestone/custom-icon-slot", + "component": " Milestone", + "findIntroStr": "The milestone mode is a highly customized component. Users can customize the component status, node color, and line color. Activity flags can be inserted between nodes. The tip displays activity information.", + "demoId": "custom-icon-slot" + }, + { + "title": "Content under a customized node", + "content": "

You can customize the content below a node through the bottom scope slot.

\n", + "link": "milestone/custom-bottom", + "component": " Milestone", + "findIntroStr": "The milestone mode is a highly customized component. Users can customize the component status, node color, and line color. Activity flags can be inserted between nodes. The tip displays activity information.", + "demoId": "custom-bottom" + }, + { + "title": "Content above the customized node", + "content": "

The top scope slot allows you to customize the content above the node.

\n", + "link": "milestone/custom-top", + "component": " Milestone", + "findIntroStr": "The milestone mode is a highly customized component. Users can customize the component status, node color, and line color. Activity flags can be inserted between nodes. The tip displays activity information.", + "demoId": "custom-top" + }, + { + "title": "Custom Flag Content", + "content": "

You can customize the content of the node flag through the flag scope slot.

\n", + "link": "milestone/custom-flag", + "component": " Milestone", + "findIntroStr": "The milestone mode is a highly customized component. Users can customize the component status, node color, and line color. Activity flags can be inserted between nodes. The tip displays activity information.", + "demoId": "custom-flag" + }, + { + "title": "Event", + "content": "

The click event is triggered when a milestone node is clicked. Parameter: (index: node index; node: node data information). The flag-click event is triggered when a milestone flag is clicked. (index: index of the flag on the node; node: data information of the flag on the node).

\n", + "link": "milestone/milestone-events", + "component": " Milestone", + "findIntroStr": "The milestone mode is a highly customized component. Users can customize the component status, node color, and line color. Activity flags can be inserted between nodes. The tip displays activity information.", + "demoId": "milestone-events" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/modal.json b/examples/docs/resources/pc/demo-config/en-US/modal.json new file mode 100644 index 000000000..f85a82628 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/modal.json @@ -0,0 +1,250 @@ +[ + { + "title": "Basic Usage", + "content": "

You can use the Modal.alert method to set a pop-up box, and use the Modal.confirm method to set a confirmation pop-up box.

\n", + "link": "modal/base", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "base" + }, + { + "title": "Maximized display", + "content": "

You can use the fullscreen attribute to set whether to maximize the display.

\n", + "link": "modal/fullscreen", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "fullscreen" + }, + { + "title": "Press Esc to close the dialog box.", + "content": "

You can use the esc-closable attribute to set whether to close a window by pressing the Esc key. The default value is false.

\n", + "link": "modal/esc-closable", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "esc-closable" + }, + { + "title": "Automatic shutdown delay", + "content": "

You can use the duration attribute to set the delay time for automatic closing. This parameter is valid only for type=message.

\n", + "link": "modal/duration", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "duration" + }, + { + "title": "Prevent repeated prompts", + "content": "

If you do not want to click the window repeatedly, you can set a unique id to prevent repeated prompts. This parameter is valid only for type=message.

\n", + "link": "modal/id", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "id" + }, + { + "title": "Lock the scroll bar", + "content": "

You can use the lock-scroll attribute to set whether to lock the scroll bar.

\n", + "link": "modal/lock-scroll", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "lock-scroll" + }, + { + "title": "Lock the page", + "content": "

You can use the lock-view attribute to set whether to lock the page. Operations outside the window are not allowed.

\n", + "link": "modal/lock-view", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "lock-view" + }, + { + "title": "Display Mask Layer", + "content": "

You can set whether to display the mask layer through the mask attribute. The default value is true.

\n", + "link": "modal/lock-view", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "lock-view1" + }, + { + "title": "Click the mask layer to close the window.", + "content": "

You can use the mask-closable attribute to set whether to allow clicking the mask layer to close the window.

\n", + "link": "modal/mask-closable", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "mask-closable" + }, + { + "title": "Custom Content", + "content": "

You can set the content of the window through the message attribute.

\n", + "link": "modal/message", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "message" + }, + { + "title": "Resize the window", + "content": "

You can set the width and height of a window by using width and height. You can set whether to allow dragging to adjust the window size by using resize.

\n", + "link": "modal/resize", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "resize" + }, + { + "title": "Minimum width of the window after the window is resized", + "content": "

After resize is set to true, the min-width attribute can be used to set the minimum width of the window after being dragged.

\n", + "link": "modal/min-width", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "min-width" + }, + { + "title": "Minimum height of the window after the window is resized", + "content": "

After resize is set to true, the min-height attribute can be used to set the minimum height of the window after being dragged.

\n", + "link": "modal/min-height", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "min-height" + }, + { + "title": "The bottom is not displayed.", + "content": "

You can use the showFooter attribute to set whether to display the bottom. The default value is true.

\n", + "link": "modal/showFooter", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "showFooter" + }, + { + "title": "The header is not displayed.", + "content": "

You can use the showHeader attribute to set whether to display the header. The default value is true.

\n", + "link": "modal/showHeader", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "showHeader" + }, + { + "title": "Message Status", + "content": "

You can set the message status through the status attribute. The value can be info | success | warning | error | loading .

\n", + "link": "modal/status", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "status" + }, + { + "title": "Title", + "content": "

You can set the title of the window through the title attribute.

\n", + "link": "modal/title", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "title" + }, + { + "title": "Position from the top", + "content": "

You can use the top attribute to set the position of a message from the top of the message. This parameter is valid only for type=message.

\n", + "link": "modal/top", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "top" + }, + { + "title": "Window Type", + "content": "

You can set the window type through the type attribute. The options are alert | confirm | message.

\n", + "link": "modal/type", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "type" + }, + { + "title": "Bound Value", + "content": "

You can use the value/v-model attribute to bind a value.

\n", + "link": "modal/value", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "value" + }, + { + "title": "Custom Stacking Sequence", + "content": "

You can use the zIndex attribute to set the custom stacking sequence. (It may be used in some special scenarios, such as when it is blocked.)

\n", + "link": "modal/zIndex", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "zIndex" + }, + { + "title": "Cancel button event", + "content": "

The cancel event is triggered when the Cancel button is clicked.

\n", + "link": "modal/cancel-event", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "cancel-event" + }, + { + "title": "Close button event", + "content": "

The close event is triggered when the close button is clicked.

\n", + "link": "modal/close-event", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "close-event" + }, + { + "title": "OK button event", + "content": "

The confirm event is triggered when the OK button is clicked.

\n", + "link": "modal/confirm-event", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "confirm-event" + }, + { + "title": "Window Close Event", + "content": "

The hide event is triggered when the window is closed.

\n", + "link": "modal/hide-event", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "hide-event" + }, + { + "title": "Window Display Event", + "content": "

The show event is triggered when the window is displayed.

\n", + "link": "modal/show-event", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "show-event" + }, + { + "title": "Window scaling event", + "content": "

The zoom event is triggered when the window is zoomed in or out.

\n", + "link": "modal/zoom-event", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "zoom-event" + }, + { + "title": "Close the pop-up window. Are you sure you want to reset the form data?", + "content": "

When the Modal nested form is used and the pop-up window is closed, reset the form data.

\n

Set is-form-reset to false. If you close the pop-up window, the form is not reset.

", + "link": "modal/is-form-reset", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "is-form-reset" + }, + { + "title": "Default slot", + "content": "

You can set the default slot by templete.

\n", + "link": "modal/value", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "value1" + }, + { + "title": "Bottom slot", + "content": "

You can set the bottom slot through slot="footer" .

\n", + "link": "modal/footer-slot", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "footer-slot" + }, + { + "title": "Nested grid", + "content": "

You can nest grids through slots

\n", + "link": "modal/grid", + "component": "Modal modal box", + "findIntroStr": "Modal modal box", + "demoId": "grid" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/nav-menu.json b/examples/docs/resources/pc/demo-config/en-US/nav-menu.json new file mode 100644 index 000000000..2e3a487fa --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/nav-menu.json @@ -0,0 +1,66 @@ +[ + { + "title": "Basic Usage", + "content": "

The data attribute is used to configure menu data. If the data attribute is not configured, the background service is read by default. For example, Jalor 6 reads the leftMenuNode data of the services/jalor/web/support/workspace/current service.

\n", + "link": "nav-menu/basic-usage", + "component": "NavMenu navigation menu", + "findIntroStr": "NavMenu navigation menu, which is used to define the navigation menu on the top of a page.", + "demoId": "basic-usage" + }, + { + "title": "Data Source", + "content": "

Configure menu data through the data attribute.

\n", + "link": "nav-menu/data-resource", + "component": "NavMenu navigation menu", + "findIntroStr": "NavMenu navigation menu, which is used to define the navigation menu on the top of a page.", + "demoId": "data-resource" + }, + { + "title": "Display Policy", + "content": "

When the level-1 menu cannot be completely displayed in the current menu container, you can configure the display policy through the overflow attribute. There are four options: auto, retract, fixed, and hidden. The default value is auto.

\n

overflow Option Description

\n

auto: The More menu is displayed on the right of the menu bar. When you hover over the menu, the remaining menus are displayed. \nfixed: The Sandwich Collapse/Expand icon is displayed on the left of the menu bar. When you hover over the icon, all menus are displayed. \nretract: No menu is displayed on the menu bar. Only the Sandwich Collapse/Expand icon is displayed. When you hover over the icon, all menus are displayed. \nhidden: hides the remaining menus.

\n
\n", + "link": "nav-menu/overflow", + "component": "NavMenu navigation menu", + "findIntroStr": "NavMenu navigation menu, which is used to define the navigation menu on the top of a page.", + "demoId": "overflow" + }, + { + "title": "Toolbar slot", + "content": "

Provides a toolbar slot for customizing the Toolbar.

\n", + "link": "nav-menu/slot-toolbar", + "component": "NavMenu navigation menu", + "findIntroStr": "NavMenu navigation menu, which is used to define the navigation menu on the top of a page.", + "demoId": "slot-toolbar" + }, + { + "title": "Logo slot", + "content": "

Provides a logo slot for customizing the logo.

\n", + "link": "nav-menu/slot-logo", + "component": "NavMenu navigation menu", + "findIntroStr": "NavMenu navigation menu, which is used to define the navigation menu on the top of a page.", + "demoId": "slot-logo" + }, + { + "title": "Menu redirection processing", + "content": "

Provides the before-skip hook function for processing logic before a menu is clicked. If false is returned, the menu cannot be redirected.

\n", + "link": "nav-menu/before-skip", + "component": "NavMenu navigation menu", + "findIntroStr": "NavMenu navigation menu, which is used to define the navigation menu on the top of a page.", + "demoId": "before-skip" + }, + { + "title": "Menu redirection processing when the default service of the component is used", + "content": "

If the default service /workspace/current of the component is used to obtain the menu data response.data.leftMenuNode.children, when before-skip is used: The prevent attribute needs to be configured to prevent the default redirection behavior. The default value of the prevent attribute is false.

\n", + "link": "nav-menu/before-skip-prevent", + "component": "NavMenu navigation menu", + "findIntroStr": "NavMenu navigation menu, which is used to define the navigation menu on the top of a page.", + "demoId": "before-skip-prevent" + }, + { + "title": "Custom Service", + "content": "

You can use the fetch-menu-data to customize the menu service. If the fields in the data are not the default title and url, You can use fields to map the fields in the data.

\n", + "link": "nav-menu/custom-service", + "component": "NavMenu navigation menu", + "findIntroStr": "NavMenu navigation menu, which is used to define the navigation menu on the top of a page.", + "demoId": "custom-service" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/notify.json b/examples/docs/resources/pc/demo-config/en-US/notify.json new file mode 100644 index 000000000..3ad255c6c --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/notify.json @@ -0,0 +1,106 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "notify/basic-usage", + "component": "Notify Notification", + "findIntroStr": "Notify notification, which is mainly used for pop-up prompts.", + "demoId": "basic-usage" + }, + { + "title": "Message Type", + "content": "

You can set different types by type. The options are success, warning, info, and error. The default value is info.

\n", + "link": "notify/type", + "component": "Notify Notification", + "findIntroStr": "Notify notification, which is mainly used for pop-up prompts.", + "demoId": "type" + }, + { + "title": "Automatic shutdown delay", + "content": "

You can set the delay for automatic shutdown through the duration attribute. The default value is 4500 ms.

\n", + "link": "notify/duration", + "component": "Notify Notification", + "findIntroStr": "Notify notification, which is mainly used for pop-up prompts.", + "demoId": "duration" + }, + { + "title": "Display position", + "content": "

You can set the position of the notification box through the position attribute. The default value is bottom-right.

\n", + "link": "notify/position", + "component": "Notify Notification", + "findIntroStr": "Notify notification, which is mainly used for pop-up prompts.", + "demoId": "position" + }, + { + "title": "Title", + "content": "

You can set the title of the notification box through the title attribute.

\n", + "link": "notify/title", + "component": "Notify Notification", + "findIntroStr": "Notify notification, which is mainly used for pop-up prompts.", + "demoId": "title" + }, + { + "title": "Custom Content", + "content": "

You can set the content of the notification box through the message attribute.

\n", + "link": "notify/message", + "component": "Notify Notification", + "findIntroStr": "Notify notification, which is mainly used for pop-up prompts.", + "demoId": "message" + }, + { + "title": "The close button is not displayed.", + "content": "

showClose message: indicates whether the notification box displays the close button. The default value is true.

\n", + "link": "notify/showClose", + "component": "Notify Notification", + "findIntroStr": "Notify notification, which is mainly used for pop-up prompts.", + "demoId": "showClose" + }, + { + "title": "The type icon is not displayed.", + "content": "

You can use the showIcon attribute to set whether to display the type icon in the notification box. The default value is true.

\n", + "link": "notify/showIcon", + "component": "Notify Notification", + "findIntroStr": "Notify notification, which is mainly used for pop-up prompts.", + "demoId": "showIcon" + }, + { + "title": "Custom Close Icon", + "content": "

You can set the icon for closing the notification box through the closeIcon attribute. The default value is IconClose.

\n", + "link": "notify/closeIcon", + "component": "Notify Notification", + "findIntroStr": "Notify notification, which is mainly used for pop-up prompts.", + "demoId": "closeIcon" + }, + { + "title": "Custom type icon", + "content": "

You can set the notification box type icon through the statusIcon attribute. The default value is IconInfoSolid.

\n", + "link": "notify/statusIcon", + "component": "Notify Notification", + "findIntroStr": "Notify notification, which is mainly used for pop-up prompts.", + "demoId": "statusIcon" + }, + { + "title": "Event triggered before the notification box is closed", + "content": "

You can set the event before the notification box is closed through the beforeClose attribute.

\n", + "link": "notify/beforeClose", + "component": "Notify Notification", + "findIntroStr": "Notify notification, which is mainly used for pop-up prompts.", + "demoId": "beforeClose" + }, + { + "title": "This event is triggered when the close button is clicked.", + "content": "

You can set the onClose attribute to trigger an event when the close button is clicked.

\n", + "link": "notify/onClose", + "component": "Notify Notification", + "findIntroStr": "Notify notification, which is mainly used for pop-up prompts.", + "demoId": "close" + }, + { + "title": "Configure image stabilization", + "content": "

You can use debounceDelay to set the image stabilization time.\n", + "link": "notify/debounceDelay", + "component": "Notify Notification", + "findIntroStr": "Notify notification, which is mainly used for pop-up prompts.", + "demoId": "debounceDelay" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/numeric.json b/examples/docs/resources/pc/demo-config/en-US/numeric.json new file mode 100644 index 000000000..b6489a18e --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/numeric.json @@ -0,0 +1,130 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "numeric/basic-usage", + "component": "Numeric counter", + "findIntroStr": "The Numeric counter can be used to enter numbers. The value range and step size can be customized. The mouse and keyboard can be added or deleted.", + "demoId": "basic-usage" + }, + { + "title": "Clearable Feature", + "content": "

You can use the allow-empty property to set the clearability of counter contents. The default value is false, indicating that the data cannot be cleared.

\n", + "link": "numeric/allow-empty", + "component": "Numeric counter", + "findIntroStr": "The Numeric counter can be used to enter numbers. The value range and step size can be customized. The mouse and keyboard can be added or deleted.", + "demoId": "allow-empty" + }, + { + "title": "Step", + "content": "

You can set the step of the counter through the step attribute.

\n", + "link": "numeric/about-step", + "component": "Numeric counter", + "findIntroStr": "The Numeric counter can be used to enter numbers. The value range and step size can be customized. The mouse and keyboard can be added or deleted.", + "demoId": "about-step" + }, + { + "title": "Numeric loop", + "content": "

You can set the maximum value allowed by the counter by setting the max attribute, and set the minimum value allowed by the counter by setting the min attribute. Set the circulate property to start from the minimum value after reaching the maximum value up, or vice versa.

\n", + "link": "numeric/max-min", + "component": "Numeric counter", + "findIntroStr": "The Numeric counter can be used to enter numbers. The value range and step size can be customized. The mouse and keyboard can be added or deleted.", + "demoId": "max-min" + }, + { + "title": "Dimension", + "content": "

You can set the counter size through the size attribute. The value can be medium / small / mini.

\n", + "link": "numeric/numeric-size", + "component": "Numeric counter", + "findIntroStr": "The Numeric counter can be used to enter numbers. The value range and step size can be customized. The mouse and keyboard can be added or deleted.", + "demoId": "numeric-size" + }, + { + "title": "Control Button", + "content": "

You can set whether the counter has a control button through the controls attribute.

\n", + "link": "numeric/controls", + "component": "Numeric counter", + "findIntroStr": "The Numeric counter can be used to enter numbers. The value range and step size can be customized. The mouse and keyboard can be added or deleted.", + "demoId": "controls" + }, + { + "title": "Control button display position", + "content": "

You can set the position of the control button through the controls-position attribute.

\n", + "link": "numeric/controls-position", + "component": "Numeric counter", + "findIntroStr": "The Numeric counter can be used to enter numbers. The value range and step size can be customized. The mouse and keyboard can be added or deleted.", + "demoId": "controls-position" + }, + { + "title": "Associated Text", + "content": "

You can set the label text associated with the text box through the label attribute.

\n", + "link": "numeric/controls", + "component": "Numeric counter", + "findIntroStr": "The Numeric counter can be used to enter numbers. The value range and step size can be customized. The mouse and keyboard can be added or deleted.", + "demoId": "controls1" + }, + { + "title": "disabled", + "content": "Disable the counter by setting disabled.", + "link": "numeric/dynamic-disabled", + "component": "Numeric counter", + "findIntroStr": "The Numeric counter can be used to enter numbers. The value range and step size can be customized. The mouse and keyboard can be added or deleted.", + "demoId": "dynamic-disabled" + }, + { + "title": "name", + "content": "

You can use the name attribute to set the native attribute.

\n", + "link": "numeric/controls", + "component": "Numeric counter", + "findIntroStr": "The Numeric counter can be used to enter numbers. The value range and step size can be customized. The mouse and keyboard can be added or deleted.", + "demoId": "controls2" + }, + { + "title": "Numeric precision", + "content": "

You can set the precision value of the counter through the precision attribute.

\n", + "link": "numeric/precision", + "component": "Numeric counter", + "findIntroStr": "The Numeric counter can be used to enter numbers. The value range and step size can be customized. The mouse and keyboard can be added or deleted.", + "demoId": "precision" + }, + { + "title": "Mouse wheel scrolling change value", + "content": "

You can use the mouseWheel attribute to control whether the scroll wheel can change the value.

\n", + "link": "numeric/mouse-wheel", + "component": "Numeric counter", + "findIntroStr": "The Numeric counter can be used to enter numbers. The value range and step size can be customized. The mouse and keyboard can be added or deleted.", + "demoId": "mouse-wheel" + }, + { + "title": "Focus Event", + "content": "The focus event is triggered when the text box is focused.

\n", + "link": "numeric/focus-event", + "component": "Numeric counter", + "findIntroStr": "The Numeric counter can be used to enter numbers. The value range and step size can be customized. The mouse and keyboard can be added or deleted.", + "demoId": "focus-event" + }, + { + "title": "Out of Focus Event", + "content": "

The blur event is triggered when the text box loses focus.

\n", + "link": "numeric/blur-event", + "component": "Numeric counter", + "findIntroStr": "The Numeric counter can be used to enter numbers. The value range and step size can be customized. The mouse and keyboard can be added or deleted.", + "demoId": "blur-event" + }, + { + "title": "Value change event", + "content": "The change event is triggered when the value of the text box is changed.

\n", + "link": "numeric/change-event", + "component": "Numeric counter", + "findIntroStr": "The Numeric counter can be used to enter numbers. The value range and step size can be customized. The mouse and keyboard can be added or deleted.", + "demoId": "change-event" + }, + { + "title": "The price is automatically calculated based on the product quantity.", + "content": "

The price is automatically calculated based on the product quantity.

\n", + "link": "numeric/calculate-according-to-num-of-goods", + "component": "Numeric counter", + "findIntroStr": "The Numeric counter can be used to enter numbers. The value range and step size can be customized. The mouse and keyboard can be added or deleted.", + "demoId": "calculate-according-to-num-of-goods" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/pager.json b/examples/docs/resources/pc/demo-config/en-US/pager.json new file mode 100644 index 000000000..bc9a54e5a --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/pager.json @@ -0,0 +1,162 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "pager/basic-usage", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "basic-usage" + }, + { + "title": "Current Page", + "content": "

Use current-page to set the number of initially loaded pages, and use total to set the total number of records

\n", + "link": "pager/current-page", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "current-page" + }, + { + "title": "number mode", + "content": "

Set the component rendering mode through mode="number"

\n", + "link": "pager/pager-mode-number", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "pager-mode-number" + }, + { + "title": "fixed mode", + "content": "

Set the component rendering mode through mode="fixed"

\n", + "link": "pager/pager-mode-fixed", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "pager-mode-fixed" + }, + { + "title": "simple mode", + "content": "

Set the component rendering mode through mode="simple"

\n", + "link": "pager/pager-mode-simple", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "pager-mode-simple" + }, + { + "title": "complete mode", + "content": "

Set the component rendering mode through mode="complete"

\n", + "link": "pager/pager-mode", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "pager-mode" + }, + { + "title": "Total Pages", + "content": "

Set the total number of pages through page-count

\n", + "link": "pager/page-count", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "page-count" + }, + { + "title": "Paging event size-change", + "content": "

size-change Triggered when the number of records on each page changes

\n", + "link": "pager/pager-events", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "pager-events" + }, + { + "title": "Paging event current-change", + "content": "

current-change Triggered when the current page number is switched

\n", + "link": "pager/pager-events-current-change", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "pager-events-current-change" + }, + { + "title": "Paging event prev-click", + "content": "

prev-click Triggered when switching to the previous page

\n", + "link": "pager/pager-events-prev-click", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "pager-events-prev-click" + }, + { + "title": "Paging event next-click", + "content": "

next-click Triggered when switching to the next page

\n", + "link": "pager/pager-events-nextclick", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "pager-events-nextclick" + }, + { + "title": "Paging event before-page-change", + "content": "

before-page-change Pre-paging event

\n", + "link": "pager/before-page-change", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "before-page-change" + }, + { + "title": "Paging drop-down list box display position", + "content": "Indicates whether to add an element in the

popper-append-to-body paging drop-down list box to the body element node. The default value of this attribute is true, indicating that the element is added to the body element node by default.

\n

If you do not want to add it to the body element node, set :popper-append-to-body=\"false\"

", + "link": "pager/page-append-to-body", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "popper-append-to-body" + }, + { + "title": "Class name of the customized paging drop-down list box", + "content": "

popper-class You can customize the class name of the paging drop-down list box

", + "link": "pager/popper-class", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "popper-class" + }, + { + "title": "Customized pagination layout", + "content": "

layout Set the paging layout. You can adjust the position of slot in layout to adjust the position where the slot content is rendered.

\n", + "link": "pager/custom-layout", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "custom-layout" + }, + { + "title": "Number of page buttons", + "content": "

pager-count Set the number of pages

\n", + "link": "pager/pager-count", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "pager-count" + }, + { + "title": "Number of pages to be displayed", + "content": "Use

page-sizes together with page-size to adjust the number of pages to be displayed on each page.

\n", + "link": "pager/page-size", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "page-size" + }, + { + "title": "Hide pagination when there is only one page.", + "content": "

hide-on-single-page Hide paging when there is only one page

\n", + "link": "pager/hide-on-single-page", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "hide-on-single-page" + }, + { + "title": "Customize the text of the page-up button", + "content": "

prev-text ,next-text Custom Page Up Button Text

\n", + "link": "pager/custom-next-prev-text", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "custom-next-prev-text" + }, + { + "title": "Grid Table Pagination", + "content": "

The grid table uses the pagination component.\nThe services/getGridMockData service in this example needs to be implemented by yourself. The example simulates the data returned by the remote service.\n

\n", + "link": "pager/pager-in-grid", + "component": "Pager Pagination", + "findIntroStr": "When there is a large amount of data, data is split by page. This function is usually used in Grid and Repeater components.", + "demoId": "pager-in-grid" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/pop-editor.json b/examples/docs/resources/pc/demo-config/en-US/pop-editor.json new file mode 100644 index 000000000..3a56c3dc5 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/pop-editor.json @@ -0,0 +1,258 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "popeditor/base", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "base" + }, + { + "title": "Customized Query Criteria", + "content": "

The conditions attribute can be used to customize search criteria. The built-in text box of the gadget supports the function of pressing Enter to trigger search.

\n", + "link": "popeditor/conditions", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "conditions" + }, + { + "title": "Layout and Configuration", + "content": "

Set span in the attributes of the condition project to configure the grid and labelWidth to configure the label width. componentConfigure custom components and set component attributes through attrs

\n", + "link": "popeditor/condition-layout", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "condition-layout" + }, + { + "title": "Used in a form and enabled form validation", + "content": "For details, see the following example.", + "link": "popeditor/condition-form", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "condition-form" + }, + { + "title": "Drag Window", + "content": "

Sets the drag feature of the pop-up window through the draggable property. The default value is true, indicating that you can drag the window on the title bar. If this parameter is set to false, the window cannot be dragged.

\n", + "link": "popeditor/draggable", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "draggable" + }, + { + "title": "Cannot be cleared", + "content": "

The show-clear-btn attribute is used to set whether the content can be cleared.

\n", + "link": "popeditor/showClearBtn", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "showClearBtn" + }, + { + "title": "Full-screen display", + "content": "

You can set resize to determine whether to display the content in full screen.

\n", + "link": "popeditor/resize", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "resize" + }, + { + "title": "Table Edit", + "content": "

gridOp: This parameter is valid only when popseletor is set to grid. Currently, columns and data data sources can be configured. For details about the configuration items, see the Grid table component. The textField and valueField fields must be configured at the same time.

\n", + "link": "popeditor/grid", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "grid" + }, + { + "title": "Width", + "content": "

The width are configured through the width attribute. \n Use dialog-class to customize the pop-up window class name

\n", + "link": "popeditor/width", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "width" + }, + { + "title": "Custom Icon", + "content": "

You can use the icon attribute to customize the component icon. You need to import the corresponding svg icon.

\n", + "link": "popeditor/icon", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "icon" + }, + { + "title": "Multiple Choices", + "content": "

You can set multi to true to implement multiple selections. \nSet show-history to set whether to display tables on the History tab page when tables are configured on the pop-up panel. The default value is false.

\n", + "link": "popeditor/multi", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "multi" + }, + { + "title": "Multiple choices. The initial data is an array.", + "content": "For details, see the following example.", + "link": "popeditor/multi-value-array", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "multi-value-array" + }, + { + "title": "change event", + "content": "Change event of the input box of the

change Popeditor component. page-changeThe table mode of the Popeditor component is switched by page.

\n", + "link": "popeditor/events", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "events" + }, + { + "title": "close event", + "content": "Event triggered when the

close dialog box is closed.

\n", + "link": "popeditor/close-event", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "close-event" + }, + { + "title": "Read-only", + "content": "

The readonly attribute is used to set whether to read only.

\n", + "link": "popeditor/readonly", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "readonly" + }, + { + "title": "tabindex of the text box", + "content": "

The tabindex attribute is used to determine whether the focus can be obtained by pressing Tab and the focus sequence. This parameter is valid only when the readonly attribute is set to false.

\n", + "link": "popeditor/tabindex", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "tabindex" + }, + { + "title": "Reset", + "content": "

Use the before-reset attribute to set the hook function before reset.

\n", + "link": "popeditor/before-reset", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "before-reset" + }, + { + "title": "Component Query Condition Slot", + "content": "

Customize the pop-up panel query structure by slot search.

\n", + "link": "popeditor/slot", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "slot" + }, + { + "title": "Disabled", + "content": "

is set to read-only through the disabled attribute.

\n", + "link": "popeditor/disabled", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "disabled" + }, + { + "title": "The filter criteria in the pop-up window can be cleared.", + "content": "The

clearable Popeditor component supports the configuration of the Clear button in the search form.

\n", + "link": "popeditor/clearable", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "clearable" + }, + { + "title": "Display Field Mapping", + "content": "

Use the text-field attribute to set the fields displayed by the widget.

\n", + "link": "popeditor/textField", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "textField" + }, + { + "title": "Submit Field Mapping", + "content": "

The value-field attribute is used to set the fields submitted by the component to the background.

\n", + "link": "popeditor/title", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "title1" + }, + { + "title": "Custom Title", + "content": "

The title attribute is used to set the title of the pop-up window. The internationalization information is supported.

\n", + "link": "popeditor/title", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "title" + }, + { + "title": "Remote Search", + "content": "

The remote-search attribute is used to configure remote search. In the remoteSearch method, the conditions search conditions can be sent to the background. After the background processes the data, the data can be properly displayed on the page.

\n", + "link": "popeditor/remote-search", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "remote-search" + }, + { + "title": "Paging", + "content": "The

showPager attribute is valid only when popseletor is set to grid. The default value is false. Pagination is not enabled. If this parameter is set to true, you need to configure the pagerOp attribute. In addition, you need to listen to the page-change event to change the data data source

\n of the gridOp", + "link": "popeditor/pager", + "component": "PopEditor pop-up editing", + "findIntroStr": "Common operation buttons, including default buttons, icon buttons, picture buttons, and drop-down buttons.", + "demoId": "pager" + }, + { + "title": "Rendering Query", + "content": "

If the first batch of data loaded by the component does not contain the data corresponding to the currently set value, You can set text-render-source to perform reverse query

\n", + "link": "popeditor/render-text", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "render-text" + }, + { + "title": "Enabling Tree Mode", + "content": "

Enable the tree mode through the popseletor attribute. Then the tree-op attribute is the op configuration mode of the Tree component.

\n", + "link": "popeditor/tree", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "tree" + }, + { + "title": "Single choice in tree mode", + "content": "

Enable the tree mode through the popseletor attribute. Then the tree-op attribute is the op configuration mode of the Tree component.

\n", + "link": "popeditor/single-select-radio", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "single-select-radio" + }, + { + "title": "Edit box size", + "content": "

Sets the size of the PopEditor edit box through the size attribute. The options are medium, small, and mini.

\n", + "link": "popeditor/size", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "size" + }, + { + "title": "Data beyond hidden", + "content": "

Configure the showOverflow attribute on the data column to set the display and hiding of the data when the data exceeds the column width. Values can be of type Boolean or String, with three values to choose from, as shown below. By default, all content is displayed in a new line.

\n

optional value description

\n

tooltip: The extra part is displayed...., and all information is displayed on the left or right. \ntitle: The value is the same as the title attribute of the native tag. \nellipsis: '...' is displayed, and no message is displayed. \ntrue: If the value is true, the effect is the same as that of the tooltip.

\n
\n", + "link": "popeditor/showOverflow", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "showOverflow" + }, + { + "title": "Mode of triggering a single selection", + "content": "

When a single option is selected, you can only click the option button to select it by default. You can also set trigger to row to select any position in the row. Alternatively, set trigger to cell and click any position in the Operation column to select it.

\n", + "link": "popeditor/trigger", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "trigger" + }, + { + "title": "Set History tab", + "content": "

When a table is configured on the pop-up panel, configure show-history to set whether to display the table on the History tab page. The default value is false.

\n", + "link": "popeditor/show-history", + "component": "PopEditor pop-up editing", + "findIntroStr": "This component can only select data in the pop-up panel. Data cannot be manually entered. The tree or grid component is displayed in the pop-up panel.", + "demoId": "show-history" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/pop-upload.json b/examples/docs/resources/pc/demo-config/en-US/pop-upload.json new file mode 100644 index 000000000..5b5923672 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/pop-upload.json @@ -0,0 +1,122 @@ +[ + { + "title": "Basic Usage", + "content": "

Set the upload service interface through the action attribute.

\n", + "link": "pop-upload/basic-usage", + "component": "PopUpload dialog box", + "findIntroStr": "Click the element to display the upload dialog box.", + "demoId": "basic-usage" + }, + { + "title": "Custom Request Header", + "content": "

The headers attribute is used to customize the upload request header information.

\n", + "link": "pop-upload/custom-request-headers", + "component": "PopUpload dialog box", + "findIntroStr": "Click the element to display the upload dialog box.", + "demoId": "custom-request-headers" + }, + { + "title": "Extra parameters attached during upload", + "content": "

The data attribute is used to customize the additional parameters attached to the upload.

\n", + "link": "pop-upload/data", + "component": "PopUpload dialog box", + "findIntroStr": "Click the element to display the upload dialog box.", + "demoId": "data" + }, + { + "title": "Set Component Size", + "content": "

The options are as follows: medium, small, mini\nThe disabled attribute is used to set whether to disable. The default value is false.

\n", + "link": "pop-upload/size", + "component": "PopUpload dialog box", + "findIntroStr": "Click the element to display the upload dialog box.", + "demoId": "size" + }, + { + "title": "Override the default request", + "content": "

You can configure http-request to overwrite the default upload behavior and customize the upload implementation

\n", + "link": "pop-upload/http-request", + "component": "PopUpload dialog box", + "findIntroStr": "Click the element to display the upload dialog box.", + "demoId": "http-request" + }, + { + "title": "Field name of the uploaded file", + "content": "

Use the upload-name attribute to set the field name of the file to be uploaded. The default value is file.

\n", + "link": "pop-upload/upload-name", + "component": "PopUpload dialog box", + "findIntroStr": "Click the element to display the upload dialog box.", + "demoId": "upload-name1" + }, + { + "title": "Send cookie credential information", + "content": "For details, see the following example.", + "link": "pop-upload/upload-name", + "component": "PopUpload dialog box", + "findIntroStr": "Click the element to display the upload dialog box.", + "demoId": "upload-name" + }, + { + "title": "Text of the Cancel button in the dialog box for uploading files", + "content": "

Specify the text content of the cancel button through the cancel-button-text attribute

\n", + "link": "pop-upload/fill-button-text", + "component": "PopUpload dialog box", + "findIntroStr": "Click the element to display the upload dialog box.", + "demoId": "fill-button-text1" + }, + { + "title": "Text of the Submit button in the dialog box for uploading files", + "content": "For details, see the following example.", + "link": "pop-upload/fill-button-text", + "component": "PopUpload dialog box", + "findIntroStr": "Click the element to display the upload dialog box.", + "demoId": "fill-button-text2" + }, + { + "title": "Text of the button for opening a dialog box", + "content": "For details, see the following example.", + "link": "pop-upload/fill-button-text", + "component": "PopUpload dialog box", + "findIntroStr": "Click the element to display the upload dialog box.", + "demoId": "fill-button-text4" + }, + { + "title": "Maximum number of files to be uploaded", + "content": "

You can use the limit attribute to specify the maximum number of files to be uploaded. After the multiple attribute is configured, you can select multiple files at the same time.

\n", + "link": "pop-upload/file-limit", + "component": "PopUpload dialog box", + "findIntroStr": "Click the element to display the upload dialog box.", + "demoId": "file-limit" + }, + { + "title": "File types that can be uploaded", + "content": "

The accept attribute can be used to control the file type when a file is selected, and the upload-file-type attribute can be used to specify the file type to be verified during upload.

\n", + "link": "pop-upload/file-type", + "component": "PopUpload dialog box", + "findIntroStr": "Click the element to display the upload dialog box.", + "demoId": "file-type" + }, + { + "title": "Size of files that can be uploaded", + "content": "

The max-upload-file-size attribute specifies the size of the file that can be uploaded.

\n", + "link": "pop-upload/max-upload-file-size", + "component": "PopUpload dialog box", + "findIntroStr": "Click the element to display the upload dialog box.", + "demoId": "max-upload-file-size" + }, + { + "title": "Do not delete files", + "content": "

:before-remove (callback event before removing a file). In the method, return true/false indicates whether the file can be deleted.

\n", + "link": "pop-upload/prevent-delete-file", + "component": "PopUpload dialog box", + "findIntroStr": "Click the element to display the upload dialog box.", + "demoId": "prevent-delete-file" + }, + { + "title": "Do not upload files", + "content": "

:before-upload Indicates the hook before uploading a file. The parameter is the uploaded file. If false is returned or Promise is returned and rejected, the upload stops.

\n", + "link": "pop-upload/before-upload", + "component": "PopUpload dialog box", + "findIntroStr": "Click the element to display the upload dialog box.", + "demoId": "before-upload" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/popover.json b/examples/docs/resources/pc/demo-config/en-US/popover.json new file mode 100644 index 000000000..e7f7a9dc2 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/popover.json @@ -0,0 +1,138 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "popover/basic-usage", + "component": " Popover", + "findIntroStr": "Popover can trigger a pop-up dialog box by performing operations on a trigger source. The pop-up content, delay triggering, and gradient animation are supported.", + "demoId": "basic-usage" + }, + { + "title": "Add Content", + "content": "

content Sets what to display.

\n", + "link": "popover/popover-content", + "component": " Popover", + "findIntroStr": "Popover can trigger a pop-up dialog box by performing operations on a trigger source. The pop-up content, delay triggering, and gradient animation are supported.", + "demoId": "popover-content" + }, + { + "title": "Arrow Offset", + "content": "

arrow-offset Sets the offset of the arrow to change the position of the arrow.

\n", + "link": "popover/arrow-offset", + "component": " Popover", + "findIntroStr": "Popover can trigger a pop-up dialog box by performing operations on a trigger source. The pop-up content, delay triggering, and gradient animation are supported.", + "demoId": "arrow-offset" + }, + { + "title": "Popup Box Offset", + "content": "

offset Sets the offset of the dialog box to change the position of the dialog box.

\n", + "link": "popover/frame-offset", + "component": " Popover", + "findIntroStr": "Popover can trigger a pop-up dialog box by performing operations on a trigger source. The pop-up content, delay triggering, and gradient animation are supported.", + "demoId": "frame-offset" + }, + { + "title": "Delay Hiding", + "content": "

close-delay The delay for hiding the pop-up dialog box is in milliseconds (number)

\n", + "link": "popover/close-delay", + "component": " Popover", + "findIntroStr": "Popover can trigger a pop-up dialog box by performing operations on a trigger source. The pop-up content, delay triggering, and gradient animation are supported.", + "demoId": "close-delay" + }, + { + "title": "Disabled", + "content": "

disabled Sets whether to disable pop-up boxes.

\n", + "link": "popover/dynamic-disable", + "component": " Popover", + "findIntroStr": "Popover can trigger a pop-up dialog box by performing operations on a trigger source. The pop-up content, delay triggering, and gradient animation are supported.", + "demoId": "dynamic-disable" + }, + { + "title": "Delay Display", + "content": "

open-delay, Set the delay time (type: number, unit: ms)

\n", + "link": "popover/open-delay", + "component": " Popover", + "findIntroStr": "Popover can trigger a pop-up dialog box by performing operations on a trigger source. The pop-up content, delay triggering, and gradient animation are supported.", + "demoId": "open-delay" + }, + { + "title": "Display position", + "content": "

placement: indicates the position of the dialog box that is displayed. The value can be (top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end)

\n", + "link": "popover/popover-placement", + "component": " Popover", + "findIntroStr": "Popover can trigger a pop-up dialog box by performing operations on a trigger source. The pop-up content, delay triggering, and gradient animation are supported.", + "demoId": "popover-placement" + }, + { + "title": "Custom Style", + "content": "

popper-class You can configure one or more classes

\n", + "link": "popover/popper-class", + "component": " Popover", + "findIntroStr": "Popover can trigger a pop-up dialog box by performing operations on a trigger source. The pop-up content, delay triggering, and gradient animation are supported.", + "demoId": "popper-class" + }, + { + "title": "Customized Gradient Animation", + "content": "

transition Sets the display-hide-in-fade-out animation of the dialog box. The default values are fade-in-linear and fade-in (no animation effect).

\n", + "link": "popover/custom-transition", + "component": " Popover", + "findIntroStr": "Popover can trigger a pop-up dialog box by performing operations on a trigger source. The pop-up content, delay triggering, and gradient animation are supported.", + "demoId": "custom-transition" + }, + { + "title": "Trigger Mode", + "content": "

trigger Set the triggering mode of the pop-up dialog box. clickClick to trigger focusHoverHoverClick to trigger manual. Click Hide

\n again", + "link": "popover/trigger-mode", + "component": " Popover", + "findIntroStr": "Popover can trigger a pop-up dialog box by performing operations on a trigger source. The pop-up content, delay triggering, and gradient animation are supported.", + "demoId": "trigger-mode" + }, + { + "title": "Hide the arrow in the dialog box", + "content": "

visible-arrow Sets whether to display the arrow of the prompt box.

\n", + "link": "popover/hidden-arrow", + "component": " Popover", + "findIntroStr": "Popover can trigger a pop-up dialog box by performing operations on a trigger source. The pop-up content, delay triggering, and gradient animation are supported.", + "demoId": "hidden-arrow" + }, + { + "title": "Width", + "content": "Width of the

width pop-up box

\n", + "link": "popover/popover-width", + "component": " Popover", + "findIntroStr": "Popover can trigger a pop-up dialog box by performing operations on a trigger source. The pop-up content, delay triggering, and gradient animation are supported.", + "demoId": "popover-width" + }, + { + "title": "Pop-up Options", + "content": "

popper-options Configuration pop-up options

\n", + "link": "popover/popper-options", + "component": " Popover", + "findIntroStr": "Popover can trigger a pop-up dialog box by performing operations on a trigger source. The pop-up content, delay triggering, and gradient animation are supported.", + "demoId": "popper-options" + }, + { + "title": "Trigger Source", + "content": "

slot Set the trigger source of the pop-up dialog box

\n", + "link": "popover/trigger-reference", + "component": " Popover", + "findIntroStr": "Popover can trigger a pop-up dialog box by performing operations on a trigger source. The pop-up content, delay triggering, and gradient animation are supported.", + "demoId": "trigger-reference" + }, + { + "title": "Custom Prompt Text", + "content": "

content Set the custom text. You can also nest the default slot in the label as the custom text

\n", + "link": "popover/custom-tip-text", + "component": " Popover", + "findIntroStr": "Popover can trigger a pop-up dialog box by performing operations on a trigger source. The pop-up content, delay triggering, and gradient animation are supported.", + "demoId": "custom-tip-text" + }, + { + "title": "Event", + "content": "Callback triggered after

input loading\n\nhideHideHideCallback triggered during display\n\nshow \n\nafter-leave displayCallback triggered during display \n\nafter-enter displayCallback triggered after animation playing is complete

\n", + "link": "popover/popover-events", + "component": " Popover", + "findIntroStr": "Popover can trigger a pop-up dialog box by performing operations on a trigger source. The pop-up content, delay triggering, and gradient animation are supported.", + "demoId": "popover-events" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/progress.json b/examples/docs/resources/pc/demo-config/en-US/progress.json new file mode 100644 index 000000000..1656b5d77 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/progress.json @@ -0,0 +1,82 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "progress/basic-usage", + "component": " Progress", + "findIntroStr": "Displays the operation progress and informs users of the current status and expectations.", + "demoId": "basic-usage" + }, + { + "title": "line type", + "content": "

type="line" is displayed as line

\n", + "link": "progress/progress-type", + "component": " Progress", + "findIntroStr": "Displays the operation progress and informs users of the current status and expectations.", + "demoId": "progress-type" + }, + { + "title": "circle type", + "content": "The

type="circle" is of the circle type. widthYou can adjust the width of the ring progress bar canvas. The default value is 126px.

\n", + "link": "progress/progress-type-circle", + "component": " Progress", + "findIntroStr": "Displays the operation progress and informs users of the current status and expectations.", + "demoId": "progress-type-circle" + }, + { + "title": "Dashboard Type", + "content": "The

type="dashboard" is displayed as a dashboard. widthYou can adjust the width of the ring progress bar canvas. The default value is 126px.

\n", + "link": "progress/progress-type-dashboard", + "component": " Progress", + "findIntroStr": "Displays the operation progress and informs users of the current status and expectations.", + "demoId": "progress-type-dashboard" + }, + { + "title": "Width", + "content": "Width of the

stroke-width progress bar, in px

\n", + "link": "progress/progress-width", + "component": " Progress", + "findIntroStr": "Displays the operation progress and informs users of the current status and expectations.", + "demoId": "progress-width" + }, + { + "title": "Status", + "content": "Current status of the

status progress bar: (success/exception/warning)

\n", + "link": "progress/progress-status", + "component": " Progress", + "findIntroStr": "Displays the operation progress and informs users of the current status and expectations.", + "demoId": "progress-status" + }, + { + "title": "Text displayed or not displayed", + "content": "

show-text Whether to display progress bar text

\n", + "link": "progress/text-inside-or-no-text", + "component": " Progress", + "findIntroStr": "Displays the operation progress and informs users of the current status and expectations.", + "demoId": "text-inside-or-no-text" + }, + { + "title": "Custom Color", + "content": "

Set the color of the progress bar through color. color: background color of the progress bar (overwrites the status color)

\n", + "link": "progress/custom-color", + "component": " Progress", + "findIntroStr": "Displays the operation progress and informs users of the current status and expectations.", + "demoId": "custom-color" + }, + { + "title": "Custom Text", + "content": "The

text-inside progress bar text is embedded in the progress bar (available only when type is set to line). formatCustomize the progress bar text

\n", + "link": "progress/format-text", + "component": " Progress", + "findIntroStr": "Displays the operation progress and informs users of the current status and expectations.", + "demoId": "format-text" + }, + { + "title": "Dynamic control progress bar change", + "content": "

Dynamic control of the progress bar by setting percentage

\n", + "link": "progress/dynamic-control-changes", + "component": " Progress", + "findIntroStr": "Displays the operation progress and informs users of the current status and expectations.", + "demoId": "dynamic-control-changes" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/radio.json b/examples/docs/resources/pc/demo-config/en-US/radio.json new file mode 100644 index 000000000..305f483d1 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/radio.json @@ -0,0 +1,106 @@ +[ + { + "title": "Basic Usage", + "content": "

uses v-model to bind a variable. The variable value is the default radio selected. The variable value corresponds to the value of label. You can also use text to configure the display text, which is the same as the result of the default slot configuration plain text.\n\nlabel can be String, Number, or Boolean.

\n", + "link": "radio/basic-usage", + "component": "Radio option button", + "findIntroStr": "Used to configure options for different scenarios. Select one option from a group of options.", + "demoId": "basic-usage" + }, + { + "title": "Profile Radio Group", + "content": "

Provides the options attribute to render radio groups by configuring object array data. This property eliminates the need to insert a <radio> or <radio-button> tag as a slot in the tag. \n\nThe options object array contains three fields: label, text, and events. \n\n The type attribute is also provided, which is used together with the options attribute. The default value is radio. You can also set this parameter to button. After the configuration, the radio group is displayed as a button.

\n", + "link": "radio/group-options", + "component": "Radio option button", + "findIntroStr": "Used to configure options for different scenarios. Select one option from a group of options.", + "demoId": "group-options" + }, + { + "title": "With borders", + "content": "

You can set the border attribute to add a border to an option button.

\n", + "link": "radio/with-border", + "component": "Radio option button", + "findIntroStr": "Used to configure options for different scenarios. Select one option from a group of options.", + "demoId": "with-border" + }, + { + "title": "Disabled", + "content": "

Set the disabled attribute to enable the disabled state. The default value is false.

\n", + "link": "radio/dynamic-disable", + "component": "Radio option button", + "findIntroStr": "Used to configure options for different scenarios. Select one option from a group of options.", + "demoId": "dynamic-disable" + }, + { + "title": "vertical layout", + "content": "

You can set the vertical attribute on the RadioGroup component to enable the vertical layout of the option buttons.

\n", + "link": "radio/vertical", + "component": "Radio option button", + "findIntroStr": "Used to configure options for different scenarios. Select one option from a group of options.", + "demoId": "vertical" + }, + { + "title": "Color Settings", + "content": "When a radio in the

format is activated, you can set the text color through the text-color attribute, and set the fill color and border color through the fill attribute.

\n", + "link": "radio/active-color", + "component": "Radio option button", + "findIntroStr": "Used to configure options for different scenarios. Select one option from a group of options.", + "demoId": "active-color" + }, + { + "title": "Text Content", + "content": "

You can set the text attribute on the Radio component to set the content.

\n", + "link": "radio/radio-text", + "component": "Radio option button", + "findIntroStr": "Used to configure options for different scenarios. Select one option from a group of options.", + "demoId": "radio-text" + }, + { + "title": "Button Content", + "content": "

You can set the radio content through the label attribute.

\n", + "link": "radio/radio-button", + "component": "Radio option button", + "findIntroStr": "Used to configure options for different scenarios. Select one option from a group of options.", + "demoId": "radio-button" + }, + { + "title": "name", + "content": "For details, see the following example.", + "link": "radio/radio-button", + "component": "Radio option button", + "findIntroStr": "Used to configure options for different scenarios. Select one option from a group of options.", + "demoId": "radio-button1" + }, + { + "title": "Size Settings", + "content": "

You can set the size attribute for a radio with a button or a radio with a border to change its size. The options include medium, small, and mini.

\n", + "link": "radio/radio-size", + "component": "Radio option button", + "findIntroStr": "Used to configure options for different scenarios. Select one option from a group of options.", + "demoId": "radio-size" + }, + { + "title": "Option button event", + "content": "

You can set the change event on the Radio and RadioGroup components. The event is triggered when the bound value changes. The callback function is the selected radio label value.

\n", + "link": "radio/radio-events", + "component": "Radio option button", + "findIntroStr": "Used to configure options for different scenarios. Select one option from a group of options.", + "demoId": "radio-events" + }, + { + "title": "Configure radio cyclically", + "content": "

You can set the options attribute on the RadioGroup component to configure radio cyclically.

\n", + "link": "radio/group-options", + "component": "Radio option button", + "findIntroStr": "Used to configure options for different scenarios. Select one option from a group of options.", + "demoId": "group-options1" + }, + { + "title": "Default slot", + "content": "

by defaultdefault slot list.

\n", + "link": "radio/radio-default", + "component": "Radio option button", + "findIntroStr": "Used to configure options for different scenarios. Select one option from a group of options.", + "demoId": "radio-default" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/rate.json b/examples/docs/resources/pc/demo-config/en-US/rate.json new file mode 100644 index 000000000..409fb0a0b --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/rate.json @@ -0,0 +1,138 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "rate/basic-usage", + "component": "Rate Score", + "findIntroStr": "Rate quick rating, which is used to display reviews.", + "demoId": "basic-usage" + }, + { + "title": "Custom 3-segment color", + "content": "

You can use colors to define three-segment colors.

\n", + "link": "rate/custom-3-threshold-colors", + "component": "Rate Score", + "findIntroStr": "Rate quick rating, which is used to display reviews.", + "demoId": "custom-3-threshold-colors" + }, + { + "title": "Unselected icon color when customized is disabled", + "content": "

You can use disabled-void-color to customize the color of the unselected icon.

\n", + "link": "rate/disabled-not-selected-color", + "component": "Rate Score", + "findIntroStr": "Rate quick rating, which is used to display reviews.", + "demoId": "disabled-not-selected-color" + }, + { + "title": "Icon class name that is not selected when user-defined is disabled", + "content": "

You can use disabled-void-icon-class to customize the class name of the icon that is not selected during disabling.

\n", + "link": "rate/disabled-not-selected-class", + "component": "Rate Score", + "findIntroStr": "Rate quick rating, which is used to display reviews.", + "demoId": "disabled-not-selected-class" + }, + { + "title": "Custom 3-segment icon style", + "content": "

You can use icon-classes to customize the 3-part icon style.

\n", + "link": "rate/custom-3-threshold-icon", + "component": "Rate Score", + "findIntroStr": "Rate quick rating, which is used to display reviews.", + "demoId": "custom-3-threshold-icon" + }, + { + "title": "Auxiliary Text and Color", + "content": "

You can set the auxiliary text content, whether to display the auxiliary text, and the auxiliary text color through the texts show-text text-color attributes.

\n", + "link": "rate/texts-and-text-color", + "component": "Rate Score", + "findIntroStr": "Rate quick rating, which is used to display reviews.", + "demoId": "texts-and-text-color" + }, + { + "title": "Size and Placeholder Width", + "content": "

You can use size space to separate the size and placeholder width.

\n", + "link": "rate/size-and-space", + "component": "Rate Score", + "findIntroStr": "Rate quick rating, which is used to display reviews.", + "demoId": "size-and-space" + }, + { + "title": "Customize the color of unselected icons", + "content": "

You can use void-color to define the color of an unselected icon.

\n", + "link": "rate/not-selected-color", + "component": "Rate Score", + "findIntroStr": "Rate quick rating, which is used to display reviews.", + "demoId": "not-selected-color" + }, + { + "title": "Customized unselected icon class name", + "content": "

You can use void-icon-class to define the unselected icon class name.

\n", + "link": "rate/not-selected-class", + "component": "Rate Score", + "findIntroStr": "Rate quick rating, which is used to display reviews.", + "demoId": "not-selected-class" + }, + { + "title": "Text prompt under the icon", + "content": "

You can use text-on-bottom to define whether to display text prompts under icons.

\n", + "link": "rate/text-on-bottom", + "component": "Rate Score", + "findIntroStr": "Rate quick rating, which is used to display reviews.", + "demoId": "text-on-bottom" + }, + { + "title": "Half Selection", + "content": "

You can use allow-half to define whether half selection is supported.

\n", + "link": "rate/allow-half", + "component": "Rate Score", + "findIntroStr": "Rate quick rating, which is used to display reviews.", + "demoId": "allow-half" + }, + { + "title": "Disabled", + "content": "

You can use disabled to define whether to disable the function.

\n", + "link": "rate/dynamic-disable", + "component": "Rate Score", + "findIntroStr": "Rate quick rating, which is used to display reviews.", + "demoId": "dynamic-disable" + }, + { + "title": "Score Display", + "content": "

You can use show-score score-template to define whether to display scores and the display template.

\n", + "link": "rate/show-score", + "component": "Rate Score", + "findIntroStr": "Rate quick rating, which is used to display reviews.", + "demoId": "show-score" + }, + { + "title": "Single Choice Mode", + "content": "

You can use radio to set the single-choice mode.

\n", + "link": "rate/radio-rate", + "component": "Rate Score", + "findIntroStr": "Rate quick rating, which is used to display reviews.", + "demoId": "radio-rate" + }, + { + "title": "Maximum Score", + "content": "

You can use max to set the maximum score.

\n", + "link": "rate/max-score", + "component": "Rate Score", + "findIntroStr": "Rate quick rating, which is used to display reviews.", + "demoId": "max-score" + }, + { + "title": "Boundaries", + "content": "

You can set the lower limit and upper limit by using low-threshold high-threshold, and set the color of the displayed star by using colors

\n", + "link": "rate/threshold-value", + "component": "Rate Score", + "findIntroStr": "Rate quick rating, which is used to display reviews.", + "demoId": "threshold-value" + }, + { + "title": "Event", + "content": "

Listen to the change event triggering method.

\n", + "link": "rate/rate-events", + "component": "Rate Score", + "findIntroStr": "Rate quick rating, which is used to display reviews.", + "demoId": "rate-events" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/roles.json b/examples/docs/resources/pc/demo-config/en-US/roles.json new file mode 100644 index 000000000..f8de09097 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/roles.json @@ -0,0 +1,18 @@ +[ + { + "title": "Basic Usage", + "content": "
\n

Note that the Roles component requests mock data. Use real services during development. \n The change(userId) interface is used to listen to the switchover event. The input parameter is the user ID after the switchover.

\n
\n", + "link": "roles/base", + "component": "Switch Roles", + "findIntroStr": "Roles role component, which provides the role list of the current user and allows users to switch between roles.", + "demoId": "base" + }, + { + "title": "Customized Query Service", + "content": "
\n

Note that the Roles component requests mock data. Use real services during development. \n Use fetch-role to customize the query service.

\n
\n", + "link": "roles/fetch-role", + "component": "Switch Roles", + "findIntroStr": "Roles role component, which provides the role list of the current user and allows users to switch between roles.", + "demoId": "fetch-role" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/scroll-text.json b/examples/docs/resources/pc/demo-config/en-US/scroll-text.json new file mode 100644 index 000000000..d40dbdbc0 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/scroll-text.json @@ -0,0 +1,58 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "scroll-text/basic-usage", + "component": "ScrollText", + "findIntroStr": "This command is used to display text messages in scrolling mode.", + "demoId": "basic-usage" + }, + { + "title": "Text scrolling direction", + "content": "

You can use direction to set the text scrolling direction.

\n", + "link": "scroll-text/scroll-direction", + "component": "ScrollText", + "findIntroStr": "This command is used to display text messages in scrolling mode.", + "demoId": "scroll-direction" + }, + { + "title": "The text stops scrolling when the mouse is hovered.", + "content": "

You can use hover-stop to set whether the text stops scrolling when the mouse is hovered.

\n", + "link": "scroll-text/hover-stop", + "component": "ScrollText", + "findIntroStr": "This command is used to display text messages in scrolling mode.", + "demoId": "hover-stop" + }, + { + "title": "Custom Text Content", + "content": "

You can use text to customize the text content.

\n", + "link": "scroll-text/custom-scroll-text", + "component": "ScrollText", + "findIntroStr": "This command is used to display text messages in scrolling mode.", + "demoId": "custom-scroll-text" + }, + { + "title": "Customize the text content through the Solt slot", + "content": "

You can customize the text content through the solt slot.

\n", + "link": "scroll-text/slots", + "component": "ScrollText", + "findIntroStr": "This command is used to display text messages in scrolling mode.", + "demoId": "slots" + }, + { + "title": "Scrolling Interval", + "content": "

You can use time to set the scrolling interval.

\n", + "link": "scroll-text/scroll-time", + "component": "ScrollText", + "findIntroStr": "This command is used to display text messages in scrolling mode.", + "demoId": "scroll-time" + }, + { + "title": "Custom Text Style", + "content": "

You can use class to customize the text style.

\n", + "link": "scroll-text/custom-text-style", + "component": "ScrollText", + "findIntroStr": "This command is used to display text messages in scrolling mode.", + "demoId": "custom-text-style" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/search.json b/examples/docs/resources/pc/demo-config/en-US/search.json new file mode 100644 index 000000000..4dcdf59be --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/search.json @@ -0,0 +1,90 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "search/basic-usage", + "component": "Search", + "findIntroStr": "Specify a condition object to search for data.", + "demoId": "basic-usage" + }, + { + "title": "Can be cleared", + "content": "

You can use the clearable attribute to set the display of the clear icon button.

\n", + "link": "search/clearable", + "component": "Search", + "findIntroStr": "Specify a condition object to search for data.", + "demoId": "clearable" + }, + { + "title": "Mini mode", + "content": "

You can use mini to set the component to the mini mode.

\n", + "link": "search/mini-mode", + "component": "Search", + "findIntroStr": "Specify a condition object to search for data.", + "demoId": "mini-mode" + }, + { + "title": "Transparent mode", + "content": "

You can use transparent to set the component to the transparent mode (valid in mini mode). Search Type

\n", + "link": "search/transparent-mode", + "component": "Search", + "findIntroStr": "Specify a condition object to search for data.", + "demoId": "transparent-mode" + }, + { + "title": "Default Search", + "content": "

You can use v-model to configure the default search criteria of the component.

\n", + "link": "search/default-value", + "component": "Search", + "findIntroStr": "Specify a condition object to search for data.", + "demoId": "default-value" + }, + { + "title": "Search Type", + "content": "

You can use search-types to configure the search types available for the component.

\n", + "link": "search/search-types", + "component": "Search", + "findIntroStr": "Specify a condition object to search for data.", + "demoId": "search-types" + }, + { + "title": "Content of the user-defined search type", + "content": "For details, see the following example.", + "link": "search/custom-search-types", + "component": "Search", + "findIntroStr": "Specify a condition object to search for data.", + "demoId": "custom-search-types" + }, + { + "title": "Customized search type", + "content": "

Search Type

\n", + "link": "search/show-selected-types", + "component": "Search", + "findIntroStr": "Specify a condition object to search for data.", + "demoId": "show-selected-types" + }, + { + "title": "Customized search event", + "content": "For details, see the following example.", + "link": "search/search-events", + "component": "Search", + "findIntroStr": "Specify a condition object to search for data.", + "demoId": "search-events" + }, + { + "title": "Customized change event", + "content": "For details, see the following example.", + "link": "search/change-events", + "component": "Search", + "findIntroStr": "Specify a condition object to search for data.", + "demoId": "change-events" + }, + { + "title": "Customized select event", + "content": "For details, see the following example.", + "link": "search/select-events", + "component": "Search", + "findIntroStr": "Specify a condition object to search for data.", + "demoId": "select-events" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/select.json b/examples/docs/resources/pc/demo-config/en-US/select.json new file mode 100644 index 000000000..ae906afea --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/select.json @@ -0,0 +1,418 @@ +[ + { + "title": "Basic Usage", + "content": "The value of

v-model is the value of the value attribute of the currently selected tiny-option.

\n", + "link": "select/basic-usage", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "basic-usage" + }, + { + "title": "Multiple Choices", + "content": "

The multiple attribute is used to enable the multi-selection function. In this case, the value of v-model is an array of selected values. By default, the selected value is displayed as a tag.

\n", + "link": "select/multiple", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "multiple" + }, + { + "title": "Collapse Tag", + "content": "

When you select multiple values, you can set the collapse-tags attribute to combine the selected values into a text.

\n", + "link": "select/collapse-tags", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "collapse-tags" + }, + { + "title": "Maximum number of options", + "content": "The

multiple-limit attribute specifies the maximum number of items that can be selected by the user during multiple selection. The default value is 0, which is not limited.

\n", + "link": "select/multiple-limit", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "multiple-limit" + }, + { + "title": "Big Data Virtual Scrolling", + "content": "

You can set the options in the options drop-down list box and set optimization to enable the big data virtual scrolling function. Virtual scrolling is not supported when using the label configuration option. \nIn multi-choice mode, the maximum number of selected items multiple-limit is 20 by default. If a large number of selected items are selected, you are advised to enable collapse-tags to collapse the display.

\n", + "link": "select/optimization", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "optimization" + }, + { + "title": "Disabled", + "content": "

After the disabled property is set, the entire selector is unavailable.

\n", + "link": "select/disabled", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "disabled" + }, + { + "title": "Some options in the drop-down list box are disabled.", + "content": "This option is unavailable after the disabled attribute is set for the

tiny-options tag.

\n", + "link": "select/disabled-options", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "disabled-options" + }, + { + "title": "By default, multiple options in the drop-down list are selected and disabled.", + "content": "

After the disabled attribute is set for the default selected tag, this option is disabled.

\n", + "link": "select/disabled-and-selected-options", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "disabled-and-selected-options" + }, + { + "title": "medium", + "content": "

The size attribute defines the text box size. The options are medium, small, and mini. \n Use options to configure the Select data item. After using the data item, you do not need to configure tiny-option.

\n", + "link": "select/size-medium", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "size-medium" + }, + { + "title": "small", + "content": "For details, see the following example.", + "link": "select/size-small", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "size-small" + }, + { + "title": "mini", + "content": "For details, see the following example.", + "link": "select/size-mini", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "size-mini" + }, + { + "title": "Group", + "content": "

uses tiny-option-group to group options. The label attribute is the group name. Use the disabled attribute to disable all options in the group.

\n", + "link": "select/option-group", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "option-group" + }, + { + "title": "Disable some options for grouping", + "content": "

Use tiny-option-group to group options and disable some grouping.

\n", + "link": "select/option-group-disable", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "option-group-disable" + }, + { + "title": "change clear blur focus event", + "content": "Description of the

event

\n

change: triggered when the selected value changes. The callback parameter is the current selected value.\nclear: triggered when the user clicks the clear button in the option mode.\nblur: triggered when the input loses the focus.\nfocus:

\n
\n is triggered when the input is focused", + "link": "select/envts-change", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "envts-change" + }, + { + "title": "visible-change remove-tag event", + "content": "

Event Description

\n

visible-change: Triggered when the drop-down list box is displayed or hidden. The callback parameter is true if the drop-down list box is displayed or false if the drop-down list box is hidden.\nremove-tag: Triggered when the tag is removed in multi-select mode. The callback parameter is the removed tag value

\n
\n", + "link": "select/envts-remove", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "envts-remove" + }, + { + "title": "Searchable", + "content": "

The filterable property enables the search function. By default, Select finds all options for which the label property contains the entered value. If you want to use other search logic, you can pass in a filter-method. filter-method is a function. It is invoked when the input value changes. The parameter is the current input value.

\n", + "link": "select/filter-method", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "filter-method" + }, + { + "title": "The search allows copying", + "content": "

In the search scenario, the content in the text box cannot be copied. You need to add the allow-copy attribute to copy the content. The allow-copy attribute defaults to false. \nWhen hovering the mouse over the text box, press and move the mouse to select the previous text. \n When you hover the cursor over the text box and click the left mouse button, the input content changes to placeholder, the content is cleared, and the input state is entered.

\n", + "link": "select/search-allow-copy", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "search-allow-copy" + }, + { + "title": "Create Item", + "content": "

The allow-create attribute allows you to create a new entry that does not exist in the option by entering text in the text box. Note that the filterable attribute must be true at this point. After the default-first-option attribute is set to true, you can press Enter to select the first option in the current option list. You do not need to use the mouse or keyboard arrow keys to locate the option.

\n", + "link": "select/allow-create", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "allow-create" + }, + { + "title": "Remote Search", + "content": "

To enable remote search, set filterable and remote to true. In addition, a remote-method is transferred. remote-method is a function. It is invoked when the input value changes. The parameter is the current input value. When the reserve-keyword attribute has multiple options and is searchable, the current search keyword can be retained after an option is selected.

\n", + "link": "select/remote-method", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "remote-method" + }, + { + "title": "Remote search is triggered when the focus is obtained.", + "content": "For details, see the following example.", + "link": "select/focus-remote-method", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "focus-remote-method" + }, + { + "title": "Remote search allows replication", + "content": "

In the remote search scenario, the content in the text box cannot be copied. You need to add the allow-copy attribute to copy the content. The allow-copy attribute defaults to false. \nWhen hovering the mouse over the text box, press and move the mouse to select the previous text. \n When you hover the cursor over the text box and click the left mouse button, the input content changes to placeholder, the content is cleared, and the input state is entered.

\n", + "link": "select/remote-search-allow-copy", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "remote-search-allow-copy" + }, + { + "title": "Options can be cleared", + "content": "

You can use the clearable attribute to clear the selector. When you hover the cursor over the selector, the clear icon is displayed. Note that the clearable attribute applies only to single selection.

\n", + "link": "select/clearable", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "clearable" + }, + { + "title": "name", + "content": "

You can set the name attribute through the name attribute

\n", + "link": "select/name", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "name" + }, + { + "title": "Select selector options can be copied", + "content": "

After the tag-selectable attribute is set, the selected options in the text box can be selected by using the mouse, and then you can press Ctrl + C or right-click to copy the options.

\n", + "link": "select/tag-select", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "tag-select" + }, + { + "title": "The Select selector option can be copied to all.", + "content": "

After the copyable attribute is set, all tag text contents can be copied and separated by commas.

\n", + "link": "select/tag-copy-all", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "tag-copy-all" + }, + { + "title": "Bound Value Object", + "content": "

If the bound value is an object, the value-key attribute must be configured to specify the key name uniquely identified by the value.

\n", + "link": "select/binding-obj", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "binding-obj" + }, + { + "title": "Customized search text without matching", + "content": "

You can use the no-match-text attribute to customize the text displayed when no search criteria are matched.

\n", + "link": "select/no-match-text", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "no-match-text" + }, + { + "title": "Customized text for empty data display", + "content": "

You can use the no-data-text attribute to customize the text displayed when the option is empty.

\n", + "link": "select/no-data-text", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "no-data-text" + }, + { + "title": "Pop-up dialog box style and positioning", + "content": "

You can use the popper-class attribute to customize the style of the drop-down list box. popper-append-to-body\t Specifies whether to insert a pop-up into the body element. If a fault occurs in locating the dialog box that is displayed, set this parameter to false.

\n", + "link": "select/popup-style-position", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "popup-style-position" + }, + { + "title": "The drop-down menu is displayed when the focus is obtained.", + "content": "

After automatic-dropdown is set to true, the option menu is automatically displayed after the focus is obtained in the text box.

\n", + "link": "select/automatic-dropdown", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "automatic-dropdown" + }, + { + "title": "Custom header content", + "content": "

Customize the header content of the text box through the prefix slot.

\n", + "link": "select/custom-prefix", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "custom-prefix" + }, + { + "title": "User-defined drop-down list", + "content": "

is implemented through the default slot of Option. Insert the customized HTML template into the slot of tiny-option.

\n", + "link": "select/custom-options", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "custom-options" + }, + { + "title": "The Select All option is not displayed.", + "content": "If

show-alloption is set to false, the Select All option is not displayed. The default value is true.

\n", + "link": "select/show-alloption", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "show-alloption" + }, + { + "title": "Change the value in the text box.", + "content": "For details, see the following example.", + "link": "select/set-input-value", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "set-input-value" + }, + { + "title": "Manually obtaining the focus", + "content": "

Invoke the focus() method to focus the input.

\n", + "link": "select/manual-focus-blur", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "manual-focus-blur" + }, + { + "title": "The drop-down list follows the width of the text box.", + "content": "

The is-drop-inherit-width attribute is used to set whether the drop-down list box follows the width of the text box. The default value is false, indicating that the content is not followed. The width of the drop-down list can be expanded. If the value is true, the content is followed.

\n", + "link": "select/is-drop-inherit-width", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "is-drop-inherit-width" + }, + { + "title": "Empty data slot", + "content": "

Use empty to set the message displayed when there is no data.

\n", + "link": "select/slot-empty", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "slot-empty" + }, + { + "title": "Default slot", + "content": "

by defaultdefault slot list.

\n", + "link": "select/slot-default", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "slot-default" + }, + { + "title": "Nested Grid", + "content": "For details, see the following example.", + "link": "select/nest-radio-grid", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "nest-radio-grid" + }, + { + "title": "Nested grid, which can be searched for and cleared.", + "content": "For details, see the following example.", + "link": "select/nest-checkbox-grid-clearable", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "nest-checkbox-grid-clearable" + }, + { + "title": "Nested Multi-choice Grid", + "content": "For details, see the following example.", + "link": "select/nest-checkbox-grid", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "nest-checkbox-grid" + }, + { + "title": "text-field", + "content": "For details, see the following example.", + "link": "select/nest-checkbox-grid", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "nest-checkbox-grid1" + }, + { + "title": "value-field", + "content": "For details, see the following example.", + "link": "select/nest-checkbox-grid", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "nest-checkbox-grid2" + }, + { + "title": "Nested Grid data item disabled", + "content": "

In the drop-down list box, the attribute checkMethod of the select-config configuration item is used to determine which data items are disabled. The method determines each data item. If the return value is true or false, the data item is enabled or disabled. Select a single option from the drop-down list box. The attribute checkMethod of the radio-config configuration item is used to determine which data items are disabled. The method determines each data item. If the return value is true or false, the data item is enabled or disabled.

\n", + "link": "select/disable-grid-select-radio", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "disable-grid-select-radio" + }, + { + "title": "Enabling Remote Search for Nested Grids (Multiple Choices)", + "content": "

Set render-type to grid nested grid; Set filterable and remote to true and pass in the remote-method method to enable remote search. To automatically search for and display the expansion button, set remote-config

\n", + "link": "select/nest-grid-remote-filter", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "nest-grid-remote-filter" + }, + { + "title": "Nested Grid Enable Remote Search (Single Choice)", + "content": "

Set render-type to grid nested grid; Set filterable and remote to true and pass in the remote-method method to enable remote search. To automatically search for and display the expansion button, set remote-config

\n", + "link": "select/nest-remote-grid", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "nest-remote-grid" + }, + { + "title": "Grid nested with a large amount of data.", + "content": "For details, see the following example.", + "link": "select/nest-radio-grid-much-data", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "nest-radio-grid-much-data" + }, + { + "title": "Nested Radio Tree", + "content": "For details, see the following example.", + "link": "select/nest-radio-tree", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "nest-radio-tree" + }, + { + "title": "Nested Multi-choice Tree", + "content": "For details, see the following example.", + "link": "select/nest-checkbox-tree", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "nest-checkbox-tree" + }, + { + "title": "Searchable tree", + "content": "For details, see the following example.", + "link": "select/nest-filterable-tree", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "nest-filterable-tree" + }, + { + "title": "Configuration Mode", + "content": "

Enable the cache function by setting cache-op and set options by options.

\n", + "link": "select/cache-usage", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "cache-usage" + }, + { + "title": "Slot Mode", + "content": "

If the list rendering component is set to vue-option through slot to output the drop-down list, you need to manually add the cache function.

\n", + "link": "select/memoize-usage", + "component": "Select Selector", + "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.", + "demoId": "memoize-usage" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/slide-bar.json b/examples/docs/resources/pc/demo-config/en-US/slide-bar.json new file mode 100644 index 000000000..92f165ca0 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/slide-bar.json @@ -0,0 +1,42 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "slide-bar/basic-usage", + "component": "SlideBar Scrolling Block", + "findIntroStr": "SlideBar scroll block, which can be used as a sliding block of text.", + "demoId": "basic-usage" + }, + { + "title": "Number of blocks scrolled each time", + "content": "

You can use wheel-blocks to set the number of blocks to be scrolled each time. \nThe data source can be obtained when the service is invoked through value

\n", + "link": "slide-bar/wheel-blocks", + "component": "SlideBar Scrolling Block", + "findIntroStr": "SlideBar scroll block, which can be used as a sliding block of text.", + "demoId": "wheel-blocks" + }, + { + "title": "Custom Scroll Block Content", + "content": "

Customize the scroll block content by slot.

\n", + "link": "slide-bar/custom-content", + "component": "SlideBar Scrolling Block", + "findIntroStr": "SlideBar scroll block, which can be used as a sliding block of text.", + "demoId": "custom-content" + }, + { + "title": "Customized DOM Label", + "content": "

You can use tag sub-tag to customize DOM tags.

\n", + "link": "slide-bar/custom-tag", + "component": "SlideBar Scrolling Block", + "findIntroStr": "SlideBar scroll block, which can be used as a sliding block of text.", + "demoId": "custom-tag" + }, + { + "title": "Scroll Block Event", + "content": "For details, see the following example.", + "link": "slide-bar/slide-bar-events", + "component": "SlideBar Scrolling Block", + "findIntroStr": "SlideBar scroll block, which can be used as a sliding block of text.", + "demoId": "slide-bar-events" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/slider.json b/examples/docs/resources/pc/demo-config/en-US/slider.json new file mode 100644 index 000000000..cd8a07aea --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/slider.json @@ -0,0 +1,114 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "slider/basic-usage", + "component": "Slider Slider", + "findIntroStr": "You can slide the slider to determine the position and size. Multiple forms, horizontal, vertical, and range sliders.", + "demoId": "basic-usage" + }, + { + "title": "vertical mode", + "content": "

The vertical mode of the slider is displayed by setting the vertical attribute. landscape mode by default)\nIn vertical mode, you can set the height of the component by calling height\n", + "link": "slider/vertical-mode", + "component": "Slider Slider", + "findIntroStr": "You can slide the slider to determine the position and size. Multiple forms, horizontal, vertical, and range sliders.", + "demoId": "vertical-mode" + }, + { + "title": "Maximum/Minimum", + "content": "

Set min max to set the value range of the slider.

\n", + "link": "slider/max-min", + "component": "Slider Slider", + "findIntroStr": "You can slide the slider to determine the position and size. Multiple forms, horizontal, vertical, and range sliders.", + "demoId": "max-min" + }, + { + "title": "Current Value", + "content": "

Set format-tooltip to set the attribute value

\n", + "link": "slider/format-tooltip", + "component": "Slider Slider", + "findIntroStr": "You can slide the slider to determine the position and size. Multiple forms, horizontal, vertical, and range sliders.", + "demoId": "format-tooltip" + }, + { + "title": "Range Selection", + "content": "

Set the initial range selection for the array through v-model

\n", + "link": "slider/range-select", + "component": "Slider Slider", + "findIntroStr": "You can slide the slider to determine the position and size. Multiple forms, horizontal, vertical, and range sliders.", + "demoId": "range-select" + }, + { + "title": "Text box mode", + "content": "

Enable the slider text box mode by configuring show-input

\n", + "link": "slider/show-iput", + "component": "Slider Slider", + "findIntroStr": "You can slide the slider to determine the position and size. Multiple forms, horizontal, vertical, and range sliders.", + "demoId": "show-iput" + }, + { + "title": "Shortcut Key Operations", + "content": "

Set the total number of steps. That is, when you press the shortcut key PageDown or PageUp, the moving distance is (Maximum value - Minimum value)/Number of pages

\n", + "link": "slider/shortcut-operation", + "component": "Slider Slider", + "findIntroStr": "You can slide the slider to determine the position and size. Multiple forms, horizontal, vertical, and range sliders.", + "demoId": "shortcut-operation" + }, + { + "title": "Disabled", + "content": "

Set the attribute disabled to disable the sliding slider

\n", + "link": "slider/dynamic-disable", + "component": "Slider Slider", + "findIntroStr": "You can slide the slider to determine the position and size. Multiple forms, horizontal, vertical, and range sliders.", + "demoId": "dynamic-disable" + }, + { + "title": "Prompt", + "content": "

Disable the slider prompt by setting :show-tip="false" . (enabled by default)

\n", + "link": "slider/show-tip", + "component": "Slider Slider", + "findIntroStr": "You can slide the slider to determine the position and size. Multiple forms, horizontal, vertical, and range sliders.", + "demoId": "show-tip" + }, + { + "title": "Step", + "content": "

Set step to configure the slider sliding step

\n", + "link": "slider/about-step", + "component": "Slider Slider", + "findIntroStr": "You can slide the slider to determine the position and size. Multiple forms, horizontal, vertical, and range sliders.", + "demoId": "about-step" + }, + { + "title": "change event", + "content": "

change event

\n", + "link": "slider/slider-event-change", + "component": "Slider Slider", + "findIntroStr": "You can slide the slider to determine the position and size. Multiple forms, horizontal, vertical, and range sliders.", + "demoId": "slider-event-change" + }, + { + "title": "start Slider sliding start event", + "content": "

start Slider Start Event

\n", + "link": "slider/slider-event-start", + "component": "Slider Slider", + "findIntroStr": "You can slide the slider to determine the position and size. Multiple forms, horizontal, vertical, and range sliders.", + "demoId": "slider-event-start" + }, + { + "title": "stop slider sliding stop event", + "content": "

stop slider sliding stop event

\n", + "link": "slider/slider-event-stop", + "component": "Slider Slider", + "findIntroStr": "You can slide the slider to determine the position and size. Multiple forms, horizontal, vertical, and range sliders.", + "demoId": "slider-event-stop" + }, + { + "title": "Custom Slot", + "content": "For details, see the following example.", + "link": "slider/slider-slot", + "component": "Slider Slider", + "findIntroStr": "You can slide the slider to determine the position and size. Multiple forms, horizontal, vertical, and range sliders.", + "demoId": "slider-slot" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/split.json b/examples/docs/resources/pc/demo-config/en-US/split.json new file mode 100644 index 000000000..cf2a421bf --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/split.json @@ -0,0 +1,90 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "split/basic-usage", + "component": "Split Panel", + "findIntroStr": "This command is used to divide an area into two parts whose width or height can be adjusted by dragging.", + "demoId": "basic-usage" + }, + { + "title": "Panel Threshold", + "content": "For details, see the following example.", + "link": "split/split-threshold", + "component": "Split Panel", + "findIntroStr": "This command is used to divide an area into two parts whose width or height can be adjusted by dragging.", + "demoId": "split-threshold" + }, + { + "title": "Split Mode", + "content": "

Split type of the same mode. The options are horizontal (horizontal) and vertical (vertical). The default value is horizontal.

\n", + "link": "split/split-mode", + "component": "Split Panel", + "findIntroStr": "This command is used to divide an area into two parts whose width or height can be adjusted by dragging.", + "demoId": "split-mode" + }, + { + "title": "Drag not allowed", + "content": "For details, see the following example.", + "link": "split/basic-usage1", + "component": "Split Panel", + "findIntroStr": "This command is used to divide an area into two parts whose width or height can be adjusted by dragging.", + "demoId": "basic-usage1" + }, + { + "title": "movestart event", + "content": "

Start moving event

\n", + "link": "split/movestart-event", + "component": "Split Panel", + "findIntroStr": "This command is used to divide an area into two parts whose width or height can be adjusted by dragging.", + "demoId": "movestart-event" + }, + { + "title": "Moving Event", + "content": "

Moving Event

\n", + "link": "split/moving-event", + "component": "Split Panel", + "findIntroStr": "This command is used to divide an area into two parts whose width or height can be adjusted by dragging.", + "demoId": "moving-event" + }, + { + "title": "moveend event", + "content": "

Move completion event

\n", + "link": "split/moveend-event", + "component": "Split Panel", + "findIntroStr": "This command is used to divide an area into two parts whose width or height can be adjusted by dragging.", + "demoId": "moveend-event" + }, + { + "title": "Slots on the left and right panels", + "content": "For details, see the following example.", + "link": "split/left-right-slot", + "component": "Split Panel", + "findIntroStr": "This command is used to divide an area into two parts whose width or height can be adjusted by dragging.", + "demoId": "left-right-slot" + }, + { + "title": "Slots on the upper and lower panels", + "content": "For details, see the following example.", + "link": "split/top-bottom-slot", + "component": "Split Panel", + "findIntroStr": "This command is used to divide an area into two parts whose width or height can be adjusted by dragging.", + "demoId": "top-bottom-slot" + }, + { + "title": "Drag Slot", + "content": "For details, see the following example.", + "link": "split/trigger-slot", + "component": "Split Panel", + "findIntroStr": "This command is used to divide an area into two parts whose width or height can be adjusted by dragging.", + "demoId": "trigger-slot" + }, + { + "title": "Nested", + "content": "For details, see the following example.", + "link": "split/nested-use", + "component": "Split Panel", + "findIntroStr": "This command is used to divide an area into two parts whose width or height can be adjusted by dragging.", + "demoId": "nested-use" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/steps.json b/examples/docs/resources/pc/demo-config/en-US/steps.json new file mode 100644 index 000000000..ec88f09eb --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/steps.json @@ -0,0 +1,66 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "steps/data-resource", + "component": "Steps", + "findIntroStr": "Steps", + "demoId": "data-resource" + }, + { + "title": "Common Step Bar", + "content": "

Use the tiny-time-line tag and set type to normal to implement common steps.

\n", + "link": "steps/normal-steps", + "component": "Steps", + "findIntroStr": "Steps", + "demoId": "normal-steps" + }, + { + "title": "Advanced Wizard", + "content": "

Set type to advanced to enable the advanced wizard function.

\n", + "link": "steps/advanced-steps", + "component": "Steps", + "findIntroStr": "Steps", + "demoId": "advanced-steps" + }, + { + "title": "Timeline Step Bar", + "content": "

Use the tiny-time-line tag and set type to timeline to implement the timeline step bar. If the vertical attribute is configured, the timeline step bar changes to the vertical mode. If the reverse attribute is configured, the timeline step bar changes to the vertical mode.

\n", + "link": "steps/timeline-steps", + "component": "Steps", + "findIntroStr": "Steps", + "demoId": "timeline-steps" + }, + { + "title": "Customized Data Item", + "content": "

By default, the subobjects of bound data contain the name, count, and status fields. \nname-field: Set the field name corresponding to the name in the node information. The default value is'name'. \ncount-field: field name corresponding to the logo count in the advanced wizard. The default value is'count'. \nstatus-field: field name corresponding to the data status. The default value is status.

\n", + "link": "steps/custom-steps-item", + "component": "Steps", + "findIntroStr": "Steps", + "demoId": "custom-steps-item" + }, + { + "title": "Order Process", + "content": "

The Steps component is used to simulate the order process.

\n", + "link": "steps/order-progress", + "component": "Steps", + "findIntroStr": "Steps", + "demoId": "order-progress" + }, + { + "title": "Click Event", + "content": "

The click event is triggered when a node is clicked.

\n", + "link": "steps/click", + "component": "Steps", + "findIntroStr": "Steps", + "demoId": "click" + }, + { + "title": "Use of slots", + "content": "

Customize the content of the step bar node through the scope slot item.

\n", + "link": "steps/slot", + "component": "Steps", + "findIntroStr": "Steps", + "demoId": "slot" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/switch.json b/examples/docs/resources/pc/demo-config/en-US/switch.json new file mode 100644 index 000000000..a4dbfbc66 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/switch.json @@ -0,0 +1,42 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "switch/basic-usage", + "component": "Switch", + "findIntroStr": "Switch switches between the two states.", + "demoId": "basic-usage" + }, + { + "title": "Mini Size", + "content": "For details, see the following example.", + "link": "switch/mini-mode", + "component": "Switch", + "findIntroStr": "Sets whether to display the mini mode. The default value is false. When `mini` is set to `true`, no text prompt is displayed.", + "demoId": "mini-mode" + }, + { + "title": "Customized switch display", + "content": "Customize the switch display by opening and closing named slots. The prerequisite is that show-text is set to true", + "link": "switch/custom-open-close", + "component": "Switch", + "findIntroStr": "Customize the switch display through named slots open and close.", + "demoId": "custom-open-close" + }, + { + "title": "User-defined switch value", + "content": "The

false-value property represents the value that is paid to false-value when closed. \ntrue-value The attribute represents the value paid to true-value when enabled. If the attribute name defined in v-model is value, the value in true-value or false-value can be obtained.

\n", + "link": "switch/custom-true-false-value", + "component": "Switch", + "findIntroStr": "Use the true-value and false-value attributes to set different values for the switch in the ON and OFF states.", + "demoId": "custom-true-false-value" + }, + { + "title": "Disabled", + "content": "The

disable attribute indicates that the current state cannot be used. The default value is false (true/false).

\n", + "link": "switch/dynamic-disable", + "component": "Switch", + "findIntroStr": "Disable the switch through the disabled attribute.", + "demoId": "dynamic-disable" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/tabs.json b/examples/docs/resources/pc/demo-config/en-US/tabs.json new file mode 100644 index 000000000..fa49af3f4 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/tabs.json @@ -0,0 +1,146 @@ +[ + { + "title": "Basic Usage", + "content": "

uses v-model to set the initial activated tab page. The bound value corresponds to the value of the name attribute in the tiny-tab-item element. A tiny-tab-item is a tab. You can use the title attribute to set the tab title.

\n", + "link": "tabs/basic-usage", + "component": "Tabs tab", + "findIntroStr": "Separates data sets that are associated with content but belong to different categories.", + "demoId": "basic-usage" + }, + { + "title": "card type", + "content": "

Use tab-style to set the tab style type and active-name to set the initially activated tab.

\n", + "link": "tabs/tab-style-card", + "component": "Tabs tab", + "findIntroStr": "Separates data sets that are associated with content but belong to different categories.", + "demoId": "tab-style-card" + }, + { + "title": "bordercard type", + "content": "

Use tab-style to set the tab style type to bordercard.

\n", + "link": "tabs/tab-style-bordercard", + "component": "Tabs tab", + "findIntroStr": "Separates data sets that are associated with content but belong to different categories.", + "demoId": "tab-style-bordercard" + }, + { + "title": "The tab page can be added.", + "content": "

Set the with-add attribute to enable tags to add functions. In addition, the add event is used to customize the logic for adding tabs. After the show-more-tabs attribute is configured, the More button is displayed when the tab page exceeds a certain width.

\n", + "link": "tabs/with-add", + "component": "Tabs tab", + "findIntroStr": "Separates data sets that are associated with content but belong to different categories.", + "demoId": "with-add" + }, + { + "title": "The tab page can be closed.", + "content": "

The withClose attribute specifies whether the tab page can be closed. In addition, the close event can be used to customize the logic for closing the tab page.

\n", + "link": "tabs/tabs-events-close", + "component": "Tabs tab", + "findIntroStr": "Separates data sets that are associated with content but belong to different categories.", + "demoId": "tabs-events-close1" + }, + { + "title": "top display position", + "content": "

Set the display position of the tab page through the position attribute. The options are top, right, bottom, and left. The default value is top.

\n", + "link": "tabs/position", + "component": "Tabs tab", + "findIntroStr": "Separates data sets that are associated with content but belong to different categories.", + "demoId": "position" + }, + { + "title": "Display on the right", + "content": "For details, see the following example.", + "link": "tabs/position-right", + "component": "Tabs tab", + "findIntroStr": "Separates data sets that are associated with content but belong to different categories.", + "demoId": "position-right" + }, + { + "title": "Display below", + "content": "For details, see the following example.", + "link": "tabs/position-bottom", + "component": "Tabs tab", + "findIntroStr": "Separates data sets that are associated with content but belong to different categories.", + "demoId": "position-bottom" + }, + { + "title": "Display on the left", + "content": "For details, see the following example.", + "link": "tabs/position-left", + "component": "Tabs tab", + "findIntroStr": "Separates data sets that are associated with content but belong to different categories.", + "demoId": "position-left" + }, + { + "title": "Event Before Leaving", + "content": "The hook function before

before-leave switches the label. If false or Promise is returned and rejected, the switchover is blocked. If true is returned, the switchover is allowed.

\n", + "link": "tabs/before-leave", + "component": "Tabs tab", + "findIntroStr": "Separates data sets that are associated with content but belong to different categories.", + "demoId": "before-leave" + }, + { + "title": "Automatically open", + "content": "The

stretch property specifies whether the width of a label is self-expanded. The default value is false.

\n", + "link": "tabs/stretch-wh", + "component": "Tabs tab", + "findIntroStr": "Separates data sets that are associated with content but belong to different categories.", + "demoId": "stretch-wh" + }, + { + "title": "add event", + "content": "

The add event is triggered when the Add button is clicked to add a tab page

\n", + "link": "tabs/tabs-events-add", + "component": "Tabs tab", + "findIntroStr": "Separates data sets that are associated with content but belong to different categories.", + "demoId": "tabs-events-add" + }, + { + "title": "click event", + "content": "

The click event is triggered when a tab page is clicked

\n", + "link": "tabs/tabs-events-click", + "component": "Tabs tab", + "findIntroStr": "Separates data sets that are associated with content but belong to different categories.", + "demoId": "tabs-events-click" + }, + { + "title": "close event", + "content": "

The close event is triggered when a tab page is closed

\n", + "link": "tabs/tabs-events-close", + "component": "Tabs tab", + "findIntroStr": "Separates data sets that are associated with content but belong to different categories.", + "demoId": "tabs-events-close" + }, + { + "title": "edit Event", + "content": "

The edit event is triggered after you click Add to add a tab page or the tab page is closed

\n", + "link": "tabs/tabs-events-edit", + "component": "Tabs tab", + "findIntroStr": "Separates data sets that are associated with content but belong to different categories.", + "demoId": "tabs-events-edit" + }, + { + "title": "Custom Tab Title", + "content": "

Customize the title of the tab page through the title slot of the tiny-tab-item, for example, add an icon before the title.

\n", + "link": "tabs/custom-tab-title", + "component": "Tabs tab", + "findIntroStr": "Separates data sets that are associated with content but belong to different categories.", + "demoId": "custom-tab-title" + }, + { + "title": "Creating tab pages cyclically", + "content": "

Creates multiple tiny-tab-items based on the data loop through v-for.

\n", + "link": "tabs/tabdata-title", + "component": "Tabs tab", + "findIntroStr": "Separates data sets that are associated with content but belong to different categories.", + "demoId": "tabdata-title" + }, + { + "title": "Switching a tab page to a grid", + "content": "Using the Grid component in the
\n

Tabs component requires the Grid to set the :auto-resize="true" property so that the Grid can adapt to changes in the parent element.

\n
\n", + "link": "tabs/show-different-grid-data", + "component": "Tabs tab", + "findIntroStr": "Separates data sets that are associated with content but belong to different categories.", + "demoId": "show-different-grid-data" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/tag.json b/examples/docs/resources/pc/demo-config/en-US/tag.json new file mode 100644 index 000000000..864420dc5 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/tag.json @@ -0,0 +1,74 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "tag/basic-usage", + "component": "Tag", + "findIntroStr": "Tag tag component, used to mark transaction attributes and dimensions", + "demoId": "basic-usage" + }, + { + "title": "Color", + "content": "

You can use color to set the background color of a label.

\n", + "link": "tag/color3", + "component": "Tag", + "findIntroStr": "Tag tag component, used to mark transaction attributes and dimensions", + "demoId": "color3" + }, + { + "title": "Border", + "content": "

You can use hit to set the label border. The options are true and false. The default value is false.

\n", + "link": "tag/hit", + "component": "Tag", + "findIntroStr": "Tag tag component, used to mark transaction attributes and dimensions", + "demoId": "hit" + }, + { + "title": "Dimension", + "content": "

You can use size to set the tag size. The value can be medium, small, or mini.

\n", + "link": "tag/tag-size", + "component": "Tag", + "findIntroStr": "Tag tag component, used to mark transaction attributes and dimensions", + "demoId": "tag-size" + }, + { + "title": "Subject", + "content": "

You can use effect to set the tag theme. The value can be dark, light, or plain. \ntypeYou can set the corresponding type for the tag. The options are success, info, warning, and danger.

\n", + "link": "tag/effect", + "component": "Tag", + "findIntroStr": "Tag tag component, used to mark transaction attributes and dimensions", + "demoId": "effect" + }, + { + "title": "Dynamic Edit Tag", + "content": "

Click + New Tag and enter the tag name in the text box to create the last tag in the tag list. The closable attribute can be set to removeable tags for tags.

\n", + "link": "tag/create", + "component": "Tag", + "findIntroStr": "Tag tag component, used to mark transaction attributes and dimensions", + "demoId": "create" + }, + { + "title": "Removable Label", + "content": "For details, see the following example.", + "link": "tag/closeable", + "component": "Tag", + "findIntroStr": "Tag tag component, used to mark transaction attributes and dimensions", + "demoId": "closeable" + }, + { + "title": "Click Event", + "content": "For details, see the following example.", + "link": "tag/tag-event-click", + "component": "Tag", + "findIntroStr": "Tag tag component, used to mark transaction attributes and dimensions", + "demoId": "tag-event-click" + }, + { + "title": "Close Event", + "content": "For details, see the following example.", + "link": "tag/tag-event-close", + "component": "Tag", + "findIntroStr": "Tag tag component, used to mark transaction attributes and dimensions", + "demoId": "tag-event-close" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/textpopup.json b/examples/docs/resources/pc/demo-config/en-US/textpopup.json new file mode 100644 index 000000000..76f5427cd --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/textpopup.json @@ -0,0 +1,58 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "text-popup/basic-usage", + "component": "TextPopup text box", + "findIntroStr": "TextPopup text box, which provides the data binding function.", + "demoId": "basic-usage" + }, + { + "title": "Prompt Placeholder Text", + "content": "The value of the

placeholder attribute is string. This attribute displays the value in the text box by default.

\n", + "link": "text-popup/placeholder", + "component": "TextPopup text box", + "findIntroStr": "TextPopup text box, which provides the data binding function.", + "demoId": "placeholder" + }, + { + "title": "Read-only", + "content": "

You can use readonly to set whether to read only.

\n", + "link": "text-popup/readonly", + "component": "TextPopup text box", + "findIntroStr": "TextPopup text box, which provides the data binding function.", + "demoId": "readonly" + }, + { + "title": "Separator", + "content": "

You can use separtor to set the separator. Enter the position of the separator in the text box and press Enter.

\n", + "link": "text-popup/separtor", + "component": "TextPopup text box", + "findIntroStr": "TextPopup text box, which provides the data binding function.", + "demoId": "separtor" + }, + { + "title": "Bound Value", + "content": "

You can set the binding value using value or v-model.

\n", + "link": "text-popup/value", + "component": "TextPopup text box", + "findIntroStr": "TextPopup text box, which provides the data binding function.", + "demoId": "value" + }, + { + "title": "Clear value", + "content": "For details, see the following example.", + "link": "text-popup/clear-value", + "component": "TextPopup text box", + "findIntroStr": "TextPopup text box, which provides the data binding function.", + "demoId": "clear-value" + }, + { + "title": "Width", + "content": "

You can set the width through width.

\n", + "link": "text-popup/width", + "component": "TextPopup text box", + "findIntroStr": "TextPopup text box, which provides the data binding function.", + "demoId": "width" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/time-line.json b/examples/docs/resources/pc/demo-config/en-US/time-line.json new file mode 100644 index 000000000..04631cad6 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/time-line.json @@ -0,0 +1,98 @@ +[ + { + "title": "Basic Usage", + "content": "

Use the data attribute to set the timeline step bar data, and use the active attribute to set the selected step of the step bar.

\n", + "link": "time-line/basic-usage", + "component": "TimeLine", + "findIntroStr": "TimeLine", + "demoId": "basic-usage" + }, + { + "title": "horizontal timeline", + "content": "

Set the horizontal timeline through the horizontal attribute.

\n", + "link": "time-line/horizontal-step", + "component": "TimeLine", + "findIntroStr": "TimeLine", + "demoId": "horizontal-step" + }, + { + "title": "Vertical Timeline", + "content": "

Use the vertical attribute to set the vertical timeline.

\n", + "link": "time-line/vertical-step", + "component": "TimeLine", + "findIntroStr": "TimeLine", + "demoId": "vertical-step" + }, + { + "title": "Direction of the vertical timeline", + "content": "

Sets the direction of the vertical step bar through the reverse attribute.

\n", + "link": "time-line/vertical-step-reverse", + "component": "TimeLine", + "findIntroStr": "TimeLine", + "demoId": "vertical-step-reverse" + }, + { + "title": "Width Setting", + "content": "

Use the space attribute to set the width of the step bar.

\n", + "link": "time-line/set-step-width", + "component": "TimeLine", + "findIntroStr": "TimeLine", + "demoId": "set-step-width" + }, + { + "title": "Data Mapping", + "content": "

The name-field attribute is used to set the field name corresponding to the node name in the node information, and the time-field attribute is used to set the field name corresponding to the node time information.

\n", + "link": "time-line/different-data", + "component": "TimeLine", + "findIntroStr": "TimeLine", + "demoId": "different-data" + }, + { + "title": "Set the start value of the sequence number", + "content": "

Set the start step sequence number through the start attribute.

\n", + "link": "time-line/set-start-value", + "component": "TimeLine", + "findIntroStr": "TimeLine", + "demoId": "set-start-value" + }, + { + "title": "Display the internal status of a component.", + "content": "

The show-status attribute is used to set whether to display the internal status of a component. The default value is false, indicating that the parameter is not displayed.

\n", + "link": "time-line/show-status", + "component": "TimeLine", + "findIntroStr": "TimeLine", + "demoId": "show-status" + }, + { + "title": "Unfinished Sequence Number Display", + "content": "

The show-number attribute is used to set whether to display sequence numbers for uncompleted states.

\n", + "link": "time-line/show-number", + "component": "TimeLine", + "findIntroStr": "TimeLine", + "demoId": "show-number" + }, + { + "title": "Customizing a Horizontal Timeline", + "content": "If

slot is top, you can customize the top content of the step bar. If

slot is slot, you can customize the bottom content of the step bar.

\n", + "link": "time-line/custom-normal-step", + "component": "TimeLine", + "findIntroStr": "TimeLine", + "demoId": "custom-normal-step" + }, + { + "title": "Customized Vertical Timeline", + "content": "If

slot is set to left, you can customize the content on the left of the step bar. If

slot is set to right, you can customize the content on the right of the step bar.

\n", + "link": "time-line/custom-vertical-step", + "component": "TimeLine", + "findIntroStr": "TimeLine", + "demoId": "custom-vertical-step" + }, + { + "title": "click event", + "content": "

The click event is triggered upon a click

\n", + "link": "time-line/vertical-step-reverse", + "component": "TimeLine", + "findIntroStr": "TimeLine", + "demoId": "vertical-step-reverse1" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/time-picker.json b/examples/docs/resources/pc/demo-config/en-US/time-picker.json new file mode 100644 index 000000000..f24d35d6d --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/time-picker.json @@ -0,0 +1,146 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "time-picker/basic-usage", + "component": "TimePicker Time Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "basic-usage" + }, + { + "title": "Selection Range", + "content": "

picker-options Set the time range

\n", + "link": "time-picker/basic-usage", + "component": "TimePicker Time Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "basic-usage1" + }, + { + "title": "Arrow Selection", + "content": "The

arrow-control property specifies whether to use the arrow to select the time. This property is valid only for <tiny-time-picker> .

\n", + "link": "date-picker/clearable", + "component": "TimePicker Time Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "clearable1" + }, + { + "title": "Clear Input", + "content": "

Clear the icon by clear-icon

\n", + "link": "time-picker/clear-icon", + "component": "TimePicker Time Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "clear-icon" + }, + { + "title": "Size setting medium", + "content": "

Customize the group price size by size

\n", + "link": "time-picker/size-medium", + "component": "TimePicker Time Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "size-medium" + }, + { + "title": "Size setting small", + "content": "

Customize the group price size by size

\n", + "link": "time-picker/size-small", + "component": "TimePicker Time Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "size-small" + }, + { + "title": "Size setting mini", + "content": "

Customize the group price size by size

\n", + "link": "time-picker/size-mini", + "component": "TimePicker Time Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "size-mini" + }, + { + "title": "Clear button", + "content": "

Use the clearable attribute to set whether to display the Clear button. The default value is true

\n", + "link": "time-picker/clearable", + "component": "TimePicker Time Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "clearable" + }, + { + "title": "Customized rear icon", + "content": "

uses the suffix-icon attribute to set the icon behind the date text box. An icon is imported from the @opentiny/vue-icon, initialized, and transferred to the suffix-icon.

\n", + "link": "time-picker/suffix-icon", + "component": "TimePicker Time Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "suffix-icon" + }, + { + "title": "Time Format", + "content": "The

format time format is displayed. \ntimestampJS timestamp is available only in value-format. The component binding value is of the number type

\n", + "link": "time-picker/format", + "component": "TimePicker Time Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "format" + }, + { + "title": "Time display type", + "content": "

You can set the 12-hour format through the hh attribute. The HH attribute is in the 24-hour format and must be used with A or a. The h and H attributes are not set to 0. \nYou can use the mm attribute to set the minute display format, for example, 01. The m attribute is not set to 0. \nYou can use the ss attribute to set the display format of seconds, for example, 01. The s attribute is not set to 0. \nThe a property can be used to set the display time to am/pm A property can be used to set the display time to AM/PM.

\n", + "link": "time-picker/time-low", + "component": "TimePicker Time Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "time-low" + }, + { + "title": "Date Display Format", + "content": "The

WW attribute is set to week, for example, 01. The W attribute is set to zeros. \nyyyy The attribute sets the year, for example, 2020. \nMM: month. For example, 01 M: 0 is not added. \ndd attribute setting date, for example, 01 d.

\n", + "link": "time-picker/date", + "component": "TimePicker Time Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "date" + }, + { + "title": "Range Selection", + "content": "

is-range: indicates whether to select a range. The default value is false. range-separator. Set the range-separator (optional) to '-' by default.

\n", + "link": "time-picker/is-range", + "component": "TimePicker Time Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "is-range" + }, + { + "title": "Default time setting when the selector is enabled", + "content": "

Use default-value to set the selector to open the default display time

\n", + "link": "time-picker/default-value", + "component": "TimePicker Time Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "default-value" + }, + { + "title": "Native Attribute", + "content": "

Set the default name through the name attribute

\n", + "link": "time-picker/name", + "component": "TimePicker Time Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "name" + }, + { + "title": "Class name of the drop-down list box", + "content": "

Set the class name of the drop-down list box through the popper-class attribute

\n", + "link": "time-picker/popper-class", + "component": "TimePicker Time Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "popper-class" + }, + { + "title": "The text box cannot be entered.", + "content": "By default, you can enter a date in the

Date text box. If you set editable to false, you cannot enter a date in the

Date text box.

\n", + "link": "time-picker/editable", + "component": "TimePicker Time Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "editable" + }, + { + "title": "Event", + "content": "

When focusing or out of focus, the focus and bulr events are triggered. When the selected value is determined, the change event is triggered.

\n", + "link": "time-picker/event-blur", + "component": "TimePicker Time Selector", + "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.", + "demoId": "event-blur" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/time-select.json b/examples/docs/resources/pc/demo-config/en-US/time-select.json new file mode 100644 index 000000000..9caf1c711 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/time-select.json @@ -0,0 +1,130 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "time-select/basic-usage", + "component": "TimeSelect Time Selector", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "basic-usage" + }, + { + "title": "Fixed Time Range", + "content": "For details, see the following example.", + "link": "time-select/range-placeholder", + "component": "TimeSelect Time Selector", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "range-placeholder" + }, + { + "title": "Default time setting when the selector is enabled", + "content": "

Use default-value to set the selector to open the default display time

\n", + "link": "time-select/default-value", + "component": "TimeSelect Time Selector", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "default-value" + }, + { + "title": "Specified time point", + "content": "

picker-options Set Time

\n", + "link": "time-select/picker-options", + "component": "TimeSelect Time Selector", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "picker-options" + }, + { + "title": "Rear icon", + "content": "

uses the suffix-icon attribute to set the icon behind the date text box. An icon is imported from the @opentiny/vue-icon, initialized, and transferred to the suffix-icon.

\n", + "link": "time-select/suffix-icon", + "component": "TimeSelect Time Selector", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "suffix-icon" + }, + { + "title": "Customized Clear Icon", + "content": "

Clear the icon by clear-icon

\n", + "link": "time-select/clear-icon", + "component": "TimeSelect Time Selector", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "clear-icon" + }, + { + "title": "Display the Clear button", + "content": "For details, see the following example.", + "link": "time-select/clear-icon", + "component": "TimeSelect Time Selector", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "clearable" + }, + { + "title": "Native Attribute", + "content": "For details, see the following example.", + "link": "time-select/clear-icon", + "component": "TimeSelect Time Selector", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "name" + }, + { + "title": "Event", + "content": "Triggered when the

focus input frame is focused and when the input frame is out of focus

\n", + "link": "time-select/event-blur", + "component": "TimeSelect Time Selector", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "event-blur" + }, + { + "title": "The text box cannot be edited.", + "content": "By default, you can enter a date in the

Date text box. If you set editable to false, you cannot enter a date in the

Date text box.

\n", + "link": "time-select/editable", + "component": "TimeSelect Time Selector", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "editable" + }, + { + "title": "Disabled", + "content": "For details, see the following example.", + "link": "time-select/disabled", + "component": "TimeSelect Time Selector", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "disabled" + }, + { + "title": "Customized class name", + "content": "For details, see the following example.", + "link": "time-select/popper-class", + "component": "TimeSelect Time Selector", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "popper-class" + }, + { + "title": "mini size", + "content": "For details, see the following example.", + "link": "time-select/size-mini", + "component": "TimeSelect Time Selector", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "size-mini" + }, + { + "title": "small size", + "content": "For details, see the following example.", + "link": "time-select/size-small", + "component": "TimeSelect Time Selector", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "size-small" + }, + { + "title": "medium Size", + "content": "For details, see the following example.", + "link": "time-select/size-medium", + "component": "TimeSelect Time Selector", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "size-medium" + }, + { + "title": "Manually obtaining the focus", + "content": "For details, see the following example.", + "link": "time-select/focus", + "component": "TimeSelect Time Selector", + "findIntroStr": "The time selection box is a special case of the drop-down list box. The drop-down list box is displayed in the time division format (customized format is not supported). Some parameters in the drop-down list box can be extended.", + "demoId": "focus" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/toggle-menu.json b/examples/docs/resources/pc/demo-config/en-US/toggle-menu.json new file mode 100644 index 000000000..d4c03a520 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/toggle-menu.json @@ -0,0 +1,122 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "toggle-menu/basic-usage", + "component": "ToggleMenu collapse menu", + "findIntroStr": "A component that is displayed in a tree structure and applicable to version customization. The menu can be collapsed. After the menu is collapsed, only icons are displayed. You can click icons to display sub-node menus.", + "demoId": "basic-usage" + }, + { + "title": "Icon on the left of the customized menu", + "content": "

You can customize the icon on the left of the menu through the icon attribute.

\n", + "link": "toggle-menu/custom-icon", + "component": "ToggleMenu collapse menu", + "findIntroStr": "A component that is displayed in a tree structure and applicable to version customization. The menu can be collapsed. After the menu is collapsed, only icons are displayed. You can click icons to display sub-node menus.", + "demoId": "custom-icon" + }, + { + "title": "Customized menu data service", + "content": "

You can customize the menu data service through get-menu-data-sync .

\n", + "link": "toggle-menu/get-menu-data-sync", + "component": "ToggleMenu collapse menu", + "findIntroStr": "A component that is displayed in a tree structure and applicable to version customization. The menu can be collapsed. After the menu is collapsed, only icons are displayed. You can click icons to display sub-node menus.", + "demoId": "get-menu-data-sync" + }, + { + "title": "props option mapping", + "content": "

You can use props to configure the mapping field. The default value of this attribute is {children:'children', label:'label', disabled:'disabled'}.

\n", + "link": "toggle-menu/toggle-props", + "component": "ToggleMenu collapse menu", + "findIntroStr": "A component that is displayed in a tree structure and applicable to version customization. The menu can be collapsed. After the menu is collapsed, only icons are displayed. You can click icons to display sub-node menus.", + "demoId": "toggle-props" + }, + { + "title": "Custom Node Content", + "content": "

Customize the node content through the node slot.

\n", + "link": "toggle-menu/slot-node", + "component": "ToggleMenu collapse menu", + "findIntroStr": "A component that is displayed in a tree structure and applicable to version customization. The menu can be collapsed. After the menu is collapsed, only icons are displayed. You can click icons to display sub-node menus.", + "demoId": "slot-node" + }, + { + "title": "All nodes are expanded by default.", + "content": "

You can use the default-expand-all attribute to set whether to expand all nodes by default, and use the expand-on-click-node attribute to set whether to expand or collapse menus by clicking a node.

\n", + "link": "toggle-menu/default-expand-all", + "component": "ToggleMenu collapse menu", + "findIntroStr": "A component that is displayed in a tree structure and applicable to version customization. The menu can be collapsed. After the menu is collapsed, only icons are displayed. You can click icons to display sub-node menus.", + "demoId": "default-expand-all" + }, + { + "title": "Drag Node", + "content": "

You can use the draggable attribute to set whether to enable the node drag function. The default value is false. \nYou can use the ellipsis property to set whether to enable the function of omitting the overlong text content. The default value is false

\n", + "link": "toggle-menu/draggable", + "component": "ToggleMenu collapse menu", + "findIntroStr": "A component that is displayed in a tree structure and applicable to version customization. The menu can be collapsed. After the menu is collapsed, only icons are displayed. You can click icons to display sub-node menus.", + "demoId": "draggable" + }, + { + "title": "Display the filter search box.", + "content": "

You can set the show-filter attribute to determine whether to display the filter search box. The default value is true. You can set it to false not to display the filter search box.

\n", + "link": "toggle-menu/show-filter", + "component": "ToggleMenu collapse menu", + "findIntroStr": "A component that is displayed in a tree structure and applicable to version customization. The menu can be collapsed. After the menu is collapsed, only icons are displayed. You can click icons to display sub-node menus.", + "demoId": "show-filter" + }, + { + "title": "Auto Filter", + "content": "

You can set the placeholder of the text box through the placeholder attribute. Use automatic-filtering to set whether to automatically filter input data. The default value is true.

\n", + "link": "toggle-menu/automatic-filtering", + "component": "ToggleMenu collapse menu", + "findIntroStr": "A component that is displayed in a tree structure and applicable to version customization. The menu can be collapsed. After the menu is collapsed, only icons are displayed. You can click icons to display sub-node menus.", + "demoId": "automatic-filtering" + }, + { + "title": "The content exceeds the line feed.", + "content": "For details, see the following example.", + "link": "toggle-menu/show-filter", + "component": "ToggleMenu collapse menu", + "findIntroStr": "A component that is displayed in a tree structure and applicable to version customization. The menu can be collapsed. After the menu is collapsed, only icons are displayed. You can click icons to display sub-node menus.", + "demoId": "show-filter1" + }, + { + "title": "Node Click Event", + "content": "

node-click Event triggered after a node is clicked.

\n", + "link": "toggle-menu/node-click", + "component": "ToggleMenu collapse menu", + "findIntroStr": "A component that is displayed in a tree structure and applicable to version customization. The menu can be collapsed. After the menu is collapsed, only icons are displayed. You can click icons to display sub-node menus.", + "demoId": "node-click" + }, + { + "title": "Expand Node Event", + "content": "Event triggered after the

node-expand expands a node.

\n", + "link": "toggle-menu/node-expand", + "component": "ToggleMenu collapse menu", + "findIntroStr": "A component that is displayed in a tree structure and applicable to version customization. The menu can be collapsed. After the menu is collapsed, only icons are displayed. You can click icons to display sub-node menus.", + "demoId": "node-expand" + }, + { + "title": "Shrunk Node Event", + "content": "Event triggered after a node is scaled in by the

node-collapse .

\n", + "link": "toggle-menu/node-collapse", + "component": "ToggleMenu collapse menu", + "findIntroStr": "A component that is displayed in a tree structure and applicable to version customization. The menu can be collapsed. After the menu is collapsed, only icons are displayed. You can click icons to display sub-node menus.", + "demoId": "node-collapse" + }, + { + "title": "Drag Node Event", + "content": "

node-drop: This event is triggered after a node is dragged and dropped. You need to set draggable to true.

\n", + "link": "toggle-menu/node-drop", + "component": "ToggleMenu collapse menu", + "findIntroStr": "A component that is displayed in a tree structure and applicable to version customization. The menu can be collapsed. After the menu is collapsed, only icons are displayed. You can click icons to display sub-node menus.", + "demoId": "node-drop" + }, + { + "title": "Drag Event", + "content": "

node-drag-start: This event is triggered after a node is dragged. node-drag-enter is triggered when a node is dragged to another node. node-drag-over is triggered when a node is dragged. node-drag-leave: This event is triggered when a node is dragged out. node-drag-end: This event is triggered when a node is dragged out.

\n", + "link": "toggle-menu/drag-events", + "component": "ToggleMenu collapse menu", + "findIntroStr": "A component that is displayed in a tree structure and applicable to version customization. The menu can be collapsed. After the menu is collapsed, only icons are displayed. You can click icons to display sub-node menus.", + "demoId": "drag-events" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/tooltip.json b/examples/docs/resources/pc/demo-config/en-US/tooltip.json new file mode 100644 index 000000000..ca9eb0c9b --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/tooltip.json @@ -0,0 +1,114 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "tooltip/basic-usage", + "component": "ToolTip text prompt", + "findIntroStr": "Dynamic display of prompt information, which is generally responded through mouse events.", + "demoId": "basic-usage" + }, + { + "title": "Customized Gradient Animation", + "content": "

Defines the gradient animation through transition. The default value is tiny-fade-in-linear

\n", + "link": "tooltip/custom-transition", + "component": "ToolTip text prompt", + "findIntroStr": "Dynamic display of prompt information, which is generally responded through mouse events.", + "demoId": "custom-transition" + }, + { + "title": "Disabled", + "content": "

Disabled

\n", + "link": "tooltip/dynamic-disable", + "component": "ToolTip text prompt", + "findIntroStr": "Dynamic display of prompt information, which is generally responded through mouse events.", + "demoId": "dynamic-disable" + }, + { + "title": "Manual Control", + "content": "

Manual control mode. After the manual attribute is set to true, the mouseenter and mouseleave events do not take effect. You can then dynamically display and hide

\n by setting v-model", + "link": "tooltip/manual-control-tip", + "component": "ToolTip text prompt", + "findIntroStr": "Dynamic display of prompt information, which is generally responded through mouse events.", + "demoId": "manual-control-tip" + }, + { + "title": "Intelligent Appearance Control", + "content": "

Smart display mode of the prompt. When this parameter is set to auto, the tooltip is displayed only when the text is too long.

\n", + "link": "tooltip/visible-show", + "component": "ToolTip text prompt", + "findIntroStr": "Dynamic display of prompt information, which is generally responded through mouse events.", + "demoId": "visible-show" + }, + { + "title": "Subject", + "content": "

Use the effect attribute to set the theme. The options are dark and light.

\n", + "link": "tooltip/tooltip-theme", + "component": "ToolTip text prompt", + "findIntroStr": "Dynamic display of prompt information, which is generally responded through mouse events.", + "demoId": "tooltip-theme" + }, + { + "title": "Auto hide and delay time", + "content": "

Use the hide-after attribute to set the automatic hiding delay after the Tooltip component appears, in milliseconds. If the value is 0, the Tooltip component is not automatically hidden. The open-delay attribute is used to set the delay for the Tooltip component to appear, in milliseconds.

\n", + "link": "tooltip/open-delay", + "component": "ToolTip text prompt", + "findIntroStr": "Dynamic display of prompt information, which is generally responded through mouse events.", + "demoId": "open-delay" + }, + { + "title": "Offset", + "content": "

Use the offset attribute to set the offset of the position where the Tooltip component appears.

\n", + "link": "tooltip/tooltip-offset", + "component": "ToolTip text prompt", + "findIntroStr": "Dynamic display of prompt information, which is generally responded through mouse events.", + "demoId": "tooltip-offset" + }, + { + "title": "Whether the mouse can be accessed", + "content": "

The enterable attribute is used to set whether the mouse can access the tooltip.

\n", + "link": "tooltip/enterable", + "component": "ToolTip text prompt", + "findIntroStr": "Dynamic display of prompt information, which is generally responded through mouse events.", + "demoId": "enterable" + }, + { + "title": "Display arrow", + "content": "

The visible-arrow attribute is used to set whether to display the Tooltip arrow.

\n", + "link": "tooltip/visible-arrow", + "component": "ToolTip text prompt", + "findIntroStr": "Dynamic display of prompt information, which is generally responded through mouse events.", + "demoId": "visible-arrow" + }, + { + "title": "Add Style Class Name", + "content": "

Add the class name for the popper of the Tooltip using the popper-class attribute.

\n", + "link": "tooltip/popper-class", + "component": "ToolTip text prompt", + "findIntroStr": "Dynamic display of prompt information, which is generally responded through mouse events.", + "demoId": "popper-class" + }, + { + "title": "Slot", + "content": "

Add custom content through the content slot.

\n", + "link": "tooltip/tooltip-content", + "component": "ToolTip text prompt", + "findIntroStr": "Dynamic display of prompt information, which is generally responded through mouse events.", + "demoId": "tooltip-content" + }, + { + "title": "popper configuration", + "content": "

uses the popper-options attribute to configure the popper parameter of the Tooltip. For details, see popper.js

\n", + "link": "tooltip/popper-options", + "component": "ToolTip text prompt", + "findIntroStr": "Dynamic display of prompt information, which is generally responded through mouse events.", + "demoId": "popper-options" + }, + { + "title": "tabindex configuration", + "content": "

By configuring tabindex, the configured attributes are automatically added to the trigger source of the component.

\n", + "link": "tooltip/tabindex", + "component": "ToolTip text prompt", + "findIntroStr": "Dynamic display of prompt information, which is generally responded through mouse events.", + "demoId": "tabindex" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/transfer.json b/examples/docs/resources/pc/demo-config/en-US/transfer.json new file mode 100644 index 000000000..de70a1a7d --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/transfer.json @@ -0,0 +1,162 @@ +[ + { + "title": "Basic Usage", + "content": "

The value attribute is used for bidirectional binding. The specified value is the default value and is displayed in the list on the right. \n\nThe data attribute provides the data source. It is an object array. The default fields in the object are key, label, and disabled.

\n", + "link": "transfer/basic-usage", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "basic-usage" + }, + { + "title": "Data Source", + "content": "

You can request the service to obtain data and assign the data to data.

\n", + "link": "transfer/data-source", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "data-source" + }, + { + "title": "Display All Move Buttons", + "content": "

You can set the show-all-btn attribute to display all mobile buttons.

\n", + "link": "transfer/show-all-btn", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "show-all-btn" + }, + { + "title": "Customized List Title", + "content": "

You can use the titles attribute to customize the titles of the left and right lists.

\n", + "link": "transfer/custom-transfer-titles", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "custom-transfer-titles" + }, + { + "title": "Custom Button Copywriting", + "content": "

The button-texts attribute is used to customize the left and right button text.

\n", + "link": "transfer/custom-button-texts", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "custom-button-texts" + }, + { + "title": "Search box placeholder", + "content": "

Customize the search box placeholder through the filter-placeholder attribute.

\n", + "link": "transfer/filter-placeholder", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "filter-placeholder" + }, + { + "title": "Custom Search Method", + "content": "

Provides the filter-method hook function to customize the search method.

\n", + "link": "transfer/custom-filter-method", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "custom-filter-method" + }, + { + "title": "Default options", + "content": "

Use the left-default-checked and right-default-checked attributes to specify the default selected data in the left and right lists.

\n", + "link": "transfer/default-checked", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "default-checked" + }, + { + "title": "Customized Data Item Rendering", + "content": "

Use render-content to customize data items

\n", + "link": "transfer/custom-render-content", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "custom-render-content" + }, + { + "title": "Selected status copywriting at the top of the list", + "content": "

After the format attribute is specified, the ratio of the selected data to all data is displayed on the top of the left and right lists when data is selected.

\n", + "link": "transfer/checked-format-text", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "checked-format-text" + }, + { + "title": "Searchable", + "content": "

The filterable attribute is used to enable the search function for the left and right lists.

\n", + "link": "transfer/filterable", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "filterable" + }, + { + "title": "Field alias of the data source", + "content": "

When a field in a data object is inconsistent with the default value, the props attribute can be used for mapping.

\n", + "link": "transfer/props-of-data-source", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "props-of-data-source" + }, + { + "title": "Right Sorting Policy", + "content": "

Use the target-order attribute to set the sorting policy of the elements in the list on the right. The options are original, push, and unshift. The default value is original.

\n

Sorting Policy

\n

If the value is original, the sequence of the data source is the same as that of the data source.\nIf the value is push, the newly added elements are ranked last.\nIf the value is unshift, the newly added elements are ranked first

\n
\n", + "link": "transfer/target-order", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "target-order" + }, + { + "title": "Drag left and right", + "content": "Before using the drag-and-drop function for the

, install the sortablejs plug-in. The

\n
\n

uses the drop-config attribute to configure the sortablejs plug-in.

\n", + "link": "transfer/drop-config", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "drop-config" + }, + { + "title": "Shuttle Box Event", + "content": "

There are three events: change, left-check-change, and right-check-change.

\n

Event Description

\n

change: Triggered when an element in the list on the right changes.\nleft-check-change: Triggered when an element in the list on the left is selected or deselected.\nright-check-change: Triggered when an element in the list on the right is selected or deselected", + "link": "transfer/transfer-events", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "transfer-events" + }, + { + "title": "Clear the search box manually", + "content": "

Invoke the clearQuery() method to clear the search boxes in the left and right lists. The parameter is left or right.

\n", + "link": "transfer/manual-clear-query", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "manual-clear-query" + }, + { + "title": "Custom List Bottom", + "content": "

You can customize the bottom of the left and right lists through the left-footer and right-footer slots.

\n", + "link": "transfer/custom-footer", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "custom-footer" + }, + { + "title": "Panel Slot", + "content": "

You can use left-panel and right-panel to customize the contents of the left and right panels. Use button to customize the shuttle button

\n", + "link": "transfer/panel-slot", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "panel-slot" + }, + { + "title": "Nested Table", + "content": "

When plugin in the render attribute is set to Table, the shuttle box is rendered as a table. For details, see the configuration of the grid component.

\n", + "link": "transfer/nested-table", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "nested-table" + }, + { + "title": "Nested Tree", + "content": "

When plugin in the render attribute is set to Tree, the shuttle box is rendered as a tree. Configure tree-related configurations through the treeConfig attribute. (For details, see the configuration of the tree component.)

\n", + "link": "transfer/nested-tree", + "component": "Transfer shuttle box", + "findIntroStr": "Shuttle box, which provides bidirectional selection of table data.", + "demoId": "nested-tree" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/tree-menu.json b/examples/docs/resources/pc/demo-config/en-US/tree-menu.json new file mode 100644 index 000000000..6738c15a6 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/tree-menu.json @@ -0,0 +1,186 @@ +[ + { + "title": "Basic Usage", + "content": "

If no data is configured, data is read from the framework service by default.

\n", + "link": "tree-menu/basic-usage", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "basic-usage" + }, + { + "title": "Data Source", + "content": "

Set the data of the tree menu through data.

\n", + "link": "tree-menu/data-resource", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "data-resource" + }, + { + "title": "Custom Menu Service Data", + "content": "

Customize menu service data through get-menu-data-sync and directly return data.

\n", + "link": "tree-menu/get-menu-data-sync", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "get-menu-data-sync" + }, + { + "title": "Excessive Text Omission", + "content": "

You can use ellipsis to configure that the menu text is displayed as an ellipsis when it is too long. Use prefix-icon to customize the front icon.

\n", + "link": "tree-menu/text-ellipsis", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "text-ellipsis" + }, + { + "title": "Excessive text is displayed in a new line.", + "content": "

You can use wrap to configure that the menu text is displayed in a new line when the menu text is too long. The showTitle attribute is used to configure whether to display the title. The default value is true. \nYou can use show-filter to configure whether to display the search filter box. The default value is true. \nYou can use show-title to configure whether to display the title. The default value is true.

\n", + "link": "tree-menu/text-wrap", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "text-wrap" + }, + { + "title": "The parent and child levels are not associated.", + "content": "

The check-strictly is not associated with the parent and child levels. This parameter must be used together with show-checkbox.

\n", + "link": "tree-menu/check-strictly", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "check-strictly" + }, + { + "title": "A node is expanded by default.", + "content": "

Initially expand a node by setting default-expanded-keys .

\n", + "link": "tree-menu/default-expanded-keys", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "default-expanded-keys" + }, + { + "title": "Lazy loading subnode", + "content": "

You can use lazy to determine whether to lazy load subnodes. This method must be used together with the load method.

\n", + "link": "tree-menu/lazy-load", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "lazy-load" + }, + { + "title": "Search Rule Configuration", + "content": "

You can configure filter-node-method to configure the search rule. Fuzzy match is used by default. The following is an example of exact configuration.

\n", + "link": "tree-menu/filter-node-method", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "filter-node-method" + }, + { + "title": "All menus are displayed by default.", + "content": "

You can set the default-expand-all attribute to expand all menus by default. \n This parameter is selected by default through the default-checked-keys attribute. This parameter must be used together with show-checkbox, node-key .

\n", + "link": "tree-menu/default-expand-all", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "default-expand-all" + }, + { + "title": "Customized empty data text", + "content": "

You can use the empty-text attribute to configure the empty data display text.

\n", + "link": "tree-menu/empty-text", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "empty-text" + }, + { + "title": "Drag Menu", + "content": "

You can drag menus by setting the attribute draggable.

\n", + "link": "tree-menu/can-draggable", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "can-draggable" + }, + { + "title": "Drag menu callback event", + "content": "

Drag menu callback event, which is used together with draggable.

\n", + "link": "tree-menu/event-allow-draggable", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "event-allow-draggable" + }, + { + "title": "Event triggered when a node is expanded", + "content": "

Event triggered when a node is expanded

\n", + "link": "tree-menu/event-node-expand", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "event-node-expand" + }, + { + "title": "Event triggered when a node is shut down", + "content": "

Event triggered when a node is closed

\n", + "link": "tree-menu/event-node-collapse", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "event-node-collapse" + }, + { + "title": "Callback when the node selection status changes", + "content": "

Callback when the node selection status changes

\n", + "link": "tree-menu/event-check-change", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "event-check-change" + }, + { + "title": "Click the text to expand the menu.", + "content": "

You can click the text to expand the submenu through the expand-on-click-node attribute.

\n", + "link": "tree-menu/expand-on-click-node", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "expand-on-click-node" + }, + { + "title": "horizontal indent", + "content": "

You can use the indent attribute to control the horizontal indentation distance of a child relative to a parent menu. The unit is px.

\n", + "link": "tree-menu/tree-menu-indent", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "tree-menu-indent" + }, + { + "title": "Accordance", + "content": "

Set the accordion effect through accordion.

\n", + "link": "tree-menu/accordion", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "accordion" + }, + { + "title": "Node can be selected", + "content": "

The show-checkbox attribute can be configured to determine whether the node can be selected.

\n", + "link": "tree-menu/show-checkbox", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode, which is applicable to a component of version customization.", + "demoId": "show-checkbox" + }, + { + "title": "Custom search icon", + "content": "

The search-icon attribute can be configured to customize the search icon

\n", + "link": "tree-menu/search-icon", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "search-icon" + }, + { + "title": "Slot", + "content": "

You can configure the default scope slot to display the menu content.

\n", + "link": "tree-menu/tree-menu-slot", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "tree-menu-slot" + }, + { + "title": "Event", + "content": "

current-change Event triggered when the selected node changes.

\n", + "link": "tree-menu/event-current-change", + "component": "TreeMenu", + "findIntroStr": "The menu is displayed in tree mode and is applicable to a component of version customization.", + "demoId": "event-current-change" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/tree.json b/examples/docs/resources/pc/demo-config/en-US/tree.json new file mode 100644 index 000000000..5f3a12045 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/tree.json @@ -0,0 +1,266 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "tree/basic-usage", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "basic-usage" + }, + { + "title": "Data Source", + "content": "

You can configure the data attribute to set the data source. You can configure the static data source and dynamic data source.

\n", + "link": "tree/data-source", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "data-source" + }, + { + "title": "Disabled", + "content": "

The data source contains disabled: true, which is automatically disabled during rendering.

\n", + "link": "tree/disable-node", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "disable-node" + }, + { + "title": "Customized empty data text", + "content": "

Configure template #emptySet the user-defined empty data text.

\n", + "link": "tree/custom-empty-text", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "custom-empty-text" + }, + { + "title": "Render after expansion", + "content": "

Configure the render-after-expand attribute to set whether to render data after expansion. The default value is true.

\n", + "link": "tree/render-after-expand", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "render-after-expand" + }, + { + "title": "Unique ID", + "content": "

Use the node-key attribute to set the unique ID.

\n

You need to set the unique ID of a node for operations such as selecting, obtaining, adding, and deleting a node.

", + "link": "tree/node-key", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "node-key" + }, + { + "title": "The parent and child are not associated with each other.", + "content": "

The check-strictly attribute is used to set the parent and child levels to No.

\n", + "link": "tree/check-strictly", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "check-strictly" + }, + { + "title": "All nodes are expanded by default.", + "content": "

Use the default-expand-all property to set all nodes to be expanded by default.

\n", + "link": "tree/default-expand-all", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "default-expand-all" + }, + { + "title": "Click to expand and collapse a node.", + "content": "

You can set the expand-on-click-node attribute to expand or collapse a node when you click the node content.

\n", + "link": "tree/expand-on-click-node", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "expand-on-click-node" + }, + { + "title": "Selected when clicking a node", + "content": "

You can select or deselect data by setting the check-on-click-node attribute. \n The icon-trigger-click-node attribute is used to determine whether to trigger the node-click event when you click an icon. The default value is true.

\n", + "link": "tree/check-on-click-node", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "check-on-click-node" + }, + { + "title": "Automatically Expand Parent Node", + "content": "

Indicates whether to display the parent node based on the auto-expand-parent attribute. The default value is true.

\n", + "link": "tree/auto-expand-parent", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "auto-expand-parent" + }, + { + "title": "Nodes selected by default", + "content": "

The default-checked-keys attribute is used to set the selected data by default.

\n", + "link": "tree/default-checked-keys", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "default-checked-keys" + }, + { + "title": "The specified node is expanded by default.", + "content": "

Set the default expanded node through the default-expanded-keys attribute.

\n", + "link": "tree/default-expanded-keys", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "default-expanded-keys" + }, + { + "title": "Currently selected node flag", + "content": "

Use current-node-key to set the flag of the currently selected node. It must be used together with node-key="id".

\n", + "link": "tree/current-node-key", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "current-node-key" + }, + { + "title": "Default slot", + "content": "

You can customize the content of a tree node through the default slot. The parameter is {node, data}.

\n", + "link": "tree/slot-deffault", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "slot-deffault" + }, + { + "title": "Customized content area rendering", + "content": "

Sets the customized content through the render-content attribute.

\n", + "link": "tree/render-content", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "render-content" + }, + { + "title": "Whether to enable the multi-choice mode", + "content": "

The show-checkbox attribute is used to set whether a node can be selected. The default value is false.

\n", + "link": "tree/show-checkbox", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "show-checkbox" + }, + { + "title": "Dragable Node", + "content": "

The draggable attribute is used to set whether a node can be dragged.

\n", + "link": "tree/node-draggable", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "node-draggable" + }, + { + "title": "Whether a customized node can be dragged", + "content": "

The allow-drag hook function is used to determine whether a node can be dragged. If the return value is false, the node cannot be dragged.

\n", + "link": "tree/allow-drag", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "allow-drag" + }, + { + "title": "Whether the customized target node can be placed", + "content": "

The allow-drop attribute is used to determine whether the target node can be placed during dragging. The type parameter has three cases:'prev','inner', and'next', indicating that the parameter is placed before, inserted into, and placed after the target node, respectively.

\n", + "link": "tree/allow-drop", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "allow-drop" + }, + { + "title": "Data Node Attribute Configuration", + "content": "

Sets the data node attribute through the props attribute. The default value of this attribute is {children:'children', label:'label', disabled:'disabled'}.

\n", + "link": "tree/node-props-config", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "node-props-config" + }, + { + "title": "Lazy loading subnode", + "content": "

The lazy attribute is used to set whether to lazy load subnodes. It must be used together with the load method. The default value is false.

\n", + "link": "tree/lazy-load-node", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "lazy-load-node" + }, + { + "title": "Highlight the selected node", + "content": "

The highlight-current attribute is used to highlight the selected node.

\n", + "link": "tree/highlight-current", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "highlight-current" + }, + { + "title": "Filter Node", + "content": "

Set the node filtering method through the filter-node-method attribute.

\n", + "link": "tree/filter-node", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "filter-node" + }, + { + "title": "Accordion Mode", + "content": "

The accordion attribute is used to set whether to open only one tree node at the same level at a time (in accordion mode). The default value is false.

\n", + "link": "tree/accordion-mode", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "accordion-mode" + }, + { + "title": "horizontal indent", + "content": "

The indent attribute is used to control the horizontal indentation distance. The unit is px. The default value is 18px.

\n", + "link": "tree/indent", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "indent" + }, + { + "title": "Customize the expansion and collapse icon", + "content": "

Use the icon attribute to set the tree node expansion and collapse icon, import an icon from the @opentiny/vue-icon, initialize the icon, and transfer the icon to the icon attribute.

\n", + "link": "tree/custom-node-icon", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "custom-node-icon" + }, + { + "title": "Expand and collapse icons and set them separately", + "content": "

Use the expandIcon attribute to set the expanded icon, and use the shrinkIcon attribute to set the collapsed icon.

\n", + "link": "tree/set-tree-icon", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "set-tree-icon" + }, + { + "title": "You can customize the shortcut menu content.", + "content": "

The show-contextmenu attribute is used to set whether to enable the shortcut menu of the pop-up window. The closeMenu method of the instance can be invoked to close the customized menu.

\n", + "link": "tree/contextmenu", + "component": "Tree control", + "findIntroStr": "The customized menu is displayed after you right-click a node.", + "demoId": "contextmenu" + }, + { + "title": "Drag Node Event", + "content": "For details, see the following example.", + "link": "tree/drag-events", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "drag-events" + }, + { + "title": "Node Selection Event", + "content": "For details, see the following example.", + "link": "tree/node-events", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "node-events" + }, + { + "title": "Event of right-clicking a node", + "content": "For details, see the following example.", + "link": "tree/node-contextmenu", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "node-contextmenu" + }, + { + "title": "Single Choice", + "content": "

uses the show-radio attribute to set the single-choice feature of the tree node. The default value is false. This attribute and the show-checkbox attribute are mutually exclusive. Cannot be set to true at the same time.

\n", + "link": "tree/single-select-radio", + "component": "Tree control", + "findIntroStr": "Data with parent and child levels can be displayed. Functions such as selection and asynchronous loading are supported. However, it is not recommended to display menus. It is recommended to display menus using tree menus.", + "demoId": "single-select-radio" + } +] diff --git a/examples/docs/resources/pc/demo-config/en-US/user-account.json b/examples/docs/resources/pc/demo-config/en-US/user-account.json new file mode 100644 index 000000000..e4a87d0b1 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/user-account.json @@ -0,0 +1,26 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "user-account/basic-usage", + "component": "UserAccount User Account", + "findIntroStr": "User account component, which is used to display user accounts, log out, and customize functions.", + "demoId": "basic-usage" + }, + { + "title": "Custom Service", + "content": "

Setting a Custom Service

\n", + "link": "user-account/custom-service", + "component": "UserAccount User Account", + "findIntroStr": "User account component, which is used to display user accounts, log out, and customize functions.", + "demoId": "custom-service" + }, + { + "title": "Custom Function", + "content": "

Customize functions by default slot

\n", + "link": "user-account/custom-operation", + "component": "UserAccount User Account", + "findIntroStr": "User account component, which is used to display user accounts, log out, and customize functions.", + "demoId": "custom-operation" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/user-contact.json b/examples/docs/resources/pc/demo-config/en-US/user-contact.json new file mode 100644 index 000000000..7b7b8bd1a --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/user-contact.json @@ -0,0 +1,34 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "user-contact/basic-usage", + "component": "UserContact", + "findIntroStr": "UserContact component, which displays the user account and basic contact information, including the user description, avatar, and name. Any combination of the three elements.", + "demoId": "basic-usage" + }, + { + "title": "Set Data Source", + "content": "

You can use data to set the data source. imgUrl indicates the image path, and userName indicates the name. userDescription indicates the user description.

\n", + "link": "user-contact/data-source", + "component": "UserContact", + "findIntroStr": "UserContact component, which displays the user account and basic contact information, including the user description, avatar, and name. Any combination of the three elements.", + "demoId": "data-source" + }, + { + "title": "Customize the content that is not displayed in the dialog box.", + "content": "

Customize the content that is not displayed in the dialog box.\nshow-imgIndicates whether to display the avatar. The value true indicates that the avatar is displayed. The value false indicates that the avatar is hidden. The default value is true. \nshow-name Indicates whether to display the name. The value true indicates that the name is displayed, and the value false indicates that the name is hidden. The default value is true. \nshow-descriptionIndicates whether to display the user description. If the value is true, the user description is displayed. If the value is false, the user description is hidden. The default value is true.

\n", + "link": "user-contact/not-displayed-content", + "component": "UserContact", + "findIntroStr": "UserContact component, which displays the user account and basic contact information, including the user description, avatar, and name. Any combination of the three elements.", + "demoId": "not-displayed-content" + }, + { + "title": "Customize the default slot", + "content": "For details, see the following example.", + "link": "user-contact/slots-usercontact", + "component": "UserContact", + "findIntroStr": "UserContact component, which displays the user account and basic contact information, including the user description, avatar, and name. Any combination of the three elements.", + "demoId": "slots-usercontact" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/user-head.json b/examples/docs/resources/pc/demo-config/en-US/user-head.json new file mode 100644 index 000000000..a85ae0138 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/user-head.json @@ -0,0 +1,106 @@ +[ + { + "title": "Basic Usage", + "content": "For details, see the following example.", + "link": "user-head/basic-usage", + "component": "UserHead User avatar", + "findIntroStr": "UserHead user avatar component, which is used to represent users or things. Images, icons, and characters can be displayed.", + "demoId": "basic-usage" + }, + { + "title": "Avatar", + "content": "

You can use min to set a small avatar.

\n", + "link": "user-head/min-user-head", + "component": "UserHead User avatar", + "findIntroStr": "UserHead user avatar component, which is used to represent users or things. Images, icons, and characters can be displayed.", + "demoId": "min-user-head" + }, + { + "title": "Round Head", + "content": "

You can use round to set a round avatar.

\n", + "link": "user-head/round-user-head", + "component": "UserHead User avatar", + "findIntroStr": "UserHead user avatar component, which is used to represent users or things. Images, icons, and characters can be displayed.", + "demoId": "round-user-head" + }, + { + "title": "Avatar", + "content": "

You can use type="label" to set the text avatar.

\n", + "link": "user-head/label-user-head", + "component": "UserHead User avatar", + "findIntroStr": "UserHead user avatar component, which is used to represent users or things. Images, icons, and characters can be displayed.", + "demoId": "label-user-head" + }, + { + "title": "Icon avatar", + "content": "

You can use type="icon" to set the icon avatar.

\n", + "link": "user-head/icon-user-head", + "component": "UserHead User avatar", + "findIntroStr": "UserHead user avatar component, which is used to represent users or things. Images, icons, and characters can be displayed.", + "demoId": "icon-user-head" + }, + { + "title": "Avatar", + "content": "

You can use type="image" to set the picture avatar.

\n", + "link": "user-head/image-user-head", + "component": "UserHead User avatar", + "findIntroStr": "UserHead user avatar component, which is used to represent users or things. Images, icons, and characters can be displayed.", + "demoId": "image-user-head" + }, + { + "title": "Avatar Message Count", + "content": "For details, see the following example.", + "link": "user-head/message-count-total", + "component": "UserHead User avatar", + "findIntroStr": "UserHead user avatar component, which is used to represent users or things. Images, icons, and characters can be displayed.", + "demoId": "message-count-total" + }, + { + "title": "Use a red dot instead of a specific value.", + "content": "For details, see the following example.", + "link": "user-head/message-count-type", + "component": "UserHead User avatar", + "findIntroStr": "UserHead user avatar component, which is used to represent users or things. Images, icons, and characters can be displayed.", + "demoId": "message-count-type" + }, + { + "title": "Maximum number of messages", + "content": "For details, see the following example.", + "link": "user-head/message-count-limit", + "component": "UserHead User avatar", + "findIntroStr": "UserHead user avatar component, which is used to represent users or things. Images, icons, and characters can be displayed.", + "demoId": "message-count-limit" + }, + { + "title": "Custom Color", + "content": "

You can use color to customize the color. If the icon or text type is set to icon or label, set the font color and background color.

\n", + "link": "user-head/color", + "component": "UserHead User avatar", + "findIntroStr": "UserHead user avatar component, which is used to represent users or things. Images, icons, and characters can be displayed.", + "demoId": "color" + }, + { + "title": "Custom background color", + "content": "

You can use background-color to customize the background color.

\n", + "link": "user-head/custom-background-color", + "component": "UserHead User avatar", + "findIntroStr": "UserHead user avatar component, which is used to represent users or things. Images, icons, and characters can be displayed.", + "demoId": "custom-background-color" + }, + { + "title": "Custom Image Content", + "content": "

Customize the image content by slot.

\n", + "link": "user-head/custom-user-head-content", + "component": "UserHead User avatar", + "findIntroStr": "UserHead user avatar component, which is used to represent users or things. Images, icons, and characters can be displayed.", + "demoId": "custom-user-head-content" + }, + { + "title": "Avatar Displayed in Grid Cells", + "content": "For details, see the following example.", + "link": "user-head/render-user-head-in-grid", + "component": "UserHead User avatar", + "findIntroStr": "UserHead user avatar component, which is used to represent users or things. Images, icons, and characters can be displayed.", + "demoId": "render-user-head-in-grid" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/user-link.json b/examples/docs/resources/pc/demo-config/en-US/user-link.json new file mode 100644 index 000000000..b40477799 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/user-link.json @@ -0,0 +1,66 @@ +[ + { + "title": "Basic Usage", + "content": "

Note that the UserLink component requests mock data, which cannot be queried by other users. Use real services during development.

\n", + "link": "user-link/basic-usage", + "component": "UserLink", + "findIntroStr": "User information link component, which displays the special link of the user details dialog box.", + "demoId": "basic-usage" + }, + { + "title": "Display Field Mapping", + "content": "

Use text-field to set the displayed field information. The default value is userCN.\nNote that the UserLink component requests mock data, which cannot be queried by other users. Use the real service during development.

\n", + "link": "user-link/text-field", + "component": "UserLink", + "findIntroStr": "User information link component, which displays the special link of the user details dialog box.", + "demoId": "text-field" + }, + { + "title": "Custom Text Separator", + "content": "

Use text-split to customize the text separator. The default value is ','\nNote that the UserLink component requests mock data, which cannot be queried by other users. Use the real service during development.

\n", + "link": "user-link/text-split", + "component": "UserLink", + "findIntroStr": "User information link component, which displays the special link of the user details dialog box.", + "demoId": "text-split" + }, + { + "title": "Value Field Mapping", + "content": "

Use value-field to set the value field mapping. The default value is userId.\nNote that the UserLink component requests mock data, which cannot be queried by other users. Use the real service during development.

\n", + "link": "user-link/value-field", + "component": "UserLink", + "findIntroStr": "User information link component, which displays the special link of the user details dialog box.", + "demoId": "value-field" + }, + { + "title": "Customized value separator", + "content": "

Use value-split to define the value separator. The default value separator is ','.\nNote that the UserLink component requests mock data, which cannot be queried by other users. Use real services during development.

\n", + "link": "user-link/value-split", + "component": "UserLink", + "findIntroStr": "User information link component, which displays the special link of the user details dialog box.", + "demoId": "value-split" + }, + { + "title": "Custom Service", + "content": "

Note that the UserLink component requests mock data, which cannot be queried by other users. Use real services during development.

\n", + "link": "user-link/custom-service", + "component": "UserLink", + "findIntroStr": "User information link component, which displays the special link of the user details dialog box.", + "demoId": "custom-service" + }, + { + "title": "Basic Usage", + "content": "

Note that the UserLink component requests mock data, which cannot be queried by other users. Use real services during development.

\n", + "link": "user-link/cache-users", + "component": "UserLink", + "findIntroStr": "User information link component, which displays the special link of the user details dialog box.", + "demoId": "cache-users" + }, + { + "title": "Custom Default Value", + "content": "

Customize the default value by value. The default value is empty. Note that value and v-model cannot be used at the same time. When v-model is used at the same time, v-model has a higher weight.

\n", + "link": "user-link/value", + "component": "UserLink", + "findIntroStr": "User information link component, which displays the special link of the user details dialog box.", + "demoId": "value" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/user.json b/examples/docs/resources/pc/demo-config/en-US/user.json new file mode 100644 index 000000000..9b8a32073 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/user.json @@ -0,0 +1,154 @@ +[ + { + "title": "Basic Usage", + "content": "

Note that the User component requests mock data, which cannot be queried by other users. Use the real service during development.

\n", + "link": "user/basic-usage", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "basic-usage" + }, + { + "title": "Multi-User", + "content": "

Set the multiple property to enable the multi-user mode.

\n", + "link": "user/multiple-users", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "multiple-users" + }, + { + "title": "Collapse Tag", + "content": "

Set the multiple property to enable the multi-user mode. \n Use collapse-tags to configure whether to display collapsed tags in multi-user mode. The default value is false.

\n", + "link": "user/multiple-users-tag", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "multiple-users-tag" + }, + { + "title": "User selector options can be copied", + "content": "

You can select an option in the tag-selectable text box with the mouse, and then press Ctrl + C or right-click to copy it.

\n", + "link": "user/tag-copy", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "tag-copy" + }, + { + "title": "User selector options can be copied", + "content": "

After the copyable attribute is set, all tag text contents can be copied and separated by commas.

\n", + "link": "user/tag-copy-all", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "tag-copy-all" + }, + { + "title": "Disabled", + "content": "

Set the disabled property to disable the User component.

\n", + "link": "user/dynamic-disable", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "dynamic-disable" + }, + { + "title": "Exceeding prompt", + "content": "

Set collapse-show-overflow-tooltip This attribute takes effect only when cache is set to true.

\n", + "link": "user/collapse-show-overflow-tooltip", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "collapse-show-overflow-tooltip" + }, + { + "title": "Value Separator", + "content": "

You can use the value-split attribute to specify the separator between different users in the value obtained for multiple users. The default value is ,. \n You can use the text-split attribute to specify the text separator that matches the input in multi-user mode. The default value is ,, and the value can be !~%(=+^{/}).!]<->[\\,:*#; .

\n", + "link": "user/value-split", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "value-split" + }, + { + "title": "Value Field Mapping", + "content": "

The value-field attribute specifies the format of the obtained value. The default value is userId and userAccount are also included.

\n", + "link": "user/value-field", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "value-field" + }, + { + "title": "Display Field Mapping", + "content": "

You can use the text-field attribute to specify the field of the user to be displayed.

\n", + "link": "user/text-field", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "text-field" + }, + { + "title": "Cache User", + "content": "

The cache attribute specifies whether user data is cached. The default value is cached. The \n\ncache-key attribute can be used to customize the cache key value. The default value is tiny-user. The \n\ncache-fields property is used to specify which user data is cached.

\n", + "link": "user/cache-users", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "cache-users" + }, + { + "title": "Delayed loading", + "content": "

The delay attribute specifies the loading delay, in milliseconds.

\n", + "link": "user/delay-load", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "delay-load" + }, + { + "title": "Load after the specified length is entered.", + "content": "

You can use the suggest-length attribute to specify the number of characters to start requesting services.

\n", + "link": "user/load-after-input-the-length", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "load-after-input-the-length" + }, + { + "title": "Value change event", + "content": "

The user type can be obtained through the change event.

\n", + "link": "user/event-change", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "event-change" + }, + { + "title": "User query error message", + "content": "

The error event can be used to obtain the input that fails to be queried.

\n", + "link": "user/event-error", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "event-error" + }, + { + "title": "Custom Option Text", + "content": "

Sets the custom drop-down option text through the options slot.

\n", + "link": "user/user-options", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "user-options" + }, + { + "title": "Custom Service", + "content": "

You can customize the user service through the service attribute. When a user enters an accurate account in the text box, the user is displayed in the drop-down menu. \nThe data sequence in the drop-down list box during sort-by-fetch-data association is the same as that returned by the interface.

\n", + "link": "user/custom-service", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "custom-service" + }, + { + "title": "Custom Sorting", + "content": "

uses the sortable attribute to reference sortablejs for sorting.

\n", + "link": "user/custom-sort", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "custom-sort" + }, + { + "title": "Size Settings", + "content": "

You can use the size attribute to specify the size of the text box, including medium, small, and mini.

\n", + "link": "user/user-select-size", + "component": "User", + "findIntroStr": "The Select selector component is used to query users, including single-user query and multi-user query.", + "demoId": "user-select-size" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/en-US/wizard.json b/examples/docs/resources/pc/demo-config/en-US/wizard.json new file mode 100644 index 000000000..43c97723d --- /dev/null +++ b/examples/docs/resources/pc/demo-config/en-US/wizard.json @@ -0,0 +1,50 @@ +[ + { + "title": "Basic Usage", + "content": "

Sets the basic flowchart mode through the base-flow attribute. The process nodes and relationships between nodes are displayed in node diagrams. The node information is only the node name and status.

\n", + "link": "wizard/base-flow", + "component": "Wizard Flowchart", + "findIntroStr": "A component with a specific graphic symbol indicating the relationship between process nodes.", + "demoId": "base-flow" + }, + { + "title": "Page Wizard Flowchart", + "content": "

The page-guide attribute is used to set the page wizard flow chart mode, which is used to navigate the relationship between the current page and the previous and next pages, including the flow chart area, page display area, and function button area.

\n", + "link": "wizard/page-guide", + "component": "Wizard Flowchart", + "findIntroStr": "A component with a specific graphic symbol indicating the relationship between process nodes.", + "demoId": "page-guide" + }, + { + "title": "Vertical Flowchart", + "content": "

The vertical attribute is used to set the vertical flowchart mode. Process nodes and relationships between nodes are displayed vertically in node diagram mode. Node information includes the node name, status, completion time, and user.

\n", + "link": "wizard/vertical", + "component": "Wizard Flowchart", + "findIntroStr": "A component with a specific graphic symbol indicating the relationship between process nodes.", + "demoId": "vertical" + }, + { + "title": "Timeline Flowchart", + "content": "

Set the timeline flowchart through the time-line-flow attribute, and customize the time icon through the time-icon attribute. Process node processing information is displayed vertically by time point, including the node name, status, completion time, and user.

\n", + "link": "wizard/time-line-flow", + "component": "Wizard Flowchart", + "findIntroStr": "A component with a specific graphic symbol indicating the relationship between process nodes.", + "demoId": "time-line-flow" + }, + { + "title": "Step Slot", + "content": "The stepbutton slot can be used to customize step buttons or content in the

page wizard flowchart.

\n", + "link": "wizard/slot-step-button", + "component": "Wizard Flowchart", + "findIntroStr": "A component with a specific graphic symbol indicating the relationship between process nodes.", + "demoId": "slot-step-button" + }, + { + "title": "Basic slot", + "content": "

Configure the basic content through base.

\n", + "link": "wizard/slot-base", + "component": "Wizard Flowchart", + "findIntroStr": "A component with a specific graphic symbol indicating the relationship between process nodes.", + "demoId": "slot-base" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/zh-CN/action-menu.json b/examples/docs/resources/pc/demo-config/zh-CN/action-menu.json new file mode 100644 index 000000000..77df836e9 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/action-menu.json @@ -0,0 +1,82 @@ +[ + { + "title": "基本用法", + "content": "ActionMenu 组件的基本用法。", + "link": "action-menu/basic-usage", + "component": " ActionMenu 菜单按钮", + "findIntroStr": "ActionMenu 菜单按钮", + "demoId": "basic-usage" + }, + { + "title": "禁用", + "content": "通过 disabled 字段配置当前下拉选项是否为禁用状态", + "link": "action-menu/disabled", + "component": " ActionMenu 菜单按钮", + "findIntroStr": "ActionMenu 菜单按钮", + "demoId": "disabled" + }, + { + "title": "显示文本", + "content": "通过属性 text-field 配置要显示文本的键值,默认值为 label。", + "link": "action-menu/text-field", + "component": " ActionMenu 菜单按钮", + "findIntroStr": "ActionMenu 菜单按钮", + "demoId": "text-field" + }, + { + "title": "下拉按钮显示文本", + "content": "通过属性 more-text 配置下拉菜单显示文本,默认值为 更多spacing 配置菜单按钮之间的间距,默认值为 5px。", + "link": "action-menu/spacing", + "component": " ActionMenu 菜单按钮", + "findIntroStr": "ActionMenu 菜单按钮", + "demoId": "spacing" + }, + { + "title": "自定义下拉面板样式", + "content": "通过属性 popper-class 设置下拉面板的类名,自定义样式", + "link": "action-menu/popper-class", + "component": " ActionMenu 菜单按钮", + "findIntroStr": "ActionMenu 菜单按钮", + "demoId": "popper-class" + }, + { + "title": "显示个数", + "content": "通过属性 max-show-num 配置显示菜单按钮的最大个数,默认值为 2 ", + "link": "action-menu/max-show-num", + "component": " ActionMenu 菜单按钮", + "findIntroStr": "ActionMenu 菜单按钮", + "demoId": "max-show-num" + }, + { + "title": "菜单项点击事件", + "content": "当选中菜单项时触发 item-click 事件,传递出去的参数为当前选中项的数据", + "link": "action-menu/item-click", + "component": " ActionMenu 菜单按钮", + "findIntroStr": "ActionMenu 菜单按钮", + "demoId": "item-click" + }, + { + "title": "更多按钮点击事件", + "content": "当点击下拉菜单按钮时触发 more-click 事件", + "link": "action-menu/more-click", + "component": " ActionMenu 菜单按钮", + "findIntroStr": "ActionMenu 菜单按钮", + "demoId": "more-click" + }, + { + "title": "菜单项插槽", + "content": "通过 #item 配置下拉面板中选项的模板", + "link": "action-menu/slot-item", + "component": " ActionMenu 菜单按钮", + "findIntroStr": "ActionMenu 菜单按钮", + "demoId": "slot-item" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/alert.json b/examples/docs/resources/pc/demo-config/zh-CN/alert.json new file mode 100644 index 000000000..1db532962 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/alert.json @@ -0,0 +1,106 @@ +[ + { + "title": "基本用法", + "content": "详细用法参考如下示例", + "link": "alert/base", + "component": " Alert 警告", + "findIntroStr": "Alert 警告,提供 warning、error、info、success 四种类型显示不同类别的信息。", + "demoId": "base" + }, + { + "title": "类型", + "content": "

通过 type 设置不同的类型。可选值:success、warning、info、error,默认值:info 。

\n", + "link": "alert/type", + "component": " Alert 警告", + "findIntroStr": "Alert 警告,提供 warning、error、info、success 四种类型显示不同类别的信息。", + "demoId": "type" + }, + { + "title": "大尺寸", + "content": "

通过 size 属性设置不同的尺寸,可选值:nomal、large,默认值:nomal 。

\n", + "link": "alert/size", + "component": " Alert 警告", + "findIntroStr": "Alert 警告,提供 warning、error、info、success 四种类型显示不同类别的信息。", + "demoId": "size" + }, + { + "title": "自定义标题", + "content": "

size 为 large 时显示标题,可设置 titleslot 自定义标题。默认标题根据设置的 type 显示。

\n", + "link": "alert/title", + "component": " Alert 警告", + "findIntroStr": "Alert 警告,提供 warning、error、info、success 四种类型显示不同类别的信息。", + "demoId": "title" + }, + { + "title": "文字居中", + "content": "

通过 center 属性可使文字显示居中。

\n", + "link": "alert/center", + "component": " Alert 警告", + "findIntroStr": "Alert 警告,提供 warning、error、info、success 四种类型显示不同类别的信息。", + "demoId": "center" + }, + { + "title": "自定义关闭按钮文本", + "content": "

通过属性 close-text 自定义关闭按钮文本。

\n", + "link": "alert/close-text", + "component": " Alert 警告", + "findIntroStr": "Alert 警告,提供 warning、error、info、success 四种类型显示不同类别的信息。", + "demoId": "close-text" + }, + { + "title": "自定义警告图标", + "content": "

通过 icon 属性自定义图标。

\n", + "link": "alert/icon", + "component": " Alert 警告", + "findIntroStr": "Alert 警告,提供 warning、error、info、success 四种类型显示不同类别的信息。", + "demoId": "icon" + }, + { + "title": "不可关闭", + "content": "

通过 closable 属性可设置是否显示关闭按钮,没有关闭按钮,警告框将不可关闭。

\n", + "link": "alert/closable", + "component": " Alert 警告", + "findIntroStr": "Alert 警告,提供 warning、error、info、success 四种类型显示不同类别的信息。", + "demoId": "closable" + }, + { + "title": "自定义提示内容", + "content": "

size 为 large时,可通过 description 属性或插槽设置自定义提示内容。

\n", + "link": "alert/custom-description", + "component": " Alert 警告", + "findIntroStr": "Alert 警告,提供 warning、error、info、success 四种类型显示不同类别的信息。", + "demoId": "custom-description" + }, + { + "title": "自定义交互操作", + "content": "

size 为 large 时,设置默认插槽自定义交互操作。

\n", + "link": "alert/slot-default", + "component": " Alert 警告", + "findIntroStr": "Alert 警告,提供 warning、error、info、success 四种类型显示不同类别的信息。", + "demoId": "slot-default" + }, + { + "title": "关闭事件", + "content": "

close 事件,关闭警告框时触发。

\n", + "link": "alert/close", + "component": " Alert 警告", + "findIntroStr": "Alert 警告,提供 warning、error、info、success 四种类型显示不同类别的信息。", + "demoId": "close-events" + }, + { + "title": "表单提交结果反馈", + "content": "

size 为 large时,属性 description 和默认插槽结合使用,可渲染提交反馈界面。

\n", + "link": "alert/feedback-of-result", + "component": " Alert 警告", + "findIntroStr": "Alert 警告,提供 warning、error、info、success 四种类型显示不同类别的信息。", + "demoId": "feedback-of-result" + }, + { + "title": "是否显示图标", + "content": "

通过配置 show-icon 属性,控制图标是否显示。

\n", + "link": "alert/show-icon", + "component": " Alert 警告", + "findIntroStr": "Alert 警告,提供 warning、error、info、success 四种类型显示不同类别的信息。", + "demoId": "show-icon" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/amount.json b/examples/docs/resources/pc/demo-config/zh-CN/amount.json new file mode 100644 index 000000000..aa7e56dfe --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/amount.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"amount/basic-usage","component":" Amount 金额","findIntroStr":"用于处理货币、金额和相关时间,选择货币类型并填写数目和时间,也可以通过设定服务,自定义货币类型。","demoId":"basic-usage"},{"title":"设置日期","content":"

通过 date 属性设置日期后,将会在金额组件中显示日期框。值可设置为 String 或者 Date() 类型。\n通过 change 获取改变后的值。

\n","link":"amount/set-date","component":" Amount 金额","findIntroStr":"用于处理货币、金额和相关时间,选择货币类型并填写数目和时间,也可以通过设定服务,自定义货币类型。","demoId":"set-date"},{"title":"编辑框大小","content":"

可选择的类型:mediumsmallmini

\n","link":"amount/size","component":" Amount 金额","findIntroStr":"用于处理货币、金额和相关时间,选择货币类型并填写数目和时间,也可以通过设定服务,自定义货币类型。","demoId":"size"},{"title":"指定币种","content":"

默认显示币种为 CNY,可通过 currency 指定需要的币种,若指定的币种在返回的服务数据中不存在,则币种下拉框将不显示该币种。

\n","link":"amount/custom-currency","component":" Amount 金额","findIntroStr":"用于处理货币、金额和相关时间,选择货币类型并填写数目和时间,也可以通过设定服务,自定义货币类型。","demoId":"custom-currency"},{"title":"金额设置","content":"

设置 digits 属性可指定金额小数位数,默认为 2 位。设置 max-len 属性指定整数位最大可输入长度,默认为 15 位。

\n","link":"amount/digits-maxlen","component":" Amount 金额","findIntroStr":"用于处理货币、金额和相关时间,选择货币类型并填写数目和时间,也可以通过设定服务,自定义货币类型。","demoId":"digits-maxlen"},{"title":"自定义服务","content":"

fetchCurrency 指定自定义服务,fields 可指定显示字段和值设置在服务数据中的字段映射。

\n","link":"amount/custom-service","component":" Amount 金额","findIntroStr":"用于处理货币、金额和相关时间,选择货币类型并填写数目和时间,也可以通过设定服务,自定义货币类型。","demoId":"custom-service"},{"title":"禁用","content":"

通过 disabled 配置 Amount 组件禁用。

\n","link":"amount/amount-disable","component":" Amount 金额","findIntroStr":"用于处理货币、金额和相关时间,选择货币类型并填写数目和时间,也可以通过设定服务,自定义货币类型。","demoId":"amount-disable"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/anchor.json b/examples/docs/resources/pc/demo-config/zh-CN/anchor.json new file mode 100644 index 000000000..81b4f0964 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/anchor.json @@ -0,0 +1,34 @@ +[ + { + "title": "基本用法", + "content": "属性links传入数据渲染", + "link": "anchor/basic-usage", + "component": " Anchor 锚点", + "findIntroStr": "用于跳转到页面指定位置", + "demoId": "basic-usage" + }, + { + "title": "固定模式", + "content": "设置属性is-affix为true, 让锚点不随页面滚动", + "link": "anchor/is-affix", + "component": " Anchor 锚点", + "findIntroStr": "用于跳转到页面指定位置", + "demoId": "is-affix" + }, + { + "title": "滚动容器", + "content": "通过container-id属性指定滚动容器,link-click监听锚点点击事件,阻止浏览器默认行为,实现单页面hash路由模式的页内跳转,让页面只在想要的指定容器内滚动。通过mask-class属性设置自定义类名,高亮显示滚动的目标元素", + "link": "anchor/set-container", + "component": " Anchor 锚点", + "findIntroStr": "用于跳转到页面指定位置", + "demoId": "set-container" + }, + { + "title": "change事件", + "content": "on-change事件,锚点链接改变时触发回调", + "link": "anchor/on-change", + "component": " Anchor 锚点", + "findIntroStr": "用于跳转到页面指定位置", + "demoId": "on-change" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/area.json b/examples/docs/resources/pc/demo-config/zh-CN/area.json new file mode 100644 index 000000000..ea94e0b33 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/area.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

通过 v-model / value 属性设置默认值。

\n","link":"area/basic-usage","component":" Area 片区","findIntroStr":"用于显示区域名称,通过配置区域和数据源获取选项。","demoId":"basic-usage"},{"title":"自定义服务","content":"

通过 fetch-jcr 可以自定义服务用于获取片区 JCR 数据,fetch-rigion 用于获取地区部 Region 的数据,fetch-rep 用于获取代表处 Rep 的数据,fetch-office 用于获取办事处 Office 的数据。同时 当数据字段为非默认的 name_cn org_id 时,可以通过 props 属性设置数据的映射字段。

\n","link":"area/custom-service","component":" Area 片区","findIntroStr":"用于显示区域名称,通过配置区域和数据源获取选项。","demoId":"custom-service"},{"title":"设置组件大小","content":"

可选值为:mediumsmallmini

\n","link":"area/size","component":" Area 片区","findIntroStr":"用于显示区域名称,通过配置区域和数据源获取选项。","demoId":"size"},{"title":"事件","content":"

Region 下拉框的值改变时触发 change-region 事件,Rep 下拉框的值改变时触发 change-rep 事件,Office 下拉框的值改变时触发 change-office 事件。

\n","link":"area/area-events","component":" Area 片区","findIntroStr":"用于显示区域名称,通过配置区域和数据源获取选项。","demoId":"area-events"},{"title":"设置组件大小","content":"

通过 disabled 设置组件禁用默认值为 false 。

\n","link":"area/disabled","component":" Area 片区","findIntroStr":"用于显示区域名称,通过配置区域和数据源获取选项。","demoId":"disabled"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/autocomplete.json b/examples/docs/resources/pc/demo-config/zh-CN/autocomplete.json new file mode 100644 index 000000000..3921fed9f --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/autocomplete.json @@ -0,0 +1 @@ +[{"title":"禁用","content":"

通过 disabled 属性可以设置为禁用状态。

\n","link":"autocomplete/disabled","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"disabled1"},{"title":"原生属性","content":"详细用法参考如下示例","link":"autocomplete/disabled","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"disabled"},{"title":"输入框大小","content":"

可选择值为medium,small,mini

\n","link":"autocomplete/size","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"size"},{"title":"可清除","content":"

配置 clearable 属性后,输入内容后会显示清除图标,单击可以清除输入框内容。

\n","link":"autocomplete/clearable","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"clearable"},{"title":"输入框前置内容","content":"

配置 prepend 属性设置输入框前置内容。

\n","link":"autocomplete/append-prepend","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"append-prepend"},{"title":"输入框后置内容","content":"

配置 append 属性设置输入框后置内容。

\n","link":"autocomplete/append-prepend","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"append-append"},{"title":"自定义图标","content":"

配置 prefix-iconsuffix-icon 属性可分别自定义输入框前后置图标。

\n","link":"autocomplete/custom-icon","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"custom-icon"},{"title":"通过插槽自定义图标","content":"

通过 prefixsuffix 插槽也可以分别自定义输入框前后置图标。

\n","link":"autocomplete/prefix-suffix-slot","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"prefix-suffix-slot"},{"title":"去抖延时","content":"

通过 debounce 属性可以设置获取输入建议的去抖延时,默认值为 300 毫秒。

\n","link":"autocomplete/debounce","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"debounce"},{"title":"隐藏加载图标","content":"

设置 hide-loading 属性为 true ,可以隐藏加载图标。

\n","link":"autocomplete/hide-loading","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"hide-loading"},{"title":"输入框占位文本","content":"

通过 placeholder 属性设置输入框占位文本。

\n","link":"autocomplete/hide-loading","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"hide-loading1"},{"title":"自定义模板","content":"

通过作用域插槽可以自定义输入建议模板。

\n","link":"autocomplete/cust-template","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"cust-template"},{"title":"远程搜索","content":"

通过 fetch-suggestions 属性设置远程搜索。

\n","link":"autocomplete/remote-search","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"remote-search"},{"title":"指定显示的键名","content":"

输入内容后,建议列表中默认显示输入建议对象中 value 键名对应的值,若对象中没有 value 键名,就可以通过 value-key 属性指定显示的键名。

\n","link":"autocomplete/value-key","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"value-key"},{"title":"自定义列表样式","content":"

popper-class 属性可指定一个样式类名,可自定义建议列表的样式。\npopper-append-to-body 属性可设置是否将下拉列表插入至 body 元素。在下拉列表的定位出现问题时,可将该属性设置为 false。

\n","link":"autocomplete/popper-class","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"popper-class"},{"title":"设置菜单弹出位置","content":"

placement 属性可以设置菜单弹出位置,默认为 bottom-start。可选值有 top、top-start、top-end、bottom、bottom-start、bottom-end 。

\n","link":"autocomplete/placement","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"placement"},{"title":"高亮显示第一项","content":"

设置 highlight-first-item 属性为 true ,可以突出显示远程搜索建议中的第一项。

\n","link":"autocomplete/highlight-first-item","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"highlight-first-item"},{"title":"聚焦不显示建议列表","content":"

默认输入框聚焦就会显示全部的建议列表,但设置 trigger-on-focus 属性为 false 后只有在匹配到输入建议后才会显示匹配到的建议列表。

\n","link":"autocomplete/no-trigger-on-focus","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"no-trigger-on-focus"},{"title":"事件","content":"

Autocomplete 组件提供 select 事件,点击选中建议项时触发,回调参数为选中建议项。\n通过 select-when-unmatched 设置在输入联想没有匹配值时,按 Enter 键时是否触发 select 事件,默认值为 false。

\n","link":"autocomplete/select-event","component":" Autocomplete 自动完成","findIntroStr":"根据输入内容提供对应的输入建议。","demoId":"select-event"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/badge.json b/examples/docs/resources/pc/demo-config/zh-CN/badge.json new file mode 100644 index 000000000..d591ebde8 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/badge.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

Badge 展示指定数据信息,如:我的待办数、新任务数等。

\n","link":"badge/base","component":" Badge 标记","findIntroStr":"Badge 展示指定数据信息,如:我的待办数、新任务数等。","demoId":"base"},{"title":"主題样式","content":"

type 设置显示主题,可选值:primary、success、warning、danger、info,默认值:danger

\n","link":"badge/type","component":" Badge 标记","findIntroStr":"Badge 展示指定数据信息,如:我的待办数、新任务数等。","demoId":"type"},{"title":"小圆点标记","content":"

is-dot 显示小圆点标记

\n","link":"badge/is-dot","component":" Badge 标记","findIntroStr":"Badge 展示指定数据信息,如:我的待办数、新任务数等。","demoId":"is-dot"},{"title":"计数最大值","content":"

max 超过最大值会显示 '{max}+'

\n","link":"badge/max","component":" Badge 标记","findIntroStr":"Badge 展示指定数据信息,如:我的待办数、新任务数等。","demoId":"max"},{"title":"跳转链接","content":"

href定义跳转链接

\n","link":"badge/target","component":" Badge 标记","findIntroStr":"Badge 展示指定数据信息,如:我的待办数、新任务数等。","demoId":"target"},{"title":"自定义标记目标","content":"

default slot 标记内容自定义

\n","link":"badge/slot-default","component":" Badge 标记","findIntroStr":"Badge 展示指定数据信息,如:我的待办数、新任务数等。","demoId":"slot-default"},{"title":"自定义提示内容","content":"

content slot 自定义提示内容

\n","link":"badge/slot-content","component":" Badge 标记","findIntroStr":"Badge 展示指定数据信息,如:我的待办数、新任务数等。","demoId":"slot-content"},{"title":"消息已读动态隐藏标记","content":"

hidden 隐藏标记

\n","link":"badge/dynamic-hidden","component":" Badge 标记","findIntroStr":"Badge 展示指定数据信息,如:我的待办数、新任务数等。","demoId":"dynamic-hidden"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/breadcrumb.json b/examples/docs/resources/pc/demo-config/zh-CN/breadcrumb.json new file mode 100644 index 000000000..1fa7ba930 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/breadcrumb.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"breadcrumb/base","component":" Breadcrumb 面包屑","findIntroStr":"Breadcrumb 面包屑导航,作用是告诉访问者他们目前在网站中的位置以及如何返回。","demoId":"base"},{"title":"自定义节点","content":"

设置子组件 BreadcrumbItem 的 默认插槽,自定义节点内容。to 设置路由跳转的对象,同时设置 replace 后将不会向 history 添加新记录。

\n","link":"breadcrumb/slot-default","component":" Breadcrumb 面包屑","findIntroStr":"Breadcrumb 面包屑导航,作用是告诉访问者他们目前在网站中的位置以及如何返回。","demoId":"slot-default"},{"title":"自定义分隔符","content":"

设置 separatorseparator-icon 属性,自定义分隔符。

\n","link":"breadcrumb/separator","component":" Breadcrumb 面包屑","findIntroStr":"Breadcrumb 面包屑导航,作用是告诉访问者他们目前在网站中的位置以及如何返回。","demoId":"separator"},{"title":"options 配置","content":"

通过 options 总体配置每个 BreadcrumbItem

设置textField 指定显示字段,默认显示字段为 label\n","link":"breadcrumb/options","component":" Breadcrumb 面包屑","findIntroStr":"Breadcrumb 面包屑导航,作用是告诉访问者他们目前在网站中的位置以及如何返回。","demoId":"options"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/bulletin-board.json b/examples/docs/resources/pc/demo-config/zh-CN/bulletin-board.json new file mode 100644 index 000000000..76b0d9dcb --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/bulletin-board.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

必须设置 data 属性设置公告牌公告信息数据,以及 tab-title 属性设置每个公告牌标题。

\n","link":"bulletin-board/base","component":" BulletinBoard 公告牌","findIntroStr":"BulletinBoard 公告牌组件,展现需要重点关注的信息。","demoId":"base"},{"title":"公告牌标题","content":"

可通过 title 设置公告牌标题。

\n","link":"bulletin-board/title","component":" BulletinBoard 公告牌","findIntroStr":"BulletinBoard 公告牌组件,展现需要重点关注的信息。","demoId":"title"},{"title":"默认激活的选项卡","content":"

可通过 active-name 设置默认激活的选项卡,从 1 开始计算。

\n","link":"bulletin-board/active-name","component":" BulletinBoard 公告牌","findIntroStr":"BulletinBoard 公告牌组件,展现需要重点关注的信息。","demoId":"active-name"},{"title":"选项卡标题","content":"

可通过 tab-title 属性自定义选项卡标题。

\n","link":"bulletin-board/tab-title","component":" BulletinBoard 公告牌","findIntroStr":"BulletinBoard 公告牌组件,展现需要重点关注的信息。","demoId":"tab-title"},{"title":"基于Url的跳转","content":"

基于 Url 的跳转是根据数据中的 urltarget 字段进行跳转的。

\n","link":"bulletin-board/url","component":" BulletinBoard 公告牌","findIntroStr":"BulletinBoard 公告牌组件,展现需要重点关注的信息。","demoId":"url"},{"title":"基于Route的跳转","content":"

基于 Route 的跳转是根据数据中的 route 字段进行跳转的。

\n","link":"bulletin-board/route","component":" BulletinBoard 公告牌","findIntroStr":"BulletinBoard 公告牌组件,展现需要重点关注的信息。","demoId":"route"},{"title":"显示 “更多” 链接","content":"

可通过 more-link 显示并设置更多链接。 show-more 设置是否显示更多按钮,默认为 true。

\n","link":"bulletin-board/more-link","component":" BulletinBoard 公告牌","findIntroStr":"BulletinBoard 公告牌组件,展现需要重点关注的信息。","demoId":"more-link"},{"title":"自定义新公告前缀","content":"

可通过 icon 自定义新公告前缀图标。

\n","link":"bulletin-board/icon","component":" BulletinBoard 公告牌","findIntroStr":"BulletinBoard 公告牌组件,展现需要重点关注的信息。","demoId":"icon"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/button-group.json b/examples/docs/resources/pc/demo-config/zh-CN/button-group.json new file mode 100644 index 000000000..50ee829c7 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/button-group.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

通过 v-model 设置默认选中的按钮,并实现双向绑定。通过 value 也可设置默认选中按钮,但不能进行双向绑定。

\n","link":"button-group/base","component":" ButtonGroup 按钮组","findIntroStr":"以按钮组的方式出现,常用于多项类似操作。","demoId":"base"},{"title":"按钮组数据","content":"

通过 data 属性设置按钮组数据,对象中的 text 为按钮显示文本,value 用于双向绑定时指定的值。

\n","link":"button-group/data","component":" Buttongroup 按钮组","findIntroStr":"以按钮组的方式出现,常用于多项类似操作。","demoId":"data"},{"title":"设置组件大小","content":"

可以设置为:mediumsmallmini

\n","link":"button-group/size","component":" ButtonGroup 按钮组","findIntroStr":"以按钮组的方式出现,常用于多项类似操作。","demoId":"size"},{"title":"禁用状态","content":"

设置 disabled 属性为 true 可禁用整个按钮组。

\n","link":"button-group/disabled","component":" Buttongroup 按钮组","findIntroStr":"以按钮组的方式出现,常用于多项类似操作。","demoId":"disabled"},{"title":"朴素按钮","content":"

设置 plain 属性为 true 可显示为朴素按钮样式。

\n","link":"button-group/plain","component":" Buttongroup 按钮组","findIntroStr":"以按钮组的方式出现,常用于多项类似操作。","demoId":"plain"},{"title":"数据字段映射","content":"

若按钮组数据对象中的字段不是默认的 text 和 value ,则可通过 text-fieldvalue-field 属性进行映射。

\n","link":"button-group/text-value-field","component":" Buttongroup 按钮组","findIntroStr":"以按钮组的方式出现,常用于多项类似操作。","demoId":"text-value-field"},{"title":"是否显示更多按钮","content":"

设置 show-more 属性值大于 0 且小于按钮组数据,可显示更多按钮。

\n","link":"button-group/show-more","component":" Buttongroup 按钮组","findIntroStr":"以按钮组的方式出现,常用于多项类似操作。","demoId":"show-more"},{"title":"是否显示编辑按钮","content":"

设置 show-edit 属性值为 true ,可显示编辑按钮。

\n","link":"button-group/show-edit","component":" Buttongroup 按钮组","findIntroStr":"以按钮组的方式出现,常用于多项类似操作。","demoId":"show-edit"},{"title":"编辑事件","content":"

勾选值改变后将触发 edit 事件。

\n","link":"button-group/event-edit","component":" Buttongroup 按钮组","findIntroStr":"以按钮组的方式出现,常用于多项类似操作。","demoId":"event-edit"},{"title":"默认插槽","content":"

使用默认插槽的方式时,ButtonGroup 的 data、text-field、value-field、value / v-model、size 属性对插槽中的按钮将不再生效。\n但可根据使用场景在 Button 组件标签上对不同按钮设置不同的属性,具体参考 Button 组件属性。

\n","link":"button-group/slot-default","component":" Buttongroup 按钮组","findIntroStr":"以按钮组的方式出现,常用于多项类似操作。","demoId":"slot-default"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/button.json b/examples/docs/resources/pc/demo-config/zh-CN/button.json new file mode 100644 index 000000000..048709124 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/button.json @@ -0,0 +1,114 @@ +[ + { + "title": "基本用法", + "content": "详细用法参考如下示例", + "link": "button/base", + "component": " Button 按钮", + "findIntroStr": "常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。", + "demoId": "base" + }, + { + "title": "图标按钮", + "content": "

指定 icon 属性值为需要的 Icon 图标即可展示为图标按钮。

\n

Icon 图标用法

\n

先从 @opentiny/vue-icon 中导入需要的 Icon,再在 data 函数中初始化 Icon 组件并赋值给一个属性。最后在模板中通过 icon 属性进行引用。\n通过 native-type 设置 button、image 两种按钮的表单类型。该属性仅当属性 type 为 button 或 image 时使用。该属性的可选值为 button / submit / reset。

\n
\n", + "link": "button/icon", + "component": " Button 按钮", + "findIntroStr": "常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。", + "demoId": "icon" + }, + { + "title": "文字按钮", + "content": "

设置 type 属性为 text 即为文字按钮,可在标签子级或者通过 text 属性设置显示内容。

\n", + "link": "button/text", + "component": " Button 按钮", + "findIntroStr": "常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。", + "demoId": "text" + }, + { + "title": "按钮圆角", + "content": "

通过 round 属性设置是否圆角按钮。

\n", + "link": "button/round", + "component": " Button 按钮", + "findIntroStr": "常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。", + "demoId": "round" + }, + { + "title": "图片按钮", + "content": "

以默认插槽的用法嵌入 img 标签,并引入图片。

\n", + "link": "button/image", + "component": " Button 按钮", + "findIntroStr": "常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。", + "demoId": "image" + }, + { + "title": "主题样式", + "content": "

通过 type 属性可以设置不同的主题样式,主要包括 primary、success、info、warning、danger、text。

\n", + "link": "button/type", + "component": " Button 按钮", + "findIntroStr": "常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。", + "demoId": "type" + }, + { + "title": "显示加载中", + "content": "

直接配置 loading 属性为 true,即可展示为加载中的样式。

\n", + "link": "button/loading", + "component": " Button 按钮", + "findIntroStr": "常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。", + "demoId": "loading" + }, + { + "title": "尺寸", + "content": "

通过 size 属性设置按钮不同的大小尺寸,包括 large、medium、small、mini 四种不同大小。不设置时为默认尺寸。

\n", + "link": "button/size", + "component": " Button 按钮", + "findIntroStr": "常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。", + "demoId": "size" + }, + { + "title": "圆形按钮", + "content": "

直接配置 circle 属性为 true,即可展示为圆形按钮的形式。

\n", + "link": "button/circle", + "component": " Button 按钮", + "findIntroStr": "常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。", + "demoId": "circle" + }, + { + "title": "朴素按钮", + "content": "

配置 plain 属性为 true,即可展示为朴素按钮的形式。

\n", + "link": "button/plain", + "component": " Button 按钮", + "findIntroStr": "常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。", + "demoId": "plain" + }, + { + "title": "防止表单重复提交", + "content": "

通过 reset-time 属性可设置单击后按钮禁用的时长,默认的禁用时长为 1000 毫秒。\n可用于防止按钮连续点击出现表单重复提交的问题。

\n", + "link": "button/reset-time", + "component": " Button 按钮", + "findIntroStr": "常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。", + "demoId": "reset-time" + }, + { + "title": "默认聚焦", + "content": "

配置 autofocus 属性的按钮,将默认展示为聚焦状态。

\n", + "link": "button/autofocus", + "component": " Button 按钮", + "findIntroStr": "常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。", + "demoId": "autofocus" + }, + { + "title": "事件", + "content": "

按钮的单击事件,该示例中单击按钮将会出现提示信息。

\n", + "link": "button/click", + "component": " Button 按钮", + "findIntroStr": "常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。", + "demoId": "click" + }, + { + "title": "动态禁用按钮", + "content": "

设置 disabled 属性为 true 后,可以禁用按钮。

\n", + "link": "button/dynamic-disabled", + "component": " Button 按钮", + "findIntroStr": "常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。", + "demoId": "dynamic-disabled" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/calendar.json b/examples/docs/resources/pc/demo-config/zh-CN/calendar.json new file mode 100644 index 000000000..f9b81f17e --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/calendar.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

默认以月的形式展示当月的每一天。

\n","link":"calendar/basic-usage","component":" Calendar 日历","findIntroStr":"按照日历形式展示数据的容器。","demoId":"basic-usage"},{"title":"显示模式","content":"

通过 mode 属性指定以年的形式显示,将展示当年的每个月份。可选值有 year、month。

\n","link":"calendar/calendar-mode","component":" Calendar 日历","findIntroStr":"按照日历形式展示数据的容器。","demoId":"calendar-mode"},{"title":"显示选中日期","content":"

以月的形式展示时,指定 show-selected 属性后,单击日期单元格,将会在日历框上方展示当前选中的日期。

\n","link":"calendar/show-selected-date","component":" Calendar 日历","findIntroStr":"按照日历形式展示数据的容器。","demoId":"show-selected-date"},{"title":"自定义日期单元格","content":"

通过作用域插槽 day 自定义日期单元格。

\n","link":"calendar/custom-day-cell","component":" Calendar 日历","findIntroStr":"按照日历形式展示数据的容器。","demoId":"custom-day-cell"},{"title":"自定义工具栏","content":"

通过作用域插槽 tool 自定义需要的工具栏。

\n","link":"calendar/custom-calendar-toolbar","component":" Calendar 日历","findIntroStr":"按照日历形式展示数据的容器。","demoId":"custom-calendar-toolbar"},{"title":"添加日程事件","content":"

通过 events 属性可以指定事件列表,它是一个对象数组,对象中包含如下字段:

\n

events 说明

\n

time:指定需要展示事件的日期\ntitle:指定事件标题\ncontent:指定事件的具体内容 type:指定当鼠标悬停在事件标题上时,弹出的展示事件具体内容的提示框的主题,包括 warning、error、info、success

\n
\n","link":"calendar/dynamic-add-schedule","component":" Calendar 日历","findIntroStr":"按照日历形式展示数据的容器。","demoId":"dynamic-add-schedule"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/carousel.json b/examples/docs/resources/pc/demo-config/zh-CN/carousel.json new file mode 100644 index 000000000..e18def940 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/carousel.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"carousel/basic-usage","component":" Carousel 走马灯","findIntroStr":"常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。","demoId":"basic-usage"},{"title":"指示器和触发方式","content":"

走马灯指示器默认显示在幻灯片内容上,配置 indicator-position 为 outside 后,将显示在外部。\n配置 trigger 为 click ,可以修改指示器触发方式为单击,默认鼠标悬停到指示器时,走马灯幻灯片就会对应切换。

\n","link":"carousel/indicator-trigger","component":" Carousel 走马灯","findIntroStr":"常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。","demoId":"indicator-trigger"},{"title":"手动轮播","content":"

调用 setActiveItem()next()prev() 方法可根据需要进行轮播。initial-index 属性可以指定初始激活的幻灯片索引。

\n","link":"carousel/manual-play","component":" Carousel 走马灯","findIntroStr":"常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。","demoId":"manual-play"},{"title":"关闭循环轮播","content":"

配置 loop 属性为 false 后,若走马灯幻灯片已切换到最后一项,则将不能再从第一项开始循环切换。即切换到最后一项时,右侧切换箭头不再显示,切换到第一项时,左侧切换箭头不再显示。

\n","link":"carousel/close-loop","component":" Carousel 走马灯","findIntroStr":"常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。","demoId":"close-loop"},{"title":"自动切换","content":"

配置 autoplay 属性为 true 后,走马灯的幻灯片内容将自动轮播切换。

\n","link":"carousel/autoplay","component":" Carousel 走马灯","findIntroStr":"常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。","demoId":"autoplay"},{"title":"轮播间隔时间","content":"

走马灯幻灯片轮播间隔时间默认为 3000 毫秒,通过 interval 属性可以自定义。

\n","link":"carousel/play-interval","component":" Carousel 走马灯","findIntroStr":"常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。","demoId":"play-interval"},{"title":"纵向轮播","content":"

配置 type 属性为 vertical 即可实现纵向轮播。

\n","link":"carousel/up-down-carousel","component":" Carousel 走马灯","findIntroStr":"常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。","demoId":"up-down-carousel"},{"title":"显示标题","content":"

通过 title 配置显示标题,需要与 show-title 结合使用。

\n","link":"carousel/show-title","component":" Carousel 走马灯","findIntroStr":"常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。","demoId":"show-title"},{"title":"总是显示切换箭头","content":"详细用法参考如下示例","link":"carousel/carousel-arrow-always","component":" Carousel 走马灯","findIntroStr":"常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。","demoId":"carousel-arrow-always"},{"title":"hover 时显示切换箭头","content":"详细用法参考如下示例","link":"carousel/carousel-arrow-hover","component":" Carousel 走马灯","findIntroStr":"常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。","demoId":"carousel-arrow-hover"},{"title":"隐藏切换箭头","content":"详细用法参考如下示例","link":"carousel/carousel-arrow-never","component":" Carousel 走马灯","findIntroStr":"常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。","demoId":"carousel-arrow-never"},{"title":"卡片模式","content":"

配置 type 属性为 card 后,走马灯将以卡片形式进行展示。

\n","link":"carousel/card-mode","component":" Carousel 走马灯","findIntroStr":"常用于一组图片或卡片轮播,当内容空间不足时,可以用走马灯的形式进行收纳,进行轮播展现。","demoId":"card-mode"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/cascader-panel.json b/examples/docs/resources/pc/demo-config/zh-CN/cascader-panel.json new file mode 100644 index 000000000..e30ab77a6 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/cascader-panel.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

通过 options 来指定选项,也可通过 props 来设置多选、动态加载等功能,具体详情见下方 API 表格。

\n","link":"cascader-panel/basic-usage","component":" CascaderPanel 级联面板","findIntroStr":"级联面板与级联选择器一样,有单选、多选、动态加载等多种功能。","demoId":"basic-usage"},{"title":"选中节点变化","content":"

通过 change 点击节点后触发的事件,回调参数为 选中节点的值\n通过 clearCheckedNodes 清除选中的节点。\n通过 getCheckedNodes 获取选中的节点。

\n","link":"cascader-panel/change","component":" CascaderPanel 级联面板","findIntroStr":"级联面板与级联选择器一样,有单选、多选、动态加载等多种功能。","demoId":"change"},{"title":"展开节点发生变化","content":"

通过 expand-change 点击展开节点发生变化时触发,回调参数为 各父级选项值组成的数组

\n","link":"cascader-panel/expand-change","component":" CascaderPanel 级联面板","findIntroStr":"级联面板与级联选择器一样,有单选、多选、动态加载等多种功能。","demoId":"expand-change"},{"title":"自定义节点内容","content":"

可以通过 scoped slot 对级联面板的备选项的节点内容进行自定义,scoped slot 会传入两个字段 nodedata,分别表示当前节点的 Node 对象和数据。

\n","link":"cascader-panel/custom-option-content","component":" CascaderPanel 级联面板","findIntroStr":"级联面板与级联选择器一样,有单选、多选、动态加载等多种功能。","demoId":"custom-option-content"},{"title":"Props 选项","content":"

Props

\n

通过 children 指定子级选项,默认值为 children。\n通过 emitPath 是否返回由该节点所在的各级菜单的值所组成的数组。\n通过 label 指定显示选项 label 值,默认为 label。\n通过 value 指定值选项 value 值,默认为 value

\n
\n","link":"cascader-panel/cascader-panel-props","component":" CascaderPanel 级联面板","findIntroStr":"级联面板与级联选择器一样,有单选、多选、动态加载等多种功能。","demoId":"cascader-panel-props"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/cascader.json b/examples/docs/resources/pc/demo-config/zh-CN/cascader.json new file mode 100644 index 000000000..bf8fe301c --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/cascader.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

通过 options 属性指定选项数组即可渲染出一个级联选择器。

\n","link":"cascader/basic-usage","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"basic-usage"},{"title":"hover 触发子菜单","content":"

通过 props.expandTrigger 可以指定展开子级菜单的触发方式为 hover,默认为 click

\n","link":"cascader/expand-trigger","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"expand-trigger"},{"title":"禁用选项","content":"

通过在数据源中设置 disabled 字段来声明该选项是禁用的,本例中,options 指定的数组中的第一个元素含有 disabled: true 键值对,因此是禁用的。在默认情况下,Cascader 会检查数据中每一项的 disabled 字段是否为 true,如果你的数据中表示禁用含义的字段名不为 disabled,可以通过 props.disabled 属性来指定(详见 Cascader Props 的 API 表格)。当然,valuelabelchildren 这三个字段名也可以通过同样的方式指定。

\n","link":"cascader/disabled-items","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"disabled-items"},{"title":"指定属性值","content":"

通过 props 属性设置属性值映射。

\n","link":"cascader/disabled-items","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"disabled-items1"},{"title":"可清空","content":"

通过 clearable 属性设置输入框可清空。

\n","link":"cascader/clearable","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"clearable"},{"title":"分隔符","content":"

通过 separator 属性设置分隔符。

\n","link":"cascader/clearable","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"clearable1"},{"title":"尺寸","content":"

通过 size 属性设置尺寸。

\n","link":"cascader/clearable","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"clearable2"},{"title":"多选","content":"

通过 props.multiple = true 来开启多选模式。

\n","link":"cascader/default-multiple","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"default-multiple"},{"title":"折叠展示 Tag","content":"

在开启多选模式后,默认情况下会展示所有已选中的选项的 Tag,可以使用 collapse-tags 来折叠 Tag 。\n通过 disabled 设置组件是否禁用,默认值为 false 。

\n","link":"cascader/collapse-tags","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"collapse-tags"},{"title":"父子级不相关联","content":"

通过 props.checkStrictly = true 来设置父子节点取消选中关联,从而达到选择任意一级选项的目的。默认单选模式下,只能选择叶子节点。

\n","link":"cascader/check-strictly","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"check-strictly"},{"title":"多选选择任意一级选项","content":"

在多选模式下同时取消父子节点关联,选择任意一级选项。

\n","link":"cascader/check-strictly-multiple","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"check-strictly-multiple"},{"title":"动态加载","content":"

当选中某一级时,动态加载该级下的选项。通过 props 属性中的 lazy 开启动态加载,并通过 lazyload 来设置加载数据源的方法。lazyload 方法有两个参数,第一个参数 node 为当前点击的节点,第二个 resolve 为数据加载完成的回调(必须调用)。为了更准确的显示节点的状态,还可以对节点数据添加是否为叶子节点的标志位 (默认字段为 leaf,可通过 props.leaf 修改),否则会简单的以有无子节点来判断是否为叶子节点。

\n","link":"cascader/auto-load","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"auto-load"},{"title":"动态加载且父子级不相关联","content":"

当选中某一级时,动态加载该级下的选项。通过 props 属性中的 lazy 开启动态加载,并通过 lazyload 来设置加载数据源的方法。通过 props 属性中的 checkStrictly 开启父子级不相关联。

\n","link":"cascader/auto-load-checkStrictly","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"auto-load-checkStrictly"},{"title":"指定选项","content":"

Props

\n

通过 children 指定选项的子选项,默认为 children 。\n通过 value 指定指定选项的 value 值,默认为 value 。\n通过 label 指定选项标签,默认为 label 。

\n
\n","link":"cascader/props-children","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"props-children"},{"title":"可搜索","content":"

filterable 赋值为 true 即可打开搜索功能,默认会匹配节点的 label 或所有父节点的 label (由 show-all-levels 决定)中包含输入值的选项。 empty 无匹配选项时显示的内容

\n","link":"cascader/filterable","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"filterable"},{"title":"搜索延时","content":"详细用法参考如下示例","link":"cascader/filterable","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"filterable2"},{"title":"多选可搜索","content":"

多选模式下开启搜索功能。

\n","link":"cascader/filterable-multiple","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"filterable-multiple"},{"title":"自定义搜索逻辑","content":"

filter-method 自定义搜索逻辑,第一个参数是节点 node,第二个参数是搜索关键词 keyword,通过返回布尔值表示是否命中,如果需要选择父级,通过 props.checkStrictly = true 来设置父子节点取消选中关联,从而达到选择任意一级选项的目的。默认单选模式下,只能选择叶子节点。

\n","link":"cascader/filter-method","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"filter-method"},{"title":"占位文本","content":"详细用法参考如下示例","link":"cascader/filterable-multiple","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"filterable-multiple1"},{"title":"仅显示最后一级","content":"

属性 show-all-levels 定义了是否显示完整的路径,将其赋值为 false 则仅显示最后一级,默认为 true ,显示选中项所在的完整路径。

\n","link":"cascader/show-all-levels","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"show-all-levels"},{"title":"事件","content":"

Cascader 级联选择器的事件有:changeexpand-changeblurfocusvisible-change

\n","link":"cascader/events","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"events"},{"title":"节点返回的数据类型","content":"详细用法参考如下示例","link":"cascader/events","component":" Cascader 级联选择器","findIntroStr":"当一个数据集合有清晰的层级结构时,可通过级联选择器逐级查看并选择。","demoId":"events1"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-attributes-demo.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-attributes-demo.json new file mode 100644 index 000000000..9f757ffa3 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-attributes-demo.json @@ -0,0 +1 @@ +[{"title":"属性配置示例","content":"

如果某属性加上去之后没有生效,很可能是没有引入相应的模块。例如:

\n

在使用 dataZoom 组件时,需要引入 dataZoom 模块资源 import 'echarts/lib/component/dataZoom'

\n
\n

1 设置区域缩放组件

\n

可通过 init-options 配置组件初始化附加参数,具体可参考文档

\n","link":"chart/props/demo10","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"props-demo10"},{"title":"1 设置区域缩放组件","content":"详细用法参考如下示例","link":"chart/props/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"props-base"},{"title":"2 设置extend配置项","content":"详细用法参考如下示例","link":"chart/props/demo12","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"props-demo12"},{"title":"3 修改颜色列表","content":"详细用法参考如下示例","link":"chart/props/demo4","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"props-demo4"},{"title":"4 设置暂无数据状态","content":"详细用法参考如下示例","link":"chart/props/demo5","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"props-demo5"},{"title":"5 增加自定义内容","content":"详细用法参考如下示例","link":"chart/props/demo6","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"props-demo6"},{"title":"6 隐藏提示框与图例","content":"详细用法参考如下示例","link":"chart/props/demo7","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"props-demo7"},{"title":"7 设置图表容器样式","content":"详细用法参考如下示例","link":"chart/props/demo8","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"props-demo8"},{"title":"8 设置图表标线与标点","content":"详细用法参考如下示例","link":"chart/props/demo9","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"props-demo9"},{"title":"9 设置视觉映射组件","content":"详细用法参考如下示例","link":"chart/props/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"props-demo2"},{"title":"10 设置afterConfig函数","content":"详细用法参考如下示例","link":"chart/props/demo11","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"props-demo11"},{"title":"11 设置工具箱","content":"详细用法参考如下示例","link":"chart/props/demo3","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"props-demo3"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-attributes.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-attributes.json new file mode 100644 index 000000000..fe51488c7 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-attributes.json @@ -0,0 +1 @@ +[] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-autonavi-map.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-autonavi-map.json new file mode 100644 index 000000000..0a077f791 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-autonavi-map.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。 高德地图需要外网访问权限才能正常使用\n

\n","link":"chart/amap/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"amap-base"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-baidu-map.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-baidu-map.json new file mode 100644 index 000000000..3193d6d09 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-baidu-map.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。\n 百度地图需要外网访问权限才能正常使用\n

\n","link":"chart/bmap/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"bmap-base"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-bar.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-bar.json new file mode 100644 index 000000000..46c5d2fcb --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-bar.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

\n","link":"chart/bar/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"bar-base"},{"title":"指定指标维度","content":"详细用法参考如下示例","link":"chart/bar/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"bar-demo2"},{"title":"排序条形图","content":"详细用法参考如下示例","link":"chart/bar/demo3","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"bar-demo3"},{"title":"条形轴配置双 y 轴","content":"详细用法参考如下示例","link":"chart/bar/demo4","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"bar-demo4"},{"title":"设置 legend 别名","content":"详细用法参考如下示例","link":"chart/bar/demo5","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"bar-demo5"},{"title":"堆叠条形图","content":"详细用法参考如下示例","link":"chart/bar/demo6","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"bar-demo6"},{"title":"设置纵轴为连续的数值轴","content":"详细用法参考如下示例","link":"chart/bar/demo7","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"bar-demo7"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-boxplot.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-boxplot.json new file mode 100644 index 000000000..bdd3d99f7 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-boxplot.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

Boxplot 中文可以称为『箱形图』、『盒须图』、『盒式图』、『盒状图』、『箱线图』,是一种用作显示一组数据分散情况资料的统计图。它能显示出一组数据的最大值、最小值、中位数、下四分位数及上四分位数。

\n","link":"chart/boxplot/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"boxplot-base"},{"title":"多数据显示","content":"

boxplot 提供数据转化方法 prepareBoxplotData 将源数据转化为 { axisData: [...], boxData: [...], outliers: [...] } 的格式化数据。

\n","link":"chart/boxplot/multiple","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"boxplot-multiple"},{"title":"垂直显示","content":"

通过 extend 属性实现 echarts 方式的配置。

\n","link":"chart/boxplot/vertical","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"boxplot-vertical"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-candle.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-candle.json new file mode 100644 index 000000000..a716651a2 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-candle.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

\n","link":"chart/candle/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"candle-base"},{"title":"使用简化的数据格式","content":"详细用法参考如下示例","link":"chart/candle/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"candle-demo2"},{"title":"设置数据格式","content":"详细用法参考如下示例","link":"chart/candle/demo3","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"candle-demo3"},{"title":"显示 MA, VOL","content":"详细用法参考如下示例","link":"chart/candle/demo4","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"candle-demo4"},{"title":"修改指标名和图例文字","content":"详细用法参考如下示例","link":"chart/candle/demo5","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"candle-demo5"},{"title":"修改 MA 显示周期","content":"详细用法参考如下示例","link":"chart/candle/demo6","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"candle-demo6"},{"title":"设置 dataRoom 控件","content":"详细用法参考如下示例","link":"chart/candle/demo7","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"candle-demo7"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-data-config.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-data-config.json new file mode 100644 index 000000000..fe51488c7 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-data-config.json @@ -0,0 +1 @@ +[] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-events.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-events.json new file mode 100644 index 000000000..cc0478fe3 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-events.json @@ -0,0 +1 @@ +[{"title":"事件监听","content":"

绑定事件通过传递一个事件名称和对应回调函数的对象实现,回调函数内的参数是 echarts 模块,可以据此做相应的处理。

\n

示例

\n","link":"chart/events/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"events-base"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-funnel.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-funnel.json new file mode 100644 index 000000000..a62693ebc --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-funnel.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

\n","link":"chart/funnel/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"funnel-base"},{"title":"指定指标维度","content":"详细用法参考如下示例","link":"chart/funnel/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"funnel-demo2"},{"title":"自动按照数值排序并过滤 0 值","content":"详细用法参考如下示例","link":"chart/funnel/demo3","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"funnel-demo3"},{"title":"定制顺序漏斗图","content":"详细用法参考如下示例","link":"chart/funnel/demo4","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"funnel-demo4"},{"title":"指定数据类型漏斗图","content":"详细用法参考如下示例","link":"chart/funnel/demo5","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"funnel-demo5"},{"title":"修改 legend 别名漏斗图","content":"详细用法参考如下示例","link":"chart/funnel/demo6","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"funnel-demo6"},{"title":"金字塔","content":"详细用法参考如下示例","link":"chart/funnel/demo7","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"funnel-demo7"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-gauge.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-gauge.json new file mode 100644 index 000000000..2de905fd3 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-gauge.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

\n","link":"chart/gauge/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"gauge-base"},{"title":"指标维度配置","content":"详细用法参考如下示例","link":"chart/gauge/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"gauge-demo2"},{"title":"设置数据类型","content":"详细用法参考如下示例","link":"chart/gauge/demo3","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"gauge-demo3"},{"title":"设置指标别名与单位","content":"详细用法参考如下示例","link":"chart/gauge/demo4","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"gauge-demo4"},{"title":"设置多表盘及修改样式","content":"详细用法参考如下示例","link":"chart/gauge/demo5","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"gauge-demo5"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-graph.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-graph.json new file mode 100644 index 000000000..ee37cdf23 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-graph.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

\n
\n

该图只支持 extend 配置,使用方式及属性和 eCharts 一致,请参考 eCharts 配置

\n
\n","link":"chart/graph/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"graph-base"},{"title":"笛卡尔坐标系上的 Graph","content":"详细用法参考如下示例","link":"chart/graph/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"graph-demo2"},{"title":"拓扑图的事件拓展","content":"详细用法参考如下示例","link":"chart/graph/demo3","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"graph-demo3"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-heatmap.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-heatmap.json new file mode 100644 index 000000000..691395a7c --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-heatmap.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

\n","link":"chart/heatmap/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"heatmap-base"},{"title":"配置坐标轴","content":"详细用法参考如下示例","link":"chart/heatmap/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"heatmap-demo2"},{"title":"自定义 visualMap","content":"详细用法参考如下示例","link":"chart/heatmap/demo3","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"heatmap-demo3"},{"title":"地图热力图","content":"详细用法参考如下示例","link":"chart/heatmap/demo4","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"heatmap-demo4"},{"title":"百度地图热力图","content":"

百度地图和高德地图需要外网访问权限才能正常使用\n

\n","link":"chart/heatmap/demo5","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"heatmap-demo5"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-histogram.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-histogram.json new file mode 100644 index 000000000..f53ef6d19 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-histogram.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

\n","link":"chart/histogram/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"histogram-base"},{"title":"设置显示的指标维度","content":"详细用法参考如下示例","link":"chart/histogram/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"histogram-demo2"},{"title":"设置双 y 轴","content":"详细用法参考如下示例","link":"chart/histogram/demo3","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"histogram-demo3"},{"title":"柱状图+折线图","content":"详细用法参考如下示例","link":"chart/histogram/demo4","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"histogram-demo4"},{"title":"堆叠柱状图","content":"详细用法参考如下示例","link":"chart/histogram/demo5","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"histogram-demo5"},{"title":"默认显示柱状图数据","content":"详细用法参考如下示例","link":"chart/histogram/demo6","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"histogram-demo6"},{"title":"修改别名","content":"详细用法参考如下示例","link":"chart/histogram/demo7","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"histogram-demo7"},{"title":"设置横轴为连续的数值轴","content":"详细用法参考如下示例","link":"chart/histogram/demo8","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"histogram-demo8"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-line.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-line.json new file mode 100644 index 000000000..a3fca2233 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-line.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

\n","link":"chart/line/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"line-base"},{"title":"设置显示的指标维度","content":"详细用法参考如下示例","link":"chart/line/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"line-demo2"},{"title":"设置双 y 轴","content":"详细用法参考如下示例","link":"chart/line/demo3","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"line-demo3"},{"title":"横坐标的倾斜","content":"详细用法参考如下示例","link":"chart/line/demo4","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"line-demo4"},{"title":"堆叠面积图","content":"详细用法参考如下示例","link":"chart/line/demo5","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"line-demo5"},{"title":"设置别名","content":"详细用法参考如下示例","link":"chart/line/demo6","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"line-demo6"},{"title":"显示指标数值","content":"详细用法参考如下示例","link":"chart/line/demo7","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"line-demo7"},{"title":"设置横轴为连续的数值轴","content":"详细用法参考如下示例","link":"chart/line/demo8","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"line-demo8"},{"title":"设置横轴为连续的时间轴","content":"详细用法参考如下示例","link":"chart/line/demo9","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"line-demo9"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-liquidfill.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-liquidfill.json new file mode 100644 index 000000000..1d51f79e1 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-liquidfill.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

\n","link":"chart/liquidfill/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"liquidfill-base"},{"title":"水球图分层","content":"详细用法参考如下示例","link":"chart/liquidfill/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"liquidfill-demo2"},{"title":"设置多个水球图","content":"详细用法参考如下示例","link":"chart/liquidfill/demo3","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"liquidfill-demo3"},{"title":"设置水球图的形状","content":"详细用法参考如下示例","link":"chart/liquidfill/demo4","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"liquidfill-demo4"},{"title":"水球图文字标签及样式设置","content":"详细用法参考如下示例","link":"chart/liquidfill/demo5","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"liquidfill-demo5"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-map.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-map.json new file mode 100644 index 000000000..71036e373 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-map.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"chart/map/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"map-base"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-pie.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-pie.json new file mode 100644 index 000000000..e85d7422d --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-pie.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

\n","link":"chart/pie/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"pie-base"},{"title":"设置指标维度","content":"详细用法参考如下示例","link":"chart/pie/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"pie-demo2"},{"title":"玫瑰图","content":"详细用法参考如下示例","link":"chart/pie/demo3","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"pie-demo3"},{"title":"限制显示条数饼图","content":"详细用法参考如下示例","link":"chart/pie/demo4","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"pie-demo4"},{"title":"多圆饼图","content":"详细用法参考如下示例","link":"chart/pie/demo5","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"pie-demo5"},{"title":"设置数据类型","content":"详细用法参考如下示例","link":"chart/pie/demo6","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"pie-demo6"},{"title":"设置饼图半径边距","content":"详细用法参考如下示例","link":"chart/pie/demo7","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"pie-demo7"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-question.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-question.json new file mode 100644 index 000000000..1cc597bb3 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-question.json @@ -0,0 +1 @@ +[{"title":"常见问题","content":"

父元素的初始宽度未知

\n

在一个初始宽度未知的容器内绘制图表时,因为无法获取宽度,所以图表会绘制失败,解决的办法是在容器宽度已知后,\n调用 echarts 的 resize 方法。\n通过 cancel-resize-check 是用于resize之前,检测组件元素是否存在,元素是否有宽高,没有则不resize。

\n","link":"chart/question/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"question-base"},{"title":"父元素的初始宽度未知","content":"详细用法参考如下示例","link":"chart/question/demo5","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"question-demo5"},{"title":"数据改变视图自动更新","content":"

图表是基于 Vue 开发的,同样支持 双向数据绑定,只要改变图表数据 (示例中的 chartData.row) 视图会自动更新。

\n","link":"chart/question/demo4","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"question-demo4"},{"title":"小数显示精度","content":"

处理数据类型时默认保留两位有效数字,但是当数字较小并设置为百分比类型时,这种方式会导致显示上的问题,例如:

\n","link":"chart/question/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"question-demo2"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-radar.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-radar.json new file mode 100644 index 000000000..9cdd377be --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-radar.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

\n","link":"chart/radar/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"radar-base"},{"title":"设置显示的指标维度","content":"详细用法参考如下示例","link":"chart/radar/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"radar-demo2"},{"title":"修改指标名称","content":"详细用法参考如下示例","link":"chart/radar/demo3","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"radar-demo3"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-ring.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-ring.json new file mode 100644 index 000000000..5d2557a97 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-ring.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

\n","link":"chart/ring/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"ring-base"},{"title":"设置指标维度","content":"详细用法参考如下示例","link":"chart/ring/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"ring-demo2"},{"title":"玫瑰图","content":"详细用法参考如下示例","link":"chart/ring/demo3","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"ring-demo3"},{"title":"限制显示条数环图","content":"详细用法参考如下示例","link":"chart/ring/demo4","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"ring-demo4"},{"title":"设置数据类型","content":"详细用法参考如下示例","link":"chart/ring/demo5","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"ring-demo5"},{"title":"设置环图半径","content":"详细用法参考如下示例","link":"chart/ring/demo6","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"ring-demo6"},{"title":"设置环图title的位置","content":"详细用法参考如下示例","link":"chart/ring/ring-title","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"ring-ring-title"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-sankey.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-sankey.json new file mode 100644 index 000000000..1eb34f943 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-sankey.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

\n","link":"chart/sankey/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"sankey-base"},{"title":"设置数据类型","content":"详细用法参考如下示例","link":"chart/sankey/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"sankey-demo2"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-scatter.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-scatter.json new file mode 100644 index 000000000..a81978837 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-scatter.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

\n","link":"chart/scatter/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"scatter-base"},{"title":"双维度多指标散点图示例","content":"详细用法参考如下示例","link":"chart/scatter/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"scatter-demo2"},{"title":"指标维度配置","content":"详细用法参考如下示例","link":"chart/scatter/demo3","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"scatter-demo3"},{"title":"数据类型配置","content":"详细用法参考如下示例","link":"chart/scatter/demo4","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"scatter-demo4"},{"title":"属性名配置","content":"详细用法参考如下示例","link":"chart/scatter/demo5","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"scatter-demo5"},{"title":"缩放配置","content":"详细用法参考如下示例","link":"chart/scatter/demo6","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"scatter-demo6"},{"title":"散点样式配置","content":"详细用法参考如下示例","link":"chart/scatter/demo7","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"scatter-demo7"},{"title":"散点出现覆盖时, 提示框可以改成通过坐标轴触发","content":"详细用法参考如下示例","link":"chart/scatter/demo8","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"scatter-demo8"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-sunburst.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-sunburst.json new file mode 100644 index 000000000..d7a809df3 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-sunburst.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

\n
\n

该图只支持 extend 配置,使用方式及属性和 eCharts 一致,请参考 eCharts 配置

\n
\n","link":"chart/sunburst/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"sunburst-base"},{"title":"复杂示例","content":"详细用法参考如下示例","link":"chart/sunburst/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"sunburst-demo2"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-tree.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-tree.json new file mode 100644 index 000000000..acb5916e7 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-tree.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

\n","link":"chart/tree/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"tree-base"},{"title":"多树图","content":"详细用法参考如下示例","link":"chart/tree/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"tree-demo2"},{"title":"径向树图","content":"详细用法参考如下示例","link":"chart/tree/demo3","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"tree-demo3"},{"title":"纵向树图","content":"详细用法参考如下示例","link":"chart/tree/demo4","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"tree-demo4"},{"title":"自定义提示框内容","content":"详细用法参考如下示例","link":"chart/tree/demo5","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"tree-demo5"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-waterfall.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-waterfall.json new file mode 100644 index 000000000..10a7375a3 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-waterfall.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

\n","link":"chart/waterfall/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"waterfall-base"},{"title":"设置指标维度","content":"详细用法参考如下示例","link":"chart/waterfall/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"waterfall-demo2"},{"title":"设置数据类型","content":"详细用法参考如下示例","link":"chart/waterfall/demo3","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"waterfall-demo3"},{"title":"修改指标名称","content":"详细用法参考如下示例","link":"chart/waterfall/demo4","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"waterfall-demo4"},{"title":"设置 总计、剩余 的名称","content":"详细用法参考如下示例","link":"chart/waterfall/demo5","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"waterfall-demo5"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart-wordcloud.json b/examples/docs/resources/pc/demo-config/zh-CN/chart-wordcloud.json new file mode 100644 index 000000000..fbe9c4ee9 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart-wordcloud.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。

\n","link":"chart/wordcloud/base","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"wordcloud-base"},{"title":"设置词云图的颜色","content":"详细用法参考如下示例","link":"chart/wordcloud/demo2","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"wordcloud-demo2"},{"title":"设置词云图的形状","content":"详细用法参考如下示例","link":"chart/wordcloud/demo3","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"wordcloud-demo3"},{"title":"设置词云图的字体大小范围","content":"详细用法参考如下示例","link":"chart/wordcloud/demo4","component":" Chart 图表","findIntroStr":"基于 eCharts 封装,一个纯 Javascript 的图表库。","demoId":"wordcloud-demo4"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/chart.json b/examples/docs/resources/pc/demo-config/zh-CN/chart.json new file mode 100644 index 000000000..28ead9d53 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/chart.json @@ -0,0 +1,10 @@ +[ + { + "title": "基本用法", + "content": "

图表组件支持 双向数据绑定,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE 9/10/11,Chrome,Firefox,Safari 等)底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。\n可通过 theme 自定义主题\n百度地图和高德地图需要外网访问权限才能正常使用\n

\n", + "link": "chart/base", + "component": " Chart 图表", + "findIntroStr": "基于 `eCharts v5.2.1` 封装,一个纯 Javascript 的图表库。", + "demoId": "base" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/checkbox.json b/examples/docs/resources/pc/demo-config/zh-CN/checkbox.json new file mode 100644 index 000000000..8bdd94403 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/checkbox.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"checkbox/basic-usage","component":" Checkbox 复选框","findIntroStr":"用于配置不同场景的选项,提供用户可在一组选项中进行多选。","demoId":"basic-usage"},{"title":"复选框组","content":"

通过 checkbox-group 元素把多个 checkbox 元素管理为一组,在 checkbox-group 中使用 v-model 绑定 Array 类型的变量即可实现双向绑定。 checkboxlabel 属性是其对应的值,若该标签中无内容,则该属性也充当 checkbox 后的介绍。label 与数组中的元素值相对应,如果存在指定的值则为选中状态,否则为不选中。

\n","link":"checkbox/checkbox-group","component":" Checkbox 复选框","findIntroStr":"用于配置不同场景的选项,提供用户可在一组选项中进行多选。","demoId":"checkbox-group"},{"title":"配置式复选框组","content":"

提供 options 属性,支持通过配置对象数组数据的形式来渲染多选框组。使用该属性后,可以不用再在标签中以插槽的形式插入 checkboxcheckbox-button 元素。\n\noptions 对象数组中包括三个字段:labeltextevents。\n\n另外还提供 type 属性,配合 options 属性一起使用,默认值为 checkbox。还可以配置为 button,配置后复选框组将以按钮的形式展示。

\n","link":"checkbox/group-options","component":" Checkbox 复选框","findIntroStr":"用于配置不同场景的选项,提供用户可在一组选项中进行多选。","demoId":"group-options"},{"title":"全选与半选","content":"

checkbox 元素中配置 indeterminate 属性为 true 后,勾选框将展示为半选的样式。

\n","link":"checkbox/indeterminate","component":" Checkbox 复选框","findIntroStr":"用于配置不同场景的选项,提供用户可在一组选项中进行多选。","demoId":"indeterminate"},{"title":"可选数量限制","content":"

checkbox-group 上可通过 minmax 属性指定可勾选项目的最小、最大值。

\n","link":"checkbox/min-max","component":" Checkbox 复选框","findIntroStr":"用于配置不同场景的选项,提供用户可在一组选项中进行多选。","demoId":"min-max"},{"title":"当前是否勾选","content":"

checked 当前是否勾选,通过 disabled 设置组件是否禁用。

\n","link":"checkbox/checked","component":" Checkbox 复选框","findIntroStr":"用于配置不同场景的选项,提供用户可在一组选项中进行多选。","demoId":"checked"},{"title":"按钮形式复选框","content":"

checkbox-group 元素中嵌入 checkbox-button 即可实现按钮形式的复选框组。\n通过 fill 按钮形式的 Checkbox 激活时的填充色和边框色,默认值为:#409EFF。

\n","link":"checkbox/checkbox-button","component":" Checkbox 复选框","findIntroStr":"用于配置不同场景的选项,提供用户可在一组选项中进行多选。","demoId":"checkbox-button"},{"title":"垂直布局","content":"

checkbox-group 元素上设置 vertical 为 true,则其管理的 checkbox-buttoncheckbox 将展示为垂直布局。

\n","link":"checkbox/vertical-checkbox","component":" Checkbox 复选框","findIntroStr":"用于配置不同场景的选项,提供用户可在一组选项中进行多选。","demoId":"vertical-checkbox"},{"title":"动态生成复选框组","content":"

复选框组所需数据可通过请求服务从后台取得,然后动态生成。

\n","link":"checkbox/dynamic-create-checkbox","component":" Checkbox 复选框","findIntroStr":"用于配置不同场景的选项,提供用户可在一组选项中进行多选。","demoId":"dynamic-create-checkbox"},{"title":"内容超出时的提示信息","content":"

若复选框后的介绍文字超出时,可以通过 Tooltip 组件增加提示信息,鼠标悬停时可提示所有内容。\n\n在 checkbox 元素上配置 border 属性为 true,可显示边框。

\n","link":"checkbox/content-overflow","component":" Checkbox 复选框","findIntroStr":"用于配置不同场景的选项,提供用户可在一组选项中进行多选。","demoId":"content-overflow"},{"title":"文本","content":"

text 属性设置文本内容\n通过 true-label 设置选中的值, false-label 设置未选中的值。

\n","link":"checkbox/text","component":" Checkbox 复选框","findIntroStr":"用于配置不同场景的选项,提供用户可在一组选项中进行多选。","demoId":"text"},{"title":"文本选择","content":"

通过 true-label 设置选中的值, false-label 设置未选中的值。

\n","link":"checkbox/button-chek-box","component":" Checkbox 复选框","findIntroStr":"用于配置不同场景的选项,提供用户可在一组选项中进行多选。","demoId":"button-chek-box"},{"title":"尺寸","content":"

当复选框为按钮形式时,通过 size 属性可以设置按钮复选框的尺寸,可选项有 medium、small、mini。\n\n在 checkbox-button 上设置 disabled 属性,将禁用某一个复选按钮,若在 checkbox-group 标签上配置 disabled 属性,则禁用所有复选按钮。

\n","link":"checkbox/with-border","component":" Checkbox 复选框","findIntroStr":"用于配置不同场景的选项,提供用户可在一组选项中进行多选。","demoId":"with-border"},{"title":"事件","content":"

勾选值改变后将触发 change 事件。

\n","link":"checkbox/checkbox-events","component":" Checkbox 复选框","findIntroStr":"用于配置不同场景的选项,提供用户可在一组选项中进行多选。","demoId":"checkbox-events"},{"title":"插槽","content":"

Checkbox 的内容

\n","link":"checkbox/checkbox-slot","component":" Checkbox 复选框","findIntroStr":"用于配置不同场景的选项,提供用户可在一组选项中进行多选。","demoId":"checkbox-slot"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/collapse.json b/examples/docs/resources/pc/demo-config/zh-CN/collapse.json new file mode 100644 index 000000000..e97d6c3ea --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/collapse.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"collapse/basic-usage","component":" Collapse 折叠面板","findIntroStr":"内容区可指定动态页面或自定义 html 等,支持展开收起操作。","demoId":"basic-usage"},{"title":"手风琴效果","content":"

配置 accordion 属性为 true 后,折叠面板将展示手风琴效果。\n配置 v-model 设置当前激活的面板(如果是手风琴模式,绑定值类型需要为 string ,否则为 array )\nchange 事件,在当前激活面板改变时触发,参数为当前的 value 值\n配置 name 属性作为每个 collapse-item 的唯一标志符

\n","link":"collapse/accordion","component":" Collapse 折叠面板","findIntroStr":"内容区可指定动态页面或自定义 html 等,支持展开收起操作。","demoId":"accordion"},{"title":"禁用状态","content":"

collapse-item 元素上配置 disabled 属性为 true 后,将禁用指定的折叠面板项。

\n","link":"collapse/dynamic-disable","component":" Collapse 折叠面板","findIntroStr":"内容区可指定动态页面或自定义 html 等,支持展开收起操作。","demoId":"dynamic-disable"},{"title":"自定义面板标题","content":"

collapse-item 元素上配置 title 属性可以指定每个折叠面板项的标题。但同时也可以通过 title 插槽的方式自定义面板标题,比如在标题前增加图标。

\n","link":"collapse/custom-collapse-title","component":" Collapse 折叠面板","findIntroStr":"内容区可指定动态页面或自定义 html 等,支持展开收起操作。","demoId":"custom-collapse-title"},{"title":"自定义展开折叠图标","content":"

collapse-item 元素上可以通过 icon 插槽的方式自定义展开折叠 icon 图标。

\n","link":"collapse/custom-collapse-icon","component":" Collapse 折叠面板","findIntroStr":"内容区可指定动态页面或自定义 html 等,支持展开收起操作。","demoId":"custom-collapse-icon"},{"title":"折叠面板事件","content":"

激活面板的值改变时将触发 change 事件。

\n","link":"collapse/collapse-events","component":" Collapse 折叠面板","findIntroStr":"内容区可指定动态页面或自定义 html 等,支持展开收起操作。","demoId":"collapse-events"},{"title":"阻止折叠面板关闭事件","content":"

:before-close 折叠面板关闭前事件,方法里面return true/false,表示是否可以关闭

\n","link":"collapse/block-close","component":" Collapse 折叠面板","findIntroStr":"内容区可指定动态页面或自定义 html 等,支持展开收起操作。","demoId":"block-close"},{"title":"嵌套表格","content":"

通过 collapse-item 元素的默认插槽嵌入表格。

\n","link":"collapse/nested-grid","component":" Collapse 折叠面板","findIntroStr":"内容区可指定动态页面或自定义 html 等,支持展开收起操作。","demoId":"nested-grid"},{"title":"嵌套表单","content":"

通过 collapse-item 元素的默认插槽嵌入表单。

\n","link":"collapse/nested-form","component":" Collapse 折叠面板","findIntroStr":"内容区可指定动态页面或自定义 html 等,支持展开收起操作。","demoId":"nested-form"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/color.json b/examples/docs/resources/pc/demo-config/zh-CN/color.json new file mode 100644 index 000000000..822add3f8 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/color.json @@ -0,0 +1 @@ +[{"title":"主色彩","content":"详细用法参考如下示例","link":"color/main-color","component":" Color 色彩","findIntroStr":"Color 色彩","demoId":"main-color"},{"title":"辅助色","content":"详细用法参考如下示例","link":"color/auxiliary-color","component":" Color 色彩","findIntroStr":"Color 色彩","demoId":"auxiliary-color"},{"title":"中性色","content":"详细用法参考如下示例","link":"color/neutral-color","component":" Color 色彩","findIntroStr":"Color 色彩","demoId":"neutral-color"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/company.json b/examples/docs/resources/pc/demo-config/zh-CN/company.json new file mode 100644 index 000000000..8e669f997 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/company.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"company/basic-usage","component":" Company 公司","findIntroStr":"Company 公司组件,用于公司名称展示及选择,通过配置数据源获取选项。","demoId":"basic-usage"},{"title":"自定义数据显示数量","content":"

可通过 max 属性设置下拉框最大显示的数据条数。clearable 是否显示清除按钮,默认为 true 。

\n","link":"company/custom-show-num","component":" Company 公司","findIntroStr":"Company 公司组件,用于公司名称展示及选择,通过配置数据源获取选项。","demoId":"custom-show-num"},{"title":"自定义服务","content":"

通过 fetch-company 属性可以指定一个方法,在方法中可实现请求自定义的服务。

\n","link":"company/custom-service","component":" Company 公司","findIntroStr":"Company 公司组件,用于公司名称展示及选择,通过配置数据源获取选项。","demoId":"custom-service"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/container.json b/examples/docs/resources/pc/demo-config/zh-CN/container.json new file mode 100644 index 000000000..9b7931e04 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/container.json @@ -0,0 +1 @@ +[{"title":"默认布局","content":"详细用法参考如下示例","link":"container/basic-usage","component":" Container 版型","findIntroStr":"用于布局的容器组件,方便快速搭建页面的版型。","demoId":"basic-usage"},{"title":"简约布局","content":"详细用法参考如下示例","link":"container/simple","component":" Container 版型","findIntroStr":"用于布局的容器组件,方便快速搭建页面的版型。","demoId":"simple"},{"title":"经典布局","content":"详细用法参考如下示例","link":"container/classic","component":" Container 版型","findIntroStr":"用于布局的容器组件,方便快速搭建页面的版型。","demoId":"classic"},{"title":"时尚布局","content":"详细用法参考如下示例","link":"container/fashion","component":" Container 版型","findIntroStr":"用于布局的容器组件,方便快速搭建页面的版型。","demoId":"fashionid"},{"title":"传奇布局","content":"详细用法参考如下示例","link":"container/legend","component":" Container 版型","findIntroStr":"用于布局的容器组件,方便快速搭建页面的版型。","demoId":"legend"},{"title":"自定义宽度和高度","content":"

Container 布局容器支持用户通过设置 headerHeightfooterHeightasideWidth 等属性来控制 header(头部区域)footer(底部区域) 的高度和 aside(左侧区域) 的宽度。main(主体区域) 的宽度和高度是自适应的。

\n","link":"container/custom-with-height","component":" Container 版型","findIntroStr":"用于布局的容器组件,方便快速搭建页面的版型。","demoId":"custom-with-height"},{"title":"版型切换","content":"详细用法参考如下示例","link":"container/custom-container","component":" Container 版型","findIntroStr":"用于布局的容器组件,方便快速搭建页面的版型。","demoId":"custom-container"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/country.json b/examples/docs/resources/pc/demo-config/zh-CN/country.json new file mode 100644 index 000000000..0cf40dc52 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/country.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"country/basic-usage","component":" Country 国家/地区","findIntroStr":"Country 国家/地区组件,用于国家/地区名称展示及选择,通过配置数据源获取选项。","demoId":"basic-usage"},{"title":"自定义服务","content":"

通过 fetch-country 属性可以指定一个方法,在方法中可实现请求自定义的服务。 clearable 设置是否可清空,默认值为 true。

\n","link":"country/custom-service","component":" Country 国家/地区","findIntroStr":"Country 国家/地区组件,用于国家/地区名称展示及选择,通过配置数据源获取选项。","demoId":"custom-service"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/credit-card-form.json b/examples/docs/resources/pc/demo-config/zh-CN/credit-card-form.json new file mode 100644 index 000000000..6bfa4433b --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/credit-card-form.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"credit-card-form/basic-usage","component":" CreditCardForm 信用卡表单","findIntroStr":"通过表单输入实时改变信用卡卡片的相关信息。","demoId":"basic-usage"},{"title":"背景图片","content":"

通过 background-image 设置信用卡背景图片。

\n","link":"credit-card-form/background-image","component":" CreditCardForm 信用卡表单","findIntroStr":"通过表单输入实时改变信用卡卡片的相关信息。","demoId":"background-image"},{"title":"事件","content":"详细用法参考如下示例","link":"credit-card-form/credit-card-form-events","component":" CreditCardForm 信用卡表单","findIntroStr":"通过表单输入实时改变信用卡卡片的相关信息。","demoId":"credit-card-form-events"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/crop.json b/examples/docs/resources/pc/demo-config/zh-CN/crop.json new file mode 100644 index 000000000..cbb6bd128 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/crop.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

通过 src 属性设置默认裁剪的图片源路径,并通过 cropvisible 属性来控制裁剪弹框是否可见。

\n","link":"crop/basic-usage","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"basic-usage"},{"title":"裁剪框宽高比","content":"

通过 aspect-ratio 属性可以设置裁剪框的宽高比例,默认为 16 / 9 。还可以通过调用 setAspectRatio 方法来设置裁切框的宽高比。\n通过 center 属性可以设置裁剪框是否在图片正中心。

\n","link":"crop/aspect-ratio","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"aspect-ratio"},{"title":"裁剪框最小宽高","content":"

通过属性 min-crop-box-widthmin-crop-box-height 设置裁剪框最小宽高。设置后,调整裁剪框宽高时,调整到最小值后将不能再调整。\n通过属性 mmin-container-widthmin-container-height 设置容器的最小宽度,最小高度。

\n","link":"crop/min-crop-box-width-height","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"min-crop-box-width-height"},{"title":"不显示网格背景","content":"

设置 background 属性为 false 后,将不显示容器的网格背景。

\n","link":"crop/no-background","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"no-background"},{"title":"不显示虚线","content":"

设置 guides 属性为 false 将取消裁剪框上方的虚线显示。

\n","link":"crop/no-guides","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"no-guides"},{"title":"不显示模态","content":"

设置 modal 属性为 false 将取消裁剪框下方图片上方的模态层显示。

\n","link":"crop/no-modal","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"no-modal"},{"title":"视图模式","content":"

通过 view-mode 属性可以设置裁剪框的视图模式,有 0123 四种选项,默认为 0

\n

view-mode 选项说明

\n

0:裁剪框可以移动到图片外面。\n1:裁剪框只能在图片内移动。\n2:图片不全部铺满容器,缩小时可以有一边出现空隙。\n3:图片填充整个容器。

\n
\n","link":"crop/view-mode","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"view-mode"},{"title":"拖拽模式","content":"

通过 drag-mode 属性可以设置裁剪框的拖拽模式,有 cropmovenone 三种选项,默认为 crop

\n

drag-mode 选项说明

\n

crop:当裁剪框取消后,按住鼠标左键在图片区域拖拽,将产生一个新的裁剪框。\nmove:当裁剪框取消后,按住鼠标左键将移动图片。\nnone:当裁剪框取消后,不能裁剪、也不能移动图片。\nmovable 控制图片是否可以移动,默认为 true。

\n
\n","link":"crop/drag-mode","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"drag-mode"},{"title":"自动裁剪面积","content":"

初始化时,通过属性 auto-crop-area 可以设置裁剪框自动裁剪的面积,默认为 0.8,在 auto-crop 属性为 true 时生效。

\n","link":"crop/auto-crop-area","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"auto-crop-area"},{"title":"获取容器数据","content":"

调用 getContainerData 方法可以获取容器的大小数据。

\n","link":"crop/get-container-data","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"get-container-data"},{"title":"获取剪切框数据","content":"

调用 getCropBoxData 方法可以获取剪切框的位置和大小数据。

\n","link":"crop/get-crop-box-data","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"get-crop-box-data"},{"title":"获取裁剪后的图片数据","content":"

调用 getCroppedCanvas 方法可以获取裁剪后的图片数据,搭配 toDataURL 方法将转成 base64 图片数据,搭配 toBlob 方法将生成 Blob 图片数据。

\n","link":"crop/get-cropped-canvas","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"get-cropped-canvas"},{"title":"获取裁剪区域数据","content":"

调用 getData 方法可以获取裁剪区域的位置以及大小。

\n","link":"crop/get-data","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"get-data"},{"title":"获取图像数据","content":"

调用 getImageData 方法可以获取图像位置、大小和其他相关数据,若想获取画布位置和大小数据可以调用 getCanvasData 方法。

\n","link":"crop/get-image-data","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"get-image-data"},{"title":"替换图片","content":"

调用 replace 方法可以替换图像的 src 并重新构建 cropper 。 通过 rotatable 属性控制图片旋转,默认为 true 。

\n","link":"crop/replace-image","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"replace-image"},{"title":"放大图片","content":"详细用法参考如下示例","link":"crop/replace-image","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"replace-image1"},{"title":"鼠标滚轮缩放图像时比例","content":"

zoom-on-wheel 属性为 true 情况下,通过 wheel-zoom-ratio 属性可以设置缩放比例,默认为 0.1

\n","link":"crop/wheel-zoom-ratio","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"wheel-zoom-ratio"},{"title":"禁用鼠标滚轮缩放图像","content":"

设置 zoom-on-wheel 属性为 false 后,将不允许通过滚动鼠标滚轮来缩放图像。

\n","link":"crop/zoom-on-wheel","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"zoom-on-wheel"},{"title":"ready 事件","content":"

当一个 cropper 实例完全构建时触发 ready 事件。

\n","link":"crop/event-ready","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"event-ready"},{"title":"裁剪框方法 事件","content":"

当一个 cropper 实例完全构建时触发 disable 方法禁用裁剪框,当触发 enable 启用裁剪框

\n","link":"crop/crop-meth","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"crop-meth"},{"title":"裁剪相关事件","content":"

TIP

\n

说明当画布或剪切框开始发生变化时触发 cropstart 事件\n当画布或剪切框正在发生变化时触发 cropmove 事件\n当画布或剪切框发生变化结束时触发 cropend 事件\n当画布或裁剪框发生改变时触发 crop 事件\n通过触发 getCanvasData 获取画布 Canvas(图像包装器)位置和大小数据

\n
\n","link":"crop/event-about-crop","component":" Crop 图片裁剪","findIntroStr":"Crop 图像裁切,可预览,支持 JPG 和 PNG 格式,浏览图像可以手动调整选择头像区域。","demoId":"event-about-crop"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/currency.json b/examples/docs/resources/pc/demo-config/zh-CN/currency.json new file mode 100644 index 000000000..d0fb98f0a --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/currency.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"currency/basic-usage","component":" Currency 币种","findIntroStr":"Currency 币种组件,用于货币名称展示及选择,通过配置数据源获取选项。","demoId":"basic-usage"},{"title":"禁用","content":"

通过 disabled 属性设置组件是否禁用,默认值为 false。

\n","link":"currency/disable-currency","component":" Currency 币种","findIntroStr":"Currency 币种组件,用于货币名称展示及选择,通过配置数据源获取选项。","demoId":"disable-currency"},{"title":"自定义服务","content":"

通过 fetch-currency 属性可以指定一个方法,在方法中可实现请求自定义的服务。\n通过 clearable 属性设置是否可以清空,默认值为 true。

\n","link":"currency/custom-service","component":" Currency 币种","findIntroStr":"Currency 币种组件,用于货币名称展示及选择,通过配置数据源获取选项。","demoId":"custom-service"},{"title":"设置组件大小","content":"

可设置为:mediumsmallmini

\n","link":"currency/size","component":" Currency 币种","findIntroStr":"Currency 币种组件,用于货币名称展示及选择,通过配置数据源获取选项。","demoId":"size"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/date-picker.json b/examples/docs/resources/pc/demo-config/zh-CN/date-picker.json new file mode 100644 index 000000000..91b603422 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/date-picker.json @@ -0,0 +1,218 @@ +[ + { + "title": "基本用法", + "content": "详细用法参考如下示例", + "link": "date-picker/basic-usage", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "basic-usage" + }, + { + "title": "选择日带快捷选项", + "content": "

通过 picker-options 属性,该属性是一个对象,在其中指定 shortcuts 对象数组可以设置快捷选项。同时可以根据需要设置 disabledDate 方法禁用日期。

\n", + "link": "date-picker/date-shortcuts", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "date-shortcuts" + }, + { + "title": "其他日期单位", + "content": "

通过 type 属性可以设置不同的日期单位,如下示例中配置的有 week、year、month、dates。

\n", + "link": "date-picker/other-picker-type", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "other-picker-type" + }, + { + "title": "时区选择", + "content": "

通过 show-timezone 属性可以设置日期选择面板时区选择,同时需要引入 timezoneData 时区数据

\n", + "link": "date-picker/timezone", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "timezone" + }, + { + "title": "选择日期范围", + "content": "

设置 type 属性为 daterange,可以设置以日期范围的形式进行选择。\n通过 onPick 获取选中日期后会执行的回调,需要与 daterangedatetimerange 才生效,需要配置在 picker-options 中。

\n", + "link": "date-picker/date-range", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "date-range" + }, + { + "title": "日期范围快捷选项", + "content": "

通过 picker-options 对象设置日期范围快捷选项。\n通过 firstDayOfWeek 周起始日,该属性可选值为 1 到 7,默认值为 7。

\n", + "link": "date-picker/date-range-shortcuts", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "date-range-shortcuts" + }, + { + "title": "日期范围默认时刻", + "content": "

使用 datetimerange 设置日期范围时,可以通过 default-time 属性设置起始与结束的时刻,默认是选定日期的 00:00:00 作为起始与结束的时刻。default-time 接受一个数组,数组的每一项都为一个字符串,第一项控制起始日期的时刻,第二项控制结束日期的时刻。

\n", + "link": "date-picker/default-time-of-range", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "default-time-of-range" + }, + { + "title": "选择月份范围", + "content": "

设置 type 属性为 monthrange,可以设置以月份范围的形式进行选择。

\n", + "link": "date-picker/month-range", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "month-range" + }, + { + "title": "月份范围快捷选项", + "content": "

同样通过 picker-options 对象设置月份范围快捷选项。

\n", + "link": "date-picker/month-range-shortcuts", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "month-range-shortcuts" + }, + { + "title": "只读", + "content": "

通过 readonly 属性设置日历组件是否只读。

\n", + "link": "date-picker/readonly", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "readonly" + }, + { + "title": "最大最小值", + "content": "

配置 picker-options 属性,在对象中的 disabledDate 方法中根据日期进行判断来禁用指定的日期段,通过这种方式来实现最大最小值。

\n", + "link": "date-picker/max-min", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "max-min" + }, + { + "title": "对齐方式", + "content": "

通过 align 属性可以设置日期选择面板与输入框之间的对齐方式,可选值有 left、right、center,默认为 left 左对齐。

\n", + "link": "date-picker/align", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "align" + }, + { + "title": "尺寸设置", + "content": "

通过 size 属性可以设置日期输入框的尺寸,可选值有 medium、small、mini。

\n", + "link": "date-picker/set-size", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "set-size" + }, + { + "title": "清除输入", + "content": "

选择日期后,鼠标悬停在输入框时,默认会显示清除图标,单击图标可以清除输入框内容。设置 clearable 属性为 false 后,则不显示清除图标,不可清除。通过 clear-icon 属性可以自定义清除图标。

\n", + "link": "date-picker/about-clear", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "about-clear" + }, + { + "title": "格式化相关", + "content": "

通过 format 属性设置输入框的格式,value-format 属性设置绑定值的格式。Date Format 属性列表

", + "link": "date-picker/about-format", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "about-format" + }, + { + "title": "timeFormat格式化", + "content": "

通过 time-format 属性设置日期选择面板的时间显示格式

", + "link": "date-picker/time-format", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "time-format" + }, + { + "title": "自定义后置图标", + "content": "

通过 suffix-icon 属性设置日期输入框后置图标,从 @opentiny/vue-icon 中导入一个图标并进行初始化后传给 suffix-icon

\n", + "link": "date-picker/custom-suffix-icon", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "custom-suffix-icon" + }, + { + "title": "自定义下拉框的类名", + "content": "详细用法参考如下示例", + "link": "date-picker/custom-suffix-icon", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "custom-suffix-icon1" + }, + { + "title": "范围选择自定义相关", + "content": "

范围选择时,start-placeholderend-placeholder 属性可分别指定开始日期和结束日期输入框的占位符。range-separator 属性指定开始日期和结束日期输入框之间的分隔符。

\n", + "link": "date-picker/custom-range", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "custom-range" + }, + { + "title": "范围选择取消面板联动", + "content": "

范围选择时,默认情况下,在开始日期面板中单击上一月或上一年箭头图标时,结束日期面板中日期也联动切换到上一月或上一年。在结束日期面板中切换下一月或下一年时,开始日期面板也随之联动。但若配置 unlink-panels 属性为 true ,面板之间就不再联动,切换年月时只对当前面板生效。

\n", + "link": "date-picker/unlink-panels", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "unlink-panels" + }, + { + "title": "选择器打开时默认时间设置", + "content": "

default-value 属性指定日期选择器面板打开时默认选中的日期。

\n", + "link": "date-picker/default-value", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "default-value" + }, + { + "title": "文本框不可输入", + "content": "

日期输入框默认可以输入日期,设置 editable 为 false 后,将不能输入。

\n", + "link": "date-picker/editable", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "editable" + }, + { + "title": "事件", + "content": "

主要事件有 change、blur、focus。

\n", + "link": "date-picker/date-picker-events", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "date-picker-events" + }, + { + "title": "获取焦点", + "content": "

通过 focus 方法设置使 input 获取焦点。

\n", + "link": "date-picker/focus", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "focus" + }, + { + "title": "箭头按钮控制时间选择", + "content": "

type 为 datetime、datetimerange 时,设置 time-arrow-control 属性为 true,在时间面板中将显示箭头按钮,通过箭头按钮控制时间选择。默认为滚动选择时间。

\n", + "link": "date-picker/time-arrow-control", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "time-arrow-control" + }, + { + "title": "不触发表单校验", + "content": "

日期选择器在输入时默认会触发表单校验,触发方式有 blur、change。但若设置 validate-event 属性为 false,将不再触发表单校验。

\n", + "link": "date-picker/validate-event", + "component": " DatePicker 日期选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "validate-event" + }, + { + "title": "设置是否显示为东八区时间", + "content": "

通过 isutc8 属性可以设置是否显示为东八区时间

\n", + "link": "date-picker/utc8", + "component": " DatePicker 海外显示东八区时间", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "utc8" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/dept.json b/examples/docs/resources/pc/demo-config/zh-CN/dept.json new file mode 100644 index 000000000..4b2f16d3b --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/dept.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"dept/basic-usage","component":" Dept 部门","findIntroStr":"部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。","demoId":"basic-usage"},{"title":"open 和 change 事件","content":"详细用法参考如下示例","link":"dept/dept-events","component":" Dept 部门","findIntroStr":"部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。","demoId":"dept-events"},{"title":"selected 事件","content":"详细用法参考如下示例","link":"dept/dept-selected","component":" Dept 部门","findIntroStr":"部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。","demoId":"dept-selected"},{"title":"close 事件","content":"详细用法参考如下示例","link":"dept/dept-close","component":" Dept 部门","findIntroStr":"部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。","demoId":"dept-close"},{"title":"confirm 事件","content":"详细用法参考如下示例","link":"dept/dept-confirm","component":" Dept 部门","findIntroStr":"部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。","demoId":"dept-confirm"},{"title":"cancel 事件","content":"详细用法参考如下示例","link":"dept/dept-cancel","component":" Dept 部门","findIntroStr":"部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。","demoId":"dept-cancel"},{"title":"设置组件大小","content":"

可以设置为:mediumsmallmini

\n","link":"dept/size","component":" Dept 部门","findIntroStr":"部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。","demoId":"size"},{"title":"阻止弹框关闭","content":"

before-confirm(确认前回调事件),方法里面 return true/false,表示是否关闭弹框

\n","link":"dept/before-confirm","component":" Dept 部门","findIntroStr":"部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。","demoId":"before-confirm"},{"title":"部门信息自动选中","content":"

auto-select 默认值为 true,配置该属性为 false 可以阻止当部门信息仅一个时自动补全选中行为。

\n","link":"dept/auto-select","component":" Dept 部门","findIntroStr":"部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。","demoId":"auto-select"},{"title":"自定义服务数据","content":"

提供 fetch-dept-by-valuefetch-deptfetch-dept-list 属性用于自定义部门服务。

\n","link":"dept/custom-service","component":" Dept 部门","findIntroStr":"部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。","demoId":"custom-service"},{"title":"禁用","content":"

可通过 disabled 设置是否禁用,默认为 fase

\n","link":"dept/dynamic-disable","component":" Dept 部门","findIntroStr":"部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。","demoId":"dynamic-disable"},{"title":"设置弹出框标题","content":"

自定义弹出框标题,该属性默认值为空。

\n","link":"dept/title","component":" Dept 部门","findIntroStr":"部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。","demoId":"title"},{"title":"权签人插槽","content":"详细用法参考如下示例","link":"dept/slot-hrapprover","component":" Dept 部门","findIntroStr":"部门组件用于华为部门查询、选择,可以指定默认值为当前登录用户所在部门。","demoId":"slot-hrapprover"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/detail-page.json b/examples/docs/resources/pc/demo-config/zh-CN/detail-page.json new file mode 100644 index 000000000..567d4b025 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/detail-page.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

在数据对象中可设置 hidden: true 来指定默认隐藏的数据。

\n","link":"detail-page/basic-usage","component":" DetailPage 表头详情栏","findIntroStr":"DetailPage 带表头的详情栏组件。","demoId":"basic-usage"},{"title":"自定义展示文本","content":"

通过 titletext-splitdialog-titlelabel-titlevalue-titletipssave-buttoncancel-button 这些属性可指定表头详情栏组件不同位置的展示文本。

\n","link":"detail-page/custom-show-text","component":" DetailPage 表头详情栏","findIntroStr":"DetailPage 带表头的详情栏组件。","demoId":"custom-show-text"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/dialog-box.json b/examples/docs/resources/pc/demo-config/zh-CN/dialog-box.json new file mode 100644 index 000000000..15b973c2d --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/dialog-box.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"dialog-box/basic-usage","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"basic-usage"},{"title":"二级弹窗","content":"

通过 default 默认插槽和底部操作区按钮实现二级弹窗。设置 append-to-body 属性后,二级弹窗的实体 DOM 结构将追加到 body 元素上。

\n","link":"dialog-box/secondary-dialog","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"secondary-dialog"},{"title":"自定义标题","content":"

title 属性可以设置弹窗标题外,还可以通过 title 插槽自定义弹窗标题区的内容。

\n","link":"dialog-box/custom-dialog-title","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"custom-dialog-title"},{"title":"自定义内容","content":"

通过 default 默认插槽自定义弹窗主体部分的内容。

\n","link":"dialog-box/custom-dialog-content","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"custom-dialog-content"},{"title":"自定义底部","content":"

通过 footer 插槽自定义弹窗底部操作区内容。

\n","link":"dialog-box/custom-dialog-footer","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"custom-dialog-footer"},{"title":"隐藏关闭按钮","content":"

默认弹窗右上角会显示关闭图标,单击可以关闭弹窗。若设置 show-close 为 false 后,将隐藏关闭图标,要实现关闭弹窗的功能可以通过底部操作区按钮的 click 事件切换 visible 属性的值为 false 。

\n","link":"dialog-box/hidden-close-buttons","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"hidden-close-buttons"},{"title":"禁用 ESC 关闭","content":"

默认弹窗打开后,可以按下 Esc 键关闭弹窗,设置 close-on-press-escape 为 false 后将禁用该功能。

\n","link":"dialog-box/close-on-press-escape","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"close-on-press-escape"},{"title":"弹窗距离顶部的高度","content":"

通过 top 属性指定弹窗距离窗口顶部的高度,默认为屏高的 15% 。

\n","link":"dialog-box/dialog-top-height","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"dialog-top-height"},{"title":"弹窗的宽度","content":"

通过 width 属性指定弹窗的宽度。

\n","link":"dialog-box/dialog-width","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"dialog-width"},{"title":"点击遮罩时不关闭弹窗","content":"

默认弹窗打开后,可以单击遮罩层关闭弹窗,设置 close-on-click-modal 为 false 后将禁用该功能。

\n","link":"dialog-box/close-on-click-modal","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"close-on-click-modal"},{"title":"不启用遮罩层","content":"

默认弹窗打开时会显示遮罩层,设置 modal 为 false 后将不启用遮罩层。无遮罩层时,单击弹窗外部区域仍然可以关闭弹窗。

\n","link":"dialog-box/no-modal","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"no-modal"},{"title":"右侧弹窗","content":"

设置 right-slide 属性为 true 后,弹窗将从窗口右侧弹出。\n设置 modal-append-to-body 属性默认为 true 遮罩层应用在 body 上。

\n","link":"dialog-box/right-dialog","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"right-dialog"},{"title":"隐藏标题区域","content":"

弹窗默认有标题区域,设置 show-header 为 false 后,将隐藏标题区域。

\n","link":"dialog-box/hidden-header","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"hidden-header"},{"title":"弹出时禁用滚动","content":"

弹窗弹出后,背景页面默认仍然是不可以滚动的,设置 lock-scroll 为 fasle 后将不锁定被遮罩内容的滚动。

\n","link":"dialog-box/lock-scroll","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"lock-scroll"},{"title":"头部和底部水平居中","content":"

头部标题默认显示在区域左侧,设置 center 为 true 后,将居中显示。

\n","link":"dialog-box/center","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"center"},{"title":"可拖拽的弹窗","content":"

默认弹窗不可拖拽,设置 draggable 属性为 true 后,鼠标移入标题区域单击可拖拽,拖拽事件有 @drag-startdrag-movedrag-end

\n","link":"dialog-box/draggable","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"draggable"},{"title":"全屏弹窗","content":"

设置 fullscreen 属性为 true 可显示全屏弹窗,默认弹窗宽度是 500px,此时设置宽度是不生效的。

\n","link":"dialog-box/fullscreen","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"fullscreen"},{"title":"弹出与关闭事件","content":"

open :对话框打开时触发,opened :对话框打开动画结束时触发,close :对话框关闭时触发,closed :对话框关闭动画结束时触发。

\n","link":"dialog-box/open-close-events","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"open-close-events"},{"title":"弹窗表单","content":"

通过 default 默认插槽实现嵌套表单以及表单提交的逻辑。

\n

默认关闭弹窗的时候重置表单,设置is-form-reset 为false,则关闭弹窗的时候不重置表格

","link":"dialog-box/form-in-dialog","component":" DialogBox 对话框","findIntroStr":"模态对话框,在浮层中显示,引导用户进行相关操作。","demoId":"form-in-dialog"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/drop-roles.json b/examples/docs/resources/pc/demo-config/zh-CN/drop-roles.json new file mode 100644 index 000000000..7d32d8204 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/drop-roles.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"drop-roles/basic-usage","component":" DropRoles 下拉角色","findIntroStr":"DropRoles,提供当前用户的角色列表,并可以在不同角色间进行切换。","demoId":"basic-usage"},{"title":"change 事件","content":"

切换下拉角色时触发 change 事件,需要通过 change 事件回调方法去发送请求。

\n","link":"drop-roles/change-role-event","component":" DropRoles 下拉角色","findIntroStr":"DropRoles,提供当前用户的角色列表,并可以在不同角色间进行切换。","demoId":"change-role-event"},{"title":"设置组件大小","content":"

可设置为:mediumsmallmini

\n","link":"drop-roles/size","component":" DropRoles 下拉角色","findIntroStr":"DropRoles,提供当前用户的角色列表,并可以在不同角色间进行切换。","demoId":"size"},{"title":"自定义服务","content":"

可通过 fetch-rolefetch-current-role 两个方法自定义服务,同时可通过 fields 属性指定显示和绑定值对应的字段。\n可通过 placeholder 展示占位符。

\n","link":"drop-roles/custom-service","component":" DropRoles 下拉角色","findIntroStr":"DropRoles,提供当前用户的角色列表,并可以在不同角色间进行切换。","demoId":"custom-service"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/drop-times.json b/examples/docs/resources/pc/demo-config/zh-CN/drop-times.json new file mode 100644 index 000000000..3661702d5 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/drop-times.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"drop-times/basic-usage","component":" dropTimes 下拉时间","findIntroStr":"时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。","demoId":"basic-usage"},{"title":"步长与时间区间","content":"

start 设置区间的起始时间,默认为 0 ,end 设置区间的结束时间,默认为 24 * 60 ,step 设置间隔的步长,默认为 15 。

\n","link":"drop-times/start-end-step","component":" dropTimes 下拉时间","findIntroStr":"时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。","demoId":"start-end-step"},{"title":"设置组件大小的size属性","content":"

可设置为:medium,small,mini

\n","link":"drop-times/size","component":" dropTimes 下拉时间","findIntroStr":"时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。","demoId":"size"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/dropdown.json b/examples/docs/resources/pc/demo-config/zh-CN/dropdown.json new file mode 100644 index 000000000..a766941d4 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/dropdown.json @@ -0,0 +1,74 @@ +[ + { + "title": "基本用法", + "content": "

基本用法

\n", + "link": "dropdown/basic-usage", + "component": "Dropdown 下拉菜单", + "findIntroStr": "Dropdown 下拉菜单。", + "demoId": "basic-usage" + }, + { + "title": "触发对象", + "content": "

配置split-button属性,可以使用内置按钮触发下拉菜单,同时可以通过type属性配置按钮状态,用法同Button组件

\n", + "link": "dropdown/split-button", + "component": "Dropdown 下拉菜单", + "findIntroStr": "Dropdown 下拉菜单。", + "demoId": "split-button" + }, + { + "title": "触发方式", + "content": "

可以配置 click 激活或者 hover 激活

\n", + "link": "dropdown/trigger", + "component": "Dropdown 下拉菜单", + "findIntroStr": "Dropdown 下拉菜单。", + "demoId": "trigger" + }, + { + "title": "菜单隐藏方式", + "content": "

下拉菜单默认在点击菜单项后会被隐藏,将 hide-on-click 属性默认为 false 可以关闭此功能。

\n", + "link": "dropdown/hide-on-click", + "component": "Dropdown 下拉菜单", + "findIntroStr": "Dropdown 下拉菜单。", + "demoId": "hide-on-click" + }, + { + "title": "禁用", + "content": "

Dropdown、DropdownItem 两个组件分别可以通过 disabled 属性设置禁用状态。

\n", + "link": "dropdown/disabled", + "component": "Dropdown 下拉菜单", + "findIntroStr": "Dropdown 下拉菜单。", + "demoId": "disabled" + }, + { + "title": "不同尺寸", + "content": "

额外的尺寸:mediumsmallmini,通过设置 size 属性来配置它们。

\n", + "link": "dropdown/size", + "component": "Dropdown 下拉菜单", + "findIntroStr": "Dropdown 下拉菜单。", + "demoId": "size" + }, + { + "title": "使用配置式", + "content": "

Dropdown 可以通过menu-options属性配置 DropdownMenu 的属性,title配置触发源的名称

DropdownMenu 可以通过options属性配置 DropdownItem 的属性,text-field 结合 options 使用,可以指定菜单文案显示的字段。text-field 默认为label

\n", + "link": "dropdown/options", + "component": "Dropdown 下拉菜单", + "findIntroStr": "Dropdown 下拉菜单。", + "demoId": "options" + }, + { + "title": "多级菜单", + "content": "

Dropdown 可以通过children 字段设置菜单的子节点

\n", + "link": "dropdown/multi-level", + "component": "Dropdown 下拉菜单", + "findIntroStr": "Dropdown 下拉菜单。", + "demoId": "multi-level" + }, + { + "title": "内置事件", + "content": "

内置事件包含:button-clickitem-clickvisible-change 事件。

\n", + "link": "dropdown/events", + "component": "Dropdown 下拉菜单", + "findIntroStr": "Dropdown 下拉菜单。", + "demoId": "events" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/espace.json b/examples/docs/resources/pc/demo-config/zh-CN/espace.json new file mode 100644 index 000000000..938808c84 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/espace.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

data 属性设置组件数据,数组对象中包含选项有 type、value、icon。其中 type 的可选择值有:im、sip、mailto 。单击图标,将会打开 type 选项值对应的外部应用。

\n","link":"espace/data","component":" Espace 消息弹框","findIntroStr":"主要和 UserContact 联系人组件配套使用,快捷打开对应用户的 eSpace 弹窗,eSpace 呼叫,邮件等应用。","demoId":"data"},{"title":"用户联系人使用 eSpace","content":"

UserContact 联系人组件提供了 espace 属性配置 Espace 组件需要的数据。该组件内部实际使用了 Espace 组件。

\n","link":"user-contact/support-open-espace","component":" Espace 消息弹框","findIntroStr":"主要和 UserContact 联系人组件配套使用,快捷打开对应用户的 eSpace 弹窗,eSpace 呼叫,邮件等应用。","demoId":"support-open-espace"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/fall-menu.json b/examples/docs/resources/pc/demo-config/zh-CN/fall-menu.json new file mode 100644 index 000000000..69f740ded --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/fall-menu.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"fall-menu/data-resource","component":" FallMenu 瀑布菜单","findIntroStr":"FallMenu 瀑布菜单以横向方式显示,支持三级菜单配置,适用于版型定制,以弹出的方式展示。","demoId":"data-resource"},{"title":"数据源","content":"

通过 data 设置瀑布菜单的数据。

\n","link":"fall-menu/data-resource","component":" FallMenu 瀑布菜单","findIntroStr":"FallMenu 瀑布菜单以横向方式显示,支持三级菜单配置,适用于版型定制,以弹出的方式展示。","demoId":"data-resource1"},{"title":"自定义左/右侧图标","content":"

通过 left 插槽自定义左侧切换图标为 IconLeft ,通过 right 插槽右侧切换图标 IconRight 。

\n","link":"fall-menu/custom-slider-icon","component":" FallMenu 瀑布菜单","findIntroStr":"FallMenu 瀑布菜单以横向方式显示,支持三级菜单配置,适用于版型定制,以弹出的方式展示。","demoId":"custom-slider-icon"},{"title":"自定义内容","content":"

通过 level1 插槽自定义一级菜单内容,通过 level2 插槽自定义二级菜单内容,通过 level3 插槽自定义三级菜单内容。

\n","link":"fall-menu/custom-menuitem","component":" FallMenu 瀑布菜单","findIntroStr":"FallMenu 瀑布菜单以横向方式显示,支持三级菜单配置,适用于版型定制,以弹出的方式展示。","demoId":"custom-menuitem"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/file-upload.json b/examples/docs/resources/pc/demo-config/zh-CN/file-upload.json new file mode 100644 index 000000000..06c8f90e0 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/file-upload.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

属性 action(type:String) 上传服务器地址。

\n","link":"file-upload/basic-usage","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"basic-usage"},{"title":"设置组件大小","content":"

可选值为largemediumsmallmini

\n","link":"file-upload/size","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"size"},{"title":"可上传的文件类型","content":"

通过配置 accept(image) 来限制上传文件的格式为 image

\n","link":"file-upload/accept-file-image","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"accept-file-image"},{"title":"手动上传","content":"

通过 action 配置上传地址,通过 submit 设置手动上传

\n","link":"file-upload/manual-upload","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"manual-upload"},{"title":"阻止删除文件","content":"

:before-remove(移除文件前回调事件),方法里面return true/false,表示是否可以删除

\n","link":"file-upload/prevent-delete-file","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"prevent-delete-file"},{"title":"阻止上传文件","content":"

before-upload(上传前回调事件),方法里面 return true/false,表示是否可以进行上传文件

\n","link":"file-upload/prevent-upload-file","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"prevent-upload-file"},{"title":"上传请求","content":"

可通过配置 action 为上传地址,可通过配置 headers 为头部请求信息

\n","link":"file-upload/upload-request","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"upload-request"},{"title":"mini 模式","content":"

\n可通过配置 mini-mode,设置显示 mini 模式

\n","link":"file-upload/mini-mode","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"mini-mode"},{"title":"是否可以拖拽文件上传","content":"

可配置 drag(type:boolean),来控制组件是否可以拖拽文件上传,如果配置了 accept 属性,可通过 @drop-error 事件获取不合规的拖拽文件。

\n","link":"file-upload/drag-upload","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"drag-upload"},{"title":"拖拽上传","content":"

可配置drag(type:boolean),来控制组件是否可以拖拽文件

\n","link":"file-upload/drag-select-file","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"drag-select-file"},{"title":"上传的文件列表","content":"

通过 show-file-list 配置是否显示是否显示已上传文件列表,默认值为 true ,需要与 file-list 同时使用\n可配置 :file-list(type:Object)来显示已上传的文件名和地址

\n","link":"file-upload/upload-file-list","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"upload-file-list"},{"title":"上传的文件列表弹出显示","content":"

通过 list-type = thumb 开启文件列表弹窗显示,thumbOption 设置弹窗相关数据;

\n","link":"file-upload/upload-file-list-thumb","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"upload-file-list-thumb"},{"title":"自定义上传请求","content":"

通过配置 headers ,设置自定义上传请求头信息

\n","link":"file-upload/custom-upload-request","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"custom-upload-request"},{"title":"覆盖默认请求","content":"

通过配置 http-request ,覆盖默认的上传行为,可以自定义上传的实现

\n","link":"file-upload/http-request","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"http-request"},{"title":"最大上传限制","content":"

可配置:before-upload(上传前事件回调),对文件类型和大小做限制

\n","link":"file-upload/upload-limit","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"upload-limit"},{"title":"照片墙","content":"

可配置list-type = 'picture-card'开启照片墙模式

\n","link":"file-upload/picture-card","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"picture-card"},{"title":"文件缩略图","content":"详细用法参考如下示例","link":"file-upload/file-picture-card","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"file-picture-card"},{"title":"图片列表缩略图","content":"

\n可通过配置list-type="picture",来实现图片列表缩略图显示

\n","link":"file-upload/picture-list","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"picture-list"},{"title":"最大上传文件数","content":"

\n可通过配置limit(type:Number,大于0的整数)来限制上传文件的个数

\n","link":"file-upload/max-file-count","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"max-file-count"},{"title":"文件多选","content":"

文件选择默认单选\n可配置multiple = 'true' 实现文件多选

\n","link":"file-upload/multiple-file","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"multiple-file"},{"title":"钩子函数","content":"

before-remove 删除文件之前的钩子,参数为上传的文件和文件列表,若返回 false 或者返回 Promise 且被 reject,则停止删除。before-upload 上传文件之前的钩子,参数为上传的文件,若返回 false 或者返回 Promise 且被 reject,则停止上传。

\n","link":"file-upload/custom-prefix","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"custom-prefix"},{"title":"事件","content":"

preview 点击文件列表中已上传的文件时触发的事件。\nremove 文件列表移除文件时触发的事件。\nerror 文件上传失败时触发的事件。\nexceed 文件超出个数限制时触发的事件。\nprogress 文件上传时触发的事件。\nchange 文件状态改变时触发的事件,添加文件、上传成功和上传失败时都会被触发。\nsuccess 文件上传成功时触发的事件。

\n","link":"file-upload/upload-events","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"upload-events"},{"title":"支持发送 cookie 凭证信息","content":"

可通过配置:with-credentials = 'true' 开启访问服务器携带 cookie,默认为 false 。

\n","link":"file-upload/upload-request","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"upload-request1"},{"title":"手动清空已上传文件列表","content":"

调用组件clearFiles方法,清空已上传的文件列表(该方法不支持在 before-upload 中调用)

\n","link":"file-upload/clear-files","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"clear-files"},{"title":"手动取消上传请求","content":"

调用组件abort方法,取消上传请求

\n","link":"file-upload/abort-quest","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"abort-quest"},{"title":"自定义上传提示","content":"

可通过 tip 插槽来自定义上传提示

\n","link":"file-upload/custom-upload-tip","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"custom-upload-tip"},{"title":"自定义触发文件选项框","content":"

可在组件中写一个名为trigger的插槽,来触发弹出文件选项框

\n","link":"file-upload/custom-trigger","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"custom-trigger"},{"title":"用户头像上传","content":"详细用法参考如下示例","link":"file-upload/upload-user-head","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"upload-user-head"},{"title":"获取上传的片的原始尺寸","content":"

\n获取上传的片的原始尺寸

\n","link":"file-upload/image-size","component":" FileUpload 文件上传","findIntroStr":"可以设定文件的类型与上传的个数等。可自定义上传服务。","demoId":"image-size"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/floatbar.json b/examples/docs/resources/pc/demo-config/zh-CN/floatbar.json new file mode 100644 index 000000000..ab66b20ed --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/floatbar.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

默认固定在屏幕右侧固定位置

\n","link":"floatbar/base","component":" Floatbar 浮动块","findIntroStr":"始终浮动在屏幕某一位置,不会因网页滚动使此模块离开屏幕。","demoId":"base"},{"title":"自定义样式","content":"

可通过配置 css 样式,设置浮动块的样式

\n","link":"floatbar/custom-style","component":" Floatbar 浮动块","findIntroStr":"始终浮动在屏幕某一位置,不会因网页滚动使此模块离开屏幕。","demoId":"custom-style"},{"title":"自定义内容","content":"

通过默认插槽设置浮动块的内容

\n","link":"floatbar/custom-floatbar-item","component":" Floatbar 浮动块","findIntroStr":"始终浮动在屏幕某一位置,不会因网页滚动使此模块离开屏幕。","demoId":"custom-floatbar-item"},{"title":"操作浮动块内容","content":"详细用法参考如下示例","link":"floatbar/operation-floatbar-item","component":" Floatbar 浮动块","findIntroStr":"始终浮动在屏幕某一位置,不会因网页滚动使此模块离开屏幕。","demoId":"operation-floatbar-item"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/font.json b/examples/docs/resources/pc/demo-config/zh-CN/font.json new file mode 100644 index 000000000..8ec998009 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/font.json @@ -0,0 +1 @@ +[{"title":"中文字体集","content":"详细用法参考如下示例","link":"font/chinese-font-set","component":" Font 字体","findIntroStr":"Font 字体","demoId":"chinese-font-set"},{"title":"英文字体","content":"详细用法参考如下示例","link":"font/english-fonts","component":" Font 字体","findIntroStr":"Font 字体","demoId":"english-fonts"},{"title":"字体使用规范","content":"详细用法参考如下示例","link":"font/Font-usage-specifications","component":" Font 字体","findIntroStr":"Font 字体","demoId":"Font-usage-specifications"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/form.json b/examples/docs/resources/pc/demo-config/zh-CN/form.json new file mode 100644 index 000000000..9fcddc2e9 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/form.json @@ -0,0 +1,114 @@ +[ + { + "title": "常用表单", + "content": "

在 Form 组件中,每一个表单域由一个 FormItem 组件构成,表单域中可以放置各种类型的表单控件,包括 Input、Select、Checkbox、Radio、Switch、DatePicker、TimePicker。

\n", + "link": "form/frequently-used-form", + "component": " Form 表单", + "findIntroStr": "由按钮、输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。", + "demoId": "frequently-used-form" + }, + { + "title": "行内表单", + "content": "

当垂直方向空间受限且表单较简单时,可以在一行内放置表单,设置 inline 属性可以让表单域变为行内的表单域。

\n", + "link": "form/form-in-row", + "component": " FormItem 表单项", + "findIntroStr": "Form 组件下的 FormItem 配置。", + "demoId": "form-in-row" + }, + { + "title": "表单校验", + "content": "

包括常用的必填、日期、时间、URL、邮件等校验规则。通过 trigger 配置触发校验规则的方式,为 change 时,当输入框值改变即触发校验,为 blur 时则失焦后触发校验。

\n", + "link": "form/form-validation", + "component": " Form 表单", + "findIntroStr": "由按钮、输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。", + "demoId": "form-validation" + }, + { + "title": "自定义校验规则", + "content": "

通过 validator 选项进行自定义校验,校验方法中 callback 必须被调用。通过配置 validate-on-rule-change 属性,设置是否在 rules 属性改变后立即触发一次验证

\n", + "link": "form/custom-validation-rule", + "component": " Form 表单", + "findIntroStr": "由按钮、输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。", + "demoId": "custom-validation-rule" + }, + { + "title": "文本对齐", + "content": "

通过配置 label-align 属性, 设置是否文本对齐

\n", + "link": "form/label-align", + "component": " Form 表单", + "findIntroStr": "由按钮、输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。", + "demoId": "label-align" + }, + { + "title": "校验提示位置", + "content": "

通过 validate-position 可自定义错误提示出现的位置,在 Form 组件上设置后,子组件FormItem会继承父组件设置。单独在 FormItem 组件上进行设置优先级高于在 From上的设置。

\n", + "link": "form/validation-position", + "component": " Form 表单", + "findIntroStr": "由按钮、输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。", + "demoId": "validation-position" + }, + { + "title": "无校验的组件添加校验的方法", + "content": "详细用法参考如下示例", + "link": "form/no-validate-to-add", + "component": " Form 表单", + "findIntroStr": "由按钮、输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。", + "demoId": "no-validate-to-add" + }, + { + "title": "表单尺寸", + "content": "

通过在 tiny-form 标签上设置 size 属性可以改变表单内组件尺寸;设置 disabled 属性可以改变表单内组件禁用状态

\n", + "link": "form/size", + "component": " FormItem 表单项", + "findIntroStr": "由按钮、输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。", + "demoId": "size" + }, + { + "title": "移除表单项的校验结果", + "content": "

调用 clearValidate 方法移除表单项的校验结果。传入待移除的表单项的 prop 属性或者 prop 组成的数组,如不传则移除整个表单的校验结果。

\n", + "link": "form/form-clear-validate", + "component": " 移除表单项的校验结果", + "findIntroStr": "Form 组件下的移除表单项的校验结果的方法。", + "demoId": "form-clear-validate" + }, + { + "title": "标签文本插槽", + "content": "

通过在 label 插槽,自定义标签文本的内容

\n", + "link": "form/slot-label", + "component": " FormItem 表单项", + "findIntroStr": "由按钮、输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。", + "demoId": "slot-label" + }, + { + "title": "隐藏表单项校验提示", + "content": "

通过配置 novalid-tip 设置是否显示校验提示框的tip内容提示。

\n", + "link": "form/novalid-tip", + "component": " Form 表单", + "findIntroStr": "配置是否显示校验提示框的tip内容提示", + "demoId": "novalid-tip" + }, + { + "title": "校验提示的形式", + "content": "

通过 validate-type 可设置校验提示信息是以 text 文本显示还是以 tip 提示框的形式显示,默认为 tip 。也可直接配置在某一个 <form-item> 上控制某一项的校验提示形式。

\n", + "link": "form/validate-type", + "component": " Form 表单", + "findIntroStr": "由按钮、输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。", + "demoId": "validate-type" + }, + { + "title": "表单禁用", + "content": "

通过 disabled 可设置表单是否禁用,默认为 false

\n", + "link": "form/form-disabled", + "component": " Form 表单", + "findIntroStr": "由按钮、输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。", + "demoId": "form-disabled" + }, + { + "title": "复杂布局", + "content": "

通过配合 RowCol 组件来实现复杂布局。

\n", + "link": "form/form-row-col", + "component": " Form 表单", + "findIntroStr": "由按钮、输入框、选择器、单选框、多选框等控件组成,用以收集、校验、提交数据。", + "demoId": "form-row-col" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/fullscreen.json b/examples/docs/resources/pc/demo-config/zh-CN/fullscreen.json new file mode 100644 index 000000000..d62a37b3f --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/fullscreen.json @@ -0,0 +1 @@ +[{"title":"组件式使用","content":"详细用法参考如下示例","link":"fullscreen/example-component","component":" Fullscreen 全屏显示","findIntroStr":"Fullscreen 全屏显示","demoId":"example-component"},{"title":"函数式使用","content":"详细用法参考如下示例","link":"fullscreen/example-api","component":" Fullscreen 全屏显示","findIntroStr":"Fullscreen 全屏显示","demoId":"example-api"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-align.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-align.json new file mode 100644 index 000000000..93d8c17d5 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-align.json @@ -0,0 +1 @@ +[{"title":"列对齐","content":"

align 设置单独列对齐方式 可选值为 left center right,默认值为 left

\n

TIP

\n

列设置的 align 会覆盖掉表格设置的 align

\n
\n","link":"grid/align/column-align","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"align-column-align"},{"title":"表头左对齐","content":"

header-align 设置表头对齐方式可选值为 left center right,默认值为 left

\n

TIP

\n

表格上配置 header-align 会被列配置的 header-align 覆盖

\n
\n","link":"grid/align/header-align/left-header-align","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"align-header-align-left-header-align"},{"title":"表头右对齐","content":"详细用法参考如下示例","link":"grid/align/header-align/right-header-align","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"align-header-align-right-header-align"},{"title":"表头居中对齐","content":"详细用法参考如下示例","link":"grid/align/header-align/center-header-align","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"align-header-align-center-header-align"},{"title":"表尾左对齐","content":"

footer-align 设置表尾对齐方式的可选值为 left center right,默认值为 left

\n

TIP

\n

表格上配置 footer-align 会被列配置的 footer-align 覆盖

\n
\n","link":"grid/align/footer-align/left-footer-align","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"align-footer-align-left-footer-align"},{"title":"表尾右对齐","content":"详细用法参考如下示例","link":"grid/align/footer-align/right-footer-align","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"align-footer-align-right-footer-align"},{"title":"表尾居中对齐","content":"详细用法参考如下示例","link":"grid/align/footer-align/center-footer-align","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"align-footer-align-center-footer-align"},{"title":"表格左对齐","content":"

align 设置全部列对齐方式可选值为 left center right,默认值为 left

\n

TIP

\n

表格设置对齐方式优先级最低,会被单独设置对齐方式覆盖

\n
\n","link":"grid/align/grid-align/left-grid-align","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"align-grid-align-left-grid-align"},{"title":"表格右对齐","content":"详细用法参考如下示例","link":"grid/align/grid-align/right-grid-align","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"align-grid-align-right-grid-align"},{"title":"表格居中对齐","content":"详细用法参考如下示例","link":"grid/align/grid-align/center-grid-align","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"align-grid-align-center-grid-align"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-cascade.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-cascade.json new file mode 100644 index 000000000..b45b5211a --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-cascade.json @@ -0,0 +1 @@ +[{"title":"Grid-数据级联-正常列级联","content":"

需要在 grid 标签上配 edit-config 对象,activeMethod 编辑前的事件处理编辑项数据集。\ngrid-column 列上面配置 editor 对象,component 用来渲染编辑组件。\nattrs 配置级联数据。\nevents 来设置事件。\n具体参考下面示例。

\n","link":"grid/grid_Example/dataCascading/cascade","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-dataCascading-cascade"},{"title":"Grid-数据级联-任意父级联","content":"

需要在 grid 标签上配 edit-config 对象,activeMethod 编辑前的事件处理编辑项数据集。\ngrid-column 列上面配置 editor 对象,component 用来渲染编辑组件。\nattrs 配置级联数据。\nevents 来设置事件。\n具体参考下面示例。

\n","link":"grid/grid_Example/dataCascading/arbitraryCascade","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-dataCascading-arbitraryCascade"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-context-menu.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-context-menu.json new file mode 100644 index 000000000..e3670bce3 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-context-menu.json @@ -0,0 +1 @@ +[{"title":"Grid-右键菜单-表头菜单","content":"

配置 :context-menu="{header: {options: headerMenus}, visibleMethod}" 对象来控制表头菜单。\nheaderMenus 里面配置 visible 是否显示菜单, disabled 是否禁用菜单项。\n可配合 visibleMethod 方法来控制菜单权限。\n@context-menu-click 监控菜单点击事件。\n具体参考下面示例。

\n","link":"grid/grid_Example/shortcutMenu/header-menu","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-shortcutMenu-header-menu"},{"title":"Grid-右键菜单-表尾菜单","content":"

必须要配置 :context-menu="{body: {options: bodyMenus}}"show-footer:footer-method="footerMethod" 才能展示表尾菜单\n配置 :context-menu="{body: {options: bodyMenus}, footer: {options: footerMenus},visibleMethod}" 对象来控制表头菜单。\nfooterMenus 里面配置 visible 是否显示菜单, disabled 是否禁用菜单项。\n可配合 visibleMethod 方法来控制菜单权限。\n@context-menu-click 监控菜单点击事件。\n具体参考下面示例。

\n","link":"grid/grid_Example/shortcutMenu/footer-menu","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-shortcutMenu-footer-menu"},{"title":"Grid-右键菜单-单元格菜单","content":"

配置 context-menu="{body: {options: bodyMenus},visibleMethod}" 对象来控制单元格菜单。\nbodyMenus 里面配置 visible 是否显示菜单,disabled 是否禁用菜单项。\n可配合 visibleMethod 方法来控制菜单权限。\n@cell-context-menu 监控菜单弹出前事件。\n@context-menu-click 监控菜单点击事件。\n具体参考下面示例。

\n","link":"grid/grid_Example/shortcutMenu/cell-menu","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-shortcutMenu-cell-menu"},{"title":"Grid-右键菜单-菜单权限","content":"

配置 :context-menu="{header: {options: headerMenus},body: {options: bodyMenus}, footer: {options: footerMenus},visibleMethod}" 对象来控制表头菜单。\nheader,bodyMenus,footer 里面配置 visible 是否显示菜单, disabled 是否禁用菜单项。\n使用配合 visibleMethod 方法来控制菜单权限。\n@cell-context-menu 监控菜单弹出前事件。\n@context-menu-click 监控菜单点击事件。\n具体参考下面示例。

\n","link":"grid/grid_Example/shortcutMenu/menu-permissions","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-shortcutMenu-menu-permissions"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-custom-style.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-custom-style.json new file mode 100644 index 000000000..344556a35 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-custom-style.json @@ -0,0 +1 @@ +[{"title":"设置行样式","content":"

通过 row-class-name 自定义设置表格的行样式

\n

设置行样式

\n","link":"grid/custom-style/row-style","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"custom-style-row-style"},{"title":"设置表头样式","content":"

通过 header-cell-class-nameheader-row-class-name 设置表头的单元格和行样式

\n

设置表头单元格样式

\n","link":"grid/custom-style/header-style/header-cell-style","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"custom-style-header-style-header-cell-style"},{"title":"设置表头单元格样式","content":"详细用法参考如下示例","link":"grid/custom-style/header-style/header-row-style","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"custom-style-header-style-header-row-style"},{"title":"表尾样式(自定义表尾行样式)","content":"

通过 footer-cell-class-namefooter-row-class-name 设置表尾的单元格和行样式

\n","link":"grid/custom-style/footer-style/footer-cell-style","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"custom-style-footer-style-footer-cell-style"},{"title":"表尾样式(自定义表尾单元格样式)","content":"详细用法参考如下示例","link":"grid/custom-style/footer-style/footer-row-style","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"custom-style-footer-style-footer-row-style"},{"title":"单元格样式","content":"

通过 cell-class-name 自定义设置表格的单元格样式

\n","link":"grid/custom-style/cell-style","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"custom-style-cell-style"},{"title":"列样式","content":"

通过 class-name 自定义设置表格的列样式

\n","link":"grid/column/class-name","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"column-class-name"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-customized.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-customized.json new file mode 100644 index 000000000..a8b371199 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-customized.json @@ -0,0 +1,114 @@ +[ + { + "title": "列宽", + "content": "

grid 标签上配置 resizable="true" 可以调整列宽,并在 toolbar 标签上配置 resizable="{storage: true}" 保存在本地的 localStroage 里,刷新页面表格的列宽按照拖动后的列宽显示

\n", + "link": "grid/custom/column-width", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "custom-column-width" + }, + { + "title": "简化版列设置", + "content": "

toolbar 标签上配置 :setting="{simple: true, customDisable: customDisable}" 开启简化版列设置 通过customDisable 方法自定义当前选项是否禁用

\n", + "link": "grid/custom/column-simple", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "custom-column-simple" + }, + { + "title": "手动重置列操作", + "content": "

方法说明

\n

resetResizable():手动重置列宽拖动的操作,还原到初始状态\nresetCustoms():手动重置列的显示/隐藏操作,还原到初始状态\nresetAll():手动重置列的所有操作,还原到初始状态

\n
\n

请先对列宽进行拖动、隐藏列等操作,然后单击对应按钮查看效果。

\n", + "link": "grid/custom/resetResizable", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "custom-resetResizable" + }, + { + "title": "排序", + "content": "

column 标签上配置 sortable 可以排序(未配置的列,在个性化面板中的排序图标会隐藏),并在 toolbar 标签上配置 setting 开启个性化设置,在个性化面板里进行排序,排序过后会保存在本地的 localStroage 里,刷新页面页面上会显示排序过后的数据

\n", + "link": "grid/custom/column-sort", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "custom-column-sort" + }, + { + "title": "排序类型", + "content": "

column 标签上配置 sortable 可以排序,并在 toolbar 标签上配置 setting 开启个性化设置,在个性化面板里选择其它设置,其它设置里可以选择排序类型,排序类型有当前页排序和所有数据排序选项,默认是当前页排序

\n", + "link": "grid/custom/sort-type", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "custom-sort-type" + }, + { + "title": "列冻结", + "content": "

column 标签上配置 fixed="left" 可以固定在左侧,并在 toolbar 标签上配置 setting 开启个性化设置,在个性化面板里可以设置是否固定列

\n", + "link": "grid/custom/column-fixed", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "custom-column-fixed" + }, + { + "title": "本地记录", + "content": "

配置 settingsortablesortablejs 可实现拖拽排序列功能, 此功能在多级列头下无效

\n", + "link": "grid/custom/ordercolumn-local", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "custom-ordercolumn-local" + }, + { + "title": "加载远端数据", + "content": "

通过 reloadCustoms 方法,将第二个参数置为 true 可按序加载列

\n", + "link": "grid/custom/ordercolumn-remote", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "custom-ordercolumn-remote" + }, + { + "title": "列显示隐藏", + "content": "

toolbar 标签上配置 setting 开启个性化设置,在个性化面板里可以设置是否显示和隐藏列

\n", + "link": "grid/custom/column-visible-hidden", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "custom-column-visible-hidden" + }, + { + "title": "手动隐藏显示列", + "content": "

通过调用 hideColumn(column) 方法隐藏指定列,showColumn(column) 方法显示指定列。使用这两个方法隐藏/显示列时,还需要再调用 refreshColumn() 方法刷新列配置才能实际生效。

\n", + "link": "grid/hide/hideColumn", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "hide-hideColumn" + }, + { + "title": "个性化面板拖拽前事件", + "content": "

toolbar 标签上配置 setting 开启个性化设置,在个性化面板里配置 onBeforeMove 拖拽前事件,也可配置 filter 设置类名, 拖拽个性化面板某一行会触发个性化面板的拖拽前事件。

\n", + "link": "grid/custom/prsonalized-drag", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "custom-prsonalized-drag" + }, + { + "title": "分页条数", + "content": "

toolbar 标签上配置 setting 开启个性化设置,在个性化面板里选择其它设置,其它设置里可以选择每页显示的条数,可以通过 settingother 属性控制显示其他设置,Boolean 类型默认为 true

\n", + "link": "grid/custom/page-size", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "custom-page-size" + }, + { + "title": "本地存储", + "content": "

toolbar 标签上配置 :setting="{storage:'local'}" 开启个性化并保存到本地 localSotrage

\n
\n
\n", + "link": "grid/custom/local-storage", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "custom-local-storage" + }, + { + "title": "服务端存储", + "content": "

toolbar 标签上配置 :setting="{storage:'remote'}" 开启个性化并启用远程服务获取个性化数据,并配置 @remote-setting 调用 reloadCustoms 方法更新个性化数据。\n 注意\n如果是根据服务端数据控制显示/隐藏列,调用接口获取到个性化的数据后需手动调用 reloadCustoms 方法更新。\n

\n
\n
\n", + "link": "grid/custom/server-storage", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "custom-server-storage" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-data-source.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-data-source.json new file mode 100644 index 000000000..2b04e65ae --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-data-source.json @@ -0,0 +1 @@ +[{"title":"绑定静态数据","content":"

表格属性设置 data 开启双向绑定静态数据。

\n","link":"grid/tiny-first-menu/static-data","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-static-data"},{"title":"开启服务请求","content":"

表格属性设置 fetch-data 开启服务请求。

\n","link":"grid/tiny-first-menu/request-service","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-request-service"},{"title":"自动加载数据","content":"

表格属性 auto-load 设置是否开启自动请求服务,配置 fetch-data 时有效。如下示例设置 auto-load 为 false 后,就不会自动加载数据。

\n","link":"grid/tiny-first-menu/auto-load","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-auto-load"},{"title":"表格列的配置信息","content":"

通过表格属性 columns 设置表格列的配置信息

\n","link":"grid/tiny-first-menu/columns","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-columns"},{"title":"开启异步渲染","content":"

异步渲染配置步骤:\n1、表格属性设置 is-async-column 开启异步渲染;\n2、表格列设置 format-config 开启该列数据异步渲染。

\n","link":"grid/tiny-first-menu/column-asyn-rendering","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-column-asyn-rendering"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-drag.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-drag.json new file mode 100644 index 000000000..d242d28ef --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-drag.json @@ -0,0 +1 @@ +[{"title":"行拖拽","content":"

通过设置 drop-configrow 属性控制行拖拽,默认为开启行拖拽,行拖拽事件有 @row-drop-startrow-drop-moverow-drop-end

\n","link":"grid/drag/row-drag","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"drag-row-drag"},{"title":"拖拽控制","content":"

可以通过设置 drop-configonBeforeMove 事件控制行拖动,也可以配置drop-configfilter 与自定义样式结合使用来限制拖动

\n","link":"grid/drag/row-drag-ctrl","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"drag-row-drag-ctrl"},{"title":"列拖拽","content":"

通过设置 drop-configcolumn 属性控制列拖拽,默认为开启列拖拽,列拖拽事件有 @column-drop-startcolumn-drop-movecolumn-drop-end

\n","link":"grid/drag/column-drag","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"drag-column-drag"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-dynamically-columns.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-dynamically-columns.json new file mode 100644 index 000000000..11c9010b8 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-dynamically-columns.json @@ -0,0 +1 @@ +[{"title":"Grid-根据选择日期动态生成列","content":"详细用法参考如下示例","link":"grid/grid_Example/dynamicallyColumns","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-dynamicallyColumns"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-edit.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-edit.json new file mode 100644 index 000000000..e64e2cf67 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-edit.json @@ -0,0 +1 @@ +[{"title":"行编辑","content":"

表格属性设置 edit-config 开启编辑模式,然后在该属性对象内设置 mode: 'row' 开启行编辑,即::edit-config="{ mode: 'row' }"

\n","link":"grid/tiny-first-menu/row-editing","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-row-editing"},{"title":"还原更改","content":"

调用方法 revertData(rows, field) 可以还原指定行 row 或者整个表格的数据。rows 为对象则还原一行数据,为数组则还原多行数据,field 可不指定。不指定任何参数时则还原整个表格数据。

\n","link":"grid/edit/revertData","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"edit-revertData"},{"title":"检查数据是否改变","content":"

hasRowChange(row, field) 检查行或列数据是否发生改变,field 可不指定。

\n","link":"grid/edit/hasRowChange","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"edit-hasRowChange"},{"title":"单元格编辑","content":"

表格属性设置 edit-config 开启编辑模式,然后在该属性对象内设置 mode: 'cell' 开启行编辑,即::edit-config="{ mode: 'cell' }"。\n表格列属性设置 show-icon 设置列头是否显示编辑图标,在编辑时有效。

\n","link":"grid/tiny-first-menu/cell-editing","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-cell-editing"},{"title":"手动激活编辑","content":"

setActiveCell(row, field) 方法可激活指定单元格编辑。setActiveRow(row) 方法激活行编辑,如果是 mode=cell 则默认激活第一个单元格。

\n","link":"grid/methods/set-active-cell","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"methods-set-active-cell"},{"title":"单元格格式化","content":"

表格列属性 format-value 格式化单元格编辑器组件的传入值。

\n","link":"grid/tiny-first-menu/format-value","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-format-value"},{"title":"自定义编辑规则","content":"

表格属性设置 edit-config 开启编辑模式,然后在该属性对象内设置 activeMethod 自定义编辑规则。

\n","link":"grid/tiny-first-menu/custom-editing","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-custom-editing"},{"title":"自定义编辑校验规则","content":"

表格属性设置 edit-config 开启编辑模式,并配置 edit-rules 对象来设置校验对象和校验规则,然后在 editor 对象中设置 isValidAlways 开启编辑实时校验。

\n","link":"grid/tiny-first-menu/editor-is-salid-always","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-editor-is-salid-always"},{"title":"开启编辑状态","content":"

表格属性设置 edit-config 开启编辑模式,然后在该属性对象内设置 showStatus 开启或关闭单元格更新状态(单元格左上角倒三角形更新标识),默认值为 true 开启状态。

\n","link":"grid/tiny-first-menu/status-of-editing","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-status-of-editing"},{"title":"关闭编辑状态","content":"详细用法参考如下示例","link":"grid/tiny-first-menu/status-of-noediting","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-status-of-noediting"},{"title":"点击触发编辑","content":"

表格属性设置 edit-config 开启编辑模式,然后在该属性对象内设置 trigger 修改触发方式。可选值有 点击触发(click)/ 双击触发(dblclick)/ 手动触发(manual),默认值为 click 点击触发

\n","link":"grid/tiny-first-menu/trigger-mode-for-editing","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-trigger-mode-for-editing"},{"title":"双击触发编辑","content":"详细用法参考如下示例","link":"grid/tiny-first-menu/trigger-mode-db-editing","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-trigger-mode-db-editing"},{"title":"手动触发编辑","content":"详细用法参考如下示例","link":"grid/tiny-first-menu/trigger-mode-hm-editing","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-trigger-mode-hm-editing"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-editor.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-editor.json new file mode 100644 index 000000000..4f110946e --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-editor.json @@ -0,0 +1 @@ +[{"title":"Grid-编辑器-内置编辑器","content":"

grid 标签上配置 edit-config。在 grid-column 列配置 editor 对象, component 渲染内置编辑组件, events 配置组件事件。具体参考下面示例。

\n

说明

\n

3.0 内置编辑器只支持 InputSelect 组件,需要使用其他组件可参考自定义编辑器

\n
\n","link":"grid/grid_Example/gridEdit/inner-editor","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-gridEdit-inner-editor"},{"title":"Grid-编辑器-自定义编辑器","content":"

grid 标签上配置 edit-config。\n在 grid-column 列配置 editor 对象, component 渲染自定义编辑组件。\n自定义编辑默认编辑框为小框,可以配合样式修改编辑框。\n具体参考下面示例。

\n","link":"grid/grid_Example/gridEdit/custom-editor","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-gridEdit-custom-editor"},{"title":"引入 3.0 组件作为编辑器","content":"

通过 属性配置 方式引入 TinyVue Select 组件。

\n","link":"grid/grid_Example/gridEdit/custom-editor-select","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-gridEdit-custom-editor-select"},{"title":"Grid-编辑器-下拉多选","content":"

配置列为下拉多选时,单元格渲染需要自行实现,如下例中使用format-text渲染多个枚举值。也可以使用renderer自己实现自定义的组件去渲染。

\n","link":"grid/edit/mutil-render","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"edit-mutil-render"},{"title":"Grid-编辑器-自定义编辑器","content":"

grid 标签上配置 edit-config。\n在 grid-column 列配置 editor 对象, component 渲染自定义编辑组件, 通过其events选项配置编辑器组件的事件。\n自定义编辑默认编辑框为小框,可以配合样式修改编辑框。\n具体参考下面示例。

\n","link":"grid/news/editor-events","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"news-editor-events"},{"title":"Popeditor 弹窗编辑","content":"

grid-column 列元素上配置 editor 属性,该对象中可以指定 componentPopeditorattrs 为 Popeditor 组件的属性。需要注意的是,引入 Popeditor 组件后,需要在 data() 中进行实例化。

\n","link":"grid/grid_Example/gridEdit/popeditor-in-grid","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-gridEdit-popeditor-in-grid"},{"title":"Popeditor 弹窗编辑,配置远程搜索","content":"详细用法参考如下示例","link":"grid/grid_Example/gridEdit/popeditor-in-grid-remote-search","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-gridEdit-popeditor-in-grid-remote-search"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-empty-data-tip.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-empty-data-tip.json new file mode 100644 index 000000000..11bcaea85 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-empty-data-tip.json @@ -0,0 +1 @@ +[{"title":"自定义提示","content":"

空数据时默认显示 图标 + 文字 提示,用户也可通过设置插槽 v-slot:empty 或者 属性 render-empty 来自定义提示内容。

\n","link":"grid/tiny-first-menu/empty-data-tip","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-empty-data-tip"},{"title":"默认提示","content":"详细用法参考如下示例","link":"grid/tiny-first-menu/empty-data-default-tip","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-empty-data-default-tip"},{"title":"固定居中","content":"

配置 is-center-emptytrue 时,拖动横向滚动条可以保持空数据提示使终相对表格宽度居中显示

\n","link":"grid/tiny-first-menu/empty-data-iscenter","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-empty-data-iscenter"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-event.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-event.json new file mode 100644 index 000000000..f7e72c7c3 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-event.json @@ -0,0 +1 @@ +[{"title":"表头点击事件","content":"

grid 标签上配置 header-cell-click 可以监听到表头的点击事件

\n","link":"grid/event/header-click-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-header-click-event"},{"title":"表头双击事件","content":"

grid 标签上配置 header-cell-dblclick 可以监听到表头的双击事件

\n","link":"grid/event/header-dblclick-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-header-dblclick-event"},{"title":"单元格点击事件","content":"

grid 标签上配置 cell-click 可以监听到单元格的点击事件

\n","link":"grid/event/cell-click-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-cell-click-event"},{"title":"单元格双击事件","content":"

grid 标签上配置 cell-dblclick 可以监听到单元格的双击事件

\n","link":"grid/event/cell-dblclick-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-cell-dblclick-event"},{"title":"鼠标进入单元格事件","content":"

grid 标签上配置 cell-dblclick 可以监听到单元格的双击事件

\n","link":"grid/event/cell-mouseenter-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-cell-mouseenter-event"},{"title":"鼠标离开单元格事件","content":"

grid 标签上配置 cell-mouseleave 可以监听到鼠标离开单元格事件

\n","link":"grid/event/cell-mouseleave-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-cell-mouseleave-event"},{"title":"事件","content":"

grid 标签上配置 scroll 事件,可以监听表格的滚动

\n","link":"grid/event/grid-scroll-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-grid-scroll-event"},{"title":"事件对象","content":"

表格属性 envents 设置表格的事件对象。\n

\n","link":"grid/event/grid-events","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-grid-events"},{"title":"行选中事件","content":"

只对 在 grid 标签上配置 highlightCurrentRow 有效,当手动选中行时触发的事件

\n","link":"grid/event/current-change-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-current-change-event"},{"title":"单元格被激活编辑时会触发该事件","content":"

只对 在 grid 标签上配置 edit-actived 有效,单元格被激活编辑时触发的事件

\n","link":"grid/event/edit-actived-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-edit-actived-event"},{"title":"单元格编辑完成触发该事件","content":"

只对 在 grid 标签上配置 edit-closed 有效,单元格编辑完成触发该事件

\n","link":"grid/event/edit-closed-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-edit-closed-event"},{"title":"两个表格数据相互关联","content":"详细用法参考如下示例","link":"grid/event/table-data-association","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-table-data-association"},{"title":"当单元格激活时如果是禁用状态时会触发该事件","content":"

只对 在 grid 标签上配置 edit-disabled-event 有效,同时需要在 edit-config 配置中的 activeMethod 方法控制单元格是否可以编辑(返回 true 可以编辑,反之亦然)。

\n","link":"grid/event/edit-disabled-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-edit-disabled-event"},{"title":"右键点击表尾单元格事件","content":"

grid 标签上配置 footer-cell-context-menu 右键点击表尾单元格事件,配置 footer-cell-click 可以触发点击表尾单元格事件。

\n","link":"grid/event/footer-cell-context-menu-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-footer-cell-context-menu-event"},{"title":"右键点击表头事件","content":"

只对 在 grid 标签上配置 header-cell-context-menu 可以监听右键点击表头事件

\n","link":"grid/event/header-cell-context-menu-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-header-cell-context-menu-event"},{"title":"分页发生改变事件","content":"

只对 在 grid 标签上配置 page-change 可以监听分页发生改变事件

\n","link":"grid/event/page-change-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-page-change-event"},{"title":"分页发生改变前的事件","content":"

通过在 grid 标签上配置 is-before-page-change 选择是否打开页面改变时的前置处理特性。在值为 true 时,翻页操作或者改变页大小操作不会立即生效,留给用户处理业务逻辑,之后通过调用预留的 callback 或者 rollback 使之生效或者失效;通过事件 before-page-change 在进行翻页操作或者改变页大小操作时触发,然后控制是否跳转分页。

\n","link":"grid/event/page-before-change-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-page-before-change-event"},{"title":"勾选行事件","content":"

grid 标签上配置 radio-change 可以监听勾选行事件\n只对 type=radio 有效,当手动勾选并且值发生改变时触发的事件

\n","link":"grid/event/radio-change-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-radio-change-event"},{"title":"列宽改变事件","content":"

grid 标签上配置 resizable-change 可以监听列宽改变事件

\n","link":"grid/event/resizable-change-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-resizable-change-event"},{"title":"手动勾选全选时触发的事件","content":"

grid 标签上配置 select-all 有效\n只对 type=selection 有效,当手动勾选全选时触发的事件

\n","link":"grid/event/select-all-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-select-all-event"},{"title":"勾选行事件","content":"

grid 标签上配置 select-change 可以监听到勾选行事件\n只对 type=selection 有效,当手动勾选并且值发生改变时触发的事件

\n","link":"grid/event/select-change-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-select-change-event"},{"title":"行展开收起事件","content":"

grid 标签上配置 toggle-expand-change 可以监听到行展开收起事件

\n","link":"grid/event/toggle-expand-change-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-toggle-expand-change-event"},{"title":"树节点展开收起事件","content":"

grid 标签上配置 toggle-tree-change 可以监听树节点展开收起事件

\n","link":"grid/event/toggle-tree-change-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-toggle-tree-change-event"},{"title":"工具栏点击事件","content":"

grid 标签上配置 resizable-change 可以监听工具栏点击事件

\n","link":"grid/event/toolbar-button-click-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-toolbar-button-click-event"},{"title":"校验不通过事件","content":"

grid 标签上配置 valid-error 监听校验不通过事件

\n","link":"grid/event/valid-error-event","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"event-valid-error-event"},{"title":"获取表格行方法","content":"

获取行的方法

\n

getCurrentRow 获取当前行\ngetRowIndex 获取当前行号\ngetRadioRow Radio 单选选中行\ngetRowById 通过 rowId 获取当前行\ngetRowNode 通过 tr 元素获取行信息

\n
\n","link":"grid/tiny-first-menu/get-row-method","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-get-row-method"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-faq.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-faq.json new file mode 100644 index 000000000..6b2417e87 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-faq.json @@ -0,0 +1,26 @@ +[ + { + "title": "表格列头与单元格错位", + "content": "

当出现grid表头与表体单元格错位时,可以选择性地做以下尝试\n1.给每列设置列宽\n2.将show-overflowshow-header-overflow 都设置为 true\n3.将 table-layout 设置为 auto

\n", + "link": "grid/faq/unbalanced", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "faq-unbalanced" + }, + { + "title": "DialogBox弹窗中的可编辑表格编辑器无法正常失焦", + "content": "

当可以编辑的表格出现在DialogBox弹出框中,编辑器无法正常失去焦点时需要配置blurOutside

\n", + "link": "grid/faq/gridInDialogBox", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "faq-gridInDialogBox" + }, + { + "title": "配置式表格如何使用插槽", + "content": "

具体可以参考以下代码

\n", + "link": "grid/faq/opSlot", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "faq-opSlot" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-filter.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-filter.json new file mode 100644 index 000000000..f2041521a --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-filter.json @@ -0,0 +1 @@ +[{"title":"过滤","content":"

filter 配置

\n

通过自定义的 filter 的作用域插槽自定义筛选的规则\n可以配置项:\nmulti 设置在显示枚举选项功能是否为多选, 仅在 enumable:true 下有效。\nenumable 设置在过滤面板中显示枚举选项。\ninputFilter 设置在过滤面板中显示输入筛选的项。\ndefaultFilter 设置在过滤面板中显示默认的筛选条件。\nvalues 设置在显示枚举选项功能(enumable)下制定静态数据源。\nlabel 设置枚举数据的显示值属性字段, 默认'label'。\nvalue 设置枚举数据的实际值属性字段, 默认'value'。

\n
\n","link":"grid/filter/default-filter","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"filter-default-filter"},{"title":"自定义参数","content":"

通过 params 添加自定义参数

\n","link":"grid/column/column-params","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"column-column-params"},{"title":"过滤高级设置","content":"

通过 inputFilter 可以给input过滤区域配置自定义组件与条件,通过 extends 可以增加快捷过滤列表

\n","link":"grid/filter/advanced-filter","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"filter-advanced-filter"},{"title":"设置列筛选规则","content":"

通过 filter 属性设置列筛选规则

\n","link":"grid/filter/custom-filter","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"filter-custom-filter"},{"title":"自定义筛选","content":"

通过 params 属性设置额外的参数

\n","link":"grid/grid-params","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid-params"},{"title":"服务端过滤","content":"

配置 remote-filter 开启服务端过滤,服务端过滤会调用表格 fetch-data 进行查询,filter-change 服务端过滤后触发的事件\n该示例中的 services/getGridMockData 服务需要自行实现,示例模拟了远程服务返回的数据\n

\n","link":"grid/filter/server-filter","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"filter-server-filter"},{"title":"输入过滤的默认选项","content":"

通过属性 inputFilter.relation 配置输入过滤的默认选项。\n输入过滤的内置选项:equalsunequalgreaterThanlessThanequalToGreaterThanequalToLessThancontainsstartwithendwith;也可以配置自定义选项。\n配置自定义选项的同时要配置过滤方法,通过属性 inputFilter.method 配置。

\n","link":"grid/filter/default-relation","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"filter-default-relation"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-fixed.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-fixed.json new file mode 100644 index 000000000..69c56f412 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-fixed.json @@ -0,0 +1 @@ +[{"title":"左冻结","content":"

通过 fixed 属性设置列冻结。可选值为 left right 默认为 left

\n","link":"grid/fixed/left-fixed","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"fixed-left-fixed"},{"title":"右冻结","content":"

通过 fixed 属性设置列冻结。可选值为 left right 默认为 left

\n","link":"grid/fixed/right-fixed","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"fixed-right-fixed"},{"title":"操作列冻结","content":"

通过 fixed 属性设置列冻结。可选值为 left right 默认为 left

\n","link":"grid/fixed/multi-column-fixed","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"fixed-multi-column-fixed"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-footer.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-footer.json new file mode 100644 index 000000000..391c37be4 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-footer.json @@ -0,0 +1 @@ +[{"title":"表尾统计","content":"详细用法参考如下示例","link":"grid/footer/footer-summation","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"footer-footer-summation"},{"title":"表尾统计(空数据)","content":"详细用法参考如下示例","link":"grid/footer/footer-summation-empty","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"footer-footer-summation-empty"},{"title":"表尾class类名","content":"

\n通过表格列属性 footer-class-name 给表尾的单元格附加 className,也可以是函数 Function({$rowIndex, column, columnIndex, $columnIndex})。\n

\n","link":"grid/footer/footer-class-name","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"footer-footer-class-name"},{"title":"表尾合并行或列","content":"

通过 footer-methodfooter-span-method 设置表尾合计行或列逻辑 必须配置 show-footer

\n","link":"grid/footer/footer-row-or-column-span","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"footer-footer-row-or-column-span"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-grid-border.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-grid-border.json new file mode 100644 index 000000000..bc120a176 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-grid-border.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

表格属性设置 border 给表格加上边框。

\n","link":"grid/tiny-first-menu/grid-border","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-grid-border"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-grid-loading-tip.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-grid-loading-tip.json new file mode 100644 index 000000000..9d16f573e --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-grid-loading-tip.json @@ -0,0 +1 @@ +[{"title":"关闭加载中状态","content":"

表格属性设置 loading 开启或关闭加载状态,默认值为 false 不开启。

\n","link":"grid/tiny-first-menu/grid-loading-off-tip","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-grid-loading-off-tip"},{"title":"开启加载中状态","content":"详细用法参考如下示例","link":"grid/tiny-first-menu/grid-loading-tip","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-grid-loading-tip"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-grid-optimization.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-grid-optimization.json new file mode 100644 index 000000000..97f139440 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-grid-optimization.json @@ -0,0 +1 @@ +[{"title":"优化配置项","content":"

optimization(Object) 配置说明

\n

| animat(Boolean) | 表格动画效果开关(关闭后视觉效果更快)默认为 true |\n| delayHover(Number) | 当表格发生拖动、滚动...等行为时,至少多少毫秒之后才允许触发 hover 事件 默认 250ms |\n| scrollX(Object) | 横向 X 虚拟滚动配置(用于特殊场景手动调优)例如:{ gt: 100 } |\n| scrollY(Object) | 纵向 Y 虚拟滚动配置(用于特殊场景手动调优)例如:{ gt: 500 } |

\n
\n

\n","link":"grid/tiny-first-menu/grid-optimization","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-grid-optimization"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-grid-size.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-grid-size.json new file mode 100644 index 000000000..6bfa527f0 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-grid-size.json @@ -0,0 +1 @@ +[{"title":"medium","content":"

表格设置 size 属性调整表格尺寸大小。

\n","link":"grid/tiny-first-menu/grid-size","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-grid-size"},{"title":"small","content":"详细用法参考如下示例","link":"grid/tiny-first-menu/grid-size-small","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-grid-size-small"},{"title":"mini","content":"详细用法参考如下示例","link":"grid/tiny-first-menu/grid-size-mini","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-grid-size-mini"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-grid-stripe.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-grid-stripe.json new file mode 100644 index 000000000..8d2cd871c --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-grid-stripe.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

stripe 是否带有斑马纹 默认不开启。设置 :stripe=\"true\" 时开启(注:需要注意的是,在可编辑表格场景下,临时插入的数据不会有斑马纹样式)

\n","link":"grid/stripe/stripe","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"stripe-stripe"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-header.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-header.json new file mode 100644 index 000000000..b796d50e9 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-header.json @@ -0,0 +1 @@ +[{"title":"控制隐藏表头","content":"

设置 showHeader 属性为 fasle 控制隐藏表头,默认为 true

\n","link":"grid/header/hide-grid-header","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"header-hide-grid-header"},{"title":"自定义表头","content":"

通过列 slot 插槽自定义表头

\n","link":"grid/header/custom-grid-header","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"header-custom-grid-header"},{"title":"配置自定义表头内容的模板","content":"

设置 header 插槽,配置自定义表头内容的模板。

\n","link":"grid/header/slot-header","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"header-slot-header"},{"title":"基本说明","content":"

通过列属性 header-class-name 给表头的单元格附加 className,也可以是函数 Function({$rowIndex, column, columnIndex, $columnIndex})。\n

\n","link":"grid/header/header-class-name","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"header-header-class-name"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-highlight.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-highlight.json new file mode 100644 index 000000000..e4fb928d4 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-highlight.json @@ -0,0 +1 @@ +[{"title":"高亮悬停行","content":"

设置 highlight-hover-row 属性控制鼠标悬停到当前行是否开启高亮。 默认为 true 开启高亮, 如果不需要悬停高亮设置 highlight-hover-rowfalse

\n","link":"grid/highlight/highlight-hover-row","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"highlight-highlight-hover-row"},{"title":"设置指定行高亮","content":"

setCurrentRow(row) 可设置某一行为高亮状态。

\n","link":"grid/methods/set-current-row","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"methods-set-current-row"},{"title":"开启选中行高亮","content":"

设置 highlight-current-row 属性控制鼠标选中行是否开启高亮

\n

\n带有斑马线的行无高亮效果\n

\n","link":"grid/highlight/highlight-current-row","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"highlight-highlight-current-row"},{"title":"列头是否开启高亮","content":"

设置 highlight-hover-column 属性为控制鼠标悬停到当前列的列头时是否开启高亮。

\n","link":"grid/highlight/highlight-hover-column","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"highlight-highlight-hover-column"},{"title":"选中列是否开启高亮","content":"

设置 highlight-current-column 属性控制鼠标选中的当前列是否开启高亮显示

\n","link":"grid/highlight/highlight-current-column","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"highlight-highlight-current-column"},{"title":"编辑时高亮单元格边框","content":"

设置 highlight-cell 是否在编辑时高亮单元格边框,只对 editConfig 配置时有效

\n","link":"grid/highlight/highlight-cell","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"highlight-highlight-cell"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-import-export.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-import-export.json new file mode 100644 index 000000000..56c9a9096 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-import-export.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"grid/tiny-first-menu/export-excel","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-export-excel"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-keyboard.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-keyboard.json new file mode 100644 index 000000000..5d19fb4a6 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-keyboard.json @@ -0,0 +1 @@ +[{"title":"键盘导航","content":"

按键说明

\n

| Arrow Up ↑ | 移动到当前活动单元格上面的单元格 |\n| Arrow Down ↓ | 移动到当前活动单元格下面的单元格 |\n| Arrow Left ← | 移动到当前活动单元格左边的单元格 |\n| Arrow Right → | 移动到当前活动单元格右边的单元格 |\n| Tab | 移动到当前选中或活动单元格的右侧单元格,如果到最后一列且存在下一行,则从下一行开始移动 |\n| Tab + Shift | 移动到当前选中或活动单元格的左侧单元格,如果到第一列且存在上一行,则从上一行开始移动 |\n| Spacebar | 如果单元格是复选框或单选框则切换勾选状态 |\n| Enter | 取消编辑并移动到当前活动单元格下面的单元格 |\n| Delete | 清空内容 |\n| Backspace | 清空内容并激活选中单元格为编辑状态 |\n| F2 | 激活单元格编辑 |\n| Esc | 取消单元格编辑 |\n| Page Up | 向上翻页滚动 |\n| Page Down | 向下翻页滚动 |\n| Home | 滚动到顶部 |\n| End | 滚动到底部 |

\n
\n","link":"grid/keyboard-navigation","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"keyboard-navigation"},{"title":"设置按键配置项","content":"

表格属性 keyboard-config 设置按键配置项。\n

\n","link":"grid/keyboard-config","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"keyboard-config"},{"title":"设置鼠标配置项","content":"

表格属性 mouse-config 设置鼠标配置项。\n

\n","link":"grid/mouse-config","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"mouse-config"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-large-data.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-large-data.json new file mode 100644 index 000000000..addf3b7e8 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-large-data.json @@ -0,0 +1 @@ +[{"title":"滚动分页","content":"

滚动分页配置步骤:\n1、表格属性设置 fetch-data 开启服务请求;\n2、表格属性设置 scroll-load 开启滚动分页。

\n","link":"grid/tiny-first-menu/scroll-paging","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-scroll-paging"},{"title":"虚拟滚动","content":"

虚拟滚动配置步骤:\n1、表格属性设置 height 固定高度;\n2、表格属性设置 optimization 开启虚拟滚动。

\n

optimization(Object) 配置说明

\n

| delayHover(Number) | 当表格发生拖动、滚动...等行为时,至少多少毫秒之后才允许触发 hover 事件 默认 250ms |\n| scrollX(Object) | 横向 X 虚拟滚动配置(用于特殊场景手动调优)例如:{ gt: 100 } |\n| scrollY(Object) | 纵向 Y 虚拟滚动配置(用于特殊场景手动调优)例如:{ gt: 500 } |

\n
\n

开启虚拟滚动注意事项

\n

1、开启虚拟滚动的前提是需要保证每列的宽度一样,可以通过在 <tiny-grid> 标签上的 column-width 属性配置统一的宽度。\n2、开启虚拟滚动将会禁用列宽调整功能,因为列拖拽会改变列宽度,导致虚拟滚动渲染的列数计算有误从而引起表格样式错乱,所以禁止列拖拽。

\n
\n","link":"grid/tiny-first-menu/virtual-rolling","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-virtual-rolling"},{"title":"树表虚拟滚动","content":"

名称 类型 描述 默认值
optimization.scrollX.gt Number 指定大于多少列时自动启动 X 虚拟滚动 100
optimization.scrollX.rSize Number 每次渲染列数
optimization.scrollX.vSize Number 指定可视区域列数
optimization.scrollX.adaptive Boolean 自动适配最优的渲染方式(设置为 false 列数组只会在滚动完成后截取一次,便于大数据场景提升性能,但是会短暂白屏,渲染完成后即恢复) true
optimization.scrollY.gt Number 指定大于多少行时自动启动 Y 虚拟滚动 500
optimization.scrollY.rSize Number 每次渲染行数
optimization.scrollY.adaptive Boolean 自动适配最优的渲染方式(设置为 false 行数组只会在滚动完成后截取一次,便于大数据场景提升性能,但是会短暂白屏,渲染完成后即恢复) true

\n
\n","link":"grid/tiny-first-menu/grid-large-tree-data","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-grid-large-tree-data"},{"title":"全量加载","content":"

当表格数据过多时会有性能问题,用户可通过 $refs 获取表格对象,设置表格对象的 loadData 方法启用全量加载来优化性能。

\n","link":"grid/tiny-first-menu/full-data-loading","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-full-data-loading"},{"title":"生成 1000 列","content":"

通过 loadColumn(columns) 方法可以加载列配置,对于需要重新加载列的场景下可能会用到。

\n","link":"grid/large-data/load-column","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"large-data-load-column"},{"title":"滚动到指定位置","content":"

方法说明

\n

scrollTo(scrollLeft, scrollTop):滚动到对应的位置\nscrollToRow(row):滚动到对应的行\nscrollToColumn(column):手滚动到对应的列

\n
\n","link":"grid/large-data/scroll-to","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"large-data-scroll-to"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-nested-grid.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-nested-grid.json new file mode 100644 index 000000000..f586c1712 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-nested-grid.json @@ -0,0 +1 @@ +[{"title":"嵌套表格","content":"

通过在默认插槽 default中使用表格组件,实现嵌套表格功能。

\n","link":"grid/grid_Example/nestedGrid","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-nestedGrid"},{"title":"检查行是否已展开","content":"

通过调用 hasRowExpand(row) 方法可以检查行是否已展开,参数 row 为行数据对象。

\n","link":"grid/expand/hasRowExpand","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"expand-hasRowExpand"},{"title":"设置展开所有行","content":"

通过调用 setAllRowExpansion(checked) 方法可设置所有行的展开与否。

\n","link":"grid/methods/set-all-row-expansion","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"methods-set-all-row-expansion"},{"title":"设置展开指定行","content":"

通过调用 setRowExpansion(rows, checked) 方法可设置展开指定行,第二个参数设置这一行展开与否,展开指定行时,通过调用clearRowExpand()方法先,关闭已展开的行。

\n","link":"grid/methods/set-row-expansion","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"methods-set-row-expansion"},{"title":"手动切换展开行","content":"

通过调用 toggleRowExpansion(row) 方法可手动切换展开行。

\n","link":"grid/methods/toggle-row-expansion","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"methods-toggle-row-expansion"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-operation-column.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-operation-column.json new file mode 100644 index 000000000..43c54e520 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-operation-column.json @@ -0,0 +1,114 @@ +[ + { + "title": "基本用法", + "content": "

表格列属性设置 type="radio" 显示单选列。

\n", + "link": "grid/tiny-first-menu/default-serial-column", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "tiny-first-menu-default-serial-column" + }, + { + "title": "手动取消单选行", + "content": "详细用法参考如下示例", + "link": "grid/tiny-first-menu/clearRadioRow", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "tiny-first-menu-clearRadioRow" + }, + { + "title": "翻页后保留选中状态", + "content": "

通过配置select-config中的reservetrue 并设置row-id,开启翻页后保留选中状态功能。

\n", + "link": "grid/tiny-first-menu/gridPagerReserve", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "tiny-first-menu-gridPagerReserve" + }, + { + "title": "手动选中某一行", + "content": "

setRadioRow(row) 用于单选行,设置某一行为选中状态。

\n", + "link": "grid/methods/set-radio-row", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "methods-set-radio-row" + }, + { + "title": "单选配置项", + "content": "

radio-config 配置项,可以配置单选框的默认选中项和禁用配置等特性。

\n", + "link": "grid/tiny-first-menu/radio-config", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "tiny-first-menu-radio-config" + }, + { + "title": "单选禁用", + "content": "

单选模式,通过 radio-config 配置项的属性 checkMethod ,传入自定义方法判断哪些数据项被禁用,方法会判断每个数据项,需返回值为 true 或者 false,代表此数据项启用或者禁用。

\n", + "link": "grid/disable-radio", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "disable-radio" + }, + { + "title": "显示多选列", + "content": "

表格列属性设置 type="selection" 显示多选列。

\n", + "link": "grid/tiny-first-menu/custom-serial-column", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "tiny-first-menu-custom-serial-column" + }, + { + "title": "手动取消多选行", + "content": "详细用法参考如下示例", + "link": "grid/tiny-first-menu/clearSelection", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "tiny-first-menu-clearSelection" + }, + { + "title": "手动选中所有行", + "content": "

setAllSelection(checked) 用于多选行,可设置所有行的选中状态。

\n", + "link": "grid/methods/set-all-selection", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "methods-set-all-selection" + }, + { + "title": "手动选中指定行", + "content": "

setSelection(rows, checked) 用于多选行,可设置指定行为选中状态,第一个参数可传入对象或数组,如果是对象则选择单行,如果是数组则选择多行,第二个参数为选中与否。

\n

TIP

\n

setSelection 方法不会触发 select-change 事件,只有点击才会触发。

多选模式,通过 select-config 配置项的属性checkField指定行数据的某个字段去决定这行数据的选中状态(并且选中状态和这个字段是双向绑定的)。

\n
\n", + "link": "grid/methods/set-selection", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "methods-set-selection" + }, + { + "title": "手动切换所有行选中状态", + "content": "

toggleAllSelection() 方法可直接切换所有行的选中状态。

\n", + "link": "grid/methods/toggle-all-selection", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "methods-toggle-all-selection" + }, + { + "title": "手动切换指定行选中状态", + "content": "

toggleRowSelection(row) 方法可直接切换某一行的选中状态。

\n", + "link": "grid/methods/toggle-row-selection", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "methods-toggle-row-selection" + }, + { + "title": "多选禁用", + "content": "

多选模式,通过 select-config 配置项的属性 checkMethod ,传入自定义方法判断哪些数据项被禁用,方法会判断每个数据项,需返回值为 true 或者 false,代表此数据项启用或者禁用。

\n", + "link": "grid/disable-selection", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "disable-selection" + }, + { + "title": "自定义操作列内容", + "content": "

通过插槽设置自定义操作列,即 <tiny-grid-column> 自定义操作列内容 </tiny-grid-column>

\n", + "link": "grid/tiny-first-menu/custom-operation-column", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "tiny-first-menu-custom-operation-column" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-pager.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-pager.json new file mode 100644 index 000000000..88d8311b3 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-pager.json @@ -0,0 +1,26 @@ +[ + { + "title": "使用默认分页组件", + "content": "

如果不配置 {component: Pager} 则默认使用内置的分页组件。

\n", + "link": "grid/pager/inner-default-pager", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "pager-inner-default-pager" + }, + { + "title": "使用第三方分页组件", + "content": "

第三方分页组件配置步骤:\n1、import 引入自己引入的分页组件(这里使用官方的分页组件示范) Pager 组件,即 import Pager from '@opentiny/vue-pager' 或者 { Pager } from '@opentiny/vue' 。\n2、Pager 传入给 data() 函数存储起来以便模板中使用。\n3、表格属性设置 pager 进行分页相关配置,通过 pager 的属性 {component: Pager} 注入分页组件。\n4、配置 seq-serial 属性可以设置翻页后序号连续显示,默认是不连续显示的

\n", + "link": "grid/pager/inner-pager", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "pager-inner-pager" + }, + { + "title": "提示保存数据", + "content": "

配置 showSaveMsg 属性,当检查到表格数据存在修改时,会提示用户进行保存

\n", + "link": "grid/pager/showSaveMsg", + "component": " Grid 表格", + "findIntroStr": "表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。", + "demoId": "pager-showSaveMsg" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-renderer.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-renderer.json new file mode 100644 index 000000000..a120dd369 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-renderer.json @@ -0,0 +1 @@ +[{"title":"内置渲染器","content":"

内置渲染器设置当前表格列的显示获取类型。\n在 grid-column 列配置 format-text 对象,配合 format-config 可以控制数据格式。

\n

TIP

\n

format-text 的可取值包括:

\n
    \n
  • integer:显示成整数。
  • \n
  • number:显示成小数。
  • \n
  • money:显示成钱数。
  • \n
  • rate:显示成百分比的数据。
  • \n
  • filesize:显示成文件大小的数据。
  • \n
  • boole:显示成对号或者叉号的图标。
  • \n
  • date:显示成年月日。
  • \n
  • dateTime:显示成年月日时分。
  • \n
  • longDateTime:显示成年月日时分秒。
  • \n
  • time:显示成时分。
  • \n
  • longTime:显示成时分秒。
  • \n
  • yearMonth:显示成年月。
  • \n
  • enum:通过数据的值,查询出要显示的文本。
  • \n
  • ellipsis:显示成省略的内容,鼠标移到该单元格上,显示完整内容的提示信息。需要同时配置 format 的 len 属性。
  • \n
\n
\n","link":"grid/grid_Example/gridRenderer/inner-renderer","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-gridRenderer-inner-renderer"},{"title":"自定义渲染器","content":"

自定义渲染器可以自定义渲染单元格,也可渲染一个 vue 组件。在 grid-column 列配置 renderer,支持方法和对象配置。具体参考下面示例。

\n","link":"grid/grid_Example/gridRenderer/custom-renderer","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-gridRenderer-custom-renderer"},{"title":"列异步数据渲染","content":"

将列format-configasync属性配置为true后,支持动态修改其data数据自动渲染。 这种整列异步渲染一般将type设置为enum,通过valuelabel可以配置渲染单元格的映射。

\n","link":"grid/news/async-colunm-render","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"news-async-colunm-render"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-reverse-column-row.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-reverse-column-row.json new file mode 100644 index 000000000..e1bc65fab --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-reverse-column-row.json @@ -0,0 +1 @@ +[{"title":"Grid-表格行列反转","content":"

需要在 grid 标签上配 :columns="tableColumn" :show-header="false"。点击“反转表格”按钮可查看效果,现阶段只能执行一次,执行多次会有问题。具体参考下面示例。

\n","link":"grid/grid_Example/reverseRow","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-reverseRow"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-row-grouping.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-row-grouping.json new file mode 100644 index 000000000..794c676a7 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-row-grouping.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

row-group 属性可以配置行分组,行分组会将具有相同值的列进行分组展示。

\n","link":"grid/row-grouping","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"row-grouping"},{"title":"自定义分组","content":"

row-group 配置项 render 可以自定义渲染分组内容, closeable 可以控制分组行是否可以折叠。

\n","link":"grid/rowGroupRender","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"rowGroupRender"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-serial-column.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-serial-column.json new file mode 100644 index 000000000..57597c95f --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-serial-column.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

表格列属性设置 type="index" 显示序号列。

\n","link":"grid/tiny-first-menu/default-serial-column","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-default-serial-column"},{"title":"自定义序号规则","content":"

表格列属性设置 type="index" 显示序号列,index-method 方法设置自定义序号规则。

\n","link":"grid/tiny-first-menu/custom-serial-column","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-custom-serial-column"},{"title":"自定义序号列的起始值","content":"

表格列属性设置 type="index" 显示序号列,start-index 设置自定义序号列的起始值。

\n","link":"grid/tiny-first-menu/start-index","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-start-index"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-slot.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-slot.json new file mode 100644 index 000000000..16f839da6 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-slot.json @@ -0,0 +1 @@ +[{"title":"默认插槽","content":"详细用法参考如下示例","link":"grid/slot/default-slot","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"slot-default-slot"},{"title":"工具栏插槽","content":"详细用法参考如下示例","link":"grid/slot/buttons-slot","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"slot-buttons-slot"},{"title":"空数据显示插槽","content":"详细用法参考如下示例","link":"grid/slot/empty-slot","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"slot-empty-slot"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-sort.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-sort.json new file mode 100644 index 000000000..6f666b3a0 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-sort.json @@ -0,0 +1 @@ +[{"title":"默认排序","content":"

通过表格列设置 sortable 属性开启该列排序功能。

\n","link":"grid/sort/default-sort","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"sort-default-sort"},{"title":"唯一主键","content":"

通过表格设置 row-id 自定义行数据唯一主键的字段名。该属性的默认值为 _XID

\n","link":"grid/tiny-first-menu/row-id","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-row-id"},{"title":"多字段组合排序","content":"

通过表格列设置 sortable 属性开启该列排序功能,然后设置 sort-by 属性实现多字段组合排序,数组列表就是排序的字段列表。

\n","link":"grid/sort/combinations-sort","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"sort-combinations-sort"},{"title":"自定义排序","content":"

通过表格列设置 sortable 属性开启该列排序功能,然后设置 sort-method 方法实现自定义排序。

\n","link":"grid/sort/custom-sort","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"sort-custom-sort"},{"title":"手动排序","content":"

通过 sort(field, order) 方法可手动对表格进行排序(如果 order 为空则自动切换排序)。

\n","link":"grid/methods/sort","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"methods-sort"},{"title":"表格服务端排序","content":"

通过表格列设置 sortable 属性开启该列排序功能,然后表格设置 remote-sort 方法开启服务端排序。\n该示例中的 services/getGridMockData 服务需要自行实现,示例模拟了远程服务返回的数据\n

\n","link":"grid/sort/server-sort","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"sort-server-sort"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-span.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-span.json new file mode 100644 index 000000000..b9f6d6e95 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-span.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

通过表格列属性 row-span 设置内置的行合并规则,该属性仅适用于普通表格,嵌套树表不支持。

\n","link":"grid/span/row-span/row-span-easy","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"span-row-span-row-span-easy"},{"title":"自定义合并规则","content":"

通过表格列属性 span-method 设置自定义合并规则。

\n","link":"grid/span/row-span/row-span","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"span-row-span-row-span"},{"title":"列合并","content":"

列合并是通过表格列设置方法 span-method 实现的自定义合并规则。例如:

\n
\n

实现2列合并

\n
\n","link":"grid/span/column-span","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"span-column-span"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-summary.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-summary.json new file mode 100644 index 000000000..904953a2f --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-summary.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

通过 footer-methodshow-footer 配置自定义统计。

\n","link":"grid/summary/custom-summary","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"summary-custom-summary"},{"title":"设置配置式的统计","content":"

通过 summary-config 设置配置式的统计。

\n","link":"grid/summary/configuration-summary","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"summary-configuration-summary"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-tip.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-tip.json new file mode 100644 index 000000000..8ce26db71 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-tip.json @@ -0,0 +1 @@ +[{"title":"列头提示","content":"

列头提示有2种,一种是 show-header-tip 提示(内容是否超出都会提示),另一种是 show-header-overflow 内容超出当前行时隐藏并提示。

\n

TIP

\n

show-header-overflow 可选值有:

\n
    \n
  • tooltip:内容超出部分显示 ...,左侧/右侧弹出提示层显示全部信息,show-overflow 开启时的缺省提示
  • \n
  • title:和原生标签的 title 属性一致
  • \n
  • ellipsis:内容超出部分显示 ...,没有提示
  • \n
\n
\n","link":"grid/tip/column-header-tip","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tip-column-header-tip"},{"title":"单元格提示","content":"

单元格提示有2种,一种是 show-tip 提示(内容是否超出都会提示),另一种是 show-overflow 内容超出当前行时隐藏并提示。

\n

TIP

\n

show-overflow 可选值有:

\n
    \n
  • title:和原生标签的 title 属性一致
  • \n
  • ellipsis:内容超出部分显示 ...,没有提示
  • \n
  • tooltip:内容超出部分显示 ...,左侧/右侧弹出提示层显示全部信息,show-overflow 开启时的缺省提示\ntooltip 提示可通过 Grid 属性 :tooltip-config 进行配置,配置方式参考 Tooltip 组件
  • \n
\n
\n","link":"grid/tip/cell-tip","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tip-cell-tip"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-toolbar.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-toolbar.json new file mode 100644 index 000000000..139d6e36d --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-toolbar.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

工具栏配置步骤:\n1、表格以插槽方式引入表格工具栏组件 GridToolbar,并设置工具栏组件属性 slot="toolbar" 。\n2、设置工具栏组件属性 buttons 进行按钮组相关配置。\n3、表格事件设置 @toolbar-button-click 获取工具栏 buttons 的事件,用户可自定义实现增删改操作的业务逻辑。

\n

新增的行需要标记新增状态的样式时需要配置 edit-config 的 markInsert 项为 true

\n
\n","link":"grid/tiny-first-menu/insert-delete-update","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-insert-delete-update"},{"title":"取消删除","content":"

在工具栏中配置 mark_cancel 的 code,勾选数据后,单击 删除/取消删除 按钮,勾选的数据将标记删除线。再单击 保存 按钮请求服务删除标记的数据。已标记删除线的数据勾选后再次单击 删除/取消删除 按钮,会取消删除线。\n 需要配置 fetch-data 请求服务时才有标记删除线和取消删除线的效果\n

\n","link":"grid/toolbar/cancel-delete","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"toolbar-cancel-delete"},{"title":"清空数据","content":"

clearData 方法手动清空单元格内容,如果不传参数,则清空整个表格内容。如果传了行则清空指定行内容,如果传了指定字段,则清空该字段内容。具体参考下面示例。

\n","link":"grid/tiny-first-menu/clearData","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-clearData"},{"title":"指定行插入数据和删除指定行","content":"

通过 insertAt(records, row) 方法可以在指定行插入一行或多行数据。remove(rows) 方法可以删除指定一行或多行数据,rows 为对象则是一行,数组则是多行数据,为空则删除所有数据。

\n","link":"grid/toolbar/insert-remove-rows","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"toolbar-insert-remove-rows"},{"title":"服务端数据保存和删除方法","content":"

通过表格属性 save-data 服务端数据保存方法。\n通过表格属性 delete-data 服务端数据删除方法。

\n","link":"grid/tiny-first-menu/save-data","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-save-data"},{"title":"设置工具栏尺寸大小","content":"

工具栏配置步骤:\n1、表格以插槽方式引入表格工具栏组件 GridToolbar,并设置工具栏组件属性 slot="toolbar" 。\n2、设置工具栏组件属性 buttons 进行按钮组相关配置。\n3、表格事件设置 @toolbar-button-click 获取工具栏 buttons 的事件,用户可自定义实现复制行操作的业务逻辑。

\n
    \n
  • size 属性设置工具栏尺寸大小,包括 large、medium、small、mini 四种不同大小。不设置时为默认尺寸。
  • \n
\n","link":"grid/tiny-first-menu/copy-row-data","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-copy-row-data"},{"title":"开启表格刷新功能","content":"

工具栏配置步骤:\n1、表格以插槽方式引入表格工具栏组件 GridToolbar,并设置工具栏组件属性 slot="toolbar" 。\n2、设置工具栏组件属性 refresh 开启表格刷新功能。

\n
    \n
  • 设置工具栏属性 loading 开启/关闭加载中。\n自定义实现刷新时直接调用handleFetch('reload')
  • \n
\n","link":"grid/tiny-first-menu/refresh-grid","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-refresh-grid"},{"title":"开启表格全屏功能","content":"

工具栏配置步骤:\n1、表格以插槽方式引入表格工具栏组件 GridToolbar,并设置工具栏组件属性 slot="toolbar" 。\n2、设置工具栏组件属性 full-screen 开启表格全屏功能。

\n","link":"grid/tiny-first-menu/grid-full-screen","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-grid-full-screen"},{"title":"全屏时改变表格高度","content":"详细用法参考如下示例","link":"grid/tiny-first-menu/grid-full-screen-height","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-grid-full-screen-height"},{"title":"工具栏自定义插槽","content":"

工具栏配置步骤:\n1、表格以插槽方式引入表格工具栏组件 GridToolbar,并设置工具栏组件插槽 #toolbar 。\n2、通过工具栏组件的插槽 #buttons 自定义内容。

\n","link":"grid/tiny-first-menu/custom-toolbar","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-custom-toolbar"},{"title":"配置式","content":"

通过 v-bind 绑定一个对象来实现配置式。在绑定的对象中 toolbar 字段用于工具栏配置,可配合 events 字段对工具栏中按钮进行 toolbarButtonClick 事件配置。另外,pager 字段用于分页配置,fetchData 字段用于请求服务。

\n","link":"grid/toolbar/toolbar-op-config","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"toolbar-toolbar-op-config"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-tree-grid.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-tree-grid.json new file mode 100644 index 000000000..7c86c5cdf --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-tree-grid.json @@ -0,0 +1 @@ +[{"title":"有子级的数据结构","content":"

在 grid 标签上配置 tree-config="{children: 'children'}"以树的形式来展示数据,还需要在展示树节点的字段上配置 tree-node 属性

\n","link":"grid/tree-table/tree-grid-base","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tree-table-tree-grid-base"},{"title":"扁平化数据结构","content":"

注意:扁平化的数据结构需要调用 aggregateTableData 方法把数据转换成带有子级的数据才能正常的显示出树表的结构

\n","link":"grid/tree-table/tree-grid-data","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tree-table-tree-grid-data"},{"title":"操作列","content":"

列通过配置 type="radio" 实现单选,配置 type="selection" 实现多选

\n","link":"grid/tree-table/tree-grid-operation-column","component":" 树表","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tree-table-tree-grid-operation-column"},{"title":"手动展开所有树节点","content":"

setAllTreeExpansion(checked) 可设置所有树节点的展开与否。

\n","link":"grid/methods/set-all-tree-expansion","component":" 树表","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"methods-set-all-tree-expansion"},{"title":"手动展开指定树节点","content":"

setTreeExpansion(rows, checked) 可设置展开指定的树形节点,第二个参数设置这一行展开与否。

\n","link":"grid/methods/set-tree-expansion","component":" 树表","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"methods-set-tree-expansion"},{"title":"手动切换展开树形节点","content":"

toggleTreeExpansion(row) 可设置切换展开树形节点。

\n","link":"grid/methods/toggle-tree-expansion","component":" 树表","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"methods-toggle-tree-expansion"},{"title":"冻结列","content":"

在列的标签上可以通过配置 fixed="left" 属性把该列固定在左侧,配置 fixed="right" 属性把该列固定在右侧

\n","link":"grid/tree-table/tree-grid-fixed-column","component":" 树表","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tree-table-tree-grid-fixed-column"},{"title":"展开行","content":"

在 column 标签上配置 type="expand" 展开行,可以通过 v-slot 插槽插入需要的模板信息

\n","link":"grid/tree-table/tree-grid-expand","component":" 树表","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tree-table-tree-grid-expand"},{"title":"检查树节点是否已展开","content":"

通过 hasTreeExpand(row) 方法可以检查树节点是否已展开,参数 row 为行数据对象。

\n","link":"grid/tree-table/hasTreeExpand","component":" 树表","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tree-table-hasTreeExpand"},{"title":"展开行序号列配置","content":"

treeConfig 属性里配置 orderedfalse 展开行,序号列按父子级的结构排序。默认 ordered 属性为 true 展开行后序号列按序号排序。

\n","link":"grid/tree-table/tree-grid-index","component":" 树表","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tree-table-tree-grid-index"},{"title":"基本用法","content":"

表格属性 expand-config 设置展开行配置项。

\n","link":"grid/tree-table/tree-grid-expand-config","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tree-table-tree-grid-expand-config"},{"title":"增删改","content":"

在 grid-toolbar 标签上配置 slot="toolbar" 插槽,配置相关的操作按钮 ,注意:新增数据需要在 grid 标签上配置 edit-config 编辑框的配置信息,并通过 ref 获取到组件实例调用方法进行相关操作,findTree、filterTree 是工具类里的查找和过滤方法。由于tree数据节构的特殊性,grid的getInsertRecordsgetRecordset方法无法获取到新增数据,此类数据需要用户自行处理。

\n","link":"grid/tree-table/tree-grid-insert-delete-update","component":" 树表","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tree-table-tree-grid-insert-delete-update"},{"title":"键盘操作","content":"

键盘移动高亮行,设置斑马线属性 stripe 为 false,鼠标悬停高亮行 highlight-hover-row 为 false,高亮当前行 highlight-current-row ,并配置 keyboard-config={isArrow: true} 属性启用方向键功能\n | Arrow Up ↑ | 移动到高亮行的上一行\n | Arrow Down ↓ | 移动到高亮行的下一行\n | Enter | 展开节点,进入子节点\n | Backspace | 关闭节点,返回到父节点

\n","link":"grid/tree-table/tree-grid-keyboard-operation","component":" 树表","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tree-table-tree-grid-keyboard-operation"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-validation.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-validation.json new file mode 100644 index 000000000..81fe674b0 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-validation.json @@ -0,0 +1 @@ +[{"title":"编辑时校验","content":"

grid 标签配置 edit-config 对象,并配置 edit-rules 对象来设置校验对象和校验规则。具体参考下面示例。

\n","link":"grid/grid_Example/gridValid/editing-validation","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-gridValid-editing-validation"},{"title":"隐藏列编辑时校验","content":"

grid 标签配置 edit-config 对象且列配置type:visible 且配置isValidAlways属性时, 即列总是显示可编辑状态时,支持编辑时校验,并配置 edit-rules 对象来设置校验对象和校验规则。具体参考下面示例。

\n","link":"grid/grid_Example/gridValid/editing-isvalidalways-validation","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-gridValid-editing-isvalidalways-validation"},{"title":"数据关联校验","content":"

在自定义校验时,validator方法rule参数中可获取到当前行与列的信息。可以按业务的需求实现数据关联的校验逻辑

\n","link":"grid/grid_Example/gridValid/row-data-valid","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-gridValid-row-data-valid"},{"title":"自定义组件与插槽编辑器校验","content":"

在使用自定义组件时,组件需要实现v-model的功能。在使用插槽时想要实时校验需要手动触发组件的校验方法

\n","link":"grid/grid_Example/gridValid/custcomp","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-gridValid-custcomp"},{"title":"选中时校验","content":"

grid 标签配置 edit-config 对象,并配置 edit-rules 对象来设置校验对象和校验规则,通过按钮点击事件调用 this.$refs.basicGrid.validate()方法来触发表格校验,具体参考下面示例。

\n","link":"grid/grid_Example/gridValid/select-validation","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-gridValid-select-validation"},{"title":"提交前校验","content":"

grid 标签配置 edit-config 对象,并配置 edit-rules 对象来设置校验对象和校验规则,通过按钮点击事件调用 this.$refs.basicGrid.validate()方法来触发表格校验,具体参考下面示例。

\n","link":"grid/grid_Example/gridValid/before-submit-validation","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-gridValid-before-submit-validation"},{"title":"触发校验时自动定位到当前校验的单元格","content":"

grid 编辑器引入 tiny.0 组件,标签配置 edit-config 对象,并配置 edit-rules 对象来设置校验对象和校验规则,通过按钮点击事件调用 this.$refs.basicGrid.validate()方法来触发表格校验,具体参考下面示例。

\n","link":"grid/grid_Example/gridValid/validation-scroll-to-col","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-gridValid-validation-scroll-to-col"},{"title":"错误提示配置项","content":"

表格默认错误提示显示在 body 上, 可以通过设置 tooltip-configappendTobody 设置为 false 来解决页面滚动时tip位置错误的问题。设置 placement 属性调整默认显示方向。tooltip-config 的配置可参参考 tooltip 组件

\n","link":"grid/grid_Example/gridValid/tipconfig","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"grid_Example-gridValid-tipconfig"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid-width-height.json b/examples/docs/resources/pc/demo-config/zh-CN/grid-width-height.json new file mode 100644 index 000000000..645186957 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid-width-height.json @@ -0,0 +1 @@ +[{"title":"开启列宽拖拽","content":"

列宽默认开启,如需禁用需要设置resizablefalse

\n","link":"grid/tiny-first-menu/resize-column-width","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-resize-column-width"},{"title":"表格列属性设置宽度","content":"

表格列属性设置 width 固定宽度,支持数值和百分比。

\n","link":"grid/tiny-first-menu/fixed-column-width","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-fixed-column-width"},{"title":"列宽自适应撑开","content":"

表格属性设置 fit 自动撑开,默认值为 true 开启自适应撑开,值为 false 时必须设置列宽度,否则表格宽度由单元格内容撑开。

\n","link":"grid/tiny-first-menu/adaptive-column-width","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-adaptive-column-width"},{"title":"列宽不自适应撑开","content":"详细用法参考如下示例","link":"grid/tiny-first-menu/adaptive-un-column-width","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-adaptive-un-column-width"},{"title":"表格属性设置高度","content":"

表格属性设置 height 固定表格高度。

\n","link":"grid/tiny-first-menu/fixed-grid-height","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-fixed-grid-height"},{"title":"关闭响应式表格宽高","content":"详细用法参考如下示例","link":"grid/tiny-first-menu/adaptive-grid-off-width-height","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-adaptive-grid-off-width-height"},{"title":"开启响应式表格宽高","content":"

表格属性设置 autoResize 属性开启响应式表格宽高的同时,将高度heigh设置为auto就可以自动跟随父容器高度。

\n","link":"grid/news/auto-height","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"news-auto-height"},{"title":"设置 minHeight 最小高度","content":"

表格属性设置 minHeight 限制最小高度,maxHeight 限制最大高度。

\n","link":"grid/tiny-first-menu/min-grid-height","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-min-grid-height"},{"title":"设置 maxHeight 最大高度","content":"详细用法参考如下示例","link":"grid/tiny-first-menu/max-min-grid-height","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-max-min-grid-height"},{"title":"设置总体列宽","content":"

通过属性 column-min-width 设置总体列可以调整到的最小宽度,不设置时默认为列头 span 的宽度 + 36(头部固定宽度)。\n

\n","link":"grid/tiny-first-menu/column-min-width","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-column-min-width"},{"title":"本列最小宽度","content":"

通过表格列属性 min-width 本列最小宽度;会自动将剩余空间按比例分配。\n

\n","link":"grid/tiny-first-menu/min-width","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-min-width"},{"title":"设置所有列宽度","content":"

通过属性 column-width 设置所有列宽度,默认值为均匀分配。\n

\n","link":"grid/tiny-first-menu/column-width","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"tiny-first-menu-column-width"},{"title":"重新计算表格","content":"

通过 recalculate() 方法可以重新计算表格,当父容器宽度变化时可通过该方法重新计算表格。

\n","link":"grid/recalculate","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"recalculate"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/grid.json b/examples/docs/resources/pc/demo-config/zh-CN/grid.json new file mode 100644 index 000000000..b26157bdd --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/grid.json @@ -0,0 +1 @@ +[{"title":"标签式","content":"详细用法参考如下示例","link":"grid/basicUsage","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"basicUsage"},{"title":"配置式","content":"详细用法参考如下示例","link":"grid/basicUsage-conf","component":" Grid 表格","findIntroStr":"表格组件,提供了非常强大数据表格功能,在 Grid 可以展示数据列表,可以对数据列表进行选择、编辑等。","demoId":"basicUsage-conf"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/hrapprover.json b/examples/docs/resources/pc/demo-config/zh-CN/hrapprover.json new file mode 100644 index 000000000..b932d4bab --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/hrapprover.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"hrapprover/basic-usage","component":" Hrapprover 权签人","findIntroStr":"权签人业务组件用于根据部门查询权签人。","demoId":"basic-usage"},{"title":"权签类别","content":"

可通过 category 设置权签类别,默认值是 0303,发送权签人请求的category参数。

\n","link":"hrapprover/category-type","component":" Hrapprover 权签人","findIntroStr":"权签人业务组件用于根据部门查询权签人。","demoId":"category-type"},{"title":"禁用","content":"

通过 value 设置权签人的值。 通过 disabled 设置组件是否禁用,默认值为 false。

\n","link":"hrapprover/disabled","component":" Hrapprover 权签人","findIntroStr":"权签人业务组件用于根据部门查询权签人。","demoId":"disabled"},{"title":"自定义服务","content":"

通过 fetch-hrapprover 属性可以指定一个方法,在方法中可实现请求自定义的服务。

\n","link":"hrapprover/custom-service","component":" Hrapprover 权签人","findIntroStr":"权签人业务组件用于根据部门查询权签人。","demoId":"custom-service"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/icon.json b/examples/docs/resources/pc/demo-config/zh-CN/icon.json new file mode 100644 index 000000000..20874256e --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/icon.json @@ -0,0 +1,26 @@ +[ + { + "title": "基本用法", + "content": "详细用法参考如下示例", + "link": "icon/basic-usage", + "component": " Icon 图标", + "findIntroStr": "提供了一套常用的图标集合,从 @opentiny/vue-icon 引入相应的图标类函数。图标类函数首字母大写/小写均可引入,执行该函数以生成一个图标类。", + "demoId": "basic-usage" + }, + { + "title": "显示 Title", + "content": "

通过在 Icon 的父级元素上增加 title 属性来实现给 Icon 图标增加 Title 的功能。

\n", + "link": "icon/show-title", + "component": " Icon 图标", + "findIntroStr": "提供了一套常用的图标集合,直接通过设置类名为 `icon-iconName` 来使用。", + "demoId": "show-title" + }, + { + "title": "图标集合", + "content": "全部图标参考如下", + "link": "icon/list", + "component": " Icon 图标", + "findIntroStr": "提供了一套常用的图标集合,直接通过设置类名为 `icon-iconName` 来使用。", + "demoId": "list" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/image.json b/examples/docs/resources/pc/demo-config/zh-CN/image.json new file mode 100644 index 000000000..a7ebffce5 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/image.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

通过 src 设置预览的图片路径。

\n","link":"image/basic-usage","component":" Image 图片预览","findIntroStr":"图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。","demoId":"basic-usage"},{"title":"自适应容器尺寸","content":"

可通过 fit 属性确定图片如何适应到容器框,同原生 css 的 object-fit 属性。

\n

object-fit 说明

\n

fill:被替换的内容将被缩放,以在填充元素的内容框时保持其宽高比\ncontain:被替换的内容大小可以填充元素的内容框\ncover:被替换的内容大小保持其宽高比,同时填充元素的整个内容框\nnone:被替换的内容尺寸不会被改变\nscale-down:内容的尺寸就像是指定了none 或 contain,取决于哪一个将导致更小的对象尺寸。

\n
\n","link":"image/auto-fit-container-size","component":" Image 图片预览","findIntroStr":"图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。","demoId":"auto-fit-container-size"},{"title":"占位内容","content":"

可通过 slot = placeholder 自定义占位内容。

\n","link":"image/custom-placeholder","component":" Image 图片预览","findIntroStr":"图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。","demoId":"custom-placeholder"},{"title":"懒加载","content":"

可通过 lazy 开启懒加载功能,当图片滚动到可视范围内才会加载。可通过 scroll-container 来设置滚动容器,若未定义,则为最近一个 overflow 值为 autoscroll 的父元素。

\n

提示

\n

lazy 懒加载的图片必须是远程的图片,不支持静态图片懒加载。

\n
\n","link":"image/lazy-load","component":" Image 图片预览","findIntroStr":"图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。","demoId":"lazy-load"},{"title":"预览大图","content":"

通过 preview-src-list 开启预览大图的功能。

\n","link":"image/preview-src-list","component":" Image 图片预览","findIntroStr":"图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。","demoId":"preview-src-list"},{"title":"图片预览层级","content":"

可通过 z-index 设置预览图片的层级。

\n","link":"image/preview-z-index","component":" Image 图片预览","findIntroStr":"图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。","demoId":"preview-z-index"},{"title":"加载成功事件","content":"

图片加载成功触发 load 事件。

\n","link":"image/load-event","component":" Image 图片预览","findIntroStr":"图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。","demoId":"load-event"},{"title":"加载失败事件","content":"

图片加载失败触发 error 事件。

\n","link":"image/load-error","component":" Image 图片预览","findIntroStr":"图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。","demoId":"load-error"},{"title":"加载失败","content":"

可通过 slot = error 自定义加载失败内容。

\n","link":"image/custom-load-failed-text","component":" Image 图片预览","findIntroStr":"图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。","demoId":"custom-load-failed-text"},{"title":"对话框中预览图片","content":"

dialog-box 元素中嵌入 image 进行图片预览。

\n","link":"image/preview-in-dialog","component":" Image 图片预览","findIntroStr":"图片容器,在保留原生 img 的特性下,支持懒加载,自定义占位、加载失败等功能。","demoId":"preview-in-dialog"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/input.json b/examples/docs/resources/pc/demo-config/zh-CN/input.json new file mode 100644 index 000000000..c1693abee --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/input.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"input/basic-usage","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"basic-usage"},{"title":"可清空","content":"

可通过 clearable 属性设置输入框显示清空图标按钮。

\n","link":"input/clearable","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"clearable"},{"title":"密码显示","content":"

typepassword 时,可通过 show-password 属性设置输入框显示密码显示/隐藏切换图标按钮。

\n","link":"input/show-password","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"show-password"},{"title":"type 属性","content":"

通过对应的 type 属性,可以设置为对应的类型。默认为 text,可选值为 text,textarea 和其他 原生 input 的 type 值

\n","link":"input/type","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"type"},{"title":"尺寸","content":"

可通过 size 属性设置尺寸大小,可选值:medium / small / mini。注意:只在 type!="textarea" 时有效。

\n","link":"input/size","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"size"},{"title":"form","content":"

可通过 form 属性设置原生属性 form 。

\n","link":"input/form","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"form"},{"title":"原生属性","content":"

可设置 name disabled readonly等原生属性。

\n","link":"input/name","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"name"},{"title":"输入框关联文字","content":"

可通过 label 属性设置输入框关联的 label 文字。

\n","link":"input/label","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"label"},{"title":"头部图标","content":"

可通过 prefix-icon 属性设置输入框头部图标。

\n","link":"input/prefix-icon","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"prefix-icon"},{"title":"尾部图标","content":"

可通过 suffix-icon 属性设置输入框尾部图标。

\n","link":"input/suffix-icon","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"suffix-icon"},{"title":"可缩放文本域","content":"

可通过 resize 属性设置文本域的缩放。可选值:none / both / horizontal / vertical。注意:只在 type="textarea" 时有效。

\n","link":"input/resize","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"resize"},{"title":"文本域行数","content":"

可通过 rows 属性设置文本域显示行数。注意:只在 text="textarea" 时有效。

\n","link":"input/rows","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"rows"},{"title":"文本域宽度","content":"

可通过 cols 属性设置文本域显示宽度。注意:只在 text="textarea" 时有效。

\n","link":"input/cols","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"cols"},{"title":"可自适应文本高度的文本域","content":"

可通过 autosize 属性设置文本域自适应内容高度。可传入对象,如{ minRows: 2, maxRows: 6 }。注意:只对 type="textarea" 有效。

\n","link":"input/autosize","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"autosize"},{"title":"输入框的 tabindex","content":"

可通过 tabindex 属性设置输入框的 tabindex

\n","link":"input/tabindex","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"tabindex"},{"title":"前置内容","content":"

配置 prepend slot,设置输入框前置内容,注意:只对 type="text" 有效。

\n","link":"input/slot-prepend","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"slot-prepend"},{"title":"后置内容","content":"

配置 append slot,设置输入框后置内容,注意:只对 type="text" 有效。

\n","link":"input/slot-append","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"slot-append"},{"title":"头部内容","content":"

配置 prefix slot,设置输入框头部内容,注意:只对 type="text" 有效。

\n","link":"input/slot-prefix","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"slot-prefix"},{"title":"尾部内容","content":"

配置 suffix slot,设置输入框尾部内容,注意:只对 type="text" 有效。

\n","link":"input/slot-suffix","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"slot-suffix"},{"title":"最大值","content":"

可通过 max 属性设置输入框最大值。max 是原生属性。

\n","link":"input/max","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"max"},{"title":"最小值","content":"

可通过 min 属性设置输入框最小值。min 是原生属性。

\n","link":"input/min","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"min"},{"title":"最大输入长度","content":"

可通过 maxlength 属性设置输入框最大输入长度。maxlength 是原生属性。

\n","link":"input/maxlength","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"maxlength"},{"title":"输入字数统计","content":"

可通过 show-word-limit 属性设置是否显示输入字数统计,只在 type = "text" 或 type = "textarea" 时有效

\n","link":"input/show-word-limit","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"show-word-limit"},{"title":"计数器","content":"

可通过 counter 属性设置显示输入框字符计数器。

\n","link":"input/counter","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"counter"},{"title":"输入字段的合法数字间隔","content":"

可通过 step 属性设置输入字段的合法数字间隔。step 是原生属性。

\n","link":"input/step","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"step"},{"title":"输入时触发表单校验","content":"

可通过 validate-event 属性设置输入时触发表单校验。通过 trigger 配置触发校验规则的方式,为 change 时,当输入框值改变即触发校验,为 blur 时则失焦后触发校验。

\n","link":"input/validate-event","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"validate-event"},{"title":"自动获取焦点","content":"

可通过 autofocus 属性设置自动获取焦点。autofocus 是原生属性。

\n","link":"input/autofocus","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"autofocus"},{"title":"自动补全","content":"

可通过 autocomplete 属性设置自动补全,默认值为 off ,可选 on 。

\n","link":"input/autocomplete","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"autocomplete"},{"title":"失焦事件","content":"

输入框失去焦点时触发 blur 事件。

\n","link":"input/event-blur","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"event-blur"},{"title":"值改变事件","content":"

输入框值改变时触发 change 事件。

\n","link":"input/event-change","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"event-change"},{"title":"清除事件","content":"

点击输入框清除按钮时触发 clear 事件。

\n","link":"input/event-clear","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"event-clear"},{"title":"聚焦事件","content":"

输入框获取焦点时触发 focus 事件。

\n","link":"input/event-focus","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"event-focus"},{"title":"记忆历史输入","content":"详细用法参考如下示例","link":"input/method-addMemory","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"method-addMemory"},{"title":"失去焦点","content":"详细用法参考如下示例","link":"input/method-blur","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"method-blur"},{"title":"获取焦点","content":"详细用法参考如下示例","link":"input/method-focus","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"method-focus"},{"title":"选中输入框文本","content":"详细用法参考如下示例","link":"input/method-select","component":" Input 输入框","findIntroStr":"通过鼠标或键盘输入字符。","demoId":"method-select"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/ip-address.json b/examples/docs/resources/pc/demo-config/zh-CN/ip-address.json new file mode 100644 index 000000000..3a70c21bd --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/ip-address.json @@ -0,0 +1 @@ +[{"title":"IPv4 类型","content":"

可通过 type 属性配置 IPv4 类型,默认是 IPv4

\n","link":"ip-address/ipv4-type","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致,同时提供数据绑定功能。","demoId":"ipv4-type"},{"title":"IPv6 类型","content":"

可通过 type属性配置为 IPv6 类型,默认是 IPv4

\n","link":"ip-address/ipv6-type","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致,同时提供数据绑定功能。","demoId":"ipv6-type"},{"title":"文本只读","content":"

通过 readonly 属性设置文本的只读行,默认为 false 。

\n","link":"ip-address/readonly","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致,同时提供数据绑定功能。","demoId":"readonly"},{"title":"禁用","content":"

通过 disabled 属性设置文本是否禁用,默认为 false。

\n","link":"ip-address/disabled","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致,同时提供数据绑定功能。","demoId":"disabled"},{"title":"输入框大小","content":"

可设置为mediumsmallmini

\n","link":"ip-address/size","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致,同时提供数据绑定功能。","demoId":"size"},{"title":"属性设置分隔符","content":"

可通过 delimiter 属性设置分隔符(图标类)。

\n","link":"ip-address/delimiter","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致,同时提供数据绑定功能。","demoId":"delimiter"},{"title":"默认插槽","content":"

可通过默认插槽设置分隔符。

\n","link":"ip-address/slots","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致,同时提供数据绑定功能。","demoId":"slots"},{"title":"focus 事件","content":"

文本框获取焦点时触发 focus 事件。

\n","link":"ip-address/focus","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致,同时提供数据绑定功能。","demoId":"focus"},{"title":"blur 事件","content":"

文本框失去焦点时触发 blur 事件。

\n","link":"ip-address/blur","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致,同时提供数据绑定功能。","demoId":"blur"},{"title":"change 事件","content":"

文本框内容改变后触发 change 事件。

\n","link":"ip-address/change","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致,同时提供数据绑定功能。","demoId":"change"},{"title":"select 事件","content":"

文本框内容选中时触发 select 事件。

\n","link":"ip-address/select","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致,同时提供数据绑定功能。","demoId":"select"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/layout.json b/examples/docs/resources/pc/demo-config/zh-CN/layout.json new file mode 100644 index 000000000..23f8d6ec6 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/layout.json @@ -0,0 +1,98 @@ +[ + { + "title": "栅格布局", + "content": "

通过使用 Row , Col 组件的 span 属性实现栅格系统布局。\n 该系统默认为12栅格,Col 组件的 span之和大于12时,布局会自动换行显示。

\n", + "link": "layout/base", + "component": " Layout 布局", + "findIntroStr": "采用12栅格布局,可使页面布局变得非常简单与清晰。", + "demoId": "base" + }, + { + "title": "对齐方式", + "content": "

通过设置Rowflex 属性为 true 来启用 flex 布局,并通过 justifyalign 属性调整子元素的对齐方式。

\n

提示

\n

flex 布局存在 IE 兼容性问题,只能在 IE 10 以上运行。

\n
\n", + "link": "layout/alignment", + "component": " Layout 布局", + "findIntroStr": "采用栅格布局,可使布局方法变得非常简单与清晰。", + "demoId": "alignment" + }, + { + "title": "排序", + "content": "

在启用 flex 布局时,可通过设置 Row 组件的 order 属性,给带 no 属性的 col排序。

\n

提示

\n

flex 布局存在 IE 兼容性问题,只能在 IE 10 以上运行。

\n
\n", + "link": "layout/order", + "component": " Layout 布局", + "findIntroStr": "采用栅格布局,可使布局方法变得非常简单与清晰。", + "demoId": "order" + }, + { + "title": "偏移", + "content": "

通过设置 Col 组件的 offset 属性来指定分栏偏移的栏数。

\n", + "link": "layout/offset", + "component": " Layout 布局", + "findIntroStr": "采用栅格布局,可使布局方法变得非常简单与清晰。", + "demoId": "offset" + }, + { + "title": "垂直排列方式", + "content": "

通过使用 Row 组件的 align 属性实现\tflex 布局下的垂直排列方式。

\n", + "link": "row/align", + "component": " Row 行配置", + "findIntroStr": "定义 Layout 的行配置信息。", + "demoId": "align" + }, + { + "title": "栅格间隔", + "content": "

通过使用 Row 组件的 gutter 属性实现栅格间隔。

\n", + "link": "row/gutter", + "component": " Row 行配置", + "findIntroStr": "定义 Layout 的行配置信息。", + "demoId": "gutter" + }, + { + "title": "水平排列方式", + "content": "

通过使用 Row 组件的 justify 属性实现 flex 布局下的水平排列方式。

\n", + "link": "row/justify", + "component": " Row 行配置", + "findIntroStr": "定义 Layout 的行配置信息。", + "demoId": "justify" + }, + { + "title": "排序方式", + "content": "

通过使用 Row 组件的 order 属性实现 flex 布局下排序方式。

\n", + "link": "row/order", + "component": " Row 行配置", + "findIntroStr": "定义 Layout 的行配置信息。", + "demoId": "order1" + }, + { + "title": "自定义元素标签", + "content": "

通过使用 Row 组件的 tag 属性实现自定义元素标签,可选任意标签。

\n", + "link": "row/tag1", + "component": " Row 行配置", + "findIntroStr": "定义 Layout 的行配置信息。", + "demoId": "tag1" + }, + { + "title": "移动", + "content": "

通过设置 Col 组件的 move 属性来指定分栏偏移的栏数。

\n", + "link": "col/col-move", + "component": " Col 列配置", + "findIntroStr": "定义 Layout 的列配置信息。", + "demoId": "col-move" + }, + { + "title": "响应式布局", + "content": "

参照了 Bootstrap 的响应式设计,预设了五个响应尺寸:xssmmdlgxl

\n", + "link": "layout/responsive-layout", + "component": " Col 列配置", + "findIntroStr": "定义 Layout 的列配置信息。", + "demoId": "responsive-layout" + }, + { + "title": "自定义元素标签", + "content": "

可选任意标签。

\n", + "link": "col/tag", + "component": " Col 列配置", + "findIntroStr": "定义 Layout 的列配置信息。", + "demoId": "tag" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/link-menu.json b/examples/docs/resources/pc/demo-config/zh-CN/link-menu.json new file mode 100644 index 000000000..27f58291d --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/link-menu.json @@ -0,0 +1 @@ +[{"title":"数据源","content":"

通过 data 属性设置菜单的数据源,同时在数据对象中可通过 disabled 设置该节点是否可被勾选。

\n","link":"link-menu/data-resource","component":" LinkMenu 收藏夹菜单","findIntroStr":"LinkMenu 收藏夹形式的菜单,支持可配置菜单项。","demoId":"data-resource1"},{"title":"收藏菜单标题","content":"

通过 title 属性定义收藏菜单标题。

\n","link":"link-menu/data-resource","component":" LinkMenu 收藏夹菜单","findIntroStr":"LinkMenu 收藏夹形式的菜单,支持可配置菜单项。","demoId":"data-resource"},{"title":"菜单内容超长时换行显示","content":"

通过 wrap 属性设置菜单内容超长时换行显示。

\n","link":"link-menu/data-resource","component":" LinkMenu 收藏夹菜单","findIntroStr":"LinkMenu 收藏夹形式的菜单,支持可配置菜单项。","demoId":"data-resource2"},{"title":"可收藏栏目数","content":"

通过 max-item 属性指定可勾选并收藏的栏目数。指定 default-expand-all 为 false 时,打开菜单弹窗时所有节点为折叠状态。

\n","link":"link-menu/menu-items","component":" LinkMenu 收藏夹菜单","findIntroStr":"LinkMenu 收藏夹形式的菜单,支持可配置菜单项。","demoId":"menu-items"},{"title":"自定义菜单数据服务","content":"

通过 get-menu-data-sync 自定义菜单数据服务。

\n","link":"link-menu/get-menu-data-sync","component":" LinkMenu 收藏夹菜单","findIntroStr":"LinkMenu 收藏夹形式的菜单,支持可配置菜单项。","demoId":"get-menu-data-sync"},{"title":"自定义折叠展开图标","content":"

通过 icon 属性自定义折叠展开图标。通过 search-icon 属性自定义搜索图标。

\n","link":"link-menu/custom-icon","component":" LinkMenu 收藏夹菜单","findIntroStr":"LinkMenu 收藏夹形式的菜单,支持可配置菜单项。","demoId":"custom-icon"},{"title":"菜单内容超长时省略显示","content":"

通过 ellipsis 属性设置菜单内容超长时省略显示。

\n","link":"link-menu/custom-icon","component":" LinkMenu 收藏夹菜单","findIntroStr":"LinkMenu 收藏夹形式的菜单,支持可配置菜单项。","demoId":"custom-icon1"},{"title":"自定义菜单弹窗底部","content":"

通过 foot 插槽自定义菜单弹窗的底部内容。sureNodevalue 方法用于获取选中的菜单节点并关闭菜单弹窗,同时展示选中的菜单。hideDialog 方法用于关闭弹窗。插槽可结合这两个方法一起使用。

\n","link":"link-menu/custom-foot","component":" LinkMenu 收藏夹菜单","findIntroStr":"LinkMenu 收藏夹形式的菜单,支持可配置菜单项。","demoId":"custom-foot"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/link.json b/examples/docs/resources/pc/demo-config/zh-CN/link.json new file mode 100644 index 000000000..cd0b5a468 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/link.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"link/basic-usage","component":" Link 文字链接","findIntroStr":"文字超链接。","demoId":"basic-usage"},{"title":"主题样式","content":"

通过 type 属性设置链接的主题类型。

\n","link":"link/link-style","component":" Link 文字链接","findIntroStr":"文字超链接。","demoId":"link-style"},{"title":"禁用链接","content":"

通过 disabled 属性可以指定是否禁用链接。

\n","link":"link/dynamic-disable","component":" Link 文字链接","findIntroStr":"文字超链接。","demoId":"dynamic-disable"},{"title":"聚焦时不显示下划线","content":"

鼠标悬停在链接上时,默认会显示下划线,设置 underline 为 false 后聚焦时不显示下划线。

\n","link":"link/focus-no-underline","component":" Link 文字链接","findIntroStr":"文字超链接。","demoId":"focus-no-underline"},{"title":"自定义图标","content":"

通过属性 icon、默认插槽、icon 插槽都可以自定义图标。

\n","link":"link/custom-icon","component":" Link 文字链接","findIntroStr":"文字超链接。","demoId":"custom-icon"},{"title":"链接地址","content":"

通过属性 href 指定链接需要跳转的地址,可配合原生属性 target 一起使用。

\n","link":"link/config-href","component":" Link 文字链接","findIntroStr":"文字超链接。","demoId":"config-href"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/loading.json b/examples/docs/resources/pc/demo-config/zh-CN/loading.json new file mode 100644 index 000000000..ed0290c2a --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/loading.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

通过静态方法 Loading.service 在指定 target 上设置加载。

\n","link":"loading/basic-usage","component":" Loading 加载","findIntroStr":"加载数据时显示的动画效果。","demoId":"basic-usage"},{"title":"自定义加载提示文本","content":"

通过 text 自定义加载文字的提示文本。

\n","link":"loading/loading-tip-text","component":" Loading 加载","findIntroStr":"加载数据时显示的动画效果。","demoId":"loading-tip-text"},{"title":"自定义遮罩背景色","content":"

通过 background 自定义背景颜色和透明度。

\n","link":"loading/background","component":" Loading 加载","findIntroStr":"加载数据时显示的动画效果。","demoId":"background"},{"title":"自定义样式","content":"

通过 customClass 指定类名进行样式修改。

\n","link":"loading/custom-class","component":" Loading 加载","findIntroStr":"加载数据时显示的动画效果。","demoId":"custom-class"},{"title":"修饰符","content":"详细用法参考如下示例","link":"loading/body","component":" Loading 加载","findIntroStr":"加载数据时显示的动画效果。","demoId":"body"},{"title":"全局加载","content":"

通过 v-loading.lock.fullscreen 指令方式或者服务方式进行全局加载,如需使用指令方式全局加载需要如下操作:\n在 Vue 2 版本环境中添加 Vue.use(Loading)\n在 Vue 3 版本环境中添加 app.use(Loading)

\n","link":"loading/fullscreen","component":" Loading 加载","findIntroStr":"加载数据时显示的动画效果。","demoId":"fullscreen"},{"title":"自定义加载图标","content":"

通过 spinner 自定义加载图标。

\n","link":"loading/spinner","component":" Loading 加载","findIntroStr":"加载数据时显示的动画效果。","demoId":"spinner"},{"title":"区域加载","content":"

通过 target 指定 Loading 需要覆盖的 DOM 节点。

\n","link":"loading/target","component":" Loading 加载","findIntroStr":"加载数据时显示的动画效果。","demoId":"target"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/locales.json b/examples/docs/resources/pc/demo-config/zh-CN/locales.json new file mode 100644 index 000000000..e88cb8d2e --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/locales.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

配置 local 属性后,不会自动调用服务,仅用做当前语言切换,不会刷新页面。

\n","link":"locales/basic-usage","component":" Locales 语言选择","findIntroStr":"Locales 语言选择组件,在有两种语言时会直接显示成语种,当语言数大于 2 时,将显示一个下拉列表。","demoId":"basic-usage"},{"title":"自定义服务","content":"

get-locale 可用于自定义获取所有语言。get-current-locale 用于获取当前语言。get-change-locale-url 用于获取改变语言后的 URL,参数为切换后的语言。

\n","link":"locales/custom-service","component":" Locales 语言选择","findIntroStr":"Locales 语言选择组件,在有两种语言时会直接显示成语种,当语言数大于 2 时,将显示一个下拉列表。","demoId":"custom-service"},{"title":"语言切换","content":"

提供 change-lang 函数用于自定义语言切换的逻辑,不设置则使用内置的切换方法。

\n","link":"locales/change-lang","component":" Locales 语言选择","findIntroStr":"Locales 语言选择组件,在有两种语言时会直接显示成语种,当语言数大于 2 时,将显示一个下拉列表。","demoId":"change-lang"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/logon-user.json b/examples/docs/resources/pc/demo-config/zh-CN/logon-user.json new file mode 100644 index 000000000..0a3e0ade5 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/logon-user.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"logon-user/basic-usage","component":" LogonUser 登录用户","findIntroStr":"LogonUser 用于显示当前登录人的 显示名(displayName) 或 长工号(userCN)。","demoId":"basic-usage"},{"title":"自定义服务","content":"

可通过 service 属性设置自定义服务。

\n","link":"logon-user/custom-service","component":" LogonUser 登录用户","findIntroStr":"LogonUser 用于显示当前登录人的 显示名(displayName) 或 长工号(userCN)。","demoId":"custom-service"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/logout.json b/examples/docs/resources/pc/demo-config/zh-CN/logout.json new file mode 100644 index 000000000..a70f500e5 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/logout.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"logout/basic-usage","component":" Logout 注销","findIntroStr":"Logout 登录或退出链接。","demoId":"basic-usage"},{"title":"自定义服务","content":"

可通过 service 属性设置自定义服务。

\n","link":"logout/custom-service","component":" Logout 注销","findIntroStr":"Logout 登录或退出链接。","demoId":"custom-service"},{"title":"自定义配置注销后跳转地址","content":"详细用法参考如下示例","link":"logout/redirecturl","component":" Logout 注销","findIntroStr":"Logout 登录或退出链接。","demoId":"redirecturl"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/milestone.json b/examples/docs/resources/pc/demo-config/zh-CN/milestone.json new file mode 100644 index 000000000..9ed08bf5a --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/milestone.json @@ -0,0 +1,122 @@ +[ + { + "title": "基本用法", + "content": "详细用法参考如下示例", + "link": "milestone/basic-usage", + "component": "Milestone 里程碑", + "findIntroStr": "里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。", + "demoId": "basic-usage" + }, + { + "title": "数据源", + "content": "

通过 data 属性设置里程碑数据。

\n", + "link": "milestone/data-source", + "component": " Milestone", + "findIntroStr": "里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。", + "demoId": "data-source" + }, + { + "title": "数据字段映射", + "content": "

数据字段映射属性说明

\n

completed-field:设置里程碑完成状态对应的取值,默认为 completed\nflag-content-field:设置节点旗子数据中描述对应的字段名,默认为 content\nflag-field:设置节点信息中旗子数据所在字段名,默认为 flags\nflag-name-field:设置节点旗子数据中名称对应的字段名,默认为 name\nflag-status-field:设置节点旗子数据中状态对应的字段名,默认为 status\nname-field:设置节点信息中名称对应的字段名,默认为 name\nstatus-field:设置数据状态对应的字段名,默认为 status\ntime-field:设置节点时间信息对应的字段名,默认为 time

\n
\n", + "link": "milestone/data-field-mapping", + "component": " Milestone", + "findIntroStr": "里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。", + "demoId": "data-field-mapping" + }, + { + "title": "旗帜数据来源前面节点", + "content": "

通过 flag-before 可设置里程碑上活动(即旗子)上的数据从前面还是后面节点上获取,默认为 false 取后面节点上的数据。

\n", + "link": "milestone/flag-before", + "component": " Milestone", + "findIntroStr": "里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。", + "demoId": "flag-before" + }, + { + "title": "进度条颜色", + "content": "

通过 line-style 属性设置线条颜色。

\n", + "link": "milestone/line-style", + "component": " Milestone", + "findIntroStr": "里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。", + "demoId": "line-style" + }, + { + "title": "状态与颜色对应关系", + "content": "

milestones-status 属性对象中,键对应 data 属性的数据中的 status 字段,然后控制不同状态与颜色的对应关系。

\n", + "link": "milestone/milestones-status", + "component": " Milestone", + "findIntroStr": "里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。", + "demoId": "milestones-status" + }, + { + "title": "取消未完成状态序号显示", + "content": "

设置 show-number 为 false 后,里程碑未完成的节点上将不显示序号,默认为 true 。

\n", + "link": "milestone/show-number", + "component": " Milestone", + "findIntroStr": "里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。", + "demoId": "show-number" + }, + { + "title": "已完成节点实心显示", + "content": "

通过设置 solid 属性为 true 可设置已经完成节点显示为实心,且光晕不透明,默认为 false 。

\n", + "link": "milestone/solid-style", + "component": " Milestone", + "findIntroStr": "里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。", + "demoId": "solid-style" + }, + { + "title": "宽度", + "content": "

通过 space 属性设置步骤条的宽度。

\n", + "link": "milestone/milestone-space", + "component": " Milestone", + "findIntroStr": "里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。", + "demoId": "milestone-space" + }, + { + "title": "序号起始值", + "content": "

通过 start 属性设置里程碑节点的序号起始值,默认为 -1 。

\n", + "link": "milestone/start-index", + "component": " Milestone", + "findIntroStr": "里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。", + "demoId": "start-index" + }, + { + "title": "自定义节点图标", + "content": "

通过 icon 作用域插槽可自定义图标。

\n", + "link": "milestone/custom-icon-slot", + "component": " Milestone", + "findIntroStr": "里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。", + "demoId": "custom-icon-slot" + }, + { + "title": "自定义节点下方内容", + "content": "

通过 bottom 作用域插槽可自定义节点下方的内容。

\n", + "link": "milestone/custom-bottom", + "component": " Milestone", + "findIntroStr": "里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。", + "demoId": "custom-bottom" + }, + { + "title": "自定义节点上方内容", + "content": "

通过 top 作用域插槽可自定义节点上方的内容。

\n", + "link": "milestone/custom-top", + "component": " Milestone", + "findIntroStr": "里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。", + "demoId": "custom-top" + }, + { + "title": "自定义旗帜内容", + "content": "

通过 flag 作用域插槽可自定义节点旗帜的内容。

\n", + "link": "milestone/custom-flag", + "component": " Milestone", + "findIntroStr": "里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。", + "demoId": "custom-flag" + }, + { + "title": "事件", + "content": "

单击里程碑节点时触发 click 事件,参数(index:节点索引, node:节点数据信息)。单击里程碑旗帜时触发 flag-click 事件,参数(index:节点内旗子的索引, node:节点上旗子的数据信息)。

\n", + "link": "milestone/milestone-events", + "component": " Milestone", + "findIntroStr": "里程碑模式是一个高度定制化的组件,用户可以自定义组件的状态,节点颜色,线条颜色等。支持在节点间插入活动旗子,tip 显示活动信息。", + "demoId": "milestone-events" + } +] \ No newline at end of file diff --git a/examples/docs/resources/pc/demo-config/zh-CN/modal.json b/examples/docs/resources/pc/demo-config/zh-CN/modal.json new file mode 100644 index 000000000..757513ed4 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/modal.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

可通过 Modal.alert 方法设置弹出框,通过 Modal.confirm 方法设置确认弹出框。

\n","link":"modal/base","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"base"},{"title":"最大化显示","content":"

可通过 fullscreen 属性设置是否最大化显示。

\n","link":"modal/fullscreen","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"fullscreen"},{"title":"按 Esc 键关闭弹出框","content":"

可通过 esc-closable 属性设置是否允许按 Esc 键关闭窗口,默认为 false

\n","link":"modal/esc-closable","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"esc-closable"},{"title":"自动关闭延时","content":"

可通过 duration 属性设置自动关闭的延迟时间,只对 type=message 有效。

\n","link":"modal/duration","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"duration"},{"title":"防止重复提示","content":"

如果不想窗口重复点击,可以设置唯一的 id 防止重复提示,只对 type=message 有效。

\n","link":"modal/id","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"id"},{"title":"锁住滚动条","content":"

可通过 lock-scroll 属性设置是否锁住滚动条,不允许页面滚动。

\n","link":"modal/lock-scroll","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"lock-scroll"},{"title":"锁住页面","content":"

可通过 lock-view 属性设置是否锁住页面,不允许窗口之外的任何操作。

\n","link":"modal/lock-view","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"lock-view"},{"title":"显示遮罩层","content":"

可通过 mask 属性设置是否显示遮罩层,默认为 true

\n","link":"modal/lock-view","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"lock-view1"},{"title":"点击遮罩层关闭窗口","content":"

可通过 mask-closable 属性设置是否允许点击遮罩层关闭窗口。

\n","link":"modal/mask-closable","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"mask-closable"},{"title":"自定义内容","content":"

可通过 message 属性设置窗口的内容。

\n","link":"modal/message","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"message"},{"title":"调整窗口大小","content":"

可通过和widthheight设置窗口的宽高,而通过 resize 设置是否允许拖动调整窗口大小。

\n","link":"modal/resize","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"resize"},{"title":"调整窗口大小后窗口显示的最小宽度","content":"

配置 resize 可拖拽属性为 true后,可通过 min-width 属性设置拖拽后窗口的最小宽度。

\n","link":"modal/min-width","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"min-width"},{"title":"调整窗口大小后窗口显示的最小高度","content":"

配置 resize 可拖拽属性为 true后,可通过 min-height 属性设置拖拽后窗口的最小高度。

\n","link":"modal/min-height","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"min-height"},{"title":"不显示底部","content":"

可通过 showFooter 属性设置是否显示底部,默认为 true

\n","link":"modal/showFooter","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"showFooter"},{"title":"不显示头部","content":"

可通过 showHeader 属性设置是否显示头部,默认为 true

\n","link":"modal/showHeader","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"showHeader"},{"title":"消息状态","content":"

可通过 status 属性设置消息状态,可选值有 info | success | warning | error | loading

\n","link":"modal/status","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"status"},{"title":"标题","content":"

可通过 title 属性设置窗口的标题。

\n","link":"modal/title","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"title"},{"title":"距离顶部的位置","content":"

可通过 top 属性设置消息距离顶部的位置,只对 type=message 有效。

\n","link":"modal/top","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"top"},{"title":"窗口类型","content":"

可通过 type 属性设置窗口类型,可选值 alert | confirm | message

\n","link":"modal/type","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"type"},{"title":"绑定值","content":"

可通过 value/v-model 属性绑定值。

\n","link":"modal/value","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"value"},{"title":"自定义堆叠顺序","content":"

可通过 zIndex 属性设置自定义堆叠顺序(对于某些特殊场景,比如被遮挡时可能会用到)。

\n","link":"modal/zIndex","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"zIndex"},{"title":"取消按钮事件","content":"

点击取消按钮时触发 cancel 事件。

\n","link":"modal/cancel-event","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"cancel-event"},{"title":"关闭按钮事件","content":"

点击关闭按钮时会触发 close 事件。

\n","link":"modal/close-event","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"close-event"},{"title":"确定按钮事件","content":"

点击确定按钮时会触发 confirm 事件。

\n","link":"modal/confirm-event","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"confirm-event"},{"title":"窗口关闭事件","content":"

窗口关闭时会触发 hide 事件。

\n","link":"modal/hide-event","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"hide-event"},{"title":"窗口显示事件","content":"

在窗口显示时会触发 show 事件。

\n","link":"modal/show-event","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"show-event"},{"title":"窗口缩放事件","content":"

窗口缩放时会触发 zoom 事件。

\n","link":"modal/zoom-event","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"zoom-event"},{"title":"关闭弹窗,是否重置表单数据","content":"

Modal嵌套表单使用时,关闭弹窗时,重置表单数据

\n

设置 is-form-reset 为false,则关闭弹窗是不重置表单

","link":"modal/is-form-reset","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"is-form-reset"},{"title":"默认插槽","content":"

可通过 templete 设置默认插槽。

\n","link":"modal/value","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"value1"},{"title":"底部插槽","content":"

可通过 slot="footer" 设置底部插槽。

\n","link":"modal/footer-slot","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"footer-slot"},{"title":"嵌套 grid","content":"

可通过插槽嵌套 grid

\n","link":"modal/grid","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"grid"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/nav-menu.json b/examples/docs/resources/pc/demo-config/zh-CN/nav-menu.json new file mode 100644 index 000000000..8b870018b --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/nav-menu.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

通过 data 属性配置菜单数据,若不配置默认读取后台服务,比如 Jalor 6,读取 services/jalor/web/support/workspace/current 服务的 leftMenuNode 数据。

\n","link":"nav-menu/basic-usage","component":" NavMenu 导航菜单","findIntroStr":"NavMenu 导航菜单,主要用于定义页面顶部导航的菜单。","demoId":"basic-usage"},{"title":"数据源","content":"

通过 data 属性配置菜单数据。

\n","link":"nav-menu/data-resource","component":" NavMenu 导航菜单","findIntroStr":"NavMenu 导航菜单,主要用于定义页面顶部导航的菜单。","demoId":"data-resource"},{"title":"显示策略","content":"

当一级菜单无法在当前菜单容器里显示完全时,可以通过 overflow 属性配置显示策略,共有 autoretractfixedhidden 4个选项,默认为 auto

\n

overflow 选项说明

\n

auto:菜单栏右侧显示 更多 菜单,鼠标悬停该菜单时,将显示剩余未展示的菜单。\nfixed:菜单栏左侧显示 三明治折叠/展开 图标,鼠标悬停该图标时,将显示所有菜单。\nretract:菜单栏不显示任何菜单,只显示 三明治折叠/展开 图标,鼠标悬停该图标时,将显示所有菜单。\nhidden:剩余未展示的菜单隐藏不显示。

\n
\n","link":"nav-menu/overflow","component":" NavMenu 导航菜单","findIntroStr":"NavMenu 导航菜单,主要用于定义页面顶部导航的菜单。","demoId":"overflow"},{"title":"Toolbar 插槽","content":"

提供 toolbar 插槽用于自定义 Toolbar 。

\n","link":"nav-menu/slot-toolbar","component":" NavMenu 导航菜单","findIntroStr":"NavMenu 导航菜单,主要用于定义页面顶部导航的菜单。","demoId":"slot-toolbar"},{"title":"Logo 插槽","content":"

提供 logo 插槽用于自定义 Logo 。

\n","link":"nav-menu/slot-logo","component":" NavMenu 导航菜单","findIntroStr":"NavMenu 导航菜单,主要用于定义页面顶部导航的菜单。","demoId":"slot-logo"},{"title":"菜单跳转处理","content":"

提供 before-skip 钩子函数,用于菜单点击跳转前处理相关逻辑,返回 false 将无法跳转。

\n","link":"nav-menu/before-skip","component":" NavMenu 导航菜单","findIntroStr":"NavMenu 导航菜单,主要用于定义页面顶部导航的菜单。","demoId":"before-skip"},{"title":"使用组件默认服务时,菜单跳转处理","content":"

如果使用组件的默认服务 /workspace/current 获取菜单数据 response.data.leftMenuNode.children,那么在使用 before-skip 时,需配置属性 prevent,用来阻止默认的跳转行为。属性 prevent 默认值为 false

\n","link":"nav-menu/before-skip-prevent","component":" NavMenu 导航菜单","findIntroStr":"NavMenu 导航菜单,主要用于定义页面顶部导航的菜单。","demoId":"before-skip-prevent"},{"title":"自定义服务","content":"

通过 fetch-menu-data 可以自定义菜单服务,若数据中字段不是默认的 titleurl,则可以通过 fields 对数据中的字段进行映射。

\n","link":"nav-menu/custom-service","component":" NavMenu 导航菜单","findIntroStr":"NavMenu 导航菜单,主要用于定义页面顶部导航的菜单。","demoId":"custom-service"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/notify.json b/examples/docs/resources/pc/demo-config/zh-CN/notify.json new file mode 100644 index 000000000..849219151 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/notify.json @@ -0,0 +1,114 @@ +[ + { + "title": "基本用法", + "content": "详细用法参考如下示例", + "link": "notify/basic-usage", + "component": "Notify 通知", + "findIntroStr": "Notify 通知,主要用于弹出提示。", + "demoId": "basic-usage" + }, + { + "title": "消息类型", + "content": "

可通过 type 设置不同的类型。可选值:success、warning、info、error,默认值:info 。

\n", + "link": "notify/type", + "component": "Notify 通知", + "findIntroStr": "Notify 通知,主要用于弹出提示。", + "demoId": "type" + }, + { + "title": "自动关闭延时", + "content": "

可通过 duration 属性设置自动关闭的延迟时间,默认值:4500ms 。

\n", + "link": "notify/duration", + "component": "Notify 通知", + "findIntroStr": "Notify 通知,主要用于弹出提示。", + "demoId": "duration" + }, + { + "title": "显示位置", + "content": "

可通过 position 属性设置通知框显示位置,默认值:bottom-right 。

\n", + "link": "notify/position", + "component": "Notify 通知", + "findIntroStr": "Notify 通知,主要用于弹出提示。", + "demoId": "position" + }, + { + "title": "标题", + "content": "

可通过 title 属性设置通知框标题。

\n", + "link": "notify/title", + "component": "Notify 通知", + "findIntroStr": "Notify 通知,主要用于弹出提示。", + "demoId": "title" + }, + { + "title": "自定义内容", + "content": "

可通过 message 属性设置通知框的内容。

\n", + "link": "notify/message", + "component": "Notify 通知", + "findIntroStr": "Notify 通知,主要用于弹出提示。", + "demoId": "message" + }, + { + "title": "不显示关闭按钮", + "content": "

showClose message 属性设置通知框是否显示关闭按钮,默认值:true 。

\n", + "link": "notify/showClose", + "component": "Notify 通知", + "findIntroStr": "Notify 通知,主要用于弹出提示。", + "demoId": "showClose" + }, + { + "title": "不显示类型图标", + "content": "

可通过 showIcon 属性设置通知框是否显示类型图标,默认值:true 。

\n", + "link": "notify/showIcon", + "component": "Notify 通知", + "findIntroStr": "Notify 通知,主要用于弹出提示。", + "demoId": "showIcon" + }, + { + "title": "自定义关闭图标", + "content": "

可通过 closeIcon 属性设置通知框关闭图标,默认值:IconClose 。

\n", + "link": "notify/closeIcon", + "component": "Notify 通知", + "findIntroStr": "Notify 通知,主要用于弹出提示。", + "demoId": "closeIcon" + }, + { + "title": "自定义类型图标", + "content": "

可通过 statusIcon 属性设置通知框类型图标,默认值:IconInfoSolid 。

\n", + "link": "notify/statusIcon", + "component": "Notify 通知", + "findIntroStr": "Notify 通知,主要用于弹出提示。", + "demoId": "statusIcon" + }, + { + "title": "关闭通知框前触发的事件", + "content": "

可通过 beforeClose 属性设置通知框关闭前的事件。

\n", + "link": "notify/beforeClose", + "component": "Notify 通知", + "findIntroStr": "Notify 通知,主要用于弹出提示。", + "demoId": "beforeClose" + }, + { + "title": "点击关闭按钮时触发事件", + "content": "

可通过 onClose 属性设置通知点击关闭按钮时触发事件。

\n", + "link": "notify/onClose", + "component": "Notify 通知", + "findIntroStr": "Notify 通知,主要用于弹出提示。", + "demoId": "close" + }, + { + "title": "配置防抖", + "content": "

可通过 debounceDelay 设置防抖时间\n", + "link": "notify/debounceDelay", + "component": "Notify 通知", + "findIntroStr": "Notify 通知,主要用于弹出提示。", + "demoId": "debounceDelay" + }, + { + "title": "垂直方向偏离距离", + "content": "

可通过 verticalOffset 设置垂直方向偏离距离\n", + "link": "notify/verticalOffset", + "component": "Notify 通知", + "findIntroStr": "Notify 通知,主要用于弹出提示。", + "demoId": "verticalOffset" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/numeric.json b/examples/docs/resources/pc/demo-config/zh-CN/numeric.json new file mode 100644 index 000000000..e72b82d16 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/numeric.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"numeric/basic-usage","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。","demoId":"basic-usage"},{"title":"可清空特性","content":"

可通过 allow-empty 属性设置计数器内容的可清空特性。默认为 false,表示不可清空。

\n","link":"numeric/allow-empty","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。","demoId":"allow-empty"},{"title":"步长","content":"

可通过 step 属性设置计数器的步长。

\n","link":"numeric/about-step","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。","demoId":"about-step"},{"title":"数值循环","content":"

可通过设置 max 属性设置计数器允许的最大值,通过设置 min 属性设置计数器允许的最小值,通过设置 circulate 属性设置向上到达最大值后从最小值开始,或反过来。

\n","link":"numeric/max-min","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。","demoId":"max-min"},{"title":"尺寸","content":"

可通过 size 属性设置计数器尺寸。可取值 medium / small / mini

\n","link":"numeric/numeric-size","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。","demoId":"numeric-size"},{"title":"控制按钮","content":"

可通过 controls 属性设置计数器是否有控制按钮。

\n","link":"numeric/controls","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。","demoId":"controls"},{"title":"控制按钮显示位置","content":"

可通过 controls-position 属性设置控制按钮显示的位置。

\n","link":"numeric/controls-position","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。","demoId":"controls-position"},{"title":"关联文字","content":"

可通过 label 属性设置输入框关联的 label 文字。

\n","link":"numeric/controls","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。","demoId":"controls1"},{"title":"disabled","content":"通过设置 disabled 控制是否禁用计数器","link":"numeric/dynamic-disabled","component":"Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。","demoId":"dynamic-disabled"},{"title":"name","content":"

可通过 name 属性设置原生属性。

\n","link":"numeric/controls","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。","demoId":"controls2"},{"title":"数值精度","content":"

可通过 precision 属性设置计数器的精度值。

\n","link":"numeric/precision","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。","demoId":"precision"},{"title":"鼠标滚轮滚动改变值","content":"

可通过 mouseWheel 属性控制鼠标滚动滑轮是否能改变数值。

\n","link":"numeric/mouse-wheel","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。","demoId":"mouse-wheel"},{"title":"聚焦事件","content":"

输入框获得焦点时触发 focus 事件。

\n","link":"numeric/focus-event","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。","demoId":"focus-event"},{"title":"失焦事件","content":"

输入框失去焦点时触发 blur 事件。

\n","link":"numeric/blur-event","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。","demoId":"blur-event"},{"title":"值改变事件","content":"

输入框值被改变时触发 change 事件。

\n","link":"numeric/change-event","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。","demoId":"change-event"},{"title":"根据商品数量自动计算价格","content":"

根据商品数量自动计算价格。

\n","link":"numeric/calculate-according-to-num-of-goods","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围,步进大小。支持鼠标键盘增减。","demoId":"calculate-according-to-num-of-goods"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/pager.json b/examples/docs/resources/pc/demo-config/zh-CN/pager.json new file mode 100644 index 000000000..86df8593a --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/pager.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"pager/basic-usage","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"basic-usage"},{"title":"当前页","content":"

通过 current-page 设置初始加载页码数, 通过 total 设置总条数

\n","link":"pager/current-page","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"current-page"},{"title":"number 模式","content":"

通过 mode="number" 设置组件渲染模式

\n","link":"pager/pager-mode-number","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"pager-mode-number"},{"title":"fixed 模式","content":"

通过 mode="fixed" 设置组件渲染模式

\n","link":"pager/pager-mode-fixed","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"pager-mode-fixed"},{"title":"simple 模式","content":"

通过 mode="simple" 设置组件渲染模式

\n","link":"pager/pager-mode-simple","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"pager-mode-simple"},{"title":"complete 模式","content":"

通过 mode="complete" 设置组件渲染模式

\n","link":"pager/pager-mode","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"pager-mode"},{"title":"总页数","content":"

通过 page-count 设置总页数

\n","link":"pager/page-count","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"page-count"},{"title":"分页事件size-change","content":"

size-change 每页条数改变时触发

\n","link":"pager/pager-events","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"pager-events"},{"title":"分页事件current-change","content":"

current-change 切换当前页码时触发

\n","link":"pager/pager-events-current-change","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"pager-events-current-change"},{"title":"分页事件prev-click","content":"

prev-click 切换至前一页时触发

\n","link":"pager/pager-events-prev-click","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"pager-events-prev-click"},{"title":"分页事件next-click","content":"

next-click 切换至后一页时触发

\n","link":"pager/pager-events-nextclick","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"pager-events-nextclick"},{"title":"分页事件before-page-change","content":"

before-page-change 切换分页前事件

\n","link":"pager/before-page-change","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"before-page-change"},{"title":"分页下拉框显示位置","content":"

popper-append-to-body 分页下拉框元素是否追加到body元素节点下,该属性的默认值为 true ,默认追加到body元素节点下 。

\n

若不想追加到body元素节点下,设置 :popper-append-to-body=\"false\"

","link":"pager/page-append-to-body","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"popper-append-to-body"},{"title":"自定义分页下拉框的类名","content":"

popper-class 可以自定义分页下拉框的类名

","link":"pager/popper-class","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"popper-class"},{"title":"自定义分页布局","content":"

layout 设置分页布局,通过在layout里调整slot的位置,从而调整插槽内容渲染的位置

\n","link":"pager/custom-layout","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"custom-layout"},{"title":"页码按钮数量","content":"

pager-count 设置页码数量

\n","link":"pager/pager-count","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"pager-count"},{"title":"每页显示数量","content":"

page-sizespage-size 结合使用调整每页显示数量

\n","link":"pager/page-size","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"page-size"},{"title":"只有一页时隐藏分页","content":"

hide-on-single-page 只有一页时隐藏分页

\n","link":"pager/hide-on-single-page","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"hide-on-single-page"},{"title":"自定义上下页按钮文本","content":"

prev-text ,next-text 自定义上下页按钮文本

\n","link":"pager/custom-next-prev-text","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"custom-next-prev-text"},{"title":"Grid 表格分页","content":"

Grid 表格使用分页组件\n该示例中的 services/getGridMockData 服务需要自行实现,示例模拟了远程服务返回的数据\n

\n","link":"pager/pager-in-grid","component":" Pager 分页","findIntroStr":"当数据量过多时,使用分页分解数据,常用于 Grid 和 Repeater 组件。","demoId":"pager-in-grid"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/pop-editor.json b/examples/docs/resources/pc/demo-config/zh-CN/pop-editor.json new file mode 100644 index 000000000..9014623ab --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/pop-editor.json @@ -0,0 +1,258 @@ +[ + { + "title": "基本用法", + "content": "详细用法参考如下示例", + "link": "popeditor/base", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "base" + }, + { + "title": "自定义查询条件", + "content": "

通过 conditions 属性可以自定义查询条件,组件内置的输入框支持按回车触发搜索的功能。

\n", + "link": "popeditor/conditions", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "conditions" + }, + { + "title": "布局与配置", + "content": "

通过 condition 项目里属性里的span配置栅格,labelWidth 配置label宽度。 component配置自定义组件,并通过 attrs配置组件属性

\n", + "link": "popeditor/condition-layout", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "condition-layout" + }, + { + "title": "Form 表单中使用并开启表单校验", + "content": "详细用法参考如下示例", + "link": "popeditor/condition-form", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "condition-form" + }, + { + "title": "拖动窗口", + "content": "

通过 draggable 属性设置弹出窗口拖动特性。默认为 true 表示可在标题栏按住鼠标左键拖动窗口,设置为 false 则固定窗口位置不可拖动。

\n", + "link": "popeditor/draggable", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "draggable" + }, + { + "title": "不可清除", + "content": "

通过 show-clear-btn 属性设置是否可以清除。

\n", + "link": "popeditor/showClearBtn", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "showClearBtn" + }, + { + "title": "全屏展示", + "content": "

通过配置 resize 控制是否全屏展示

\n", + "link": "popeditor/resize", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "resize" + }, + { + "title": "表格编辑", + "content": "

gridOp 当 popseletor 为 grid 时生效,目前支持配置 columns 表格列 和 data 数据源,详细配置项参考 Grid 表格组件,需同时配置 textField、valueField 字段。

\n", + "link": "popeditor/grid", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "grid" + }, + { + "title": "宽度", + "content": "

通过 width 属性配置宽。\n通过 dialog-class 自定义配置弹窗类名

\n", + "link": "popeditor/width", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "width" + }, + { + "title": "自定义图标", + "content": "

通过 icon 属性可以自定义组件图标,需引入对应的 svg 图标。

\n", + "link": "popeditor/icon", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "icon" + }, + { + "title": "多选", + "content": "

通过设置 multi 属性为 true 实现多选。\n通过设置 show-history 当弹出面板配置的是表格时,设置历史记录标签页是否显示表格,默认为 false。

\n", + "link": "popeditor/multi", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "multi" + }, + { + "title": "多选且初始数据为数组", + "content": "详细用法参考如下示例", + "link": "popeditor/multi-value-array", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "multi-value-array" + }, + { + "title": "change 事件", + "content": "

change Popeditor 组件 Input 框的 change 事件。 page-change Popeditor 组件表格模式带分页切换事件。

\n", + "link": "popeditor/events", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "events" + }, + { + "title": "close 事件", + "content": "

close 弹框关闭时触发的事件。

\n", + "link": "popeditor/close-event", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "close-event" + }, + { + "title": "只读", + "content": "

通过 readonly 属性设置为是否只读。

\n", + "link": "popeditor/readonly", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "readonly" + }, + { + "title": "输入框的 tabindex", + "content": "

通过 tabindex 属性置是否可通过 Tab 键获焦及获焦顺序(readonly 属性设置为 false 时有效)。

\n", + "link": "popeditor/tabindex", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "tabindex" + }, + { + "title": "重置", + "content": "

通过 before-reset 属性设置重置前的钩子函数。

\n", + "link": "popeditor/before-reset", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "before-reset" + }, + { + "title": "组件查询条件插槽", + "content": "

通过插槽 search 自定义弹出面板查询结构。

\n", + "link": "popeditor/slot", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "slot" + }, + { + "title": "禁用", + "content": "

通过 disabled 属性设置为是否只读。

\n", + "link": "popeditor/disabled", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "disabled" + }, + { + "title": "弹出窗筛选条件支持可清空", + "content": "

clearable Popeditor 组件 支持在搜索表单配置清除按钮。

\n", + "link": "popeditor/clearable", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "clearable" + }, + { + "title": "显示字段映射", + "content": "

通过 text-field 属性设置组件显示的字段。

\n", + "link": "popeditor/textField", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "textField" + }, + { + "title": "提交字段映射", + "content": "

通过 value-field 属性设置组件提交给后台的字段。

\n", + "link": "popeditor/title", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "title1" + }, + { + "title": "自定义标题", + "content": "

通过 title 属性设置弹出窗口标题,支持国际化信息配置。

\n", + "link": "popeditor/title", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "title" + }, + { + "title": "远程搜索", + "content": "

通过 remote-search 属性配置远程搜索,在 remoteSearch 方法里可以把 conditions 搜索条件传给后台,后台处理好数据后就能正常的显示在页面上。

\n", + "link": "popeditor/remote-search", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "remote-search" + }, + { + "title": "分页", + "content": "

showPager 属性只有当 popseletorgrid 时才能生效,默认值为 false 不启用分页,配置为 true 后还需配置 pagerOp 属性;并且需要监听 page-change 事件改变 gridOpdata 数据源

\n", + "link": "popeditor/pager", + "component": " PopEditor 弹出编辑", + "findIntroStr": "常用的操作按钮,提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型。", + "demoId": "pager" + }, + { + "title": "渲染反查", + "content": "

在组件加载的第一批数据中不含有当前所设置的 value 对应的数据时,可以设置 text-render-source 进行反查

\n", + "link": "popeditor/render-text", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "render-text" + }, + { + "title": "开启树模式", + "content": "

通过 popseletor 属性开启树模式,然后 tree-op 属性是 Tree 组件的 op 配置方式

\n", + "link": "popeditor/tree", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "tree" + }, + { + "title": "树模式单选", + "content": "

通过 popseletor 属性开启树模式,然后 tree-op 属性是 Tree 组件的 op 配置方式

\n", + "link": "popeditor/single-select-radio", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "single-select-radio" + }, + { + "title": "编辑框大小", + "content": "

通过 size 属性设置 PopEditor 编辑框大小,可选值有 mediumsmallmini

\n", + "link": "popeditor/size", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "size" + }, + { + "title": "数据超出隐藏", + "content": "

在数据的列上配置 showOverflow 属性用于设置数据超出列宽时的显示和隐藏。值的类型可以为 Boolean 和 String,有三个值可以选择,如下所示。默认为换行显示全部内容。

\n

可选值说明

\n

tooltip:内容超出部分显示 ...,左侧/右侧弹出提示层显示全部信息。\ntitle:和原生标签的 title 属性一致。\nellipsis:内容超出部分显示 ...,没有提示。\ntrue:为 true 时,效果和 tooltip 一致。

\n
\n", + "link": "popeditor/showOverflow", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "showOverflow" + }, + { + "title": "单选时触发勾选的方式", + "content": "

弹出编辑为单选时,默认只能通过单击单选按钮进行勾选。但也可以通过设置属性 triggerrow 实现单击行中任意位置进行勾选。或者设置 triggercell,单击操作列的单元格上任意位置进行勾选。

\n", + "link": "popeditor/trigger", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "trigger" + }, + { + "title": "设置历史记录标签页", + "content": "

当弹出面板配置的是表格时,通过配置 show-history 设置历史记录标签页是否显示表格,该值默认为false。

\n", + "link": "popeditor/show-history", + "component": " PopEditor 弹出编辑", + "findIntroStr": "该组件只能在弹出的面板中选择数据,不能手动输入数据;弹出面板中显示为 Tree 组件或者 Grid 组件。", + "demoId": "show-history" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/pop-upload.json b/examples/docs/resources/pc/demo-config/zh-CN/pop-upload.json new file mode 100644 index 000000000..bcfd03bce --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/pop-upload.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

通过 action 属性设置上传的服务接口。

\n","link":"pop-upload/basic-usage","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素,弹出上传对话框。","demoId":"basic-usage"},{"title":"自定义请求头","content":"

通过 headers 属性自定义上传请求头信息。

\n","link":"pop-upload/custom-request-headers","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素,弹出上传对话框。","demoId":"custom-request-headers"},{"title":"上传时附带的额外参数","content":"

通过 data 属性自定义上传时附带的额外参数。

\n","link":"pop-upload/data","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素,弹出上传对话框。","demoId":"data"},{"title":"设置组件大小","content":"

可设置为:mediumsmallmini\n通过 disabled 属性设置是否禁用,默认值为 false 。

\n","link":"pop-upload/size","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素,弹出上传对话框。","demoId":"size"},{"title":"覆盖默认请求","content":"

通过配置 http-request 覆盖默认的上传行为,可以自定义上传的实现

\n","link":"pop-upload/http-request","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素,弹出上传对话框。","demoId":"http-request"},{"title":"上传的文件字段名","content":"

通过 upload-name 属性设置上传的文件字段名,默认值为 file 。

\n","link":"pop-upload/upload-name","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素,弹出上传对话框。","demoId":"upload-name1"},{"title":"发送 cookie 凭证信息","content":"详细用法参考如下示例","link":"pop-upload/upload-name","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素,弹出上传对话框。","demoId":"upload-name"},{"title":"文件上传弹框中取消按钮的文本","content":"

通过 cancel-button-text 属性指定取消按钮的文本内容

\n","link":"pop-upload/fill-button-text","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素,弹出上传对话框。","demoId":"fill-button-text1"},{"title":"文件上传弹框中提交按钮的文本","content":"详细用法参考如下示例","link":"pop-upload/fill-button-text","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素,弹出上传对话框。","demoId":"fill-button-text2"},{"title":"打开弹出框的按钮的文本","content":"详细用法参考如下示例","link":"pop-upload/fill-button-text","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素,弹出上传对话框。","demoId":"fill-button-text4"},{"title":"最大上传文件数","content":"

通过 limit 属性可以指定最大上传的文件数量,配置 multiple 属性后可同时选择多个文件。

\n","link":"pop-upload/file-limit","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素,弹出上传对话框。","demoId":"file-limit"},{"title":"可上传文件类型","content":"

通过 accept 属性可以对选择文件时的文件类型进行控制,而 upload-file-type 属性可以指定在上传时进行校验的文件类型。

\n","link":"pop-upload/file-type","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素,弹出上传对话框。","demoId":"file-type"},{"title":"可上传文件大小","content":"

通过 max-upload-file-size 属性指定可上传文件的大小。

\n","link":"pop-upload/max-upload-file-size","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素,弹出上传对话框。","demoId":"max-upload-file-size"},{"title":"阻止删除文件","content":"

:before-remove(移除文件前回调事件),方法里面return true/false,表示是否可以删除

\n","link":"pop-upload/prevent-delete-file","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素,弹出上传对话框。","demoId":"prevent-delete-file"},{"title":"阻止上传文件","content":"

:before-upload 上传文件之前的钩子,参数为上传的文件,若返回 false 或者返回 Promise 且被 reject,则停止上传

\n","link":"pop-upload/before-upload","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素,弹出上传对话框。","demoId":"before-upload"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/popover.json b/examples/docs/resources/pc/demo-config/zh-CN/popover.json new file mode 100644 index 000000000..d61972397 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/popover.json @@ -0,0 +1,138 @@ +[ + { + "title": "基本用法", + "content": "详细用法参考如下示例", + "link": "popover/basic-usage", + "component": "Popover 弹出框", + "findIntroStr": "Popover可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画", + "demoId": "basic-usage" + }, + { + "title": "添加内容", + "content": "

content 设置要显示的内容。

\n", + "link": "popover/popover-content", + "component": " Popover", + "findIntroStr": "Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画", + "demoId": "popover-content" + }, + { + "title": "箭头偏移", + "content": "

arrow-offset 设置箭头的偏移量,来改变箭头的位置。

\n", + "link": "popover/arrow-offset", + "component": " Popover", + "findIntroStr": "Popover可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画", + "demoId": "arrow-offset" + }, + { + "title": "弹出框偏移", + "content": "

offset 设置弹框的偏移量,来改变弹框的位置。

\n", + "link": "popover/frame-offset", + "component": " Popover", + "findIntroStr": "Popover可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画", + "demoId": "frame-offset" + }, + { + "title": "延迟隐藏", + "content": "

close-delay 弹出框延迟隐藏单位为毫秒(Number)

\n", + "link": "popover/close-delay", + "component": " Popover", + "findIntroStr": "Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画", + "demoId": "close-delay" + }, + { + "title": "禁用", + "content": "

disabled 设置是否禁用弹出框。

\n", + "link": "popover/dynamic-disable", + "component": " Popover", + "findIntroStr": "Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画", + "demoId": "dynamic-disable" + }, + { + "title": "延迟显示", + "content": "

open-delay,设置延迟时间 ( type:number,单位毫秒 )

\n", + "link": "popover/open-delay", + "component": " Popover", + "findIntroStr": "Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画", + "demoId": "open-delay" + }, + { + "title": "显示位置", + "content": "

placement 设置弹出框的的位置,可选值为(top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end)

\n", + "link": "popover/popover-placement", + "component": " Popover", + "findIntroStr": "Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画", + "demoId": "popover-placement" + }, + { + "title": "自定义样式", + "content": "

popper-class 可配置单个或多个 class

\n", + "link": "popover/popper-class", + "component": " Popover", + "findIntroStr": "Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画", + "demoId": "popper-class" + }, + { + "title": "自定义渐变动画", + "content": "

transition 设置弹框的显示隐藏淡入淡出动画,默认取值 fade-in-linear,fade-in ( 无动画效果 )

\n", + "link": "popover/custom-transition", + "component": " Popover", + "findIntroStr": "Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画", + "demoId": "custom-transition" + }, + { + "title": "触发方式", + "content": "

trigger设定弹出框的触发方式 click 点击触发 focus 鼠标长按触发 hover 鼠标悬浮触发 manual 点击触发,再次点击隐藏

\n", + "link": "popover/trigger-mode", + "component": " Popover", + "findIntroStr": "Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画", + "demoId": "trigger-mode" + }, + { + "title": "隐藏提示框箭头", + "content": "

visible-arrow 设定是否显示提示框的箭头

\n", + "link": "popover/hidden-arrow", + "component": " Popover", + "findIntroStr": "Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画", + "demoId": "hidden-arrow" + }, + { + "title": "宽度", + "content": "

width 弹出框的宽度,height 弹出框的高度。两者默认值为auto,由子内容撑开。

\n", + "link": "popover/popover-width", + "component": " Popover", + "findIntroStr": "Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画", + "demoId": "popover-width" + }, + { + "title": "弹出框选项", + "content": "

popper-options 配置弹出框选项

\n", + "link": "popover/popper-options", + "component": " Popover", + "findIntroStr": "Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画", + "demoId": "popper-options" + }, + { + "title": "触发源", + "content": "

slot 设置弹出框的触发源

\n", + "link": "popover/trigger-reference", + "component": " Popover", + "findIntroStr": "Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画", + "demoId": "trigger-reference" + }, + { + "title": "自定义提示文本", + "content": "

content 设置自定义文本,也可在标签内直接嵌套默认插槽为自定义文本

\n", + "link": "popover/custom-tip-text", + "component": " Popover", + "findIntroStr": "Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画", + "demoId": "custom-tip-text" + }, + { + "title": "事件", + "content": "

input 加载完触发回调\n\nhide 隐藏时触发回调\n\nshow 显示时触发回调\n\nafter-leave 显示时触发回调\n\nafter-enter 显示动画播放完毕后触发回调

\n", + "link": "popover/popover-events", + "component": " Popover", + "findIntroStr": "Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容,延迟触发和渐变动画", + "demoId": "popover-events" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/progress.json b/examples/docs/resources/pc/demo-config/zh-CN/progress.json new file mode 100644 index 000000000..81aa8a2d5 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/progress.json @@ -0,0 +1,82 @@ +[ + { + "title": "基本用法", + "content": "详细用法参考如下示例", + "link": "progress/basic-usage", + "component": " Progress 进度条", + "findIntroStr": "用于展示操作进度,告知用户当前状态和预期。", + "demoId": "basic-usage" + }, + { + "title": "line 类型", + "content": "

type="line" 显示为 line 类型

\n", + "link": "progress/progress-type", + "component": " Progress", + "findIntroStr": "用于展示操作进度,告知用户当前状态和预期。", + "demoId": "progress-type" + }, + { + "title": "circle 类型", + "content": "

type="circle" 显示为 circle 类型。width可以调整环形进度条画布宽度,默认值为126px。

\n", + "link": "progress/progress-type-circle", + "component": " Progress", + "findIntroStr": "用于展示操作进度,告知用户当前状态和预期。", + "demoId": "progress-type-circle" + }, + { + "title": "dashboard 类型", + "content": "

type="dashboard" 显示为 dashboard 类型。width可以调整环形进度条画布宽度,默认值为126px。

\n", + "link": "progress/progress-type-dashboard", + "component": " Progress", + "findIntroStr": "用于展示操作进度,告知用户当前状态和预期。", + "demoId": "progress-type-dashboard" + }, + { + "title": "宽度", + "content": "

stroke-width进度条的宽度,单位 px

\n", + "link": "progress/progress-width", + "component": " Progress", + "findIntroStr": "用于展示操作进度,告知用户当前状态和预期。", + "demoId": "progress-width" + }, + { + "title": "状态", + "content": "

status 进度条当前状态(success/exception/warning)

\n", + "link": "progress/progress-status", + "component": " Progress", + "findIntroStr": "用于展示操作进度,告知用户当前状态和预期。", + "demoId": "progress-status" + }, + { + "title": "文字内显或不显", + "content": "

show-text 是否显示进度条文字内容

\n", + "link": "progress/text-inside-or-no-text", + "component": " Progress", + "findIntroStr": "用于展示操作进度,告知用户当前状态和预期。", + "demoId": "text-inside-or-no-text" + }, + { + "title": "自定义颜色", + "content": "

通过 color 设置进度条颜色。color 进度条背景色(会覆盖 status 状态颜色)

\n", + "link": "progress/custom-color", + "component": " Progress", + "findIntroStr": "用于展示操作进度,告知用户当前状态和预期。", + "demoId": "custom-color" + }, + { + "title": "自定义显示文字", + "content": "

text-inside 进度条显示文字内置在进度条内(只在 type=line 时可用),format自定义进度条的文字

\n", + "link": "progress/format-text", + "component": " Progress", + "findIntroStr": "用于展示操作进度,告知用户当前状态和预期。", + "demoId": "format-text" + }, + { + "title": "动态控制进度条变化", + "content": "

通过设置 percentage 动态控制进度条变化

\n", + "link": "progress/dynamic-control-changes", + "component": " Progress", + "findIntroStr": "用于展示操作进度,告知用户当前状态和预期。", + "demoId": "dynamic-control-changes" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/radio.json b/examples/docs/resources/pc/demo-config/zh-CN/radio.json new file mode 100644 index 000000000..9bb1f0e08 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/radio.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

通过 v-model 绑定变量,设置的变量值为默认选中的 Radio,变量值对应 label 属性的值。通过 text 也可以配置显示文本,与默认插槽配置纯文本的结果一致\n\nlabel 可以是 StringNumberBoolean

\n","link":"radio/basic-usage","component":" Radio 单选框","findIntroStr":"用于配置不同场景的选项,在一组备选项中进行单选。","demoId":"basic-usage"},{"title":"配置式单选组","content":"

提供 options 属性,支持通过配置对象数组数据的形式来渲染单选组。使用该属性后,可以不用再在标签中以插槽的形式插入 <radio><radio-button> 标签。\n\noptions 对象数组中包括三个字段:labeltextevents。\n\n另外还提供 type 属性,配合 options 属性一起使用,默认值为 radio。还可以配置为 button,配置后单选组将以按钮的形式展示。

\n","link":"radio/group-options","component":" Radio 单选框","findIntroStr":"用于配置不同场景的选项,在一组备选项中进行单选。","demoId":"group-options"},{"title":"带有边框","content":"

可通过设置 border 属性,给单选框增加边框。

\n","link":"radio/with-border","component":" Radio 单选框","findIntroStr":"用于配置不同场景的选项,在一组备选项中进行单选。","demoId":"with-border"},{"title":"禁用状态","content":"

设置 disabled 属性即可启动禁用状态,默认为 false 。

\n","link":"radio/dynamic-disable","component":" Radio 单选框","findIntroStr":"用于配置不同场景的选项,在一组备选项中进行单选。","demoId":"dynamic-disable"},{"title":"垂直布局","content":"

可在 RadioGroup 组件上设置 vertical 属性,使单选框垂直布局。

\n","link":"radio/vertical","component":" Radio 单选框","findIntroStr":"用于配置不同场景的选项,在一组备选项中进行单选。","demoId":"vertical"},{"title":"颜色设置","content":"

按钮形式的 Radio 激活时可通过 text-color 属性设置文本颜色,通过 fill 属性设置填充色和边框色。

\n","link":"radio/active-color","component":" Radio 单选框","findIntroStr":"用于配置不同场景的选项,在一组备选项中进行单选。","demoId":"active-color"},{"title":"文字内容","content":"

可在 Radio 组件上设置 text 属性,设置内容。

\n","link":"radio/radio-text","component":" Radio 单选框","findIntroStr":"用于配置不同场景的选项,在一组备选项中进行单选。","demoId":"radio-text"},{"title":"按钮内容","content":"

通过 label 属性可以设置 Radio 的内容

\n","link":"radio/radio-button","component":" Radio 单选框","findIntroStr":"用于配置不同场景的选项,在一组备选项中进行单选。","demoId":"radio-button"},{"title":"name","content":"详细用法参考如下示例","link":"radio/radio-button","component":" Radio 单选框","findIntroStr":"用于配置不同场景的选项,在一组备选项中进行单选。","demoId":"radio-button1"},{"title":"尺寸设置","content":"

可对按钮形式的 Radio 或带有边框的 Radio 设置 size 属性,以改变其尺寸,包括 medium、small、mini 三个选项。

\n","link":"radio/radio-size","component":" Radio 单选框","findIntroStr":"用于配置不同场景的选项,在一组备选项中进行单选。","demoId":"radio-size"},{"title":"单选框事件","content":"

可在 Radio、RadioGroup 组件上设置 change 事件,当绑定值变化时触发,回调函数为选中的 Radio label 值。

\n","link":"radio/radio-events","component":" Radio 单选框","findIntroStr":"用于配置不同场景的选项,在一组备选项中进行单选。","demoId":"radio-events"},{"title":"循环配置 Radio","content":"

可在 RadioGroup 组件上设置 options 属性,可循环配置 Radio。

\n","link":"radio/group-options","component":" Radio 单选框","findIntroStr":"用于配置不同场景的选项,在一组备选项中进行单选。","demoId":"group-options1"},{"title":"默认插槽","content":"

通过 default 默认插槽列表。

\n","link":"radio/radio-default","component":" Radio 单选框","findIntroStr":"用于配置不同场景的选项,在一组备选项中进行单选。","demoId":"radio-default"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/rate.json b/examples/docs/resources/pc/demo-config/zh-CN/rate.json new file mode 100644 index 000000000..465f4eba0 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/rate.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"rate/basic-usage","component":" Rate 评分","findIntroStr":"Rate 快速评级,对评价进行展示。","demoId":"basic-usage"},{"title":"自定义 3 分段颜色","content":"

可通过 colors 定义 3 分段颜色。

\n","link":"rate/custom-3-threshold-colors","component":" Rate 评分","findIntroStr":"Rate 快速评级,对评价进行展示。","demoId":"custom-3-threshold-colors"},{"title":"自定义禁用时未选中图标颜色","content":"

可通过 disabled-void-color 自定义禁用时未选中图标颜色。

\n","link":"rate/disabled-not-selected-color","component":" Rate 评分","findIntroStr":"Rate 快速评级,对评价进行展示。","demoId":"disabled-not-selected-color"},{"title":"自定义禁用时未选中图标类名","content":"

可通过 disabled-void-icon-class 自定义禁用时未选中图标类名。

\n","link":"rate/disabled-not-selected-class","component":" Rate 评分","findIntroStr":"Rate 快速评级,对评价进行展示。","demoId":"disabled-not-selected-class"},{"title":"自定义 3 分段图标样式","content":"

可通过 icon-classes 自定义 3 分段图标样式。

\n","link":"rate/custom-3-threshold-icon","component":" Rate 评分","findIntroStr":"Rate 快速评级,对评价进行展示。","demoId":"custom-3-threshold-icon"},{"title":"辅助文字及颜色","content":"

可通过 texts show-text text-color 三个属性分别设置辅助文字内容、是否显示辅助文字及辅助文字颜色。

\n","link":"rate/texts-and-text-color","component":" Rate 评分","findIntroStr":"Rate 快速评级,对评价进行展示。","demoId":"texts-and-text-color"},{"title":"大小及占位宽度","content":"

可通过 size space 分别大小和占位宽度。

\n","link":"rate/size-and-space","component":" Rate 评分","findIntroStr":"Rate 快速评级,对评价进行展示。","demoId":"size-and-space"},{"title":"自定义未选中图标颜色","content":"

可通过 void-color 定义未选中图标颜色。

\n","link":"rate/not-selected-color","component":" Rate 评分","findIntroStr":"Rate 快速评级,对评价进行展示。","demoId":"not-selected-color"},{"title":"自定义未选中图标类名","content":"

可通过 void-icon-class 定义未选中图标类名。

\n","link":"rate/not-selected-class","component":" Rate 评分","findIntroStr":"Rate 快速评级,对评价进行展示。","demoId":"not-selected-class"},{"title":"图标下文字提示","content":"

可通过 text-on-bottom 定义是否在图标下显示文字提示。

\n","link":"rate/text-on-bottom","component":" Rate 评分","findIntroStr":"Rate 快速评级,对评价进行展示。","demoId":"text-on-bottom"},{"title":"半选","content":"

可通过 allow-half 定义是否支持半选。

\n","link":"rate/allow-half","component":" Rate 评分","findIntroStr":"Rate 快速评级,对评价进行展示。","demoId":"allow-half"},{"title":"禁用","content":"

可通过 disabled 定义是否禁用。

\n","link":"rate/dynamic-disable","component":" Rate 评分","findIntroStr":"Rate 快速评级,对评价进行展示。","demoId":"dynamic-disable"},{"title":"分数显示","content":"

可通过 show-score score-template 分别定义是否显示分数和显示的模板。

\n","link":"rate/show-score","component":" Rate 评分","findIntroStr":"Rate 快速评级,对评价进行展示。","demoId":"show-score"},{"title":"单选模式","content":"

可通过 radio 设置单选模式。

\n","link":"rate/radio-rate","component":" Rate 评分","findIntroStr":"Rate 快速评级,对评价进行展示。","demoId":"radio-rate"},{"title":"最大分值","content":"

可通过 max 设置最大分值。

\n","link":"rate/max-score","component":" Rate 评分","findIntroStr":"Rate 快速评级,对评价进行展示。","demoId":"max-score"},{"title":"界限值","content":"

可通过 low-threshold high-threshold 分别设置下限值和上限值,通过colors配置显示星的颜色

\n","link":"rate/threshold-value","component":" Rate 评分","findIntroStr":"Rate 快速评级,对评价进行展示。","demoId":"threshold-value"},{"title":"事件","content":"

监听 change 事件触发处理方法。

\n","link":"rate/rate-events","component":" Rate 评分","findIntroStr":"Rate 快速评级,对评价进行展示。","demoId":"rate-events"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/roles.json b/examples/docs/resources/pc/demo-config/zh-CN/roles.json new file mode 100644 index 000000000..96af9a6a1 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/roles.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"
\n

注意 Roles 组件请求的是 mock 数据,开发时请用真实服务。\n通过 change(userId) 可以监听切换事件,入参是切换后的用户ID。

\n
\n","link":"roles/base","component":" Roles 角色切换","findIntroStr":"Roles 角色组件,提供当前用户的角色列表,并可以在不同角色间进行切换。","demoId":"base"},{"title":"自定义查询服务","content":"
\n

注意 Roles 组件请求的是 mock 数据,开发时请用真实服务。\n通过 fetch-role 自定义查询服务。

\n
\n","link":"roles/fetch-role","component":" Roles 角色切换","findIntroStr":"Roles 角色组件,提供当前用户的角色列表,并可以在不同角色间进行切换。","demoId":"fetch-role"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/scroll-text.json b/examples/docs/resources/pc/demo-config/zh-CN/scroll-text.json new file mode 100644 index 000000000..b02544fdc --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/scroll-text.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"scroll-text/basic-usage","component":" ScrollText 文字滚动","findIntroStr":"常用于文字提示信息滚动轮播显示。","demoId":"basic-usage"},{"title":"文字滚动方向","content":"

可通过 direction 设置文字滚动方向。

\n","link":"scroll-text/scroll-direction","component":" ScrollText 文字滚动","findIntroStr":"常用于文字提示信息滚动轮播显示。","demoId":"scroll-direction"},{"title":"鼠标悬停时文本停止滚动","content":"

可通过 hover-stop 设鼠标悬停时文本是否停止滚动。

\n","link":"scroll-text/hover-stop","component":" ScrollText 文字滚动","findIntroStr":"常用于文字提示信息滚动轮播显示。","demoId":"hover-stop"},{"title":"自定义文本内容","content":"

可通过 text 自定义文本内容。

\n","link":"scroll-text/custom-scroll-text","component":" ScrollText 文字滚动","findIntroStr":"常用于文字提示信息滚动轮播显示。","demoId":"custom-scroll-text"},{"title":"通过 solt 插槽自定义文本内容","content":"

可通过 solt 插槽自定义文本内容。

\n","link":"scroll-text/slots","component":" ScrollText 文字滚动","findIntroStr":"常用于文字提示信息滚动轮播显示。","demoId":"slots"},{"title":"滚动时间间隔","content":"

可通过 time 设置滚动时间间隔。

\n","link":"scroll-text/scroll-time","component":" ScrollText 文字滚动","findIntroStr":"常用于文字提示信息滚动轮播显示。","demoId":"scroll-time"},{"title":"自定义文本样式","content":"

可通过 class 自定义文本样式。

\n","link":"scroll-text/custom-text-style","component":" ScrollText 文字滚动","findIntroStr":"常用于文字提示信息滚动轮播显示。","demoId":"custom-text-style"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/search.json b/examples/docs/resources/pc/demo-config/zh-CN/search.json new file mode 100644 index 000000000..9c22c694e --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/search.json @@ -0,0 +1,90 @@ +[ + { + "title": "基本用法", + "content": "详细用法参考如下示例", + "link": "search/basic-usage", + "component": " Search 搜索", + "findIntroStr": "指定条件对象进行搜索数据。", + "demoId": "basic-usage" + }, + { + "title": "可清除", + "content": "

可通过 clearable 属性设置显示清空图标按钮。

\n", + "link": "search/clearable", + "component": " Search 搜索", + "findIntroStr": "指定条件对象进行搜索数据。", + "demoId": "clearable" + }, + { + "title": "迷你模式", + "content": "

可通过 mini 设置组件为mini模式。

\n", + "link": "search/mini-mode", + "component": " Search 搜索", + "findIntroStr": "指定条件对象进行搜索数据。", + "demoId": "mini-mode" + }, + { + "title": "透明模式", + "content": "

可通过 transparent 设置组件为透明模式(mini模式下有效)。搜索类型

\n", + "link": "search/transparent-mode", + "component": " Search 搜索", + "findIntroStr": "指定条件对象进行搜索数据。", + "demoId": "transparent-mode" + }, + { + "title": "默认值搜索", + "content": "

可通过 v-model 配置组件默认搜索条件。

\n", + "link": "search/default-value", + "component": " Search 搜索", + "findIntroStr": "指定条件对象进行搜索数据。", + "demoId": "default-value" + }, + { + "title": "搜索类型", + "content": "

可通过 search-types 配置组件可选的搜索类型。

\n", + "link": "search/search-types", + "component": " Search 搜索", + "findIntroStr": "指定条件对象进行搜索数据。", + "demoId": "search-types" + }, + { + "title": "自定义搜索类型的内容", + "content": "详细用法参考如下示例", + "link": "search/custom-search-types", + "component": " Search 搜索", + "findIntroStr": "指定条件对象进行搜索数据。", + "demoId": "custom-search-types" + }, + { + "title": "自定义搜索类型", + "content": "

搜索类型

\n", + "link": "search/show-selected-types", + "component": " Search 搜索", + "findIntroStr": "指定条件对象进行搜索数据。", + "demoId": "show-selected-types" + }, + { + "title": "自定义 search 事件", + "content": "详细用法参考如下示例", + "link": "search/search-events", + "component": " Search 搜索", + "findIntroStr": "指定条件对象进行搜索数据。", + "demoId": "search-events" + }, + { + "title": "自定义 change 事件", + "content": "详细用法参考如下示例", + "link": "search/change-events", + "component": " Search 搜索", + "findIntroStr": "指定条件对象进行搜索数据。", + "demoId": "change-events" + }, + { + "title": "自定义 select 事件", + "content": "详细用法参考如下示例", + "link": "search/select-events", + "component": " Search 搜索", + "findIntroStr": "指定条件对象进行搜索数据。", + "demoId": "select-events" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/select.json b/examples/docs/resources/pc/demo-config/zh-CN/select.json new file mode 100644 index 000000000..6b3219e73 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/select.json @@ -0,0 +1,442 @@ +[ + { + "title": "基本用法", + "content": "

v-model 的值为当前被选中的 tiny-optionvalue 属性值。

\n", + "link": "select/basic-usage", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "basic-usage" + }, + { + "title": "下拉面板可搜索", + "content": "

通过 searchable 配置下拉面板是否显示搜索框

\n", + "link": "select/searchable", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "searchable" + }, + { + "title": "多选", + "content": "

通过 multiple 属性启用多选功能,此时 v-model 的值为当前选中值所组成的数组。默认情况下选中值会以 Tag 的形式展现。

\n", + "link": "select/multiple", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "multiple" + }, + { + "title": "折叠 Tag", + "content": "

多选时通过设置 collapse-tags 属性将选中值合并为一段文字。

\n", + "link": "select/collapse-tags", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "collapse-tags" + }, + { + "title": "选择个数限制", + "content": "

multiple-limit 属性可指定多选时用户最多可以选择的项目数,默认为 0 不限制。

\n", + "link": "select/multiple-limit", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "multiple-limit" + }, + { + "title": "大数据虚拟滚动", + "content": "

通过 options 设置下拉选项并且设置 optimization 开启大数据虚拟滚动功能。使用标签配置选项时不支持开启虚拟滚动。\n多选模式下,最大选中项数 multiple-limit 默认值为 20,如果选中项比较多,建议开启 collapse-tags 进行折叠显示。

\n", + "link": "select/optimization", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "optimization" + }, + { + "title": "禁用", + "content": "

设置 disabled 属性后整个选择器不可用。

\n", + "link": "select/disabled", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "disabled" + }, + { + "title": "下拉选项某些项禁用", + "content": "

tiny-options 标签设置 disabled 属性后该选项不可用。

\n", + "link": "select/disabled-options", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "disabled-options" + }, + { + "title": "下拉多选默认选中且禁用", + "content": "

默认选中的标签设置 disabled 属性后,该选项禁用。

\n", + "link": "select/disabled-and-selected-options", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "disabled-and-selected-options" + }, + { + "title": "medium", + "content": "

通过 size 属性定义输入框尺寸,可选项有 medium、small、mini 。\n通过 options 配置 Select 数据项,使用后不需要再配置 tiny-option。

\n", + "link": "select/size-medium", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "size-medium" + }, + { + "title": "small", + "content": "详细用法参考如下示例", + "link": "select/size-small", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "size-small" + }, + { + "title": "mini", + "content": "详细用法参考如下示例", + "link": "select/size-mini", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "size-mini" + }, + { + "title": "分组", + "content": "

使用 tiny-option-group 对备选项进行分组,它的 label 属性为分组名,使用 disabled 属性设置该分组下所有选项为禁用。

\n", + "link": "select/option-group", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "option-group" + }, + { + "title": "分组禁用部分选项", + "content": "

使用 tiny-option-group 对备选项进行分组,禁用部分分组。

\n", + "link": "select/option-group-disable", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "option-group-disable" + }, + { + "title": "change clear blur focus 事件", + "content": "

事件说明

\n

change:选中值发生变化时触发,回调参数为目前的选中值\nclear:可清空的单选模式下用户点击清空按钮时触发\nblur:当 input 失去焦点时触发\nfocus:当 input 获得焦点时触发

\n
\n", + "link": "select/envts-change", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "envts-change" + }, + { + "title": "visible-change remove-tag 事件", + "content": "

事件说明

\n

visible-change:下拉框出现/隐藏时触发,回调参数为:出现则为 true,隐藏则为 false\nremove-tag:多选模式下移除tag时触发,回调参数为移除的 tag 值

\n
\n", + "link": "select/envts-remove", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "envts-remove" + }, + { + "title": "可搜索", + "content": "

通过 filterable 属性可启用搜索功能。默认情况下,Select 会找出所有 label 属性包含输入值的选项。如果希望使用其他的搜索逻辑,可以通过传入一个 filter-method 来实现。filter-method 为一个 Function,它会在输入值发生变化时调用,参数为当前输入值。

\n", + "link": "select/filter-method", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "filter-method" + }, + { + "title": "搜索允许复制", + "content": "

搜索单选场景,不能复制输入框的内容,需要添加属性 allow-copy 才能复制。属性 allow-copy 默认为 false。\n在鼠标悬浮在输入框上时,按下鼠标左键并移动鼠标,可选中之前输入文本;\n在鼠标悬浮在输入框上时,点击鼠标左键,还是原有行为,即输入内容变为 placeholder,内容清空,进入输入状态;

\n", + "link": "select/search-allow-copy", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "search-allow-copy" + }, + { + "title": "创建条目", + "content": "

通过 allow-create 属性可通过在输入框中输入文字来创建选项中并不存在的新的条目。注意此时 filterable 属性必须为真。而default-first-option 属性设置为 true 后,通过按下回车就可以选中当前选项列表中的第一个选项,无需使用鼠标或键盘方向键进行定位。

\n", + "link": "select/allow-create", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "allow-create" + }, + { + "title": "远程搜索", + "content": "

为了启用远程搜索,需要将 filterableremote 设置为 true,同时传入一个 remote-methodremote-method 为一个 Function,它会在输入值发生变化时调用,参数为当前输入值。reserve-keyword 属性在多选且可搜索时,可以在选中一个选项后保留当前的搜索关键词。

\n", + "link": "select/remote-method", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "remote-method" + }, + { + "title": "获焦时触发远程搜索", + "content": "详细用法参考如下示例", + "link": "select/focus-remote-method", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "focus-remote-method" + }, + { + "title": "远程搜索允许复制", + "content": "

远程搜索单选场景,不能复制输入框的内容,需要添加属性 allow-copy 才能复制。属性 allow-copy 默认为 false。\n在鼠标悬浮在输入框上时,按下鼠标左键并移动鼠标,可选中之前输入文本;\n在鼠标悬浮在输入框上时,点击鼠标左键,还是原有行为,即输入内容变为 placeholder,内容清空,进入输入状态;

\n", + "link": "select/remote-search-allow-copy", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "remote-search-allow-copy" + }, + { + "title": "选项可清除", + "content": "

通过 clearable 属性可将选择器清空,鼠标悬停于选择器上时,会出现清除图标。需要注意的是,clearable 属性仅适用于单选。

\n", + "link": "select/clearable", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "clearable" + }, + { + "title": "name", + "content": "

通过 name 属性可已设置 name 的属性

\n", + "link": "select/name", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "name" + }, + { + "title": "Select选择器选项可复制", + "content": "

设置 tag-selectable 属性后,输入框中已选择的选项可通过鼠标选择,然后按 Ctrl + C 或右键进行复制。

\n", + "link": "select/tag-select", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "tag-select" + }, + { + "title": "Select选择器选项支持复制所有", + "content": "

设置 copyable 属性后,可以复制所有的 tag 文本内容以逗号分隔

\n", + "link": "select/tag-copy-all", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "tag-copy-all" + }, + { + "title": "绑定值为对象", + "content": "

如果绑定值为对象时,则必须要配置 value-key 属性指定 value 唯一标识的键名。

\n", + "link": "select/binding-obj", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "binding-obj" + }, + { + "title": "自定义无匹配搜索文字", + "content": "

通过 no-match-text 属性可自定义搜索条件无匹配时显示的文字。

\n", + "link": "select/no-match-text", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "no-match-text" + }, + { + "title": "自定义空数据显示文字", + "content": "

通过 no-data-text 属性可以自定义选项为空时显示的文字。

\n", + "link": "select/no-data-text", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "no-data-text" + }, + { + "title": "弹出框样式与定位", + "content": "

通过 popper-class 属性可自定义下拉弹框的样式。popper-append-to-body\t指定是否将弹出框插入至 body 元素。在弹出框的定位出现问题时,可将该属性设置为 false 。

\n", + "link": "select/popup-style-position", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "popup-style-position" + }, + { + "title": "获取焦点既弹出下拉菜单", + "content": "

设置 automatic-dropdown 属性为 true 后,对于不可搜索的 Select,在输入框获得焦点后将自动弹出选项菜单。

\n", + "link": "select/automatic-dropdown", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "automatic-dropdown" + }, + { + "title": "自定义头部内容", + "content": "

通过 prefix 插槽自定义输入框头部内容。

\n", + "link": "select/custom-prefix", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "custom-prefix" + }, + { + "title": "自定义下拉内容", + "content": "

通过 Option 的默认插槽实现,将自定义的 HTML 模板插入 tiny-option 的 slot 中即可。

\n", + "link": "select/custom-options", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "custom-options" + }, + { + "title": "自定义触发源插槽", + "content": "

通过 reference 插槽自定义触发源的 HTML 模板。

\n", + "link": "select/custom-reference-slot", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "custom-reference-slot" + }, + { + "title": "不展示全选选项", + "content": "

show-alloption 属性设置为 false 后将不展示 全选 选项,默认为 true 。

\n", + "link": "select/show-alloption", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "show-alloption" + }, + { + "title": "改变输入框的值", + "content": "详细用法参考如下示例", + "link": "select/set-input-value", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "set-input-value" + }, + { + "title": "手动获取焦点", + "content": "

通过调用 focus() 方法使 input 获取焦点。

\n", + "link": "select/manual-focus-blur", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "manual-focus-blur" + }, + { + "title": "下拉列表跟随输入框宽度", + "content": "

通过 is-drop-inherit-width 属性设置下拉列表是否跟随输入框宽度。默认为 false 表示不跟随,内容可撑开下拉列表宽度,设置为 true 则跟随宽度。

\n", + "link": "select/is-drop-inherit-width", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "is-drop-inherit-width" + }, + { + "title": "默认插槽", + "content": "

通过 default 默认插槽列表。

\n", + "link": "select/slot-default", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "slot-default" + }, + { + "title": "底部插槽", + "content": "

通过 footer 使用底部插槽。

\n", + "link": "select/slot-footer", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "slot-footer" + }, + { + "title": "空数据插槽", + "content": "

通过 empty 设置没有数据时显示的提示语。

\n", + "link": "select/slot-empty", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "slot-empty" + }, + { + "title": "嵌套单选 Grid", + "content": "详细用法参考如下示例", + "link": "select/nest-radio-grid", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "nest-radio-grid" + }, + { + "title": "嵌套单选 Grid,可搜索,可清除", + "content": "详细用法参考如下示例", + "link": "select/nest-checkbox-grid-clearable", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "nest-checkbox-grid-clearable" + }, + { + "title": "嵌套多选 Grid", + "content": "详细用法参考如下示例", + "link": "select/nest-checkbox-grid", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "nest-checkbox-grid" + }, + { + "title": "text-field", + "content": "详细用法参考如下示例", + "link": "select/nest-checkbox-grid", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "nest-checkbox-grid1" + }, + { + "title": "value-field", + "content": "详细用法参考如下示例", + "link": "select/nest-checkbox-grid", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "nest-checkbox-grid2" + }, + { + "title": "嵌套 Grid 数据项禁用", + "content": "

下拉表格多选模式,通过 select-config 配置项的属性 checkMethod ,传入自定义方法判断哪些数据项被禁用,方法会判断每个数据项,需返回值为 true 或者 false,代表此数据项启用或者禁用。下拉表格单选模式,通过 radio-config 配置项的属性 checkMethod ,传入自定义方法判断哪些数据项被禁用,方法会判断每个数据项,需返回值为 true 或者 false,代表此数据项启用或者禁用。

\n", + "link": "select/disable-grid-select-radio", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "disable-grid-select-radio" + }, + { + "title": "嵌套 Grid 开启远程搜索(多选)", + "content": "

配置 render-typegrid 嵌套Grid;将 filterableremote 设置为 true,同时传入 remote-method 方法,开启远程搜索。如需自动搜索和显示展开按钮,需设置 remote-config

\n", + "link": "select/nest-grid-remote-filter", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "nest-grid-remote-filter" + }, + { + "title": "嵌套 Grid 开启远程搜索(单选)", + "content": "

配置 render-typegrid 嵌套Grid;将 filterableremote 设置为 true,同时传入 remote-method 方法,开启远程搜索。如需自动搜索和显示展开按钮,需设置 remote-config

\n", + "link": "select/nest-remote-grid", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "nest-remote-grid" + }, + { + "title": "嵌套 Grid 且数据量大", + "content": "详细用法参考如下示例", + "link": "select/nest-radio-grid-much-data", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "nest-radio-grid-much-data" + }, + { + "title": "嵌套单选 Tree", + "content": "详细用法参考如下示例", + "link": "select/nest-radio-tree", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "nest-radio-tree" + }, + { + "title": "嵌套多选 Tree", + "content": "详细用法参考如下示例", + "link": "select/nest-checkbox-tree", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "nest-checkbox-tree" + }, + { + "title": "可搜索 tree", + "content": "详细用法参考如下示例", + "link": "select/nest-filterable-tree", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "nest-filterable-tree" + }, + { + "title": "配置方式", + "content": "

通过设置 cache-op 开启缓存功能并且通过 options 设置下来选项。

\n", + "link": "select/cache-usage", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "cache-usage" + }, + { + "title": "插槽方式", + "content": "

通过 slot 设置列表渲染组件为 vue-option 来输出下拉列表,则需要手动加入缓存功能。

\n", + "link": "select/memoize-usage", + "component": " Select 选择器", + "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。", + "demoId": "memoize-usage" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/slide-bar.json b/examples/docs/resources/pc/demo-config/zh-CN/slide-bar.json new file mode 100644 index 000000000..907657feb --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/slide-bar.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"slide-bar/basic-usage","component":" SlideBar 滚动块","findIntroStr":"SlideBar 滚动块,可以用作文字块的滑动。","demoId":"basic-usage"},{"title":"每次滚动块数","content":"

可通过 wheel-blocks 设置每次滚动块数。\n可通过 value 调用服务时候获取数据的来源

\n","link":"slide-bar/wheel-blocks","component":" SlideBar 滚动块","findIntroStr":"SlideBar 滚动块,可以用作文字块的滑动。","demoId":"wheel-blocks"},{"title":"自定义滚动块内容","content":"

通过插槽自定义滚动块内容。

\n","link":"slide-bar/custom-content","component":" SlideBar 滚动块","findIntroStr":"SlideBar 滚动块,可以用作文字块的滑动。","demoId":"custom-content"},{"title":"自定义 DOM 标签","content":"

可通过 tag sub-tag 自定义 DOM 标签。

\n","link":"slide-bar/custom-tag","component":" SlideBar 滚动块","findIntroStr":"SlideBar 滚动块,可以用作文字块的滑动。","demoId":"custom-tag"},{"title":"滚动块事件","content":"详细用法参考如下示例","link":"slide-bar/slide-bar-events","component":" SlideBar 滚动块","findIntroStr":"SlideBar 滚动块,可以用作文字块的滑动。","demoId":"slide-bar-events"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/slider.json b/examples/docs/resources/pc/demo-config/zh-CN/slider.json new file mode 100644 index 000000000..fdaa31061 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/slider.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"slider/basic-usage","component":" Slider 滑块","findIntroStr":"通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。","demoId":"basic-usage"},{"title":"竖向模式","content":"

通过设置vertical 属性来展示滑块竖向模式(不设置,默认为横向模式)\n竖向模式可以通过 height 设置组件高度

\n","link":"slider/vertical-mode","component":" Slider 滑块","findIntroStr":"通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。","demoId":"vertical-mode"},{"title":"最大最小值","content":"

通过设置min max 来设置滑块取值范围

\n","link":"slider/max-min","component":" Slider 滑块","findIntroStr":"通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。","demoId":"max-min"},{"title":"当前值","content":"

通过设置format-tooltip 来属性设置 value

\n","link":"slider/format-tooltip","component":" Slider 滑块","findIntroStr":"通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。","demoId":"format-tooltip"},{"title":"范围选择","content":"

通过v-model 为数组 设定初始范围选择

\n","link":"slider/range-select","component":" Slider 滑块","findIntroStr":"通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。","demoId":"range-select"},{"title":"输入框模式","content":"

通过配置show-input,开启滑块输入框模式

\n","link":"slider/show-iput","component":" Slider 滑块","findIntroStr":"通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。","demoId":"show-iput"},{"title":"快捷键操作","content":"

设置总步数,即按快捷键 PageDown/PageUp 时,每次移动的距离是(最大值-最小值)/分页数

\n","link":"slider/shortcut-operation","component":" Slider 滑块","findIntroStr":"通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。","demoId":"shortcut-operation"},{"title":"禁用","content":"

通过设置属性disabled ,设置滑动滑块禁止滑动

\n","link":"slider/dynamic-disable","component":" Slider 滑块","findIntroStr":"通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。","demoId":"dynamic-disable"},{"title":"提示","content":"

通过设定:show-tip="false",关闭滑块提示。(默认开启)

\n","link":"slider/show-tip","component":" Slider 滑块","findIntroStr":"通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。","demoId":"show-tip"},{"title":"步长","content":"

通过设置step来配置滑块滑动的步长

\n","link":"slider/about-step","component":" Slider 滑块","findIntroStr":"通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。","demoId":"about-step"},{"title":"change 事件","content":"

change 事件

\n","link":"slider/slider-event-change","component":" Slider 滑块","findIntroStr":"通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。","demoId":"slider-event-change"},{"title":"start 滑块开始滑动事件","content":"

start 滑块开始滑动事件

\n","link":"slider/slider-event-start","component":" Slider 滑块","findIntroStr":"通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。","demoId":"slider-event-start"},{"title":"stop 滑块停止滑动事件","content":"

stop 滑块停止滑动事件

\n","link":"slider/slider-event-stop","component":" Slider 滑块","findIntroStr":"通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。","demoId":"slider-event-stop"},{"title":"自定义插槽","content":"详细用法参考如下示例","link":"slider/slider-slot","component":" Slider 滑块","findIntroStr":"通过鼠标滑动滑块来确定位置和大小。多种形式,横向、纵向和范围滑块。","demoId":"slider-slot"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/split.json b/examples/docs/resources/pc/demo-config/zh-CN/split.json new file mode 100644 index 000000000..afdddf982 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/split.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"split/basic-usage","component":" Split 面板分割","findIntroStr":"常用于将一片区域,分割为可以拖拽调整宽度或高度的两部分区域。","demoId":"basic-usage"},{"title":"面板阈值","content":"详细用法参考如下示例","link":"split/split-threshold","component":" Split 面板分割","findIntroStr":"常用于将一片区域,分割为可以拖拽调整宽度或高度的两部分区域。","demoId":"split-threshold"},{"title":"分割方式","content":"

同个mode设置分割类型,可选值为 horizontal(横向) 或 vertical(纵向);默认值horizontal

\n","link":"split/split-mode","component":" Split 面板分割","findIntroStr":"常用于将一片区域,分割为可以拖拽调整宽度或高度的两部分区域。","demoId":"split-mode"},{"title":"不可拖拽","content":"详细用法参考如下示例","link":"split/basic-usage1","component":" Split 面板分割","findIntroStr":"常用于将一片区域,分割为可以拖拽调整宽度或高度的两部分区域。","demoId":"basic-usage1"},{"title":"movestart 事件","content":"

开始移动事件

\n","link":"split/movestart-event","component":" Split 面板分割","findIntroStr":"常用于将一片区域,分割为可以拖拽调整宽度或高度的两部分区域。","demoId":"movestart-event"},{"title":"moving 事件","content":"

移动中事件

\n","link":"split/moving-event","component":" Split 面板分割","findIntroStr":"常用于将一片区域,分割为可以拖拽调整宽度或高度的两部分区域。","demoId":"moving-event"},{"title":"moveend 事件","content":"

移动完成事件

\n","link":"split/moveend-event","component":" Split 面板分割","findIntroStr":"常用于将一片区域,分割为可以拖拽调整宽度或高度的两部分区域。","demoId":"moveend-event"},{"title":"左右面板插槽","content":"详细用法参考如下示例","link":"split/left-right-slot","component":" Split 面板分割","findIntroStr":"常用于将一片区域,分割为可以拖拽调整宽度或高度的两部分区域。","demoId":"left-right-slot"},{"title":"上下面板插槽","content":"详细用法参考如下示例","link":"split/top-bottom-slot","component":" Split 面板分割","findIntroStr":"常用于将一片区域,分割为可以拖拽调整宽度或高度的两部分区域。","demoId":"top-bottom-slot"},{"title":"拖拽插槽","content":"详细用法参考如下示例","link":"split/trigger-slot","component":" Split 面板分割","findIntroStr":"常用于将一片区域,分割为可以拖拽调整宽度或高度的两部分区域。","demoId":"trigger-slot"},{"title":"嵌套使用","content":"详细用法参考如下示例","link":"split/nested-use","component":" Split 面板分割","findIntroStr":"常用于将一片区域,分割为可以拖拽调整宽度或高度的两部分区域。","demoId":"nested-use"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/steps.json b/examples/docs/resources/pc/demo-config/zh-CN/steps.json new file mode 100644 index 000000000..d49cfc26e --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/steps.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"steps/data-resource","component":" Steps 步骤条","findIntroStr":"Steps 步骤条","demoId":"data-resource"},{"title":"普通步骤条","content":"

使用 tiny-time-line 标签,并设置 typenormal 实现普通步骤条。

\n","link":"steps/normal-steps","component":" Steps 步骤条","findIntroStr":"Steps 步骤条","demoId":"normal-steps"},{"title":"高级向导","content":"

设置 typeadvanced 启用高级向导功能。

\n","link":"steps/advanced-steps","component":" Steps 步骤条","findIntroStr":"Steps 步骤条","demoId":"advanced-steps"},{"title":"时间线步骤条","content":"

使用 tiny-time-line 标签,并设置 typetimeline 实现时间线步骤条。同时若配置 vertical 属性,时间线步骤条将变成竖向模式,而若再配置 reverse 属性,则还可以实现时间线步骤条竖向模式的反向形式。

\n","link":"steps/timeline-steps","component":" Steps 步骤条","findIntroStr":"Steps 步骤条","demoId":"timeline-steps"},{"title":"自定义数据项","content":"

默认情况下,绑定数据的子对象包含 name、count、status 字段。\nname-field:设置节点信息中名称对应的字段名,默认为 'name' 。\ncount-field:设置高级向导里徽标计数对应的字段名,默认为 'count' 。\nstatus-field:设置数据状态对应的字段名,默认为 'status' 。

\n","link":"steps/custom-steps-item","component":" Steps 步骤条","findIntroStr":"Steps 步骤条","demoId":"custom-steps-item"},{"title":"订单流程","content":"

通过 Steps 组件模拟订单流程。

\n","link":"steps/order-progress","component":" Steps 步骤条","findIntroStr":"Steps 步骤条","demoId":"order-progress"},{"title":"点击事件","content":"

点击节点时触发 click 事件。

\n","link":"steps/click","component":" Steps 步骤条","findIntroStr":"Steps 步骤条","demoId":"click"},{"title":"插槽的使用","content":"

通过作用域插槽 item 自定义步骤条节点内容。

\n","link":"steps/slot","component":" Steps 步骤条","findIntroStr":"Steps 步骤条","demoId":"slot"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/switch.json b/examples/docs/resources/pc/demo-config/zh-CN/switch.json new file mode 100644 index 000000000..5e2391b58 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/switch.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"switch/basic-usage","component":" Switch 开关","findIntroStr":"Switch 在两种状态间切换选择。","demoId":"basic-usage"},{"title":"迷你尺寸","content":"详细用法参考如下示例","link":"switch/mini-mode","component":" Switch 开关","findIntroStr":"设置是否显示为 mini 模式,默认为 false。当设置 `mini` 为 `true` 时,不会显示文字提示。","demoId":"mini-mode"},{"title":"自定义开关显示","content":"通过具名插槽 open 和 close 自定义 Switch 显示。前提是配置show-texttrue","link":"switch/custom-open-close","component":" Switch 开关","findIntroStr":"通过具名插槽 open 和 close 自定义 Switch 显示。","demoId":"custom-open-close"},{"title":"自定义开关取值","content":"

false-value 属性表示的是关闭时取付给 false-value 的值。\ntrue-value 属性表示的是开启时取付给 true-value 的值,v-model里定义的属性名是 value 时就能拿的到 true-valuefalse-value 里的值。

\n","link":"switch/custom-true-false-value","component":" Switch 开关","findIntroStr":"通过 true-value 和 false-value 属性设置 Switch 在开和关状态下的不同取值。","demoId":"custom-true-false-value"},{"title":"禁用状态","content":"

disable 属性表示的是当前状态是无法被使用的,默认值为false(true/false)。

\n","link":"switch/dynamic-disable","component":" Switch 开关","findIntroStr":"通过 disabled 属性设置 Switch 禁用状态。","demoId":"dynamic-disable"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/tabs.json b/examples/docs/resources/pc/demo-config/zh-CN/tabs.json new file mode 100644 index 000000000..82dc15f48 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/tabs.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

通过 v-model 设置初始激活的标签页,绑定的值对应 tiny-tab-item 元素中 name 属性的值。一个 tiny-tab-item 为一个标签页,通过 title 属性设置标签页标题。

\n","link":"tabs/basic-usage","component":" Tabs 标签页","findIntroStr":"分隔内容上有关联但属于不同类别的数据集合。","demoId":"basic-usage"},{"title":"card 类型","content":"

通过 tab-style 设置标签页风格类型, 通过 active-name 设置初始激活的标签页 。

\n","link":"tabs/tab-style-card","component":" Tabs 标签页","findIntroStr":"分隔内容上有关联但属于不同类别的数据集合。","demoId":"tab-style-card"},{"title":"bordercard 类型","content":"

通过 tab-style 设置标签页风格类型为 bordercard

\n","link":"tabs/tab-style-bordercard","component":" Tabs 标签页","findIntroStr":"分隔内容上有关联但属于不同类别的数据集合。","demoId":"tab-style-bordercard"},{"title":"标签页可增加","content":"

设置 with-add 属性启用标签可增加功能。同时通过 add 事件自定义实现增加标签页的逻辑。配置 show-more-tabs 属性后当标签页超过一定宽度时将显示 更多 按钮。

\n","link":"tabs/with-add","component":" Tabs 标签页","findIntroStr":"分隔内容上有关联但属于不同类别的数据集合。","demoId":"with-add"},{"title":"标签页可关闭","content":"

通过 withClose 属性设置是否可关闭标签页。同时可通过 close 事件自定义实现关闭标签页的逻辑。

\n","link":"tabs/tabs-events-close","component":" Tabs 标签页","findIntroStr":"分隔内容上有关联但属于不同类别的数据集合。","demoId":"tabs-events-close1"},{"title":"top 显示位置","content":"

通过 position 属性设置标签页显示位置,可选值有 toprightbottomleft,默认为 top

\n","link":"tabs/position","component":" Tabs 标签页","findIntroStr":"分隔内容上有关联但属于不同类别的数据集合。","demoId":"position"},{"title":"右侧显示","content":"详细用法参考如下示例","link":"tabs/position-right","component":" Tabs 标签页","findIntroStr":"分隔内容上有关联但属于不同类别的数据集合。","demoId":"position-right"},{"title":"下方显示","content":"详细用法参考如下示例","link":"tabs/position-bottom","component":" Tabs 标签页","findIntroStr":"分隔内容上有关联但属于不同类别的数据集合。","demoId":"position-bottom"},{"title":"左侧显示","content":"详细用法参考如下示例","link":"tabs/position-left","component":" Tabs 标签页","findIntroStr":"分隔内容上有关联但属于不同类别的数据集合。","demoId":"position-left"},{"title":"离开前事件","content":"

before-leave 切换标签之前的钩子函数,若返回 false 或者返回 Promise 且被 reject,则阻止切换,返回 true 则可以切换。

\n","link":"tabs/before-leave","component":" Tabs 标签页","findIntroStr":"分隔内容上有关联但属于不同类别的数据集合。","demoId":"before-leave"},{"title":"可自动撑开","content":"

stretch 属性设置标签的宽度是否自撑开,默认为 false 。

\n","link":"tabs/stretch-wh","component":" Tabs 标签页","findIntroStr":"分隔内容上有关联但属于不同类别的数据集合。","demoId":"stretch-wh"},{"title":"add 事件","content":"

点击新增按钮增加标签页时触发 add 事件

\n","link":"tabs/tabs-events-add","component":" Tabs 标签页","findIntroStr":"分隔内容上有关联但属于不同类别的数据集合。","demoId":"tabs-events-add"},{"title":"click 事件","content":"

单击标签页时触发 click 事件

\n","link":"tabs/tabs-events-click","component":" Tabs 标签页","findIntroStr":"分隔内容上有关联但属于不同类别的数据集合。","demoId":"tabs-events-click"},{"title":"close 事件","content":"

关闭标签页时触发 close 事件

\n","link":"tabs/tabs-events-close","component":" Tabs 标签页","findIntroStr":"分隔内容上有关联但属于不同类别的数据集合。","demoId":"tabs-events-close"},{"title":"edit 事件","content":"

点击新增按钮增加标签页 或 标签页被关闭后触发 edit 事件

\n","link":"tabs/tabs-events-edit","component":" Tabs 标签页","findIntroStr":"分隔内容上有关联但属于不同类别的数据集合。","demoId":"tabs-events-edit"},{"title":"自定义标签页标题","content":"

通过 tiny-tab-itemtitle 插槽自定义标签页标题,比如在标题前增加图标。

\n","link":"tabs/custom-tab-title","component":" Tabs 标签页","findIntroStr":"分隔内容上有关联但属于不同类别的数据集合。","demoId":"custom-tab-title"},{"title":"循环创建标签页","content":"

通过 v-for 根据数据循环创建多个 tiny-tab-item

\n","link":"tabs/tabdata-title","component":" Tabs 标签页","findIntroStr":"分隔内容上有关联但属于不同类别的数据集合。","demoId":"tabdata-title"},{"title":"标签页切换不同 Grid","content":"
\n

Tabs 组件里使用 Grid 组件需要 Grid 设置属性 :auto-resize="true",这样才能让 Grid 自适应父元素响应变化。

\n
\n","link":"tabs/show-different-grid-data","component":" Tabs 标签页","findIntroStr":"分隔内容上有关联但属于不同类别的数据集合。","demoId":"show-different-grid-data"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/tag.json b/examples/docs/resources/pc/demo-config/zh-CN/tag.json new file mode 100644 index 000000000..c19961e04 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/tag.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"tag/basic-usage","component":" Tag 标签","findIntroStr":"Tag 标签组件,用于标记事物的属性和维度","demoId":"basic-usage"},{"title":"颜色","content":"

可通过 color 设置标签背景色。

\n","link":"tag/color3","component":" Tag 标签","findIntroStr":"Tag 标签组件,用于标记事物的属性和维度","demoId":"color3"},{"title":"边框","content":"

可通过 hit 设置标签边框,可选值(true/false)true为有边框,false无边框,默认值为 false。

\n","link":"tag/hit","component":" Tag 标签","findIntroStr":"Tag 标签组件,用于标记事物的属性和维度","demoId":"hit"},{"title":"尺寸","content":"

可通过 size 设置Tag标签大小,可选值(medium / small / mini)。

\n","link":"tag/tag-size","component":" Tag 标签","findIntroStr":"Tag 标签组件,用于标记事物的属性和维度","demoId":"tag-size"},{"title":"主题","content":"

可通过 effect 设置Tag标签主题,可选值(dark / light / plain)。\ntype可以为标签设置相应的类型,可选值(success / info / warning / danger)。

\n","link":"tag/effect","component":" Tag 标签","findIntroStr":"Tag 标签组件,用于标记事物的属性和维度","demoId":"effect"},{"title":"动态编辑标签","content":"

通过点击+ New Tag在文本框中输入你要定义的标签名就能在标签列表中最后一个创建标签 。closable 属性可以为标签设置成可去除标签。

\n","link":"tag/create","component":" Tag 标签","findIntroStr":"Tag 标签组件,用于标记事物的属性和维度","demoId":"create"},{"title":"可移除标签","content":"详细用法参考如下示例","link":"tag/closeable","component":" Tag 标签","findIntroStr":"Tag 标签组件,用于标记事物的属性和维度","demoId":"closeable"},{"title":"Click 事件","content":"详细用法参考如下示例","link":"tag/tag-event-click","component":" Tag 标签","findIntroStr":"Tag 标签组件,用于标记事物的属性和维度","demoId":"tag-event-click"},{"title":"Close 事件","content":"详细用法参考如下示例","link":"tag/tag-event-close","component":" Tag 标签","findIntroStr":"Tag 标签组件,用于标记事物的属性和维度","demoId":"tag-event-close"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/textpopup.json b/examples/docs/resources/pc/demo-config/zh-CN/textpopup.json new file mode 100644 index 000000000..9e3613182 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/textpopup.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"text-popup/basic-usage","component":" TextPopup 输入框","findIntroStr":"TextPopup 输入框,提供数据绑定功能。","demoId":"basic-usage"},{"title":"提示占位文本","content":"

placeholder 属性的值为 string 此属性会把值默认显示到输入框中。

\n","link":"text-popup/placeholder","component":" TextPopup 输入框","findIntroStr":"TextPopup 输入框,提供数据绑定功能。","demoId":"placeholder"},{"title":"只读","content":"

可通过 readonly 设置是否只读。

\n","link":"text-popup/readonly","component":" TextPopup 输入框","findIntroStr":"TextPopup 输入框,提供数据绑定功能。","demoId":"readonly"},{"title":"分隔符","content":"

可通过 separtor 设置分隔符,在文本框中输入回车就是分隔符的位置。

\n","link":"text-popup/separtor","component":" TextPopup 输入框","findIntroStr":"TextPopup 输入框,提供数据绑定功能。","demoId":"separtor"},{"title":"绑定值","content":"

可通过 valuev-model 设置绑定值。

\n","link":"text-popup/value","component":" TextPopup 输入框","findIntroStr":"TextPopup 输入框,提供数据绑定功能。","demoId":"value"},{"title":"清除 value 值","content":"详细用法参考如下示例","link":"text-popup/clear-value","component":" TextPopup 输入框","findIntroStr":"TextPopup 输入框,提供数据绑定功能。","demoId":"clear-value"},{"title":"宽度","content":"

可通过 width 设置宽度。

\n","link":"text-popup/width","component":" TextPopup 输入框","findIntroStr":"TextPopup 输入框,提供数据绑定功能。","demoId":"width"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/time-line.json b/examples/docs/resources/pc/demo-config/zh-CN/time-line.json new file mode 100644 index 000000000..98c4f89da --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/time-line.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

通过 data 属性设置时间线步骤条数据,通过 active 属性设置步骤条的选中步骤。

\n","link":"time-line/basic-usage","component":" TimeLine 时间线","findIntroStr":"TimeLine 时间线","demoId":"basic-usage"},{"title":"横向时间线","content":"

通过 horizontal 属性设置横向时间线。

\n","link":"time-line/horizontal-step","component":" TimeLine 时间线","findIntroStr":"TimeLine 时间线","demoId":"horizontal-step"},{"title":"竖向时间线","content":"

通过 vertical 属性设置竖向时间线。

\n","link":"time-line/vertical-step","component":" TimeLine 时间线","findIntroStr":"TimeLine 时间线","demoId":"vertical-step"},{"title":"竖向时间线的方向","content":"

通过 reverse 属性设置竖向步骤条的方向。

\n","link":"time-line/vertical-step-reverse","component":" TimeLine 时间线","findIntroStr":"TimeLine 时间线","demoId":"vertical-step-reverse"},{"title":"宽度设置","content":"

通过 space属性设置步骤条的宽度。

\n","link":"time-line/set-step-width","component":" TimeLine 时间线","findIntroStr":"TimeLine 时间线","demoId":"set-step-width"},{"title":"数据映射","content":"

通过 name-field 属性设置节点信息中名称对应的字段名,通过 time-field 属性设置节点时间信息对应的字段名。

\n","link":"time-line/different-data","component":" TimeLine 时间线","findIntroStr":"TimeLine 时间线","demoId":"different-data"},{"title":"设置序号起始值","content":"

通过 start 属性设置步骤条序号起始值。

\n","link":"time-line/set-start-value","component":" TimeLine 时间线","findIntroStr":"TimeLine 时间线","demoId":"set-start-value"},{"title":"显示组件内部状态","content":"

通过 show-status 属性设置是否显示组件内部状态。默认为 false,表示不显示。

\n","link":"time-line/show-status","component":" TimeLine 时间线","findIntroStr":"TimeLine 时间线","demoId":"show-status"},{"title":"未完成的序号显示","content":"

通过 show-number 属性设置未完成的状态是否显示序号。

\n","link":"time-line/show-number","component":" TimeLine 时间线","findIntroStr":"TimeLine 时间线","demoId":"show-number"},{"title":"自定义横向时间线","content":"

slottop可以自定义步骤条顶部内容,slotbottom 可以自定义步骤条底部内容。

\n","link":"time-line/custom-normal-step","component":" TimeLine 时间线","findIntroStr":"TimeLine 时间线","demoId":"custom-normal-step"},{"title":"自定义竖向时间线","content":"

slotleft可以自定义步骤条左侧内容,slotright 可以自定义步骤条右侧内容。

\n","link":"time-line/custom-vertical-step","component":" TimeLine 时间线","findIntroStr":"TimeLine 时间线","demoId":"custom-vertical-step"},{"title":"click 事件","content":"

单击时触发 click 事件

\n","link":"time-line/vertical-step-reverse","component":" TimeLine 时间线","findIntroStr":"TimeLine 时间线","demoId":"vertical-step-reverse1"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/time-picker.json b/examples/docs/resources/pc/demo-config/zh-CN/time-picker.json new file mode 100644 index 000000000..b76f53e1d --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/time-picker.json @@ -0,0 +1,146 @@ +[ + { + "title": "基本用法", + "content": "详细用法参考如下示例", + "link": "time-picker/basic-usage", + "component": " TimePicker 时间选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "basic-usage" + }, + { + "title": "选择范围", + "content": "

picker-options 设置时间选择范围

\n", + "link": "time-picker/basic-usage", + "component": " TimePicker 时间选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "basic-usage1" + }, + { + "title": "箭头选择", + "content": "

arrow-control 属性设置是否使用箭头进行时间选择,仅对 <tiny-time-picker> 有效

\n", + "link": "date-picker/clearable", + "component": " TimePicker 时间选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "clearable1" + }, + { + "title": "清除输入", + "content": "

通过 clear-icon 自定义清空图标

\n", + "link": "time-picker/clear-icon", + "component": " TimePicker 时间选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "clear-icon" + }, + { + "title": "尺寸设置medium", + "content": "

通过 size 自定义组价尺寸

\n", + "link": "time-picker/size-medium", + "component": " TimePicker 时间选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "size-medium" + }, + { + "title": "尺寸设置small", + "content": "

通过 size 自定义组价尺寸

\n", + "link": "time-picker/size-small", + "component": " TimePicker 时间选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "size-small" + }, + { + "title": "尺寸设置mini", + "content": "

通过 size 自定义组价尺寸

\n", + "link": "time-picker/size-mini", + "component": " TimePicker 时间选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "size-mini" + }, + { + "title": "清除按钮", + "content": "

通过 clearable 属性设置是否显示清除按钮,默认值为 true

\n", + "link": "time-picker/clearable", + "component": " TimePicker 时间选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "clearable" + }, + { + "title": "自定义后置图标", + "content": "

通过 suffix-icon 属性设置日期输入框后置图标,从 @opentiny/vue-icon 中导入一个图标并进行初始化后传给 suffix-icon

\n", + "link": "time-picker/suffix-icon", + "component": " TimePicker 时间选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "suffix-icon" + }, + { + "title": "时间格式化", + "content": "

format 时间格式化显示\ntimestamp JS 时间戳,仅 value-format 可用;组件绑定值为 number 类型

\n", + "link": "time-picker/format", + "component": " TimePicker 时间选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "format" + }, + { + "title": "时间显示类型", + "content": "

通过 hh 属性可设置 12 小时制。 HH 属性为 24 小时制,须和 A 或 a 使用。 hH 属性设置不补 0。\n通过 mm 属性可设置分钟显示格式,例如 01。 m 属性设置不补 0。\n通过 ss 属性可设置秒的显示格式,例如 01。 s 属性设置不补 0。\n通过 a 属性可设置显示时间为 am/pm A属性设置显示时间为 AM/PM。

\n", + "link": "time-picker/time-low", + "component": " TimePicker 时间选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "time-low" + }, + { + "title": "日期显示格式", + "content": "

WW 属性设置周,例如 01, W 属性设置不补 0。\nyyyy 属性设置年,例如 2020。\nMM 属性设置月,例如 01 M 属性设置不补 0。\ndd 属性设置日,例如 01 d 属性设置不补 0。

\n", + "link": "time-picker/date", + "component": " TimePicker 时间选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "date" + }, + { + "title": "范围选择", + "content": "

is-range 设置是否为范围选择,默认为 false,range-separator,设置范围选择分隔符(为可选值)默认为‘-’

\n", + "link": "time-picker/is-range", + "component": " TimePicker 时间选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "is-range" + }, + { + "title": "选择器打开时默认时间设置", + "content": "

通过 default-value 设置选择器打开显示默认时间

\n", + "link": "time-picker/default-value", + "component": " TimePicker 时间选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "default-value" + }, + { + "title": "原生属性", + "content": "

通过 name 属性设置默认 name

\n", + "link": "time-picker/name", + "component": " TimePicker 时间选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "name" + }, + { + "title": "下拉框的类名", + "content": "

通过 popper-class 属性设置下拉框的类名

\n", + "link": "time-picker/popper-class", + "component": " TimePicker 时间选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "popper-class" + }, + { + "title": "文本框不可输入", + "content": "

日期输入框默认可以输入日期,设置 editable 为 false 后,将不能输入。

\n", + "link": "time-picker/editable", + "component": " TimePicker 时间选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "editable" + }, + { + "title": "事件", + "content": "

当聚焦和失焦时会触发 focus 和 bulr 事件,当确定选值时会触发 change 事件

\n", + "link": "time-picker/event-blur", + "component": " TimePicker 时间选择器", + "findIntroStr": "用于设置/选择日期,包括年月/年月日/年月日时分/年月日时分秒日期格式。", + "demoId": "event-blur" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/time-select.json b/examples/docs/resources/pc/demo-config/zh-CN/time-select.json new file mode 100644 index 000000000..2d24f623a --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/time-select.json @@ -0,0 +1,130 @@ +[ + { + "title": "基本用法", + "content": "详细用法参考如下示例", + "link": "time-select/basic-usage", + "component": " TimeSelect 时间选择器", + "findIntroStr": "时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。", + "demoId": "basic-usage" + }, + { + "title": "固定时间范围", + "content": "详细用法参考如下示例", + "link": "time-select/range-placeholder", + "component": " TimeSelect 时间选择器", + "findIntroStr": "时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。", + "demoId": "range-placeholder" + }, + { + "title": "选择器打开时默认时间设置", + "content": "

通过 default-value 设置选择器打开显示默认时间

\n", + "link": "time-select/default-value", + "component": " TimeSelect 时间选择器", + "findIntroStr": "时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。", + "demoId": "default-value" + }, + { + "title": "指定时间点", + "content": "

picker-options 设置时间点

\n", + "link": "time-select/picker-options", + "component": " TimeSelect 时间选择器", + "findIntroStr": "时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。", + "demoId": "picker-options" + }, + { + "title": "后置图标", + "content": "

通过 suffix-icon 属性设置日期输入框后置图标,从 @opentiny/vue-icon 中导入一个图标并进行初始化后传给 suffix-icon

\n", + "link": "time-select/suffix-icon", + "component": " TimeSelect 时间选择器", + "findIntroStr": "时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。", + "demoId": "suffix-icon" + }, + { + "title": "自定义清空图标", + "content": "

通过 clear-icon 自定义清空图标

\n", + "link": "time-select/clear-icon", + "component": " TimeSelect 时间选择器", + "findIntroStr": "时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。", + "demoId": "clear-icon" + }, + { + "title": "显示清除按钮", + "content": "详细用法参考如下示例", + "link": "time-select/clear-icon", + "component": " TimeSelect 时间选择器", + "findIntroStr": "时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。", + "demoId": "clearable" + }, + { + "title": "原生属性", + "content": "详细用法参考如下示例", + "link": "time-select/clear-icon", + "component": " TimeSelect 时间选择器", + "findIntroStr": "时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。", + "demoId": "name" + }, + { + "title": "事件", + "content": "

focus input 框聚焦时触发,blur input 框失焦时触发

\n", + "link": "time-select/event-blur", + "component": " TimeSelect 时间选择器", + "findIntroStr": "时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。", + "demoId": "event-blur" + }, + { + "title": "文本框不可编辑", + "content": "

日期输入框默认可以输入日期,设置 editable 为 false 后,将不能输入。

\n", + "link": "time-select/editable", + "component": " TimeSelect 时间选择器", + "findIntroStr": "时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。", + "demoId": "editable" + }, + { + "title": "禁用", + "content": "详细用法参考如下示例", + "link": "time-select/disabled", + "component": " TimeSelect 时间选择器", + "findIntroStr": "时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。", + "demoId": "disabled" + }, + { + "title": "自定义类名", + "content": "详细用法参考如下示例", + "link": "time-select/popper-class", + "component": " TimeSelect 时间选择器", + "findIntroStr": "时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。", + "demoId": "popper-class" + }, + { + "title": "mini 尺寸", + "content": "详细用法参考如下示例", + "link": "time-select/size-mini", + "component": " TimeSelect 时间选择器", + "findIntroStr": "时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。", + "demoId": "size-mini" + }, + { + "title": "small 尺寸", + "content": "详细用法参考如下示例", + "link": "time-select/size-small", + "component": " TimeSelect 时间选择器", + "findIntroStr": "时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。", + "demoId": "size-small" + }, + { + "title": "medium 尺寸", + "content": "详细用法参考如下示例", + "link": "time-select/size-medium", + "component": " TimeSelect 时间选择器", + "findIntroStr": "时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。", + "demoId": "size-medium" + }, + { + "title": "手动获取焦点", + "content": "详细用法参考如下示例", + "link": "time-select/focus", + "component": " TimeSelect 时间选择器", + "findIntroStr": "时间选值框是下拉框的特例,按时分格式(不支持自定义格式)展示下拉列表以供用户选择,并能扩展下拉框部分参数。", + "demoId": "focus" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/toggle-menu.json b/examples/docs/resources/pc/demo-config/zh-CN/toggle-menu.json new file mode 100644 index 000000000..d8a9e50e4 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/toggle-menu.json @@ -0,0 +1,130 @@ +[ + { + "title": "基本用法", + "content": "详细用法参考如下示例", + "link": "toggle-menu/basic-usage", + "component": " ToggleMenu 收缩菜单", + "findIntroStr": "以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。", + "demoId": "basic-usage" + }, + { + "title": "自定义菜单左侧图标", + "content": "

可通过 icon 属性自定义菜单左侧图标。

\n", + "link": "toggle-menu/custom-icon", + "component": " ToggleMenu 收缩菜单", + "findIntroStr": "以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。", + "demoId": "custom-icon" + }, + { + "title": "自定义菜单数据", + "content": "

可通过 get-menu-data-sync 自定义菜单数据服务。(deprecated v3.4.0废弃, v3.16.0移除;移除原因:如果是同步数据则和:data功能重复)

\n", + "link": "toggle-menu/get-menu-data-sync", + "component": " ToggleMenu 收缩菜单", + "findIntroStr": "以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。", + "demoId": "get-menu-data-sync" + }, + { + "title": "自定义菜单异步数据服务", + "content": "

可通过 get-menu-data-async 自定义菜单异步数据服务。

\n", + "link": "toggle-menu/get-menu-data-async", + "component": " ToggleMenu 收缩菜单", + "findIntroStr": "以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。", + "demoId": "get-menu-data-async" + }, + { + "title": "props 选项映射", + "content": "

可通过 props 配置选项映射字段该属性的默认值为 {children: 'children',label: 'label',disabled: 'disabled'} 。

\n", + "link": "toggle-menu/toggle-props", + "component": " ToggleMenu 收缩菜单", + "findIntroStr": "以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。", + "demoId": "toggle-props" + }, + { + "title": "自定义节点内容", + "content": "

通过 node 插槽自定义节点内容。

\n", + "link": "toggle-menu/slot-node", + "component": " ToggleMenu 收缩菜单", + "findIntroStr": "以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。", + "demoId": "slot-node" + }, + { + "title": "默认展开所有节点", + "content": "

可通过 default-expand-all 属性设置是否默认展开所有节点,通过 expand-on-click-node 属性设置是否可以通过点击节点展开/收起菜单。

\n", + "link": "toggle-menu/default-expand-all", + "component": " ToggleMenu 收缩菜单", + "findIntroStr": "以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。", + "demoId": "default-expand-all" + }, + { + "title": "拖拽节点", + "content": "

可通过 draggable 属性设置是否开启拖拽节点的功能,默认值为 false。\n可通过 ellipsis 属性设置是否开启文本内容超长是省略显示,默认值为 false

\n", + "link": "toggle-menu/draggable", + "component": " ToggleMenu 收缩菜单", + "findIntroStr": "以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。", + "demoId": "draggable" + }, + { + "title": "显示过滤搜索框", + "content": "

可通过 show-filter 属性设置是否展示过滤搜索框,默认为 true,可设置为false不展示过滤搜索框。

\n", + "link": "toggle-menu/show-filter", + "component": " ToggleMenu 收缩菜单", + "findIntroStr": "以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。", + "demoId": "show-filter" + }, + { + "title": "自动过滤", + "content": "

可通过 placeholder 属性设置输入框的占位符。 通过设置 automatic-filteringfalse关闭输入时自动过滤功能,默认值为 true。

\n", + "link": "toggle-menu/automatic-filtering", + "component": " ToggleMenu 收缩菜单", + "findIntroStr": "以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。", + "demoId": "automatic-filtering" + }, + { + "title": "内容超出换行", + "content": "详细用法参考如下示例", + "link": "toggle-menu/show-filter", + "component": " ToggleMenu 收缩菜单", + "findIntroStr": "以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。", + "demoId": "show-filter1" + }, + { + "title": "点击节点事件", + "content": "

node-click 点击节点后触发的事件。

\n", + "link": "toggle-menu/node-click", + "component": " ToggleMenu 收缩菜单", + "findIntroStr": "以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。", + "demoId": "node-click" + }, + { + "title": "展开节点事件", + "content": "

node-expand 展开节点后触发的事件。

\n", + "link": "toggle-menu/node-expand", + "component": " ToggleMenu 收缩菜单", + "findIntroStr": "以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。", + "demoId": "node-expand" + }, + { + "title": "收缩节点事件", + "content": "

node-collapse 收缩节点后触发的事件。

\n", + "link": "toggle-menu/node-collapse", + "component": " ToggleMenu 收缩菜单", + "findIntroStr": "以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。", + "demoId": "node-collapse" + }, + { + "title": "拖放节点事件", + "content": "

node-drop 拖放节点后触发的事件,需要设置 draggable 属性为 true

\n", + "link": "toggle-menu/node-drop", + "component": " ToggleMenu 收缩菜单", + "findIntroStr": "以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。", + "demoId": "node-drop" + }, + { + "title": "拖拽事件", + "content": "

node-drag-start 拖拽节点后的事件,node-drag-enter 拖拽进入其他节点时触发的事件,node-drag-over 在拖拽节点时触发的事件,node-drag-leave 拖拽离开某个节点时触发的事件,node-drag-end 拖拽结束时触发的事件。

\n", + "link": "toggle-menu/drag-events", + "component": " ToggleMenu 收缩菜单", + "findIntroStr": "以树形方式显示、适用于版型定制的一种组件,菜单可收缩,收缩后只显示图标,点击图标展示子节点菜单。", + "demoId": "drag-events" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/tooltip.json b/examples/docs/resources/pc/demo-config/zh-CN/tooltip.json new file mode 100644 index 000000000..7adf806c6 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/tooltip.json @@ -0,0 +1,122 @@ +[ + { + "title": "基本用法", + "content": "详细用法参考如下示例", + "link": "tooltip/basic-usage", + "component": " ToolTip 文字提示", + "findIntroStr": "动态显示提示信息,一般通过鼠标事件进行响应。", + "demoId": "basic-usage" + }, + { + "title": "自定义渐变动画", + "content": "

通过 transition 定义渐变动画,默认选值为 tiny-fade-in-linear

\n", + "link": "tooltip/custom-transition", + "component": " ToolTip 文字提示", + "findIntroStr": "动态显示提示信息,一般通过鼠标事件进行响应。", + "demoId": "custom-transition" + }, + { + "title": "禁用", + "content": "

通过 diabled 设置禁用

\n", + "link": "tooltip/dynamic-disable", + "component": " ToolTip 文字提示", + "findIntroStr": "动态显示提示信息,一般通过鼠标事件进行响应。", + "demoId": "dynamic-disable" + }, + { + "title": "手动控制", + "content": "

手动控制模式,通过设置 manual 属性为 true 后,mouseenter 和 mouseleave 事件将不会生效,然后可以通过设置 v-model 动态控制显示和隐藏

\n", + "link": "tooltip/manual-control-tip", + "component": " ToolTip 文字提示", + "findIntroStr": "动态显示提示信息,一般通过鼠标事件进行响应。", + "demoId": "manual-control-tip" + }, + { + "title": "智能出现控制", + "content": "

提示的智能出现的模式,设置为 auto 时,tooltip只有在文本超长时,才显示出来。

\n", + "link": "tooltip/visible-show", + "component": " ToolTip 文字提示", + "findIntroStr": "动态显示提示信息,一般通过鼠标事件进行响应。", + "demoId": "visible-show" + }, + { + "title": "主题", + "content": "

通过 effect 属性设置主题,可选值 dark/light 两种主题,默认值为 dark

\n", + "link": "tooltip/tooltip-theme", + "component": " ToolTip 文字提示", + "findIntroStr": "动态显示提示信息,一般通过鼠标事件进行响应。", + "demoId": "tooltip-theme" + }, + { + "title": "自动隐藏和延迟时间", + "content": "

通过 hide-after 属性设置 Tooltip 组件出现后自动隐藏延时,单位毫秒,为 0 则不会自动隐藏。通过 open-delay 属性设置 Tooltip 组件延迟出现的时间,单位毫秒。

\n", + "link": "tooltip/open-delay", + "component": " ToolTip 文字提示", + "findIntroStr": "动态显示提示信息,一般通过鼠标事件进行响应。", + "demoId": "open-delay" + }, + { + "title": "偏移量", + "content": "

通过 offset 属性设置 Tooltip 组件出现位置的偏移量。

\n", + "link": "tooltip/tooltip-offset", + "component": " ToolTip 文字提示", + "findIntroStr": "动态显示提示信息,一般通过鼠标事件进行响应。", + "demoId": "tooltip-offset" + }, + { + "title": "鼠标是否可进入", + "content": "

通过 enterable 属性设置鼠标是否可进入到 tooltip 中。

\n", + "link": "tooltip/enterable", + "component": " ToolTip 文字提示", + "findIntroStr": "动态显示提示信息,一般通过鼠标事件进行响应。", + "demoId": "enterable" + }, + { + "title": "是否显示箭头", + "content": "

通过 visible-arrow 属性设置是否显示 Tooltip 箭头。

\n", + "link": "tooltip/visible-arrow", + "component": " ToolTip 文字提示", + "findIntroStr": "动态显示提示信息,一般通过鼠标事件进行响应。", + "demoId": "visible-arrow" + }, + { + "title": "添加样式类名", + "content": "

通过 popper-class 属性为 Tooltip 的 popper 添加类名。

\n", + "link": "tooltip/popper-class", + "component": " ToolTip 文字提示", + "findIntroStr": "动态显示提示信息,一般通过鼠标事件进行响应。", + "demoId": "popper-class" + }, + { + "title": "自定义渲染函数", + "content": "

通过 renderContent 自定义渲染函数,返回需要渲染的节点内容 arg1:Vue的渲染函数h arg2:传递给组件的content文本。

\n", + "link": "tooltip/tooltip-render-content", + "component": " ToolTip 文字提示", + "findIntroStr": "动态显示提示信息,一般通过鼠标事件进行响应。", + "demoId": "tooltip-render-content" + }, + { + "title": "插槽", + "content": "

通过 content 插槽添加自定义内容。

\n", + "link": "tooltip/tooltip-content", + "component": " ToolTip 文字提示", + "findIntroStr": "动态显示提示信息,一般通过鼠标事件进行响应。", + "demoId": "tooltip-content" + }, + { + "title": "popper配置", + "content": "

通过 popper-options 属性为 Tooltip 的 popper 配置参数,具体可参考popper.js

\n", + "link": "tooltip/popper-options", + "component": " ToolTip 文字提示", + "findIntroStr": "动态显示提示信息,一般通过鼠标事件进行响应。", + "demoId": "popper-options" + }, + { + "title": "tabindex 配置", + "content": "

通过配置 tabindex, 配置的属性会自动添加到该组件的触发原上。

\n", + "link": "tooltip/tabindex", + "component": " ToolTip 文字提示", + "findIntroStr": "动态显示提示信息,一般通过鼠标事件进行响应。", + "demoId": "tabindex" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/transfer.json b/examples/docs/resources/pc/demo-config/zh-CN/transfer.json new file mode 100644 index 000000000..46ac34dc6 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/transfer.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

通过 value 属性进行双向绑定,其指定的值为默认选择的值,将展示在右侧列表。\n\ndata 属性提供数据源,其是一个对象数组,对象中默认字段有 key、label、disabled 。

\n","link":"transfer/basic-usage","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"basic-usage"},{"title":"数据源","content":"

可请求服务获取数据,再将数据赋予 data

\n","link":"transfer/data-source","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"data-source"},{"title":"展示全部移动按钮","content":"

可通过 show-all-btn 属性设置展示全部移动按钮。

\n","link":"transfer/show-all-btn","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"show-all-btn"},{"title":"自定义列表标题","content":"

通过 titles 属性可对左右列表的标题进行自定义。

\n","link":"transfer/custom-transfer-titles","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"custom-transfer-titles"},{"title":"自定义按钮文案","content":"

通过 button-texts 属性自定义左右穿梭的按钮文本。

\n","link":"transfer/custom-button-texts","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"custom-button-texts"},{"title":"搜索框占位符","content":"

通过 filter-placeholder 属性自定义搜索框占位符。

\n","link":"transfer/filter-placeholder","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"filter-placeholder"},{"title":"自定义搜索方法","content":"

提供 filter-method 钩子函数,可自定义搜索的方法。

\n","link":"transfer/custom-filter-method","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"custom-filter-method"},{"title":"默认勾选项","content":"

通过 left-default-checkedright-default-checked 属性分别指定左右侧列表默认的勾选数据。

\n","link":"transfer/default-checked","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"default-checked"},{"title":"自定义数据项渲染","content":"

使用 render-content 自定义数据项

\n","link":"transfer/custom-render-content","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"custom-render-content"},{"title":"列表顶部勾选状态文案","content":"

指定 format 属性后,勾选数据时,左右侧列表顶部将展示已勾选数据和所有数据的比值。

\n","link":"transfer/checked-format-text","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"checked-format-text"},{"title":"可搜索","content":"

通过 filterable 属性开启左右侧列表的搜索功能。

\n","link":"transfer/filterable","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"filterable"},{"title":"数据源的字段别名","content":"

当数据对象中的字段和默认不一致时,可通过 props 属性进行映射。

\n","link":"transfer/props-of-data-source","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"props-of-data-source"},{"title":"右侧排序策略","content":"

通过 target-order 属性设置右侧列表元素的排序策略,有 original、push、unshift 三个选项,默认为 original 。

\n

排序策略

\n

若为 original,则保持与数据源相同的顺序\n若为 push,则新加入的元素排在最后\n若为 unshift,则新加入的元素排在最前

\n
\n","link":"transfer/target-order","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"target-order"},{"title":"左右拖拽","content":"

使用拖拽功能时请先安装 sortablejs 插件

\n
\n

通过 drop-config 属性配置 sortablejs 插件进行左右拖拽穿梭。

\n","link":"transfer/drop-config","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"drop-config"},{"title":"穿梭框事件","content":"

主要有 changeleft-check-changeright-check-change 三个事件。

\n

事件说明

\n

change:右侧列表元素变化时触发\nleft-check-change:左侧列表元素被用户选中 / 取消选中时触发\nright-check-change:右侧列表元素被用户选中 / 取消选中时触发

\n
\n","link":"transfer/transfer-events","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"transfer-events"},{"title":"手动清空搜索框","content":"

调用 clearQuery() 方法可清空左右侧列表的搜索框,参数为 left 或者 right 。

\n","link":"transfer/manual-clear-query","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"manual-clear-query"},{"title":"自定义列表底部","content":"

通过 left-footerright-footer 插槽可分别对左右列表底部进行自定义。

\n","link":"transfer/custom-footer","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"custom-footer"},{"title":"面板插槽","content":"

可通过 left-panelright-panel 自定义左、右侧面板内容;通过 button 自定义穿梭按钮

\n","link":"transfer/panel-slot","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"panel-slot"},{"title":"嵌套表格","content":"

render 属性里的 plugin 设置为 Table 时指定穿梭框渲染成表格,具体配置可参考 grid 组件的配置。

\n","link":"transfer/nested-table","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"nested-table"},{"title":"嵌套树","content":"

render 属性里的 plugin 设置为 Tree 时指定穿梭框渲染成树,通过 treeConfig 属性配置树相关的配置(具体配置可参考 tree 组件的配置)。

\n","link":"transfer/nested-tree","component":" Transfer 穿梭框","findIntroStr":"穿梭框,提供表格数据的双向选择。","demoId":"nested-tree"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/tree-menu.json b/examples/docs/resources/pc/demo-config/zh-CN/tree-menu.json new file mode 100644 index 000000000..fa3c83516 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/tree-menu.json @@ -0,0 +1,186 @@ +[ + { + "title": "基本用法", + "content": "

不配置数据时,默认从框架服务读取数据。

\n", + "link": "tree-menu/basic-usage", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "basic-usage" + }, + { + "title": "数据源", + "content": "

通过 data 设置树形菜单的数据。

\n", + "link": "tree-menu/data-resource", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "data-resource" + }, + { + "title": "自定义菜单服务数据", + "content": "

通过 get-menu-data-sync 自定义菜单服务数据,直接返回数据。

\n", + "link": "tree-menu/get-menu-data-sync", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "get-menu-data-sync" + }, + { + "title": "文字超长省略显示", + "content": "

可通过 ellipsis 配置当菜单文字过长时,显示成省略号。通过 prefix-icon 自定义前置图标。

\n", + "link": "tree-menu/text-ellipsis", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "text-ellipsis" + }, + { + "title": "文字超长换行显示", + "content": "

可通过 wrap 配置当菜单文字过长时,换行显示。通过 showTitle 属性配置是否展示 title,默认值为 true。\n可通过 show-filter 配置是否显示搜索过滤框,默认为 true。\n可通过 show-title 配置是否显示 title ,默认为 true。

\n", + "link": "tree-menu/text-wrap", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "text-wrap" + }, + { + "title": "父子级不相关联", + "content": "

通过 check-strictly 设置选择时父子级不相关联,需要与 show-checkbox 同时使用 。

\n", + "link": "tree-menu/check-strictly", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "check-strictly" + }, + { + "title": "默认展开某节点", + "content": "

通过 default-expanded-keys 设置初始化展开某一节点 。

\n", + "link": "tree-menu/default-expanded-keys", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "default-expanded-keys" + }, + { + "title": "懒加载子节点", + "content": "

可通过 lazy 是否懒加载子节点,需与 load 方法结合使用。

\n", + "link": "tree-menu/lazy-load", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "lazy-load" + }, + { + "title": "搜索规则配置", + "content": "

可配置 filter-node-method 进行搜索规则配置,默认为模糊匹配,以下示例是精确配置。

\n", + "link": "tree-menu/filter-node-method", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "filter-node-method" + }, + { + "title": "默认展开全部菜单", + "content": "

可通过属性 default-expand-all 配置默认展开全部菜单。\n通过属性 default-checked-keys 配置默认选中,需要与 show-checkbox, node-key 同时使用。

\n", + "link": "tree-menu/default-expand-all", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "default-expand-all" + }, + { + "title": "自定义空数据文本", + "content": "

可通过属性 empty-text 配置空数据显示文本。

\n", + "link": "tree-menu/empty-text", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "empty-text" + }, + { + "title": "拖动菜单", + "content": "

可通过属性置 draggable 实现菜单拖拽。

\n", + "link": "tree-menu/can-draggable", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "can-draggable" + }, + { + "title": "拖拽菜单回调事件", + "content": "

拖拽菜单回调事件,配合 draggable 使用。

\n", + "link": "tree-menu/event-allow-draggable", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "event-allow-draggable" + }, + { + "title": "节点被展开时触发的事件", + "content": "

节点被展开时触发的事件

\n", + "link": "tree-menu/event-node-expand", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "event-node-expand" + }, + { + "title": "节点被关闭时触发的事件", + "content": "

节点被关闭时触发的事件

\n", + "link": "tree-menu/event-node-collapse", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "event-node-collapse" + }, + { + "title": "节点选中状态发生变化时的回调", + "content": "

节点选中状态发生变化时的回调

\n", + "link": "tree-menu/event-check-change", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "event-check-change" + }, + { + "title": "点击文字展开菜单", + "content": "

可通过属性 expand-on-click-node 配置点击文字即可展开子菜单。

\n", + "link": "tree-menu/expand-on-click-node", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "expand-on-click-node" + }, + { + "title": "水平缩进", + "content": "

可通过属性 indent 控制子级相对于父级菜单的水平缩进距离,单位 px 。

\n", + "link": "tree-menu/tree-menu-indent", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "tree-menu-indent" + }, + { + "title": "手风琴", + "content": "

通过 accordion 设置手风琴效果。

\n", + "link": "tree-menu/accordion", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "accordion" + }, + { + "title": "节点可勾选", + "content": "

可配置 show-checkbox 属性设置节点是否可被勾选。

\n", + "link": "tree-menu/show-checkbox", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "show-checkbox" + }, + { + "title": "自定义搜索图标", + "content": "

可配置 search-icon 属性设置自定义搜索图标

\n", + "link": "tree-menu/search-icon", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "search-icon" + }, + { + "title": "插槽", + "content": "

可通过配置默认作用域插槽来显示菜单内容。

\n", + "link": "tree-menu/tree-menu-slot", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "tree-menu-slot" + }, + { + "title": "事件", + "content": "

current-change 当前选中节点变化时触发的事件。

\n", + "link": "tree-menu/event-current-change", + "component": " TreeMenu 树型菜单", + "findIntroStr": "以树形方式显示的菜单,适用于版型定制的一种组件。", + "demoId": "event-current-change" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/tree.json b/examples/docs/resources/pc/demo-config/zh-CN/tree.json new file mode 100644 index 000000000..3bd467ed0 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/tree.json @@ -0,0 +1,266 @@ +[ + { + "title": "基本用法", + "content": "详细用法参考如下示例", + "link": "tree/basic-usage", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "basic-usage" + }, + { + "title": "数据源", + "content": "

通过配置 data 属性来设置数据源,可配置静态数据源和动态数据源。

\n", + "link": "tree/data-source", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "data-source" + }, + { + "title": "禁用状态", + "content": "

数据源里面带 disabled: true 渲染时自动禁用。

\n", + "link": "tree/disable-node", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "disable-node" + }, + { + "title": "自定义空数据文本", + "content": "

配置 template #empty 设置自定义空数据文本。

\n", + "link": "tree/custom-empty-text", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "custom-empty-text" + }, + { + "title": "展开后渲染", + "content": "

配置 render-after-expand 属性设置是否展开后渲染数据,默认为 true

\n", + "link": "tree/render-after-expand", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "render-after-expand" + }, + { + "title": "唯一标识", + "content": "

通过 node-key 属性设置唯一标识。

\n

设置选中节点,获取选中节点,新增节点,删除节点等操作,需要设置节点的唯一标识属性

", + "link": "tree/node-key", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "node-key" + }, + { + "title": "父子不互相关联", + "content": "

通过 check-strictly 属性设置父子层级勾选不关联。

\n", + "link": "tree/check-strictly", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "check-strictly" + }, + { + "title": "默认展开所有节点", + "content": "

通过 default-expand-all 属性设置默认展开所有节点。

\n", + "link": "tree/default-expand-all", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "default-expand-all" + }, + { + "title": "点击节点展开收缩", + "content": "

通过 expand-on-click-node 属性设置点击节点内容时可展开/收起节点。

\n", + "link": "tree/expand-on-click-node", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "expand-on-click-node" + }, + { + "title": "点击节点时选中", + "content": "

通过 check-on-click-node 属性设置点击节点内容同时可以勾选数据/去勾选数据。\n通过 icon-trigger-click-node 属性控制点击图标是否触发 node-click 事件,默认为 true。

\n", + "link": "tree/check-on-click-node", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "check-on-click-node" + }, + { + "title": "自动展开父节点", + "content": "

通过 auto-expand-parent 属性是否展示父节点,默认为 true

\n", + "link": "tree/auto-expand-parent", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "auto-expand-parent" + }, + { + "title": "默认勾选的节点", + "content": "

通过 default-checked-keys 属性设置默认勾选数据。

\n", + "link": "tree/default-checked-keys", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "default-checked-keys" + }, + { + "title": "默认展开指定节点", + "content": "

通过 default-expanded-keys 属性设置默认展开的节点。

\n", + "link": "tree/default-expanded-keys", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "default-expanded-keys" + }, + { + "title": "当前选中节点标志", + "content": "

通过 current-node-key 设置当前选中节点标志,要配合 node-key="id" 使用。

\n", + "link": "tree/current-node-key", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "current-node-key" + }, + { + "title": "默认插槽", + "content": "

通过 default 插槽,可自定义树节点的内容,参数为 { node, data }。

\n", + "link": "tree/slot-deffault", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "slot-deffault" + }, + { + "title": "自定义内容区渲染", + "content": "

通过 render-content 属性设置自定义内容。

\n", + "link": "tree/render-content", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "render-content" + }, + { + "title": "是否开启多选模式", + "content": "

通过 show-checkbox 属性设置节点是否可被选择,默认为 false

\n", + "link": "tree/show-checkbox", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "show-checkbox" + }, + { + "title": "可拖拽节点", + "content": "

通过 draggable 属性设置节点是否可拖拽。

\n", + "link": "tree/node-draggable", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "node-draggable" + }, + { + "title": "自定义节点能否被拖拽", + "content": "

通过 allow-drag 钩子函数判断节点能否被拖拽,返回值为 false 时,节点不能拖拽。

\n", + "link": "tree/allow-drag", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "allow-drag" + }, + { + "title": "自定义目标节点能否被放置", + "content": "

通过 allow-drop 属性设置拖拽时判断目标节点能否被放置。type 参数有三种情况:'prev'、'inner' 和 'next',分别表示放置在目标节点前、插入至目标节点和放置在目标节点后。

\n", + "link": "tree/allow-drop", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "allow-drop" + }, + { + "title": "数据节点属性配置", + "content": "

通过 props 属性设置数据节点属性的配置,该属性的默认值为 {children: 'children',label: 'label',disabled: 'disabled'}

\n", + "link": "tree/node-props-config", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "node-props-config" + }, + { + "title": "懒加载子节点", + "content": "

通过 lazy 属性设置是否懒加载子节点,需与 load 方法结合使用。默认值为 false

\n", + "link": "tree/lazy-load-node", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "lazy-load-node" + }, + { + "title": "高亮当前选择节点", + "content": "

通过 highlight-current 属性设置高亮当前选择的节点。

\n", + "link": "tree/highlight-current", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "highlight-current" + }, + { + "title": "节点过滤", + "content": "

通过 filter-node-method 属性设置节点过滤的方法。

\n", + "link": "tree/filter-node", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "filter-node" + }, + { + "title": "手风琴模式", + "content": "

通过 accordion 属性设置是否每次只打开一个同级树节点展开(手风琴模式),默认值为 false

\n", + "link": "tree/accordion-mode", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "accordion-mode" + }, + { + "title": "水平缩进", + "content": "

通过 indent 属性控制水平缩进距离,单位 px,默认值为 18px

\n", + "link": "tree/indent", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "indent" + }, + { + "title": "自定义展开折叠图标", + "content": "

通过 icon 属性设置树节点展开折叠图标,从 @opentiny/vue-icon 中导入一个图标并进行初始化后传给 icon 属性。

\n", + "link": "tree/custom-node-icon", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "custom-node-icon" + }, + { + "title": "展开折叠图标分别设置", + "content": "

通过 expandIcon 属性设置展开的图标,通过 shrinkIcon 属性设置折叠的图标。

\n", + "link": "tree/set-tree-icon", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "set-tree-icon" + }, + { + "title": "可自定义右键菜单内容", + "content": "

通过 show-contextmenu 属性设置是否开启弹窗右键菜单,调用实例的 closeMenu 方法可以关闭自定义菜单。

\n", + "link": "tree/contextmenu", + "component": " Tree 树形控件", + "findIntroStr": "右键点击节点弹出自定义菜单", + "demoId": "contextmenu" + }, + { + "title": "拖拽节点事件", + "content": "详细用法参考如下示例", + "link": "tree/drag-events", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "drag-events" + }, + { + "title": "勾选节点事件", + "content": "详细用法参考如下示例", + "link": "tree/node-events", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "node-events" + }, + { + "title": "鼠标右键点击节点事件", + "content": "详细用法参考如下示例", + "link": "tree/node-contextmenu", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "node-contextmenu" + }, + { + "title": "单选", + "content": "

通过 show-radio 属性设置树节点的单选特性,默认为 false,与 show-checkbox 属性互斥,不能同时设置为 true

\n", + "link": "tree/single-select-radio", + "component": " Tree 树形控件", + "findIntroStr": "可进行展示有父子层级的数据,支持选择,异步加载等功能。但不推荐用它来展示菜单,展示菜单推荐使用树菜单。", + "demoId": "single-select-radio" + } +] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/user-account.json b/examples/docs/resources/pc/demo-config/zh-CN/user-account.json new file mode 100644 index 000000000..db10f5414 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/user-account.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"user-account/basic-usage","component":" UserAccount 用户账号","findIntroStr":"用户账号组件,用于显示用户账号、注销及自定义功能。","demoId":"basic-usage"},{"title":"自定义服务","content":"

设置自定义服务

\n","link":"user-account/custom-service","component":" UserAccount 用户账号","findIntroStr":"用户账号组件,用于显示用户账号、注销及自定义功能。","demoId":"custom-service"},{"title":"自定义功能","content":"

通过默认插槽自定义功能

\n","link":"user-account/custom-operation","component":" UserAccount 用户账号","findIntroStr":"用户账号组件,用于显示用户账号、注销及自定义功能。","demoId":"custom-operation"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/user-contact.json b/examples/docs/resources/pc/demo-config/zh-CN/user-contact.json new file mode 100644 index 000000000..c1f38d017 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/user-contact.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"user-contact/basic-usage","component":" UserContact 联系人","findIntroStr":"UserContact 联系人组件,展现用户账号和基本联系方式,包括用户描述、头像、姓名三种元素,任意组合。","demoId":"basic-usage"},{"title":"设置数据源","content":"

可通过 data 设置数据源, imgUrl 表示的是图片路径, userName 表示的是姓名, userDescription 表示的是用户描述。

\n","link":"user-contact/data-source","component":" UserContact 联系人","findIntroStr":"UserContact 联系人组件,展现用户账号和基本联系方式,包括用户描述、头像、姓名三种元素,任意组合。","demoId":"data-source"},{"title":"定制弹框不显示的内容","content":"

定制弹框不显示的内容\nshow-img 是否显示头像,值为 true 时显示, false 隐藏,默认 true。\nshow-name 是否显示名字,值为 true 时显示, false 隐藏,默认 true。\nshow-description 是否显示用户描述,值为 true 时显示, false 隐藏,默认 true。

\n","link":"user-contact/not-displayed-content","component":" UserContact 联系人","findIntroStr":"UserContact 联系人组件,展现用户账号和基本联系方式,包括用户描述、头像、姓名三种元素,任意组合。","demoId":"not-displayed-content"},{"title":"自定义默认插槽","content":"详细用法参考如下示例","link":"user-contact/slots-usercontact","component":" UserContact 联系人","findIntroStr":"UserContact 联系人组件,展现用户账号和基本联系方式,包括用户描述、头像、姓名三种元素,任意组合。","demoId":"slots-usercontact"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/user-head.json b/examples/docs/resources/pc/demo-config/zh-CN/user-head.json new file mode 100644 index 000000000..6cd42481b --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/user-head.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"详细用法参考如下示例","link":"user-head/basic-usage","component":" UserHead 用户头像","findIntroStr":"UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。","demoId":"basic-usage"},{"title":"小头像","content":"

可通过 min 设置小头像。

\n","link":"user-head/min-user-head","component":" UserHead 用户头像","findIntroStr":"UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。","demoId":"min-user-head"},{"title":"圆形头像","content":"

可通过 round 设置圆形头像。

\n","link":"user-head/round-user-head","component":" UserHead 用户头像","findIntroStr":"UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。","demoId":"round-user-head"},{"title":"文字头像","content":"

可通过 type="label" 设置文字头像。

\n","link":"user-head/label-user-head","component":" UserHead 用户头像","findIntroStr":"UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。","demoId":"label-user-head"},{"title":"图标头像","content":"

可通过 type="icon" 设置图标头像。

\n","link":"user-head/icon-user-head","component":" UserHead 用户头像","findIntroStr":"UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。","demoId":"icon-user-head"},{"title":"图片头像","content":"

可通过 type="image" 设置图片头像。

\n","link":"user-head/image-user-head","component":" UserHead 用户头像","findIntroStr":"UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。","demoId":"image-user-head"},{"title":"头像消息计数","content":"详细用法参考如下示例","link":"user-head/message-count-total","component":" UserHead 用户头像","findIntroStr":"UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。","demoId":"message-count-total"},{"title":"使用小红点代替具体数值","content":"详细用法参考如下示例","link":"user-head/message-count-type","component":" UserHead 用户头像","findIntroStr":"UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。","demoId":"message-count-type"},{"title":"消息计数上限","content":"详细用法参考如下示例","link":"user-head/message-count-limit","component":" UserHead 用户头像","findIntroStr":"UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。","demoId":"message-count-limit"},{"title":"自定义颜色","content":"

可通过 color 自定义颜色,图标或文字类型(type属性值为 icon 或 label )的情况下,设置字体颜色和背景色。

\n","link":"user-head/color","component":" UserHead 用户头像","findIntroStr":"UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。","demoId":"color"},{"title":"自定义背景颜色","content":"

可通过 background-color 自定义背景颜色。

\n","link":"user-head/custom-background-color","component":" UserHead 用户头像","findIntroStr":"UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。","demoId":"custom-background-color"},{"title":"自定义图像内容","content":"

通过插槽自定义图像内容。

\n","link":"user-head/custom-user-head-content","component":" UserHead 用户头像","findIntroStr":"UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。","demoId":"custom-user-head-content"},{"title":"Grid 单元格展示头像","content":"详细用法参考如下示例","link":"user-head/render-user-head-in-grid","component":" UserHead 用户头像","findIntroStr":"UserHead 用户头像组件,用来代表用户或事物,支持图片、图标或字符展示。","demoId":"render-user-head-in-grid"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/user-link.json b/examples/docs/resources/pc/demo-config/zh-CN/user-link.json new file mode 100644 index 000000000..7a6bf768c --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/user-link.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

注意 UserLink 组件请求的是 mock 数据,其他用户查询不了,开发时请用真实服务。

\n","link":"user-link/basic-usage","component":" UserLink 用户信息链接","findIntroStr":"用户信息链接组件,可显示用户详细信息对话框的特殊链接。","demoId":"basic-usage"},{"title":"显示字段映射","content":"

通过 text-field 设置显示字段信息,默认是 userCN\n注意 UserLink 组件请求的是 mock 数据,其他用户查询不了,开发时请用真实服务。

\n","link":"user-link/text-field","component":" UserLink 用户信息链接","findIntroStr":"用户信息链接组件,可显示用户详细信息对话框的特殊链接。","demoId":"text-field"},{"title":"自定义文本分隔符","content":"

通过 text-split 自定义文本分隔符,默认是 ','\n注意 UserLink 组件请求的是 mock 数据,其他用户查询不了,开发时请用真实服务。

\n","link":"user-link/text-split","component":" UserLink 用户信息链接","findIntroStr":"用户信息链接组件,可显示用户详细信息对话框的特殊链接。","demoId":"text-split"},{"title":"值字段映射","content":"

通过 value-field 设置值字段映射,默认是 userId\n注意 UserLink 组件请求的是 mock 数据,其他用户查询不了,开发时请用真实服务。

\n","link":"user-link/value-field","component":" UserLink 用户信息链接","findIntroStr":"用户信息链接组件,可显示用户详细信息对话框的特殊链接。","demoId":"value-field"},{"title":"自定义值分隔符","content":"

通过 value-split 自定义值分隔符,默认是 ','\n注意 UserLink 组件请求的是 mock 数据,其他用户查询不了,开发时请用真实服务。

\n","link":"user-link/value-split","component":" UserLink 用户信息链接","findIntroStr":"用户信息链接组件,可显示用户详细信息对话框的特殊链接。","demoId":"value-split"},{"title":"自定义服务","content":"

注意 UserLink 组件请求的是 mock 数据,其他用户查询不了,开发时请用真实服务。

\n","link":"user-link/custom-service","component":" UserLink 用户信息链接","findIntroStr":"用户信息链接组件,可显示用户详细信息对话框的特殊链接。","demoId":"custom-service"},{"title":"基本用法","content":"

注意 UserLink 组件请求的是 mock 数据,其他用户查询不了,开发时请用真实服务。

\n","link":"user-link/cache-users","component":" UserLink 用户信息链接","findIntroStr":"用户信息链接组件,可显示用户详细信息对话框的特殊链接。","demoId":"cache-users"},{"title":"自定义默认值","content":"

通过 value 自定义默认值,默认为空注意 value 值与 v-model 不能同时使用,同时使用时 v-model 权重更高

\n","link":"user-link/value","component":" UserLink 用户信息链接","findIntroStr":"用户信息链接组件,可显示用户详细信息对话框的特殊链接。","demoId":"value"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/user.json b/examples/docs/resources/pc/demo-config/zh-CN/user.json new file mode 100644 index 000000000..651df3557 --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/user.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

注意 User 组件请求的是 mock 数据,其他用户查询不了,开发时请用真实服务。

\n","link":"user/basic-usage","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"basic-usage"},{"title":"多用户","content":"

设置 multiple 属性即可启用多用户形式。

\n","link":"user/multiple-users","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"multiple-users"},{"title":"折叠 Tag","content":"

设置 multiple 属性即可启用多用户形式。\n通过 collapse-tags 配置多用户模式下是否展示折叠标签,默认为 false。

\n","link":"user/multiple-users-tag","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"multiple-users-tag"},{"title":"user选择器选项可复制","content":"

通过 tag-selectable 输入框中已选择的选项可通过鼠标选择,然后按 Ctrl + C 或右键进行复制。

\n","link":"user/tag-copy","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"tag-copy"},{"title":"user选择器选项可复制","content":"

设置 copyable 属性后,可以复制所有的 tag 文本内容以逗号分隔

\n","link":"user/tag-copy-all","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"tag-copy-all"},{"title":"禁用状态","content":"

设置 disabled 属性可禁用 User 组件。

\n","link":"user/dynamic-disable","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"dynamic-disable"},{"title":"超出提示","content":"

设置 collapse-show-overflow-tooltip 此属性必须设置缓存 cachetrue 时才会生效。

\n","link":"user/collapse-show-overflow-tooltip","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"collapse-show-overflow-tooltip"},{"title":"值分隔符","content":"

通过 value-split 属性可指定多用户下获取到的 value 值中不同用户之间的分隔符,默认为 ,。\n通过 text-split 属性可指定多用户模式下输入匹配的文本分隔符,默认为 , ,可选值为 !~%(=+^{/}).!]<->[\\,:*#;

\n","link":"user/value-split","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"value-split"},{"title":"取值字段映射","content":"

通过 value-field 属性可指定获取到的 value 值的形式,默认为 userId,还包括 userAccount。

\n","link":"user/value-field","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"value-field"},{"title":"显示字段映射","content":"

通过 text-field 属性可指定显示用户的哪个字段信息。

\n","link":"user/text-field","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"text-field"},{"title":"缓存用户","content":"

通过 cache 属性指定用户数据是否缓存,默认为缓存。\n\ncache-key 属性可以自定义缓存的 key 值,默认为 tiny-user 。\n\ncache-fields 属性用于指定缓存哪些用户数据。

\n","link":"user/cache-users","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"cache-users"},{"title":"延时加载","content":"

通过 delay 属性指定延时加载的时间,单位是毫秒。

\n","link":"user/delay-load","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"delay-load"},{"title":"输入完指定长度后加载","content":"

通过 suggest-length 属性可指定输入多少个字符后开始请求服务。

\n","link":"user/load-after-input-the-length","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"load-after-input-the-length"},{"title":"值改变事件","content":"

通过 change 事件能获取用户类型。

\n","link":"user/event-change","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"event-change"},{"title":"用户查询错误提示","content":"

通过 error 事件能获取查询失败的输入。

\n","link":"user/event-error","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"event-error"},{"title":"自定义选项文本","content":"

通过 options 插槽设置自定义下拉选项文本。

\n","link":"user/user-options","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"user-options"},{"title":"自定义服务","content":"

通过 service 属性可自定义用户服务,当用户在文本框中输入准确的账号时,会在下拉菜单中出现此用户。\n通过 sort-by-fetch-data 联想时下拉框的数据顺序和接口返回的数据顺序一致

\n","link":"user/custom-service","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"custom-service"},{"title":"自定义排序","content":"

通过 sortable 属性引用 sortablejs 进行排序。

\n","link":"user/custom-sort","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"custom-sort"},{"title":"尺寸设置","content":"

通过 size 属性可指定用户输入框的尺寸,包括 medium、small、mini 三个选项。

\n","link":"user/user-select-size","component":" User 用户","findIntroStr":"通过 Select 选择器组件实现对用户的查询,包括 单用户 和 多用户 两种形式。","demoId":"user-select-size"}] diff --git a/examples/docs/resources/pc/demo-config/zh-CN/wizard.json b/examples/docs/resources/pc/demo-config/zh-CN/wizard.json new file mode 100644 index 000000000..4ab29c5fc --- /dev/null +++ b/examples/docs/resources/pc/demo-config/zh-CN/wizard.json @@ -0,0 +1 @@ +[{"title":"基本用法","content":"

通过 base-flow 属性设置基本流程图模式,以节点图示的方式,显示流程节点及节点间关系,节点的信息只有节点名称和状态。

\n","link":"wizard/base-flow","component":" Wizard 流程图","findIntroStr":"以特定的图形符号加上说明,表示各流程节点关系的组件。","demoId":"base-flow"},{"title":"页向导流程图","content":"

通过 page-guide 属性设置页向导流程图模式,用于导航当前页面与上一页面、下一页面的前后关系,包括流程图区域、页面展示区域、功能按钮区域。

\n","link":"wizard/page-guide","component":" Wizard 流程图","findIntroStr":"以特定的图形符号加上说明,表示各流程节点关系的组件。","demoId":"page-guide"},{"title":"垂直流程图","content":"

通过 vertical 属性设置垂直流程图模式,以节点图示的方式竖向显示流程节点及节点间关系,节点的信息包含节点名称、状态、完成时间、用户。

\n","link":"wizard/vertical","component":" Wizard 流程图","findIntroStr":"以特定的图形符号加上说明,表示各流程节点关系的组件。","demoId":"vertical"},{"title":"时间线流程图","content":"

通过 time-line-flow 属性设置时间线流程图,通过 time-icon 属性自定义时间图标。以时间点的方式竖向显示流程节点处理信息,包括节点名称、状态、完成时间、用户。

\n","link":"wizard/time-line-flow","component":" Wizard 流程图","findIntroStr":"以特定的图形符号加上说明,表示各流程节点关系的组件。","demoId":"time-line-flow"},{"title":"步骤插槽","content":"

页向导流程图里通过 stepbutton 插槽可以自定义步骤按钮或内容。

\n","link":"wizard/slot-step-button","component":" Wizard 流程图","findIntroStr":"以特定的图形符号加上说明,表示各流程节点关系的组件。","demoId":"slot-step-button"},{"title":"基本插槽","content":"

通过 base 配置基本内容。

\n","link":"wizard/slot-base","component":" Wizard 流程图","findIntroStr":"以特定的图形符号加上说明,表示各流程节点关系的组件。","demoId":"slot-base"}] diff --git a/examples/docs/resources/pc/demo/action-menu/basic-usage.vue b/examples/docs/resources/pc/demo/action-menu/basic-usage.vue new file mode 100644 index 000000000..4a00382ba --- /dev/null +++ b/examples/docs/resources/pc/demo/action-menu/basic-usage.vue @@ -0,0 +1,35 @@ + + + diff --git a/examples/docs/resources/pc/demo/action-menu/disabled.vue b/examples/docs/resources/pc/demo/action-menu/disabled.vue new file mode 100644 index 000000000..2af19072c --- /dev/null +++ b/examples/docs/resources/pc/demo/action-menu/disabled.vue @@ -0,0 +1,39 @@ + + + diff --git a/example/src/demo/pc/action-menu/item-click.vue b/examples/docs/resources/pc/demo/action-menu/item-click.vue similarity index 97% rename from example/src/demo/pc/action-menu/item-click.vue rename to examples/docs/resources/pc/demo/action-menu/item-click.vue index a889f1107..bb4747fcc 100644 --- a/example/src/demo/pc/action-menu/item-click.vue +++ b/examples/docs/resources/pc/demo/action-menu/item-click.vue @@ -2,7 +2,7 @@ - + + diff --git a/examples/docs/resources/pc/demo/action-menu/slot-item.vue b/examples/docs/resources/pc/demo/action-menu/slot-item.vue new file mode 100644 index 000000000..1ce4cbd70 --- /dev/null +++ b/examples/docs/resources/pc/demo/action-menu/slot-item.vue @@ -0,0 +1,42 @@ + + + diff --git a/example/src/demo/pc/action-menu/spacing.vue b/examples/docs/resources/pc/demo/action-menu/spacing.vue similarity index 97% rename from example/src/demo/pc/action-menu/spacing.vue rename to examples/docs/resources/pc/demo/action-menu/spacing.vue index a1ee81ef3..85ec24ed9 100644 --- a/example/src/demo/pc/action-menu/spacing.vue +++ b/examples/docs/resources/pc/demo/action-menu/spacing.vue @@ -6,7 +6,7 @@ - diff --git a/example/src/demo/pc/action-menu/visible-change.vue b/examples/docs/resources/pc/demo/action-menu/visible-change.vue similarity index 100% rename from example/src/demo/pc/action-menu/visible-change.vue rename to examples/docs/resources/pc/demo/action-menu/visible-change.vue diff --git a/examples/docs/resources/pc/demo/alert/base.vue b/examples/docs/resources/pc/demo/alert/base.vue new file mode 100644 index 000000000..e53fc9507 --- /dev/null +++ b/examples/docs/resources/pc/demo/alert/base.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/alert/center.vue b/examples/docs/resources/pc/demo/alert/center.vue new file mode 100644 index 000000000..a01e19a41 --- /dev/null +++ b/examples/docs/resources/pc/demo/alert/center.vue @@ -0,0 +1,13 @@ + + + diff --git a/example/src/demo/pc/alert/closable.vue b/examples/docs/resources/pc/demo/alert/closable.vue similarity index 93% rename from example/src/demo/pc/alert/closable.vue rename to examples/docs/resources/pc/demo/alert/closable.vue index e6cf3141b..64b97ba4a 100644 --- a/example/src/demo/pc/alert/closable.vue +++ b/examples/docs/resources/pc/demo/alert/closable.vue @@ -5,7 +5,7 @@ - diff --git a/example/src/demo/pc/alert/show-icon.vue b/examples/docs/resources/pc/demo/alert/show-icon.vue similarity index 94% rename from example/src/demo/pc/alert/show-icon.vue rename to examples/docs/resources/pc/demo/alert/show-icon.vue index e86f0eed3..f89f0d712 100644 --- a/example/src/demo/pc/alert/show-icon.vue +++ b/examples/docs/resources/pc/demo/alert/show-icon.vue @@ -5,7 +5,7 @@ - diff --git a/examples/docs/resources/pc/demo/alert/slot-default.vue b/examples/docs/resources/pc/demo/alert/slot-default.vue new file mode 100644 index 000000000..d318ba0c7 --- /dev/null +++ b/examples/docs/resources/pc/demo/alert/slot-default.vue @@ -0,0 +1,40 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/alert/title.vue b/examples/docs/resources/pc/demo/alert/title.vue new file mode 100644 index 000000000..42e34d4b4 --- /dev/null +++ b/examples/docs/resources/pc/demo/alert/title.vue @@ -0,0 +1,19 @@ + + + diff --git a/examples/docs/resources/pc/demo/alert/type.vue b/examples/docs/resources/pc/demo/alert/type.vue new file mode 100644 index 000000000..45e8e5437 --- /dev/null +++ b/examples/docs/resources/pc/demo/alert/type.vue @@ -0,0 +1,19 @@ + + + diff --git a/example/src/demo/pc/amount/amount-disable.vue b/examples/docs/resources/pc/demo/amount/amount-disable.vue similarity index 96% rename from example/src/demo/pc/amount/amount-disable.vue rename to examples/docs/resources/pc/demo/amount/amount-disable.vue index 6dd2d081e..5a5f18368 100644 --- a/example/src/demo/pc/amount/amount-disable.vue +++ b/examples/docs/resources/pc/demo/amount/amount-disable.vue @@ -5,7 +5,7 @@ - diff --git a/example/src/demo/pc/amount/custom-currency.vue b/examples/docs/resources/pc/demo/amount/custom-currency.vue similarity index 92% rename from example/src/demo/pc/amount/custom-currency.vue rename to examples/docs/resources/pc/demo/amount/custom-currency.vue index 48277dbcd..ae5c30652 100644 --- a/example/src/demo/pc/amount/custom-currency.vue +++ b/examples/docs/resources/pc/demo/amount/custom-currency.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/amount/digits-maxlen.vue b/examples/docs/resources/pc/demo/amount/digits-maxlen.vue similarity index 95% rename from example/src/demo/pc/amount/digits-maxlen.vue rename to examples/docs/resources/pc/demo/amount/digits-maxlen.vue index c608f28a5..d66da887c 100644 --- a/example/src/demo/pc/amount/digits-maxlen.vue +++ b/examples/docs/resources/pc/demo/amount/digits-maxlen.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/anchor/basic-usage.vue b/examples/docs/resources/pc/demo/anchor/basic-usage.vue new file mode 100644 index 000000000..5d24aff01 --- /dev/null +++ b/examples/docs/resources/pc/demo/anchor/basic-usage.vue @@ -0,0 +1,45 @@ + + + diff --git a/examples/docs/resources/pc/demo/anchor/is-affix.vue b/examples/docs/resources/pc/demo/anchor/is-affix.vue new file mode 100644 index 000000000..aa9f584ad --- /dev/null +++ b/examples/docs/resources/pc/demo/anchor/is-affix.vue @@ -0,0 +1,53 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/anchor/on-change.vue b/examples/docs/resources/pc/demo/anchor/on-change.vue new file mode 100644 index 000000000..667524da3 --- /dev/null +++ b/examples/docs/resources/pc/demo/anchor/on-change.vue @@ -0,0 +1,48 @@ + + + diff --git a/examples/docs/resources/pc/demo/anchor/set-container.vue b/examples/docs/resources/pc/demo/anchor/set-container.vue new file mode 100644 index 000000000..8fbf9fa1c --- /dev/null +++ b/examples/docs/resources/pc/demo/anchor/set-container.vue @@ -0,0 +1,97 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/area/area-events.vue b/examples/docs/resources/pc/demo/area/area-events.vue new file mode 100644 index 000000000..7c292cc2b --- /dev/null +++ b/examples/docs/resources/pc/demo/area/area-events.vue @@ -0,0 +1,35 @@ + + + diff --git a/examples/docs/resources/pc/demo/area/basic-usage.vue b/examples/docs/resources/pc/demo/area/basic-usage.vue new file mode 100644 index 000000000..91a81572e --- /dev/null +++ b/examples/docs/resources/pc/demo/area/basic-usage.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/area/custom-service.vue b/examples/docs/resources/pc/demo/area/custom-service.vue new file mode 100644 index 000000000..33da8622c --- /dev/null +++ b/examples/docs/resources/pc/demo/area/custom-service.vue @@ -0,0 +1,157 @@ + + + diff --git a/examples/docs/resources/pc/demo/area/disabled.vue b/examples/docs/resources/pc/demo/area/disabled.vue new file mode 100644 index 000000000..fbca618f8 --- /dev/null +++ b/examples/docs/resources/pc/demo/area/disabled.vue @@ -0,0 +1,28 @@ + + + diff --git a/examples/docs/resources/pc/demo/area/size.vue b/examples/docs/resources/pc/demo/area/size.vue new file mode 100644 index 000000000..03512e42f --- /dev/null +++ b/examples/docs/resources/pc/demo/area/size.vue @@ -0,0 +1,18 @@ + + + diff --git a/example/src/demo/pc/autocomplete/append-prepend.vue b/examples/docs/resources/pc/demo/autocomplete/append-prepend.vue similarity index 98% rename from example/src/demo/pc/autocomplete/append-prepend.vue rename to examples/docs/resources/pc/demo/autocomplete/append-prepend.vue index f6c9af7ce..e72428e86 100644 --- a/example/src/demo/pc/autocomplete/append-prepend.vue +++ b/examples/docs/resources/pc/demo/autocomplete/append-prepend.vue @@ -7,7 +7,7 @@ - + + diff --git a/examples/docs/resources/pc/demo/autocomplete/clearable.vue b/examples/docs/resources/pc/demo/autocomplete/clearable.vue new file mode 100644 index 000000000..03d325622 --- /dev/null +++ b/examples/docs/resources/pc/demo/autocomplete/clearable.vue @@ -0,0 +1,76 @@ + + + + + diff --git a/example/src/demo/pc/autocomplete/cust-template.vue b/examples/docs/resources/pc/demo/autocomplete/cust-template.vue similarity index 98% rename from example/src/demo/pc/autocomplete/cust-template.vue rename to examples/docs/resources/pc/demo/autocomplete/cust-template.vue index a085a452c..6cb5e7a1d 100644 --- a/example/src/demo/pc/autocomplete/cust-template.vue +++ b/examples/docs/resources/pc/demo/autocomplete/cust-template.vue @@ -9,7 +9,7 @@ - + + diff --git a/example/src/demo/pc/autocomplete/debounce.vue b/examples/docs/resources/pc/demo/autocomplete/debounce.vue similarity index 98% rename from example/src/demo/pc/autocomplete/debounce.vue rename to examples/docs/resources/pc/demo/autocomplete/debounce.vue index 040718c0a..729e8f4c8 100644 --- a/example/src/demo/pc/autocomplete/debounce.vue +++ b/examples/docs/resources/pc/demo/autocomplete/debounce.vue @@ -4,7 +4,7 @@ - + + diff --git a/examples/docs/resources/pc/demo/autocomplete/hide-loading.vue b/examples/docs/resources/pc/demo/autocomplete/hide-loading.vue new file mode 100644 index 000000000..262ac93c7 --- /dev/null +++ b/examples/docs/resources/pc/demo/autocomplete/hide-loading.vue @@ -0,0 +1,79 @@ + + + + + diff --git a/example/src/demo/pc/autocomplete/highlight-first-item.vue b/examples/docs/resources/pc/demo/autocomplete/highlight-first-item.vue similarity index 98% rename from example/src/demo/pc/autocomplete/highlight-first-item.vue rename to examples/docs/resources/pc/demo/autocomplete/highlight-first-item.vue index 0bfbabd0b..d1813664c 100644 --- a/example/src/demo/pc/autocomplete/highlight-first-item.vue +++ b/examples/docs/resources/pc/demo/autocomplete/highlight-first-item.vue @@ -4,7 +4,7 @@ - + + diff --git a/example/src/demo/pc/autocomplete/prefix-suffix-slot.vue b/examples/docs/resources/pc/demo/autocomplete/prefix-suffix-slot.vue similarity index 98% rename from example/src/demo/pc/autocomplete/prefix-suffix-slot.vue rename to examples/docs/resources/pc/demo/autocomplete/prefix-suffix-slot.vue index 4f3d23a84..02a6b77e5 100644 --- a/example/src/demo/pc/autocomplete/prefix-suffix-slot.vue +++ b/examples/docs/resources/pc/demo/autocomplete/prefix-suffix-slot.vue @@ -11,7 +11,7 @@ - + + diff --git a/example/src/demo/pc/autocomplete/select-event.vue b/examples/docs/resources/pc/demo/autocomplete/select-event.vue similarity index 98% rename from example/src/demo/pc/autocomplete/select-event.vue rename to examples/docs/resources/pc/demo/autocomplete/select-event.vue index 83f68fed5..01af89e0a 100644 --- a/example/src/demo/pc/autocomplete/select-event.vue +++ b/examples/docs/resources/pc/demo/autocomplete/select-event.vue @@ -10,7 +10,7 @@ - + + diff --git a/example/src/demo/pc/autocomplete/value-key.vue b/examples/docs/resources/pc/demo/autocomplete/value-key.vue similarity index 75% rename from example/src/demo/pc/autocomplete/value-key.vue rename to examples/docs/resources/pc/demo/autocomplete/value-key.vue index 004d027fe..dd35df3bc 100644 --- a/example/src/demo/pc/autocomplete/value-key.vue +++ b/examples/docs/resources/pc/demo/autocomplete/value-key.vue @@ -1,10 +1,10 @@ - diff --git a/example/src/demo/pc/badge/badge-class.vue b/examples/docs/resources/pc/demo/badge/badge-class.vue similarity index 100% rename from example/src/demo/pc/badge/badge-class.vue rename to examples/docs/resources/pc/demo/badge/badge-class.vue diff --git a/examples/docs/resources/pc/demo/badge/base.vue b/examples/docs/resources/pc/demo/badge/base.vue new file mode 100644 index 000000000..8dd739fb9 --- /dev/null +++ b/examples/docs/resources/pc/demo/badge/base.vue @@ -0,0 +1,13 @@ + + + diff --git a/example/src/demo/pc/badge/dynamic-hidden.vue b/examples/docs/resources/pc/demo/badge/dynamic-hidden.vue similarity index 96% rename from example/src/demo/pc/badge/dynamic-hidden.vue rename to examples/docs/resources/pc/demo/badge/dynamic-hidden.vue index 2b28332c2..581265653 100644 --- a/example/src/demo/pc/badge/dynamic-hidden.vue +++ b/examples/docs/resources/pc/demo/badge/dynamic-hidden.vue @@ -6,7 +6,7 @@ - diff --git a/examples/docs/resources/pc/demo/badge/max.vue b/examples/docs/resources/pc/demo/badge/max.vue new file mode 100644 index 000000000..594b70cb1 --- /dev/null +++ b/examples/docs/resources/pc/demo/badge/max.vue @@ -0,0 +1,13 @@ + + + diff --git a/example/src/demo/pc/badge/offset.vue b/examples/docs/resources/pc/demo/badge/offset.vue similarity index 100% rename from example/src/demo/pc/badge/offset.vue rename to examples/docs/resources/pc/demo/badge/offset.vue diff --git a/examples/docs/resources/pc/demo/badge/slot-content.vue b/examples/docs/resources/pc/demo/badge/slot-content.vue new file mode 100644 index 000000000..c8cd3f959 --- /dev/null +++ b/examples/docs/resources/pc/demo/badge/slot-content.vue @@ -0,0 +1,22 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/badge/slot-default.vue b/examples/docs/resources/pc/demo/badge/slot-default.vue new file mode 100644 index 000000000..39c122311 --- /dev/null +++ b/examples/docs/resources/pc/demo/badge/slot-default.vue @@ -0,0 +1,17 @@ + + + diff --git a/examples/docs/resources/pc/demo/badge/target.vue b/examples/docs/resources/pc/demo/badge/target.vue new file mode 100644 index 000000000..8e8535666 --- /dev/null +++ b/examples/docs/resources/pc/demo/badge/target.vue @@ -0,0 +1,17 @@ + + + diff --git a/examples/docs/resources/pc/demo/badge/type.vue b/examples/docs/resources/pc/demo/badge/type.vue new file mode 100644 index 000000000..4f74c7634 --- /dev/null +++ b/examples/docs/resources/pc/demo/badge/type.vue @@ -0,0 +1,25 @@ + + + diff --git a/example/src/demo/pc/breadcrumb/base-on-route.vue b/examples/docs/resources/pc/demo/breadcrumb/base-on-route.vue similarity index 95% rename from example/src/demo/pc/breadcrumb/base-on-route.vue rename to examples/docs/resources/pc/demo/breadcrumb/base-on-route.vue index b286302bb..c66839695 100644 --- a/example/src/demo/pc/breadcrumb/base-on-route.vue +++ b/examples/docs/resources/pc/demo/breadcrumb/base-on-route.vue @@ -4,7 +4,7 @@ - diff --git a/examples/docs/resources/pc/demo/breadcrumb/options.vue b/examples/docs/resources/pc/demo/breadcrumb/options.vue new file mode 100644 index 000000000..e11fb1c78 --- /dev/null +++ b/examples/docs/resources/pc/demo/breadcrumb/options.vue @@ -0,0 +1,65 @@ + + + + + diff --git a/example/src/demo/pc/breadcrumb/separator.vue b/examples/docs/resources/pc/demo/breadcrumb/separator.vue similarity index 98% rename from example/src/demo/pc/breadcrumb/separator.vue rename to examples/docs/resources/pc/demo/breadcrumb/separator.vue index 933b43c97..55524a5c5 100644 --- a/example/src/demo/pc/breadcrumb/separator.vue +++ b/examples/docs/resources/pc/demo/breadcrumb/separator.vue @@ -18,7 +18,7 @@ - diff --git a/example/src/demo/pc/bulletin-board/active-name.vue b/examples/docs/resources/pc/demo/bulletin-board/active-name.vue similarity index 99% rename from example/src/demo/pc/bulletin-board/active-name.vue rename to examples/docs/resources/pc/demo/bulletin-board/active-name.vue index ef4b9a1b2..00e05643f 100644 --- a/example/src/demo/pc/bulletin-board/active-name.vue +++ b/examples/docs/resources/pc/demo/bulletin-board/active-name.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/bulletin-board/icon.vue b/examples/docs/resources/pc/demo/bulletin-board/icon.vue new file mode 100644 index 000000000..6abb28b73 --- /dev/null +++ b/examples/docs/resources/pc/demo/bulletin-board/icon.vue @@ -0,0 +1,101 @@ + + + diff --git a/example/src/demo/pc/bulletin-board/more-link.vue b/examples/docs/resources/pc/demo/bulletin-board/more-link.vue similarity index 99% rename from example/src/demo/pc/bulletin-board/more-link.vue rename to examples/docs/resources/pc/demo/bulletin-board/more-link.vue index 1c9aeaf36..ef62634b7 100644 --- a/example/src/demo/pc/bulletin-board/more-link.vue +++ b/examples/docs/resources/pc/demo/bulletin-board/more-link.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/bulletin-board/tab-title.vue b/examples/docs/resources/pc/demo/bulletin-board/tab-title.vue similarity index 99% rename from example/src/demo/pc/bulletin-board/tab-title.vue rename to examples/docs/resources/pc/demo/bulletin-board/tab-title.vue index dd09e0689..58a6b8e83 100644 --- a/example/src/demo/pc/bulletin-board/tab-title.vue +++ b/examples/docs/resources/pc/demo/bulletin-board/tab-title.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/bulletin-board/url.vue b/examples/docs/resources/pc/demo/bulletin-board/url.vue similarity index 96% rename from example/src/demo/pc/bulletin-board/url.vue rename to examples/docs/resources/pc/demo/bulletin-board/url.vue index 4361103e7..e35afca70 100644 --- a/example/src/demo/pc/bulletin-board/url.vue +++ b/examples/docs/resources/pc/demo/bulletin-board/url.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/button-group/data.vue b/examples/docs/resources/pc/demo/button-group/data.vue new file mode 100644 index 000000000..e16138c64 --- /dev/null +++ b/examples/docs/resources/pc/demo/button-group/data.vue @@ -0,0 +1,22 @@ + + + diff --git a/examples/docs/resources/pc/demo/button-group/disabled.vue b/examples/docs/resources/pc/demo/button-group/disabled.vue new file mode 100644 index 000000000..1e90b0e96 --- /dev/null +++ b/examples/docs/resources/pc/demo/button-group/disabled.vue @@ -0,0 +1,22 @@ + + + diff --git a/example/src/demo/pc/button-group/event-edit.vue b/examples/docs/resources/pc/demo/button-group/event-edit.vue similarity index 97% rename from example/src/demo/pc/button-group/event-edit.vue rename to examples/docs/resources/pc/demo/button-group/event-edit.vue index ed9d2f2ad..f13da07ca 100644 --- a/example/src/demo/pc/button-group/event-edit.vue +++ b/examples/docs/resources/pc/demo/button-group/event-edit.vue @@ -4,7 +4,7 @@ - diff --git a/example/src/demo/pc/button-group/show-edit.vue b/examples/docs/resources/pc/demo/button-group/show-edit.vue similarity index 96% rename from example/src/demo/pc/button-group/show-edit.vue rename to examples/docs/resources/pc/demo/button-group/show-edit.vue index b716d0243..59be53a7e 100644 --- a/example/src/demo/pc/button-group/show-edit.vue +++ b/examples/docs/resources/pc/demo/button-group/show-edit.vue @@ -4,7 +4,7 @@ - diff --git a/examples/docs/resources/pc/demo/button-group/slot-default.vue b/examples/docs/resources/pc/demo/button-group/slot-default.vue new file mode 100644 index 000000000..a2bd0891c --- /dev/null +++ b/examples/docs/resources/pc/demo/button-group/slot-default.vue @@ -0,0 +1,18 @@ + + + diff --git a/example/src/demo/pc/button-group/text-value-field.vue b/examples/docs/resources/pc/demo/button-group/text-value-field.vue similarity index 96% rename from example/src/demo/pc/button-group/text-value-field.vue rename to examples/docs/resources/pc/demo/button-group/text-value-field.vue index 4d5a0a8b0..565f387ac 100644 --- a/example/src/demo/pc/button-group/text-value-field.vue +++ b/examples/docs/resources/pc/demo/button-group/text-value-field.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/button/base.vue b/examples/docs/resources/pc/demo/button/base.vue new file mode 100644 index 000000000..794ac1f72 --- /dev/null +++ b/examples/docs/resources/pc/demo/button/base.vue @@ -0,0 +1,57 @@ + + + + + diff --git a/example/src/demo/pc/button/circle.vue b/examples/docs/resources/pc/demo/button/circle.vue similarity index 98% rename from example/src/demo/pc/button/circle.vue rename to examples/docs/resources/pc/demo/button/circle.vue index 7060a778d..ac9f44d03 100644 --- a/example/src/demo/pc/button/circle.vue +++ b/examples/docs/resources/pc/demo/button/circle.vue @@ -19,7 +19,7 @@ - diff --git a/examples/docs/resources/pc/demo/button/dynamic-disabled.vue b/examples/docs/resources/pc/demo/button/dynamic-disabled.vue new file mode 100644 index 000000000..b4cddfba3 --- /dev/null +++ b/examples/docs/resources/pc/demo/button/dynamic-disabled.vue @@ -0,0 +1,40 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/button/icon.vue b/examples/docs/resources/pc/demo/button/icon.vue new file mode 100644 index 000000000..d5977aebd --- /dev/null +++ b/examples/docs/resources/pc/demo/button/icon.vue @@ -0,0 +1,31 @@ + + + diff --git a/example/src/demo/pc/button/image.vue b/examples/docs/resources/pc/demo/button/image.vue similarity index 80% rename from example/src/demo/pc/button/image.vue rename to examples/docs/resources/pc/demo/button/image.vue index 6d6c4f794..126b00e0e 100644 --- a/example/src/demo/pc/button/image.vue +++ b/examples/docs/resources/pc/demo/button/image.vue @@ -5,7 +5,7 @@ - diff --git a/examples/docs/resources/pc/demo/button/plain.vue b/examples/docs/resources/pc/demo/button/plain.vue new file mode 100644 index 000000000..18e033749 --- /dev/null +++ b/examples/docs/resources/pc/demo/button/plain.vue @@ -0,0 +1,20 @@ + + + diff --git a/examples/docs/resources/pc/demo/button/reset-time.vue b/examples/docs/resources/pc/demo/button/reset-time.vue new file mode 100644 index 000000000..11147a8e1 --- /dev/null +++ b/examples/docs/resources/pc/demo/button/reset-time.vue @@ -0,0 +1,17 @@ + + + diff --git a/examples/docs/resources/pc/demo/button/round.vue b/examples/docs/resources/pc/demo/button/round.vue new file mode 100644 index 000000000..33167bd25 --- /dev/null +++ b/examples/docs/resources/pc/demo/button/round.vue @@ -0,0 +1,20 @@ + + + diff --git a/examples/docs/resources/pc/demo/button/size.vue b/examples/docs/resources/pc/demo/button/size.vue new file mode 100644 index 000000000..8b0b50f3e --- /dev/null +++ b/examples/docs/resources/pc/demo/button/size.vue @@ -0,0 +1,19 @@ + + + diff --git a/examples/docs/resources/pc/demo/button/slot-default.vue b/examples/docs/resources/pc/demo/button/slot-default.vue new file mode 100644 index 000000000..11ba7bfaa --- /dev/null +++ b/examples/docs/resources/pc/demo/button/slot-default.vue @@ -0,0 +1,30 @@ + + + diff --git a/examples/docs/resources/pc/demo/button/text.vue b/examples/docs/resources/pc/demo/button/text.vue new file mode 100644 index 000000000..3391778db --- /dev/null +++ b/examples/docs/resources/pc/demo/button/text.vue @@ -0,0 +1,16 @@ + + + diff --git a/examples/docs/resources/pc/demo/button/type.vue b/examples/docs/resources/pc/demo/button/type.vue new file mode 100644 index 000000000..0b7ab2934 --- /dev/null +++ b/examples/docs/resources/pc/demo/button/type.vue @@ -0,0 +1,21 @@ + + + diff --git a/examples/docs/resources/pc/demo/calendar/basic-usage.vue b/examples/docs/resources/pc/demo/calendar/basic-usage.vue new file mode 100644 index 000000000..8a7f36adb --- /dev/null +++ b/examples/docs/resources/pc/demo/calendar/basic-usage.vue @@ -0,0 +1,13 @@ + + + diff --git a/example/src/demo/pc/calendar/calendar-mode.vue b/examples/docs/resources/pc/demo/calendar/calendar-mode.vue similarity index 90% rename from example/src/demo/pc/calendar/calendar-mode.vue rename to examples/docs/resources/pc/demo/calendar/calendar-mode.vue index d9c697553..db2becf03 100644 --- a/example/src/demo/pc/calendar/calendar-mode.vue +++ b/examples/docs/resources/pc/demo/calendar/calendar-mode.vue @@ -2,7 +2,7 @@ - + + diff --git a/example/src/demo/pc/carousel/card-mode.vue b/examples/docs/resources/pc/demo/carousel/card-mode.vue similarity index 86% rename from example/src/demo/pc/carousel/card-mode.vue rename to examples/docs/resources/pc/demo/carousel/card-mode.vue index 2e1f8dcb0..00d54710a 100644 --- a/example/src/demo/pc/carousel/card-mode.vue +++ b/examples/docs/resources/pc/demo/carousel/card-mode.vue @@ -6,7 +6,7 @@ - + + diff --git a/example/src/demo/pc/carousel/up-down-carousel.vue b/examples/docs/resources/pc/demo/carousel/up-down-carousel.vue similarity index 86% rename from example/src/demo/pc/carousel/up-down-carousel.vue rename to examples/docs/resources/pc/demo/carousel/up-down-carousel.vue index 41a058b0b..0078850a3 100644 --- a/example/src/demo/pc/carousel/up-down-carousel.vue +++ b/examples/docs/resources/pc/demo/carousel/up-down-carousel.vue @@ -6,7 +6,7 @@ - + + diff --git a/example/src/demo/pc/cascader-panel/cascader-panel-props.vue b/examples/docs/resources/pc/demo/cascader-panel/cascader-panel-props.vue similarity index 99% rename from example/src/demo/pc/cascader-panel/cascader-panel-props.vue rename to examples/docs/resources/pc/demo/cascader-panel/cascader-panel-props.vue index 23b8d3bb4..dacbb2852 100644 --- a/example/src/demo/pc/cascader-panel/cascader-panel-props.vue +++ b/examples/docs/resources/pc/demo/cascader-panel/cascader-panel-props.vue @@ -13,7 +13,7 @@ > - + + diff --git a/example/src/demo/pc/cascader-panel/custom-option-content.vue b/examples/docs/resources/pc/demo/cascader-panel/custom-option-content.vue similarity index 99% rename from example/src/demo/pc/cascader-panel/custom-option-content.vue rename to examples/docs/resources/pc/demo/cascader-panel/custom-option-content.vue index 0a8ac6198..b9c4ee032 100644 --- a/example/src/demo/pc/cascader-panel/custom-option-content.vue +++ b/examples/docs/resources/pc/demo/cascader-panel/custom-option-content.vue @@ -7,7 +7,7 @@ - diff --git a/examples/docs/resources/pc/demo/cascader/basic-usage.vue b/examples/docs/resources/pc/demo/cascader/basic-usage.vue new file mode 100644 index 000000000..be6f4e85f --- /dev/null +++ b/examples/docs/resources/pc/demo/cascader/basic-usage.vue @@ -0,0 +1,212 @@ + + + diff --git a/example/src/demo/pc/cascader/check-strictly-multiple.vue b/examples/docs/resources/pc/demo/cascader/check-strictly-multiple.vue similarity index 81% rename from example/src/demo/pc/cascader/check-strictly-multiple.vue rename to examples/docs/resources/pc/demo/cascader/check-strictly-multiple.vue index 0ac3304df..e518fae7e 100644 --- a/example/src/demo/pc/cascader/check-strictly-multiple.vue +++ b/examples/docs/resources/pc/demo/cascader/check-strictly-multiple.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/cascader/clearable.vue b/examples/docs/resources/pc/demo/cascader/clearable.vue new file mode 100644 index 000000000..a09aca9d0 --- /dev/null +++ b/examples/docs/resources/pc/demo/cascader/clearable.vue @@ -0,0 +1,220 @@ + + + diff --git a/examples/docs/resources/pc/demo/cascader/collapse-tags.vue b/examples/docs/resources/pc/demo/cascader/collapse-tags.vue new file mode 100644 index 000000000..153506fbd --- /dev/null +++ b/examples/docs/resources/pc/demo/cascader/collapse-tags.vue @@ -0,0 +1,217 @@ + + + diff --git a/example/src/demo/pc/cascader/default-multiple.vue b/examples/docs/resources/pc/demo/cascader/default-multiple.vue similarity index 84% rename from example/src/demo/pc/cascader/default-multiple.vue rename to examples/docs/resources/pc/demo/cascader/default-multiple.vue index ce6f6ba07..c9dd89008 100644 --- a/example/src/demo/pc/cascader/default-multiple.vue +++ b/examples/docs/resources/pc/demo/cascader/default-multiple.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/cascader/expand-trigger.vue b/examples/docs/resources/pc/demo/cascader/expand-trigger.vue similarity index 99% rename from example/src/demo/pc/cascader/expand-trigger.vue rename to examples/docs/resources/pc/demo/cascader/expand-trigger.vue index cac223f82..bb3b08024 100644 --- a/example/src/demo/pc/cascader/expand-trigger.vue +++ b/examples/docs/resources/pc/demo/cascader/expand-trigger.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/cascader/filterable-multiple.vue b/examples/docs/resources/pc/demo/cascader/filterable-multiple.vue similarity index 99% rename from example/src/demo/pc/cascader/filterable-multiple.vue rename to examples/docs/resources/pc/demo/cascader/filterable-multiple.vue index eeab4d5a9..cb2b3679a 100644 --- a/example/src/demo/pc/cascader/filterable-multiple.vue +++ b/examples/docs/resources/pc/demo/cascader/filterable-multiple.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/cascader/props-children.vue b/examples/docs/resources/pc/demo/cascader/props-children.vue similarity index 99% rename from example/src/demo/pc/cascader/props-children.vue rename to examples/docs/resources/pc/demo/cascader/props-children.vue index 0475f08c3..7f6ff0d11 100644 --- a/example/src/demo/pc/cascader/props-children.vue +++ b/examples/docs/resources/pc/demo/cascader/props-children.vue @@ -11,7 +11,7 @@ > - diff --git a/examples/docs/resources/pc/demo/chart/bar/base.vue b/examples/docs/resources/pc/demo/chart/bar/base.vue new file mode 100644 index 000000000..f00ac48d6 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/bar/base.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/bar/demo2.vue b/examples/docs/resources/pc/demo/chart/bar/demo2.vue new file mode 100644 index 000000000..a7a681d5f --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/bar/demo2.vue @@ -0,0 +1,34 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/bar/demo3.vue b/examples/docs/resources/pc/demo/chart/bar/demo3.vue new file mode 100644 index 000000000..4623362a5 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/bar/demo3.vue @@ -0,0 +1,37 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/bar/demo4.vue b/examples/docs/resources/pc/demo/chart/bar/demo4.vue new file mode 100644 index 000000000..43de33986 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/bar/demo4.vue @@ -0,0 +1,37 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/bar/demo5.vue b/examples/docs/resources/pc/demo/chart/bar/demo5.vue new file mode 100644 index 000000000..37c53e1cd --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/bar/demo5.vue @@ -0,0 +1,39 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/bar/demo6.vue b/examples/docs/resources/pc/demo/chart/bar/demo6.vue new file mode 100644 index 000000000..beea02094 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/bar/demo6.vue @@ -0,0 +1,35 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/bar/demo7.vue b/examples/docs/resources/pc/demo/chart/bar/demo7.vue new file mode 100644 index 000000000..b338cec49 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/bar/demo7.vue @@ -0,0 +1,33 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/base.vue b/examples/docs/resources/pc/demo/chart/base.vue new file mode 100644 index 000000000..b6aa8b47b --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/base.vue @@ -0,0 +1,81 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/bmap/base.vue b/examples/docs/resources/pc/demo/chart/bmap/base.vue new file mode 100644 index 000000000..d8cd07156 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/bmap/base.vue @@ -0,0 +1,40 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/boxplot/base.vue b/examples/docs/resources/pc/demo/chart/boxplot/base.vue new file mode 100644 index 000000000..4e19e18cb --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/boxplot/base.vue @@ -0,0 +1,50 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/boxplot/multiple.vue b/examples/docs/resources/pc/demo/chart/boxplot/multiple.vue new file mode 100644 index 000000000..cbb803d94 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/boxplot/multiple.vue @@ -0,0 +1,134 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/boxplot/vertical.vue b/examples/docs/resources/pc/demo/chart/boxplot/vertical.vue new file mode 100644 index 000000000..0f5a4bcc2 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/boxplot/vertical.vue @@ -0,0 +1,105 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/candle/base.vue b/examples/docs/resources/pc/demo/chart/candle/base.vue new file mode 100644 index 000000000..9ba97f21f --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/candle/base.vue @@ -0,0 +1,329 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/candle/demo2.vue b/examples/docs/resources/pc/demo/chart/candle/demo2.vue new file mode 100644 index 000000000..f11694a36 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/candle/demo2.vue @@ -0,0 +1,64 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/candle/demo3.vue b/examples/docs/resources/pc/demo/chart/candle/demo3.vue new file mode 100644 index 000000000..6fab3245a --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/candle/demo3.vue @@ -0,0 +1,332 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/candle/demo4.vue b/examples/docs/resources/pc/demo/chart/candle/demo4.vue new file mode 100644 index 000000000..06440cadc --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/candle/demo4.vue @@ -0,0 +1,333 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/candle/demo5.vue b/examples/docs/resources/pc/demo/chart/candle/demo5.vue new file mode 100644 index 000000000..ec8fd54a6 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/candle/demo5.vue @@ -0,0 +1,340 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/candle/demo6.vue b/examples/docs/resources/pc/demo/chart/candle/demo6.vue new file mode 100644 index 000000000..3281fc78b --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/candle/demo6.vue @@ -0,0 +1,333 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/candle/demo7.vue b/examples/docs/resources/pc/demo/chart/candle/demo7.vue new file mode 100644 index 000000000..3552a8540 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/candle/demo7.vue @@ -0,0 +1,334 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/events/base.vue b/examples/docs/resources/pc/demo/chart/events/base.vue new file mode 100644 index 000000000..1e5d97a6f --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/events/base.vue @@ -0,0 +1,37 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/funnel/base.vue b/examples/docs/resources/pc/demo/chart/funnel/base.vue new file mode 100644 index 000000000..9aa6d74a0 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/funnel/base.vue @@ -0,0 +1,29 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/funnel/demo2.vue b/examples/docs/resources/pc/demo/chart/funnel/demo2.vue new file mode 100644 index 000000000..3e2cdec7d --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/funnel/demo2.vue @@ -0,0 +1,33 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/funnel/demo3.vue b/examples/docs/resources/pc/demo/chart/funnel/demo3.vue new file mode 100644 index 000000000..ea78c250d --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/funnel/demo3.vue @@ -0,0 +1,34 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/funnel/demo4.vue b/examples/docs/resources/pc/demo/chart/funnel/demo4.vue new file mode 100644 index 000000000..fe0d537d2 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/funnel/demo4.vue @@ -0,0 +1,32 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/funnel/demo5.vue b/examples/docs/resources/pc/demo/chart/funnel/demo5.vue new file mode 100644 index 000000000..8c6c696ce --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/funnel/demo5.vue @@ -0,0 +1,32 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/funnel/demo6.vue b/examples/docs/resources/pc/demo/chart/funnel/demo6.vue new file mode 100644 index 000000000..381398a97 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/funnel/demo6.vue @@ -0,0 +1,34 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/funnel/demo7.vue b/examples/docs/resources/pc/demo/chart/funnel/demo7.vue new file mode 100644 index 000000000..dfc263dcc --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/funnel/demo7.vue @@ -0,0 +1,32 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/gauge/base.vue b/examples/docs/resources/pc/demo/chart/gauge/base.vue new file mode 100644 index 000000000..d1f382739 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/gauge/base.vue @@ -0,0 +1,24 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/gauge/demo2.vue b/examples/docs/resources/pc/demo/chart/gauge/demo2.vue new file mode 100644 index 000000000..90e66e829 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/gauge/demo2.vue @@ -0,0 +1,28 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/gauge/demo3.vue b/examples/docs/resources/pc/demo/chart/gauge/demo3.vue new file mode 100644 index 000000000..0c985f2d9 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/gauge/demo3.vue @@ -0,0 +1,35 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/gauge/demo4.vue b/examples/docs/resources/pc/demo/chart/gauge/demo4.vue new file mode 100644 index 000000000..b7c031ae6 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/gauge/demo4.vue @@ -0,0 +1,32 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/gauge/demo5.vue b/examples/docs/resources/pc/demo/chart/gauge/demo5.vue new file mode 100644 index 000000000..a1476afdb --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/gauge/demo5.vue @@ -0,0 +1,261 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/graph/base.vue b/examples/docs/resources/pc/demo/chart/graph/base.vue new file mode 100644 index 000000000..041761b09 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/graph/base.vue @@ -0,0 +1,127 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/graph/demo2.vue b/examples/docs/resources/pc/demo/chart/graph/demo2.vue new file mode 100644 index 000000000..f2ea0b9d7 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/graph/demo2.vue @@ -0,0 +1,70 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/graph/demo3.vue b/examples/docs/resources/pc/demo/chart/graph/demo3.vue new file mode 100644 index 000000000..ee32923e7 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/graph/demo3.vue @@ -0,0 +1,356 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/heatmap/base.vue b/examples/docs/resources/pc/demo/chart/heatmap/base.vue new file mode 100644 index 000000000..31dc948af --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/heatmap/base.vue @@ -0,0 +1,35 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/heatmap/demo2.vue b/examples/docs/resources/pc/demo/chart/heatmap/demo2.vue new file mode 100644 index 000000000..40dd246db --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/heatmap/demo2.vue @@ -0,0 +1,39 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/heatmap/demo3.vue b/examples/docs/resources/pc/demo/chart/heatmap/demo3.vue new file mode 100644 index 000000000..74626e1c1 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/heatmap/demo3.vue @@ -0,0 +1,45 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/heatmap/demo4.vue b/examples/docs/resources/pc/demo/chart/heatmap/demo4.vue new file mode 100644 index 000000000..a76ab3352 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/heatmap/demo4.vue @@ -0,0 +1,64 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/heatmap/demo5.vue b/examples/docs/resources/pc/demo/chart/heatmap/demo5.vue new file mode 100644 index 000000000..a1bda085a --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/heatmap/demo5.vue @@ -0,0 +1,44 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/histogram/base.vue b/examples/docs/resources/pc/demo/chart/histogram/base.vue new file mode 100644 index 000000000..2a1cf6fb5 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/histogram/base.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/histogram/demo2.vue b/examples/docs/resources/pc/demo/chart/histogram/demo2.vue new file mode 100644 index 000000000..c37d37093 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/histogram/demo2.vue @@ -0,0 +1,35 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/histogram/demo3.vue b/examples/docs/resources/pc/demo/chart/histogram/demo3.vue new file mode 100644 index 000000000..c3a5efa2b --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/histogram/demo3.vue @@ -0,0 +1,36 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/histogram/demo4.vue b/examples/docs/resources/pc/demo/chart/histogram/demo4.vue new file mode 100644 index 000000000..9dc44b2a1 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/histogram/demo4.vue @@ -0,0 +1,36 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/histogram/demo5.vue b/examples/docs/resources/pc/demo/chart/histogram/demo5.vue new file mode 100644 index 000000000..e34eabe86 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/histogram/demo5.vue @@ -0,0 +1,34 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/histogram/demo6.vue b/examples/docs/resources/pc/demo/chart/histogram/demo6.vue new file mode 100644 index 000000000..f4373de4a --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/histogram/demo6.vue @@ -0,0 +1,37 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/histogram/demo7.vue b/examples/docs/resources/pc/demo/chart/histogram/demo7.vue new file mode 100644 index 000000000..1b92edc91 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/histogram/demo7.vue @@ -0,0 +1,41 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/histogram/demo8.vue b/examples/docs/resources/pc/demo/chart/histogram/demo8.vue new file mode 100644 index 000000000..a0397d891 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/histogram/demo8.vue @@ -0,0 +1,35 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/line/base.vue b/examples/docs/resources/pc/demo/chart/line/base.vue new file mode 100644 index 000000000..2de6fbbf0 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/line/base.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/line/demo2.vue b/examples/docs/resources/pc/demo/chart/line/demo2.vue new file mode 100644 index 000000000..ece96af9a --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/line/demo2.vue @@ -0,0 +1,35 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/line/demo3.vue b/examples/docs/resources/pc/demo/chart/line/demo3.vue new file mode 100644 index 000000000..fa08441ed --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/line/demo3.vue @@ -0,0 +1,36 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/line/demo4.vue b/examples/docs/resources/pc/demo/chart/line/demo4.vue new file mode 100644 index 000000000..b6f4a3fa1 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/line/demo4.vue @@ -0,0 +1,40 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/line/demo5.vue b/examples/docs/resources/pc/demo/chart/line/demo5.vue new file mode 100644 index 000000000..8209eacfa --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/line/demo5.vue @@ -0,0 +1,35 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/line/demo6.vue b/examples/docs/resources/pc/demo/chart/line/demo6.vue new file mode 100644 index 000000000..d06f0bc63 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/line/demo6.vue @@ -0,0 +1,40 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/line/demo7.vue b/examples/docs/resources/pc/demo/chart/line/demo7.vue new file mode 100644 index 000000000..a73407be5 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/line/demo7.vue @@ -0,0 +1,41 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/line/demo8.vue b/examples/docs/resources/pc/demo/chart/line/demo8.vue new file mode 100644 index 000000000..47c26e99f --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/line/demo8.vue @@ -0,0 +1,35 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/line/demo9.vue b/examples/docs/resources/pc/demo/chart/line/demo9.vue new file mode 100644 index 000000000..48f7685dc --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/line/demo9.vue @@ -0,0 +1,35 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/liquidfill/base.vue b/examples/docs/resources/pc/demo/chart/liquidfill/base.vue new file mode 100644 index 000000000..8cb982a2f --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/liquidfill/base.vue @@ -0,0 +1,29 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/liquidfill/demo2.vue b/examples/docs/resources/pc/demo/chart/liquidfill/demo2.vue new file mode 100644 index 000000000..994facc49 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/liquidfill/demo2.vue @@ -0,0 +1,37 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/liquidfill/demo3.vue b/examples/docs/resources/pc/demo/chart/liquidfill/demo3.vue new file mode 100644 index 000000000..180255bf0 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/liquidfill/demo3.vue @@ -0,0 +1,76 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/liquidfill/demo4.vue b/examples/docs/resources/pc/demo/chart/liquidfill/demo4.vue new file mode 100644 index 000000000..1c7011aba --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/liquidfill/demo4.vue @@ -0,0 +1,36 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/liquidfill/demo5.vue b/examples/docs/resources/pc/demo/chart/liquidfill/demo5.vue new file mode 100644 index 000000000..e3251ccf8 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/liquidfill/demo5.vue @@ -0,0 +1,56 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/map/base.vue b/examples/docs/resources/pc/demo/chart/map/base.vue new file mode 100644 index 000000000..12855e93f --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/map/base.vue @@ -0,0 +1,44 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/map/china.js b/examples/docs/resources/pc/demo/chart/map/china.js new file mode 100644 index 000000000..439cea9d0 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/map/china.js @@ -0,0 +1,876 @@ +export default { + type: 'FeatureCollection', + features: [ + { + id: '710000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + ['@@°Ü¯Û'], + [ + '@@ƛĴÕƊÉɼģºðʀ\\ƎsÆNŌÔĚäœnÜƤɊĂǀĆĴžĤNJŨxĚĮǂƺòƌ‚–âÔ®ĮXŦţƸZûЋƕƑGđ¨ĭMó·ęcëƝɉlÝƯֹÅŃ^Ó·śŃNjƏďíåɛGɉ™¿@ăƑŽ¥ĘWǬÏĶŁâ' + ], + ['@@\\p|WoYG¿¥I†j@¢'], + ['@@…¡‰@ˆV^RqˆBbAŒnTXeRz¤Lž«³I'], + ['@@ÆEE—„kWqë @œ'], + ['@@fced'] + ], + encodeOffsets: [ + [[122886, 24033]], + [[123335, 22980]], + [[122375, 24193]], + [[122518, 24117]], + [[124427, 22618]], + [[124862, 26043]] + ] + }, + properties: { + cp: [121.509062, 24.044332], + name: '台湾', + childNum: 6 + } + }, + { + id: '130000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + ['@@o~†Z]‚ªr‰ºc_ħ²G¼s`jΟnüsœłNX_“M`ǽÓnUK…Ĝēs¤­©yrý§uģŒc†JŠ›e'], + ['@@U`Ts¿m‚'], + [ + '@@oºƋÄd–eVŽDJj£€J|Ådz•Ft~žKŨ¸IÆv|”‡¢r}膎onb˜}`RÎÄn°ÒdÞ²„^®’lnÐèĄlðӜ×]ªÆ}LiĂ±Ö`^°Ç¶p®đDcœŋ`–ZÔ’¶êqvFƚ†N®ĆTH®¦O’¾ŠIbÐã´BĐɢŴÆíȦp–ĐÞXR€·nndOž¤’OÀĈƒ­Qg˜µFo|gȒęSWb©osx|hYh•gŃfmÖĩnº€T̒Sp›¢dYĤ¶UĈjl’ǐpäìë|³kÛfw²Xjz~ÂqbTŠÑ„ěŨ@|oM‡’zv¢ZrÃVw¬ŧĖ¸fŒ°ÐT€ªqŽs{Sž¯r æÝlNd®²Ğ džiGʂJ™¼lr}~K¨ŸƐÌWö€™ÆŠzRš¤lêmĞL΄’@¡|q]SvK€ÑcwpÏρ†ĿćènĪWlĄkT}ˆJ”¤~ƒÈT„d„™pddʾĬŠ”ŽBVt„EÀ¢ôPĎƗè@~‚k–ü\\rÊĔÖæW_§¼F˜†´©òDòj’ˆYÈrbĞāøŀG{ƀ|¦ðrb|ÀH`pʞkv‚GpuARhÞÆǶgʊTǼƹS£¨¡ù³ŘÍ]¿Ây™ôEP xX¶¹܇O¡“gÚ¡IwÃ鑦ÅB‡Ï|Ç°…N«úmH¯‹âŸDùŽyŜžŲIÄuШDž•¸dɂ‡‚FŸƒ•›Oh‡đ©OŸ›iÃ`ww^ƒÌkŸ‘ÑH«ƇǤŗĺtFu…{Z}Ö@U‡´…ʚLg®¯Oı°ÃwŸ ^˜—€VbÉs‡ˆmA…ê]]w„§›RRl£‡ȭµu¯b{ÍDěïÿȧŽuT£ġƒěŗƃĝ“Q¨fV†Ƌ•ƅn­a@‘³@šď„yýIĹÊKšŭfċŰóŒxV@tˆƯŒJ”]eƒR¾fe|rHA˜|h~Ėƍl§ÏŠlTíb ØoˆÅbbx³^zÃĶš¶Sj®A”yÂhðk`š«P€”ˈµEF†Û¬Y¨Ļrõqi¼‰Wi°§’б´°^[ˆÀ|ĠO@ÆxO\\tŽa\\tĕtû{ġŒȧXýĪÓjùÎRb›š^ΛfK[ݏděYfíÙTyŽuUSyŌŏů@Oi½’éŅ­aVcř§ax¹XŻác‡žWU£ôãºQ¨÷Ñws¥qEH‰Ù|‰›šYQoŕÇyáĂ£MðoťÊ‰P¡mšWO¡€v†{ôvîēÜISpÌhp¨ ‘j†deŔQÖj˜X³à™Ĉ[n`Yp@Už–cM`’RKhŒEbœ”pŞlNut®Etq‚nsÁŠgA‹iú‹oH‡qCX‡”hfgu“~ϋWP½¢G^}¯ÅīGCŸÑ^ãziMáļMTÃƘrMc|O_ž¯Ŏ´|‡morDkO\\mĆJfl@cĢ¬¢aĦtRıҙ¾ùƀ^juųœK­ƒUFy™—Ɲ…›īÛ÷ąV×qƥV¿aȉd³B›qPBm›aËđŻģm“Å®VŠ¹d^K‡KoŸnYg“¯Xhqa”Ldu¥•ÍpDž¡KąÅƒkĝęěhq‡}HyÓ]¹ǧ£…Í÷¿qᵧš™g‘¤o^á¾ZE‡¤i`ij{n•ƒOl»ŸWÝĔįhg›F[¿¡—ßkOüš_‰€ū‹i„DZàUtėGylƒ}ŒÓM}€jpEC~¡FtoQi‘šHkk{Ãmï‚' + ] + ], + encodeOffsets: [[[119712, 40641]], [[121616, 39981]], [[116462, 37237]]] + }, + properties: { + cp: [114.502461, 38.045474], + name: '河北', + childNum: 3 + } + }, + { + id: '140000', + type: 'Feature', + geometry: { + type: 'Polygon', + coordinates: [ + '@@Þĩ҃S‰ra}Á€yWix±Üe´lè“ßÓǏok‘ćiµVZģ¡coœ‘TS˹ĪmnÕńe–hZg{gtwªpXaĚThȑp{¶Eh—®RćƑP¿£‘Pmc¸mQÝW•ďȥoÅîɡųAďä³aωJ‘½¥PG­ąSM­™…EÅruµé€‘Yӎ•Ō_d›ĒCo­Èµ]¯_²ÕjāŽK~©ÅØ^ԛkïçămϑk]­±ƒcݯÑÃmQÍ~_a—pm…~ç¡q“ˆu{JÅŧ·Ls}–EyÁÆcI{¤IiCfUc•ƌÃp§]웫vD@¡SÀ‘µM‚ÅwuŽYY‡¡DbÑc¡hƒ×]nkoQdaMç~eD•ÛtT‰©±@¥ù@É¡‰ZcW|WqOJmĩl«ħşvOÓ«IqăV—¥ŸD[mI~Ó¢cehiÍ]Ɠ~ĥqXŠ·eƷœn±“}v•[ěďŽŕ]_‘œ•`‰¹ƒ§ÕōI™o©b­s^}Ét±ū«³p£ÿ·Wµ|¡¥ăFÏs׌¥ŅxŸÊdÒ{ºvĴÎêÌɊ²¶€ü¨|ÞƸµȲ‘LLúÉƎ¤ϊęĔV`„_bª‹S^|ŸdŠzY|dz¥p†ZbÆ£¶ÒK}tĦÔņƠ‚PYzn€ÍvX¶Ěn ĠÔ„zý¦ª˜÷žÑĸَUȌ¸‚dòÜJð´’ìúNM¬ŒXZ´‘¤ŊǸ_tldIš{¦ƀðĠȤ¥NehXnYG‚‡R° ƬDj¬¸|CĞ„Kq‚ºfƐiĺ©ª~ĆOQª ¤@ìǦɌ²æBŒÊ”TœŸ˜ʂōĖ’šĴŞ–ȀœÆÿȄlŤĒö„t”νî¼ĨXhŒ‘˜|ªM¤Ðz' + ], + encodeOffsets: [[116874, 41716]] + }, + properties: { + cp: [111.849248, 36.857014], + name: '山西', + childNum: 1 + } + }, + { + id: '150000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + [ + '@@Č^â£Ăh–šĖMÈÄw‚\\fŦ°W ¢¾luŸD„wŠ\\̀ʉÌÛM…Ā[bӞEn}¶Vc…ê“sƒ–›¯PqƒFB…‰|S•³C|kñ•H‹d‘iÄ¥sˆʼnő…PóÑÑE^‘ÅPpy_YtS™hQ·aHwsOnʼnÚs©iqj›‰€USiº]ïWš‰«gW¡A–R붛ijʕ…Œů`çõh]y»ǃŸǛҤxÒm~zf}pf|ÜroÈzrKÈĵSƧ„ż؜Ġu¦ö' + ], + [ + '@@sKCš…GS|úþX”gp›{ÁX¿Ÿć{ƱȏñZáĔyoÁhA™}ŅĆfdʼn„_¹„Y°ėǩÑ¡H¯¶oMQqð¡Ë™|‘Ñ`ƭŁX½·óۓxğįÅcQ‡ˆ“ƒs«tȋDžF“Ÿù^i‘t«Č¯[›hAi©á¥ÇĚ×l|¹y¯YȵƓ‹ñǙµï‚ċ™Ļ|Dœ™üȭ¶¡˜›oŽäÕG\\ďT¿Òõr¯œŸLguÏYęRƩšɷŌO\\İТæ^Ŋ IJȶȆbÜGŽĝ¬¿ĚVĎgª^íu½jÿĕęjık@Ľƒ]ėl¥Ë‡ĭûÁ„ƒėéV©±ćn©­ȇžÍq¯½•YÃÔʼn“ÉNѝÅÝy¹NqáʅDǡËñ­ƁYÅy̱os§ȋµʽǘǏƬɱà‘ưN¢ƔÊuľýľώȪƺɂļžxœZĈ}ÌʼnŪ˜ĺœŽĭFЛĽ̅ȣͽÒŵìƩÇϋÿȮǡŏçƑůĕ~Ǎ›¼ȳÐUf†dIxÿ\\G ˆzâɏÙOº·pqy£†@ŒŠqþ@Ǟ˽IBäƣzsÂZ†ÁàĻdñ°ŕzéØűzșCìDȐĴĺf®ŽÀľưø@ɜÖÞKĊŇƄ§‚͑těï͡VAġÑÑ»d³öǍÝXĉĕÖ{þĉu¸ËʅğU̎éhɹƆ̗̮ȘNJ֥ड़ࡰţાíϲäʮW¬®ҌeרūȠkɬɻ̼ãüfƠSצɩςåȈHϚÎKdzͲOðÏȆƘ¼CϚǚ࢚˼ФԂ¤ƌžĞ̪Qʤ´¼mȠJˀŸƲÀɠmǐnǔĎȆÞǠN~€ʢĜ‚¶ƌĆĘźʆȬ˪ĚĒ¸ĞGȖƴƀj`ĢçĶāàŃºēĢƒĖćšYŒÀŎüôQÐÂŎŞdžŞêƖš˜oˆDĤÕºÑǘÛˤ³̀gńƘĔÀ^žªƂ`ªt¾äƚêĦĀ¼Ð€Ĕǎ¨Ȕ»͠^ˮÊȦƤøxRrŜH¤¸ÂxDĝŒ|ø˂˜ƮÐ¬ɚwɲFjĔ²Äw°dždÀɞ_ĸdîàŎjʜêTЪŌ‡ŜWÈ|tqĢUB~´°ÎFC•ŽU¼pĀēƄN¦¾O¶ŠłKĊOj“Ě”j´ĜYp˜{¦„ˆSĚÍ\\Tš×ªV–÷Ší¨ÅDK°ßtŇĔKš¨ǵÂcḷ̌ĚǣȄĽF‡lġUĵœŇ‹ȣFʉɁƒMğįʏƶɷØŭOǽ«ƽū¹Ʊő̝Ȩ§ȞʘĖiɜɶʦ}¨֪ࠜ̀ƇǬ¹ǨE˦ĥªÔêFŽxúQ„Er´W„rh¤Ɛ \\talĈDJ˜Ü|[Pll̚¸ƎGú´Pž¬W¦†^¦–H]prR“n|or¾wLVnÇIujkmon£cX^Bh`¥V”„¦U¤¸}€xRj–[^xN[~ªŠxQ„‚[`ªHÆÂExx^wšN¶Ê˜|¨ì†˜€MrœdYp‚oRzNy˜ÀDs~€bcfÌ`L–¾n‹|¾T‚°c¨È¢a‚r¤–`[|òDŞĔöxElÖdH„ÀI`„Ď\\Àì~ƎR¼tf•¦^¢ķ¶e”ÐÚMŒptgj–„ɡČÅyġLû™ŇV®ŠÄÈƀ†Ď°P|ªVV†ªj–¬ĚÒêp¬–E|ŬÂc|ÀtƐK fˆ{ĘFĒœƌXƲąo½Ę‘\\¥–o}›Ûu£ç­kX‘{uĩ«āíÓUŅßŢq€Ť¥lyň[€oi{¦‹L‡ń‡ðFȪȖ”ĒL„¿Ì‹ˆfŒ£K£ʺ™oqNŸƒwğc`ue—tOj×°KJ±qƒÆġm‰Ěŗos¬…qehqsuœƒH{¸kH¡Š…ÊRǪÇƌbȆ¢´ä܍¢NìÉʖ¦â©Ż؛Ç@Vu»A—ylßí¹ĵê…ÝlISò³C¹Ìâ„²i¶’Ìoú^H“²CǜңDŽ z¼g^èöŰ_‹‚–†IJĕꄜ}gÁnUI«m‰…„‹]j‡vV¼euhwqA„aW˜ƒ_µj…»çjioQR¹ēÃßt@r³[ÛlćË^ÍÉáG“›OUۗOB±•XŸkŇ¹£k|e]ol™ŸkVͼÕqtaÏõjgÁ£§U^Œ”RLˆËnX°Ç’Bz†^~wfvˆypV ¯„ƫĉ˭ȫƗŷɿÿĿƑ˃ĝÿÃǃßËőó©ǐȍŒĖM×ÍEyx‹þp]Évïè‘vƀnÂĴÖ@‚‰†V~Ĉ™Š³MEˆĸÅĖt—ējyÄDXÄxGQuv_›i¦aBçw‘˛wD™©{ŸtāmQ€{EJ§KPśƘƿ¥@‰sCT•É}ɃwˆƇy±ŸgÑ“}T[÷kÐ禫…SÒ¥¸ëBX½‰HáŵÀğtSÝÂa[ƣ°¯¦P]£ġ“–“Òk®G²„èQ°óMq}EŠóƐÇ\\ƒ‡@áügQ͋u¥Fƒ“T՛¿Jû‡]|mvāÎYua^WoÀa·­ząÒot׶CLƗi¯¤mƎHNJ¤îìɾŊìTdåwsRÖgĒųúÍġäÕ}Q¶—ˆ¿A•†‹[¡Œ{d×uQAƒ›M•xV‹vMOmăl«ct[wº_šÇʊŽŸjb£ĦS_é“QZ“_lwgOiýe`YYLq§IÁˆdz£ÙË[ÕªuƏ³ÍT—s·bÁĽäė[›b[ˆŗfãcn¥îC¿÷µ[ŏÀQ­ōšĉm¿Á^£mJVm‡—L[{Ï_£›F¥Ö{ŹA}…×Wu©ÅaųijƳhB{·TQqÙIķˑZđ©Yc|M¡…L•eVUóK_QWk’_ĥ‘¿ãZ•»X\\ĴuUƒè‡lG®ěłTĠğDєOrÍd‚ÆÍz]‹±…ŭ©ŸÅ’]ŒÅÐ}UË¥©Tċ™ïxgckfWgi\\ÏĒ¥HkµE˜ë{»ÏetcG±ahUiñiWsɁˆ·c–C‚Õk]wȑ|ća}w…VaĚ᠞ŒG°ùnM¬¯†{ȈÐÆA’¥ÄêJxÙ¢”hP¢Ûˆº€µwWOŸóFŽšÁz^ÀŗÎú´§¢T¤ǻƺSė‰ǵhÝÅQgvBHouʝl_o¿Ga{ïq{¥|ſĿHĂ÷aĝÇq‡Z‘ñiñC³ª—…»E`¨åXēÕqÉû[l•}ç@čƘóO¿¡ƒFUsA‰“ʽīccšocƒ‚ƒÇS}„“£‡IS~ălkĩXçmĈ…ŀЂoÐdxÒuL^T{r@¢‘žÍƒĝKén£kQ™‰yšÅõËXŷƏL§~}kqš»IHėDžjĝŸ»ÑÞoŸå°qTt|r©ÏS‹¯·eŨĕx«È[eMˆ¿yuˆ‘pN~¹ÏyN£{©’—g‹ħWí»Í¾s“əšDž_ÃĀɗ±ą™ijĉʍŌŷ—S›É“A‹±åǥɋ@럣R©ąP©}ĹªƏj¹erƒLDĝ·{i«ƫC£µ' + ] + ], + encodeOffsets: [[[127444, 52594]], [[113793, 40312]]] + }, + properties: { + cp: [111.670801, 41.818311], + name: '内蒙古', + childNum: 2 + } + }, + { + id: '210000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + ['@@L–Ž@@s™a'], + ['@@MnNm'], + ['@@d‚c'], + ['@@eÀ‚C@b‚“‰'], + ['@@f‡…Xwkbr–Ä`qg'], + ['@@^jtW‘Q'], + ['@@~ Y]c'], + ['@@G`ĔN^_¿Z‚ÃM'], + ['@@iX¶B‹Y'], + ['@@„YƒZ'], + ['@@L_{Epf'], + ['@@^WqCT\\'], + ['@@\\[“‹§t|”¤_'], + ['@@m`n_'], + ['@@Ïxnj{q_×^Giip'], + [ + '@@@œé^B†‡ntˆaÊU—˜Ÿ]x ¯ÄPIJ­°h€ʙK³†VˆÕ@Y~†|EvĹsDŽ¦­L^p²ŸÒG ’Ël]„xxÄ_˜fT¤Ď¤cŽœP„–C¨¸TVjbgH²sdÎdHt`Bˆ—²¬GJję¶[ÐhjeXdlwhšðSȦªVÊπ‹Æ‘Z˜ÆŶ®²†^ŒÎyÅÎcPqń“ĚDMħĜŁH­ˆk„çvV[ij¼W–‚YÀäĦ’‘`XlžR`žôLUVžfK–¢†{NZdĒª’YĸÌÚJRr¸SA|ƴgŴĴÆbvªØX~†źBŽ|¦ÕœEž¤Ð`\\|Kˆ˜UnnI]¤ÀÂĊnŎ™R®Ő¿¶\\ÀøíDm¦ÎbŨab‰œaĘ\\ľã‚¸a˜tÎSƐ´©v\\ÖÚÌǴ¤Â‡¨JKr€Z_Z€fjþhPkx€`Y”’RIŒjJcVf~sCN¤ ˆE‚œhæm‰–sHy¨SðÑÌ\\\\ŸĐRZk°IS§fqŒßýáЍÙÉÖ[^¯ǤŲ„ê´\\¦¬ĆPM¯£Ÿˆ»uïpùzEx€žanµyoluqe¦W^£ÊL}ñrkqWňûP™‰UP¡ôJŠoo·ŒU}£Œ„[·¨@XŒĸŸ“‹‹DXm­Ûݏº‡›GU‹CÁª½{íĂ^cj‡k“¶Ã[q¤“LÉö³cux«zZfƒ²BWÇ®Yß½ve±ÃC•ý£W{Ú^’q^sÑ·¨‹ÍOt“¹·C¥‡GD›rí@wÕKţ݋˜Ÿ«V·i}xËÍ÷‘i©ĝ‡ɝǡ]ƒˆ{c™±OW‹³Ya±Ÿ‰_穂Hžĕoƫ€Ňqƒr³‰Lys[„ñ³¯OS–ďOMisZ†±ÅFC¥Pq{‚Ã[Pg}\\—¿ghćO…•k^ģÁFıĉĥM­oEqqZûěʼn³F‘¦oĵ—hŸÕP{¯~TÍlª‰N‰ßY“Ð{Ps{ÃVU™™eĎwk±ʼnVÓ½ŽJãÇÇ»Jm°dhcÀff‘dF~ˆ€ĀeĖ€d`sx² šƒ®EżĀdQ‹Âd^~ăÔHˆ¦\\›LKpĄVez¤NP ǹӗR™ÆąJSh­a[¦´Âghwm€BÐ¨źhI|žVVŽ—Ž|p] Â¼èNä¶ÜBÖ¼“L`‚¼bØæŒKV”ŸpoœúNZÞÒKxpw|ÊEMnzEQšŽIZ”ŽZ‡NBˆčÚFÜçmĩ‚WĪñt‘ÞĵÇñZ«uD‚±|Əlij¥ãn·±PmÍa‰–da‡ CL‡Ǒkùó¡³Ï«QaċϑOÃ¥ÕđQȥċƭy‹³ÃA' + ] + ], + encodeOffsets: [ + [[123686, 41445]], + [[126019, 40435]], + [[124393, 40128]], + [[126117, 39963]], + [[125322, 40140]], + [[126686, 40700]], + [[126041, 40374]], + [[125584, 40168]], + [[125453, 40165]], + [[125362, 40214]], + [[125280, 40291]], + [[125774, 39997]], + [[125976, 40496]], + [[125822, 39993]], + [[125509, 40217]], + [[122731, 40949]] + ] + }, + properties: { + cp: [123.429096, 41.796767], + name: '辽宁', + childNum: 16 + } + }, + { + id: '220000', + type: 'Feature', + geometry: { + type: 'Polygon', + coordinates: [ + '@@‘p䔳PClƒFbbÍzš€wBG’ĭ€Z„Åi“»ƒlY­ċ²SgŽkÇ£—^S‰“qd¯•‹R…©éŽ£¯S†\\cZ¹iűƏCuƍÓX‡oR}“M^o•£…R}oªU­F…uuXHlEŕ‡€Ï©¤ÛmTŽþ¤D–²ÄufàÀ­XXȱAe„yYw¬dvõ´KÊ£”\\rµÄl”iˆdā]|DÂVŒœH¹ˆÞ®ÜWnŒC”Œķ W‹§@\\¸‹ƒ~¤‹Vp¸‰póIO¢ŠVOšŇürXql~òÉK]¤¥Xrfkvzpm¶bwyFoúvð‡¼¤ N°ąO¥«³[ƒéǡű_°Õ\\ÚÊĝŽþâőàerR¨­JYlďQ[ ÏYëЧTGz•tnŠß¡gFkMŸāGÁ¤ia É‰™È¹`\\xs€¬dĆkNnuNUŠ–užP@‚vRY¾•–\\¢…ŒGªóĄ~RãÖÎĢù‚đŴÕhQŽxtcæëSɽʼníëlj£ƍG£nj°KƘµDsØÑpyƸ®¿bXp‚]vbÍZuĂ{nˆ^IüœÀSք”¦EŒvRÎûh@℈[‚Əȉô~FNr¯ôçR±ƒ­HÑl•’Ģ–^¤¢‚OðŸŒævxsŒ]ÞÁTĠs¶¿âƊGW¾ìA¦·TѬ†è¥€ÏÐJ¨¼ÒÖ¼ƒƦɄxÊ~S–tD@ŠĂ¼Ŵ¡jlºWžvЉˆzƦZЎ²CH— „Axiukd‹ŒGgetqmcžÛ£Ozy¥cE}|…¾cZ…k‚‰¿uŐã[oxGikfeäT@…šSUwpiÚFM©’£è^ڟ‚`@v¶eň†f h˜eP¶žt“äOlÔUgƒÞzŸU`lœ}ÔÆUvØ_Ō¬Öi^ĉi§²ÃŠB~¡Ĉ™ÚEgc|DC_Ȧm²rBx¼MÔ¦ŮdĨÃâYx‘ƘDVÇĺĿg¿cwÅ\\¹˜¥Yĭlœ¤žOv†šLjM_a W`zļMž·\\swqÝSA‡š—q‰Śij¯Š‘°kŠRē°wx^Đkǂғ„œž“œŽ„‹\\]˜nrĂ}²ĊŲÒøãh·M{yMzysěnĒġV·°“G³¼XÀ““™¤¹i´o¤ŃšŸÈ`̃DzÄUĞd\\i֚ŒˆmÈBĤÜɲDEh LG¾ƀľ{WaŒYÍȏĢĘÔRîĐj‹}Ǟ“ccj‡oUb½š{“h§Ǿ{K‹ƖµÎ÷žGĀÖŠåưÎs­l›•yiē«‹`姝H¥Ae^§„GK}iã\\c]v©ģZ“mÃ|“[M}ģTɟĵ‘Â`À–çm‰‘FK¥ÚíÁbXš³ÌQґHof{‰]e€pt·GŋĜYünĎųVY^’˜ydõkÅZW„«WUa~U·Sb•wGçǑ‚“iW^q‹F‚“›uNĝ—·Ew„‹UtW·Ýďæ©PuqEzwAV•—XR‰ãQ`­©GŒM‡ehc›c”ďϝd‡©ÑW_ϗYƅŒ»…é\\ƒɹ~ǙG³mØ©BšuT§Ĥ½¢Ã_ý‘L¡‘ýŸqT^rme™\\Pp•ZZbƒyŸ’uybQ—efµ]UhĿDCmûvašÙNSkCwn‰cćfv~…Y‹„ÇG' + ], + encodeOffsets: [[130196, 42528]] + }, + properties: { + cp: [125.3245, 43.886841], + name: '吉林', + childNum: 1 + } + }, + { + id: '230000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + ['@@ƨƒĶTLÇyqpÇÛqe{~oyen}s‰`q‡iXG”ù]Ëp½“©lɇÁp]Þñ´FÔ^f‘äîºkà˜z¼BUvÈ@'], + [ + '@@UƒµNÿ¥īè灋•HÍøƕ¶LŒǽ|g¨|”™Ža¾pViˆdd”~ÈiŒíďÓQġėǐZ΋ŽXb½|ſÃH½ŸKFgɱCģÛÇA‡n™‹jÕc[VĝDZÃ˄Ç_™ £ń³pŽj£º”š¿”»WH´¯”U¸đĢmžtĜyzzNN|g¸÷äűѱĉā~mq^—Œ[ƒ”››”ƒǁÑďlw]¯xQĔ‰¯l‰’€°řĴrŠ™˜BˆÞTxr[tŽ¸ĻN_yŸX`biN™Ku…P›£k‚ZĮ—¦[ºxÆÀdhŽĹŀUÈƗCw’áZħÄŭcÓ¥»NAw±qȥnD`{ChdÙFćš}¢‰A±Äj¨]ĊÕjŋ«×`VuÓś~_kŷVÝyh„“VkÄãPs”Oµ—fŸge‚Ň…µf@u_Ù ÙcŸªNªÙEojVx™T@†ãSefjlwH\\pŏäÀvŠŽlY†½d{†F~¦dyz¤PÜndsrhf‹HcŒvlwjFœ£G˜±DύƥY‡yϊu¹XikĿ¦ÏqƗǀOŜ¨LI|FRĂn sª|Cš˜zxAè¥bœfudTrFWÁ¹Am|˜ĔĕsķÆF‡´Nš‰}ć…UŠÕ@Áijſmužç’uð^ÊýowŒFzØÎĕNőžǏȎôªÌŒDŽàĀÄ˄ĞŀƒʀĀƘŸˮȬƬĊ°ƒUŸzou‡xe]}Ž…AyȑW¯ÌmK‡“Q]‹Īºif¸ÄX|sZt|½ÚUΠlkš^p{f¤lˆºlÆW –€A²˜PVܜPH”Êâ]ÎĈÌÜk´\\@qàsĔÄQºpRij¼èi†`¶—„bXƒrBgxfv»ŽuUiˆŒ^v~”J¬mVp´£Œ´VWrnP½ì¢BX‚¬h™ŠðX¹^TjVœŠriªj™tŊÄm€tPGx¸bgRšŽsT`ZozÆO]’ÒFô҆Oƒ‡ŊŒvŞ”p’cGŒêŠsx´DR–Œ{A†„EOr°Œ•žx|íœbˆ³Wm~DVjºéNN†Ëܲɶ­GƒxŷCStŸ}]ûō•SmtuÇÃĕN•™āg»šíT«u}ç½BĵÞʣ¥ëÊ¡Mێ³ãȅ¡ƋaǩÈÉQ‰†G¢·lG|›„tvgrrf«†ptęŘnŠÅĢr„I²¯LiØsPf˜_vĠd„xM prʹšL¤‹¤‡eˌƒÀđK“žïÙVY§]I‡óáĥ]ķ†Kˆ¥Œj|pŇ\\kzţ¦šnņäÔVĂîĪ¬|vW’®l¤èØr‚˜•xm¶ă~lÄƯĄ̈́öȄEÔ¤ØQĄ–Ą»ƢjȦOǺ¨ìSŖÆƬy”Qœv`–cwƒZSÌ®ü±DŽ]ŀç¬B¬©ńzƺŷɄeeOĨS’Œfm Ċ‚ƀP̎ēz©Ċ‚ÄÕÊmgŸÇsJ¥ƔˆŊśæ’΁Ñqv¿íUOµª‰ÂnĦÁ_½ä@ê텣P}Ġ[@gġ}g“ɊדûÏWXá¢užƻÌsNͽƎÁ§č՛AēeL³àydl›¦ĘVçŁpśdžĽĺſʃQíÜçÛġԏsĕ¬—Ǹ¯YßċġHµ ¡eå`ļƒrĉŘóƢFì“ĎWøxÊk†”ƈdƬv|–I|·©NqńRŀƒ¤é”eŊœŀ›ˆàŀU²ŕƀB‚Q£Ď}L¹Îk@©ĈuǰųǨ”Ú§ƈnTËÇéƟÊcfčŤ^Xm‡—HĊĕË«W·ċëx³ǔķÐċJā‚wİ_ĸ˜Ȁ^ôWr­°oú¬Ħ…ŨK~”ȰCĐ´Ƕ£’fNÎèâw¢XnŮeÂÆĶŽ¾¾xäLĴĘlļO¤ÒĨA¢Êɚ¨®‚ØCÔ ŬGƠ”ƦYĜ‡ĘÜƬDJ—g_ͥœ@čŅĻA“¶¯@wÎqC½Ĉ»NŸăëK™ďÍQ“Ùƫ[«Ãí•gßÔÇOÝáW‘ñuZ“¯ĥ€Ÿŕā¡ÑķJu¤E Ÿå¯°WKɱ_d_}}vyŸõu¬ï¹ÓU±½@gÏ¿rýD‰†g…Cd‰µ—°MFYxw¿CG£‹Rƛ½Õ{]L§{qqąš¿BÇƻğëšܭNJË|c²}Fµ}›ÙRsÓpg±ŠQNqǫŋRwŕnéÑÉKŸ†«SeYR…ŋ‹@{¤SJ}šD Ûǖ֍Ÿ]gr¡µŷjqWÛham³~S«“„›Þ]' + ] + ], + encodeOffsets: [[[127123, 51780]], [[134456, 44547]]] + }, + properties: { + cp: [128.642464, 46.756967], + name: '黑龙江', + childNum: 2 + } + }, + { + id: '320000', + type: 'Feature', + geometry: { + type: 'Polygon', + coordinates: [ + '@@cþÅPiŠ`ZŸRu¥É\\]~°ŽY`µ†Óƒ^phÁbnÀşúŽòa–ĬºTÖŒb‚˜e¦¦€{¸ZâćNpŒ©žHr|^ˆmjhŠSEb\\afv`sz^lkŽlj‹Ätg‹¤D˜­¾Xš¿À’|ДiZ„ȀåB·î}GL¢õcßjaŸyBFµÏC^ĭ•cÙt¿sğH]j{s©HM¢ƒQnDÀ©DaÜތ·jgàiDbPufjDk`dPOîƒhw¡ĥ‡¥šG˜ŸP²ĐobºrY†„î¶aHŢ´ ]´‚rılw³r_{£DB_Ûdåuk|ˆŨ¯F Cºyr{XFy™e³Þċ‡¿Â™kĭB¿„MvÛpm`rÚã”@Ę¹hågËÖƿxnlč¶Åì½Ot¾dJlŠVJʜǀœŞqvnOŠ^ŸJ”Z‘ż·Q}ê͎ÅmµÒ]Žƍ¦Dq}¬R^èĂ´ŀĻĊIԒtžIJyQŐĠMNtœR®òLh‰›Ěs©»œ}OӌGZz¶A\\jĨFˆäOĤ˜HYš†JvÞHNiÜaϚɖnFQlšNM¤ˆB´ĄNöɂtp–Ŭdf先‹qm¿QûŠùއÚb¤uŃJŴu»¹Ą•lȖħŴw̌ŵ²ǹǠ͛hĭłƕrçü±Y™xci‡tğ®jű¢KOķ•Coy`å®VTa­_Ā]ŐÝɞï²ʯÊ^]afYǸÃĆēĪȣJđ͍ôƋĝÄ͎ī‰çÛɈǥ£­ÛmY`ó£Z«§°Ó³QafusNıDž_k}¢m[ÝóDµ—¡RLčiXy‡ÅNïă¡¸iĔϑNÌŕoēdōîåŤûHcs}~Ûwbù¹£¦ÓCt‹OPrƒE^ÒoŠg™ĉIµžÛÅʹK…¤½phMŠü`o怆ŀ' + ], + encodeOffsets: [[121740, 32276]] + }, + properties: { + cp: [119.767413, 33.041544], + name: '江苏', + childNum: 1 + } + }, + { + id: '330000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + ['@@E^dQ]K'], + ['@@jX^j‡'], + ['@@sfŠbU‡'], + ['@@qP\\xz[ck'], + ['@@‘Rƒ¢‚FX}°[s_'], + ['@@Cbœ\\—}'], + ['@@e|v\\la{u'], + ['@@v~u}'], + ['@@QxÂF¯}'], + ['@@¹nŒvÞs¯o'], + ['@@rSkUEj'], + ['@@bi­ZŒP'], + ['@@p[}INf'], + ['@@À¿€'], + ['@@¹dnbŒ…'], + ['@@rSŸBnR'], + ['@@g~h}'], + ['@@FlEk'], + ['@@OdPc'], + ['@@v[u\\'], + ['@@FjâL~wyoo~›sµL–\\'], + ['@@¬e¹aNˆ'], + ['@@\\nÔ¡q]L³ë\\ÿ®ŒQ֎'], + ['@@ÊA­©[¬'], + ['@@KxŒv­'], + ['@@@hlIk]'], + ['@@pW{o||j'], + ['@@Md|_mC'], + ['@@¢…X£ÏylD¼XˆtH'], + ['@@hlÜ[LykAvyfw^Ež›¤'], + ['@@fp¤Mus“R'], + ['@@®_ma~•LÁ¬šZ'], + ['@@iM„xZ'], + ['@@ZcYd'], + ['@@Z~dOSo|A¿qZv'], + ['@@@`”EN¡v'], + ['@@|–TY{'], + ['@@@n@m'], + ['@@XWkCT\\'], + ['@@ºwšZRkĕWO¢'], + ['@@™X®±Grƪ\\ÔáXq{‹'], + ['@@ůTG°ĄLHm°UC‹'], + [ + '@@¤Ž€aÜx~}dtüGæţŎíĔcŖpMËВjē¢·ðĄÆMzˆjWKĎ¢Q¶˜À_꒔_Bı€i«pZ€gf€¤Nrq]§ĂN®«H±‡yƳí¾×ŸīàLłčŴǝĂíÀBŖÕªˆŠÁŖHŗʼnåqûõi¨hÜ·ƒñt»¹ýv_[«¸m‰YL¯‰Qª…mĉÅdMˆ•gÇjcº«•ęœ¬­K­´ƒB«Âącoċ\\xKd¡gěŧ«®á’[~ıxu·Å”KsËɏc¢Ù\\ĭƛëbf¹­ģSƒĜkáƉÔ­ĈZB{ŠaM‘µ‰fzʼnfåÂŧįƋǝÊĕġć£g³ne­ą»@­¦S®‚\\ßðCšh™iqªĭiAu‡A­µ”_W¥ƣO\\lċĢttC¨£t`ˆ™PZäuXßBs‡Ļyek€OđġĵHuXBšµ]׌‡­­\\›°®¬F¢¾pµ¼kŘó¬Wät’¸|@ž•L¨¸µr“ºù³Ù~§WI‹ŸZWŽ®’±Ð¨ÒÉx€`‰²pĜ•rOògtÁZ}þÙ]„’¡ŒŸFK‚wsPlU[}¦Rvn`hq¬\\”nQ´ĘRWb”‚_ rtČFI֊kŠŠĦPJ¶ÖÀÖJĈĄTĚòžC ²@Pú…Øzœ©PœCÈڜĒ±„hŖ‡l¬â~nm¨f©–iļ«m‡nt–u†ÖZÜÄj“ŠLŽ®E̜Fª²iÊxبžIÈhhst' + ], + ['@@o\\V’zRZ}y'], + ['@@†@°¡mۛGĕ¨§Ianá[ýƤjfæ‡ØL–•äGr™'] + ], + encodeOffsets: [ + [[125592, 31553]], + [[125785, 31436]], + [[125729, 31431]], + [[125513, 31380]], + [[125223, 30438]], + [[125115, 30114]], + [[124815, 29155]], + [[124419, 28746]], + [[124095, 28635]], + [[124005, 28609]], + [[125000, 30713]], + [[125111, 30698]], + [[125078, 30682]], + [[125150, 30684]], + [[124014, 28103]], + [[125008, 31331]], + [[125411, 31468]], + [[125329, 31479]], + [[125626, 30916]], + [[125417, 30956]], + [[125254, 30976]], + [[125199, 30997]], + [[125095, 31058]], + [[125083, 30915]], + [[124885, 31015]], + [[125218, 30798]], + [[124867, 30838]], + [[124755, 30788]], + [[124802, 30809]], + [[125267, 30657]], + [[125218, 30578]], + [[125200, 30562]], + [[124968, 30474]], + [[125167, 30396]], + [[124955, 29879]], + [[124714, 29781]], + [[124762, 29462]], + [[124325, 28754]], + [[123990, 28459]], + [[125366, 31477]], + [[125115, 30363]], + [[125369, 31139]], + [[122495, 31878]], + [[125329, 30690]], + [[125192, 30787]] + ] + }, + properties: { + cp: [120.153576, 29.287459], + name: '浙江', + childNum: 45 + } + }, + { + id: '340000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + ['@@^iuLX^'], + ['@@‚e©Ehl'], + [ + '@@°ZÆëϵmkǀwÌÕæhºgBĝâqÙĊz›ÖgņtÀÁÊÆá’hEz|WzqD¹€Ÿ°E‡ŧl{ævÜcA`¤C`|´qžxIJkq^³³ŸGšµbƒíZ…¹qpa±ď OH—¦™Ħˆx¢„gPícOl_iCveaOjCh߸i݋bÛªCC¿€m„RV§¢A|t^iĠGÀtÚs–d]ĮÐDE¶zAb àiödK¡~H¸íæAžǿYƒ“j{ď¿‘™À½W—®£ChŒÃsiŒkkly]_teu[bFa‰Tig‡n{]Gqªo‹ĈMYá|·¥f¥—őaSÕė™NµñĞ«ImŒ_m¿Âa]uĜp …Z_§{Cƒäg¤°r[_Yj‰ÆOdý“[ŽI[á·¥“Q_n‡ùgL¾mv™ˊBÜƶĊJhšp“c¹˜O]iŠ]œ¥ jtsggJǧw×jÉ©±›EFˍ­‰Ki”ÛÃÕYv…s•ˆm¬njĻª•§emná}k«ŕˆƒgđ²Ù›DǤ›í¡ªOy›†×Où±@DŸñSęćăÕIÕ¿IµĥO‰‰jNÕËT¡¿tNæŇàåyķrĕq§ÄĩsWÆߎF¶žX®¿‰mŒ™w…RIޓfßoG‘³¾©uyH‘į{Ɓħ¯AFnuP…ÍÔzšŒV—dàôº^Ðæd´€‡oG¤{S‰¬ćxã}›ŧ×Kǥĩ«žÕOEзÖdÖsƘѨ[’Û^Xr¢¼˜§xvěƵ`K”§ tÒ´Cvlo¸fzŨð¾NY´ı~ÉĔē…ßúLÃϖ_ÈÏ|]ÂÏFl”g`bšežž€n¾¢pU‚h~ƴĖ¶_‚r sĄ~cž”ƈ]|r c~`¼{À{ȒiJjz`îÀT¥Û³…]’u}›f…ïQl{skl“oNdŸjŸäËzDvčoQŠďHI¦rb“tHĔ~BmlRš—V_„ħTLnñH±’DžœL‘¼L˜ªl§Ťa¸ŒĚlK²€\\RòvDcÎJbt[¤€D@®hh~kt°ǾzÖ@¾ªdb„YhüóZ ň¶vHrľ\\ʗJuxAT|dmÀO„‹[ÃԋG·ĚąĐlŪÚpSJ¨ĸˆLvÞcPæķŨŽ®mАˆálŸwKhïgA¢ųƩޖ¤OȜm’°ŒK´' + ] + ], + encodeOffsets: [[[121722, 32278]], [[119475, 30423]], [[119168, 35472]]] + }, + properties: { + cp: [117.283042, 31.26119], + name: '安徽', + childNum: 3 + } + }, + { + id: '350000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + ['@@“zht´‡]'], + ['@@aj^~ĆG—©O'], + ['@@ed¨„C}}i'], + ['@@@vˆPGsQ'], + ['@@‰sBz‚ddW]Q'], + ['@@SŽ¨Q“{'], + ['@@NŽVucW'], + ['@@qptBAq'], + ['@@‰’¸[mu'], + ['@@Q\\pD]_'], + ['@@jSwUadpF'], + ['@@eXª~ƒ•'], + ['@@AjvFso'], + ['@@fT–›_Çí\\Ÿ™—v|ba¦jZÆy€°'], + ['@@IjJi'], + ['@@wJI€ˆxš«¼AoNe{M­'], + ['@@K‰±¡Óˆ”ČäeZ'], + [ + '@@k¡¹Eh~c®wBk‹UplÀ¡I•~Māe£bN¨gZý¡a±Öcp©PhžI”Ÿ¢Qq…ÇGj‹|¥U™ g[Ky¬ŏ–v@OpˆtÉEŸF„\\@ åA¬ˆV{Xģ‰ĐBy…cpě…¼³Ăp·¤ƒ¥o“hqqÚ¡ŅLsƒ^ᗞ§qlŸÀhH¨MCe»åÇGD¥zPO£čÙkJA¼ß–ėu›ĕeûҍiÁŧSW¥˜QŠûŗ½ùěcݧSùĩąSWó«íęACµ›eR—åǃRCÒÇZÍ¢‹ź±^dlsŒtjD¸•‚ZpužÔâÒH¾oLUêÃÔjjēò´ĄW‚ƛ…^Ñ¥‹ĦŸ@Çò–ŠmŒƒOw¡õyJ†yD}¢ďÑÈġfŠZd–a©º²z£šN–ƒjD°Ötj¶¬ZSÎ~¾c°¶Ðm˜x‚O¸¢Pl´žSL|¥žA†ȪĖM’ņIJg®áIJČĒü` ŽQF‡¬h|ÓJ@zµ |ê³È ¸UÖŬŬÀEttĸr‚]€˜ðŽM¤ĶIJHtÏ A’†žĬkvsq‡^aÎbvŒd–™fÊòSD€´Z^’xPsÞrv‹ƞŀ˜jJd×ŘÉ ®A–ΦĤd€xĆqAŒ†ZR”ÀMźŒnĊ»ŒİÐZ— YX–æJŠyĊ²ˆ·¶q§·–K@·{s‘Xãô«lŗ¶»o½E¡­«¢±¨Yˆ®Ø‹¶^A™vWĶGĒĢžPlzfˆļŽtàAvWYãšO_‡¤sD§ssČġ[kƤPX¦Ž`¶“ž®ˆBBvĪjv©šjx[L¥àï[F…¼ÍË»ğV`«•Ip™}ccÅĥZE‹ãoP…´B@ŠD—¸m±“z«Ƴ—¿å³BRضˆœWlâþäą`“]Z£Tc— ĹGµ¶H™m@_©—kŒ‰¾xĨ‡ôȉðX«½đCIbćqK³Á‹Äš¬OAwã»aLʼn‡ËĥW[“ÂGI—ÂNxij¤D¢ŽîĎÎB§°_JœGsƒ¥E@…¤uć…P‘å†cuMuw¢BI¿‡]zG¹guĮck\\_' + ] + ], + encodeOffsets: [ + [[123250, 27563]], + [[122541, 27268]], + [[123020, 27189]], + [[122916, 27125]], + [[122887, 26845]], + [[122808, 26762]], + [[122568, 25912]], + [[122778, 26197]], + [[122515, 26757]], + [[122816, 26587]], + [[123388, 27005]], + [[122450, 26243]], + [[122578, 25962]], + [[121255, 25103]], + [[120987, 24903]], + [[122339, 25802]], + [[121042, 25093]], + [[122439, 26024]] + ] + }, + properties: { + cp: [118.306239, 26.075302], + name: '福建', + childNum: 18 + } + }, + { + id: '360000', + type: 'Feature', + geometry: { + type: 'Polygon', + coordinates: [ + '@@ĢĨƐgļˆ¼ÂMD~ņªe^\\^§„ý©j׍cZ†Ø¨zdÒa¶ˆlҍJŒìõ`oz÷@¤u޸´†ôęöY¼‰HČƶajlÞƩ¥éZ[”|h}^U Œ ¥p„ĄžƦO lt¸Æ €Q\\€ŠaÆ|CnÂOjt­ĚĤd’ÈŒF`’¶„@Ð딠¦ōҞ¨Sêv†HĢûXD®…QgėWiØPÞìºr¤dž€NĠ¢l–•ĄtZoœCƞÔºCxrpĠV®Ê{f_Y`_ƒeq’’®Aot`@o‚DXfkp¨|Šs¬\\D‘ÄSfè©Hn¬…^DhÆyøJh“ØxĢĀLʈ„ƠPżċĄwȠ̦G®ǒĤäTŠÆ~ĦwŠ«|TF¡Šn€c³Ïå¹]ĉđxe{ÎӐ†vOEm°BƂĨİ|G’vz½ª´€H’àp”eJ݆Qšxn‹ÀŠW­žEµàXÅĪt¨ÃĖrÄwÀFÎ|ňÓMå¼ibµ¯»åDT±m[“r«_gŽmQu~¥V\\OkxtL E¢‹ƒ‘Ú^~ýê‹Pó–qo슱_Êw§ÑªåƗā¼‹mĉŹ‹¿NQ“…YB‹ąrwģcÍ¥B•Ÿ­ŗÊcØiI—žƝĿuŒqtāwO]‘³YCñTeɕš‹caub͈]trlu€ī…B‘ПGsĵıN£ï—^ķqss¿FūūV՟·´Ç{éĈý‰ÿ›OEˆR_ŸđûIċâJh­ŅıN‘ȩĕB…¦K{Tk³¡OP·wn—µÏd¯}½TÍ«YiµÕsC¯„iM•¤™­•¦¯P|ÿUHv“he¥oFTu‰õ\\ŽOSs‹MòđƇiaºćXŸĊĵà·çhƃ÷ǜ{‘ígu^›đg’m[×zkKN‘¶Õ»lčÓ{XSƉv©_ÈëJbVk„ĔVÀ¤P¾ºÈMÖxlò~ªÚàGĂ¢B„±’ÌŒK˜y’áV‡¼Ã~­…`g›ŸsÙfI›Ƌlę¹e|–~udjˆuTlXµf`¿JdŠ[\\˜„L‚‘²' + ], + encodeOffsets: [[116689, 26234]] + }, + properties: { + cp: [115.592151, 27.676493], + name: '江西', + childNum: 1 + } + }, + { + id: '370000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + ['@@Xjd]{K'], + ['@@itbFHy'], + ['@@HlGk'], + ['@@T‚ŒGŸy'], + ['@@K¬˜•‹U'], + ['@@WdXc'], + ['@@PtOs'], + ['@@•LnXhc'], + ['@@ppVƒu]Or'], + ['@@cdzAUa'], + ['@@udRhnCI‡'], + ['@@ˆoIƒpR„'], + [ + '@@Ľč{fzƤî’Kš–ÎMĮ]†—ZFˆ½Y]â£ph’™š¶¨râøÀ†ÎǨ¤^ºÄ”Gzˆ~grĚĜlĞƄLĆdž¢Îo¦–cv“Kb€gr°Wh”mZp ˆL]LºcU‰Æ­n”żĤÌĒœbAnrOAœ´žȊcÀbƦUØrĆUÜøœĬƞ†š˜Ez„VL®öØBkŖÝĐĖ¹ŧ̄±ÀbÎɜnb²ĦhņBĖ›žįĦåXćì@L¯´ywƕCéõė ƿ¸‘lµ¾Z|†ZWyFYŸ¨Mf~C¿`€à_RÇzwƌfQnny´INoƬˆèôº|sT„JUš›‚L„îVj„ǎ¾Ē؍‚Dz²XPn±ŴPè¸ŔLƔÜƺ_T‘üÃĤBBċȉöA´fa„˜M¨{«M`‡¶d¡ô‰Ö°šmȰBÔjjŒ´PM|”c^d¤u•ƒ¤Û´Œä«ƢfPk¶Môlˆ]Lb„}su^ke{lC‘…M•rDŠÇ­]NÑFsmoõľH‰yGă{{çrnÓE‰‹ƕZGª¹Fj¢ïW…uøCǷ돡ąuhÛ¡^Kx•C`C\\bÅxì²ĝÝ¿_N‰īCȽĿåB¥¢·IŖÕy\\‡¹kx‡Ã£Č×GDyÕ¤ÁçFQ¡„KtŵƋ]CgÏAùSed‡cÚź—ŠuYfƒyMmhUWpSyGwMPqŀ—›Á¼zK›¶†G•­Y§Ëƒ@–´śÇµƕBmœ@Io‚g——Z¯u‹TMx}C‘‰VK‚ï{éƵP—™_K«™pÛÙqċtkkù]gŽ‹Tğwo•ɁsMõ³ă‡AN£™MRkmEʕč™ÛbMjÝGu…IZ™—GPģ‡ãħE[iµBEuŸDPԛ~ª¼ętŠœ]ŒûG§€¡QMsğNPŏįzs£Ug{đJĿļā³]ç«Qr~¥CƎÑ^n¶ÆéÎR~Ż¸Y’I“] P‰umŝrƿ›‰›Iā‹[x‰edz‹L‘¯v¯s¬ÁY…~}…ťuŁŒg›ƋpÝĄ_ņī¶ÏSR´ÁP~ž¿Cyžċßdwk´Ss•X|t‰`Ä Èð€AªìÎT°¦Dd–€a^lĎDĶÚY°Ž`ĪŴǒˆ”àŠv\\ebŒZH„ŖR¬ŢƱùęO•ÑM­³FۃWp[ƒ' + ] + ], + encodeOffsets: [ + [[123806, 39303]], + [[123821, 39266]], + [[123742, 39256]], + [[123702, 39203]], + [[123649, 39066]], + [[123847, 38933]], + [[123580, 38839]], + [[123894, 37288]], + [[123043, 36624]], + [[123344, 38676]], + [[123522, 38857]], + [[123628, 38858]], + [[118260, 36742]] + ] + }, + properties: { + cp: [118.000923, 36.275807], + name: '山东', + childNum: 13 + } + }, + { + id: '410000', + type: 'Feature', + geometry: { + type: 'Polygon', + coordinates: [ + '@@•ýL™ùµP³swIÓxcŢĞð†´E®žÚPt†ĴXØx¶˜@«ŕŕQGƒ‹Yfa[şu“ßǩ™đš_X³ijÕčC]kbc•¥CS¯ëÍB©÷‹–³­Siˆ_}m˜YTtž³xlàcȂzÀD}ÂOQ³ÐTĨ¯†ƗòËŖ[hœł‹Ŧv~††}ÂZž«¤lPǕ£ªÝŴÅR§ØnhcŒtâk‡nύ­ľŹUÓÝdKuķ‡I§oTũÙďkęĆH¸ÓŒ\\ăŒ¿PcnS{wBIvɘĽ[GqµuŸŇôYgûƒZcaŽ©@½Õǽys¯}lgg@­C\\£as€IdÍuCQñ[L±ęk·‹ţb¨©kK—’»›KC²‘òGKmĨS`ƒ˜UQ™nk}AGē”sqaJ¥ĐGR‰ĎpCuÌy ã iMc”plk|tRk†ðœev~^‘´†¦ÜŽSí¿_iyjI|ȑ|¿_»d}qŸ^{“Ƈdă}Ÿtqµ`Ƴĕg}V¡om½fa™Ço³TTj¥„tĠ—Ry”K{ùÓjuµ{t}uËR‘iŸvGŠçJFjµŠÍyqΘàQÂFewixGw½Yŷpµú³XU›½ġy™łå‰kÚwZXˆ·l„¢Á¢K”zO„Λ΀jc¼htoDHr…|­J“½}JZ_¯iPq{tę½ĕ¦Zpĵø«kQ…Ťƒ]MÛfaQpě±ǽ¾]u­Fu‹÷nƒ™čįADp}AjmcEǒaª³o³ÆÍSƇĈÙDIzˑ赟^ˆKLœ—i—Þñ€[œƒaA²zz‰Ì÷Dœ|[šíijgf‚ÕÞd®|`ƒĆ~„oĠƑô³Ŋ‘D×°¯CsŠøÀ«ì‰UMhTº¨¸ǡîS–Ô„DruÂÇZ•ÖEŽ’vPZ„žW”~؋ÐtĄE¢¦Ðy¸bŠô´oŬ¬Ž²Ês~€€]®tªašpŎJ¨Öº„_ŠŔ–`’Ŗ^Ѝ\\Ĝu–”~m²Ƹ›¸fW‰ĦrƔ}Î^gjdfÔ¡J}\\n C˜¦þWxªJRÔŠu¬ĨĨmF†dM{\\d\\ŠYÊ¢ú@@¦ª²SŠÜsC–}fNècbpRmlØ^g„d¢aÒ¢CZˆZxvÆ¶N¿’¢T@€uCœ¬^ĊðÄn|žlGl’™Rjsp¢ED}€Fio~ÔNŽ‹„~zkĘHVsDzßjƒŬŒŠŢ`Pûàl¢˜\\ÀœEhŽİgÞē X¼Pk–„|m' + ], + encodeOffsets: [[118256, 37017]] + }, + properties: { + cp: [113.665412, 33.757975], + name: '河南', + childNum: 1 + } + }, + { + id: '420000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + ['@@AB‚'], + ['@@lskt'], + [ + '@@¾«}{ra®pîÃ\\™›{øCŠËyyB±„b\\›ò˜Ý˜jK›‡L ]ĎĽÌ’JyÚCƈćÎT´Å´pb©È‘dFin~BCo°BĎĚømvŒ®E^vǾ½Ĝ²Ro‚bÜeNŽ„^ĺ£R†¬lĶ÷YoĖ¥Ě¾|sOr°jY`~I”¾®I†{GqpCgyl{‡£œÍƒÍyPL“¡ƒ¡¸kW‡xYlÙ抚ŁĢzœ¾žV´W¶ùŸo¾ZHxjwfx„GNÁ•³Xéæl¶‰EièIH‰ u’jÌQ~v|sv¶Ôi|ú¢Fh˜Qsğ¦ƒSiŠBg™ÐE^ÁÐ{–čnOÂȞUÎóĔ†ÊēIJ}Z³½Mŧïeyp·uk³DsѨŸL“¶_œÅuèw»—€¡WqÜ]\\‘Ò§tƗcÕ¸ÕFÏǝĉăxŻČƟO‡ƒKÉġÿ×wg”÷IÅzCg†]m«ªGeçÃTC’«[‰t§{loWeC@ps_Bp‘­r‘„f_``Z|ei¡—oċMqow€¹DƝӛDYpûs•–‹Ykıǃ}s¥ç³[§ŸcYŠ§HK„«Qy‰]¢“wwö€¸ïx¼ņ¾Xv®ÇÀµRĠЋžHMž±cÏd„ƒǍũȅȷ±DSyúĝ£ŤĀàtÖÿï[îb\\}pĭÉI±Ñy…¿³x¯N‰o‰|¹H™ÏÛm‹júË~Tš•u˜ęjCöAwě¬R’đl¯ Ñb­‰ŇT†Ŀ_[Œ‘IčĄʿnM¦ğ\\É[T·™k¹œ©oĕ@A¾w•ya¥Y\\¥Âaz¯ãÁ¡k¥ne£Ûw†E©Êō¶˓uoj_Uƒ¡cF¹­[Wv“P©w—huÕyBF“ƒ`R‹qJUw\\i¡{jŸŸEPïÿ½fć…QÑÀQ{ž‚°‡fLԁ~wXg—ītêݾ–ĺ‘Hdˆ³fJd]‹HJ²…E€ƒoU¥†HhwQsƐ»Xmg±çve›]Dm͂PˆoCc¾‹_h”–høYrŊU¶eD°Č_N~øĹĚ·`z’]Äþp¼…äÌQŒv\\rCŒé¾TnkžŐڀÜa‡“¼ÝƆĢ¶Ûo…d…ĔňТJq’Pb ¾|JŒ¾fXŠƐîĨ_Z¯À}úƲ‹N_ĒĊ^„‘ĈaŐyp»CÇĕKŠšñL³ŠġMŒ²wrIÒŭxjb[œžn«øœ˜—æˆàƒ ^²­h¯Ú€ŐªÞ¸€Y²ĒVø}Ā^İ™´‚LŠÚm„¥ÀJÞ{JVŒųÞŃx×sxxƈē ģMř–ÚðòIf–Ċ“Œ\\Ʈ±ŒdʧĘD†vČ_Àæ~DŒċ´A®µ†¨ØLV¦êHÒ¤' + ] + ], + encodeOffsets: [[[113712, 34000]], [[115612, 30507]], [[113649, 34054]]] + }, + properties: { + cp: [113.298572, 30.684355], + name: '湖北', + childNum: 3 + } + }, + { + id: '430000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + ['@@—n„FTs'], + [ + '@@ßÅÆችÔXr—†CO™“…ËR‘ïÿĩ­TooQyšÓ[‹ŅBE¬–ÎÓXa„į§Ã¸G °ITxp‰úxÚij¥Ïš–Ģ¾ŠedžÄ©ĸG…œàGh‚€M¤–Â_U}Ċ}¢pczfŠþg¤€”ÇòAV‘‹M' + ], + [ + '@@©K—ƒA·³CQ±Á«³BUŠƑ¹AŠtćOw™D]ŒJiØSm¯b£‘ylƒ›X…HËѱH•«–‘C^õľA–Å§¤É¥„ïyuǙuA¢^{ÌC´­¦ŷJ£^[†“ª¿‡ĕ~•Ƈ…•N… skóā‡¹¿€ï]ă~÷O§­@—Vm¡‹Qđ¦¢Ĥ{ºjԏŽŒª¥nf´•~ÕoŸž×Ûą‹MąıuZœmZcÒ IJĪ²SÊDŽŶ¨ƚƒ’CÖŎªQؼrŭŽ­«}NÏürʬŒmjr€@ĘrTW ­SsdHzƓ^ÇÂyUi¯DÅYlŹu{hTœ}mĉ–¹¥ě‰Dÿë©ıÓ[Oº£ž“¥ót€ł¹MՄžƪƒ`Pš…Di–ÛUŠ¾Å‌ìˆU’ñB“È£ýhe‰dy¡oċ€`pfmjP~‚kZa…ZsÐd°wj§ƒ@€Ĵ®w~^‚kÀÅKvNmX\\¨a“”сqvíó¿F„¤¡@ũÑVw}S@j}¾«pĂr–ªg àÀ²NJ¶¶Dô…K‚|^ª†Ž°LX¾ŴäPĪ±œ£EXd›”^¶›IJÞܓ~‘u¸ǔ˜Ž›MRhsR…e†`ÄofIÔ\\Ø  i”ćymnú¨cj ¢»–GČìƊÿШXeĈĀ¾Oð Fi ¢|[jVxrIQŒ„_E”zAN¦zLU`œcªx”OTu RLÄ¢dV„i`p˔vŎµªÉžF~ƒØ€d¢ºgİàw¸Áb[¦Zb¦–z½xBĖ@ªpº›šlS¸Ö\\Ĕ[N¥ˀmĎă’J\\‹ŀ`€…ňSڊĖÁĐiO“Ĝ«BxDõĚiv—ž–S™Ì}iùŒžÜnšÐºGŠ{Šp°M´w†ÀÒzJ²ò¨ oTçüöoÛÿñŽőФ‚ùTz²CȆȸǎŪƒƑÐc°dPÎŸğ˶[Ƚu¯½WM¡­Éž“’B·rížnZŸÒ `‡¨GA¾\\pē˜XhÆRC­üWGġu…T靧Ŏѝ©ò³I±³}_‘‹EÃħg®ęisÁPDmÅ{‰b[Rşs·€kPŸŽƥƒóRo”O‹ŸVŸ~]{g\\“êYƪ¦kÝbiċƵŠGZ»Ěõ…ó·³vŝž£ø@pyö_‹ëŽIkѵ‡bcѧy…×dY؎ªiþž¨ƒ[]f]Ņ©C}ÁN‡»hĻħƏ’ĩ' + ] + ], + encodeOffsets: [[[115640, 30489]], [[112543, 27312]], [[116690, 26230]]] + }, + properties: { + cp: [111.782279, 28.09409], + name: '湖南', + childNum: 3 + } + }, + { + id: '440000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + ['@@QdˆAua'], + ['@@ƒlxDLo'], + ['@@sbhNLo'], + ['@@Ă āŸ'], + ['@@WltO[['], + ['@@Krœ]S'], + ['@@e„„I]y'], + ['@@I|„Mym'], + ['@@ƒÛ³LSŒž¼Y'], + ['@@nvºB–ëui©`¾'], + ['@@zdšÛ›Jw®'], + ['@@†°…¯'], + ['@@a yAª¸ËJIx،@€ĀHAmßV¡o•fu•o'], + ['@@šs‰ŗÃÔėAƁ›ZšÄ ~°ČP‚‹äh'], + ['@@‹¶Ý’Ì‚vmĞh­ı‡Q'], + ['@@HœŠdSjĒ¢D}war…“u«ZqadYM'], + ['@@elŒ\\LqqU'], + ['@@~rMo\\'], + ['@@f„^ƒC'], + ['@@øPªoj÷ÍÝħXČx”°Q¨ıXNv'], + ['@@gÇƳˆŽˆ”oˆŠˆ[~tly'], + ['@@E–ÆC¿‘'], + ['@@OŽP'], + [ + '@@w‹†đóg‰™ĝ—[³‹¡VÙæÅöM̳¹pÁaËýý©D©Ü“JŹƕģGą¤{Ùū…ǘO²«BƱéA—Ò‰ĥ‡¡«BhlmtÃPµyU¯uc“d·w_bŝcīímGOŽ|KP’ȏ‡ŹãŝIŕŭŕ@Óoo¿ē‹±ß}Ž…ŭ‚ŸIJWÈCőâUâǙI›ğʼn©I›ijEׅÁ”³Aó›wXJþ±ÌŒÜӔĨ£L]ĈÙƺZǾĆĖMĸĤfŒÎĵl•ŨnȈ‘ĐtF”Š–FĤ–‚êk¶œ^k°f¶gŠŽœ}®Fa˜f`vXŲxl˜„¦–ÔÁ²¬ÐŸ¦pqÊ̲ˆi€XŸØRDÎ}†Ä@ZĠ’s„x®AR~®ETtĄZ†–ƈfŠŠHâÒÐA†µ\\S¸„^wĖkRzŠalŽŜ|E¨ÈNĀňZTŒ’pBh£\\ŒĎƀuXĖtKL–¶G|Ž»ĺEļĞ~ÜĢÛĊrˆO˜Ùîvd]nˆ¬VœÊĜ°R֟pM††–‚ƂªFbwžEÀˆ˜©Œž\\…¤]ŸI®¥D³|ˎ]CöAŤ¦…æ’´¥¸Lv¼€•¢ĽBaô–F~—š®²GÌҐEY„„œzk¤’°ahlV՞I^‹šCxĈPŽsB‰ƒºV‰¸@¾ªR²ĨN]´_eavSi‡vc•}p}Đ¼ƌkJœÚe thœ†_¸ ºx±ò_xN›Ë‹²‘@ƒă¡ßH©Ùñ}wkNÕ¹ÇO½¿£ĕ]ly_WìIžÇª`ŠuTÅxYĒÖ¼k֞’µ‚MžjJÚwn\\h‘œĒv]îh|’È›Ƅøègž¸Ķß ĉĈWb¹ƀdéʌNTtP[ŠöSvrCZžžaGuœbo´ŖÒÇА~¡zCI…özx¢„Pn‹•‰Èñ @ŒĥÒ¦†]ƞŠV}³ăĔñiiÄÓVépKG½Ä‘ÓávYo–C·sit‹iaÀy„ŧΡÈYDÑům}‰ý|m[węõĉZÅxUO}÷N¹³ĉo_qtă“qwµŁYلǝŕ¹tïÛUïmRCº…ˆĭ|µ›ÕÊK™½R‘ē ó]‘–GªęAx–»HO£|ām‡¡diď×YïYWªʼnOeÚtĐ«zđ¹T…ā‡úE™á²\\‹ķÍ}jYàÙÆſ¿Çdğ·ùTßÇţʄ¡XgWÀLJğ·¿ÃˆOj YÇ÷Qě‹i' + ] + ], + encodeOffsets: [ + [[117381, 22988]], + [[116552, 22934]], + [[116790, 22617]], + [[116973, 22545]], + [[116444, 22536]], + [[116931, 22515]], + [[116496, 22490]], + [[116453, 22449]], + [[113301, 21439]], + [[118726, 21604]], + [[118709, 21486]], + [[113210, 20816]], + [[115482, 22082]], + [[113171, 21585]], + [[113199, 21590]], + [[115232, 22102]], + [[115739, 22373]], + [[115134, 22184]], + [[113056, 21175]], + [[119573, 21271]], + [[119957, 24020]], + [[115859, 22356]], + [[116561, 22649]], + [[116285, 22746]] + ] + }, + properties: { + cp: [113.280637, 23.125178], + name: '广东', + childNum: 24 + } + }, + { + id: '450000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + ['@@H– TQ§•A'], + [ + '@@ĨʪƒLƒƊDÎĹĐCǦė¸zÚGn£¾›rªŀÜt¬@֛ڈSx~øOŒ˜ŶÐÂæȠ\\„ÈÜObĖw^oބLf¬°bI lTØB̈F£Ć¹gñĤaY“t¿¤VSñœK¸¤nM†¼‚JE±„½¸šŠño‹ÜCƆæĪ^ŠĚQÖ¦^‡ˆˆf´Q†üÜʝz¯šlzUĺš@쇀p¶n]sxtx¶@„~ÒĂJb©gk‚{°‚~c°`ԙ¬rV\\“la¼¤ôá`¯¹LC†ÆbŒxEræO‚v[H­˜„[~|aB£ÖsºdAĐzNÂðsŽÞƔ…Ĥªbƒ–ab`ho¡³F«èVloŽ¤™ÔRzpp®SŽĪº¨ÖƒºN…ij„d`’a”¦¤F³ºDÎńĀìŠCžĜº¦Ċ•~nS›|gźvZkCÆj°zVÈÁƔ]LÊFZg…čP­kini«‹qǀcz͔Y®¬Ů»qR×ō©DՄ‘§ƙǃŵTÉĩ±ŸıdÑnYY›IJvNĆƌØÜ Öp–}e³¦m‹©iÓ|¹Ÿħņ›|ª¦QF¢Â¬ʖovg¿em‡^ucà÷gՎuŒíÙćĝ}FĻ¼Ĺ{µHK•sLSđƃr‹č¤[Ag‘oS‹ŇYMÿ§Ç{Fśbky‰lQxĕƒ]T·¶[B…ÑÏGáşşƇe€…•ăYSs­FQ}­Bƒw‘tYğÃ@~…C̀Q ×W‡j˱rÉ¥oÏ ±«ÓÂ¥•ƒ€k—ŽwWűŒmcih³K›~‰µh¯e]lµ›él•Eģ‰•E“ďs‡’mǖŧē`ãògK_ÛsUʝ“ćğ¶hŒöŒO¤Ǜn³Žc‘`¡y‹¦C‘ez€YŠwa™–‘[ďĵűMę§]X˜Î_‚훘Û]é’ÛUćİÕBƣ±…dƒy¹T^džûÅÑŦ·‡PĻþÙ`K€¦˜…¢ÍeœĥR¿Œ³£[~Œäu¼dl‰t‚†W¸oRM¢ď\\zœ}Æzdvň–{ÎXF¶°Â_„ÒÂÏL©Ö•TmuŸ¼ãl‰›īkiqéfA„·Êµ\\őDc¥ÝF“y›Ôć˜c€űH_hL܋êĺШc}rn`½„Ì@¸¶ªVLŒŠhŒ‹\\•Ţĺk~ŽĠið°|gŒtTĭĸ^x‘vK˜VGréAé‘bUu›MJ‰VÃO¡…qĂXËS‰ģãlýàŸ_ju‡YÛÒB†œG^˜é֊¶§ŽƒEG”ÅzěƒƯ¤Ek‡N[kdåucé¬dnYpAyČ{`]þ¯T’bÜÈk‚¡Ġ•vŒàh„ÂƄ¢J' + ] + ], + encodeOffsets: [[[111707, 21520]], [[107619, 25527]]] + }, + properties: { + cp: [108.320004, 22.82402], + name: '广西', + childNum: 2 + } + }, + { + id: '460000', + type: 'Feature', + geometry: { + type: 'Polygon', + coordinates: [ + '@@š¦Ŝil¢”XƦ‘ƞò–ïè§ŞCêɕrŧůÇąĻõ™·ĉ³œ̅kÇm@ċȧƒŧĥ‰Ľʉ­ƅſ“ȓÒ˦ŝE}ºƑ[ÍĜȋ gÎfǐÏĤ¨êƺ\\Ɔ¸ĠĎvʄȀœÐ¾jNðĀÒRŒšZdž™zÐŘΰH¨Ƣb²_Ġ ' + ], + encodeOffsets: [[112750, 20508]] + }, + properties: { + cp: [109.83119, 19.031971], + name: '海南', + childNum: 1 + } + }, + { + id: '510000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + ['@@LqKr'], + [ + '@@Š[ĻéV£ž_ţġñpG •réÏ·~ąSfy×͂·ºſƽiÍıƣıĻmHH}siaX@iÇ°ÁÃ×t«ƒ­Tƒ¤J–JJŒyJ•ÈŠ`Ohߦ¡uËhIyCjmÿw…ZG……Ti‹SˆsO‰žB²ŸfNmsPaˆ{M{ŠõE‘^Hj}gYpaeuž¯‘oáwHjÁ½M¡pM“–uå‡mni{fk”\\oƒÎqCw†EZ¼K›ĝŠƒAy{m÷L‡wO×SimRI¯rK™õBS«sFe‡]fµ¢óY_ÆPRcue°Cbo׌bd£ŌIHgtrnyPt¦foaXďx›lBowz‹_{ÊéWiêE„GhܸºuFĈIxf®Ž•Y½ĀǙ]¤EyŸF²ċ’w¸¿@g¢§RGv»–áŸW`ÃĵJwi]t¥wO­½a[׈]`Ãi­üL€¦LabbTÀå’c}Íh™Æhˆ‹®BH€î|Ék­¤S†y£„ia©taį·Ɖ`ō¥Uh“O…ƒĝLk}©Fos‰´›Jm„µlŁu—…ø–nÑJWΪ–YÀïAetTžŅ‚ӍG™Ë«bo‰{ıwodƟ½ƒžOġܑµxàNÖ¾P²§HKv¾–]|•B‡ÆåoZ`¡Ø`ÀmºĠ~ÌЧnDž¿¤]wğ@sƒ‰rğu‰~‘Io”[é±¹ ¿žſđӉ@q‹gˆ¹zƱřaí°KtǤV»Ã[ĩǭƑ^ÇÓ@ỗs›Zϕ‹œÅĭ€Ƌ•ěpwDóÖሯneQˌq·•GCœýS]xŸ·ý‹q³•O՜Œ¶Qzßti{ř‰áÍÇWŝŭñzÇW‹pç¿JŒ™‚Xœĩè½cŒF–ÂLiVjx}\\N†ŇĖ¥Ge–“JA¼ÄHfÈu~¸Æ«dE³ÉMA|b˜Ò…˜ćhG¬CM‚õŠ„ƤąAvƒüV€éŀ‰_V̳ĐwQj´·ZeÈÁ¨X´Æ¡Qu·»Ÿ“˜ÕZ³ġqDo‰y`L¬gdp°şŠp¦ėìÅĮZŽ°Iä”h‚‘ˆzŠĵœf²å ›ĚрKp‹IN|‹„Ñz]ń……·FU×é»R³™MƒÉ»GM«€ki€™ér™}Ã`¹ăÞmȝnÁîRǀ³ĜoİzŔwǶVÚ£À]ɜ»ĆlƂ²Ġ…þTº·àUȞÏʦ¶†I’«dĽĢdĬ¿–»Ĕ׊h\\c¬†ä²GêëĤł¥ÀǿżÃÆMº}BÕĢyFVvw–ˆxBèĻĒ©Ĉ“tCĢɽŠȣ¦āæ·HĽî“ôNԓ~^¤Ɗœu„œ^s¼{TA¼ø°¢İªDè¾Ň¶ÝJ‘®Z´ğ~Sn|ªWÚ©òzPOȸ‚bð¢|‹øĞŠŒœŒQìÛÐ@Ğ™ǎRS¤Á§d…i“´ezÝúØã]Hq„kIŸþËQǦÃsǤ[E¬ÉŪÍxXƒ·ÖƁİlƞ¹ª¹|XÊwn‘ÆƄmÀêErĒtD®ċæcQƒ”E®³^ĭ¥©l}äQto˜ŖÜqƎkµ–„ªÔĻĴ¡@Ċ°B²Èw^^RsºTĀ£ŚæœQP‘JvÄz„^Đ¹Æ¯fLà´GC²‘dt˜­ĀRt¼¤ĦOðğfÔðDŨŁĞƘïžPȆ®âbMüÀXZ ¸£@Ś›»»QÉ­™]d“sÖ×_͖_ÌêŮPrĔĐÕGĂeZÜîĘqBhtO ¤tE[h|Y‹Ô‚ZśÎs´xº±UŒ’ñˆt|O’ĩĠºNbgþŠJy^dÂY Į„]Řz¦gC‚³€R`ĀŠz’¢AjŒ¸CL„¤RÆ»@­Ŏk\\Ç´£YW}z@Z}‰Ã¶“oû¶]´^N‡Ò}èN‚ª–P˜Íy¹`S°´†ATe€VamdUĐwʄvĮÕ\\ƒu‹Æŗ¨Yp¹àZÂm™Wh{á„}WØǍ•Éüw™ga§áCNęÎ[ĀÕĪgÖɪX˜øx¬½Ů¦¦[€—„NΆL€ÜUÖ´òrÙŠxR^–†J˜k„ijnDX{Uƒ~ET{ļº¦PZc”jF²Ė@Žp˜g€ˆ¨“B{ƒu¨ŦyhoÚD®¯¢˜ WòàFΤ¨GDäz¦kŮPœġq˚¥À]€Ÿ˜eŽâÚ´ªKxī„Pˆ—Ö|æ[xäJÞĥ‚s’NÖ½ž€I†¬nĨY´®Ð—ƐŠ€mD™ŝuäđđEb…e’e_™v¡}ìęNJē}q”É埁T¯µRs¡M@}ůa†a­¯wvƉåZwž\\Z{åû^›' + ] + ], + encodeOffsets: [[[108815, 30935]], [[110617, 31811]]] + }, + properties: { + cp: [104.065735, 30.659462], + name: '四川', + childNum: 2 + } + }, + { + id: '520000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + ['@@†G\\†lY£‘in'], + ['@@q‚|ˆ‚mc¯tχVSÎ'], + [ + '@@hÑ£Is‡NgßH†›HªķÃh_¹ƒ¡ĝħń¦uيùŽgS¯JHŸ|sÝÅtÁïyMDč»eÕtA¤{b\\}—ƒG®u\\åPFq‹wÅaD…žK°ºâ_£ùbµ”mÁ‹ÛœĹM[q|hlaªāI}тƒµ@swtwm^oµˆD鼊yV™ky°ÉžûÛR…³‚‡eˆ‡¥]RՋěħ[ƅåÛDpŒ”J„iV™™‰ÂF²I…»mN·£›LbÒYb—WsÀbŽ™pki™TZĄă¶HŒq`……ĥ_JŸ¯ae«ƒKpÝx]aĕÛPƒÇȟ[ÁåŵÏő—÷Pw}‡TœÙ@Õs«ĿÛq©½œm¤ÙH·yǥĘĉBµĨÕnđ]K„©„œá‹ŸG纍§Õßg‡ǗĦTèƤƺ{¶ÉHÎd¾ŚÊ·OÐjXWrãLyzÉAL¾ę¢bĶėy_qMĔąro¼hĊžw¶øV¤w”²Ĉ]ʚKx|`ź¦ÂÈdr„cȁbe¸›`I¼čTF´¼Óýȃr¹ÍJ©k_șl³´_pН`oÒhŽ¶pa‚^ÓĔ}D»^Xyœ`d˜[Kv…JPhèhCrĂĚÂ^Êƌ wˆZL­Ġ£šÁbrzOIl’MM”ĪŐžËr×ÎeŦŽtw|Œ¢mKjSǘňĂStÎŦEtqFT†¾†E쬬ôxÌO¢Ÿ KŠ³ŀºäY†„”PVgŎ¦Ŋm޼VZwVlŒ„z¤…ž£Tl®ctĽÚó{G­A‡ŒÇgeš~Αd¿æaSba¥KKûj®_ć^\\ؾbP®¦x^sxjĶI_Ä X‚⼕Hu¨Qh¡À@Ëô}Ž±žGNìĎlT¸ˆ…`V~R°tbÕĊ`¸úÛtπFDu€[ƒMfqGH·¥yA‰ztMFe|R‚_Gk†ChZeÚ°to˜v`x‹b„ŒDnÐ{E}šZ˜è€x—†NEފREn˜[Pv@{~rĆAB§‚EO¿|UZ~ì„Uf¨J²ĂÝƀ‚sª–B`„s¶œfvö¦ŠÕ~dÔq¨¸º»uù[[§´sb¤¢zþFœ¢Æ…Àhˆ™ÂˆW\\ıŽËI݊o±ĭŠ£þˆÊs}¡R]ŒěƒD‚g´VG¢‚j±®è†ºÃmpU[Á›‘Œëº°r›ÜbNu¸}Žº¼‡`ni”ºÔXĄ¤¼Ôdaµ€Á_À…†ftQQgœR—‘·Ǔ’v”}Ýלĵ]µœ“Wc¤F²›OĩųãW½¯K‚©…]€{†LóµCIµ±Mß¿hŸ•©āq¬o‚½ž~@i~TUxŪÒ¢@ƒ£ÀEîôruń‚”“‚b[§nWuMÆLl¿]x}ij­€½' + ] + ], + encodeOffsets: [[[112158, 27383]], [[112105, 27474]], [[112095, 27476]]] + }, + properties: { + cp: [106.713478, 26.578343], + name: '贵州', + childNum: 3 + } + }, + { + id: '530000', + type: 'Feature', + geometry: { + type: 'Polygon', + coordinates: [ + '@@[„ùx½}ÑRH‘YīĺûsÍn‘iEoã½Ya²ė{c¬ĝg•ĂsA•ØÅwď‚õzFjw}—«Dx¿}UũlŸê™@•HÅ­F‰¨ÇoJ´Ónũuą¡Ã¢pÒŌ“Ø TF²‚xa²ËX€‚cʋlHîAßËŁkŻƑŷÉ©h™W­æßU‡“Ës¡¦}•teèƶStǀÇ}Fd£j‹ĈZĆÆ‹¤T‚č\\Dƒ}O÷š£Uˆ§~ŃG™‚åŃDĝ¸œTsd¶¶Bªš¤u¢ŌĎo~t¾ÍŶÒtD¦Ú„iôö‰€z›ØX²ghįh½Û±¯€ÿm·zR¦Ɵ`ªŊÃh¢rOԍ´£Ym¼èêf¯ŪĽn„†cÚbŒw\\zlvWžªâˆ ¦g–mĿBş£¢ƹřbĥkǫßeeZkÙIKueT»sVesb‘aĕ  ¶®dNœĄÄpªyŽ¼—„³BE˜®l‡ŽGœŭCœǶwêżĔÂe„pÍÀQƞpC„–¼ŲÈ­AÎô¶R„ä’Q^Øu¬°š_Èôc´¹ò¨P΢hlϦ´Ħ“Æ´sâDŽŲPnÊD^¯°’Upv†}®BP̪–jǬx–Söwlfòªv€qĸ|`H€­viļ€ndĜ­Ćhň•‚em·FyށqóžSį¯‘³X_ĞçêtryvL¤§z„¦c¦¥jnŞk˜ˆlD¤øz½ĜàžĂŧMÅ|áƆàÊcðÂF܎‚áŢ¥\\\\º™İøÒÐJĴ‡„îD¦zK²ǏÎEh~’CD­hMn^ÌöÄ©ČZÀžaü„fɭyœpį´ěFűk]Ôě¢qlÅĆÙa¶~Äqššê€ljN¬¼H„ÊšNQ´ê¼VظE††^ŃÒyŒƒM{ŒJLoÒœęæŸe±Ķ›y‰’‡gã“¯JYÆĭĘëo¥Š‰o¯hcK«z_pŠrC´ĢÖY”—¼ v¸¢RŽÅW³Â§fǸYi³xR´ďUˊ`êĿU„û€uĆBƒƣö‰N€DH«Ĉg†——Ñ‚aB{ÊNF´¬c·Åv}eÇÃGB»”If•¦HňĕM…~[iwjUÁKE•Ž‹¾dĪçW›šI‹èÀŒoÈXòyŞŮÈXâÎŚŠj|àsRy‹µÖ›–Pr´þŒ ¸^wþTDŔ–Hr¸‹žRÌmf‡żÕâCôox–ĜƌÆĮŒ›Ð–œY˜tâŦÔ@]ÈǮƒ\\Ī¼Ä£UsȯLbîƲŚºyh‡rŒŠ@ĒԝƀŸÀ²º\\êp“’JŠ}ĠvŠqt„Ġ@^xÀ£È†¨mËÏğ}n¹_¿¢×Y_æpˆÅ–A^{½•Lu¨GO±Õ½ßM¶w’ÁĢۂP‚›Ƣ¼pcIJxŠ|ap̬HšÐŒŊSfsðBZ¿©“XÏÒK•k†÷Eû¿‰S…rEFsÕūk”óVǥʼniTL‚¡n{‹uxţÏh™ôŝ¬ğōN“‘NJkyPaq™Âğ¤K®‡YŸxÉƋÁ]āęDqçgOg†ILu—\\_gz—]W¼ž~CÔē]bµogpў_oď`´³Țkl`IªºÎȄqÔþž»E³ĎSJ»œ_f·‚adÇqƒÇc¥Á_Źw{™L^ɱćx“U£µ÷xgĉp»ĆqNē`rĘzaĵĚ¡K½ÊBzyäKXqiWPÏɸ½řÍcÊG|µƕƣG˛÷Ÿk°_^ý|_zċBZocmø¯hhcæ\\lˆMFlư£Ĝ„ÆyH“„F¨‰µêÕ]—›HA…àӄ^it `þßäkŠĤÎT~Wlÿ¨„ÔPzUC–NVv [jâôDôď[}ž‰z¿–msSh‹¯{jïğl}šĹ[–őŒ‰gK‹©U·µË@¾ƒm_~q¡f¹…ÅË^»‘f³ø}Q•„¡Ö˳gͱ^ǁ…\\ëÃA_—¿bW›Ï[¶ƛ鏝£F{īZgm@|kHǭƁć¦UĔťƒ×ë}ǝƒeďºȡȘÏíBə£āĘPªij¶“ʼnÿ‡y©n‰ď£G¹¡I›Š±LÉĺÑdĉ܇W¥˜‰}g˜Á†{aqÃ¥aŠıęÏZ—ï`' + ], + encodeOffsets: [[104636, 22969]] + }, + properties: { + cp: [101.512251, 24.740609], + name: '云南', + childNum: 1 + } + }, + { + id: '540000', + type: 'Feature', + geometry: { + type: 'Polygon', + coordinates: [ + '@@hžľxŽŖ‰xƒÒVŽ†ºÅâAĪÝȆµę¯Ňa±r_w~uSÕň‘qOj]ɄQ…£Z……UDûoY’»©M[‹L¼qãË{V͕çWViŽ]ë©Ä÷àyƛh›ÚU°ŒŒa”d„cQƒ~Mx¥™cc¡ÙaSyF—ցk­ŒuRýq¿Ôµ•QĽ³aG{¿FµëªéĜÿª@¬·–K‰·àariĕĀ«V»Ŷ™Ĵū˜gèLǴŇƶaf‹tŒèBŚ£^Šâ†ǐÝ®–šM¦ÁǞÿ¬LhŸŽJ¾óƾƺcxw‹f]Y…´ƒ¦|œQLn°aœdĊ…œ\\¨o’œǀÍŎœ´ĩĀd`tÊQŞŕ|‚¨C^©œĈ¦„¦ÎJĊ{ŽëĎjª²rЉšl`¼Ą[t|¦St辉PŒÜK¸€d˜Ƅı]s¤—î_v¹ÎVòŦj˜£Əsc—¬_Ğ´|Ł˜¦AvŽ¦w`ăaÝaa­¢e¤ı²©ªSªšÈMĄwžÉØŔì@T‘¤—Ę™\\õª@”þo´­xA s”ÂtŎKzó´ÇĊµ¢rž^nĊ­Æ¬×üGž¢‚³ {âĊ]š™G‚~bÀgVjzlhǶf€žOšfdŠ‰ªB]pj„•TO–tĊ‚n¤}®¦ƒČ¥d¢¼»ddš”Y¼Žt—¢eȤJ¤}Ǿ¡°§¤AГlc@ĝ”sªćļđAç‡wx•UuzEÖġ~AN¹ÄÅȀŻ¦¿ģŁéì±H…ãd«g[؉¼ēÀ•cīľġ¬cJ‘µ…ÐʥVȝ¸ßS¹†ý±ğkƁ¼ą^ɛ¤Ûÿ‰b[}¬ōõÃ]ËNm®g@•Bg}ÍF±ǐyL¥íCˆƒIij€Ï÷њį[¹¦[⚍EÛïÁÉdƅß{âNÆāŨߝ¾ě÷yC£‡k­´ÓH@¹†TZ¥¢įƒ·ÌAЧ®—Zc…v½ŸZ­¹|ŕWZqgW“|ieZÅYVӁqdq•bc²R@†c‡¥Rã»Ge†ŸeƃīQ•}J[ғK…¬Ə|o’ėjġĠÑN¡ð¯EBčnwôɍėªƒ²•CλŹġǝʅįĭạ̃ūȹ]ΓͧgšsgȽóϧµǛ†ęgſ¶ҍć`ĘąŌJޚä¤rÅň¥ÖÁUětęuůÞiĊÄÀ\\Æs¦ÓRb|Â^řÌkÄŷ¶½÷‡f±iMݑ›‰@ĥ°G¬ÃM¥n£Øą‚ğ¯ß”§aëbéüÑOčœk£{\\‘eµª×M‘šÉfm«Ƒ{Å׃Gŏǩãy³©WÑăû‚··‘Q—òı}¯ã‰I•éÕÂZ¨īès¶ZÈsŽæĔTŘvŽgÌsN@îá¾ó@‰˜ÙwU±ÉT廣TđŸWxq¹Zo‘b‹s[׌¯cĩv‡Œėŧ³BM|¹k‰ªħ—¥TzNYnݍßpęrñĠĉRS~½ŠěVVŠµ‚õ‡«ŒM££µB•ĉ¥áºae~³AuĐh`Ü³ç@BۘïĿa©|z²Ý¼D”£àč²‹ŸƒIƒû›I ā€óK¥}rÝ_Á´éMaň¨€~ªSĈ½Ž½KÙóĿeƃÆBŽ·¬ën×W|Uº}LJrƳ˜lŒµ`bÔ`QˆˆÐÓ@s¬ñIŒÍ@ûws¡åQÑßÁ`ŋĴ{Ī“T•ÚÅTSij‚‹Yo|Ç[ǾµMW¢ĭiÕØ¿@˜šMh…pÕ]j†éò¿OƇĆƇp€êĉâlØw–ěsˆǩ‚ĵ¸c…bU¹ř¨WavquSMzeo_^gsÏ·¥Ó@~¯¿RiīB™Š\\”qTGªÇĜçPoŠÿfñòą¦óQīÈáP•œābß{ƒZŗĸIæńhnszÁCËìñšÏ·ąĚÝUm®ó­L·ăU›Èíoù´Êj°ŁŤ_uµ^‘°Œìǖ@tĶĒ¡Æ‡M³Ģ«˜İĨÅ®ğ†RŽāð“ggheÆ¢z‚Ê©Ô\\°ÝĎz~ź¤Pn–MĪÖB£Ÿk™n鄧żćŠ˜ĆK„Ē°¼L¶è‰âz¨u¦¥LDĘz¬ýÎmĘd¾ß”Fz“hg²™Fy¦ĝ¤ċņbΛ@y‚Ąæm°NĮZRÖíŽJ²öLĸÒ¨Y®ƌÐV‰à˜tt_ڀÂyĠzž]Ţh€zĎ{†ĢX”ˆc|šÐqŽšfO¢¤ög‚ÌHNŽ„PKŖœŽ˜Uú´xx[xˆvĐCûĀŠìÖT¬¸^}Ìsòd´_Ž‡KgžLĴ…ÀBon|H@–Êx˜—¦BpŰˆŌ¿fµƌA¾zLjRxŠ¶F”œkĄźRzŀˆ~¶[”´Hnª–VƞuĒ­È¨ƎcƽÌm¸ÁÈM¦x͊ëÀxdžB’šú^´W†£–d„kɾĬpœw‚˂ØɦļĬIŚœÊ•n›Ŕa¸™~J°î”lɌxĤÊÈðhÌ®‚g˜T´øŽàCˆŽÀ^ªerrƘdž¢İP|Ė ŸWœªĦ^¶´ÂL„aT±üWƜ˜ǀRšŶUńšĖ[QhlLüA†‹Ü\\†qR›Ą©' + ], + encodeOffsets: [[90849, 37210]] + }, + properties: { + cp: [89.132212, 30.860361], + name: '西藏', + childNum: 1 + } + }, + { + id: '610000', + type: 'Feature', + geometry: { + type: 'Polygon', + coordinates: [ + '@@˜p¢—ȮµšûG™Ħ}Ħšðǚ¶òƄ€jɂz°{ºØkÈęâ¦jª‚Bg‚\\œċ°s¬Ž’]jžú ‚E”Ȍdž¬s„t‡”RˆÆdĠݎwܔ¸ôW¾ƮłÒ_{’Ìšû¼„jº¹¢GǪÒ¯ĘƒZ`ºŊƒecņąš~BÂgzpâēòYǠȰÌTΨÂWœ|fcŸă§uF—Œ@NŸ¢XLƒŠRMº[ğȣſï|¥J™kc`sʼnǷ’Y¹‹W@µ÷K…ãï³ÛIcñ·VȋڍÒķø©—þ¥ƒy‚ÓŸğęmWµÎumZyOŅƟĥÓ~sÑL¤µaŅY¦ocyZ{‰y c]{ŒTa©ƒ`U_Ěē£ωÊƍKù’K¶ȱÝƷ§{û»ÅÁȹÍéuij|¹cÑd‘ŠìUYƒŽO‘uF–ÕÈYvÁCqӃT•Ǣí§·S¹NgŠV¬ë÷Át‡°Dد’C´ʼnƒópģ}„ċcE˅FŸŸéGU¥×K…§­¶³B‹Č}C¿åċ`wġB·¤őcƭ²ő[Å^axwQO…ÿEËߌ•ĤNĔŸwƇˆÄŠńwĪ­Šo[„_KÓª³“ÙnK‰Çƒěœÿ]ď€ă_d©·©Ýŏ°Ù®g]±„Ÿ‡ß˜å›—¬÷m\\›iaǑkěX{¢|ZKlçhLt€Ňîŵ€œè[€É@ƉĄEœ‡tƇÏ˜³­ħZ«mJ…›×¾‘MtÝĦ£IwÄå\\Õ{‡˜ƒOwĬ©LÙ³ÙgBƕŀr̛ĢŭO¥lãyC§HÍ£ßEñŸX¡—­°ÙCgpťz‘ˆb`wI„vA|§”‡—hoĕ@E±“iYd¥OĻ¹S|}F@¾oAO²{tfžÜ—¢Fǂ҈W²°BĤh^Wx{@„¬‚­F¸¡„ķn£P|ŸªĴ@^ĠĈæb–Ôc¶l˜Yi…–^Mi˜cĎ°Â[ä€vï¶gv@À“Ĭ·lJ¸sn|¼u~a]’ÆÈtŌºJp’ƒþ£KKf~Š¦UbyäIšĺãn‡Ô¿^­žŵMT–hĠܤko¼Ŏìąǜh`[tŒRd²IJ_œXPrɲ‰l‘‚XžiL§àƒ–¹ŽH˜°Ȧqº®QC—bA†„ŌJ¸ĕÚ³ĺ§ `d¨YjžiZvRĺ±öVKkjGȊĐePОZmļKÀ€‚[ŠŽ`ösìh†ïÎoĬdtKÞ{¬èÒÒBŒÔpIJÇĬJŊ¦±J«ˆY§‹@·pH€µàåVKe›pW†ftsAÅqC·¬ko«pHÆuK@oŸHĆۄķhx“e‘n›S³àǍrqƶRbzy€¸ËАl›¼EºpĤ¼Œx¼½~Ğ’”à@†ÚüdK^ˆmÌSj' + ], + encodeOffsets: [[110234, 38774]] + }, + properties: { + cp: [108.948024, 34.263161], + name: '陕西', + childNum: 1 + } + }, + { + id: '620000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + ['@@VuUv'], + [ + '@@ũ‹EĠtt~nkh`Q‰¦ÅÄÜdw˜Ab×ĠąJˆ¤DüègĺqBqœj°lI¡ĨÒ¤úSHbš‡ŠjΑBŠ°aZˆ¢KJŽ’O[|A£žDx}Nì•HUnrk„ kp€¼Y kMJn[aG‚áÚÏ[½rc†}aQxOgsPMnUs‡nc‹Z…ž–sKúvA›t„Þġ’£®ĀYKdnFwš¢JE°”Latf`¼h¬we|€Æ‡šbj}GA€·~WŽ”—`†¢MC¤tL©IJ°qdf”O‚“bÞĬ¹ttu`^ZúE`Œ[@„Æsîz®¡’C„ƳƜG²“R‘¢R’m”fŽwĸg܃‚ą G@pzJM½mŠhVy¸uÈÔO±¨{LfæU¶ßGĂq\\ª¬‡²I‚¥IʼnÈīoı‹ÓÑAçÑ|«LÝcspīðÍg…të_õ‰\\ĉñLYnĝg’ŸRǡÁiHLlõUĹ²uQjYi§Z_c¨Ÿ´ĹĖÙ·ŋI…ƒaBD˜­R¹ȥr—¯G•ºß„K¨jWk’ɱŠOq›Wij\\a­‹Q\\sg_ĆǛōëp»£lğۀgS•ŶN®À]ˆÓäm™ĹãJaz¥V}‰Le¤L„ýo‘¹IsŋÅÇ^‘Žbz…³tmEÁ´aŠ¹cčecÇN•ĊãÁ\\č¯—dNj•]j†—ZµkÓda•ćå]ğij@ ©O{¤ĸm¢ƒE·®ƒ«|@Xwg]Aģ±¯‡XǁÑdzªc›wQÚŝñsÕ³ÛV_ýƒ˜¥\\ů¥©¾÷w—Ž©WÕÊĩhÿÖÁRo¸V¬âDb¨šhûx–Ê×nj~Zâƒg|šXÁnßYoº§ZÅŘvŒ[„ĭÖʃuďxcVbnUSf…B¯³_Tzº—ΕO©çMÑ~Mˆ³]µ^püµ”ŠÄY~y@X~¤Z³€[Èōl@®Å¼£QKƒ·Di‹¡By‘ÿ‰Q_´D¥hŗyƒ^ŸĭÁZ]cIzý‰ah¹MĪğP‘s{ò‡‹‘²Vw¹t³Ŝˁ[ŽÑ}X\\gsFŸ£sPAgěp×ëfYHāďÖqēŭOÏë“dLü•\\iŒ”t^c®šRʺ¶—¢H°mˆ‘rYŸ£BŸ¹čIoľu¶uI]vģSQ{ƒUŻ”Å}QÂ|̋°ƅ¤ĩŪU ęĄžÌZҞ\\v˜²PĔ»ƢNHƒĂyAmƂwVmž`”]ȏb•”H`‰Ì¢²ILvĜ—H®¤Dlt_„¢JJÄämèÔDëþgºƫ™”aʎÌrêYi~ ÎݤNpÀA¾Ĕ¼b…ð÷’Žˆ‡®‚”üs”zMzÖĖQdȨý†v§Tè|ªH’þa¸|šÐ ƒwKĢx¦ivr^ÿ ¸l öæfƟĴ·PJv}n\\h¹¶v†·À|\\ƁĚN´Ĝ€çèÁz]ġ¤²¨QÒŨTIl‡ªťØ}¼˗ƦvÄùØE‹’«Fï˛Iq”ōŒTvāÜŏ‚íÛߜÛV—j³âwGăÂíNOŠˆŠPìyV³ʼnĖýZso§HіiYw[߆\\X¦¥c]ÔƩÜ·«j‡ÐqvÁ¦m^ċ±R™¦΋ƈťĚgÀ»IïĨʗƮŽ°Ɲ˜ĻþÍAƉſ±tÍEÕÞāNU͗¡\\ſčåÒʻĘm ƭÌŹöʥ’ëQ¤µ­ÇcƕªoIýˆ‰Iɐ_mkl³ă‰Ɠ¦j—¡Yz•Ňi–}Msßõ–īʋ —}ƒÁVmŸ_[n}eı­Uĥ¼‘ª•I{ΧDӜƻėoj‘qYhĹT©oūĶ£]ďxĩ‹ǑMĝ‰q`B´ƃ˺Ч—ç~™²ņj@”¥@đ´ί}ĥtPńǾV¬ufӃÉC‹tÓ̻‰…¹£G³€]ƖƾŎĪŪĘ̖¨ʈĢƂlɘ۪üºňUðǜȢƢż̌ȦǼ‚ĤŊɲĖ­Kq´ï¦—ºĒDzņɾªǀÞĈĂD†½ĄĎÌŗĞrôñnŽœN¼â¾ʄľԆ|DŽŽ֦ज़ȗlj̘̭ɺƅêgV̍ʆĠ·ÌĊv|ýĖÕWĊǎÞ´õ¼cÒÒBĢ͢UĜð͒s¨ňƃLĉÕÝ@ɛƯ÷¿Ľ­ĹeȏijëCȚDŲyê×Ŗyò¯ļcÂßY…tÁƤyAã˾J@ǝrý‹‰@¤…rz¸oP¹ɐÚyᐇHŸĀ[Jw…cVeȴϜ»ÈŽĖ}ƒŰŐèȭǢόĀƪÈŶë;Ñ̆ȤМľĮEŔ—ĹŊũ~ËUă{ŸĻƹɁύȩþĽvĽƓÉ@ē„ĽɲßǐƫʾǗĒpäWÐxnsÀ^ƆwW©¦cÅ¡Ji§vúF¶Ž¨c~c¼īŒeXǚ‹\\đ¾JŽwÀďksãA‹fÕ¦L}wa‚o”Z’‹D½†Ml«]eÒÅaɲáo½FõÛ]ĻÒ¡wYR£¢rvÓ®y®LF‹LzĈ„ôe]gx}•|KK}xklL]c¦£fRtív¦†PĤoH{tK' + ] + ], + encodeOffsets: [[[108619, 36299]], [[108589, 36341]]] + }, + properties: { + cp: [103.823557, 36.058039], + name: '甘肃', + childNum: 2 + } + }, + { + id: '630000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + ['@@InJm'], + [ + '@@CƒÆ½OŃĦsΰ~Ē³¦@@“Ņiš±è}ؘƄ˹A³r_ĞŠǒNĪŒĐw¤^ŬĵªpĺSZg’rpiƼĘԛ¨C|͖J’©Ħ»®VIJ~f\\m `Un„˜~ʌŸ•ĬàöNt•~ňjy–¢Zi˜Ɣ¥ĄŠk´nl`JʇŠJþ©pdƖ®È£¶ìRʦ‘źõƮËnŸʼėæÑƀĎ[‚˜¢VÎĂMÖÝÎF²sƊƀÎBļýƞ—¯ʘƭðħ¼Jh¿ŦęΌƇš¥²Q]Č¥nuÂÏriˆ¸¬ƪÛ^Ó¦d€¥[Wà…x\\ZŽjҕ¨GtpþYŊĕ´€zUO뇉P‰îMĄÁxH´á˜iÜUà›îÜՁĂÛSuŎ‹r“œJð̬EŒ‘FÁú×uÃÎkr“Ē{V}İ«O_ÌËĬ©ŽÓŧSRѱ§Ģ£^ÂyèçěM³Ƃę{[¸¿u…ºµ[gt£¸OƤĿéYŸõ·kĀŸq]juw¥Dĩƍ€õÇPéĽG‘ž©ã‡¤G…uȧþRcÕĕNy“yût“ˆ­‡ø‘†ï»a½ē¿BMoį£ŸÍj}éZËqbʍš“Ƭh¹ìÿÓAçãnIáI`ƒks£CG­ě˜Uy×Cy•…’Ÿ@¶ʡÊBnāzG„ơMē¼±O÷õJËĚăVŸĪũƆ£Œ¯{ËL½Ìzż“„VR|ĠTbuvJvµhĻĖH”Aëáa…­OÇðñęNw‡…œľ·L›mI±íĠĩPÉ×®ÿs—’cB³±JKßĊ«`…ađ»·QAmO’‘Vţéÿ¤¹SQt]]Çx€±¯A@ĉij¢Óļ©•ƒl¶ÅÛr—ŕspãRk~¦ª]Į­´“FR„åd­ČsCqđéFn¿Åƃm’Éx{W©ºƝºįkÕƂƑ¸wWūЩÈFž£\\tÈ¥ÄRÈýÌJ ƒlGr^×äùyÞ³fj”c†€¨£ÂZ|ǓMĝšÏ@ëÜőR‹›ĝ‰Œ÷¡{aïȷPu°ËXÙ{©TmĠ}Y³’­ÞIňµç½©C¡į÷¯B»|St»›]vƒųƒs»”}MÓ ÿʪƟǭA¡fs˜»PY¼c¡»¦c„ċ­¥£~msĉP•–Siƒ^o©A‰Šec‚™PeǵŽkg‚yUi¿h}aH™šĉ^|ᴟ¡HØûÅ«ĉ®]m€¡qĉ¶³ÈyôōLÁst“BŸ®wn±ă¥HSòėš£˜S’ë@לÊăxÇN©™©T±ª£IJ¡fb®ÞbŽb_Ą¥xu¥B—ž{łĝ³«`d˜Ɛt—¤ťiñžÍUuºí`£˜^tƃIJc—·ÛLO‹½Šsç¥Ts{ă\\_»™kϊ±q©čiìĉ|ÍIƒ¥ć¥›€]ª§D{ŝŖÉR_sÿc³Īō›ƿΑ›§p›[ĉ†›c¯bKm›R¥{³„Z†e^ŽŒwx¹dƽŽôIg §Mĕ ƹĴ¿—ǣÜ̓]‹Ý–]snåA{‹eŒƭ`ǻŊĿ\\ijŬű”YÂÿ¬jĖqŽßbŠ¸•L«¸©@ěĀ©ê¶ìÀEH|´bRľž–Ó¶rÀQþ‹vl®Õ‚E˜TzÜdb ˜hw¤{LR„ƒd“c‹b¯‹ÙVgœ‚ƜßzÃô쮍^jUèXΖ|UäÌ»rKŽ\\ŒªN‘¼pZCü†VY††¤ɃRi^rPҒTÖ}|br°qňbĚ°ªiƶGQ¾²„x¦PœmlŜ‘[Ĥ¡ΞsĦŸÔÏâ\\ªÚŒU\\f…¢N²§x|¤§„xĔsZPòʛ²SÐqF`ª„VƒÞŜĶƨVZŒÌL`ˆ¢dŐIqr\\oäõ–F礻Ŷ×h¹]Clـ\\¦ďÌį¬řtTӺƙgQÇÓHţĒ”´ÃbEÄlbʔC”|CˆŮˆk„Ʈ[ʼ¬ňœ´KŮÈΰÌĪ¶ƶlð”ļA†TUvdTŠG†º̼ŠÔ€ŒsÊDԄveOg' + ] + ], + encodeOffsets: [[[105308, 37219]], [[95370, 40081]]] + }, + properties: { + cp: [96.778916, 35.623178], + name: '青海', + childNum: 2 + } + }, + { + id: '640000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + [ + '@@KëÀęĞ«OęȿȕŸı]ʼn¡åįÕÔ«Ǵõƪ™ĚQÐZhv K°›öqÀѐS[ÃÖHƖčË‡nL]ûc…Ùß@‚“ĝ‘¾}w»»‹oģF¹œ»kÌÏ·{zPƒ§B­¢íyÅt@ƒ@áš]Yv_ssģ¼i߁”ĻL¾ġsKD£¡N_…“˜X¸}B~Haiˆ™Åf{«x»ge_bs“KF¯¡Ix™mELcÿZ¤­Ģ‘ƒÝœsuBLù•t†ŒYdˆmVtNmtOPhRw~bd…¾qÐ\\âÙH\\bImlNZŸ»loƒŸqlVm–Gā§~QCw¤™{A\\‘PKŸNY‡¯bF‡kC¥’sk‹Šs_Ã\\ă«¢ħkJi¯r›rAhĹûç£CU‡ĕĊ_ԗBixÅُĄnªÑaM~ħpOu¥sîeQ¥¤^dkKwlL~{L~–hw^‚ófćƒKyEŒ­K­zuÔ¡qQ¤xZÑ¢^ļöܾEpž±âbÊÑÆ^fk¬…NC¾‘Œ“YpxbK~¥Že֎ŒäBlt¿Đx½I[ĒǙŒWž‹f»Ĭ}d§dµùEuj¨‚IÆ¢¥dXªƅx¿]mtÏwßRĶŒX¢͎vÆzƂZò®ǢÌʆCrâºMÞzžÆMҔÊÓŊZľ–r°Î®Ȉmª²ĈUªĚøºˆĮ¦ÌĘk„^FłĬhĚiĀĖ¾iİbjÕ' + ], + ['@@mfwěwMrŢªv@G‰'] + ], + encodeOffsets: [[[109366, 40242]], [[108600, 36303]]] + }, + properties: { + cp: [106.278179, 37.26637], + name: '宁夏', + childNum: 2 + } + }, + { + id: '650000', + type: 'Feature', + geometry: { + type: 'Polygon', + coordinates: [ + '@@QØĔ²X¨”~ǘBºjʐßØvK”ƔX¨vĊOžÃƒ·¢i@~c—‡ĝe_«”Eš“}QxgɪëÏÃ@sÅyXoŖ{ô«ŸuX…ê•Îf`œC‚¹ÂÿÐGĮÕĞXŪōŸMźÈƺQèĽôe|¿ƸJR¤ĘEjcUóº¯Ĩ_ŘÁMª÷Ð¥Oéȇ¿ÖğǤǷÂF҇zÉx[]­Ĥĝ‰œ¦EP}ûƥé¿İƷTėƫœŕƅ™ƱB»Đ±’ēO…¦E–•}‘`cȺrĦáŖuҞª«IJ‡πdƺÏØZƴwʄ¤ĖGЙǂZĶƒèH¶}ÚZצʥĪï|ÇĦMŔ»İĝLj‹ì¥Βœba­¯¥ǕǚkĆŵĦɑĺƯxūД̵nơʃĽá½M»›òmqóŘĝč˾ăC…ćāƿÝɽ©DZŅ¹đ¥˜³ðLrÁ®ɱĕģʼnǻ̋ȥơŻǛȡVï¹Ň۩ûkɗġƁ§ʇė̕ĩũƽō^ƕŠUv£ƁQï“Ƶkŏ½ΉÃŭdzLқʻ«ƭ\\lƒ‡ŭD‡“{ʓDkaFÃÄa“³ŤđÔGRÈƚhSӹŚsİ«ĐË[¥ÚDkº^Øg¼ŵ¸£EÍö•€ůʼnT¡c_‡ËKY‹ƧUśĵ„݃U_©rETÏʜ±OñtYwē¨ƒ{£¨uM³x½şL©Ùá[ÓÐĥ Νtģ¢\\‚ś’nkO›w¥±ƒT»ƷFɯàĩÞáB¹Æ…ÑUw„੍žĽw[“mG½Èå~‡Æ÷QyŠěCFmĭZī—ŵVÁ™ƿQƛ—ûXS²‰b½KϽĉS›©ŷXĕŸ{ŽĕK·¥Ɨcqq©f¿]‡ßDõU³h—­gËÇïģÉɋw“k¯í}I·šœbmœÉ–ř›īJɥĻˁ×xo›ɹī‡l•c…¤³Xù]‘™DžA¿w͉ì¥wÇN·ÂËnƾƍdǧđ®Ɲv•Um©³G\\“}µĿ‡QyŹl㓛µEw‰LJQ½yƋBe¶ŋÀů‡ož¥A—˜Éw@•{Gpm¿Aij†ŽKLhˆ³`ñcËtW‚±»ÕS‰ëüÿďD‡u\\wwwù³—V›LŕƒOMËGh£õP¡™er™Ïd{“‡ġWÁ…č|yšg^ğyÁzÙs`—s|ÉåªÇ}m¢Ń¨`x¥’ù^•}ƒÌ¥H«‰Yªƅ”Aйn~ź¯šf¤áÀz„gŠÇDIԝ´AňĀ҄¶ûEYospõD[{ù°]u›Jq•U•|Soċxţ[õÔĥkŋÞŭZ˺óYËüċrw €ÞkrťË¿XGÉbřaDü·Ē÷Aê[Ää€I®BÕИÞ_¢āĠpŠÛÄȉĖġDKwbm‡ÄNô‡ŠfœƫVÉvi†dz—H‘‹QµâFšù­Âœ³¦{YGžƒd¢ĚÜO „€{Ö¦ÞÍÀPŒ^b–ƾŠlŽ[„vt×ĈÍE˨¡Đ~´î¸ùÎh€uè`¸ŸHÕŔVºwĠââWò‡@{œÙNÝ´ə²ȕn{¿¥{l—÷eé^e’ďˆXj©î\\ªÑò˜Üìc\\üqˆÕ[Č¡xoÂċªbØ­Œø|€¶ȴZdÆšońéŒGš\\”¼C°ÌƁn´nxšÊOĨ’Ūƴĸ¢¸òTxÊǪMīИÖŲÃɎOvˆʦƢ~FŽ‡Rěò—¿ġ~åŊœú‰Nšžš¸qŽ’Ę[Ĕ¶ÂćnÒPĒÜvúĀÊbÖ{Äî¸~Ŕünp¤ÂH¾œĄYÒ©ÊfºmԈĘcDoĬMŬ’˜S¤„s²‚”ʘچžȂVŦ –ŽèW°ªB|IJXŔþÈJĦÆæFĚêŠYĂªĂ]øªŖNÞüA€’fɨJ€˜¯ÎrDDšĤ€`€mz\\„§~D¬{vJÂ˜«lµĂb–¤p€ŌŰNĄ¨ĊXW|ų ¿¾ɄĦƐMT”‡òP˜÷fØĶK¢ȝ˔Sô¹òEð­”`Ɩ½ǒÂň×äı–§ĤƝ§C~¡‚hlå‚ǺŦŞkâ’~}ŽFøàIJaĞ‚fƠ¥Ž„Ŕdž˜®U¸ˆźXœv¢aƆúŪtŠųƠjd•ƺŠƺÅìnrh\\ĺ¯äɝĦ]èpĄ¦´LƞĬŠ´ƤǬ˼Ēɸ¤rºǼ²¨zÌPðŀbþ¹ļD¢¹œ\\ĜÑŚŸ¶ZƄ³àjĨoâŠȴLʉȮŒĐ­ĚăŽÀêZǚŐ¤qȂ\\L¢ŌİfÆs|zºeªÙæ§΢{Ā´ƐÚ¬¨Ĵà²łhʺKÞºÖTŠiƢ¾ªì°`öøu®Ê¾ãØ' + ], + encodeOffsets: [[88824, 50096]] + }, + properties: { + cp: [85.617733, 40.792818], + name: '新疆', + childNum: 1 + } + }, + { + id: '110000', + type: 'Feature', + geometry: { + type: 'Polygon', + coordinates: [ + '@@ĽOÁ›ûtŷmiÍt_H»Ĩ±d`Š¹­{bw…Yr“³S]§§o¹€qGtm_Sŧ€“oa›‹FLg‘QN_•dV€@Zom_ć\\ߚc±x¯oœRcfe…£’o§ËgToÛJíĔóu…|wP¤™XnO¢ÉˆŦ¯rNÄā¤zâŖÈRpŢZŠœÚ{GŠrFt¦Òx§ø¹RóäV¤XdˆżâºWbwŚ¨Ud®bêņ¾‘jnŎGŃŶŠnzÚSeîĜZczî¾i]͜™QaúÍÔiþĩȨWĢ‹ü|Ėu[qb[swP@ÅğP¿{\\‡¥A¨Ï‘Ѩj¯ŠX\\¯œMK‘pA³[H…īu}}' + ], + encodeOffsets: [[120023, 41045]] + }, + properties: { + cp: [116.405285, 39.904989], + name: '北京', + childNum: 1 + } + }, + { + id: '120000', + type: 'Feature', + geometry: { + type: 'Polygon', + coordinates: [ + '@@ŬgX§Ü«E…¶Ḟ“¬O_™ïlÁg“z±AXe™µÄĵ{¶]gitgšIj·›¥îakS€‰¨ÐƎk}ĕ{gB—qGf{¿a†U^fI“ư‹³õ{YƒıëNĿžk©ïËZŏ‘R§òoY×Ógc…ĥs¡bġ«@dekąI[nlPqCnp{ˆō³°`{PNdƗqSÄĻNNâyj]äžÒD ĬH°Æ]~¡HO¾ŒX}ÐxŒgp“gWˆrDGˆŒpù‚Š^L‚ˆrzWxˆZ^¨´T\\|~@I‰zƒ–bĤ‹œjeĊªz£®Ĕvě€L†mV¾Ô_ȔNW~zbĬvG†²ZmDM~”~' + ], + encodeOffsets: [[120237, 41215]] + }, + properties: { + cp: [117.190182, 39.125596], + name: '天津', + childNum: 1 + } + }, + { + id: '310000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + ['@@ɧư¬EpƸÁxc‡'], + ['@@©„ªƒ'], + ['@@”MA‹‘š'], + ['@@Qp݁E§ÉC¾'], + ['@@bŝՕÕEȣÚƥêImɇǦèÜĠŒÚžÃƌÃ͎ó'], + ['@@ǜûȬɋŠŭ™×^‰sYŒɍDŋ‘ŽąñCG²«ªč@h–_p¯A{‡oloY€¬j@IJ`•gQڛhr|ǀ^MIJvtbe´R¯Ô¬¨YŽô¤r]ì†Ƭį'] + ], + encodeOffsets: [ + [[124702, 32062]], + [[124547, 32200]], + [[124808, 31991]], + [[124726, 32110]], + [[124903, 32376]], + [[124438, 32149]] + ] + }, + properties: { + cp: [121.472644, 31.231706], + name: '上海', + childNum: 6 + } + }, + { + id: '500000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + [ + '@@vjG~nGŘŬĶȂƀƾ¹¸ØÎezĆT¸}êЖqHŸðqĖ䒊¥^CƒIj–²p…\\_ æüY|[YxƊæuž°xb®…Űb@~¢NQt°¶‚S栓Ê~rljĔëĚ¢~šuf`‘‚†fa‚ĔJåĊ„nÖ]„jƎćÊ@Š£¾a®£Ű{ŶĕF‹ègLk{Y|¡ĜWƔtƬJÑxq‹±ĢN´‰òK‰™–LÈüD|s`ŋ’ć]ƒÃ‰`đŒMûƱ½~Y°ħ`ƏíW‰½eI‹½{aŸ‘OIrÏ¡ĕŇa†p†µÜƅġ‘œ^ÖÛbÙŽŏml½S‹êqDu[R‹ãË»†ÿw`»y‘¸_ĺę}÷`M¯ċfCVµqʼn÷Z•gg“Œ`d½pDO‡ÎCnœ^uf²ènh¼WtƏxRGg¦…pV„†FI±ŽG^ŒIc´ec‡’G•ĹÞ½sëĬ„h˜xW‚}Kӈe­Xsbk”F¦›L‘ØgTkïƵNï¶}Gy“w\\oñ¡nmĈzjŸ•@™Óc£»Wă¹Ój“_m»ˆ¹·~MvÛaqœ»­‰êœ’\\ÂoVnŽÓØ͙²«‹bq¿efE „€‹Ĝ^Qž~ Évý‡ş¤²Į‰pEİ}zcĺƒL‹½‡š¿gņ›¡ýE¡ya£³t\\¨\\vú»¼§·Ñr_oÒý¥u‚•_n»_ƒ•At©Þűā§IVeëƒY}{VPÀFA¨ąB}q@|Ou—\\Fm‰QF݅Mw˜å}]•€|FmϋCaƒwŒu_p—¯sfÙgY…DHl`{QEfNysBŠ¦zG¸rHe‚„N\\CvEsÐùÜ_·ÖĉsaQ¯€}_U‡†xÃđŠq›NH¬•Äd^ÝŰR¬ã°wećJEž·vÝ·Hgƒ‚éFXjÉê`|yŒpxkAwœWĐpb¥eOsmzwqChóUQl¥F^laf‹anòsr›EvfQdÁUVf—ÎvÜ^efˆtET¬ôA\\œ¢sJŽnQTjP؈xøK|nBz‰„œĞ»LY‚…FDxӄvr“[ehľš•vN”¢o¾NiÂxGp⬐z›bfZo~hGi’]öF|‰|Nb‡tOMn eA±ŠtPT‡LjpYQ|†SH††YĀxinzDJ€Ìg¢và¥Pg‰_–ÇzII‹€II•„£®S¬„Øs쐣ŒN' + ], + ['@@ifjN@s'] + ], + encodeOffsets: [[[109628, 30765]], [[111725, 31320]]] + }, + properties: { + cp: [107.304962, 29.533155], + name: '重庆', + childNum: 2 + } + }, + { + id: '810000', + type: 'Feature', + geometry: { + type: 'MultiPolygon', + coordinates: [ + ['@@AlBk'], + ['@@mŽn'], + ['@@EpFo'], + [ + '@@ea¢pl¸Eõ¹‡hj[ƒ]ÔCΖ@lj˜¡uBXŸ…•´‹AI¹…[‹yDUˆ]W`çwZkmc–…M›žp€Åv›}I‹oJlcaƒfёKŽ°ä¬XJmРđhI®æÔtSHn€Eˆ„ÒrÈc' + ], + ['@@rMUw‡AS®€e'] + ], + encodeOffsets: [ + [[117111, 23002]], + [[117072, 22876]], + [[117045, 22887]], + [[116975, 23082]], + [[116882, 22747]] + ] + }, + properties: { + cp: [114.173355, 22.320048], + name: '香港', + childNum: 5 + } + }, + { + id: '820000', + type: 'Feature', + geometry: { + type: 'Polygon', + coordinates: ['@@kÊd°å§s'], + encodeOffsets: [[116279, 22639]] + }, + properties: { + cp: [113.54909, 22.198951], + name: '澳门', + childNum: 1 + } + } + ], + UTF8Encoding: true +} diff --git a/examples/docs/resources/pc/demo/chart/pie/base.vue b/examples/docs/resources/pc/demo/chart/pie/base.vue new file mode 100644 index 000000000..51443e56f --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/pie/base.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/pie/demo2.vue b/examples/docs/resources/pc/demo/chart/pie/demo2.vue new file mode 100644 index 000000000..da321f4cd --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/pie/demo2.vue @@ -0,0 +1,35 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/pie/demo3.vue b/examples/docs/resources/pc/demo/chart/pie/demo3.vue new file mode 100644 index 000000000..5fb9dfc1c --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/pie/demo3.vue @@ -0,0 +1,34 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/pie/demo4.vue b/examples/docs/resources/pc/demo/chart/pie/demo4.vue new file mode 100644 index 000000000..c5aac50e6 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/pie/demo4.vue @@ -0,0 +1,34 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/pie/demo5.vue b/examples/docs/resources/pc/demo/chart/pie/demo5.vue new file mode 100644 index 000000000..56ad93b61 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/pie/demo5.vue @@ -0,0 +1,37 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/pie/demo6.vue b/examples/docs/resources/pc/demo/chart/pie/demo6.vue new file mode 100644 index 000000000..bfe599e53 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/pie/demo6.vue @@ -0,0 +1,34 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/pie/demo7.vue b/examples/docs/resources/pc/demo/chart/pie/demo7.vue new file mode 100644 index 000000000..5f0204ccb --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/pie/demo7.vue @@ -0,0 +1,35 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/props/base.vue b/examples/docs/resources/pc/demo/chart/props/base.vue new file mode 100644 index 000000000..65f566b92 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/props/base.vue @@ -0,0 +1,68 @@ + + + diff --git a/example/src/demo/pc/chart/props/demo10.vue b/examples/docs/resources/pc/demo/chart/props/demo10.vue similarity index 98% rename from example/src/demo/pc/chart/props/demo10.vue rename to examples/docs/resources/pc/demo/chart/props/demo10.vue index 38c7aeac5..ee6b270fb 100644 --- a/example/src/demo/pc/chart/props/demo10.vue +++ b/examples/docs/resources/pc/demo/chart/props/demo10.vue @@ -5,7 +5,7 @@ - + diff --git a/examples/docs/resources/pc/demo/chart/props/demo6.vue b/examples/docs/resources/pc/demo/chart/props/demo6.vue new file mode 100644 index 000000000..92ac3d877 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/props/demo6.vue @@ -0,0 +1,28 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/props/demo7.vue b/examples/docs/resources/pc/demo/chart/props/demo7.vue new file mode 100644 index 000000000..5b62f7646 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/props/demo7.vue @@ -0,0 +1,35 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/props/demo8.vue b/examples/docs/resources/pc/demo/chart/props/demo8.vue new file mode 100644 index 000000000..10a837747 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/props/demo8.vue @@ -0,0 +1,44 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/props/demo9.vue b/examples/docs/resources/pc/demo/chart/props/demo9.vue new file mode 100644 index 000000000..bb22f8dda --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/props/demo9.vue @@ -0,0 +1,41 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/question/base.vue b/examples/docs/resources/pc/demo/chart/question/base.vue new file mode 100644 index 000000000..0e0335e06 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/question/base.vue @@ -0,0 +1,53 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/question/demo2.vue b/examples/docs/resources/pc/demo/chart/question/demo2.vue new file mode 100644 index 000000000..6abf9cce2 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/question/demo2.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/question/demo3.vue b/examples/docs/resources/pc/demo/chart/question/demo3.vue new file mode 100644 index 000000000..6bf507689 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/question/demo3.vue @@ -0,0 +1,32 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/question/demo4.vue b/examples/docs/resources/pc/demo/chart/question/demo4.vue new file mode 100644 index 000000000..e406fdcc1 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/question/demo4.vue @@ -0,0 +1,40 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/question/demo5.vue b/examples/docs/resources/pc/demo/chart/question/demo5.vue new file mode 100644 index 000000000..58ef6b3cf --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/question/demo5.vue @@ -0,0 +1,53 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/radar/base.vue b/examples/docs/resources/pc/demo/chart/radar/base.vue new file mode 100644 index 000000000..bcd64b852 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/radar/base.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/radar/demo2.vue b/examples/docs/resources/pc/demo/chart/radar/demo2.vue new file mode 100644 index 000000000..6978d423c --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/radar/demo2.vue @@ -0,0 +1,36 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/radar/demo3.vue b/examples/docs/resources/pc/demo/chart/radar/demo3.vue new file mode 100644 index 000000000..d6fc928a9 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/radar/demo3.vue @@ -0,0 +1,39 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/ring/base.vue b/examples/docs/resources/pc/demo/chart/ring/base.vue new file mode 100644 index 000000000..8c74c6a17 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/ring/base.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/ring/demo2.vue b/examples/docs/resources/pc/demo/chart/ring/demo2.vue new file mode 100644 index 000000000..b81334092 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/ring/demo2.vue @@ -0,0 +1,35 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/ring/demo3.vue b/examples/docs/resources/pc/demo/chart/ring/demo3.vue new file mode 100644 index 000000000..fc69a8125 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/ring/demo3.vue @@ -0,0 +1,34 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/ring/demo4.vue b/examples/docs/resources/pc/demo/chart/ring/demo4.vue new file mode 100644 index 000000000..f673c8097 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/ring/demo4.vue @@ -0,0 +1,34 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/ring/demo5.vue b/examples/docs/resources/pc/demo/chart/ring/demo5.vue new file mode 100644 index 000000000..2dbf4ff3e --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/ring/demo5.vue @@ -0,0 +1,34 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/ring/demo6.vue b/examples/docs/resources/pc/demo/chart/ring/demo6.vue new file mode 100644 index 000000000..901db8f32 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/ring/demo6.vue @@ -0,0 +1,35 @@ + + + diff --git a/example/src/demo/pc/chart/ring/ring-title.vue b/examples/docs/resources/pc/demo/chart/ring/ring-title.vue similarity index 98% rename from example/src/demo/pc/chart/ring/ring-title.vue rename to examples/docs/resources/pc/demo/chart/ring/ring-title.vue index c642deb25..4a99b1672 100644 --- a/example/src/demo/pc/chart/ring/ring-title.vue +++ b/examples/docs/resources/pc/demo/chart/ring/ring-title.vue @@ -4,7 +4,7 @@ - diff --git a/examples/docs/resources/pc/demo/chart/sankey/demo2.vue b/examples/docs/resources/pc/demo/chart/sankey/demo2.vue new file mode 100644 index 000000000..c5f656e16 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/sankey/demo2.vue @@ -0,0 +1,43 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/scatter/base.vue b/examples/docs/resources/pc/demo/chart/scatter/base.vue new file mode 100644 index 000000000..daed8fa2d --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/scatter/base.vue @@ -0,0 +1,32 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/scatter/demo2.vue b/examples/docs/resources/pc/demo/chart/scatter/demo2.vue new file mode 100644 index 000000000..1273ae2a9 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/scatter/demo2.vue @@ -0,0 +1,50 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/scatter/demo3.vue b/examples/docs/resources/pc/demo/chart/scatter/demo3.vue new file mode 100644 index 000000000..16250dbe4 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/scatter/demo3.vue @@ -0,0 +1,53 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/scatter/demo4.vue b/examples/docs/resources/pc/demo/chart/scatter/demo4.vue new file mode 100644 index 000000000..05e117767 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/scatter/demo4.vue @@ -0,0 +1,56 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/scatter/demo5.vue b/examples/docs/resources/pc/demo/chart/scatter/demo5.vue new file mode 100644 index 000000000..dedbf82dc --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/scatter/demo5.vue @@ -0,0 +1,57 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/scatter/demo6.vue b/examples/docs/resources/pc/demo/chart/scatter/demo6.vue new file mode 100644 index 000000000..9ee75cf0d --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/scatter/demo6.vue @@ -0,0 +1,53 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/scatter/demo7.vue b/examples/docs/resources/pc/demo/chart/scatter/demo7.vue new file mode 100644 index 000000000..76f9710f4 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/scatter/demo7.vue @@ -0,0 +1,55 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/scatter/demo8.vue b/examples/docs/resources/pc/demo/chart/scatter/demo8.vue new file mode 100644 index 000000000..1757660e3 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/scatter/demo8.vue @@ -0,0 +1,44 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/sunburst/base.vue b/examples/docs/resources/pc/demo/chart/sunburst/base.vue new file mode 100644 index 000000000..d739cc603 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/sunburst/base.vue @@ -0,0 +1,296 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/sunburst/demo2.vue b/examples/docs/resources/pc/demo/chart/sunburst/demo2.vue new file mode 100644 index 000000000..8f17bfc2d --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/sunburst/demo2.vue @@ -0,0 +1,857 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/tree/base.vue b/examples/docs/resources/pc/demo/chart/tree/base.vue new file mode 100644 index 000000000..8340d6044 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/tree/base.vue @@ -0,0 +1,105 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/tree/demo2.vue b/examples/docs/resources/pc/demo/chart/tree/demo2.vue new file mode 100644 index 000000000..25d11a44c --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/tree/demo2.vue @@ -0,0 +1,125 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/tree/demo3.vue b/examples/docs/resources/pc/demo/chart/tree/demo3.vue new file mode 100644 index 000000000..e5a7e8952 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/tree/demo3.vue @@ -0,0 +1,112 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/tree/demo4.vue b/examples/docs/resources/pc/demo/chart/tree/demo4.vue new file mode 100644 index 000000000..0fe9115f3 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/tree/demo4.vue @@ -0,0 +1,112 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/tree/demo5.vue b/examples/docs/resources/pc/demo/chart/tree/demo5.vue new file mode 100644 index 000000000..89088ce99 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/tree/demo5.vue @@ -0,0 +1,122 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/waterfall/base.vue b/examples/docs/resources/pc/demo/chart/waterfall/base.vue new file mode 100644 index 000000000..1c79d9f21 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/waterfall/base.vue @@ -0,0 +1,28 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/waterfall/demo2.vue b/examples/docs/resources/pc/demo/chart/waterfall/demo2.vue new file mode 100644 index 000000000..7dd16bf7d --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/waterfall/demo2.vue @@ -0,0 +1,32 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/waterfall/demo3.vue b/examples/docs/resources/pc/demo/chart/waterfall/demo3.vue new file mode 100644 index 000000000..dad61d5df --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/waterfall/demo3.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/waterfall/demo4.vue b/examples/docs/resources/pc/demo/chart/waterfall/demo4.vue new file mode 100644 index 000000000..f0f0485d4 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/waterfall/demo4.vue @@ -0,0 +1,33 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/waterfall/demo5.vue b/examples/docs/resources/pc/demo/chart/waterfall/demo5.vue new file mode 100644 index 000000000..e574ac91a --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/waterfall/demo5.vue @@ -0,0 +1,33 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/wordcloud/base.vue b/examples/docs/resources/pc/demo/chart/wordcloud/base.vue new file mode 100644 index 000000000..66f36ae3c --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/wordcloud/base.vue @@ -0,0 +1,167 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/wordcloud/demo2.vue b/examples/docs/resources/pc/demo/chart/wordcloud/demo2.vue new file mode 100644 index 000000000..2b7c1513a --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/wordcloud/demo2.vue @@ -0,0 +1,170 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/wordcloud/demo3.vue b/examples/docs/resources/pc/demo/chart/wordcloud/demo3.vue new file mode 100644 index 000000000..6722bb85d --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/wordcloud/demo3.vue @@ -0,0 +1,170 @@ + + + diff --git a/examples/docs/resources/pc/demo/chart/wordcloud/demo4.vue b/examples/docs/resources/pc/demo/chart/wordcloud/demo4.vue new file mode 100644 index 000000000..99c04b8c4 --- /dev/null +++ b/examples/docs/resources/pc/demo/chart/wordcloud/demo4.vue @@ -0,0 +1,171 @@ + + + diff --git a/examples/docs/resources/pc/demo/checkbox/basic-usage.vue b/examples/docs/resources/pc/demo/checkbox/basic-usage.vue new file mode 100644 index 000000000..8fabc241d --- /dev/null +++ b/examples/docs/resources/pc/demo/checkbox/basic-usage.vue @@ -0,0 +1,18 @@ + + + diff --git a/example/src/demo/pc/checkbox/button-chek-box.vue b/examples/docs/resources/pc/demo/checkbox/button-chek-box.vue similarity index 96% rename from example/src/demo/pc/checkbox/button-chek-box.vue rename to examples/docs/resources/pc/demo/checkbox/button-chek-box.vue index ca92bdc97..fa1b8d057 100644 --- a/example/src/demo/pc/checkbox/button-chek-box.vue +++ b/examples/docs/resources/pc/demo/checkbox/button-chek-box.vue @@ -5,7 +5,7 @@ - diff --git a/examples/docs/resources/pc/demo/checkbox/indeterminate.vue b/examples/docs/resources/pc/demo/checkbox/indeterminate.vue new file mode 100644 index 000000000..f97a20c8a --- /dev/null +++ b/examples/docs/resources/pc/demo/checkbox/indeterminate.vue @@ -0,0 +1,45 @@ + + + diff --git a/examples/docs/resources/pc/demo/checkbox/min-max.vue b/examples/docs/resources/pc/demo/checkbox/min-max.vue new file mode 100644 index 000000000..3b1ff5ddf --- /dev/null +++ b/examples/docs/resources/pc/demo/checkbox/min-max.vue @@ -0,0 +1,24 @@ + + + diff --git a/examples/docs/resources/pc/demo/checkbox/text.vue b/examples/docs/resources/pc/demo/checkbox/text.vue new file mode 100644 index 000000000..f8a5b4bde --- /dev/null +++ b/examples/docs/resources/pc/demo/checkbox/text.vue @@ -0,0 +1,30 @@ + + + diff --git a/example/src/demo/pc/checkbox/vertical-checkbox.vue b/examples/docs/resources/pc/demo/checkbox/vertical-checkbox.vue similarity index 83% rename from example/src/demo/pc/checkbox/vertical-checkbox.vue rename to examples/docs/resources/pc/demo/checkbox/vertical-checkbox.vue index 99e6f7481..9c8630d0f 100644 --- a/example/src/demo/pc/checkbox/vertical-checkbox.vue +++ b/examples/docs/resources/pc/demo/checkbox/vertical-checkbox.vue @@ -1,10 +1,10 @@ - diff --git a/examples/docs/resources/pc/demo/col/base.vue b/examples/docs/resources/pc/demo/col/base.vue new file mode 100644 index 000000000..86cedb844 --- /dev/null +++ b/examples/docs/resources/pc/demo/col/base.vue @@ -0,0 +1,65 @@ + + + + + diff --git a/example/src/demo/pc/col/col-move.vue b/examples/docs/resources/pc/demo/col/col-move.vue similarity index 97% rename from example/src/demo/pc/col/col-move.vue rename to examples/docs/resources/pc/demo/col/col-move.vue index 09ada525d..6abc00420 100644 --- a/example/src/demo/pc/col/col-move.vue +++ b/examples/docs/resources/pc/demo/col/col-move.vue @@ -17,7 +17,7 @@ - + + diff --git a/example/src/demo/pc/col/tag.vue b/examples/docs/resources/pc/demo/col/tag.vue similarity index 97% rename from example/src/demo/pc/col/tag.vue rename to examples/docs/resources/pc/demo/col/tag.vue index adeb83bd6..71ea80626 100644 --- a/example/src/demo/pc/col/tag.vue +++ b/examples/docs/resources/pc/demo/col/tag.vue @@ -18,7 +18,7 @@ - diff --git a/examples/docs/resources/pc/demo/collapse/basic-usage.vue b/examples/docs/resources/pc/demo/collapse/basic-usage.vue new file mode 100644 index 000000000..283d47173 --- /dev/null +++ b/examples/docs/resources/pc/demo/collapse/basic-usage.vue @@ -0,0 +1,37 @@ + + + diff --git a/example/src/demo/pc/collapse/block-close.vue b/examples/docs/resources/pc/demo/collapse/block-close.vue similarity index 98% rename from example/src/demo/pc/collapse/block-close.vue rename to examples/docs/resources/pc/demo/collapse/block-close.vue index 6ca635ae6..8b7cabd04 100644 --- a/example/src/demo/pc/collapse/block-close.vue +++ b/examples/docs/resources/pc/demo/collapse/block-close.vue @@ -20,7 +20,7 @@ - diff --git a/example/src/demo/pc/collapse/nested-form.vue b/examples/docs/resources/pc/demo/collapse/nested-form.vue similarity index 97% rename from example/src/demo/pc/collapse/nested-form.vue rename to examples/docs/resources/pc/demo/collapse/nested-form.vue index d16f94da1..92eae13d3 100644 --- a/example/src/demo/pc/collapse/nested-form.vue +++ b/examples/docs/resources/pc/demo/collapse/nested-form.vue @@ -17,7 +17,7 @@ - + @@ -35,7 +35,7 @@ - diff --git a/examples/docs/resources/pc/demo/company/custom-service.vue b/examples/docs/resources/pc/demo/company/custom-service.vue new file mode 100644 index 000000000..41f7dbe93 --- /dev/null +++ b/examples/docs/resources/pc/demo/company/custom-service.vue @@ -0,0 +1,31 @@ + + + diff --git a/example/src/demo/pc/company/custom-show-num.vue b/examples/docs/resources/pc/demo/company/custom-show-num.vue similarity index 93% rename from example/src/demo/pc/company/custom-show-num.vue rename to examples/docs/resources/pc/demo/company/custom-show-num.vue index 261a8654e..5214dd72a 100644 --- a/example/src/demo/pc/company/custom-show-num.vue +++ b/examples/docs/resources/pc/demo/company/custom-show-num.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/components.js b/examples/docs/resources/pc/demo/components.js new file mode 100644 index 000000000..a4bf08321 --- /dev/null +++ b/examples/docs/resources/pc/demo/components.js @@ -0,0 +1,955 @@ +export default { + alert: { + Attributes: { + closable: 'closable', + description: 'description', + type: 'type', + icon: 'icon', + size: 'size', + title: 'title', + center: 'center', + 'show-icon': 'show-icon', + 'close-text': 'close-text' + }, + Events: { + close: 'close' + }, + Slots: { + default: 'slot-default', + title: 'slot-title' + } + }, + + badge: { + Attributes: { + value: 'value', + max: 'max', + 'is-dot': 'is-dot', + hidden: 'hidden', + href: 'href', + target: 'target', + type: 'type' + }, + Slots: { + default: 'slot-default', + content: 'slot-content' + } + }, + + breadcrumb: { + Attributes: { + separator: 'separator', + 'separator-class': 'separator', + replace: 'replace', + to: 'to' + }, + Slots: { + default: 'slot-default' + } + }, + + 'bulletin-board': { + Attributes: { + data: 'data', + 'more-link': 'more-link', + 'active-name': 'active-name', + icon: 'icon', + 'show-more': 'show-more', + 'tab-title': 'tab-title', + title: 'title' + } + }, + + button: { + Attributes: { + 'native-type': 'native-type', + type: 'type', + size: 'size', + autofocus: 'autofocus', + circle: 'circle', + disabled: 'disabled', + icon: 'icon', + loading: 'loading', + plain: 'plain', + 'reset-time': 'reset-time', + round: 'round' + }, + Events: { + click: 'click' + }, + Slots: { + default: 'slot-default' + } + }, + + 'button-group': { + Attributes: { + data: 'data', + disabled: 'disabled', + plain: 'plain', + 'text-field': 'text-field', + value: 'value', + 'value-field': 'value-field' + }, + Slots: { + default: 'slot-default' + } + }, + + input: { + Attributes: { + 'suffix-icon': 'suffix-icon', + maxlength: 'maxlength', + 'prefix-icon': 'prefix-icon', + readonly: 'readonly', + clearable: 'clearable', + type: 'type', + 'value / v-model': 'value', + autocomplete: 'autocomplete', + counter: 'counter', + autofocus: 'autofocus', + autosize: 'autosize', + disabled: 'disabled', + form: 'form', + label: 'label', + max: 'max', + min: 'min', + minlength: 'minlength', + name: 'name', + placeholder: 'placeholder', + resize: 'resize', + rows: 'rows', + 'show-password': 'show-password', + 'show-word-limit': 'show-word-limit', + size: 'size', + step: 'step', + tabindex: 'tabindex', + 'validate-event': 'validate-event' + }, + Events: { + blur: 'event-blur', + change: 'event-change', + clear: 'event-clear', + focus: 'event-focus', + input: 'event-input' + }, + Methods: { + addMemory: 'method-addMemory', + blur: 'method-blur', + focus: 'method-focus', + select: 'method-select' + }, + Slots: { + append: 'slot-append', + prefix: 'slot-prefix', + prepend: 'slot-prepend', + suffix: 'slot-suffix' + } + }, + + select: { + Attributes: { + multiple: 'multiple', + clearable: 'clearable', + 'value / v-model': 'value', + autocomplete: 'autocomplete', + 'allow-create': 'allow-create', + 'automatic-dropdown': 'automatic-dropdown', + 'collapse-tags': 'collapse-tags', + 'default-first-option': 'default-first-option', + disabled: 'disabled', + 'filter-method': 'filter-method', + filterable: 'filterable', + loading: 'loading', + 'loading-text': 'loading-text', + 'multiple-limit': 'multiple-limit', + name: 'name', + 'no-data-text': 'no-data-text', + 'no-match-text': 'no-match-text', + placeholder: 'placeholder', + 'popper-append-to-body': 'popper-append-to-body', + 'popper-class': 'popper-class', + remote: 'remote', + 'remote-method': 'remote-method', + 'reserve-keyword': 'reserve-keyword', + size: 'size', + 'value-key': 'value-key' + }, + Methods: { + blur: 'method-blur', + focus: 'method-focus' + }, + Events: { + change: 'event-change', + clear: 'event-clear', + blur: 'event-blur', + focus: 'event-focus', + 'remove-tag': 'event-remove-tag', + 'visible-change': 'event-visible-change' + }, + Slots: { + default: 'slot-default', + empty: 'slot-empty', + prefix: 'slot-prefix', + footer: 'slot-footer' + } + }, + + option: { + Attributes: { + disabled: 'disabled', + label: 'label', + value: 'value' + } + }, + + 'option-group': { + Attributes: { + disabled: 'disabled', + label: 'label' + } + }, + + 'scroll-text': { + Attributes: { + direction: 'direction', + 'hover-stop': 'text', + text: 'text', + time: 'text' + }, + Events: {}, + Methods: {}, + Slots: { + default: 'slots' + } + }, + container: { + Attributes: { + 'aside-width': 'base', + 'footer-height': 'base', + 'header-height': 'base', + pattern: 'pattern' + }, + Events: {}, + Methods: {}, + Slots: {} + }, + switch: { + Attributes: { + disabled: 'disabled', + mini: 'disabled', + 'value / v-model': 'truevlue', + trueValue: 'truevlue', + falseValue: 'truevlue' + }, + Events: {}, + Methods: {}, + Slots: {} + }, + tag: { + Attributes: { + border: 'hit', + hit: 'hit', + color: 'color3', + type: 'type', + closeable: 'closeable', + createable: 'closeable', + effect: 'effect', + disabled: 'disabled', + mode: 'border', + readonly: 'disabled', + selectable: 'border', + size: 'tag-size', + value: 'base' + }, + Events: { + click: 'tag-event-click', + close: 'tag-event-close' + }, + Methods: {}, + Slots: { + new: 'slotNew', + text: 'slotText' + } + }, + tabs: { + Attributes: { + activeName: 'basic-usage', + tabStyle: 'tab-style-card', + withAdd: 'with-add', + withClose: 'with-close', + position: 'position-bottom', + 'before-leave': 'before-leave', + stretch: 'stretch-wh', + size: 'tabs-size', + value: 'basic-value' + }, + Events: { + add: 'tabs-events-add', + click: 'tabs-events-click', + close: 'tabs-events-close', + edit: 'tabs-events-edit' + }, + Methods: {}, + Slots: { + title: 'custom-tab-title' + } + }, + 'text-popup': { + Attributes: { + label: 'label', + placeholder: 'placeholder', + readonly: 'readonly', + value: 'value', + width: 'width', + separtor: 'separtor' + }, + Events: {}, + Methods: {}, + Slots: {} + }, + search: { + Attributes: { + 'default-value': 'default-value', + mini: 'mini-mode', + placeholder: 'basic-usage', + 'search-types': 'search-types', + transparent: 'transparent-mode' + }, + Events: { + change: 'search-events', + search: 'search-events' + }, + Methods: {}, + Slots: { + poplist: 'custom-search-types', + text: 'show-selected-types' + } + }, + slider: { + Attributes: { + value: 'basic-usage', + mini: 'disabled', + 'value / v-model': 'truevlue', + trueValue: 'truevlue', + falseValue: 'truevlue' + }, + Events: {}, + Methods: {}, + Slots: {} + }, + split: { + Attributes: { + 'left-top-min': 'base', + mode: 'base', + 'right-bottom-min': 'base', + value: 'base', + transparent: 'base' + }, + Events: { + moveend: 'events', + movestart: 'events', + moving: 'events' + }, + Methods: {}, + Slots: { + bottom: 'slots', + left: 'slots', + right: 'slots', + top: 'slots', + trigger: 'slots' + } + }, + 'card-template': { + Attributes: { + 'body-style': 'base', + 'header-line': 'base' + }, + Events: {}, + Methods: {}, + Slots: { + default: 'slots', + footer: 'slots', + header: 'slots' + } + }, + col: { + Attributes: { + span: 'base', + move: 'move', + offset: 'move', + xs: 'responsive', + sm: 'responsive', + xl: 'responsive', + md: 'responsive', + lg: 'responsive', + no: 'move', + tag: 'tag' + }, + Events: {}, + Methods: {}, + Slots: {} + }, + loading: { + Attributes: { + text: 'base', + background: 'background', + body: 'body', + customClass: 'custom-class', + lock: 'lock', + spinner: 'spinner', + transparent: 'opacity', + fullscreen: 'fullscreen', + target: 'target' + }, + Events: {}, + Methods: {}, + Slots: {} + }, + progress: { + Attributes: { + color: 'custom-color', + percentage: 'basic-usage', + 'show-text': 'format-text', + status: 'progress-status', + 'stroke-width': 'progress-width', + 'text-inside': 'text-inside-or-no-text', + type: 'progress-type' + } + }, + numeric: { + Attributes: { + controls: 'controls', + disabled: 'dynamic-disabled', + max: 'max-min', + min: 'max-min', + mouseWheel: 'mouse-wheel', + precision: 'precision', + step: 'about-step' + } + }, + milestone: { + Attributes: { + data: 'data-source', + 'completed-field': 'completed-field', + 'flag-before': 'flag-before', + 'flag-content-field': 'flag-content-field', + 'flag-field': 'flag-field', + 'flag-name-field': 'flag-name-field', + 'flag-status-field': 'flag-status-field', + 'line-style': 'line-style', + 'milestones-status': 'base', + 'show-number': 'show-number', + solid: 'solid', + space: 'space', + start: 'space', + 'status-field': 'status-field', + 'time-field': 'time-field' + }, + Events: { + click: 'click', + flagclick: 'click', + 'flag-click': 'click' + }, + Methods: {}, + Slots: { + bottom: 'bottom', + flag: 'flag', + top: 'top' + } + }, + modal: { + Attributes: { + 'value,v-model': 'value', + type: 'type', + id: 'id', + duration: 'duration', + fullscreen: 'fullscreen', + width: 'width', + height: 'height', + mask: 'lock-view', + message: 'message', + resize: 'resize', + showFooter: 'showFooter', + showHeader: 'showHeader', + status: 'status', + title: 'title', + top: 'top', + zIndex: 'zIndex', + 'min-width': 'min-width', + 'min-height': 'min-height', + 'esc-closable': 'esc-closable', + 'lock-view': 'lock-view', + 'lock-scroll': 'lock-scroll', + 'mask-closable': 'mask-closable' + }, + Events: { + confirm: 'confirm-event', + cancel: 'cancel-event', + close: 'close-event', + show: 'show-event', + hide: 'hide-event', + zoom: 'zoom-event' + }, + Methods: {}, + Slots: { + default: 'value', + footer: 'footer-slot' + } + }, + espace: { + Attributes: { + data: 'data' + }, + Events: {}, + Methods: {}, + Slots: {} + }, + steps: { + Attributes: { + data: 'data-resource', + active: 'order-progress', + 'count-field': 'custom-field', + 'name-field': 'custom-field', + space: 'space', + 'status-field': 'custom-field' + }, + Events: { + click: 'click' + }, + Methods: {}, + Slots: { + item: 'slot' + } + }, + 'user-head': { + Attributes: { + 'background-color': 'color', + color: 'color', + 'message-total': 'message-total', + 'message-type': 'message-type', + 'message-upper-limit': 'message-upper-limit', + min: 'shape', + round: 'shape', + type: 'type', + value: 'type' + }, + Events: {}, + Methods: {}, + Slots: { + default: 'slot' + } + }, + 'fall-menu': { + Attributes: { + data: 'a' + }, + Events: {}, + Methods: {}, + Slots: { + left: 'level', + level1: 'level', + level2: 'level', + level3: 'level', + right: 'level' + } + }, + rate: { + Attributes: { + colors: 'score', + 'disabled-void-color': 'disabledcolor', + 'disabled-void-icon-class': 'disabledcolor', + 'show-text': 'readiconclass', + 'icon-classes': 'colors', + disabled: 'disabledcolor', + 'text-color': 'readiconclass', + texts: 'readiconclass', + 'void-icon-class': 'colors', + 'allow-half': 'half', + 'score-template': 'textconfig', + 'show-score': 'textconfig', + 'void-color': 'colors', + 'text-on-bottom': 'half', + 'value / v-model': 'half', + size: 'spacesize', + space: 'spacesize', + 'high-threshold': 'score', + 'low-threshold': 'score', + max: 'score', + radio: 'radio' + }, + Events: { + change: 'events' + }, + Methods: {}, + Slots: {} + }, + 'ip-address': { + Attributes: { + delimiter: 'delimiter', + disabled: 'disabled', + readonly: 'readonly', + type: 'type', + value: 'type' + }, + Events: { + select: 'select', + input: 'input', + change: 'change', + focus: 'focus', + blur: 'blur' + }, + Methods: {}, + Slots: { + 默认插槽: 'slots' + } + }, + row: { + Attributes: { + align: 'align', + gutter: 'gutter', + justify: 'justify', + order: 'order', + tag: 'tag1' + }, + Events: {}, + Methods: {}, + Slots: {} + }, + 'user-contact': { + Attributes: { + data: 'basic-usage', + espace: 'support-open-espace', + 'show-img': 'support-open-espace', + 'show-name': 'support-open-espace', + 'show-description': 'support-open-espace' + }, + Events: {}, + Methods: {}, + Slots: {} + }, + 'user-link': { + Attributes: { + value: 'basic-usage', + 'value-split': 'value-split', + 'text-split': 'text-split', + 'value-field': 'value-field', + 'text-field': 'text-field', + service: 'custom-service' + }, + Events: {}, + Slots: {}, + Methods: {} + }, + tree: { + Attributes: { + accordion: 'accordion-mode', + 'allow-drag': 'allow-drag', + data: 'data-source', + 'allow-drop': 'allow-drop', + 'auto-expand-parent': 'auto-expand-parent', + 'basic-usage': 'basic-usage', + 'check-descendants': 'check-descendants', + 'check-on-click-node': 'check-on-click-node', + 'check-strictly': 'check-strictly', + 'current-node-key': 'current-node-key', + 'custom-empty-text': 'custom-empty-text', + 'custom-node-icon': 'custom-node-icon', + 'default-checked-keys': 'default-checked-keys', + 'default-expand-all': 'default-expand-all', + 'default-expanded-keys': 'default-expanded-keys', + 'disable-node': 'disable-node', + 'expand-on-click-node': 'expand-on-click-node', + 'filter-node-method': 'filter-node', + 'highlight-current': 'highlight-current', + indent: 'indent', + 'icon-class': 'icon-class', + 'node-draggable': 'node-draggable', + 'node-key': 'node-key', + props: 'node-props-config', + 'render-after-expand': 'render-after-expand', + 'render-content': 'render-content', + 'show-checkbox': 'show-checkbox', + 'lazy-load': 'lazy-load-node' + }, + Events: {}, + Methods: {}, + Slots: {} + }, + + 'time-select': { + Attributes: { + 'arrow-control': 'arrow-control', + 'clear-icon': 'clear-icon', + clearable: 'clearable', + 'default-time': 'default-time', + 'default-value': 'default-value', + disabled: 'disabled', + editable: 'editable', + 'start-placeholder': 'range-placeholder', + 'end-placeholder': 'range-placeholder', + placeholder: 'basic-usage', + name: '', + value: 'basic-usage', + 'v-model': 'basic-usage', + 'picker-options': 'picker-options', + 'popper-class': '', + 'prefix-icon': 'prefix-icon', + 'range-separator': '', + size: 'size-mini' + }, + Events: { + add: 'tabs-events-add', + click: 'tabs-events-click', + close: 'tabs-events-close', + edit: 'tabs-events-edit' + }, + Methods: {}, + Slots: { + title: 'custom-tab-title' + } + }, + transfer: { + Attributes: { + 'button-texts': 'custom-button-texts', + columns: '', + data: '', + 'drop-config': 'drop-config', + 'filter-method': 'custom-filter-method', + 'filter-placeholder': 'filter-placeholder', + filterable: 'filterable', + format: 'checked-format-text', + 'left-default-checked': 'default-checked', + 'page-vo': '', + props: 'props-of-data-source', + 'render-content': 'custom-render-content', + 'render-type': '', + 'right-default-checked': 'default-checked', + 'show-all-btn': '', + sortable: '', + 'target-order': 'custom-data-items', + titles: 'custom-transfer-titles', + 'to-left-disable': '', + 'to-right-disable': '', + 'value/v-model': 'basic-usage' + }, + Events: { + change: 'transfer-events', + 'left-check-change': 'transfer-events', + 'right-check-change': 'transfer-events' + }, + Slots: { + default: 'custom-data-items', + 'left-footer': 'custom-footer', + 'right-footer': 'custom-footer' + }, + Methods: { + clearQuery: 'manual-clear-query' + } + }, + + logout: { + Attributes: { + guestRole: 'basic-usage', + service: 'custom-service' + } + }, + + user: { + Attributes: { + value: 'basic-usage', + multiple: 'multiple-users', + disabled: 'dynamic-disable', + 'value-split': 'value-split', + 'value-field': 'value-field', + 'text-field': 'text-field', + cache: 'cache-users', + 'cache-key': 'cache-users', + delay: 'delay-load', + 'suggest-length': 'load-after-input-the-length', + 'cache-fields': 'cache-users', + service: 'custom-service', + 'collapse-tags': '', + placeholder: 'custom-placeholder', + 'expand-tags': '', + sortable: 'custom-sort', + size: 'user-select-size' + }, + Events: {}, + Slots: {}, + Methods: {} + }, + carousel: { + Attributes: {}, + Events: {}, + Methods: {}, + Slots: {} + }, + checkbox: { + Attributes: {}, + Events: {}, + Methods: {}, + Slots: {} + }, + 'dialog-box': { + Attributes: {}, + Events: {}, + Methods: {}, + Slots: {} + }, + radio: { + Attributes: { + disabled: 'dynamic-disable', + border: 'with-border', + label: 'basic-usage', + name: '', + size: 'radio-size' + }, + Events: { + change: 'radio-events' + }, + Slots: { + default: 'basic-usage' + }, + Methods: {} + }, + pager: { + Attributes: { + 'pager-count': 'pager-count', + mode: 'pager-mode', + 'value / v-model': 'basic-usage', + 'page-sizes': 'page-size', + layout: 'custom-layout', + 'current-page': 'current-page', + 'hide-on-single-page': 'hide-on-single-page', + 'next-text': 'custom-next-prev-text', + 'page-count': 'page-count', + 'page-size': 'page-size', + 'prev-text': 'custom-next-prev-text', + total: 'pager-in-grid' + }, + Events: { + 'size-change': 'pager-events', + 'current-change': 'pager-events', + 'next-click': 'pager-events', + 'prev-click': 'pager-events' + }, + Methods: {}, + Slots: { + default: '' + } + }, + collapse: { + Attributes: { + 'value / v-model': 'basic-usage', + accordion: 'accordion' + }, + Events: { + change: 'collapse-events' + }, + Methods: {}, + Slots: {} + }, + 'slide-bar': { + Attributes: { + value: 'basic-usage', + 'init-blocks': 'basic-usage', + 'wheel-blocks': 'wheel-blocks', + tag: 'custom-tag', + 'sub-tag': 'custom-tag' + }, + Events: { + click: 'slide-bar-events', + 'before-click': 'slide-bar-events' + }, + Methods: {}, + Slots: { + default: 'custom-content' + } + }, + 'credit-card-form': { + Attributes: { + 'form-data': 'basic-usage' + }, + Events: { + 'input-card-cvv': 'basic-usage', + 'input-card-month': 'basic-usage', + 'input-card-name': 'basic-usage', + 'input-card-number': 'basic-usage', + 'input-card-year': 'basic-usage', + submit: 'basic-usage' + }, + Methods: {}, + Slots: {} + }, + 'time-line': { + Attributes: { + vertical: 'vertical-step', + 'show-number': 'show-number', + 'name-field': 'different-data', + 'time-field': 'different-data', + start: 'set-start-value', + data: 'basic-usage', + space: 'set-step-width', + active: 'basic-usage', + reverse: 'vertical-step' + }, + Events: { + click: 'basic-usage' + }, + Methods: {}, + Slots: { + top: 'custom-normal-step', + bottom: 'custom-normal-step', + left: 'custom-vertical-step', + right: 'custom-vertical-step' + } + }, + 'date-picker': { + Attributes: { + 'value/v-model': 'basic-usage', + align: 'align', + 'clear-icon': 'about-clear', + clearable: 'about-clear', + type: 'date-range', + 'picker-options': 'date-range-shortcuts', + 'start-placeholder': 'custom-range', + 'end-placeholder': 'custom-range', + 'range-separator': 'custom-range', + 'default-time': 'default-time-of-range', + disabled: 'disabled', + 'default-value': 'default-value', + editable: 'editable', + format: 'about-format', + 'prefix-icon': 'custom-prefix-icon', + size: 'set-size', + placeholder: 'custom-placeholder', + 'unlink-panels': 'unlink-panels' + }, + Events: { + blur: 'date-picker-events', + change: 'date-picker-events', + focus: 'date-picker-events' + }, + Methods: {}, + Slots: {} + }, + 'logon-user': { + Attributes: { + service: 'custom-service' + }, + Events: {}, + Methods: {}, + Slots: {} + }, + 'user-account': { + Attributes: { + service: 'custom-service' + }, + Events: {}, + Methods: {}, + Slots: { + default: 'custom-operation' + } + } +} diff --git a/examples/docs/resources/pc/demo/container/basic-usage.vue b/examples/docs/resources/pc/demo/container/basic-usage.vue new file mode 100644 index 000000000..2af79515e --- /dev/null +++ b/examples/docs/resources/pc/demo/container/basic-usage.vue @@ -0,0 +1,58 @@ + + + + + diff --git a/example/src/demo/pc/container/classic.vue b/examples/docs/resources/pc/demo/container/classic.vue similarity index 98% rename from example/src/demo/pc/container/classic.vue rename to examples/docs/resources/pc/demo/container/classic.vue index 71a4ba45e..4ab1c83c4 100644 --- a/example/src/demo/pc/container/classic.vue +++ b/examples/docs/resources/pc/demo/container/classic.vue @@ -15,7 +15,7 @@ - diff --git a/examples/docs/resources/pc/demo/country/custom-service.vue b/examples/docs/resources/pc/demo/country/custom-service.vue new file mode 100644 index 000000000..c69b59c77 --- /dev/null +++ b/examples/docs/resources/pc/demo/country/custom-service.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/country/fields.vue b/examples/docs/resources/pc/demo/country/fields.vue new file mode 100644 index 000000000..caf81feb3 --- /dev/null +++ b/examples/docs/resources/pc/demo/country/fields.vue @@ -0,0 +1,50 @@ + + + diff --git a/example/src/demo/pc/credit-card-form/background-image.vue b/examples/docs/resources/pc/demo/credit-card-form/background-image.vue similarity index 85% rename from example/src/demo/pc/credit-card-form/background-image.vue rename to examples/docs/resources/pc/demo/credit-card-form/background-image.vue index 215af74a0..e3b1cc73d 100644 --- a/example/src/demo/pc/credit-card-form/background-image.vue +++ b/examples/docs/resources/pc/demo/credit-card-form/background-image.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/credit-card-form/credit-card-form-events.vue b/examples/docs/resources/pc/demo/credit-card-form/credit-card-form-events.vue similarity index 98% rename from example/src/demo/pc/credit-card-form/credit-card-form-events.vue rename to examples/docs/resources/pc/demo/credit-card-form/credit-card-form-events.vue index 6d2905c2a..ff9e08211 100644 --- a/example/src/demo/pc/credit-card-form/credit-card-form-events.vue +++ b/examples/docs/resources/pc/demo/credit-card-form/credit-card-form-events.vue @@ -10,7 +10,7 @@ > - diff --git a/examples/docs/resources/pc/demo/crop/auto-crop-area.vue b/examples/docs/resources/pc/demo/crop/auto-crop-area.vue new file mode 100644 index 000000000..d4014c32c --- /dev/null +++ b/examples/docs/resources/pc/demo/crop/auto-crop-area.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/docs/resources/pc/demo/crop/basic-usage.vue b/examples/docs/resources/pc/demo/crop/basic-usage.vue new file mode 100644 index 000000000..0fd5d5b8f --- /dev/null +++ b/examples/docs/resources/pc/demo/crop/basic-usage.vue @@ -0,0 +1,22 @@ + + + diff --git a/examples/docs/resources/pc/demo/crop/crop-meth.vue b/examples/docs/resources/pc/demo/crop/crop-meth.vue new file mode 100644 index 000000000..4d91ac796 --- /dev/null +++ b/examples/docs/resources/pc/demo/crop/crop-meth.vue @@ -0,0 +1,38 @@ + + + diff --git a/examples/docs/resources/pc/demo/crop/drag-mode.vue b/examples/docs/resources/pc/demo/crop/drag-mode.vue new file mode 100644 index 000000000..c7fcfcd3a --- /dev/null +++ b/examples/docs/resources/pc/demo/crop/drag-mode.vue @@ -0,0 +1,28 @@ + + + diff --git a/example/src/demo/pc/crop/event-about-crop.vue b/examples/docs/resources/pc/demo/crop/event-about-crop.vue similarity index 95% rename from example/src/demo/pc/crop/event-about-crop.vue rename to examples/docs/resources/pc/demo/crop/event-about-crop.vue index b9cc992f5..bb73c3c69 100644 --- a/example/src/demo/pc/crop/event-about-crop.vue +++ b/examples/docs/resources/pc/demo/crop/event-about-crop.vue @@ -6,7 +6,7 @@ :cropvisible="visible" @update:cropvisible="visible = $event" ref="crop" - src="static/images/1.jpg" + src="static/images/mountain.png" @cropstart="cropstart" @cropmove="cropmove" @cropend="cropend" @@ -15,7 +15,7 @@ - diff --git a/example/src/demo/pc/crop/get-container-data.vue b/examples/docs/resources/pc/demo/crop/get-container-data.vue similarity index 88% rename from example/src/demo/pc/crop/get-container-data.vue rename to examples/docs/resources/pc/demo/crop/get-container-data.vue index 27ae76a92..d1219db83 100644 --- a/example/src/demo/pc/crop/get-container-data.vue +++ b/examples/docs/resources/pc/demo/crop/get-container-data.vue @@ -2,11 +2,11 @@
获取容器数据 - +
- diff --git a/example/src/demo/pc/crop/no-guides.vue b/examples/docs/resources/pc/demo/crop/no-guides.vue similarity index 79% rename from example/src/demo/pc/crop/no-guides.vue rename to examples/docs/resources/pc/demo/crop/no-guides.vue index 3ee6a538f..c4759d676 100644 --- a/example/src/demo/pc/crop/no-guides.vue +++ b/examples/docs/resources/pc/demo/crop/no-guides.vue @@ -1,11 +1,11 @@ - diff --git a/examples/docs/resources/pc/demo/crop/replace-image.vue b/examples/docs/resources/pc/demo/crop/replace-image.vue new file mode 100644 index 000000000..340d68a14 --- /dev/null +++ b/examples/docs/resources/pc/demo/crop/replace-image.vue @@ -0,0 +1,35 @@ + + + diff --git a/example/src/demo/pc/crop/view-mode.vue b/examples/docs/resources/pc/demo/crop/view-mode.vue similarity index 80% rename from example/src/demo/pc/crop/view-mode.vue rename to examples/docs/resources/pc/demo/crop/view-mode.vue index fe63af67e..754d1bc28 100644 --- a/example/src/demo/pc/crop/view-mode.vue +++ b/examples/docs/resources/pc/demo/crop/view-mode.vue @@ -1,11 +1,11 @@ - diff --git a/examples/docs/resources/pc/demo/crop/zoom-on-wheel.vue b/examples/docs/resources/pc/demo/crop/zoom-on-wheel.vue new file mode 100644 index 000000000..dd883d58b --- /dev/null +++ b/examples/docs/resources/pc/demo/crop/zoom-on-wheel.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/docs/resources/pc/demo/currency/basic-usage.vue b/examples/docs/resources/pc/demo/currency/basic-usage.vue new file mode 100644 index 000000000..7e72e1fa9 --- /dev/null +++ b/examples/docs/resources/pc/demo/currency/basic-usage.vue @@ -0,0 +1,26 @@ + + + diff --git a/examples/docs/resources/pc/demo/currency/custom-service.vue b/examples/docs/resources/pc/demo/currency/custom-service.vue new file mode 100644 index 000000000..04b692381 --- /dev/null +++ b/examples/docs/resources/pc/demo/currency/custom-service.vue @@ -0,0 +1,32 @@ + + + diff --git a/example/src/demo/pc/currency/disable-currency.vue b/examples/docs/resources/pc/demo/currency/disable-currency.vue similarity index 97% rename from example/src/demo/pc/currency/disable-currency.vue rename to examples/docs/resources/pc/demo/currency/disable-currency.vue index 9ac3b0f2c..04066ae4c 100644 --- a/example/src/demo/pc/currency/disable-currency.vue +++ b/examples/docs/resources/pc/demo/currency/disable-currency.vue @@ -6,7 +6,7 @@ - diff --git a/examples/docs/resources/pc/demo/currency/size.vue b/examples/docs/resources/pc/demo/currency/size.vue new file mode 100644 index 000000000..e7e33a85b --- /dev/null +++ b/examples/docs/resources/pc/demo/currency/size.vue @@ -0,0 +1,26 @@ + + + diff --git a/example/src/demo/pc/date-picker/about-clear.vue b/examples/docs/resources/pc/demo/date-picker/about-clear.vue similarity index 97% rename from example/src/demo/pc/date-picker/about-clear.vue rename to examples/docs/resources/pc/demo/date-picker/about-clear.vue index c9acee13f..90d2a65e2 100644 --- a/example/src/demo/pc/date-picker/about-clear.vue +++ b/examples/docs/resources/pc/demo/date-picker/about-clear.vue @@ -13,7 +13,7 @@ - diff --git a/examples/docs/resources/pc/demo/date-picker/basic-usage.vue b/examples/docs/resources/pc/demo/date-picker/basic-usage.vue new file mode 100644 index 000000000..44d170865 --- /dev/null +++ b/examples/docs/resources/pc/demo/date-picker/basic-usage.vue @@ -0,0 +1,20 @@ + + + diff --git a/examples/docs/resources/pc/demo/date-picker/clearable.vue b/examples/docs/resources/pc/demo/date-picker/clearable.vue new file mode 100644 index 000000000..b50752f3a --- /dev/null +++ b/examples/docs/resources/pc/demo/date-picker/clearable.vue @@ -0,0 +1,26 @@ + + + diff --git a/examples/docs/resources/pc/demo/date-picker/custom-range.vue b/examples/docs/resources/pc/demo/date-picker/custom-range.vue new file mode 100644 index 000000000..996aa6e6d --- /dev/null +++ b/examples/docs/resources/pc/demo/date-picker/custom-range.vue @@ -0,0 +1,24 @@ + + + diff --git a/example/src/demo/pc/date-picker/custom-suffix-icon.vue b/examples/docs/resources/pc/demo/date-picker/custom-suffix-icon.vue similarity index 95% rename from example/src/demo/pc/date-picker/custom-suffix-icon.vue rename to examples/docs/resources/pc/demo/date-picker/custom-suffix-icon.vue index 473dc99ec..aaa1536a8 100644 --- a/example/src/demo/pc/date-picker/custom-suffix-icon.vue +++ b/examples/docs/resources/pc/demo/date-picker/custom-suffix-icon.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/date-picker/disabled.vue b/examples/docs/resources/pc/demo/date-picker/disabled.vue new file mode 100644 index 000000000..73eaecb5e --- /dev/null +++ b/examples/docs/resources/pc/demo/date-picker/disabled.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/date-picker/editable.vue b/examples/docs/resources/pc/demo/date-picker/editable.vue new file mode 100644 index 000000000..2f4f4bba5 --- /dev/null +++ b/examples/docs/resources/pc/demo/date-picker/editable.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/date-picker/focus.vue b/examples/docs/resources/pc/demo/date-picker/focus.vue new file mode 100644 index 000000000..6c207eeee --- /dev/null +++ b/examples/docs/resources/pc/demo/date-picker/focus.vue @@ -0,0 +1,32 @@ + + + diff --git a/examples/docs/resources/pc/demo/date-picker/max-min.vue b/examples/docs/resources/pc/demo/date-picker/max-min.vue new file mode 100644 index 000000000..eb01ba094 --- /dev/null +++ b/examples/docs/resources/pc/demo/date-picker/max-min.vue @@ -0,0 +1,38 @@ + + + diff --git a/example/src/demo/pc/date-picker/month-range-shortcuts.vue b/examples/docs/resources/pc/demo/date-picker/month-range-shortcuts.vue similarity index 98% rename from example/src/demo/pc/date-picker/month-range-shortcuts.vue rename to examples/docs/resources/pc/demo/date-picker/month-range-shortcuts.vue index f715ff8c7..9d7d995f8 100644 --- a/example/src/demo/pc/date-picker/month-range-shortcuts.vue +++ b/examples/docs/resources/pc/demo/date-picker/month-range-shortcuts.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/date-picker/set-size.vue b/examples/docs/resources/pc/demo/date-picker/set-size.vue similarity index 97% rename from example/src/demo/pc/date-picker/set-size.vue rename to examples/docs/resources/pc/demo/date-picker/set-size.vue index 898ee28ff..b1a8c11cd 100644 --- a/example/src/demo/pc/date-picker/set-size.vue +++ b/examples/docs/resources/pc/demo/date-picker/set-size.vue @@ -17,7 +17,7 @@ - diff --git a/example/src/demo/pc/date-picker/unlink-panels.vue b/examples/docs/resources/pc/demo/date-picker/unlink-panels.vue similarity index 93% rename from example/src/demo/pc/date-picker/unlink-panels.vue rename to examples/docs/resources/pc/demo/date-picker/unlink-panels.vue index e8a76e0cc..c067e29b3 100644 --- a/example/src/demo/pc/date-picker/unlink-panels.vue +++ b/examples/docs/resources/pc/demo/date-picker/unlink-panels.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/date-picker/validate-event.vue b/examples/docs/resources/pc/demo/date-picker/validate-event.vue new file mode 100644 index 000000000..9341752f5 --- /dev/null +++ b/examples/docs/resources/pc/demo/date-picker/validate-event.vue @@ -0,0 +1,91 @@ + + + diff --git a/example/src/demo/pc/dept/auto-select.vue b/examples/docs/resources/pc/demo/dept/auto-select.vue similarity index 92% rename from example/src/demo/pc/dept/auto-select.vue rename to examples/docs/resources/pc/demo/dept/auto-select.vue index a8be774d6..82e830c49 100644 --- a/example/src/demo/pc/dept/auto-select.vue +++ b/examples/docs/resources/pc/demo/dept/auto-select.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/dept/before-confirm.vue b/examples/docs/resources/pc/demo/dept/before-confirm.vue similarity index 97% rename from example/src/demo/pc/dept/before-confirm.vue rename to examples/docs/resources/pc/demo/dept/before-confirm.vue index 5ae62360a..37dea83cc 100644 --- a/example/src/demo/pc/dept/before-confirm.vue +++ b/examples/docs/resources/pc/demo/dept/before-confirm.vue @@ -7,7 +7,7 @@ - diff --git a/example/src/demo/pc/dept/dept-cancel.vue b/examples/docs/resources/pc/demo/dept/dept-cancel.vue similarity index 96% rename from example/src/demo/pc/dept/dept-cancel.vue rename to examples/docs/resources/pc/demo/dept/dept-cancel.vue index 82d694a55..9b3dceb76 100644 --- a/example/src/demo/pc/dept/dept-cancel.vue +++ b/examples/docs/resources/pc/demo/dept/dept-cancel.vue @@ -7,7 +7,7 @@ - diff --git a/examples/docs/resources/pc/demo/dept/size.vue b/examples/docs/resources/pc/demo/dept/size.vue new file mode 100644 index 000000000..a605e37f1 --- /dev/null +++ b/examples/docs/resources/pc/demo/dept/size.vue @@ -0,0 +1,18 @@ + + + diff --git a/example/src/demo/pc/dept/slot-hrapprover.vue b/examples/docs/resources/pc/demo/dept/slot-hrapprover.vue similarity index 94% rename from example/src/demo/pc/dept/slot-hrapprover.vue rename to examples/docs/resources/pc/demo/dept/slot-hrapprover.vue index a7c2307ae..01b452233 100644 --- a/example/src/demo/pc/dept/slot-hrapprover.vue +++ b/examples/docs/resources/pc/demo/dept/slot-hrapprover.vue @@ -6,7 +6,7 @@ - diff --git a/examples/docs/resources/pc/demo/detail-page/basic-usage.vue b/examples/docs/resources/pc/demo/detail-page/basic-usage.vue new file mode 100644 index 000000000..48121e83b --- /dev/null +++ b/examples/docs/resources/pc/demo/detail-page/basic-usage.vue @@ -0,0 +1,40 @@ + + + diff --git a/example/src/demo/pc/detail-page/custom-show-text.vue b/examples/docs/resources/pc/demo/detail-page/custom-show-text.vue similarity index 97% rename from example/src/demo/pc/detail-page/custom-show-text.vue rename to examples/docs/resources/pc/demo/detail-page/custom-show-text.vue index 5689c17a5..dc6d584d4 100644 --- a/example/src/demo/pc/detail-page/custom-show-text.vue +++ b/examples/docs/resources/pc/demo/detail-page/custom-show-text.vue @@ -12,7 +12,7 @@ > - diff --git a/examples/docs/resources/pc/demo/dialog-box/center.vue b/examples/docs/resources/pc/demo/dialog-box/center.vue new file mode 100644 index 000000000..2e9d91ac5 --- /dev/null +++ b/examples/docs/resources/pc/demo/dialog-box/center.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/docs/resources/pc/demo/dialog-box/close-on-click-modal.vue b/examples/docs/resources/pc/demo/dialog-box/close-on-click-modal.vue new file mode 100644 index 000000000..bf2418649 --- /dev/null +++ b/examples/docs/resources/pc/demo/dialog-box/close-on-click-modal.vue @@ -0,0 +1,27 @@ + + + diff --git a/example/src/demo/pc/dialog-box/close-on-press-escape.vue b/examples/docs/resources/pc/demo/dialog-box/close-on-press-escape.vue similarity index 80% rename from example/src/demo/pc/dialog-box/close-on-press-escape.vue rename to examples/docs/resources/pc/demo/dialog-box/close-on-press-escape.vue index 734893b19..e97992943 100644 --- a/example/src/demo/pc/dialog-box/close-on-press-escape.vue +++ b/examples/docs/resources/pc/demo/dialog-box/close-on-press-escape.vue @@ -1,6 +1,6 @@ - diff --git a/examples/docs/resources/pc/demo/dialog-box/no-modal.vue b/examples/docs/resources/pc/demo/dialog-box/no-modal.vue new file mode 100644 index 000000000..fee86e036 --- /dev/null +++ b/examples/docs/resources/pc/demo/dialog-box/no-modal.vue @@ -0,0 +1,27 @@ + + + diff --git a/example/src/demo/pc/dialog-box/open-close-events.vue b/examples/docs/resources/pc/demo/dialog-box/open-close-events.vue similarity index 91% rename from example/src/demo/pc/dialog-box/open-close-events.vue rename to examples/docs/resources/pc/demo/dialog-box/open-close-events.vue index 1e3605ec2..dda4861b1 100644 --- a/example/src/demo/pc/dialog-box/open-close-events.vue +++ b/examples/docs/resources/pc/demo/dialog-box/open-close-events.vue @@ -1,6 +1,6 @@ - diff --git a/examples/docs/resources/pc/demo/drop-roles/size.vue b/examples/docs/resources/pc/demo/drop-roles/size.vue new file mode 100644 index 000000000..38bff5f73 --- /dev/null +++ b/examples/docs/resources/pc/demo/drop-roles/size.vue @@ -0,0 +1,35 @@ + + + diff --git a/examples/docs/resources/pc/demo/drop-times/basic-usage.vue b/examples/docs/resources/pc/demo/drop-times/basic-usage.vue new file mode 100644 index 000000000..4d7bef51c --- /dev/null +++ b/examples/docs/resources/pc/demo/drop-times/basic-usage.vue @@ -0,0 +1,26 @@ + + + diff --git a/examples/docs/resources/pc/demo/drop-times/size.vue b/examples/docs/resources/pc/demo/drop-times/size.vue new file mode 100644 index 000000000..2f43d9109 --- /dev/null +++ b/examples/docs/resources/pc/demo/drop-times/size.vue @@ -0,0 +1,21 @@ + + + diff --git a/example/src/demo/pc/drop-times/start-end-step.vue b/examples/docs/resources/pc/demo/drop-times/start-end-step.vue similarity index 96% rename from example/src/demo/pc/drop-times/start-end-step.vue rename to examples/docs/resources/pc/demo/drop-times/start-end-step.vue index 7b16315f8..0364e3a02 100644 --- a/example/src/demo/pc/drop-times/start-end-step.vue +++ b/examples/docs/resources/pc/demo/drop-times/start-end-step.vue @@ -4,7 +4,7 @@ - diff --git a/example/src/demo/pc/dropdown/disabled.vue b/examples/docs/resources/pc/demo/dropdown/disabled.vue similarity index 100% rename from example/src/demo/pc/dropdown/disabled.vue rename to examples/docs/resources/pc/demo/dropdown/disabled.vue diff --git a/examples/docs/resources/pc/demo/dropdown/events.vue b/examples/docs/resources/pc/demo/dropdown/events.vue new file mode 100644 index 000000000..484b59305 --- /dev/null +++ b/examples/docs/resources/pc/demo/dropdown/events.vue @@ -0,0 +1,46 @@ + + + diff --git a/example/src/demo/pc/dropdown/hide-on-click.vue b/examples/docs/resources/pc/demo/dropdown/hide-on-click.vue similarity index 100% rename from example/src/demo/pc/dropdown/hide-on-click.vue rename to examples/docs/resources/pc/demo/dropdown/hide-on-click.vue diff --git a/example/src/demo/pc/dropdown/multi-level.vue b/examples/docs/resources/pc/demo/dropdown/multi-level.vue similarity index 100% rename from example/src/demo/pc/dropdown/multi-level.vue rename to examples/docs/resources/pc/demo/dropdown/multi-level.vue diff --git a/examples/docs/resources/pc/demo/dropdown/options.vue b/examples/docs/resources/pc/demo/dropdown/options.vue new file mode 100644 index 000000000..0a1e11d96 --- /dev/null +++ b/examples/docs/resources/pc/demo/dropdown/options.vue @@ -0,0 +1,119 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/dropdown/size.vue b/examples/docs/resources/pc/demo/dropdown/size.vue new file mode 100644 index 000000000..94980624d --- /dev/null +++ b/examples/docs/resources/pc/demo/dropdown/size.vue @@ -0,0 +1,67 @@ + + + diff --git a/example/src/demo/pc/dropdown/slot-default.vue b/examples/docs/resources/pc/demo/dropdown/slot-default.vue similarity index 100% rename from example/src/demo/pc/dropdown/slot-default.vue rename to examples/docs/resources/pc/demo/dropdown/slot-default.vue diff --git a/example/src/demo/pc/dropdown/split-button.vue b/examples/docs/resources/pc/demo/dropdown/split-button.vue similarity index 91% rename from example/src/demo/pc/dropdown/split-button.vue rename to examples/docs/resources/pc/demo/dropdown/split-button.vue index f139a999e..1ce508c4d 100644 --- a/example/src/demo/pc/dropdown/split-button.vue +++ b/examples/docs/resources/pc/demo/dropdown/split-button.vue @@ -1,5 +1,5 @@ - + + diff --git a/examples/docs/resources/pc/demo/file-upload/abort-quest.vue b/examples/docs/resources/pc/demo/file-upload/abort-quest.vue new file mode 100644 index 000000000..a7343d168 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/abort-quest.vue @@ -0,0 +1,30 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/accept-file-image.vue b/examples/docs/resources/pc/demo/file-upload/accept-file-image.vue new file mode 100644 index 000000000..a0bc0466d --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/accept-file-image.vue @@ -0,0 +1,22 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/accept-file.vue b/examples/docs/resources/pc/demo/file-upload/accept-file.vue new file mode 100644 index 000000000..570e5aeef --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/accept-file.vue @@ -0,0 +1,23 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/basic-usage.vue b/examples/docs/resources/pc/demo/file-upload/basic-usage.vue new file mode 100644 index 000000000..f505e1717 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/basic-usage.vue @@ -0,0 +1,26 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/clear-files.vue b/examples/docs/resources/pc/demo/file-upload/clear-files.vue new file mode 100644 index 000000000..b5c39f1ff --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/clear-files.vue @@ -0,0 +1,40 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/custom-prefix.vue b/examples/docs/resources/pc/demo/file-upload/custom-prefix.vue new file mode 100644 index 000000000..15cc8fa78 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/custom-prefix.vue @@ -0,0 +1,52 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/custom-trigger.vue b/examples/docs/resources/pc/demo/file-upload/custom-trigger.vue new file mode 100644 index 000000000..0befbe9c7 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/custom-trigger.vue @@ -0,0 +1,23 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/custom-upload-request.vue b/examples/docs/resources/pc/demo/file-upload/custom-upload-request.vue new file mode 100644 index 000000000..b0b1e0a91 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/custom-upload-request.vue @@ -0,0 +1,40 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/custom-upload-tip.vue b/examples/docs/resources/pc/demo/file-upload/custom-upload-tip.vue new file mode 100644 index 000000000..3eb3cf3cb --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/custom-upload-tip.vue @@ -0,0 +1,26 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/drag-select-file.vue b/examples/docs/resources/pc/demo/file-upload/drag-select-file.vue new file mode 100644 index 000000000..97dbb56d9 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/drag-select-file.vue @@ -0,0 +1,33 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/drag-upload.vue b/examples/docs/resources/pc/demo/file-upload/drag-upload.vue new file mode 100644 index 000000000..63e67ccd5 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/drag-upload.vue @@ -0,0 +1,29 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/dynamic-disable.vue b/examples/docs/resources/pc/demo/file-upload/dynamic-disable.vue new file mode 100644 index 000000000..dec778d70 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/dynamic-disable.vue @@ -0,0 +1,29 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/file-picture-card.vue b/examples/docs/resources/pc/demo/file-upload/file-picture-card.vue new file mode 100644 index 000000000..e625b385d --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/file-picture-card.vue @@ -0,0 +1,64 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/http-request.vue b/examples/docs/resources/pc/demo/file-upload/http-request.vue new file mode 100644 index 000000000..475e8d0d9 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/http-request.vue @@ -0,0 +1,30 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/image-size.vue b/examples/docs/resources/pc/demo/file-upload/image-size.vue new file mode 100644 index 000000000..afbf3d6a1 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/image-size.vue @@ -0,0 +1,46 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/jalor-request.vue b/examples/docs/resources/pc/demo/file-upload/jalor-request.vue new file mode 100644 index 000000000..9f3c16e6b --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/jalor-request.vue @@ -0,0 +1,32 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/manual-upload.vue b/examples/docs/resources/pc/demo/file-upload/manual-upload.vue new file mode 100644 index 000000000..6828f5b62 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/manual-upload.vue @@ -0,0 +1,30 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/max-file-count.vue b/examples/docs/resources/pc/demo/file-upload/max-file-count.vue new file mode 100644 index 000000000..260be3534 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/max-file-count.vue @@ -0,0 +1,28 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/mini-mode.vue b/examples/docs/resources/pc/demo/file-upload/mini-mode.vue new file mode 100644 index 000000000..9b664387f --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/mini-mode.vue @@ -0,0 +1,29 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/multiple-file.vue b/examples/docs/resources/pc/demo/file-upload/multiple-file.vue new file mode 100644 index 000000000..4f5c616b5 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/multiple-file.vue @@ -0,0 +1,23 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/picture-card.vue b/examples/docs/resources/pc/demo/file-upload/picture-card.vue new file mode 100644 index 000000000..c83a32cc6 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/picture-card.vue @@ -0,0 +1,48 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/picture-list.vue b/examples/docs/resources/pc/demo/file-upload/picture-list.vue new file mode 100644 index 000000000..44f8ef983 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/picture-list.vue @@ -0,0 +1,32 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/prevent-delete-file.vue b/examples/docs/resources/pc/demo/file-upload/prevent-delete-file.vue new file mode 100644 index 000000000..b250d5cb0 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/prevent-delete-file.vue @@ -0,0 +1,39 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/prevent-upload-file.vue b/examples/docs/resources/pc/demo/file-upload/prevent-upload-file.vue new file mode 100644 index 000000000..6e0919946 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/prevent-upload-file.vue @@ -0,0 +1,39 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/size.vue b/examples/docs/resources/pc/demo/file-upload/size.vue new file mode 100644 index 000000000..1e5eda74a --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/size.vue @@ -0,0 +1,23 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/upload-events.vue b/examples/docs/resources/pc/demo/file-upload/upload-events.vue new file mode 100644 index 000000000..201706ba3 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/upload-events.vue @@ -0,0 +1,69 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/upload-file-filters.vue b/examples/docs/resources/pc/demo/file-upload/upload-file-filters.vue new file mode 100644 index 000000000..f98ebdc1f --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/upload-file-filters.vue @@ -0,0 +1,43 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/upload-file-list-thumb.vue b/examples/docs/resources/pc/demo/file-upload/upload-file-list-thumb.vue new file mode 100644 index 000000000..c759b4b8a --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/upload-file-list-thumb.vue @@ -0,0 +1,43 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/upload-file-list.vue b/examples/docs/resources/pc/demo/file-upload/upload-file-list.vue new file mode 100644 index 000000000..2f5aba81d --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/upload-file-list.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/upload-limit.vue b/examples/docs/resources/pc/demo/file-upload/upload-limit.vue new file mode 100644 index 000000000..5b3a2ba60 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/upload-limit.vue @@ -0,0 +1,33 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/upload-request.vue b/examples/docs/resources/pc/demo/file-upload/upload-request.vue new file mode 100644 index 000000000..b72a15ada --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/upload-request.vue @@ -0,0 +1,41 @@ + + + diff --git a/examples/docs/resources/pc/demo/file-upload/upload-user-head.vue b/examples/docs/resources/pc/demo/file-upload/upload-user-head.vue new file mode 100644 index 000000000..134b8e2e3 --- /dev/null +++ b/examples/docs/resources/pc/demo/file-upload/upload-user-head.vue @@ -0,0 +1,48 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/floatbar/base.vue b/examples/docs/resources/pc/demo/floatbar/base.vue new file mode 100644 index 000000000..8c3219442 --- /dev/null +++ b/examples/docs/resources/pc/demo/floatbar/base.vue @@ -0,0 +1,23 @@ + + + diff --git a/example/src/demo/pc/floatbar/custom-floatbar-item.vue b/examples/docs/resources/pc/demo/floatbar/custom-floatbar-item.vue similarity index 94% rename from example/src/demo/pc/floatbar/custom-floatbar-item.vue rename to examples/docs/resources/pc/demo/floatbar/custom-floatbar-item.vue index 1156efe47..5b6ccd34f 100644 --- a/example/src/demo/pc/floatbar/custom-floatbar-item.vue +++ b/examples/docs/resources/pc/demo/floatbar/custom-floatbar-item.vue @@ -12,7 +12,7 @@ - + + diff --git a/example/src/demo/pc/form/form-validation.vue b/examples/docs/resources/pc/demo/form/form-validation.vue similarity index 94% rename from example/src/demo/pc/form/form-validation.vue rename to examples/docs/resources/pc/demo/form/form-validation.vue index 8611760fd..e25306984 100644 --- a/example/src/demo/pc/form/form-validation.vue +++ b/examples/docs/resources/pc/demo/form/form-validation.vue @@ -4,10 +4,10 @@ - + - + @@ -53,7 +53,7 @@ export default { }, data() { return { - validateIcon: iconWarning(), + validateIcon: IconWarning(), options: [ { label: 'A', text: '很好', events: { click: this.handleClick } }, { label: 'B', text: '一般' } diff --git a/example/src/demo/pc/form/frequently-used-form.vue b/examples/docs/resources/pc/demo/form/frequently-used-form.vue similarity index 99% rename from example/src/demo/pc/form/frequently-used-form.vue rename to examples/docs/resources/pc/demo/form/frequently-used-form.vue index aaf393375..4286ac826 100644 --- a/example/src/demo/pc/form/frequently-used-form.vue +++ b/examples/docs/resources/pc/demo/form/frequently-used-form.vue @@ -29,7 +29,7 @@ - + + diff --git a/example/src/demo/pc/form/slot-label.vue b/examples/docs/resources/pc/demo/form/slot-label.vue similarity index 99% rename from example/src/demo/pc/form/slot-label.vue rename to examples/docs/resources/pc/demo/form/slot-label.vue index 36fc235ed..bb1812683 100644 --- a/example/src/demo/pc/form/slot-label.vue +++ b/examples/docs/resources/pc/demo/form/slot-label.vue @@ -24,7 +24,7 @@ - + + diff --git a/examples/docs/resources/pc/demo/fullscreen/example-component.vue b/examples/docs/resources/pc/demo/fullscreen/example-component.vue new file mode 100644 index 000000000..43288ef52 --- /dev/null +++ b/examples/docs/resources/pc/demo/fullscreen/example-component.vue @@ -0,0 +1,61 @@ + + + + + diff --git a/example/src/demo/pc/grid/align/column-align.vue b/examples/docs/resources/pc/demo/grid/align/column-align.vue similarity index 78% rename from example/src/demo/pc/grid/align/column-align.vue rename to examples/docs/resources/pc/demo/grid/align/column-align.vue index 705934a03..1c7177e9c 100644 --- a/example/src/demo/pc/grid/align/column-align.vue +++ b/examples/docs/resources/pc/demo/grid/align/column-align.vue @@ -4,12 +4,12 @@ - +
- diff --git a/example/src/demo/pc/grid/custom/column-sort.vue b/examples/docs/resources/pc/demo/grid/custom/column-sort.vue similarity index 99% rename from example/src/demo/pc/grid/custom/column-sort.vue rename to examples/docs/resources/pc/demo/grid/custom/column-sort.vue index c87e1d2e9..984668fed 100644 --- a/example/src/demo/pc/grid/custom/column-sort.vue +++ b/examples/docs/resources/pc/demo/grid/custom/column-sort.vue @@ -12,7 +12,7 @@ - diff --git a/example/src/demo/pc/grid/custom/local-storage.vue b/examples/docs/resources/pc/demo/grid/custom/local-storage.vue similarity index 99% rename from example/src/demo/pc/grid/custom/local-storage.vue rename to examples/docs/resources/pc/demo/grid/custom/local-storage.vue index 2cfc1e541..e23308206 100644 --- a/example/src/demo/pc/grid/custom/local-storage.vue +++ b/examples/docs/resources/pc/demo/grid/custom/local-storage.vue @@ -13,7 +13,7 @@ - diff --git a/example/src/demo/pc/grid/custom/prsonalized-drag.vue b/examples/docs/resources/pc/demo/grid/custom/prsonalized-drag.vue similarity index 99% rename from example/src/demo/pc/grid/custom/prsonalized-drag.vue rename to examples/docs/resources/pc/demo/grid/custom/prsonalized-drag.vue index 3719c98f6..c1409086d 100644 --- a/example/src/demo/pc/grid/custom/prsonalized-drag.vue +++ b/examples/docs/resources/pc/demo/grid/custom/prsonalized-drag.vue @@ -13,7 +13,7 @@ - diff --git a/examples/docs/resources/pc/demo/grid/faq/opSlot.vue b/examples/docs/resources/pc/demo/grid/faq/opSlot.vue new file mode 100644 index 000000000..7bca8b890 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/faq/opSlot.vue @@ -0,0 +1,81 @@ + + + diff --git a/example/src/demo/pc/grid/faq/unbalanced.vue b/examples/docs/resources/pc/demo/grid/faq/unbalanced.vue similarity index 100% rename from example/src/demo/pc/grid/faq/unbalanced.vue rename to examples/docs/resources/pc/demo/grid/faq/unbalanced.vue diff --git a/example/src/demo/pc/grid/filter/advanced-filter.vue b/examples/docs/resources/pc/demo/grid/filter/advanced-filter.vue similarity index 85% rename from example/src/demo/pc/grid/filter/advanced-filter.vue rename to examples/docs/resources/pc/demo/grid/filter/advanced-filter.vue index b6430d9d8..1b2549f4e 100644 --- a/example/src/demo/pc/grid/filter/advanced-filter.vue +++ b/examples/docs/resources/pc/demo/grid/filter/advanced-filter.vue @@ -4,12 +4,12 @@ - + - diff --git a/examples/docs/resources/pc/demo/grid/pager/inner-pager.vue b/examples/docs/resources/pc/demo/grid/pager/inner-pager.vue new file mode 100644 index 000000000..f61c7f1cb --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/pager/inner-pager.vue @@ -0,0 +1,125 @@ + + + diff --git a/example/src/demo/pc/grid/pager/showSaveMsg.vue b/examples/docs/resources/pc/demo/grid/pager/showSaveMsg.vue similarity index 95% rename from example/src/demo/pc/grid/pager/showSaveMsg.vue rename to examples/docs/resources/pc/demo/grid/pager/showSaveMsg.vue index 515562377..d7f215fc9 100644 --- a/example/src/demo/pc/grid/pager/showSaveMsg.vue +++ b/examples/docs/resources/pc/demo/grid/pager/showSaveMsg.vue @@ -1,6 +1,14 @@ - + + diff --git a/example/src/demo/pc/grid/slot/empty-slot.vue b/examples/docs/resources/pc/demo/grid/slot/empty-slot.vue similarity index 97% rename from example/src/demo/pc/grid/slot/empty-slot.vue rename to examples/docs/resources/pc/demo/grid/slot/empty-slot.vue index 040307c87..27d9a9230 100644 --- a/example/src/demo/pc/grid/slot/empty-slot.vue +++ b/examples/docs/resources/pc/demo/grid/slot/empty-slot.vue @@ -12,7 +12,7 @@ - diff --git a/examples/docs/resources/pc/demo/grid/sort/custom-sort.vue b/examples/docs/resources/pc/demo/grid/sort/custom-sort.vue new file mode 100644 index 000000000..865feb23b --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/sort/custom-sort.vue @@ -0,0 +1,91 @@ + + + diff --git a/example/src/demo/pc/grid/sort/default-sort.vue b/examples/docs/resources/pc/demo/grid/sort/default-sort.vue similarity index 76% rename from example/src/demo/pc/grid/sort/default-sort.vue rename to examples/docs/resources/pc/demo/grid/sort/default-sort.vue index 791be71c1..715df407d 100644 --- a/example/src/demo/pc/grid/sort/default-sort.vue +++ b/examples/docs/resources/pc/demo/grid/sort/default-sort.vue @@ -6,13 +6,18 @@ - - + + - diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/adaptive-grid-off-width-height.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/adaptive-grid-off-width-height.vue new file mode 100644 index 000000000..430880c54 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/adaptive-grid-off-width-height.vue @@ -0,0 +1,114 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/adaptive-grid-width-height.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/adaptive-grid-width-height.vue new file mode 100644 index 000000000..1b485d5f1 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/adaptive-grid-width-height.vue @@ -0,0 +1,114 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/adaptive-un-column-width.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/adaptive-un-column-width.vue new file mode 100644 index 000000000..998687200 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/adaptive-un-column-width.vue @@ -0,0 +1,67 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/auto-load.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/auto-load.vue new file mode 100644 index 000000000..842cd063b --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/auto-load.vue @@ -0,0 +1,97 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/cell-editing.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/cell-editing.vue new file mode 100644 index 000000000..4c2eda990 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/cell-editing.vue @@ -0,0 +1,78 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/clearData.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/clearData.vue new file mode 100644 index 000000000..519932e22 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/clearData.vue @@ -0,0 +1,123 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/clearRadioRow.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/clearRadioRow.vue new file mode 100644 index 000000000..7c1034002 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/clearRadioRow.vue @@ -0,0 +1,89 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/clearSelection.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/clearSelection.vue new file mode 100644 index 000000000..277080464 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/clearSelection.vue @@ -0,0 +1,89 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/column-asyn-rendering.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/column-asyn-rendering.vue new file mode 100644 index 000000000..020cdf3ba --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/column-asyn-rendering.vue @@ -0,0 +1,164 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/column-key.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/column-key.vue new file mode 100644 index 000000000..213aa71f8 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/column-key.vue @@ -0,0 +1,68 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/column-min-width.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/column-min-width.vue new file mode 100644 index 000000000..096c258f0 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/column-min-width.vue @@ -0,0 +1,80 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/column-width.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/column-width.vue new file mode 100644 index 000000000..43c3ac0af --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/column-width.vue @@ -0,0 +1,68 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/columns.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/columns.vue new file mode 100644 index 000000000..d5df4d3ee --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/columns.vue @@ -0,0 +1,82 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/copy-row-data.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/copy-row-data.vue new file mode 100644 index 000000000..62b6992b6 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/copy-row-data.vue @@ -0,0 +1,112 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/custom-editing.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/custom-editing.vue new file mode 100644 index 000000000..2b6fcfe38 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/custom-editing.vue @@ -0,0 +1,122 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/custom-operation-column.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/custom-operation-column.vue new file mode 100644 index 000000000..4f0ba6c87 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/custom-operation-column.vue @@ -0,0 +1,102 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/custom-serial-column.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/custom-serial-column.vue new file mode 100644 index 000000000..fa056a4aa --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/custom-serial-column.vue @@ -0,0 +1,74 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/custom-toolbar.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/custom-toolbar.vue new file mode 100644 index 000000000..5bf1c76b8 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/custom-toolbar.vue @@ -0,0 +1,154 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/default-serial-column.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/default-serial-column.vue new file mode 100644 index 000000000..5581309ce --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/default-serial-column.vue @@ -0,0 +1,69 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/editor-is-salid-always.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/editor-is-salid-always.vue new file mode 100644 index 000000000..d603c5dab --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/editor-is-salid-always.vue @@ -0,0 +1,145 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/empty-data-default-tip.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/empty-data-default-tip.vue new file mode 100644 index 000000000..53bdce9dc --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/empty-data-default-tip.vue @@ -0,0 +1,25 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/empty-data-iscenter.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/empty-data-iscenter.vue new file mode 100644 index 000000000..4d8e5afa5 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/empty-data-iscenter.vue @@ -0,0 +1,25 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/empty-data-tip.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/empty-data-tip.vue new file mode 100644 index 000000000..1398109e9 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/empty-data-tip.vue @@ -0,0 +1,44 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/export-excel.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/export-excel.vue new file mode 100644 index 000000000..41eaaee94 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/export-excel.vue @@ -0,0 +1,94 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/fixed-column-width.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/fixed-column-width.vue new file mode 100644 index 000000000..4c456821f --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/fixed-column-width.vue @@ -0,0 +1,67 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/fixed-grid-height.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/fixed-grid-height.vue new file mode 100644 index 000000000..6fe6306e8 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/fixed-grid-height.vue @@ -0,0 +1,67 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/format-value.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/format-value.vue new file mode 100644 index 000000000..66fc1605b --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/format-value.vue @@ -0,0 +1,89 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/full-data-loading.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/full-data-loading.vue new file mode 100644 index 000000000..343b3673f --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/full-data-loading.vue @@ -0,0 +1,49 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/get-row-method.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/get-row-method.vue new file mode 100644 index 000000000..2f595fcbb --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/get-row-method.vue @@ -0,0 +1,111 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-border.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-border.vue new file mode 100644 index 000000000..b69165c49 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-border.vue @@ -0,0 +1,68 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-customs.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-customs.vue new file mode 100644 index 000000000..149640dc0 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-customs.vue @@ -0,0 +1,69 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-full-screen-height.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-full-screen-height.vue new file mode 100644 index 000000000..33308b26b --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-full-screen-height.vue @@ -0,0 +1,72 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-full-screen.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-full-screen.vue new file mode 100644 index 000000000..668e4a0d4 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-full-screen.vue @@ -0,0 +1,103 @@ + + + diff --git a/example/src/demo/pc/grid/aui3-first-menu/grid-large-tree-data.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-large-tree-data.vue similarity index 100% rename from example/src/demo/pc/grid/aui3-first-menu/grid-large-tree-data.vue rename to examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-large-tree-data.vue diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-loading-off-tip.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-loading-off-tip.vue new file mode 100644 index 000000000..db8a80832 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-loading-off-tip.vue @@ -0,0 +1,68 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-loading-tip.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-loading-tip.vue new file mode 100644 index 000000000..6e86222e9 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-loading-tip.vue @@ -0,0 +1,68 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-optimization.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-optimization.vue new file mode 100644 index 000000000..dd95dd837 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-optimization.vue @@ -0,0 +1,89 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-size-mini.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-size-mini.vue new file mode 100644 index 000000000..f3c348e69 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-size-mini.vue @@ -0,0 +1,91 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-size-small.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-size-small.vue new file mode 100644 index 000000000..142fbf0fc --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-size-small.vue @@ -0,0 +1,91 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-size.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-size.vue new file mode 100644 index 000000000..5c6b83c2c --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-size.vue @@ -0,0 +1,91 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/gridPagerReserve.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/gridPagerReserve.vue new file mode 100644 index 000000000..d94738884 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/gridPagerReserve.vue @@ -0,0 +1,152 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/inner-pager.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/inner-pager.vue new file mode 100644 index 000000000..f61c7f1cb --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/inner-pager.vue @@ -0,0 +1,125 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/insert-delete-update.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/insert-delete-update.vue new file mode 100644 index 000000000..4628cea73 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/insert-delete-update.vue @@ -0,0 +1,163 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/max-min-grid-height.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/max-min-grid-height.vue new file mode 100644 index 000000000..962c6b4d1 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/max-min-grid-height.vue @@ -0,0 +1,87 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/min-grid-height.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/min-grid-height.vue new file mode 100644 index 000000000..3855f1c52 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/min-grid-height.vue @@ -0,0 +1,67 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/min-width.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/min-width.vue new file mode 100644 index 000000000..e7440baf1 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/min-width.vue @@ -0,0 +1,75 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/proxy-config.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/proxy-config.vue new file mode 100644 index 000000000..39d7e6126 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/proxy-config.vue @@ -0,0 +1,110 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/radio-config.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/radio-config.vue new file mode 100644 index 000000000..26a7e630b --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/radio-config.vue @@ -0,0 +1,85 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/refresh-grid.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/refresh-grid.vue new file mode 100644 index 000000000..83e41e603 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/refresh-grid.vue @@ -0,0 +1,112 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/request-service.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/request-service.vue new file mode 100644 index 000000000..bd4ca95a8 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/request-service.vue @@ -0,0 +1,113 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/resize-column-width.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/resize-column-width.vue new file mode 100644 index 000000000..f4c0558c9 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/resize-column-width.vue @@ -0,0 +1,69 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/row-editing.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/row-editing.vue new file mode 100644 index 000000000..7d281af51 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/row-editing.vue @@ -0,0 +1,81 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/row-id.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/row-id.vue new file mode 100644 index 000000000..e5c790c0c --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/row-id.vue @@ -0,0 +1,69 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/save-data.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/save-data.vue new file mode 100644 index 000000000..744c2346c --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/save-data.vue @@ -0,0 +1,143 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/scroll-paging.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/scroll-paging.vue new file mode 100644 index 000000000..5ef933341 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/scroll-paging.vue @@ -0,0 +1,109 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/start-index.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/start-index.vue new file mode 100644 index 000000000..d539e4f72 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/start-index.vue @@ -0,0 +1,129 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/static-data.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/static-data.vue new file mode 100644 index 000000000..f24c2307b --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/static-data.vue @@ -0,0 +1,68 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/status-of-editing.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/status-of-editing.vue new file mode 100644 index 000000000..e27b13c3a --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/status-of-editing.vue @@ -0,0 +1,78 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/status-of-noediting.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/status-of-noediting.vue new file mode 100644 index 000000000..16856ffab --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/status-of-noediting.vue @@ -0,0 +1,78 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/trigger-mode-db-editing.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/trigger-mode-db-editing.vue new file mode 100644 index 000000000..4fc6225c1 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/trigger-mode-db-editing.vue @@ -0,0 +1,78 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/trigger-mode-for-editing.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/trigger-mode-for-editing.vue new file mode 100644 index 000000000..66f7b128e --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/trigger-mode-for-editing.vue @@ -0,0 +1,78 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/trigger-mode-hm-editing.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/trigger-mode-hm-editing.vue new file mode 100644 index 000000000..1010246e5 --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/trigger-mode-hm-editing.vue @@ -0,0 +1,116 @@ + + + diff --git a/examples/docs/resources/pc/demo/grid/tiny-first-menu/virtual-rolling.vue b/examples/docs/resources/pc/demo/grid/tiny-first-menu/virtual-rolling.vue new file mode 100644 index 000000000..5c2a1196f --- /dev/null +++ b/examples/docs/resources/pc/demo/grid/tiny-first-menu/virtual-rolling.vue @@ -0,0 +1,58 @@ + + + diff --git a/example/src/demo/pc/grid/tip/cell-tip.vue b/examples/docs/resources/pc/demo/grid/tip/cell-tip.vue similarity index 79% rename from example/src/demo/pc/grid/tip/cell-tip.vue rename to examples/docs/resources/pc/demo/grid/tip/cell-tip.vue index e8a399076..57d0fe490 100644 --- a/example/src/demo/pc/grid/tip/cell-tip.vue +++ b/examples/docs/resources/pc/demo/grid/tip/cell-tip.vue @@ -12,12 +12,12 @@ - + - diff --git a/example/src/demo/pc/grid/tip/overflow-tip.vue b/examples/docs/resources/pc/demo/grid/tip/overflow-tip.vue similarity index 80% rename from example/src/demo/pc/grid/tip/overflow-tip.vue rename to examples/docs/resources/pc/demo/grid/tip/overflow-tip.vue index 376cc073a..1f47969b7 100644 --- a/example/src/demo/pc/grid/tip/overflow-tip.vue +++ b/examples/docs/resources/pc/demo/grid/tip/overflow-tip.vue @@ -4,7 +4,7 @@ - + - diff --git a/example/src/demo/pc/hrapprover/category-type.vue b/examples/docs/resources/pc/demo/hrapprover/category-type.vue similarity index 95% rename from example/src/demo/pc/hrapprover/category-type.vue rename to examples/docs/resources/pc/demo/hrapprover/category-type.vue index 771bb7f80..1f1d7992d 100644 --- a/example/src/demo/pc/hrapprover/category-type.vue +++ b/examples/docs/resources/pc/demo/hrapprover/category-type.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/hrapprover/disabled.vue b/examples/docs/resources/pc/demo/hrapprover/disabled.vue new file mode 100644 index 000000000..e58e39221 --- /dev/null +++ b/examples/docs/resources/pc/demo/hrapprover/disabled.vue @@ -0,0 +1,34 @@ + + + diff --git a/examples/docs/resources/pc/demo/icon/basic-usage.vue b/examples/docs/resources/pc/demo/icon/basic-usage.vue new file mode 100644 index 000000000..db5c15120 --- /dev/null +++ b/examples/docs/resources/pc/demo/icon/basic-usage.vue @@ -0,0 +1,47 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/icon/list.vue b/examples/docs/resources/pc/demo/icon/list.vue new file mode 100644 index 000000000..ea1ff3eec --- /dev/null +++ b/examples/docs/resources/pc/demo/icon/list.vue @@ -0,0 +1,104 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/icon/show-title.vue b/examples/docs/resources/pc/demo/icon/show-title.vue new file mode 100644 index 000000000..abc4c19fb --- /dev/null +++ b/examples/docs/resources/pc/demo/icon/show-title.vue @@ -0,0 +1,26 @@ + + + + + diff --git a/example/src/demo/pc/image/auto-fit-container-size.vue b/examples/docs/resources/pc/demo/image/auto-fit-container-size.vue similarity index 88% rename from example/src/demo/pc/image/auto-fit-container-size.vue rename to examples/docs/resources/pc/demo/image/auto-fit-container-size.vue index d3dd41249..f6e185085 100644 --- a/example/src/demo/pc/image/auto-fit-container-size.vue +++ b/examples/docs/resources/pc/demo/image/auto-fit-container-size.vue @@ -7,7 +7,7 @@ - diff --git a/example/src/demo/pc/image/custom-load-failed-text.vue b/examples/docs/resources/pc/demo/image/custom-load-failed-text.vue similarity index 98% rename from example/src/demo/pc/image/custom-load-failed-text.vue rename to examples/docs/resources/pc/demo/image/custom-load-failed-text.vue index e4400c75a..e04951a36 100644 --- a/example/src/demo/pc/image/custom-load-failed-text.vue +++ b/examples/docs/resources/pc/demo/image/custom-load-failed-text.vue @@ -15,7 +15,7 @@ - diff --git a/examples/docs/resources/pc/demo/image/lazy-load.vue b/examples/docs/resources/pc/demo/image/lazy-load.vue new file mode 100644 index 000000000..63e1eb591 --- /dev/null +++ b/examples/docs/resources/pc/demo/image/lazy-load.vue @@ -0,0 +1,27 @@ + + + + + diff --git a/example/src/demo/pc/image/load-error.vue b/examples/docs/resources/pc/demo/image/load-error.vue similarity index 94% rename from example/src/demo/pc/image/load-error.vue rename to examples/docs/resources/pc/demo/image/load-error.vue index 5b9d9119d..dc07f4054 100644 --- a/example/src/demo/pc/image/load-error.vue +++ b/examples/docs/resources/pc/demo/image/load-error.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/image/preview-z-index.vue b/examples/docs/resources/pc/demo/image/preview-z-index.vue new file mode 100644 index 000000000..bf26e45c0 --- /dev/null +++ b/examples/docs/resources/pc/demo/image/preview-z-index.vue @@ -0,0 +1,19 @@ + + + diff --git a/examples/docs/resources/pc/demo/index.js b/examples/docs/resources/pc/demo/index.js new file mode 100644 index 000000000..405d14673 --- /dev/null +++ b/examples/docs/resources/pc/demo/index.js @@ -0,0 +1,4 @@ +import Components from './components' + +export const getDemoCode = ({ component, type, name }) => + `${component}/${Components[component][type][name]}` diff --git a/example/src/demo/pc/input/autocomplete.vue b/examples/docs/resources/pc/demo/input/autocomplete.vue similarity index 94% rename from example/src/demo/pc/input/autocomplete.vue rename to examples/docs/resources/pc/demo/input/autocomplete.vue index 903027123..ae33b43c2 100644 --- a/example/src/demo/pc/input/autocomplete.vue +++ b/examples/docs/resources/pc/demo/input/autocomplete.vue @@ -4,7 +4,7 @@ - + + diff --git a/examples/docs/resources/pc/demo/input/autosize.vue b/examples/docs/resources/pc/demo/input/autosize.vue new file mode 100644 index 000000000..00520b216 --- /dev/null +++ b/examples/docs/resources/pc/demo/input/autosize.vue @@ -0,0 +1,27 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/input/basic-usage.vue b/examples/docs/resources/pc/demo/input/basic-usage.vue new file mode 100644 index 000000000..47045990a --- /dev/null +++ b/examples/docs/resources/pc/demo/input/basic-usage.vue @@ -0,0 +1,26 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/input/clearable.vue b/examples/docs/resources/pc/demo/input/clearable.vue new file mode 100644 index 000000000..e6543980c --- /dev/null +++ b/examples/docs/resources/pc/demo/input/clearable.vue @@ -0,0 +1,26 @@ + + + + + diff --git a/example/src/demo/pc/input/cols.vue b/examples/docs/resources/pc/demo/input/cols.vue similarity index 96% rename from example/src/demo/pc/input/cols.vue rename to examples/docs/resources/pc/demo/input/cols.vue index f832586e9..872b1bf70 100644 --- a/example/src/demo/pc/input/cols.vue +++ b/examples/docs/resources/pc/demo/input/cols.vue @@ -7,7 +7,7 @@ - + + diff --git a/examples/docs/resources/pc/demo/input/disabled.vue b/examples/docs/resources/pc/demo/input/disabled.vue new file mode 100644 index 000000000..24ccdbe51 --- /dev/null +++ b/examples/docs/resources/pc/demo/input/disabled.vue @@ -0,0 +1,21 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/input/event-blur.vue b/examples/docs/resources/pc/demo/input/event-blur.vue new file mode 100644 index 000000000..132c0d5e6 --- /dev/null +++ b/examples/docs/resources/pc/demo/input/event-blur.vue @@ -0,0 +1,31 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/input/event-change.vue b/examples/docs/resources/pc/demo/input/event-change.vue new file mode 100644 index 000000000..da8ebae00 --- /dev/null +++ b/examples/docs/resources/pc/demo/input/event-change.vue @@ -0,0 +1,31 @@ + + + + + diff --git a/example/src/demo/pc/input/event-clear.vue b/examples/docs/resources/pc/demo/input/event-clear.vue similarity index 95% rename from example/src/demo/pc/input/event-clear.vue rename to examples/docs/resources/pc/demo/input/event-clear.vue index b7d570166..5ca370517 100644 --- a/example/src/demo/pc/input/event-clear.vue +++ b/examples/docs/resources/pc/demo/input/event-clear.vue @@ -4,7 +4,7 @@ - + + diff --git a/examples/docs/resources/pc/demo/input/label.vue b/examples/docs/resources/pc/demo/input/label.vue new file mode 100644 index 000000000..91945f0dc --- /dev/null +++ b/examples/docs/resources/pc/demo/input/label.vue @@ -0,0 +1,26 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/input/max.vue b/examples/docs/resources/pc/demo/input/max.vue new file mode 100644 index 000000000..60a7fc644 --- /dev/null +++ b/examples/docs/resources/pc/demo/input/max.vue @@ -0,0 +1,26 @@ + + + + + diff --git a/example/src/demo/pc/input/maxlength.vue b/examples/docs/resources/pc/demo/input/maxlength.vue similarity index 94% rename from example/src/demo/pc/input/maxlength.vue rename to examples/docs/resources/pc/demo/input/maxlength.vue index 0b81d899c..986eebec0 100644 --- a/example/src/demo/pc/input/maxlength.vue +++ b/examples/docs/resources/pc/demo/input/maxlength.vue @@ -4,7 +4,7 @@ - + + diff --git a/example/src/demo/pc/input/min.vue b/examples/docs/resources/pc/demo/input/min.vue similarity index 94% rename from example/src/demo/pc/input/min.vue rename to examples/docs/resources/pc/demo/input/min.vue index 72719776f..5cbadf45a 100644 --- a/example/src/demo/pc/input/min.vue +++ b/examples/docs/resources/pc/demo/input/min.vue @@ -4,7 +4,7 @@ - + + diff --git a/examples/docs/resources/pc/demo/input/placeholder.vue b/examples/docs/resources/pc/demo/input/placeholder.vue new file mode 100644 index 000000000..9c5cd9664 --- /dev/null +++ b/examples/docs/resources/pc/demo/input/placeholder.vue @@ -0,0 +1,26 @@ + + + + + diff --git a/example/src/demo/pc/input/prefix-icon.vue b/examples/docs/resources/pc/demo/input/prefix-icon.vue similarity index 95% rename from example/src/demo/pc/input/prefix-icon.vue rename to examples/docs/resources/pc/demo/input/prefix-icon.vue index 45c059607..6e07c3387 100644 --- a/example/src/demo/pc/input/prefix-icon.vue +++ b/examples/docs/resources/pc/demo/input/prefix-icon.vue @@ -4,7 +4,7 @@ - + + diff --git a/examples/docs/resources/pc/demo/input/resize.vue b/examples/docs/resources/pc/demo/input/resize.vue new file mode 100644 index 000000000..7460f5a2d --- /dev/null +++ b/examples/docs/resources/pc/demo/input/resize.vue @@ -0,0 +1,38 @@ + + + + + diff --git a/example/src/demo/pc/input/rows.vue b/examples/docs/resources/pc/demo/input/rows.vue similarity index 96% rename from example/src/demo/pc/input/rows.vue rename to examples/docs/resources/pc/demo/input/rows.vue index 3d1681b2a..773cd00bb 100644 --- a/example/src/demo/pc/input/rows.vue +++ b/examples/docs/resources/pc/demo/input/rows.vue @@ -7,7 +7,7 @@ - + + diff --git a/example/src/demo/pc/input/show-word-limit.vue b/examples/docs/resources/pc/demo/input/show-word-limit.vue similarity index 96% rename from example/src/demo/pc/input/show-word-limit.vue rename to examples/docs/resources/pc/demo/input/show-word-limit.vue index cc6722e7a..e8bb43604 100644 --- a/example/src/demo/pc/input/show-word-limit.vue +++ b/examples/docs/resources/pc/demo/input/show-word-limit.vue @@ -7,7 +7,7 @@ - + + diff --git a/example/src/demo/pc/input/slot-append.vue b/examples/docs/resources/pc/demo/input/slot-append.vue similarity index 95% rename from example/src/demo/pc/input/slot-append.vue rename to examples/docs/resources/pc/demo/input/slot-append.vue index 31c213043..5a57893d7 100644 --- a/example/src/demo/pc/input/slot-append.vue +++ b/examples/docs/resources/pc/demo/input/slot-append.vue @@ -6,7 +6,7 @@ - + + diff --git a/examples/docs/resources/pc/demo/input/suffix-icon.vue b/examples/docs/resources/pc/demo/input/suffix-icon.vue new file mode 100644 index 000000000..de709f68b --- /dev/null +++ b/examples/docs/resources/pc/demo/input/suffix-icon.vue @@ -0,0 +1,28 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/input/tabindex.vue b/examples/docs/resources/pc/demo/input/tabindex.vue new file mode 100644 index 000000000..7462b3226 --- /dev/null +++ b/examples/docs/resources/pc/demo/input/tabindex.vue @@ -0,0 +1,27 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/input/type.vue b/examples/docs/resources/pc/demo/input/type.vue new file mode 100644 index 000000000..0c890997c --- /dev/null +++ b/examples/docs/resources/pc/demo/input/type.vue @@ -0,0 +1,89 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/input/validate-event.vue b/examples/docs/resources/pc/demo/input/validate-event.vue new file mode 100644 index 000000000..735d216e8 --- /dev/null +++ b/examples/docs/resources/pc/demo/input/validate-event.vue @@ -0,0 +1,38 @@ + + + + + diff --git a/example/src/demo/pc/ip-address/blur.vue b/examples/docs/resources/pc/demo/ip-address/blur.vue similarity index 95% rename from example/src/demo/pc/ip-address/blur.vue rename to examples/docs/resources/pc/demo/ip-address/blur.vue index 6f88ef11d..391b831b7 100644 --- a/example/src/demo/pc/ip-address/blur.vue +++ b/examples/docs/resources/pc/demo/ip-address/blur.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/ip-address/delimiter.vue b/examples/docs/resources/pc/demo/ip-address/delimiter.vue similarity index 94% rename from example/src/demo/pc/ip-address/delimiter.vue rename to examples/docs/resources/pc/demo/ip-address/delimiter.vue index 3247366f0..c0111ebcd 100644 --- a/example/src/demo/pc/ip-address/delimiter.vue +++ b/examples/docs/resources/pc/demo/ip-address/delimiter.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/ip-address/focus.vue b/examples/docs/resources/pc/demo/ip-address/focus.vue new file mode 100644 index 000000000..f43352424 --- /dev/null +++ b/examples/docs/resources/pc/demo/ip-address/focus.vue @@ -0,0 +1,23 @@ + + + diff --git a/example/src/demo/pc/ip-address/input.vue b/examples/docs/resources/pc/demo/ip-address/input.vue similarity index 95% rename from example/src/demo/pc/ip-address/input.vue rename to examples/docs/resources/pc/demo/ip-address/input.vue index 827afc6c1..154a146a4 100644 --- a/example/src/demo/pc/ip-address/input.vue +++ b/examples/docs/resources/pc/demo/ip-address/input.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/ip-address/select.vue b/examples/docs/resources/pc/demo/ip-address/select.vue similarity index 95% rename from example/src/demo/pc/ip-address/select.vue rename to examples/docs/resources/pc/demo/ip-address/select.vue index aed1f30cc..ee884b8b2 100644 --- a/example/src/demo/pc/ip-address/select.vue +++ b/examples/docs/resources/pc/demo/ip-address/select.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/ip-address/slots.vue b/examples/docs/resources/pc/demo/ip-address/slots.vue new file mode 100644 index 000000000..58dd127ca --- /dev/null +++ b/examples/docs/resources/pc/demo/ip-address/slots.vue @@ -0,0 +1,22 @@ + + + diff --git a/example/src/demo/pc/layout/alignment.vue b/examples/docs/resources/pc/demo/layout/alignment.vue similarity index 99% rename from example/src/demo/pc/layout/alignment.vue rename to examples/docs/resources/pc/demo/layout/alignment.vue index 76a633d49..1c6188d7e 100644 --- a/example/src/demo/pc/layout/alignment.vue +++ b/examples/docs/resources/pc/demo/layout/alignment.vue @@ -93,7 +93,7 @@ - + + diff --git a/examples/docs/resources/pc/demo/layout/gutter.vue b/examples/docs/resources/pc/demo/layout/gutter.vue new file mode 100644 index 000000000..fa443592b --- /dev/null +++ b/examples/docs/resources/pc/demo/layout/gutter.vue @@ -0,0 +1,52 @@ + + + + + diff --git a/example/src/demo/pc/layout/offset.vue b/examples/docs/resources/pc/demo/layout/offset.vue similarity index 98% rename from example/src/demo/pc/layout/offset.vue rename to examples/docs/resources/pc/demo/layout/offset.vue index 2c7ce7051..5e2d86ea6 100644 --- a/example/src/demo/pc/layout/offset.vue +++ b/examples/docs/resources/pc/demo/layout/offset.vue @@ -17,7 +17,7 @@ - + + diff --git a/example/src/demo/pc/layout/responsive-layout.vue b/examples/docs/resources/pc/demo/layout/responsive-layout.vue similarity index 98% rename from example/src/demo/pc/layout/responsive-layout.vue rename to examples/docs/resources/pc/demo/layout/responsive-layout.vue index 5c140cb08..6a251ebbf 100644 --- a/example/src/demo/pc/layout/responsive-layout.vue +++ b/examples/docs/resources/pc/demo/layout/responsive-layout.vue @@ -19,7 +19,7 @@ - diff --git a/example/src/demo/pc/link-menu/custom-foot.vue b/examples/docs/resources/pc/demo/link-menu/custom-foot.vue similarity index 99% rename from example/src/demo/pc/link-menu/custom-foot.vue rename to examples/docs/resources/pc/demo/link-menu/custom-foot.vue index fc557421e..ecc77ea2d 100644 --- a/example/src/demo/pc/link-menu/custom-foot.vue +++ b/examples/docs/resources/pc/demo/link-menu/custom-foot.vue @@ -9,7 +9,7 @@ - diff --git a/examples/docs/resources/pc/demo/link-menu/data-resource.vue b/examples/docs/resources/pc/demo/link-menu/data-resource.vue new file mode 100644 index 000000000..e03a0a554 --- /dev/null +++ b/examples/docs/resources/pc/demo/link-menu/data-resource.vue @@ -0,0 +1,93 @@ + + + diff --git a/examples/docs/resources/pc/demo/link-menu/get-menu-data-sync.vue b/examples/docs/resources/pc/demo/link-menu/get-menu-data-sync.vue new file mode 100644 index 000000000..8590d9e8d --- /dev/null +++ b/examples/docs/resources/pc/demo/link-menu/get-menu-data-sync.vue @@ -0,0 +1,97 @@ + + + diff --git a/example/src/demo/pc/link-menu/menu-items.vue b/examples/docs/resources/pc/demo/link-menu/menu-items.vue similarity index 99% rename from example/src/demo/pc/link-menu/menu-items.vue rename to examples/docs/resources/pc/demo/link-menu/menu-items.vue index 12324b057..ae1914634 100644 --- a/example/src/demo/pc/link-menu/menu-items.vue +++ b/examples/docs/resources/pc/demo/link-menu/menu-items.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/link/config-href.vue b/examples/docs/resources/pc/demo/link/config-href.vue similarity index 92% rename from example/src/demo/pc/link/config-href.vue rename to examples/docs/resources/pc/demo/link/config-href.vue index 993b8d873..cd239d922 100644 --- a/example/src/demo/pc/link/config-href.vue +++ b/examples/docs/resources/pc/demo/link/config-href.vue @@ -2,7 +2,7 @@ 默认链接 - diff --git a/examples/docs/resources/pc/demo/link/dynamic-disable.vue b/examples/docs/resources/pc/demo/link/dynamic-disable.vue new file mode 100644 index 000000000..a01c622a4 --- /dev/null +++ b/examples/docs/resources/pc/demo/link/dynamic-disable.vue @@ -0,0 +1,20 @@ + + + diff --git a/example/src/demo/pc/link/focus-no-underline.vue b/examples/docs/resources/pc/demo/link/focus-no-underline.vue similarity index 92% rename from example/src/demo/pc/link/focus-no-underline.vue rename to examples/docs/resources/pc/demo/link/focus-no-underline.vue index 70855d5e4..9322bb693 100644 --- a/example/src/demo/pc/link/focus-no-underline.vue +++ b/examples/docs/resources/pc/demo/link/focus-no-underline.vue @@ -5,7 +5,7 @@ - diff --git a/example/src/demo/pc/loading/body.vue b/examples/docs/resources/pc/demo/loading/body.vue similarity index 93% rename from example/src/demo/pc/loading/body.vue rename to examples/docs/resources/pc/demo/loading/body.vue index a0db4e5db..4d48f3f54 100644 --- a/example/src/demo/pc/loading/body.vue +++ b/examples/docs/resources/pc/demo/loading/body.vue @@ -5,7 +5,7 @@ - diff --git a/example/src/demo/pc/loading/loading-tip-text.vue b/examples/docs/resources/pc/demo/loading/loading-tip-text.vue similarity index 93% rename from example/src/demo/pc/loading/loading-tip-text.vue rename to examples/docs/resources/pc/demo/loading/loading-tip-text.vue index 60a7b45d5..ce0d9d6b4 100644 --- a/example/src/demo/pc/loading/loading-tip-text.vue +++ b/examples/docs/resources/pc/demo/loading/loading-tip-text.vue @@ -2,7 +2,7 @@
- + + diff --git a/examples/docs/resources/pc/demo/locales/basic-usage.vue b/examples/docs/resources/pc/demo/locales/basic-usage.vue new file mode 100644 index 000000000..1361f63b9 --- /dev/null +++ b/examples/docs/resources/pc/demo/locales/basic-usage.vue @@ -0,0 +1,13 @@ + + + diff --git a/example/src/demo/pc/locales/change-lang.vue b/examples/docs/resources/pc/demo/locales/change-lang.vue similarity index 95% rename from example/src/demo/pc/locales/change-lang.vue rename to examples/docs/resources/pc/demo/locales/change-lang.vue index a2e4f4522..730788ed8 100644 --- a/example/src/demo/pc/locales/change-lang.vue +++ b/examples/docs/resources/pc/demo/locales/change-lang.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/logon-user/basic-usage.vue b/examples/docs/resources/pc/demo/logon-user/basic-usage.vue new file mode 100644 index 000000000..fa142211b --- /dev/null +++ b/examples/docs/resources/pc/demo/logon-user/basic-usage.vue @@ -0,0 +1,13 @@ + + + diff --git a/examples/docs/resources/pc/demo/logon-user/custom-service.vue b/examples/docs/resources/pc/demo/logon-user/custom-service.vue new file mode 100644 index 000000000..2de215718 --- /dev/null +++ b/examples/docs/resources/pc/demo/logon-user/custom-service.vue @@ -0,0 +1,25 @@ + + + diff --git a/examples/docs/resources/pc/demo/logout/basic-usage.vue b/examples/docs/resources/pc/demo/logout/basic-usage.vue new file mode 100644 index 000000000..5b280d6c1 --- /dev/null +++ b/examples/docs/resources/pc/demo/logout/basic-usage.vue @@ -0,0 +1,13 @@ + + + diff --git a/examples/docs/resources/pc/demo/logout/custom-service.vue b/examples/docs/resources/pc/demo/logout/custom-service.vue new file mode 100644 index 000000000..c1e8afd8a --- /dev/null +++ b/examples/docs/resources/pc/demo/logout/custom-service.vue @@ -0,0 +1,32 @@ + + + diff --git a/example/src/demo/pc/logout/redirecturl.vue b/examples/docs/resources/pc/demo/logout/redirecturl.vue similarity index 93% rename from example/src/demo/pc/logout/redirecturl.vue rename to examples/docs/resources/pc/demo/logout/redirecturl.vue index d7e3f79cf..21ffedf8c 100644 --- a/example/src/demo/pc/logout/redirecturl.vue +++ b/examples/docs/resources/pc/demo/logout/redirecturl.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/milestone/custom-bottom.vue b/examples/docs/resources/pc/demo/milestone/custom-bottom.vue similarity index 98% rename from example/src/demo/pc/milestone/custom-bottom.vue rename to examples/docs/resources/pc/demo/milestone/custom-bottom.vue index 64cf60440..5b6573cb4 100644 --- a/example/src/demo/pc/milestone/custom-bottom.vue +++ b/examples/docs/resources/pc/demo/milestone/custom-bottom.vue @@ -6,7 +6,7 @@ - diff --git a/example/src/demo/pc/milestone/flag-before.vue b/examples/docs/resources/pc/demo/milestone/flag-before.vue similarity index 99% rename from example/src/demo/pc/milestone/flag-before.vue rename to examples/docs/resources/pc/demo/milestone/flag-before.vue index c354c0ac4..9e9f72faf 100644 --- a/example/src/demo/pc/milestone/flag-before.vue +++ b/examples/docs/resources/pc/demo/milestone/flag-before.vue @@ -5,7 +5,7 @@ - diff --git a/example/src/demo/pc/milestone/solid-style.vue b/examples/docs/resources/pc/demo/milestone/solid-style.vue similarity index 98% rename from example/src/demo/pc/milestone/solid-style.vue rename to examples/docs/resources/pc/demo/milestone/solid-style.vue index 250c2784c..0d7c6e5af 100644 --- a/example/src/demo/pc/milestone/solid-style.vue +++ b/examples/docs/resources/pc/demo/milestone/solid-style.vue @@ -5,7 +5,7 @@ - diff --git a/examples/docs/resources/pc/demo/modal/base.vue b/examples/docs/resources/pc/demo/modal/base.vue new file mode 100644 index 000000000..9ac905e82 --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/base.vue @@ -0,0 +1,38 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/cancel-event.vue b/examples/docs/resources/pc/demo/modal/cancel-event.vue new file mode 100644 index 000000000..3f60a5d48 --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/cancel-event.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/close-event.vue b/examples/docs/resources/pc/demo/modal/close-event.vue new file mode 100644 index 000000000..75fc98460 --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/close-event.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/confirm-event.vue b/examples/docs/resources/pc/demo/modal/confirm-event.vue new file mode 100644 index 000000000..3614e3640 --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/confirm-event.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/duration.vue b/examples/docs/resources/pc/demo/modal/duration.vue new file mode 100644 index 000000000..0d2b620a1 --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/duration.vue @@ -0,0 +1,36 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/esc-closable.vue b/examples/docs/resources/pc/demo/modal/esc-closable.vue new file mode 100644 index 000000000..e53a567bb --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/esc-closable.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/footer-slot.vue b/examples/docs/resources/pc/demo/modal/footer-slot.vue new file mode 100644 index 000000000..ba34808f3 --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/footer-slot.vue @@ -0,0 +1,26 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/fullscreen.vue b/examples/docs/resources/pc/demo/modal/fullscreen.vue new file mode 100644 index 000000000..99f621310 --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/fullscreen.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/grid.vue b/examples/docs/resources/pc/demo/modal/grid.vue new file mode 100644 index 000000000..7f59b2efb --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/grid.vue @@ -0,0 +1,59 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/hide-event.vue b/examples/docs/resources/pc/demo/modal/hide-event.vue new file mode 100644 index 000000000..46b1a6efa --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/hide-event.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/id.vue b/examples/docs/resources/pc/demo/modal/id.vue new file mode 100644 index 000000000..e48f16874 --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/id.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/is-form-reset.vue b/examples/docs/resources/pc/demo/modal/is-form-reset.vue new file mode 100644 index 000000000..872bbb947 --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/is-form-reset.vue @@ -0,0 +1,48 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/lock-scroll.vue b/examples/docs/resources/pc/demo/modal/lock-scroll.vue new file mode 100644 index 000000000..c0675bdd2 --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/lock-scroll.vue @@ -0,0 +1,22 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/lock-view.vue b/examples/docs/resources/pc/demo/modal/lock-view.vue new file mode 100644 index 000000000..da710ca1d --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/lock-view.vue @@ -0,0 +1,22 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/mask-closable.vue b/examples/docs/resources/pc/demo/modal/mask-closable.vue new file mode 100644 index 000000000..2c7968c9c --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/mask-closable.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/message.vue b/examples/docs/resources/pc/demo/modal/message.vue new file mode 100644 index 000000000..a27f7ec1e --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/message.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/min-height.vue b/examples/docs/resources/pc/demo/modal/min-height.vue new file mode 100644 index 000000000..830cd79a1 --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/min-height.vue @@ -0,0 +1,22 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/min-width.vue b/examples/docs/resources/pc/demo/modal/min-width.vue new file mode 100644 index 000000000..0c3186303 --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/min-width.vue @@ -0,0 +1,22 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/resize.vue b/examples/docs/resources/pc/demo/modal/resize.vue new file mode 100644 index 000000000..5d78dd5d2 --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/resize.vue @@ -0,0 +1,23 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/show-event.vue b/examples/docs/resources/pc/demo/modal/show-event.vue new file mode 100644 index 000000000..4300e75e3 --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/show-event.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/showFooter.vue b/examples/docs/resources/pc/demo/modal/showFooter.vue new file mode 100644 index 000000000..ebb9938ba --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/showFooter.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/showHeader.vue b/examples/docs/resources/pc/demo/modal/showHeader.vue new file mode 100644 index 000000000..6392e7abe --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/showHeader.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/status.vue b/examples/docs/resources/pc/demo/modal/status.vue new file mode 100644 index 000000000..8eb9b0647 --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/status.vue @@ -0,0 +1,36 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/title.vue b/examples/docs/resources/pc/demo/modal/title.vue new file mode 100644 index 000000000..8c2247d2b --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/title.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/top.vue b/examples/docs/resources/pc/demo/modal/top.vue new file mode 100644 index 000000000..a7efbfa30 --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/top.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/type.vue b/examples/docs/resources/pc/demo/modal/type.vue new file mode 100644 index 000000000..0aa3c48dd --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/type.vue @@ -0,0 +1,34 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/value.vue b/examples/docs/resources/pc/demo/modal/value.vue new file mode 100644 index 000000000..f131b7eef --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/value.vue @@ -0,0 +1,26 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/zIndex.vue b/examples/docs/resources/pc/demo/modal/zIndex.vue new file mode 100644 index 000000000..419348f7c --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/zIndex.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/modal/zoom-event.vue b/examples/docs/resources/pc/demo/modal/zoom-event.vue new file mode 100644 index 000000000..8cbb51362 --- /dev/null +++ b/examples/docs/resources/pc/demo/modal/zoom-event.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/nav-menu/basic-usage.vue b/examples/docs/resources/pc/demo/nav-menu/basic-usage.vue new file mode 100644 index 000000000..8179f5341 --- /dev/null +++ b/examples/docs/resources/pc/demo/nav-menu/basic-usage.vue @@ -0,0 +1,321 @@ + + + + + diff --git a/example/src/demo/pc/nav-menu/before-skip-prevent.vue b/examples/docs/resources/pc/demo/nav-menu/before-skip-prevent.vue similarity index 96% rename from example/src/demo/pc/nav-menu/before-skip-prevent.vue rename to examples/docs/resources/pc/demo/nav-menu/before-skip-prevent.vue index f1df0949e..60feb66e8 100644 --- a/example/src/demo/pc/nav-menu/before-skip-prevent.vue +++ b/examples/docs/resources/pc/demo/nav-menu/before-skip-prevent.vue @@ -8,7 +8,7 @@ - + + diff --git a/examples/docs/resources/pc/demo/nav-menu/custom-service.vue b/examples/docs/resources/pc/demo/nav-menu/custom-service.vue new file mode 100644 index 000000000..69e3216c8 --- /dev/null +++ b/examples/docs/resources/pc/demo/nav-menu/custom-service.vue @@ -0,0 +1,319 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/nav-menu/data-resource.vue b/examples/docs/resources/pc/demo/nav-menu/data-resource.vue new file mode 100644 index 000000000..8179f5341 --- /dev/null +++ b/examples/docs/resources/pc/demo/nav-menu/data-resource.vue @@ -0,0 +1,321 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/nav-menu/overflow.vue b/examples/docs/resources/pc/demo/nav-menu/overflow.vue new file mode 100644 index 000000000..480af4a8e --- /dev/null +++ b/examples/docs/resources/pc/demo/nav-menu/overflow.vue @@ -0,0 +1,321 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/nav-menu/slot-logo.vue b/examples/docs/resources/pc/demo/nav-menu/slot-logo.vue new file mode 100644 index 000000000..7b2b5b9cd --- /dev/null +++ b/examples/docs/resources/pc/demo/nav-menu/slot-logo.vue @@ -0,0 +1,328 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/nav-menu/slot-toolbar.vue b/examples/docs/resources/pc/demo/nav-menu/slot-toolbar.vue new file mode 100644 index 000000000..616157eaf --- /dev/null +++ b/examples/docs/resources/pc/demo/nav-menu/slot-toolbar.vue @@ -0,0 +1,334 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/notify/basic-usage.vue b/examples/docs/resources/pc/demo/notify/basic-usage.vue new file mode 100644 index 000000000..28b3ac918 --- /dev/null +++ b/examples/docs/resources/pc/demo/notify/basic-usage.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/docs/resources/pc/demo/notify/beforeClose.vue b/examples/docs/resources/pc/demo/notify/beforeClose.vue new file mode 100644 index 000000000..b230c33de --- /dev/null +++ b/examples/docs/resources/pc/demo/notify/beforeClose.vue @@ -0,0 +1,30 @@ + + + diff --git a/examples/docs/resources/pc/demo/notify/closeIcon.vue b/examples/docs/resources/pc/demo/notify/closeIcon.vue new file mode 100644 index 000000000..643d66bb2 --- /dev/null +++ b/examples/docs/resources/pc/demo/notify/closeIcon.vue @@ -0,0 +1,27 @@ + + + diff --git a/example/src/demo/pc/notify/debounceDelay.vue b/examples/docs/resources/pc/demo/notify/debounceDelay.vue similarity index 100% rename from example/src/demo/pc/notify/debounceDelay.vue rename to examples/docs/resources/pc/demo/notify/debounceDelay.vue diff --git a/examples/docs/resources/pc/demo/notify/duration.vue b/examples/docs/resources/pc/demo/notify/duration.vue new file mode 100644 index 000000000..f1d7b60e1 --- /dev/null +++ b/examples/docs/resources/pc/demo/notify/duration.vue @@ -0,0 +1,45 @@ + + + diff --git a/examples/docs/resources/pc/demo/notify/message.vue b/examples/docs/resources/pc/demo/notify/message.vue new file mode 100644 index 000000000..5a3fe67a8 --- /dev/null +++ b/examples/docs/resources/pc/demo/notify/message.vue @@ -0,0 +1,25 @@ + + + diff --git a/examples/docs/resources/pc/demo/notify/onClose.vue b/examples/docs/resources/pc/demo/notify/onClose.vue new file mode 100644 index 000000000..47f989b82 --- /dev/null +++ b/examples/docs/resources/pc/demo/notify/onClose.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/docs/resources/pc/demo/notify/position.vue b/examples/docs/resources/pc/demo/notify/position.vue new file mode 100644 index 000000000..d8273fb96 --- /dev/null +++ b/examples/docs/resources/pc/demo/notify/position.vue @@ -0,0 +1,32 @@ + + + diff --git a/examples/docs/resources/pc/demo/notify/showClose.vue b/examples/docs/resources/pc/demo/notify/showClose.vue new file mode 100644 index 000000000..cace9a527 --- /dev/null +++ b/examples/docs/resources/pc/demo/notify/showClose.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/docs/resources/pc/demo/notify/showIcon.vue b/examples/docs/resources/pc/demo/notify/showIcon.vue new file mode 100644 index 000000000..372955b62 --- /dev/null +++ b/examples/docs/resources/pc/demo/notify/showIcon.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/docs/resources/pc/demo/notify/statusIcon.vue b/examples/docs/resources/pc/demo/notify/statusIcon.vue new file mode 100644 index 000000000..b17a6ebad --- /dev/null +++ b/examples/docs/resources/pc/demo/notify/statusIcon.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/docs/resources/pc/demo/notify/title.vue b/examples/docs/resources/pc/demo/notify/title.vue new file mode 100644 index 000000000..ad2fb2ed5 --- /dev/null +++ b/examples/docs/resources/pc/demo/notify/title.vue @@ -0,0 +1,25 @@ + + + diff --git a/examples/docs/resources/pc/demo/notify/type.vue b/examples/docs/resources/pc/demo/notify/type.vue new file mode 100644 index 000000000..1cc2bb4af --- /dev/null +++ b/examples/docs/resources/pc/demo/notify/type.vue @@ -0,0 +1,51 @@ + + + diff --git a/example/src/demo/pc/notify/verticalOffset.vue b/examples/docs/resources/pc/demo/notify/verticalOffset.vue similarity index 95% rename from example/src/demo/pc/notify/verticalOffset.vue rename to examples/docs/resources/pc/demo/notify/verticalOffset.vue index 35650168b..810ee245b 100644 --- a/example/src/demo/pc/notify/verticalOffset.vue +++ b/examples/docs/resources/pc/demo/notify/verticalOffset.vue @@ -20,7 +20,7 @@ export default { position: 'top-right', duration: 500000, customClass: 'my-custom-cls', - verticalOffset: '100' + verticalOffset: 100 }) } } diff --git a/examples/docs/resources/pc/demo/numeric/about-step.vue b/examples/docs/resources/pc/demo/numeric/about-step.vue new file mode 100644 index 000000000..b01517079 --- /dev/null +++ b/examples/docs/resources/pc/demo/numeric/about-step.vue @@ -0,0 +1,19 @@ + + + diff --git a/example/src/demo/pc/numeric/allow-empty.vue b/examples/docs/resources/pc/demo/numeric/allow-empty.vue similarity index 95% rename from example/src/demo/pc/numeric/allow-empty.vue rename to examples/docs/resources/pc/demo/numeric/allow-empty.vue index 94c07def2..41f09e309 100644 --- a/example/src/demo/pc/numeric/allow-empty.vue +++ b/examples/docs/resources/pc/demo/numeric/allow-empty.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/numeric/blur-event.vue b/examples/docs/resources/pc/demo/numeric/blur-event.vue similarity index 94% rename from example/src/demo/pc/numeric/blur-event.vue rename to examples/docs/resources/pc/demo/numeric/blur-event.vue index 01338666f..4725de137 100644 --- a/example/src/demo/pc/numeric/blur-event.vue +++ b/examples/docs/resources/pc/demo/numeric/blur-event.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/numeric/controls.vue b/examples/docs/resources/pc/demo/numeric/controls.vue new file mode 100644 index 000000000..1fca1694c --- /dev/null +++ b/examples/docs/resources/pc/demo/numeric/controls.vue @@ -0,0 +1,20 @@ + + + diff --git a/examples/docs/resources/pc/demo/numeric/dynamic-disabled.vue b/examples/docs/resources/pc/demo/numeric/dynamic-disabled.vue new file mode 100644 index 000000000..e6da667e3 --- /dev/null +++ b/examples/docs/resources/pc/demo/numeric/dynamic-disabled.vue @@ -0,0 +1,20 @@ + + + diff --git a/example/src/demo/pc/numeric/focus-event.vue b/examples/docs/resources/pc/demo/numeric/focus-event.vue similarity index 94% rename from example/src/demo/pc/numeric/focus-event.vue rename to examples/docs/resources/pc/demo/numeric/focus-event.vue index 78548e458..364175409 100644 --- a/example/src/demo/pc/numeric/focus-event.vue +++ b/examples/docs/resources/pc/demo/numeric/focus-event.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/numeric/mouse-wheel.vue b/examples/docs/resources/pc/demo/numeric/mouse-wheel.vue similarity index 93% rename from example/src/demo/pc/numeric/mouse-wheel.vue rename to examples/docs/resources/pc/demo/numeric/mouse-wheel.vue index 64a556609..72b942581 100644 --- a/example/src/demo/pc/numeric/mouse-wheel.vue +++ b/examples/docs/resources/pc/demo/numeric/mouse-wheel.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/package.json b/examples/docs/resources/pc/demo/package.json new file mode 100644 index 000000000..7f2a07fb3 --- /dev/null +++ b/examples/docs/resources/pc/demo/package.json @@ -0,0 +1,11 @@ +{ + "name": "@opentiny/vue-example", + "version": "1.0.0", + "description": "TINY 3.0 vue example", + "main": "index.js", + "scripts": { + "test": "echo \"Error: no test specified\" && exit 1" + }, + "author": "", + "license": "ISC" +} diff --git a/examples/docs/resources/pc/demo/pager/basic-usage.vue b/examples/docs/resources/pc/demo/pager/basic-usage.vue new file mode 100644 index 000000000..6bebc1c93 --- /dev/null +++ b/examples/docs/resources/pc/demo/pager/basic-usage.vue @@ -0,0 +1,17 @@ + + + diff --git a/example/src/demo/pc/pager/before-page-change.vue b/examples/docs/resources/pc/demo/pager/before-page-change.vue similarity index 97% rename from example/src/demo/pc/pager/before-page-change.vue rename to examples/docs/resources/pc/demo/pager/before-page-change.vue index bcbb3b25c..233876e60 100644 --- a/example/src/demo/pc/pager/before-page-change.vue +++ b/examples/docs/resources/pc/demo/pager/before-page-change.vue @@ -11,7 +11,7 @@ - diff --git a/example/src/demo/pc/pager/page-count.vue b/examples/docs/resources/pc/demo/pager/page-count.vue similarity index 91% rename from example/src/demo/pc/pager/page-count.vue rename to examples/docs/resources/pc/demo/pager/page-count.vue index 2def35b89..460f159fb 100644 --- a/example/src/demo/pc/pager/page-count.vue +++ b/examples/docs/resources/pc/demo/pager/page-count.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/pager/pager-count.vue b/examples/docs/resources/pc/demo/pager/pager-count.vue similarity index 91% rename from example/src/demo/pc/pager/pager-count.vue rename to examples/docs/resources/pc/demo/pager/pager-count.vue index 67d3324da..23f3adc88 100644 --- a/example/src/demo/pc/pager/pager-count.vue +++ b/examples/docs/resources/pc/demo/pager/pager-count.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/pager/pager-mode-fixed.vue b/examples/docs/resources/pc/demo/pager/pager-mode-fixed.vue similarity index 93% rename from example/src/demo/pc/pager/pager-mode-fixed.vue rename to examples/docs/resources/pc/demo/pager/pager-mode-fixed.vue index 6a6e23c79..aaafa6c95 100644 --- a/example/src/demo/pc/pager/pager-mode-fixed.vue +++ b/examples/docs/resources/pc/demo/pager/pager-mode-fixed.vue @@ -4,7 +4,7 @@ - diff --git a/examples/docs/resources/pc/demo/pop-upload/basic-usage.vue b/examples/docs/resources/pc/demo/pop-upload/basic-usage.vue new file mode 100644 index 000000000..b6ef21558 --- /dev/null +++ b/examples/docs/resources/pc/demo/pop-upload/basic-usage.vue @@ -0,0 +1,18 @@ + + + diff --git a/example/src/demo/pc/pop-upload/before-upload.vue b/examples/docs/resources/pc/demo/pop-upload/before-upload.vue similarity index 96% rename from example/src/demo/pc/pop-upload/before-upload.vue rename to examples/docs/resources/pc/demo/pop-upload/before-upload.vue index 4a3d54d49..c1970e400 100644 --- a/example/src/demo/pc/pop-upload/before-upload.vue +++ b/examples/docs/resources/pc/demo/pop-upload/before-upload.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/pop-upload/file-limit.vue b/examples/docs/resources/pc/demo/pop-upload/file-limit.vue similarity index 93% rename from example/src/demo/pc/pop-upload/file-limit.vue rename to examples/docs/resources/pc/demo/pop-upload/file-limit.vue index 3ba906d67..03e8d8ffc 100644 --- a/example/src/demo/pc/pop-upload/file-limit.vue +++ b/examples/docs/resources/pc/demo/pop-upload/file-limit.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/pop-upload/max-upload-file-size.vue b/examples/docs/resources/pc/demo/pop-upload/max-upload-file-size.vue similarity index 94% rename from example/src/demo/pc/pop-upload/max-upload-file-size.vue rename to examples/docs/resources/pc/demo/pop-upload/max-upload-file-size.vue index 3bfd59023..a552b54b8 100644 --- a/example/src/demo/pc/pop-upload/max-upload-file-size.vue +++ b/examples/docs/resources/pc/demo/pop-upload/max-upload-file-size.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/pop-upload/size.vue b/examples/docs/resources/pc/demo/pop-upload/size.vue new file mode 100644 index 000000000..5cc578d34 --- /dev/null +++ b/examples/docs/resources/pc/demo/pop-upload/size.vue @@ -0,0 +1,18 @@ + + + diff --git a/example/src/demo/pc/pop-upload/upload-name.vue b/examples/docs/resources/pc/demo/pop-upload/upload-name.vue similarity index 93% rename from example/src/demo/pc/pop-upload/upload-name.vue rename to examples/docs/resources/pc/demo/pop-upload/upload-name.vue index 023a327ec..668a20207 100644 --- a/example/src/demo/pc/pop-upload/upload-name.vue +++ b/examples/docs/resources/pc/demo/pop-upload/upload-name.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/popeditor/before-reset.vue b/examples/docs/resources/pc/demo/popeditor/before-reset.vue similarity index 91% rename from example/src/demo/pc/popeditor/before-reset.vue rename to examples/docs/resources/pc/demo/popeditor/before-reset.vue index a94430c1e..5651821e0 100644 --- a/example/src/demo/pc/popeditor/before-reset.vue +++ b/examples/docs/resources/pc/demo/popeditor/before-reset.vue @@ -1,8 +1,15 @@ - diff --git a/examples/docs/resources/pc/demo/popeditor/close-event.vue b/examples/docs/resources/pc/demo/popeditor/close-event.vue new file mode 100644 index 000000000..a1e590c56 --- /dev/null +++ b/examples/docs/resources/pc/demo/popeditor/close-event.vue @@ -0,0 +1,129 @@ + + + diff --git a/example/src/demo/pc/popeditor/condition-form.vue b/examples/docs/resources/pc/demo/popeditor/condition-form.vue similarity index 99% rename from example/src/demo/pc/popeditor/condition-form.vue rename to examples/docs/resources/pc/demo/popeditor/condition-form.vue index de6e51dcd..402588125 100644 --- a/example/src/demo/pc/popeditor/condition-form.vue +++ b/examples/docs/resources/pc/demo/popeditor/condition-form.vue @@ -31,7 +31,7 @@ - diff --git a/examples/docs/resources/pc/demo/popeditor/draggable.vue b/examples/docs/resources/pc/demo/popeditor/draggable.vue new file mode 100644 index 000000000..0b96c59c6 --- /dev/null +++ b/examples/docs/resources/pc/demo/popeditor/draggable.vue @@ -0,0 +1,110 @@ + + + diff --git a/examples/docs/resources/pc/demo/popeditor/events.vue b/examples/docs/resources/pc/demo/popeditor/events.vue new file mode 100644 index 000000000..f13398c77 --- /dev/null +++ b/examples/docs/resources/pc/demo/popeditor/events.vue @@ -0,0 +1,132 @@ + + + diff --git a/examples/docs/resources/pc/demo/popeditor/grid.vue b/examples/docs/resources/pc/demo/popeditor/grid.vue new file mode 100644 index 000000000..11da1a25c --- /dev/null +++ b/examples/docs/resources/pc/demo/popeditor/grid.vue @@ -0,0 +1,105 @@ + + + diff --git a/examples/docs/resources/pc/demo/popeditor/icon.vue b/examples/docs/resources/pc/demo/popeditor/icon.vue new file mode 100644 index 000000000..98d93a365 --- /dev/null +++ b/examples/docs/resources/pc/demo/popeditor/icon.vue @@ -0,0 +1,105 @@ + + + diff --git a/example/src/demo/pc/popeditor/multi-value-array.vue b/examples/docs/resources/pc/demo/popeditor/multi-value-array.vue similarity index 99% rename from example/src/demo/pc/popeditor/multi-value-array.vue rename to examples/docs/resources/pc/demo/popeditor/multi-value-array.vue index f6b465f38..c8640e01a 100644 --- a/example/src/demo/pc/popeditor/multi-value-array.vue +++ b/examples/docs/resources/pc/demo/popeditor/multi-value-array.vue @@ -14,7 +14,7 @@ - diff --git a/examples/docs/resources/pc/demo/popeditor/remote-search.vue b/examples/docs/resources/pc/demo/popeditor/remote-search.vue new file mode 100644 index 000000000..308512a5a --- /dev/null +++ b/examples/docs/resources/pc/demo/popeditor/remote-search.vue @@ -0,0 +1,81 @@ + + + diff --git a/example/src/demo/pc/popeditor/render-text.vue b/examples/docs/resources/pc/demo/popeditor/render-text.vue similarity index 79% rename from example/src/demo/pc/popeditor/render-text.vue rename to examples/docs/resources/pc/demo/popeditor/render-text.vue index 862352942..bcadb399b 100644 --- a/example/src/demo/pc/popeditor/render-text.vue +++ b/examples/docs/resources/pc/demo/popeditor/render-text.vue @@ -12,7 +12,7 @@ > - diff --git a/example/src/demo/pc/popeditor/show-history.vue b/examples/docs/resources/pc/demo/popeditor/show-history.vue similarity index 99% rename from example/src/demo/pc/popeditor/show-history.vue rename to examples/docs/resources/pc/demo/popeditor/show-history.vue index bf2f86189..0282bd4b3 100644 --- a/example/src/demo/pc/popeditor/show-history.vue +++ b/examples/docs/resources/pc/demo/popeditor/show-history.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/popeditor/size.vue b/examples/docs/resources/pc/demo/popeditor/size.vue new file mode 100644 index 000000000..8d5d5f57a --- /dev/null +++ b/examples/docs/resources/pc/demo/popeditor/size.vue @@ -0,0 +1,116 @@ + + + diff --git a/examples/docs/resources/pc/demo/popeditor/slot.vue b/examples/docs/resources/pc/demo/popeditor/slot.vue new file mode 100644 index 000000000..7be53c475 --- /dev/null +++ b/examples/docs/resources/pc/demo/popeditor/slot.vue @@ -0,0 +1,132 @@ + + + diff --git a/examples/docs/resources/pc/demo/popeditor/tabindex.vue b/examples/docs/resources/pc/demo/popeditor/tabindex.vue new file mode 100644 index 000000000..c71bbe43a --- /dev/null +++ b/examples/docs/resources/pc/demo/popeditor/tabindex.vue @@ -0,0 +1,116 @@ + + + + + diff --git a/example/src/demo/pc/popeditor/textField.vue b/examples/docs/resources/pc/demo/popeditor/textField.vue similarity index 99% rename from example/src/demo/pc/popeditor/textField.vue rename to examples/docs/resources/pc/demo/popeditor/textField.vue index 2661936bc..922b3b3ab 100644 --- a/example/src/demo/pc/popeditor/textField.vue +++ b/examples/docs/resources/pc/demo/popeditor/textField.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/popeditor/tree.vue b/examples/docs/resources/pc/demo/popeditor/tree.vue similarity index 98% rename from example/src/demo/pc/popeditor/tree.vue rename to examples/docs/resources/pc/demo/popeditor/tree.vue index 3b72ffb26..bf1af5444 100644 --- a/example/src/demo/pc/popeditor/tree.vue +++ b/examples/docs/resources/pc/demo/popeditor/tree.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/popover/arrow-offset.vue b/examples/docs/resources/pc/demo/popover/arrow-offset.vue new file mode 100644 index 000000000..70a2694ce --- /dev/null +++ b/examples/docs/resources/pc/demo/popover/arrow-offset.vue @@ -0,0 +1,36 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/popover/basic-usage.vue b/examples/docs/resources/pc/demo/popover/basic-usage.vue new file mode 100644 index 000000000..55e846b8a --- /dev/null +++ b/examples/docs/resources/pc/demo/popover/basic-usage.vue @@ -0,0 +1,25 @@ + + + diff --git a/examples/docs/resources/pc/demo/popover/close-delay.vue b/examples/docs/resources/pc/demo/popover/close-delay.vue new file mode 100644 index 000000000..31271584a --- /dev/null +++ b/examples/docs/resources/pc/demo/popover/close-delay.vue @@ -0,0 +1,30 @@ + + + diff --git a/example/src/demo/pc/popover/custom-tip-text.vue b/examples/docs/resources/pc/demo/popover/custom-tip-text.vue similarity index 79% rename from example/src/demo/pc/popover/custom-tip-text.vue rename to examples/docs/resources/pc/demo/popover/custom-tip-text.vue index cb7ad577a..fbaeae107 100644 --- a/example/src/demo/pc/popover/custom-tip-text.vue +++ b/examples/docs/resources/pc/demo/popover/custom-tip-text.vue @@ -3,7 +3,7 @@
@@ -11,19 +11,20 @@
这是一段内容,这是一段内容,这是一段内容,这是一段内容。
- + + diff --git a/examples/docs/resources/pc/demo/popover/dynamic-disable.vue b/examples/docs/resources/pc/demo/popover/dynamic-disable.vue new file mode 100644 index 000000000..e4543c0e3 --- /dev/null +++ b/examples/docs/resources/pc/demo/popover/dynamic-disable.vue @@ -0,0 +1,45 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/popover/frame-offset.vue b/examples/docs/resources/pc/demo/popover/frame-offset.vue new file mode 100644 index 000000000..7f9c0fe4b --- /dev/null +++ b/examples/docs/resources/pc/demo/popover/frame-offset.vue @@ -0,0 +1,36 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/popover/hidden-arrow.vue b/examples/docs/resources/pc/demo/popover/hidden-arrow.vue new file mode 100644 index 000000000..0cb7a5d1a --- /dev/null +++ b/examples/docs/resources/pc/demo/popover/hidden-arrow.vue @@ -0,0 +1,45 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/popover/open-delay.vue b/examples/docs/resources/pc/demo/popover/open-delay.vue new file mode 100644 index 000000000..9d123896d --- /dev/null +++ b/examples/docs/resources/pc/demo/popover/open-delay.vue @@ -0,0 +1,30 @@ + + + diff --git a/examples/docs/resources/pc/demo/popover/popover-content.vue b/examples/docs/resources/pc/demo/popover/popover-content.vue new file mode 100644 index 000000000..b153a57fa --- /dev/null +++ b/examples/docs/resources/pc/demo/popover/popover-content.vue @@ -0,0 +1,18 @@ + + + diff --git a/example/src/demo/pc/popover/popover-events.vue b/examples/docs/resources/pc/demo/popover/popover-events.vue similarity index 85% rename from example/src/demo/pc/popover/popover-events.vue rename to examples/docs/resources/pc/demo/popover/popover-events.vue index 8bdf612fd..eb7eaa5ca 100644 --- a/example/src/demo/pc/popover/popover-events.vue +++ b/examples/docs/resources/pc/demo/popover/popover-events.vue @@ -11,17 +11,18 @@ :content="content" > - + + diff --git a/examples/docs/resources/pc/demo/popover/popover-width.vue b/examples/docs/resources/pc/demo/popover/popover-width.vue new file mode 100644 index 000000000..611f6d648 --- /dev/null +++ b/examples/docs/resources/pc/demo/popover/popover-width.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/popover/popper-class.vue b/examples/docs/resources/pc/demo/popover/popper-class.vue new file mode 100644 index 000000000..fe7f31377 --- /dev/null +++ b/examples/docs/resources/pc/demo/popover/popper-class.vue @@ -0,0 +1,57 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/popover/popper-options.vue b/examples/docs/resources/pc/demo/popover/popper-options.vue new file mode 100644 index 000000000..859f28646 --- /dev/null +++ b/examples/docs/resources/pc/demo/popover/popper-options.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/popover/trigger-mode.vue b/examples/docs/resources/pc/demo/popover/trigger-mode.vue new file mode 100644 index 000000000..6cdb40195 --- /dev/null +++ b/examples/docs/resources/pc/demo/popover/trigger-mode.vue @@ -0,0 +1,72 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/popover/trigger-reference.vue b/examples/docs/resources/pc/demo/popover/trigger-reference.vue new file mode 100644 index 000000000..91a05e7ce --- /dev/null +++ b/examples/docs/resources/pc/demo/popover/trigger-reference.vue @@ -0,0 +1,24 @@ + + + diff --git a/examples/docs/resources/pc/demo/progress/basic-usage.vue b/examples/docs/resources/pc/demo/progress/basic-usage.vue new file mode 100644 index 000000000..f39bc0300 --- /dev/null +++ b/examples/docs/resources/pc/demo/progress/basic-usage.vue @@ -0,0 +1,32 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/progress/custom-color.vue b/examples/docs/resources/pc/demo/progress/custom-color.vue new file mode 100644 index 000000000..91357f9a5 --- /dev/null +++ b/examples/docs/resources/pc/demo/progress/custom-color.vue @@ -0,0 +1,42 @@ + + + diff --git a/examples/docs/resources/pc/demo/progress/dynamic-control-changes.vue b/examples/docs/resources/pc/demo/progress/dynamic-control-changes.vue new file mode 100644 index 000000000..2f343ceb2 --- /dev/null +++ b/examples/docs/resources/pc/demo/progress/dynamic-control-changes.vue @@ -0,0 +1,44 @@ + + + diff --git a/examples/docs/resources/pc/demo/progress/format-text.vue b/examples/docs/resources/pc/demo/progress/format-text.vue new file mode 100644 index 000000000..cee00f52e --- /dev/null +++ b/examples/docs/resources/pc/demo/progress/format-text.vue @@ -0,0 +1,46 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/progress/progress-status.vue b/examples/docs/resources/pc/demo/progress/progress-status.vue new file mode 100644 index 000000000..c56a7b44a --- /dev/null +++ b/examples/docs/resources/pc/demo/progress/progress-status.vue @@ -0,0 +1,19 @@ + + + diff --git a/examples/docs/resources/pc/demo/progress/progress-type-circle.vue b/examples/docs/resources/pc/demo/progress/progress-type-circle.vue new file mode 100644 index 000000000..50697bb29 --- /dev/null +++ b/examples/docs/resources/pc/demo/progress/progress-type-circle.vue @@ -0,0 +1,29 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/progress/progress-type-dashboard.vue b/examples/docs/resources/pc/demo/progress/progress-type-dashboard.vue new file mode 100644 index 000000000..792e2be2a --- /dev/null +++ b/examples/docs/resources/pc/demo/progress/progress-type-dashboard.vue @@ -0,0 +1,37 @@ + + + diff --git a/examples/docs/resources/pc/demo/progress/progress-type.vue b/examples/docs/resources/pc/demo/progress/progress-type.vue new file mode 100644 index 000000000..cf6f8d14e --- /dev/null +++ b/examples/docs/resources/pc/demo/progress/progress-type.vue @@ -0,0 +1,19 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/progress/progress-width.vue b/examples/docs/resources/pc/demo/progress/progress-width.vue new file mode 100644 index 000000000..66df71326 --- /dev/null +++ b/examples/docs/resources/pc/demo/progress/progress-width.vue @@ -0,0 +1,20 @@ + + + diff --git a/examples/docs/resources/pc/demo/progress/text-inside-or-no-text.vue b/examples/docs/resources/pc/demo/progress/text-inside-or-no-text.vue new file mode 100644 index 000000000..ca393bae8 --- /dev/null +++ b/examples/docs/resources/pc/demo/progress/text-inside-or-no-text.vue @@ -0,0 +1,25 @@ + + + diff --git a/examples/docs/resources/pc/demo/radio/active-color.vue b/examples/docs/resources/pc/demo/radio/active-color.vue new file mode 100644 index 000000000..a0a5e0f22 --- /dev/null +++ b/examples/docs/resources/pc/demo/radio/active-color.vue @@ -0,0 +1,23 @@ + + + diff --git a/examples/docs/resources/pc/demo/radio/basic-usage.vue b/examples/docs/resources/pc/demo/radio/basic-usage.vue new file mode 100644 index 000000000..af02ca38b --- /dev/null +++ b/examples/docs/resources/pc/demo/radio/basic-usage.vue @@ -0,0 +1,21 @@ + + + diff --git a/examples/docs/resources/pc/demo/radio/dynamic-disable.vue b/examples/docs/resources/pc/demo/radio/dynamic-disable.vue new file mode 100644 index 000000000..e7059a3a0 --- /dev/null +++ b/examples/docs/resources/pc/demo/radio/dynamic-disable.vue @@ -0,0 +1,40 @@ + + + diff --git a/examples/docs/resources/pc/demo/radio/group-options.vue b/examples/docs/resources/pc/demo/radio/group-options.vue new file mode 100644 index 000000000..a1d91c608 --- /dev/null +++ b/examples/docs/resources/pc/demo/radio/group-options.vue @@ -0,0 +1,27 @@ + + + diff --git a/example/src/demo/pc/radio/radio-button.vue b/examples/docs/resources/pc/demo/radio/radio-button.vue similarity index 96% rename from example/src/demo/pc/radio/radio-button.vue rename to examples/docs/resources/pc/demo/radio/radio-button.vue index f8b90472f..169cd18ab 100644 --- a/example/src/demo/pc/radio/radio-button.vue +++ b/examples/docs/resources/pc/demo/radio/radio-button.vue @@ -6,7 +6,7 @@ - diff --git a/examples/docs/resources/pc/demo/radio/with-border.vue b/examples/docs/resources/pc/demo/radio/with-border.vue new file mode 100644 index 000000000..d776af2cd --- /dev/null +++ b/examples/docs/resources/pc/demo/radio/with-border.vue @@ -0,0 +1,22 @@ + + + diff --git a/example/src/demo/pc/rate/allow-half.vue b/examples/docs/resources/pc/demo/rate/allow-half.vue similarity index 92% rename from example/src/demo/pc/rate/allow-half.vue rename to examples/docs/resources/pc/demo/rate/allow-half.vue index 87cc5bad6..a45cf0148 100644 --- a/example/src/demo/pc/rate/allow-half.vue +++ b/examples/docs/resources/pc/demo/rate/allow-half.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/rate/custom-3-threshold-colors.vue b/examples/docs/resources/pc/demo/rate/custom-3-threshold-colors.vue similarity index 93% rename from example/src/demo/pc/rate/custom-3-threshold-colors.vue rename to examples/docs/resources/pc/demo/rate/custom-3-threshold-colors.vue index cc67b8be3..a0c76f158 100644 --- a/example/src/demo/pc/rate/custom-3-threshold-colors.vue +++ b/examples/docs/resources/pc/demo/rate/custom-3-threshold-colors.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/rate/max-score.vue b/examples/docs/resources/pc/demo/rate/max-score.vue similarity index 91% rename from example/src/demo/pc/rate/max-score.vue rename to examples/docs/resources/pc/demo/rate/max-score.vue index 495432505..70eeb56be 100644 --- a/example/src/demo/pc/rate/max-score.vue +++ b/examples/docs/resources/pc/demo/rate/max-score.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/roles/fetch-role.vue b/examples/docs/resources/pc/demo/roles/fetch-role.vue similarity index 94% rename from example/src/demo/pc/roles/fetch-role.vue rename to examples/docs/resources/pc/demo/roles/fetch-role.vue index 55cb54534..09605a435 100644 --- a/example/src/demo/pc/roles/fetch-role.vue +++ b/examples/docs/resources/pc/demo/roles/fetch-role.vue @@ -2,7 +2,7 @@ - + + diff --git a/example/src/demo/pc/row/gutter-nospace.vue b/examples/docs/resources/pc/demo/row/gutter-nospace.vue similarity index 99% rename from example/src/demo/pc/row/gutter-nospace.vue rename to examples/docs/resources/pc/demo/row/gutter-nospace.vue index 4e3b9442a..635dacadc 100644 --- a/example/src/demo/pc/row/gutter-nospace.vue +++ b/examples/docs/resources/pc/demo/row/gutter-nospace.vue @@ -49,7 +49,7 @@ - + + diff --git a/example/src/demo/pc/row/justify.vue b/examples/docs/resources/pc/demo/row/justify.vue similarity index 99% rename from example/src/demo/pc/row/justify.vue rename to examples/docs/resources/pc/demo/row/justify.vue index 1bd02996d..0fd4dca0b 100644 --- a/example/src/demo/pc/row/justify.vue +++ b/examples/docs/resources/pc/demo/row/justify.vue @@ -58,7 +58,7 @@ - + + diff --git a/example/src/demo/pc/row/tag1.vue b/examples/docs/resources/pc/demo/row/tag1.vue similarity index 97% rename from example/src/demo/pc/row/tag1.vue rename to examples/docs/resources/pc/demo/row/tag1.vue index e2c452e42..1a9211f77 100644 --- a/example/src/demo/pc/row/tag1.vue +++ b/examples/docs/resources/pc/demo/row/tag1.vue @@ -14,7 +14,7 @@ - diff --git a/example/src/demo/pc/scroll-text/custom-scroll-text.vue b/examples/docs/resources/pc/demo/scroll-text/custom-scroll-text.vue similarity index 92% rename from example/src/demo/pc/scroll-text/custom-scroll-text.vue rename to examples/docs/resources/pc/demo/scroll-text/custom-scroll-text.vue index 91a7cffa0..c86a0feee 100644 --- a/example/src/demo/pc/scroll-text/custom-scroll-text.vue +++ b/examples/docs/resources/pc/demo/scroll-text/custom-scroll-text.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/search/basic-usage.vue b/examples/docs/resources/pc/demo/search/basic-usage.vue new file mode 100644 index 000000000..ffebaa0be --- /dev/null +++ b/examples/docs/resources/pc/demo/search/basic-usage.vue @@ -0,0 +1,21 @@ + + + diff --git a/example/src/demo/pc/search/change-events.vue b/examples/docs/resources/pc/demo/search/change-events.vue similarity index 93% rename from example/src/demo/pc/search/change-events.vue rename to examples/docs/resources/pc/demo/search/change-events.vue index de5a08e20..daa37ad92 100644 --- a/example/src/demo/pc/search/change-events.vue +++ b/examples/docs/resources/pc/demo/search/change-events.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/search/custom-search-types.vue b/examples/docs/resources/pc/demo/search/custom-search-types.vue similarity index 96% rename from example/src/demo/pc/search/custom-search-types.vue rename to examples/docs/resources/pc/demo/search/custom-search-types.vue index 8b0bdbd6d..393590192 100644 --- a/example/src/demo/pc/search/custom-search-types.vue +++ b/examples/docs/resources/pc/demo/search/custom-search-types.vue @@ -8,7 +8,7 @@ - diff --git a/examples/docs/resources/pc/demo/search/mini-mode.vue b/examples/docs/resources/pc/demo/search/mini-mode.vue new file mode 100644 index 000000000..0252c69ec --- /dev/null +++ b/examples/docs/resources/pc/demo/search/mini-mode.vue @@ -0,0 +1,13 @@ + + + diff --git a/examples/docs/resources/pc/demo/search/search-events.vue b/examples/docs/resources/pc/demo/search/search-events.vue new file mode 100644 index 000000000..bf313b489 --- /dev/null +++ b/examples/docs/resources/pc/demo/search/search-events.vue @@ -0,0 +1,18 @@ + + + diff --git a/example/src/demo/pc/search/search-types.vue b/examples/docs/resources/pc/demo/search/search-types.vue similarity index 95% rename from example/src/demo/pc/search/search-types.vue rename to examples/docs/resources/pc/demo/search/search-types.vue index ec7fca7db..24f30e411 100644 --- a/example/src/demo/pc/search/search-types.vue +++ b/examples/docs/resources/pc/demo/search/search-types.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/select/binding-obj.vue b/examples/docs/resources/pc/demo/select/binding-obj.vue similarity index 97% rename from example/src/demo/pc/select/binding-obj.vue rename to examples/docs/resources/pc/demo/select/binding-obj.vue index ba02afe80..14d48928d 100644 --- a/example/src/demo/pc/select/binding-obj.vue +++ b/examples/docs/resources/pc/demo/select/binding-obj.vue @@ -7,7 +7,7 @@ - diff --git a/examples/docs/resources/pc/demo/select/collapse-tags.vue b/examples/docs/resources/pc/demo/select/collapse-tags.vue new file mode 100644 index 000000000..0ad4de68e --- /dev/null +++ b/examples/docs/resources/pc/demo/select/collapse-tags.vue @@ -0,0 +1,43 @@ + + + diff --git a/example/src/demo/pc/select/custom-options.vue b/examples/docs/resources/pc/demo/select/custom-options.vue similarity index 98% rename from example/src/demo/pc/select/custom-options.vue rename to examples/docs/resources/pc/demo/select/custom-options.vue index 3a6294314..0175c086a 100644 --- a/example/src/demo/pc/select/custom-options.vue +++ b/examples/docs/resources/pc/demo/select/custom-options.vue @@ -9,7 +9,7 @@ - diff --git a/examples/docs/resources/pc/demo/select/custom-reference-slot.vue b/examples/docs/resources/pc/demo/select/custom-reference-slot.vue new file mode 100644 index 000000000..c039ab2cd --- /dev/null +++ b/examples/docs/resources/pc/demo/select/custom-reference-slot.vue @@ -0,0 +1,48 @@ + + + diff --git a/example/src/demo/pc/select/disable-grid-select-radio.vue b/examples/docs/resources/pc/demo/select/disable-grid-select-radio.vue similarity index 99% rename from example/src/demo/pc/select/disable-grid-select-radio.vue rename to examples/docs/resources/pc/demo/select/disable-grid-select-radio.vue index 0b245423d..5b73992d7 100644 --- a/example/src/demo/pc/select/disable-grid-select-radio.vue +++ b/examples/docs/resources/pc/demo/select/disable-grid-select-radio.vue @@ -23,7 +23,7 @@ - diff --git a/example/src/demo/pc/select/envts-change.vue b/examples/docs/resources/pc/demo/select/envts-change.vue similarity index 98% rename from example/src/demo/pc/select/envts-change.vue rename to examples/docs/resources/pc/demo/select/envts-change.vue index 4aeeeb1fb..46e073c5e 100644 --- a/example/src/demo/pc/select/envts-change.vue +++ b/examples/docs/resources/pc/demo/select/envts-change.vue @@ -4,7 +4,7 @@ - diff --git a/example/src/demo/pc/select/focus-remote-method.vue b/examples/docs/resources/pc/demo/select/focus-remote-method.vue similarity index 88% rename from example/src/demo/pc/select/focus-remote-method.vue rename to examples/docs/resources/pc/demo/select/focus-remote-method.vue index 38fe0742c..d0549663f 100644 --- a/example/src/demo/pc/select/focus-remote-method.vue +++ b/examples/docs/resources/pc/demo/select/focus-remote-method.vue @@ -14,7 +14,7 @@ - diff --git a/examples/docs/resources/pc/demo/select/name.vue b/examples/docs/resources/pc/demo/select/name.vue new file mode 100644 index 000000000..a66b2dd51 --- /dev/null +++ b/examples/docs/resources/pc/demo/select/name.vue @@ -0,0 +1,43 @@ + + + diff --git a/example/src/demo/pc/select/nest-checkbox-grid-clearable.vue b/examples/docs/resources/pc/demo/select/nest-checkbox-grid-clearable.vue similarity index 92% rename from example/src/demo/pc/select/nest-checkbox-grid-clearable.vue rename to examples/docs/resources/pc/demo/select/nest-checkbox-grid-clearable.vue index 2c03808da..a194b9da7 100644 --- a/example/src/demo/pc/select/nest-checkbox-grid-clearable.vue +++ b/examples/docs/resources/pc/demo/select/nest-checkbox-grid-clearable.vue @@ -16,7 +16,7 @@ - - diff --git a/examples/docs/resources/pc/demo/select/tag-copy-all.vue b/examples/docs/resources/pc/demo/select/tag-copy-all.vue new file mode 100644 index 000000000..dcb4b8f10 --- /dev/null +++ b/examples/docs/resources/pc/demo/select/tag-copy-all.vue @@ -0,0 +1,58 @@ + + + diff --git a/example/src/demo/pc/select/tag-select.vue b/examples/docs/resources/pc/demo/select/tag-select.vue similarity index 93% rename from example/src/demo/pc/select/tag-select.vue rename to examples/docs/resources/pc/demo/select/tag-select.vue index 17778d85b..1fc01b5cf 100644 --- a/example/src/demo/pc/select/tag-select.vue +++ b/examples/docs/resources/pc/demo/select/tag-select.vue @@ -4,7 +4,7 @@ - diff --git a/example/src/demo/pc/slide-bar/custom-content.vue b/examples/docs/resources/pc/demo/slide-bar/custom-content.vue similarity index 97% rename from example/src/demo/pc/slide-bar/custom-content.vue rename to examples/docs/resources/pc/demo/slide-bar/custom-content.vue index a2c9d4d6d..c8f855023 100644 --- a/example/src/demo/pc/slide-bar/custom-content.vue +++ b/examples/docs/resources/pc/demo/slide-bar/custom-content.vue @@ -7,7 +7,7 @@ - diff --git a/examples/docs/resources/pc/demo/slider/basic-usage.vue b/examples/docs/resources/pc/demo/slider/basic-usage.vue new file mode 100644 index 000000000..b2674c9c3 --- /dev/null +++ b/examples/docs/resources/pc/demo/slider/basic-usage.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/docs/resources/pc/demo/slider/dynamic-disable.vue b/examples/docs/resources/pc/demo/slider/dynamic-disable.vue new file mode 100644 index 000000000..6a84f16e2 --- /dev/null +++ b/examples/docs/resources/pc/demo/slider/dynamic-disable.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/slider/format-tooltip.vue b/examples/docs/resources/pc/demo/slider/format-tooltip.vue new file mode 100644 index 000000000..2c4d14f94 --- /dev/null +++ b/examples/docs/resources/pc/demo/slider/format-tooltip.vue @@ -0,0 +1,23 @@ + + + diff --git a/examples/docs/resources/pc/demo/slider/max-min.vue b/examples/docs/resources/pc/demo/slider/max-min.vue new file mode 100644 index 000000000..f127d4a54 --- /dev/null +++ b/examples/docs/resources/pc/demo/slider/max-min.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/slider/range-select.vue b/examples/docs/resources/pc/demo/slider/range-select.vue new file mode 100644 index 000000000..06bd73330 --- /dev/null +++ b/examples/docs/resources/pc/demo/slider/range-select.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/slider/shortcut-operation.vue b/examples/docs/resources/pc/demo/slider/shortcut-operation.vue new file mode 100644 index 000000000..51d6da3dd --- /dev/null +++ b/examples/docs/resources/pc/demo/slider/shortcut-operation.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/slider/show-iput.vue b/examples/docs/resources/pc/demo/slider/show-iput.vue new file mode 100644 index 000000000..9de35ef6e --- /dev/null +++ b/examples/docs/resources/pc/demo/slider/show-iput.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/slider/show-tip.vue b/examples/docs/resources/pc/demo/slider/show-tip.vue new file mode 100644 index 000000000..f85bd1cae --- /dev/null +++ b/examples/docs/resources/pc/demo/slider/show-tip.vue @@ -0,0 +1,23 @@ + + + diff --git a/examples/docs/resources/pc/demo/slider/slider-event-change.vue b/examples/docs/resources/pc/demo/slider/slider-event-change.vue new file mode 100644 index 000000000..c33900dce --- /dev/null +++ b/examples/docs/resources/pc/demo/slider/slider-event-change.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/docs/resources/pc/demo/slider/slider-event-start.vue b/examples/docs/resources/pc/demo/slider/slider-event-start.vue new file mode 100644 index 000000000..479a31a41 --- /dev/null +++ b/examples/docs/resources/pc/demo/slider/slider-event-start.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/docs/resources/pc/demo/slider/slider-event-stop.vue b/examples/docs/resources/pc/demo/slider/slider-event-stop.vue new file mode 100644 index 000000000..baefd39cd --- /dev/null +++ b/examples/docs/resources/pc/demo/slider/slider-event-stop.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/docs/resources/pc/demo/slider/slider-slot.vue b/examples/docs/resources/pc/demo/slider/slider-slot.vue new file mode 100644 index 000000000..b155fd0ad --- /dev/null +++ b/examples/docs/resources/pc/demo/slider/slider-slot.vue @@ -0,0 +1,22 @@ + + + diff --git a/examples/docs/resources/pc/demo/slider/vertical-mode.vue b/examples/docs/resources/pc/demo/slider/vertical-mode.vue new file mode 100644 index 000000000..2d27ad887 --- /dev/null +++ b/examples/docs/resources/pc/demo/slider/vertical-mode.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/split/basic-usage.vue b/examples/docs/resources/pc/demo/split/basic-usage.vue new file mode 100644 index 000000000..ce14680d2 --- /dev/null +++ b/examples/docs/resources/pc/demo/split/basic-usage.vue @@ -0,0 +1,38 @@ + + + + + diff --git a/example/src/demo/pc/split/basic-usage1.vue b/examples/docs/resources/pc/demo/split/basic-usage1.vue similarity index 96% rename from example/src/demo/pc/split/basic-usage1.vue rename to examples/docs/resources/pc/demo/split/basic-usage1.vue index b333aab17..4d30a90dc 100644 --- a/example/src/demo/pc/split/basic-usage1.vue +++ b/examples/docs/resources/pc/demo/split/basic-usage1.vue @@ -11,7 +11,7 @@ - + + diff --git a/example/src/demo/pc/steps/custom-steps-item.vue b/examples/docs/resources/pc/demo/steps/custom-steps-item.vue similarity index 97% rename from example/src/demo/pc/steps/custom-steps-item.vue rename to examples/docs/resources/pc/demo/steps/custom-steps-item.vue index a6e28acd4..81e95fb83 100644 --- a/example/src/demo/pc/steps/custom-steps-item.vue +++ b/examples/docs/resources/pc/demo/steps/custom-steps-item.vue @@ -4,7 +4,7 @@ - + + diff --git a/example/src/demo/pc/steps/normal-steps.vue b/examples/docs/resources/pc/demo/steps/normal-steps.vue similarity index 96% rename from example/src/demo/pc/steps/normal-steps.vue rename to examples/docs/resources/pc/demo/steps/normal-steps.vue index 2a02e0710..b3fd36aaa 100644 --- a/example/src/demo/pc/steps/normal-steps.vue +++ b/examples/docs/resources/pc/demo/steps/normal-steps.vue @@ -2,7 +2,7 @@ - + + diff --git a/example/src/demo/pc/steps/timeline-steps.vue b/examples/docs/resources/pc/demo/steps/timeline-steps.vue similarity index 98% rename from example/src/demo/pc/steps/timeline-steps.vue rename to examples/docs/resources/pc/demo/steps/timeline-steps.vue index 6b6f9df95..159dd9bb4 100644 --- a/example/src/demo/pc/steps/timeline-steps.vue +++ b/examples/docs/resources/pc/demo/steps/timeline-steps.vue @@ -13,7 +13,7 @@ - diff --git a/example/src/demo/pc/switch/before-change.vue b/examples/docs/resources/pc/demo/switch/before-change.vue similarity index 100% rename from example/src/demo/pc/switch/before-change.vue rename to examples/docs/resources/pc/demo/switch/before-change.vue diff --git a/example/src/demo/pc/switch/custom-open-close.vue b/examples/docs/resources/pc/demo/switch/custom-open-close.vue similarity index 95% rename from example/src/demo/pc/switch/custom-open-close.vue rename to examples/docs/resources/pc/demo/switch/custom-open-close.vue index c9bf515a3..c1cf2aadf 100644 --- a/example/src/demo/pc/switch/custom-open-close.vue +++ b/examples/docs/resources/pc/demo/switch/custom-open-close.vue @@ -9,7 +9,7 @@ - diff --git a/example/src/demo/pc/switch/enent.vue b/examples/docs/resources/pc/demo/switch/enent.vue similarity index 93% rename from example/src/demo/pc/switch/enent.vue rename to examples/docs/resources/pc/demo/switch/enent.vue index 68c8f76a7..6455a7bf7 100644 --- a/example/src/demo/pc/switch/enent.vue +++ b/examples/docs/resources/pc/demo/switch/enent.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/tabs/basic-usage.vue b/examples/docs/resources/pc/demo/tabs/basic-usage.vue new file mode 100644 index 000000000..3de419833 --- /dev/null +++ b/examples/docs/resources/pc/demo/tabs/basic-usage.vue @@ -0,0 +1,26 @@ + + + diff --git a/examples/docs/resources/pc/demo/tabs/before-leave.vue b/examples/docs/resources/pc/demo/tabs/before-leave.vue new file mode 100644 index 000000000..5121f2ce9 --- /dev/null +++ b/examples/docs/resources/pc/demo/tabs/before-leave.vue @@ -0,0 +1,33 @@ + + + diff --git a/example/src/demo/pc/tabs/custom-tab-content.vue b/examples/docs/resources/pc/demo/tabs/custom-tab-content.vue similarity index 75% rename from example/src/demo/pc/tabs/custom-tab-content.vue rename to examples/docs/resources/pc/demo/tabs/custom-tab-content.vue index ac7ae5eec..466899bed 100644 --- a/example/src/demo/pc/tabs/custom-tab-content.vue +++ b/examples/docs/resources/pc/demo/tabs/custom-tab-content.vue @@ -1,13 +1,15 @@ - - - diff --git a/example/src/demo/pc/tabs/position-bottom.vue b/examples/docs/resources/pc/demo/tabs/position-bottom.vue similarity index 98% rename from example/src/demo/pc/tabs/position-bottom.vue rename to examples/docs/resources/pc/demo/tabs/position-bottom.vue index eca01b9a5..7ae4b79be 100644 --- a/example/src/demo/pc/tabs/position-bottom.vue +++ b/examples/docs/resources/pc/demo/tabs/position-bottom.vue @@ -6,7 +6,7 @@ - diff --git a/example/src/demo/pc/tabs/prevent-tab-switching.vue b/examples/docs/resources/pc/demo/tabs/prevent-tab-switching.vue similarity index 98% rename from example/src/demo/pc/tabs/prevent-tab-switching.vue rename to examples/docs/resources/pc/demo/tabs/prevent-tab-switching.vue index 60b396c7a..167d6380f 100644 --- a/example/src/demo/pc/tabs/prevent-tab-switching.vue +++ b/examples/docs/resources/pc/demo/tabs/prevent-tab-switching.vue @@ -11,7 +11,7 @@ - diff --git a/example/src/demo/pc/tabs/tab-style-bordercard.vue b/examples/docs/resources/pc/demo/tabs/tab-style-bordercard.vue similarity index 98% rename from example/src/demo/pc/tabs/tab-style-bordercard.vue rename to examples/docs/resources/pc/demo/tabs/tab-style-bordercard.vue index 63c5c79ac..e92a80372 100644 --- a/example/src/demo/pc/tabs/tab-style-bordercard.vue +++ b/examples/docs/resources/pc/demo/tabs/tab-style-bordercard.vue @@ -6,7 +6,7 @@ - diff --git a/examples/docs/resources/pc/demo/tag/basic-usage.vue b/examples/docs/resources/pc/demo/tag/basic-usage.vue new file mode 100644 index 000000000..7b8d98fd2 --- /dev/null +++ b/examples/docs/resources/pc/demo/tag/basic-usage.vue @@ -0,0 +1,13 @@ + + + diff --git a/example/src/demo/pc/tag/before-delete.vue b/examples/docs/resources/pc/demo/tag/before-delete.vue similarity index 100% rename from example/src/demo/pc/tag/before-delete.vue rename to examples/docs/resources/pc/demo/tag/before-delete.vue diff --git a/example/src/demo/pc/tag/closeable.vue b/examples/docs/resources/pc/demo/tag/closeable.vue similarity index 85% rename from example/src/demo/pc/tag/closeable.vue rename to examples/docs/resources/pc/demo/tag/closeable.vue index 668fd6abb..9e3399df1 100644 --- a/example/src/demo/pc/tag/closeable.vue +++ b/examples/docs/resources/pc/demo/tag/closeable.vue @@ -1,10 +1,12 @@ - diff --git a/example/src/demo/pc/text-popup/clear-value.vue b/examples/docs/resources/pc/demo/text-popup/clear-value.vue similarity index 95% rename from example/src/demo/pc/text-popup/clear-value.vue rename to examples/docs/resources/pc/demo/text-popup/clear-value.vue index 790282899..7c5a4a7de 100644 --- a/example/src/demo/pc/text-popup/clear-value.vue +++ b/examples/docs/resources/pc/demo/text-popup/clear-value.vue @@ -7,7 +7,7 @@ - diff --git a/examples/docs/resources/pc/demo/text-popup/placeholder.vue b/examples/docs/resources/pc/demo/text-popup/placeholder.vue new file mode 100644 index 000000000..51f2661bc --- /dev/null +++ b/examples/docs/resources/pc/demo/text-popup/placeholder.vue @@ -0,0 +1,13 @@ + + + diff --git a/examples/docs/resources/pc/demo/text-popup/readonly.vue b/examples/docs/resources/pc/demo/text-popup/readonly.vue new file mode 100644 index 000000000..61f181057 --- /dev/null +++ b/examples/docs/resources/pc/demo/text-popup/readonly.vue @@ -0,0 +1,13 @@ + + + diff --git a/example/src/demo/pc/text-popup/separtor.vue b/examples/docs/resources/pc/demo/text-popup/separtor.vue similarity index 90% rename from example/src/demo/pc/text-popup/separtor.vue rename to examples/docs/resources/pc/demo/text-popup/separtor.vue index b2124db06..f2571d181 100644 --- a/example/src/demo/pc/text-popup/separtor.vue +++ b/examples/docs/resources/pc/demo/text-popup/separtor.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/text-popup/width.vue b/examples/docs/resources/pc/demo/text-popup/width.vue new file mode 100644 index 000000000..55458328c --- /dev/null +++ b/examples/docs/resources/pc/demo/text-popup/width.vue @@ -0,0 +1,13 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-line/basic-usage.vue b/examples/docs/resources/pc/demo/time-line/basic-usage.vue new file mode 100644 index 000000000..3c5c97b09 --- /dev/null +++ b/examples/docs/resources/pc/demo/time-line/basic-usage.vue @@ -0,0 +1,32 @@ + + + diff --git a/example/src/demo/pc/time-line/custom-normal-step.vue b/examples/docs/resources/pc/demo/time-line/custom-normal-step.vue similarity index 97% rename from example/src/demo/pc/time-line/custom-normal-step.vue rename to examples/docs/resources/pc/demo/time-line/custom-normal-step.vue index 16f4c1a95..bffd2d7f5 100644 --- a/example/src/demo/pc/time-line/custom-normal-step.vue +++ b/examples/docs/resources/pc/demo/time-line/custom-normal-step.vue @@ -9,7 +9,7 @@ - diff --git a/example/src/demo/pc/time-line/horizontal-step.vue b/examples/docs/resources/pc/demo/time-line/horizontal-step.vue similarity index 97% rename from example/src/demo/pc/time-line/horizontal-step.vue rename to examples/docs/resources/pc/demo/time-line/horizontal-step.vue index 0b5679b20..f2405c58d 100644 --- a/example/src/demo/pc/time-line/horizontal-step.vue +++ b/examples/docs/resources/pc/demo/time-line/horizontal-step.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/time-line/show-status.vue b/examples/docs/resources/pc/demo/time-line/show-status.vue similarity index 97% rename from example/src/demo/pc/time-line/show-status.vue rename to examples/docs/resources/pc/demo/time-line/show-status.vue index cbe461df3..0cb1b2e19 100644 --- a/example/src/demo/pc/time-line/show-status.vue +++ b/examples/docs/resources/pc/demo/time-line/show-status.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/time-picker/clear-icon.vue b/examples/docs/resources/pc/demo/time-picker/clear-icon.vue new file mode 100644 index 000000000..16754b56d --- /dev/null +++ b/examples/docs/resources/pc/demo/time-picker/clear-icon.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-picker/clearable.vue b/examples/docs/resources/pc/demo/time-picker/clearable.vue new file mode 100644 index 000000000..b50752f3a --- /dev/null +++ b/examples/docs/resources/pc/demo/time-picker/clearable.vue @@ -0,0 +1,26 @@ + + + diff --git a/example/src/demo/pc/time-picker/date.vue b/examples/docs/resources/pc/demo/time-picker/date.vue similarity index 98% rename from example/src/demo/pc/time-picker/date.vue rename to examples/docs/resources/pc/demo/time-picker/date.vue index 2f275f686..659e7ab10 100644 --- a/example/src/demo/pc/time-picker/date.vue +++ b/examples/docs/resources/pc/demo/time-picker/date.vue @@ -23,7 +23,7 @@ - diff --git a/examples/docs/resources/pc/demo/time-picker/disabled.vue b/examples/docs/resources/pc/demo/time-picker/disabled.vue new file mode 100644 index 000000000..9a63ed0e7 --- /dev/null +++ b/examples/docs/resources/pc/demo/time-picker/disabled.vue @@ -0,0 +1,25 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-picker/editable.vue b/examples/docs/resources/pc/demo/time-picker/editable.vue new file mode 100644 index 000000000..ac37f16b4 --- /dev/null +++ b/examples/docs/resources/pc/demo/time-picker/editable.vue @@ -0,0 +1,25 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-picker/event-blur.vue b/examples/docs/resources/pc/demo/time-picker/event-blur.vue new file mode 100644 index 000000000..dce28d732 --- /dev/null +++ b/examples/docs/resources/pc/demo/time-picker/event-blur.vue @@ -0,0 +1,43 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-picker/format.vue b/examples/docs/resources/pc/demo/time-picker/format.vue new file mode 100644 index 000000000..fe2f05c24 --- /dev/null +++ b/examples/docs/resources/pc/demo/time-picker/format.vue @@ -0,0 +1,28 @@ + + + diff --git a/example/src/demo/pc/time-picker/is-range.vue b/examples/docs/resources/pc/demo/time-picker/is-range.vue similarity index 96% rename from example/src/demo/pc/time-picker/is-range.vue rename to examples/docs/resources/pc/demo/time-picker/is-range.vue index 5e41326cb..ad32a742b 100644 --- a/example/src/demo/pc/time-picker/is-range.vue +++ b/examples/docs/resources/pc/demo/time-picker/is-range.vue @@ -11,7 +11,7 @@ - diff --git a/examples/docs/resources/pc/demo/time-picker/picker-options.vue b/examples/docs/resources/pc/demo/time-picker/picker-options.vue new file mode 100644 index 000000000..df6f58121 --- /dev/null +++ b/examples/docs/resources/pc/demo/time-picker/picker-options.vue @@ -0,0 +1,24 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-picker/popper-class.vue b/examples/docs/resources/pc/demo/time-picker/popper-class.vue new file mode 100644 index 000000000..8fa8ca34b --- /dev/null +++ b/examples/docs/resources/pc/demo/time-picker/popper-class.vue @@ -0,0 +1,26 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/time-picker/size-medium.vue b/examples/docs/resources/pc/demo/time-picker/size-medium.vue new file mode 100644 index 000000000..7ecb3224a --- /dev/null +++ b/examples/docs/resources/pc/demo/time-picker/size-medium.vue @@ -0,0 +1,28 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-picker/size-mini.vue b/examples/docs/resources/pc/demo/time-picker/size-mini.vue new file mode 100644 index 000000000..e4ba2efec --- /dev/null +++ b/examples/docs/resources/pc/demo/time-picker/size-mini.vue @@ -0,0 +1,28 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-picker/size-small.vue b/examples/docs/resources/pc/demo/time-picker/size-small.vue new file mode 100644 index 000000000..1cc208dd2 --- /dev/null +++ b/examples/docs/resources/pc/demo/time-picker/size-small.vue @@ -0,0 +1,28 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-picker/suffix-icon.vue b/examples/docs/resources/pc/demo/time-picker/suffix-icon.vue new file mode 100644 index 000000000..ec7aa3fba --- /dev/null +++ b/examples/docs/resources/pc/demo/time-picker/suffix-icon.vue @@ -0,0 +1,22 @@ + + + diff --git a/example/src/demo/pc/time-picker/time-low.vue b/examples/docs/resources/pc/demo/time-picker/time-low.vue similarity index 95% rename from example/src/demo/pc/time-picker/time-low.vue rename to examples/docs/resources/pc/demo/time-picker/time-low.vue index 3e0b637a8..4fa4eff57 100644 --- a/example/src/demo/pc/time-picker/time-low.vue +++ b/examples/docs/resources/pc/demo/time-picker/time-low.vue @@ -5,7 +5,7 @@ - diff --git a/examples/docs/resources/pc/demo/time-select/clear-icon.vue b/examples/docs/resources/pc/demo/time-select/clear-icon.vue new file mode 100644 index 000000000..12bf52d48 --- /dev/null +++ b/examples/docs/resources/pc/demo/time-select/clear-icon.vue @@ -0,0 +1,27 @@ + + + diff --git a/example/src/demo/pc/time-select/default-time.vue b/examples/docs/resources/pc/demo/time-select/default-time.vue similarity index 94% rename from example/src/demo/pc/time-select/default-time.vue rename to examples/docs/resources/pc/demo/time-select/default-time.vue index bea690f5a..b387a4e80 100644 --- a/example/src/demo/pc/time-select/default-time.vue +++ b/examples/docs/resources/pc/demo/time-select/default-time.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/time-select/disabled.vue b/examples/docs/resources/pc/demo/time-select/disabled.vue new file mode 100644 index 000000000..d4e636ac3 --- /dev/null +++ b/examples/docs/resources/pc/demo/time-select/disabled.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-select/editable.vue b/examples/docs/resources/pc/demo/time-select/editable.vue new file mode 100644 index 000000000..214ac6618 --- /dev/null +++ b/examples/docs/resources/pc/demo/time-select/editable.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-select/event-blur.vue b/examples/docs/resources/pc/demo/time-select/event-blur.vue new file mode 100644 index 000000000..d3c8e212a --- /dev/null +++ b/examples/docs/resources/pc/demo/time-select/event-blur.vue @@ -0,0 +1,31 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-select/event-change.vue b/examples/docs/resources/pc/demo/time-select/event-change.vue new file mode 100644 index 000000000..65666862f --- /dev/null +++ b/examples/docs/resources/pc/demo/time-select/event-change.vue @@ -0,0 +1,25 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-select/focus.vue b/examples/docs/resources/pc/demo/time-select/focus.vue new file mode 100644 index 000000000..21f3a1455 --- /dev/null +++ b/examples/docs/resources/pc/demo/time-select/focus.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-select/picker-options.vue b/examples/docs/resources/pc/demo/time-select/picker-options.vue new file mode 100644 index 000000000..569b83f83 --- /dev/null +++ b/examples/docs/resources/pc/demo/time-select/picker-options.vue @@ -0,0 +1,28 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-select/popper-class.vue b/examples/docs/resources/pc/demo/time-select/popper-class.vue new file mode 100644 index 000000000..b7004d6e2 --- /dev/null +++ b/examples/docs/resources/pc/demo/time-select/popper-class.vue @@ -0,0 +1,30 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/time-select/range-placeholder.vue b/examples/docs/resources/pc/demo/time-select/range-placeholder.vue new file mode 100644 index 000000000..f3e138498 --- /dev/null +++ b/examples/docs/resources/pc/demo/time-select/range-placeholder.vue @@ -0,0 +1,35 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-select/size-medium.vue b/examples/docs/resources/pc/demo/time-select/size-medium.vue new file mode 100644 index 000000000..9981d7d46 --- /dev/null +++ b/examples/docs/resources/pc/demo/time-select/size-medium.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-select/size-mini.vue b/examples/docs/resources/pc/demo/time-select/size-mini.vue new file mode 100644 index 000000000..589fa3beb --- /dev/null +++ b/examples/docs/resources/pc/demo/time-select/size-mini.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-select/size-small.vue b/examples/docs/resources/pc/demo/time-select/size-small.vue new file mode 100644 index 000000000..c33b91ab9 --- /dev/null +++ b/examples/docs/resources/pc/demo/time-select/size-small.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/time-select/suffix-icon.vue b/examples/docs/resources/pc/demo/time-select/suffix-icon.vue new file mode 100644 index 000000000..291a880c1 --- /dev/null +++ b/examples/docs/resources/pc/demo/time-select/suffix-icon.vue @@ -0,0 +1,22 @@ + + + diff --git a/example/src/demo/pc/toggle-menu/automatic-filtering.vue b/examples/docs/resources/pc/demo/toggle-menu/automatic-filtering.vue similarity index 93% rename from example/src/demo/pc/toggle-menu/automatic-filtering.vue rename to examples/docs/resources/pc/demo/toggle-menu/automatic-filtering.vue index 7c8a1650a..ce8549aa4 100644 --- a/example/src/demo/pc/toggle-menu/automatic-filtering.vue +++ b/examples/docs/resources/pc/demo/toggle-menu/automatic-filtering.vue @@ -1,8 +1,8 @@ - diff --git a/examples/docs/resources/pc/demo/toggle-menu/custom-icon.vue b/examples/docs/resources/pc/demo/toggle-menu/custom-icon.vue new file mode 100644 index 000000000..68a3b5d4c --- /dev/null +++ b/examples/docs/resources/pc/demo/toggle-menu/custom-icon.vue @@ -0,0 +1,94 @@ + + + diff --git a/example/src/demo/pc/toggle-menu/custom-searchicon.vue b/examples/docs/resources/pc/demo/toggle-menu/custom-searchicon.vue similarity index 99% rename from example/src/demo/pc/toggle-menu/custom-searchicon.vue rename to examples/docs/resources/pc/demo/toggle-menu/custom-searchicon.vue index 81d558d1c..bf6ce32a0 100644 --- a/example/src/demo/pc/toggle-menu/custom-searchicon.vue +++ b/examples/docs/resources/pc/demo/toggle-menu/custom-searchicon.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/toggle-menu/drag-events.vue b/examples/docs/resources/pc/demo/toggle-menu/drag-events.vue new file mode 100644 index 000000000..45389e689 --- /dev/null +++ b/examples/docs/resources/pc/demo/toggle-menu/drag-events.vue @@ -0,0 +1,117 @@ + + + diff --git a/example/src/demo/pc/toggle-menu/dragable.vue b/examples/docs/resources/pc/demo/toggle-menu/dragable.vue similarity index 99% rename from example/src/demo/pc/toggle-menu/dragable.vue rename to examples/docs/resources/pc/demo/toggle-menu/dragable.vue index c6f96e22f..35448f510 100644 --- a/example/src/demo/pc/toggle-menu/dragable.vue +++ b/examples/docs/resources/pc/demo/toggle-menu/dragable.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/toggle-menu/get-menu-data-async.vue b/examples/docs/resources/pc/demo/toggle-menu/get-menu-data-async.vue new file mode 100644 index 000000000..1e64ff2ad --- /dev/null +++ b/examples/docs/resources/pc/demo/toggle-menu/get-menu-data-async.vue @@ -0,0 +1,97 @@ + + + diff --git a/examples/docs/resources/pc/demo/toggle-menu/get-menu-data-sync.vue b/examples/docs/resources/pc/demo/toggle-menu/get-menu-data-sync.vue new file mode 100644 index 000000000..552518acd --- /dev/null +++ b/examples/docs/resources/pc/demo/toggle-menu/get-menu-data-sync.vue @@ -0,0 +1,97 @@ + + + diff --git a/example/src/demo/pc/toggle-menu/node-click.vue b/examples/docs/resources/pc/demo/toggle-menu/node-click.vue similarity index 99% rename from example/src/demo/pc/toggle-menu/node-click.vue rename to examples/docs/resources/pc/demo/toggle-menu/node-click.vue index 58db2f290..9e02315b9 100644 --- a/example/src/demo/pc/toggle-menu/node-click.vue +++ b/examples/docs/resources/pc/demo/toggle-menu/node-click.vue @@ -2,7 +2,7 @@ - + + diff --git a/examples/docs/resources/pc/demo/tooltip/custom-transition.vue b/examples/docs/resources/pc/demo/tooltip/custom-transition.vue new file mode 100644 index 000000000..6c74cef19 --- /dev/null +++ b/examples/docs/resources/pc/demo/tooltip/custom-transition.vue @@ -0,0 +1,35 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/tooltip/dynamic-disable.vue b/examples/docs/resources/pc/demo/tooltip/dynamic-disable.vue new file mode 100644 index 000000000..5339a3055 --- /dev/null +++ b/examples/docs/resources/pc/demo/tooltip/dynamic-disable.vue @@ -0,0 +1,22 @@ + + + diff --git a/example/src/demo/pc/tooltip/enterable.vue b/examples/docs/resources/pc/demo/tooltip/enterable.vue similarity index 95% rename from example/src/demo/pc/tooltip/enterable.vue rename to examples/docs/resources/pc/demo/tooltip/enterable.vue index 093ca9cf7..83dd4d1a3 100644 --- a/example/src/demo/pc/tooltip/enterable.vue +++ b/examples/docs/resources/pc/demo/tooltip/enterable.vue @@ -4,7 +4,7 @@ - diff --git a/examples/docs/resources/pc/demo/tooltip/popper-class.vue b/examples/docs/resources/pc/demo/tooltip/popper-class.vue new file mode 100644 index 000000000..f08fc0220 --- /dev/null +++ b/examples/docs/resources/pc/demo/tooltip/popper-class.vue @@ -0,0 +1,26 @@ + + + diff --git a/examples/docs/resources/pc/demo/tooltip/popper-options.vue b/examples/docs/resources/pc/demo/tooltip/popper-options.vue new file mode 100644 index 000000000..dd08f44b0 --- /dev/null +++ b/examples/docs/resources/pc/demo/tooltip/popper-options.vue @@ -0,0 +1,23 @@ + + + diff --git a/examples/docs/resources/pc/demo/tooltip/tabindex.vue b/examples/docs/resources/pc/demo/tooltip/tabindex.vue new file mode 100644 index 000000000..7838dab20 --- /dev/null +++ b/examples/docs/resources/pc/demo/tooltip/tabindex.vue @@ -0,0 +1,15 @@ + + + diff --git a/example/src/demo/pc/tooltip/tooltip-content.vue b/examples/docs/resources/pc/demo/tooltip/tooltip-content.vue similarity index 95% rename from example/src/demo/pc/tooltip/tooltip-content.vue rename to examples/docs/resources/pc/demo/tooltip/tooltip-content.vue index 3cf69c94a..f7bf369cd 100644 --- a/example/src/demo/pc/tooltip/tooltip-content.vue +++ b/examples/docs/resources/pc/demo/tooltip/tooltip-content.vue @@ -9,7 +9,7 @@ - diff --git a/example/src/demo/pc/tooltip/tooltip-theme.vue b/examples/docs/resources/pc/demo/tooltip/tooltip-theme.vue similarity index 95% rename from example/src/demo/pc/tooltip/tooltip-theme.vue rename to examples/docs/resources/pc/demo/tooltip/tooltip-theme.vue index 2cb9d2dcd..e5af049d8 100644 --- a/example/src/demo/pc/tooltip/tooltip-theme.vue +++ b/examples/docs/resources/pc/demo/tooltip/tooltip-theme.vue @@ -9,7 +9,7 @@ - diff --git a/example/src/demo/pc/transfer/before-transfer.vue b/examples/docs/resources/pc/demo/transfer/before-transfer.vue similarity index 100% rename from example/src/demo/pc/transfer/before-transfer.vue rename to examples/docs/resources/pc/demo/transfer/before-transfer.vue diff --git a/example/src/demo/pc/transfer/checked-format-text.vue b/examples/docs/resources/pc/demo/transfer/checked-format-text.vue similarity index 96% rename from example/src/demo/pc/transfer/checked-format-text.vue rename to examples/docs/resources/pc/demo/transfer/checked-format-text.vue index 990c6702a..76791a23a 100644 --- a/example/src/demo/pc/transfer/checked-format-text.vue +++ b/examples/docs/resources/pc/demo/transfer/checked-format-text.vue @@ -9,7 +9,7 @@ > - diff --git a/example/src/demo/pc/transfer/default-checked.vue b/examples/docs/resources/pc/demo/transfer/default-checked.vue similarity index 96% rename from example/src/demo/pc/transfer/default-checked.vue rename to examples/docs/resources/pc/demo/transfer/default-checked.vue index eabfe9a85..8f633415b 100644 --- a/example/src/demo/pc/transfer/default-checked.vue +++ b/examples/docs/resources/pc/demo/transfer/default-checked.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/transfer/manual-clear-query.vue b/examples/docs/resources/pc/demo/transfer/manual-clear-query.vue similarity index 97% rename from example/src/demo/pc/transfer/manual-clear-query.vue rename to examples/docs/resources/pc/demo/transfer/manual-clear-query.vue index 43342d2a4..9253dd730 100644 --- a/example/src/demo/pc/transfer/manual-clear-query.vue +++ b/examples/docs/resources/pc/demo/transfer/manual-clear-query.vue @@ -5,7 +5,7 @@ - diff --git a/examples/docs/resources/pc/demo/tree-menu/basic-usage.vue b/examples/docs/resources/pc/demo/tree-menu/basic-usage.vue new file mode 100644 index 000000000..6d1d07eb9 --- /dev/null +++ b/examples/docs/resources/pc/demo/tree-menu/basic-usage.vue @@ -0,0 +1,16 @@ + + + diff --git a/example/src/demo/pc/tree-menu/can-draggable.vue b/examples/docs/resources/pc/demo/tree-menu/can-draggable.vue similarity index 99% rename from example/src/demo/pc/tree-menu/can-draggable.vue rename to examples/docs/resources/pc/demo/tree-menu/can-draggable.vue index 2378c5255..1f34f0c9c 100644 --- a/example/src/demo/pc/tree-menu/can-draggable.vue +++ b/examples/docs/resources/pc/demo/tree-menu/can-draggable.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/tree-menu/data-resource.vue b/examples/docs/resources/pc/demo/tree-menu/data-resource.vue new file mode 100644 index 000000000..38320d732 --- /dev/null +++ b/examples/docs/resources/pc/demo/tree-menu/data-resource.vue @@ -0,0 +1,123 @@ + + + diff --git a/examples/docs/resources/pc/demo/tree-menu/default-expand-all.vue b/examples/docs/resources/pc/demo/tree-menu/default-expand-all.vue new file mode 100644 index 000000000..d93161f70 --- /dev/null +++ b/examples/docs/resources/pc/demo/tree-menu/default-expand-all.vue @@ -0,0 +1,182 @@ + + + diff --git a/examples/docs/resources/pc/demo/tree-menu/default-expanded-keys.vue b/examples/docs/resources/pc/demo/tree-menu/default-expanded-keys.vue new file mode 100644 index 000000000..1e731c3ee --- /dev/null +++ b/examples/docs/resources/pc/demo/tree-menu/default-expanded-keys.vue @@ -0,0 +1,124 @@ + + + diff --git a/example/src/demo/pc/tree-menu/empty-text.vue b/examples/docs/resources/pc/demo/tree-menu/empty-text.vue similarity index 93% rename from example/src/demo/pc/tree-menu/empty-text.vue rename to examples/docs/resources/pc/demo/tree-menu/empty-text.vue index 03d588035..2afe75250 100644 --- a/example/src/demo/pc/tree-menu/empty-text.vue +++ b/examples/docs/resources/pc/demo/tree-menu/empty-text.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/tree-menu/filter-node-method.vue b/examples/docs/resources/pc/demo/tree-menu/filter-node-method.vue similarity index 99% rename from example/src/demo/pc/tree-menu/filter-node-method.vue rename to examples/docs/resources/pc/demo/tree-menu/filter-node-method.vue index aba446a98..91b9f9ed7 100644 --- a/example/src/demo/pc/tree-menu/filter-node-method.vue +++ b/examples/docs/resources/pc/demo/tree-menu/filter-node-method.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/tree-menu/lazy-load.vue b/examples/docs/resources/pc/demo/tree-menu/lazy-load.vue new file mode 100644 index 000000000..5fb061d01 --- /dev/null +++ b/examples/docs/resources/pc/demo/tree-menu/lazy-load.vue @@ -0,0 +1,58 @@ + + + diff --git a/example/src/demo/pc/tree-menu/search-icon.vue b/examples/docs/resources/pc/demo/tree-menu/search-icon.vue similarity index 94% rename from example/src/demo/pc/tree-menu/search-icon.vue rename to examples/docs/resources/pc/demo/tree-menu/search-icon.vue index ce8352fcd..536f465eb 100644 --- a/example/src/demo/pc/tree-menu/search-icon.vue +++ b/examples/docs/resources/pc/demo/tree-menu/search-icon.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/tree-menu/text-ellipsis.vue b/examples/docs/resources/pc/demo/tree-menu/text-ellipsis.vue similarity index 99% rename from example/src/demo/pc/tree-menu/text-ellipsis.vue rename to examples/docs/resources/pc/demo/tree-menu/text-ellipsis.vue index 12452e697..4de313a4d 100644 --- a/example/src/demo/pc/tree-menu/text-ellipsis.vue +++ b/examples/docs/resources/pc/demo/tree-menu/text-ellipsis.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/tree/check-on-click-node.vue b/examples/docs/resources/pc/demo/tree/check-on-click-node.vue similarity index 99% rename from example/src/demo/pc/tree/check-on-click-node.vue rename to examples/docs/resources/pc/demo/tree/check-on-click-node.vue index 366c65335..055e874bd 100644 --- a/example/src/demo/pc/tree/check-on-click-node.vue +++ b/examples/docs/resources/pc/demo/tree/check-on-click-node.vue @@ -17,7 +17,7 @@ - diff --git a/example/src/demo/pc/tree/contextmenu.vue b/examples/docs/resources/pc/demo/tree/contextmenu.vue similarity index 98% rename from example/src/demo/pc/tree/contextmenu.vue rename to examples/docs/resources/pc/demo/tree/contextmenu.vue index 89b902c11..b6b369e22 100644 --- a/example/src/demo/pc/tree/contextmenu.vue +++ b/examples/docs/resources/pc/demo/tree/contextmenu.vue @@ -14,7 +14,7 @@ - diff --git a/example/src/demo/pc/tree/default-checked-keys.vue b/examples/docs/resources/pc/demo/tree/default-checked-keys.vue similarity index 98% rename from example/src/demo/pc/tree/default-checked-keys.vue rename to examples/docs/resources/pc/demo/tree/default-checked-keys.vue index 99c34d15b..f159c539f 100644 --- a/example/src/demo/pc/tree/default-checked-keys.vue +++ b/examples/docs/resources/pc/demo/tree/default-checked-keys.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/tree/default-expanded-keys.vue b/examples/docs/resources/pc/demo/tree/default-expanded-keys.vue new file mode 100644 index 000000000..72e86980b --- /dev/null +++ b/examples/docs/resources/pc/demo/tree/default-expanded-keys.vue @@ -0,0 +1,82 @@ + + + diff --git a/example/src/demo/pc/tree/disable-node.vue b/examples/docs/resources/pc/demo/tree/disable-node.vue similarity index 98% rename from example/src/demo/pc/tree/disable-node.vue rename to examples/docs/resources/pc/demo/tree/disable-node.vue index 0b219475f..3167bdefd 100644 --- a/example/src/demo/pc/tree/disable-node.vue +++ b/examples/docs/resources/pc/demo/tree/disable-node.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/tree/expand-on-click-node.vue b/examples/docs/resources/pc/demo/tree/expand-on-click-node.vue new file mode 100644 index 000000000..8ef8ba23e --- /dev/null +++ b/examples/docs/resources/pc/demo/tree/expand-on-click-node.vue @@ -0,0 +1,67 @@ + + + diff --git a/example/src/demo/pc/tree/filter-node.vue b/examples/docs/resources/pc/demo/tree/filter-node.vue similarity index 96% rename from example/src/demo/pc/tree/filter-node.vue rename to examples/docs/resources/pc/demo/tree/filter-node.vue index 7248bfb62..94990e207 100644 --- a/example/src/demo/pc/tree/filter-node.vue +++ b/examples/docs/resources/pc/demo/tree/filter-node.vue @@ -5,7 +5,7 @@ - + + diff --git a/example/src/demo/pc/tree/node-props-config.vue b/examples/docs/resources/pc/demo/tree/node-props-config.vue similarity index 98% rename from example/src/demo/pc/tree/node-props-config.vue rename to examples/docs/resources/pc/demo/tree/node-props-config.vue index d3aa583fb..d3513aee0 100644 --- a/example/src/demo/pc/tree/node-props-config.vue +++ b/examples/docs/resources/pc/demo/tree/node-props-config.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/tree/set-tree-icon.vue b/examples/docs/resources/pc/demo/tree/set-tree-icon.vue similarity index 98% rename from example/src/demo/pc/tree/set-tree-icon.vue rename to examples/docs/resources/pc/demo/tree/set-tree-icon.vue index 46454ca00..fee134fa3 100644 --- a/example/src/demo/pc/tree/set-tree-icon.vue +++ b/examples/docs/resources/pc/demo/tree/set-tree-icon.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/tree/single-select-radio.vue b/examples/docs/resources/pc/demo/tree/single-select-radio.vue new file mode 100644 index 000000000..72bae39de --- /dev/null +++ b/examples/docs/resources/pc/demo/tree/single-select-radio.vue @@ -0,0 +1,84 @@ + + + diff --git a/example/src/demo/pc/tree/slot-deffault.vue b/examples/docs/resources/pc/demo/tree/slot-deffault.vue similarity index 98% rename from example/src/demo/pc/tree/slot-deffault.vue rename to examples/docs/resources/pc/demo/tree/slot-deffault.vue index feaff5072..9e7a551b3 100644 --- a/example/src/demo/pc/tree/slot-deffault.vue +++ b/examples/docs/resources/pc/demo/tree/slot-deffault.vue @@ -6,7 +6,7 @@ - diff --git a/example/src/demo/pc/user-account/custom-operation.vue b/examples/docs/resources/pc/demo/user-account/custom-operation.vue similarity index 95% rename from example/src/demo/pc/user-account/custom-operation.vue rename to examples/docs/resources/pc/demo/user-account/custom-operation.vue index c6f323b5c..6b55342b8 100644 --- a/example/src/demo/pc/user-account/custom-operation.vue +++ b/examples/docs/resources/pc/demo/user-account/custom-operation.vue @@ -5,7 +5,7 @@ - diff --git a/examples/docs/resources/pc/demo/user-contact/basic-usage.vue b/examples/docs/resources/pc/demo/user-contact/basic-usage.vue new file mode 100644 index 000000000..5ab10a1db --- /dev/null +++ b/examples/docs/resources/pc/demo/user-contact/basic-usage.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/docs/resources/pc/demo/user-contact/data-source.vue b/examples/docs/resources/pc/demo/user-contact/data-source.vue new file mode 100644 index 000000000..b46206444 --- /dev/null +++ b/examples/docs/resources/pc/demo/user-contact/data-source.vue @@ -0,0 +1,27 @@ + + + diff --git a/example/src/demo/pc/user-contact/not-displayed-content.vue b/examples/docs/resources/pc/demo/user-contact/not-displayed-content.vue similarity index 90% rename from example/src/demo/pc/user-contact/not-displayed-content.vue rename to examples/docs/resources/pc/demo/user-contact/not-displayed-content.vue index c71da55a9..e241f50e5 100644 --- a/example/src/demo/pc/user-contact/not-displayed-content.vue +++ b/examples/docs/resources/pc/demo/user-contact/not-displayed-content.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/user-head/color.vue b/examples/docs/resources/pc/demo/user-head/color.vue new file mode 100644 index 000000000..d835443b1 --- /dev/null +++ b/examples/docs/resources/pc/demo/user-head/color.vue @@ -0,0 +1,16 @@ + + + diff --git a/examples/docs/resources/pc/demo/user-head/custom-background-color.vue b/examples/docs/resources/pc/demo/user-head/custom-background-color.vue new file mode 100644 index 000000000..318bfdd04 --- /dev/null +++ b/examples/docs/resources/pc/demo/user-head/custom-background-color.vue @@ -0,0 +1,13 @@ + + + diff --git a/examples/docs/resources/pc/demo/user-head/custom-user-head-content.vue b/examples/docs/resources/pc/demo/user-head/custom-user-head-content.vue new file mode 100644 index 000000000..2acd5ab9d --- /dev/null +++ b/examples/docs/resources/pc/demo/user-head/custom-user-head-content.vue @@ -0,0 +1,39 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/user-head/icon-user-head.vue b/examples/docs/resources/pc/demo/user-head/icon-user-head.vue new file mode 100644 index 000000000..da3462253 --- /dev/null +++ b/examples/docs/resources/pc/demo/user-head/icon-user-head.vue @@ -0,0 +1,19 @@ + + + diff --git a/examples/docs/resources/pc/demo/user-head/image-user-head.vue b/examples/docs/resources/pc/demo/user-head/image-user-head.vue new file mode 100644 index 000000000..2e7b37de2 --- /dev/null +++ b/examples/docs/resources/pc/demo/user-head/image-user-head.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/user-head/label-user-head.vue b/examples/docs/resources/pc/demo/user-head/label-user-head.vue new file mode 100644 index 000000000..c4f3bade4 --- /dev/null +++ b/examples/docs/resources/pc/demo/user-head/label-user-head.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/user-head/message-count-limit.vue b/examples/docs/resources/pc/demo/user-head/message-count-limit.vue new file mode 100644 index 000000000..a0c0e0028 --- /dev/null +++ b/examples/docs/resources/pc/demo/user-head/message-count-limit.vue @@ -0,0 +1,13 @@ + + + diff --git a/examples/docs/resources/pc/demo/user-head/message-count-total.vue b/examples/docs/resources/pc/demo/user-head/message-count-total.vue new file mode 100644 index 000000000..0aacb967f --- /dev/null +++ b/examples/docs/resources/pc/demo/user-head/message-count-total.vue @@ -0,0 +1,13 @@ + + + diff --git a/examples/docs/resources/pc/demo/user-head/message-count-type.vue b/examples/docs/resources/pc/demo/user-head/message-count-type.vue new file mode 100644 index 000000000..594c843c2 --- /dev/null +++ b/examples/docs/resources/pc/demo/user-head/message-count-type.vue @@ -0,0 +1,13 @@ + + + diff --git a/examples/docs/resources/pc/demo/user-head/min-user-head.vue b/examples/docs/resources/pc/demo/user-head/min-user-head.vue new file mode 100644 index 000000000..9602fe667 --- /dev/null +++ b/examples/docs/resources/pc/demo/user-head/min-user-head.vue @@ -0,0 +1,13 @@ + + + diff --git a/examples/docs/resources/pc/demo/user-head/render-user-head-in-grid.vue b/examples/docs/resources/pc/demo/user-head/render-user-head-in-grid.vue new file mode 100644 index 000000000..165e56689 --- /dev/null +++ b/examples/docs/resources/pc/demo/user-head/render-user-head-in-grid.vue @@ -0,0 +1,130 @@ + + + + + diff --git a/examples/docs/resources/pc/demo/user-head/round-user-head.vue b/examples/docs/resources/pc/demo/user-head/round-user-head.vue new file mode 100644 index 000000000..0b2795e59 --- /dev/null +++ b/examples/docs/resources/pc/demo/user-head/round-user-head.vue @@ -0,0 +1,13 @@ + + + diff --git a/examples/docs/resources/pc/demo/user-link/basic-usage.vue b/examples/docs/resources/pc/demo/user-link/basic-usage.vue new file mode 100644 index 000000000..ef3786c1c --- /dev/null +++ b/examples/docs/resources/pc/demo/user-link/basic-usage.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/user-link/cache-users.vue b/examples/docs/resources/pc/demo/user-link/cache-users.vue new file mode 100644 index 000000000..7ee6ca04c --- /dev/null +++ b/examples/docs/resources/pc/demo/user-link/cache-users.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/user-link/custom-service.vue b/examples/docs/resources/pc/demo/user-link/custom-service.vue new file mode 100644 index 000000000..78d27d5ed --- /dev/null +++ b/examples/docs/resources/pc/demo/user-link/custom-service.vue @@ -0,0 +1,55 @@ + + + diff --git a/examples/docs/resources/pc/demo/user-link/text-field.vue b/examples/docs/resources/pc/demo/user-link/text-field.vue new file mode 100644 index 000000000..ef6d7670a --- /dev/null +++ b/examples/docs/resources/pc/demo/user-link/text-field.vue @@ -0,0 +1,18 @@ + + + diff --git a/example/src/demo/pc/user-link/text-split.vue b/examples/docs/resources/pc/demo/user-link/text-split.vue similarity index 93% rename from example/src/demo/pc/user-link/text-split.vue rename to examples/docs/resources/pc/demo/user-link/text-split.vue index bf03b89f9..cadf43833 100644 --- a/example/src/demo/pc/user-link/text-split.vue +++ b/examples/docs/resources/pc/demo/user-link/text-split.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/user-link/value-split.vue b/examples/docs/resources/pc/demo/user-link/value-split.vue new file mode 100644 index 000000000..9e9bc3cd5 --- /dev/null +++ b/examples/docs/resources/pc/demo/user-link/value-split.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/user-link/value.vue b/examples/docs/resources/pc/demo/user-link/value.vue new file mode 100644 index 000000000..ef3786c1c --- /dev/null +++ b/examples/docs/resources/pc/demo/user-link/value.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/user/basic-usage.vue b/examples/docs/resources/pc/demo/user/basic-usage.vue new file mode 100644 index 000000000..0960689c1 --- /dev/null +++ b/examples/docs/resources/pc/demo/user/basic-usage.vue @@ -0,0 +1,18 @@ + + + diff --git a/examples/docs/resources/pc/demo/user/cache-users.vue b/examples/docs/resources/pc/demo/user/cache-users.vue new file mode 100644 index 000000000..3778eb922 --- /dev/null +++ b/examples/docs/resources/pc/demo/user/cache-users.vue @@ -0,0 +1,24 @@ + + + diff --git a/example/src/demo/pc/user/collapse-show-overflow-tooltip.vue b/examples/docs/resources/pc/demo/user/collapse-show-overflow-tooltip.vue similarity index 95% rename from example/src/demo/pc/user/collapse-show-overflow-tooltip.vue rename to examples/docs/resources/pc/demo/user/collapse-show-overflow-tooltip.vue index 170545edc..a90be1b51 100644 --- a/example/src/demo/pc/user/collapse-show-overflow-tooltip.vue +++ b/examples/docs/resources/pc/demo/user/collapse-show-overflow-tooltip.vue @@ -9,7 +9,7 @@ > - diff --git a/examples/docs/resources/pc/demo/user/custom-service.vue b/examples/docs/resources/pc/demo/user/custom-service.vue new file mode 100644 index 000000000..6e597cb65 --- /dev/null +++ b/examples/docs/resources/pc/demo/user/custom-service.vue @@ -0,0 +1,56 @@ + + + diff --git a/examples/docs/resources/pc/demo/user/custom-sort.vue b/examples/docs/resources/pc/demo/user/custom-sort.vue new file mode 100644 index 000000000..8f9f24b34 --- /dev/null +++ b/examples/docs/resources/pc/demo/user/custom-sort.vue @@ -0,0 +1,20 @@ + + + diff --git a/example/src/demo/pc/user/delay-load.vue b/examples/docs/resources/pc/demo/user/delay-load.vue similarity index 92% rename from example/src/demo/pc/user/delay-load.vue rename to examples/docs/resources/pc/demo/user/delay-load.vue index 5d89b7823..9dc457747 100644 --- a/example/src/demo/pc/user/delay-load.vue +++ b/examples/docs/resources/pc/demo/user/delay-load.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/demo/user/event-change.vue b/examples/docs/resources/pc/demo/user/event-change.vue new file mode 100644 index 000000000..b516ac2e7 --- /dev/null +++ b/examples/docs/resources/pc/demo/user/event-change.vue @@ -0,0 +1,23 @@ + + + diff --git a/example/src/demo/pc/user/event-error.vue b/examples/docs/resources/pc/demo/user/event-error.vue similarity index 95% rename from example/src/demo/pc/user/event-error.vue rename to examples/docs/resources/pc/demo/user/event-error.vue index cee3e3106..2977feb13 100644 --- a/example/src/demo/pc/user/event-error.vue +++ b/examples/docs/resources/pc/demo/user/event-error.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/user/tag-copy.vue b/examples/docs/resources/pc/demo/user/tag-copy.vue similarity index 93% rename from example/src/demo/pc/user/tag-copy.vue rename to examples/docs/resources/pc/demo/user/tag-copy.vue index f2e4e6747..13adc5f1f 100644 --- a/example/src/demo/pc/user/tag-copy.vue +++ b/examples/docs/resources/pc/demo/user/tag-copy.vue @@ -4,7 +4,7 @@ - diff --git a/example/src/demo/pc/user/user-options.vue b/examples/docs/resources/pc/demo/user/user-options.vue similarity index 95% rename from example/src/demo/pc/user/user-options.vue rename to examples/docs/resources/pc/demo/user/user-options.vue index a01328edd..8a2bf4e2e 100644 --- a/example/src/demo/pc/user/user-options.vue +++ b/examples/docs/resources/pc/demo/user/user-options.vue @@ -9,7 +9,7 @@ - diff --git a/examples/docs/resources/pc/demo/user/value-split.vue b/examples/docs/resources/pc/demo/user/value-split.vue new file mode 100644 index 000000000..589a7c824 --- /dev/null +++ b/examples/docs/resources/pc/demo/user/value-split.vue @@ -0,0 +1,21 @@ + + + diff --git a/example/src/demo/pc/wizard/base-flow.vue b/examples/docs/resources/pc/demo/wizard/base-flow.vue similarity index 97% rename from example/src/demo/pc/wizard/base-flow.vue rename to examples/docs/resources/pc/demo/wizard/base-flow.vue index 0b8551b9e..23bd6b379 100644 --- a/example/src/demo/pc/wizard/base-flow.vue +++ b/examples/docs/resources/pc/demo/wizard/base-flow.vue @@ -2,7 +2,7 @@ - diff --git a/example/src/demo/pc/wizard/page-guide.vue b/examples/docs/resources/pc/demo/wizard/page-guide.vue similarity index 97% rename from example/src/demo/pc/wizard/page-guide.vue rename to examples/docs/resources/pc/demo/wizard/page-guide.vue index 5ba788c02..024e295fd 100644 --- a/example/src/demo/pc/wizard/page-guide.vue +++ b/examples/docs/resources/pc/demo/wizard/page-guide.vue @@ -2,7 +2,7 @@ - diff --git a/examples/docs/resources/pc/menus.js b/examples/docs/resources/pc/menus.js new file mode 100644 index 000000000..f3e61b866 --- /dev/null +++ b/examples/docs/resources/pc/menus.js @@ -0,0 +1,1082 @@ +const routerArr = [ + { + zh: '使用指南', + en: 'Usage Guidelines', + type: 'groupCount', + children: [ + { + en: 'Changelog', + zh: '更新日志', + enSuffix: false, + path: '/changelog' + }, + { + en: 'envpreparation', + zh: '环境准备', + enSuffix: false, + path: '/envpreparation' + }, + { + en: 'installation', + zh: '安装', + enSuffix: false, + path: '/installation' + }, + { + en: 'importComponents', + zh: '引入组件', + enSuffix: false, + path: '/import-components' + }, + { + en: 'adapter', + zh: '后端适配器', + enSuffix: false, + path: '/adapter' + }, + { + en: 'developDemo', + zh: '开发示例', + enSuffix: false, + path: '/develop-demo' + }, + { + en: 'tinyStage', + zh: '创建项目', + enSuffix: false, + path: '/tiny-stage' + }, + { + en: 'i18n', + zh: '国际化', + enSuffix: false, + path: '/i18n' + }, + { + en: 'theme', + zh: '主题配置', + enSuffix: false, + path: '/theme' + }, + { + en: 'formValid', + zh: '表单校验配置', + enSuffix: false, + path: '/form-valid' + } + ] + }, + { + zh: '框架风格', + en: 'Frame Style', + type: 'groupCount', + children: [ + { + en: 'Color', + zh: '色彩', + enSuffix: true, + path: '/color' + }, + { + en: 'Container', + zh: '版型', + enSuffix: true, + path: '/container' + }, + { + en: 'Font', + zh: '字体', + enSuffix: true, + path: '/font' + }, + { + en: 'Icon', + zh: '图标', + enSuffix: true, + path: '/icon' + }, + { + en: 'Layout', + zh: '布局', + enSuffix: true, + path: '/layout' + } + ] + }, + { + zh: '导航组件', + en: 'Navigation Components', + type: 'groupCount', + children: [ + { + en: 'Anchor', + zh: '锚点', + enSuffix: true, + path: '/anchor' + }, + { + en: 'Breadcrumb', + zh: '面包屑', + enSuffix: true, + path: '/breadcrumb' + }, + { + en: 'FallMenu', + zh: '瀑布菜单', + enSuffix: true, + path: '/fall-menu' + }, + { + en: 'Floatbar', + zh: '浮动块', + enSuffix: true, + path: '/floatbar' + }, + { + en: 'ToggleMenu', + zh: '收缩菜单', + enSuffix: true, + path: '/toggle-menu' + }, + { + en: 'LinkMenu', + zh: '收藏夹菜单', + enSuffix: true, + path: '/link-menu' + }, + { + en: 'Milestone', + zh: '里程碑', + enSuffix: true, + path: '/milestone' + }, + { + en: 'NavMenu', + zh: '导航菜单', + enSuffix: true, + path: '/nav-menu' + }, + { + en: 'Steps', + zh: '步骤条', + enSuffix: true, + path: '/steps' + }, + { + en: 'Tabs', + zh: '标签页', + enSuffix: true, + path: '/tabs' + }, + { + en: 'TimeLine', + zh: '时间线', + enSuffix: true, + path: '/time-line' + }, + { + en: 'TreeMenu', + zh: '树型菜单', + enSuffix: true, + path: '/tree-menu' + }, + { + en: 'Wizard', + zh: '流程图', + enSuffix: true, + path: '/wizard' + }, + { + en: 'Dropdown', + zh: '下拉菜单', + enSuffix: true, + path: '/dropdown' + }, + { + en: 'ActionMenu', + zh: '菜单按钮', + enSuffix: true, + path: '/action-menu' + } + ] + }, + { + zh: '容器组件', + en: 'Container Components', + type: 'groupCount', + children: [ + { + en: 'Carousel', + zh: '走马灯', + enSuffix: true, + path: '/carousel' + }, + { + en: 'DialogBox', + zh: '对话框', + enSuffix: true, + path: '/dialog-box' + }, + { + en: 'Collapse', + zh: '折叠面板', + enSuffix: true, + path: '/collapse' + }, + { + en: 'Split', + zh: '面板分割', + enSuffix: true, + path: '/split' + } + ] + }, + { + zh: '表单组件', + en: 'Form Components', + type: 'groupCount', + children: [ + { + en: 'Autocomplete', + zh: '自动完成', + enSuffix: true, + path: '/autocomplete' + }, + { + en: 'Button', + zh: '按钮', + enSuffix: true, + path: '/button' + }, + { + en: 'ButtonGroup', + zh: '按钮组', + enSuffix: true, + path: '/button-group' + }, + { + en: 'Cascader', + zh: '级联选择器', + enSuffix: true, + path: '/cascader' + }, + { + en: 'CascaderPanel', + zh: '级联面板', + enSuffix: true, + path: '/cascader-panel' + }, + { + en: 'Checkbox', + zh: '复选框', + enSuffix: true, + path: '/checkbox' + }, + { + en: 'DatePicker', + zh: '日期选择器', + enSuffix: true, + path: '/date-picker' + }, + { + en: 'DropTimes', + zh: '下拉时间', + enSuffix: true, + path: '/drop-times' + }, + { + en: 'FileUpload', + zh: '文件上传', + enSuffix: true, + path: '/file-upload' + }, + { + en: 'Form', + zh: '表单', + enSuffix: true, + path: '/form' + }, + { + en: 'Input', + zh: '输入框', + enSuffix: true, + path: '/input' + }, + { + en: 'IpAddress', + zh: '输入框', + enSuffix: true, + path: '/ip-address' + }, + { + en: 'Link', + zh: '文字链接', + enSuffix: true, + path: '/link' + }, + { + en: 'Numeric', + zh: '计数器', + enSuffix: true, + path: '/numeric' + }, + { + en: 'PopEditor', + zh: '弹出编辑', + enSuffix: true, + path: '/pop-editor' + }, + { + en: 'PopUpload', + zh: '弹出框上传', + enSuffix: true, + path: '/pop-upload' + }, + { + en: 'Radio', + zh: '单选框', + enSuffix: true, + path: '/radio' + }, + { + en: 'Search', + zh: '搜索', + enSuffix: true, + path: '/search' + }, + { + en: 'Select', + zh: '选择器', + enSuffix: true, + path: '/select' + }, + { + en: 'Slider', + zh: '滑块', + enSuffix: true, + path: '/slider' + }, + { + en: 'Switch', + zh: '开关', + enSuffix: true, + path: '/switch' + }, + { + en: 'TimePicker', + zh: '时间选择器', + enSuffix: true, + path: '/time-picker' + }, + { + en: 'TimeSelect', + zh: '时间选择', + enSuffix: true, + path: '/time-select' + } + ] + }, + { + zh: '表格组件', + en: 'Table Components', + type: 'groupCount', + children: [ + { + en: 'Basic Usage', + zh: '基本用法', + enSuffix: false, + path: '/grid' + }, + { + en: 'Ordinal column', + zh: '序号列', + enSuffix: false, + path: '/grid-serial-column' + }, + { + en: 'Operation column', + zh: '操作列', + enSuffix: false, + path: '/grid-operation-column' + }, + { + en: 'Empty data', + zh: '空数据', + enSuffix: false, + path: '/grid-empty-data-tip' + }, + { + en: 'Data source', + zh: '数据源', + enSuffix: false, + path: '/grid-data-source' + }, + { + en: 'Big data', + zh: '大数据', + enSuffix: false, + path: '/grid-large-data' + }, + { + en: 'Pagination', + zh: '分页', + enSuffix: false, + path: '/grid-pager' + }, + { + en: 'Editing', + zh: '编辑', + enSuffix: false, + path: '/grid-edit' + }, + { + en: 'Toolbar', + zh: '工具栏', + enSuffix: false, + path: '/grid-toolbar' + }, + { + en: 'Loading', + zh: '加载中', + enSuffix: false, + path: '/grid-grid-loading-tip' + }, + { + en: 'Size', + zh: '尺寸', + enSuffix: false, + path: '/grid-grid-size' + }, + { + en: 'Width and height', + zh: '宽高', + enSuffix: false, + path: '/grid-width-height' + }, + { + en: 'Borders', + zh: '边框', + enSuffix: false, + path: '/grid-grid-border' + }, + { + en: 'Highlighting', + zh: '高亮', + enSuffix: false, + path: '/grid-highlight' + }, + { + en: 'Zebra Crossing Stripes', + zh: '斑马线条纹', + enSuffix: false, + path: '/grid-grid-stripe' + }, + { + en: 'OptimizedConfigurationItems', + zh: '优化配置项', + enSuffix: false, + path: '/grid-grid-optimization' + }, + { + en: 'Tip', + zh: '提示', + enSuffix: false, + path: '/grid-tip' + }, + { + en: 'Alignment', + zh: '对齐方式', + enSuffix: false, + path: '/grid-align' + }, + { + en: 'Table Header', + zh: '表头', + enSuffix: false, + path: '/grid-header' + }, + { + en: 'End of table', + zh: '表尾', + enSuffix: false, + path: '/grid-footer' + }, + { + en: 'Custom Styles', + zh: '自定义样式', + enSuffix: false, + path: '/grid-custom-style' + }, + { + en: 'Sorting', + zh: '排序', + enSuffix: false, + path: '/grid-sort' + }, + { + en: 'Filtering', + zh: '筛选', + enSuffix: false, + path: '/grid-filter' + }, + { + en: 'Freeze', + zh: '冻结', + enSuffix: false, + path: '/grid-fixed' + }, + { + en: 'Merges', + zh: '合并', + enSuffix: false, + path: '/grid-span' + }, + { + en: 'Grouping', + zh: '分组', + enSuffix: false, + path: '/grid-row-grouping' + }, + { + en: 'Statistic', + zh: '统计', + enSuffix: false, + path: '/grid-summary' + }, + { + en: 'Drag and drop', + zh: '拖拽', + enSuffix: false, + path: '/grid-drag' + }, + { + en: 'Data Cascading', + zh: '数据级联', + enSuffix: false, + path: '/grid-cascade' + }, + { + en: 'Right-click menu', + zh: '右键菜单', + enSuffix: false, + path: '/grid-context-menu' + }, + { + en: 'Editors', + zh: '编辑器', + enSuffix: false, + path: '/grid-editor' + }, + { + en: 'Renderer', + zh: '渲染器', + enSuffix: false, + path: '/grid-renderer' + }, + { + en: 'Check the table', + zh: '表格校验', + enSuffix: false, + path: '/grid-validation' + }, + { + en: 'Events', + zh: '事件', + enSuffix: false, + path: '/grid-event' + }, + { + en: 'Slots', + zh: '插槽', + enSuffix: false, + path: '/grid-slot' + }, + { + en: 'Personalized', + zh: '个性化', + enSuffix: false, + path: '/grid-customized' + }, + { + en: 'Tree table', + zh: '树表', + enSuffix: false, + path: '/grid-tree-grid' + }, + { + en: 'Nested Tables', + zh: '嵌套表格', + enSuffix: false, + path: '/grid-nested-grid' + }, + { + en: 'Import and export', + zh: '导入导出', + enSuffix: false, + path: '/grid-import-export' + }, + { + en: 'Mouse and Keyboard Configuration', + zh: '鼠标和键盘配置', + enSuffix: false, + path: '/grid-keyboard' + }, + { + en: 'Table row and column reversal', + zh: '表格行列反转', + enSuffix: false, + path: '/grid-reverse-column-row' + }, + { + en: 'Dynamically Generate Columns', + zh: '动态生成列', + enSuffix: false, + path: '/grid-dynamically-columns' + }, + { + en: 'Frequently Asked Questions', + zh: '常见问题', + enSuffix: false, + path: '/grid-faq' + } + ] + }, + { + zh: '图表组件', + en: 'Chart Components', + type: 'groupCount', + children: [ + { + en: 'Basic Usage', + zh: '基本用法', + enSuffix: false, + path: '/chart' + }, + { + en: 'Event Listening', + zh: '事件监听', + enSuffix: false, + path: '/chart-events' + }, + { + en: 'Attribute Configuration Example', + zh: '属性配置示例', + enSuffix: false, + path: '/chart-attributes-demo' + }, + { + en: 'Examples of FAQs', + zh: '常见问题示例', + enSuffix: false, + path: '/chart-question' + }, + { + en: 'Line Chart', + zh: '折线图', + enSuffix: false, + path: '/chart-line' + }, + { + en: 'Bar Chart', + zh: '柱状图', + enSuffix: false, + path: '/chart-histogram' + }, + { + en: 'Rank chart', + zh: '条形图', + enSuffix: false, + path: '/chart-bar' + }, + { + en: 'Pie Chart', + zh: '饼图', + enSuffix: false, + path: '/chart-pie' + }, + { + en: 'Ring diagram', + zh: '环图', + enSuffix: false, + path: '/chart-ring' + }, + { + en: 'Waterfall Map', + zh: '瀑布图', + enSuffix: false, + path: '/chart-waterfall' + }, + { + en: 'Funnel diagram', + zh: '漏斗图', + enSuffix: false, + path: '/chart-funnel' + }, + { + en: 'Radar chart', + zh: '雷达图', + enSuffix: false, + path: '/chart-radar' + }, + { + en: 'Map', + zh: '地图', + enSuffix: false, + path: '/chart-map' + }, + { + en: 'Sankitu', + zh: '桑基图', + enSuffix: false, + path: '/chart-sankey' + }, + { + en: 'Heat map', + zh: '热力图', + enSuffix: false, + path: '/chart-heatmap' + }, + { + en: 'Scatter chart', + zh: '散点图', + enSuffix: false, + path: '/chart-scatter' + }, + { + en: 'K-line chart', + zh: 'K线图', + enSuffix: false, + path: '/chart-candle' + }, + { + en: 'Dashboard', + zh: '仪表盘', + enSuffix: false, + path: '/chart-gauge' + }, + { + en: 'Treemap', + zh: '树图', + enSuffix: false, + path: '/chart-tree' + }, + { + en: 'Water balloon diagram', + zh: '水球图', + enSuffix: false, + path: '/chart-liquidfill' + }, + { + en: 'Word cloud map', + zh: '词云图', + enSuffix: false, + path: '/chart-wordcloud' + }, + { + en: 'Rising Sun Map', + zh: '旭日图', + enSuffix: false, + path: '/chart-sunburst' + }, + { + en: 'Topology Diagram', + zh: '拓扑图', + enSuffix: false, + path: '/chart-graph' + }, + { + en: 'Baidu Map', + zh: '百度地图', + enSuffix: false, + path: '/chart-baidu-map' + }, + { + en: 'Gaud Map', + zh: '高德地图', + enSuffix: false, + path: '/chart-autonavi-map' + }, + { + en: 'Box diagram', + zh: '箱形图', + enSuffix: false, + path: '/chart-boxplot' + } + ] + }, + { + zh: '数据组件', + en: 'Data Components', + type: 'groupCount', + children: [ + { + en: 'Pager', + zh: '分页', + enSuffix: true, + path: '/pager' + }, + { + en: 'Progress', + zh: '进度条', + enSuffix: true, + path: '/progress' + }, + { + en: 'Tree', + zh: '树形控件', + enSuffix: true, + path: '/tree' + }, + { + en: 'Transfer', + zh: '穿梭框', + enSuffix: true, + path: '/transfer' + } + ] + }, + { + zh: '提示组件', + en: 'Tips Components', + type: 'groupCount', + children: [ + { + en: 'Alert', + zh: '警告', + enSuffix: true, + path: '/alert' + }, + { + en: 'Badge', + zh: '标记', + enSuffix: true, + path: '/badge' + }, + { + en: 'Loading', + zh: '加载', + enSuffix: true, + path: '/loading' + }, + { + en: 'Tooltip', + zh: '文字提示', + enSuffix: true, + path: '/tooltip' + }, + { + en: 'Popover', + zh: '弹出框', + enSuffix: true, + path: '/popover' + }, + { + en: 'Modal', + zh: '模态框', + enSuffix: true, + path: '/modal' + }, + { + en: 'Notify', + zh: '通知', + enSuffix: true, + path: '/notify' + } + ] + }, + { + zh: '业务组件', + en: 'Business Components', + type: 'groupCount', + children: [ + { + en: 'Amount', + zh: '金额', + enSuffix: true, + path: '/amount' + }, + { + en: 'Area', + zh: '片区', + enSuffix: true, + path: '/area' + }, + { + en: 'Company', + zh: '公司', + enSuffix: true, + path: '/company' + }, + { + en: 'Country', + zh: '国家/地区', + enSuffix: true, + path: '/country' + }, + { + en: 'Currency', + zh: '币种', + enSuffix: true, + path: '/currency' + }, + { + en: 'Dept', + zh: '部门', + enSuffix: true, + path: '/dept' + }, + { + en: 'DropRoles', + zh: '下拉角色', + enSuffix: true, + path: '/drop-roles' + }, + { + en: 'Espace', + zh: '消息弹框', + enSuffix: true, + path: '/espace' + }, + { + en: 'Hrapprover', + zh: '权签人', + enSuffix: true, + path: '/hrapprover' + }, + { + en: 'Locales', + zh: '语言选择', + enSuffix: true, + path: '/locales' + }, + { + en: 'LogonUser', + zh: '登录用户', + enSuffix: true, + path: '/logon-user' + }, + { + en: 'Logout', + zh: '注销', + enSuffix: true, + path: '/logout' + }, + { + en: 'Roles', + zh: '角色切换', + enSuffix: true, + path: '/roles' + }, + { + en: 'User', + zh: '用户', + enSuffix: true, + path: '/user' + }, + { + en: 'UserAccount', + zh: '用户账号', + enSuffix: true, + path: '/user-account' + }, + { + en: 'UserLink', + zh: '用户信息链接', + enSuffix: true, + path: '/user-link' + } + ] + }, + { + zh: '其他组件', + en: 'Other Components', + type: 'groupCount', + children: [ + { + en: 'BulletinBoard', + zh: '公告牌', + enSuffix: true, + path: '/bulletin-board' + }, + { + en: 'Calendar', + zh: '日历', + enSuffix: true, + path: '/calendar' + }, + { + en: 'CreditCardForm', + zh: '信用卡表单', + enSuffix: true, + path: '/credit-card-form' + }, + { + en: 'Crop', + zh: '图片裁剪', + enSuffix: true, + path: '/crop' + }, + { + en: 'DetailPage', + zh: '表头详情栏', + enSuffix: true, + path: '/detail-page' + }, + { + en: 'Image', + zh: '图片预览', + enSuffix: true, + path: '/image' + }, + { + en: 'Rate', + zh: '评分', + enSuffix: true, + path: '/rate' + }, + { + en: 'ScrollText', + zh: '文字滚动', + enSuffix: true, + path: '/scroll-text' + }, + { + en: 'SlideBar', + zh: '滚动块', + enSuffix: true, + path: '/slide-bar' + }, + { + en: 'Tag', + zh: '标签', + enSuffix: true, + path: '/tag' + }, + { + en: 'TextPopup', + zh: '输入框', + enSuffix: true, + path: '/textpopup' + }, + { + en: 'UserContact', + zh: '联系人', + enSuffix: true, + path: '/user-contact' + }, + { + en: 'UserHead', + zh: '用户头像', + enSuffix: true, + path: '/user-head' + }, + { + en: 'Fullscreen', + zh: '全屏显示', + enSuffix: true, + path: '/fullscreen' + } + ] + } +] +export default routerArr diff --git a/examples/docs/tsconfig.json b/examples/docs/tsconfig.json new file mode 100644 index 000000000..9013c9768 --- /dev/null +++ b/examples/docs/tsconfig.json @@ -0,0 +1,7 @@ +{ + "extends": "../../tsconfig.vue3.json", + "include": [ + "types/shims-vue.d.ts", + "types/shims-app.d.ts" + ] +} \ No newline at end of file diff --git a/examples/docs/types/shims-app.d.ts b/examples/docs/types/shims-app.d.ts new file mode 100644 index 000000000..e7359d204 --- /dev/null +++ b/examples/docs/types/shims-app.d.ts @@ -0,0 +1,4 @@ +declare module '*?raw' { + const content: string + export default content +} \ No newline at end of file diff --git a/examples/docs/types/shims-vue.d.ts b/examples/docs/types/shims-vue.d.ts new file mode 100644 index 000000000..1e1696e01 --- /dev/null +++ b/examples/docs/types/shims-vue.d.ts @@ -0,0 +1,5 @@ +declare module '*.vue' { + import { defineComponent } from 'vue' + const component: ReturnType + export default component +} \ No newline at end of file diff --git a/examples/vue2.7/.depcheckrc.yaml b/examples/vue2.7/.depcheckrc.yaml new file mode 100644 index 000000000..cd2946113 --- /dev/null +++ b/examples/vue2.7/.depcheckrc.yaml @@ -0,0 +1,3 @@ +ignores: + - "@opentiny/vue-theme*" + - "@opentiny/vue*" \ No newline at end of file diff --git a/examples/vue2.7/CHANGELOG.md b/examples/vue2.7/CHANGELOG.md new file mode 100644 index 000000000..cc14a5c1b --- /dev/null +++ b/examples/vue2.7/CHANGELOG.md @@ -0,0 +1,59 @@ +# Change Log + +All notable changes to this project will be documented in this file. +See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + +## [0.1.6-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue2.7-example@0.1.5-mf.0...vue2.7-example@0.1.6-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue2.7-example + + + + + +## [0.1.5-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue2.7-example@0.1.4-mf.0...vue2.7-example@0.1.5-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue2.7-example + + + + + +## [0.1.4-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue2.7-example@0.1.3-mf.0...vue2.7-example@0.1.4-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue2.7-example + + + + + +## [0.1.3-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue2.7-example@0.1.2-mf.0...vue2.7-example@0.1.3-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue2.7-example + + + + + +## [0.1.2-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue2.7-example@0.1.1-beta.0...vue2.7-example@0.1.2-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue2.7-example + + + + + +## 0.1.1-beta.0 (2023-02-08) + + +### Bug Fixes + +* 尝试修复 vue2.7 启动包版本不匹配错误 ([d79b172](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/d79b17219a7dfdde9cd4621315264ec76b5306b2)) +* 使得针对不同版本Vue的类型扩展能正常工作 ([9fb7946](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/9fb79466ddc848385d4231bbee51c189a849868c)) +* 修正 tailwindcss-vite-plugin 根据 windows 斜杠路径找不到入口模块而报错的问题 ([4b37f4f](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/4b37f4f43f64588b223957fe362d29d59af98ba1)) + + +### Features + +* 搭建了基于 vitest 的单元测试和基于 playwright 的 E2E 测试 ([fdeddaf](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/fdeddaf6c753c737caf5434cea2c86cc4292a311)) +* 增加 vue2.7 的支持 ([ea71624](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/ea71624e33eef95536ad3adb66d5e646cf734cbe)) diff --git a/examples/vue2.7/index.html b/examples/vue2.7/index.html new file mode 100644 index 000000000..b747ab21d --- /dev/null +++ b/examples/vue2.7/index.html @@ -0,0 +1,13 @@ + + + + + + + opentiny Vue2.7 + + +
+ + + diff --git a/examples/vue2.7/package.json b/examples/vue2.7/package.json new file mode 100644 index 000000000..64432a8c1 --- /dev/null +++ b/examples/vue2.7/package.json @@ -0,0 +1,61 @@ +{ + "name": "vue2.7-example", + "type": "module", + "private": true, + "version": "0.1.6-mf.0", + "files": [ + "*" + ], + "scripts": { + "dev": "vite --port 6174", + "build": "vite build", + "preview": "vite preview", + "test:e2e": "playwright test", + "test:unit": "vitest" + }, + "devDependencies": { + "@opentiny-internal/playwright-config": "workspace:^1.0.1-beta.0", + "@opentiny-internal/unplugin-virtual-template": "workspace:*", + "@opentiny/vue": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-theme": "workspace:~", + "@opentiny/vue-theme-mobile": "workspace:~", + "@opentiny/vue-docs": "workspace:~", + "@playwright/test": "^1.29.2", + "@vitejs/plugin-vue2": "^2.2.0", + "@vitejs/plugin-vue2-jsx": "^1.1.0", + "@vitest/ui": "^0.27.1", + "@vue/babel-helper-vue-jsx-merge-props": "^1.4.0", + "@vue/test-utils": "^1.3.3", + "jsdom": "^21.0.0", + "postcss": "^8.4.16", + "typescript": "^4.9.4", + "vite": "^4.0.2", + "vite-plugin-checker": "^0.5.2", + "vite-plugin-dynamic-import": "^1.2.4", + "vite-plugin-importus": "^1.0.4", + "vite-plugin-inspect": "^0.7.9", + "vite-plugin-md": "^0.22.5", + "vite-plugin-static-copy": "^0.12.0", + "vite-plugin-vue-inspector": "^3.3.2", + "vite-plugin-vue2-svg": "^0.3.0", + "vitest": "^0.25.7", + "vue": "~2.7.10", + "vue-i18n": "^8.9.0", + "vue-router": "^3.6.4", + "vue-template-compiler": "2.7.10", + "vue-tsc": "^1.0.16", + "js-sha256": "^0.9.0", + "monaco-editor": "^0.34.1", + "monaco-editor-core": "^0.34.1", + "monaco-volar": "0.0.6", + "onigasm": "^2.2.5", + "unocss": "^0.48.0", + "@unocss/core": "^0.48.0", + "@unocss/preset-icons": "^0.48.0", + "@unocss/transformer-directives": "^0.48.0" + } +} diff --git a/examples/vue2.7/playwright.config.js b/examples/vue2.7/playwright.config.js new file mode 100644 index 000000000..41c8570a3 --- /dev/null +++ b/examples/vue2.7/playwright.config.js @@ -0,0 +1,6 @@ +import Config from '@opentiny-internal/playwright-config' + +export default Config({ + testDir: '../docs/.legacy/demo', + port: 6174, +}) diff --git a/examples/vue2.7/postcss.config.cjs b/examples/vue2.7/postcss.config.cjs new file mode 100644 index 000000000..95c31dcd1 --- /dev/null +++ b/examples/vue2.7/postcss.config.cjs @@ -0,0 +1,5 @@ +module.exports = { + plugins: { + autoprefixer: {}, + } +} diff --git a/examples/vue2.7/shims-app.d.ts b/examples/vue2.7/shims-app.d.ts new file mode 100644 index 000000000..bf8e69d36 --- /dev/null +++ b/examples/vue2.7/shims-app.d.ts @@ -0,0 +1,34 @@ +declare module '*.vue' { + import type { App, DefineComponent } from 'vue' + const component: DefineComponent<{}, {}, any> & { + install(app: any): void + } + export default component +} + +declare module '*.svg' { + import type { DefineComponent } from 'vue' + const component: DefineComponent<{}, {}, any> + export default component +} + +declare module '*.jpg' { + const src: string; + export default src; +} + +declare module '*.jpeg' { + const src: string; + export default src; +} + +declare module '*.png' { + const src: string; + export default src; +} + +declare module 'virtual-template?*' { + import type { DefineComponent } from 'vue' + const src: (mode: string) => DefineComponent<{}, {}, any>; + export default src; +} diff --git a/examples/vue2.7/shims-vue.d.ts b/examples/vue2.7/shims-vue.d.ts new file mode 100644 index 000000000..34ccad9b6 --- /dev/null +++ b/examples/vue2.7/shims-vue.d.ts @@ -0,0 +1,12 @@ +import Vue from 'vue' +import VueRouter, { Route } from 'vue-router' + +declare module 'vue/types/vue' { + interface Vue { + $router: VueRouter, + $route: Route + } + interface VueConstructor { + install(app: VueConstructor): void + } +} \ No newline at end of file diff --git a/examples/vue2.7/src/main.ts b/examples/vue2.7/src/main.ts new file mode 100644 index 000000000..c72f0f4d5 --- /dev/null +++ b/examples/vue2.7/src/main.ts @@ -0,0 +1,17 @@ +import Vue from 'vue' +import VueI18n from 'vue-i18n' +import { initI18n } from '@opentiny/vue-locale' +import App from '@/App.vue' + +const mode = new URL(location.href).searchParams.get('mode') || localStorage.getItem('vue-example-mode') || 'pc' +const isPcMode = mode === 'pc' +const isMobileMode = mode === 'mobile' +Vue.prototype.tiny_mode = { value: mode } +Vue.prototype.isPcMode = isPcMode +Vue.prototype.isMobileMode = isMobileMode +Vue.use(VueI18n) + +new Vue({ + i18n: initI18n({ VueI18n, i18n: {} }), + render: h => h(App), +}).$mount('#app') diff --git a/examples/vue2.7/tsconfig.json b/examples/vue2.7/tsconfig.json new file mode 100644 index 000000000..6afb4adc0 --- /dev/null +++ b/examples/vue2.7/tsconfig.json @@ -0,0 +1,14 @@ +{ + "extends": "../../tsconfig.vue2.7.json", + "include": [ + "src/**/*.ts", + "src/**/*.tsx", + "src/**/*.vue", + ".ts" + ], + "exclude": [ + "node_modules", + "**/dist", + "**/*.md" + ] +} \ No newline at end of file diff --git a/examples/vue2.7/vite-plugins/vite-plugin-uno-preset.ts b/examples/vue2.7/vite-plugins/vite-plugin-uno-preset.ts new file mode 100644 index 000000000..f7cc15edc --- /dev/null +++ b/examples/vue2.7/vite-plugins/vite-plugin-uno-preset.ts @@ -0,0 +1,246 @@ +const _s0 = { + m: 'margin', + p: 'padding', + + w: 'width', + h: 'height', + + minw: 'min-width', + maxw: 'max-width', + minh: 'min-height', + maxh: 'max-height', + + r: '-right', + l: '-left', + b: '-bottom', + t: '-top' +} +const sizeRules = [ + // 高宽, 字体,行高 f12 lh20 w200 h200 box78 + [/^(w|h|minw|maxw|minh|maxh)(\d+)$/, ([, attr, num]) => ({ [`${_s0[attr]}`]: `${num}px` })], + // 高宽百分比 wp33 hp50 + [/^(w|h)p(\d+\.?\d*)$/, ([, attr, num]) => ({ [`${_s0[attr]}`]: `${num}%` })], + + // 内外边距 *可负* m10 mr10 mt-10 mx20 my-10 p10 pr10 + [/^([mp])([rlbt]?)(-?\d+)$/, ([, attr, pos, num]) => ({ [`${_s0[attr]}${pos ? _s0[pos] : ''}`]: `${num}px` })], + // 内外边距auto m-auto mt-auto mx-auto + [/^([mp])([rlbt]?)-auto$/, ([, attr, pos]) => ({ [`${_s0[attr]}${pos ? _s0[pos] : ''}`]: 'auto' })], + + // abs 定位时 *可负* left0 right50 bottom-20 leftauto + [/^(left|top|right|bottom)(-?\d+)$/, ([, pos, num]) => ({ [`${pos}`]: `${num}px` })], + [/^(left|top|right|bottom)-(auto|unset)$/, ([, pos, val]) => ({ [`${pos}`]: val })] +] +const _s1 = { + none: 'none', + block: 'block', + inline: 'inline', + flex: 'flex', + grid: 'grid', + ib: 'inline-block', + if: 'inline-flex', + ig: 'inline-grid', + + abs: 'absolute', + rel: 'relative', + fixed: 'fixed', + sticky: 'sticky', + static: 'static', + + r: 'row', + c: 'column', + center: 'center', + start: 'flex-start', + end: 'flex-end', + around: 'space-around', + between: 'space-between', + evenly: 'space-evenly', + stretch: 'stretch' +} + +const layoutRules = [ + // display d-none, d-block d-flex d-inline d-grid d-ib d-if d-ig + [/^d-(none|block|flex|inline|grid|ib|if|ig)$/, ([, pos]) => ({ display: `${_s1[pos]}` })], + // position abs rel fixed sticky static + [/^(rel|abs|fixed|sticky|static)$/, ([, pos]) => ({ position: `${_s1[pos]}` })], + // 绝对定位 abs-0 fixed-0 + ['abs-0', { position: 'absolute', left: 0, right: 0, top: 0, bottom: 0 }], + ['fixed-0', { position: 'fixed', left: 0, right: 0, top: 0, bottom: 0 }], + // 这个会用的很少,通常是css reset中会重置。 + ['border-box', { 'box-sizing': 'border-box' }], + ['content-box', { 'box-sizing': 'content-box' }], + // flex布局 父元素: f-r f-c f-center f-pos-between f-box-stretch f-wrap + [/^f-([rc])$/, ([, dir]) => ({ display: 'flex', 'flex-direction': `${_s1[dir]}` })], + [/^f-pos-(start|center|end|around|between|evenly|stretch)$/, ([, dir]) => ({ 'justify-content': `${_s1[dir]}` })], + [/^f-box-(start|center|end|stretch)$/, ([, dir]) => ({ 'align-items': `${_s1[dir]}` })], + [/^f-(wrap|nowrap)$/, ([, dir]) => ({ 'flex-wrap': dir })], + + // 子元素: fi-1 fi-4 + [/^fi-(\d+)$/, ([, num]) => ({ flex: `${num}` })] +] + +const _s2 = { + f: 'font-size', + lh: 'line-height', + + bold: 'bolder', + thin: 'lighter', + normal: 'normal', + + under: 'underline', + over: 'overline', + through: 'line-through', + del: 'line-through', + none: 'none' +} + +const fontRules = [ + // 字体与行高 f12 lh20 + [/^(f|lh)(\d+)$/, ([, attr, num]) => ({ [`${_s2[attr]}`]: `${num}px` })], + // 字体粗细 fw-bold fw-700 + [/^fw-(bold|thin|normal)$/, ([, dir]) => ({ 'font-weight': `${_s2[dir]}` })], + [/^fw-(\d+)$/, ([, val]) => ({ 'font-weight': val })], + // 文字对齐 text-right ta-center + [/^(text|ta)-(right|left|center)$/, ([, abbr, dir]) => ({ 'text-align': dir })], + // 文字上下划线 solid|double|dotted|dashed|wavy + // td-under td-over-wavy td-over td-none-dashed + [ + /^td-(under|over|through|del|none)(-solid|-double|-dotted|-dashed|-wavy)?$/, + ([, dir, style = '']) => ({ 'text-decoration': `${_s2[dir]} ${style.slice(1)}` }) + ], + // 文字阴影 ts-sm ts-lg + ['ts-sm', { 'text-shadow': 'var(--text-shadow-sm)' }], + ['ts-lg', { 'text-shadow': 'var(--text-shadow-lg)' }] +] +const _s3 = { + a: '', // all + r: '-right', + l: '-left', + b: '-bottom', + t: '-top', + ws: 'var(--border-width) var(--border-style) ' // width & style +} + +const borderRules = [ + // 边框 b-a b-b b-r b-t b-l b-a-primary b-a#ff0000 + [/^b-([arlbt])$/, ([, pos]) => ({ [`border${_s3[pos]}`]: _s3.ws + 'var(--border-color)' })], + [/^b-([arlbt])-([\w|-]+)$/, ([, pos, color]) => ({ [`border${_s3[pos]}`]: _s3.ws + `var(--${color})` })], + [/^b-([arlbt])#(\w+)$/, ([, pos, color]) => ({ [`border${_s3[pos]}`]: _s3.ws + `#${color}` })], + // 边框样式 bs-dotted bs-double + [/^bs-(none|dotted|dashed|solid|double|groove|ridge|inset|outset)$/, ([, style]) => ({ 'border-style': style })], + [/^br-(\d+)$/, ([, val]) => ({ 'border-radius': `${val}px` })], + // 无边框 nb-a nb-b nb-r nb-t nb-l + [/^nb-([arlbt])$/, ([, pos]) => ({ [`border${_s3[pos]}`]: 'none' })], + + ['br-sm', { 'border-radius': 'var(--box-radius-sm)' }], + ['br-lg', { 'border-radius': 'var(--box-radius-lg)' }], + ['br-circle', { 'border-radius': '50%' }], + ['bs-sm', { 'box-shadow': 'var(--box-shadow-sm)' }], + ['bs-lg', { 'box-shadow': 'var(--box-shadow-lg)' }] +] + +const _s4 = { + def: 'default', + hand: 'pointer', + disable: 'not-allowed' +} +const clamp = (v, min, max) => Math.min(Math.max(v, min), max) +const utilRules = [ + // 省略号 ellipsis ellipsis2 ellipsis3 + ['ellipsis', { overflow: 'hidden', ' text-overflow': 'ellipsis', 'white-space': 'nowrap' }], + [ + /^ellipsis(\d+)$/, + ([, num]) => ({ + display: '-webkit-box', + overflow: 'hidden', + '-webkit-line-clamp': num, + ' -webkit-box-orient': 'vertical', + 'overflow-wrap': 'anywhere' + }) + ], + // 光标样式 cur-hand + [/^cur-(def|hand|disable)$/, ([, shape]) => ({ cursor: `${_s4[shape]}` })], + // overflow of-auto ofx-hidden ofy-scroll + [/^of(\w?)-(auto|scroll|hidden|visible)$/, ([, axis, mode]) => ({ [`overflow${axis ? '-' + axis : ''}`]: mode })], + // 图片填充 img-cover + [/^img-(cover|contain|fill)$/, ([, mode]) => ({ 'object-fit': mode })], + // z-index z100 + [/^z(-?\d+)$/, ([, num]) => ({ 'z-index': num })], + // 选择相关 noselect allselect nomouse 参见选择变体: select:c-primary select:bg-dark + ['noselect', { 'user-select': 'none' }], + ['allselect', { 'user-select': 'all' }], + ['noevent', { 'pointer-events': 'none' }], + // 可见性 hide show + ['hide', { visibility: 'hidden' }], + ['show', { visibility: 'visible' }], + // 透明度 op100 + [/^op(\d+)$/, ([, val]) => ({ opacity: clamp(val / 100, 0, 1) })], + ['op-hover', { opacity: 'var(--hover-op)' }], + ['op-disabled', { opacity: 'var(--disabled-op)' }], + + // 断词 breakword breakall + [/^break(word|all)$/, ([, type]) => ({ 'word-break': `break-${type}` })] +] + +const _s5 = { c: 'color', bg: 'background-color' } +const colorRules = [ + // 颜色 #不建议使用 c-black bg-primary c#123456 c-theme-color + [/^(c|bg)-rand(\d+)$/, ([, attr, seed]) => ({ [`${_s5[attr]}`]: `#${Math.floor(Math.random() * 255 * 255 * 255).toString(16)}` })], + [(/^(c|bg)-([\w|-]+)$/, ([, attr, color]) => ({ [`${_s5[attr]}`]: `var(--${color})` }))], + [/^(c|bg)#(\w+)$/, ([, attr, color]) => ({ [`${_s5[attr]}`]: `#${color}` })] +] +export const rules = [...sizeRules, ...layoutRules, ...fontRules, ...borderRules, ...utilRules, ...colorRules] + +export const shortcuts = [ + [/^(m|p)x(-?\d+)$/, ([, t, c]) => `${t}l${c} ${t}r${c}`], + [/^(m|p)y(-?\d+)$/, ([, t, c]) => `${t}t${c} ${t}b${c}`], + + [/^(m|p)x-auto$/, ([, t, c]) => `${t}l-auto ${t}r-auto`], + [/^(m|p)y-auto$/, ([, t, c]) => `${t}t-auto ${t}b-auto`], + [/^box(\d+)$/, ([, w]) => `w${w} h${w}`], + [/^link-(\w+)$/, ([, c]) => `c-${c} h:c-${c}less cur-hand `], + [/^link#(\w+)$/, ([, c]) => `c#${c} cur-hand `], + ['f-center', 'd-flex f-pos-center f-box-center'] +] + +export const variants = [ + (matcher) => { + if (!matcher.startsWith('!')) return matcher + return { + matcher: matcher.slice(1), + body: (body) => { + body.forEach((e) => e[1] && (e[1] += ' !important')) + return body + } + } + }, + (matcher) => { + if (!matcher.startsWith('h:')) return matcher + return { + matcher: matcher.slice(2), + selector: (s) => `${s}:hover`, + body: (body) => { + body.push(['transition', 'all var(--trans-time)']) + return body + } + } + }, + (matcher) => { + if (!matcher.startsWith('child:')) return matcher + return { + matcher: matcher.slice(6), + selector: (s) => `${s}>*`, + body: (s) => s + } + }, + (matcher) => { + // "childxxx".match(/child<(\w+)>/ ) =====> ['child', 'code'] + const matchResult = matcher.match(/^child<(\w+)>/) + if (!matchResult) return matcher + const [matchStr, selector] = matchResult + return { + matcher: matcher.slice(matchStr.length), + selector: (s) => `${s} ${selector}`, + body: (s) => s + } + } +] diff --git a/examples/vue2.7/vite.config.ts b/examples/vue2.7/vite.config.ts new file mode 100644 index 000000000..cbf5a21ad --- /dev/null +++ b/examples/vue2.7/vite.config.ts @@ -0,0 +1,78 @@ +import path from 'node:path' +import { defineConfig, loadEnv } from 'vite' +import { checker as checkerPlugin } from 'vite-plugin-checker' +import dynamicImportPlugin from 'vite-plugin-dynamic-import' +import importPlugin from 'vite-plugin-importus' +import inspectPlugin from 'vite-plugin-inspect' +import { viteStaticCopy as staticCopyPlugin } from 'vite-plugin-static-copy' +import vue2Plugin from '@vitejs/plugin-vue2' +import vue2JsxPlugin from '@vitejs/plugin-vue2-jsx' +import { createSvgPlugin as vue2SvgPlugin } from 'vite-plugin-vue2-svg' +import virtualTemplatePlugin from '@opentiny-internal/unplugin-virtual-template/vite' +import { getAlias, pathFromWorkspaceRoot, getOptimizeDeps } from '../../internals/cli/src/config/vite' +// 增加Unocss +import Unocss from 'unocss/vite' +import { rules, shortcuts, variants } from './vite-plugins/vite-plugin-uno-preset.js' + +export default defineConfig((config) => { + const env = loadEnv(config.mode, process.cwd(), '') + + return { + server: { + host: 'localhost', + open: false, + }, + plugins: [ + virtualTemplatePlugin({ include: ['**/packages/vue/**/src/index.ts'], env }), + vue2Plugin({ + include: [/\.vue$/, /\.md$/], + }), + vue2JsxPlugin({ + injectH: false, + }), + vue2SvgPlugin(), + importPlugin([ + { + libraryName: '@opentiny/vue', + customName: name => `@opentiny/vue-${name}`, + style: false, + }, + ...['icon', 'icon-saas'].map(lib => ({ + libraryName: `@opentiny/vue-${lib}`, + customName: (name: string) => { + return name === 'default' ? `@opentiny/vue-${lib}$` : `@opentiny/vue-${lib}/${name.replace(/^icon-/, '')}` + }, + style: false, + })), + ]), + dynamicImportPlugin(), + Unocss({ + include: [/\.js$/, /\.ts$/, /\.vue$/, /\.html$/, /\.jsx$/, /\.tsx$/], // 增加js ,ts扫描 + presets: [], + rules, + shortcuts, + variants, + safelist: [...Array.from({ length: 24 }, (_, i) => `c-rand${i + 1}`), ...Array.from({ length: 24 }, (_, i) => `bg-rand${i + 1}`)] + }), + staticCopyPlugin({ + targets: [{ src: '../docs/public/*', dest: '' }], + }), + inspectPlugin(), + checkerPlugin({ overlay: { initialIsOpen: false }, terminal: false, typescript: false, vueTsc: true }), + ], + resolve: { + extensions: ['.js', '.ts', '.tsx', '.vue'], + alias: { + '@vue/composition-api': path.resolve('node_modules/vue/dist/vue.esm.js'), + 'vue': path.resolve('node_modules/vue/dist/vue.esm.js'), + '@': pathFromWorkspaceRoot('examples/docs/newsrc'), + '@vue/babel-helper-vue-jsx-merge-props': path.resolve('node_modules/@vue/babel-helper-vue-jsx-merge-props/dist/helper.js'), + ...getAlias(2.7, env.VITE_TINY_THEME), + }, + }, + define: { + 'process.env': env, + }, + optimizeDeps: getOptimizeDeps(2.7) + } +}) diff --git a/examples/vue2.7/vitest.config.ts b/examples/vue2.7/vitest.config.ts new file mode 100644 index 000000000..ac923817c --- /dev/null +++ b/examples/vue2.7/vitest.config.ts @@ -0,0 +1,68 @@ +import path from 'node:path' +import { defineConfig } from 'vitest/config' +import { loadEnv } from 'vite' +import virtualTemplatePlugin from '@opentiny-internal/unplugin-virtual-template/vite' +import vue2Plugin from '@vitejs/plugin-vue2' +import vue2JsxPlugin from '@vitejs/plugin-vue2-jsx' +import { createSvgPlugin as vue2SvgPlugin } from 'vite-plugin-vue2-svg' +import importPlugin from 'vite-plugin-importus' +import { getAlias } from '../../internal/config/vite' + +const pathResolve = (...paths: string[]) => path.resolve(__dirname, ...paths).replace(/\\/g, '/') + +export default defineConfig((config) => { + const env = loadEnv(config.mode, process.cwd(), '') + + return { + plugins: [ + virtualTemplatePlugin({ include: ['**/packages/vue/**/src/index.ts'], env }), + vue2Plugin({ + include: [/\.vue$/, /\.md$/], + }), + vue2JsxPlugin({ + injectH: false, + }), + vue2SvgPlugin(), + importPlugin([ + { + libraryName: '@opentiny/vue', + customName: name => `@opentiny/vue-${name}`, + style: false, + }, + ...['icon', 'icon-saas'].map(lib => ({ + libraryName: `@opentiny/vue-${lib}`, + customName: (name: string) => { + return name === 'default' ? `@opentiny/vue-${lib}$` : `@opentiny/vue-${lib}/${name.replace(/^icon-/, '')}` + }, + style: false, + })), + ]) + ], + optimizeDeps: { + disabled: true, + }, + define: { + 'process.env': env, + }, + test: { + open: false, + clearMocks: true, + environment: 'jsdom', + setupFiles: ['./vitest.setup.ts'], + transformMode: { + web: [/\.[jt]sx$/], + }, + include: [ + '../../packages/vue/src/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}' + ], + exclude: [ + '../../packages/vue/src/**/{node_modules,dist}/**', + ], + alias: { + 'vue': path.resolve('node_modules/vue/dist/vue.esm.js'), + '@vue/test-utils': path.resolve('node_modules/@vue/test-utils'), + ...getAlias(2.7), + } + }, + } +}) diff --git a/example/src/demo/pc/grid/footer/custom-footer.vue b/examples/vue2.7/vitest.setup.ts similarity index 100% rename from example/src/demo/pc/grid/footer/custom-footer.vue rename to examples/vue2.7/vitest.setup.ts diff --git a/examples/vue2/.depcheckrc.yaml b/examples/vue2/.depcheckrc.yaml new file mode 100644 index 000000000..cd2946113 --- /dev/null +++ b/examples/vue2/.depcheckrc.yaml @@ -0,0 +1,3 @@ +ignores: + - "@opentiny/vue-theme*" + - "@opentiny/vue*" \ No newline at end of file diff --git a/examples/vue2/CHANGELOG.md b/examples/vue2/CHANGELOG.md new file mode 100644 index 000000000..187750159 --- /dev/null +++ b/examples/vue2/CHANGELOG.md @@ -0,0 +1,66 @@ +# Change Log + +All notable changes to this project will be documented in this file. +See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + +## [0.1.6-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue2-example@0.1.5-mf.0...vue2-example@0.1.6-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue2-example + + + + + +## [0.1.5-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue2-example@0.1.4-mf.0...vue2-example@0.1.5-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue2-example + + + + + +## [0.1.4-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue2-example@0.1.3-mf.0...vue2-example@0.1.4-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue2-example + + + + + +## [0.1.3-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue2-example@0.1.2-mf.0...vue2-example@0.1.3-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue2-example + + + + + +## [0.1.2-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue2-example@0.1.1-beta.0...vue2-example@0.1.2-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue2-example + + + + + +## 0.1.1-beta.0 (2023-02-08) + + +### Bug Fixes + +* 固定 npm3 版本,增加 @vue/babel jsx 插件 ([afe772c](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/afe772c1d779b9bae576e966bea9162bd6af4331)) +* 让 dev:vue2 正常运行 ([3dd1dd1](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/3dd1dd196dc0a7527860a4a04ca334ab8ebc27ac)) +* 使得针对不同版本Vue的类型扩展能正常工作 ([9fb7946](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/9fb79466ddc848385d4231bbee51c189a849868c)) +* 使用了按需导入插件,就不能用import default 导入 ([606b141](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/606b141690736753b20e12235e4e769187e044a5)) +* 缩小 tailwindcss content 的扫描返回,避免干扰 ([3012d46](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/3012d462c5adb29d3957d5f3b5c11f9adf71a55c)) +* 修复 loading 组件由于文件改名导致引用错误问题,同时删除无用文件 ([d63c084](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/d63c084595f3e9ba6845cf374bf4bee70949e90f)) +* 修正 inline-chunks 插件的逻辑,vite 插件改为从vue2/3工程加载 ([72b0926](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/72b0926998c5eefef4adbe01ecb881f888607145)) +* 修正 tailwindcss-vite-plugin 根据 windows 斜杠路径找不到入口模块而报错的问题 ([4b37f4f](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/4b37f4f43f64588b223957fe362d29d59af98ba1)) +* 修正 vue2 和 vue2.7 下扩展 ([ad71cc0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/ad71cc096bdbb02b1070917e11bc5e48bab4ca19)) + + +### Features + +* 搭建了基于 vitest 的单元测试和基于 playwright 的 E2E 测试 ([fdeddaf](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/fdeddaf6c753c737caf5434cea2c86cc4292a311)) +* 使用 unocss 代替 tailwindcss 以获得更快的开发预览 ([585c7bc](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/585c7bc26b50203fdea7241f9e9b7f94cd785bac)) +* 增加 vue2.7 的支持 ([ea71624](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/ea71624e33eef95536ad3adb66d5e646cf734cbe)) diff --git a/examples/vue2/index.html b/examples/vue2/index.html new file mode 100644 index 000000000..358fe74d3 --- /dev/null +++ b/examples/vue2/index.html @@ -0,0 +1,13 @@ + + + + + + + opentiny Vue2.6 + + +
+ + + diff --git a/examples/vue2/package.json b/examples/vue2/package.json new file mode 100644 index 000000000..8b18c10c7 --- /dev/null +++ b/examples/vue2/package.json @@ -0,0 +1,62 @@ +{ + "name": "vue2-example", + "type": "module", + "private": true, + "version": "0.1.6-mf.0", + "files": [ + "*" + ], + "scripts": { + "dev": "vite --port 6173", + "build": "vite build", + "preview": "vite preview", + "test:e2e": "playwright test", + "test:unit": "vitest" + }, + "devDependencies": { + "@opentiny-internal/playwright-config": "workspace:^1.0.1-beta.0", + "@opentiny-internal/unplugin-virtual-template": "workspace:*", + "@opentiny/vue": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-theme": "workspace:~", + "@opentiny/vue-theme-mobile": "workspace:~", + "@opentiny/vue-docs": "workspace:~", + "@playwright/test": "^1.29.2", + "@vitest/ui": "^0.27.1", + "@vue/babel-helper-vue-jsx-merge-props": "^1.4.0", + "@vue/composition-api": "1.2.2", + "@vue/runtime-dom": "^3.2.31", + "@vue/test-utils": "^1.3.3", + "jsdom": "^21.0.0", + "postcss": "^8.4.16", + "typescript": "^4.9.4", + "unplugin-vue2-script-setup": "^0.11.3", + "vite": "^4.0.4", + "vite-plugin-checker": "^0.5.2", + "vite-plugin-dynamic-import": "^1.2.4", + "vite-plugin-importus": "^1.0.4", + "vite-plugin-inspect": "^0.7.9", + "vite-plugin-md": "^0.22.5", + "vite-plugin-static-copy": "^0.12.0", + "vite-plugin-vue-inspector": "^3.3.2", + "vite-plugin-vue2": "^2.0.2", + "vite-plugin-vue2-svg": "^0.3.0", + "vitest": "^0.25.7", + "vue": "2.6.14", + "vue-i18n": "^8.9.0", + "vue-template-compiler": "2.6.14", + "vue-tsc": "^1.0.16", + "js-sha256": "^0.9.0", + "monaco-editor": "^0.34.1", + "monaco-editor-core": "^0.34.1", + "monaco-volar": "0.0.6", + "onigasm": "^2.2.5", + "unocss": "^0.48.0", + "@unocss/core": "^0.48.0", + "@unocss/preset-icons": "^0.48.0", + "@unocss/transformer-directives": "^0.48.0" + } +} diff --git a/examples/vue2/playwright.config.js b/examples/vue2/playwright.config.js new file mode 100644 index 000000000..e569b66bf --- /dev/null +++ b/examples/vue2/playwright.config.js @@ -0,0 +1,6 @@ +import Config from '@opentiny-internal/playwright-config' + +export default Config({ + testDir: '../docs/.legacy/demo', + port: 6173, +}) diff --git a/examples/vue2/postcss.config.cjs b/examples/vue2/postcss.config.cjs new file mode 100644 index 000000000..95c31dcd1 --- /dev/null +++ b/examples/vue2/postcss.config.cjs @@ -0,0 +1,5 @@ +module.exports = { + plugins: { + autoprefixer: {}, + } +} diff --git a/examples/vue2/shims-app.d.ts b/examples/vue2/shims-app.d.ts new file mode 100644 index 000000000..37e3f0bf7 --- /dev/null +++ b/examples/vue2/shims-app.d.ts @@ -0,0 +1,34 @@ +declare module '*.vue' { + import type { App, DefineComponent } from '@vue/runtime-dom' + const component: DefineComponent<{}, {}, any> & { + install(app: any): void + } + export default component +} + +declare module '*.svg' { + import type { DefineComponent } from '@vue/runtime-dom' + const component: DefineComponent<{}, {}, any> + export default component +} + +declare module '*.jpg' { + const src: string; + export default src; +} + +declare module '*.jpeg' { + const src: string; + export default src; +} + +declare module '*.png' { + const src: string; + export default src; +} + +declare module 'virtual-template?*' { + import type { DefineComponent } from '@vue/runtime-dom' + const src: (mode: string) => DefineComponent<{}, {}, any>; + export default src; +} diff --git a/examples/vue2/shims-vue.d.ts b/examples/vue2/shims-vue.d.ts new file mode 100644 index 000000000..34ccad9b6 --- /dev/null +++ b/examples/vue2/shims-vue.d.ts @@ -0,0 +1,12 @@ +import Vue from 'vue' +import VueRouter, { Route } from 'vue-router' + +declare module 'vue/types/vue' { + interface Vue { + $router: VueRouter, + $route: Route + } + interface VueConstructor { + install(app: VueConstructor): void + } +} \ No newline at end of file diff --git a/examples/vue2/src/main.ts b/examples/vue2/src/main.ts new file mode 100644 index 000000000..91da8db4a --- /dev/null +++ b/examples/vue2/src/main.ts @@ -0,0 +1,18 @@ +import Vue from 'vue' +import VueI18n from 'vue-i18n' +import { initI18n } from '@opentiny/vue-locale' +import App from '@/App.vue' + +Vue.config.productionTip = false +const mode = new URL(location.href).searchParams.get('mode') || localStorage.getItem('vue-example-mode') || 'pc' +const isPcMode = mode === 'pc' +const isMobileMode = mode === 'mobile' +Vue.prototype.tiny_mode = { value: mode } +Vue.prototype.isPcMode = isPcMode +Vue.prototype.isMobileMode = isMobileMode +Vue.use(VueI18n) + +new Vue({ + i18n: initI18n({ VueI18n, i18n: {} }), + render: (h) => h(App) +}).$mount('#app') diff --git a/examples/vue2/tsconfig.json b/examples/vue2/tsconfig.json new file mode 100644 index 000000000..9a5374ff4 --- /dev/null +++ b/examples/vue2/tsconfig.json @@ -0,0 +1,14 @@ +{ + "extends": "../../tsconfig.vue2.json", + "include": [ + "src/**/*.ts", + "src/**/*.tsx", + "src/**/*.vue", + ".ts" + ], + "exclude": [ + "node_modules", + "**/dist", + "**/*.md" + ] +} \ No newline at end of file diff --git a/examples/vue2/vite-plugins/vite-plugin-uno-preset.ts b/examples/vue2/vite-plugins/vite-plugin-uno-preset.ts new file mode 100644 index 000000000..f7cc15edc --- /dev/null +++ b/examples/vue2/vite-plugins/vite-plugin-uno-preset.ts @@ -0,0 +1,246 @@ +const _s0 = { + m: 'margin', + p: 'padding', + + w: 'width', + h: 'height', + + minw: 'min-width', + maxw: 'max-width', + minh: 'min-height', + maxh: 'max-height', + + r: '-right', + l: '-left', + b: '-bottom', + t: '-top' +} +const sizeRules = [ + // 高宽, 字体,行高 f12 lh20 w200 h200 box78 + [/^(w|h|minw|maxw|minh|maxh)(\d+)$/, ([, attr, num]) => ({ [`${_s0[attr]}`]: `${num}px` })], + // 高宽百分比 wp33 hp50 + [/^(w|h)p(\d+\.?\d*)$/, ([, attr, num]) => ({ [`${_s0[attr]}`]: `${num}%` })], + + // 内外边距 *可负* m10 mr10 mt-10 mx20 my-10 p10 pr10 + [/^([mp])([rlbt]?)(-?\d+)$/, ([, attr, pos, num]) => ({ [`${_s0[attr]}${pos ? _s0[pos] : ''}`]: `${num}px` })], + // 内外边距auto m-auto mt-auto mx-auto + [/^([mp])([rlbt]?)-auto$/, ([, attr, pos]) => ({ [`${_s0[attr]}${pos ? _s0[pos] : ''}`]: 'auto' })], + + // abs 定位时 *可负* left0 right50 bottom-20 leftauto + [/^(left|top|right|bottom)(-?\d+)$/, ([, pos, num]) => ({ [`${pos}`]: `${num}px` })], + [/^(left|top|right|bottom)-(auto|unset)$/, ([, pos, val]) => ({ [`${pos}`]: val })] +] +const _s1 = { + none: 'none', + block: 'block', + inline: 'inline', + flex: 'flex', + grid: 'grid', + ib: 'inline-block', + if: 'inline-flex', + ig: 'inline-grid', + + abs: 'absolute', + rel: 'relative', + fixed: 'fixed', + sticky: 'sticky', + static: 'static', + + r: 'row', + c: 'column', + center: 'center', + start: 'flex-start', + end: 'flex-end', + around: 'space-around', + between: 'space-between', + evenly: 'space-evenly', + stretch: 'stretch' +} + +const layoutRules = [ + // display d-none, d-block d-flex d-inline d-grid d-ib d-if d-ig + [/^d-(none|block|flex|inline|grid|ib|if|ig)$/, ([, pos]) => ({ display: `${_s1[pos]}` })], + // position abs rel fixed sticky static + [/^(rel|abs|fixed|sticky|static)$/, ([, pos]) => ({ position: `${_s1[pos]}` })], + // 绝对定位 abs-0 fixed-0 + ['abs-0', { position: 'absolute', left: 0, right: 0, top: 0, bottom: 0 }], + ['fixed-0', { position: 'fixed', left: 0, right: 0, top: 0, bottom: 0 }], + // 这个会用的很少,通常是css reset中会重置。 + ['border-box', { 'box-sizing': 'border-box' }], + ['content-box', { 'box-sizing': 'content-box' }], + // flex布局 父元素: f-r f-c f-center f-pos-between f-box-stretch f-wrap + [/^f-([rc])$/, ([, dir]) => ({ display: 'flex', 'flex-direction': `${_s1[dir]}` })], + [/^f-pos-(start|center|end|around|between|evenly|stretch)$/, ([, dir]) => ({ 'justify-content': `${_s1[dir]}` })], + [/^f-box-(start|center|end|stretch)$/, ([, dir]) => ({ 'align-items': `${_s1[dir]}` })], + [/^f-(wrap|nowrap)$/, ([, dir]) => ({ 'flex-wrap': dir })], + + // 子元素: fi-1 fi-4 + [/^fi-(\d+)$/, ([, num]) => ({ flex: `${num}` })] +] + +const _s2 = { + f: 'font-size', + lh: 'line-height', + + bold: 'bolder', + thin: 'lighter', + normal: 'normal', + + under: 'underline', + over: 'overline', + through: 'line-through', + del: 'line-through', + none: 'none' +} + +const fontRules = [ + // 字体与行高 f12 lh20 + [/^(f|lh)(\d+)$/, ([, attr, num]) => ({ [`${_s2[attr]}`]: `${num}px` })], + // 字体粗细 fw-bold fw-700 + [/^fw-(bold|thin|normal)$/, ([, dir]) => ({ 'font-weight': `${_s2[dir]}` })], + [/^fw-(\d+)$/, ([, val]) => ({ 'font-weight': val })], + // 文字对齐 text-right ta-center + [/^(text|ta)-(right|left|center)$/, ([, abbr, dir]) => ({ 'text-align': dir })], + // 文字上下划线 solid|double|dotted|dashed|wavy + // td-under td-over-wavy td-over td-none-dashed + [ + /^td-(under|over|through|del|none)(-solid|-double|-dotted|-dashed|-wavy)?$/, + ([, dir, style = '']) => ({ 'text-decoration': `${_s2[dir]} ${style.slice(1)}` }) + ], + // 文字阴影 ts-sm ts-lg + ['ts-sm', { 'text-shadow': 'var(--text-shadow-sm)' }], + ['ts-lg', { 'text-shadow': 'var(--text-shadow-lg)' }] +] +const _s3 = { + a: '', // all + r: '-right', + l: '-left', + b: '-bottom', + t: '-top', + ws: 'var(--border-width) var(--border-style) ' // width & style +} + +const borderRules = [ + // 边框 b-a b-b b-r b-t b-l b-a-primary b-a#ff0000 + [/^b-([arlbt])$/, ([, pos]) => ({ [`border${_s3[pos]}`]: _s3.ws + 'var(--border-color)' })], + [/^b-([arlbt])-([\w|-]+)$/, ([, pos, color]) => ({ [`border${_s3[pos]}`]: _s3.ws + `var(--${color})` })], + [/^b-([arlbt])#(\w+)$/, ([, pos, color]) => ({ [`border${_s3[pos]}`]: _s3.ws + `#${color}` })], + // 边框样式 bs-dotted bs-double + [/^bs-(none|dotted|dashed|solid|double|groove|ridge|inset|outset)$/, ([, style]) => ({ 'border-style': style })], + [/^br-(\d+)$/, ([, val]) => ({ 'border-radius': `${val}px` })], + // 无边框 nb-a nb-b nb-r nb-t nb-l + [/^nb-([arlbt])$/, ([, pos]) => ({ [`border${_s3[pos]}`]: 'none' })], + + ['br-sm', { 'border-radius': 'var(--box-radius-sm)' }], + ['br-lg', { 'border-radius': 'var(--box-radius-lg)' }], + ['br-circle', { 'border-radius': '50%' }], + ['bs-sm', { 'box-shadow': 'var(--box-shadow-sm)' }], + ['bs-lg', { 'box-shadow': 'var(--box-shadow-lg)' }] +] + +const _s4 = { + def: 'default', + hand: 'pointer', + disable: 'not-allowed' +} +const clamp = (v, min, max) => Math.min(Math.max(v, min), max) +const utilRules = [ + // 省略号 ellipsis ellipsis2 ellipsis3 + ['ellipsis', { overflow: 'hidden', ' text-overflow': 'ellipsis', 'white-space': 'nowrap' }], + [ + /^ellipsis(\d+)$/, + ([, num]) => ({ + display: '-webkit-box', + overflow: 'hidden', + '-webkit-line-clamp': num, + ' -webkit-box-orient': 'vertical', + 'overflow-wrap': 'anywhere' + }) + ], + // 光标样式 cur-hand + [/^cur-(def|hand|disable)$/, ([, shape]) => ({ cursor: `${_s4[shape]}` })], + // overflow of-auto ofx-hidden ofy-scroll + [/^of(\w?)-(auto|scroll|hidden|visible)$/, ([, axis, mode]) => ({ [`overflow${axis ? '-' + axis : ''}`]: mode })], + // 图片填充 img-cover + [/^img-(cover|contain|fill)$/, ([, mode]) => ({ 'object-fit': mode })], + // z-index z100 + [/^z(-?\d+)$/, ([, num]) => ({ 'z-index': num })], + // 选择相关 noselect allselect nomouse 参见选择变体: select:c-primary select:bg-dark + ['noselect', { 'user-select': 'none' }], + ['allselect', { 'user-select': 'all' }], + ['noevent', { 'pointer-events': 'none' }], + // 可见性 hide show + ['hide', { visibility: 'hidden' }], + ['show', { visibility: 'visible' }], + // 透明度 op100 + [/^op(\d+)$/, ([, val]) => ({ opacity: clamp(val / 100, 0, 1) })], + ['op-hover', { opacity: 'var(--hover-op)' }], + ['op-disabled', { opacity: 'var(--disabled-op)' }], + + // 断词 breakword breakall + [/^break(word|all)$/, ([, type]) => ({ 'word-break': `break-${type}` })] +] + +const _s5 = { c: 'color', bg: 'background-color' } +const colorRules = [ + // 颜色 #不建议使用 c-black bg-primary c#123456 c-theme-color + [/^(c|bg)-rand(\d+)$/, ([, attr, seed]) => ({ [`${_s5[attr]}`]: `#${Math.floor(Math.random() * 255 * 255 * 255).toString(16)}` })], + [(/^(c|bg)-([\w|-]+)$/, ([, attr, color]) => ({ [`${_s5[attr]}`]: `var(--${color})` }))], + [/^(c|bg)#(\w+)$/, ([, attr, color]) => ({ [`${_s5[attr]}`]: `#${color}` })] +] +export const rules = [...sizeRules, ...layoutRules, ...fontRules, ...borderRules, ...utilRules, ...colorRules] + +export const shortcuts = [ + [/^(m|p)x(-?\d+)$/, ([, t, c]) => `${t}l${c} ${t}r${c}`], + [/^(m|p)y(-?\d+)$/, ([, t, c]) => `${t}t${c} ${t}b${c}`], + + [/^(m|p)x-auto$/, ([, t, c]) => `${t}l-auto ${t}r-auto`], + [/^(m|p)y-auto$/, ([, t, c]) => `${t}t-auto ${t}b-auto`], + [/^box(\d+)$/, ([, w]) => `w${w} h${w}`], + [/^link-(\w+)$/, ([, c]) => `c-${c} h:c-${c}less cur-hand `], + [/^link#(\w+)$/, ([, c]) => `c#${c} cur-hand `], + ['f-center', 'd-flex f-pos-center f-box-center'] +] + +export const variants = [ + (matcher) => { + if (!matcher.startsWith('!')) return matcher + return { + matcher: matcher.slice(1), + body: (body) => { + body.forEach((e) => e[1] && (e[1] += ' !important')) + return body + } + } + }, + (matcher) => { + if (!matcher.startsWith('h:')) return matcher + return { + matcher: matcher.slice(2), + selector: (s) => `${s}:hover`, + body: (body) => { + body.push(['transition', 'all var(--trans-time)']) + return body + } + } + }, + (matcher) => { + if (!matcher.startsWith('child:')) return matcher + return { + matcher: matcher.slice(6), + selector: (s) => `${s}>*`, + body: (s) => s + } + }, + (matcher) => { + // "childxxx".match(/child<(\w+)>/ ) =====> ['child', 'code'] + const matchResult = matcher.match(/^child<(\w+)>/) + if (!matchResult) return matcher + const [matchStr, selector] = matchResult + return { + matcher: matcher.slice(matchStr.length), + selector: (s) => `${s} ${selector}`, + body: (s) => s + } + } +] diff --git a/examples/vue2/vite.config.ts b/examples/vue2/vite.config.ts new file mode 100644 index 000000000..dd005dd1d --- /dev/null +++ b/examples/vue2/vite.config.ts @@ -0,0 +1,75 @@ +import path from 'node:path' +import scriptSetupPlugin from 'unplugin-vue2-script-setup/vite' +import { defineConfig, loadEnv } from 'vite' +import dynamicImportPlugin from 'vite-plugin-dynamic-import' +import importPlugin from 'vite-plugin-importus' +import inspectPlugin from 'vite-plugin-inspect' +import { viteStaticCopy as staticCopyPlugin } from 'vite-plugin-static-copy' +import { createVuePlugin as vue2Plugin } from 'vite-plugin-vue2' +import { createSvgPlugin as vue2SvgPlugin } from 'vite-plugin-vue2-svg' +import virtualTemplatePlugin from '@opentiny-internal/unplugin-virtual-template/vite' +import { getAlias, pathFromWorkspaceRoot, getOptimizeDeps } from '../../internals/cli/src/config/vite' +// 增加Unocss +import Unocss from 'unocss/vite' +import { rules, shortcuts, variants } from './vite-plugins/vite-plugin-uno-preset.js' + +export default defineConfig((config) => { + const env = loadEnv(config.mode, process.cwd(), '') + + return { + server: { + host: 'localhost', + open: false, + }, + plugins: [ + virtualTemplatePlugin({ include: ['**/packages/vue/**/src/index.ts'], env }), + vue2Plugin({ + jsx: true, + include: [/\.vue$/, /\.md$/], + }), + scriptSetupPlugin(), + vue2SvgPlugin(), + importPlugin([ + { + libraryName: '@opentiny/vue', + customName: name => `@opentiny/vue-${name}`, + style: false, + }, + ...['icon', 'icon-saas'].map(lib => ({ + libraryName: `@opentiny/vue-${lib}`, + customName: (name: string) => { + return name === 'default' ? `@opentiny/vue-${lib}$` : `@opentiny/vue-${lib}/${name.replace(/^icon-/, '')}` + }, + style: false, + })), + ]), + dynamicImportPlugin(), + Unocss({ + include: [/\.js$/, /\.ts$/, /\.vue$/, /\.html$/, /\.jsx$/, /\.tsx$/], // 增加js ,ts扫描 + presets: [], + rules, + shortcuts, + variants, + safelist: [...Array.from({ length: 24 }, (_, i) => `c-rand${i + 1}`), ...Array.from({ length: 24 }, (_, i) => `bg-rand${i + 1}`)] + }), + staticCopyPlugin({ + targets: [{ src: '../docs/public/*', dest: '' }], + }), + inspectPlugin() + ], + resolve: { + extensions: ['.js', '.ts', '.tsx', '.vue'], + alias: { + '@vue/composition-api': path.resolve('node_modules/@vue/composition-api'), + 'vue': path.resolve('node_modules/vue/dist/vue.esm.js'), + '@': pathFromWorkspaceRoot('examples/docs/newsrc'), + '@vue/babel-helper-vue-jsx-merge-props': path.resolve('node_modules/@vue/babel-helper-vue-jsx-merge-props/dist/helper.js'), + ...getAlias(2, env.VITE_TINY_THEME), + }, + }, + define: { + 'process.env': env, + }, + optimizeDeps: getOptimizeDeps(2), + } +}) diff --git a/examples/vue2/vitest.config.ts b/examples/vue2/vitest.config.ts new file mode 100644 index 000000000..c0f00f853 --- /dev/null +++ b/examples/vue2/vitest.config.ts @@ -0,0 +1,68 @@ +import path from 'node:path' +import { defineConfig } from 'vitest/config' +import { loadEnv } from 'vite' +import virtualTemplatePlugin from '@opentiny-internal/unplugin-virtual-template/vite' +import { createVuePlugin as vue2Plugin } from 'vite-plugin-vue2' +import scriptSetupPlugin from 'unplugin-vue2-script-setup/vite' +import { createSvgPlugin as vue2SvgPlugin } from 'vite-plugin-vue2-svg' +import importPlugin from 'vite-plugin-importus' +import { getAlias } from '../../internal/config/vite' + +const pathResolve = (...paths: string[]) => path.resolve(__dirname, ...paths).replace(/\\/g, '/') + +export default defineConfig((config) => { + const env = loadEnv(config.mode, process.cwd(), '') + + return { + plugins: [ + virtualTemplatePlugin({ include: ['**/packages/vue/**/src/index.ts'], env }), + vue2Plugin({ + jsx: true, + include: [/\.vue$/, /\.md$/], + }), + scriptSetupPlugin(), + vue2SvgPlugin(), + importPlugin([ + { + libraryName: '@opentiny/vue', + customName: name => `@opentiny/vue-${name}`, + style: false, + }, + ...['icon', 'icon-saas'].map(lib => ({ + libraryName: `@opentiny/vue-${lib}`, + customName: (name: string) => { + return name === 'default' ? `@opentiny/vue-${lib}$` : `@opentiny/vue-${lib}/${name.replace(/^icon-/, '')}` + }, + style: false, + })), + ]) + ], + optimizeDeps: { + disabled: true, + }, + define: { + 'process.env': env, + }, + test: { + open: false, + clearMocks: true, + environment: 'jsdom', + setupFiles: ['./vitest.setup.ts'], + transformMode: { + web: [/\.[jt]sx$/], + }, + include: [ + '../../packages/vue/src/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}' + ], + exclude: [ + '../../packages/vue/src/**/{node_modules,dist}/**', + ], + alias: { + '@vue/composition-api': path.resolve('node_modules/@vue/composition-api'), + 'vue': path.resolve('node_modules/vue/dist/vue.esm.js'), + '@vue/test-utils': path.resolve('node_modules/@vue/test-utils'), + ...getAlias(2), + } + }, + } +}) diff --git a/example/src/demo/pc/grid/span/custom-span.vue b/examples/vue2/vitest.setup.ts similarity index 100% rename from example/src/demo/pc/grid/span/custom-span.vue rename to examples/vue2/vitest.setup.ts diff --git a/examples/vue3/.depcheckrc.yaml b/examples/vue3/.depcheckrc.yaml new file mode 100644 index 000000000..cd2946113 --- /dev/null +++ b/examples/vue3/.depcheckrc.yaml @@ -0,0 +1,3 @@ +ignores: + - "@opentiny/vue-theme*" + - "@opentiny/vue*" \ No newline at end of file diff --git a/examples/vue3/CHANGELOG.md b/examples/vue3/CHANGELOG.md new file mode 100644 index 000000000..ac52cce56 --- /dev/null +++ b/examples/vue3/CHANGELOG.md @@ -0,0 +1,63 @@ +# Change Log + +All notable changes to this project will be documented in this file. +See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + +## [0.1.6-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue3-example@0.1.5-mf.0...vue3-example@0.1.6-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue3-example + + + + + +## [0.1.5-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue3-example@0.1.4-mf.0...vue3-example@0.1.5-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue3-example + + + + + +## [0.1.4-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue3-example@0.1.3-mf.0...vue3-example@0.1.4-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue3-example + + + + + +## [0.1.3-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue3-example@0.1.2-mf.0...vue3-example@0.1.3-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue3-example + + + + + +## [0.1.2-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue3-example@0.1.1-beta.0...vue3-example@0.1.2-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue3-example + + + + + +## 0.1.1-beta.0 (2023-02-08) + + +### Bug Fixes + +* 让 dev:vue2 正常运行 ([3dd1dd1](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/3dd1dd196dc0a7527860a4a04ca334ab8ebc27ac)) +* 使得针对不同版本Vue的类型扩展能正常工作 ([9fb7946](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/9fb79466ddc848385d4231bbee51c189a849868c)) +* 使用了按需导入插件,就不能用import default 导入 ([606b141](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/606b141690736753b20e12235e4e769187e044a5)) +* 缩小 tailwindcss content 的扫描返回,避免干扰 ([3012d46](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/3012d462c5adb29d3957d5f3b5c11f9adf71a55c)) +* 修正 md 路径问题以及全量引入 vue-icon ([3398881](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/3398881d1c986d398c88c2f2163598d4b48d9131)) +* 修正 tailwindcss-vite-plugin 根据 windows 斜杠路径找不到入口模块而报错的问题 ([4b37f4f](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/4b37f4f43f64588b223957fe362d29d59af98ba1)) + + +### Features + +* 搭建了基于 vitest 的单元测试和基于 playwright 的 E2E 测试 ([fdeddaf](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/fdeddaf6c753c737caf5434cea2c86cc4292a311)) +* 使用 unocss 代替 tailwindcss 以获得更快的开发预览 ([585c7bc](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/585c7bc26b50203fdea7241f9e9b7f94cd785bac)) +* 增加 vue2.7 的支持 ([ea71624](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/ea71624e33eef95536ad3adb66d5e646cf734cbe)) diff --git a/examples/vue3/index.html b/examples/vue3/index.html new file mode 100644 index 000000000..6c01dcf79 --- /dev/null +++ b/examples/vue3/index.html @@ -0,0 +1,13 @@ + + + + + + + opentiny Vue3 + + +
+ + + diff --git a/examples/vue3/package.json b/examples/vue3/package.json new file mode 100644 index 000000000..a29756738 --- /dev/null +++ b/examples/vue3/package.json @@ -0,0 +1,58 @@ +{ + "name": "vue3-example", + "type": "module", + "private": true, + "version": "0.1.6-mf.0", + "files": [ + "*" + ], + "scripts": { + "dev": "vite --port 6175", + "build": "vite build", + "preview": "vite preview", + "test:e2e": "playwright test", + "test:unit": "vitest" + }, + "devDependencies": { + "@opentiny-internal/playwright-config": "workspace:^1.0.1-beta.0", + "@opentiny-internal/unplugin-virtual-template": "workspace:*", + "@opentiny/vue": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-theme": "workspace:~", + "@opentiny/vue-theme-mobile": "workspace:~", + "@opentiny/vue-docs": "workspace:~", + "@playwright/test": "^1.29.2", + "@vitejs/plugin-vue": "^4.0.0", + "@vitejs/plugin-vue-jsx": "^3.0.0", + "@vitest/ui": "^0.27.1", + "@vue/runtime-core": "3.2.31", + "@vue/test-utils": "^2.2.7", + "jsdom": "^21.0.0", + "postcss": "^8.4.16", + "typescript": "^4.9.4", + "vite": "^4.0.2", + "vite-plugin-checker": "^0.5.2", + "vite-plugin-dynamic-import": "^1.2.4", + "vite-plugin-importus": "^1.0.4", + "vite-plugin-inspect": "^0.7.10", + "vite-plugin-md": "^0.22.5", + "vite-plugin-static-copy": "^0.12.0", + "vite-plugin-vue-inspector": "^3.3.2", + "vite-svg-loader": "^3.6.0", + "vitest": "^0.25.7", + "vue": "^3.2.25", + "vue-i18n": "^9.1.7", + "js-sha256": "^0.9.0", + "monaco-editor": "^0.34.1", + "monaco-editor-core": "^0.34.1", + "monaco-volar": "0.0.6", + "onigasm": "^2.2.5", + "unocss": "^0.48.0", + "@unocss/core": "^0.48.0", + "@unocss/preset-icons": "^0.48.0", + "@unocss/transformer-directives": "^0.48.0" + } +} diff --git a/examples/vue3/playwright.config.js b/examples/vue3/playwright.config.js new file mode 100644 index 000000000..2d01ee418 --- /dev/null +++ b/examples/vue3/playwright.config.js @@ -0,0 +1,6 @@ +import Config from '@opentiny-internal/playwright-config' + +export default Config({ + testDir: '../docs/.legacy/demo', + port: 6175, +}) diff --git a/examples/vue3/postcss.config.cjs b/examples/vue3/postcss.config.cjs new file mode 100644 index 000000000..95c31dcd1 --- /dev/null +++ b/examples/vue3/postcss.config.cjs @@ -0,0 +1,5 @@ +module.exports = { + plugins: { + autoprefixer: {}, + } +} diff --git a/examples/vue3/shims-app.d.ts b/examples/vue3/shims-app.d.ts new file mode 100644 index 000000000..6c19c08f8 --- /dev/null +++ b/examples/vue3/shims-app.d.ts @@ -0,0 +1,34 @@ +declare module '*.vue' { + import type { App, DefineComponent } from '@vue/runtime-core' + const component: DefineComponent<{}, {}, any> & { + install(app: App): void + } + export default component +} + +declare module '*.svg' { + import type { DefineComponent } from '@vue/runtime-core' + const component: DefineComponent<{}, {}, any> + export default component +} + +declare module '*.jpg' { + const src: string; + export default src; +} + +declare module '*.jpeg' { + const src: string; + export default src; +} + +declare module '*.png' { + const src: string; + export default src; +} + +declare module 'virtual-template?*' { + import type { DefineComponent } from '@vue/runtime-core' + const src: (mode: string) => DefineComponent<{}, {}, any>; + export default src; +} diff --git a/examples/vue3/src/main.ts b/examples/vue3/src/main.ts new file mode 100644 index 000000000..76bc49f1b --- /dev/null +++ b/examples/vue3/src/main.ts @@ -0,0 +1,15 @@ +import * as Vue3 from 'vue' +import { createI18n } from 'vue-i18n' +import { initI18n } from '@opentiny/vue-locale' +import App from '@/App.vue' + +const app = Vue3.createApp(App) + +const mode = new URL(location.href).searchParams.get('mode') || localStorage.getItem('vue-example-mode') || 'pc' +const isPcMode = mode === 'pc' +const isMobileMode = mode === 'mobile' +app.config.globalProperties.tiny_mode = { value: mode } +app.config.globalProperties.isPcMode = isPcMode +app.config.globalProperties.isMobileMode = isMobileMode +app.use(initI18n({ createI18n, i18n: {} })) +app.mount('#app') diff --git a/examples/vue3/tsconfig.json b/examples/vue3/tsconfig.json new file mode 100644 index 000000000..5e282e930 --- /dev/null +++ b/examples/vue3/tsconfig.json @@ -0,0 +1,14 @@ +{ + "extends": "../../tsconfig.vue3.json", + "include": [ + "src/**/*.ts", + "src/**/*.tsx", + "src/**/*.vue", + ".ts" + ], + "exclude": [ + "node_modules", + "**/dist", + "**/*.md" + ] +} \ No newline at end of file diff --git a/examples/vue3/vite-plugins/vite-plugin-uno-preset.ts b/examples/vue3/vite-plugins/vite-plugin-uno-preset.ts new file mode 100644 index 000000000..f7cc15edc --- /dev/null +++ b/examples/vue3/vite-plugins/vite-plugin-uno-preset.ts @@ -0,0 +1,246 @@ +const _s0 = { + m: 'margin', + p: 'padding', + + w: 'width', + h: 'height', + + minw: 'min-width', + maxw: 'max-width', + minh: 'min-height', + maxh: 'max-height', + + r: '-right', + l: '-left', + b: '-bottom', + t: '-top' +} +const sizeRules = [ + // 高宽, 字体,行高 f12 lh20 w200 h200 box78 + [/^(w|h|minw|maxw|minh|maxh)(\d+)$/, ([, attr, num]) => ({ [`${_s0[attr]}`]: `${num}px` })], + // 高宽百分比 wp33 hp50 + [/^(w|h)p(\d+\.?\d*)$/, ([, attr, num]) => ({ [`${_s0[attr]}`]: `${num}%` })], + + // 内外边距 *可负* m10 mr10 mt-10 mx20 my-10 p10 pr10 + [/^([mp])([rlbt]?)(-?\d+)$/, ([, attr, pos, num]) => ({ [`${_s0[attr]}${pos ? _s0[pos] : ''}`]: `${num}px` })], + // 内外边距auto m-auto mt-auto mx-auto + [/^([mp])([rlbt]?)-auto$/, ([, attr, pos]) => ({ [`${_s0[attr]}${pos ? _s0[pos] : ''}`]: 'auto' })], + + // abs 定位时 *可负* left0 right50 bottom-20 leftauto + [/^(left|top|right|bottom)(-?\d+)$/, ([, pos, num]) => ({ [`${pos}`]: `${num}px` })], + [/^(left|top|right|bottom)-(auto|unset)$/, ([, pos, val]) => ({ [`${pos}`]: val })] +] +const _s1 = { + none: 'none', + block: 'block', + inline: 'inline', + flex: 'flex', + grid: 'grid', + ib: 'inline-block', + if: 'inline-flex', + ig: 'inline-grid', + + abs: 'absolute', + rel: 'relative', + fixed: 'fixed', + sticky: 'sticky', + static: 'static', + + r: 'row', + c: 'column', + center: 'center', + start: 'flex-start', + end: 'flex-end', + around: 'space-around', + between: 'space-between', + evenly: 'space-evenly', + stretch: 'stretch' +} + +const layoutRules = [ + // display d-none, d-block d-flex d-inline d-grid d-ib d-if d-ig + [/^d-(none|block|flex|inline|grid|ib|if|ig)$/, ([, pos]) => ({ display: `${_s1[pos]}` })], + // position abs rel fixed sticky static + [/^(rel|abs|fixed|sticky|static)$/, ([, pos]) => ({ position: `${_s1[pos]}` })], + // 绝对定位 abs-0 fixed-0 + ['abs-0', { position: 'absolute', left: 0, right: 0, top: 0, bottom: 0 }], + ['fixed-0', { position: 'fixed', left: 0, right: 0, top: 0, bottom: 0 }], + // 这个会用的很少,通常是css reset中会重置。 + ['border-box', { 'box-sizing': 'border-box' }], + ['content-box', { 'box-sizing': 'content-box' }], + // flex布局 父元素: f-r f-c f-center f-pos-between f-box-stretch f-wrap + [/^f-([rc])$/, ([, dir]) => ({ display: 'flex', 'flex-direction': `${_s1[dir]}` })], + [/^f-pos-(start|center|end|around|between|evenly|stretch)$/, ([, dir]) => ({ 'justify-content': `${_s1[dir]}` })], + [/^f-box-(start|center|end|stretch)$/, ([, dir]) => ({ 'align-items': `${_s1[dir]}` })], + [/^f-(wrap|nowrap)$/, ([, dir]) => ({ 'flex-wrap': dir })], + + // 子元素: fi-1 fi-4 + [/^fi-(\d+)$/, ([, num]) => ({ flex: `${num}` })] +] + +const _s2 = { + f: 'font-size', + lh: 'line-height', + + bold: 'bolder', + thin: 'lighter', + normal: 'normal', + + under: 'underline', + over: 'overline', + through: 'line-through', + del: 'line-through', + none: 'none' +} + +const fontRules = [ + // 字体与行高 f12 lh20 + [/^(f|lh)(\d+)$/, ([, attr, num]) => ({ [`${_s2[attr]}`]: `${num}px` })], + // 字体粗细 fw-bold fw-700 + [/^fw-(bold|thin|normal)$/, ([, dir]) => ({ 'font-weight': `${_s2[dir]}` })], + [/^fw-(\d+)$/, ([, val]) => ({ 'font-weight': val })], + // 文字对齐 text-right ta-center + [/^(text|ta)-(right|left|center)$/, ([, abbr, dir]) => ({ 'text-align': dir })], + // 文字上下划线 solid|double|dotted|dashed|wavy + // td-under td-over-wavy td-over td-none-dashed + [ + /^td-(under|over|through|del|none)(-solid|-double|-dotted|-dashed|-wavy)?$/, + ([, dir, style = '']) => ({ 'text-decoration': `${_s2[dir]} ${style.slice(1)}` }) + ], + // 文字阴影 ts-sm ts-lg + ['ts-sm', { 'text-shadow': 'var(--text-shadow-sm)' }], + ['ts-lg', { 'text-shadow': 'var(--text-shadow-lg)' }] +] +const _s3 = { + a: '', // all + r: '-right', + l: '-left', + b: '-bottom', + t: '-top', + ws: 'var(--border-width) var(--border-style) ' // width & style +} + +const borderRules = [ + // 边框 b-a b-b b-r b-t b-l b-a-primary b-a#ff0000 + [/^b-([arlbt])$/, ([, pos]) => ({ [`border${_s3[pos]}`]: _s3.ws + 'var(--border-color)' })], + [/^b-([arlbt])-([\w|-]+)$/, ([, pos, color]) => ({ [`border${_s3[pos]}`]: _s3.ws + `var(--${color})` })], + [/^b-([arlbt])#(\w+)$/, ([, pos, color]) => ({ [`border${_s3[pos]}`]: _s3.ws + `#${color}` })], + // 边框样式 bs-dotted bs-double + [/^bs-(none|dotted|dashed|solid|double|groove|ridge|inset|outset)$/, ([, style]) => ({ 'border-style': style })], + [/^br-(\d+)$/, ([, val]) => ({ 'border-radius': `${val}px` })], + // 无边框 nb-a nb-b nb-r nb-t nb-l + [/^nb-([arlbt])$/, ([, pos]) => ({ [`border${_s3[pos]}`]: 'none' })], + + ['br-sm', { 'border-radius': 'var(--box-radius-sm)' }], + ['br-lg', { 'border-radius': 'var(--box-radius-lg)' }], + ['br-circle', { 'border-radius': '50%' }], + ['bs-sm', { 'box-shadow': 'var(--box-shadow-sm)' }], + ['bs-lg', { 'box-shadow': 'var(--box-shadow-lg)' }] +] + +const _s4 = { + def: 'default', + hand: 'pointer', + disable: 'not-allowed' +} +const clamp = (v, min, max) => Math.min(Math.max(v, min), max) +const utilRules = [ + // 省略号 ellipsis ellipsis2 ellipsis3 + ['ellipsis', { overflow: 'hidden', ' text-overflow': 'ellipsis', 'white-space': 'nowrap' }], + [ + /^ellipsis(\d+)$/, + ([, num]) => ({ + display: '-webkit-box', + overflow: 'hidden', + '-webkit-line-clamp': num, + ' -webkit-box-orient': 'vertical', + 'overflow-wrap': 'anywhere' + }) + ], + // 光标样式 cur-hand + [/^cur-(def|hand|disable)$/, ([, shape]) => ({ cursor: `${_s4[shape]}` })], + // overflow of-auto ofx-hidden ofy-scroll + [/^of(\w?)-(auto|scroll|hidden|visible)$/, ([, axis, mode]) => ({ [`overflow${axis ? '-' + axis : ''}`]: mode })], + // 图片填充 img-cover + [/^img-(cover|contain|fill)$/, ([, mode]) => ({ 'object-fit': mode })], + // z-index z100 + [/^z(-?\d+)$/, ([, num]) => ({ 'z-index': num })], + // 选择相关 noselect allselect nomouse 参见选择变体: select:c-primary select:bg-dark + ['noselect', { 'user-select': 'none' }], + ['allselect', { 'user-select': 'all' }], + ['noevent', { 'pointer-events': 'none' }], + // 可见性 hide show + ['hide', { visibility: 'hidden' }], + ['show', { visibility: 'visible' }], + // 透明度 op100 + [/^op(\d+)$/, ([, val]) => ({ opacity: clamp(val / 100, 0, 1) })], + ['op-hover', { opacity: 'var(--hover-op)' }], + ['op-disabled', { opacity: 'var(--disabled-op)' }], + + // 断词 breakword breakall + [/^break(word|all)$/, ([, type]) => ({ 'word-break': `break-${type}` })] +] + +const _s5 = { c: 'color', bg: 'background-color' } +const colorRules = [ + // 颜色 #不建议使用 c-black bg-primary c#123456 c-theme-color + [/^(c|bg)-rand(\d+)$/, ([, attr, seed]) => ({ [`${_s5[attr]}`]: `#${Math.floor(Math.random() * 255 * 255 * 255).toString(16)}` })], + [(/^(c|bg)-([\w|-]+)$/, ([, attr, color]) => ({ [`${_s5[attr]}`]: `var(--${color})` }))], + [/^(c|bg)#(\w+)$/, ([, attr, color]) => ({ [`${_s5[attr]}`]: `#${color}` })] +] +export const rules = [...sizeRules, ...layoutRules, ...fontRules, ...borderRules, ...utilRules, ...colorRules] + +export const shortcuts = [ + [/^(m|p)x(-?\d+)$/, ([, t, c]) => `${t}l${c} ${t}r${c}`], + [/^(m|p)y(-?\d+)$/, ([, t, c]) => `${t}t${c} ${t}b${c}`], + + [/^(m|p)x-auto$/, ([, t, c]) => `${t}l-auto ${t}r-auto`], + [/^(m|p)y-auto$/, ([, t, c]) => `${t}t-auto ${t}b-auto`], + [/^box(\d+)$/, ([, w]) => `w${w} h${w}`], + [/^link-(\w+)$/, ([, c]) => `c-${c} h:c-${c}less cur-hand `], + [/^link#(\w+)$/, ([, c]) => `c#${c} cur-hand `], + ['f-center', 'd-flex f-pos-center f-box-center'] +] + +export const variants = [ + (matcher) => { + if (!matcher.startsWith('!')) return matcher + return { + matcher: matcher.slice(1), + body: (body) => { + body.forEach((e) => e[1] && (e[1] += ' !important')) + return body + } + } + }, + (matcher) => { + if (!matcher.startsWith('h:')) return matcher + return { + matcher: matcher.slice(2), + selector: (s) => `${s}:hover`, + body: (body) => { + body.push(['transition', 'all var(--trans-time)']) + return body + } + } + }, + (matcher) => { + if (!matcher.startsWith('child:')) return matcher + return { + matcher: matcher.slice(6), + selector: (s) => `${s}>*`, + body: (s) => s + } + }, + (matcher) => { + // "childxxx".match(/child<(\w+)>/ ) =====> ['child', 'code'] + const matchResult = matcher.match(/^child<(\w+)>/) + if (!matchResult) return matcher + const [matchStr, selector] = matchResult + return { + matcher: matcher.slice(matchStr.length), + selector: (s) => `${s} ${selector}`, + body: (s) => s + } + } +] diff --git a/examples/vue3/vite.config.ts b/examples/vue3/vite.config.ts new file mode 100644 index 000000000..40bc7437d --- /dev/null +++ b/examples/vue3/vite.config.ts @@ -0,0 +1,78 @@ +import path from 'node:path' +import { defineConfig, loadEnv } from 'vite' +import { checker as checkerPlugin } from 'vite-plugin-checker' +import dynamicImportPlugin from 'vite-plugin-dynamic-import' +import importPlugin from 'vite-plugin-importus' +import inspectPlugin from 'vite-plugin-inspect' +import { viteStaticCopy as staticCopyPlugin } from 'vite-plugin-static-copy' + +import vue3Plugin from '@vitejs/plugin-vue' +import vue3JsxPlugin from '@vitejs/plugin-vue-jsx' + +import { getAlias, pathFromWorkspaceRoot, getOptimizeDeps } from '../../internals/cli/src/config/vite' +import vue3SvgPlugin from 'vite-svg-loader' +import virtualTemplatePlugin from '@opentiny-internal/unplugin-virtual-template/vite' + +// 增加Unocss +import Unocss from 'unocss/vite' +import { rules, shortcuts, variants } from './vite-plugins/vite-plugin-uno-preset.js' + +export default defineConfig((config) => { + const env = loadEnv(config.mode, process.cwd(), '') + + return { + server: { + host: 'localhost', + open: false, + }, + plugins: [ + virtualTemplatePlugin({ include: ['**/packages/vue/**/src/index.ts'], env }), + vue3Plugin({ + include: [/\.vue$/, /\.md$/], + }), + vue3JsxPlugin(), + vue3SvgPlugin(), + importPlugin([ + { + libraryName: '@opentiny/vue', + customName: name => `@opentiny/vue-${name}`, + style: false, + }, + ...['icon', 'icon-saas'].map(lib => ({ + libraryName: `@opentiny/vue-${lib}`, + customName: (name: string) => { + return name === 'default' ? `@opentiny/vue-${lib}$` : `@opentiny/vue-${lib}/${name.replace(/^icon-/, '')}` + }, + style: false, + })), + ]), + dynamicImportPlugin(), + staticCopyPlugin({ + targets: [{ src: '../docs/public/*', dest: '' }], + }), + Unocss({ + include: [/\.js$/, /\.ts$/, /\.vue$/, /\.html$/, /\.jsx$/, /\.tsx$/], // 增加js ,ts扫描 + presets: [], + rules, + shortcuts, + variants, + safelist: [...Array.from({ length: 24 }, (_, i) => `c-rand${i + 1}`), ...Array.from({ length: 24 }, (_, i) => `bg-rand${i + 1}`)] + }), + inspectPlugin(), + checkerPlugin({ overlay: { initialIsOpen: false }, terminal: false, typescript: false, vueTsc: true }), + ], + resolve: { + extensions: ['.js', '.ts', '.tsx', '.vue'], + alias: { + 'vue': path.resolve('node_modules/vue/dist/vue.esm-bundler.js'), + 'vue-i18n': 'vue-i18n/dist/vue-i18n.cjs.js', + '@': pathFromWorkspaceRoot('examples/docs/newsrc'), + ...getAlias(3, env.VITE_TINY_THEME), + }, + }, + define: { + 'process.env': env, + }, + optimizeDeps: getOptimizeDeps(3), + } +}) diff --git a/examples/vue3/vitest.config.ts b/examples/vue3/vitest.config.ts new file mode 100644 index 000000000..201e328fc --- /dev/null +++ b/examples/vue3/vitest.config.ts @@ -0,0 +1,66 @@ +import path from 'node:path' +import { defineConfig } from 'vitest/config' +import { loadEnv } from 'vite' +import virtualTemplatePlugin from '@opentiny-internal/unplugin-virtual-template/vite' +import vue3Plugin from '@vitejs/plugin-vue' +import vue3JsxPlugin from '@vitejs/plugin-vue-jsx' +import vue3SvgPlugin from 'vite-svg-loader' +import importPlugin from 'vite-plugin-importus' +import { getAlias } from '../../internal/config/vite' + +const pathResolve = (...paths: string[]) => path.resolve(__dirname, ...paths).replace(/\\/g, '/') + +export default defineConfig((config) => { + const env = loadEnv(config.mode, process.cwd(), '') + + return { + plugins: [ + virtualTemplatePlugin({ include: ['**/packages/vue/**/src/index.ts'], env }), + vue3Plugin({ + include: [/\.vue$/, /\.md$/], + }), + vue3JsxPlugin(), + vue3SvgPlugin(), + importPlugin([ + { + libraryName: '@opentiny/vue', + customName: name => `@opentiny/vue-${name}`, + style: false, + }, + ...['icon', 'icon-saas'].map(lib => ({ + libraryName: `@opentiny/vue-${lib}`, + customName: (name: string) => { + return name === 'default' ? `@opentiny/vue-${lib}$` : `@opentiny/vue-${lib}/${name.replace(/^icon-/, '')}` + }, + style: false, + })), + ]) + ], + optimizeDeps: { + disabled: true, + }, + define: { + 'process.env': env, + }, + test: { + open: false, + clearMocks: true, + environment: 'jsdom', + setupFiles: ['./vitest.setup.ts'], + transformMode: { + web: [/\.[jt]sx$/], + }, + include: [ + '../../packages/vue/src/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}' + ], + exclude: [ + '../../packages/vue/src/**/{node_modules,dist}/**', + ], + alias: { + 'vue': path.resolve('node_modules/vue/dist/vue.esm-bundler.js'), + '@vue/test-utils': path.resolve('node_modules/@vue/test-utils'), + ...getAlias(3), + } + }, + } +}) diff --git a/examples/vue3/vitest.setup.ts b/examples/vue3/vitest.setup.ts new file mode 100644 index 000000000..e69de29bb diff --git a/index.html b/index.html deleted file mode 100644 index 06a752a3c..000000000 --- a/index.html +++ /dev/null @@ -1,13 +0,0 @@ - - - - - - - Tiny Vue - - -
- - - \ No newline at end of file diff --git a/internals/cli/CHANGELOG.md b/internals/cli/CHANGELOG.md new file mode 100644 index 000000000..e69de29bb diff --git a/internals/cli/package.json b/internals/cli/package.json new file mode 100644 index 000000000..5660b863b --- /dev/null +++ b/internals/cli/package.json @@ -0,0 +1,70 @@ +{ + "name": "internal-cli", + "private": true, + "type": "commonjs", + "version": "1.0.5-mf.0", + "description": "internal-cli", + "devDependencies": { + "@opentiny-internal/unplugin-virtual-template": "workspace:*", + "@babel/core": "^7.5.5", + "@babel/preset-env": "7.16.7", + "@rollup/plugin-babel": "^6.0.3", + "@rollup/plugin-commonjs": "^24.0.1", + "@types/fs-extra": "^11.0.1", + "@vue/tsconfig": "^0.1.3", + "chalk": "2.4.2", + "commander": "^10.0.0", + "esbuild-register": "^3.4.2", + "find-up": "^5.0.0", + "fs-extra": "^11.1.0", + "handlebars": "4.7.7", + "prettier": "2.3.0", + "rollup": "^3.7.3", + "semver": "^7.3.8", + "tsup": "^6.5.0", + "vite": "^4.0.0", + "vite-plugin-importus": "^1.0.4" + }, + "bin": { + "cli": "./dist/cjs/index.js" + }, + "main": "./dist/cjs/index.js", + "scripts": { + "//build": "tsup", + "// -------注意带 # 开头的脚本命令不要直接执行------- ": "", + "build:entry": "esno src/index.ts build:entry", + "#build:entry1": "node dist/index.js build:entry", + "build:entry-app": "esno src/commands/build/build-entry-app.ts", + "// ---------------------build 构建--------------------- ": "", + "build:ui": "esno src/index.ts build:ui", + "build:ui1": "pnpm build && node dist/index.js build:ui", + "// #build:runtime-vue 构建适用于 Vue2/Vue3 的组件 Runtime (按需加载)": "", + "build:runtime": "pnpm build:entry-app && esno src/index.ts build:runtime", + "// ---------------------release 打包--------------------- ": "", + "// release 生成 Vue2/Vue3 版本的 @opentiny/vue npm 包": "", + "#release": "esno src/commands/release/release.ts", + "release:vue2": "VUE_VERSION=vue2 pnpm #release", + "release:vue3": "VUE_VERSION=vue3 pnpm #release", + "// release:ui 生成 Vue2/Vue3 版本的 @opentiny/vue-* npm 包": "", + "#release:ui": "esno src/commands/release/release-ui.ts", + "release:ui-vue2": "VUE_VERSION=vue2 pnpm #release:ui", + "release:ui-vue3": "VUE_VERSION=vue3 pnpm #release:ui", + "// -----------------------测试包----------------------- ": "", + "// release:ui-test 生成 Vue2/Vue3 版本的 @opentiny/vue-* npm 包(可直接复制到项目工程的 node_modules 下进行替换使用)": "", + "#release:ui-test": "pnpm #release:ui && pnpm #release", + "release:ui-test-vue2": "VUE_VERSION=vue2 RELEASE_MODE=test pnpm #release:ui-test", + "release:ui-test-vue3": "VUE_VERSION=vue3 RELEASE_MODE=test pnpm #release:ui-test", + "// ----------------------辅助脚本---------------------- ": "", + "create:ui": "esno src/commands/create/create-ui.ts", + "sync-icons": "esno src/commands/create/sync-icons.ts", + "clean:build": "esno src/commands/clean.ts", + "create:mapping": "esno src/commands/create/create-mapping.ts" + }, + "dependencies": { + "@vue/babel-helper-vue-jsx-merge-props": "^1.4.0", + "esno": "^0.16.3", + "fast-glob": "^3.2.12", + "vite-plugin-dts": "^1.7.1", + "vite-svg-loader": "^3.6.0" + } +} diff --git a/internals/cli/public/template/component/index.ts b/internals/cli/public/template/component/index.ts new file mode 100644 index 000000000..89989f976 --- /dev/null +++ b/internals/cli/public/template/component/index.ts @@ -0,0 +1,23 @@ +import [[UNAME]] from './src/index[[SUFFIX]]' +import '@opentiny/vue-theme/[[NAME]]/index.less' + +[[UNAME]].model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +[[UNAME]].install = function (Vue) { + Vue.component([[UNAME]].name, [[UNAME]]) +} + +[[UNAME]].version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + [[UNAME]].install(window.Vue) + } +} + +export default [[UNAME]] diff --git a/internals/cli/public/template/component/package.json b/internals/cli/public/template/component/package.json new file mode 100644 index 000000000..980d7f045 --- /dev/null +++ b/internals/cli/public/template/component/package.json @@ -0,0 +1,14 @@ +{ + "name": "@opentiny/vue-[[NAME]]", + "version": "5.[[MINOR]].0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "sideEffects": false, + "dependencies": { + "@opentiny/vue-renderless": "~5.[[MINOR]].0", + "@opentiny/vue-theme": "~5.[[MINOR]].0", + "@opentiny/vue-common": "~5.[[MINOR]].0" + }, + "license": "MIT" +} \ No newline at end of file diff --git a/internals/cli/public/template/component/src/index.ts b/internals/cli/public/template/component/src/index.ts new file mode 100644 index 000000000..eef1a84ad --- /dev/null +++ b/internals/cli/public/template/component/src/index.ts @@ -0,0 +1,24 @@ +import { $props, $setup, $prefix, defineComponent } from '@opentiny/vue-common' +import PCTemplate from './pc.vue' +import MobileTemplate from './mobile.vue' + +const $constants = {} + +const template = (mode) => { + return 'mobile-first' === (process.env.TINY_MODE || mode) ? MobileTemplate : PCTemplate +} + +export default defineComponent({ + name: $prefix + '[[UNAME]]', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + modelValue: String + }, + setup(props, context) { + return $setup({ props, context, template }) + } +}) diff --git a/internals/cli/public/template/component/src/pc.vue b/internals/cli/public/template/component/src/pc.vue new file mode 100644 index 000000000..d502568b2 --- /dev/null +++ b/internals/cli/public/template/component/src/pc.vue @@ -0,0 +1,16 @@ + + + diff --git a/template/component/src/single.vue b/internals/cli/public/template/component/src/single.vue similarity index 78% rename from template/component/src/single.vue rename to internals/cli/public/template/component/src/single.vue index cd23fcb24..9de371238 100644 --- a/template/component/src/single.vue +++ b/internals/cli/public/template/component/src/single.vue @@ -4,11 +4,11 @@ diff --git a/template/icon/index.js b/internals/cli/public/template/icon/index.ts similarity index 100% rename from template/icon/index.js rename to internals/cli/public/template/icon/index.ts diff --git a/internals/cli/src/commands/build/build-entry-app.ts b/internals/cli/src/commands/build/build-entry-app.ts new file mode 100644 index 000000000..5359e027d --- /dev/null +++ b/internals/cli/src/commands/build/build-entry-app.ts @@ -0,0 +1,89 @@ +/** + * 生成全量运行时入口文件 + */ +import fs from 'fs-extra' +import { EOL as endOfLine } from 'os' +import * as utils from '../../shared/utils.js' +import * as moduleUtils from '../../shared/module-utils.js' +import handlebarsRender from './handlebars.render.js' + +const version = utils.getopentinyVersion({}) +const outputDir = 'packages/vue' +const iconDir = 'packages/vue-icon' +const MAIN_TEMPLATE = `{{{include}}} + +export const version = '${version}' + +export { + {{{components}}} +} +` + +const buildFullRuntime = () => { + const outputPath = utils.pathFromWorkspaceRoot(outputDir, "app.ts") + const components = moduleUtils.getPcComponents() + const includeTemplate: string[] = [] + const componentsTemplate: string[] = [] + + // 导出公共模块 + components.push( + { + name: 'Icon', + importName: '@opentiny/vue-icon', + path: 'packages/vue-icon', + }, + { + name: 'Locale', + importName: '@opentiny/vue-locale', + path: 'packages/vue-locale', + }, + { + name: 'Renderless', + importName: '@opentiny/vue-renderless/common/runtime', + path: 'packages/renderless', + }, + { + name: 'Common', + importName: '@opentiny/vue-common', + path: 'packages/vue-common', + }, + ) + + components.forEach((item) => { + // 暂时排除 chart 类组件 + if (item.inEntry !== false && !item.path.includes('chart') && !item.path.includes('river')) { + const component = utils.capitalizeKebabCase(item.name) + + componentsTemplate.push(` ${component}`) + includeTemplate.push(`import ${item.name} from '${item.importName}'`) + } + }) + + const template = handlebarsRender({ + template: MAIN_TEMPLATE, + data: { + include: includeTemplate.join(endOfLine), + components: componentsTemplate.join(',' + endOfLine) + } + }) + + const output = utils.prettierFormat({ str: template }) + + fs.writeFileSync(outputPath, output) + + utils.logGreen(`npm run build:entry done. [${outputDir}/app.ts]`) +} + +// 重新创建 icon 入口 +const buildIconEntry = () => { + const inputPath = utils.pathFromWorkspaceRoot(iconDir, 'index.ts') + const outputPath = utils.pathFromWorkspaceRoot(iconDir, 'src', 'index.ts') + let iconEntryContent = fs.readFileSync(inputPath).toString('utf-8') + + iconEntryContent = iconEntryContent.replace(/.\/src\//g, './') + + fs.writeFileSync(outputPath, iconEntryContent) +} + +buildIconEntry() +buildFullRuntime() diff --git a/internals/cli/src/commands/build/build-entry.ts b/internals/cli/src/commands/build/build-entry.ts new file mode 100644 index 000000000..a7654f7af --- /dev/null +++ b/internals/cli/src/commands/build/build-entry.ts @@ -0,0 +1,107 @@ +/** + * 生成入口文件,包括 pc.js / mobile.js / mobile-first.js / index.js + */ +import fs from 'fs-extra' +import { EOL as endOfLine } from 'os' +import * as utils from '../../shared/utils.js' +import * as moduleUtils from '../../shared/module-utils.js' +import handlebarsRender from './handlebars.render.js' + +const version = utils.getopentinyVersion({}) +const outputDir = 'packages/vue' + +const fileNames = { + all: 'index.ts', + pc: 'pc.ts', + mobile: 'mobile.ts' +} + +function getMainTemplate({ mode }) { + let tpl = '' + if (mode !== 'all') { + tpl = ` + const appProperties = app.config?.globalProperties || app.prototype + appProperties.tiny_mode = { value: '${mode}' } + ` + } + return `{{{include}}} + import { $prefix } from '@opentiny/vue-common' + + const components = [{{{components}}}] + + export const install = (app, opts = {}) => { + const regex = new RegExp('^' + $prefix) + + ${tpl} + + components.forEach((component) => { + const name = component.name + const alias = opts.alias || opts.prefix + + if (typeof component.install !== 'function') return + + if (name && alias) { + app.component(name.replace(regex, alias), component) + } else { + component.install(app) + } + }) + } + + export const version = '${version}' + + export { + {{{components}}} + } + + export default { + {{{components}}}, + install + } + ` +} + +const createEntry = (mode) => { + const OUTPUT_PATH = utils.pathFromWorkspaceRoot(outputDir, fileNames[mode]) + const MAIN_TEMPLATE = getMainTemplate({ mode }) + const includeTemplate: string[] = [] + const componentsTemplate: string[] = [] + let components + + if (mode === 'pc') { + components = moduleUtils.getPcComponents() + } else if (mode === 'mobile') { + components = moduleUtils.getMobileComponents() + } else { + components = moduleUtils.getComponents() + } + + components.forEach((item) => { + if (item.inEntry !== false) { + const component = utils.capitalizeKebabCase(item.name) + + componentsTemplate.push(` ${component}`) + includeTemplate.push(`import ${item.name} from '${item.importName}'`) + } + }) + + const template = handlebarsRender({ + template: MAIN_TEMPLATE, + data: { + include: includeTemplate.join(endOfLine), + components: componentsTemplate.join(',' + endOfLine), + } + }) + + const output = utils.prettierFormat({ str: template }) + + fs.writeFileSync(OUTPUT_PATH, output) +} + +export function buildEntry() { + ['all', 'pc', 'mobile'].forEach(createEntry) + + utils.logGreen( + `npm run build:entry done. [${outputDir}/index.ts,${outputDir}/pc.ts,${outputDir}/mobile.ts]` + ) +} diff --git a/internals/cli/src/commands/build/build-runtime.ts b/internals/cli/src/commands/build/build-runtime.ts new file mode 100644 index 000000000..d69e6b044 --- /dev/null +++ b/internals/cli/src/commands/build/build-runtime.ts @@ -0,0 +1,135 @@ +import path from 'node:path' +import type { UserConfig } from 'vite' +import { build } from 'vite' +import babel from '@rollup/plugin-babel' +import * as utils from '../../shared/utils.js' +import type { BuildUiOption } from './build-ui' +import { pathFromPackages, getBaseConfig, requireModules } from './build-ui' +import commonjs from '@rollup/plugin-commonjs' + +const runtimeDir = 'dist/@opentiny/vue/runtime' + +async function batchBuildAll({ vueVersion, tasks, message, emptyOutDir, npmScope, min }) { + const rootDir = pathFromPackages('') + const outDir = path.resolve(rootDir, runtimeDir) + + await batchBuild({ + vueVersion, + tasks, + message, + emptyOutDir, + npmScope, + min, + }) + + function toEntry(libs) { + return libs.reduce((result, { libPath, path: file }) => { + result[libPath] = pathFromPackages(file) + return result + }, {}) + } + + function getExternal() { + return { + vue: 'Vue', + '@vue/composition-api': 'VueCompositionAPI', + } + } + + async function batchBuild({ vueVersion, tasks, message, emptyOutDir, npmScope, min }) { + if (tasks.length === 0) return + utils.logGreen(`====== 开始构建 ${message} ======`) + + const entry = toEntry(tasks) + const baseConfig = getBaseConfig({ vueVersion, dtsInclude: [], dts: false, npmScope }) as UserConfig + + baseConfig.define = Object.assign(baseConfig.define || {}, { + 'process.env.BUILD_TARGET': JSON.stringify(vueVersion !== '3' ? 'runtime' : 'component'), + 'process.env.NODE_ENV': JSON.stringify('production'), + 'process.env.TINY_MODE': JSON.stringify('pc'), + 'process.env.RUNTIME_VERSION': JSON.stringify(requireModules('packages/renderless/package.json').version), + 'process.env.COMPONENT_VERSION': JSON.stringify(requireModules('packages/vue/package.json').version) + }) + + baseConfig.plugins?.push( + commonjs({ + include: /node_modules/, + requireReturnsDefault: true, + defaultIsModuleExports: true + }), + babel({ + extensions: ['.js', '.jsx', '.mjs', '.ts', '.tsx'], + presets: ['@babel/preset-env'], + }) + ) + + await build({ + configFile: false, + ...baseConfig, + build: { + emptyOutDir, + minify: min, + sourcemap: min, + rollupOptions: { + external: (source, importer, isResolved) => { + if (isResolved || !importer) return false + + return Object.keys(getExternal()).includes(source) + }, + output: { + strict: false, + globals: { + ...getExternal() + }, + assetFileNames: ({ name }) => { + if (/\.(gif|jpe?g|png|svg)$/.test(name ?? '')) { + return 'style/images/[name]-[hash][extname]' + } + + if (/\.css$/.test(name ?? '')) { + return `style${min ? '.min' : ''}[extname]` + } + + return 'style/[name]-[hash][extname]' + }, + } + }, + lib: { + entry, + fileName: (format, entryName) => `${entryName}${min ? '.min' : ''}.${format === 'es' ? 'm' : ''}js`, + name: 'Tiny' + }, + outDir + } + } + ) + } +} + +function getEntryTasks() { + return [{ + path: 'vue/app.ts', + libPath: 'app.full', + }] +} + +export async function buildRuntime({ + vueVersions = ['2', '2.7', '3'], + clean = false, + scope = 'opentiny', + min = false +}: BuildUiOption) { + // 是否清空构建目录 + let emptyOutDir = clean + + // 要构建的模块 + let tasks = [...getEntryTasks()] + + // 要构建的vue框架版本 + for (const vueVersion of vueVersions) { + const message = `TINY for vue${vueVersion}: runtime` + await batchBuildAll({ vueVersion, tasks: [tasks[0]], message, emptyOutDir, npmScope: scope, min }) + // 确保只运行一次 + emptyOutDir = false + } +} diff --git a/internals/cli/src/commands/build/build-ui.ts b/internals/cli/src/commands/build/build-ui.ts new file mode 100644 index 000000000..93517df21 --- /dev/null +++ b/internals/cli/src/commands/build/build-ui.ts @@ -0,0 +1,281 @@ +import virtualTemplatePlugin from '@opentiny-internal/unplugin-virtual-template/vite' +import { getBabelOutputPlugin } from '@rollup/plugin-babel' +import { createRequire } from 'node:module' +import path from 'node:path' +import { build, defineConfig } from 'vite' +import dtsPlugin from 'vite-plugin-dts' +import vue3SvgPlugin from 'vite-svg-loader' +import { getAlias, pathFromWorkspaceRoot } from '../../config/vite.js' +import * as config from '../../shared/config.js' +import { getAllIcons, getAllModules, getByName, type Module } from '../../shared/module-utils.js' +import * as utils from '../../shared/utils.js' +import generatePackageJsonPlugin from './rollup/generate-package-json.js' +import inlineChunksPlugin from './rollup/inline-chunks.js' +import replaceModuleNamePlugin from './rollup/replace-module-name.js' + +export const pathFromPackages = (...args) => pathFromWorkspaceRoot('packages', ...args) +export const require = createRequire(import.meta.url) +export const requireModules = (id: string) => require(require.resolve(pathFromWorkspaceRoot(id))) + +export const getVuePlugins = (vueVersion: string) => { + const pluginMap = { + '2': () => { + const vue2Plugin = requireModules('examples/vue2/node_modules/vite-plugin-vue2').createVuePlugin + const vue2SvgPlugin = requireModules('examples/vue2/node_modules/vite-plugin-vue2-svg').createSvgPlugin + return [ + vue2Plugin({ jsx: true }), + vue2SvgPlugin(), + ] + }, + '2.7': () => { + const vue27Plugin = requireModules('examples/vue2.7/node_modules/@vitejs/plugin-vue2') + const vue27JsxPlugin = requireModules('examples/vue2.7/node_modules/@vitejs/plugin-vue2-jsx') + const vue2SvgPlugin = requireModules('examples/vue2/node_modules/vite-plugin-vue2-svg').createSvgPlugin + const vue27Compiler = requireModules('examples/vue2.7/node_modules/vue/compiler-sfc') + + return [ + vue27Plugin({ + compiler: vue27Compiler + }), + vue27JsxPlugin({ injectH: false }), + vue2SvgPlugin() + ] + }, + '3': () => { + const vue3Plugin = requireModules('examples/vue3/node_modules/@vitejs/plugin-vue') + const vue3JsxPlugin = requireModules('examples/vue3/node_modules/@vitejs/plugin-vue-jsx') + + return [ + vue3Plugin(), + vue3JsxPlugin(), + vue3SvgPlugin({ defaultImport: 'component', svgoConfig: {} }) + ] + } + } + + return pluginMap[vueVersion]() || [] +} + +export const ns = ver => ({ '2': '', '2.7': '2', '3': '3' })[ver] || '' + +export const getBaseConfig = ({ vueVersion, dtsInclude, dts }) => { + // 处理tsconfig中配置,主要是处理paths映射,确保dts可以找到正确的包 + const compilerOptions = require(pathFromWorkspaceRoot(`tsconfig.vue${vueVersion}.json`)).compilerOptions + + return defineConfig({ + publicDir: false, + plugins: [ + // pc和mobile的总入口可能是/src/index.ts或者/src/index.vue + virtualTemplatePlugin({ include: ['**/packages/vue/**/src/index.ts', '**/packages/vue/**/src/index.vue'] }), + ...getVuePlugins(vueVersion), + dts ? + dtsPlugin({ + root: pathFromWorkspaceRoot(), + tsConfigFilePath: `tsconfig.vue${vueVersion}.json`, + compilerOptions: { + paths: { + ...compilerOptions.paths, + // 一定要映射到 packages/vue 下对应的 vue 版本和 @vue/composition-api 才能正确生成 dts + 'vue': [`packages/vue/node_modules/vue${vueVersion}`], + '@vue/runtime-core': ['packages/vue/node_modules/@vue/runtime-core'], + '@vue/runtime-dom': ['packages/vue/node_modules/@vue/runtime-dom'], + '@vue/composition-api': ['packages/vue/node_modules/@vue/composition-api'], + } + }, + include: [...dtsInclude, 'packages/vue/*.d.ts'], + skipDiagnostics: true, + beforeWriteFile: (filePath, content) => { + return { + // "vue/src/alert/index.d.ts" ==> "alert/index.d.ts" + filePath: filePath.replace('/vue/src', '').replace('\\vue\\src', ''), + content: content + // vue 2.7 还不能正常识别 vue-common + .replace(/import\('[./]+vue-common.+'\)/, 'import("vue")') + .replace(/\("vue[1-9\.]+/g, '("vue') + } + } + }) + : undefined, + inlineChunksPlugin({ deleteInlinedFiles: true }), + generatePackageJsonPlugin({ + beforeWriteFile: (filePath, content) => { + content.main = './lib/index.js' + + delete content.module + delete content.devDependencies + delete content.private + + return { + filePath: filePath.replace(/[\\/]lib$/, ''), + content + } + } + }), + replaceModuleNamePlugin() + ], + resolve: { + extensions: ['.js', '.ts', '.tsx', '.vue'], + alias: { + ...getAlias(vueVersion), + '@vue/babel-helper-vue-jsx-merge-props': 'node_modules/@vue/babel-helper-vue-jsx-merge-props/dist/helper.js', + } + }, + define: { + 'process.env.BUILD_TARGET': JSON.stringify('component') + } + }) +} + +async function batchBuildAll({ vueVersion, tasks, formats, message, emptyOutDir, dts }) { + const rootDir = pathFromPackages('') + const outDir = path.resolve(rootDir, `dist${vueVersion}/@opentiny`) + await batchBuild({ + vueVersion, + tasks, + formats, + message, + emptyOutDir, + dts + }) + + function toEntry(libs) { + return libs.reduce((result, { libPath, path: file }) => { + const tLibPath = libPath.replace('-lib/', '/lib/') + result[tLibPath] = pathFromPackages(file) + return result + }, {}) + } + + function toTsInclude(libs) { + return new Set( + libs + .filter((item) => ['module', 'component'].includes(item.type)) + // 不生成图标的 dts + .filter((item) => item.componentType !== 'icon') + .filter((item) => !item.path.includes('vue-icon')) + .map((lib) => `packages/${lib.dtsRoot ? lib.path : path.dirname(lib.path)}`) + ) + } + + async function batchBuild({ vueVersion, tasks, formats, message, emptyOutDir, dts }) { + if (tasks.length === 0) return + utils.logGreen(`====== 开始构建 ${message} ======`) + const entry = toEntry(tasks) + const dtsInclude = toTsInclude(tasks) + await build({ + configFile: false, + ...getBaseConfig({ vueVersion, dtsInclude, dts }), + build: { + emptyOutDir, + minify: false, + rollupOptions: { + plugins: [ + getBabelOutputPlugin({ + presets: [['@babel/preset-env', { loose: true, modules: false }]] + }) + ], + external: (source, importer, isResolved) => { + if (isResolved || !importer) return false + if (/src\/index/.test(importer)) { + // 模块入口,pc/mobile 文件要分离,同时排除 node_modules 依赖 + return /^\.\/(pc|mobile)/.test(source) || config.external(source) + } + + // 图标入口排除子图标 + if (/vue-icon(-\w+)?\/index/.test(importer)) return /^\.\//.test(source) + // 子图标排除周边引用 + if (/vue-icon(-\w+)?\/.+\/index/.test(importer)) return /^vue|@opentiny[\\/](vue)/.test(source) + // @opentiny/vue 入口 + if (/vue\/(index|pc|mobile)\.ts$/.test(importer)) return true + + return config.external(source) + }, + output: { + strict: false, + manualChunks: {} + } + }, + lib: { + // 这里可以多入口打包,也可以单入口打包 + entry, + formats, + fileName: (format, entryName) => `${entryName}.js` + }, + outDir + } + } + ) + } +} + +export interface BuildUiOption { + vueVersions: string[] // vue的版本 + formats: string[] // 打包的格式 + clean: boolean // 是否清空build产物 + dts: boolean // 是否生成TS类型声明文件 + scope?: string // npm的组织名称 + min?: boolean // 是否压缩产物 +} + +function getEntryTasks(): Module[] { + // 读取TinyVue组件库入口文件 + return ['index', 'pc', 'mobile'].map(mode => ({ + path: `vue/${mode}.ts`, + dtsRoot: true, + libPath: `vue/${mode}`, + type: 'module', + name: utils.kebabCase({ str: '@opentiny/vue' }), + global: utils.capitalizeKebabCase('opentinyVue'), + importName: '@opentiny/vue', + })) +} + +function getTasks(names: string[]): Module[] { + // 没有指定组件,则全量构建 + if (names.length === 0) { + return [...getAllModules(false), ...getEntryTasks()] + } + + return names.map(name => getByName({ + name: utils.kebabCase({ str: name.replace('@opentiny/vue-', '') }), + isSort: false + })).flat() +} + +/** + * TinyVue组件打包主入口 + * @private + * @param {string[]} names 需要打包的名字,如果不传默认打包全量组件 例如只打包alert和button两个组件 pnpm build:ui alert button + * @param {BuildUiOption} buildUiOption 具体参数参考BuildUiOption接口 + */ + +export async function buildUi(names: string[] = [], { + vueVersions = ['2', '3'], + formats = ['es'], + clean = false, + dts = true, +}: BuildUiOption) { + // 是否清空构建目录 + let emptyOutDir = clean + // 要构建的模块 + let tasks = getTasks(names) + if (names.some(name => name.includes('icon'))) { + tasks.push(...getByName({ name: utils.kebabCase({ str: 'icon-saas' }), isSort: false })) + tasks.push(...getAllIcons()) + } + + // 构建 @opentiny/vue + if (names.some(name => ['@opentiny/vue', '@opentiny/vue', 'vue'].includes(name))) { + tasks.push(...getEntryTasks()) + } + + // 要构建的vue框架版本 + for (const vueVersion of vueVersions) { + const message = `TINY for vue${vueVersion}: ${JSON.stringify( + names.length ? names : '全量' + )}` + await batchBuildAll({ vueVersion, tasks, formats, message, emptyOutDir, dts }) + // 确保只运行一次 + emptyOutDir = false + } +} diff --git a/internals/cli/src/commands/build/handlebars.render.ts b/internals/cli/src/commands/build/handlebars.render.ts new file mode 100644 index 000000000..86951745c --- /dev/null +++ b/internals/cli/src/commands/build/handlebars.render.ts @@ -0,0 +1,66 @@ +/* + * + * Copyright (c) 2014-2017, Jon Schlinkert. + * Released under the MIT License. + */ +import Handlebars from 'handlebars' + +let RegCache = {} +let HandlebarsCompile + +const replaceDelimiters = function (str, sourceReg, escape) { + let regex = RegCache[sourceReg] || (RegCache[sourceReg] = new RegExp(sourceReg, 'g')) + let match + + while ((match = regex.exec(str))) { + let prefix = str.slice(0, match.index) + let inner = (escape ? '\\' : '') + '{{' + match[1] + '}}' + let suffix = str.slice(match.index + match[0].length) + + str = prefix + inner + suffix + } + + return str +} + +Handlebars.setDelimiter = function (delimiters) { + if (delimiters[0].slice(-1) !== '=') { + delimiters[0] += '(?!=)' + } + + let source = delimiters[0] + '([\\s\\S]+?)' + delimiters[1] + + if (!HandlebarsCompile) { + HandlebarsCompile = Handlebars.compile + } + + Handlebars.compile = function (str) { + let args = [].slice.call(arguments) + + if (typeof str === 'string') { + if (delimiters[0] !== '{{' && delimiters[1] !== '}}') { + args[0] = replaceDelimiters(args[0], '{{([\\s\\S]+?)}}', true) + } + + args[0] = replaceDelimiters(args[0], source) + } + + return HandlebarsCompile.apply(Handlebars, args) + } +} + +/** + * 格式化模板 + * + * delimiter 匹配字符模板 + * template 格式化模板 + * options Handlebars配置 + * data 数据 + * @param {Object} delimiter + * @returns {String} + */ +export default function ({ delimiter, template, options, data }) { + delimiter && Handlebars.setDelimiter(delimiter) + + return Handlebars.compile(template, options)(data) +} diff --git a/internals/cli/src/commands/build/index.ts b/internals/cli/src/commands/build/index.ts new file mode 100644 index 000000000..b4600b165 --- /dev/null +++ b/internals/cli/src/commands/build/index.ts @@ -0,0 +1,3 @@ +export * from './build-ui.js' +export * from './build-entry.js' +export * from './build-runtime' diff --git a/internals/cli/src/commands/build/rollup/generate-package-json.ts b/internals/cli/src/commands/build/rollup/generate-package-json.ts new file mode 100644 index 000000000..7f6a6c33e --- /dev/null +++ b/internals/cli/src/commands/build/rollup/generate-package-json.ts @@ -0,0 +1,50 @@ +import type { Plugin, NormalizedOutputOptions, OutputBundle } from 'rollup' +import path from 'node:path' +import fs from 'node:fs' +import { sync as findUpSync } from 'find-up' + +export default function generatePackageJson({ beforeWriteFile }): Plugin { + return { + name: 'opentiny-vue:generate-package-json', + generateBundle(output: NormalizedOutputOptions, bundle: OutputBundle) { + const cache = {} + Object.entries(bundle).forEach(([, item]) => { + // 主入口文件, button/index.ts, common/src/index.ts + if (item.type === 'chunk' && /\/index\.(js|ts)/.test(item.facadeModuleId!)) { + // 从源文件中往上查找最近的 package.json 文件 + const packageJsonFile = findUpSync('package.json', { cwd: item.facadeModuleId! }) + + if (!packageJsonFile) return + + if (cache[packageJsonFile]) return + + let packageJson + try { + packageJson = JSON.parse(fs.readFileSync(packageJsonFile, { encoding: 'utf-8' })) + } catch { } + + const { filePath, content } = beforeWriteFile(path.dirname(item.fileName), packageJson) + + if (content) { + this.emitFile({ + type: 'asset', + fileName: `${filePath}/package.json`, + source: typeof content === 'string' ? content : JSON.stringify(content, null, 2) + }) + } + + const changelogFile = path.join(path.dirname(packageJsonFile), 'CHANGELOG.md') + if (fs.existsSync(changelogFile)) { + this.emitFile({ + type: 'asset', + fileName: `${filePath}/CHANGELOG.md`, + source: fs.readFileSync(changelogFile, { encoding: 'utf-8' }) + }) + } + + cache[packageJsonFile] = true + } + }) + } + } +} diff --git a/internals/cli/src/commands/build/rollup/inline-chunks.ts b/internals/cli/src/commands/build/rollup/inline-chunks.ts new file mode 100644 index 000000000..154ed8dea --- /dev/null +++ b/internals/cli/src/commands/build/rollup/inline-chunks.ts @@ -0,0 +1,60 @@ +import type { Plugin, NormalizedOutputOptions, OutputBundle, OutputChunk } from 'rollup' +import chalk from 'chalk' + +export default function ({ deleteInlinedFiles = true }): Plugin { + return { + name: 'opentiny-vue:inline-chunks', + generateBundle: ({ format }: NormalizedOutputOptions, bundle: OutputBundle) => { + const bundlesToDelete = new Set() + const cache = {} + + const jsAssets = Object.keys(bundle).filter((i) => /\.[mc]?js$/.test(i)) + for (const jsName of jsAssets) { + const jsChunk = bundle[jsName] + + if (jsChunk.type === 'asset') continue + if (!jsChunk.code) continue + + if (format === 'es') { + jsChunk.code = jsChunk.code.replace( + // import { _ as _export_sfc } from "../../../../_plugin-vue_export-helper-1faf6727.mjs" + /^import\s*.+\s*from\s+"[./]+(.+-[a-f0-9]{8}.+)".*$/gim, + (_, chunkName) => { + if (!cache[chunkName]) { + cache[chunkName] = (bundle[chunkName] as OutputChunk).code.replace(/export {[\s\S]+$/, '') + bundlesToDelete.add(chunkName) + } + + return cache[chunkName] + } + ) + } + + if (format === 'cjs') { + jsChunk.code = jsChunk.code.replace( + // var _pluginVue_exportHelper = require("../../../../_plugin-vue_export-helper-65c7de93.js"); + /^var\s+(.+)\s+=\s+require\("[./]+(.+-[a-f0-9]{8}.+)".*$/gim, + (_, localVarName, chunkName) => { + if (!cache[chunkName]) { + cache[chunkName] = + 'var _pluginVue_exportHelper = {};\n' + + (bundle[chunkName] as OutputChunk).code.replace(/exports\./g, `${localVarName}.`) + bundlesToDelete.add(chunkName) + } + + return cache[chunkName] + } + ) + } + } + + if (deleteInlinedFiles) { + // 删除 chunks + bundlesToDelete.forEach((name) => { + delete bundle[name] + console.log(`\n${chalk.red(name)} 已经被内联并删除`) + }) + } + } + } +} diff --git a/internals/cli/src/commands/build/rollup/replace-module-name.ts b/internals/cli/src/commands/build/rollup/replace-module-name.ts new file mode 100644 index 000000000..5ca5abbbe --- /dev/null +++ b/internals/cli/src/commands/build/rollup/replace-module-name.ts @@ -0,0 +1,37 @@ +import type { Plugin, NormalizedOutputOptions, OutputBundle } from 'rollup' + +export default function (): Plugin { + return { + name: 'opentiny-vue:replace-module-name', + generateBundle: (output: NormalizedOutputOptions, bundle: OutputBundle) => { + const regexpStr = /\.([mc]?js)$/ + + const jsAssets = Object.keys(bundle).filter((i) => regexpStr.test(i)) + + for (const name of jsAssets) { + const chunk = bundle[name] + if (chunk.type === 'asset') continue + + let code = chunk.code + if (!code) continue + + const suffix = name.match(regexpStr)?.[1] + + if (suffix) { + code = code.replace( + /".+\/src\/(pc|mobile)\.vue/g, + `"./$1.${suffix}` + ) + } + + // import "@opentiny/vue-theme-*/index.less"; 替换为 css + code = code.replace(/^(import.+@opentiny\/theme.+index)\.less/mg, '$1.css') + + // from "./src/xxx" 替换为 from "./lib/xxx" + code = code.replace(/from "\.\/src\//g, 'from "./lib/') + + chunk.code = code + } + } + } +} diff --git a/internals/cli/src/commands/clean.ts b/internals/cli/src/commands/clean.ts new file mode 100644 index 000000000..124df9fd9 --- /dev/null +++ b/internals/cli/src/commands/clean.ts @@ -0,0 +1,48 @@ +import path from 'path' +import { removeSync } from 'fs-extra' +import * as utils from './utils' + +/** + * 删除 packages 项目包下插件内部的 dist、runtime、node_modules 文件 + */ +const deleteDistFile = () => { + utils.walkFileTree({ + isDeep: true, + fileFilter({ file, subPath, isDirectory }) { + let flag = true + + if (isDirectory && ['dist', 'runtime', 'node_modules', 'dist-vue2', 'dist-vue3', 'icon-saas'].includes(file)) { + removeSync(subPath) + flag = false + } + + if (file === 'package-lock.json') { + removeSync(subPath) + } + + return flag + }, + dirPath: utils.pathJoin('..', 'packages'), + callback() { + // empty + } + }) +} + +try { + deleteDistFile() + + // 删除打包产物 + ;['dist-vue2', 'dist-vue3', 'tgzs', 'typings-vue2', 'typings-vue3'].forEach((name) => { + removeSync(path.join(__dirname, '..', name)) + }) + + // 删除打包生成入口 + ;['index', 'pc', 'mobile', 'mobile-first', 'core', 'chart', 'base'].forEach((name) => { + removeSync(path.join(__dirname, '..', 'packages', name + '.js')) + }) + + utils.logGreen('npm run clean:build done.') +} catch (e) { + utils.logRed('npm run clean:build failed.', e) +} diff --git a/internals/cli/src/commands/create/commonMapping.json b/internals/cli/src/commands/create/commonMapping.json new file mode 100644 index 000000000..c8618ea26 --- /dev/null +++ b/internals/cli/src/commands/create/commonMapping.json @@ -0,0 +1,17 @@ +{ + "Locale": { + "path": "vue-locale/src/index.ts", + "type": "module", + "exclude": false + }, + "Icon": { + "path": "vue-icon/index.ts", + "type": "module", + "exclude": false + }, + "Common": { + "path": "vue-common/src/index.ts", + "type": "module", + "exclude": false + } +} \ No newline at end of file diff --git a/internals/cli/src/commands/create/create-icon-saas.ts b/internals/cli/src/commands/create/create-icon-saas.ts new file mode 100644 index 000000000..5cc1eea1f --- /dev/null +++ b/internals/cli/src/commands/create/create-icon-saas.ts @@ -0,0 +1,22 @@ +/** + * 根据 @opentiny/vue-icon 组件生成 @opentiny/vue-icon-saas 组件 + */ +import path from 'node:path' +import fs from 'fs-extra' +import { searchForWorkspaceRoot } from 'vite' +import { filesFragmentReplace } from '../../shared/utils.js' + +const ROOT_PATH = searchForWorkspaceRoot(process.cwd()) +const packages = path.join(ROOT_PATH, 'packages') +const iconDir = path.join(packages, 'vue-icon') +const iconSaasDir = path.join(packages, 'vue-icon-saas') + +export function createIconSaas() { + const targets = ['src', 'index.ts'] + + targets.forEach((item) => + fs.copySync(path.resolve(iconDir, item), path.resolve(iconSaasDir, item), { overwrite: true }) + ) + + filesFragmentReplace(path.resolve(iconSaasDir, 'src'), [/@opentiny\/theme\/svgs\//g], ['@opentiny/vue-theme-saas/svgs/']) +} diff --git a/internals/cli/src/commands/create/create-mapping.ts b/internals/cli/src/commands/create/create-mapping.ts new file mode 100644 index 000000000..168b87c4b --- /dev/null +++ b/internals/cli/src/commands/create/create-mapping.ts @@ -0,0 +1,73 @@ +import path from 'node:path' +import * as utils from '../../shared/utils' +import { addModule, writeModuleMap, quickSort, readModuleMap } from '../../shared/module-utils' +import commonMapping from './commonMapping.json' + +const isBuildEntryFile = (file, dirs, subPath) => { + // 如果底层文件夹内没有找到 vue 文件,找到 src//index.ts 文件也被认可为组件 + return (file.endsWith('.vue') && (dirs.includes('index.ts') || dirs.includes('index.vue'))) || ~subPath.indexOf(['src', 'index.ts'].join(path.sep)) +} + +const getTemplateName = (currentPaths) => currentPaths.slice(2).map(utils.capitalize).join('/').split('.')[0].replace('/', '') + +/** + * 扫描指定目录下面的组件目录,查找非 index.vue 文件(模板)生成 modules.json 中的对象 + */ +const makeModules = () => { + const templates = { ...commonMapping } + + // 获取老的odules.json + const oldModules = readModuleMap() + // 获取存放所有组件的文件夹 + const packagesStr = 'packages/vue/src' + utils.walkFileTree({ + isDeep: true, + dirPath: utils.pathFromWorkspaceRoot(packagesStr), + fileFilter({ file }) { + return !/node_modules|helper|common|assets/.test(file) + }, + callback({ file, subPath, dirs }) { + // 判断是否是需要作为打包入口文件 + if (isBuildEntryFile(file, dirs, subPath)) { + const isEntry = file.startsWith('index') + const subPaths = subPath.split(path.sep) + const currentPaths = subPaths.slice(subPaths.indexOf('src') + 1) + const templateName = getTemplateName(currentPaths) + const templatePath = currentPaths[currentPaths.length - 1].split('.')[0] + const componentName = [] + currentPaths.every((dirName) => { + if (dirName === 'src') { + return false + } + componentName.push(dirName) + return true + }) + const globalName = componentName[componentName.length - 1].split('-').map(utils.capitalize).join('') + const moduleName = globalName + (isEntry ? '' : templateName) + const oldModuleItem = oldModules[moduleName] || {} + const oldKeys = Object.keys(oldModuleItem) + const newModuleItem = addModule({ + componentName: componentName.join('/'), + templateName: templatePath + }) + oldKeys.forEach((key) => { + if (typeof newModuleItem[key] === 'undefined' || key === 'onlyMode') { + newModuleItem[key] = oldModuleItem[key] + } + }) + newModuleItem.exclude = oldModuleItem.exclude || false + templates[moduleName] = newModuleItem + } + } + }) + + writeModuleMap(quickSort({ sortData: templates, returnType: 'object' })) +} + +try { + makeModules() + + utils.logGreen('npm run create:mapping done.') +} catch (e) { + utils.logRed(e) +} diff --git a/internals/cli/src/commands/create/create-ui.ts b/internals/cli/src/commands/create/create-ui.ts new file mode 100644 index 000000000..14f44a49e --- /dev/null +++ b/internals/cli/src/commands/create/create-ui.ts @@ -0,0 +1,98 @@ +/* + * yarn create:ui 新建组件,支持格式如下: + * + * yarn create:ui img-preview + * yarn create:ui img-preview -single 输出纯净模板(没有 pc 等模板/单层组件) + * yarn create:ui img-preview -mobile 创建纯移动组件 + */ +const path = require('path') +const fs = require('fs-extra') +const semver = require('semver') +const utils = require('./utils') +const { createModuleMapping } = require('./module-utils') +const handlebarsRender = require('./handlebars.render') + +const args = utils.getInputCmd() + +if (args.length > 0) { + const commands = [] + const components = [] + const templateDir = utils.pathJoin('../template/component') + const componetDir = utils.pathJoin('../../packages/vue/components') + const { version } = fs.readJSONSync(utils.pathJoin('../../packages/vue/package.json')) + + args.forEach((item) => { + if (item.indexOf('-') === 0) { + commands.push(item.replace(/-/g, '').toLowerCase()) + } else { + components.push(item) + } + }) + + const isSingle = commands.includes('single') + const isMobile = commands.includes('mobile') + + components.forEach((componentName) => { + let componentPath = path.join(componetDir, componentName) + + if (fs.existsSync(componentPath)) { + utils.logYellow(`The component name : ${componentName} is exist , please enter other name.`) + return + } + + utils.walkFileTree({ + isDeep: true, + dirPath: templateDir, + callback({ file, subPath }) { + let fileName = file + const isSingleTemplate = file === 'single.vue' + const isSrcDir = path.basename(path.dirname(subPath)) === 'src' + + componentPath = path.join(componetDir, componentName) + + // 单层组件处理逻辑 + if (isSrcDir) { + componentPath = path.join(componentPath, 'src') + + if (isSingle) { + if (!isSingleTemplate) return + + fileName = 'index.vue' + } else { + if (isSingleTemplate) return + } + } + + if (!fs.existsSync(componentPath)) { + fs.mkdirSync(componentPath) + } + + componentPath = path.join(componentPath, fileName) + + let fileContent = fs.readFileSync(subPath, { encoding: 'utf8' }) + const upperComponentName = utils.capitalizeKebabCase(componentName) + + // 编译模板 + fileContent = handlebarsRender({ + template: fileContent, + data: { + NAME: componentName, + UNAME: upperComponentName, + MINOR: semver.minor(version), + SUFFIX: isSingle ? '.vue' : '', + THEME: isMobile ? 'theme-mobile' : 'theme' + }, + delimiter: ['\\[\\[', '\\]\\]'] + }) + + fs.writeFileSync(componentPath, fileContent) + } + }) + + createModuleMapping(componentName, isMobile) + }) + + utils.logGreen('npm run create:ui done.') +} else { + utils.logYellow('please enter the component name after command.') +} diff --git a/internals/cli/src/commands/create/index.ts b/internals/cli/src/commands/create/index.ts new file mode 100644 index 000000000..c59e70c17 --- /dev/null +++ b/internals/cli/src/commands/create/index.ts @@ -0,0 +1 @@ +export * from './create-icon-saas.js' diff --git a/internals/cli/src/commands/release/.eslintrc b/internals/cli/src/commands/release/.eslintrc new file mode 100644 index 000000000..34f481ae7 --- /dev/null +++ b/internals/cli/src/commands/release/.eslintrc @@ -0,0 +1,5 @@ +{ + "rules": { + "no-console": "off" + } +} \ No newline at end of file diff --git a/internals/cli/src/commands/release/release-ui.ts b/internals/cli/src/commands/release/release-ui.ts new file mode 100644 index 000000000..cd658d449 --- /dev/null +++ b/internals/cli/src/commands/release/release-ui.ts @@ -0,0 +1,154 @@ +/** + * 用于发布单组件包 + * + * process.env.RELEASE_MODE 值为 test 时,将生成类 node_modules 下的安装包 + * + */ +import * as utils from '../../shared/utils.js' +import fs from 'fs-extra' +import path from 'path' +import { execSync } from 'child_process' + +const isVue2 = utils.isBuildForVue2() +const packages = 'packages' +const dist = `dist${isVue2 ? 2 : 3}` +const tgzs = 'tgzs' +const packageName = 'package.json' +const isBuildTest = process.env.RELEASE_MODE === 'test' +const inputArgs = utils.getInputCmd() // 对应 build:version 的参数 +const { isTestEnv, tag } = utils.getBuildTag({ isVue2, version: inputArgs[0] }) +const typesDir = `typings-vue${isVue2 ? 2 : 3}` + +let opentinyVueVersion + +if (isTestEnv) { + opentinyVueVersion = tag +} else { + opentinyVueVersion = utils.getPackageVersion({ name: 'version', isRoot: true, isVue2 }) +} + +const { themeVersion, renderlessVersion, themeMobileVersion } = utils.getInnerDependenciesVersion({ + isTestEnv, + tag, + version: opentinyVueVersion +}) + +function modifyDependencyByComponentName(componentName, packageJSON, dependencies) { + if (['icon', 'icon-saas'].includes(componentName)) { + packageJSON.dependencies = Object.assign(packageJSON.dependencies || {}, { + '@opentiny/vue-theme': themeVersion, + '@opentiny/vue-common': opentinyVueVersion + }) + } else if (componentName === 'locale') { + // 不处理 + } else if (componentName === 'common') { + if (componentName === 'common') { + if (isVue2) { + packageJSON.dependencies = Object.assign(packageJSON.dependencies || {}, { '@vue/composition-api': '1.2.2' }) + } else { + packageJSON.peerDependencies = { 'vue': '^3.2.0' } + } + } + } else { + packageJSON.dependencies = Object.assign(packageJSON.dependencies || {}, dependencies) + } +} + +function setDependencyComponentPublichVersionVue2(packageJSON, componentName) { + if (isVue2) { + packageJSON.version = utils.getComponentOriginVersion({ name: componentName, isVue2 }) + + const dependencies = packageJSON.dependencies + + for (let key in dependencies) { + if (/@opentiny\/(vue-)/.test(key)) { + packageJSON.dependencies[key] = utils.getPublichVersion({ version: dependencies[key], isVue2 }) + } + } + } +} + +const release = (componentName) => { + let packagePath = path.join(packages, componentName, packageName) + const distPath = path.join(packages, componentName, dist) + + if (!fs.existsSync(packagePath) || !fs.existsSync(distPath)) { + utils.logYellow(`${componentName} haven't ${packageName} or dist.`) + return + } + + const packageJSON = fs.readJSONSync(packagePath) + const dependencies = { + '@opentiny/vue-renderless': renderlessVersion, + '@opentiny/vue-theme': themeVersion, + '@opentiny/vue-theme-mobile': themeMobileVersion, + '@opentiny/vue-common': opentinyVueVersion, + '@opentiny/vue-icon': opentinyVueVersion + } + + modifyDependencyByComponentName(componentName, packageJSON, dependencies) + + packageJSON.sideEffects = false + packageJSON.type = 'module' + packageJSON.types = 'index.d.ts' + packagePath = path.join(distPath, packageName) + + setDependencyComponentPublichVersionVue2(packageJSON, componentName) + utils.changePackageName({ packageJSON, isVue2 }) + + fs.writeFileSync(packagePath, JSON.stringify(packageJSON, null, 2)) + + if (isBuildTest) { + fs.copySync(distPath, path.join(tgzs, 'vue-' + componentName.split('\\').slice(-1)[0]), { overwrite: true }) + } else { + const componentTypesDir = path.join(typesDir, componentName) + + if (fs.existsSync(componentTypesDir)) { + fs.readdirSync(componentTypesDir).forEach((item) => { + const componentDir = path.join(componentTypesDir, item) + const stat = fs.statSync(componentDir) + + if (stat.isDirectory()) { + fs.copySync(componentDir, path.join(distPath, item)) + } else { + fs.copyFileSync(componentDir, path.join(distPath, item)) + } + }) + } else { + utils.logYellow(`${componentName} missing typings declaration file.`) + } + + execSync('npm pack -q', { cwd: distPath }) + + fs.readdirSync(distPath).forEach((item) => { + if (item.endsWith('.tgz')) { + const tgzPath = path.join(distPath, item) + + fs.moveSync(tgzPath, path.join(tgzs, item), { overwrite: true }) + + utils.logGreen(`${componentName} pack done.`) + } + }) + } +} + +fs.readdirSync(path.join(packages)).forEach((item) => { + const componentDir = path.join(packages, item) + const stat = fs.statSync(componentDir) + + if (stat.isDirectory()) { + release(item) + + if (item === 'chart') { + fs.readdirSync(componentDir).forEach((child) => { + const stat = fs.statSync(path.join(componentDir, child)) + + if (stat.isDirectory()) { + release(path.join(item, child)) + } + }) + } + } +}) + +utils.logGreen(`npm run release:ui-vue${isVue2 ? 2 : 3} done.`) diff --git a/internals/cli/src/commands/release/release.ts b/internals/cli/src/commands/release/release.ts new file mode 100644 index 000000000..0df66d63b --- /dev/null +++ b/internals/cli/src/commands/release/release.ts @@ -0,0 +1,102 @@ +/** + * 用于发布 @opentiny/vue 包 + * + * process.env.RELEASE_MODE 值为 test 时,将生成类 node_modules 下的安装包 + * + */ +const fs = require('fs-extra') +const path = require('path') +const utils = require('../build/utils') +const { execSync } = require('child_process') +const { getComponents } = require('../build/module-utils') + +const isBuildTest = process.env.RELEASE_MODE === 'test' +const isVue2 = utils.isBuildForVue2() +const source = `dist-vue${isVue2 ? 2 : 3}` +const typesDir = `typings-vue${isVue2 ? 2 : 3}` +const packageName = 'package.json' +const packagePath = path.join(source, packageName) +const packageJSON = fs.readJSONSync(packageName) +const inputArgs = utils.getInputCmd() // 对应 build:version 的参数 +const { isTestEnv, tag } = utils.getBuildTag({ isVue2, version: inputArgs[0] }) + +const keys = [ + 'name', + 'version', + 'description', + 'main', + 'files', + 'sideEffects', + 'author', + 'license', + 'repository', + 'dependencies', + 'engines', + 'browserslist' +] + +for (let key in packageJSON) { + !~keys.indexOf(key) && delete packageJSON[key] +} + +if (isVue2) { + packageJSON.version = utils.getopentinyVersion({ isVue2 }) +} + +const genDependencies = () => { + const dependencies = {} + let version + + if (isTestEnv) { + version = tag + } + + getComponents(false).forEach((component) => { + const packPath = component.path.replace(/index\.js$/, 'package.json') + + if (!fs.existsSync(packPath) || component.inEntry === false) { + return + } + + if (!isTestEnv) { + version = utils.getPackageVersion({ name: component.LowerName, isVue2 }) + } + + dependencies[component.importName] = version + }) + + return dependencies +} + +packageJSON.types = "index.d.ts" +packageJSON.dependencies = Object.assign({}, genDependencies()) +utils.changePackageName({ packageJSON, isVue2 }) + +fs.writeFileSync(packagePath, JSON.stringify(packageJSON, null, 2)) + +if (isBuildTest) { + fs.copySync(source, path.join('tgzs', 'vue'), { overwrite: true }) +} else { + // copy ts 声明文件 + if (fs.existsSync(typesDir)) { + const entrys = ['index', 'pc', 'mobile', 'mobile-first'] + + entrys.forEach((name) => { + const filename = `${name}.d.ts` + + fs.copyFileSync(path.join(typesDir, filename), path.join(source, filename)) + }) + } + + execSync('npm pack', { cwd: source }) + + fs.readdirSync(source).forEach((item) => { + if (item.endsWith('.tgz')) { + const tgzPath = path.join(source, item) + + fs.moveSync(tgzPath, path.join('tgzs', item), { overwrite: true }) + } + }) +} + +utils.logGreen(`npm run release:vue${isVue2 ? 2 : 3} done.`) diff --git a/internals/cli/src/commands/sync/sync-icons.ts b/internals/cli/src/commands/sync/sync-icons.ts new file mode 100644 index 000000000..1d4723658 --- /dev/null +++ b/internals/cli/src/commands/sync/sync-icons.ts @@ -0,0 +1,98 @@ +/** + * 初始化/创建 ICON 组件,从 @opentiny/vue-theme/svgs 中提取 SVG 图标创建对应的 ICON 组件 + */ +const path = require('path') +const fs = require('fs-extra') +const utils = require('./utils') +const semver = require('semver') +const { EOL } = require('os') +const handlebarsRender = require('./handlebars.render') + +const svgRE = /\.svg$/ +const svgDir = utils.pathJoin('..', 'node_modules', '@opentiny', 'theme', 'svgs') +const iconDir = utils.pathJoin('..', 'packages', 'icon') +const packageJson = 'package.json' +const templatePath = utils.pathJoin('..', 'template') + +// 检查是否按照依赖包 +if (!fs.existsSync(svgDir)) { + utils.logYellow(`The @opentiny/vue-theme is not exist , please npm install @opentiny/vue-theme.`) +} + +// 是否包含 package/icon 目录 +if (!fs.existsSync(iconDir)) { + fs.mkdirSync(iconDir) + + const version = utils.getopentinyVersion() + const iconTemplate = fs.readJSONSync(path.join(templatePath, 'component', packageJson)) + + // 删除多余的依赖 + if (iconTemplate.dependencies) { + delete iconTemplate.dependencies['@opentiny/vue-renderless'] + } + + const packageContent = handlebarsRender({ + template: JSON.stringify(iconTemplate), + data: { + NAME: 'icon', + MINOR: semver.minor(version) + }, + delimiter: ['\\[\\[', '\\]\\]'] + }) + + fs.writeFileSync(path.join(iconDir, packageJson), packageContent) +} + +const exportComponents = [] +const exportIcons = [] +const componentTemplate = fs.readFileSync(path.join(templatePath, 'icon', 'index.ts'), { encoding: 'utf8' }) + +// 根据 @opentiny/vue-theme/svgs 中的 svg 图片创建对应的 icon 组件 +fs.readdirSync(svgDir).forEach((fileName) => { + if (svgRE.test(fileName)) { + const svgName = fileName.replace(svgRE, '') + const iconPath = path.join(iconDir, svgName) + + if (!fs.existsSync(iconPath)) { + fs.mkdirSync(iconPath) + + const iconName = utils.capitalizeKebabCase(svgName) + const fullIconName = `Icon${iconName}` + const iconEntryContent = handlebarsRender({ + template: componentTemplate, + data: { + CNAME: iconName, + SNAME: fileName + }, + delimiter: ['\\[\\[', '\\]\\]'] + }) + + fs.writeFileSync(path.join(iconPath, 'index.ts'), utils.prettierFormat({ str: iconEntryContent })) + + exportComponents.push(`import ${fullIconName} from './${svgName}'`) + exportIcons.push(fullIconName) + } + } +}) + +if (exportComponents.length) { + fs.writeFileSync( + path.join(iconDir, 'index.ts'), + utils.prettierFormat({ + str: `${exportComponents.join(EOL)} + + export { + ${exportIcons.join(',' + EOL)} + } + + export default { + ${exportIcons.join(',' + EOL)} + } + ` + }) + ) + + utils.logGreen('npm run create:icon done.') +} else { + utils.logRed('npm run create:icon fail.') +} diff --git a/internals/cli/src/config/vite.ts b/internals/cli/src/config/vite.ts new file mode 100644 index 000000000..c3de9a989 --- /dev/null +++ b/internals/cli/src/config/vite.ts @@ -0,0 +1,84 @@ +import path from 'node:path' +import { searchForWorkspaceRoot } from 'vite' +import { getAllModules } from '../shared/module-utils.js' + +const workspaceRoot = searchForWorkspaceRoot(process.cwd()) +const pathFromWorkspaceRoot = (...args) => path.resolve(workspaceRoot, ...args) + +const getComponentAlias = (alias = {}) => { + getAllModules(false).forEach((item) => { + if (item.type === 'component') + alias[item.importName] = pathFromWorkspaceRoot('packages', item.path) + }) + return alias +} + +const getAlias = (vueVersion: string | number, theme = '') => { + const ns = (t: string) => t ? '-' + t : '' + + return { + // 主模块映射 + // vite 4 不支持 exports 语法自动拼接 index 文件 https://github.com/vitejs/vite/issues/7267 + '@opentiny/vue-icon$': pathFromWorkspaceRoot(`packages/vue-icon${ns(theme)}/index.ts`), + '@opentiny/vue-icon': pathFromWorkspaceRoot(`packages/vue-icon${ns(theme)}/src`), + '@opentiny/vue-renderless': pathFromWorkspaceRoot('packages/renderless/src'), + '@opentiny/vue-theme-mobile': pathFromWorkspaceRoot('packages/theme-mobile/src'), + '@opentiny/vue-theme': pathFromWorkspaceRoot(`packages/theme${ns(theme)}/src`), + '@opentiny/vue-common': pathFromWorkspaceRoot('packages/vue-common/src'), + '@opentiny/vue-locale': pathFromWorkspaceRoot('packages/vue-locale/src'), + + // 虚拟映射 + 'virtual:locale/vue': pathFromWorkspaceRoot(`packages/vue-locale/src/vue${vueVersion}/index`), + 'virtual:common/adapter/vue': pathFromWorkspaceRoot(`packages/vue-common/src/adapter/vue${vueVersion}/index`), + // examples 映射 + '@opentiny/vue-mobile-first-example/docs': pathFromWorkspaceRoot('examples/docs/components/mobile-first'), + '@opentiny/vue-mobile-example/docs': pathFromWorkspaceRoot('examples/docs/components/mobile'), + '@opentiny/vue-example/docs': pathFromWorkspaceRoot('examples/docs/components/pc'), + ...getComponentAlias(), + } +} + +const createContainer = (klass, defaultTitle) => { + return [ + klass, + { + render(tokens, idx) { + const token = tokens[idx] + const info = token.info.trim().slice(klass.length).trim() + + if (token.nesting === 1) + return `

${info || defaultTitle}

\n` + + return '
\n' + }, + }, + ] +} + +const getOptimizeDeps = (vueVersion: string | number) => { + return { + include: [ + 'shepherd.js', + 'echarts/core', + 'echarts/components', + 'echarts/charts', + 'echarts/extension/bmap/bmap', + 'echarts/features', + 'echarts/renderers', + 'echarts-wordcloud', + 'echarts', + 'crypto-js/core', + 'crypto-js/sha256.js', + 'crypto-js/lib-typedarrays.js', + 'streamsaver', + vueVersion === 2 ? '@vue/babel-helper-vue-jsx-merge-props' : '' + ].filter(item => !!item) + } +} + +export { + pathFromWorkspaceRoot, + getAlias, + createContainer, + getOptimizeDeps, +} diff --git a/internals/cli/src/index.ts b/internals/cli/src/index.ts new file mode 100644 index 000000000..9d9b4a60a --- /dev/null +++ b/internals/cli/src/index.ts @@ -0,0 +1,39 @@ +#!/usr/bin/env node +import { Command, Option } from 'commander' +import { buildUi, buildEntry, buildRuntime } from './commands/build/index.js' + +const program = new Command() + +// program +// .command('create') +// .description('创建一个组件模板或配置文件') +// .option('-t --type ', `创建类型,可选值:${CREATE_SUPPORT_TYPES.join(', ')}`, validateCreateType) +// .option('-e --env ', '环境,可选值:dev, prod') +// .option('--ignore-parse-error', '忽略解析错误', false) +// .option('--cover', '覆盖原文件', false) +// .action(create) + +program + .command('build:entry') + .description('生成组件库入口') + .action(buildEntry) + +program + .command('build:ui') + .description('打包组件库') + .argument('[names...]', '构建指定组件,如 button alert;不指定则构建全量组件') + .addOption(new Option('-v --vue-versions ', '目标框架,默认所有').choices(['2', '2.7', '3'])) + .addOption(new Option('-f --formats ', '目标格式,默认 ["es"]').choices(['es', 'cjs'])) + .option('-s, --scope ', 'npm scope,默认是 opentiny,会以 @opentiny 发布到 npm') + .option('-c, --clean', '清空构建目录') + .option('--no-dts', '不生成 dts') + .action(buildUi) + +program + .command('build:runtime') + .description('打包组件 runtime 包') + .addOption(new Option('-v --vue-versions ', '目标框架,默认所有').choices(['2', '2.7', '3'])) + .option('-m, --min', '是否压缩输出文件', false) + .action(buildRuntime) + +program.parse() diff --git a/internals/cli/src/shared/config.ts b/internals/cli/src/shared/config.ts new file mode 100644 index 000000000..c41515ff0 --- /dev/null +++ b/internals/cli/src/shared/config.ts @@ -0,0 +1,20 @@ +const EXTENERAL = [ + 'vue', + 'axios', + 'echarts', + 'echarts-liquidfill', + 'echarts-wordcloud', + '@vue/composition-api', + '@opentiny/vue-renderless', + '@originjs/fluent-editor', + 'streamsaver', + 'shepherd.js' +] +const external = (deps) => { + return ( + EXTENERAL.includes(deps) || + /^@opentiny[\\/]|@originjs|echarts|cropperjs|crypto-js/.test(deps) + ) +} + +export { external } diff --git a/internals/cli/src/shared/module-utils.ts b/internals/cli/src/shared/module-utils.ts new file mode 100644 index 000000000..897632e2d --- /dev/null +++ b/internals/cli/src/shared/module-utils.ts @@ -0,0 +1,506 @@ +/** + * 专门用于 modules.json 配置的通用方法 + * modules.json 作为单组件的清单列表,记录组件类型、路径、是否排除引用、仅支持某种[pc/mobile/mobile-first]模式等 + */ +import * as fs from 'fs-extra' +import path from 'node:path' +import { createRequire } from 'node:module' +import fg from 'fast-glob' +import * as utils from './utils' + +const require = createRequire(import.meta.url) +const moduleMap = require(utils.pathFromWorkspaceRoot('packages/modules.json')) + +type mode = 'pc' | 'mobile' | 'mobile-first' + +export interface Module { + /** 源码路径,如 vue/src/button/index.ts */ + path: string + /** 模块类型,可选 component, template, module */ + type: 'component' | 'template' | 'module' + /** 是否排除构建,例如组件尚未开发完,设置 true */ + exclude?: boolean + /** 组件类型支持的模式 */ + onlyMode?: mode[] + /** 模块名称,如 Button */ + name: string + /** 模块构建物路径,如 vue/button/lib/index */ + libPath: string + /** 模块名,如 @opentiny/vue/vue/lib/button/src,@deprecated */ + libName?: string + /** 模块的npm包名,如 @opentiny/vue-button */ + importName: string + /** 构建物文件名,@deprecated */ + tmpName?: string + /** 全局变量名,如 TinyButton */ + global?: string + /** 组件名的大写形态,如 Button */ + UpperName?: string + /** 组件名的小写形态,如 button */ + LowerName?: string + /** 模块的路径 */ + parentDir?: string[] +} + +/** + * 获取所有模块,并排序、格式化 + * @param {Boolean} isSort 是否需要排序 + * @returns 模块对象 + */ +const getAllModules = (isSort) => { + return getSortModules({ filterIntercept: () => true, isSort }) +} + +/** + * 获取所有组件,并排序、格式化 + * @param {Boolean} isSort 是否需要排序 + * @param {Boolean} hasModuleType 是否包含特殊模块(common、locale、icon) + * @returns 组件对象 + */ +const getComponents = (isSort = true, hasModuleType = false) => { + const moduleTyps = ['component'] + + hasModuleType && moduleTyps.push('module') + + return getSortModules({ + filterIntercept: (item) => moduleTyps.includes(item.type), + isSort + }) +} + +/** + * @param {String} key 根据模块对象的 Key 获取对应的值 + * @returns 模块对象 + */ +const getModuleInfo = (key) => { + return moduleMap[key] || {} +} + +/** + * 根据组件名称查找模块列表 + * @param {String} name 组件名称 + * @param {Boolean} inversion 是否取反 + * @param {Boolean} isOriginal 是否取原始数据 + * @param {Boolean} isSort 是否需要排序 + */ +const getByName = ({ name, inversion = false, isOriginal = false, isSort = true }) => { + const callback = (item) => { + const result = new RegExp(`/${name}/|^vue-${name}/`).test(item.path) + return inversion ? !result : result + } + + return isOriginal ? getModules(callback) : getSortModules({ filterIntercept: callback, isSort }) +} + +/** + * 根据指定条件搜索原始模块列表 + * @private + * @param {Function} filterIntercept 搜索条件 + */ +const getModules = (filterIntercept) => { + let modules = {} + + if (typeof filterIntercept === 'function') { + for (const key in moduleMap) { + const component = moduleMap[key] + + if (filterIntercept(component) === true && component.exclude !== true) { + modules[key] = component + } + } + } else { + modules = moduleMap + } + + return modules +} + +/** + * 根据指定条件搜索模块列表,并排序与生成必要字段 + * @private + * @param {Function} filterIntercept 搜索条件 + * @param {Boolean} isSort 是否需要排序 + */ +const getSortModules = ({ filterIntercept, isSort = true }) => { + let modules: Module[] = [] + let componentCount = 0 + const importName = '@opentiny/vue' + Object.entries(moduleMap).forEach(([key, module]) => { + let component = module as Module + component.name = key + // filterIntercept过滤筛选命令行传过来的组件名称,只输出命令行传递过来的组件 + if (filterIntercept(component) === true && component.exclude !== true) { + const dirs = component.path.split('/') + + // 这段逻辑暂时没有用到 + const componentName = dirs.slice(1, dirs.indexOf('src')) + // UpperName: Todo + component.UpperName = utils.capitalizeKebabCase(componentName.pop()) + + // LowerName: todo + component.LowerName = utils.kebabCase({ str: component.UpperName }) + + // 工程的父文件夹 + component.parentDir = componentName + + // libPath: 'packages/todo/dist/pc.ts' 组件输出路径 + component.libPath = component.path + .replace('vue/src/', 'packages/') + .replace('vue-common/src/', 'packages/common/') + .replace('vue-locale/src/', 'packages/locale/') + .replace('vue-icon/src/', 'packages/icon/') + .replace('/index.ts', '/src/index.js') + .replace('/src/', '/dist/lib/') + .replace('.vue', '.js') + + // libName: '@opentiny/vue/todo/pc' + component.libName = component.libPath + .replace('packages/', '') + .replace('/index', '') + .replace('.js', '') + .replace('/dist/', '/') + .replace(/\/lib$/, '') + + // 处理子目录 + if (componentName.length) { + component.libName = component.libName.replace(componentName.join('/'), '').replace(/^\//, '') + } + + // importName: '@opentiny/vue-tag/pc' + component.importName = importName + '-' + component.libName + + // libName: '@opentiny/vue/todo/pc' + component.libName = importName + '/' + component.libName + + // tmpName: 'pc' + component.tmpName = component.libPath.replace('.ts', '').split('/').slice(-1)[0] + + // global: 'TinyTodoPc' + component.global = 'Tiny' + key + + component.importName = `@opentiny/vue-${utils.kebabCase({ str: key })}` + + // "vue-common/src/index.ts" ==> "vue-common/lib/index" + if (component.type === 'module') { + component.libPath = component.path.replace('/src/', '/lib/').replace('index.ts', 'index') + } + + // "vue/src/button/index.ts" ==> "button/lib/index" + if (component.type === 'component') { + component.libPath = component.path.replace('vue/src/', '').replace('/index.ts', '/lib/index') + } + + // "vue/src/button/src/mobile-first.vue" ==> "button/lib/mobile-first" + if (component.type === 'template') { + component.libPath = component.path.replace('vue/src/', '').replace('/src/', '/lib/').replace(/\..+$/, '') + } + + modules.push(component) + } + + component.type === 'component' && componentCount++ + }) + + return isSort ? quickSort({ sortData: modules }) : modules +} + +/** + * 将模块数组按字母的 ASCII 值进行排序(目前只支持16位字母排序) + * @private + * @param {Array|Object} sortData 模块数组 + * @param {String} key 排序字段 + * @param {String} returnType 返回类型 Array|Object + * @returns 排序后的数组或对象 + */ +const quickSort = ({ sortData, key = 'name', returnType = 'array' }) => { + const maxNumberLength = 59 + let indexArr = [] + const setIndex = getFuncSetIndex(key, maxNumberLength, indexArr) + const arrayToObject = getFuncArrayToObject(key) + + isArraySortData(sortData, setIndex) + isNotArrayObject(sortData, key, setIndex) + + const ret = isNotArrayNotObject(sortData) + + if (ret.flag) return ret.result + + const sortArray = getFuncSortArray() + + return returnType === 'array' ? sortArray(indexArr) : arrayToObject(sortArray(indexArr)) +} + +function getFuncSortArray() { + const sortArray = (arr) => { + if (Array.isArray(arr) && arr.length > 1) { + const middleIndex = Math.floor(arr.length / 2) + const middleValue = arr.splice(middleIndex, 1)[0] + const leftArr = [] + const rightArr = [] + + for (let i = 0, len = arr.length; i < len; i++) { + const left = arr[i].priority1 - middleValue.priority1 + const isLeft = computeIsLeft({ arr, i, left, middleValue }) + + pushArr({ arr, i, isLeft, left, leftArr, rightArr }) + } + + return sortArray(leftArr).concat([middleValue], sortArray(rightArr)) + } else { + return arr + } + } + + return sortArray +} + +function pushArr({ arr, i, isLeft, left, leftArr, rightArr }) { + if (left < 0 || isLeft) { + leftArr.push(arr[i]) + } else { + rightArr.push(arr[i]) + } +} + +function computeIsLeft({ arr, i, left, middleValue }) { + const right = arr[i].priority2 - middleValue.priority2 + const right2 = arr[i].priority3 - middleValue.priority3 + const right3 = arr[i].priority4 - middleValue.priority4 + + let isLeft = false + + if (left === 0) { + if (right < 0 || (right === 0 && right2 < 0) || (right === 0 && right2 === 0 && right3 < 0)) { + isLeft = true + } + } + + return isLeft +} + +function getFuncArrayToObject(key) { + const arrayToObject = (arr) => { + const sortObj = {} + + for (let i = 0, len = arr.length; i < len; i++) { + if (arr[i].__real_value) { + sortObj[arr[i][key]] = arr[i].__real_value + } else { + delete arr[i].priority + delete arr[i].priority1 + delete arr[i].priority2 + delete arr[i].priority3 + delete arr[i].priority4 + + sortObj[arr[i][key]] = arr[i] + + delete sortObj[arr[i][key]][key] + } + } + + return sortObj + } + + return arrayToObject +} + +function getFuncSetIndex(key, maxNumberLength, indexArr) { + const setIndex = (obj) => { + // 一个字母用3位数代替,没有达到3位用0填充到前面,为了减少差值,在前面设置1 + const priority = + '1' + + obj[key] + .split('') + .map((chart) => (chart.charCodeAt() + '').padStart(3, '0')) + .join('') + .padEnd(maxNumberLength, '0') + .substr(0, maxNumberLength) + + // 分段比较 (javascript 超过15位比较失效) + obj.priority1 = +priority.substr(0, 15) + obj.priority2 = +priority.substr(15, 30) + obj.priority3 = +priority.substr(30, 45) + obj.priority4 = +priority.substr(45, maxNumberLength) + + obj.priority = priority + + indexArr.push(obj) + } + + return setIndex +} + +const isArraySortData = (sortData, setIndex) => { + if (Array.isArray(sortData)) { + sortData.forEach(setIndex) + } +} + +const isNotArrayObject = (sortData, key, setIndex) => { + if (!(Array.isArray(sortData)) && typeof sortData === 'object') { + for (const sortKey in sortData) { + const dataItem = sortData[sortKey] + let sortItem = {} + + if (typeof dataItem !== 'object') { + sortItem.__real_value = dataItem + } else { + sortItem = { + ...sortData[sortKey] + } + } + + sortItem[key] = sortData[key] || sortKey + setIndex(sortItem) + } + } +} + +const isNotArrayNotObject = (sortData) => { + const ret = { flag: false, result: null } + + if (!(Array.isArray(sortData)) && !(typeof sortData === 'object')) { + ret.flag = true + ret.result = sortData + } + + return ret +} + +/** + * 获取移动端组件 + * @param {Boolean} isSort 是否需要排序 + * @returns 组件集合 + */ +const getMobileComponents = (isSort = true) => { + const modules = getAllModules(isSort) + const componentNames = modules.filter((item) => item.tmpName.includes('mobile')).map((item) => item.UpperName) + + const components = modules.filter( + (item) => + (item.onlyMode && item.onlyMode.includes('mobile')) || + (item.type === 'component' && componentNames.includes(item.UpperName)) + ) + + return components +} + +/** + * 获取 PC 端组件 + * @param {Boolean} isSort 是否需要排序 + * @param {Boolean} hasModuleType 是否包含特殊模块(common、locale、icon) + * @returns 组件集合 + */ +const getPcComponents = (isSort = true, hasModuleType = false) => { + const modules = getAllModules(isSort) + const moduleTyps = ['component'] + + hasModuleType && moduleTyps.push('module') + + const components = modules.filter( + (item) => moduleTyps.includes(item.type) && (!item.onlyMode || item.onlyMode.includes('pc')) + ) + + return components +} + +/** + * 获取模块项的模块 + * @param {String} componentName 组件名称(大写,例如:img-preview) + * @param {Oject} newObj 新增对象 + * @param {Boolean} isMobile 是否为移动组件 + * @returns 模块对象 + */ +export const addModule = ({ componentName, templateName, newObj = {}, isMobile = false }) => { + const isEntry = templateName.endsWith('index') + return { + path: `vue/src/${componentName}/` + (isEntry ? `${templateName}.ts` : `src/${templateName}.vue`), + type: isEntry ? 'component' : 'template', + exclude: false, + // onlyMode: isMobile ? 'mobile' : 'all', + ...newObj + } +} + +/** + * 将输入的 Map 写入到 modules.json 文件中,并格式化 + * @param {String|Object} moduleMap 模块 Json 对象集合或 Json 字符串 + */ +export const writeModuleMap = (moduleMap) => { + fs.writeFileSync( + utils.pathFromWorkspaceRoot('packages/modules.json'), + utils.prettierFormat({ + str: typeof moduleMap === 'string' ? moduleMap : JSON.stringify(moduleMap), + options: { + parser: 'json', + printWidth: 10 + } + }) + ) +} + +/** + * 读取 modules.json 中的模块信息 + * @returns 模块对象 + */ +export const readModuleMap = () => moduleMap || {} + +/** + * 动态创建 modules.json ,适配新建组件 + * @param {String} componentName 组件名称 (驼峰大写:img-preview) + * @param {Boolean} isMobile 是否为移动组件 + */ +const createModuleMapping = (componentName, isMobile = false) => { + const upperName = utils.capitalizeKebabCase(componentName) + + // 生成 modules.json 文件 + moduleMap[upperName] = addModule({ + isMobile, + componentName + }) + + const moduleJson = quickSort({ sortData: moduleMap, returnType: 'object' }) + + fs.writeJsonSync( + utils.pathJoin('..', 'modules.json'), + utils.prettierFormat({ + str: JSON.stringify(moduleJson), + options: { + parser: 'json', + printWidth: 10 + } + }) + ) +} + +const getAllIcons = () => { + const entries = fg.sync('vue-icon*/src/*', { cwd: utils.pathFromWorkspaceRoot('packages'), onlyDirectories: true }) + + return entries.map(item => { + const name = path.basename(item) + + return { + path: item + '/index.ts', + libPath: item.replace('/src/', '/lib/') + '.js', + type: 'component', + componentType: 'icon', + name: utils.kebabCase({ str: name }), + global: utils.capitalizeKebabCase(name), + importName: '@opentiny/vue-' + item, + } as Module + }) +} + +export { + getByName, + quickSort, + getModules, + getAllModules, + getComponents, + getModuleInfo, + getSortModules, + getPcComponents, + createModuleMapping, + getMobileComponents, + getAllIcons, +} diff --git a/internals/cli/src/shared/runtime-utils.ts b/internals/cli/src/shared/runtime-utils.ts new file mode 100644 index 000000000..08f1d699b --- /dev/null +++ b/internals/cli/src/shared/runtime-utils.ts @@ -0,0 +1,317 @@ +/** + * 打包运行时通用配置 + * + * 全量运行时(组件分组) + * 运行时版本号 + * 运行时外部依赖路径 + */ +const fs = require('fs-extra') +const { getVersion, pathJoin, getComponentVersion } = require('./utils') +const moduleUtils = require('./module-utils') + +const runtimeComponents = { + core: [ + 'Common', + 'Icon', + 'Locale', + 'Alert', + 'Col', + 'Container', + 'DialogBox', + 'Layout', + 'Loading', + 'Popover', + 'Row', + 'Tooltip', + 'Carousel', + 'CarouselItem', + 'Collapse', + 'CollapseItem', + 'Split', + 'TimeLine', + 'Milestone', + 'Floatbar', + 'Steps', + 'TabItem', + 'Tabs', + 'Breadcrumb', + 'BreadcrumbItem', + 'FallMenu', + 'NavMenu', + 'Rate', + 'Tag', + 'Notify', + 'Image', + 'ImageViewer', + 'ScrollText', + 'Scrollbar', + 'UserHead', + 'SlideBar', + 'Slider', + 'Link', + 'Progress', + 'Crop', + 'RichText' + ], + base: [ + 'Autocomplete', + 'BulletinBoard', + 'Button', + 'ButtonGroup', + 'Calendar', + 'Cascader', + 'CascaderMenu', + 'CascaderNode', + 'CascaderPanel', + 'Checkbox', + 'CheckboxButton', + 'CheckboxGroup', + 'DatePanel', + 'DatePicker', + 'DateRange', + 'DateTable', + 'DetailPage', + 'DropTimes', + 'FileUpload', + 'Form', + 'FormItem', + 'Grid', + 'GridColumn', + 'GridManager', + 'GridToolbar', + 'Input', + 'IpAddress', + 'LinkMenu', + 'Modal', + 'MonthRange', + 'MonthTable', + 'Numeric', + 'Option', + 'OptionGroup', + 'Pager', + 'PagerItem', + 'Picker', + 'PopUpload', + 'Popeditor', + 'Radio', + 'RadioButton', + 'RadioGroup', + 'Search', + 'Select', + 'SelectDropdown', + 'Switch', + 'Table', + 'TextPopup', + 'Time', + 'TimePanel', + 'TimePicker', + 'TimeRange', + 'TimeSelect', + 'TimeSpinner', + 'ToggleMenu', + 'Transfer', + 'TransferPanel', + 'Tree', + 'TreeMenu', + 'Upload', + 'UploadDragger', + 'UploadList', + 'YearTable' + ], + business: [ + 'Amount', + 'Area', + 'Company', + 'Country', + 'Dept', + 'Espace', + 'Hrapprover', + 'Locales', + 'LogonUser', + 'Logout', + 'Roles', + 'User', + 'UserAccount', + 'UserLink', + 'UserContact', + 'Wizard', + 'Currency', + 'DropRoles' + ], + chart: [ + 'BaiduMap', + 'ChartBar', + 'ChartCandle', + 'ChartCore', + 'ChartFunnel', + 'ChartGauge', + 'ChartWaterfall', + 'ChartGraph', + 'ChartHeatmap', + 'ChartHistogram', + 'ChartLine', + 'ChartMap', + 'ChartPie', + 'ChartRadar', + 'ChartRing', + 'ChartSankey', + 'ChartScatter', + 'ChartSunburst', + 'ChartTree', + 'Chart', + 'ChartBoxplot' + ], + external: [ + 'CardTemplate', + 'SvgIcon', + 'AutonaviMap', + 'ChartWordcloud', + 'ChartLiquidfill' + ] +} + +const echartsVersion = getVersion({ name: 'echarts' }) +const echartsSource = 'lib/echarts.min.js' + echartsVersion +const dependencies = { + vue: 'node_modules/vue/dist/vue.min.js', + 'vue-i18n': 'node_modules/vue-i18n/dist/vue-i18n.min.js', + axios: 'node_modules/axios/dist/axios.min.js', + 'axios-mock-adapter': 'node_modules/axios-mock-adapter/dist/axios-mock-adapter.min.js', + '@vue/composition-api': 'node_modules/@vue/composition-api/dist/vue-composition-api.prod.js', + echarts: 'node_modules/echarts/dist/echarts.min.js', + cropperjs: 'node_modules/cropperjs/dist/cropper.min.js', + vue3: 'example/node_modules/vue/dist/vue.global.prod.js', + 'vue3-i18n': 'example/node_modules/vue-i18n/dist/vue-i18n.global.js', + systemjs: 'node_modules/@opentiny/systemjs/dist/system.min.js', + 'es6-promise': 'node_modules/es6-promise/dist/es6-promise.auto.min.js' +} + +const runtimeDeps = { + base: { + vue: 'lib/vue.min.js' + getVersion({ name: 'vue' }), + axios: 'lib/axios.min.js' + getVersion({ name: 'axios' }), + 'vue-i18n': 'lib/vue-i18n.min.js' + getVersion({ name: 'vue-i18n' }) + }, + opentiny: {}, + tiny3Lib: { + '@vue/composition-api': 'lib/vue-composition-api.prod.js' + getVersion({ name: '@vue/composition-api' }), + echarts: echartsSource, + 'echarts/lib/echarts': echartsSource, + 'echarts/lib/chart/bar': echartsSource, + 'echarts/lib/chart/boxplot': echartsSource, + 'echarts/lib/chart/candlestick': echartsSource, + 'echarts/lib/chart/chord': echartsSource, + 'echarts/lib/chart/custom': echartsSource, + 'echarts/lib/chart/effectScatter': echartsSource, + 'echarts/lib/chart/funnel': echartsSource, + 'echarts/lib/chart/gauge': echartsSource, + 'echarts/lib/chart/graph': echartsSource, + 'echarts/lib/chart/heatmap': echartsSource, + 'echarts/lib/chart/line': echartsSource, + 'echarts/lib/chart/lines': echartsSource, + 'echarts/lib/chart/map': echartsSource, + 'echarts/lib/chart/parallel': echartsSource, + 'echarts/lib/chart/pictorialBar': echartsSource, + 'echarts/lib/chart/pie': echartsSource, + 'echarts/lib/chart/radar': echartsSource, + 'echarts/lib/chart/sankey': echartsSource, + 'echarts/lib/chart/scatter': echartsSource, + 'echarts/lib/chart/sunburst': echartsSource, + 'echarts/lib/chart/themeRiver': echartsSource, + 'echarts/lib/chart/tree': echartsSource, + 'echarts/lib/chart/treemap': echartsSource, + 'echarts/lib/component/legend': echartsSource, + 'echarts/lib/component/tooltip': echartsSource, + 'echarts/lib/component/dataZoom': echartsSource, + 'echarts/lib/component/visualMap': echartsSource, + quill: 'lib/quill.min.js' + getVersion({ name: 'quill' }), + cropperjs: 'lib/cropper.min.js' + getVersion({ name: 'cropperjs' }) + } +} + +const getAllDeps = () => { + return getPartDeps(Object.keys(runtimeDeps)) +} + +const getAllComponents = (isVue2 = false) => { + const componentMap = moduleUtils.getPcComponents(true, true) + const renderlessVersion = getVersion({ name: '@opentiny/vue-renderless', isVue2: false }) // 只发布 4.x + const systemMap = { + '@opentiny/vue-renderless-common': 'tiny/renderless.js' + renderlessVersion + } + + for (let i = 0, len = componentMap.length; i < len; i++) { + const libName = componentMap[i].LowerName + const version = getComponentVersion({ name: libName, isVue2 }) + + systemMap[componentMap[i].importName] = 'tiny/ui/' + libName + '.js' + version + } + + return systemMap +} + +const getPartDeps = (keys = []) => { + const tempDeps = {} + + for (let key in runtimeDeps) { + keys.includes(key) && Object.assign(tempDeps, runtimeDeps[key]) + } + + return tempDeps +} + +const getFullRuntimeDeps = (isVue2) => { + return Object.assign({}, getAllDeps(), getAllComponents(isVue2)) +} + +const getComponentRuntimeDeps = (isVue2) => { + return Object.assign({}, getPartDeps(['theme', 'tiny3Lib', 'tiny3Component']), getAllComponents(isVue2)) +} + +const getFullRuntime = (name) => { + const arr = typeof name === 'string' ? [name] : name || Object.keys(runtimeComponents) + + return [].concat(...arr.map((key) => runtimeComponents[key])) +} + +/** + * 提取 @opentiny/vue-renderless 中的公共代码,打成独立包(避免组件运行不正常) + */ +const getRenderlessExports = () => { + const RENDERLESS_PATH = pathJoin('..', 'node_modules', '@opentiny', 'renderless', 'common', 'runtime.js') + + let EXTERNAL_RENDERLESS = [] + + // 获取需要排除的依赖 + if (fs.existsSync(RENDERLESS_PATH)) { + const runtime_export = fs.readFileSync(RENDERLESS_PATH).toString('UTF-8') + + EXTERNAL_RENDERLESS = runtime_export.match(/import(.*)from(.*)/g) || [] + + EXTERNAL_RENDERLESS = EXTERNAL_RENDERLESS.map((item) => { + let moduleLine = item.replace(/^import\s+/g, '').split(/\s+from\s+/) + + return { + libraryName: moduleLine.pop().replace(/'/g, '').replace(';', ''), + exportName: moduleLine.pop().split(/\s/).pop() + } + }) + } + + return { + EXTERNAL_RENDERLESS, + RENDERLESS_PATH + } +} + +module.exports = { + dependencies, + getAllDeps, + getPartDeps, + getFullRuntime, + getAllComponents, + getFullRuntimeDeps, + getRenderlessExports, + getComponentRuntimeDeps, + getExternalComponents: () => runtimeComponents.external +} diff --git a/internals/cli/src/shared/utils.ts b/internals/cli/src/shared/utils.ts new file mode 100644 index 000000000..a09be9feb --- /dev/null +++ b/internals/cli/src/shared/utils.ts @@ -0,0 +1,517 @@ +import chalk from 'chalk' +import fs from 'fs-extra' +import { execSync } from 'node:child_process' +import path from 'node:path' +import semver from 'semver' +import prettier from 'prettier' +import { fileURLToPath } from 'node:url' +import { searchForWorkspaceRoot } from 'vite' + +const workspaceRoot = searchForWorkspaceRoot(process.cwd()) +const pathFromWorkspaceRoot = (...args) => path.resolve(workspaceRoot, ...args) + +const filename = fileURLToPath(import.meta.url) +const dirname = path.dirname(filename) + +/** + * 根据运行上下文获取路径(运行时打包用) + * @returns 文件绝对路径 + */ +const resolveCwd = (...args) => { + return path.join(process.cwd(), ...args) +} + +/** + * 获取模板替换路径(动态) + * @param {String} posixPath 路径 + * @returns 文件绝对路径 + */ +const assetsPath = (posixPath) => { + return path.posix.join('static', posixPath) +} + +/** + * 根据运行上下文获取,当前运行组件的名称 + * @returns 当前运行组件目录名称 + */ +const getComponentName = () => { + return process.cwd().split(path.sep).pop() +} + +/** + * 获取当前上下文的路径 + * @returns 文件绝对路径 + */ +const pathJoin = (...args) => { + return path.join(dirname, ...args) +} + +/** + * 获取用户输入命令参数 + * @returns 参数数组 + */ +const getInputCmd = () => { + const args: string[] = [] + const argv: string[] = process.argv || [] + + argv.forEach((item) => { + if (!item.includes(path.sep)) { + args.push(item) + } + }) + + return args +} + +/** + * 获取当前执行 cli 命令的工具:node\npm\yarn + * @returns node\npm\yarn + */ +const getCurrentCliTool = () => { + const npmExecpaths = process.env.npm_execpaths + + if (!npmExecpaths) return 'node' + + return npmExecpaths.substring(npmExecpaths.lastIndexOf(path.sep) + 1).replace(/.js|-cli/g, '') +} + +/** + * 执行 node 命令 + * @param {String} cmdStr 命令字符串 + */ +const execCmd = (cmdStr) => { + cmdStr && execSync(cmdStr, { stdio: 'inherit' }) +} + +/** + * 首字母大写 + * @param {String} str 字符串 + * @returns 字符串 + */ +const capitalize = (str) => { + return typeof str === 'string' ? str.slice(0, 1).toUpperCase() + str.slice(1) : str +} + +/** + * 首字母大写 + * @param {String} str 字符串 + * @returns 字符串 + */ +const capitalizeKebabCase = (str, splitChar = '-') => { + return typeof str === 'string' ? str.split(splitChar).map(capitalize).join('') : str +} + +/** + * @description 将驼峰字符串转化为以指定字符分割的小写字符串 + * @example kebabCase({ str : 'ImgPreviewItem' } ) + * @example 输出结果:img-preview-item + * + * @param str 字符串 + * @param splitChar 分隔符 + */ +const kebabCase = ({ str, splitChar = '-' }) => { + if (!str || typeof str !== 'string') return str + + return str + .split('') + .map((char, index) => { + const charCod = char.charCodeAt(0) + + if (charCod < 65 || charCod > 122) return char + + return (charCod >= 65 && charCod) <= 90 ? (index !== 0 ? splitChar : '') + char.toLowerCase() : char + }) + .join('') +} + +/** + * 采用 prettier 美化字符串 + * @param {String} str 格式字符 + * @param {Object} options 格式字符 + */ +const prettierFormat = ({ str, options = {} }) => { + return prettier.format( + str, + Object.assign( + { + printWidth: 120, + tabWidth: 2, + useTabs: false, + singleQuote: true, + semi: false, + trailingComma: 'none', + bracketSpacing: true, + quoteProps: 'preserve', + parser: 'typescript' + }, + options + ) + ) +} + +/** + * 扫描指定目录下面的组件目录 + * @param {String} dirPath 绝对路径 + * @param {Boolean} isDeep 是否深度遍历 + * @param {Function} fileFilter 文件筛选拦截函数 + * @param {Function} callback 遍历回调 + */ +const walkFileTree = ({ dirPath, isDeep = false, fileFilter, callback }) => { + if (!dirPath || typeof callback !== 'function') { + return + } + + const dirs = fs.readdirSync(path.isAbsolute(dirPath) ? dirPath : path.join(dirname, dirPath)) + + if (Array.isArray(dirs) && dirs.length > 0) { + dirs.forEach((file) => { + let isFind = true + const subPath = path.join(dirPath, file) + const isDirectory = fs.statSync(subPath).isDirectory() + + if (typeof fileFilter === 'function') { + isFind = fileFilter({ file, subPath, dirs, isDirectory }) === true + } + + if (isFind && isDirectory) { + if (isDeep) { + walkFileTree({ isDeep, dirPath: subPath, fileFilter, callback }) + return + } + } + + callback({ file, subPath, dirs, isDirectory }) + }) + } +} + +/** + * 获取指定包名的版本号 + * @param {String} name NPM 包名 + * @param {String} context 上下文 + * @param {Boolean} 是否为 vue2 环境 + * @returns 版本号 + */ +const getVersion = ({ name, context, isVue2 }) => { + return getComponentVersion({ name, context, dir: 'node_modules', isVue2 }) +} + +/** + * 获取指定包名的版本号 + * @param {String} name NPM 包名 + * @param {String} context 上下文 + * @param {String} dir 文件目录 + * @param {Boolean} 是否为 vue2 环境 + * @returns 版本号 + */ +const getComponentVersion = ({ name, context = '..', dir = 'packages', isOrigin = false, isVue2 }) => { + let version + const packageJSONPath = pathJoin(context, dir, name, 'package.json') + + if (fs.existsSync(packageJSONPath)) { + version = fs.readJsonSync(packageJSONPath).version + } else { + const packageJSON = getopentinyVersion({ key: 'full' }) + + version = (packageJSON.devDependencies || packageJSON.dependencies || {})[name] || packageJSON.version + } + + version = isOrigin ? version : '?v=' + version.replace(/[\^|~]/g, '') + + return getPublichVersion({ version, isVue2 }) +} + +/** + * 获取发布的实际版本号 + * + * @param {String} version 版本号 + * @param {Boolean} 是否为 vue2 环境 + * @returns + */ +const getPublichVersion = ({ version, isVue2 }) => { + if (isVue2) { + return version.replace(/^4/, '3').replace('?v=4', '?v=3') + } + + return version +} + +/** + * 获取指定包的版本号 + * @param {String} name 文件名|字段名 + * @param {Boolean} isRoot + * @param {Boolean} 是否为 vue2 环境 + * @returns 版本号 + */ +const getPackageVersion = ({ name, isRoot = false, isVue2 = false }) => { + let version = isRoot ? getopentinyVersion({ key: name }) : getComponentVersion({ name, isOrigin: true, isVue2 }) + + return getBigVersion(version) +} + +const getBigVersion = (version) => { + return `~${semver.major(version)}.${semver.minor(version)}.0` +} + +/** + * 获取组件的版本号 + * @param {String} name 文件名|字段名 + * @param {Boolean} 是否为 vue2 环境 + * @returns 版本号 + */ +const getComponentOriginVersion = ({ name, isVue2 }) => { + return getComponentVersion({ name, isOrigin: true, isVue2 }) +} + +/** + * 获取根目录 package.json 中的 version + * @param {String} 对象的 Key + * @param {Boolean} 是否为 vue2 环境 + * @returns 版本号 + */ +const getopentinyVersion = ({ key = 'version' }) => { + const packageJson = fs.readJsonSync(pathFromWorkspaceRoot('packages/vue/package.json')) + const packageJsonOption = packageJson[key] || packageJson + + return packageJsonOption +} + +/** + * 获取指定依赖的版本号 + */ +const getDependentVersion = ({ libraryName, packageJSON }) => { + const packageJson = packageJSON || getopentinyVersion({ key: 'all' }) + + packageJson.dependencies = packageJson.dependencies || {} + packageJson.devDependencies = packageJson.devDependencies || {} + + return packageJson.dependencies[libraryName] || packageJson.devDependencies[libraryName] +} + +/** + * 获取当前环境下 theme、theme-mobile、renderless + */ +const getInnerDependenciesVersion = ({ isTestEnv, tag, version }) => { + let themeVersion + let renderlessVersion + let themeMobileVersion + const themeCommonVersion = version.replace(/(4)(\.\d+\.\d+)/, '3$2') + + if (isTestEnv) { + renderlessVersion = tag + themeVersion = tag + themeMobileVersion = tag + } else { + themeVersion = themeCommonVersion + themeMobileVersion = themeCommonVersion + renderlessVersion = version.replace('3.22.', '4.22.') + } + + return { + themeVersion, + themeMobileVersion, + renderlessVersion + } +} + +/** + * 在控制台显示绿色提示 + * @param {String} 提示内容 + */ +const logGreen = (str) => { + /* eslint-disable no-console */ + console.log(chalk.green('### ' + str)) +} + +/** + * 在控制台显示黄色提示 + * @param {String} 提示内容 + */ +const logYellow = (str) => { + console.log(chalk.yellow('### ' + str)) +} + +/** + * 在控制台显示青色提示 + * @param {String} 提示内容 + */ +const logCyan = (str) => { + console.log(chalk.cyan('### ' + str)) +} + +/** + * 在控制台显示红色提示 + * @param {String} 提示内容 + */ +const logRed = (str) => { + console.log(chalk.red('### ' + str)) +} + +/** + * 根据运行上下文或者环境变量判断是否为 Vue2 环境 + */ +const isBuildForVue2 = () => { + return (process.env.VUE_VERSION || process.env.npm_lifecycle_event || 'vue2').includes('vue2') +} + +const getVueVersion = () => { + return parseFloat((process.env.VUE_VERSION || 'vue2').replace('vue', '')) +} + +/** + * 打包 Vue3 版本时 packageJson 文件 name dependencies 更改 @opentiny/vue 改为 @opentiny/vue3 + */ +const changePackageName = ({ packageJSON, isVue2 }) => { + if (!isVue2) { + packageJSON.name = packageJSON.name.replace(/^@opentiny\/vue(?!3)/, '@opentiny/vue3') + + for (const key in packageJSON.dependencies) { + if (/^@opentiny\/vue(?!3)/.test(key)) { + const version = packageJSON.dependencies[key] + + delete packageJSON.dependencies[key] + + packageJSON.dependencies[key.replace(/^@opentiny\/vue(?!3)/, '@opentiny/vue3')] = version + } + } + } +} + +/* + * 获取 opentiny 分组下指定包名、tag 名称的版本号 + */ +const getLiblaryTagVersion = ({ tag, name }) => { + const version = execSync(`npm v @opentiny/${name}@${tag} version`).toString('utf-8').replace(/\n/, '') + + if (tag === 'latest') { + return getBigVersion(version) + } + + return version.includes(tag) ? version : '' +} + +/* + * 获取发布 npm 包版本支持的 tag 类别数组 + */ +const getNpmTagArray = () => { + return ['alpha', 'beta', 'latest', 'next', 'echarts5', 'icsl', 'saas', 'mf'] +} + +const getBuildTag = ({ version }) => { + const tags = getNpmTagArray() + const inputArgs = (version || '').split('.') + let isTestEnv = false + let tag = 'latest' + + if (inputArgs.length) { + const versions = (inputArgs[2] || '').split('-') + + if (tags.includes(versions[1])) { + isTestEnv = true + tag = versions[1] + } + } + + return { isTestEnv, tag } +} + +/** + * 获取指定文件夹下所有文件的路径 + * @param {string} folderPath + * + * @return {Array} filesPath + */ +const getFilesPath = (folderPath) => { + let filesPath: string[] = [] + try { + let files = fs.readdirSync(folderPath) + files.forEach((file) => { + let tempPath = path.join(folderPath, file) + let stats = fs.statSync(tempPath) + + if (stats.isDirectory()) { + filesPath.push.apply(filesPath, getFilesPath(tempPath)) + } else { + filesPath.push(tempPath) + } + }) + } catch (e) { + console.warn('Path Error:' + folderPath) + return filesPath + } + + return filesPath +} + +/** + * 读取指定文件 filePath,并将文件中 regExpStr 匹配的片段用 targetStr 替换 + * @param {string} filePath + * @param {Array | RegExp} regExpStr + * @param {Array | string} targetStr + */ +const fragmentReplace = (filePath, regExpStr, targetStr) => { + let file = fs.readFileSync(filePath, 'utf8') + + if (Array.isArray(regExpStr) && Array.isArray(targetStr) && regExpStr.length === targetStr.length) { + targetStr.forEach((_, index) => { + file = file.replace(regExpStr[index], targetStr[index]) + }) + } else { + file = file.replace(regExpStr, targetStr) + } + + fs.writeFileSync(filePath, file, 'utf8') +} + +/** + * 读取指定文件 filePath,并将文件中 regExpStr 匹配的片段用 targetStr 替换 + * @param {Array} filesPath + * @param {Array | string} regExpStr + * @param {Array | string} targetStr + */ +const filesFragmentReplace = (folderPath, regExpStr, targetStr) => { + let filesPath = getFilesPath(folderPath) + + if (filesPath) { + filesPath.forEach((item) => { + fragmentReplace(item, regExpStr, targetStr) + }) + } +} + +export { + assetsPath, + capitalize, + capitalizeKebabCase, + changePackageName, + execCmd, + fragmentReplace, + filesFragmentReplace, + getopentinyVersion, + getComponentName, + getComponentOriginVersion, + getComponentVersion, + getCurrentCliTool, + getDependentVersion, + getFilesPath, + getInnerDependenciesVersion, + getInputCmd, + getLiblaryTagVersion, + getNpmTagArray, + getPackageVersion, + getPublichVersion, + getVersion, + isBuildForVue2, + kebabCase, + logCyan, + logGreen, + logRed, + logYellow, + pathJoin, + prettierFormat, + resolveCwd, + walkFileTree, + getBuildTag, + getVueVersion, + pathFromWorkspaceRoot, +} diff --git a/internals/cli/src/shared/vue-fragment.ts b/internals/cli/src/shared/vue-fragment.ts new file mode 100644 index 000000000..7134f8f1b --- /dev/null +++ b/internals/cli/src/shared/vue-fragment.ts @@ -0,0 +1,70 @@ +const fs = require('fs-extra') +const path = require('path') +const { filesFragmentReplace, logYellow, isBuildForVue2, logGreen } = require('./utils') + +const replaceVue3Type = process.env.REPLACE_VUE3_TYPE + +const pathFromWorkspaceRoot = (...args) => path.join(__dirname, '../..', ...args) + +if (replaceVue3Type === 'typings') { + if (isBuildForVue2()) { + const vue2Dir = pathFromWorkspaceRoot('packages/vue/dist-vue2') + + if (fs.existsSync(vue2Dir)) { + filesFragmentReplace(vue2Dir, [/"vue2/g], ['"vue']) + } + + const vue2demiDir = pathFromWorkspaceRoot('packages/vue/dist-vue2/vue-demi') + + if (fs.existsSync(vue2demiDir)) { + filesFragmentReplace( + vue2demiDir, + [ + /'virtual:common\/adapter\/vue'/g, + /'virtual:common\/types\/vue'/g, + /'virtual:locale\/vue'/g + ], + [ + "'./vue2'", + "'./types/vue2'", + "'./vue2'" + ] + ) + } else { + logYellow(`${vue2demiDir} does not exist.`) + } + + logGreen('[vue2] pnpm run dts-replace done.') + } else { + const vue3Dir = pathFromWorkspaceRoot('packages/vue/dist-vue3') + + if (fs.existsSync(vue3Dir)) { + filesFragmentReplace(vue3Dir, [/"vue3/g, /@opentiny\/vue-/g], ['"vue', '@opentiny/vue3-']) + } + + // 处理 Vue3-common TS + const vue3demiDir = path.resolve(vue3Dir, 'vue-demi') + + if (fs.existsSync(vue3demiDir)) { + filesFragmentReplace( + vue3demiDir, + [ + /'virtual:common\/adapter\/vue'/g, + /'virtual:common\/types\/vue'/g, + /'virtual:locale\/vue'/g + ], + [ + "'./vue3'", + "'./types/vue3'", + "'./vue3'" + ] + ) + } else { + logYellow(`${vue3demiDir} directory does not exist.`) + } + + logGreen('[vue3] pnpm run dts-replace done.') + } +} else { + filesFragmentReplace(pathFromWorkspaceRoot('packages/vue/dist-vue3'), /@opentiny\/vue(?!3)/g, '@opentiny/vue3') +} diff --git a/internals/cli/tsconfig.json b/internals/cli/tsconfig.json new file mode 100644 index 000000000..e9c3006c1 --- /dev/null +++ b/internals/cli/tsconfig.json @@ -0,0 +1,15 @@ +{ + "extends": "@vue/tsconfig/tsconfig.node.json", + "compilerOptions": { + "noImplicitAny": false, + "types": [ + "node", + "fs-extra" + ] + }, + "include": [ + "command/**/*.ts", + "config/**/*.ts", + "*.ts" + ] +} \ No newline at end of file diff --git a/internals/cli/tsup.config.ts b/internals/cli/tsup.config.ts new file mode 100644 index 000000000..ab36eb80e --- /dev/null +++ b/internals/cli/tsup.config.ts @@ -0,0 +1,29 @@ +import { defineConfig, type Options } from 'tsup' + +const shared: Options = { + entry: ['src/**/*.ts'], + splitting: false, + bundle: false, + // sourcemap: true, + clean: true, + target: 'node14', + platform: 'node', + dts: false, + publicDir: true +} + +export default defineConfig([ + { + format: ['esm'], + outDir: 'dist/esm', + outExtension: () => ({ js: '.js', }), + ...shared, + }, + { + format: ['cjs'], + outDir: 'dist/cjs', + shims: true, + outExtension: () => ({ js: '.js', }), + ...shared, + }, +]) diff --git a/internals/playwright-config/CHANGELOG.md b/internals/playwright-config/CHANGELOG.md new file mode 100644 index 000000000..9191b4d03 --- /dev/null +++ b/internals/playwright-config/CHANGELOG.md @@ -0,0 +1,8 @@ +# Change Log + +All notable changes to this project will be documented in this file. +See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + +## 1.0.1-beta.0 (2023-02-08) + +**Note:** Version bump only for package @opentiny-internal/playwright-config diff --git a/internals/playwright-config/package.json b/internals/playwright-config/package.json new file mode 100644 index 000000000..c17afd7f2 --- /dev/null +++ b/internals/playwright-config/package.json @@ -0,0 +1,15 @@ +{ + "name": "@opentiny-internal/playwright-config", + "private": true, + "type": "module", + "version": "1.0.1-beta.0", + "description": "", + "main": "src/index.js", + "module": "src/index.js", + "keywords": [], + "author": "", + "license": "ISC", + "dependencies": { + "@playwright/test": "^1.29.2" + } +} diff --git a/internals/playwright-config/src/index.js b/internals/playwright-config/src/index.js new file mode 100644 index 000000000..4a9ee5c2a --- /dev/null +++ b/internals/playwright-config/src/index.js @@ -0,0 +1,114 @@ +// import type { PlaywrightTestConfig } from '@playwright/test' +import { devices } from '@playwright/test' + +/** + * Read environment variables from file. + * https://github.com/motdotla/dotenv + */ +// require('dotenv').config(); + +/** + * See https://playwright.dev/docs/test-configuration. + */ +const Config = ({ testDir, port, autoStart = false }) => ({ + testDir, + /* Maximum time one test can run for. */ + timeout: 300 * 1000, + expect: { + /** + * Maximum time expect() should wait for the condition to be met. + * For example in `await expect(locator).toHaveText();` + */ + timeout: 10 * 1000 + }, + /* Fail the build on CI if you accidentally left test.only in the source code. */ + forbidOnly: !!process.env.CI, + /* Retry on CI only */ + retries: process.env.CI ? 2 : 0, + /* Opt out of parallel tests on CI. */ + workers: process.env.CI ? 1 : undefined, + /* Reporter to use. See https://playwright.dev/docs/test-reporters */ + reporter: 'html', + /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ + use: { + /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */ + actionTimeout: 0, + /* Base URL to use in actions like `await page.goto('/')`. */ + baseURL: `http://localhost:${port}`, + + /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ + trace: 'on-first-retry', + + /* Only on CI systems run the tests headless */ + headless: !!process.env.CI + }, + + /* Configure projects for major browsers */ + projects: [ + { + name: 'chromium', + use: { + ...devices['Desktop Chrome'] + } + }, + { + name: 'firefox', + use: { + ...devices['Desktop Firefox'] + } + }, + // { + // name: 'webkit', + // use: { + // ...devices['Desktop Safari'] + // } + // } + + /* Test against mobile viewports. */ + // { + // name: 'Mobile Chrome', + // use: { + // ...devices['Pixel 5'], + // }, + // }, + // { + // name: 'Mobile Safari', + // use: { + // ...devices['iPhone 12'], + // }, + // }, + + /* Test against branded browsers. */ + // { + // name: 'Microsoft Edge', + // use: { + // channel: 'msedge', + // }, + // }, + // { + // name: 'Google Chrome', + // use: { + // channel: 'chrome', + // }, + // }, + ], + + /* Folder for test artifacts such as screenshots, videos, traces, etc. */ + // outputDir: 'test-results/', + + /* Run your local dev server before starting the tests */ + webServer: autoStart ? + { + /** + * Use the dev server by default for faster feedback loop. + * Use the preview server on CI for more realistic testing. + Playwright will re-use the local server if there is already a dev-server running. + */ + command: process.env.CI ? `vite preview --port ${port}` : `vite dev --port ${port}`, + port, + reuseExistingServer: !process.env.CI + } + : undefined +}) + +export default Config diff --git a/internals/unplugin-virtual-template/CHANGELOG.md b/internals/unplugin-virtual-template/CHANGELOG.md new file mode 100644 index 000000000..e62c6e0a5 --- /dev/null +++ b/internals/unplugin-virtual-template/CHANGELOG.md @@ -0,0 +1,8 @@ +# Change Log + +All notable changes to this project will be documented in this file. +See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + +## 0.1.1-beta.0 (2023-02-08) + +**Note:** Version bump only for package @opentiny-internal/unplugin-virtual-template diff --git a/internals/unplugin-virtual-template/README.md b/internals/unplugin-virtual-template/README.md new file mode 100644 index 000000000..8e279c6f3 --- /dev/null +++ b/internals/unplugin-virtual-template/README.md @@ -0,0 +1,104 @@ +# @opentiny/unplugin-virtual-template + +## Install + +```bash +npm i @opentiny/unplugin-virtual-template +``` + +
+Vite
+ +```ts +// vite.config.ts +import Starter from '@opentiny/unplugin-virtual-template/vite' + +export default defineConfig({ + plugins: [ + Starter({ /* options */ }), + ], +}) +``` + +Example: [`playground/`](./playground/) + +
+ +
+Rollup
+ +```ts +// rollup.config.js +import Starter from '@opentiny/unplugin-virtual-template/rollup' + +export default { + plugins: [ + Starter({ /* options */ }), + ], +} +``` + +
+ + +
+Webpack
+ +```ts +// webpack.config.js +module.exports = { + /* ... */ + plugins: [ + require('@opentiny/unplugin-virtual-template/webpack')({ /* options */ }) + ] +} +``` + +
+ +
+Nuxt
+ +```ts +// nuxt.config.js +export default { + buildModules: [ + ['@opentiny/unplugin-virtual-template/nuxt', { /* options */ }], + ], +} +``` + +> This module works for both Nuxt 2 and [Nuxt Vite](https://github.com/nuxt/vite) + +
+ +
+Vue CLI
+ +```ts +// vue.config.js +module.exports = { + configureWebpack: { + plugins: [ + require('@opentiny/unplugin-virtual-template/webpack')({ /* options */ }), + ], + }, +} +``` + +
+ +
+esbuild
+ +```ts +// esbuild.config.js +import { build } from 'esbuild' +import Starter from '@opentiny/unplugin-virtual-template/esbuild' + +build({ + plugins: [Starter()], +}) +``` + +
diff --git a/internals/unplugin-virtual-template/package.json b/internals/unplugin-virtual-template/package.json new file mode 100644 index 000000000..317766840 --- /dev/null +++ b/internals/unplugin-virtual-template/package.json @@ -0,0 +1,89 @@ +{ + "name": "@opentiny-internal/unplugin-virtual-template", + "type": "module", + "private": true, + "version": "0.1.1-beta.0", + "description": "Register global imports on demand for Vite and Webpack", + "exports": { + ".": { + "types": "./dist/index.d.ts", + "require": "./dist/index.cjs", + "import": "./dist/index.js" + }, + "./vite": { + "types": "./dist/vite.d.ts", + "require": "./dist/vite.cjs", + "import": "./dist/vite.js" + }, + "./webpack": { + "types": "./dist/webpack.d.ts", + "require": "./dist/webpack.cjs", + "import": "./dist/webpack.js" + }, + "./rollup": { + "types": "./dist/rollup.d.ts", + "require": "./dist/rollup.cjs", + "import": "./dist/rollup.js" + }, + "./esbuild": { + "types": "./dist/esbuild.d.ts", + "require": "./dist/esbuild.cjs", + "import": "./dist/esbuild.js" + }, + "./nuxt": { + "types": "./dist/nuxt.d.ts", + "require": "./dist/nuxt.cjs", + "import": "./dist/nuxt.js" + }, + "./types": { + "types": "./dist/types.d.ts", + "require": "./dist/types.cjs", + "import": "./dist/types.js" + }, + "./*": "./*" + }, + "main": "dist/index.cjs", + "module": "dist/index.js", + "types": "dist/index.d.ts", + "typesVersions": { + "*": { + "*": [ + "./dist/*", + "./*" + ] + } + }, + "files": [ + "dist" + ], + "scripts": { + "build": "tsup", + "dev": "tsup --watch src", + "lint": "eslint .", + "prepublishOnly": "npm run build", + "release": "bumpp && npm publish", + "start": "esno src/index.ts", + "test": "vitest" + }, + "dependencies": { + "@rollup/pluginutils": "^5.0.2", + "magic-string": "^0.27.0", + "unplugin": "^1.0.1" + }, + "devDependencies": { + "@types/node": "^18.11.13", + "bumpp": "^8.2.1", + "chalk": "^5.2.0", + "eslint": "^8.29.0", + "esno": "^0.16.3", + "fast-glob": "^3.2.12", + "nodemon": "^2.0.20", + "rimraf": "^3.0.2", + "rollup": "^3.7.3", + "tsup": "^6.5.0", + "typescript": "^4.9.4", + "vite": "^4.0.0", + "vitest": "^0.25.7", + "webpack": "^5.75.0" + } +} diff --git a/internals/unplugin-virtual-template/scripts/postbuild.ts b/internals/unplugin-virtual-template/scripts/postbuild.ts new file mode 100644 index 000000000..3536eb4c5 --- /dev/null +++ b/internals/unplugin-virtual-template/scripts/postbuild.ts @@ -0,0 +1,24 @@ +/* eslint-disable no-console */ +import { basename, dirname, resolve } from 'path' +import { promises as fs } from 'fs' +import { fileURLToPath } from 'url' +import fg from 'fast-glob' +import chalk from 'chalk' + +async function run() { + // fix cjs exports + const files = await fg('*.cjs', { + ignore: ['chunk-*'], + absolute: true, + cwd: resolve(dirname(fileURLToPath(import.meta.url)), '../dist'), + }) + for (const file of files) { + console.log(chalk.cyan.inverse(' POST '), `Fix ${basename(file)}`) + let code = await fs.readFile(file, 'utf8') + code = code.replace('exports.default =', 'module.exports =') + code += 'exports.default = module.exports;' + await fs.writeFile(file, code) + } +} + +void run() diff --git a/internals/unplugin-virtual-template/src/core/index.ts b/internals/unplugin-virtual-template/src/core/index.ts new file mode 100644 index 000000000..259d8560d --- /dev/null +++ b/internals/unplugin-virtual-template/src/core/index.ts @@ -0,0 +1,3 @@ +export * from './transformVirtualTemplate' +export * from './transformConditionalTemplate' +export * from './transformVirtualTemplateForBuild' diff --git a/internals/unplugin-virtual-template/src/core/transformConditionalTemplate.ts b/internals/unplugin-virtual-template/src/core/transformConditionalTemplate.ts new file mode 100644 index 000000000..163979bb8 --- /dev/null +++ b/internals/unplugin-virtual-template/src/core/transformConditionalTemplate.ts @@ -0,0 +1,44 @@ +import MagicString from 'magic-string' + +export const transformConditionalTemplate = (code: string, id: string, env: any = {}) => { + const source = new MagicString(code, { + filename: id, + }) + + source.replace( + /^.*?#v-if(n?)def\s*(\S+).*[\r\n]{1,2}([\s\S]+?)\s*.*?#v-endif.*?$/gm, + /** + * 条件替换 + * @param _ 匹配的字符串 + * @param $1 是否为 not 模式 + * @param $2 条件 + * @param $3 code + */ + (_, $1, $2, $3) => { + const isNot = !!$1 + const isKeep = $2.split('||').some((v: string) => { + let flag = false + const [key, value] = v.split('=') + if (value === undefined) { + flag = !!env[key] + } else { + flag = String(env[key]) === value + } + flag = isNot ? !flag : flag + return flag + }) + return isKeep ? $3 : '' + } + ) + + if (source.hasChanged()) { + return { + code: source.toString(), + map: source.generateMap({ + source: id, + file: `${id}.map`, + includeContent: true, + }), + } + } +} diff --git a/internals/unplugin-virtual-template/src/core/transformVirtualTemplate.ts b/internals/unplugin-virtual-template/src/core/transformVirtualTemplate.ts new file mode 100644 index 000000000..3ad991030 --- /dev/null +++ b/internals/unplugin-virtual-template/src/core/transformVirtualTemplate.ts @@ -0,0 +1,36 @@ +export function transformVirtualTemplate(code: string) { + return code.replace(/import\s+(\w+)\s+from\s+'virtual-template\?(.+)'/, (all, localName, url) => { + const params = url.split('|').map((item: string) => item.split('=')).reduce((result: Record, [key, value]: [string, string]) => { + result[key] = value || key + return result + }, {}) + + const getTemplate = (params: Record) => { + return Object.entries(params).map(([key, value]) => { + return ` + // #v-ifdef VITE_TINY_MODE=${key} + result = import.meta.glob('./${value}.vue', { eager: true }) + // #v-endif + ` + }).join('') + } + + const result = ` +const ${localName} = (mode) => { + let result + + // #v-ifndef VITE_TINY_MODE + result = import.meta.glob('./{pc,mobile}.vue', { eager: true }) + // #v-endif + + ${getTemplate(params)} + + const finalMode = ${JSON.stringify(params)}[mode?.value || mode] + + return result[\`./\${finalMode}.vue\`].default +} + ` + + return result + }) +} diff --git a/internals/unplugin-virtual-template/src/core/transformVirtualTemplateForBuild.ts b/internals/unplugin-virtual-template/src/core/transformVirtualTemplateForBuild.ts new file mode 100644 index 000000000..5901ff636 --- /dev/null +++ b/internals/unplugin-virtual-template/src/core/transformVirtualTemplateForBuild.ts @@ -0,0 +1,33 @@ +const toCamelCase = (str = '') => { + const s = + str && + str.match(/[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g) + .map((x: string) => x.slice(0, 1).toUpperCase() + x.slice(1).toLowerCase()) + .join('') + return s.slice(0, 1).toUpperCase() + s.slice(1) +} + +export function transformVirtualTemplateForBuild(code: string) { + return code.replace(/import\s+(\w+)\s+from\s+'virtual-template\?(.+)'/, (all, localName, url) => { + const params = url.split('|').map((item: string) => item.split('=')).reduce((result: Record, [key, value]: [string, string]) => { + result[toCamelCase(`${key}-template`)] = value || key + return result + }, {}) + + const getImports = (params: Record) => { + return Object.entries(params).map(([key, value]) => { + return `import ${key} from './${value}.vue'` + }).join('\n') + } + + const result = ` +${getImports(params)} + +const ${localName} = (mode) => { + if ('mobile' === (process.env.TINY_MODE || mode)) return MobileTemplate + else return PcTemplate +} + ` + return result + }) +} diff --git a/internals/unplugin-virtual-template/src/esbuild.ts b/internals/unplugin-virtual-template/src/esbuild.ts new file mode 100644 index 000000000..71f1e0952 --- /dev/null +++ b/internals/unplugin-virtual-template/src/esbuild.ts @@ -0,0 +1,3 @@ +import unplugin from '.' + +export default unplugin.esbuild diff --git a/internals/unplugin-virtual-template/src/index.ts b/internals/unplugin-virtual-template/src/index.ts new file mode 100644 index 000000000..596f76230 --- /dev/null +++ b/internals/unplugin-virtual-template/src/index.ts @@ -0,0 +1,34 @@ +import { createUnplugin } from 'unplugin' +import { createFilter } from '@rollup/pluginutils' +import type { UserOptions } from './types' +import { transformVirtualTemplate, transformConditionalTemplate, transformVirtualTemplateForBuild } from './core' + +export default createUnplugin((options = {}) => { + const filter = createFilter( + options.include || ['**/*'], + options.exclude || [], + ) + + return { + name: '@opentiny/unplugin-virtual-template', + enforce: 'pre', + resolveId(id: string) { + if (id.startsWith('virtual-template')) { + // 返回 id 表明命中,vite不再询问其他插件处理该 id 请求 + return id + } + return null + }, + transformInclude(id) { + return filter(id) + }, + transform(code, id) { + if (process.env.NODE_ENV === 'production') { + return transformVirtualTemplateForBuild(code) + } + + code = transformVirtualTemplate(code) + return transformConditionalTemplate(code, id, options.env) + }, + } +}) diff --git a/internals/unplugin-virtual-template/src/nuxt.ts b/internals/unplugin-virtual-template/src/nuxt.ts new file mode 100644 index 000000000..ae90d09db --- /dev/null +++ b/internals/unplugin-virtual-template/src/nuxt.ts @@ -0,0 +1,16 @@ +import type { UserOptions } from './types' +import unplugin from '.' + +export default function (options: UserOptions = {}, nuxt: any) { + // install webpack plugin + nuxt.hook('webpack:config', (config: any) => { + config.plugins = config.plugins || [] + config.plugins.unshift(unplugin.webpack(options)) + }) + + // install vite plugin + nuxt.hook('vite:extendConfig', (config: any) => { + config.plugins = config.plugins || [] + config.plugins.push(unplugin.vite(options)) + }) +} diff --git a/internals/unplugin-virtual-template/src/rollup.ts b/internals/unplugin-virtual-template/src/rollup.ts new file mode 100644 index 000000000..ed6909cd3 --- /dev/null +++ b/internals/unplugin-virtual-template/src/rollup.ts @@ -0,0 +1,3 @@ +import unplugin from '.' + +export default unplugin.rollup diff --git a/internals/unplugin-virtual-template/src/types.ts b/internals/unplugin-virtual-template/src/types.ts new file mode 100644 index 000000000..3afc2d638 --- /dev/null +++ b/internals/unplugin-virtual-template/src/types.ts @@ -0,0 +1,18 @@ +import type { FilterPattern } from '@rollup/pluginutils' + +export interface Options { + /** + * @default ["**\/*"] + */ + include: FilterPattern + /** + * @default [] + */ + exclude: FilterPattern + // 环境变量 + env: Record +} + +export type UserOptions = Partial + +export type ResolvedOptions = Options diff --git a/internals/unplugin-virtual-template/src/vite.ts b/internals/unplugin-virtual-template/src/vite.ts new file mode 100644 index 000000000..589f4b964 --- /dev/null +++ b/internals/unplugin-virtual-template/src/vite.ts @@ -0,0 +1,3 @@ +import unplugin from '.' + +export default unplugin.vite diff --git a/internals/unplugin-virtual-template/src/webpack.ts b/internals/unplugin-virtual-template/src/webpack.ts new file mode 100644 index 000000000..8d5053896 --- /dev/null +++ b/internals/unplugin-virtual-template/src/webpack.ts @@ -0,0 +1,4 @@ +import unplugin from '.' +import type {} from 'webpack' + +export default unplugin.webpack diff --git a/internals/unplugin-virtual-template/test/__snapshots__/index.test.ts.snap b/internals/unplugin-virtual-template/test/__snapshots__/index.test.ts.snap new file mode 100644 index 000000000..9f67889f4 --- /dev/null +++ b/internals/unplugin-virtual-template/test/__snapshots__/index.test.ts.snap @@ -0,0 +1,133 @@ +// Vitest Snapshot v1 + +exports[`index > transformVirtualTemplate > pc|mobile=pc|mobile-first 1`] = ` +" +const template = (mode) => { + let result + + // #v-ifndef VITE_TINY_MODE + result = import.meta.glob('./{pc,mobile,mobile-first}.vue', { eager: true }) + // #v-endif + + + // #v-ifdef VITE_TINY_MODE=pc + result = import.meta.glob('./pc.vue', { eager: true }) + // #v-endif + + // #v-ifdef VITE_TINY_MODE=mobile + result = import.meta.glob('./pc.vue', { eager: true }) + // #v-endif + + // #v-ifdef VITE_TINY_MODE=mobile-first + result = import.meta.glob('./mobile-first.vue', { eager: true }) + // #v-endif + + + const finalMode = {\\"pc\\":\\"pc\\",\\"mobile\\":\\"pc\\",\\"mobile-first\\":\\"mobile-first\\"}[mode?.value || mode] + + return result[\`./\${finalMode}.vue\`].default +} + " +`; + +exports[`index > transformVirtualTemplate > pc|mobile|mobile-first 1`] = ` +" +const template = (mode) => { + let result + + // #v-ifndef VITE_TINY_MODE + result = import.meta.glob('./{pc,mobile,mobile-first}.vue', { eager: true }) + // #v-endif + + + // #v-ifdef VITE_TINY_MODE=pc + result = import.meta.glob('./pc.vue', { eager: true }) + // #v-endif + + // #v-ifdef VITE_TINY_MODE=mobile + result = import.meta.glob('./mobile.vue', { eager: true }) + // #v-endif + + // #v-ifdef VITE_TINY_MODE=mobile-first + result = import.meta.glob('./mobile-first.vue', { eager: true }) + // #v-endif + + + const finalMode = {\\"pc\\":\\"pc\\",\\"mobile\\":\\"mobile\\",\\"mobile-first\\":\\"mobile-first\\"}[mode?.value || mode] + + return result[\`./\${finalMode}.vue\`].default +} + " +`; + +exports[`index > transformVirtualTemplate > pc|mobile|mobile-first=pc 1`] = ` +" +const template = (mode) => { + let result + + // #v-ifndef VITE_TINY_MODE + result = import.meta.glob('./{pc,mobile,mobile-first}.vue', { eager: true }) + // #v-endif + + + // #v-ifdef VITE_TINY_MODE=pc + result = import.meta.glob('./pc.vue', { eager: true }) + // #v-endif + + // #v-ifdef VITE_TINY_MODE=mobile + result = import.meta.glob('./mobile.vue', { eager: true }) + // #v-endif + + // #v-ifdef VITE_TINY_MODE=mobile-first + result = import.meta.glob('./pc.vue', { eager: true }) + // #v-endif + + + const finalMode = {\\"pc\\":\\"pc\\",\\"mobile\\":\\"mobile\\",\\"mobile-first\\":\\"pc\\"}[mode?.value || mode] + + return result[\`./\${finalMode}.vue\`].default +} + " +`; + +exports[`index > transformVirtualTemplateForBuild > pc|mobile=pc|mobile-first 1`] = ` +" +import PcTemplate from './pc.vue' +import MobileTemplate from './pc.vue' +import MobileFirstTemplate from './mobile-first.vue' + +const template = (mode) => { + if ('mobile' === (process.env.TINY_MODE || mode)) return MobileTemplate + else if ('mobile-first' === (process.env.TINY_MODE || mode)) return MobileFirstTemplate + else return PcTemplate +} + " +`; + +exports[`index > transformVirtualTemplateForBuild > pc|mobile|mobile-first 1`] = ` +" +import PcTemplate from './pc.vue' +import MobileTemplate from './mobile.vue' +import MobileFirstTemplate from './mobile-first.vue' + +const template = (mode) => { + if ('mobile' === (process.env.TINY_MODE || mode)) return MobileTemplate + else if ('mobile-first' === (process.env.TINY_MODE || mode)) return MobileFirstTemplate + else return PcTemplate +} + " +`; + +exports[`index > transformVirtualTemplateForBuild > pc|mobile|mobile-first=pc 1`] = ` +" +import PcTemplate from './pc.vue' +import MobileTemplate from './mobile.vue' +import MobileFirstTemplate from './pc.vue' + +const template = (mode) => { + if ('mobile' === (process.env.TINY_MODE || mode)) return MobileTemplate + else if ('mobile-first' === (process.env.TINY_MODE || mode)) return MobileFirstTemplate + else return PcTemplate +} + " +`; diff --git a/internals/unplugin-virtual-template/test/index.test.ts b/internals/unplugin-virtual-template/test/index.test.ts new file mode 100644 index 000000000..21280d746 --- /dev/null +++ b/internals/unplugin-virtual-template/test/index.test.ts @@ -0,0 +1,32 @@ +import { describe, expect, it } from 'vitest' +import { transformVirtualTemplate, transformVirtualTemplateForBuild } from '../src/core/index' + +describe('index', () => { + describe('transformVirtualTemplate', () => { + it('pc|mobile|mobile-first', () => { + expect(transformVirtualTemplate('import template from \'virtual:template?pc|mobile|mobile-first\'')).toMatchSnapshot() + }) + + it('pc|mobile=pc|mobile-first', () => { + expect(transformVirtualTemplate('import template from \'virtual:template?pc|mobile=pc|mobile-first\'')).toMatchSnapshot() + }) + + it('pc|mobile|mobile-first=pc', () => { + expect(transformVirtualTemplate('import template from \'virtual:template?pc|mobile|mobile-first=pc\'')).toMatchSnapshot() + }) + }) + + describe('transformVirtualTemplateForBuild', () => { + it('pc|mobile|mobile-first', () => { + expect(transformVirtualTemplateForBuild('import template from \'virtual:template?pc|mobile|mobile-first\'')).toMatchSnapshot() + }) + + it('pc|mobile=pc|mobile-first', () => { + expect(transformVirtualTemplateForBuild('import template from \'virtual:template?pc|mobile=pc|mobile-first\'')).toMatchSnapshot() + }) + + it('pc|mobile|mobile-first=pc', () => { + expect(transformVirtualTemplateForBuild('import template from \'virtual:template?pc|mobile|mobile-first=pc\'')).toMatchSnapshot() + }) + }) +}) diff --git a/internals/unplugin-virtual-template/tsconfig.json b/internals/unplugin-virtual-template/tsconfig.json new file mode 100644 index 000000000..1683ae1b3 --- /dev/null +++ b/internals/unplugin-virtual-template/tsconfig.json @@ -0,0 +1,13 @@ +{ + "compilerOptions": { + "forceConsistentCasingInFileNames": true, + "target": "es2017", + "module": "esnext", + "lib": ["esnext", "DOM"], + "moduleResolution": "node", + "esModuleInterop": true, + "strict": true, + "strictNullChecks": true, + "resolveJsonModule": true + } +} diff --git a/internals/unplugin-virtual-template/tsup.config.ts b/internals/unplugin-virtual-template/tsup.config.ts new file mode 100644 index 000000000..bedbf20fc --- /dev/null +++ b/internals/unplugin-virtual-template/tsup.config.ts @@ -0,0 +1,11 @@ +import type { Options } from 'tsup' + +export default { + entryPoints: [ + 'src/*.ts', + ], + clean: true, + format: ['cjs', 'esm'], + dts: true, + onSuccess: 'esno scripts/postbuild.ts', +} diff --git a/internals/vue-test-utils/CHANGELOG.md b/internals/vue-test-utils/CHANGELOG.md new file mode 100644 index 000000000..449617f64 --- /dev/null +++ b/internals/vue-test-utils/CHANGELOG.md @@ -0,0 +1,40 @@ +# Change Log + +All notable changes to this project will be documented in this file. +See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + +## [1.0.5-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/@opentiny-internal/vue-test-utils@1.0.4-mf.0...@opentiny-internal/vue-test-utils@1.0.5-mf.0) (2023-02-08) + +**Note:** Version bump only for package @opentiny-internal/vue-test-utils + + + + + +## [1.0.4-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/@opentiny-internal/vue-test-utils@1.0.3-mf.0...@opentiny-internal/vue-test-utils@1.0.4-mf.0) (2023-02-08) + +**Note:** Version bump only for package @opentiny-internal/vue-test-utils + + + + + +## [1.0.3-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/@opentiny-internal/vue-test-utils@1.0.2-mf.0...@opentiny-internal/vue-test-utils@1.0.3-mf.0) (2023-02-08) + +**Note:** Version bump only for package @opentiny-internal/vue-test-utils + + + + + +## [1.0.2-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/@opentiny-internal/vue-test-utils@1.0.1-beta.0...@opentiny-internal/vue-test-utils@1.0.2-mf.0) (2023-02-08) + +**Note:** Version bump only for package @opentiny-internal/vue-test-utils + + + + + +## 1.0.1-beta.0 (2023-02-08) + +**Note:** Version bump only for package @opentiny-internal/vue-test-utils diff --git a/internals/vue-test-utils/README.md b/internals/vue-test-utils/README.md new file mode 100644 index 000000000..070f059de --- /dev/null +++ b/internals/vue-test-utils/README.md @@ -0,0 +1,3 @@ +# vue-test-utils + +基于 `@vue/test-utils@1` 和 `@vue/test-utils@2` 进行二次封装,同时兼容 vue2 和 vue3 测试。 diff --git a/internals/vue-test-utils/package.json b/internals/vue-test-utils/package.json new file mode 100644 index 000000000..a05d28c54 --- /dev/null +++ b/internals/vue-test-utils/package.json @@ -0,0 +1,15 @@ +{ + "name": "@opentiny-internal/vue-test-utils", + "private": true, + "version": "1.0.5-mf.0", + "description": "", + "main": "src/index.ts", + "keywords": [], + "author": "", + "license": "ISC", + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@vue/test-utils": "^2.2.7", + "vue": "^3.2.31" + } +} diff --git a/internals/vue-test-utils/src/index.ts b/internals/vue-test-utils/src/index.ts new file mode 100644 index 000000000..22eb10768 --- /dev/null +++ b/internals/vue-test-utils/src/index.ts @@ -0,0 +1,49 @@ +import { mount as _mount, shallowMount, createLocalVue, type MountingOptions } from '@vue/test-utils' +import { isVue2 } from '@opentiny/vue-common' + +const mount = (inputComponent: any, options: MountingOptions = {}) => { + let mount$ = _mount + + if (isVue2) { + (options as any).localVue = createLocalVue() + + if (options.props) { + options.propsData = options.props + delete options.props + } + + if (options.global) { + Object.assign(options, options.global) + delete options.global + } + + if (options.shallow === true) { + mount$ = shallowMount + } + } + + const wrapper = mount$(inputComponent, options) + + if (isVue2) { + wrapper.unmount = (wrapper as any).destory + } + + return wrapper +} + +const mountWithMode = (mode: string, inputComponent: any, options: MountingOptions = {}) => { + options.props = { ...options.props, tiny_mode: mode } + + return mount(inputComponent, options) +} + +export const mountPcMode = (inputComponent: any, options: MountingOptions = {}) => + mountWithMode('pc', inputComponent, options) + +export const mountMobileMode = (inputComponent: any, options: MountingOptions = {}) => + mountWithMode('mobile', inputComponent, options) + +export const mountMobilefirstMode = (inputComponent: any, options: MountingOptions = {}) => + mountWithMode('mobile-first', inputComponent, options) + +export type { MountingOptions } from '@vue/test-utils' diff --git a/lerna.json b/lerna.json index ee7c4d908..49ec00457 100644 --- a/lerna.json +++ b/lerna.json @@ -1,4 +1,21 @@ { - "packages": ["example", "packages/**"], - "version": "0.0.0" -} + "$schema": "node_modules/lerna/schemas/lerna-schema.json", + "useWorkspaces": true, + "version": "independent", + "npmClient": "pnpm", + "command": { + "version": { + "ignoreChanges": ["**/__fixtures__/**", "**/__tests__/**", "**/*.md"], + "allowBranch": ["pnpm-vite*"], + "changelogPreset": "angular", + "conventionalCommits": true, + "includeMergedTags": true, + "message": "chore(release): publish [ci skip] ***NO_CI***", + "noPush": true, + "yes": true + }, + "publish": { + "registry": "http://localhost:4873/" + } + } +} \ No newline at end of file diff --git a/linting/resolve-config.js b/linting/resolve-config.js new file mode 100644 index 000000000..95a1da5b3 --- /dev/null +++ b/linting/resolve-config.js @@ -0,0 +1,28 @@ +/* eslint-env node */ + +const baseConfig = require('../.eslintrc') + +/** + * @param {import('typescript').Program} program + * @returns {import('eslint').Linter.Config} + */ +module.exports = program => ({ + ...baseConfig, + parserOptions: { + tsconfigRootDir: process.cwd(), + project: ['./tsconfig.eslint.json'], + programs: [program], // replace eslint typescript program + }, + // ignore non-ts virtual files that was generated by volar + ignorePatterns: ['**/*.vue.*'], + overrides: [ + ...baseConfig.overrides ?? [], + { + // ignore invalid errors for volar code + files: ['*.vue.ts', '*.vue.js', '*.vue.tsx', '*.vue.jsx'], + rules: { + 'prettier/prettier': 'off', + }, + }, + ], +}) diff --git a/linting/vue-tsc-hook.js b/linting/vue-tsc-hook.js new file mode 100644 index 000000000..6a6560565 --- /dev/null +++ b/linting/vue-tsc-hook.js @@ -0,0 +1,10 @@ +/* eslint-env node */ + +/** @type {import('vue-tsc-eslint-hook')} */ +const vueTscEslintHook = require('vue-tsc-eslint-hook') + +/** + * @param {import('typescript').Program} program + */ +module.exports = program => + vueTscEslintHook(program, require('./resolve-config.js')) diff --git a/modules.json b/modules.json deleted file mode 100644 index 612fe4b95..000000000 --- a/modules.json +++ /dev/null @@ -1,1483 +0,0 @@ -{ - "ActionMenu": { - "path": "packages/action-menu/index.js", - "type": "component", - "exclude": false - }, - "ActionSheet": { - "path": "packages/action-sheet/index.js", - "type": "component", - "exclude": false, - "onlyMode": "mobile" - }, - "Alert": { - "path": "packages/alert/index.js", - "type": "component", - "exclude": false - }, - "AlertMobile": { - "path": "packages/alert/src/mobile.vue", - "type": "template", - "exclude": false - }, - "AlertPc": { - "path": "packages/alert/src/pc.vue", - "type": "template", - "exclude": false - }, - "Amount": { - "path": "packages/amount/index.js", - "type": "component", - "exclude": false - }, - "Anchor": { - "path": "packages/anchor/index.js", - "type": "component", - "exclude": false - }, - "Area": { - "path": "packages/area/index.js", - "type": "component", - "exclude": false - }, - "Autocomplete": { - "path": "packages/autocomplete/index.js", - "type": "component", - "exclude": false - }, - "AutocompletePc": { - "path": "packages/autocomplete/src/pc.vue", - "type": "template", - "exclude": false - }, - "AutonaviMap": { - "path": "packages/chart/autonavi-map/index.js", - "type": "component", - "exclude": false - }, - "Avatar": { - "path": "packages/avatar/index.js", - "type": "component", - "exclude": false, - "onlyMode": "mobile" - }, - "Badge": { - "path": "packages/badge/index.js", - "type": "component", - "exclude": false - }, - "BadgeMobile": { - "path": "packages/badge/src/mobile.vue", - "type": "template", - "exclude": false - }, - "BadgePc": { - "path": "packages/badge/src/pc.vue", - "type": "template", - "exclude": false - }, - "BaiduMap": { - "path": "packages/chart/baidu-map/index.js", - "type": "component", - "exclude": false - }, - "Breadcrumb": { - "path": "packages/breadcrumb/index.js", - "type": "component", - "exclude": false - }, - "BreadcrumbItem": { - "path": "packages/breadcrumb-item/index.js", - "type": "component", - "exclude": false - }, - "BreadcrumbItemPc": { - "path": "packages/breadcrumb-item/src/pc.vue", - "type": "template", - "exclude": false - }, - "BreadcrumbPc": { - "path": "packages/breadcrumb/src/pc.vue", - "type": "template", - "exclude": false - }, - "BulletinBoard": { - "path": "packages/bulletin-board/index.js", - "type": "component", - "exclude": false - }, - "BulletinBoardPc": { - "path": "packages/bulletin-board/src/pc.vue", - "type": "template", - "exclude": false - }, - "Button": { - "path": "packages/button/index.js", - "type": "component", - "exclude": false - }, - "ButtonGroup": { - "path": "packages/button-group/index.js", - "type": "component", - "exclude": false - }, - "ButtonGroupPc": { - "path": "packages/button-group/src/pc.vue", - "type": "template", - "exclude": false - }, - "ButtonMobile": { - "path": "packages/button/src/mobile.vue", - "type": "template", - "exclude": false - }, - "ButtonPc": { - "path": "packages/button/src/pc.vue", - "type": "template", - "exclude": false - }, - "Calendar": { - "path": "packages/calendar/index.js", - "type": "component", - "exclude": false - }, - "CalendarPc": { - "path": "packages/calendar/src/pc.vue", - "type": "template", - "exclude": false - }, - "CardTemplate": { - "path": "packages/card-template/index.js", - "type": "component", - "exclude": false - }, - "CardTemplatePc": { - "path": "packages/card-template/src/pc.vue", - "type": "template", - "exclude": false - }, - "Carousel": { - "path": "packages/carousel/index.js", - "type": "component", - "exclude": false - }, - "CarouselItem": { - "path": "packages/carousel-item/index.js", - "type": "component", - "exclude": false - }, - "CarouselItemPc": { - "path": "packages/carousel-item/src/pc.vue", - "type": "template", - "exclude": false - }, - "CarouselPc": { - "path": "packages/carousel/src/pc.vue", - "type": "template", - "exclude": false - }, - "Cascader": { - "path": "packages/cascader/index.js", - "type": "component", - "exclude": false - }, - "CascaderMenu": { - "path": "packages/cascader-menu/index.js", - "type": "component", - "exclude": false - }, - "CascaderNode": { - "path": "packages/cascader-node/index.js", - "type": "component", - "exclude": false - }, - "CascaderPanel": { - "path": "packages/cascader-panel/index.js", - "type": "component", - "exclude": false - }, - "CascaderPc": { - "path": "packages/cascader/src/pc.vue", - "type": "template", - "exclude": false - }, - "Chart": { - "path": "packages/chart/index.js", - "type": "component", - "exclude": false - }, - "ChartBar": { - "path": "packages/chart/chart-bar/index.js", - "type": "component", - "exclude": false - }, - "ChartBoxplot": { - "path": "packages/chart/chart-boxplot/index.js", - "type": "component", - "exclude": false - }, - "ChartCandle": { - "path": "packages/chart/chart-candle/index.js", - "type": "component", - "exclude": false - }, - "ChartCore": { - "path": "packages/chart/chart-core/index.js", - "type": "component", - "exclude": false - }, - "ChartFunnel": { - "path": "packages/chart/chart-funnel/index.js", - "type": "component", - "exclude": false - }, - "ChartGauge": { - "path": "packages/chart/chart-gauge/index.js", - "type": "component", - "exclude": false - }, - "ChartGraph": { - "path": "packages/chart/chart-graph/index.js", - "type": "component", - "exclude": false - }, - "ChartHeatmap": { - "path": "packages/chart/chart-heatmap/index.js", - "type": "component", - "exclude": false - }, - "ChartHistogram": { - "path": "packages/chart/chart-histogram/index.js", - "type": "component", - "exclude": false - }, - "ChartLine": { - "path": "packages/chart/chart-line/index.js", - "type": "component", - "exclude": false - }, - "ChartLiquidfill": { - "path": "packages/chart/chart-liquidfill/index.js", - "type": "component", - "exclude": false - }, - "ChartMap": { - "path": "packages/chart/chart-map/index.js", - "type": "component", - "exclude": false - }, - "ChartPie": { - "path": "packages/chart/chart-pie/index.js", - "type": "component", - "exclude": false - }, - "ChartRadar": { - "path": "packages/chart/chart-radar/index.js", - "type": "component", - "exclude": false - }, - "ChartRing": { - "path": "packages/chart/chart-ring/index.js", - "type": "component", - "exclude": false - }, - "ChartSankey": { - "path": "packages/chart/chart-sankey/index.js", - "type": "component", - "exclude": false - }, - "ChartScatter": { - "path": "packages/chart/chart-scatter/index.js", - "type": "component", - "exclude": false - }, - "ChartSunburst": { - "path": "packages/chart/chart-sunburst/index.js", - "type": "component", - "exclude": false - }, - "ChartTree": { - "path": "packages/chart/chart-tree/index.js", - "type": "component", - "exclude": false - }, - "ChartWaterfall": { - "path": "packages/chart/chart-waterfall/index.js", - "type": "component", - "exclude": false - }, - "ChartWordcloud": { - "path": "packages/chart/chart-wordcloud/index.js", - "type": "component", - "exclude": false - }, - "Checkbox": { - "path": "packages/checkbox/index.js", - "type": "component", - "exclude": false - }, - "CheckboxButton": { - "path": "packages/checkbox-button/index.js", - "type": "component", - "exclude": false - }, - "CheckboxButtonPc": { - "path": "packages/checkbox-button/src/pc.vue", - "type": "template", - "exclude": false - }, - "CheckboxGroup": { - "path": "packages/checkbox-group/index.js", - "type": "component", - "exclude": false - }, - "CheckboxGroupMobile": { - "path": "packages/checkbox-group/src/mobile.vue", - "type": "template", - "exclude": false - }, - "CheckboxGroupPc": { - "path": "packages/checkbox-group/src/pc.vue", - "type": "template", - "exclude": false - }, - "CheckboxMobile": { - "path": "packages/checkbox/src/mobile.vue", - "type": "template", - "exclude": false - }, - "CheckboxPc": { - "path": "packages/checkbox/src/pc.vue", - "type": "template", - "exclude": false - }, - "Col": { - "path": "packages/col/index.js", - "type": "component", - "exclude": false - }, - "ColPc": { - "path": "packages/col/src/pc.vue", - "type": "template", - "exclude": false - }, - "Collapse": { - "path": "packages/collapse/index.js", - "type": "component", - "exclude": false - }, - "CollapseItem": { - "path": "packages/collapse-item/index.js", - "type": "component", - "exclude": false - }, - "CollapseItemPc": { - "path": "packages/collapse-item/src/pc.vue", - "type": "template", - "exclude": false - }, - "CollapsePc": { - "path": "packages/collapse/src/pc.vue", - "type": "template", - "exclude": false - }, - "CollapseTransition": { - "path": "packages/collapse-transition/index.js", - "type": "component", - "exclude": false - }, - "Company": { - "path": "packages/company/index.js", - "type": "component", - "exclude": false - }, - "CompanyPc": { - "path": "packages/company/src/pc.vue", - "type": "template", - "exclude": false - }, - "Container": { - "path": "packages/container/index.js", - "type": "component", - "exclude": false - }, - "ContainerPc": { - "path": "packages/container/src/pc.vue", - "type": "template", - "exclude": false - }, - "Country": { - "path": "packages/country/index.js", - "type": "component", - "exclude": false - }, - "CountryPc": { - "path": "packages/country/src/pc.vue", - "type": "template", - "exclude": false - }, - "CreditCard": { - "path": "packages/credit-card/index.js", - "type": "component", - "exclude": false - }, - "CreditCardForm": { - "path": "packages/credit-card-form/index.js", - "type": "component", - "exclude": false - }, - "CreditCardFormPc": { - "path": "packages/credit-card-form/src/pc.vue", - "type": "template", - "exclude": false - }, - "CreditCardPc": { - "path": "packages/credit-card/src/pc.vue", - "type": "template", - "exclude": false - }, - "Crop": { - "path": "packages/crop/index.js", - "type": "component", - "exclude": false - }, - "Currency": { - "path": "packages/currency/index.js", - "type": "component", - "exclude": false - }, - "CurrencyPc": { - "path": "packages/currency/src/pc.vue", - "type": "template", - "exclude": false - }, - "DatePanel": { - "path": "packages/date-panel/index.js", - "type": "component", - "exclude": false - }, - "DatePicker": { - "path": "packages/date-picker/index.js", - "type": "component", - "exclude": false, - "onlyMode": "all" - }, - "DatePickerMobile": { - "path": "packages/date-picker/src/mobile.vue", - "type": "template", - "exclude": false - }, - "DatePickerPc": { - "path": "packages/date-picker/src/pc.vue", - "type": "template", - "exclude": false - }, - "DateRange": { - "path": "packages/date-range/index.js", - "type": "component", - "exclude": false - }, - "DateTable": { - "path": "packages/date-table/index.js", - "type": "component", - "exclude": false - }, - "Dept": { - "path": "packages/dept/index.js", - "type": "component", - "exclude": false - }, - "DeptPc": { - "path": "packages/dept/src/pc.vue", - "type": "template", - "exclude": false - }, - "DetailPage": { - "path": "packages/detail-page/index.js", - "type": "component", - "exclude": false - }, - "DetailPagePc": { - "path": "packages/detail-page/src/pc.vue", - "type": "template", - "exclude": false - }, - "DialogBox": { - "path": "packages/dialog-box/index.js", - "type": "component", - "exclude": false - }, - "DialogBoxMobile": { - "path": "packages/dialog-box/src/mobile.vue", - "type": "template", - "exclude": false - }, - "DialogBoxPc": { - "path": "packages/dialog-box/src/pc.vue", - "type": "template", - "exclude": false - }, - "DropRoles": { - "path": "packages/drop-roles/index.js", - "type": "component", - "exclude": false - }, - "DropRolesPc": { - "path": "packages/drop-roles/src/pc.vue", - "type": "template", - "exclude": false - }, - "DropTimes": { - "path": "packages/drop-times/index.js", - "type": "component", - "exclude": false - }, - "DropTimesPc": { - "path": "packages/drop-times/src/pc.vue", - "type": "template", - "exclude": false - }, - "Dropdown": { - "path": "packages/dropdown/index.js", - "type": "component", - "exclude": false - }, - "DropdownItem": { - "path": "packages/dropdown-item/index.js", - "type": "component", - "exclude": false, - "onlyMode": "mobile" - }, - "DropdownItemMobile": { - "path": "packages/dropdown-item/src/mobile.vue", - "type": "template", - "exclude": false - }, - "DropdownItemPc": { - "path": "packages/dropdown-item/src/pc.vue", - "type": "template", - "exclude": false - }, - "DropdownMenu": { - "path": "packages/dropdown-menu/index.js", - "type": "component", - "exclude": false, - "onlyMode": "mobile" - }, - "DropdownMenuMobile": { - "path": "packages/dropdown-menu/src/mobile.vue", - "type": "template", - "exclude": false - }, - "DropdownMenuPc": { - "path": "packages/dropdown-menu/src/pc.vue", - "type": "template", - "exclude": false - }, - "Espace": { - "path": "packages/espace/index.js", - "type": "component", - "exclude": false - }, - "EspacePc": { - "path": "packages/espace/src/pc.vue", - "type": "template", - "exclude": false - }, - "Exception": { - "path": "packages/exception/index.js", - "type": "component", - "exclude": false, - "onlyMode": "mobile" - }, - "FallMenu": { - "path": "packages/fall-menu/index.js", - "type": "component", - "exclude": false - }, - "FallMenuPc": { - "path": "packages/fall-menu/src/pc.vue", - "type": "template", - "exclude": false - }, - "FileUpload": { - "path": "packages/file-upload/index.js", - "type": "component", - "exclude": false - }, - "FileUploadMobile": { - "path": "packages/file-upload/src/mobile.vue", - "type": "template", - "exclude": false - }, - "FileUploadPc": { - "path": "packages/file-upload/src/pc.vue", - "type": "template", - "exclude": false - }, - "Floatbar": { - "path": "packages/floatbar/index.js", - "type": "component", - "exclude": false - }, - "FloatbarPc": { - "path": "packages/floatbar/src/pc.vue", - "type": "template", - "exclude": false - }, - "Form": { - "path": "packages/form/index.js", - "type": "component", - "exclude": false - }, - "FormItem": { - "path": "packages/form-item/index.js", - "type": "component", - "exclude": false, - "onlyMode": "all" - }, - "FormMobile": { - "path": "packages/form/src/mobile.vue", - "type": "template", - "exclude": false - }, - "FormPc": { - "path": "packages/form/src/pc.vue", - "type": "template", - "exclude": false - }, - "Fullscreen": { - "path": "packages/fullscreen/index.js", - "type": "component", - "exclude": false, - "onlyMode": "all" - }, - "Grid": { - "path": "packages/grid/index.js", - "type": "component", - "exclude": false - }, - "GridColumn": { - "path": "packages/grid-column/index.js", - "type": "component", - "exclude": false - }, - "GridManager": { - "path": "packages/grid-manager/index.js", - "type": "component", - "exclude": false - }, - "GridToolbar": { - "path": "packages/grid-toolbar/index.js", - "type": "component", - "exclude": false - }, - "GridToolbarCustom": { - "path": "packages/grid-toolbar/src/custom.vue", - "type": "template", - "exclude": false - }, - "GridToolbarCustom-select": { - "path": "packages/grid-toolbar/src/custom-select.vue", - "type": "template", - "exclude": false - }, - "GridToolbarCustom-switch": { - "path": "packages/grid-toolbar/src/custom-switch.vue", - "type": "template", - "exclude": false - }, - "Hrapprover": { - "path": "packages/hrapprover/index.js", - "type": "component", - "exclude": false - }, - "HrapproverPc": { - "path": "packages/hrapprover/src/pc.vue", - "type": "template", - "exclude": false - }, - "Image": { - "path": "packages/image/index.js", - "type": "component", - "exclude": false - }, - "ImagePc": { - "path": "packages/image/src/pc.vue", - "type": "template", - "exclude": false - }, - "ImageViewer": { - "path": "packages/image-viewer/index.js", - "type": "component", - "exclude": false - }, - "ImageViewerMobile": { - "path": "packages/image-viewer/src/mobile.vue", - "type": "template", - "exclude": false - }, - "ImageViewerPc": { - "path": "packages/image-viewer/src/pc.vue", - "type": "template", - "exclude": false - }, - "Input": { - "path": "packages/input/index.js", - "type": "component", - "exclude": false - }, - "InputMobile": { - "path": "packages/input/src/mobile.vue", - "type": "template", - "exclude": false - }, - "InputPc": { - "path": "packages/input/src/pc.vue", - "type": "template", - "exclude": false - }, - "InputTall-storage": { - "path": "packages/input/src/tall-storage.vue", - "type": "template", - "exclude": false - }, - "IpAddress": { - "path": "packages/ip-address/index.js", - "type": "component", - "exclude": false - }, - "IpAddressPc": { - "path": "packages/ip-address/src/pc.vue", - "type": "template", - "exclude": false - }, - "Layout": { - "path": "packages/layout/index.js", - "type": "component", - "exclude": false - }, - "LayoutPc": { - "path": "packages/layout/src/pc.vue", - "type": "template", - "exclude": false - }, - "Link": { - "path": "packages/link/index.js", - "type": "component", - "exclude": false - }, - "LinkMenu": { - "path": "packages/link-menu/index.js", - "type": "component", - "exclude": false - }, - "LinkMenuPc": { - "path": "packages/link-menu/src/pc.vue", - "type": "template", - "exclude": false - }, - "LinkPc": { - "path": "packages/link/src/pc.vue", - "type": "template", - "exclude": false - }, - "List": { - "path": "packages/list/index.js", - "type": "component", - "exclude": false, - "onlyMode": "mobile" - }, - "Loading": { - "path": "packages/loading/index.js", - "type": "component", - "exclude": false - }, - "LoadingMobile": { - "path": "packages/loading/src/mobile.vue", - "type": "template", - "exclude": false - }, - "LoadingPc": { - "path": "packages/loading/src/pc.vue", - "type": "template", - "exclude": false - }, - "Locales": { - "path": "packages/locales/index.js", - "type": "component", - "exclude": false - }, - "LogonUser": { - "path": "packages/logon-user/index.js", - "type": "component", - "exclude": false - }, - "Logout": { - "path": "packages/logout/index.js", - "type": "component", - "exclude": false - }, - "LogoutPc": { - "path": "packages/logout/src/pc.vue", - "type": "template", - "exclude": false - }, - "Milestone": { - "path": "packages/milestone/index.js", - "type": "component", - "exclude": false - }, - "MilestonePc": { - "path": "packages/milestone/src/pc.vue", - "type": "template", - "exclude": false - }, - "MiniPicker": { - "path": "packages/mini-picker/index.js", - "type": "component", - "exclude": false, - "onlyMode": "mobile" - }, - "Modal": { - "path": "packages/modal/index.js", - "type": "component", - "exclude": false - }, - "MonthRange": { - "path": "packages/month-range/index.js", - "type": "component", - "exclude": false - }, - "MonthTable": { - "path": "packages/month-table/index.js", - "type": "component", - "exclude": false - }, - "MultiSelect": { - "path": "packages/multi-select/index.js", - "type": "component", - "exclude": false - }, - "MultiSelectMobile": { - "path": "packages/multi-select/mobile.vue", - "type": "template", - "exclude": false - }, - "NavBar": { - "path": "packages/nav-bar/index.js", - "type": "component", - "exclude": false, - "onlyMode": "mobile" - }, - "NavMenu": { - "path": "packages/nav-menu/index.js", - "type": "component", - "exclude": false - }, - "NavMenuPc": { - "path": "packages/nav-menu/src/pc.vue", - "type": "template", - "exclude": false - }, - "Notify": { - "path": "packages/notify/index.js", - "type": "component", - "exclude": false - }, - "Numeric": { - "path": "packages/numeric/index.js", - "type": "component", - "exclude": false - }, - "NumericMobile": { - "path": "packages/numeric/src/mobile.vue", - "type": "template", - "exclude": false - }, - "NumericPc": { - "path": "packages/numeric/src/pc.vue", - "type": "template", - "exclude": false - }, - "Option": { - "path": "packages/option/index.js", - "type": "component", - "exclude": false - }, - "OptionGroup": { - "path": "packages/option-group/index.js", - "type": "component", - "exclude": false - }, - "Pager": { - "path": "packages/pager/index.js", - "type": "component", - "exclude": false - }, - "PagerItem": { - "path": "packages/pager-item/index.js", - "type": "component", - "exclude": false, - "private": "Pager" - }, - "Panel": { - "path": "packages/panel/index.js", - "type": "component", - "exclude": true - }, - "PanelPc": { - "path": "packages/panel/src/pc.vue", - "type": "template", - "exclude": false - }, - "Picker": { - "path": "packages/picker/index.js", - "type": "component", - "exclude": false - }, - "PickerColumn": { - "path": "packages/picker-column/index.js", - "type": "component", - "exclude": false, - "onlyMode": "mobile" - }, - "PopUpload": { - "path": "packages/pop-upload/index.js", - "type": "component", - "exclude": false - }, - "PopUploadPc": { - "path": "packages/pop-upload/src/pc.vue", - "type": "template", - "exclude": false - }, - "Popeditor": { - "path": "packages/popeditor/index.js", - "type": "component", - "exclude": false - }, - "PopeditorPc": { - "path": "packages/popeditor/src/pc.vue", - "type": "template", - "exclude": false - }, - "Popover": { - "path": "packages/popover/index.js", - "type": "component", - "exclude": false - }, - "PopoverMobile": { - "path": "packages/popover/src/mobile.vue", - "type": "template", - "exclude": false - }, - "PopoverPc": { - "path": "packages/popover/src/pc.vue", - "type": "template", - "exclude": false - }, - "Popup": { - "path": "packages/popup/index.js", - "type": "component", - "exclude": false, - "onlyMode": "mobile" - }, - "Progress": { - "path": "packages/progress/index.js", - "type": "component", - "exclude": false - }, - "ProgressMobile": { - "path": "packages/progress/src/mobile.vue", - "type": "template", - "exclude": false - }, - "ProgressPc": { - "path": "packages/progress/src/pc.vue", - "type": "template", - "exclude": false - }, - "PullRefresh": { - "path": "packages/pull-refresh/index.js", - "type": "component", - "exclude": false, - "onlyMode": "mobile" - }, - "Radio": { - "path": "packages/radio/index.js", - "type": "component", - "exclude": false - }, - "RadioButton": { - "path": "packages/radio-button/index.js", - "type": "component", - "exclude": false - }, - "RadioButtonPc": { - "path": "packages/radio-button/src/pc.vue", - "type": "template", - "exclude": false - }, - "RadioGroup": { - "path": "packages/radio-group/index.js", - "type": "component", - "exclude": false - }, - "RadioGroupPc": { - "path": "packages/radio-group/src/pc.vue", - "type": "template", - "exclude": false - }, - "RadioMobile": { - "path": "packages/radio/src/mobile.vue", - "type": "template", - "exclude": false - }, - "RadioPc": { - "path": "packages/radio/src/pc.vue", - "type": "template", - "exclude": false - }, - "Rate": { - "path": "packages/rate/index.js", - "type": "component", - "exclude": false - }, - "RatePc": { - "path": "packages/rate/src/pc.vue", - "type": "template", - "exclude": false - }, - "Roles": { - "path": "packages/roles/index.js", - "type": "component", - "exclude": false - }, - "RolesPc": { - "path": "packages/roles/src/pc.vue", - "type": "template", - "exclude": false - }, - "Row": { - "path": "packages/row/index.js", - "type": "component", - "exclude": false - }, - "RowPc": { - "path": "packages/row/src/pc.vue", - "type": "template", - "exclude": false - }, - "ScrollText": { - "path": "packages/scroll-text/index.js", - "type": "component", - "exclude": false - }, - "ScrollTextPc": { - "path": "packages/scroll-text/src/pc.vue", - "type": "template", - "exclude": false - }, - "Scrollbar": { - "path": "packages/scrollbar/index.js", - "type": "component", - "exclude": false - }, - "ScrollbarBar": { - "path": "packages/scrollbar/src/bar.vue", - "type": "template", - "exclude": false - }, - "Search": { - "path": "packages/search/index.js", - "type": "component", - "exclude": false - }, - "SearchMobile": { - "path": "packages/search/src/mobile.vue", - "type": "template", - "exclude": false - }, - "SearchPc": { - "path": "packages/search/src/pc.vue", - "type": "template", - "exclude": false - }, - "Select": { - "path": "packages/select/index.js", - "type": "component", - "exclude": false - }, - "SelectDropdown": { - "path": "packages/select-dropdown/index.js", - "type": "component", - "exclude": false - }, - "SelectDropdownPc": { - "path": "packages/select-dropdown/src/pc.vue", - "type": "template", - "exclude": false - }, - "SelectPc": { - "path": "packages/select/src/pc.vue", - "type": "template", - "exclude": false - }, - "SlideBar": { - "path": "packages/slide-bar/index.js", - "type": "component", - "exclude": false - }, - "SlideBarPc": { - "path": "packages/slide-bar/src/pc.vue", - "type": "template", - "exclude": false - }, - "Slider": { - "path": "packages/slider/index.js", - "type": "component", - "exclude": false - }, - "SliderMobile": { - "path": "packages/slider/src/mobile.vue", - "type": "template", - "exclude": false - }, - "SliderPc": { - "path": "packages/slider/src/pc.vue", - "type": "template", - "exclude": false - }, - "Split": { - "path": "packages/split/index.js", - "type": "component", - "exclude": false - }, - "SplitPc": { - "path": "packages/split/src/pc.vue", - "type": "template", - "exclude": false - }, - "Steps": { - "path": "packages/steps/index.js", - "type": "component", - "exclude": false - }, - "StepsPc": { - "path": "packages/steps/src/pc.vue", - "type": "template", - "exclude": false - }, - "SvgIcon": { - "path": "packages/svg-icon/index.js", - "type": "component", - "exclude": false - }, - "Switch": { - "path": "packages/switch/index.js", - "type": "component", - "exclude": false - }, - "SwitchMobile": { - "path": "packages/switch/src/mobile.vue", - "type": "template", - "exclude": false - }, - "SwitchPc": { - "path": "packages/switch/src/pc.vue", - "type": "template", - "exclude": false - }, - "TabItem": { - "path": "packages/tab-item/index.js", - "type": "component", - "exclude": false, - "onlyMode": "all" - }, - "Tabbar": { - "path": "packages/tabbar/index.js", - "type": "component", - "exclude": false, - "onlyMode": "mobile" - }, - "TabbarItem": { - "path": "packages/tabbar-item/index.js", - "type": "component", - "exclude": false, - "onlyMode": "mobile" - }, - "TabbarItemMobile": { - "path": "packages/tabbar-item/src/mobile.vue", - "type": "template", - "exclude": false, - "onlyMode": "mobile" - }, - "Table": { - "path": "packages/table/index.js", - "type": "component", - "exclude": false - }, - "TableMobile": { - "path": "packages/table/src/mobile.vue", - "type": "template", - "exclude": false - }, - "TablePc": { - "path": "packages/table/src/pc.vue", - "type": "template", - "exclude": false - }, - "Tabs": { - "path": "packages/tabs/index.js", - "type": "component", - "exclude": false - }, - "TabsMobile": { - "path": "packages/tabs/src/mobile.vue", - "type": "template", - "exclude": false - }, - "TabsPc": { - "path": "packages/tabs/src/pc.vue", - "type": "template", - "exclude": false - }, - "TabsTab-navMb": { - "path": "packages/tabs/src/mb.vue", - "type": "template", - "exclude": false - }, - "TabsTab-navTab-bar": { - "path": "packages/tabs/src/tab-bar.vue", - "type": "template", - "exclude": false - }, - "Tag": { - "path": "packages/tag/index.js", - "type": "component", - "exclude": false - }, - "TagPc": { - "path": "packages/tag/src/pc.vue", - "type": "template", - "exclude": false - }, - "TextPopup": { - "path": "packages/text-popup/index.js", - "type": "component", - "exclude": false - }, - "TextPopupPc": { - "path": "packages/text-popup/src/pc.vue", - "type": "template", - "exclude": false - }, - "Time": { - "path": "packages/time/index.js", - "type": "component", - "exclude": false - }, - "TimeLine": { - "path": "packages/time-line/index.js", - "type": "component", - "exclude": false - }, - "TimeLineMobile": { - "path": "packages/time-line/src/mobile.vue", - "type": "template", - "exclude": false - }, - "TimeLinePc": { - "path": "packages/time-line/src/pc.vue", - "type": "template", - "exclude": false - }, - "TimePanel": { - "path": "packages/time-panel/index.js", - "type": "component", - "exclude": false - }, - "TimePicker": { - "path": "packages/time-picker/index.js", - "type": "component", - "exclude": false - }, - "TimeRange": { - "path": "packages/time-range/index.js", - "type": "component", - "exclude": false - }, - "TimeSelect": { - "path": "packages/time-select/index.js", - "type": "component", - "exclude": false - }, - "TimeSpinner": { - "path": "packages/time-spinner/index.js", - "type": "component", - "exclude": false - }, - "ToggleMenu": { - "path": "packages/toggle-menu/index.js", - "type": "component", - "exclude": false - }, - "ToggleMenuPc": { - "path": "packages/toggle-menu/src/pc.vue", - "type": "template", - "exclude": false - }, - "Tooltip": { - "path": "packages/tooltip/index.js", - "type": "component", - "exclude": false - }, - "TopBox": { - "path": "packages/top-box/index.js", - "type": "component", - "exclude": false - }, - "TopBoxPc": { - "path": "packages/top-box/src/pc.vue", - "type": "template", - "exclude": false - }, - "Transfer": { - "path": "packages/transfer/index.js", - "type": "component", - "exclude": false - }, - "TransferPanel": { - "path": "packages/transfer-panel/index.js", - "type": "component", - "exclude": false - }, - "TransferPc": { - "path": "packages/transfer/src/pc.vue", - "type": "template", - "exclude": false - }, - "Tree": { - "path": "packages/tree/index.js", - "type": "component", - "exclude": false - }, - "TreeMenu": { - "path": "packages/tree-menu/index.js", - "type": "component", - "exclude": false - }, - "TreePc": { - "path": "packages/tree/src/pc.vue", - "type": "template", - "exclude": false - }, - "TreeTree-node": { - "path": "packages/tree/src/tree-node.vue", - "type": "template", - "exclude": false - }, - "Upload": { - "path": "packages/upload/index.js", - "type": "component", - "exclude": false, - "onlyMode": "all" - }, - "UploadDragger": { - "path": "packages/upload-dragger/index.js", - "type": "component", - "exclude": false - }, - "UploadList": { - "path": "packages/upload-list/index.js", - "type": "component", - "exclude": false, - "onlyMode": "all" - }, - "User": { - "path": "packages/user/index.js", - "type": "component", - "exclude": false - }, - "UserAccount": { - "path": "packages/user-account/index.js", - "type": "component", - "exclude": false - }, - "UserAccountPc": { - "path": "packages/user-account/src/pc.vue", - "type": "template", - "exclude": false - }, - "UserContact": { - "path": "packages/user-contact/index.js", - "type": "component", - "exclude": false - }, - "UserContactPc": { - "path": "packages/user-contact/src/pc.vue", - "type": "template", - "exclude": false - }, - "UserHead": { - "path": "packages/user-head/index.js", - "type": "component", - "exclude": false - }, - "UserHeadMobile": { - "path": "packages/user-head/src/mobile.vue", - "type": "template", - "exclude": false - }, - "UserHeadPc": { - "path": "packages/user-head/src/pc.vue", - "type": "template", - "exclude": false - }, - "UserLink": { - "path": "packages/user-link/index.js", - "type": "component", - "exclude": false - }, - "UserLinkPc": { - "path": "packages/user-link/src/pc.vue", - "type": "template", - "exclude": false - }, - "UserPc": { - "path": "packages/user/src/pc.vue", - "type": "template", - "exclude": false - }, - "Wheel": { - "path": "packages/wheel/index.js", - "type": "component", - "exclude": false - }, - "Wizard": { - "path": "packages/wizard/index.js", - "type": "component", - "exclude": false - }, - "WizardPc": { - "path": "packages/wizard/src/pc.vue", - "type": "template", - "exclude": false - }, - "YearTable": { - "path": "packages/year-table/index.js", - "type": "component", - "exclude": false - }, - "IndexBar": { - "path": "packages/index-bar/index.js", - "type": "component", - "exclude": false - }, - "IndexBarAnchor": { - "path": "packages/index-bar-anchor/index.js", - "type": "component", - "exclude": false - } -} diff --git a/package.json b/package.json index 98a5b6a0b..0e2a3bbe8 100644 --- a/package.json +++ b/package.json @@ -1,15 +1,10 @@ { - "name": "@opentiny/vue", + "name": "opentiny-vue", "version": "3.6.0", - "uiVersion": "0.1.0", - "srcVersion": "0.1.0", - "themeVersion": "3.6.0", + "private": true, + "packageManager": "pnpm@7.11.0", "description": "An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.", "homepage": "https://opentiny.design/tiny-vue", - "repository": { - "type": "git", - "url": "https://github.com/opentiny/tiny-vue" - }, "keywords": [ "vue", "vue3", @@ -23,108 +18,118 @@ ], "author": "OpenTiny Team", "license": "MIT", - "main": "index.js", + "repository": { + "type": "git", + "url": "git@github.com:opentiny/tiny-vue.git" + }, + "bugs": { + "url": "https://github.com/opentiny/tiny-vue/issues" + }, "sideEffects": false, + "main": "packages/index.js", + "files": [ + "index.js", + "pc.js", + "mobile.js", + "runtime" + ], + "engines": { + "node": ">=14", + "pnpm": ">=7" + }, "scripts": { - "dev:vue2": "npm run build:entry && vite", - "dev:vue3": "npm run build:entry && lerna run dev --scope vue-example --stream", - "postinstall": "lerna exec npm install --scope vue-example", - "clean": "rimraf dist", - "create:ui": "node build/create-ui.js", - "create:mapping": "node build/create-mapping.js", - "sync-icons": "node build/sync-icons.js", - "build:ui2": "lerna run build:ui2 --scope @opentiny/vue*", - "buildfuxi:ui2": "lerna run build:ui2 --scope @opentiny/vue-${componentName}", - "build:icon2": "cross-env NODE_ENV=production node build/build-icon.js", - "build:vue2": "npm run clean && npm i @opentiny/vue-theme --no-save && npm run create:mapping && npm run build:entry && npm run build:ui2 && npm run build:icon2", - "buildfuxi:vue2": "npm run clean && npm run create:mapping && npm run build:entry && npm run buildfuxi:ui2 && npm run build:icon2", - "build:ui3": "lerna run build:ui3 --scope @opentiny/vue*", - "buildfuxi:ui3": "lerna run build:ui3 --scope @opentiny/vue-${componentName}", - "build:icon3": "lerna run build:icon3 --scope vue-example --stream", - "build:vue3": "npm run clean && npm i @opentiny/vue-theme --no-save && npm run create:mapping && npm run build:entry && npm run build:ui3 && npm run build:icon3", - "buildfuxi:vue3": "npm run clean && npm run create:mapping && npm run build:entry && npm run buildfuxi:ui3 && npm run build:icon3", - "build:entry": "node build/build-entry.js", - "build": "npm run clean && npm run build:entry", - "build:version": "cross-env TYPE=ui node build/build-version.js", - "build:runtime-pc": "lerna run build:runtime-pc --scope vue-example", - "build:runtime-icon": "lerna run build:runtime-icon --scope vue-example", - "build:runtime": "npm run build:runtime-pc && npm run build:runtime-icon", - "release3": "npm run release:ui3 && npm run release:vue3", - "release:vue3": "cross-env NPM_TAG=~3.6.0 NPM_WAREHOUSE=prod VERSION_TAG=3.6.0 node build/release.js", - "release:ui3": "cross-env NPM_TAG=~3.6.0 NPM_WAREHOUSE=prod VERSION_TAG=3.6.0 node build/release-ui.js", - "release2": "npm run release:ui2 && npm run release:vue2", - "release:vue2": "cross-env NPM_TAG=~2.6.0 NPM_WAREHOUSE=prod VERSION_TAG=2.6.0 node build/release.js", - "release:ui2": "cross-env NPM_TAG=~2.6.0 NPM_WAREHOUSE=prod VERSION_TAG=2.6.0 node build/release-ui.js", - "releasefuxi3": "npm run releasefuxi:ui3 && npm run releasefuxi:vue3", - "releasefuxi:vue3": "cross-env NPM_TAG=~3.5.0 NPM_WAREHOUSE=prod VERSION_TAG=${version} node build/release.js", - "releasefuxi:ui3": "cross-env NPM_TAG=~3.5.0 NPM_WAREHOUSE=prod VERSION_TAG=${version} node build/release-ui.js", - "releasefuxi2": "npm run releasefuxi:ui2 && npm run releasefuxi:vue2", - "releasefuxi:vue2": "cross-env NPM_TAG=~2.5.0 NPM_WAREHOUSE=prod VERSION_TAG=${version} node build/release.js", - "releasefuxi:ui2": "cross-env NPM_TAG=~2.5.0 NPM_WAREHOUSE=prod VERSION_TAG=${version} node build/release-ui.js", - "format": "prettier --write packages/**/*{.vue,.js,.jsx} example/src/**/*{.vue,.js,jsx} build/*.js example/test/*.jsx", - "lint": "eslint packages/**/*{.vue,.js,.jsx} example/src/**/*{.vue,.js,.jsx} build/*.js --ignore-pattern \"packages/**/dist\" --ignore-pattern \"packages/**/node_modules\" --ignore-pattern \"packages/**/runtime\" --fix", - "test": "lerna run test --scope vue-example --stream", - "coverage": "lerna run coverage --scope vue-example --stream", - "publishall": "node npm-publish.js", - "clean:dep": "rm -rf node_modules */node_modules && rm -rf package-lock.json example/package-lock.json", - "prepare": "husky install", - "commit": "git-cz" + "preinstall": "npx only-allow pnpm", + "postinstall": "pnpm build:internals", + "bootstrap": "pnpm --filter=\"!./packages/dist/**\" install", + "dev:vue2": "pnpm -C examples/vue2 dev", + "dev:vue2.7": "pnpm -C examples/vue2.7 dev", + "dev:vue3": "pnpm -C examples/vue3 dev", + "dev:docs": "pnpm -C examples/docs docs:dev", + "build:entry": "pnpm -C internals/cli build:entry", + "create:ui": "pnpm -C internals/cli create:ui", + "create:mapping": "pnpm -C internals/cli create:mapping", + "sync-icons": "pnpm -C internals/cli sync-icons", + "build:runtime": "pnpm -C internals/cli build:runtime", + "build:ui": "pnpm -C internals/cli build:ui", + "build:renderless": "pnpm -C packages/renderless build", + "build:internals": "pnpm \"--filter=./internals/*\" build", + "release:vue2": "pnpm -C internals/cli release:vue2", + "release:vue3": "pnpm -C internals/cli release:vue3", + "release:ui-vue2": "pnpm -C internals/cli release:ui-vue2", + "release:ui-vue3": "pnpm -C internals/cli release:ui-vue3", + "release:ui-test-vue2": "pnpm -C internals/cli release:ui-test-vue2", + "/* pubTgz */": "部署带绿标的 npm 包", + "pubTgz": "node .cloudbuild/pub-tgzs.js", + "format": "prettier --write --cache packages/**/{*.vue,*.js,*.ts,*.jsx,*.tsx} examples/**/{*.vue,*.js,*.ts,*.jsx,*.tsx} internal/**/{*.js,*.ts}", + "lint": "eslint \"packages/**/{*.vue,*.js,*.ts,*.jsx,*.tsx}\" --quiet", + "lint:doc": "eslint \"examples/**/{*.vue,*.js,*.ts,*.jsx,*.tsx}\" --quiet", + "lint:renderless": "eslint \"packages/renderless/src/**/{*.ts,*.tsx}\" --quiet", + "test": "npm run build:ui-vue2 -- action-sheet tab-item", + "test:ct": "cypress run-ct", + "test:pub": "npm run build:ui-vue2 && npm run release:ui-vue2 && npm run build:ui-vue3 && npm run release:ui-vue3 && mv -f tgzs/*.tgz ./ && npm run pubTgz -- production", + "test:pub-runtime": "npm run build:runtime-vue2 && npm run release:vue2 && npm run build:runtime-vue3 && npm run release:vue3 && mv -f tgzs/*.tgz ./ && npm run pubTgz -- production", + "test:pubTgz": "npm run pubTgz -- production", + "clean:build": "rimraf packages/dist packages/renderless/dist", + "clean:dependencies": "rm -rf node_modules /**/node_modules", + "// ---------- 构建【mf】版本 ----------": "", + "preci:deployMfPatch": "pnpm clean:build && lerna version prepatch --conventional-prerelease --include-merged-tags --preid mf --no-push --yes", + "ci:deployMfPatch": "lerna publish from-package --yes --dist-tag mf", + "postci:deployMfPatch": "git push --follow-tags origin", + "// ---------- 构建【beta】版本 ----------": "", + "preci:deployBetaPatch": "pnpm clean:build && lerna version prepatch --conventional-prerelease --include-merged-tags --preid beta --no-push --yes", + "ci:deployBetaPatch": "lerna publish from-package --yes --dist-tag beta", + "postci:deployBetaPatch": "git push --follow-tags origin", + "// ---------- 构建【补丁】版本 ----------": "", + "preci:releasePatchVersion": "pnpm clean:build && lerna version patch --conventional-graduate --include-merged-tags --no-push --yes", + "ci:releasePatchVersion": "lerna publish from-package --yes", + "postci:releasePatchVersion": "git push --follow-tags origin", + "// ---------- 构建【特性】版本 ----------": "", + "preci:releaseMinorVersion": "pnpm clean:build && lerna version minor --conventional-graduate --include-merged-tags --no-push --yes", + "ci:releaseMinorVersion": "lerna publish from-package --yes", + "postci:releaseMinorVersion": "git push --follow-tags origin", + "// ---------- 手工构建发布指定组件 (Mf) ----------": "", + "preci:deployMf": "pnpm clean:build", + "ci:deployMf": "pnpm build:ui", + "postci:deployMf": "lerna publish from-package --yes --dist-tag mf", + "// ---------- 手工构建发布指定组件 (Beta) ----------": "", + "preci:deployBeta": "pnpm clean:build", + "ci:deployBeta": "pnpm build:ui", + "postci:deployBeta": "lerna publish from-package --yes --dist-tag beta" + }, + "dependencies": { + "@vue/composition-api": "1.2.2", + "cropperjs": "1.5.12", + "crypto-js": "4.1.1", + "echarts": "5.3.3", + "echarts-liquidfill": "3.0.0", + "echarts-wordcloud": "2.0.0", + "fs-extra": "^11.1.0", + "shepherd.js": "11.0.1", + "streamsaver": "2.0.6" }, "devDependencies": { - "@babel/cli": "^7.5.5", - "@babel/core": "^7.18.13", - "@babel/eslint-parser": "^7.19.1", - "@babel/plugin-proposal-export-default-from": "^7.7.4", - "@babel/plugin-proposal-export-namespace-from": "^7.7.4", - "@babel/plugin-syntax-dynamic-import": "^7.8.3", - "@babel/plugin-syntax-jsx": "^7.2.0", - "@babel/preset-env": "^7.18.10", - "@better-scroll/core": "^2.5.0", - "@better-scroll/wheel": "^2.5.0", - "@commitlint/cli": "^17.3.0", - "@commitlint/config-conventional": "^17.3.0", - "@rollup/plugin-alias": "^3.1.9", - "@rollup/plugin-babel": "^5.3.1", - "@rollup/plugin-commonjs": "^22.0.2", - "@rollup/plugin-node-resolve": "^13.3.0", - "@rollup/plugin-replace": "^4.0.0", - "@vitejs/plugin-vue2-jsx": "^1.0.3", - "@vue/babel-plugin-jsx": "^1.1.0", - "@vue/compiler-sfc": "^3.2.39", - "@vue/composition-api": "1.2.2", - "commitizen": "^4.2.5", - "cropperjs": "^1.5.12", - "cross-env": "^7.0.3", - "cz-conventional-changelog": "^3.3.0", - "echarts": "^5.3.3", - "echarts-liquidfill": "3.1.0", - "echarts-wordcloud": "2.0.0", - "eslint": "^8.25.0", - "eslint-config-prettier": "^8.5.0", - "eslint-plugin-prettier": "^4.2.1", - "eslint-plugin-vue": "^9.6.0", - "fs-extra": "^10.1.0", - "glob": "^8.0.3", - "husky": "^8.0.2", - "lerna": "^5.4.2", + "@antfu/eslint-config": "^0.34.0", + "@types/eslint": "^8.4.10", + "@types/node": "^18.11.18", + "@typescript-eslint/parser": "^5.48.0", + "@volar-plugins/eslint": "^0.0.4", + "@volar-plugins/prettier": "^1.1.5", + "@volar-plugins/prettyhtml": "^1.0.3", "lint-staged": "^13.0.3", "prettier": "^2.7.1", - "quill": "1.3.7", - "rimraf": "^3.0.0", - "rollup-plugin-postcss": "^2.0.3", - "rollup-plugin-vue": "5.0.1", - "rollup-plugin-vue-inline-svg": "~1.1.2", - "sortablejs": "^1.10.1", - "streamsaver": "^2.0.6", - "vite": "^3.0.9", - "vite-plugin-md2vue2": "^2.0.3", - "vite-plugin-vue2": "^2.0.2", - "vite-plugin-vue2-svg": "^0.3.0", - "vue": "~2.6.14", - "vue-eslint-parser": "^9.1.0", - "vue-i18n": "^8.9.0", - "vue-router": "^3.6.4", - "vue-template-compiler": "~2.6.14" + "@vue/tsconfig": "^0.1.3", + "@commitlint/cli": "^17.3.0", + "@commitlint/config-conventional": "^17.3.0", + "depcheck": "1.4.3", + "eslint": "^8.31.0", + "lerna": "^6.4.0", + "nx": "^15.4.5", + "rimraf": "^3.0.2", + "typescript": "^4.9.4", + "vite": "^4.0.4", + "vue": "^3.2.31", + "vue-tsc": "^1.0.24", + "vue-tsc-eslint-hook": "^1.0.24" }, "husky": { "hooks": { @@ -143,15 +148,73 @@ "path": "cz-conventional-changelog" } }, + "pnpm": { + "patchedDependencies": { + "depcheck@1.4.3": "patches/depcheck@1.4.3.patch", + "vite-plugin-importus@1.0.4": "patches/vite-plugin-importus@1.0.4.patch" + }, + "overrides": { + "@vue/compiler-sfc@3": "3.2.39", + "@vue/runtime-core@3": "3.2.39", + "@vue/runtime-dom@3": "3.2.39", + "@vue/shared@3": "3.2.39", + "cropperjs": "1.5.12", + "echarts": "5.3.3", + "follow-redirects": "1.14.8", + "regenerator-runtime": "0.13.9", + "tslib": "2.4.0", + "typescript": "^4.9.3", + "vue-i18n@8": "8.27.2", + "vue-i18n@9": "9.2.2", + "vue-router@3": "3.6.5", + "vue-router@4": "4.1.5", + "vue-template-compiler@2.6": "2.6.14", + "vue-template-compiler@2.7": "2.7.10", + "vue@2.6": "2.6.14", + "vue@2.7": "2.7.10", + "vue@3": "3.2.39", + "vue2": "npm:vue@2.6.14", + "vue2.7": "npm:vue@2.7.10", + "vue3": "npm:vue@3.2.39", + "vite-plugin-importus": "1.0.4" + }, + "packageExtensions": { + "vue-template-compiler@2.6.14": { + "peerDependencies": { + "vue": "2.6.14" + } + }, + "vue-template-compiler@2.7.10": { + "peerDependencies": { + "vue": "2.7.10" + } + }, + "@vue/composition-api": { + "peerDependencies": { + "vue": "2.6.14" + } + }, + "vite-plugin-dts": { + "peerDependencies": { + "vue": "3.2.39" + } + }, + "vite-plugin-importus": { + "dependencies": { + "param-case": "^3.0.4" + } + }, + "vite-plugin-md": { + "peerDependenciesMeta": { + "@vitejs/plugin-vue": { + "optional": true + } + } + } + } + }, "browserslist": [ "> 1%", "last 2 versions" - ], - "engines": { - "node": ">=10.0.0" - }, - "resolutions": { - "vue": "~2.6.14", - "vue-template-compiler": "~2.6.14" - } + ] } diff --git a/packages/action-menu/index.js b/packages/action-menu/index.js deleted file mode 100644 index 7b73cbc19..000000000 --- a/packages/action-menu/index.js +++ /dev/null @@ -1,18 +0,0 @@ -import ActionMenu from './src/index.vue' -import '@opentiny/vue-theme/action-menu/index.css' - -/* istanbul ignore next */ -ActionMenu.install = function (Vue) { - Vue.component(ActionMenu.name, ActionMenu) -} - -ActionMenu.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - ActionMenu.install(window.Vue) - } -} - -export default ActionMenu diff --git a/packages/action-menu/package.json b/packages/action-menu/package.json deleted file mode 100644 index 11dc68f03..000000000 --- a/packages/action-menu/package.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "name": "@opentiny/vue-action-menu", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-dropdown": "~0.1.0", - "@opentiny/vue-dropdown-menu": "~0.1.0", - "@opentiny/vue-dropdown-item": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/action-menu/src/index.vue b/packages/action-menu/src/index.vue deleted file mode 100644 index 717bf960e..000000000 --- a/packages/action-menu/src/index.vue +++ /dev/null @@ -1,89 +0,0 @@ - - - diff --git a/packages/action-sheet/index.js b/packages/action-sheet/index.js deleted file mode 100644 index d96314c3a..000000000 --- a/packages/action-sheet/index.js +++ /dev/null @@ -1,33 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import ActionSheet from './src/index.vue' - -ActionSheet.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -ActionSheet.install = function (Vue) { - Vue.component(ActionSheet.name, ActionSheet) -} - -ActionSheet.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - ActionSheet.install(window.Vue) - } -} - -export default ActionSheet diff --git a/packages/action-sheet/src/index.vue b/packages/action-sheet/src/index.vue deleted file mode 100644 index 7b0e9a6d9..000000000 --- a/packages/action-sheet/src/index.vue +++ /dev/null @@ -1,78 +0,0 @@ - - - - diff --git a/packages/alert/index.js b/packages/alert/index.js deleted file mode 100644 index 00d3662aa..000000000 --- a/packages/alert/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Alert from './src/index' - -/* istanbul ignore next */ -Alert.install = function (Vue) { - Vue.component(Alert.name, Alert) -} - -Alert.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Alert.install(window.Vue) - } -} - -export default Alert diff --git a/packages/alert/package.json b/packages/alert/package.json deleted file mode 100644 index ebb3ddcea..000000000 --- a/packages/alert/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-alert", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/alert/src/index.js b/packages/alert/src/index.js deleted file mode 100644 index 9c25c6297..000000000 --- a/packages/alert/src/index.js +++ /dev/null @@ -1,78 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const $constants = { - ICON_MAP: { - success: 'icon-success', - error: 'icon-error', - info: 'icon-help', - warning: 'icon-warning' - }, - TITLE_MAP: { - success: 'ui.alert.success', - error: 'ui.alert.error', - info: 'ui.alert.info', - warning: 'ui.alert.warning' - } -} - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'Alert', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - icon: [String, Object], - type: { - type: String, - default: 'success' - }, - size: { - type: String, - default: 'normal' - }, - description: { - type: String, - default: '' - }, - title: { - type: String - }, - center: Boolean, - showIcon: { - type: Boolean, - default: true - }, - closable: { - type: Boolean, - default: true - }, - closeText: { - type: String, - default: '' - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/alert/src/mobile.vue b/packages/alert/src/mobile.vue deleted file mode 100644 index 8d1783e7f..000000000 --- a/packages/alert/src/mobile.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - - diff --git a/packages/alert/src/pc.vue b/packages/alert/src/pc.vue deleted file mode 100644 index b2ae0d3ab..000000000 --- a/packages/alert/src/pc.vue +++ /dev/null @@ -1,59 +0,0 @@ - - - - diff --git a/packages/amount/index.js b/packages/amount/index.js deleted file mode 100644 index ff2cbcaad..000000000 --- a/packages/amount/index.js +++ /dev/null @@ -1,23 +0,0 @@ -import Amount from './src/index.vue' -import '@opentiny/vue-theme/amount/index.css' - -Amount.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Amount.install = function (Vue) { - Vue.component(Amount.name, Amount) -} - -Amount.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Amount.install(window.Vue) - } -} - -export default Amount diff --git a/packages/amount/package.json b/packages/amount/package.json deleted file mode 100644 index a9ad75c76..000000000 --- a/packages/amount/package.json +++ /dev/null @@ -1,22 +0,0 @@ -{ - "name": "@opentiny/vue-amount", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-date-picker": "~0.1.0", - "@opentiny/vue-currency": "~0.1.0", - "@opentiny/vue-button": "~0.1.0", - "@opentiny/vue-input": "~0.1.0", - "@opentiny/vue-popover": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/amount/src/index.vue b/packages/amount/src/index.vue deleted file mode 100644 index 157aaf716..000000000 --- a/packages/amount/src/index.vue +++ /dev/null @@ -1,163 +0,0 @@ - - - diff --git a/packages/area/index.js b/packages/area/index.js deleted file mode 100644 index 0cf11f589..000000000 --- a/packages/area/index.js +++ /dev/null @@ -1,23 +0,0 @@ -import Area from './src/index.vue' -import '@opentiny/vue-theme/area/index.css' - -Area.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Area.install = function (Vue) { - Vue.component(Area.name, Area) -} - -Area.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Area.install(window.Vue) - } -} - -export default Area diff --git a/packages/area/package.json b/packages/area/package.json deleted file mode 100644 index 2bd0e71b1..000000000 --- a/packages/area/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-area", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-select": "~0.1.0", - "@opentiny/vue-option": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/area/src/index.vue b/packages/area/src/index.vue deleted file mode 100644 index 34b7b8cf3..000000000 --- a/packages/area/src/index.vue +++ /dev/null @@ -1,115 +0,0 @@ - - - diff --git a/packages/autocomplete/index.js b/packages/autocomplete/index.js deleted file mode 100644 index c549ff915..000000000 --- a/packages/autocomplete/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Autocomplete from './src/index' -import '@opentiny/vue-theme/autocomplete/index.css' - -Autocomplete.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Autocomplete.install = function (Vue) { - Vue.component(Autocomplete.name, Autocomplete) -} - -Autocomplete.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Autocomplete.install(window.Vue) - } -} - -export default Autocomplete diff --git a/packages/autocomplete/package.json b/packages/autocomplete/package.json deleted file mode 100644 index b8acd4b7f..000000000 --- a/packages/autocomplete/package.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "name": "@opentiny/vue-autocomplete", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-input": "~0.1.0", - "@opentiny/vue-scrollbar": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/autocomplete/src/index.js b/packages/autocomplete/src/index.js deleted file mode 100644 index 38b1ad795..000000000 --- a/packages/autocomplete/src/index.js +++ /dev/null @@ -1,84 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - WARP_CLS: '.tiny-autocomplete-suggestion__wrap', - ITEM_CLS: '.tiny-autocomplete-suggestion__list li' -} - -const template = function () { - return PCTemplate -} - -export default { - name: $prefix + 'Autocomplete', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - autofocus: Boolean, - clearable: { - type: Boolean, - default: () => false - }, - customItem: String, - debounce: { - type: Number, - default: () => 300 - }, - disabled: Boolean, - fetchSuggestions: Function, - hideLoading: Boolean, - highlightFirstItem: { - type: Boolean, - default: () => false - }, - label: String, - maxlength: Number, - minlength: Number, - modelValue: String, - name: String, - placeholder: String, - placement: { - type: String, - default: () => 'bottom-start' - }, - popperAppendToBody: { - type: Boolean, - default: () => true - }, - popperClass: String, - popperOptions: Object, - prefixIcon: [String, Object], - selectWhenUnmatched: { - type: Boolean, - default: () => false - }, - size: String, - suffixIcon: [String, Object], - triggerOnFocus: { - type: Boolean, - default: () => true - }, - valueKey: { - type: String, - default: () => 'value' - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/autocomplete/src/pc.vue b/packages/autocomplete/src/pc.vue deleted file mode 100644 index cbe9eaf5d..000000000 --- a/packages/autocomplete/src/pc.vue +++ /dev/null @@ -1,122 +0,0 @@ - - - - diff --git a/packages/avatar/index.js b/packages/avatar/index.js deleted file mode 100644 index 2290ff3f0..000000000 --- a/packages/avatar/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Avatar from './src/index.vue' -import '@opentiny/vue-theme-mobile/avatar/index.css' - -/* istanbul ignore next */ -Avatar.install = function (Vue) { - Vue.component(Avatar.name, Avatar) -} - -Avatar.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Avatar.install(window.Vue) - } -} - -export default Avatar diff --git a/packages/avatar/package.json b/packages/avatar/package.json deleted file mode 100644 index f47e0cd54..000000000 --- a/packages/avatar/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-avatar", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/avatar/src/index.vue b/packages/avatar/src/index.vue deleted file mode 100644 index 4fe185be2..000000000 --- a/packages/avatar/src/index.vue +++ /dev/null @@ -1,95 +0,0 @@ - - diff --git a/packages/badge/index.js b/packages/badge/index.js deleted file mode 100644 index eb31c9889..000000000 --- a/packages/badge/index.js +++ /dev/null @@ -1,33 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Badge from './src/index' - -Badge.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Badge.install = function (Vue) { - Vue.component(Badge.name, Badge) -} - -Badge.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Badge.install(window.Vue) - } -} - -export default Badge diff --git a/packages/badge/package.json b/packages/badge/package.json deleted file mode 100644 index 14ce10713..000000000 --- a/packages/badge/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-badge", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/badge/src/index.js b/packages/badge/src/index.js deleted file mode 100644 index 0b51866e5..000000000 --- a/packages/badge/src/index.js +++ /dev/null @@ -1,64 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') { - return PCTemplate - } else if (process.env.TINY_MODE === 'mobile') { - return MobileTemplate - } else { - return mode === 'mobile' ? MobileTemplate : PCTemplate - } -} - -export default { - name: $prefix + 'Badge', - props: { - ...$props, - isDot: { - type: Boolean, - default: false - }, - isFixed: { - type: Boolean, - default: true - }, - isMini: { - type: Boolean, - default: false - }, - max: Number, - value: [String, Number], - modelValue: [String, Number], - href: String, - target: String, - hidden: { - type: Boolean, - default: false - }, - type: { - type: String, - validator: (value) => ~['primary', 'success', 'warning', 'info', 'danger'].indexOf(value) - }, - badgeClass: String, - offset: { - type: Array, - default: [0, 0] - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/badge/src/mobile.vue b/packages/badge/src/mobile.vue deleted file mode 100644 index da09535e8..000000000 --- a/packages/badge/src/mobile.vue +++ /dev/null @@ -1,48 +0,0 @@ - - - - diff --git a/packages/badge/src/pc.vue b/packages/badge/src/pc.vue deleted file mode 100644 index 6b785e4d6..000000000 --- a/packages/badge/src/pc.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - - diff --git a/packages/breadcrumb-item/index.js b/packages/breadcrumb-item/index.js deleted file mode 100644 index a9b7eac1f..000000000 --- a/packages/breadcrumb-item/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import BreadcrumbItem from './src/index' -import '@opentiny/vue-theme/breadcrumb-item/index.css' - -/* istanbul ignore next */ -BreadcrumbItem.install = function (Vue) { - Vue.component(BreadcrumbItem.name, BreadcrumbItem) -} - -BreadcrumbItem.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - BreadcrumbItem.install(window.Vue) - } -} - -export default BreadcrumbItem diff --git a/packages/breadcrumb-item/package.json b/packages/breadcrumb-item/package.json deleted file mode 100644 index 2e01797e0..000000000 --- a/packages/breadcrumb-item/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-breadcrumb-item", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/breadcrumb-item/src/index.js b/packages/breadcrumb-item/src/index.js deleted file mode 100644 index 197b479cb..000000000 --- a/packages/breadcrumb-item/src/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'BreadcrumbItem', - props: { - ...$props, - to: Object, - replace: { - type: Boolean, - default: false - }, - option: { - type: Object, - default: () => ({}) - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/breadcrumb-item/src/pc.vue b/packages/breadcrumb-item/src/pc.vue deleted file mode 100644 index 9a4482e5f..000000000 --- a/packages/breadcrumb-item/src/pc.vue +++ /dev/null @@ -1,36 +0,0 @@ - - - - diff --git a/packages/breadcrumb/index.js b/packages/breadcrumb/index.js deleted file mode 100644 index 763521134..000000000 --- a/packages/breadcrumb/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Breadcrumb from './src/index' -import '@opentiny/vue-theme/breadcrumb/index.css' - -/* istanbul ignore next */ -Breadcrumb.install = function (Vue) { - Vue.component(Breadcrumb.name, Breadcrumb) -} - -Breadcrumb.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Breadcrumb.install(window.Vue) - } -} - -export default Breadcrumb diff --git a/packages/breadcrumb/package.json b/packages/breadcrumb/package.json deleted file mode 100644 index 713dc32a4..000000000 --- a/packages/breadcrumb/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-breadcrumb", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/breadcrumb/src/index.js b/packages/breadcrumb/src/index.js deleted file mode 100644 index e8c5134cd..000000000 --- a/packages/breadcrumb/src/index.js +++ /dev/null @@ -1,49 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate -const $constants = { - EVENT_NAME: { - breadcrumbItemSelect: 'breadcrumbItemSelect' - } -} - -export default { - name: $prefix + 'Breadcrumb', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - separator: { - type: String, - default: '>' - }, - separatorIcon: { - type: Object - }, - textField: { - type: String, - default: 'label' - }, - options: { - type: Array, - default: () => [] - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/breadcrumb/src/pc.vue b/packages/breadcrumb/src/pc.vue deleted file mode 100644 index 6ba61564c..000000000 --- a/packages/breadcrumb/src/pc.vue +++ /dev/null @@ -1,41 +0,0 @@ - - - - diff --git a/packages/bulletin-board/index.js b/packages/bulletin-board/index.js deleted file mode 100644 index b5bc7634b..000000000 --- a/packages/bulletin-board/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import BulletinBoard from './src/index' -import '@opentiny/vue-theme/bulletin-board/index.css' - -/* istanbul ignore next */ -BulletinBoard.install = function (Vue) { - Vue.component(BulletinBoard.name, BulletinBoard) -} - -BulletinBoard.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - BulletinBoard.install(window.Vue) - } -} - -export default BulletinBoard diff --git a/packages/bulletin-board/package.json b/packages/bulletin-board/package.json deleted file mode 100644 index f04ac815a..000000000 --- a/packages/bulletin-board/package.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "name": "@opentiny/vue-bulletin-board", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-tabs": "~0.1.0", - "@opentiny/vue-tab-item": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/bulletin-board/src/index.js b/packages/bulletin-board/src/index.js deleted file mode 100644 index 2a1eebcce..000000000 --- a/packages/bulletin-board/src/index.js +++ /dev/null @@ -1,48 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'BulletinBoard', - props: { - ...$props, - title: String, - icon: [Object, String], - showMore: { - type: Boolean, - default: true - }, - moreLink: { - type: Object, - default: () => {} - }, - tabTitle: { - type: Array, - required: true, - validator: (value) => Array.isArray(value) && value.length > 0 - }, - activeName: { - type: String, - default: '1' - }, - data: { - type: Array, - required: true - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/bulletin-board/src/pc.vue b/packages/bulletin-board/src/pc.vue deleted file mode 100644 index 8fc7114e8..000000000 --- a/packages/bulletin-board/src/pc.vue +++ /dev/null @@ -1,70 +0,0 @@ - - - - diff --git a/packages/button-group/index.js b/packages/button-group/index.js deleted file mode 100644 index c3335dd7a..000000000 --- a/packages/button-group/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import ButtonGroup from './src/index' -import '@opentiny/vue-theme/button-group/index.css' - -ButtonGroup.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -ButtonGroup.install = function (Vue) { - Vue.component(ButtonGroup.name, ButtonGroup) -} - -ButtonGroup.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - ButtonGroup.install(window.Vue) - } -} - -export default ButtonGroup diff --git a/packages/button-group/package.json b/packages/button-group/package.json deleted file mode 100644 index d4948aac5..000000000 --- a/packages/button-group/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-button-group", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/button-group/src/index.js b/packages/button-group/src/index.js deleted file mode 100644 index 3af3faa89..000000000 --- a/packages/button-group/src/index.js +++ /dev/null @@ -1,48 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'ButtonGroup', - provide() { - return { - buttonGroup: this - } - }, - props: { - ...$props, - size: String, - data: Array, - plain: Boolean, - modelValue: [String, Number], - disabled: Boolean, - valueField: { - type: String, - default: 'value' - }, - textField: { - type: String, - default: 'text' - }, - showMore: Number, - showEdit: { - type: Boolean, - default: false - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/button-group/src/pc.vue b/packages/button-group/src/pc.vue deleted file mode 100644 index c33219a49..000000000 --- a/packages/button-group/src/pc.vue +++ /dev/null @@ -1,87 +0,0 @@ - - - - diff --git a/packages/button/index.js b/packages/button/index.js deleted file mode 100644 index 93ac0e63b..000000000 --- a/packages/button/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Button from './src/index' - -/* istanbul ignore next */ -Button.install = function (Vue) { - Vue.component(Button.name, Button) -} - -Button.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Button.install(window.Vue) - } -} - -export default Button diff --git a/packages/button/package.json b/packages/button/package.json deleted file mode 100644 index eb09f13e2..000000000 --- a/packages/button/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-button", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/button/src/index.js b/packages/button/src/index.js deleted file mode 100644 index 340805cfe..000000000 --- a/packages/button/src/index.js +++ /dev/null @@ -1,63 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'Button', - inject: { - buttonGroup: { - default: '' - } - }, - props: { - ...$props, - type: { - type: String, - default: 'default' - }, - tabindex: { type: String, default: '1' }, - icon: { - type: [Object, String], - default: '' - }, - text: { - type: String, - default: '' - }, - resetTime: { - type: Number, - default: 1000 - }, - nativeType: { - type: String, - default: 'button' - }, - size: String, - round: Boolean, - plain: Boolean, - circle: Boolean, - loading: Boolean, - disabled: Boolean, - autofocus: Boolean - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/button/src/mobile.vue b/packages/button/src/mobile.vue deleted file mode 100644 index 1e5f171e9..000000000 --- a/packages/button/src/mobile.vue +++ /dev/null @@ -1,53 +0,0 @@ - - - - diff --git a/packages/button/src/pc.vue b/packages/button/src/pc.vue deleted file mode 100644 index cede11b37..000000000 --- a/packages/button/src/pc.vue +++ /dev/null @@ -1,56 +0,0 @@ - - - - diff --git a/packages/calendar/index.js b/packages/calendar/index.js deleted file mode 100644 index 67d90b8ba..000000000 --- a/packages/calendar/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Calendar from './src/index' -import '@opentiny/vue-theme/calendar/index.css' - -/* istanbul ignore next */ -Calendar.install = function (Vue) { - Vue.component(Calendar.name, Calendar) -} - -Calendar.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Calendar.install(window.Vue) - } -} - -export default Calendar diff --git a/packages/calendar/package.json b/packages/calendar/package.json deleted file mode 100644 index 89a3956f8..000000000 --- a/packages/calendar/package.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "name": "@opentiny/vue-calendar", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-tooltip": "~0.1.0", - "@opentiny/vue-popover": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/calendar/src/index.js b/packages/calendar/src/index.js deleted file mode 100644 index eb28d4547..000000000 --- a/packages/calendar/src/index.js +++ /dev/null @@ -1,68 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'Calendar', - props: { - ...$props, - - /** - * @property {String} [mode='month'] - 显示模式,month|year 可选 - */ - mode: { - type: String, - default: 'month', - validator: (value) => ~['month', 'year'].indexOf(value) - }, - - /** - * @property {Number} [year=getFullYear()] - 指定年份,默认今年 - */ - year: { - type: Number, - default() { - return new Date().getFullYear() - } - }, - - /** - * @property {Number} [month=getMonth()] - 指定月份,默认当月 - */ - month: { - type: Number, - default() { - return new Date().getMonth() + 1 - } - }, - - /** - * @property {Array} events - 事件列表 - * @example - * [{ time: 1534297845236, title: '消息', content: '这是一条消息', type: 'primary' }, - * { time: 1534297845236, title: '消息', content: '还有', type: 'info' }] - * type 类型: warning、error、info、success - */ - events: Array, - - /** - * @property {Boolean} [showSelected=false] - 显示选中的日期 - */ - showSelected: Boolean - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/calendar/src/pc.vue b/packages/calendar/src/pc.vue deleted file mode 100644 index 2c31ee879..000000000 --- a/packages/calendar/src/pc.vue +++ /dev/null @@ -1,267 +0,0 @@ - - - - diff --git a/packages/card-template/index.js b/packages/card-template/index.js deleted file mode 100644 index 35815369a..000000000 --- a/packages/card-template/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CardTemplate from './src/index' -import '@opentiny/vue-theme/card-template/index.css' - -/* istanbul ignore next */ -CardTemplate.install = function (Vue) { - Vue.component(CardTemplate.name, CardTemplate) -} - -CardTemplate.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - CardTemplate.install(window.Vue) - } -} - -export default CardTemplate diff --git a/packages/card-template/package.json b/packages/card-template/package.json deleted file mode 100644 index a8334c5c8..000000000 --- a/packages/card-template/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-card-template", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/card-template/src/index.js b/packages/card-template/src/index.js deleted file mode 100644 index f409ea999..000000000 --- a/packages/card-template/src/index.js +++ /dev/null @@ -1,40 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - MOREICON: 'icon-more' -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'CardTemplate', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - tools: Array, - header: String, - bodyStyle: Object, - headerLine: { - type: Boolean, - default: true - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/card-template/src/pc.vue b/packages/card-template/src/pc.vue deleted file mode 100644 index f9e33336e..000000000 --- a/packages/card-template/src/pc.vue +++ /dev/null @@ -1,70 +0,0 @@ - - - - diff --git a/packages/carousel-item/index.js b/packages/carousel-item/index.js deleted file mode 100644 index efefdb3bc..000000000 --- a/packages/carousel-item/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CarouselItem from './src/index' -import '@opentiny/vue-theme/carousel-item/index.css' - -/* istanbul ignore next */ -CarouselItem.install = function (Vue) { - Vue.component(CarouselItem.name, CarouselItem) -} - -CarouselItem.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - CarouselItem.install(window.Vue) - } -} - -export default CarouselItem diff --git a/packages/carousel-item/package.json b/packages/carousel-item/package.json deleted file mode 100644 index 6e61303f8..000000000 --- a/packages/carousel-item/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-carousel-item", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/carousel-item/src/index.js b/packages/carousel-item/src/index.js deleted file mode 100644 index f2dfa0ae7..000000000 --- a/packages/carousel-item/src/index.js +++ /dev/null @@ -1,41 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - TYPE_CARD: 'card', - TYPE_VERTICAL: 'vertical', - CARD_SCALE: 0.83 -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'CarouselItem', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - name: String, - title: String, - label: { - type: [String, Number], - default: '' - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/carousel-item/src/pc.vue b/packages/carousel-item/src/pc.vue deleted file mode 100644 index 1f5510efc..000000000 --- a/packages/carousel-item/src/pc.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - - diff --git a/packages/carousel/index.js b/packages/carousel/index.js deleted file mode 100644 index 2f609cfc2..000000000 --- a/packages/carousel/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Carousel from './src/index' -import '@opentiny/vue-theme/carousel/index.css' - -/* istanbul ignore next */ -Carousel.install = function (Vue) { - Vue.component(Carousel.name, Carousel) -} - -Carousel.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Carousel.install(window.Vue) - } -} - -export default Carousel diff --git a/packages/carousel/package.json b/packages/carousel/package.json deleted file mode 100644 index 3b963df48..000000000 --- a/packages/carousel/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-carousel", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/carousel/src/index.js b/packages/carousel/src/index.js deleted file mode 100644 index bd4eb88e1..000000000 --- a/packages/carousel/src/index.js +++ /dev/null @@ -1,70 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $setup, $prefix } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - CHILD_NAME: $prefix + 'CarouselItem' -} - -export default { - name: $prefix + 'Carousel', - componentName: 'Carousel', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - initialIndex: { - type: Number, - default: 0 - }, - height: String, - trigger: { - type: String, - default: 'hover' - }, - autoplay: { - type: Boolean, - default: false - }, - interval: { - type: Number, - default: 3000 - }, - loop: { - type: Boolean, - default: true - }, - indicatorPosition: String, - arrow: { - type: String, - default: 'hover' - }, - type: { - type: String, - validator: (value) => !value || ~['card', 'vertical'].indexOf(value) - }, - showTitle: { - type: Boolean, - default: false - } - }, - setup(props, context) { - return $setup({ - props, - context, - template: () => PCTemplate - }) - } -} diff --git a/packages/carousel/src/pc.vue b/packages/carousel/src/pc.vue deleted file mode 100644 index a13369696..000000000 --- a/packages/carousel/src/pc.vue +++ /dev/null @@ -1,83 +0,0 @@ - - - - diff --git a/packages/cascader-menu/index.js b/packages/cascader-menu/index.js deleted file mode 100644 index f7311d8df..000000000 --- a/packages/cascader-menu/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CascaderMenu from './src/index' -import '@opentiny/vue-theme/cascader-menu/index.css' - -/* istanbul ignore next */ -CascaderMenu.install = function (Vue) { - Vue.component(CascaderMenu.name, CascaderMenu) -} - -CascaderMenu.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - CascaderMenu.install(window.Vue) - } -} - -export default CascaderMenu diff --git a/packages/cascader-menu/package.json b/packages/cascader-menu/package.json deleted file mode 100644 index 330c7bf02..000000000 --- a/packages/cascader-menu/package.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "name": "@opentiny/vue-cascader-menu", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0", - "@opentiny/vue-scrollbar": "~0.1.0", - "@opentiny/vue-cascader-node": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/cascader-node/index.js b/packages/cascader-node/index.js deleted file mode 100644 index a0275a5a8..000000000 --- a/packages/cascader-node/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CascaderNode from './src/index.vue' -import '@opentiny/vue-theme/cascader-node/index.css' - -/* istanbul ignore next */ -CascaderNode.install = function (Vue) { - Vue.component(CascaderNode.name, CascaderNode) -} - -CascaderNode.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - CascaderNode.install(window.Vue) - } -} - -export default CascaderNode diff --git a/packages/cascader-node/package.json b/packages/cascader-node/package.json deleted file mode 100644 index 545348b92..000000000 --- a/packages/cascader-node/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-cascader-node", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-checkbox": "~0.1.0", - "@opentiny/vue-radio": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/cascader-node/src/index.vue b/packages/cascader-node/src/index.vue deleted file mode 100644 index 7fab9fc87..000000000 --- a/packages/cascader-node/src/index.vue +++ /dev/null @@ -1,159 +0,0 @@ - - diff --git a/packages/cascader-panel/index.js b/packages/cascader-panel/index.js deleted file mode 100644 index 9739f2971..000000000 --- a/packages/cascader-panel/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CascaderPanel from './src/index.vue' -import '@opentiny/vue-theme/cascader-panel/index.css' - -CascaderPanel.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -CascaderPanel.install = function (Vue) { - Vue.component(CascaderPanel.name, CascaderPanel) -} - -CascaderPanel.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - CascaderPanel.install(window.Vue) - } -} - -export default CascaderPanel diff --git a/packages/cascader-panel/package.json b/packages/cascader-panel/package.json deleted file mode 100644 index bb37edaee..000000000 --- a/packages/cascader-panel/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-cascader-panel", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-cascader-menu": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/cascader-panel/src/index.vue b/packages/cascader-panel/src/index.vue deleted file mode 100644 index af0b65aa5..000000000 --- a/packages/cascader-panel/src/index.vue +++ /dev/null @@ -1,49 +0,0 @@ - - - - diff --git a/packages/cascader/index.js b/packages/cascader/index.js deleted file mode 100644 index 56f4833a2..000000000 --- a/packages/cascader/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Cascader from './src/index' -import '@opentiny/vue-theme/cascader/index.css' - -Cascader.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Cascader.install = function (Vue) { - Vue.component(Cascader.name, Cascader) -} - -Cascader.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Cascader.install(window.Vue) - } -} - -export default Cascader diff --git a/packages/cascader/package.json b/packages/cascader/package.json deleted file mode 100644 index 0d070133d..000000000 --- a/packages/cascader/package.json +++ /dev/null @@ -1,21 +0,0 @@ -{ - "name": "@opentiny/vue-cascader", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-input": "~0.1.0", - "@opentiny/vue-tag": "~0.1.0", - "@opentiny/vue-scrollbar": "~0.1.0", - "@opentiny/vue-cascader-panel": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/cascader/src/index.js b/packages/cascader/src/index.js deleted file mode 100644 index 7a7beb646..000000000 --- a/packages/cascader/src/index.js +++ /dev/null @@ -1,72 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - placeholder: 'ui.cascader.placeholder', - COMPONENT_NAME: { FormItem: 'FormItem' }, - EVENT_NAME: { FormBlur: 'form.blur' } -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'Cascader', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - autoSize: Boolean, - beforeFilter: { - type: Function, - default: () => () => { - // do nothing - } - }, - clearable: Boolean, - collapseTags: Boolean, - debounce: { - type: Number, - default: 300 - }, - disabled: Boolean, - filterMethod: Function, - filterable: Boolean, - modelValue: {}, - options: Array, - placeholder: { - type: String, - default: '' - }, - popperAppendToBody: { - type: Boolean, - default: true - }, - popperClass: String, - props: Object, - separator: { - type: String, - default: '/' - }, - showAllLevels: { - type: Boolean, - default: true - }, - size: String - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/cascader/src/pc.vue b/packages/cascader/src/pc.vue deleted file mode 100644 index 24c6791ae..000000000 --- a/packages/cascader/src/pc.vue +++ /dev/null @@ -1,183 +0,0 @@ - - - - diff --git a/packages/chart/autonavi-map/index.js b/packages/chart/autonavi-map/index.js deleted file mode 100644 index c86834d96..000000000 --- a/packages/chart/autonavi-map/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import AMap from './src/index.js' - -/* istanbul ignore next */ -AMap.install = function (Vue) { - Vue.component(AMap.name, AMap) -} - -AMap.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - AMap.install(window.Vue) - } -} - -export default AMap diff --git a/packages/chart/autonavi-map/package.json b/packages/chart/autonavi-map/package.json deleted file mode 100644 index 011a2d205..000000000 --- a/packages/chart/autonavi-map/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-autonavi-map", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/autonavi-map/src/AMapCoordSys.js b/packages/chart/autonavi-map/src/AMapCoordSys.js deleted file mode 100644 index 29a69e346..000000000 --- a/packages/chart/autonavi-map/src/AMapCoordSys.js +++ /dev/null @@ -1,119 +0,0 @@ -import * as echarts from 'echarts' - -export default class AMapCoordSys { - constructor(amap, api) { - this._amap = amap - this.dimensions = ['lng', 'lat'] - this._mapOffset = [0, 0] - this._api = api - } - - static create(ecModel, api) { - let tinySys - let root = api.getDom() - - ecModel.eachComponent('amap', (tinyModel) => { - let viewportRoot = api.getZr().painter.getViewportRoot() - - if (typeof window.AMap === 'undefined') { - throw new Error('AMap api is not loaded') - } - - if (tinySys) { - throw new Error('Only one amap component can exist') - } - - if (!tinyModel.__amap) { - let amapRoot = root.querySelector('.ec-extension-amap') - - if (amapRoot) { - viewportRoot.style.left = '0px' - viewportRoot.style.top = '0px' - root.removeChild(amapRoot) - } - amapRoot = document.createElement('div') - amapRoot.style.cssText = 'width:100%;height:100%' - - amapRoot.classList.add('ec-extension-amap') - root.appendChild(amapRoot) - - let options = tinyModel.get() || {} - - options = tinyModel.__options = echarts.util.clone(options) - - let amap = (tinyModel.__amap = new window.AMap.Map(amapRoot, options)) - - let layer = (tinyModel.__layer = new window.AMap.CustomLayer(viewportRoot)) - - layer.setMap(amap) - } - - let tinyApm = tinyModel.getAMap() - let tinyOut = tinyModel.getLayer() - tinyOut.hide() - - let tinyZoom = tinyApm.getZoom() - let tinyCenter = tinyApm.getCenter() - - tinySys = new AMapCoordSys(tinyApm, api) - tinySys.setMapOffset(tinyModel.__mapOffset || [0, 0]) - tinySys.setZoom(tinyZoom) - tinySys.setCenter([tinyCenter.lng, tinyCenter.lat]) - tinyModel.coordinateSystem = tinySys - tinyOut.show() - }) - - ecModel.eachSeries((seriesModel) => { - if (seriesModel.get('coordinateSystem') === 'amap') { - seriesModel.coordinateSystem = tinySys - } - }) - } - - setZoom(zoom) { - this._zoom = zoom - } - - setCenter(center) { - this._center = this._amap.lnglatToPixel(center) - } - - setMapOffset(mapOffset) { - this._mapOffset = mapOffset - } - - getAMap() { - return this._amap - } - - dataToPoint(data) { - let point = new window.AMap.LngLat(data[0], data[1]) - let px = this._amap.lngLatToContainer(point) - let mapOffset = this._mapOffset - - return [px.x - mapOffset[0], px.y - mapOffset[1]] - } - - pointToData(pt) { - let mapOffset = this._mapOffset - - pt = this._amap.containerToLngLat({ - x: pt[0] + mapOffset[0], - y: pt[1] + mapOffset[1] - }) - - return [pt.lng, pt.lat] - } - - getViewRect() { - let api = this._api - - return new echarts.graphic.BoundingRect(0, 0, api.getWidth(), api.getHeight()) - } - - getRoamTransform() { - return echarts.matrix.create() - } -} - -AMapCoordSys.dimensions = AMapCoordSys.prototype.dimensions diff --git a/packages/chart/autonavi-map/src/index.js b/packages/chart/autonavi-map/src/index.js deleted file mode 100644 index 79718a2a3..000000000 --- a/packages/chart/autonavi-map/src/index.js +++ /dev/null @@ -1,15 +0,0 @@ -import './amap' -import { amap } from '@opentiny/vue-renderless/autonavi-map/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -export default { - ...Core, - ...{ - name: $prefix + 'ChartAutonaviMap', - data() { - this.chartHandler = amap - return {} - } - } -} diff --git a/packages/chart/baidu-map/index.js b/packages/chart/baidu-map/index.js deleted file mode 100644 index 45b8409fb..000000000 --- a/packages/chart/baidu-map/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import BMap from './src/index.js' - -/* istanbul ignore next */ -BMap.install = function (Vue) { - Vue.component(BMap.name, BMap) -} - -BMap.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - BMap.install(window.Vue) - } -} - -export default BMap diff --git a/packages/chart/baidu-map/package.json b/packages/chart/baidu-map/package.json deleted file mode 100644 index 143cefc4b..000000000 --- a/packages/chart/baidu-map/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-baidu-map", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/baidu-map/src/index.js b/packages/chart/baidu-map/src/index.js deleted file mode 100644 index ffb378f08..000000000 --- a/packages/chart/baidu-map/src/index.js +++ /dev/null @@ -1,15 +0,0 @@ -import 'echarts/extension/bmap/bmap' -import { bmap } from '@opentiny/vue-renderless/baidu-map/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -export default { - ...Core, - ...{ - name: $prefix + 'ChartBaiduMap', - data() { - this.chartHandler = bmap - return {} - } - } -} diff --git a/packages/chart/chart-bar/index.js b/packages/chart/chart-bar/index.js deleted file mode 100644 index d2e424c82..000000000 --- a/packages/chart/chart-bar/index.js +++ /dev/null @@ -1,20 +0,0 @@ -import Bar from './src/index.js' -import { histogram, bar } from '@opentiny/vue-renderless/chart-bar/index' - -/* istanbul ignore next */ -Bar.install = function (Vue) { - Vue.component(Bar.name, Bar) -} - -Bar.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Bar.install(window.Vue) - } -} - -export { histogram, bar } - -export default Bar diff --git a/packages/chart/chart-bar/package.json b/packages/chart/chart-bar/package.json deleted file mode 100644 index 2f5643d37..000000000 --- a/packages/chart/chart-bar/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-chart-bar", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-bar/src/index.js b/packages/chart/chart-bar/src/index.js deleted file mode 100644 index 7cf6bb633..000000000 --- a/packages/chart/chart-bar/src/index.js +++ /dev/null @@ -1,20 +0,0 @@ -import * as echarts from 'echarts/core' -import { GridComponent } from 'echarts/components' -import { BarChart } from 'echarts/charts' -import { CanvasRenderer } from 'echarts/renderers' -import { bar } from '@opentiny/vue-renderless/chart-bar/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -echarts.use([GridComponent, BarChart, CanvasRenderer]) - -export default { - ...Core, - ...{ - name: $prefix + 'ChartBar', - data() { - this.chartHandler = bar - return {} - } - } -} diff --git a/packages/chart/chart-boxplot/index.js b/packages/chart/chart-boxplot/index.js deleted file mode 100644 index be6db3075..000000000 --- a/packages/chart/chart-boxplot/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import Boxplot from './src/index.js' - -/* istanbul ignore next */ -Boxplot.install = function (Vue) { - Vue.component(Boxplot.name, Boxplot) -} - -Boxplot.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Boxplot.install(window.Vue) - } -} - -export default Boxplot diff --git a/packages/chart/chart-boxplot/package.json b/packages/chart/chart-boxplot/package.json deleted file mode 100644 index 4892ed6ba..000000000 --- a/packages/chart/chart-boxplot/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-chart-boxplot", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-boxplot/src/index.js b/packages/chart/chart-boxplot/src/index.js deleted file mode 100644 index c7f3d64dd..000000000 --- a/packages/chart/chart-boxplot/src/index.js +++ /dev/null @@ -1,23 +0,0 @@ -import * as echarts from 'echarts/core' -import { DatasetComponent, GridComponent, DataZoomComponent, TransformComponent } from 'echarts/components' -import { BoxplotChart, ScatterChart } from 'echarts/charts' -import { UniversalTransition } from 'echarts/features' -import { CanvasRenderer } from 'echarts/renderers' -import { prepareBoxplotData } from 'echarts/dist/extension/dataTool' -import { boxplot } from '@opentiny/vue-renderless/chart-boxplot' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -echarts.use([DatasetComponent, GridComponent, DataZoomComponent, TransformComponent, BoxplotChart, ScatterChart, CanvasRenderer, UniversalTransition]) - -export default { - ...Core, - ...{ - name: $prefix + 'ChartBoxplot', - data() { - this.prepareBoxplotData = prepareBoxplotData - this.chartHandler = boxplot - return {} - } - } -} diff --git a/packages/chart/chart-candle/index.js b/packages/chart/chart-candle/index.js deleted file mode 100644 index 700cdc9e0..000000000 --- a/packages/chart/chart-candle/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import Candle from './src/index.js' - -/* istanbul ignore next */ -Candle.install = function (Vue) { - Vue.component(Candle.name, Candle) -} - -Candle.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Candle.install(window.Vue) - } -} - -export default Candle diff --git a/packages/chart/chart-candle/package.json b/packages/chart/chart-candle/package.json deleted file mode 100644 index 81d7ca92a..000000000 --- a/packages/chart/chart-candle/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-chart-candle", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-candle/src/index.js b/packages/chart/chart-candle/src/index.js deleted file mode 100644 index 728fc0caa..000000000 --- a/packages/chart/chart-candle/src/index.js +++ /dev/null @@ -1,31 +0,0 @@ -import * as echarts from 'echarts/core' -import { GraphicComponent, GridComponent, DataZoomComponent, MarkLineComponent, MarkPointComponent } from 'echarts/components' -import { BarChart, CandlestickChart, LineChart } from 'echarts/charts' -import { UniversalTransition } from 'echarts/features' -import { CanvasRenderer } from 'echarts/renderers' -import { candle } from '@opentiny/vue-renderless/chart-candle/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -echarts.use([ - GraphicComponent, - GridComponent, - DataZoomComponent, - BarChart, - MarkLineComponent, - MarkPointComponent, - CandlestickChart, - LineChart, - CanvasRenderer, - UniversalTransition -]) -export default { - ...Core, - ...{ - name: $prefix + 'ChartCandle', - data() { - this.chartHandler = candle - return {} - } - } -} diff --git a/packages/chart/chart-core/index.js b/packages/chart/chart-core/index.js deleted file mode 100644 index e68b41151..000000000 --- a/packages/chart/chart-core/index.js +++ /dev/null @@ -1,11 +0,0 @@ -import Core from './src/index.vue' -import '@opentiny/vue-theme/chart-core/index.css' - -/* istanbul ignore next */ -Core.install = function (Vue) { - Vue.component(Core.name, Core) -} - -Core.version = process.env.COMPONENT_VERSION - -export default Core diff --git a/packages/chart/chart-core/package.json b/packages/chart/chart-core/package.json deleted file mode 100644 index 528797727..000000000 --- a/packages/chart/chart-core/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-chart-core", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "echarts": "5.2.1", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-core/src/index.vue b/packages/chart/chart-core/src/index.vue deleted file mode 100644 index fe908f2ac..000000000 --- a/packages/chart/chart-core/src/index.vue +++ /dev/null @@ -1,108 +0,0 @@ - - - diff --git a/packages/chart/chart-funnel/index.js b/packages/chart/chart-funnel/index.js deleted file mode 100644 index e1f2bb9fa..000000000 --- a/packages/chart/chart-funnel/index.js +++ /dev/null @@ -1,20 +0,0 @@ -import Funnel from './src/index.js' -import { funnel } from '@opentiny/vue-renderless/chart-funnel/index' - -/* istanbul ignore next */ -Funnel.install = function (Vue) { - Vue.component(Funnel.name, Funnel) -} - -Funnel.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Funnel.install(window.Vue) - } -} - -export { funnel } - -export default Funnel diff --git a/packages/chart/chart-funnel/package.json b/packages/chart/chart-funnel/package.json deleted file mode 100644 index 70708be70..000000000 --- a/packages/chart/chart-funnel/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-chart-funnel", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-funnel/src/index.js b/packages/chart/chart-funnel/src/index.js deleted file mode 100644 index 3a1266bcf..000000000 --- a/packages/chart/chart-funnel/src/index.js +++ /dev/null @@ -1,20 +0,0 @@ -import * as echarts from 'echarts/core' -import { ToolboxComponent } from 'echarts/components' -import { FunnelChart } from 'echarts/charts' -import { CanvasRenderer } from 'echarts/renderers' -import { funnel } from '@opentiny/vue-renderless/chart-funnel/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -echarts.use([ToolboxComponent, FunnelChart, CanvasRenderer]) - -export default { - ...Core, - ...{ - name: $prefix + 'ChartFunnel', - data() { - this.chartHandler = funnel - return {} - } - } -} diff --git a/packages/chart/chart-gauge/index.js b/packages/chart/chart-gauge/index.js deleted file mode 100644 index adcd22334..000000000 --- a/packages/chart/chart-gauge/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import Gauge from './src/index.vue' - -/* istanbul ignore next */ -Gauge.install = function (Vue) { - Vue.component(Gauge.name, Gauge) -} - -Gauge.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Gauge.install(window.Vue) - } -} - -export default Gauge diff --git a/packages/chart/chart-gauge/package.json b/packages/chart/chart-gauge/package.json deleted file mode 100644 index 20c52b6e9..000000000 --- a/packages/chart/chart-gauge/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-chart-gauge", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-gauge/src/index.vue b/packages/chart/chart-gauge/src/index.vue deleted file mode 100644 index 676476952..000000000 --- a/packages/chart/chart-gauge/src/index.vue +++ /dev/null @@ -1,21 +0,0 @@ - diff --git a/packages/chart/chart-graph/index.js b/packages/chart/chart-graph/index.js deleted file mode 100644 index ab97f12bb..000000000 --- a/packages/chart/chart-graph/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import Graph from './src/index.js' - -/* istanbul ignore next */ -Graph.install = function (Vue) { - Vue.component(Graph.name, Graph) -} - -Graph.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Graph.install(window.Vue) - } -} - -export default Graph diff --git a/packages/chart/chart-graph/package.json b/packages/chart/chart-graph/package.json deleted file mode 100644 index 0f7e5e87c..000000000 --- a/packages/chart/chart-graph/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-chart-graph", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-graph/src/index.js b/packages/chart/chart-graph/src/index.js deleted file mode 100644 index f940c5ec2..000000000 --- a/packages/chart/chart-graph/src/index.js +++ /dev/null @@ -1,20 +0,0 @@ -import * as echarts from 'echarts/core' -import { GridComponent } from 'echarts/components' -import { GraphChart } from 'echarts/charts' -import { CanvasRenderer } from 'echarts/renderers' -import { graph } from '@opentiny/vue-renderless/chart-graph/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -echarts.use([GridComponent, GraphChart, CanvasRenderer]) - -export default { - ...Core, - ...{ - name: $prefix + 'ChartGraph', - data() { - this.chartHandler = graph - return {} - } - } -} diff --git a/packages/chart/chart-heatmap/index.js b/packages/chart/chart-heatmap/index.js deleted file mode 100644 index b5c4356be..000000000 --- a/packages/chart/chart-heatmap/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import Heatmap from './src/index.js' - -/* istanbul ignore next */ -Heatmap.install = function (Vue) { - Vue.component(Heatmap.name, Heatmap) -} - -Heatmap.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Heatmap.install(window.Vue) - } -} - -export default Heatmap diff --git a/packages/chart/chart-heatmap/package.json b/packages/chart/chart-heatmap/package.json deleted file mode 100644 index cf2b10de9..000000000 --- a/packages/chart/chart-heatmap/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-chart-heatmap", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-heatmap/src/index.js b/packages/chart/chart-heatmap/src/index.js deleted file mode 100644 index 019ba69b5..000000000 --- a/packages/chart/chart-heatmap/src/index.js +++ /dev/null @@ -1,20 +0,0 @@ -import * as echarts from 'echarts/core' -import { HeatmapChart, MapChart } from 'echarts/charts' -import { GridComponent, VisualMapComponent } from 'echarts/components' -import 'echarts/extension/bmap/bmap' -import { heatmap } from '@opentiny/vue-renderless/chart-heatmap/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -echarts.use([HeatmapChart, MapChart, GridComponent, VisualMapComponent]) - -export default { - ...Core, - ...{ - name: $prefix + 'ChartHeatmap', - data() { - this.chartHandler = heatmap - return {} - } - } -} diff --git a/packages/chart/chart-histogram/index.js b/packages/chart/chart-histogram/index.js deleted file mode 100644 index 92175cdf1..000000000 --- a/packages/chart/chart-histogram/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import Histogram from './src/index.js' - -/* istanbul ignore next */ -Histogram.install = function (Vue) { - Vue.component(Histogram.name, Histogram) -} - -Histogram.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Histogram.install(window.Vue) - } -} - -export default Histogram diff --git a/packages/chart/chart-histogram/package.json b/packages/chart/chart-histogram/package.json deleted file mode 100644 index 682e9bf36..000000000 --- a/packages/chart/chart-histogram/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-chart-histogram", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-histogram/src/index.js b/packages/chart/chart-histogram/src/index.js deleted file mode 100644 index 47c3f303f..000000000 --- a/packages/chart/chart-histogram/src/index.js +++ /dev/null @@ -1,20 +0,0 @@ -import * as echarts from 'echarts/core' -import { GridComponent } from 'echarts/components' -import { BarChart } from 'echarts/charts' -import { CanvasRenderer } from 'echarts/renderers' -import { histogram } from '@opentiny/vue-renderless/chart-bar/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -echarts.use([GridComponent, BarChart, CanvasRenderer]) - -export default { - ...Core, - ...{ - name: $prefix + 'ChartHistogram', - data() { - this.chartHandler = histogram - return {} - } - } -} diff --git a/packages/chart/chart-line/index.js b/packages/chart/chart-line/index.js deleted file mode 100644 index 58bf74ce3..000000000 --- a/packages/chart/chart-line/index.js +++ /dev/null @@ -1,20 +0,0 @@ -import Line from './src/index.js' -import { line } from '@opentiny/vue-renderless/chart-line/index' - -/* istanbul ignore next */ -Line.install = function (Vue) { - Vue.component(Line.name, Line) -} - -Line.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Line.install(window.Vue) - } -} - -export { line } - -export default Line diff --git a/packages/chart/chart-line/package.json b/packages/chart/chart-line/package.json deleted file mode 100644 index 7ca52de0d..000000000 --- a/packages/chart/chart-line/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-chart-line", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-line/src/index.js b/packages/chart/chart-line/src/index.js deleted file mode 100644 index b4180ed2b..000000000 --- a/packages/chart/chart-line/src/index.js +++ /dev/null @@ -1,21 +0,0 @@ -import * as echarts from 'echarts/core' -import { ToolboxComponent, GridComponent } from 'echarts/components' -import { LineChart } from 'echarts/charts' -import { UniversalTransition } from 'echarts/features' -import { CanvasRenderer } from 'echarts/renderers' -import { line } from '@opentiny/vue-renderless/chart-line/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -echarts.use([ToolboxComponent, GridComponent, LineChart, UniversalTransition, CanvasRenderer]) - -export default { - ...Core, - ...{ - name: $prefix + 'ChartLine', - data() { - this.chartHandler = line - return {} - } - } -} diff --git a/packages/chart/chart-liquidfill/index.js b/packages/chart/chart-liquidfill/index.js deleted file mode 100644 index 8523fb8eb..000000000 --- a/packages/chart/chart-liquidfill/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import Liquidfill from './src/index.js' - -/* istanbul ignore next */ -Liquidfill.install = function (Vue) { - Vue.component(Liquidfill.name, Liquidfill) -} - -Liquidfill.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Liquidfill.install(window.Vue) - } -} - -export default Liquidfill diff --git a/packages/chart/chart-liquidfill/package.json b/packages/chart/chart-liquidfill/package.json deleted file mode 100644 index 9b2838c60..000000000 --- a/packages/chart/chart-liquidfill/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-chart-liquidfill", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0", - "echarts-liquidfill": "3.0.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-liquidfill/src/index.js b/packages/chart/chart-liquidfill/src/index.js deleted file mode 100644 index 7475b50d5..000000000 --- a/packages/chart/chart-liquidfill/src/index.js +++ /dev/null @@ -1,15 +0,0 @@ -import 'echarts-liquidfill' -import { liquidfill } from '@opentiny/vue-renderless/chart-liquidfill/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -export default { - ...Core, - ...{ - name: $prefix + 'ChartLiquidfill', - data() { - this.chartHandler = liquidfill - return {} - } - } -} diff --git a/packages/chart/chart-map/index.js b/packages/chart/chart-map/index.js deleted file mode 100644 index 7c4345a66..000000000 --- a/packages/chart/chart-map/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import ChartMap from './src/index.js' - -/* istanbul ignore next */ -ChartMap.install = function (Vue) { - Vue.component(ChartMap.name, ChartMap) -} - -ChartMap.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - ChartMap.install(window.Vue) - } -} - -export default ChartMap diff --git a/packages/chart/chart-map/package.json b/packages/chart/chart-map/package.json deleted file mode 100644 index 42d79f06b..000000000 --- a/packages/chart/chart-map/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-chart-map", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-map/src/index.js b/packages/chart/chart-map/src/index.js deleted file mode 100644 index 6678e7568..000000000 --- a/packages/chart/chart-map/src/index.js +++ /dev/null @@ -1,18 +0,0 @@ -import * as echarts from 'echarts/core' -import { MapChart } from 'echarts/charts' -import { map } from '@opentiny/vue-renderless/chart-map/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -echarts.use([MapChart]) - -export default { - ...Core, - ...{ - name: $prefix + 'ChartMap', - data() { - this.chartHandler = map - return {} - } - } -} diff --git a/packages/chart/chart-pie/index.js b/packages/chart/chart-pie/index.js deleted file mode 100644 index 01d095f3d..000000000 --- a/packages/chart/chart-pie/index.js +++ /dev/null @@ -1,20 +0,0 @@ -import Pie from './src/index.js' -import { ring, pie } from '@opentiny/vue-renderless/chart-pie/index' - -/* istanbul ignore next */ -Pie.install = function (Vue) { - Vue.component(Pie.name, Pie) -} - -Pie.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Pie.install(window.Vue) - } -} - -export { ring, pie } - -export default Pie diff --git a/packages/chart/chart-pie/package.json b/packages/chart/chart-pie/package.json deleted file mode 100644 index 925bed24a..000000000 --- a/packages/chart/chart-pie/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-chart-pie", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-pie/src/index.js b/packages/chart/chart-pie/src/index.js deleted file mode 100644 index 6510bede2..000000000 --- a/packages/chart/chart-pie/src/index.js +++ /dev/null @@ -1,20 +0,0 @@ -import * as echarts from 'echarts/core' -import { PieChart } from 'echarts/charts' -import { LabelLayout } from 'echarts/features' -import { CanvasRenderer } from 'echarts/renderers' -import { pie } from '@opentiny/vue-renderless/chart-pie/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -echarts.use([PieChart, LabelLayout, CanvasRenderer]) - -export default { - ...Core, - ...{ - name: $prefix + 'ChartPie', - data() { - this.chartHandler = pie - return {} - } - } -} diff --git a/packages/chart/chart-radar/index.js b/packages/chart/chart-radar/index.js deleted file mode 100644 index 17f641e6a..000000000 --- a/packages/chart/chart-radar/index.js +++ /dev/null @@ -1,20 +0,0 @@ -import Radar from './src/index.js' -import { radar } from '@opentiny/vue-renderless/chart-radar/index' - -/* istanbul ignore next */ -Radar.install = function (Vue) { - Vue.component(Radar.name, Radar) -} - -Radar.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Radar.install(window.Vue) - } -} - -export { radar } - -export default Radar diff --git a/packages/chart/chart-radar/package.json b/packages/chart/chart-radar/package.json deleted file mode 100644 index c5d183ba1..000000000 --- a/packages/chart/chart-radar/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-chart-radar", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-radar/src/index.js b/packages/chart/chart-radar/src/index.js deleted file mode 100644 index 81f823bf0..000000000 --- a/packages/chart/chart-radar/src/index.js +++ /dev/null @@ -1,19 +0,0 @@ -import * as echarts from 'echarts/core' -import { RadarChart } from 'echarts/charts' -import { CanvasRenderer } from 'echarts/renderers' -import { radar } from '@opentiny/vue-renderless/chart-radar/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -echarts.use([RadarChart, CanvasRenderer]) - -export default { - ...Core, - ...{ - name: $prefix + 'ChartRadar', - data() { - this.chartHandler = radar - return {} - } - } -} diff --git a/packages/chart/chart-ring/index.js b/packages/chart/chart-ring/index.js deleted file mode 100644 index 82324b9c4..000000000 --- a/packages/chart/chart-ring/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import Ring from './src/index.js' - -/* istanbul ignore next */ -Ring.install = function (Vue) { - Vue.component(Ring.name, Ring) -} - -Ring.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Ring.install(window.Vue) - } -} - -export default Ring diff --git a/packages/chart/chart-ring/package.json b/packages/chart/chart-ring/package.json deleted file mode 100644 index 3b337d383..000000000 --- a/packages/chart/chart-ring/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-chart-ring", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-ring/src/index.js b/packages/chart/chart-ring/src/index.js deleted file mode 100644 index 32b684b7a..000000000 --- a/packages/chart/chart-ring/src/index.js +++ /dev/null @@ -1,20 +0,0 @@ -import * as echarts from 'echarts/core' -import { PieChart } from 'echarts/charts' -import { LabelLayout } from 'echarts/features' -import { CanvasRenderer } from 'echarts/renderers' -import { ring } from '@opentiny/vue-renderless/chart-pie/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -echarts.use([PieChart, LabelLayout, CanvasRenderer]) - -export default { - ...Core, - ...{ - name: $prefix + 'ChartRing', - data() { - this.chartHandler = ring - return {} - } - } -} diff --git a/packages/chart/chart-sankey/index.js b/packages/chart/chart-sankey/index.js deleted file mode 100644 index 199a3680e..000000000 --- a/packages/chart/chart-sankey/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import Sankey from './src/index.js' - -/* istanbul ignore next */ -Sankey.install = function (Vue) { - Vue.component(Sankey.name, Sankey) -} - -Sankey.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Sankey.install(window.Vue) - } -} - -export default Sankey diff --git a/packages/chart/chart-sankey/package.json b/packages/chart/chart-sankey/package.json deleted file mode 100644 index e6b37fa4e..000000000 --- a/packages/chart/chart-sankey/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-chart-sankey", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-sankey/src/index.js b/packages/chart/chart-sankey/src/index.js deleted file mode 100644 index 542b47393..000000000 --- a/packages/chart/chart-sankey/src/index.js +++ /dev/null @@ -1,19 +0,0 @@ -import * as echarts from 'echarts/core' -import { SankeyChart } from 'echarts/charts' -import { CanvasRenderer } from 'echarts/renderers' -import { sankey } from '@opentiny/vue-renderless/chart-sankey/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -echarts.use([SankeyChart, CanvasRenderer]) - -export default { - ...Core, - ...{ - name: $prefix + 'ChartSankey', - data() { - this.chartHandler = sankey - return {} - } - } -} diff --git a/packages/chart/chart-scatter/index.js b/packages/chart/chart-scatter/index.js deleted file mode 100644 index f482a2265..000000000 --- a/packages/chart/chart-scatter/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import Scatter from './src/index.js' - -/* istanbul ignore next */ -Scatter.install = function (Vue) { - Vue.component(Scatter.name, Scatter) -} - -Scatter.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Scatter.install(window.Vue) - } -} - -export default Scatter diff --git a/packages/chart/chart-scatter/package.json b/packages/chart/chart-scatter/package.json deleted file mode 100644 index 00363a267..000000000 --- a/packages/chart/chart-scatter/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-chart-scatter", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-scatter/src/index.js b/packages/chart/chart-scatter/src/index.js deleted file mode 100644 index 668072fdc..000000000 --- a/packages/chart/chart-scatter/src/index.js +++ /dev/null @@ -1,21 +0,0 @@ -import * as echarts from 'echarts/core' -import { GridComponent } from 'echarts/components' -import { ScatterChart } from 'echarts/charts' -import { UniversalTransition } from 'echarts/features' -import { CanvasRenderer } from 'echarts/renderers' -import { scatter } from '@opentiny/vue-renderless/chart-scatter/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -echarts.use([GridComponent, ScatterChart, UniversalTransition, CanvasRenderer]) - -export default { - ...Core, - ...{ - name: $prefix + 'ChartScatter', - data() { - this.chartHandler = scatter - return {} - } - } -} diff --git a/packages/chart/chart-sunburst/index.js b/packages/chart/chart-sunburst/index.js deleted file mode 100644 index 7abbc12cd..000000000 --- a/packages/chart/chart-sunburst/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import Sunburst from './src/index.js' - -/* istanbul ignore next */ -Sunburst.install = function (Vue) { - Vue.component(Sunburst.name, Sunburst) -} - -Sunburst.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Sunburst.install(window.Vue) - } -} - -export default Sunburst diff --git a/packages/chart/chart-sunburst/package.json b/packages/chart/chart-sunburst/package.json deleted file mode 100644 index 82468e6b6..000000000 --- a/packages/chart/chart-sunburst/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-chart-sunburst", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-sunburst/src/index.js b/packages/chart/chart-sunburst/src/index.js deleted file mode 100644 index 80bfdbe4e..000000000 --- a/packages/chart/chart-sunburst/src/index.js +++ /dev/null @@ -1,19 +0,0 @@ -import * as echarts from 'echarts/core' -import { SunburstChart } from 'echarts/charts' -import { CanvasRenderer } from 'echarts/renderers' -import { sunburst } from '@opentiny/vue-renderless/chart-sunburst/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -echarts.use([SunburstChart, CanvasRenderer]) - -export default { - ...Core, - ...{ - name: $prefix + 'ChartSunburst', - data() { - this.chartHandler = sunburst - return {} - } - } -} diff --git a/packages/chart/chart-tree/index.js b/packages/chart/chart-tree/index.js deleted file mode 100644 index 5e5d148a4..000000000 --- a/packages/chart/chart-tree/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import ChartTree from './src/index.js' - -/* istanbul ignore next */ -ChartTree.install = function (Vue) { - Vue.component(ChartTree.name, ChartTree) -} - -ChartTree.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - ChartTree.install(window.Vue) - } -} - -export default ChartTree diff --git a/packages/chart/chart-tree/package.json b/packages/chart/chart-tree/package.json deleted file mode 100644 index 1f64b6f77..000000000 --- a/packages/chart/chart-tree/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-chart-tree", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-tree/src/index.js b/packages/chart/chart-tree/src/index.js deleted file mode 100644 index 2bb01cc7c..000000000 --- a/packages/chart/chart-tree/src/index.js +++ /dev/null @@ -1,19 +0,0 @@ -import * as echarts from 'echarts/core' -import { TreeChart } from 'echarts/charts' -import { CanvasRenderer } from 'echarts/renderers' -import { tree } from '@opentiny/vue-renderless/chart-tree/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -echarts.use([TreeChart, CanvasRenderer]) - -export default { - ...Core, - ...{ - name: $prefix + 'ChartTree', - data() { - this.chartHandler = tree - return {} - } - } -} diff --git a/packages/chart/chart-waterfall/index.js b/packages/chart/chart-waterfall/index.js deleted file mode 100644 index c7b797b9e..000000000 --- a/packages/chart/chart-waterfall/index.js +++ /dev/null @@ -1,20 +0,0 @@ -import Waterfall from './src/index.js' -import { waterfall } from '@opentiny/vue-renderless/chart-waterfall/index' - -/* istanbul ignore next */ -Waterfall.install = function (Vue) { - Vue.component(Waterfall.name, Waterfall) -} - -Waterfall.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Waterfall.install(window.Vue) - } -} - -export { waterfall } - -export default Waterfall diff --git a/packages/chart/chart-waterfall/package.json b/packages/chart/chart-waterfall/package.json deleted file mode 100644 index ee0206663..000000000 --- a/packages/chart/chart-waterfall/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-chart-waterfall", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-waterfall/src/index.js b/packages/chart/chart-waterfall/src/index.js deleted file mode 100644 index 01162f5ed..000000000 --- a/packages/chart/chart-waterfall/src/index.js +++ /dev/null @@ -1,20 +0,0 @@ -import * as echarts from 'echarts/core' -import { GridComponent } from 'echarts/components' -import { BarChart } from 'echarts/charts' -import { CanvasRenderer } from 'echarts/renderers' -import { waterfall } from '@opentiny/vue-renderless/chart-waterfall/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -echarts.use([GridComponent, BarChart, CanvasRenderer]) - -export default { - ...Core, - ...{ - name: $prefix + 'ChartWaterfall', - data() { - this.chartHandler = waterfall - return {} - } - } -} diff --git a/packages/chart/chart-wordcloud/index.js b/packages/chart/chart-wordcloud/index.js deleted file mode 100644 index 2ba72cfa2..000000000 --- a/packages/chart/chart-wordcloud/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import Wordcloud from './src/index.js' - -/* istanbul ignore next */ -Wordcloud.install = function (Vue) { - Vue.component(Wordcloud.name, Wordcloud) -} - -Wordcloud.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Wordcloud.install(window.Vue) - } -} - -export default Wordcloud diff --git a/packages/chart/chart-wordcloud/package.json b/packages/chart/chart-wordcloud/package.json deleted file mode 100644 index 6c139f339..000000000 --- a/packages/chart/chart-wordcloud/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-chart-wordcloud", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0", - "echarts-wordcloud": "2.0.0" - }, - "license": "MIT" -} diff --git a/packages/chart/chart-wordcloud/src/index.js b/packages/chart/chart-wordcloud/src/index.js deleted file mode 100644 index 85d9ccdf8..000000000 --- a/packages/chart/chart-wordcloud/src/index.js +++ /dev/null @@ -1,15 +0,0 @@ -import 'echarts-wordcloud' -import { wordcloud } from '@opentiny/vue-renderless/chart-wordcloud/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -export default { - ...Core, - ...{ - name: $prefix + 'ChartWordcloud', - data() { - this.chartHandler = wordcloud - return {} - } - } -} diff --git a/packages/chart/index.js b/packages/chart/index.js deleted file mode 100644 index bfce0e5df..000000000 --- a/packages/chart/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import Chart from './src/index.js' - -/* istanbul ignore next */ -Chart.install = function (Vue) { - Vue.component(Chart.name, Chart) -} - -Chart.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Chart.install(window.Vue) - } -} - -export default Chart diff --git a/packages/chart/package.json b/packages/chart/package.json deleted file mode 100644 index 6f108316b..000000000 --- a/packages/chart/package.json +++ /dev/null @@ -1,27 +0,0 @@ -{ - "name": "@opentiny/vue-chart", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "files": [ - "index.js", - "lib" - ], - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-chart-core": "~0.1.0", - "@opentiny/vue-chart-bar": "~0.1.0", - "@opentiny/vue-chart-line": "~0.1.0", - "@opentiny/vue-chart-pie": "~0.1.0", - "@opentiny/vue-chart-funnel": "~0.1.0", - "@opentiny/vue-chart-radar": "~0.1.0", - "@opentiny/vue-chart-waterfall": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/chart/src/index.js b/packages/chart/src/index.js deleted file mode 100644 index e55ba27ca..000000000 --- a/packages/chart/src/index.js +++ /dev/null @@ -1,36 +0,0 @@ -import * as echarts from 'echarts/core' -import { ToolboxComponent, GridComponent } from 'echarts/components' -import { BarChart, FunnelChart, LineChart, PieChart, RadarChart } from 'echarts/charts' -import { LabelLayout, UniversalTransition } from 'echarts/features' -import { CanvasRenderer } from 'echarts/renderers' -import { bar, histogram } from '@opentiny/vue-renderless/chart-bar/index' -import { line } from '@opentiny/vue-renderless/chart-line/index' -import { pie, ring } from '@opentiny/vue-renderless/chart-pie/index' -import { funnel } from '@opentiny/vue-renderless/chart-funnel/index' -import { radar } from '@opentiny/vue-renderless/chart-radar/index' -import { waterfall } from '@opentiny/vue-renderless/chart-waterfall/index' -import Core from '@opentiny/vue-chart-core' -import { $prefix } from '@opentiny/vue-common' - -echarts.use([ToolboxComponent, GridComponent, BarChart, FunnelChart, LineChart, PieChart, RadarChart, LabelLayout, UniversalTransition, CanvasRenderer]) - -export default { - ...Core, - ...{ - name: $prefix + 'Chart', - data() { - this.chartLib = { - bar, - funnel, - histogram, - line, - pie, - radar, - ring, - waterfall - } - this.chartHandler = this.chartLib[this.settings.type] - return {} - } - } -} diff --git a/packages/checkbox-button/index.js b/packages/checkbox-button/index.js deleted file mode 100644 index 740699a45..000000000 --- a/packages/checkbox-button/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CheckboxButton from './src/index' -import '@opentiny/vue-theme/checkbox-button/index.css' - -CheckboxButton.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -CheckboxButton.install = function (Vue) { - Vue.component(CheckboxButton.name, CheckboxButton) -} - -CheckboxButton.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - CheckboxButton.install(window.Vue) - } -} - -export default CheckboxButton diff --git a/packages/checkbox-button/package.json b/packages/checkbox-button/package.json deleted file mode 100644 index e268daa46..000000000 --- a/packages/checkbox-button/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-checkbox-button", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/checkbox-button/src/index.js b/packages/checkbox-button/src/index.js deleted file mode 100644 index 46cb3e1fd..000000000 --- a/packages/checkbox-button/src/index.js +++ /dev/null @@ -1,45 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - CHECKBOX_GROUP: 'CheckboxGroup' -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'CheckboxButton', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - modelValue: {}, - label: {}, - disabled: Boolean, - checked: Boolean, - name: String, - trueLabel: [String, Number], - falseLabel: [String, Number], - text: String, - events: { - type: Object, - default: () => ({}) - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/checkbox-button/src/pc.vue b/packages/checkbox-button/src/pc.vue deleted file mode 100644 index 6e7f5b774..000000000 --- a/packages/checkbox-button/src/pc.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - - diff --git a/packages/checkbox-group/index.js b/packages/checkbox-group/index.js deleted file mode 100644 index b34112081..000000000 --- a/packages/checkbox-group/index.js +++ /dev/null @@ -1,33 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CheckboxGroup from './src/index' - -CheckboxGroup.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -CheckboxGroup.install = function (Vue) { - Vue.component(CheckboxGroup.name, CheckboxGroup) -} - -CheckboxGroup.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - CheckboxGroup.install(window.Vue) - } -} - -export default CheckboxGroup diff --git a/packages/checkbox-group/package.json b/packages/checkbox-group/package.json deleted file mode 100644 index ded76ec55..000000000 --- a/packages/checkbox-group/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-checkbox-group", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-checkbox": "~0.1.0", - "@opentiny/vue-checkbox-button": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/checkbox-group/src/index.js b/packages/checkbox-group/src/index.js deleted file mode 100644 index fb71b9af9..000000000 --- a/packages/checkbox-group/src/index.js +++ /dev/null @@ -1,57 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const $constants = { - FORM_ITEM: 'FormItem', - FORM_CHANGE: 'form.change' -} - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'CheckboxGroup', - componentName: 'CheckboxGroup', - emits: ['change', 'update:modelValue'], - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - modelValue: {}, - disabled: Boolean, - min: Number, - max: Number, - size: String, - fill: String, - textColor: String, - vertical: Boolean, - options: { - type: Array, - default: () => [] - }, - type: { - type: String, - default: 'checkbox' - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/checkbox-group/src/mobile.vue b/packages/checkbox-group/src/mobile.vue deleted file mode 100644 index 69499a7c2..000000000 --- a/packages/checkbox-group/src/mobile.vue +++ /dev/null @@ -1,38 +0,0 @@ - - - - diff --git a/packages/checkbox-group/src/pc.vue b/packages/checkbox-group/src/pc.vue deleted file mode 100644 index f729f8b50..000000000 --- a/packages/checkbox-group/src/pc.vue +++ /dev/null @@ -1,42 +0,0 @@ - - - - diff --git a/packages/checkbox/index.js b/packages/checkbox/index.js deleted file mode 100644 index 577b780e1..000000000 --- a/packages/checkbox/index.js +++ /dev/null @@ -1,33 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Checkbox from './src/index' - -Checkbox.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Checkbox.install = function (Vue) { - Vue.component(Checkbox.name, Checkbox) -} - -Checkbox.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Checkbox.install(window.Vue) - } -} - -export default Checkbox diff --git a/packages/checkbox/package.json b/packages/checkbox/package.json deleted file mode 100644 index 70d55c57a..000000000 --- a/packages/checkbox/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-checkbox", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/checkbox/src/index.js b/packages/checkbox/src/index.js deleted file mode 100644 index 3d6016f83..000000000 --- a/packages/checkbox/src/index.js +++ /dev/null @@ -1,70 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const $constants = { - FORM_ITEM: 'FormItem', - FORM_CHANGE: 'form.change', - CHECKBOX: $prefix + 'Checkbox', - CHECKBOX_GROUP: 'CheckboxGroup' -} - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'Checkbox', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - modelValue: {}, - label: {}, - indeterminate: Boolean, - disabled: Boolean, - checked: Boolean, - name: String, - trueLabel: [String, Number], - falseLabel: [String, Number], - - /* - * 当indeterminate为真时,为controls提供相关连的checkbox的id,表明元素间的控制关系 - */ - id: String, - - /* - * 当indeterminate为真时,为controls提供相关连的checkbox的id,表明元素间的控制关系 - */ - controls: String, - border: Boolean, - size: String, - text: String, - validateEvent: { - type: Boolean, - default: true - }, - events: { - type: Object, - default: () => ({}) - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/checkbox/src/mobile.vue b/packages/checkbox/src/mobile.vue deleted file mode 100644 index 06df5ced7..000000000 --- a/packages/checkbox/src/mobile.vue +++ /dev/null @@ -1,76 +0,0 @@ - - - - diff --git a/packages/checkbox/src/pc.vue b/packages/checkbox/src/pc.vue deleted file mode 100644 index 9c63a4e51..000000000 --- a/packages/checkbox/src/pc.vue +++ /dev/null @@ -1,112 +0,0 @@ - - - - diff --git a/packages/col/index.js b/packages/col/index.js deleted file mode 100644 index 86f86df8c..000000000 --- a/packages/col/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Col from './src/index' -import '@opentiny/vue-theme/col/index.css' - -/* istanbul ignore next */ -Col.install = function (Vue) { - Vue.component(Col.name, Col) -} - -Col.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Col.install(window.Vue) - } -} - -export default Col diff --git a/packages/col/package.json b/packages/col/package.json deleted file mode 100644 index f87400603..000000000 --- a/packages/col/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-col", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/col/src/index.js b/packages/col/src/index.js deleted file mode 100644 index 3acf0ca74..000000000 --- a/packages/col/src/index.js +++ /dev/null @@ -1,102 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'Col', - props: { - ...$props, - - /** - * @property {number} [span=12] - 栅格占据的列数(一行以12栅格划分) - */ - span: { - type: Number, - default: 12, - validator: (value) => Math.floor(value) === value && value > 0 && value <= 12 - }, - - /** - * @property {number} [offset=0] - 栅格左侧的间隔格数 - */ - offset: { - type: Number, - default: 0, - validator: (value) => value >= 0 - }, - - /** - * @property {no} [no=0] - 排序编号 - */ - no: { - type: Number, - default: 0 - }, - - /** - * @property {number} [move=0] - 栅格向左向右移动格数 - */ - move: { - type: Number, - default: 0 - }, - - /** - * @property {(number|object)} xs - <768px 响应式栅格数或者栅格属性对象 - */ - xs: { - type: [Number, Object] - }, - - /** - * @property {(number|object)} sm - ≥768px 响应式栅格数或者栅格属性对象 - */ - sm: { - type: [Number, Object] - }, - - /** - * @property {(number|object)} md - ≥992px 响应式栅格数或者栅格属性对象 - */ - md: { - type: [Number, Object] - }, - - /** - * @property {(number|object)} lg - ≥1200px 响应式栅格数或者栅格属性对象 - */ - lg: { - type: [Number, Object] - }, - - /** - * @property {(number|object)} xl - ≥1920px 响应式栅格数或者栅格属性对象 - */ - xl: { - type: [Number, Object] - }, - - /** - * @property {string} [tag=div] - 自定义元素标签 - */ - tag: { - type: String, - default: 'div' - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/col/src/pc.vue b/packages/col/src/pc.vue deleted file mode 100644 index 21273f3bc..000000000 --- a/packages/col/src/pc.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - - diff --git a/packages/collapse-item/index.js b/packages/collapse-item/index.js deleted file mode 100644 index a633d5848..000000000 --- a/packages/collapse-item/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CollapseItem from './src/index' -import '@opentiny/vue-theme/collapse-item/index.css' - -/* istanbul ignore next */ -CollapseItem.install = function (Vue) { - Vue.component(CollapseItem.name, CollapseItem) -} - -CollapseItem.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - CollapseItem.install(window.Vue) - } -} - -export default CollapseItem diff --git a/packages/collapse-item/package.json b/packages/collapse-item/package.json deleted file mode 100644 index 3f52ef631..000000000 --- a/packages/collapse-item/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-collapse-item", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/collapse-item/src/index.js b/packages/collapse-item/src/index.js deleted file mode 100644 index 4e09f4ea8..000000000 --- a/packages/collapse-item/src/index.js +++ /dev/null @@ -1,43 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - INTERVAL: 50 -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'CollapseItem', - componentName: 'CollapseItem', - inject: ['collapse'], - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - title: String, - name: { - type: [String, Number], - default() { - return this._uid - } - }, - disabled: Boolean - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/collapse-item/src/pc.vue b/packages/collapse-item/src/pc.vue deleted file mode 100644 index 1864b2a12..000000000 --- a/packages/collapse-item/src/pc.vue +++ /dev/null @@ -1,73 +0,0 @@ - - - - diff --git a/packages/collapse-transition/index.js b/packages/collapse-transition/index.js deleted file mode 100644 index fd0ed4e9c..000000000 --- a/packages/collapse-transition/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CollapseTransition from './src/index.vue' -import '@opentiny/vue-theme/collapse/index.css' - -/* istanbul ignore next */ -CollapseTransition.install = function (Vue) { - Vue.component(CollapseTransition.name, CollapseTransition) -} - -CollapseTransition.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - CollapseTransition.install(window.Vue) - } -} - -export default CollapseTransition diff --git a/packages/collapse-transition/package.json b/packages/collapse-transition/package.json deleted file mode 100644 index ce0caf3c9..000000000 --- a/packages/collapse-transition/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-collapse-transition", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/collapse-transition/src/index.vue b/packages/collapse-transition/src/index.vue deleted file mode 100644 index 406793039..000000000 --- a/packages/collapse-transition/src/index.vue +++ /dev/null @@ -1,96 +0,0 @@ - - - - diff --git a/packages/collapse/index.js b/packages/collapse/index.js deleted file mode 100644 index be957703b..000000000 --- a/packages/collapse/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Collapse from './src/index' -import '@opentiny/vue-theme/collapse/index.css' - -Collapse.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Collapse.install = function (Vue) { - Vue.component(Collapse.name, Collapse) -} - -Collapse.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Collapse.install(window.Vue) - } -} - -export default Collapse diff --git a/packages/collapse/package.json b/packages/collapse/package.json deleted file mode 100644 index b73562260..000000000 --- a/packages/collapse/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-collapse", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/collapse/src/index.js b/packages/collapse/src/index.js deleted file mode 100644 index f01bdbc98..000000000 --- a/packages/collapse/src/index.js +++ /dev/null @@ -1,52 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - COMPONENT_NAME: { - Collapse: 'Collapse' - }, - EVENT_NAME: { - CollapseItemClick: 'collapse-item.click' - } -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'Collapse', - componentName: 'Collapse', - provide() { - return { - collapse: this - } - }, - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - accordion: Boolean, - beforeClose: Function, - modelValue: { - type: [Array, String, Number], - default() { - return [] - } - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/collapse/src/pc.vue b/packages/collapse/src/pc.vue deleted file mode 100644 index 915f34ba4..000000000 --- a/packages/collapse/src/pc.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - - diff --git a/packages/common/adapter/index.js b/packages/common/adapter/index.js deleted file mode 100644 index c2371d405..000000000 --- a/packages/common/adapter/index.js +++ /dev/null @@ -1,35 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import * as all from 'vue' -import * as vue2 from '@opentiny/vue-common/adapter/vue2' -import * as vue3 from '@opentiny/vue-common/adapter/vue3' - -const vue = Object.keys(all).length > 1 ? vue3 : vue2 - -export default vue.default - -export const { - defineAsyncComponent, - markRaw, - renderComponent, - rootConfig, - appContext, - appProperties, - tools, - directive, - h, - createComponent, - parseVnode, - bindFilter, - useRouter, - emitter -} = vue diff --git a/packages/common/adapter/utils.js b/packages/common/adapter/utils.js deleted file mode 100644 index d04a5a56c..000000000 --- a/packages/common/adapter/utils.js +++ /dev/null @@ -1,73 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -export const emitter = () => { - let listeners = {} - - const on = (event, callback, once) => { - if (event && typeof event === 'string' && typeof callback === 'function') { - const callbacks = listeners[event] || [] - - listeners[event] = callbacks - callbacks.push(callback) - callback.once = once - } - } - - const emitter = { - emit(eventName) { - const callbacks = listeners[eventName] - - if (callbacks) { - callbacks.forEach((callback) => callback.apply(null, [].slice.call(arguments, 1))) - - listeners[eventName] = callbacks.filter((callback) => !callback.once) - } - }, - on, - once(event, callback) { - on(event, callback, true) - }, - off(event, callback) { - if (event && typeof event === 'string') { - const callbacks = listeners[event] - - if (typeof callback === 'function') { - listeners[event] = callbacks.filter((cb) => cb !== callback) - } else { - delete listeners[event] - } - } else { - listeners = {} - } - } - } - - return emitter -} - -export const bindFilter = (props, attrs = {}) => { - const properties = {} - - for (let name in props) { - if (name.indexOf('_') !== 0) { - properties[name] = props[name] - } - } - - for (let name in attrs) { - if (Object.prototype.hasOwnProperty.call(attrs, name)) { - properties[name] = attrs[name] - } - } - - return properties -} diff --git a/packages/common/adapter/vue2.js b/packages/common/adapter/vue2.js deleted file mode 100644 index 1ff2a9cd9..000000000 --- a/packages/common/adapter/vue2.js +++ /dev/null @@ -1,298 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Vue from 'vue' -import * as hooks from '@vue/composition-api' -import { emitter, bindFilter } from './utils' - -export { emitter, bindFilter } - -Vue.use(hooks.default) - -export const defineAsyncComponent = (promise) => promise - -export const markRaw = (ref) => ref - -export const renderComponent = - ({ view, component, props, context: { attrs, listeners: on, slots }, extend = {} }) => - () => - hooks.h((view && view.value) || component, { props, attrs, [extend.isSvg ? 'nativeOn' : 'on']: on, scopedSlots: { ...slots }, ...extend }) - -export const rootConfig = () => hooks.getCurrentInstance().proxy.$root - -export const appContext = () => Vue - -export const appProperties = () => Vue.prototype - -export const useRouter = (instance = hooks.getCurrentInstance().proxy) => ({ - route: instance.$route, - router: instance.$router -}) - -const defineProperties = (vm, instance, filter) => { - for (let name in instance) { - if (!(typeof filter === 'function' && filter(name))) { - Object.defineProperty(vm, name, { - configurable: true, - enumerable: true, - get: () => instance[name], - set: (value) => { - instance[name] = value - } - }) - } - } - - return vm -} - -const filter = (name) => name.indexOf('$') === 0 || name.indexOf('_') === 0 || name === 'constructor' - -const generateChildren = ($children, createVm) => { - const children = [] - children.refs = {} - - $children.forEach((child) => { - const vm = createVm({}, child) - - children.push(vm) - child.$vnode.data.ref && (children.refs[child.$vnode.data.ref] = vm) - }) - - return children -} - -const createVm = (vm, instance, context) => { - context || defineProperties(vm, instance, filter) - - Object.defineProperties(vm, { - $attrs: { get: () => instance.$attrs }, - $children: { get: () => generateChildren(instance.$children, createVm) }, - $constants: { get: () => instance._constants }, - $emit: { get: () => instance.$emit.bind(instance) }, - $el: { get: () => instance.$el }, - $listeners: { get: () => instance.$listeners }, - $mode: { get: () => instance.tiny_mode }, - $nextTick: { get: () => hooks.nextTick }, - $off: { get: () => instance.$off.bind(instance) }, - $on: { get: () => instance.$on.bind(instance) }, - $once: { get: () => instance.$once.bind(instance) }, - $options: { get: () => ({ componentName: instance.$options.componentName }) }, - $parent: { get: () => instance.$parent && createVm({}, instance.$parent) }, - $refs: { get: () => instance.$refs }, - $renderless: { get: () => instance.tiny_renderless }, - $scopedSlots: { get: () => instance.$scopedSlots }, - $set: { get: () => instance.$set }, - $slots: { get: () => instance.$scopedSlots }, - $template: { get: () => instance.tiny_template } - }) - - return vm -} - -const emitEvent = (vm) => { - const broadcast = (vm, componentName, eventName, params) => { - vm.$children.forEach((child) => { - const name = child.$options.componentName - - if (name === componentName) { - child.$emit(eventName, params) - } else { - broadcast(child, componentName, eventName, params) - } - }) - } - - return { - dispatch(componentName, eventName, params) { - let parent = vm.$parent || vm.$root - let name = parent.$options.componentName - - while (parent && (!name || name !== componentName)) { - parent = parent.$parent - - parent && (name = parent.$options.componentName) - } - - if (parent) { - parent.$emit.apply(parent, [eventName].concat(params)) - } - }, - broadcast(componentName, eventName, params) { - broadcast(vm, componentName, eventName, params) - } - } -} - -const parent = (vm) => (handler) => { - let parent = vm.$parent - let level = 0 - - const parentObject = (parent) => ({ - level, - vm: createVm({}, parent), - el: parent.$el, - options: parent.$options - }) - - if (typeof handler !== 'function') { - return parent ? parentObject(parent) : {} - } - - level++ - - while (parent) { - if (handler(parentObject(parent))) { - break - } - - parent = parent.$parent - level++ - } -} - -const children = (vm) => (handler) => { - if (typeof handler !== 'function') { - return generateChildren(vm.$children) - } - - let layer = 1 - - const broadcast = ($children) => { - const level = layer++ - - if ( - $children.some((child) => - handler({ - level, - vm: createVm({}, child), - el: child.$el, - options: child.$options, - isLevel1: level === 1 - }) - ) - ) { - return - } - - $children.forEach((child) => broadcast(child.$children)) - } - - broadcast(vm.$children) -} - -const getMode = (instance, parentVm, root) => instance._props.tiny_mode || (parentVm || {}).$mode || (root.tiny_mode ? root.tiny_mode.value : 'pc') - -export const tools = (context) => { - const instance = hooks.getCurrentInstance().proxy - const root = instance.$root - const { route, router } = useRouter(instance) - const i18n = root.$i18n - const { dispatch, broadcast } = emitEvent(instance) - const parentHandler = parent(instance) - const childrenHandler = children(instance) - const vm = createVm({}, instance, context) - const parentVm = instance.$parent ? createVm({}, instance.$parent) : null - const setParentAttribute = ({ name, value }) => { - instance.$parent[name] = value - } - const defineInstanceProperties = (props) => { - Object.defineProperties(vm, props) - Object.defineProperties(instance, props) - } - const defineParentInstanceProperties = (props) => { - parentVm && Object.defineProperties(parentVm, props) - } - hooks.onBeforeMount(() => defineProperties(vm, instance, filter)) - return { - vm, - emit: context.emit, - emitter, - route, - router, - dispatch, - broadcast, - parentHandler, - childrenHandler, - refs: context.refs, - i18n, - slots: context.slots, - scopedSlots: context.slots, - attrs: context.attrs, - parent: parentVm, - nextTick: hooks.nextTick, - constants: instance._constants, - mode: getMode(instance, parentVm, root), - service: instance.$service, - getService: () => instance.$getService(vm), - setParentAttribute, - defineInstanceProperties, - defineParentInstanceProperties - } -} - -const mapping = (content, before, after) => { - if (typeof content[before] !== 'undefined') { - const fn = content[before] - - content[after] = (el, binding, vnode) => { - binding.instance = vnode.context - fn(el, binding, vnode) - } - - delete content[before] - } -} - -export const directive = (directives) => { - for (let name in directives) { - if (Object.prototype.hasOwnProperty.call(directives, name)) { - const content = directives[name] - - mapping(content, 'beforeMount', 'bind') - mapping(content, 'updated', 'update') - mapping(content, 'unmounted', 'unbind') - } - } - - return directives -} - -const bindVnodeData = ({ props, data, name, attr = name }) => { - Object.defineProperty(props, attr, { - get: () => data[name], - set: (value) => { - data[name] = value - } - }) -} - -export const parseVnode = (vnode) => { - const props = {} - const data = (vnode.componentOptions && vnode.componentOptions.propsData) || {} - - for (let name in data) { - if (Object.prototype.hasOwnProperty.call(data, name)) { - bindVnodeData({ props, data, name }) - } - } - - vnode.props = props - vnode.type = { name: vnode.componentOptions && vnode.componentOptions.tag } - - return vnode -} - -export const h = hooks.h - -export const createComponent = ({ component, propsData, el }) => new (Vue.extend(component))({ propsData, el }).$mount() - -export default hooks diff --git a/packages/common/adapter/vue3.js b/packages/common/adapter/vue3.js deleted file mode 100644 index 79d131f6c..000000000 --- a/packages/common/adapter/vue3.js +++ /dev/null @@ -1,465 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import * as hooks from 'vue' -import { capitalize, hyphenate, camelize } from '@opentiny/vue-renderless/common/string' -import { emitter, bindFilter } from './utils' - -export { emitter, bindFilter } - -export const defineAsyncComponent = hooks.defineAsyncComponent - -export const markRaw = hooks.markRaw - -const setInstanceEmitter = (instance) => { - const $emitter = emitter() - - Object.defineProperty(instance, '$emitter', { get: () => $emitter }) -} - -const regEventPrefix = /^on[A-Z]/ - -const generateListeners = (attrs) => { - const $attrs = {} - const $listeners = {} - - for (let name in attrs) { - if (Object.prototype.hasOwnProperty.call(attrs, name)) { - const event = attrs[name] - - if (regEventPrefix.test(name) && typeof event === 'function') { - $listeners[hyphenate(name.substr(2))] = event - } else { - $attrs[name] = event - } - } - } - - return { $attrs, $listeners } -} - -const defineProperties = (vm, instance, property, filter) => { - for (let name in instance[property]) { - if (!(typeof filter === 'function' && filter(name))) { - Object.defineProperty(vm, name, { - configurable: true, - enumerable: true, - get: () => instance[property][name], - set: (value) => { - instance[property][name] = value - } - }) - } - } - - return vm -} - -const filter = (name) => name.indexOf('_') === 0 - -const defineInstanceVm = (vm, instance) => { - defineProperties(vm, instance, 'setupState') - defineProperties(vm, instance, 'props', filter) - defineProperties(vm, instance, 'ctx', filter) - - return vm -} - -const generateChildren = (subTree, createVm) => { - const children = [] - children.refs = {} - - if (subTree) { - const arr = subTree.dynamicChildren || subTree.children - - if (Array.isArray(arr)) { - arr.forEach((child) => { - if (child.component) { - const vm = createVm({}, child.component) - - children.push(vm) - child.props.ref && (children.refs[child.props.ref] = vm) - } - }) - } else if (subTree.component) { - children.push(createVm({}, subTree.component)) - } - } - - return children -} - -const getRealParent = (vm) => { - if (vm && vm.parent) { - return vm.parent.type.name === 'AsyncComponentWrapper' && vm.parent.parent ? vm.parent.parent : vm.parent - } -} - -const createVm = (vm, instance, context) => { - const { $attrs, $listeners } = generateListeners(instance.attrs) - let $emitter = instance.$emitter - - if (!$emitter) { - setInstanceEmitter(instance) - $emitter = instance.$emitter - } - - const emit = (...args) => { - instance.emit.apply(instance, args) - $emitter.emit.apply(vm, args) - } - - const $set = (target, propertyName, value) => (target[propertyName] = value) - - context || defineInstanceVm(vm, instance) - - Object.defineProperties(vm, { - $attrs: { get: () => $attrs }, - $children: { get: () => generateChildren(instance.subTree, createVm) }, - $constants: { get: () => instance.props._constants }, - $emit: { get: () => emit }, - $el: { get: () => instance.vnode.el }, - $listeners: { get: () => $listeners }, - $mode: { get: () => instance.props.tiny_mode }, - $nextTick: { get: () => hooks.nextTick }, - $off: { get: () => $emitter.off }, - $on: { get: () => $emitter.on }, - $once: { get: () => $emitter.once }, - $options: { get: () => ({ componentName: instance.type.componentName }) }, - $parent: { get: () => instance.parent && createVm({}, getRealParent(instance)) }, - $refs: { get: () => instance.refs }, - $renderless: { get: () => instance.props.tiny_renderless }, - $scopedSlots: { get: () => instance.slots }, - $set: { get: () => $set }, - $slots: { get: () => instance.slots }, - $template: { get: () => instance.props.tiny_template } - }) - - return vm -} - -const onBeforeMount = (instance, refs) => { - for (let name in instance.refs) { - if (Object.prototype.hasOwnProperty.call(instance.refs, name)) { - refs[name] = instance.refs[name] - } - } -} - -export const renderComponent = - ({ view, component, props, context: { attrs, slots }, extend = {} }) => - () => - hooks.h((view && view.value) || component, { ...props, ...attrs, ...extend }, slots) - -export const rootConfig = (context) => { - const instance = hooks.getCurrentInstance() - context && setInstanceEmitter(instance) - return instance.appContext.config.globalProperties -} - -export const appContext = () => - hooks.getCurrentInstance().appContext.app || { - component: () => { - // do nothing - } - } - -export const appProperties = () => hooks.getCurrentInstance().appContext.config.globalProperties - -export const useRouter = (instance = hooks.getCurrentInstance()) => { - const router = instance.appContext.config.globalProperties.$router - const route = router && router.currentRoute.value - - return { route, router } -} - -const emitEvent = (vm) => { - const broadcast = (vm, componentName, eventName, params) => { - const children = (vm.subTree && vm.subTree.children) || vm.children - - Array.isArray(children) && - children.forEach((child) => { - const name = child.type && child.type.componentName - const component = child.component - - if (name === componentName) { - component.emit(eventName, params) - component.$emitter && component.$emitter.emit(eventName, params) - } else { - broadcast(child, componentName, eventName, params) - } - }) - } - - return { - dispatch(componentName, eventName, params) { - let parent = vm.parent || vm.root - let name = parent.type && parent.type.componentName - - while (parent && (!name || name !== componentName)) { - parent = parent.parent - parent && (name = parent.type && parent.type.componentName) - } - - if (parent) { - parent.emit.apply(parent, [eventName].concat(params)) - parent.$emitter && parent.$emitter.emit(eventName, params) - } - }, - broadcast(componentName, eventName, params) { - broadcast(vm, componentName, eventName, params) - } - } -} - -const parent = (vm) => (handler) => { - let parent = getRealParent(vm) - let level = 0 - - const parentObject = (parent) => ({ - level, - vm: createVm({}, parent), - el: parent.vnode.el, - options: parent.type - }) - - if (typeof handler !== 'function') { - return parent ? parentObject(parent) : {} - } - - level++ - - while (parent) { - if (handler(parentObject(parent))) { - break - } - parent = getRealParent(parent) - level++ - } -} - -const children = (vm) => (handler) => { - if (typeof handler !== 'function') { - return generateChildren(vm.subTree) - } - - let layer = 1 - const broadcast = (subTree) => { - if (!subTree) { - return - } - const children = subTree.children || subTree.dynamicChildren - const level = layer++ - - if (Array.isArray(children)) { - if ( - children.some( - (child) => - child.component && - handler({ - level, - vm: createVm({}, child.component), - el: child.el, - options: child.type, - isLevel1: true - }) - ) - ) { - return - } - children.forEach((child) => broadcast(child)) - } - } - - broadcast(vm.subTree) -} - -const getMode = (instance, parentVm, root) => instance.props.tiny_mode || (parentVm || {}).$mode || (root.tiny_mode ? root.tiny_mode.value : 'pc') - -const getParentVm = (grandParent, instance) => (grandParent ? createVm({}, grandParent) : instance.parent ? createVm({}, instance.parent) : null) - -const setParentAttribute = - (grandParent, instance) => - ({ name, value }) => { - const ctx = grandParent ? grandParent.ctx : instance.parent.ctx - ctx[name] = value - } - -const defineInstanceProperties = (vm, instance) => (props) => { - Object.defineProperties(vm, props) - Object.defineProperties(instance.ctx, props) -} - -const defineParentInstanceProperties = (parentVm) => (props) => { - parentVm && Object.defineProperties(parentVm, props) -} - -export const tools = (context) => { - const instance = hooks.getCurrentInstance() - const root = instance.appContext.config.globalProperties - const { route, router } = useRouter(instance) - const i18n = instance.proxy.$root.$i18n - const { dispatch, broadcast } = emitEvent(instance) - const parentHandler = parent(instance) - const childrenHandler = children(instance) - const vm = createVm({}, instance, context) - const emit = context.emit - const refs = {} - const grandParent = !instance.props.tiny_template && getRealParent(instance) - const parentVm = getParentVm(grandParent, instance) - - hooks.onBeforeMount(() => defineInstanceVm(vm, instance)) - hooks.onMounted(() => onBeforeMount(instance, refs)) - - return { - vm, - emit, - emitter, - route, - router, - dispatch, - broadcast, - parentHandler, - childrenHandler, - refs, - i18n, - slots: instance.slots, - scopedSlots: instance.slots, - attrs: context.attrs, - parent: parentVm, - nextTick: hooks.nextTick, - constants: instance.props._constants, - mode: getMode(instance, parentVm, root), - service: root.$service, - getService: () => root.$getService(vm), - setParentAttribute: setParentAttribute(grandParent, instance), - defineInstanceProperties: defineInstanceProperties(vm, instance), - defineParentInstanceProperties: defineParentInstanceProperties(parentVm) - } -} - -const mapping = (content, before, after) => { - if (typeof content[before] !== 'undefined') { - const fn = content[before] - - content[after] = (el, binding, vnode) => { - vnode.context = binding.instance - fn(el, binding, vnode) - } - - delete content[before] - } -} - -export const directive = (directives) => { - for (let name in directives) { - if (Object.prototype.hasOwnProperty.call(directives, name)) { - const content = directives[name] - - mapping(content, 'bind', 'beforeMount') - mapping(content, 'update', 'updated') - mapping(content, 'unbind', 'unmounted') - } - } - - return directives -} - -export const parseVnode = (vnode) => vnode - -const parseProps = (propsData) => { - const props = {} - - for (let name in propsData) { - if (name === 'class' || name === 'style') { - props[name] = propsData[name] - } else if (name === 'on' || name === 'nativeOn') { - const events = propsData[name] - - for (let eventName in events) { - if (Object.prototype.hasOwnProperty.call(events, eventName)) { - props['on' + capitalize(camelize(eventName))] = events[eventName] - } - } - } else if (name === 'attrs' || name === 'props' || name === 'domProps') { - const attrs = propsData[name] - - for (let key in attrs) { - if (Object.prototype.hasOwnProperty.call(attrs, key)) { - props[key] = attrs[key] - } - } - } else { - props[name] = propsData[name] - } - } - - return props -} - -const customResolveComponent = (component) => { - let type = component - let customElement = false - - if (typeof component === 'string') { - const el = document.createElement(component) - const svgTagNames = ['SVG', 'CIRCLE', 'PATH'] - if ((el instanceof HTMLUnknownElement && svgTagNames.indexOf(el.nodeName) === -1) || component.indexOf('-') !== -1) { - component = component.toLowerCase() - customElement = true - - if (component === 'transition') { - type = hooks.Transition - } else if (component === 'transition-group') { - type = hooks.TransitionGroup - } else { - type = hooks.resolveComponent(component) - } - } else { - type = component - } - } - - return { type, component, customElement } -} - -export const h = (component, propsData, childData) => { - let props = {} - let children = childData - let ret = customResolveComponent(component) - let customElement = ret.customElement - let type = ret.type - - component = ret.component - - if (propsData && typeof propsData === 'object' && !Array.isArray(propsData)) { - props = parseProps(propsData) - propsData.scopedSlots && (children = propsData.scopedSlots) - } else if (typeof propsData === 'string' || Array.isArray(propsData)) { - childData = propsData - } - - if (typeof childData === 'string' || Array.isArray(childData)) { - children = typeof component !== 'string' || customElement ? () => childData : childData - } - - return hooks.h(type, props, children) -} - -export const createComponent = ({ component, propsData, el }) => { - const vnode = hooks.createVNode(component, propsData) - - hooks.render(vnode, el) - - return createVm({}, vnode.component) -} - -export default hooks diff --git a/packages/common/index.js b/packages/common/index.js deleted file mode 100644 index 700891423..000000000 --- a/packages/common/index.js +++ /dev/null @@ -1,209 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import hooks from '@opentiny/vue-common/adapter' -import { appContext, appProperties, bindFilter, createComponent } from '@opentiny/vue-common/adapter' -import { defineAsyncComponent, directive, emitter, h, markRaw } from '@opentiny/vue-common/adapter' -import { parseVnode, renderComponent, rootConfig, tools, useRouter } from '@opentiny/vue-common/adapter' -import { t } from '@opentiny/vue-locale' -import '@opentiny/vue-theme/base/index.css' - -export const $prefix = 'Tiny' - -const tinyMap = { - tinyMode: 'tiny_mode', - tinyModeRoot: 'tiny_mode_root', - tinyTemplate: 'tiny_template', - tinyRenderless: 'tiny_renderless' -} - -export const $props = { - [tinyMap.tinyMode]: String, - [tinyMap.tinyModeRoot]: Boolean, - [tinyMap.tinyTemplate]: [Function, Object], - [tinyMap.tinyRenderless]: Function -} - -export const props = ['tiny_mode', 'tiny_mode_root', 'tiny_template', 'tiny_renderless', '_constants'] - -const resolveMode = (props, context) => { - let isRightMode = (mode) => ~['pc', 'mobile'].indexOf(mode) - let config = rootConfig(context) - let tinyModeProp = typeof props.tiny_mode === 'string' ? props.tiny_mode : null - let tinyModeInject = hooks.inject('TinyMode', null) - let tinyModeGlobal = config.tiny_mode && config.tiny_mode.value - - !isRightMode(tinyModeProp) && (tinyModeProp = null) - !isRightMode(tinyModeInject) && (tinyModeInject = null) - !isRightMode(tinyModeGlobal) && (tinyModeGlobal = null) - - let tinyMode = tinyModeProp || tinyModeInject || tinyModeGlobal || 'pc' - - if (props.tiny_mode_root) { - hooks.provide('TinyMode', tinyMode) - } - - return tinyMode -} - -export let setupComponent = {} - -export const initComponent = () => { - for (let name in setupComponent) { - if (Object.prototype.hasOwnProperty.call(setupComponent, name)) { - const component = setupComponent[name] - - if (typeof component.install === 'function') { - component.install(appContext()) - } - - if (typeof component.init === 'function') { - component.init(appProperties()) - } - } - } - - setupComponent = {} -} - -export const $setup = ({ props, context, template }) => { - const view = hooks.computed(() => { - if (typeof props.tiny_template !== 'undefined') { - return props.tiny_template - } - - const component = template(resolveMode(props, context)) - - return typeof component === 'function' ? defineAsyncComponent(component) : component - }) - - initComponent() - - return renderComponent({ view, props, context }) -} - -export const filterAttrs = (attrs, filters, include) => { - const props = {} - - for (let name in attrs) { - if (Object.prototype.hasOwnProperty.call(attrs, name)) { - const find = filters.some((r) => new RegExp(r).test(name)) - - if ((include && find) || (!include && !find)) { - props[name] = attrs[name] - } - } - } - - return props -} - -export const setup = ({ props, context, renderless, api, extendOptions = {}, mono = false }) => { - const render = typeof props.tiny_renderless === 'function' ? props.tiny_renderless : renderless - const utils = { $prefix, t, ...tools(context) } - const sdk = render(props, hooks, utils, extendOptions) - - const attrs = { - t, - vm: utils.vm, - f: bindFilter, - a: filterAttrs, - d: utils.defineInstanceProperties, - dp: utils.defineParentInstanceProperties - } - - /** - * 修复 render 函数下 this.slots 不会动态更新的问题(vue3 环境没有问题) - * 解决方法:在 instance 下注入 slots、scopedSlots - * 注意:renderless 下尽量使用 vm.$refs、vm.$slots - */ - attrs.d({ - slots: { get: () => utils.vm.$slots }, - scopedSlots: { get: () => utils.vm.$scopedSlots } - }) - - attrs.dp({ - slots: { get: () => utils.parent.$slots }, - scopedSlots: { get: () => utils.parent.$scopedSlots } - }) - - initComponent() - - Array.isArray(api) && - api.forEach((name) => { - const value = sdk[name] - - if (typeof value !== 'undefined') { - attrs[name] = value - mono || utils.setParentAttribute({ name, value }) - } - }) - - return attrs -} - -export const svg = - ({ name = 'Icon', component }) => - () => - markRaw({ - name: $prefix + name, - setup: (props, context) => { - const { fill, width, height } = context.attrs || {} - - const extend = { - style: { fill, width, height }, - class: { 'tiny-svg': true } - } - - extend.isSvg = true - // 解决本地运行会报大量警告的问题 - if (process.env.BUILD_TARGET) { - extend.nativeOn = context.listeners - } - - return renderComponent({ - component, - props, - context, - extend - }) - } - }) - -export const $install = (component) => { - component.install = function (Vue) { - Vue.component(component.name, component) - } -} - -export const version = process.env.COMPONENT_VERSION - -export { h, hooks, directive, parseVnode, useRouter, emitter, createComponent, defineAsyncComponent } - -export default { - h, - directive, - parseVnode, - useRouter, - emitter, - createComponent, - defineAsyncComponent, - filterAttrs, - initComponent, - setupComponent, - svg, - $prefix, - $props, - props, - $setup, - setup, - hooks -} diff --git a/packages/common/package.json b/packages/common/package.json deleted file mode 100644 index df782f219..000000000 --- a/packages/common/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-common", - "version": "0.1.0", - "description": "", - "main": "index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/company/index.js b/packages/company/index.js deleted file mode 100644 index 2a342f0ea..000000000 --- a/packages/company/index.js +++ /dev/null @@ -1,23 +0,0 @@ -import Company from './src/index' -import '@opentiny/vue-theme/company/index.css' - -Company.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Company.install = function (Vue) { - Vue.component(Company.name, Company) -} - -Company.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Company.install(window.Vue) - } -} - -export default Company diff --git a/packages/company/package.json b/packages/company/package.json deleted file mode 100644 index 78fbbeaee..000000000 --- a/packages/company/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-company", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-select": "~0.1.0", - "@opentiny/vue-option": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/company/src/index.js b/packages/company/src/index.js deleted file mode 100644 index f38796e63..000000000 --- a/packages/company/src/index.js +++ /dev/null @@ -1,39 +0,0 @@ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc.vue' - -const template = () => PCTemplate - -export default { - name: $prefix + 'Company', - props: { - ...$props, - clearable: { - type: Boolean, - default: () => true - }, - disabled: { - type: Boolean, - default: () => false - }, - fetchCompany: Function, - fields: Object, - max: { - type: Number, - default: 1000 - }, - modelValue: {}, - placeholder: { - type: String, - default: () => '' - }, - popperAppendToBody: { - type: Boolean, - default: () => true - }, - popperClass: String, - size: String - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/company/src/pc.vue b/packages/company/src/pc.vue deleted file mode 100644 index 91a8d8269..000000000 --- a/packages/company/src/pc.vue +++ /dev/null @@ -1,47 +0,0 @@ - - - - diff --git a/packages/container/index.js b/packages/container/index.js deleted file mode 100644 index 1b17e025c..000000000 --- a/packages/container/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Container from './src/index' -import '@opentiny/vue-theme/container/index.css' - -/* istanbul ignore next */ -Container.install = function (Vue) { - Vue.component(Container.name, Container) -} - -Container.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Container.install(window.Vue) - } -} - -export default Container diff --git a/packages/container/package.json b/packages/container/package.json deleted file mode 100644 index 4d445e5bd..000000000 --- a/packages/container/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-container", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/container/src/index.js b/packages/container/src/index.js deleted file mode 100644 index e2491db6c..000000000 --- a/packages/container/src/index.js +++ /dev/null @@ -1,54 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - DEFAULT: 'default', - SIMPLE: 'simple', - LEGEND: 'legend', - CLASSIC: 'classic', - FASHION: 'fashion' -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'Container', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - pattern: { - type: String, - default: 'default', - validator: (value) => !!$constants[value.toUpperCase()] - }, - headerHeight: { - type: [Number, String], - default: 60 - }, - asideWidth: { - type: [Number, String], - default: 200 - }, - footerHeight: { - type: [Number, String], - default: 60 - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/container/src/pc.vue b/packages/container/src/pc.vue deleted file mode 100644 index afc1ae201..000000000 --- a/packages/container/src/pc.vue +++ /dev/null @@ -1,39 +0,0 @@ - - - - diff --git a/packages/country/index.js b/packages/country/index.js deleted file mode 100644 index ec6fd577a..000000000 --- a/packages/country/index.js +++ /dev/null @@ -1,23 +0,0 @@ -import Country from './src/index' -import '@opentiny/vue-theme/country/index.css' - -Country.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Country.install = function (Vue) { - Vue.component(Country.name, Country) -} - -Country.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Country.install(window.Vue) - } -} - -export default Country diff --git a/packages/country/package.json b/packages/country/package.json deleted file mode 100644 index 784f8dcd8..000000000 --- a/packages/country/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-country", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-select": "~0.1.0", - "@opentiny/vue-option": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/country/src/index.js b/packages/country/src/index.js deleted file mode 100644 index 07985af94..000000000 --- a/packages/country/src/index.js +++ /dev/null @@ -1,35 +0,0 @@ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc.vue' - -const template = () => PCTemplate - -export default { - name: $prefix + 'Country', - props: { - ...$props, - disabled: { - type: Boolean, - default: () => false - }, - clearable: { - type: Boolean, - default: () => true - }, - fetchCountry: Function, - fields: Object, - placeholder: { - type: String, - default: () => '' - }, - modelValue: {}, - popperClass: String, - popperAppendToBody: { - type: Boolean, - default: () => true - }, - size: String - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/country/src/pc.vue b/packages/country/src/pc.vue deleted file mode 100644 index 3e637b19a..000000000 --- a/packages/country/src/pc.vue +++ /dev/null @@ -1,47 +0,0 @@ - - - - diff --git a/packages/credit-card-form/index.js b/packages/credit-card-form/index.js deleted file mode 100644 index fd59de127..000000000 --- a/packages/credit-card-form/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CreditCardForm from './src/index' -import '@opentiny/vue-theme/credit-card-form/index.css' - -/* istanbul ignore next */ -CreditCardForm.install = function (Vue) { - Vue.component(CreditCardForm.name, CreditCardForm) -} - -CreditCardForm.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - CreditCardForm.install(window.Vue) - } -} - -export default CreditCardForm diff --git a/packages/credit-card-form/package.json b/packages/credit-card-form/package.json deleted file mode 100644 index 6ff156e61..000000000 --- a/packages/credit-card-form/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-credit-card-form", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-credit-card": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/credit-card-form/src/index.js b/packages/credit-card-form/src/index.js deleted file mode 100644 index d6418cdd1..000000000 --- a/packages/credit-card-form/src/index.js +++ /dev/null @@ -1,30 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'CreditCardForm', - props: { - ...$props, - backgroundImage: [String, Object], - formData: { - type: Object, - default: () => ({ cardYear: '', cardNumber: '', cardName: '', cardMonth: '', cardCvv: '' }) - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/credit-card-form/src/pc.vue b/packages/credit-card-form/src/pc.vue deleted file mode 100644 index 33a579e0f..000000000 --- a/packages/credit-card-form/src/pc.vue +++ /dev/null @@ -1,123 +0,0 @@ - - - - diff --git a/packages/credit-card/index.js b/packages/credit-card/index.js deleted file mode 100644 index 5a32a4c92..000000000 --- a/packages/credit-card/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CreditCard from './src/index' -import '@opentiny/vue-theme/credit-card/index.css' - -/* istanbul ignore next */ -CreditCard.install = function (Vue) { - Vue.component(CreditCard.name, CreditCard) -} - -CreditCard.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - CreditCard.install(window.Vue) - } -} - -export default CreditCard diff --git a/packages/credit-card/package.json b/packages/credit-card/package.json deleted file mode 100644 index b56199c75..000000000 --- a/packages/credit-card/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-credit-card", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/credit-card/src/index.js b/packages/credit-card/src/index.js deleted file mode 100644 index 1fb64fafe..000000000 --- a/packages/credit-card/src/index.js +++ /dev/null @@ -1,35 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'CreditCard', - props: { - ...$props, - backgroundImage: [String, Object], - isCardNumberMasked: Boolean, - fields: { - type: Object, - default: () => ({}) - }, - labels: { - type: Object, - default: () => ({ cardCvv: '', cardMonth: '', cardName: '', cardNumber: '', cardYear: '' }) - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/credit-card/src/pc.vue b/packages/credit-card/src/pc.vue deleted file mode 100644 index e550347c2..000000000 --- a/packages/credit-card/src/pc.vue +++ /dev/null @@ -1,128 +0,0 @@ - - - - diff --git a/packages/crop/index.js b/packages/crop/index.js deleted file mode 100644 index 446df9ba4..000000000 --- a/packages/crop/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Crop from './src/index.vue' -import '@opentiny/vue-theme/crop/index.css' - -/* istanbul ignore next */ -Crop.install = function (Vue) { - Vue.component(Crop.name, Crop) -} - -Crop.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Crop.install(window.Vue) - } -} - -export default Crop diff --git a/packages/crop/package.json b/packages/crop/package.json deleted file mode 100644 index 42670e9b3..000000000 --- a/packages/crop/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-crop", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "cropperjs": "1.5.7" - }, - "license": "MIT" -} diff --git a/packages/crop/src/index.vue b/packages/crop/src/index.vue deleted file mode 100644 index 2b1ce11e8..000000000 --- a/packages/crop/src/index.vue +++ /dev/null @@ -1,193 +0,0 @@ - - - - diff --git a/packages/currency/index.js b/packages/currency/index.js deleted file mode 100644 index 60dafe0f4..000000000 --- a/packages/currency/index.js +++ /dev/null @@ -1,23 +0,0 @@ -import Currency from './src/index' -import '@opentiny/vue-theme/currency/index.css' - -Currency.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Currency.install = function (Vue) { - Vue.component(Currency.name, Currency) -} - -Currency.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Currency.install(window.Vue) - } -} - -export default Currency diff --git a/packages/currency/package.json b/packages/currency/package.json deleted file mode 100644 index 49fe47117..000000000 --- a/packages/currency/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-currency", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-select": "~0.1.0", - "@opentiny/vue-option": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/currency/src/index.js b/packages/currency/src/index.js deleted file mode 100644 index 9e70efccb..000000000 --- a/packages/currency/src/index.js +++ /dev/null @@ -1,39 +0,0 @@ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc.vue' - -const template = () => PCTemplate - -export default { - name: $prefix + 'Currency', - props: { - ...$props, - clearable: { - type: Boolean, - default: true - }, - currency: { - type: String, - default: 'CNY' - }, - disabled: { - type: Boolean, - default: false - }, - fetchCurrency: Function, - fields: Object, - modelValue: {}, - placeholder: { - type: String, - default: '' - }, - popperAppendToBody: { - type: Boolean, - default: true - }, - popperClass: String, - size: String - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/currency/src/pc.vue b/packages/currency/src/pc.vue deleted file mode 100644 index 06b5ea5a2..000000000 --- a/packages/currency/src/pc.vue +++ /dev/null @@ -1,36 +0,0 @@ - - - diff --git a/packages/date-panel/index.js b/packages/date-panel/index.js deleted file mode 100644 index 030964026..000000000 --- a/packages/date-panel/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import DatePanel from './src/index.vue' - -/* istanbul ignore next */ -DatePanel.install = function (Vue) { - Vue.component(DatePanel.name, DatePanel) -} - -DatePanel.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - DatePanel.install(window.Vue) - } -} - -export default DatePanel diff --git a/packages/date-panel/package.json b/packages/date-panel/package.json deleted file mode 100644 index ae1ee3ff1..000000000 --- a/packages/date-panel/package.json +++ /dev/null @@ -1,23 +0,0 @@ -{ - "name": "@opentiny/vue-date-panel", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-input": "~0.1.0", - "@opentiny/vue-button": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0", - "@opentiny/vue-time": "~0.1.0", - "@opentiny/vue-date-table": "~0.1.0", - "@opentiny/vue-year-table": "~0.1.0", - "@opentiny/vue-month-table": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/date-panel/src/index.vue b/packages/date-panel/src/index.vue deleted file mode 100644 index edfb3e90b..000000000 --- a/packages/date-panel/src/index.vue +++ /dev/null @@ -1,243 +0,0 @@ - - - - diff --git a/packages/date-picker/index.js b/packages/date-picker/index.js deleted file mode 100644 index d065e4ebc..000000000 --- a/packages/date-picker/index.js +++ /dev/null @@ -1,31 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import DatePicker from './src/index.js' - -DatePicker.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -DatePicker.install = function (Vue) { - Vue.component(DatePicker.name, DatePicker) -} - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - DatePicker.install(window.Vue) - } -} - -export default DatePicker diff --git a/packages/date-picker/package.json b/packages/date-picker/package.json deleted file mode 100644 index b268c9971..000000000 --- a/packages/date-picker/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-date-picker", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-picker": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/date-picker/src/index.js b/packages/date-picker/src/index.js deleted file mode 100644 index c2d8feb70..000000000 --- a/packages/date-picker/src/index.js +++ /dev/null @@ -1,149 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $setup, $prefix } from '@opentiny/vue-common' -import { iconOperationfaild } from '@opentiny/vue-icon' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const currentYear = new Date().getFullYear() - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -const $constants = { - MonthDay: 32, - Minutes: 59, - Hours: 23, - TotalMonth: 12, - Max: 'max', - Min: 'min', - Hour: 'hour', - Minute: 'minute', - CapYear: 'Year', - CapMonth: 'Month', - CapDate: 'Date', - CapHour: 'Hour', - CapMinute: 'Minute', - YearMonth: 'year-month', - DateTime: 'datetime', - Date: 'date', - HookMounted: 'hook-mounted', - Hidden: 'hidden', - Year: 'year', - Day: 'day' -} - -const validator = (value) => { - const result = - value === null || - value === undefined || - typeof value === 'string' || - value instanceof String || - (Array.isArray(value) && value.length === 2 && value.every((item) => typeof item === 'string' || item instanceof String)) - - return result -} - -export default { - name: $prefix + 'DatePicker', - props: { - ...$props, - type: { - type: String, - default: 'date' - }, - _constants: { - type: Object, - default: () => $constants - }, - timeArrowControl: Boolean, - size: String, - format: String, - valueFormat: String, - readonly: Boolean, - placeholder: String, - startPlaceholder: String, - endPlaceholder: String, - prefixIcon: Object, - clearIcon: { - type: Object, - default() { - return iconOperationfaild() - } - }, - name: { - default: '', - validator - }, - disabled: Boolean, - clearable: { - type: Boolean, - default: true - }, - id: { - default: '', - validator - }, - popperClass: String, - editable: { - type: Boolean, - default: true - }, - align: { - type: String, - default: 'left' - }, - modelValue: {}, - defaultValue: {}, - defaultTime: {}, - rangeSeparator: { - type: [Object, String], - default: '-' - }, - pickerOptions: {}, - unlinkPanels: Boolean, - validateEvent: { - type: Boolean, - default: true - }, - isRange: Boolean, - arrowControl: Boolean, - timezoneData: {}, - showTimezone: { - type: Boolean, - default: false - }, - defaultTimezone: {}, - visible: Boolean, - minDate: { - type: Date, - default: () => new Date(currentYear - 10, 0, 1), - validator: (val) => Object.prototype.toString.call(val) === '[object Date]' && !isNaN(val.getTime()) - }, - maxDate: { - type: Date, - default: () => new Date(currentYear + 10, 11, 31), - validator: (val) => Object.prototype.toString.call(val) === '[object Date]' && !isNaN(val.getTime()) - }, - formatter: { - type: Function, - default: (type, value) => value - }, - componentName: { type: String, default: 'DatePicker' } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/date-picker/src/mobile.vue b/packages/date-picker/src/mobile.vue deleted file mode 100644 index 2260a2ee2..000000000 --- a/packages/date-picker/src/mobile.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - - diff --git a/packages/date-picker/src/pc.vue b/packages/date-picker/src/pc.vue deleted file mode 100644 index ec555cbc8..000000000 --- a/packages/date-picker/src/pc.vue +++ /dev/null @@ -1,33 +0,0 @@ - - diff --git a/packages/date-range/index.js b/packages/date-range/index.js deleted file mode 100644 index 96c46ceff..000000000 --- a/packages/date-range/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import DateRange from './src/index.vue' - -/* istanbul ignore next */ -DateRange.install = function (Vue) { - Vue.component(DateRange.name, DateRange) -} - -DateRange.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - DateRange.install(window.Vue) - } -} - -export default DateRange diff --git a/packages/date-range/package.json b/packages/date-range/package.json deleted file mode 100644 index 7743e1798..000000000 --- a/packages/date-range/package.json +++ /dev/null @@ -1,21 +0,0 @@ -{ - "name": "@opentiny/vue-date-range", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-input": "~0.1.0", - "@opentiny/vue-button": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0", - "@opentiny/vue-time": "~0.1.0", - "@opentiny/vue-date-table": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/date-range/src/index.vue b/packages/date-range/src/index.vue deleted file mode 100644 index 05445a9b3..000000000 --- a/packages/date-range/src/index.vue +++ /dev/null @@ -1,247 +0,0 @@ - - - - diff --git a/packages/date-table/index.js b/packages/date-table/index.js deleted file mode 100644 index 0ecd01975..000000000 --- a/packages/date-table/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import DateTable from './src/index.vue' - -/* istanbul ignore next */ -DateTable.install = function (Vue) { - Vue.component(DateTable.name, DateTable) -} - -DateTable.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - DateTable.install(window.Vue) - } -} - -export default DateTable diff --git a/packages/date-table/package.json b/packages/date-table/package.json deleted file mode 100644 index 9fefc2867..000000000 --- a/packages/date-table/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-date-table", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/date-table/src/index.vue b/packages/date-table/src/index.vue deleted file mode 100644 index 6830e2ad0..000000000 --- a/packages/date-table/src/index.vue +++ /dev/null @@ -1,85 +0,0 @@ - - - - diff --git a/packages/dept/index.js b/packages/dept/index.js deleted file mode 100644 index 5a7f72136..000000000 --- a/packages/dept/index.js +++ /dev/null @@ -1,23 +0,0 @@ -import Dept from './src/index' -import '@opentiny/vue-theme/dept/index.css' - -Dept.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Dept.install = function (Vue) { - Vue.component(Dept.name, Dept) -} - -Dept.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Dept.install(window.Vue) - } -} - -export default Dept diff --git a/packages/dept/package.json b/packages/dept/package.json deleted file mode 100644 index bb4fbc9f9..000000000 --- a/packages/dept/package.json +++ /dev/null @@ -1,23 +0,0 @@ -{ - "name": "@opentiny/vue-dept", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-select": "~0.1.0", - "@opentiny/vue-option": "~0.1.0", - "@opentiny/vue-row": "~0.1.0", - "@opentiny/vue-col": "~0.1.0", - "@opentiny/vue-modal": "~0.1.0", - "@opentiny/vue-input": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/dept/src/index.js b/packages/dept/src/index.js deleted file mode 100644 index 74d23af47..000000000 --- a/packages/dept/src/index.js +++ /dev/null @@ -1,32 +0,0 @@ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc.vue' - -const template = () => PCTemplate - -export default { - name: $prefix + 'Dept', - props: { - ...$props, - modelValue: String, - disabled: { - type: Boolean, - default: false - }, - autoSelect: { - type: Boolean, - default: true - }, - size: String, - fetchDeptList: Function, - fetchDeptByValue: Function, - fetchDept: Function, - beforeConfirm: Function, - title: { - type: String, - default: '' - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/dept/src/pc.vue b/packages/dept/src/pc.vue deleted file mode 100644 index ce150448b..000000000 --- a/packages/dept/src/pc.vue +++ /dev/null @@ -1,112 +0,0 @@ - - - diff --git a/packages/detail-page/index.js b/packages/detail-page/index.js deleted file mode 100644 index e54d25453..000000000 --- a/packages/detail-page/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import DetailPage from './src/index' -import '@opentiny/vue-theme/detail-page/index.css' - -DetailPage.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -DetailPage.install = function (Vue) { - Vue.component(DetailPage.name, DetailPage) -} - -DetailPage.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - DetailPage.install(window.Vue) - } -} - -export default DetailPage diff --git a/packages/detail-page/package.json b/packages/detail-page/package.json deleted file mode 100644 index d09ee8a3d..000000000 --- a/packages/detail-page/package.json +++ /dev/null @@ -1,20 +0,0 @@ -{ - "name": "@opentiny/vue-detail-page", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-checkbox": "~0.1.0", - "@opentiny/vue-button": "~0.1.0", - "@opentiny/vue-modal": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/detail-page/src/index.js b/packages/detail-page/src/index.js deleted file mode 100644 index 7f11bcddd..000000000 --- a/packages/detail-page/src/index.js +++ /dev/null @@ -1,72 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - LOCAL_TIPS: 'ui.detailpage.localTips', - LOCAL_TITLE: 'ui.detailpage.localTitle', - VALUE_TITLE: 'ui.detailpage.valueTitle', - LABEL_TITLE: 'ui.detailpage.labelTitle', - DIALOG_TITLE: 'ui.detailpage.dialogTitle', - SAVE_BUTTON_TEXT: 'ui.detailpage.saveButtonText', - CANCEL_BUTTTON_TEXT: 'ui.detailpage.cancelButtonText' -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'DetailPage', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - modelValue: Array, - title: { - type: String, - default: '' - }, - textSplit: { - type: String, - default: '---' - }, - dialogTitle: { - type: String, - default: '' - }, - labelTitle: { - type: String, - default: '' - }, - tips: { - type: String, - default: '' - }, - valueTitle: { - type: String, - default: '' - }, - saveButton: { - type: String, - default: '' - }, - cancelButton: { - type: String, - default: '' - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/detail-page/src/pc.vue b/packages/detail-page/src/pc.vue deleted file mode 100644 index 544b97144..000000000 --- a/packages/detail-page/src/pc.vue +++ /dev/null @@ -1,76 +0,0 @@ - - - - diff --git a/packages/dialog-box/index.js b/packages/dialog-box/index.js deleted file mode 100644 index 097e5a445..000000000 --- a/packages/dialog-box/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import DialogBox from './src/index' - -/* istanbul ignore next */ -DialogBox.install = function (Vue) { - Vue.component(DialogBox.name, DialogBox) -} - -DialogBox.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - DialogBox.install(window.Vue) - } -} - -export default DialogBox diff --git a/packages/dialog-box/package.json b/packages/dialog-box/package.json deleted file mode 100644 index f94e34a7e..000000000 --- a/packages/dialog-box/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-dialog-box", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/dialog-box/src/index.js b/packages/dialog-box/src/index.js deleted file mode 100644 index 987d15fd7..000000000 --- a/packages/dialog-box/src/index.js +++ /dev/null @@ -1,127 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const $constants = { - DIALOG_SLIDER_RIGHT: 'dialog-slideRight', - DIALOG_FADE: 'dialog-fade', - SELECT_DROPDOWN: $prefix + 'SelectDropdown', - DROPDOWN_MENU: $prefix + 'DropdownMenu', - DIALOG_BOX_CLASS: 'div.tiny-dialog-box', - PC_SCROLL_LOCK_CLASS: 'tiny-dialog-box__scroll-lock', - MOBILE_SCROLL_LOCK_CLASS: 'tiny-mobile-dialog-box__scroll-lock', - Mode: 'pc', - scrollLockClass(mode) { - return mode === this.Mode ? this.PC_SCROLL_LOCK_CLASS : this.MOBILE_SCROLL_LOCK_CLASS - } -} - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'DialogBox', - model: { - prop: 'visible', - event: 'update:visible' - }, - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - appendToBody: { - type: Boolean, - default: () => false - }, - beforeClose: Function, - center: { - type: Boolean, - default: () => false - }, - closeOnClickModal: { - type: Boolean, - default: () => true - }, - closeOnPressEscape: { - type: Boolean, - default: () => true - }, - destroyOnClose: Boolean, - dialogClass: { - type: String, - default: () => '' - }, - draggable: { - type: Boolean, - default: () => false - }, - fullscreen: { - type: Boolean, - default: () => false - }, - isFormReset: { - type: Boolean, - default: () => true - }, - lockScroll: { - type: Boolean, - default: () => true - }, - modal: { - type: Boolean, - default: () => true - }, - modalAppendToBody: { - type: Boolean, - default: () => true - }, - resize: { - type: Boolean, - default: () => false - }, - rightSlide: { - type: Boolean, - default: () => false - }, - showClose: { - type: Boolean, - default: () => true - }, - showHeader: { - type: Boolean, - default: () => true - }, - title: { - type: String, - default: () => '' - }, - top: String, - visible: { - type: Boolean, - default: () => false - }, - width: { - type: String, - default: () => '500px' - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/dialog-box/src/mobile.vue b/packages/dialog-box/src/mobile.vue deleted file mode 100644 index dac64d012..000000000 --- a/packages/dialog-box/src/mobile.vue +++ /dev/null @@ -1,55 +0,0 @@ - - - - diff --git a/packages/dialog-box/src/pc.vue b/packages/dialog-box/src/pc.vue deleted file mode 100644 index 5b35d01d6..000000000 --- a/packages/dialog-box/src/pc.vue +++ /dev/null @@ -1,100 +0,0 @@ - - - - diff --git a/packages/drop-roles/index.js b/packages/drop-roles/index.js deleted file mode 100644 index e699df367..000000000 --- a/packages/drop-roles/index.js +++ /dev/null @@ -1,23 +0,0 @@ -import DropRoles from './src/index' -import '@opentiny/vue-theme/drop-roles/index.css' - -DropRoles.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -DropRoles.install = function (Vue) { - Vue.component(DropRoles.name, DropRoles) -} - -DropRoles.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - DropRoles.install(window.Vue) - } -} - -export default DropRoles diff --git a/packages/drop-roles/package.json b/packages/drop-roles/package.json deleted file mode 100644 index 0d0da1dfc..000000000 --- a/packages/drop-roles/package.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "name": "@opentiny/vue-drop-roles", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-select": "~0.1.0", - "@opentiny/vue-option": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/drop-roles/src/index.js b/packages/drop-roles/src/index.js deleted file mode 100644 index b6a6b4e03..000000000 --- a/packages/drop-roles/src/index.js +++ /dev/null @@ -1,28 +0,0 @@ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc.vue' - -const template = () => PCTemplate - -export default { - name: $prefix + 'DropRoles', - props: { - ...$props, - modelValue: {}, - placeholder: { - type: String, - default: '' - }, - size: String, - fetchRole: Function, - fetchCurrentRole: Function, - fields: Object, - popperClass: String, - popperAppendToBody: { - type: Boolean, - default: true - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/drop-roles/src/pc.vue b/packages/drop-roles/src/pc.vue deleted file mode 100644 index ec193f5b3..000000000 --- a/packages/drop-roles/src/pc.vue +++ /dev/null @@ -1,37 +0,0 @@ - - - diff --git a/packages/drop-times/index.js b/packages/drop-times/index.js deleted file mode 100644 index 41cf3b494..000000000 --- a/packages/drop-times/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import DropTimes from './src/index' -import '@opentiny/vue-theme/drop-times/index.css' - -DropTimes.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -DropTimes.install = function (Vue) { - Vue.component(DropTimes.name, DropTimes) -} - -DropTimes.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - DropTimes.install(window.Vue) - } -} - -export default DropTimes diff --git a/packages/drop-times/package.json b/packages/drop-times/package.json deleted file mode 100644 index e4355fa75..000000000 --- a/packages/drop-times/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-drop-times", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-select": "~0.1.0", - "@opentiny/vue-option": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/drop-times/src/index.js b/packages/drop-times/src/index.js deleted file mode 100644 index d5c8122f9..000000000 --- a/packages/drop-times/src/index.js +++ /dev/null @@ -1,52 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'DropTimes', - props: { - ...$props, - modelValue: {}, - placeholder: { - type: String, - default: '' - }, - tabindex: { - type: String, - default: '1' - }, - size: String, - popperClass: String, - popperAppendToBody: { - type: Boolean, - default: true - }, - start: { - type: Number, - default: 0 - }, - end: { - type: Number, - default: 24 * 60 - }, - step: { - type: Number, - default: 15 - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/drop-times/src/pc.vue b/packages/drop-times/src/pc.vue deleted file mode 100644 index 2879a8261..000000000 --- a/packages/drop-times/src/pc.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - - diff --git a/packages/dropdown-item/index.js b/packages/dropdown-item/index.js deleted file mode 100644 index 4826e304c..000000000 --- a/packages/dropdown-item/index.js +++ /dev/null @@ -1,33 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import DropdownItem from './src/index' - -DropdownItem.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -DropdownItem.install = function (Vue) { - Vue.component(DropdownItem.name, DropdownItem) -} - -DropdownItem.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - DropdownItem.install(window.Vue) - } -} - -export default DropdownItem diff --git a/packages/dropdown-item/package.json b/packages/dropdown-item/package.json deleted file mode 100644 index 57093e3eb..000000000 --- a/packages/dropdown-item/package.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "name": "@opentiny/vue-dropdown-item", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-popup": "~0.1.0", - "@opentiny/vue-button": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/dropdown-item/src/index.js b/packages/dropdown-item/src/index.js deleted file mode 100644 index 0f73a07e6..000000000 --- a/packages/dropdown-item/src/index.js +++ /dev/null @@ -1,61 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'DropdownItem', - componentName: 'TinyDropdownItem', - props: { - ...$props, - icon: [String, Object], - disabled: Boolean, - divided: Boolean, - command: {}, - title: String, - titleClass: String, - options: { - type: Array, - default: () => [] - }, - type: { - type: String, - default: 'selection' - }, - label: { - type: String, - default: '' - }, - itemData: { - type: Object, - default: () => ({}) - }, - appendToBody: { - type: Boolean, - default: true - }, - textField: { - type: String, - default: 'label' - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/dropdown-item/src/index.vue b/packages/dropdown-item/src/index.vue deleted file mode 100644 index a5094a0c6..000000000 --- a/packages/dropdown-item/src/index.vue +++ /dev/null @@ -1,129 +0,0 @@ - - - - diff --git a/packages/dropdown-item/src/mobile.vue b/packages/dropdown-item/src/mobile.vue deleted file mode 100644 index f2b09979a..000000000 --- a/packages/dropdown-item/src/mobile.vue +++ /dev/null @@ -1,114 +0,0 @@ - - - - diff --git a/packages/dropdown-item/src/pc.vue b/packages/dropdown-item/src/pc.vue deleted file mode 100644 index 21a551885..000000000 --- a/packages/dropdown-item/src/pc.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - - - diff --git a/packages/dropdown-menu/index.js b/packages/dropdown-menu/index.js deleted file mode 100644 index 12e7e5f0d..000000000 --- a/packages/dropdown-menu/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import DropdownMenu from './src/index' - -/* istanbul ignore next */ -DropdownMenu.install = function (Vue) { - Vue.component(DropdownMenu.name, DropdownMenu) -} - -DropdownMenu.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - DropdownMenu.install(window.Vue) - } -} - -export default DropdownMenu diff --git a/packages/dropdown-menu/package.json b/packages/dropdown-menu/package.json deleted file mode 100644 index 34988ace9..000000000 --- a/packages/dropdown-menu/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-dropdown-menu", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/dropdown-menu/src/index.js b/packages/dropdown-menu/src/index.js deleted file mode 100644 index 3489ed5e3..000000000 --- a/packages/dropdown-menu/src/index.js +++ /dev/null @@ -1,78 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'DropdownMenu', - componentName: $prefix + 'DropdownMenu', - props: { - ...$props, - visibleArrow: { - type: Boolean, - default: false - }, - arrowOffset: { - type: Number, - default: 0 - }, - placement: { - type: String, - default: 'bottom-end' - }, - popperClass: String, - popperAppendToBody: { - type: Boolean, - default: true - }, - activeColor: String, - closeOnClickOutside: { - type: Boolean, - default: true - }, - closeOnClickOverlay: { - type: Boolean, - default: true - }, - direction: { - type: String, - default: 'down' - }, - duration: { - type: [Number, String], - default: 0.2 - }, - overlay: { - type: Boolean, - default: true - }, - zIndex: [Number, String], - options: { - type: Array, - default: () => [] - }, - textField: { - type: String, - default: 'label' - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/dropdown-menu/src/index.vue b/packages/dropdown-menu/src/index.vue deleted file mode 100644 index ea9520290..000000000 --- a/packages/dropdown-menu/src/index.vue +++ /dev/null @@ -1,102 +0,0 @@ - - - - diff --git a/packages/dropdown-menu/src/mobile.vue b/packages/dropdown-menu/src/mobile.vue deleted file mode 100644 index 4deccf514..000000000 --- a/packages/dropdown-menu/src/mobile.vue +++ /dev/null @@ -1,79 +0,0 @@ - - - - diff --git a/packages/dropdown-menu/src/pc.vue b/packages/dropdown-menu/src/pc.vue deleted file mode 100644 index 35ef39c94..000000000 --- a/packages/dropdown-menu/src/pc.vue +++ /dev/null @@ -1,52 +0,0 @@ - - - - - diff --git a/packages/dropdown/index.js b/packages/dropdown/index.js deleted file mode 100644 index 5e77a7a9a..000000000 --- a/packages/dropdown/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Dropdown from './src/index.vue' -import '@opentiny/vue-theme/dropdown/index.css' - -/* istanbul ignore next */ -Dropdown.install = function (Vue) { - Vue.component(Dropdown.name, Dropdown) -} - -Dropdown.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Dropdown.install(window.Vue) - } -} - -export default Dropdown diff --git a/packages/dropdown/package.json b/packages/dropdown/package.json deleted file mode 100644 index 11dfe1343..000000000 --- a/packages/dropdown/package.json +++ /dev/null @@ -1,20 +0,0 @@ -{ - "name": "@opentiny/vue-dropdown", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-theme": "~0.1.0", - "@opentiny/vue-button": "~0.1.0", - "@opentiny/vue-button-group": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/dropdown/src/index.vue b/packages/dropdown/src/index.vue deleted file mode 100644 index d0aedb634..000000000 --- a/packages/dropdown/src/index.vue +++ /dev/null @@ -1,140 +0,0 @@ - - - diff --git a/packages/espace/index.js b/packages/espace/index.js deleted file mode 100644 index 9465ab4c1..000000000 --- a/packages/espace/index.js +++ /dev/null @@ -1,18 +0,0 @@ -import Espace from './src/index' -import '@opentiny/vue-theme/espace/index.css' - -/* istanbul ignore next */ -Espace.install = function (Vue) { - Vue.component(Espace.name, Espace) -} - -Espace.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Espace.install(window.Vue) - } -} - -export default Espace diff --git a/packages/espace/package.json b/packages/espace/package.json deleted file mode 100644 index fc9e8b353..000000000 --- a/packages/espace/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-espace", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/espace/src/index.js b/packages/espace/src/index.js deleted file mode 100644 index 4ca055cf2..000000000 --- a/packages/espace/src/index.js +++ /dev/null @@ -1,19 +0,0 @@ -import { $prefix, $props, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc.vue' - -const template = () => PCTemplate - -export default { - name: $prefix + 'Espace', - props: { - ...$props, - data: Array, - isNewImMode: { - type: Boolean, - default: true - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/espace/src/pc.vue b/packages/espace/src/pc.vue deleted file mode 100644 index 15513acea..000000000 --- a/packages/espace/src/pc.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - diff --git a/packages/exception/index.js b/packages/exception/index.js deleted file mode 100644 index a0d7187a9..000000000 --- a/packages/exception/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Exception from './src/index.vue' -import '@opentiny/vue-theme-mobile/exception/index.css' - -/* istanbul ignore next */ -Exception.install = function (Vue) { - Vue.component(Exception.name, Exception) -} - -Exception.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Exception.install(window.Vue) - } -} - -export default Exception diff --git a/packages/exception/package.json b/packages/exception/package.json deleted file mode 100644 index a7120d051..000000000 --- a/packages/exception/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-exception", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-button": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/exception/src/index.vue b/packages/exception/src/index.vue deleted file mode 100644 index d06f5cf7d..000000000 --- a/packages/exception/src/index.vue +++ /dev/null @@ -1,60 +0,0 @@ - - - - diff --git a/packages/fall-menu/index.js b/packages/fall-menu/index.js deleted file mode 100644 index 0d4af9986..000000000 --- a/packages/fall-menu/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import FallMenu from './src/index' -import '@opentiny/vue-theme/fall-menu/index.css' - -/* istanbul ignore next */ -FallMenu.install = function (Vue) { - Vue.component(FallMenu.name, FallMenu) -} - -FallMenu.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - FallMenu.install(window.Vue) - } -} - -export default FallMenu diff --git a/packages/fall-menu/package.json b/packages/fall-menu/package.json deleted file mode 100644 index 829efe619..000000000 --- a/packages/fall-menu/package.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "name": "@opentiny/vue-fall-menu", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-row": "~0.1.0", - "@opentiny/vue-col": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/fall-menu/src/index.js b/packages/fall-menu/src/index.js deleted file mode 100644 index fc1701623..000000000 --- a/packages/fall-menu/src/index.js +++ /dev/null @@ -1,26 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $prefix, $props, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'FallMenu', - props: { - ...$props, - data: { type: Array, default: () => [] } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/fall-menu/src/pc.vue b/packages/fall-menu/src/pc.vue deleted file mode 100644 index 4f1762237..000000000 --- a/packages/fall-menu/src/pc.vue +++ /dev/null @@ -1,99 +0,0 @@ - - - - diff --git a/packages/file-upload/index.js b/packages/file-upload/index.js deleted file mode 100644 index 4627ec581..000000000 --- a/packages/file-upload/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import FileUpload from './src/index' -import '@opentiny/vue-theme/file-upload/index.css' - -/* istanbul ignore next */ -FileUpload.install = function (Vue) { - Vue.component(FileUpload.name, FileUpload) -} - -FileUpload.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - FileUpload.install(window.Vue) - } -} - -export default FileUpload diff --git a/packages/file-upload/package.json b/packages/file-upload/package.json deleted file mode 100644 index 72ea26827..000000000 --- a/packages/file-upload/package.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "name": "@opentiny/vue-file-upload", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-progress": "~0.1.0", - "@opentiny/vue-upload-list": "~0.1.0", - "@opentiny/vue-upload": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/file-upload/src/index.js b/packages/file-upload/src/index.js deleted file mode 100644 index 910ef08e0..000000000 --- a/packages/file-upload/src/index.js +++ /dev/null @@ -1,203 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' -import streamSaver from 'streamsaver' - -const $constants = { - UPLOAD_INNER: 'upload-inner', - FILE_STATUS: { - READY: 'ready', - SUCESS: 'success', - UPLOADING: 'uploading', - FAIL: 'fail', - DOWNLOADING: 'downloading' - }, - LIST_TYPE: { - TEXT: 'text', - PICTURE_CARD: 'picture-card', - PICTURE: 'picture', - THUMB: 'thumb' - }, - EDM: { - CHUNKINIT: 'chunkInit', - FILESIZE: 'fileSize', - CHUNKS: 'chunks', - FILENAME: 'fileName', - ISCHECKCODE: 'isCheckCode', - CHECKCODE: 'checkCode', - MULTIPART: 'multipartFile', - DOCID: 'docId', - CHUNK: 'chunk', - SINGLEUPLOAD: 'uploadFile', - LOWERNAME: 'filename', - FOLDERKEY: 'ui.fileUpload.folder', - FORMAT: 'docFormat=wm&', - WATER: 'usageScenes=water&wmType=wm&', - SOURCE: 'usageScenes=source&', - URLCONTS: '&type=doc&pageNum=1&docVersion=', - EDMTOKEN: 'EDM-Authorization', - TRACEID: 'x-trace-id', - TEXT: 'edm-text', - JSLIB: './jslib/', - I18NKEY: 'ui.fileUpload.token', - LARGEFILEKEY: 'ui.fileUpload.largefile', - EXCEED: 'ui.fileUpload.exceed', - SIZE: 'ui.fileUpload.fileSize', - SIZE_2G: 2 * 1024 * 1024, // 单位(KB) - SIZE_20M: 20 * 1024, - SIZE_8M: 8 * 1024, - FILEEMPTY: 'ui.fileUpload.empty', - KIASCANTIP: 'ui.fileUpload.kiaScanTip', - FILENAMEEXCEEDS: 'ui.fileUpload.fileNameExceeds', - THEFILENAME: 'ui.fileUpload.fileName' - } -} - -const template = (mode) => { - if (process.env.AUI_MODE === 'pc') return PCTemplate - else if (process.env.AUI_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'FileUpload', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - accept: String, - action: String, - autoUpload: { - type: Boolean, - default: () => true - }, - beforeRemove: Function, - beforeUpload: Function, - data: Object, - disabled: Boolean, - display: { - type: Boolean, - default: () => true - }, - drag: Boolean, - dragger: Boolean, - edm: { - type: Object, - default: () => ({}) - }, - fileIconList: { - type: Array, - default: () => [] - }, - fileList: { - type: Array, - default: () => [] - }, - fileSize: { - type: [Number, Array], - validator(value) { - return Array.isArray(value) ? value[0] < value[1] : typeof value === 'number' - } - }, - fileTitle: { - type: String, - default: () => '附件' - }, - headerShow: { - type: Boolean, - default: () => true - }, - headers: { - type: Object, - default: () => ({}) - }, - httpRequest: Function, - limit: Number, - listType: { - type: String, - default: () => 'text', - validator: (value) => !!$constants.LIST_TYPE[value.toUpperCase().replace('-', '_')] - }, - mergeService: { - type: Boolean, - default: () => false - }, - multiple: Boolean, - name: { - type: String, - default: () => 'file' - }, - openDownloadFile: { - type: Boolean, - default: () => false - }, - showFileList: { - type: Boolean, - default: () => true - }, - size: String, - successStatistics: { - type: Boolean, - default: () => true - }, - thumbOption: { - type: Object, - default: () => ({ - popperClass: '', - width: 270, - showDownload: false, - downloadFile: Function, - showDel: false, - icon: 'icon-attachment', - showTooltip: false - }) - }, - type: { - type: String, - default: () => 'select' - }, - uploadIcon: { - type: Boolean, - default: () => true - }, - withCredentials: { - type: Boolean, - default: () => true - }, - isFolderTitle: { - type: Boolean, - default: false - }, - plugin: { - type: [Object, Function], - default: () => streamSaver - }, - listOption: { - type: Object, - default: () => ({ - showUpdate: true, - showDel: true - }) - }, - maxNameLength: { - type: Number, - default: 20 - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/file-upload/src/mobile.vue b/packages/file-upload/src/mobile.vue deleted file mode 100644 index 687a29b35..000000000 --- a/packages/file-upload/src/mobile.vue +++ /dev/null @@ -1,178 +0,0 @@ - - diff --git a/packages/file-upload/src/pc.vue b/packages/file-upload/src/pc.vue deleted file mode 100644 index ec2208368..000000000 --- a/packages/file-upload/src/pc.vue +++ /dev/null @@ -1,264 +0,0 @@ - - diff --git a/packages/floatbar/index.js b/packages/floatbar/index.js deleted file mode 100644 index b8964d7a1..000000000 --- a/packages/floatbar/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Floatbar from './src/index.js' -import '@opentiny/vue-theme/floatbar/index.css' - -/* istanbul ignore next */ -Floatbar.install = function (Vue) { - Vue.component(Floatbar.name, Floatbar) -} - -Floatbar.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Floatbar.install(window.Vue) - } -} - -export default Floatbar diff --git a/packages/floatbar/package.json b/packages/floatbar/package.json deleted file mode 100644 index 14dd9ac07..000000000 --- a/packages/floatbar/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-floatbar", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/floatbar/src/index.js b/packages/floatbar/src/index.js deleted file mode 100644 index 76efeea5b..000000000 --- a/packages/floatbar/src/index.js +++ /dev/null @@ -1,25 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $prefix, $props, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'Floatbar', - props: { - ...$props - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/floatbar/src/pc.vue b/packages/floatbar/src/pc.vue deleted file mode 100644 index c92e50ebd..000000000 --- a/packages/floatbar/src/pc.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - - diff --git a/packages/form-item/package.json b/packages/form-item/package.json deleted file mode 100644 index e0cf5fb66..000000000 --- a/packages/form-item/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-form-item", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-tooltip": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/form/package.json b/packages/form/package.json deleted file mode 100644 index 88959a25f..000000000 --- a/packages/form/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-form", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/form/src/index.js b/packages/form/src/index.js deleted file mode 100644 index 3ea5baa4c..000000000 --- a/packages/form/src/index.js +++ /dev/null @@ -1,98 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'Form', - componentName: 'Form', - props: { - ...$props, - model: Object, - rules: Object, - inlineMessage: Boolean, - statusIcon: Boolean, - showMessage: { - type: Boolean, - default: true - }, - validatePosition: { - type: String, - default: 'right' - }, - size: String, - disabled: Boolean, - validateOnRuleChange: { - type: Boolean, - default: true - }, - hideRequiredAsterisk: { - type: Boolean, - default: false - }, - labelPosition: { - type: String, - default: 'right', - validator: (value) => ~['left', 'top', 'right'].indexOf(value) - }, - labelWidth: { - type: String, - default: '80px' - }, - labelAlign: { - type: Boolean, - default: false - }, - contentOffset: Number, - labelSuffix: { - type: String, - default: '' - }, - inline: { - type: Boolean, - default: false - }, - responsiveLayout: { - type: Boolean, - default: false - }, - validateType: { - type: String, - default: 'tip', - validator(value) { - return ~['tip', 'text'].indexOf(value) - } - }, - manual: { - type: Boolean, - default: false - }, - appendToBody: { - type: Boolean, - default: undefined - }, - popperOptions: { - type: Object, - default: () => ({}) - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/form/src/mobile.vue b/packages/form/src/mobile.vue deleted file mode 100644 index 9ab6909cc..000000000 --- a/packages/form/src/mobile.vue +++ /dev/null @@ -1,54 +0,0 @@ - - - - diff --git a/packages/form/src/pc.vue b/packages/form/src/pc.vue deleted file mode 100644 index 007ebc9a8..000000000 --- a/packages/form/src/pc.vue +++ /dev/null @@ -1,60 +0,0 @@ - - - - diff --git a/packages/fullscreen/index.js b/packages/fullscreen/index.js deleted file mode 100644 index aeed0575f..000000000 --- a/packages/fullscreen/index.js +++ /dev/null @@ -1,38 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Fullscreen from './src/index.vue' -import FullscreenApi from '@opentiny/vue-renderless/common/deps/fullscreen/apis' -import '@opentiny/vue-theme/fullscreen/index.css' - -const apis = ['exit', 'enter', 'element', 'getState', 'isEnabled', 'isFullscreen', 'options', 'request', 'support', 'toggle'] - -apis.forEach((api) => { - if (FullscreenApi[api] && !Fullscreen[api]) { - Fullscreen[api] = FullscreenApi[api] - } -}) - -/* istanbul ignore next */ -Fullscreen.install = function (Vue) { - Vue.component(Fullscreen.name, Fullscreen) -} - -Fullscreen.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Fullscreen.install(window.Vue) - } -} - -export default Fullscreen diff --git a/packages/fullscreen/package.json b/packages/fullscreen/package.json deleted file mode 100644 index 39b8827eb..000000000 --- a/packages/fullscreen/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-fullscreen", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/fullscreen/src/index.vue b/packages/fullscreen/src/index.vue deleted file mode 100644 index aaf3981f9..000000000 --- a/packages/fullscreen/src/index.vue +++ /dev/null @@ -1,63 +0,0 @@ - - - - diff --git a/packages/grid-column/package.json b/packages/grid-column/package.json deleted file mode 100644 index 860ae88f0..000000000 --- a/packages/grid-column/package.json +++ /dev/null @@ -1,15 +0,0 @@ -{ - "name": "@opentiny/vue-grid-column", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-grid": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/grid-manager/package.json b/packages/grid-manager/package.json deleted file mode 100644 index 8f550c5e7..000000000 --- a/packages/grid-manager/package.json +++ /dev/null @@ -1,15 +0,0 @@ -{ - "name": "@opentiny/vue-grid-manager", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-grid": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/grid-manager/src/index.js b/packages/grid-manager/src/index.js deleted file mode 100644 index 345ee5d11..000000000 --- a/packages/grid-manager/src/index.js +++ /dev/null @@ -1,22 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { GridAdapter } from '@opentiny/vue-grid' -import useAntd from './antd' -import useiView from './iview' -import useElementUI from './element-ui' - -export default { - useAntd, - useiView, - useElementUI, - Interceptor: GridAdapter -} diff --git a/packages/grid-toolbar/index.js b/packages/grid-toolbar/index.js deleted file mode 100644 index 1c53fd7b0..000000000 --- a/packages/grid-toolbar/index.js +++ /dev/null @@ -1,27 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import GridToolbar from './src/index' - -GridToolbar.install = function (Vue) { - Vue.component(GridToolbar.name, GridToolbar) -} - -GridToolbar.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - GridToolbar.install(window.Vue) - } -} - -export default GridToolbar diff --git a/packages/grid-toolbar/package.json b/packages/grid-toolbar/package.json deleted file mode 100644 index 8a15d4245..000000000 --- a/packages/grid-toolbar/package.json +++ /dev/null @@ -1,21 +0,0 @@ -{ - "name": "@opentiny/vue-grid-toolbar", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-button": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0", - "@opentiny/vue-modal": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-grid": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/grid-toolbar/src/index.js b/packages/grid-toolbar/src/index.js deleted file mode 100644 index b24cc5430..000000000 --- a/packages/grid-toolbar/src/index.js +++ /dev/null @@ -1,764 +0,0 @@ -/** - * MIT License - * - * Copyright (c) 2019 Xu Liangzhan - * - * Permission is hereby granted, free of charge, to any person obtaining a copy - * of this software and associated documentation files (the "Software"), to deal - * in the Software without restriction, including without limitation the rights - * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell - * copies of the Software, and to permit persons to whom the Software is - * furnished to do so, subject to the following conditions: - * - * The above copyright notice and this permission notice shall be included in all - * copies or substantial portions of the Software. - * - * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR - * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, - * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE - * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER - * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, - * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE - * SOFTWARE. - * - */ -import { isNumber } from '@opentiny/vue-renderless/common/type' -import { iconMinscreen, iconFullscreen } from '@opentiny/vue-icon' -import { h, hooks, $prefix } from '@opentiny/vue-common' -import { toStringJSON, isEmpty, isPlainObject, toJSONString, find } from '@opentiny/vue-renderless/grid/static/' -import { getFuncText, emitEvent, getEventTargetNode, GlobalEvent, getListeners } from '@opentiny/vue-renderless/grid/utils' -import GridCustom from './custom.vue' -import GridCustomSelect from './custom-select.vue' -import { GridButton, GridConfig, GridAdapter, GridTools } from '@opentiny/vue-grid' - -const classMap = { - isActive: 'is__active' -} - -function createMacroTask({ _vm }) { - setTimeout(() => { - if (_vm.settingStore.activeBtn || _vm.settingStore.activeWrapper) return - _vm.closeSetting() - }, 300) -} - -function renderToolsWrapper({ _vm, $tools, $grid, table }) { - return h('div', { class: 'tiny-grid-tools__wrapper' }, $tools.call(_vm, { $grid, $table: table }, h)) -} - -function renderFullScreenWrapper({ _vm }) { - return h('div', { class: 'tiny-grid-fullscreen__wrapper' }, [ - h( - 'div', - { - class: 'tiny-grid-fullscreen__btn', - on: { click: _vm.fullscreenEvent } - }, - [ - h(_vm.isFull ? GridConfig.icon.minscreen : GridConfig.icon.fullscreen, { - class: 'tiny-svg-size' - }) - ] - ) - ]) -} - -function renderRefreshWrapper({ _vm }) { - return h('div', { class: 'tiny-grid-refresh__wrapper' }, [ - h('div', { class: 'tiny-grid-refresh__btn', on: { click: _vm.refreshEvent } }, [ - h(GridConfig.icon.refresh, { - class: ['tiny-svg-size', { roll: _vm.isRefresh }] - }) - ]) - ]) -} - -function renderCustomWrapper({ _vm, settingStore, settingsBtnOns, tableFullColumn, setting, initSettings }) { - return h( - 'div', - { - class: ['tiny-grid-custom__wrapper', { [classMap.isActive]: settingStore.customVisible }], - ref: 'customWrapper' - }, - [ - h('div', { class: 'tiny-grid-custom__setting-btn', on: settingsBtnOns }, [ - setting?.simple - ? h('tiny-grid-custom-select', { - on: { - saveSettings: _vm.handleSaveSettings - }, - props: { - data: tableFullColumn, - setting, - value: settingStore.customVisible - } - }) - : h(GridConfig.icon.custom, { class: 'tiny-svg-size' }) - ]), - h('div', { class: 'tiny-grid-custom__option-wrapper' }, [ - h('tiny-grid-custom', { - on: { - showModal: (modalVisible) => (settingStore.customVisible = modalVisible), - saveSettings: _vm.handleSaveSettings, - resetSettings: (settings) => _vm.$emit('reset-setting', settings), - cancelSettings: () => _vm.$emit('cancel-setting') - }, - props: { - data: tableFullColumn, - value: settingStore.customVisible, - other: setting.other, - keys: setting.keys, - sortable: setting.sortable, - filter: setting.filter, - onBeforeMove: setting.onBeforeMove, - rowClassName: setting.rowClassName, - refresh: setting.refresh, - numberSorting: setting.numberSorting, - multipleHistory: setting.multipleHistory, - initSettings - }, - ref: 'custom' - }) - ]) - ] - ) -} - -function getScopedSlots({ item, _vm }) { - let scopedSlots = null - let childHandler = (child) => { - let res = [null] - - if (child.visible !== false) { - res = h( - GridButton, - { - on: { - click: (event) => _vm.btnEvent(event, child) - }, - props: { - disabled: child.disabled - } - }, - getFuncText(child.name) - ) - } - - return res - } - - if (item.dropdowns && item.dropdowns.length) { - scopedSlots = { - default: () => getFuncText(item.name), - dropdowns: () => item.dropdowns.map(childHandler) - } - } - - return scopedSlots -} - -function renderButtonWrapper({ _vm, $buttons, $grid, table, buttons }) { - let childrenArg - - if ($buttons) { - childrenArg = $buttons.call(_vm, { $grid, $table: table }, h) - } else { - childrenArg = buttons.map((item) => { - let res = [null] - - if (item.visible !== false) { - let scopedSlots = getScopedSlots({ item, _vm }) - - res = h( - GridButton, - { - on: { - click: (event) => _vm.btnEvent(event, item) - }, - props: { - disabled: item.disabled - }, - scopedSlots - }, - getFuncText(item.name) - ) - } - - return res - }) - } - - return h('div', { class: 'tiny-grid-button__wrapper' }, childrenArg) -} - -export default { - name: $prefix + 'GridToolbar', - components: { - TinyGridCustom: GridCustom, - TinyGridCustomSelect: GridCustomSelect, - IconFullscreen: iconFullscreen(), - IconMinscreen: iconMinscreen() - }, - props: { - id: String, - loading: false, - resizable: { - type: [Boolean, Object], - default: () => GridConfig.toolbar.resizable - }, - refresh: { - type: [Boolean, Object], - default: () => GridConfig.toolbar.refresh - }, - setting: { - type: [Boolean, Object], - default: () => GridConfig.toolbar.setting - }, - fullScreen: { type: Boolean, default: false }, - buttons: { type: Array, default: () => GridConfig.toolbar.buttons }, - size: String, - data: Array, - customs: Array, - beforeOpenFullScreen: Function, - beforeCloseFullScreen: Function - }, - inject: { - $grid: { - default: null - } - }, - data() { - return { - table: null, - isRefresh: false, - tableFullColumn: [], - initSettings: { - pageSizes: [], - pageSize: 10, - sortType: 'page', - showIndex: false, - multipleHistory: { - tableMaxHeight: '', - showTitle: true, - title: '', - showSave: true, - saveDisabled: false, - saveText: '', - labelText: '', - selectPlaceholder: '', - selectDisabled: false, - showApply: true, - applyDisabled: false, - applyTitle: '', - applyIcon: null, - showEdit: true, - editDisabled: false, - editTitle: '', - editIcon: null, - showDel: true, - delDisabled: false, - delTitle: '', - delIcon: null, - storageKey: 'TINY_TABLE_MULTI_HISTORY_SETTING', - remoteMethod: null, - userKey: '', // userId or userAccount - remoteSelectedMethod: null - } - }, - settingStore: { - visible: false, - customVisible: false - }, - isFull: false - } - }, - computed: { - vSize() { - return this.size || this.$parent.size || this.$parent.vSize - }, - refreshOpts() { - return { ...GridConfig.toolbar.refresh, ...this.refresh } - }, - resizableOpts() { - return { - storageKey: 'TINY_TABLE_CUSTOM_COLUMN_WIDTH', - ...GridConfig.toolbar.resizable, - ...this.resizable - } - }, - settingOpts() { - return { - storageKey: 'TINY_TABLE_CUSTOM_SETTING', - ...GridConfig.toolbar.setting, - ...this.setting - } - } - }, - created() { - let { settingOpts, id, customs, $grid } = this - - this.initSettings.pageSizes = ($grid.pagerConfig && $grid.pagerConfig.pageSizes) || [10, 15, 20, 30, 50, 100] - this.initSettings.pageSize = ($grid.pagerConfig && $grid.pagerConfig.pageSize) || 10 - this.initSettings.sortType = (this.setting && this.setting.sortType) || 'page' - this.initSettings.showIndex = this.setting && this.setting.showIndex - - if (settingOpts.storage === 'local') { - this.initSettings = Object.assign(this.initSettings, this.getStorageMap(settingOpts.storageKey)[id] || {}) - } - - if (customs) { - this.tableFullColumn = customs - } - - if (settingOpts.storage && !id) { - return GridTools.error('ui.grid.error.toolbarId') - } - - setTimeout(() => { - this.loadStorage() - }) - - GlobalEvent.on(this, 'mousedown', this.handleGlobalMousedownEvent) - GlobalEvent.on(this, 'blur', this.handleGlobalBlurEvent) - this.$grid.toolBarVm = this - }, - setup(props, { slots, attrs, listeners }) { - hooks.onBeforeUnmount(() => { - GlobalEvent.off(this, 'mousedown') - GlobalEvent.off(this, 'blur') - }) - - const tableListeners = getListeners(attrs, listeners) - - return { slots, tableListeners } - }, - render() { - let { $grid, slots: $slots, table, loading, settingStore, refresh, fullScreen } = this - let { setting, initSettings, buttons = [], vSize, tableFullColumn } = this - let { buttons: $buttons, tools: $tools } = $slots - let settingsBtnOns = {} - - setting && (settingsBtnOns.click = this.handleClickCustomEvent) - - const map = { - isLoading: 'is__loading' - } - - let propsArg = { - class: ['tiny-grid-toolbar', { [`size__${vSize}`]: vSize, [map.isLoading]: loading }] - } - - let args = { - _vm: this, - settingStore, - settingsBtnOns, - tableFullColumn, - setting, - initSettings - } - - let childrenArg = [ - renderButtonWrapper({ _vm: this, $buttons, $grid, table, buttons }), - setting ? renderCustomWrapper(args) : null, - refresh ? renderRefreshWrapper({ _vm: this }) : null, - fullScreen ? renderFullScreenWrapper({ _vm: this }) : null, - $tools ? renderToolsWrapper({ _vm: this, $tools, $grid, table }) : $slots.default && $slots.default() - ] - - return h('div', propsArg, childrenArg) - }, - methods: { - updateConf() { - let data = this.data - let $children = this.$parent.$children - - let findHandler = (childComp, childIndex) => - childComp && - childComp.refreshColumn && - childIndex > $children.indexOf(this) && - (data ? childComp.data === data : childComp.$vnode.componentOptions.tag === 'tiny-grid-table') - - this.table = find($children, findHandler) - }, - closeSetting() { - let setting = this.setting - let settingStore = this.settingStore - - if (settingStore.visible) { - settingStore.visible = false - } - - if (settingStore.visible && setting && !settingStore.immediate) { - this.updateSetting() - } - }, - openSetting() { - this.settingStore.visible = true - }, - orderSetting() { - let { id, settingOpts } = this - let allData = [] - - const custumSetting = JSON.parse(localStorage.getItem(settingOpts.storageKey)) - - if (custumSetting) { - const customName = custumSetting[id] - - allData = (customName && customName.columns) || [] - } - - let orderArg = allData - .map((value) => ({ - fileds: value.property, - property: value.property, - order: value.order, - prop: value.property - })) - .filter((item) => item.order !== null) - - return orderArg - }, - loadColWidth() { - const { id, resizableOpts } = this - - if (resizableOpts.storage) { - const width = this.getStorageMap(resizableOpts.storageKey)[id] || {} - - if (width) { - const widthSet = {} - - for (let key in width) { - if (Object.prototype.hasOwnProperty.call(width, key)) { - widthSet[key] = { resizeWidth: width[key] } - } - } - - return widthSet - } - } - }, - loadStorage() { - let { $grid, id, resizable, setting, settingOpts } = this - - if (!$grid) { - return - } - - if (resizable || setting) { - let customSettings = [] - - if ($grid) { - $grid.connect({ toolbar: this }) - } else { - throw new Error('[tiny-grid-toolbar] Not found tiny-grid.') - } - - // 加载 'fixed', 'visible', 'order' 列的个性化配置 - if (settingOpts.storage === 'local') { - const settingsStorage = this.getStorageMap(settingOpts.storageKey)[id] - - customSettings = (settingsStorage && settingsStorage.columns) || [] - - if (settingsStorage && settingsStorage.pageSize) { - const pageSize = settingsStorage.pageSize - - this.$grid.pagerConfig && this.$grid.pagerConfig.pageSize !== pageSize && this.$grid.pageSizeChange(pageSize, $grid.autoLoad === false) - } - } - - this.updateCustoms(customSettings.length ? customSettings : this.tableFullColumn) - } - }, - // NEXT 未用到 - updateColumn(fullColumn) { - this.tableFullColumn = fullColumn - }, - updateCustoms(customs) { - let { $grid, table, setting } = this - let comp = $grid || table - const sort = setting && !!setting.sortable - - if (comp) { - const colWidth = this.loadColWidth() - - comp.reloadCustoms(customs, sort, colWidth).then((fullColumn) => { - this.tableFullColumn = fullColumn - }) - } - }, - getStorageMap(key) { - let version = GridConfig.version - let rest = toStringJSON(localStorage.getItem(key)) - - return rest && rest._v === version ? rest : { _v: version } - }, - // 保存 'fixed', 'visible', 'order' 列的个性化配置 - saveCustomSettings(columnConfigs) { - let { id, settingOpts } = this - - // 个性化配置本地存储 - if (settingOpts.storage === 'local') { - let settingsStorageMap = this.getStorageMap(settingOpts.storageKey) - let settingsStorage = settingsStorageMap[id] || {} - - settingsStorage.columns = columnConfigs - settingsStorageMap[id] = settingsStorage - localStorage.setItem(settingOpts.storageKey, toJSONString(settingsStorageMap)) - } - - return this.$nextTick() - }, - // 保存分页、排序类型数据数据 - savePagerSettings(settingConfigs) { - let { id, settingOpts } = this - - if (settingOpts.storage) { - let settingsStorageMap = this.getStorageMap(settingOpts.storageKey) - let settingsStorage = settingsStorageMap[id] - - if (settingsStorage) { - Object.assign(settingsStorage, settingConfigs) - } else { - settingsStorage = settingConfigs - } - - settingsStorageMap[id] = settingsStorage - localStorage.setItem(settingOpts.storageKey, toJSONString(settingsStorageMap)) - } - - return this.$nextTick() - }, - // 只保存隐藏列配置 - saveColumnHide() { - let { id, tableFullColumn, settingOpts } = this - - if (settingOpts.storage) { - let columnHideStorageMap = this.getStorageMap(settingOpts.storageKey) - let colHides = tableFullColumn.filter((column) => column.property && !column.visible) - - columnHideStorageMap[id] = colHides.length ? colHides.map((column) => column.property).join(',') : undefined - this.$refs.custom && this.$refs.custom.saveSettings() - } - - return this.$nextTick() - }, - saveColumnWidth(isReset) { - let { id, resizableOpts, tableFullColumn } = this - let { storage, storageKey } = resizableOpts - let columnWidthStorageMap - - if (storage) { - columnWidthStorageMap = this.getStorageMap(storageKey) - } - - let columnWidthStorage - - if (storage && !isReset) { - columnWidthStorage = columnWidthStorageMap[id] - columnWidthStorage = isPlainObject(columnWidthStorage) ? columnWidthStorage : {} - - tableFullColumn.forEach(({ property, resizeWidth, renderWidth }) => { - if (property && resizeWidth) { - columnWidthStorage[property] = renderWidth - } - }) - } - - if (storage) { - columnWidthStorageMap[id] = isEmpty(columnWidthStorage) ? undefined : columnWidthStorage - localStorage.setItem(storageKey, toJSONString(columnWidthStorageMap)) - } - - return this.$nextTick() - }, - resetResizable() { - this.updateResizable(this) - }, - updateResizable(isReset) { - let tableComp = this.$grid || this.table - - this.saveColumnWidth(isReset) - tableComp.analyColumnWidth() - - return tableComp.recalculate(true) - }, - updateSetting() { - const tableComp = this.$grid || this.table - - tableComp.refreshColumn() - this.tableFullColumn = this.tableFullColumn.slice(0) - - return this.$nextTick(() => this.$refs.custom && this.$refs.custom.saveSettings()) - }, - applySettings({ columns, pageSize }) { - const sort = this.setting && !!this.setting.sortable - - if (this.$grid) { - if (columns && columns.length) { - const colWidth = this.loadColWidth() - this.$grid.reloadCustoms(columns, sort, colWidth).then(() => { - // 处理表格数据,否则列排序不生效 - this.$grid.handleTableData(true).then(() => { - // 重新计算内部元素的位置 - this.$grid.recalculate(true) - }) - }) - } - - if (isNumber(pageSize) && this.$grid.pagerConfig && this.$grid.pagerConfig.pageSize !== pageSize) { - this.$grid.pageSizeChange(pageSize) - } - } - }, - handleSaveSettings(settingConfigs) { - let { settingStore, setting, settingOpts } = this - let customRef = this.$refs.custom - - settingStore.customVisible = false - - const { columns, pageSize, sortType } = settingConfigs - - this.applySettings({ columns, pageSize }) - // 如果开启本地缓存则保存数据到 localstorage - if (setting && settingOpts.storage === 'local') { - // 保存时如果没有设置 id 就使用 null 清除掉本地存储中保存的 id - const pagerSettings = { pageSize, sortType, id: null } - - if (setting.multipleHistory && customRef.multipleHistoryId) { - pagerSettings.id = customRef.multipleHistoryId - customRef.multipleHistoryId = null - } - - this.saveCustomSettings(columns) - this.savePagerSettings(pagerSettings) - } else if (setting && settingOpts.storage === 'remote') { - // 个性化配置远程服务存储 - if (settingOpts.remote) { - this.$emit('remote-setting', settingConfigs) - - if (setting.multipleHistory) { - this.$emit( - 'multiple-history-option', - toJSONString({ - [settingOpts.storageKey]: { - [this.id]: { - ...settingConfigs, - id: customRef.multipleHistoryId || null - } - } - }) - ) - - customRef.multipleHistoryId = null - } - } - } - - this.$emit('save-setting', settingConfigs) - }, - handleGlobalMousedownEvent(event) { - if (!getEventTargetNode(event, this.$refs.customWrapper).flag) { - this.closeSetting() - } - }, - handleGlobalBlurEvent() { - this.closeSetting() - }, - // NEXT 未用到 - handleClickSettingEvent() { - let { settingStore } = this - - settingStore.visible = !settingStore.visible - }, - handleClickCustomEvent() { - let { settingStore } = this - this.$refs.custom.settings.pageSize = - (this.$grid.pagerConfig && this.$grid.pagerConfig.pageSize) || (this.settingOpts.storage === 'local' && this.$refs.custom.settings.pageSize) || 10 - - settingStore.customVisible = !settingStore.customVisible - }, - // NEXT 未用到 - handleMouseenterSettingEvent() { - this.settingStore.activeBtn = true - this.openSetting() - }, - // NEXT 未用到 - handleMouseleaveSettingEvent() { - this.settingStore.activeBtn = false - createMacroTask({ _vm: this }) - }, - // NEXT 未用到 - handleWrapperMouseenterEvent() { - this.settingStore.activeWrapper = true - this.openSetting() - }, - // NEXT 未用到 - handleWrapperMouseleaveEvent() { - this.settingStore.activeWrapper = false - createMacroTask({ _vm: this }) - }, - refreshEvent() { - let { $grid, isRefresh, refreshOpts } = this - let catchHandler = (e) => e - let nextHandler = () => (this.isRefresh = false) - - if (isRefresh) return - - this.isRefresh = true - - if (refreshOpts.query) { - refreshOpts.query().catch(catchHandler).then(nextHandler) - return - } - - if ($grid && $grid.fetchData) { - $grid.commitProxy('reload').catch(catchHandler).then(nextHandler) - return - } - - if ($grid) { - $grid.refreshData().then(nextHandler) - } - }, - btnEvent(event, item) { - let { $grid, table, tableListeners } = this - let { code } = item - - if (code) { - if ($grid && !tableListeners['button-click']) { - $grid.triggerToolbarBtnEvent(item, event) - } else { - let btnMethod = GridAdapter.buttons.get(code) - let params = { code, button: item, $grid, $table: table } - - if (btnMethod) { - btnMethod.call(this, params, event) - } - - emitEvent(this, 'button-click', [params, event]) - } - } - }, - fullscreenEvent() { - let beforeOpenFullScreen, - beforeCloseFullScreen, - interceptFullScreen, - show = !this.isFull - - if (this.fullScreen) { - beforeOpenFullScreen = this.beforeOpenFullScreen - beforeCloseFullScreen = this.beforeCloseFullScreen - interceptFullScreen = - (show && typeof beforeOpenFullScreen === 'function' && !beforeOpenFullScreen()) || - (!show && typeof beforeCloseFullScreen === 'function' && !beforeCloseFullScreen()) - - if (interceptFullScreen) return - } - - if (this.$grid) { - this.isFull = !this.isFull - this.$grid.commitProxy('fullscreen', this.isFull) - } - } - } -} diff --git a/packages/grid/index.js b/packages/grid/index.js deleted file mode 100644 index 41cb513be..000000000 --- a/packages/grid/index.js +++ /dev/null @@ -1,57 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { t } from '@opentiny/vue-locale' -import '@opentiny/vue-theme/grid/index.css' -import GridAdapter from './src/adapter' -import Table from './src/table' -import GridColumn from './src/column' -import Grid from './src' -import Menu from './src/menu' -import Edit from './src/edit' -import Export from './src/export' -import Keyboard from './src/keyboard' -import Validator from './src/validator' -import Resize from './src/resize' -import Filter from './src/filter' -import GridConfig from './src/config' -import GridRadio from './src/radio' -import GridButton from './src/button' -import * as GridTools from './src/tools' - -const components = [Menu, Edit, Export, Keyboard, Validator, Resize, Filter] - -function install() { - GridAdapter.setup({ i18n: t }) - - GridAdapter.t = t - - components.map((component) => component.install(Table)) -} - -install() - -Grid.version = process.env.COMPONENT_VERSION - -Grid.install = function (Vue) { - Vue.component(Grid.name, Grid) -} - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Grid.install(window.Vue) - } -} - -export default Grid - -export { GridColumn, GridConfig, GridAdapter, GridRadio, GridButton, GridTools } diff --git a/packages/grid/package.json b/packages/grid/package.json deleted file mode 100644 index 0a1d7ced2..000000000 --- a/packages/grid/package.json +++ /dev/null @@ -1,20 +0,0 @@ -{ - "name": "@opentiny/vue-grid", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0", - "@opentiny/vue-modal": "~0.1.0", - "@opentiny/vue-pager": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-tooltip": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/grid/src/adapter/index.js b/packages/grid/src/adapter/index.js deleted file mode 100644 index da6453b56..000000000 --- a/packages/grid/src/adapter/index.js +++ /dev/null @@ -1,64 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { Interceptor, StoreMap } from '@opentiny/vue-renderless/grid/core' -import Setup from './src/setup' -import Renderer from './src/renderer' - -const installedPlugins = [] - -const Buttons = StoreMap -const Menus = StoreMap - -export const Grid = { - use(Plugin, options) { - if (Plugin && Plugin.install) { - if (installedPlugins.indexOf(Plugin) === -1) { - Plugin.install(this, options) - installedPlugins.push(Plugin) - } - } - - return this - }, - setup: Setup, - interceptor: Interceptor, - renderer: Renderer, - buttons: Buttons, - menus: Menus, - _tooltip: true -} - -export { Menus, Buttons, Interceptor, Renderer } - -const handleClearEvent = (params, event) => { - if (params && params.$table) { - const getTarget = params.$table.getEventTargetNode - const bodyEl = document.body - - if ( - getTarget(event, bodyEl, 'tiny-autocomplete-suggestion').flag || - getTarget(event, bodyEl, 'tiny-select-dropdown').flag || - getTarget(event, bodyEl, 'tiny-cascader__dropdown').flag || - getTarget(event, bodyEl, 'tiny-cascader-menus').flag || - getTarget(event, bodyEl, 'tiny-picker-panel').flag || - getTarget(event, bodyEl, 'tiny-popper').flag || - getTarget(event, bodyEl, 'tiny-dialog-box').flag - ) { - return false - } - } -} - -Grid.interceptor.add('event.clear_actived', handleClearEvent) -Grid.interceptor.add('event.clear_filter', handleClearEvent) - -export default Grid diff --git a/packages/grid/src/body/src/body.jsx b/packages/grid/src/body/src/body.jsx deleted file mode 100644 index f695ef930..000000000 --- a/packages/grid/src/body/src/body.jsx +++ /dev/null @@ -1,925 +0,0 @@ -/** - * MIT License - * - * Copyright (c) 2019 Xu Liangzhan - * - * Permission is hereby granted, free of charge, to any person obtaining a copy - * of this software and associated documentation files (the "Software"), to deal - * in the Software without restriction, including without limitation the rights - * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell - * copies of the Software, and to permit persons to whom the Software is - * furnished to do so, subject to the following conditions: - * - * The above copyright notice and this permission notice shall be included in all - * copies or substantial portions of the Software. - * - * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR - * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, - * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE - * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER - * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, - * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE - * SOFTWARE. - * - */ -import { isFunction, find } from '@opentiny/vue-renderless/grid/static/' -import { isNull } from '@opentiny/vue-renderless/common/type' -import { updateCellTitle, emitEvent, getClass, getFuncText, getRowid, formatText } from '@opentiny/vue-renderless/grid/utils' -import { getCellLabel } from '../../tools' -import GlobalConfig from '../../config' -import { iconChevronRight, iconChevronDown } from '@opentiny/vue-icon' -import { h, hooks, $prefix } from '@opentiny/vue-common' -import { getTreeChildrenKey, getTreeShowKey, getTableCellKey } from '../../table/src/strategy' - -// 滚动、拖动过程中不需要触发 -const isOperateMouse = ($table) => $table._isResize || ($table.lastScrollTime && Date.now() < $table.lastScrollTime + $table.optimizeOpts.delayHover) - -// 解决静态扫描驼峰变量问题 -const classMap = { - colEdit: 'col__edit', - colIndex: 'col__index', - colRadio: 'col__radio', - colSelection: 'col__selection', - colEllipsis: 'col__ellipsis', - editVisible: 'edit__visible', - fixedHidden: 'fixed__hidden', - colDirty: 'col__dirty', - colActived: 'col__actived', - rowNew: 'row__new', - rowSelected: 'row__selected', - rowActived: 'row__actived', - isScrollload: 'is__scrollload' -} - -const renderBorder = (h, type) => { - let vnTop = h('span', { - class: 'tiny-grid-border-top', - ref: `${type}Top` - }) - let vnRight = h('span', { - class: 'tiny-grid-border-right', - ref: `${type}Right` - }) - let vnBottom = h('span', { - class: 'tiny-grid-border-bottom', - ref: `${type}Bottom` - }) - let vnLeft = h('span', { - class: 'tiny-grid-border-left', - ref: `${type}Left` - }) - - return h( - 'div', - { - class: `tiny-grid-${type}ed-borders`, - ref: `${type}Borders` - }, - [vnTop, vnRight, vnBottom, vnLeft] - ) -} - -function buildColumnProps(args) { - let { attrs, cellAlign, cellClassName, className, column, columnActived, columnIndex, columnKey, editor } = args - let { fixedHiddenColumn, hasEllipsis, isDirty, params, tdOns, validError, validated } = args - return { - class: [ - 'tiny-grid-body__column', - column.id, - { - [`col__${cellAlign}`]: cellAlign, - [classMap.colEdit]: editor, - [classMap.colIndex]: column.type === 'index', - [classMap.colRadio]: column.type === 'radio', - [classMap.colSelection]: column.type === 'selection', - [classMap.colEllipsis]: hasEllipsis, - [classMap.editVisible]: editor && editor.type === 'visible', - [classMap.fixedHidden]: fixedHiddenColumn, - [classMap.colDirty]: isDirty, - [classMap.colActived]: columnActived, - 'col__valid-error': validError && validated, - 'col__valid-success': columnActived ? !validError && !validated : isDirty && !validated - }, - getClass(className, params), - getClass(cellClassName, params) - ], - key: columnKey ? column.id : columnIndex, - attrs, - on: tdOns - } -} - -function buildColumnChildren(args) { - let { h, hasDefaultTip, params, row, validError } = args - let { allColumnOverflow, column, fixedHiddenColumn } = args - let { showEllipsis, showTip, showTitle, showTooltip, validStore } = args - let res = [] - if (!allColumnOverflow || !fixedHiddenColumn) { - let res1 = null - if (hasDefaultTip) { - res1 = [null] - if (validError) { - res1 = h( - 'div', - { - class: 'tiny-grid-cell__valid', - style: validStore.rule && validStore.rule.width ? { width: `${validStore.rule.width}px` } : null - }, - [h('span', { class: 'tiny-grid-cell__valid-msg' }, validStore.content)] - ) - } - } - res = [ - h( - 'div', - { - class: [ - 'tiny-grid-cell', - { - 'tiny-grid-cell__title': showTitle, - 'tiny-grid-cell__tooltip': showTooltip || showTip, - 'tiny-grid-cell__ellipsis': showEllipsis - } - ], - attrs: { title: showTitle ? getCellLabel(row, column, params) : null }, - key: getTableCellKey(params) - }, - column.renderCell(h, params) - ), - res1 - ] - } - return res -} - -function modifyCellAlign({ cellAlign, column }) { - if (~['radio', 'selection', 'index'].indexOf(column.type)) { - cellAlign = cellAlign ? cellAlign : 'center' - } - - return cellAlign -} - -function modifyShowEllipsis({ hasEllipsis, scrollXLoad, scrollYLoad, showEllipsis }) { - if ((scrollXLoad || scrollYLoad) && !hasEllipsis) { - showEllipsis = true - } - - return showEllipsis -} - -function addListenerMouseenter({ $table, evntParams, showTip, showTitle, showTooltip, tableListeners, tdOns }) { - if (showTip || showTitle || showTooltip || tableListeners['cell-mouseenter']) { - tdOns.mouseenter = (event) => { - if (isOperateMouse($table)) { - return - } - - evntParams.cell = event.currentTarget - - if (showTitle) { - updateCellTitle(event) - } else if (showTip || showTooltip) { - // 如果配置了显示 tooltip - $table.triggerTooltipEvent(event, evntParams) - } - - emitEvent($table, 'cell-mouseenter', [evntParams, event]) - } - } -} - -function addListenerMouseleave({ $table, evntParams, showTip, showTooltip, tableListeners, tdOns }) { - if (showTip || showTooltip || tableListeners['cell-mouseleave']) { - tdOns.mouseleave = (event) => { - if (isOperateMouse($table)) { - return - } - - if (showTip || showTooltip) { - $table.clostTooltip() - } - - evntParams.cell = event.currentTarget - - emitEvent($table, 'cell-mouseleave', [evntParams, event]) - } - } -} - -function addListenerMousedown({ $table, evntParams, mouseConfig, tdOns }) { - if (mouseConfig.checked || mouseConfig.selected) { - tdOns.mousedown = (event) => { - evntParams.cell = event.currentTarget - $table.triggerCellMousedownEvent(event, evntParams) - } - } -} - -function addListenerClick(args) { - let { $table, column, editConfig, editor, evntParams, expandConfig, highlightCurrentRow } = args - let { mouseConfig, radioConfig, selectConfig, tableListeners, tdOns, treeConfig } = args - let satisfy = (equal, trigger) => trigger === 'row' || (equal(column) && trigger === 'cell') - - if ( - highlightCurrentRow || - tableListeners['cell-click'] || - mouseConfig.checked || - (editor && editConfig) || - satisfy(() => true, expandConfig.trigger) || - satisfy(({ type }) => type === 'radio', radioConfig.trigger) || - satisfy(({ type }) => type === 'selection', selectConfig.trigger) || - satisfy(({ treeNode }) => treeNode, treeConfig.trigger) - ) { - tdOns.click = (event) => { - evntParams.cell = event.currentTarget - $table.triggerCellClickEvent(event, evntParams) - } - } -} - -function getRowSpanMethod(rowSpan) { - return ({ row, $rowIndex, column, data }) => { - let fields = [] - - if (rowSpan) { - rowSpan.forEach((item) => { - column.visible && fields.push(item.field) - }) - } - - let cellVal = row[column.property] - - if (cellVal && ~fields.indexOf(column.property)) { - let prevSiblingRow = data[$rowIndex - 1] - let nextSiblingRow = data[$rowIndex + 1] - - if (prevSiblingRow && prevSiblingRow[column.property] === cellVal) { - return { rowspan: 0, colspan: 0 } - } else { - let rowspanCount = 1 - - while (nextSiblingRow && nextSiblingRow[column.property] === cellVal) { - nextSiblingRow = data[++rowspanCount + $rowIndex] - } - - if (rowspanCount > 1) { - return { rowspan: rowspanCount, colspan: 1 } - } - } - } - } -} - -function addListenerDblclick({ $table, evntParams, tableListeners, tdOns, triggerDblclick }) { - if (triggerDblclick || tableListeners['cell-dblclick']) { - tdOns.dblclick = (event) => { - evntParams.cell = event.currentTarget - $table.triggerCellDBLClickEvent(event, evntParams) - } - } -} - -function doSpan({ attrs, params, rowSpan, spanMethod }) { - const rowSpanMethod = getRowSpanMethod(rowSpan) - - if (spanMethod || rowSpan) { - let { rowspan = 1, colspan = 1 } = (spanMethod ? spanMethod(params) : rowSpanMethod(params)) || {} - - if (!rowspan || !colspan) { - return false - } - - attrs.rowspan = rowspan - attrs.colspan = colspan - } - - return true -} - -function isCellDirty({ $table, column, editConfig, fixedHiddenColumn, isDirty, row }) { - if (!fixedHiddenColumn && editConfig && editConfig.showStatus) { - isDirty = $table.hasRowChange(row, column.property) - } - - return isDirty -} - -const setColumnEvents = (args1) => { - let { $columnIndex, $rowIndex, $table, column, columnIndex } = args1 - let { fixedType, row, rowIndex, rowLevel, seq } = args1 - let { editConfig, expandConfig = {} } = $table - let { radioConfig = {}, showOverflow: allColumnOverflow } = $table - let { highlightCurrentRow, mouseConfig = {}, overflowX } = $table - let { scrollXLoad, scrollYLoad, selectConfig = {} } = $table - let { tableListeners, treeConfig = {} } = $table - let tdOns = {} - let fixedHiddenColumn = fixedType ? column.fixed !== fixedType : column.fixed && overflowX - let { editor, showOverflow, showTip } = column - let cellOverflow = isNull(showOverflow) ? allColumnOverflow : showOverflow - let showTitle = cellOverflow === 'title' - let showTooltip = cellOverflow === true || cellOverflow === 'tooltip' - let showEllipsis = cellOverflow === 'ellipsis' - let hasEllipsis = showTitle || showTooltip || showEllipsis - let triggerDblclick = editor && editConfig && editConfig.trigger === 'dblclick' - - let commonParams = { $columnIndex, $rowIndex, $table, column, columnIndex, fixed: fixedType } - Object.assign(commonParams, { isHidden: fixedHiddenColumn, level: rowLevel, row, rowIndex, seq }) - - let evntParams = { showTip, ...commonParams } - // 滚动的渲染不支持动态行高 - showEllipsis = modifyShowEllipsis({ hasEllipsis, scrollXLoad, scrollYLoad, showEllipsis }) - // hover 进入事件 - addListenerMouseenter({ $table, evntParams, showTip, showTitle, showTooltip, tableListeners, tdOns }) - // hover 退出事件 - addListenerMouseleave({ $table, evntParams, showTip, showTooltip, tableListeners, tdOns }) - // 按下事件处理 - addListenerMousedown({ $table, evntParams, mouseConfig, tdOns }) - - let args = { $table, column, editConfig, editor, evntParams, expandConfig, highlightCurrentRow } - Object.assign(args, { mouseConfig, radioConfig, selectConfig, tableListeners, tdOns, treeConfig }) - // 点击事件处理 - addListenerClick(args) - // 双击事件处理 - addListenerDblclick({ $table, evntParams, tableListeners, tdOns, triggerDblclick }) - - return { commonParams, args, cellOverflow, showTitle, showTooltip, showEllipsis, hasEllipsis, tdOns, fixedHiddenColumn } -} - -/** - * 渲染列 - */ -function renderColumn(args1) { - let { $seq, $table, column, columnIndex } = args1 - let { h, row } = args1 - let { align: allAlign, cellClassName, columnKey, editConfig } = $table - let { editRules, editStore, rowId, rowSpan } = $table - let { showOverflow: allColumnOverflow, height } = $table - let { tableData, validOpts, validStore, validatedMap, spanMethod } = $table - let { isDirty, attrs = { 'data-colid': column.id } } = {} - let { message } = validOpts - let { actived } = editStore - let validated = validatedMap[`${column.id}-${row[rowId]}`] - let validError = validStore.row === row && validStore.column === column - let hasDefaultTip = editRules && (message === 'default' ? height || tableData.length > 1 : message === 'inline') - let { align, className, editor, showTip } = column - let cellAlign = align || allAlign - let columnActived = editConfig && editor && actived.row === row && (actived.column === column || editConfig.mode === 'row') - - let { commonParams, args, showTitle, showTooltip, showEllipsis, tdOns = {}, hasEllipsis, fixedHiddenColumn } = setColumnEvents(args1) - let params = { $seq, data: tableData, ...commonParams } - // 索引列、选择列如果不配置对齐方式则默认为居中对齐 - cellAlign = modifyCellAlign({ cellAlign, column }) - - // 合并行或列 - if (!doSpan({ attrs, params, rowSpan, spanMethod })) { - return - } - // 如果显示状态 - isDirty = isCellDirty({ $table, column, editConfig, fixedHiddenColumn, isDirty, row }) - args = { attrs, cellAlign, cellClassName, className, column, columnActived, columnIndex, columnKey, editor } - Object.assign(args, { fixedHiddenColumn, hasEllipsis, isDirty, params, tdOns, validError, validated }) - - let colProps = buildColumnProps(args) - args = { allColumnOverflow, column, fixedHiddenColumn, h, hasDefaultTip, params, row } - Object.assign(args, { showEllipsis, showTip, showTitle, showTooltip, validError, validStore }) - let colChildren = buildColumnChildren(args) - - return h('td', colProps, colChildren) -} - -function renderRowGroupTds(args) { - let { closeable, currentIcon, field, group, render } = args - let { row, tableColumn, targetColumn, tds, title } = args - for (let index in tableColumn) { - if (Object.prototype.hasOwnProperty.call(tableColumn, index)) { - const column = tableColumn[index] - if (~['index', 'selection'].indexOf(column.type)) { - tds.push() - } else { - const value = row[field] - const header = title || (targetColumn && formatText(getFuncText(targetColumn.title), 1)) || value - let groupTitleVNode - - if (render) { - groupTitleVNode = render(h, { - value, - header, - children: group.children, - expand: !group.fold - }) - } else { - groupTitleVNode = [{header}, `:${value}`, {group.children.length}] - } - tds.push( - -
{[closeable ? currentIcon : null].concat(groupTitleVNode)}
- - ) - break - } - } - } -} - -function addRowListenerMouseenter({ $table, highlightHoverRow, row, rowIndex, trOn }) { - if (!highlightHoverRow) { - return - } - - trOn.mouseenter = (event) => { - if (isOperateMouse($table)) { - return - } - $table.triggerHoverEvent(event, { row, rowIndex }) - } -} - -function renderRowGroupData({ groupData, groupFolds, row, rowGroup, rowid, rows, tableColumn }) { - if (!groupData[rowid]) { - return - } - - const { title, field, closeable = true, render, className } = rowGroup - const { group = groupData[rowid], tds = [], ChevronRight = iconChevronRight(), ChevronDown = iconChevronDown() } = {} - const targetColumn = find(tableColumn, (col) => col.property === field) - const currentIcon = group.fold ? : - - renderRowGroupTds({ closeable, currentIcon, field, group, render, row, tableColumn, targetColumn, tds, title }) - - rows.push( - { - group.hover = false - }} - onMouseover={() => { - group.hover = true - }} - onClick={() => { - if (closeable) { - group.fold = !group.fold - group.children.forEach((row) => { - let index = groupFolds.indexOf(row) - - if (index > -1) { - groupFolds.splice(index, 1) - } else { - groupFolds.push(row) - } - }) - } - }} - > - {tds} - - ) -} - -function renderRow(args) { - let { $rowIndex, $seq, $table, _vm, editStore } = args - let { fixedType, groupFolds, h, row, rowActived } = args - let { rowClassName, rowIndex, rowKey, rowLevel, rowid, rows } = args - let { selection, seq, tableColumn, trOn, treeConfig } = args - let { scrollYLoad } = $table - let treeShowKey = getTreeShowKey({ scrollYLoad, treeConfig }) - - if (treeShowKey && !row[treeShowKey]) { - return - } - - rows.push( - h( - 'tr', - { - class: [ - 'tiny-grid-body__row', - { - [`row__level-${rowLevel}`]: treeConfig, - [classMap.rowNew]: editStore.insertList.indexOf(row) > -1, - [classMap.rowSelected]: selection.indexOf(row) > -1, - 'tiny-hide': groupFolds.indexOf(row) > -1, - [classMap.rowActived]: rowActived - }, - rowClassName ? (isFunction(rowClassName) ? rowClassName({ $table, $seq, seq, fixedType, rowLevel, row, rowIndex, $rowIndex }) : rowClassName) : '' - ], - attrs: { - 'data-rowid': rowid - }, - key: rowKey || treeConfig ? rowid : $rowIndex, - on: trOn - }, - tableColumn.map((column, $columnIndex) => { - let columnIndex = $table.getColumnIndex(column) - let args1 = { $columnIndex, $rowIndex, $seq, $table, _vm, column, columnIndex } - - Object.assign(args1, { fixedType, h, row, rowIndex, rowLevel, seq }) - - return renderColumn(args1) - }) - ) - ) -} - -function renderRowAfter({ $table, h, row, rowIndex, rows, tableData }) { - typeof $table.renderRowAfter === 'function' && $table.renderRowAfter({ rows, row, data: tableData, rowIndex, renderColumn }, h) -} - -function renderRowExpanded(args) { - let { $table, expandMethod, expandeds, fixedType, h, row, rowIndex } = args - let { rowLevel, rowid, rows, seq, tableColumn, trOn, treeConfig } = args - - if (expandeds.length && expandeds.indexOf(row) > -1 && (typeof expandMethod === 'function' ? expandMethod(row) : true)) { - let column = find(tableColumn, (column) => column.type === 'expand') - let columnIndex = $table.getColumnIndex(column) - let cellStyle - - if (treeConfig) { - cellStyle = { paddingLeft: `${rowLevel * (treeConfig.indent || 16) + 30}px` } - } - - if (column) { - const renderData = { $table, seq, row, rowIndex, column, columnIndex, fixed: fixedType, level: rowLevel } - rows.push( - h( - 'tr', - { - class: 'tiny-grid-body__expanded-row', - key: `expand_${rowid}`, - on: trOn - }, - [ - h( - 'td', - { - class: 'tiny-grid-body__expanded-column', - attrs: { colspan: tableColumn.length } - }, - [ - h( - 'div', - { - class: ['tiny-grid-body__expanded-cell', { [classMap.fixedHidden]: fixedType }], - style: cellStyle - }, - [column.renderData(h, renderData)] - ) - ] - ) - ] - ) - ) - } - } -} - -function renderRowTree(args, renderRows) { - let { $seq, $table, _vm, fixedType, h, row, rowLevel } = args - let { rows, seq, seqCount, tableColumn, treeConfig, treeExpandeds } = args - let { scrollYLoad } = $table - - if (!treeConfig || !treeExpandeds.length) { - return - } - - let childrenKey = getTreeChildrenKey({ scrollYLoad, treeConfig }) - let rowChildren = row[childrenKey] - - if (!rowChildren || !rowChildren.length || !~treeExpandeds.indexOf(row)) { - return - } - - let args1 = { h, _vm, $table, $seq: $seq ? `${$seq}.${seq}` : `${seq}` } - - Object.assign(args1, { - rowLevel: rowLevel + 1, - fixedType, - tableData: rowChildren, - tableColumn, - seqCount - }) - - rows.push.apply(rows, renderRows(args1)) -} - -function renderRows({ h, _vm, $table, $seq, rowLevel, fixedType, tableData, tableColumn, seqCount }) { - let { rowKey, highlightHoverRow, rowClassName, treeConfig, treeExpandeds, groupFolds } = $table - let { groupData, scrollYLoad, scrollYStore, editConfig, editStore } = $table - let { expandConfig = {}, expandeds, selection, rowGroup } = $table - let rows = [] - let expandMethod = expandConfig.activeMethod - let startIndex = scrollYStore.startIndex - let isOrdered = treeConfig ? !!treeConfig.ordered : false - - seqCount = seqCount || { value: 0 } - - tableData.forEach((row, $rowIndex) => { - let trOn = {} - let rowIndex = $rowIndex - let { actived } = editStore - let rowActived = editConfig && actived.row === row - - seqCount.value = seqCount.value + 1 - let seq = isOrdered ? seqCount.value : rowIndex + 1 - if (scrollYLoad) { - seq += startIndex - } - // 确保任何情况下 rowIndex 都精准指向真实 data 索引 - rowIndex = $table.getRowIndex(row) - - // 事件绑定 - addRowListenerMouseenter({ $table, highlightHoverRow, row, rowIndex, trOn }) - let rowid = getRowid($table, row) - renderRowGroupData({ groupData, groupFolds, row, rowGroup, rowid, rows, tableColumn }) - let args = { $rowIndex, $seq, $table, _vm, editStore, fixedType, groupFolds, h, row, rowActived } - Object.assign(args, { rowClassName, rowIndex, rowKey, rowLevel, rowid, rows, selection, seq }) - Object.assign(args, { tableColumn, trOn, treeConfig }) - - renderRow(args) - renderRowAfter({ $table, h, row, rowIndex, rows, tableData }) - args = { $table, expandMethod, expandeds, fixedType, h, row, rowIndex, rowLevel } - Object.assign(args, { rowid, rows, seq, tableColumn, trOn, treeConfig }) - // 如果行被展开了 - renderRowExpanded(args) - args = { $seq, $table, _vm, fixedType, h, row, rowLevel, rows } - Object.assign(args, { seq, seqCount, tableColumn, treeConfig, treeExpandeds }) - // 如果是树形表格 - renderRowTree(args, renderRows) - }) - - return rows -} - -/** - * 同步滚动条 - * scroll 方式:可以使固定列与内容保持一致的滚动效果,处理相对麻烦 - * mousewheel 方式:对于同步滚动效果就略差了,左右滚动,内容跟随即可 - */ -let handlerScrollTimeout - -function syncBodyScroll(scrollTop, elemDist1, elemDist2) { - if (elemDist1) { - elemDist1.onscroll = null - elemDist1.scrollTop = scrollTop - } - - if (elemDist2) { - elemDist2.onscroll = null - elemDist2.scrollTop = scrollTop - } - - clearTimeout(handlerScrollTimeout) - - handlerScrollTimeout = setTimeout(() => { - elemDist1 && (elemDist1.onscroll = elemDist1._onscroll) - elemDist2 && (elemDist2.onscroll = elemDist2._onscroll) - elemDist1 && (elemDist1.scrollTop = scrollTop) - elemDist2 && (elemDist2.scrollTop = scrollTop) - }, 100) -} - -function renderDefEmpty(h) { - return [ - h('p', { - class: 'tiny-grid__empty-img' - }), - h( - 'span', - { - class: 'tiny-grid__empty-text' - }, - GlobalConfig.i18n('ui.grid.emptyText') - ) - ] -} - -function syncScrollTop(args) { - let { $table, bodyElem, fixedType, footerElem, headerElem } = args - let { isX, isY, leftElem, rightElem, scrollTop } = args - let ruleChains = [ - { - match: () => leftElem && fixedType === 'left', - action: () => { - scrollTop = leftElem.scrollTop - syncBodyScroll(scrollTop, bodyElem, rightElem) - } - }, - { - match: () => rightElem && fixedType === 'right', - action: () => { - scrollTop = rightElem.scrollTop - syncBodyScroll(scrollTop, bodyElem, leftElem) - } - }, - { - match: () => true, - action: () => { - if (isX && headerElem) { - headerElem.scrollLeft = bodyElem.scrollLeft - } - if (isX && footerElem) { - footerElem.scrollLeft = bodyElem.scrollLeft - } - - let fixedElem = leftElem || rightElem - - if (fixedElem) { - $table.checkScrolling() - } - - if (fixedElem && isY) { - syncBodyScroll(scrollTop, leftElem, rightElem) - } - } - } - ] - - for (let i = 0; i < ruleChains.length; i++) { - if (ruleChains[i].match()) { - ruleChains[i].action() - break - } - } - - return scrollTop -} - -function doScrollLoad({ $table, _vm, bodyElem, event, headerElem, isX, isY, scrollLeft, scrollXLoad, scrollYLoad }) { - let isScrollX = scrollXLoad && isX - - if (isScrollX) { - $table.triggerScrollXEvent(event) - } - - if (isScrollX && headerElem && scrollLeft + bodyElem.clientWidth >= bodyElem.scrollWidth) { - // 修复拖动滚动条时可能存在不同步问题 - _vm.$nextTick(() => { - if (bodyElem.scrollLeft !== headerElem.scrollLeft) { - headerElem.scrollLeft = bodyElem.scrollLeft - } - }) - } - - if (scrollYLoad && isY) { - $table.triggerScrollYEvent(event) - } -} - -function renderEmptyBlock({ $slots, $table, _vm, fixedType, isCenterCls, renderEmpty, tableData }) { - let res = null - - if (!fixedType) { - res = h( - 'div', - { - class: `tiny-grid__empty-block${tableData.length ? '' : ' is__visible'} ${isCenterCls}`, - ref: 'emptyBlock' - }, - $slots.empty ? $slots.empty.call(_vm, { $table }, h) : renderEmpty ? [renderEmpty(h, $table)] : renderDefEmpty(h) - ) - } - - return res -} - -function renderBorders({ fixedType, keyboardConfig, mouseConfig }) { - let res = null - - if (!fixedType && (mouseConfig.checked || keyboardConfig.isCut)) { - res = h('div', { class: 'tiny-grid__borders' }, [ - mouseConfig.checked ? renderBorder(h, 'check') : null, - keyboardConfig.isCut ? renderBorder(h, 'copy') : null - ]) - } - - return res -} - -function renderTable({ $table, _vm, clearHoverRow, fixedType, tableColumn, tableData, tableLayout }) { - return h( - 'table', - { - class: 'tiny-grid__body', - style: { tableLayout }, - attrs: { cellspacing: 0, cellpadding: 0, border: 0 }, - ref: 'table' - }, - [ - // 列宽 - h( - 'colgroup', - { ref: 'colgroup' }, - tableColumn.map((column, columnIndex) => h('col', { attrs: { name: column.id }, key: columnIndex })) - ), - // 内容 - h('tbody', { ref: 'tbody', on: { mouseleave: clearHoverRow } }, renderRows({ h, _vm, $table, $seq: '', rowLevel: 0, fixedType, tableData, tableColumn })) - ] - ) -} - -function renderYSpace({ scrollLoad }) { - return h('div', { class: 'tiny-grid-body__y-space visual', ref: 'ySpace' }, [scrollLoad ? h('div', { class: 'tiny-grid-body__y-scrollbar' }) : [null]]) -} - -function renderXSpace({ fixedType }) { - return fixedType ? [null] : h('div', { class: 'tiny-grid-body__x-space', ref: 'xSpace' }) -} - -export default { - name: `${$prefix}GridBody`, - props: { - collectColumn: Array, - fixedColumn: Array, - fixedType: String, - isGroup: Boolean, - size: String, - tableColumn: Array, - tableData: Array, - visibleColumn: Array - }, - mounted() { - let { $el, $parent: $table, $refs, fixedType } = this - let { elemStore } = $table - let keyPrefix = `${fixedType || 'main'}-body-` - - elemStore[`${keyPrefix}wrapper`] = $el - elemStore[`${keyPrefix}table`] = $refs.table - elemStore[`${keyPrefix}colgroup`] = $refs.colgroup - elemStore[`${keyPrefix}list`] = $refs.tbody - elemStore[`${keyPrefix}xSpace`] = $refs.xSpace - elemStore[`${keyPrefix}ySpace`] = $refs.ySpace - elemStore[`${keyPrefix}emptyBlock`] = $refs.emptyBlock - - this.$el.onscroll = this.scrollEvent - this.$el._onscroll = this.scrollEvent - }, - setup(props, { slots }) { - hooks.onBeforeUnmount(() => { - const table = hooks.getCurrentInstance().proxy - - table.$el._onscroll = null - table.$el.onscroll = null - }) - - return { slots } - }, - render() { - let { $parent: $table, fixedColumn, fixedType } = this - let { $grid, clearHoverRow, isCenterEmpty, keyboardConfig = {}, mouseConfig = {}, renderEmpty } = $table - let { scrollLoad, scrollXLoad, showOverflow: allColumnOverflow, tableColumn, tableData, tableLayout } = $table - let $slots = $grid.slots - let isCenterCls = isCenterEmpty ? 'is__center' : '' - // 如果是固定列与设置了超出隐藏 - if (fixedType && (allColumnOverflow || scrollXLoad)) { - tableColumn = fixedColumn - } - return h( - 'div', - { - ref: 'body', - class: ['tiny-grid__body-wrapper', fixedType ? `fixed-${fixedType}__wrapper` : 'body__wrapper', { [classMap.isScrollload]: scrollLoad }] - }, - [ - renderXSpace({ fixedType }), - renderYSpace({ scrollLoad }), - renderTable({ $table, _vm: this, clearHoverRow, fixedType, tableColumn, tableData, tableLayout }), - // 选中边框线 - renderBorders({ fixedType, keyboardConfig, mouseConfig }), - // 空数据 - renderEmptyBlock({ $slots, $table, _vm: this, fixedType, isCenterCls, renderEmpty, tableData }) - ] - ) - }, - methods: { - // 滚动处理,如果存在列固定右侧,同步更新滚动状态 - scrollEvent(event) { - let { $parent: $table, fixedType } = this - let { $refs, highlightHoverRow, lastScrollLeft, lastScrollTop, scrollXLoad, scrollYLoad } = $table - let { leftBody, rightBody, tableBody, tableFooter, tableHeader } = $refs - let headerElem = tableHeader ? tableHeader.$el : null - let bodyElem = tableBody.$el - let footerElem = tableFooter ? tableFooter.$el : null - let scrollLeft = bodyElem.scrollLeft - let leftElem = leftBody ? leftBody.$el : null - let rightElem = rightBody ? rightBody.$el : null - let scrollTop = bodyElem.scrollTop - let isY = scrollTop !== lastScrollTop - let isX = scrollLeft !== lastScrollLeft - - $table.lastScrollTime = Date.now() - $table.lastScrollLeft = scrollLeft - $table.lastScrollTop = scrollTop - $table.scrollDirection = isX ? 'X' : 'Y' - - if (highlightHoverRow) { - $table.clearHoverRow() - } - - let args = { $table, bodyElem, fixedType, footerElem, headerElem } - Object.assign(args, { isX, isY, leftElem, rightElem, scrollTop }) - scrollTop = syncScrollTop(args) - doScrollLoad({ $table, _vm: this, bodyElem, event, headerElem, isX, isY, scrollLeft, scrollXLoad, scrollYLoad }) - emitEvent($table, 'scroll', [{ type: 'body', fixed: fixedType, scrollTop, scrollLeft, isX, isY, $table }, event]) - } - } -} diff --git a/packages/grid/src/button/src/button.js b/packages/grid/src/button/src/button.js deleted file mode 100644 index ec0ca073b..000000000 --- a/packages/grid/src/button/src/button.js +++ /dev/null @@ -1,195 +0,0 @@ -/** - * MIT License - * - * Copyright (c) 2019 Xu Liangzhan - * - * Permission is hereby granted, free of charge, to any person obtaining a copy - * of this software and associated documentation files (the "Software"), to deal - * in the Software without restriction, including without limitation the rights - * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell - * copies of the Software, and to permit persons to whom the Software is - * furnished to do so, subject to the following conditions: - * - * The above copyright notice and this permission notice shall be included in all - * copies or substantial portions of the Software. - * - * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR - * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, - * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE - * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER - * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, - * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE - * SOFTWARE. - * - */ -import { objectMap } from '@opentiny/vue-renderless/grid/static/' -import { addClass, removeClass } from '@opentiny/vue-renderless/common/deps/dom' -import { emitEvent, getEventTargetNode, getListeners } from '@opentiny/vue-renderless/grid/utils' -import GlobalConfig from '../../config' -import { h, $prefix } from '@opentiny/vue-common' - -function renderNoSlotDropdowns({ $slots, _vm, buttonBase, loading, tableListeners }) { - let loadingVNode = [] - - if (loading) { - loadingVNode = [ - h('i', { - class: ['tiny-grid-button__loading-icon', GlobalConfig.icon.btnLoading] - }) - ] - } - - return h( - 'button', - { - ...buttonBase, - on: objectMap(tableListeners, (cb, type) => (event) => _vm.$emit(type, event)) - }, - loadingVNode.concat($slots.default.call(_vm)) - ) -} - -function renderHasSlotDropdowns({ $slots, _vm, buttonBase, tableListeners, vSize }) { - return h( - 'div', - { - class: ['tiny-grid-button__dropdown', { [`size__${vSize}`]: vSize }] - }, - [ - h( - 'button', - { - ...buttonBase, - on: { - mouseenter: _vm.mouseenterEvent, - mouseleave: _vm.mouseleaveEvent, - ...objectMap(tableListeners, (cb, type) => (event) => _vm.$emit(type, event)) - } - }, - [ - h('span', $slots.default.call(_vm)), - h('i', { - class: `tiny-grid-button__dropdown-arrow ${GlobalConfig.icon.dropdownBottom}` - }) - ] - ), - h( - 'div', - { - class: 'tiny-grid-button__dropdown-wrapper', - on: { - click: _vm.clickDropdownEvent, - mouseenter: _vm.mouseenterEvent, - mouseleave: _vm.mouseleaveEvent - } - }, - $slots.dropdowns.call(_vm) - ) - ] - ) -} - -function getButtonBase({ disabled, isText, loading, name, type, vSize }) { - const map = { - isDisabled: 'is__disabled', - isLoading: 'is__loading' - } - return { - class: [ - 'tiny-grid-button', - `type__${isText ? type : 'button'}`, - { - [`size__${vSize}`]: vSize, - [`theme__${type}`]: type && !isText, - [map.isDisabled]: disabled || loading, - [map.isLoading]: loading - } - ], - attrs: { - name, - type: 'button', - disabled: disabled || loading - } - } -} - -export default { - name: `${$prefix}GridButton`, - inheritAttrs: false, - props: { - type: String, - size: String, - name: [String, Number], - disabled: Boolean, - loading: Boolean - }, - computed: { - vSize() { - return this.size || this.$parent.size || this.$parent.vSize - } - }, - render() { - let { disabled, loading, name, slots: $slots, tableListeners, type, vSize } = this - let isText = type === 'text' - let buttonBase = getButtonBase({ - disabled, - isText, - loading, - name, - type, - vSize - }) - - return $slots.dropdowns - ? renderHasSlotDropdowns({ - $slots, - _vm: this, - buttonBase, - tableListeners, - vSize - }) - : renderNoSlotDropdowns({ - $slots, - _vm: this, - buttonBase, - loading, - tableListeners - }) - }, - methods: { - clickDropdownEvent(event) { - let dropdownElem = event.currentTarget - let wrapperElem = dropdownElem.parentNode - let { flag, targetElem } = getEventTargetNode(event, dropdownElem, 'tiny-grid-button') - - if (flag) { - wrapperElem.dataset.active = 'N' - removeClass(wrapperElem, 'is__active') - emitEvent(this, 'dropdown-click', [{ name: targetElem.getAttribute('name') }, event]) - } - }, - mouseenterEvent(event) { - let dropdownElem = event.currentTarget - let wrapperElem = dropdownElem.parentNode - - wrapperElem.dataset.active = 'Y' - addClass(wrapperElem, 'is__active') - }, - mouseleaveEvent(event) { - let dropdownElem = event.currentTarget - let wrapperElem = dropdownElem.parentNode - - wrapperElem.dataset.active = 'N' - setTimeout(() => { - if (wrapperElem.dataset.active !== 'Y') { - removeClass(wrapperElem, 'is__active') - } - }, 300) - } - }, - setup(props, { slots, attrs, listeners }) { - const tableListeners = getListeners(attrs, listeners) - - return { slots, tableListeners } - } -} diff --git a/packages/grid/src/cell/src/cell.js b/packages/grid/src/cell/src/cell.js deleted file mode 100644 index 19a33326d..000000000 --- a/packages/grid/src/cell/src/cell.js +++ /dev/null @@ -1,835 +0,0 @@ -/** - * MIT License - * - * Copyright (c) 2019 Xu Liangzhan - * - * Permission is hereby granted, free of charge, to any person obtaining a copy - * of this software and associated documentation files (the "Software"), to deal - * in the Software without restriction, including without limitation the rights - * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell - * copies of the Software, and to permit persons to whom the Software is - * furnished to do so, subject to the following conditions: - * - * The above copyright notice and this permission notice shall be included in all - * copies or substantial portions of the Software. - * - * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR - * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, - * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE - * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER - * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, - * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE - * SOFTWARE. - * - */ -import { get } from '@opentiny/vue-renderless/grid/static/' -import { random } from '@opentiny/vue-renderless/common/string' -import { getColumnConfig, getFuncText, formatText } from '@opentiny/vue-renderless/grid/utils' -import { Renderer } from '../../adapter' -import { getCellLabel } from '../../tools' -import GLOBAL_CONFIG from '../../config' -import { hooks } from '@opentiny/vue-common' -import { iconCheckedSur, iconHalfselect } from '@opentiny/vue-icon' -import { getTableCellKey } from '../../table/src/strategy' - -const insertedField = GLOBAL_CONFIG.constant.insertedField - -const classMap = { - isDisabled: 'is__disabled', - isIndeterminate: 'is__indeterminate' -} - -const getCellRender = (isTreeNode, treeCellRender, treeRender, context) => context[isTreeNode ? treeCellRender : treeRender] - -function processRenderer({ h, params, renderer, value }) { - let result = { flag: false, vnodes: null } - - if (renderer) { - if (typeof renderer === 'function') { - result.flag = true - result.vnodes = [renderer(h, params)] - } - - if (renderer.component) { - const { component, attrs } = renderer - - result.flag = true - result.vnodes = [ - h(hooks.toRaw(component), { - key: getTableCellKey(params), - class: 'grid-cell', - attrs: { - value, - modelValue: value, - ...(typeof attrs === 'function' ? attrs(params) : attrs) - } - }) - ] - } - } - - return result -} - -function processAsyncColumn({ $table, column, format, h, params, row }) { - let result = { flag: false, vnodes: null } - - const { fetch, loadingText } = format.async || {} - - if ($table.isAsyncColumn && row[insertedField] !== true && typeof fetch === 'function') { - let cellText = row[$table.getAsyncColumnName(column.property)] - const loadingRender = loadingText || 'loading ...' - - if (typeof cellText === 'undefined') { - cellText = typeof loadingRender === 'function' ? loadingRender(h, params) : loadingRender - } - - if (typeof cellText === 'undefined' || typeof column.formatText === 'undefined') { - result.flag = true - result.vnodes = [cellText] - } - } - - return result -} - -function getColumnRuleTypeIndex({ _vm, isTreeNode, renMaps, type }) { - return { - match: () => type === 'index', - action: () => { - renMaps.renderHeader = _vm.renderIndexHeader - renMaps.renderCell = getCellRender(isTreeNode, 'renderTreeIndexCell', 'renderIndexCell', _vm) - } - } -} - -function getColumnRuleTypeRadio({ _vm, isTreeNode, renMaps, type }) { - return { - match: () => type === 'radio', - action: () => { - renMaps.renderHeader = _vm.renderRadioHeader - renMaps.renderCell = getCellRender(isTreeNode, 'renderTreeRadioCell', 'renderRadioCell', _vm) - } - } -} - -function getColumnRuleTypeSelection({ _vm, isTreeNode, renMaps, selectConfig, type }) { - return { - match: () => type === 'selection', - action: () => { - renMaps.renderHeader = _vm.renderSelectionHeader - renMaps.renderCell = getCellRender(isTreeNode, 'renderTreeSelectionCell', 'renderSelectionCell', _vm) - - if (selectConfig && selectConfig.checkField) { - renMaps.renderCell = getCellRender(isTreeNode, 'renderTreeSelectionCellByProp', 'renderSelectionCellByProp', _vm) - } - } - } -} - -function getColumnRuleTypeExpand({ _vm, renMaps, type }) { - return { - match: () => type === 'expand', - action: () => { - renMaps.renderCell = _vm.renderExpandCell - renMaps.renderData = _vm.renderExpandData - } - } -} - -function getColumnRuleTypeOther({ $table, _vm, colProps, editor, filter, isTreeNode, renMaps, type }) { - return { - match: () => !~['index', 'radio', 'selection', 'expand'].indexOf(type), - action: () => { - let { sortable, remoteSort } = colProps - const isSortable = $table.sortable && (type ? false : sortable) - const isSortColumn = isSortable || remoteSort - - if (editor) { - renMaps.renderHeader = _vm.renderEditHeader - renMaps.renderCell = getCellRender(isTreeNode, 'renderTreeRadioCell', 'renderRowEdit', _vm) - - if ($table.editConfig && $table.editConfig.mode === 'cell') { - renMaps.renderCell = getCellRender(isTreeNode, 'renderTreeCellEdit', 'renderCellEdit', _vm) - } - } else if (filter) { - renMaps.renderHeader = _vm.renderFilterHeader - - if (isSortColumn) { - renMaps.renderHeader = _vm.renderSortAndFilterHeader - } - } else if (isSortColumn) { - renMaps.renderHeader = _vm.renderSortHeader - } - } - } -} - -const isCheckStrictly = (selectConfig) => - (selectConfig && selectConfig.checkStrictly && !selectConfig.showHeader) || (selectConfig && !selectConfig.checkStrictly && selectConfig.showHeader === false) - -const getSelectVnodes = ({ h, vSize, headerCheckDisabled, isIndeterminate, options, isAllSelected, headerTitle }) => - h( - 'label', - { - class: [ - 'tiny-grid-checkbox tiny-select-header', - { - [`size__${vSize}`]: vSize, - [classMap.isDisabled]: headerCheckDisabled, - [classMap.isIndeterminate]: isIndeterminate - } - ], - key: random() - }, - [ - h('input', options), - h('span', { class: 'tiny-grid-checkbox__icon' }, [ - isAllSelected - ? h(iconCheckedSur(), { - class: ['tiny-svg-size', 'icon-checked-sur'] - }) - : '', - isIndeterminate - ? h(iconHalfselect(), { - class: ['tiny-svg-size', 'icon-half-select'] - }) - : '' - ]), - headerTitle ? h('span', { class: 'tiny-grid-checkbox__label' }, getFuncText(headerTitle)) : null - ] - ) - -const getSelectCellVnodes = ({ indeterminate, h, isDisabled, vSize, labelField, options, row }) => - h( - 'label', - { - class: [ - 'tiny-grid-checkbox tiny-select-cell', - { - [`size__${vSize}`]: vSize, - [classMap.isIndeterminate]: indeterminate, - [classMap.isDisabled]: isDisabled - } - ], - key: random() - }, - [ - h('input', options), - h('span', { class: 'tiny-grid-checkbox__icon' }, [ - h(iconCheckedSur(), { class: ['tiny-svg-size', 'icon-checked-sur'] }), - indeterminate - ? h(iconHalfselect(), { - class: ['tiny-svg-size', 'icon-half-select'] - }) - : '' - ]), - labelField ? h('span', { class: 'tiny-grid-checkbox__label' }, get(row, labelField)) : null - ] - ) - -const getSelectCellByProsVnodes = ({ h, vSize, indeterminate, isDisabled, options, labelField, row }) => - h( - 'label', - { - key: random(), - class: [ - 'tiny-grid-checkbox', - { - [`size__${vSize}`]: vSize, - [classMap.isIndeterminate]: indeterminate, - [classMap.isDisabled]: isDisabled - } - ] - }, - [ - h('input', options), - h('span', { class: 'tiny-grid-checkbox__icon' }, [ - !indeterminate - ? '' - : h(iconHalfselect(), { - class: ['tiny-svg-size', 'icon-half-select'] - }), - h(iconCheckedSur(), { class: ['tiny-svg-size', 'icon-checked-sur'] }) - ]), - !labelField ? null : h('span', { class: 'tiny-grid-checkbox__label' }, get(row, labelField)) - ] - ) - -export const Cell = { - createColumn($table, colProps) { - let { type, filter, editor, treeNode } = colProps - let { selectConfig, treeConfig } = $table - let isTreeNode = treeConfig && treeNode - let renMaps = { - renderHeader: this.renderHeader, - renderCell: getCellRender(isTreeNode, 'renderTreeCell', 'renderCell', this) - } - let _vm = this - - let ruleChains = [ - getColumnRuleTypeIndex({ _vm, isTreeNode, renMaps, type }), - getColumnRuleTypeRadio({ _vm, isTreeNode, renMaps, type }), - getColumnRuleTypeSelection({ - _vm, - isTreeNode, - renMaps, - selectConfig, - type - }), - getColumnRuleTypeExpand({ _vm, renMaps, type }), - getColumnRuleTypeOther({ - $table, - _vm, - colProps, - editor, - filter, - isTreeNode, - renMaps, - type - }) - ] - - for (let j = 0; j < ruleChains.length; j++) { - if (ruleChains[j].match()) { - ruleChains[j].action() - break - } - } - - return getColumnConfig(colProps, renMaps, GLOBAL_CONFIG) - }, - // 单元格 - renderHeader(h, params) { - let { column } = params - let { slots, own, title } = column - - if (slots && slots.header) { - return slots.header(params, h) - } - - if (typeof title === 'function') { - return [title(h, params)] - } - - // 在 v3.0 中废弃 label - return [formatText(getFuncText(own.title || own.label), 1)] - }, - renderCell(h, params) { - let { $table, row, column } = params - let { slots, renderer } = column - const format = column.format || {} - - if (slots && slots.default) { - return slots.default(params, h) - } - - const value = get(row, column.property) - - let result = processRenderer({ h, params, renderer, value }) - - if (result.flag) { - return result.vnodes - } - - result = processAsyncColumn({ $table, column, format, h, params, row }) - - if (result.flag) { - return result.vnodes - } - - const cellValue = getCellLabel(row, column, params) - - if (typeof cellValue === 'function') { - return [cellValue(h, params)] - } - - return [formatText(cellValue, 1)] - }, - renderTreeCell(h, params) { - return Cell.renderTreeIcon(h, params).concat(Cell.renderCell.call(this, h, params)) - }, - // 树节点 - renderTreeIcon(h, params) { - let { $table, level, row } = params - let { treeConfig, treeExpandeds } = $table - let { children, indent, renderIcon, trigger } = treeConfig - let isActive = ~treeExpandeds.indexOf(row) - let rowChildren = row[children] - let listeners = { - click: (event) => $table.triggerTreeExpandEvent(event, params) - } - let icon = GLOBAL_CONFIG.icon - - if (trigger && trigger !== 'default') { - listeners = {} - } - - let iconVNode = [] - - if (rowChildren && rowChildren.length) { - iconVNode = [renderIcon ? renderIcon(h, { active: isActive, ...params }) : h('i', { class: `tiny-grid-tree__node-btn ${icon.tree}` })] - } - const map = { - isActive: 'is__active' - } - return [ - h('span', { - class: 'tiny-grid-tree__indent', - style: { - width: `${level * (indent || 16)}px` - } - }), - h( - 'span', - { - class: ['tiny-grid-tree-wrapper', { [map.isActive]: isActive }], - on: listeners - }, - iconVNode - ) - ] - }, - // 索引 - renderIndexHeader(h, params) { - let column = params.column - let slots = column.slots - let own = column.own - - if (slots && slots.header) { - return slots.header(params, h) - } - - let value = getFuncText(own.title || own.label || '') - - return [formatText(value, 1)] - }, - renderTreeIndexCell(h, params) { - return Cell.renderTreeIcon(h, params).concat(Cell.renderIndexCell(h, params)) - }, - renderIndexCell(h, params) { - let { $seq, level, seq } = params - let { startIndex, treeConfig = {} } = params.$table - let { indexMethod, slots } = params.column - let isOrdered = !!treeConfig.ordered - let indexValue = level && !isOrdered ? `${$seq}.${seq}` : startIndex + seq - - if (slots && slots.default) { - return slots.default(params, h) - } - - return [formatText(indexMethod ? indexMethod(params) : indexValue, 1)] - }, - // 单选 - renderRadioHeader(h, params) { - let { own, slots } = params.column - - if (slots && slots.header) { - return slots.header(params, h) - } - - let value = getFuncText(own.title || own.label) - - return [formatText(value, 1)] - }, - renderRadioCell(h, params) { - let { - $table, - column: { slots }, - isHidden, - row - } = params - let { radioConfig = {}, selectRow, vSize } = $table - let { labelField, checkMethod } = radioConfig - let disabled = !!checkMethod - let options = {} - if (slots && slots.default) { - return slots.default(params, h) - } - options.attrs = { - name: `tiny-grid-radio__${$table.id}`, - type: 'radio' - } - if (!isHidden && checkMethod) { - options.attrs.disabled = disabled = !checkMethod(params) - } - if (!isHidden) { - options.domProps = { checked: row === selectRow } - options.on = { - change(event) { - $table.triggerRadioRowEvent(event, params) - } - } - } - const map = { - isDisabled: 'is__disabled' - } - return [ - h( - 'label', - { - class: ['tiny-grid-radio', { [`size__${vSize}`]: vSize, [map.isDisabled]: disabled }] - }, - [ - h('input', options), - h('span', { class: 'tiny-grid-radio__icon' }), - labelField ? h('span', { class: 'tiny-grid-radio__label' }, get(row, labelField)) : null - ] - ) - ] - }, - renderTreeRadioCell(h, params) { - return Cell.renderTreeIcon(h, params).concat(Cell.renderRadioCell(h, params)) - }, - renderSelectionHeader(h, params) { - let { $table, column, isHidden } = params - let { slots, own } = column - let { headerCheckDisabled, isAllSelected, isIndeterminate, selectConfig, vSize } = $table - let headerTitle = own.title || own.label - let options = { attrs: { type: 'checkbox' } } - if (slots && slots.header) { - return slots.header(params, h) - } - if (isCheckStrictly(selectConfig)) { - return [] - } - if (!isHidden) { - options.domProps = { - disabled: headerCheckDisabled, - checked: isAllSelected && !headerCheckDisabled - } - options.on = { - change(event) { - $table.triggerCheckAllEvent(event, event.target.checked) - $table.showSelectToolbar() - } - } - } - let vnode = getSelectVnodes({ - h, - vSize, - headerCheckDisabled, - isIndeterminate, - options, - isAllSelected, - headerTitle - }) - return [vnode] - }, - renderSelectionCell(h, params) { - let { $table, column, isHidden, row } = params - let { slots } = column - let { selectConfig = {}, treeConfig, treeIndeterminates, vSize } = $table - let { labelField, checkMethod } = selectConfig - let { indeterminate = false, isDisabled = !!checkMethod } = {} - let options = { attrs: { type: 'checkbox' } } - if (slots && slots.default) { - return slots.default(params, h) - } - if (!isHidden) { - checkMethod && (options.attrs.disabled = isDisabled = !checkMethod(params)) - treeConfig && (indeterminate = ~treeIndeterminates.indexOf(row)) - options.domProps = { checked: ~$table.selection.indexOf(row) } - options.on = { - change(event) { - $table.triggerCheckRowEvent(event, params, event.target.checked) - $table.showSelectToolbar() - } - } - } - let vnode = getSelectCellVnodes({ - h, - vSize, - indeterminate, - isDisabled, - options, - labelField, - row - }) - return [vnode] - }, - renderTreeSelectionCell(h, params) { - return Cell.renderTreeIcon(h, params).concat(Cell.renderSelectionCell(h, params)) - }, - renderSelectionCellByProp(h, params) { - let { $table, column, isHidden, row } = params - let { slots } = column - let { selectConfig = {}, treeConfig, treeIndeterminates, vSize } = $table - let { checkField: property, checkMethod, labelField } = selectConfig - let { indeterminate = false, isDisabled = !!checkMethod } = {} - let options = { attrs: { type: 'checkbox' } } - - if (slots && slots.default) { - return slots.default(params, h) - } - - if (!isHidden) { - checkMethod && (options.attrs.disabled = isDisabled = !checkMethod(params)) - treeConfig && (indeterminate = ~treeIndeterminates.indexOf(row)) - options.domProps = { checked: get(row, property) } - options.on = { - change(event) { - $table.triggerCheckRowEvent(event, params, event.target.checked) - } - } - } - - let vnode = getSelectCellByProsVnodes({ h, indeterminate, isDisabled, vSize, labelField, options, row }) - - return [vnode] - }, - renderTreeSelectionCellByProp(h, params) { - return Cell.renderTreeIcon(h, params).concat(Cell.renderSelectionCellByProp(h, params)) - }, - // 展开行 - renderExpandCell(h, params) { - let { $table, isHidden, row } = params - let { expandConfig = {} } = $table - let expandMethod = expandConfig.activeMethod - let hideExpand = typeof expandMethod === 'function' ? expandMethod(row) : true - let expandActive = false - - if (!isHidden) { - expandActive = $table.expandeds.indexOf(params.row) > -1 - } - - const map = { - expandActive: 'expand__active' - } - - return [ - h( - 'span', - { - class: [ - 'tiny-grid__expanded', - { - [map.expandActive]: expandActive - } - ], - on: { - click(event) { - if (!hideExpand) { - return - } - $table.triggerRowExpandEvent(event, params) - } - } - }, - [hideExpand && h('i', { class: 'tiny-grid__expand-icon' })] - ) - ] - }, - renderExpandData(h, params) { - let { slots } = params.column - - if (slots && slots.default) { - return slots.default(params, h) - } - - return [] - }, - // 排序和筛选 - renderSortAndFilterHeader(h, params) { - const suffixCls = Cell.getSuffixCls(params) - - return Cell.renderHeader(h, params).concat(Cell.renderFilterIcon(h, params, suffixCls[0])).concat(Cell.renderSortIcon(h, params, suffixCls[1])) - }, - // 排序 - renderSortHeader(h, params) { - const suffixCls = Cell.getSuffixCls(params) - - return Cell.renderHeader(h, params).concat(Cell.renderSortIcon(h, params, suffixCls[1])) - }, - renderSortIcon(h, params) { - let { icon } = GLOBAL_CONFIG - let { $table, column } = params - let isColGroup = column.children && column.children.length - - // prettier-ignore - return [ - h( - 'span', - { class: 'tiny-grid-sort-wrapper' }, - isColGroup - ? [] - : [ - column.order === 'asc'? - h(icon.sortDesc, { - class: [ - 'tiny-svg-size tiny-grid-sort__asc-btn', - { - 'sort__active': column.order === 'asc' - } - ], - on: { click(event) { $table.triggerSortEvent(event, column, 'desc') } } - }):'', - column.order === 'desc'? - h(icon.sortAsc, { - class: [ - 'tiny-svg-size tiny-grid-sort__desc-btn', - { - 'sort__active': column.order === 'desc' - } - ], - on: { click(event) { $table.triggerSortEvent(event, column, '') } } - }):'', - column.order?'' - : h(icon.sortDefault, { - class: [ - 'tiny-svg-size tiny-grid-sort__desc-btn' - ], - on: { click(event) { $table.triggerSortEvent(event, column, 'asc') } } - }) - ] - ) - ] - }, - // 筛选 - renderFilterHeader(h, params) { - const suffixCls = Cell.getSuffixCls(params) - - return Cell.renderHeader(h, params).concat(Cell.renderFilterIcon(h, params, suffixCls[1])) - }, - renderFilterIcon(h, params, cls = '') { - let { $table, column } = params - let { filterStore } = $table - let icon = GLOBAL_CONFIG.icon - const map = { - isActive: 'is__active', - hasFilter: 'has__Filter' - } - return [ - h( - 'span', - { - class: [ - 'tiny-grid-filter-wrapper ' + cls, - { - [map.isActive]: filterStore.visible && filterStore.column === column - } - ] - }, - [ - h(icon.filter, { - class: [ - 'tiny-svg-size tiny-grid-filter__btn ' + column.id, - { - [map.hasFilter]: column.filter && column.filter.hasFilter - } - ], - on: { - click(event) { - $table.triggerFilterEvent(event, params.column, params) - } - } - }) - ] - ) - ] - }, - // 可编辑 - renderEditHeader(h, params) { - let { $table, column } = params - let { editConfig, editRules } = $table - let { filter, remoteSort, sortable, type } = column - let icon = GLOBAL_CONFIG.icon - let isRequired - - sortable = $table.sortable && !type && sortable - - let suffixCls = Cell.getSuffixCls(params) - let isRenderSortIcon = sortable || remoteSort - let columnRules - - if (editRules) { - columnRules = get(editRules, params.column.property) - } - - if (editRules && columnRules && !Array.isArray(columnRules)) { - columnRules = [columnRules] - } - - if (editRules && columnRules) { - isRequired = columnRules.some((rule) => rule.required) - } - - let vNodes = [ - isRequired ? h('i', { class: `tiny-icon ${icon.required}` }) : null, - editConfig && !editConfig.showIcon && !column.showIcon ? null : h(icon.edit, { class: 'tiny-grid-edit-icon tiny-svg-size' }) - ] - - vNodes = vNodes.concat(Cell.renderHeader(h, params)) - vNodes = vNodes.concat(filter ? Cell.renderFilterIcon(h, params, isRenderSortIcon ? suffixCls[0] : suffixCls[1]) : []) - vNodes = vNodes.concat(isRenderSortIcon ? Cell.renderSortIcon(h, params, suffixCls[1]) : []) - - return vNodes - }, - renderTreeRowEdit(h, params) { - return Cell.renderTreeIcon(h, params).concat(Cell.renderRowEdit(h, params)) - }, - // 行格编辑模式 - renderRowEdit(h, params) { - let { actived } = params.$table.editStore - - return Cell.runRenderer(h, params, this, actived && actived.row === params.row) - }, - renderTreeCellEdit(h, params) { - return Cell.renderTreeIcon(h, params).concat(Cell.renderCellEdit(h, params)) - }, - // 单元格编辑模式 - renderCellEdit(h, params) { - let { actived } = params.$table.editStore - - return Cell.runRenderer(h, params, this, actived && actived.row === params.row && actived.column === params.column) - }, - runRenderer(h, params, _vm, isEdit) { - let { $table, column, row } = params - let { formatText, own, slots } = column - let editor = own.editor - let compConf = Renderer.get(editor.component) - let showEdit = editor.type === 'visible' || isEdit - - if (showEdit && slots && slots.edit) { - return slots.edit(params, h) - } - - if (showEdit && typeof editor === 'function') { - return [editor(h, params)] - } - - if (showEdit && compConf && compConf.renderEdit) { - return compConf.renderEdit.call($table, h, editor, params, { - $type: 'edit', - $excel: $table.$parent, - $table, - $column: column - }) - } - - if (showEdit) { - return [] - } - - if (slots && slots.default) { - return slots.default(params, h) - } - - if (formatText) { - const cellValue = getCellLabel(row, column, params) - - if (typeof cellValue === 'function') { - return [cellValue(h)] - } - - return [cellValue] - } - - return Cell.renderCell.call(_vm, h, params) - }, - getSuffixCls(params) { - return params.$table.headerSuffixIconAbsolute ? ['suffix-icon-1', 'suffix-icon-0'] : ['', ''] - } -} - -export default Cell diff --git a/packages/grid/src/filter/src/panel.jsx b/packages/grid/src/filter/src/panel.jsx deleted file mode 100644 index f7dc6ba64..000000000 --- a/packages/grid/src/filter/src/panel.jsx +++ /dev/null @@ -1,647 +0,0 @@ -/** - * MIT License - * - * Copyright (c) 2019 Xu Liangzhan - * - * Permission is hereby granted, free of charge, to any person obtaining a copy - * of this software and associated documentation files (the "Software"), to deal - * in the Software without restriction, including without limitation the rights - * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell - * copies of the Software, and to permit persons to whom the Software is - * furnished to do so, subject to the following conditions: - * - * The above copyright notice and this permission notice shall be included in all - * copies or substantial portions of the Software. - * - * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR - * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, - * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE - * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER - * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, - * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE - * SOFTWARE. - * - */ - -import Radio from '../../radio' -import Button from '../../button' -import PopperJS from '@opentiny/vue-renderless/common/deps/popper' -import PopupManager from '@opentiny/vue-renderless/common/deps/popup-manager' -import { extend } from '@opentiny/vue-renderless/common/object' -import { t } from '@opentiny/vue-locale' -import { hooks, h, $prefix } from '@opentiny/vue-common' -import { iconCheck, iconCheckedSur, iconDefinedFiltration, iconLeftWard, iconDeltaDown } from '@opentiny/vue-icon' -import debounce from '@opentiny/vue-renderless/common/deps/debounce' - -function renderAdvancePanelAdvList({ _vm }) { - return _vm.showAdvList && _vm.showAdvItems ? ( -
    - {['等于', '不等于', '包含', '不包含', '开头是', '结尾是'].map((item) => ( -
  • {item}
  • - ))} -
- ) : null -} - -function renderAdvancePanelButtons({ _vm }) { - return ( -
  • - - -
  • - ) -} - -function renderAdvancePanelRadios() { - return ( -
      -
    • - - And - - - Or - -
    • -
    - ) -} - -function renderAdvancePanelAdvHeader({ _vm, ArrowLeft }) { - return ( -
    { - _vm.showAdvance = false - _vm.showAdvItems = false - _vm.updatePanel() - }} - > - 自定义筛选方式 -
    - ) -} - -function renderAdvancePanelAdvRow({ _vm, DeltaDown }) { - return ( -
    - - - -
    - ) -} - -function renderInputArgs({ _vm, inputFilter }) { - let isAddbyProgram = false - - if (typeof inputFilter.relations_addby !== 'undefined') { - isAddbyProgram = inputFilter.relations_addby === 'program' - } - - let inputRelations - - if (isAddbyProgram) { - inputRelations = inputFilter.relations_backup - } else { - inputRelations = inputFilter.relations - } - - if (!inputRelations) { - inputRelations = [ - { label: _vm.i18n('ui.grid.filter.prefix'), value: 'startwith' }, - { label: _vm.i18n('ui.grid.filter.equal'), value: 'equals' }, - { label: _vm.i18n('ui.grid.filter.include'), value: 'contains' } - ] - } - - return { isAddbyProgram, inputRelations } -} - -function renderInputProps({ InputComponent, condition, event, inputFilter, isNativeInput, prop }) { - let inputProps = { - style: 'width:100%', - on: { - [event]: (value) => { - condition.input = value && value.target ? value.target.value : value - } - }, - ref: 'filterInputComponent' - } - - if (isNativeInput) { - inputProps = Object.assign(inputProps, { - domProps: { - [prop]: condition.input - }, - attrs: { - ...inputFilter.attrs - } - }) - } else { - InputComponent = hooks.toRaw(InputComponent) - inputProps = Object.assign(inputProps, { - props: { - ...inputFilter.attrs, - [prop]: condition.input - } - }) - } - - return { inputProps, InputComponent } -} - -function renderEnumableEmpty({ _vm }) { - return [
  • {_vm.i18n('ui.grid.emptyText')}
  • ] -} - -function renderEnumableOptions({ iconRender, _vm, filterStore }) { - return filterStore.options.map((item, index) => ( -
  • { - if (!filterStore.multi) { - // 单选 - filterStore.options.forEach((option) => { - option.checked = option === item - }) - _vm.filterEnum() - } else { - // 多选 - item.checked = !item.checked - } - }} - > - {filterStore.multi ? iconRender(item.checked, index) : null} - {item.label} -
  • - )) -} - -export default { - name: $prefix + 'GridFilter', - props: { - filterStore: Object, - optimizeOpts: Object - }, - inject: { - $grid: { - default: null - } - }, - watch: { - id() { - this.updatePanel() - }, - visible() { - this.showAdvance = false - this.updatePanel() - } - }, - data() { - return { - popperJS: null, - showAdvance: false, - showAdvItems: false, - listPopper: null - } - }, - render() { - const { filterStore, $grid, optimizeOpts } = this - let { args, column, options } = filterStore - - const quickFilter = [this.renderInput(), this.renderEnumable(), this.renderDefault(), this.renderExtends(), this.renderBase()] - - const map = { - filterActive: 'filter__active' - } - - return ( -
    - {filterStore.visible ? ( -
    - {column.slots && column.slots.filter - ? column.slots.filter({ - $grid, - values: options, - args, - context: this - }) - : quickFilter} -
    - ) : null} -
    - ) - }, - computed: { - condition() { - return this.filterStore.condition - }, - visible() { - return this.filterStore.visible - }, - id() { - return this.filterStore.id - }, - i18n() { - return t || this.$t - } - }, - methods: { - updatePanel: debounce(20, function () { - this.correctRelations() - - const inputFilter = this.filterStore.inputFilter - - if (inputFilter) { - const { relations } = inputFilter - - if (inputFilter !== true && !relations.filter((r) => r.value === this.condition.relation).length) { - this.resetInput() - } - } - - this.popperJS && this.popperJS.destroy() && (this.popperJS = null) - this.$nextTick(() => { - const { targetElemParentTr, id } = this.filterStore - const reference = targetElemParentTr && targetElemParentTr.querySelector(`svg.tiny-grid-filter__btn.${id}`) - const popper = this.$el - - popper.style.zIndex = PopupManager.nextZIndex() - - this.visible && - (this.popperJS = new PopperJS(reference, popper, { - placement: 'bottom-end' - }).update()) - }) - }), - renderBase() { - return ( - - ) - }, - renderDefault() { - const { condition, filterStore } = this - - if (!filterStore.defaultFilter) { - return null - } - - return ( - - ) - }, - renderExtends() { - const { filterStore } = this - - if (!filterStore.extends) { - return null - } - - return ( -
      - {filterStore.extends.map((item) => ( -
    • { - this.filterExtends(item) - }} - > - {item.label} -
    • - ))} -
    - ) - }, - renderAdvance() { - const DefinedFiltration = iconDefinedFiltration() - const { filterStore } = this - - if (!filterStore.advancedFilter) { - return null - } - - return ( - - ) - }, - renderAdvancePanel() { - const ArrowLeft = iconLeftWard() - const DeltaDown = iconDeltaDown() - - if (!this.showAdvance) { - return null - } - - let _vm = this - - const AdvRow = renderAdvancePanelAdvRow({ _vm, DeltaDown }) - - return ( -
    - {renderAdvancePanelAdvHeader({ _vm, ArrowLeft })} - - {renderAdvancePanelRadios()} - - {renderAdvancePanelButtons({ _vm })} - {renderAdvancePanelAdvList({ _vm })} -
    - ) - }, - renderInput() { - this.correctRelations() - const { condition, filterStore } = this - const { inputFilter } = filterStore - - if (!inputFilter) return null - - let { isAddbyProgram, inputRelations } = renderInputArgs({ _vm: this, inputFilter }) - let InputComponent = inputFilter.component || 'input' - const isNativeInput = InputComponent === 'input' - const model = InputComponent.model || {} - const prop = isNativeInput ? 'value' : model.prop || 'modelValue' - const event = isNativeInput ? 'input' : model.event || 'update:modelValue' - let ret = renderInputProps({ InputComponent, condition, event, inputFilter, isNativeInput, prop }) - let inputProps = ret.inputProps - InputComponent = ret.InputComponent - - return ( -
      - {isAddbyProgram ? null : ( -
    • - {inputRelations.map(({ label, value, method }) => ( - { - condition.relation = value - condition.method = - method || - function () { - return true - } - }} - > - {label} - - ))} -
    • - )} -
    • {h(InputComponent, inputProps)}
    • -
    • - - - -
    • -
    - ) - }, - renderEnumable() { - const { filterStore } = this - - if (!filterStore.enumable) return null - - const CheckedSur = iconCheckedSur() - const Check = iconCheck() - - const iconRender = function (checked, index) { - const props = { - class: 'tiny-svg-size', - tabindex: index - } - return checked ? : - } - - return ( -
    -
      - {!filterStore.options.length ? renderEnumableEmpty({ _vm: this }) : renderEnumableOptions({ iconRender, _vm: this, filterStore })} -
    - {filterStore.multi ? ( -
    - - -
    - ) : null} -
    - ) - }, - showAdvList(e) { - this.showAdvItems = true - this.listPopper && this.listPopper.destroy() && (this.listPopper = null) - - this.$nextTick(() => { - const reference = e.target - const popper = this.$refs.advlist - - popper.style.zIndex = PopupManager.nextZIndex() - this.listPopper = new PopperJS(reference, popper, { - placement: 'bottom-start' - }).update() - }) - }, - hideAdvList() { - this.listPopper && this.listPopper.destroy() && (this.listPopper = null) - this.showAdvItems = false - }, - renderSlot(h) { - let { $parent: $table, filterStore } = this - let { args, column } = filterStore - let { slots } = column - - if (slots && slots.filter) { - return slots.filter.call($table, { $table, context: this, ...args }, h) - } - }, - // 全部筛选事件 - filterCheckAllEvent(event, value) { - let filterStore = this.filterStore - - filterStore.options.forEach((item) => { - item.checked = value - }) - - filterStore.isAllSelected = value - filterStore.isIndeterminate = false - }, - // 筛选发生改变 check 是否检查默认值的有效性,当自定义relations时,需要检查 - resetInput() { - this.correctRelations() - - const { inputFilter, onResetInputFilter } = this.filterStore - - if (inputFilter) { - const { relations, relation } = this.filterStore.inputFilter - - this.condition.input = '' - - if (typeof onResetInputFilter === 'function') { - onResetInputFilter(this.$refs.filterInputComponent) - } - - let defaultrelation = 'equals' - let relationValues - let relationValue - - if (Array.isArray(relations) && relations.length) { - this.condition.method = relations[0].method - defaultrelation = relations[0].value || 'equals' - - for (let i = 0; i < relations.length; i++) { - if (relations[i].value === 'equals') { - defaultrelation = 'equals' - break - } - } - - relationValues = relations.map((r) => r.value) - - if (relation && ~relationValues.indexOf(relation)) { - relationValue = relation - } - } - - this.condition.relation = relationValue || defaultrelation - } - }, - // 确认筛选 - confirmFilter(type) { - let { - filterStore: { column } - } = this - - this.condition.type = type - column.filter.condition = extend(true, {}, this.condition) - this.$parent.confirmFilterEvent() - }, - // 对外的暴露自定义提交方法 - commitFilter() { - let { - filterStore: { column } - } = this - - column.filter.condition.type = 'custom' - this.$parent.confirmFilterEvent() - }, - // 重置当前列筛选 - resetFilter() { - this.condition.value = null - this.condition.input = '' - this.condition.empty = null - this.condition.value = [] - this.condition.type = null - this.resetInput() - this.confirmFilter() - }, - // 清除所有列筛选 - clearFilter() { - this.$parent.clearFilter(true) - }, - filterNull(empty) { - this.condition.value = [] - this.condition.input = '' - this.condition.empty = empty - this.confirmFilter('empty') - }, - filterExtends(item) { - this.condition.value = item.value || item.label - this.condition.method = item.method - this.confirmFilter('extend') - }, - filterInput() { - this.condition.value = [] - this.condition.empty = null - this.confirmFilter('input') - }, - filterEnum() { - this.condition.input = '' - this.condition.empty = null - this.condition.value = this.filterStore.options.filter((item) => item.checked).map((check) => check.value) - this.confirmFilter('enum') - }, - close() { - let { filterStore } = this - - filterStore.visible = false - }, - correctRelations() { - if (this.filterStore && typeof this.filterStore.inputFilter === 'object') { - const relations = this.filterStore.inputFilter.relations - const relation = this.filterStore.inputFilter.relation || 'equals' - - if (!relations || (Array.isArray(relations) && relations.length === 0)) { - this.filterStore.inputFilter.relations = [{ label: relation, value: relation }] - this.filterStore.inputFilter.relations_addby = 'program' - this.filterStore.inputFilter.relations_backup = relations - } - } - } - }, - setup() { - const instance = hooks.getCurrentInstance().proxy - - hooks.onBeforeUnmount(() => { - instance.popperJS && instance.popperJS.destroy() && (instance.popperJS = null) - }) - } -} diff --git a/packages/grid/src/grid/grid.js b/packages/grid/src/grid/grid.js deleted file mode 100644 index a20fa5321..000000000 --- a/packages/grid/src/grid/grid.js +++ /dev/null @@ -1,667 +0,0 @@ -/** - * MIT License - * - * Copyright (c) 2019 Xu Liangzhan - * - * Permission is hereby granted, free of charge, to any person obtaining a copy - * of this software and associated documentation files (the "Software"), to deal - * in the Software without restriction, including without limitation the rights - * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell - * copies of the Software, and to permit persons to whom the Software is - * furnished to do so, subject to the following conditions: - * - * The above copyright notice and this permission notice shall be included in all - * copies or substantial portions of the Software. - * - * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR - * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, - * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE - * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER - * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, - * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE - * SOFTWARE. - * - */ - -import { getObj } from '@opentiny/vue-renderless/common/object' -import { isBoolean, slice } from '@opentiny/vue-renderless/grid/static/' -import { removeClass, addClass } from '@opentiny/vue-renderless/common/deps/dom' -import { getDataset } from '@opentiny/vue-renderless/common/dataset' -import { getListeners, emitEvent } from '@opentiny/vue-renderless/grid/utils' -import { extend } from '@opentiny/vue-renderless/common/object' -import { h, hooks, emitter, $prefix } from '@opentiny/vue-common' -import Modal from '@opentiny/vue-modal' -import Pager from '@opentiny/vue-pager' -import { Buttons } from '../adapter' -import { error } from '../tools' -import Table from '../table' -import GlobalConfig from '../config' -import methods, { setBodyRecords, invokeSaveDataApi, doRemoveOrShowMsg } from './methods' - -const propKeys = Object.keys(Table.props) - -function getRenderedToolbar({ $slots, _vm, loading, tableLoading, toolbar }) { - return (_vm.renderedToolbar = (() => { - let res = null - - if ($slots.toolbar) { - res = $slots.toolbar() - } else if (toolbar) { - res = h(hooks.toRaw(toolbar.component), { - ref: 'toolbar', - props: { loading: loading || tableLoading, ...toolbar } - }) - } - - return res - })()) -} - -function renderPager({ $slots, _vm, loading, pager, pagerConfig, tableLoading, vSize }) { - let res = null - if ($slots.pager) { - res = $slots.pager() - } else if (pager) { - pager.component = pager.component || Pager - res = h(hooks.toRaw(pager.component), { - props: { - size: vSize, - loading: loading || tableLoading, - isBeforePageChange: _vm.isBeforePageChange || _vm.showSaveMsg, - accurateJumper: _vm.autoLoad, - ...pagerConfig - }, - on: { - 'size-change': _vm.pageSizeChange, - 'current-change': _vm.pageCurrentChange, - 'before-page-change': _vm.beforePageChangeHandler - }, - ref: 'pager' - }) - } - - return res -} - -const createRender = (opt) => { - const { h, _vm, vSize, props, selectToolbar, $slots, tableOns, renderedToolbar, loading, pagerConfig, pager, tableLoading } = opt - return h( - 'div', - { - class: [ - 'tiny-grid__wrapper', - { - [`size__${vSize}`]: vSize, - 'tiny-grid__animat': props.optimization.animat - } - ] - }, - [ - selectToolbar ? null : renderedToolbar, - h('tiny-grid-table', { props, on: tableOns, ref: 'tinyTable' }, $slots.default && $slots.default()), - renderPager({ - $slots, - _vm, - loading, - pager, - pagerConfig, - tableLoading, - vSize - }) - ] - ) -} - -export default { - name: `${$prefix}Grid`, - components: { - TinyGridTable: Table - }, - provide() { - return { $grid: this } - }, - props: { - columns: Array, - proxyConfig: Object, - fetchData: Object, - saveData: Object, - deleteData: Object, - toolbar: Object, - pager: Object, - dataset: Object, - autoLoad: { - type: Boolean, - default: true - }, - seqSerial: { - type: Boolean, - default: false - }, - events: Object, - ...Table.props, - isBeforePageChange: Boolean, - showSaveMsg: { - type: Boolean, - default: false - }, - isMultipleHistory: Boolean, - selectToolbar: [Boolean, Object] - }, - data() { - return { - emitter: emitter(), - fetchOption: null, - filterData: [], - listeners: {}, - pagerConfig: null, - pendingRecords: [], - seqIndex: this.startIndex, - sortData: {}, - tableCustoms: [], - tableData: [], - tableLoading: false, - tablePage: { - total: 0, - pageSize: 10, - currentPage: 1 - }, - toolBarVm: null - } - }, - computed: { - isMsg() { - return this.proxyOpts.message !== false - }, - tableProps() { - let rest = {} - propKeys.forEach((key) => (rest[key] = this[key])) - return rest - }, - proxyOpts() { - return extend(true, {}, GlobalConfig.grid.proxyConfig, this.proxyConfig) - }, - vSize() { - return this.size || (this.$parent && this.$parent.size) || (this.$parent && this.$parent.vSize) - } - }, - watch: { - columns(cols) { - this.loadColumn(cols) - }, - startIndex(value) { - this.seqIndex = value - }, - tableCustoms() { - this.toolbar && this.$refs.toolbar && this.$refs.toolbar.loadStorage() - } - }, - created() { - this.fetchOption = this.initFetchOption() - this.pagerConfig = this.initPagerConfig() - - let { customs, events } = this - - if (customs) { - this.tableCustoms = customs - } - - if (events) { - const listeners = {} - - for (let event in events) { - if (Object.prototype.hasOwnProperty.call(events, event)) { - let evkey = event.replace(/\B([A-Z])/g, '-$1').toLowerCase() - - listeners[evkey] = events[event] - - if (~['pageChange', 'sortChange', 'filterChange', 'toolbarButtonClick'].indexOf(event)) { - this.emitter.on(evkey, events[event]) - } - } - } - - this.listeners = listeners - } - }, - mounted() { - let { columns, fetchOption, autoLoad, pagerSlot } = this - - // pager插槽中内置pager组件事件处理 - if (pagerSlot) { - const { - componentOptions: { listeners = {} }, - componentInstance - } = pagerSlot - - if (!listeners['size-change']) { - componentInstance.$on('size-change', this.pageSizeChange) - } - - if (!listeners['current-change']) { - componentInstance.$on('current-change', this.pageCurrentChange) - } - } - - if (columns && columns.length) { - this.loadColumn(this.columns) - } - - if (fetchOption && autoLoad !== false) { - this.commitProxy('query', this.toolBarVm && this.toolBarVm.orderSetting()) - } - - if (this.isMultipleHistory) { - this.initMultipleHistory() - } - }, - setup(props, { slots, listeners, attrs }) { - const tableListeners = getListeners(attrs, listeners) - - return { slots, tableListeners } - }, - render() { - let { editConfig, fetchOption, listeners, loading, optimization, pager, pagerConfig, remoteFilter, remoteSort, selectToolbar } = this - let { seqIndex, slots: $slots, tableCustoms, tableData, tableListeners, tableLoading, tableProps, toolbar, vSize } = this - let optimizOpt = { ...GlobalConfig.optimization, ...optimization } - let props = { ...tableProps, optimization: optimizOpt, startIndex: seqIndex } - let tableOns = { ...listeners, ...tableListeners } - let { handleRowClassName: rowClassName, sortChangeEvent, filterChangeEvent } = this - - fetchOption && Object.assign(props, { loading: loading || tableLoading, data: tableData, rowClassName }) - fetchOption && remoteSort && (tableOns['sort-change'] = sortChangeEvent) - fetchOption && remoteFilter && (tableOns['filter-change'] = filterChangeEvent) - - toolbar && !(toolbar.setting && toolbar.setting.storage) && (props.customs = tableCustoms) - toolbar && (tableOns['update:customs'] = (value) => (this.tableCustoms = value)) - - let editConfigOpt = { trigger: 'click', mode: 'cell', showStatus: true, ...editConfig } - - editConfig && (props.editConfig = Object.assign(editConfigOpt, { activeMethod: this.handleActiveMethod })) - - let renderedToolbar = getRenderedToolbar({ $slots, _vm: this, loading, tableLoading, toolbar }) - - return createRender({ h, _vm: this, vSize, props, selectToolbar, renderedToolbar, tableOns, $slots, loading, pager, pagerConfig, tableLoading }) - }, - methods: { - ...methods, - initPagerConfig() { - let { $slots, fetchOption, scrollLoad = {} } = this - let pagerProps = {} - - if (fetchOption) { - let pagerSlot = $slots.pager && $slots.pager[0] - - if (pagerSlot) { - let { componentOptions, children } = pagerSlot - - if (componentOptions && !children) { - this.pagerSlot = pagerSlot - pagerProps = componentOptions.propsData - } - } else if (this.pager) { - pagerProps = this.pager.attrs - } - - if (this.pager || $slots.pager || this.scrollLoad) { - return Object.assign(this.tablePage, { pageSize: scrollLoad.pageSize }, pagerProps) - } - - return fetchOption.args && fetchOption.args.page - } - }, - initFetchOption() { - let { fetchData = {}, dataset = {} } = this - - if (fetchData.api || dataset.source || dataset.value || dataset.api) { - let { loading, fields, api } = fetchData || dataset.source || dataset.api || {} - - return { api, dataset, fields, loading } - } - }, - getParentHeight() { - let { $el, $refs } = this - - return $el.parentNode.clientHeight - ($refs.toolbar ? $refs.toolbar.$el.clientHeight : 0) - ($refs.pager?.$el ? $refs.pager.$el.clientHeight : 0) - }, - handleRowClassName(params) { - let rowClassName = this.rowClassName - let clss = [] - - if (this.pendingRecords.some((item) => item === params.row)) { - clss.push('row__pending') - } - - return clss.concat(rowClassName ? rowClassName(params) : []) - }, - handleActiveMethod(params) { - return !~this.pendingRecords.indexOf(params.row) && (!this.editConfig.activeMethod || this.editConfig.activeMethod(params)) - }, - handleFetch(code, sortArg) { - let { pager, sortData, filterData, pagerConfig, fetchOption, fetchData, dataset } = this - this.clearRadioRow() - this.resetScrollTop() - if (!fetchOption) { - error('ui.grid.error.notQuery') - return this.$nextTick() - } - let { args, loading } = fetchData || dataset.source || dataset.api || {} - let { field, order, prop, property } = sortData - let sortByData = { field, order, prop, property } - let params = { - $grid: this, - sort: sortData, - sortBy: sortByData, - filters: filterData, - ...args - } - let search - this.tableLoading = loading - if (pagerConfig) { - params.page = pagerConfig - } - if (code === 'reload') { - if (pager || args.page) { - pagerConfig.currentPage = 1 - } - this.sortData = params.sort = {} - this.filterData = params.filters = [] - this.pendingRecords = [] - this.clearAll() - } - if (sortArg && sortArg.length > 0) { - params.sortBy = sortArg - } - if (fetchData && fetchData.api) { - search = fetchData.api.apply(this, [params]) - } else { - search = getDataset({ dataset, service: this.$service }, params) - } - return search.then(this.loadFetchData).catch((error) => { - this.tableLoading = false - throw error - }) - }, - loadFetchData(rest) { - if (!rest) { - this.tableData = [] - this.tableLoading = false - return - } - - let { - fetchOption: { fields = {} }, - pagerConfig, - pagerSlot - } = this - - if (pagerConfig && !Array.isArray(rest)) { - let total = getObj(rest, fields.total || 'page.total') || rest?.result?.length || 0 - let data = getObj(rest, fields.result || fields.data || 'result') || [] - - this.tableData = data - pagerConfig.total = total - // 内置pager - let setTotal = pagerSlot && pagerSlot.componentInstance.setTotal - - setTotal && setTotal(total) - } else { - this.tableData = (fields.list ? getObj(rest, fields.list) : rest) || [] - } - - if ((this.seqSerial || this.scrollLoad) && pagerConfig) { - this.seqIndex = (pagerConfig.currentPage - 1) * pagerConfig.pageSize - } - - this.tableLoading = false - }, - handleSave(code, args) { - let { saveData, isMsg } = this - - if (!saveData) { - error('ui.grid.error.notSave') - return - } - - let body = extend(true, { pendingRecords: this.pendingRecords }, this.getRecordset()) - let { insertRecords, removeRecords, updateRecords, pendingRecords } = body - let validRows = insertRecords.concat(updateRecords) - let getCallback = (resolve) => (valid) => { - if (!valid) { - resolve(valid) - return - } - - let canInvoke = invokeSaveDataApi({ _vm: this, args, body, code, removeRecords, resolve, saveData, updateRecords, valid }) - - doRemoveOrShowMsg({ _vm: this, canInvoke, code, isMsg, pendingRecords, resolve, valid }) - } - - // 排除掉新增且标记为删除的数据,排除已标记为删除的数据 - setBodyRecords({ body, insertRecords, pendingRecords }) - - // 只校验新增和修改的数据 - return new Promise((resolve) => { - this.validate(validRows, getCallback(resolve)) - }) - }, - handleDelete(code, args) { - let { deleteData, isMsg } = this - - if (!deleteData) { - error('ui.grid.error.notDelete') - return - } - - let selecteds = this.getSelectRecords(true) - let afterRemove = () => { - let removeds = this.getRemoveRecords() - - if (!removeds.length && isMsg && !selecteds.length) { - Modal.message({ - id: code, - message: GlobalConfig.i18n('ui.grid.selectOneRecord'), - status: 'warning' - }) - } - - if (removeds.length) { - let apiArgs = [{ $grid: this, changeRecords: { removeRecords: removeds } }, ...args] - let stopLoading = () => { - this.tableLoading = false - } - - this.tableLoading = true - - return deleteData.api - .apply(this, apiArgs) - .then(stopLoading) - .catch(stopLoading) - .then(() => this.commitProxy('reload')) - } - } - - this.remove(selecteds).then(afterRemove) - }, - handleFullScreen([show]) { - const cls = 'tiny-fullscreen-full' - - show ? addClass(this.$el, cls) : removeClass(this.$el, cls) - - this.recalculate(true) - - emitEvent(this, 'fullscreen', show) - this.emitter.emit('fullscreen', show) - }, - commitProxy(code) { - let btnMethod = Buttons.get(code) - let args = slice(arguments, 1) - - if (code === 'insert') { - this.insert() - } else if (code === 'insert_actived') { - this.insert().then(({ row }) => this.setActiveRow(row)) - } else if (code === 'mark_cancel') { - this.triggerPendingEvent(code) - } else if (code === 'delete_selection') { - this.handleDeleteRow(code, 'ui.grid.deleteSelectRecord', () => this.commitProxy.apply(this, ['delete'].concat(args))) - } else if (code === 'remove_selection') { - this.handleDeleteRow(code, 'ui.grid.removeSelectRecord', () => this.removeSelecteds()) - } else if (code === 'export') { - this.exportCsv() - } else if (code === 'reset_custom') { - this.resetAll() - } else if (~['reload', 'query'].indexOf(code)) { - this.handleFetch(code, args) - } else if (code === 'delete') { - this.handleDelete(code, args) - } else if (code === 'save') { - this.handleSave() - } else if (code === 'fullscreen') { - this.handleFullScreen(args) - } else if (btnMethod) { - btnMethod.call(this, { code, $grid: this }, ...args) - } - - return this.$nextTick() - }, - handleDeleteRow(code, i18nKey, callback) { - let selecteds = this.getSelectRecords() - - if (this.isMsg && selecteds.length) { - Modal.confirm(GlobalConfig.i18n(i18nKey)).then((type) => { - type === 'confirm' && callback() - }) - } - - if (this.isMsg && !selecteds.length) { - Modal.message({ - id: code, - message: GlobalConfig.i18n('ui.grid.selectOneRecord'), - status: 'warning' - }) - } - - if (!this.isMsg && selecteds.length) { - callback() - } - }, - getPendingRecords() { - return this.pendingRecords - }, - triggerToolbarBtnEvent(button, event) { - let { events = {}, tableListeners } = this - let { code } = button - - if (!events.toolbarButtonClick && !tableListeners['toolbar-button-click']) { - this.commitProxy(code, event) - } - - emitEvent(this, 'toolbar-button-click', [{ code, button, $grid: this }, event]) - - this.emitter.emit('toolbar-button-click', { code, button, $grid: this }, event) - }, - triggerPendingEvent(code) { - let { isMsg, pendingRecords: pendings } = this - let selectColumn = this.getColumns().filter((col) => ~['selection', 'radio'].indexOf(col.type)) - let isSelection = selectColumn.length && selectColumn[0].type === 'selection' - let isRadio = selectColumn.length && selectColumn[0].type === 'radio' - let selecteds = isSelection ? this.getSelectRecords(true) : isRadio ? [this.getRadioRow()] : [] - - if (!selecteds.length && isMsg) { - Modal.message({ - id: code, - message: GlobalConfig.i18n('ui.grid.selectOneRecord'), - status: 'warning' - }) - } - - if (selecteds.length) { - let { plus = [], minus = [], tmp } = {} - - selecteds.forEach((data) => { - let selectedPending = pendings.some((item) => data === item) - - tmp = selectedPending ? minus : plus - tmp.push(data) - }) - - tmp = minus.length ? pendings.filter((item) => !~minus.indexOf(item)) : pendings - this.pendingRecords = tmp.concat(plus) - - isSelection && this.clearSelection() - isRadio && this.clearRadioRow() - } - }, - pageChangeEvent(params) { - let eventParams = extend(false, { $grid: this }, params) - - emitEvent(this, 'page-change', eventParams) - this.emitter.emit('page-change', eventParams) - this.commitProxy('query', this.toolBarVm && this.toolBarVm.orderSetting()) - }, - // size为页大小,load为false则触发change事件与查询,在个性化初始化时根据autoload控制是否加载数据 - pageSizeChange(size, load) { - this.tablePage.pageSize = size - this.tablePage.currentPage = 1 - load || this.pageChangeEvent(this.tablePage) - }, - pageCurrentChange(current) { - this.tablePage.currentPage = current - this.pageChangeEvent(this.tablePage) - }, - beforePageChangeHandler(params) { - if (!this.showSaveMsg) { - let eventParams = extend(false, { $grid: this }, params) - - emitEvent(this, 'before-page-change', eventParams) - this.emitter.emit('before-page-change', eventParams) - - return - } - - let { callback, rollback } = params - let { insertRecords, removeRecords, updateRecords } = this.getRecordset() - - if (insertRecords.length || removeRecords.length || updateRecords.length) { - let next = (res) => { - if (res === 'confirm') { - rollback && rollback() - emitEvent(this, 'cancel-page-change', this) - this.emitter.emit('cancel-page-change', this) - } else { - callback && callback() - } - } - - Modal.confirm(GlobalConfig.i18n('ui.grid.isSaveMsg')).then(next) - } else { - callback && callback() - } - }, - sortChangeEvent(params) { - let remoteSort = this.remoteSort - let column = params.column - let eventParams = extend(false, { $grid: this }, params) - // 如果是服务端排序 - if (isBoolean(column.remoteSort) ? column.remoteSort : remoteSort) { - this.sortData = params - this.tablePage.currentPage = 1 - this.commitProxy('query') - } - - emitEvent(this, 'sort-change', eventParams) - this.emitter.emit('sort-change', eventParams) - }, - filterChangeEvent(params) { - let eventParams = extend(false, { $grid: this }, params) - // 如果是服务端过滤 - if (this.remoteFilter) { - this.filterData = params.filters - this.commitProxy('query') - } - - emitEvent(this, 'filter-change', eventParams) - this.emitter.emit('filter-change', eventParams) - } - } -} diff --git a/packages/grid/src/grid/methods.js b/packages/grid/src/grid/methods.js deleted file mode 100644 index bb613b244..000000000 --- a/packages/grid/src/grid/methods.js +++ /dev/null @@ -1,88 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Modal from '@opentiny/vue-modal' -import GlobalConfig from '../config' -import Table from '../table' - -export function setBodyRecords({ body, insertRecords, pendingRecords }) { - if (insertRecords.length) { - body.pendingRecords = pendingRecords.filter((row) => insertRecords.indexOf(row) === -1) - } - - if (pendingRecords.length) { - body.insertRecords = insertRecords.filter((row) => pendingRecords.indexOf(row) === -1) - } -} - -function canInvokeSaveDataApi(body, removeRecords, updateRecords) { - return body.insertRecords.length || removeRecords.length || updateRecords.length || body.pendingRecords.length -} - -export function doRemoveOrShowMsg({ _vm, canInvoke, code, isMsg, pendingRecords, resolve, valid }) { - if (valid && !canInvoke) { - if (isMsg) { - // 直接移除未保存且标记为删除的数据 - if (pendingRecords.length) { - _vm.remove(pendingRecords) - } else { - Modal.message({ - id: code, - message: GlobalConfig.i18n('ui.grid.dataUnchanged'), - status: 'info' - }) - } - } - - resolve() - } -} - -export function invokeSaveDataApi({ _vm, args, body, code, removeRecords, resolve, saveData, updateRecords, valid }) { - let canInvoke = false - - if (valid && (canInvoke = canInvokeSaveDataApi(body, removeRecords, updateRecords))) { - _vm.tableLoading = true - - resolve( - saveData.api - .apply(_vm, [{ $grid: _vm, changeRecords: body }].concat(args)) - .then(() => { - Modal.message({ - id: code, - message: GlobalConfig.i18n('ui.grid.saveSuccess'), - status: 'success' - }) - _vm.tableLoading = false - }) - .catch(() => { - _vm.tableLoading = false - }) - .then(() => _vm.commitProxy('reload')) - ) - } - - return canInvoke -} - -const getWrapFunc = (name) => - function () { - return this.$refs.tinyTable[name].apply(this.$refs.tinyTable[name], arguments) - } - -const methods = {} -const methodNames = Object.keys(Table.methods).concat(['exportCsv', 'clearFilter', 'exportExcel']) - -methodNames.forEach((name) => { - methods[name] = getWrapFunc(name) -}) - -export default methods diff --git a/packages/grid/src/header/src/header.js b/packages/grid/src/header/src/header.js deleted file mode 100644 index 33fa00c1b..000000000 --- a/packages/grid/src/header/src/header.js +++ /dev/null @@ -1,517 +0,0 @@ -/** - * MIT License - * - * Copyright (c) 2019 Xu Liangzhan - * - * Permission is hereby granted, free of charge, to any person obtaining a copy - * of this software and associated documentation files (the "Software"), to deal - * in the Software without restriction, including without limitation the rights - * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell - * copies of the Software, and to permit persons to whom the Software is - * furnished to do so, subject to the following conditions: - * - * The above copyright notice and this permission notice shall be included in all - * copies or substantial portions of the Software. - * - * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR - * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, - * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE - * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER - * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, - * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE - * SOFTWARE. - * - */ - -import { isObject, isNull } from '@opentiny/vue-renderless/common/type' -import { convertToRows } from '@opentiny/vue-renderless/grid/plugins/header' -import { removeClass, addClass, hasClass } from '@opentiny/vue-renderless/common/deps/dom' -import { isBoolean, isFunction } from '@opentiny/vue-renderless/grid/static/' -import { updateCellTitle, getOffsetPos, emitEvent, getClass } from '@opentiny/vue-renderless/grid/utils' -import { h, $prefix } from '@opentiny/vue-common' -import { random } from '@opentiny/vue-renderless/common/string' - -function addListenerMousedown({ $table, mouseConfig, params, thOns }) { - if (mouseConfig.checked) { - thOns.mousedown = (event) => - $table.triggerHeaderCellMousedownEvent(event, { - cell: event.currentTarget, - ...params - }) - } -} - -function addListenerDblclick({ $table, params, tableListeners, thOns }) { - if (tableListeners['header-cell-dblclick']) { - thOns.dblclick = (event) => emitEvent($table, 'header-cell-dblclick', [{ cell: event.currentTarget, ...params }, event]) - } -} - -function addListenerClick({ $table, highlightCurrentColumn, mouseConfig, params, sortOpts, tableListeners, thOns }) { - if (highlightCurrentColumn || tableListeners['header-cell-click'] || mouseConfig.checked || sortOpts.trigger === 'cell') { - thOns.click = (event) => - $table.triggerHeaderCellClickEvent(event, { - cell: event.currentTarget, - ...params - }) - } -} - -function addListenerMouseout({ $table, showHeaderTip, showTooltip, thOns }) { - if (showTooltip || showHeaderTip) { - thOns.mouseout = () => { - if ($table._isResize) { - return - } - - $table.clostTooltip() - } - } -} - -function addListenerMouseover({ $table, params, showHeaderTip, showTitle, showTooltip, thOns }) { - if (showTitle || showTooltip || showHeaderTip) { - thOns.mouseover = (event) => { - if ($table._isResize) { - return - } - - if (showTitle) { - updateCellTitle(event) - } else if (showTooltip || showHeaderTip) { - $table.triggerHeaderTooltipEvent(event, { showHeaderTip, ...params }) - } - } - } -} - -function modifyHeadAlign({ column, headAlign }) { - if (~['radio', 'selection', 'index'].indexOf(column.type)) { - headAlign = headAlign ? headAlign : 'center' - } - - return headAlign -} - -function computeDragLeft(args) { - let { cell, dragMinLeft, dragPosLeft, fixedOffsetWidth, isLeftFixed, isRightFixed } = args - let { left, leftContainer, minInterval, rightContainer, tableBodyElem } = args - - if (isLeftFixed) { - // 左固定列(不允许超过右侧固定列、不允许超过右边距) - left = Math.min(left, (rightContainer ? rightContainer.offsetLeft : tableBodyElem.clientWidth) - fixedOffsetWidth - minInterval) - } else if (isRightFixed) { - // 右侧固定列(不允许超过左侧固定列、不允许超过左边距) - dragMinLeft = (leftContainer ? leftContainer.clientWidth : 0) + fixedOffsetWidth + minInterval - left = Math.min(left, dragPosLeft + cell.clientWidth - minInterval) - } - - let dragLeft = Math.max(left, dragMinLeft) - - return { left, dragMinLeft, dragLeft } -} - -function computeDragPosLeft({ dragPosLeft, fixedOffsetWidth, isRightFixed, rightContainer }) { - if (isRightFixed && rightContainer) { - dragPosLeft = rightContainer.offsetLeft + fixedOffsetWidth - } - - return dragPosLeft -} -function renderTableColgroup(tableColumn) { - return h( - 'colgroup', - { - ref: 'colgroup' - }, - tableColumn.map((column, columnIndex) => h('col', { attrs: { name: column.id }, key: columnIndex })).concat([h('col', { attrs: { name: 'col_gutter' } })]) - ) -} - -function renderRepair() { - return h('div', { class: 'tiny-grid__repair', ref: 'repair' }) -} - -function renderXSpace({ fixedType }) { - return fixedType ? [null] : h('div', { class: 'tiny-grid-body__x-space', ref: 'xSpace' }) -} - -const classMap = { - colFixed: 'col__fixed', - colIndex: 'col__index', - colRadio: 'col__radio', - colSelection: 'col__selection', - colGroup: 'col__group', - colEllipsis: 'col__ellipsis', - fixedHidden: 'fixed__hidden', - isSortable: 'is__sortable', - isEditable: 'is__editable', - isFilter: 'is__filter', - filterActive: 'filter__active' -} - -function getThPropsArg(args) { - let { column, columnIndex, columnKey, fixedHiddenColumn, hasEllipsis, headAlign } = args - let { headerCellClassName, headerClassName, isColGroup, isDragHeaderSorting, params, thOns } = args - return { - class: [ - 'tiny-grid-header__column', - column.id, - { - [`col__${headAlign}`]: headAlign, - [classMap.colFixed]: column.fixed, - [classMap.colIndex]: column.type === 'index', - [classMap.colRadio]: column.type === 'radio', - [classMap.colSelection]: column.type === 'selection', - [classMap.colGroup]: isColGroup, - [classMap.colEllipsis]: hasEllipsis, - [classMap.fixedHidden]: fixedHiddenColumn, - [classMap.isSortable]: ['index', 'radio', 'selection'].indexOf(column.type) === -1 && column.sortable, - [classMap.isEditable]: column.editor, - [classMap.isFilter]: isObject(column.filter), - [classMap.filterActive]: column.filter && column.filter.hasFilter - }, - getClass(headerClassName, params), - getClass(headerCellClassName, params) - ], - attrs: { - 'data-colid': column.id, - colspan: column.colSpan, - rowspan: column.rowSpan - }, - on: thOns, - key: isDragHeaderSorting ? random() : columnKey || isColGroup ? column.id : columnIndex - } -} - -function renderThPartition({ border, column, isColGroup, resizable }) { - let res = null - - const classMap = { - isLine: 'is__line' - } - - if (!isColGroup && !(isBoolean(column.resizable) ? column.resizable : resizable) && column.type !== 'index') { - res = h('div', { - class: ['tiny-grid-thead-partition', { [classMap.isLine]: !border }] - }) - } - - return res -} - -function renderThCell(args) { - let { column, fixedHiddenColumn, headerSuffixIconAbsolute, params } = args - let { showEllipsis, showHeaderTip, showTitle, showTooltip } = args - - return h( - 'div', - { - class: [ - 'tiny-grid-cell', - { - 'tiny-grid-cell__title': showTitle, - 'tiny-grid-cell__tooltip': showTooltip || showHeaderTip, - 'tiny-grid-cell__ellipsis': showEllipsis, - 'tiny-grid-cell__header-suffix': headerSuffixIconAbsolute - } - ] - }, - column.renderHeader(h, { isHidden: fixedHiddenColumn, ...params }) - ) -} -function renderThResize({ _vm, border, column, fixedHiddenColumn, isColGroup, params, resizable }) { - let res = null - - const classMap = { - isLine: 'is__line' - } - - if ( - !fixedHiddenColumn && - !isColGroup && - !~['index', 'radio', 'selection'].indexOf(column.type) && - (isBoolean(column.resizable) ? column.resizable : resizable) - ) { - res = h('div', { - class: ['tiny-grid-resizable', { [classMap.isLine]: !border }], - on: { - mousedown: (event) => _vm.resizeMousedown(event, { isHidden: fixedHiddenColumn, ...params }) - } - }) - } - - return res -} - -function getThHandler(args) { - let { $rowIndex, $table, _vm, allAlign, allColumnHeaderOverflow, allHeaderAlign, border, columnKey, fixedType, headerCellClassName } = args - let { headerSuffixIconAbsolute, highlightCurrentColumn, isDragHeaderSorting, mouseConfig, overflowX, resizable, sortOpts, tableListeners } = args - - return (column, $columnIndex) => { - let { showHeaderOverflow, showHeaderTip, headerAlign, align, headerClassName } = column - let isColGroup = column.children && column.children.length - let fixedHiddenColumn = fixedType ? column.fixed !== fixedType && !isColGroup : column.fixed && overflowX - let headOverflow = isNull(showHeaderOverflow) ? allColumnHeaderOverflow : showHeaderOverflow - let showEllipsis = headOverflow === 'ellipsis' - let showTitle = headOverflow === 'title' - let headAlign = headerAlign || align || allHeaderAlign || allAlign - let showTooltip = headOverflow === true || headOverflow === 'tooltip' - let thOns = {} - let hasEllipsis = showTitle || showTooltip || showEllipsis - - // 索引列、选择列如果不配置对齐方式则默认为居中对齐 - headAlign = modifyHeadAlign({ column, headAlign }) - // 确保表格索引的准确性 - let columnIndex = $table.getColumnIndex(column) - let params = { $table, $rowIndex, column } - Object.assign(params, { columnIndex, $columnIndex, fixed: fixedType }) - addListenerMouseover({ $table, params, showHeaderTip, showTitle, showTooltip, thOns }) - addListenerMouseout({ $table, showHeaderTip, showTooltip, thOns }) - - let args1 = { $table, highlightCurrentColumn, mouseConfig, params } - Object.assign(args1, { sortOpts, tableListeners, thOns }) - addListenerClick(args1) - addListenerDblclick({ $table, params, tableListeners, thOns }) - - // 按下事件处理 - addListenerMousedown({ $table, mouseConfig, params, thOns }) - args1 = { column, columnIndex, columnKey, fixedHiddenColumn, hasEllipsis, headAlign } - Object.assign(args1, { headerCellClassName, headerClassName, isColGroup, isDragHeaderSorting, params, thOns }) - let args2 = { column, fixedHiddenColumn, headerSuffixIconAbsolute, params } - Object.assign(args2, { showEllipsis, showHeaderTip, showTitle, showTooltip }) - - return h('th', getThPropsArg(args1), [ - renderThPartition({ border, column, isColGroup, resizable }), - renderThCell(args2), - // 列宽拖动 - renderThResize({ _vm, border, column, fixedHiddenColumn, isColGroup, params, resizable }) - ]) - } -} - -function renderTableThead(args) { - let { $table, _vm, allAlign, allColumnHeaderOverflow } = args - let { allHeaderAlign, border, columnKey, fixedType } = args - let { headerCellClassName, headerColumn, headerRowClassName, headerSuffixIconAbsolute } = args - let { highlightCurrentColumn, isDragHeaderSorting, mouseConfig } = args - let { overflowX, resizable, sortOpts, tableListeners } = args - - return h( - 'thead', - { - ref: 'thead' - }, - headerColumn.map((cols, $rowIndex) => { - let args1 = { $rowIndex, $table, _vm, allAlign, allColumnHeaderOverflow, allHeaderAlign, border, columnKey } - - Object.assign(args1, { fixedType, headerCellClassName, headerSuffixIconAbsolute, highlightCurrentColumn }) - Object.assign(args1, { isDragHeaderSorting, mouseConfig, overflowX, resizable, sortOpts, tableListeners }) - - return h( - 'tr', - { - class: [ - 'tiny-grid-header__row', - headerRowClassName ? (isFunction(headerRowClassName) ? headerRowClassName({ $table, $rowIndex, fixed: fixedType }) : headerRowClassName) : '' - ] - }, - cols.map(getThHandler(args1)).concat([h('th', { class: 'col__gutter' })]) - ) - }) - ) -} -function computeFixedOffsetWidth({ fixedOffsetWidth, isLeftFixed, cell }) { - let siblingProp = isLeftFixed ? 'nextElementSibling' : 'previousElementSibling' - let tempCellElem = cell[siblingProp] - - while (tempCellElem) { - if (hasClass(tempCellElem, 'fixed__hidden')) { - break - } else if (!hasClass(tempCellElem, 'col__group')) { - fixedOffsetWidth += tempCellElem.offsetWidth - } - - tempCellElem = tempCellElem[siblingProp] - } - - return fixedOffsetWidth -} - -function updateResizableToolbar($table) { - if ($table.$toolbar) { - $table.$toolbar.updateResizable() - } -} - -function modifyTableColumn({ fixedColumn, fixedType, scrollXLoad, tableColumn }) { - if (scrollXLoad && fixedType) { - tableColumn = fixedColumn - } - - return tableColumn -} - -function renderTable(args) { - let { $table, _vm, allAlign, allColumnHeaderOverflow, allHeaderAlign, border, columnKey, fixedType } = args - let { headerCellClassName, headerColumn, headerRowClassName, headerSuffixIconAbsolute } = args - let { highlightCurrentColumn, isDragHeaderSorting, mouseConfig, overflowX, resizable, sortOpts } = args - let { tableColumn, tableLayout, tableListeners } = args - let args1 = { $table, _vm, allAlign, allColumnHeaderOverflow, allHeaderAlign, border, columnKey, fixedType } - - Object.assign(args1, { headerCellClassName, headerColumn, headerRowClassName, headerSuffixIconAbsolute }) - Object.assign(args1, { highlightCurrentColumn, isDragHeaderSorting, mouseConfig }) - Object.assign(args1, { overflowX, resizable, sortOpts, tableListeners }) - - return h( - 'table', - { - class: 'tiny-grid__header', - style: { tableLayout }, - attrs: { cellspacing: 0, cellpadding: 0, border: 0 }, - ref: 'table' - }, - [ - // 列宽 - renderTableColgroup(tableColumn), - // 头部 - renderTableThead(args1) - ] - ) -} - -const documentOnmouseup = function ({ oldMousemove, oldMouseup, column, isRightFixed, dragPosLeft, dragLeft, resizeBarElem, $table, params }) { - document.onmousemove = oldMousemove - document.onmouseup = oldMouseup - - let resizeWidth = column.renderWidth + (isRightFixed ? dragPosLeft - dragLeft : dragLeft - dragPosLeft) - resizeWidth = typeof resizeWidth === 'number' ? resizeWidth : parseInt(resizeWidth, 10) || 40 - column.resizeWidth = resizeWidth < 40 ? 40 : resizeWidth - - resizeBarElem.style.display = 'none' - removeClass($table.$el, 'tiny-grid-cell__resize') - Object.assign($table, { _isResize: false, _lastResizeTime: Date.now() }) - - $table.analyColumnWidth() - $table.recalculate(true) - updateResizableToolbar($table) - emitEvent($table, 'resizable-change', [params]) -} - -export default { - name: `${$prefix}GridHeader`, - props: { - collectColumn: Array, - fixedColumn: Array, - fixedType: String, - size: String, - isGroup: Boolean, - tableColumn: Array, - tableData: Array, - visibleColumn: Array - }, - watch: { - tableColumn() { - this.uploadColumn() - } - }, - data() { - return { - headerColumn: [] - } - }, - mounted() { - let { $el, $parent: $table, $refs, fixedType } = this - let elemStore = $table.elemStore - let keyPrefix = `${fixedType || 'main'}-header-` - - elemStore[`${keyPrefix}wrapper`] = $el - elemStore[`${keyPrefix}table`] = $refs.table - elemStore[`${keyPrefix}colgroup`] = $refs.colgroup - elemStore[`${keyPrefix}list`] = $refs.thead - elemStore[`${keyPrefix}x-space`] = $refs.xSpace - elemStore[`${keyPrefix}repair`] = $refs.repair - }, - created() { - this.uploadColumn() - }, - render() { - let { $parent: $table, fixedColumn, fixedType, headerColumn, tableColumn } = this - let { align: allAlign, border, columnKey, headerAlign: allHeaderAlign } = $table - let { headerCellClassName, headerRowClassName, headerSuffixIconAbsolute } = $table - let { highlightCurrentColumn, isDragHeaderSorting, mouseConfig = {}, overflowX } = $table - let { resizable, scrollXLoad, showHeaderOverflow: allColumnHeaderOverflow } = $table - let { sortOpts, tableLayout, tableListeners } = $table - // 横向滚动渲染 - tableColumn = modifyTableColumn({ fixedColumn, fixedType, scrollXLoad, tableColumn }) - - let args = { $table, _vm: this, allAlign, allColumnHeaderOverflow, allHeaderAlign, border, columnKey, fixedType } - - Object.assign(args, { headerCellClassName, headerColumn, headerRowClassName, headerSuffixIconAbsolute }) - Object.assign(args, { highlightCurrentColumn, isDragHeaderSorting, mouseConfig, overflowX, resizable, sortOpts }) - Object.assign(args, { tableColumn, tableLayout, tableListeners }) - - return h( - 'div', - { - class: ['tiny-grid__header-wrapper', fixedType ? `fixed-${fixedType}__wrapper` : 'body__wrapper'] - }, - [ - renderXSpace({ fixedType }), - renderTable(args), - // 其他 - renderRepair() - ] - ) - }, - methods: { - uploadColumn() { - this.headerColumn = this.isGroup ? convertToRows(this.collectColumn) : [this.$parent.scrollXLoad && this.fixedType ? this.fixedColumn : this.tableColumn] - }, - resizeMousedown(event, params) { - let { $el, $parent: $table, fixedType } = this - let { clientX: dragClientX, target: dragBtnElem } = event - let { column } = params - let { dragLeft = 0, minInterval = 36, fixedOffsetWidth = 0 } = {} - let { leftContainer, resizeBar: resizeBarElem, rightContainer, tableBody } = $table.$refs - let { cell = dragBtnElem.parentNode, dragBtnWidth = dragBtnElem.clientWidth } = {} - let { pos = getOffsetPos(dragBtnElem, $el), tableBodyElem = tableBody.$el } = {} - let dragMinLeft = pos.left - cell.clientWidth + dragBtnWidth + minInterval - let dragPosLeft = pos.left + Math.floor(dragBtnWidth / 2) - let { isRightFixed = fixedType === 'right', isLeftFixed = fixedType === 'left' } = {} - let { oldMousemove = document.onmousemove, oldMouseup = document.onmouseup } = {} - - if (isLeftFixed || isRightFixed) { - fixedOffsetWidth = computeFixedOffsetWidth({ fixedOffsetWidth, isLeftFixed, cell }) - dragPosLeft = computeDragPosLeft({ dragPosLeft, fixedOffsetWidth, isRightFixed, rightContainer }) - } - - // 处理拖动事件 - let handleMousemoveEvent = function (event) { - event.stopPropagation() - event.preventDefault() - - let { offsetX = event.clientX - dragClientX, left = offsetX + dragPosLeft } = {} - let scrollLeft = fixedType ? 0 : tableBodyElem.scrollLeft - let args = { cell, dragMinLeft, dragPosLeft, fixedOffsetWidth, isLeftFixed, isRightFixed } - Object.assign(args, { left, leftContainer, minInterval, rightContainer, tableBodyElem }) - - let ret = computeDragLeft(args) - left = ret.left - dragMinLeft = ret.dragMinLeft - dragLeft = ret.dragLeft - resizeBarElem.style.left = `${dragLeft - scrollLeft}px` - } - - resizeBarElem.style.display = 'block' - addClass($table.$el, 'tiny-grid-cell__resize') - $table._isResize = true - - document.onmousemove = handleMousemoveEvent - document.onmouseup = () => { - documentOnmouseup({ oldMousemove, oldMouseup, column, isRightFixed, dragPosLeft, dragLeft, resizeBarElem, $table, params }) - } - handleMousemoveEvent(event) - } - } -} diff --git a/packages/grid/src/menu/src/children.js b/packages/grid/src/menu/src/children.js deleted file mode 100644 index f555dfeea..000000000 --- a/packages/grid/src/menu/src/children.js +++ /dev/null @@ -1,113 +0,0 @@ -/** - * MIT License - * - * Copyright (c) 2019 Xu Liangzhan - * - * Permission is hereby granted, free of charge, to any person obtaining a copy - * of this software and associated documentation files (the "Software"), to deal - * in the Software without restriction, including without limitation the rights - * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell - * copies of the Software, and to permit persons to whom the Software is - * furnished to do so, subject to the following conditions: - * - * The above copyright notice and this permission notice shall be included in all - * copies or substantial portions of the Software. - * - * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR - * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, - * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE - * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER - * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, - * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE - * SOFTWARE. - * - */ -import { getFuncText, getDomNode } from '@opentiny/vue-renderless/grid/utils' -import { h, $prefix } from '@opentiny/vue-common' - -export default { - name: $prefix + 'GridContextMenuChild', - props: { - item: Object, - gIndex: Number, - index: Number, - show: Boolean, - ctxMenuStore: Object, - tableInstance: Object - }, - render() { - const { tableInstance, item, gIndex, index, show, ctxMenuStore } = this - const { toKebab, getEventTargetNode } = tableInstance - - return h( - 'ul', - { - style: { left: '-9999999px' }, - class: ['tiny-grid-menu__clild-wrapper', { show }] - }, - item.children.map((child, cIndex) => - // prettier-ignore - child.visible === false - ? [null] - : h( - 'li', - { - class: { 'link__disabled': child.disabled, 'link__active': child === ctxMenuStore.selectChild }, - key: `${gIndex}_${index}_${cIndex}` - }, - [ - h( - 'a', - { - class: `tiny-grid-menu__link ${toKebab(item.code)}`, - on: { - click(event) { - tableInstance.ctxMenuLinkEvent(event, child) - }, - mouseover(event) { - tableInstance.ctxMenuMouseoverEvent(event, item, child) - }, - mouseout(event) { - if(!getEventTargetNode(event, document.body, toKebab(item.code)).flag) { - tableInstance.ctxMenuMouseoutEvent(event, item, child) - } - } - } - }, - [ - child.prefixIcon ? h(child.prefixIcon, { class: 'tiny-grid-menu__link-prefix' }) : [null], - h('span', { class: 'tiny-grid-menu__link-content' }, getFuncText(child.name)) - ] - ) - ] - ) - ) - ) - }, - watch: { - show(value) { - if (value) { - this.$el.style.top = '0px' - this.$nextTick(() => { - const { tableInstance, $el } = this - const { width, height, bottom } = $el.getBoundingClientRect() - const { visibleHeight, visibleWidth } = getDomNode() - const ctxElem = tableInstance.$refs.ctxWrapper.$el - const target = tableInstance.ctxMenuStore.target - const { width: ctxWidth, right: ctxRight } = ctxElem.getBoundingClientRect() - - if (width + ctxRight > visibleWidth - 6) { - $el.style.left = -6 - width + 'px' - } else { - $el.style.left = ctxWidth + 'px' - } - - if (bottom > visibleHeight) { - let offset = (target && target.clientHeight) || 0 - $el.style.top = offset - height + 'px' - } - }) - } - } - } -} diff --git a/packages/grid/src/table/src/table.js b/packages/grid/src/table/src/table.js deleted file mode 100644 index 826fec2d3..000000000 --- a/packages/grid/src/table/src/table.js +++ /dev/null @@ -1,914 +0,0 @@ -/** - * MIT License - * - * Copyright (c) 2019 Xu Liangzhan - * - * Permission is hereby granted, free of charge, to any person obtaining a copy - * of this software and associated documentation files (the "Software"), to deal - * in the Software without restriction, including without limitation the rights - * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell - * copies of the Software, and to permit persons to whom the Software is - * furnished to do so, subject to the following conditions: - * - * The above copyright notice and this permission notice shall be included in all - * copies or substantial portions of the Software. - * - * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR - * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, - * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE - * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER - * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, - * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE - * SOFTWARE. - * - */ -import { h, hooks, $prefix } from '@opentiny/vue-common' -import Tooltip from '@opentiny/vue-tooltip' -import { extend } from '@opentiny/vue-renderless/common/object' -import { isEmptyObject, isObject, isNull } from '@opentiny/vue-renderless/common/type' -import { uniqueId, template, toNumber, isBoolean } from '@opentiny/vue-renderless/grid/static/' -import { getRowkey, GlobalEvent, hasChildrenList, getListeners } from '@opentiny/vue-renderless/grid/utils' -import TINYGrid from '../../adapter' -import GridHeader from '../../header' -import GridFooter from '../../footer' -import GridBody from '../../body' -import GridFilter from '../../filter' -import GridMenu from '../../menu' -import GridLoading from '../../loading' -import methods from './methods' -import GlobalConfig from '../../config' -import { error } from '../../tools' -import { clearOnTableUnmount } from './strategy' - -function verifyConfig(_vm) { - if (!getRowkey(_vm)) { - error('ui.grid.error.rowIdEmpty') - } - - if (!TINYGrid._edit && _vm.editConfig) { - throw new Error(template(error('ui.grid.error.reqModule'), { name: 'Edit' })) - } - - if (!TINYGrid._valid && _vm.editRules) { - throw new Error(template(error('ui.grid.error.reqModule'), { name: 'Validator' })) - } - - if (!TINYGrid._keyboard && (_vm.keyboardConfig || _vm.mouseConfig)) { - throw new Error(template(error('ui.grid.error.reqModule'), { name: 'Keyboard' })) - } - - if (!TINYGrid._resize && _vm.autoResize) { - throw new Error(template(error('ui.grid.error.reqModule'), { name: 'Resize' })) - } -} - -function mergeScrollDirStore(scrollDir, scrollDirStore) { - if (scrollDir) { - Object.assign(scrollDirStore, { - startIndex: 0, - visibleIndex: 0, - adaptive: isBoolean(scrollDir.adaptive) ? scrollDir.adaptive : true, - renderSize: toNumber(scrollDir.rSize), - offsetSize: toNumber(scrollDir.oSize) - }) - } -} - -function loadStatic(data, _vm) { - // 此段代码与 watch(data) 功能重复,只在配置了 data 属性后生效 - if (data && data.length > 0) { - _vm.loadTableData(data, true).then(() => { - _vm.handleDefault() - _vm.updateStyle() - }) - } -} - -function mergeTreeConfig(_vm) { - if (_vm.treeConfig) { - const { ordered } = _vm.treeConfig - - if (isNull(ordered)) { - _vm.treeConfig.ordered = true - } - } -} - -function initDrop(_vm) { - const dropConfig = _vm.dropConfig - - if (dropConfig) { - const { plugin, column = true, row = true } = dropConfig - - if (plugin) { - column && _vm.columnDrop() - row && _vm.rowDrop() - } - } -} - -const renderEmptyPartFn = (opt) => { - const { _vm, tableData, $slots, renderEmpty } = opt - return () => { - let emptyPartVnode = null - - if (_vm.isCenterEmpty && !tableData.length) { - let emptyVnodes - - if ($slots.empty) { - emptyVnodes = $slots.empty.call(_vm, h) - } else if (renderEmpty) { - emptyVnodes = [renderEmpty(h, _vm)] - } else { - emptyVnodes = [h('p', { class: 'tiny-grid__empty-img' }), h('span', { class: 'tiny-grid__empty-text' }, GlobalConfig.i18n('ui.grid.emptyText'))] - } - - emptyPartVnode = h('div', { class: 'empty-center-block' }, emptyVnodes) - } - - return emptyPartVnode - } -} - -const renderFooterFn = (opt) => { - const { showFooter, footerData, footerMethod, tableColumn, visibleColumn, vSize } = opt - return () => { - let tableFooterVnode = [null] - - if (showFooter) { - tableFooterVnode = h(GridFooter, { - props: { footerData, footerMethod, tableColumn, visibleColumn, size: vSize }, - ref: 'tableFooter' - }) - } - - return tableFooterVnode - } -} - -/** - * 渲染浮固定列 - */ -function renderFixed(h, $table, fixedType) { - let { collectColumn, columnStore, footerData, isGroup, showFooter, showHeader, tableColumn, tableData, vSize, visibleColumn } = $table - let fixedColumn = columnStore[`${fixedType}List`] - - const props = { fixedType, tableData, tableColumn, visibleColumn, collectColumn, size: vSize, fixedColumn, isGroup } - - // prettier-ignore - return h( - 'div', - { - class: `tiny-grid__fixed-${ fixedType }-wrapper`, - ref: `${fixedType }Container` - }, - [ - showHeader ? h(GridHeader, { props, ref: `${fixedType}Header` }) : null, - h(GridBody, { props, ref: `${fixedType}Body` }), - showFooter - ? h(GridFooter, { - props: { fixedType, footerData, tableColumn, visibleColumn, size: vSize, fixedColumn }, - ref: `${fixedType}Footer` - }) - : null - ] - ) -} - -const renderResizeBarFn = (opt) => { - const { isResizable, overflowX, scrollbarHeight } = opt - return () => { - let resizeBarVnode = [null] - - if (isResizable) { - resizeBarVnode = h('div', { - class: 'tiny-grid__resizable-bar', - style: overflowX ? { 'padding-bottom': `${scrollbarHeight}px` } : null, - ref: 'resizeBar', - key: 'tinyGridResizeBar' - }) - } - - return resizeBarVnode - } -} - -const renderPluginWrapperFn = (opt) => { - const { hasFilter, optimizeOpts, filterStore, isCtxMenu, ctxMenuStore, hasTip, tooltipContentOpts } = opt - const { editRules, validOpts, height, tableData, vaildTipOpts, id, _vm } = opt - return () => { - let filterVnode = [null] - let ctxMenuVnode = [null] - let tooltipVnode = [null] - let errorTooltipVnode = [null] - - if (hasFilter) { - filterVnode = h(GridFilter, { - props: { optimizeOpts, filterStore }, - ref: 'filterWrapper' - }) - } - - if (isCtxMenu) { - ctxMenuVnode = h(GridMenu, { props: { ctxMenuStore }, ref: 'ctxWrapper' }) - } - if (hasTip) { - tooltipVnode = h(Tooltip, { ref: 'tooltip', props: tooltipContentOpts }) - } - - if (hasTip && editRules && (validOpts.message === 'default' ? !height : validOpts.message === 'tooltip')) { - errorTooltipVnode = h(Tooltip, { - class: 'tiny-grid__valid-error', - props: validOpts.message === 'tooltip' || tableData.length === 1 ? vaildTipOpts : null, - ref: 'validTip' - }) - } - - return h( - 'div', - { - class: `tiny-grid${id}-wrapper ${_vm.$attrs.staticClass || ''}`, - ref: 'tableWrapper' - }, - [ - // 筛选 - filterVnode, - // 快捷菜单 - ctxMenuVnode, - // Ellipsis tooltip - tooltipVnode, - // valid error tooltip - errorTooltipVnode - ] - ) - } -} - -const renderSelectToolbarFn = (opt) => { - const { selectToolbar, selectToolbarStore, renderedToolbar } = opt - return () => { - let selectToolbarVnode = [null] - - if (selectToolbar) { - selectToolbarVnode = h( - 'div', - { - ref: 'selectToolbar', - class: 'tiny-grid__select-toolbar', - style: [ - selectToolbarStore.layout, - { - visibility: selectToolbarStore.visible ? 'visible' : 'hidden' - } - ] - }, - renderedToolbar ? renderedToolbar : [null] - ) - } - - return selectToolbarVnode - } -} - -function getRenderer(opt) { - const { $slots, _vm, leftList, optimizeOpts, overflowX, props, rightList, showFooter, showHeader, tableColumn, tableData, vSize, visibleColumn } = opt - const { $grid, ctxMenuStore, editRules, filterStore, footerData, footerMethod, hasFilter, hasTip, height, id } = _vm - const { isCtxMenu, isResizable, renderEmpty, scrollbarHeight, selectToolbarStore, tooltipContentOpts, vaildTipOpts, validOpts } = _vm - const { selectToolbar, renderedToolbar } = $grid - - const renderHeader = () => (showHeader ? h(GridHeader, { ref: 'tableHeader', props }) : [null]) - const renderEmptyPart = renderEmptyPartFn({ _vm, tableData, $slots, renderEmpty }) - const renderFooter = renderFooterFn({ showFooter, footerData, footerMethod, tableColumn, visibleColumn, vSize }) - - const renderFixedLeft = () => (leftList && leftList.length && overflowX ? renderFixed(h, _vm, 'left') : [null]) - const renderFixedRight = () => (rightList && rightList.length && overflowX ? renderFixed(h, _vm, 'right') : [null]) - - const renderResizeBar = renderResizeBarFn({ isResizable, overflowX, scrollbarHeight }) - - const arg1 = { hasFilter, optimizeOpts, filterStore, isCtxMenu, ctxMenuStore, hasTip, tooltipContentOpts } - const arg2 = { editRules, validOpts, height, tableData, vaildTipOpts, id, _vm } - const renderPluginWrapper = renderPluginWrapperFn(Object.assign(arg1, arg2)) - - const renderSelectToolbar = renderSelectToolbarFn({ selectToolbar, selectToolbarStore, renderedToolbar }) - - return { - renderHeader, - renderEmptyPart, - renderFooter, - renderFixedLeft, - renderFixedRight, - renderResizeBar, - renderPluginWrapper, - renderSelectToolbar - } -} - -function getTableAttrs(args) { - let { vSize, editConfig, showHeader, showFooter, overflowY, overflowX, leftList, rightList, showOverflow } = args - let { showHeaderOverflow, highlightCell, optimizeOpts, stripe, border, isGroup, mouseConfig } = args - let { loading, highlightHoverRow, highlightHoverColumn } = args - - const map = { - showHeader: 'show__head', - showFooter: 'show__foot', - overflowY: 'scroll__y', - overflowX: 'scroll__x', - fixedLeft: 'fixed__left', - fixedRight: 'fixed__right', - loading: 'is__loading', - highlightHoverRow: 'row__highlight', - highlightHoverColumn: 'column__highlight' - } - - return { - class: { - 'tiny-grid': 1, - [`size__${vSize}`]: vSize, - 'tiny-grid-editable': editConfig, - [map.showHeader]: showHeader, - [map.showFooter]: showFooter, - [map.overflowY]: overflowY, - [map.overflowX]: overflowX, - [map.fixedLeft]: leftList.length, - [map.fixedRight]: rightList.length, - 'all-overflow': showOverflow, - 'all-head-overflow': showHeaderOverflow, - 'tiny-grid-cell__highlight': highlightCell, - 'tiny-grid__animat': optimizeOpts.animat, - 'tiny-grid__stripe': stripe, - 'tiny-grid__border': border || isGroup, - 'tiny-grid__checked': mouseConfig.checked, - 'mark-insert': editConfig && editConfig.markInsert, - 'edit__no-border': editConfig && editConfig.showBorder === false, - [map.loading]: loading, - [map.highlightHoverRow]: highlightHoverRow, - [map.highlightHoverColumn]: highlightHoverColumn - } - } -} - -const gridData = { - // 存储异步加载过的行\列数据 - asyncRenderMap: {}, - // 列分组配置 - collectColumn: [], - // 存放列相关的信息 - columnStore: { - autoList: [], - centerList: [], - leftList: [], - pxList: [], - pxMinList: [], - resizeList: [], - rightList: [], - scaleList: [], - scaleMinList: [] - }, - // 存放快捷菜单的信息 - ctxMenuStore: { - list: [], - selectChild: null, - selected: null, - showChild: false, - style: null, - visible: false - }, - // 当前行 - currentRow: null, - // 存放可编辑相关信息 - editStore: { - editorAutoRefreshKey: 0, - // 激活 - actived: { column: null, row: null }, - // 所有选中 - checked: { columns: [], rows: [], tColumns: [], tRows: [] }, - // 已复制源 - copyed: { columns: [], cut: false, rows: [] }, - indexs: { columns: [] }, - insertList: [], - removeList: [], - // 选中源 - selected: { column: null, row: null }, - titles: { columns: [] } - }, - // 已展开的行 - expandeds: [], - // 当前选中的筛选列 - filterStore: { - column: null, - condition: { input: '', relation: 'equals' }, - id: '', - multi: false, - options: [], - visible: false - }, - // 表尾合计数据 - footerData: [], - groupData: {}, - groupFolds: [], - // 所有列已禁用 - headerCheckDisabled: false, - id: uniqueId(), - // 是否全选 - isAllSelected: false, - // 多选属性,有选中且非全选状态 - isIndeterminate: false, - // 是否存在横向滚动条 - overflowX: false, - // 是否存在纵向滚动条 - overflowY: true, - // 存储滚动加载,上次滚动的位置 - scrollLoadStore: { bodyHeight: 0, scrollHeight: 0 }, - // 是否启用了横向 X 可视渲染方式加载 - scrollXLoad: false, - // 是否启用了纵向 Y 可视渲染方式加载 - scrollYLoad: false, - // 横向滚动条的高度 - scrollbarHeight: 0, - // 纵向滚动条的宽度 - scrollbarWidth: 0, - // 单选属性,选中行 - selectRow: null, - // 存放多选工具栏相关信息 - selectToolbarStore: { - layout: { height: 0, left: 0, top: 0, width: 0, zIndex: 1 }, - visible: false - }, - // 多选属性,已选中的列 - selection: [], - // 渲染的列 - tableColumn: [], - // 渲染中的数据 - tableData: [], - // 完整所有列 - tableFullColumn: [], - // tooltip提示内容 - tooltipContent: '', - // tooltip提示内容是否处理换行字符 - tooltipContentPre: false, - // 已展开树节点 - treeExpandeds: [], - // 树节点不确定状态的列表 - treeIndeterminates: [], - // 存放数据校验相关信息 - validStore: { - column: null, - content: '', - isArrow: false, - row: null, - rule: null, - visible: false - }, - // 校验tip提示内容 - validTipContent: '', - // 在编辑模式下 单元格在失去焦点验证的状态 - validatedMap: {}, - // 显示的列 - visibleColumn: [] -} -const getTableData = () => { - const tableData = { - // 条件处理后数据 - afterFullData: [], - elemStore: {}, - // 表尾高度 - footerHeight: 0, - // 缓存数据集 - fullAllDataRowIdData: {}, - fullAllDataRowMap: new Map(), - fullColumnIdData: {}, - fullColumnMap: new Map(), - fullDataRowIdData: {}, - fullDataRowMap: new Map(), - // 缓存树形表格行数据以及其父级行数据的映射关系 - parentRowMap: new Map(), - // 临时插入数据集 - temporaryRows: [], - // 表头高度 - headerHeight: 0, - // 最后滚动位置 - lastScrollLeft: 0, - lastScrollTop: 0, - // 表格父容器的高度 - parentHeight: 0, - scrollDirection: 'N', // N,X,Y (滚动方向) - // 存放横向 X 虚拟滚动相关的信息 - scrollXStore: {}, - // 存放纵向 Y 虚拟滚动相关信息 - scrollYStore: {}, - // 完整数据 - tableFullData: [], - // 表格高度 - tableHeight: 0, - // 表格宽度 - tableWidth: 0, - // 存放 tooltip 相关信息 - tooltipStore: {} - } - return tableData -} - -export default { - name: `${$prefix}GridTable`, - props: { - // 所有的列对其方式 - align: { type: String, default: () => GlobalConfig.align }, - // 是否自动监听父容器变化去更新响应式表格宽高 - autoResize: Boolean, - // 是否带有纵向边框 - border: { type: Boolean, default: () => GlobalConfig.border }, - // 给单元格附加 className - cellClassName: [String, Function], - // 主键配置 - columnKey: Boolean, - // 所有列最小宽度,把剩余宽度按比例分配 - columnMinWidth: [Number, String], - // 所有列宽度 - columnWidth: [Number, String], - // 快捷菜单配置项 - contextMenu: Object, - // 初始化绑定动态列 - customs: Array, - // 数据 - data: [Array, Object], - // 行拖拽和列拖拽的配置 - dropConfig: Object, - // 编辑配置项 - editConfig: [Object, Boolean], - // 校验规则配置项 - editRules: Object, - // 展开行配置项 - expandConfig: Object, - // 列的宽度是否自撑开 - fit: { type: Boolean, default: () => GlobalConfig.fit }, - // 所有的表尾列的对齐方式 - footerAlign: { type: String, default: () => GlobalConfig.footerAlign }, - // 给表尾的单元格附加 className - footerCellClassName: [String, Function], - // 表尾合计的计算方法 - footerMethod: Function, - // 给表尾的行附加 className - footerRowClassName: [String, Function], - // 表尾合并行或列 - footerSpanMethod: Function, - // 所有的表头列的对齐方式 - headerAlign: { type: String, default: () => GlobalConfig.headerAlign }, - // 给表头的单元格附加 className - headerCellClassName: [String, Function], - // 给表头的行附加 className - headerRowClassName: [String, Function], - // 表头后置图标是否绝对定位 - headerSuffixIconAbsolute: Boolean, - // 表格的高度 - height: [Number, String], - // 激活单元格编辑时是否高亮显示 - highlightCell: Boolean, - // 是否要高亮当前选中列 - highlightCurrentColumn: { - type: Boolean, - default: () => GlobalConfig.highlightCurrentColumn - }, - // 是否要高亮当前选中行 - highlightCurrentRow: { - type: Boolean, - default: () => GlobalConfig.highlightCurrentRow - }, - // 鼠标移到列是否要高亮显示 - highlightHoverColumn: { - type: Boolean, - default: () => GlobalConfig.highlightHoverColumn - }, - // 鼠标移到行是否要高亮显示 - highlightHoverRow: { - type: Boolean, - default: () => GlobalConfig.highlightHoverRow - }, - // 是否开启异步列功能 - isAsyncColumn: Boolean, - isCenterEmpty: Boolean, - // 是否拖拽表头调整列顺序 - isDragHeaderSorting: Boolean, - // 按键配置项 - keyboardConfig: Object, - // 表格是否加载中 - loading: Boolean, - loadingComponent: Object, - // 表格的最大高度 - maxHeight: [Number, String], - // 表格的最小高度 - minHeight: [Number, String], - // 鼠标配置项 - mouseConfig: Object, - // 优化配置项 - optimization: Object, - // 额外的参数 - params: Object, - // 单选配置 - radioConfig: Object, - // 是否所有服务端筛选 - remoteFilter: Boolean, - // 是否所有服务端排序 - remoteSort: Boolean, - // 空数据渲染 - renderEmpty: Function, - renderRowAfter: Function, - // 所有列是否允许拖动列宽调整大小 - resizable: { type: Boolean, default: () => GlobalConfig.resizable }, - // 给行附加 className - rowClassName: [String, Function], - // 行分组配置 - rowGroup: Object, - rowId: { type: String, default: () => GlobalConfig.rowId }, - rowKey: Boolean, - // 行合并 - rowSpan: Array, - // 滚动加载 - scrollLoad: Object, - // 多选配置项 - selectConfig: Object, - // 是否显示表尾合计 - showFooter: Boolean, - // 是否显示表头 - showHeader: { type: Boolean, default: () => GlobalConfig.showHeader }, - // 设置表头所有内容过长时显示为省略号 - showHeaderOverflow: { - type: [Boolean, String], - default: () => GlobalConfig.showHeaderOverflow - }, - // 设置所有内容过长时显示为省略号 - showOverflow: { - type: [Boolean, String], - default: () => GlobalConfig.showOverflow - }, - // 表格的尺寸 - size: { type: String, default: () => GlobalConfig.size }, - // 排序配置项 - sortConfig: Object, - // 自定义所有列的排序方法 - sortMethod: Function, - // 全局开关控制所有的列是否可以排列 - sortable: { type: Boolean, default: true }, - // 合并行或列 - spanMethod: Function, - // 只对 type=index 时有效,自定义序号的起始值 - startIndex: { type: Number, default: 0 }, - // 是否带有斑马纹 - stripe: { type: Boolean, default: () => GlobalConfig.stripe }, - // 默认统计配置 - summaryConfig: Object, - // 是否自动根据状态属性去更新响应式表格宽高 - syncResize: Boolean, - tableLayout: String, - // tooltip 配置项 - tooltipConfig: { type: Object, default: () => ({}) }, - // 树形结构配置项 - treeConfig: Object, - // 校验配置项 - validConfig: Object - }, - provide() { - return { - $table: this, - // 嵌套表格屏蔽父表格列 - $column: null - } - }, - inject: { - $grid: { - default: null - } - }, - data() { - return extend(true, {}, gridData) - }, - computed: { - bodyCtxMenu() { - return this.ctxMenuOpts.body && this.ctxMenuOpts.body.options ? this.ctxMenuOpts.body.options : [] - }, - ctxMenuList() { - let rest = [] - this.ctxMenuStore.list.forEach((list) => list.forEach((item) => rest.push(item))) - return rest - }, - ctxMenuOpts() { - return extend(true, {}, GlobalConfig.menu, this.contextMenu) - }, - hasFilter() { - return this.tableColumn.some((column) => isObject(column.filter) && !isEmptyObject(column.filter)) - }, - hasTip() { - return TINYGrid._tooltip - }, - headerCtxMenu() { - return this.ctxMenuOpts.header && this.ctxMenuOpts.header.options ? this.ctxMenuOpts.header.options : [] - }, - isCtxMenu() { - return this.headerCtxMenu.length || this.bodyCtxMenu.length - }, - // 是否使用了分组表头 - isGroup() { - return this.collectColumn.some((column) => hasChildrenList(column)) - }, - isResizable() { - return this.resizable || this.tableFullColumn.some((column) => column.resizable) - }, - optimizeOpts() { - return extend(true, {}, GlobalConfig.optimization, this.optimization) - }, - sortOpts() { - return extend(true, {}, GlobalConfig.sortConfig, this.sortConfig) - }, - tooltipContentOpts() { - return extend( - true, - { - content: this.tooltipContent, - pre: this.tooltipContentPre, - renderContent: this.tooltipConfig.renderContent, - placement: 'right', - type: this.tooltipConfig.effect ? undefined : 'normal' - }, - this.tooltipConfig - ) - }, - vSize() { - return this.size || (this.$parent && this.$parent.size) || (this.$parent && this.$parent.vSize) - }, - vaildTipOpts() { - return extend( - true, - { - isArrow: false, - placement: 'top', - type: 'error', - content: this.validTipContent - }, - this.tooltipConfig - ) - }, - validOpts() { - return extend(true, { message: 'tooltip' }, GlobalConfig.validConfig, this.validConfig) - } - }, - watch: { - collectColumn(value) { - this.watchColumn(value) - }, - customs(value) { - !this.isUpdateCustoms && this.mergeCustomColumn(value) - this.isUpdateCustoms = false - }, - data(value) { - if (Array.isArray(value)) { - !this._isUpdateData && this.loadTableData(value, true).then(this.handleDefault) - this._isUpdateData = false - } - }, - 'data.length': { - handler() { - // 此处考虑性能问题不能深度监听data属性,再结合表格内部显示数据都是来自data的浅拷贝,所以只需要监听data的长度即可 - if (Array.isArray(this.data)) { - !this._isUpdateData && this.loadTableData(this.data, true).then(this.handleDefault) - this._isUpdateData = false - } - } - }, - height() { - this.$nextTick(this.recalculate) - }, - syncResize(value) { - value && this.$nextTick(this.recalculate) - }, - tableColumn() { - this.analyColumnWidth() - } - }, - created() { - let { scrollXStore, scrollYStore, optimizeOpts, data } = Object.assign(this, getTableData()) - let { scrollX, scrollY } = optimizeOpts - - verifyConfig(this) - mergeScrollDirStore(scrollX, scrollXStore) - mergeScrollDirStore(scrollY, scrollYStore) - loadStatic(data, this) - mergeTreeConfig(this) - - // 处理拖拽的逻辑 - initDrop(this) - - GlobalEvent.on(this, 'mousedown', this.handleGlobalMousedownEvent) - GlobalEvent.on(this, 'blur', this.handleGlobalBlurEvent) - GlobalEvent.on(this, 'mousewheel', this.handleGlobalMousewheelEvent) - GlobalEvent.on(this, 'keydown', this.handleGlobalKeydownEvent) - GlobalEvent.on(this, 'resize', this.handleGlobalResizeEvent) - GlobalEvent.on(this, 'contextmenu', this.handleGlobalContextmenuEvent) - }, - mounted() { - this.$nextTick().then(() => { - if (this.autoResize && TINYGrid._resize) { - this.bindResize() - } - - document.body.appendChild(this.$refs.tableWrapper) - }) - }, - activated() { - let { lastScrollLeft, lastScrollTop } = this - - if (lastScrollLeft || lastScrollTop) { - this.clearScroll() - .then(this.recalculate) - .then(() => this.scrollTo(lastScrollLeft, lastScrollTop)) - } - }, - setup(props, { slots, attrs, listeners }) { - hooks.onBeforeUnmount(() => { - const table = hooks.getCurrentInstance().proxy - const { elemStore, $refs } = table - const containerList = ['main', 'left', 'right'] - const tableWrapper = $refs.tableWrapper - - if (tableWrapper && tableWrapper.parentNode) { - tableWrapper.parentNode.removeChild(tableWrapper) - } - - if (TINYGrid._resize) { - table.unbindResize() - } - - table.closeFilter() - table.closeMenu() - - // 清除 拖动相关的引用 - table.columnSortable && table.columnSortable.destroy() - table.rowSortable && table.rowSortable.destroy() - - containerList.forEach((layout) => { - const ySpaceElem = elemStore[`${layout}-body-ySpace`] - - if (ySpaceElem) { - ySpaceElem.onscroll = null - } - }) - - GlobalEvent.off(table, 'mousedown') - GlobalEvent.off(table, 'blur') - GlobalEvent.off(table, 'mousewheel') - GlobalEvent.off(table, 'keydown') - GlobalEvent.off(table, 'resize') - GlobalEvent.off(table, 'contextmenu') - clearOnTableUnmount(table) - }) - - const tableListeners = getListeners(attrs, listeners) - - return { slots, tableListeners } - }, - render() { - let { border, collectColumn, columnStore, editConfig, highlightCell, highlightHoverColumn } = this - let { highlightHoverRow, isGroup, loading, loadingComponent, mouseConfig = {}, optimizeOpts } = this - let { overflowX, overflowY, showFooter, showHeader, showHeaderOverflow, showOverflow } = this - let { stripe, tableColumn, tableData, vSize, visibleColumn } = this - let { leftList, rightList } = columnStore - let $slots = this.slots - const props = { tableData, tableColumn, visibleColumn, collectColumn, size: vSize, isGroup } - let args = { $slots, _vm: this, leftList, optimizeOpts, overflowX, props, rightList } - - Object.assign(args, { showFooter, showHeader, tableColumn, tableData, vSize, visibleColumn }) - const renders = getRenderer(args) - const { renderHeader, renderEmptyPart, renderFooter, renderFixedLeft } = renders - const { renderFixedRight, renderResizeBar, renderPluginWrapper, renderSelectToolbar } = renders - - args = { vSize, editConfig, showHeader, showFooter, overflowY, overflowX, leftList, rightList, showOverflow } - Object.assign(args, { showHeaderOverflow, highlightCell, optimizeOpts, stripe, border, isGroup, mouseConfig }) - Object.assign(args, { loading, highlightHoverRow, highlightHoverColumn }) - - return h('div', getTableAttrs(args), [ - // 隐藏列 - h('div', { class: 'tiny-grid-hidden-column', ref: 'hideColumn' }, $slots.default && $slots.default()), - // 主头部 - renderHeader(), - // 居中显示空数据 - renderEmptyPart(), - // 主内容 - h(GridBody, { ref: 'tableBody', props }), - // 底部汇总 - renderFooter(), - // 左侧固定列 - renderFixedLeft(), - // 右侧固定列 - renderFixedRight(), - // 边框线 - h('div', { class: 'tiny-grid__border-line', key: 'tinyGridBorderLine' }), - // 列宽线 - renderResizeBar(), - // 加载中 - h(loadingComponent || GridLoading, { props: { visible: loading } }), - // 筛选、快捷菜单、Tip提示、校验提示 - renderPluginWrapper(), - // 多选工具栏 - renderSelectToolbar() - ]) - }, - methods -} diff --git a/packages/grid/src/table/src/utils/handleLocalFilter.js b/packages/grid/src/table/src/utils/handleLocalFilter.js deleted file mode 100644 index 368f36516..000000000 --- a/packages/grid/src/table/src/utils/handleLocalFilter.js +++ /dev/null @@ -1,166 +0,0 @@ -/** - * MIT License - * - * Copyright (c) 2019 Xu Liangzhan - * - * Permission is hereby granted, free of charge, to any person obtaining a copy - * of this software and associated documentation files (the "Software"), to deal - * in the Software without restriction, including without limitation the rights - * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell - * copies of the Software, and to permit persons to whom the Software is - * furnished to do so, subject to the following conditions: - * - * The above copyright notice and this permission notice shall be included in all - * copies or substantial portions of the Software. - * - * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR - * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, - * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE - * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER - * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, - * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE - * SOFTWARE. - * - */ -import { get } from '@opentiny/vue-renderless/grid/static/' - -export function handleFilterConditionCustom({ column, condition, method, property, row }) { - let ret = { flag: false, result: null } - - if (method && condition.type === 'custom') { - ret.result = method({ property, row, column }) - ret.flag = true - } - - return ret -} - -export function handleFilterConditionExtend({ column, condition, property, row }) { - let ret = { flag: false, result: null } - - if (condition.type === 'extend') { - let extendMethod = condition.method - - if (typeof extendMethod !== 'function') { - extendMethod = () => true - } - - ret.result = extendMethod({ value: get(row, property), row, column }) - ret.flag = true - } - - return ret -} - -function findRelationMethod(relation, relations) { - if (Array.isArray(relations)) { - let method - - for (let i = 0; i < relations.length; i++) { - if (relations[i] && relations[i].value === relation) { - method = relations[i].method - break - } - } - - return method - } -} - -export function handleFilterRelations({ inputFilter }) { - let relations = [] - - if (typeof inputFilter === 'object' && Array.isArray(inputFilter.relations)) { - relations = inputFilter.relations - } - - return relations -} - -function modifyValueCheckStr(value) { - if (!value && typeof value !== 'number') { - value = '' - } - return value -} - -function handleDefaultCheckStr({ column, input, relation, relationMethod, relations, result, row, value }) { - if (typeof relationMethod !== 'function') { - relationMethod = findRelationMethod(relation, relations) - } - - if (typeof relationMethod === 'function') { - result = relationMethod({ value, input, row, column }) - } - - return { relationMethod, result } -} - -/* - * 等于 equals - * 不等于unequal - * 大于greaterThan 小于lessThan - * 大于等于equalToGreaterThan - * 小于等于equalToLessThan - * 包含contains 不包含exclude - * 开头是startwith 结尾是endwith - */ -export function handleFilterCheckStr({ column, relationMethod, relations, row }) { - return (value, input, relation) => { - let result = false - value = modifyValueCheckStr(value) - switch (relation) { - case 'equals': - result = value == input - break - case 'unequal': - result = value != input - break - case 'greaterThan': - result = value > input - break - case 'lessThan': - result = value < input - break - case 'equalToGreaterThan': - result = value >= input - break - case 'equalToLessThan': - result = value <= input - break - case 'contains': - result = value.toString().indexOf(input) !== -1 - break - case 'startwith': - result = value.toString().indexOf(input) === 0 - break - case 'endwith': - result = value.toString().match(new RegExp(`${input}$`)) - break - default: { - let ret = handleDefaultCheckStr({ column, input, relation, relationMethod, relations, result, row, value }) - relationMethod = ret.relationMethod - result = ret.result - } - } - return result - } -} - -export function handleFilterCheck({ checkStr, empty, input, property, relation, row, valueList }) { - return () => { - const value = get(row, property) - - if (empty === true) { - return !value - } - if (empty === false) { - return !!value - } - - const checkInput = (!input && input !== 0) || checkStr(value, input, relation) // inputFilter - const checkEnum = !valueList.length || valueList.indexOf(value) > -1 // emunFilter 只有在多选时valueList才有值 - - return checkInput && checkEnum - } -} diff --git a/packages/grid/src/table/src/utils/handleSelectRow.js b/packages/grid/src/table/src/utils/handleSelectRow.js deleted file mode 100644 index ec59b0490..000000000 --- a/packages/grid/src/table/src/utils/handleSelectRow.js +++ /dev/null @@ -1,244 +0,0 @@ -/** - * MIT License - * - * Copyright (c) 2019 Xu Liangzhan - * - * Permission is hereby granted, free of charge, to any person obtaining a copy - * of this software and associated documentation files (the "Software"), to deal - * in the Software without restriction, including without limitation the rights - * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell - * copies of the Software, and to permit persons to whom the Software is - * furnished to do so, subject to the following conditions: - * - * The above copyright notice and this permission notice shall be included in all - * copies or substantial portions of the Software. - * - * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR - * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, - * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE - * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER - * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, - * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE - * SOFTWARE. - * - */ -import { eachTree, find, findTree, get, remove, set } from '@opentiny/vue-renderless/grid/static/' - -function onHalfSelectionProperty({ checkStrictly, property, row, treeConfig, treeIndeterminates, value }) { - if (property && treeConfig && !checkStrictly && value === -1) { - treeIndeterminates.push(row) - set(row, property, false) - } -} - -function onFullSelectionProperty({ checkMethod, checkStrictly, property, row, treeConfig, treeIndeterminates, value }) { - if (property && treeConfig && !checkStrictly && value !== -1) { - // 更新子节点状态 - eachTree( - [row], - (item, $rowIndex) => { - if (row === item || !checkMethod || checkMethod({ row: item, $rowIndex })) { - set(item, property, value) - } - }, - treeConfig - ) - remove(treeIndeterminates, (item) => item === row) - } -} - -function getVItemsOnParentSlctProp({ checkMethod, matchObj }) { - let tinyItems - - if (checkMethod) { - tinyItems = matchObj.items.filter((item, $rowIndex) => checkMethod({ row: item, $rowIndex })) - } else { - tinyItems = matchObj.items - } - - return tinyItems -} - -function getParentStatusOnParentSlctProp({ indeterminatesItem, matchObj, property, vItems, value }) { - let parentStatus - - if (indeterminatesItem) { - parentStatus = -1 - } else { - let selectItemArr = matchObj.items.filter((item) => get(item, property)) - let isEqual = selectItemArr.filter((item) => ~vItems.indexOf(item)).length === vItems.length - - parentStatus = isEqual ? true : selectItemArr.length || value === -1 ? -1 : false - } - - return parentStatus -} - -function onHalfSelection({ checkStrictly, property, row, selection, treeConfig, treeIndeterminates, value }) { - if (!property && treeConfig && !checkStrictly && value === -1) { - treeIndeterminates.push(row) - remove(selection, (item) => item === row) - } -} - -function getVItemsOnParentSelection({ checkMethod, matchObj }) { - let vItems - - if (checkMethod) { - vItems = matchObj.items.filter((item, $rowIndex) => checkMethod({ row: item, $rowIndex })) - } else { - vItems = matchObj.items - } - - return vItems -} - -function onFullSelection({ checkMethod, checkStrictly, property, row, selection, treeConfig, treeIndeterminates, value }) { - if (!property && treeConfig && !checkStrictly && value !== -1) { - // 更新子节点状态 - eachTree( - [row], - (item, $rowIndex) => { - if (row === item || !checkMethod || checkMethod({ row: item, $rowIndex })) { - if (value) { - selection.push(item) - } else { - remove(selection, (select) => select === item) - } - } - }, - treeConfig - ) - - remove(treeIndeterminates, (item) => item === row) - } -} - -function getParentStatusOnParentSelection({ indeterminatesItem, matchObj, selection, vItems, value }) { - let parentStatus - - if (indeterminatesItem) { - parentStatus = -1 - } else { - let selectItems = matchObj.items.filter((item) => selection.indexOf(item) > -1) - let isEqualItem = selectItems.filter((item) => vItems.indexOf(item) > -1).length === vItems.length - - parentStatus = isEqualItem ? true : selectItems.length || value === -1 ? -1 : false - } - - return parentStatus -} - -export function hasCheckField({ row }, value, _vm) { - let { tableFullData, selectConfig = {}, treeConfig, treeIndeterminates } = _vm - let { checkField: property, checkStrictly, checkMethod } = selectConfig - - onHalfSelectionProperty({ - checkStrictly, - property, - row, - treeConfig, - treeIndeterminates, - value - }) - - onFullSelectionProperty({ - checkMethod, - checkStrictly, - property, - row, - treeConfig, - treeIndeterminates, - value - }) - - if (property && treeConfig && !checkStrictly) { - // 如果存在父节点,更新父节点状态 - let matchObj = findTree(tableFullData, (item) => item === row, treeConfig) - - if (matchObj && matchObj.parent) { - let vItems = getVItemsOnParentSlctProp({ checkMethod, matchObj }) - let indeterminatesItem = find(matchObj.items, (item) => treeIndeterminates.indexOf(item) > -1) - let parentStatus = getParentStatusOnParentSlctProp({ - indeterminatesItem, - matchObj, - property, - vItems, - value - }) - - return _vm.handleSelectRow({ row: matchObj.parent }, parentStatus) - } - } - - if (property && !(treeConfig && !checkStrictly)) { - set(row, property, value) - } -} - -function onSelectTreeCheckStrictly({ row }, value, _vm) { - let { selection, tableFullData, selectConfig = {}, treeConfig, treeIndeterminates } = _vm - let { checkField: property, checkStrictly, checkMethod } = selectConfig - // 树表行半选 - onHalfSelection({ - checkStrictly, - property, - row, - selection, - treeConfig, - treeIndeterminates, - value - }) - // 树表行完全选中 - onFullSelection({ - checkMethod, - checkStrictly, - property, - row, - selection, - treeConfig, - treeIndeterminates, - value - }) - - if (!property && treeConfig && !checkStrictly) { - // 如果存在父节点,更新父节点状态 - let matchObj = findTree(tableFullData, (item) => item === row, treeConfig) - - if (matchObj && matchObj.parent) { - let vItems = getVItemsOnParentSelection({ checkMethod, matchObj }) - let indeterminatesItem = find(matchObj.items, (item) => treeIndeterminates.indexOf(item) > -1) - let parentStatus = getParentStatusOnParentSelection({ - indeterminatesItem, - matchObj, - selection, - vItems, - value - }) - - return _vm.handleSelectRow({ row: matchObj.parent }, parentStatus) - } - } -} - -function onSelectOther({ row }, value, _vm) { - let { selection, selectConfig = {}, treeConfig } = _vm - let { checkField: property, checkStrictly } = selectConfig - - if (!property && !(treeConfig && !checkStrictly)) { - if (value) { - if (selection.indexOf(row) === -1) { - selection.push(row) - } - } else { - remove(selection, (item) => item === row) - } - } -} - -export function hasNoCheckField({ row }, value, _vm) { - // 树表且父子关联 - onSelectTreeCheckStrictly({ row }, value, _vm) - // 其它情况 - onSelectOther({ row }, value, _vm) -} diff --git a/packages/grid/src/table/src/utils/setAllSelection.js b/packages/grid/src/table/src/utils/setAllSelection.js deleted file mode 100644 index 17f93c658..000000000 --- a/packages/grid/src/table/src/utils/setAllSelection.js +++ /dev/null @@ -1,125 +0,0 @@ -/** - * MIT License - * - * Copyright (c) 2019 Xu Liangzhan - * - * Permission is hereby granted, free of charge, to any person obtaining a copy - * of this software and associated documentation files (the "Software"), to deal - * in the Software without restriction, including without limitation the rights - * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell - * copies of the Software, and to permit persons to whom the Software is - * furnished to do so, subject to the following conditions: - * - * The above copyright notice and this permission notice shall be included in all - * copies or substantial portions of the Software. - * - * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR - * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, - * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE - * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER - * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, - * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE - * SOFTWARE. - * - */ -import { set, eachTree } from '@opentiny/vue-renderless/grid/static/' - -function pushSelectRow({ afterFullData, checkMethod, checkStrictly, property, selectRows, selection, treeConfig, value }) { - if (!checkStrictly && !property && treeConfig && value) { - eachTree( - afterFullData, - (row, $rowIndex) => { - if (!checkMethod || checkMethod({ row, $rowIndex })) { - selectRows.push(row) - } - }, - treeConfig - ) - } - - if (!checkStrictly && !property && treeConfig && !value && checkMethod) { - eachTree( - afterFullData, - (row, $rowIndex) => { - if (checkMethod({ row, $rowIndex }) ? 0 : selection.indexOf(row) > -1) { - selectRows.push(row) - } - }, - treeConfig - ) - } -} - -export function hasCheckFieldNoStrictly({ afterFullData, checkMethod, checkStrictly, property, selection, treeConfig, value }) { - if (!checkStrictly && property) { - let indexKey = `${treeConfig ? '$' : ''}rowIndex` - - let setValFn = (row, rowIndex) => { - if (!checkMethod || checkMethod({ row, [indexKey]: rowIndex })) { - set(row, property, value) - } - } - - let clearValFn = (row, rowIndex) => { - if (!checkMethod || (checkMethod({ row, [indexKey]: rowIndex }) ? 0 : selection.indexOf(row) > -1)) { - set(row, property, value) - } - } - - if (treeConfig) { - eachTree(afterFullData, value ? setValFn : clearValFn, treeConfig) - } else { - afterFullData.forEach(value ? setValFn : clearValFn) - } - } -} - -function filterSelectRow({ afterFullData, checkMethod, checkStrictly, property, selectRows, selection, treeConfig, value }) { - if (!checkStrictly && !property && !treeConfig && value && checkMethod) { - selectRows = afterFullData.filter((row, rowIndex) => selection.indexOf(row) > -1 || checkMethod({ row, rowIndex })) - } - - if (!checkStrictly && !property && !treeConfig && value && !checkMethod) { - selectRows = afterFullData.slice(0) - } - - if (!checkStrictly && !property && !treeConfig && !value && checkMethod) { - selectRows = afterFullData.filter((row, rowIndex) => (checkMethod({ row, rowIndex }) ? 0 : selection.indexOf(row) > -1)) - } - - return selectRows -} - -export function hasNoCheckFieldNoStrictly({ afterFullData, checkMethod, checkStrictly, property, selection, treeConfig, value }) { - let selectRows = [] - - pushSelectRow({ - afterFullData, - checkMethod, - checkStrictly, - property, - selectRows, - selection, - treeConfig, - value - }) - - selectRows = filterSelectRow({ - afterFullData, - checkMethod, - checkStrictly, - property, - selectRows, - selection, - treeConfig, - value - }) - - return selectRows -} - -export function setSelectionNoStrictly({ _vm, checkStrictly, reserve, selectRows, selection, value }) { - if (!checkStrictly) { - _vm.selection = value && reserve ? selection.concat(selectRows.filter((row) => selection.indexOf(row) === -1)) : selectRows - } -} diff --git a/packages/grid/src/validator/src/methods.js b/packages/grid/src/validator/src/methods.js deleted file mode 100644 index 1d1758abe..000000000 --- a/packages/grid/src/validator/src/methods.js +++ /dev/null @@ -1,339 +0,0 @@ -/** - * MIT License - * - * Copyright (c) 2019 Xu Liangzhan - * - * Permission is hereby granted, free of charge, to any person obtaining a copy - * of this software and associated documentation files (the "Software"), to deal - * in the Software without restriction, including without limitation the rights - * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell - * copies of the Software, and to permit persons to whom the Software is - * furnished to do so, subject to the following conditions: - * - * The above copyright notice and this permission notice shall be included in all - * copies or substantial portions of the Software. - * - * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR - * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, - * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE - * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER - * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, - * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE - * SOFTWARE. - * - */ -import { t } from '@opentiny/vue-locale' -import Validator from '@opentiny/vue-renderless/common/validate' -import { getFuncText, emitEvent, getCell } from '@opentiny/vue-renderless/grid/utils' -import { get, isFunction, isObject, isUndefined, find } from '@opentiny/vue-renderless/grid/static/' -import { adjustParams, hasNoEditRules, realValid } from './utils/beginValidate' -import { extend } from '@opentiny/vue-renderless/common/object' - -const isArr = Array.isArray - -class Rule { - constructor(rule) { - Object.assign(this, { - $options: rule, - max: rule.min, - maxWidth: rule.maxWidth, - min: rule.min, - pattern: rule.pattern, - required: rule.required, - trigger: rule.trigger, - type: rule.type, - validator: rule.validator - }) - } - get message() { - return getFuncText(this.$options.message) - } -} - -const onRejected = (opt, _this) => { - const { isAll, validRest, cb, afterFullData, treeConfig } = opt - return (params) => { - let args = isAll ? validRest : { [params.column.property]: params } - - let funcFinish = (args, reject, resolve) => () => { - opt.status = false - cb && cb(opt.status, args) - cb ? resolve() : reject(args) - } - - let funcPosAndFinish = (params, finish) => () => { - getCell(_this, params).then((activeCell) => { - params.cell = activeCell - _this.handleValidError(params) - finish() - }) - } - - let getLocatRow = (params) => { - let row = params.row - let rowIndex = afterFullData.indexOf(row) - return rowIndex > 0 ? afterFullData[rowIndex - 1] : row - } - - return new Promise((resolve, reject) => { - let finish = funcFinish(args, reject, resolve) - let posAndFinish = funcPosAndFinish(params, finish) - let locatRow = getLocatRow(params) - let isAutoPosFalse = _this.validOpts.autoPos === false - - isAutoPosFalse && finish() - !isAutoPosFalse && treeConfig && _this.scrollToTreeRow(locatRow).then(posAndFinish) - !isAutoPosFalse && !treeConfig && _this.scrollToRow(locatRow, true).then(posAndFinish) - }) - } -} - -export default { - // 对表格数据进行校验 - _validate(rows, cb) { - return this.beginValidate(rows, cb) - }, - // 与validate一致行为,区别就是会校验所有并返回所有不通过的列 - _fullValidate(rows, cb) { - return this.beginValidate(rows, cb, true) - }, - // 聚焦到校验通过的单元格并弹出校验错误提示 - handleValidError(params) { - let event = { type: 'valid-error', trigger: 'call' } - let next = () => this.showValidTooltip(params) - - this.handleActived(params, event).then(next) - }, - validatePromise(row, column, columnIndex, isAll, validRest) { - function onrejected({ _vm, reject, resolve }) { - return ({ rule, rules }) => { - let rest = { $table: _vm, column, columnIndex, row, rule, rules } - - rest.rowIndex = _vm.getRowIndex(row) - - if (!isAll) { - return reject(rest) - } - - validRest[column.property] = validRest[column.property] || [] - validRest[column.property].push(rest) - - return resolve() - } - } - - return new Promise((resolve, reject) => { - this.validCellRules('all', row, column) - .then(resolve) - .catch(onrejected({ _vm: this, reject, resolve })) - }) - }, - - /** - * 对表格数据进行校验 - * 如果传 row 指定行记录,则只验证传入的行 - * 如果传 rows 为多行记录,则只验证传入的行 - * 如果只传 callback 否则默认验证整个表格数据 - * 返回 Promise 对象,或者使用回调方式 - */ - - beginValidate(rows, cb, isAll) { - let { afterFullData, editRules, hasTreeExpand, treeConfig, treeOpts } = this - let { status = true, vaildDatas = afterFullData, validRest = {} } = {} - let ret = adjustParams(rows, cb, vaildDatas) - cb = ret.cb - vaildDatas = ret.vaildDatas - const opt = { isAll, validRest, cb, afterFullData, treeConfig, status } - - this.lastCallTime = Date.now() - this.clearValidate() - - if (!editRules) { - hasNoEditRules(cb, opt.status) - return Promise.resolve() - } - - let validParams = { _vm: this, editRules, isAll, validRest, treeConfig, hasTreeExpand, vaildDatas, treeOpts } - let rowValids = realValid(validParams) - - let onFulfilled = () => { - let ruleKeys = Object.keys(validRest) - - if (ruleKeys.length) { - return Promise.reject(validRest[ruleKeys[0]][0]) - } - - cb && cb(opt.status) - } - Promise.all(rowValids).then(onFulfilled).catch(onRejected(opt, this)) - return Promise.resolve() - }, - hasCellRules(type, row, { property }) { - if (!property || !this.editRules) { - return false - } - - let rules = get(this.editRules, property) - let handler = (rule) => type === 'all' || !rule.trigger || type === rule.trigger - - rules = !isArr(rules) && (isObject(rules) || isFunction(rules)) ? [rules] : rules - - return rules && find(rules, handler) - }, - - /** - * 校验数据: - * 按表格行顺序、列顺序依次校验(同步或异步); - * 根据校验规则的索引顺序依次校验,如果是异步则会等待校验完成才会继续校验下一列; - * 如果校验失败,则触发回调或者Promise,结果返回一个Boolean值; - * 如果是传回调方式这返回一个Boolean值和校验不通过列的错误消息; - * - * rule 配置: - * required为Boolean表示是否必填; - * max为Number表示最大长度; - * min为Number表示最小长度; - * validator为Function(rule, value, callback, {rules, row, column, rowIndex, columnIndex})进行自定义校验; - * trigger为blur|change表示触发方式(默认为空就行,除非特殊场景); - */ - validCellRules(type, row, column, defVal) { - let { editRules, rowId } = this - let { property } = column - let { descriptor = {}, model = {} } = {} - - if (property && editRules) { - let rules = get(editRules, property) - let cellValue = isUndefined(defVal) ? get(row, property) : defVal - if (isArr(rules)) { - rules.forEach((rule, index) => { - model[property + index] = cellValue - descriptor[property + index] = rule - }) - } else { - model[property] = cellValue - descriptor[property] = rules - } - } - - // 深度克隆,防止污染 editRules - let _descriptor = extend(true, {}, descriptor) - let validator = new Validator(_descriptor, t) - let executor = (resolve, reject) => { - let validArgs = { - firstFields: true, - first: true, - custom: { row, column } - } - let onrejected1 = ({ fields }) => { - let cellErrors = Object.keys(fields).map((prop) => { - let rules = _descriptor[prop] - _descriptor[prop] = !rules.message ? Object.assign(rules, { message: fields[prop][0].message }) : rules - return new Rule(_descriptor[prop]) - }) - - reject({ rules: cellErrors, rule: cellErrors[0] }) - } - validator.validate(model, validArgs).then(resolve).catch(onrejected1) - } - let onfulfilled = () => { - this.validatedMap[`${column.id}-${row[rowId]}`] = false - return Promise.resolve() - } - let onrejected = (errors) => { - this.validatedMap[`${column.id}-${row[rowId]}`] = true - return Promise.reject(errors) - } - - return new Promise(executor).then(onfulfilled).catch(onrejected) - }, - _clearValidate() { - let src = { - column: null, - content: '', - row: null, - rule: null, - visible: false - } - - Object.assign(this.validStore, src) - this.clostValidTooltip(undefined) - - return this.$nextTick() - }, - // 触发校验 - triggerValidate(type) { - let { editConfig, editRules, editStore, validStore } = this - let actived = editStore.actived - - if (!actived.row || !editRules) { - return Promise.resolve() - } - - let { cell, column, row } = actived.args - - if (!this.hasCellRules(type, row, column)) { - return Promise.resolve() - } - - let onfulfilled = () => { - editConfig.mode === 'row' && validStore.visible && validStore.row === row && validStore.column === column && this.clearValidate() - } - let onrejected = ({ rule }) => { - // 如果校验不通过与触发方式一致,则聚焦提示错误,否则跳过并不作任何处理 - if (rule.trigger && type !== rule.trigger) { - return Promise.resolve() - } - - let rest = { cell, column, row, rule } - this.showValidTooltip(rest) - - return Promise.reject(rest) - } - - return this.validCellRules(type, row, column).then(onfulfilled).catch(onrejected) - }, - // 弹出校验错误提示 - showValidTooltip(params) { - let { $refs, height, tableData, validOpts } = this - let { cell, column, row, rule } = params - let content = rule.message - let validTip = $refs.validTip - let msgCfg = validOpts.message - let showMsg = msgCfg === 'tooltip' || (msgCfg === 'default' && !height && tableData.length < 2) - - this.$nextTick(() => { - // 这里不能进行深拷贝,会对表格校验的判断造成影响,也不需要进行深拷贝 - Object.assign(this.validStore, { - row, - column, - rule, - content, - visible: true - }) - - if (validTip && showMsg) { - this.clostValidTooltip() - this.validTipContent = content - - validTip.state.referenceElm = cell - validTip.$refs.popper && (validTip.$refs.popper.style.display = 'none') - validTip.doDestroy() - validTip.setExpectedState(true) - - this.activateTooltipValid(validTip) - } - - emitEvent(this, 'valid-error', [params]) - }) - }, - // 关闭 validTip - clostValidTooltip() { - let validTip = this.$refs.validTip - - if (validTip) { - validTip.setExpectedState(false) - validTip.handleClosePopper() - } - - return this.$nextTick() - } -} diff --git a/packages/hrapprover/index.js b/packages/hrapprover/index.js deleted file mode 100644 index c054e6047..000000000 --- a/packages/hrapprover/index.js +++ /dev/null @@ -1,23 +0,0 @@ -import Hrapprover from './src/index' -import '@opentiny/vue-theme/hrapprover/index.css' - -Hrapprover.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Hrapprover.install = function (Vue) { - Vue.component(Hrapprover.name, Hrapprover) -} - -Hrapprover.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Hrapprover.install(window.Vue) - } -} - -export default Hrapprover diff --git a/packages/hrapprover/package.json b/packages/hrapprover/package.json deleted file mode 100644 index 46a43e87d..000000000 --- a/packages/hrapprover/package.json +++ /dev/null @@ -1,21 +0,0 @@ -{ - "name": "@opentiny/vue-hrapprover", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-dept": "~0.1.0", - "@opentiny/vue-radio": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0", - "@opentiny/vue-loading": "~0.1.0", - "@opentiny/vue-modal": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/hrapprover/src/index.js b/packages/hrapprover/src/index.js deleted file mode 100644 index 15e33a04d..000000000 --- a/packages/hrapprover/src/index.js +++ /dev/null @@ -1,32 +0,0 @@ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc.vue' - -const template = () => PCTemplate - -export default { - name: $prefix + 'Hrapprover', - props: { - ...$props, - modelValue: String, - approvalPerson: { - type: String, - default: '' - }, - disabled: { - type: Boolean, - default: false - }, - category: { - type: String, - default: '0303' - }, - title: String, - fetchHrapprover: Function, - fetchDeptList: Function, - fetchDeptByValue: Function, - fetchDept: Function - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/hrapprover/src/pc.vue b/packages/hrapprover/src/pc.vue deleted file mode 100644 index 812c6bbbf..000000000 --- a/packages/hrapprover/src/pc.vue +++ /dev/null @@ -1,78 +0,0 @@ - - - diff --git a/packages/icon/dot-download/index.js b/packages/icon/dot-download/index.js deleted file mode 100644 index ba4fcd1fb..000000000 --- a/packages/icon/dot-download/index.js +++ /dev/null @@ -1,15 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { svg } from '@opentiny/vue-common' -import DotDownload from '@opentiny/vue-theme/svgs/dot-download.svg' - -export default svg({ name: 'iconDotDownload', component: DotDownload }) \ No newline at end of file diff --git a/packages/icon/index.js b/packages/icon/index.js deleted file mode 100644 index 57ac76473..000000000 --- a/packages/icon/index.js +++ /dev/null @@ -1,945 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import IconAdd from './add' -import IconAdministrator from './administrator' -import IconAlignBaseline from './align-baseline' -import IconAlignCenter from './align-center' -import IconAlignFlexCenter from './align-flex-center' -import IconAlignFlexEnd from './align-flex-end' -import IconAlignFlexStart from './align-flex-start' -import IconAlignJustify from './align-justify' -import IconAlignLeft from './align-left' -import IconAlignRight from './align-right' -import IconAlignStretch from './align-stretch' -import IconAngularjs from './angularjs' -import IconApp from './app' -import IconApplication from './application' -import IconAreaChart from './area-chart' -import IconArrowDown from './arrow-down' -import IconArrowLeft from './arrow-left' -import IconArrowRight from './arrow-right' -import IconArrowUp from './arrow-up' -import IconAscending from './ascending' -import IconAssociation from './association' -import IconAttachment from './attachment' -import IconBarChart from './bar-chart' -import IconBefilter from './befilter' -import IconBoat from './boat' -import IconBoxSolid from './box-solid' -import IconBusy from './busy' -import IconCalculator from './calculator' -import IconCalendar from './calendar' -import IconCheckOut from './check-out' -import IconCheck from './check' -import IconCheckedLinear from './checked-linear' -import IconCheckedSur from './checked-sur' -import IconCheckedTrue from './checked-true' -import IconChevronDown from './chevron-down' -import IconChevronLeft from './chevron-left' -import IconChevronRight from './chevron-right' -import IconChevronUp from './chevron-up' -import IconClearFilter from './clear-filter' -import IconClockWork from './clock-work' -import IconCloseCircle from './close-circle' -import IconCloseSquare from './close-square' -import IconClose from './close' -import IconCloudDownload from './cloud-download' -import IconCloudUpload from './cloud-upload' -import IconCode from './code' -import IconCoin from './coin' -import IconColReverse from './col-reverse' -import IconCommission from './commission' -import IconConmentRefresh from './conment-refresh' -import IconCopySolid from './copy-solid' -import IconCopy from './copy' -import IconCourse from './course' -import IconCueL from './cue-l' -import IconCustom from './custom' -import IconCustomerService from './customer-service' -import IconCrop from './crop' -import IconDataSource from './data-source' -import IconDefault from './default' -import IconDefinedFiltration from './defined-filtration' -import IconDel from './del' -import IconDeletePage from './delete-page' -import IconDeleted from './deleted' -import IconDeltaDownO from './delta-down-o' -import IconDeltaDown from './delta-down' -import IconDeltaLeftO from './delta-left-o' -import IconDeltaLeft from './delta-left' -import IconDeltaRightO from './delta-right-o' -import IconDeltaRight from './delta-right' -import IconDeltaUpO from './delta-up-o' -import IconDeltaUp from './delta-up' -import IconDerive from './derive' -import IconDescending from './descending' -import IconDesktopView from './desktop-view' -import IconDialog from './dialog' -import IconDialog2 from './dialog2' -import IconDirectionCol from './direction-col' -import IconDirectionRow from './direction-row' -import IconDotChart from './dot-chart' -import IconDotDownload from './dot-download' -import IconDotIpv4 from './dot-ipv4' -import IconDoubleLeft from './double-left' -import IconDoubleRight from './double-right' -import IconDownO from './down-o' -import IconDown from './down' -import IconDownloadCloud from './download-cloud' -import IconDownloadLink from './download-link' -import IconDownload from './download' -import IconDraft from './draft' -import IconEdit from './edit' -import IconEditorTab from './editor-tab' -import IconEllipsis from './ellipsis' -import IconEmailAdd from './email-add' -import IconEmailCircle from './email-circle' -import IconEnd from './end' -import IconError from './error' -import IconEspaceAuto from './espace-auto' -import IconEspace from './espace' -import IconExcel from './excel' -import IconException from './exception' -import IconExclamation from './exclamation' -import IconExport from './export' -import IconExpressSearch from './express-search' -import IconEyeclose from './eyeclose' -import IconEyeopen from './eyeopen' - -import IconEditorAlignCenter from './editor-align-center' -import IconEditorAlignLeft from './editor-align-left' -import IconEditorAlignRight from './editor-align-right' -import IconEditorBackground from './editor-background' -import IconEditorBold from './editor-bold' -import IconEditorCode from './editor-code' -import IconEditorDeleteline from './editor-deleteline' -import IconEditorEraser from './editor-eraser' -import IconEditorItalic from './editor-italic' -import IconEditorLeftBorder from './editor-left-border' -import IconEditorList from './editor-list' -import IconEditorListDot from './editor-list-dot' -import IconEditorListNum from './editor-list-num' -import IconEditorMenuLeft from './editor-menu-left' -import IconEditorMenuRight from './editor-menu-right' -import IconEditorQuote from './editor-quote' -import IconEditorRedo from './editor-redo' -import IconEditorRightBorder from './editor-right-border' -import IconEditorSub from './editor-sub' -import IconEditorSubtitle from './editor-subtitle' -import IconEditorSuper from './editor-super' -import IconEditorTable from './editor-table' -import IconEditorTextcolor from './editor-textcolor' -import IconEditorTitle from './editor-title' -import IconEditorUnderline from './editor-underline' -import IconEditorUndo from './editor-undo' -import IconEditorVideo from './editor-video' -import IconFileCloudupload from './file-cloudupload' -import IconFileExcel from './file-excel' -import IconFile from './file' -import IconFilesCircle from './files-circle' -import IconFiles from './files' -import IconFiletext from './filetext' -import IconFileupload from './fileupload' -import IconFiltered from './filtered' -import IconFlag from './flag' -import IconFolderClosed from './folder-closed' -import IconFolderOpened from './folder-opened' -import IconFontColor from './font-color' -import IconFontFamily from './font-family' -import IconFontSize from './font-size' -import IconFontStyle from './font-style' -import IconFontWeight from './font-weight' -import IconFreezeLeft from './freeze-left' -import IconFreezeRight from './freeze-right' -import IconFrownO from './frown-o' -import IconFrown from './frown' -import IconFullscreen from './fullscreen' -import IconFullscreenLeft from './fullscreen-left' -import IconGrade from './grade' -import IconGroupTransfer from './group-transfer' -import IconGroup from './group' -import IconHalfchecked from './halfchecked' -import IconHalfselect from './halfselect' -import IconHeartempty from './heartempty' -import IconHelpCircle from './help-circle' -import IconHelpQuery from './help-query' -import IconHelpSolid from './help-solid' -import IconHelp from './help' -import IconHelpful from './helpful' -import IconHideLeft from './hide-left' -import IconHideRight from './hide-right' -import IconHideTopleft from './hide-topleft' -import IconImport from './import' -import IconInfoCircle from './info-circle' -import IconInfoSolid from './info-solid' -import IconInfo from './info' -import IconInformation from './information' -import IconJs from './js' -import IconJusitfyCenter from './jusitfy-center' -import IconJusitfyFlexEnd from './jusitfy-flex-end' -import IconJusitfySpaceAround from './jusitfy-space-around' -import IconJusitfySpaceBetween from './jusitfy-space-between' -import IconJustitfyFlexStart from './justitfy-flex-start' -import IconLanguage from './language' -import IconLeave from './leave' -import IconLeftFrozen from './left-frozen' -import IconLeftO from './left-o' -import IconLeftWard from './left-ward' -import IconLeft from './left' -import IconLineChart from './line-chart' -import IconLineHeight from './line-height' -import IconLineThrought from './line-throught' -import IconLink from './link' -import IconLoading from './loading' -import IconLock from './lock' -import IconMailContent from './mail-content' -import IconMail from './mail' -import IconMale from './male' -import IconMarkOn from './mark-on' -import IconMeh from './meh' -import IconMessageCircle from './message-circle' -import IconMinscreen from './minscreen' -import IconMinscreenLeft from './minscreen-left' -import IconMinusCircle from './minus-circle' -import IconMinusSquare from './minus-square' -import IconMinus from './minus' -import IconMobileView from './mobile-view' -import IconMobile from './mobile' -import IconMore from './more' -import IconNew from './new' -import IconNoPremission from './no-premission' -import IconNodeOpen from './node-open' -import IconNode from './node' -import IconNodejs from './nodejs' -import IconNone from './none' -import IconOffLine from './off-line' -import IconOnLine from './on-line' -import IconOperationfaildL from './operationfaild-l' -import IconOperationfaild from './operationfaild' -import IconOuterLink from './outer-link' -import IconPagelink from './pagelink' -import IconPagerFirst from './pager-first' -import IconPagerLast from './pager-last' -import IconPagerNext from './pager-next' -import IconPagerPrev from './pager-prev' -import IconPanelMax from './panel-max' -import IconPanelMini from './panel-mini' -import IconPanelNormal from './panel-normal' -import IconPauseCircle from './pause-circle' -import IconPause from './pause' -import IconPicture from './picture' -import IconPieChart from './pie-chart' -import IconPlusCircle from './plus-circle' -import IconPlusSquare from './plus-square' -import IconPlus from './plus' -import IconPopup from './popup' -import IconPreChecked from './pre-checked' -import IconPrintPreview from './print-preview' -import IconPushpin from './pushpin' -import IconRadio from './radio' -import IconRadioselected from './radioselected' -import IconReactjs from './reactjs' -import IconRedo from './redo' -import IconRefres from './refres' -import IconRenew from './renew' -import IconRepeat from './repeat' -import IconReplace from './replace' -import IconReplies from './replies' -import IconRightFrozen from './right-frozen' -import IconRightO from './right-o' -import IconRight from './right' -import IconRightward from './rightward' -import IconRowReverse from './row-reverse' -import IconSandwichCollapse from './sandwich-collapse' -import IconSandwichExpand from './sandwich-expand' -import IconSave from './save' -import IconScissor from './scissor' -import IconSearch from './search' -import IconSelect from './select' -import IconSent from './sent' -import IconSeparate from './separate' -import IconSetting from './setting' -import IconShare from './share' -import IconShareArrow from './share-arrow' -import IconShoppingCard from './shopping-card' -import IconSmileO from './smile-o' -import IconSmile from './smile' -import IconSortDefault from './sort-default' -import IconSort from './sort' -import IconStarActive from './star-active' -import IconStarDisable from './star-disable' -import IconStarO from './star-o' -import IconStartCircle from './start-circle' -import IconStart from './start' -import IconStatistics from './statistics' -import IconStop from './stop' -import IconStreamSolid from './stream-solid' -import IconSuccess from './success' -import IconSuccessful from './successful' -import IconTabletView from './tablet-view' -import IconTaskCooperation from './task-cooperation' -import IconTelephoneCircle from './telephone-circle' -import IconTelephone from './telephone' -import IconTextAlign from './text-align' -import IconTextDecoration from './text-decoration' -import IconTextTab from './text-tab' -import IconText from './text' -import IconTime from './time' -import IconTotal from './total' -import IconTriangleDown from './triangle-down' -import IconUndelete from './undelete' -import IconUnderline from './underline' -import IconUndo from './undo' -import IconUnfilter from './unfilter' -import IconUnfreeze from './unfreeze' -import IconUnknow from './unknow' -import IconUnknown from './unknown' -import IconUnlock from './unlock' -import IconUnsent from './unsent' -import IconUpO from './up-o' -import IconUp from './up' -import IconUpload from './upload' -import IconUser from './user' -import IconVersiontree from './versiontree' -import IconView from './view' -import IconVuejs from './vuejs' -import IconWarningTriangle from './warning-triangle' -import IconWarning from './warning' -import IconWebPlus from './web-plus' -import IconWriting from './writing' -import IconYes from './yes' -import IconZoomIn from './zoom-in' -import IconZoomOut from './zoom-out' -export * from './lowercase' -export { - IconAdd, - IconAdministrator, - IconAlignBaseline, - IconAlignCenter, - IconAlignFlexCenter, - IconAlignFlexEnd, - IconAlignFlexStart, - IconAlignJustify, - IconAlignLeft, - IconAlignRight, - IconAlignStretch, - IconAngularjs, - IconApp, - IconApplication, - IconAreaChart, - IconArrowDown, - IconArrowLeft, - IconArrowRight, - IconArrowUp, - IconAscending, - IconAssociation, - IconAttachment, - IconBarChart, - IconBefilter, - IconBoat, - IconBoxSolid, - IconBusy, - IconCalculator, - IconCalendar, - IconCheckOut, - IconCheck, - IconCheckedLinear, - IconCheckedSur, - IconCheckedTrue, - IconChevronDown, - IconChevronLeft, - IconChevronRight, - IconChevronUp, - IconClearFilter, - IconClockWork, - IconCloseCircle, - IconCloseSquare, - IconClose, - IconCloudDownload, - IconCloudUpload, - IconCode, - IconCoin, - IconColReverse, - IconCommission, - IconConmentRefresh, - IconCopySolid, - IconCopy, - IconCrop, - IconCourse, - IconCueL, - IconCustom, - IconCustomerService, - IconDataSource, - IconDefault, - IconDefinedFiltration, - IconDel, - IconDeletePage, - IconDeleted, - IconDeltaDownO, - IconDeltaDown, - IconDeltaLeftO, - IconDeltaLeft, - IconDeltaRightO, - IconDeltaRight, - IconDeltaUpO, - IconDeltaUp, - IconDerive, - IconDescending, - IconDesktopView, - IconDialog, - IconDialog2, - IconDirectionCol, - IconDirectionRow, - IconDotChart, - IconDotDownload, - IconDotIpv4, - IconDoubleLeft, - IconDoubleRight, - IconDownO, - IconDown, - IconDownloadCloud, - IconDownloadLink, - IconDownload, - IconDraft, - IconEdit, - IconEditorTab, - IconEllipsis, - IconEmailAdd, - IconEmailCircle, - IconEnd, - IconError, - IconEspaceAuto, - IconEspace, - IconExcel, - IconException, - IconExclamation, - IconExport, - IconExpressSearch, - IconEyeclose, - IconEyeopen, - IconEditorAlignCenter, - IconEditorAlignLeft, - IconEditorAlignRight, - IconEditorBackground, - IconEditorBold, - IconEditorCode, - IconEditorDeleteline, - IconEditorEraser, - IconEditorItalic, - IconEditorLeftBorder, - IconEditorList, - IconEditorListDot, - IconEditorListNum, - IconEditorMenuLeft, - IconEditorMenuRight, - IconEditorQuote, - IconEditorRedo, - IconEditorRightBorder, - IconEditorSub, - IconEditorSubtitle, - IconEditorSuper, - IconEditorTable, - IconEditorTextcolor, - IconEditorTitle, - IconEditorUnderline, - IconEditorUndo, - IconEditorVideo, - IconFileCloudupload, - IconFileExcel, - IconFile, - IconFilesCircle, - IconFiles, - IconFiletext, - IconFileupload, - IconFiltered, - IconFlag, - IconFolderClosed, - IconFolderOpened, - IconFontColor, - IconFontFamily, - IconFontSize, - IconFontStyle, - IconFontWeight, - IconFreezeLeft, - IconFreezeRight, - IconFrownO, - IconFrown, - IconFullscreen, - IconFullscreenLeft, - IconMinscreenLeft, - IconGrade, - IconGroupTransfer, - IconGroup, - IconHalfchecked, - IconHalfselect, - IconHeartempty, - IconHelpCircle, - IconHelpQuery, - IconHelpSolid, - IconHelp, - IconHelpful, - IconHideLeft, - IconHideRight, - IconHideTopleft, - IconImport, - IconInfoCircle, - IconInfoSolid, - IconInfo, - IconInformation, - IconJs, - IconJusitfyCenter, - IconJusitfyFlexEnd, - IconJusitfySpaceAround, - IconJusitfySpaceBetween, - IconJustitfyFlexStart, - IconLanguage, - IconLeave, - IconLeftFrozen, - IconLeftO, - IconLeftWard, - IconLeft, - IconLineChart, - IconLineHeight, - IconLineThrought, - IconLink, - IconLoading, - IconLock, - IconMailContent, - IconMail, - IconMale, - IconMarkOn, - IconMeh, - IconMessageCircle, - IconMinscreen, - IconMinusCircle, - IconMinusSquare, - IconMinus, - IconMobileView, - IconMobile, - IconMore, - IconNew, - IconNoPremission, - IconNodeOpen, - IconNode, - IconNodejs, - IconNone, - IconOffLine, - IconOnLine, - IconOperationfaildL, - IconOperationfaild, - IconOuterLink, - IconPagelink, - IconPagerFirst, - IconPagerLast, - IconPagerNext, - IconPagerPrev, - IconPanelMax, - IconPanelMini, - IconPanelNormal, - IconPauseCircle, - IconPause, - IconPicture, - IconPieChart, - IconPlusCircle, - IconPlusSquare, - IconPlus, - IconPopup, - IconPreChecked, - IconPrintPreview, - IconPushpin, - IconRadio, - IconRadioselected, - IconReactjs, - IconRedo, - IconRefres, - IconRenew, - IconRepeat, - IconReplace, - IconReplies, - IconRightFrozen, - IconRightO, - IconRight, - IconRightward, - IconRowReverse, - IconSandwichCollapse, - IconSandwichExpand, - IconSave, - IconScissor, - IconSearch, - IconSelect, - IconSent, - IconSeparate, - IconSetting, - IconShare, - IconShareArrow, - IconShoppingCard, - IconSmileO, - IconSmile, - IconSortDefault, - IconSort, - IconStarActive, - IconStarDisable, - IconStarO, - IconStartCircle, - IconStart, - IconStatistics, - IconStop, - IconStreamSolid, - IconSuccess, - IconSuccessful, - IconTabletView, - IconTaskCooperation, - IconTelephoneCircle, - IconTelephone, - IconTextAlign, - IconTextDecoration, - IconTextTab, - IconText, - IconTime, - IconTotal, - IconTriangleDown, - IconUndelete, - IconUnderline, - IconUndo, - IconUnfilter, - IconUnfreeze, - IconUnknow, - IconUnknown, - IconUnlock, - IconUnsent, - IconUpO, - IconUp, - IconUpload, - IconUser, - IconVersiontree, - IconView, - IconVuejs, - IconWarningTriangle, - IconWarning, - IconWebPlus, - IconWriting, - IconYes, - IconZoomIn, - IconZoomOut -} - -export default { - IconAdd, - IconAdministrator, - IconAlignBaseline, - IconAlignCenter, - IconAlignFlexCenter, - IconAlignFlexEnd, - IconAlignFlexStart, - IconAlignJustify, - IconAlignLeft, - IconAlignRight, - IconAlignStretch, - IconAngularjs, - IconApp, - IconApplication, - IconAreaChart, - IconArrowDown, - IconArrowLeft, - IconArrowRight, - IconArrowUp, - IconAscending, - IconAssociation, - IconAttachment, - IconBarChart, - IconBefilter, - IconBoat, - IconBoxSolid, - IconBusy, - IconCalculator, - IconCalendar, - IconCheckOut, - IconCheck, - IconCheckedLinear, - IconCheckedSur, - IconCheckedTrue, - IconChevronDown, - IconChevronLeft, - IconChevronRight, - IconChevronUp, - IconClearFilter, - IconClockWork, - IconCloseCircle, - IconCloseSquare, - IconClose, - IconCloudDownload, - IconCloudUpload, - IconCode, - IconCoin, - IconColReverse, - IconCommission, - IconConmentRefresh, - IconCopySolid, - IconCopy, - IconCourse, - IconCueL, - IconCustom, - IconCustomerService, - IconCrop, - IconDataSource, - IconDefault, - IconDefinedFiltration, - IconDel, - IconDeletePage, - IconDeleted, - IconDeltaDownO, - IconDeltaDown, - IconDeltaLeftO, - IconDeltaLeft, - IconDeltaRightO, - IconDeltaRight, - IconDeltaUpO, - IconDeltaUp, - IconDerive, - IconDescending, - IconDesktopView, - IconDialog, - IconDialog2, - IconDirectionCol, - IconDirectionRow, - IconDotChart, - IconDotDownload, - IconDotIpv4, - IconDoubleLeft, - IconDoubleRight, - IconDownO, - IconDown, - IconDownloadCloud, - IconDownloadLink, - IconDownload, - IconDraft, - IconEdit, - IconEditorTab, - IconEllipsis, - IconEmailAdd, - IconEmailCircle, - IconEnd, - IconError, - IconEspaceAuto, - IconEspace, - IconExcel, - IconException, - IconExclamation, - IconExport, - IconExpressSearch, - IconEyeclose, - IconEyeopen, - IconEditorAlignCenter, - IconEditorAlignLeft, - IconEditorAlignRight, - IconEditorBackground, - IconEditorBold, - IconEditorCode, - IconEditorDeleteline, - IconEditorEraser, - IconEditorItalic, - IconEditorLeftBorder, - IconEditorList, - IconEditorListDot, - IconEditorListNum, - IconEditorMenuLeft, - IconEditorMenuRight, - IconEditorQuote, - IconEditorRedo, - IconEditorRightBorder, - IconEditorSub, - IconEditorSubtitle, - IconEditorSuper, - IconEditorTable, - IconEditorTextcolor, - IconEditorTitle, - IconEditorUnderline, - IconEditorUndo, - IconEditorVideo, - IconFileCloudupload, - IconFileExcel, - IconFile, - IconFilesCircle, - IconFiles, - IconFiletext, - IconFileupload, - IconFiltered, - IconFlag, - IconFolderClosed, - IconFolderOpened, - IconFontColor, - IconFontFamily, - IconFontSize, - IconFontStyle, - IconFontWeight, - IconFreezeLeft, - IconFreezeRight, - IconFrownO, - IconFrown, - IconFullscreen, - IconFullscreenLeft, - IconGrade, - IconGroupTransfer, - IconGroup, - IconHalfchecked, - IconHalfselect, - IconHeartempty, - IconHelpCircle, - IconHelpQuery, - IconHelpSolid, - IconHelp, - IconHelpful, - IconHideLeft, - IconHideRight, - IconHideTopleft, - IconImport, - IconInfoCircle, - IconInfoSolid, - IconInfo, - IconInformation, - IconJs, - IconJusitfyCenter, - IconJusitfyFlexEnd, - IconJusitfySpaceAround, - IconJusitfySpaceBetween, - IconJustitfyFlexStart, - IconLanguage, - IconLeave, - IconLeftFrozen, - IconLeftO, - IconLeftWard, - IconLeft, - IconLineChart, - IconLineHeight, - IconLineThrought, - IconLink, - IconLoading, - IconLock, - IconMailContent, - IconMail, - IconMale, - IconMarkOn, - IconMeh, - IconMessageCircle, - IconMinscreenLeft, - IconMinscreen, - IconMinusCircle, - IconMinusSquare, - IconMinus, - IconMobileView, - IconMobile, - IconMore, - IconNew, - IconNoPremission, - IconNodeOpen, - IconNode, - IconNodejs, - IconNone, - IconOffLine, - IconOnLine, - IconOperationfaildL, - IconOperationfaild, - IconOuterLink, - IconPagelink, - IconPagerFirst, - IconPagerLast, - IconPagerNext, - IconPagerPrev, - IconPanelMax, - IconPanelMini, - IconPanelNormal, - IconPauseCircle, - IconPause, - IconPicture, - IconPieChart, - IconPlusCircle, - IconPlusSquare, - IconPlus, - IconPopup, - IconPreChecked, - IconPrintPreview, - IconPushpin, - IconRadio, - IconRadioselected, - IconReactjs, - IconRedo, - IconRefres, - IconRenew, - IconRepeat, - IconReplace, - IconReplies, - IconRightFrozen, - IconRightO, - IconRight, - IconRightward, - IconRowReverse, - IconSandwichCollapse, - IconSandwichExpand, - IconSave, - IconScissor, - IconSearch, - IconSelect, - IconSent, - IconSeparate, - IconSetting, - IconShare, - IconShareArrow, - IconShoppingCard, - IconSmileO, - IconSmile, - IconSortDefault, - IconSort, - IconStarActive, - IconStarDisable, - IconStarO, - IconStartCircle, - IconStart, - IconStatistics, - IconStop, - IconStreamSolid, - IconSuccess, - IconSuccessful, - IconTabletView, - IconTaskCooperation, - IconTelephoneCircle, - IconTelephone, - IconTextAlign, - IconTextDecoration, - IconTextTab, - IconText, - IconTime, - IconTotal, - IconTriangleDown, - IconUndelete, - IconUnderline, - IconUndo, - IconUnfilter, - IconUnfreeze, - IconUnknow, - IconUnknown, - IconUnlock, - IconUnsent, - IconUpO, - IconUp, - IconUpload, - IconUser, - IconVersiontree, - IconView, - IconVuejs, - IconWarningTriangle, - IconWarning, - IconWebPlus, - IconWriting, - IconYes, - IconZoomIn, - IconZoomOut -} diff --git a/packages/icon/lowercase.js b/packages/icon/lowercase.js deleted file mode 100644 index a12434794..000000000 --- a/packages/icon/lowercase.js +++ /dev/null @@ -1,944 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import iconAdd from './add' -import iconAdministrator from './administrator' -import iconAlignBaseline from './align-baseline' -import iconAlignCenter from './align-center' -import iconAlignFlexCenter from './align-flex-center' -import iconAlignFlexEnd from './align-flex-end' -import iconAlignFlexStart from './align-flex-start' -import iconAlignJustify from './align-justify' -import iconAlignLeft from './align-left' -import iconAlignRight from './align-right' -import iconAlignStretch from './align-stretch' -import iconAngularjs from './angularjs' -import iconApp from './app' -import iconApplication from './application' -import iconAreaChart from './area-chart' -import iconArrowDown from './arrow-down' -import iconArrowLeft from './arrow-left' -import iconArrowRight from './arrow-right' -import iconArrowUp from './arrow-up' -import iconAscending from './ascending' -import iconAssociation from './association' -import iconAttachment from './attachment' -import iconBarChart from './bar-chart' -import iconBefilter from './befilter' -import iconBoat from './boat' -import iconBoxSolid from './box-solid' -import iconBusy from './busy' -import iconCalculator from './calculator' -import iconCalendar from './calendar' -import iconCheckOut from './check-out' -import iconCheck from './check' -import iconCheckedLinear from './checked-linear' -import iconCheckedSur from './checked-sur' -import iconCheckedTrue from './checked-true' -import iconChevronDown from './chevron-down' -import iconChevronLeft from './chevron-left' -import iconChevronRight from './chevron-right' -import iconChevronUp from './chevron-up' -import iconClearFilter from './clear-filter' -import iconClockWork from './clock-work' -import iconCloseCircle from './close-circle' -import iconCloseSquare from './close-square' -import iconClose from './close' -import iconCloudDownload from './cloud-download' -import iconCloudUpload from './cloud-upload' -import iconCode from './code' -import iconCoin from './coin' -import iconColReverse from './col-reverse' -import iconCommission from './commission' -import iconConmentRefresh from './conment-refresh' -import iconCopySolid from './copy-solid' -import iconCopy from './copy' -import iconCourse from './course' -import iconCueL from './cue-l' -import iconCustom from './custom' -import iconCustomerService from './customer-service' -import iconCrop from './crop' -import iconDataSource from './data-source' -import iconDefault from './default' -import iconDefinedFiltration from './defined-filtration' -import iconDel from './del' -import iconDeletePage from './delete-page' -import iconDeleted from './deleted' -import iconDeltaDownO from './delta-down-o' -import iconDeltaDown from './delta-down' -import iconDeltaLeftO from './delta-left-o' -import iconDeltaLeft from './delta-left' -import iconDeltaRightO from './delta-right-o' -import iconDeltaRight from './delta-right' -import iconDeltaUpO from './delta-up-o' -import iconDeltaUp from './delta-up' -import iconDerive from './derive' -import iconDescending from './descending' -import iconDesktopView from './desktop-view' -import iconDialog from './dialog' -import iconDialog2 from './dialog2' -import iconDirectionCol from './direction-col' -import iconDirectionRow from './direction-row' -import iconDotChart from './dot-chart' -import iconDotDownload from './dot-download' -import iconDotIpv4 from './dot-ipv4' -import iconDoubleLeft from './double-left' -import iconDoubleRight from './double-right' -import iconDownO from './down-o' -import iconDown from './down' -import iconDownloadCloud from './download-cloud' -import iconDownloadLink from './download-link' -import iconDownload from './download' -import iconDraft from './draft' -import iconEdit from './edit' -import iconEditorTab from './editor-tab' -import iconEllipsis from './ellipsis' -import iconEmailAdd from './email-add' -import iconEmailCircle from './email-circle' -import iconEnd from './end' -import iconError from './error' -import iconEspaceAuto from './espace-auto' -import iconEspace from './espace' -import iconExcel from './excel' -import iconException from './exception' -import iconExclamation from './exclamation' -import iconExport from './export' -import iconExpressSearch from './express-search' -import iconEyeclose from './eyeclose' -import iconEyeopen from './eyeopen' - -import iconEditorAlignCenter from './editor-align-center' -import iconEditorAlignLeft from './editor-align-left' -import iconEditorAlignRight from './editor-align-right' -import iconEditorBackground from './editor-background' -import iconEditorBold from './editor-bold' -import iconEditorCode from './editor-code' -import iconEditorDeleteline from './editor-deleteline' -import iconEditorEraser from './editor-eraser' -import iconEditorItalic from './editor-italic' -import iconEditorLeftBorder from './editor-left-border' -import iconEditorList from './editor-list' -import iconEditorListDot from './editor-list-dot' -import iconEditorListNum from './editor-list-num' -import iconEditorMenuLeft from './editor-menu-left' -import iconEditorMenuRight from './editor-menu-right' -import iconEditorQuote from './editor-quote' -import iconEditorRedo from './editor-redo' -import iconEditorRightBorder from './editor-right-border' -import iconEditorSub from './editor-sub' -import iconEditorSubtitle from './editor-subtitle' -import iconEditorSuper from './editor-super' -import iconEditorTable from './editor-table' -import iconEditorTextcolor from './editor-textcolor' -import iconEditorTitle from './editor-title' -import iconEditorUnderline from './editor-underline' -import iconEditorUndo from './editor-undo' -import iconEditorVideo from './editor-video' -import iconFileCloudupload from './file-cloudupload' -import iconFileExcel from './file-excel' -import iconFile from './file' -import iconFilesCircle from './files-circle' -import iconFiles from './files' -import iconFiletext from './filetext' -import iconFileupload from './fileupload' -import iconFiltered from './filtered' -import iconFlag from './flag' -import iconFolderClosed from './folder-closed' -import iconFolderOpened from './folder-opened' -import iconFontColor from './font-color' -import iconFontFamily from './font-family' -import iconFontSize from './font-size' -import iconFontStyle from './font-style' -import iconFontWeight from './font-weight' -import iconFreezeLeft from './freeze-left' -import iconFreezeRight from './freeze-right' -import iconFrownO from './frown-o' -import iconFrown from './frown' -import iconFullscreen from './fullscreen' -import iconFullscreenLeft from './fullscreen-left' -import iconGrade from './grade' -import iconGroupTransfer from './group-transfer' -import iconGroup from './group' -import iconHalfchecked from './halfchecked' -import iconHalfselect from './halfselect' -import iconHeartempty from './heartempty' -import iconHelpCircle from './help-circle' -import iconHelpQuery from './help-query' -import iconHelpSolid from './help-solid' -import iconHelp from './help' -import iconHelpful from './helpful' -import iconHideLeft from './hide-left' -import iconHideRight from './hide-right' -import iconHideTopleft from './hide-topleft' -import iconImport from './import' -import iconInfoCircle from './info-circle' -import iconInfoSolid from './info-solid' -import iconInfo from './info' -import iconInformation from './information' -import iconJs from './js' -import iconJusitfyCenter from './jusitfy-center' -import iconJusitfyFlexEnd from './jusitfy-flex-end' -import iconJusitfySpaceAround from './jusitfy-space-around' -import iconJusitfySpaceBetween from './jusitfy-space-between' -import iconJustitfyFlexStart from './justitfy-flex-start' -import iconLanguage from './language' -import iconLeave from './leave' -import iconLeftFrozen from './left-frozen' -import iconLeftO from './left-o' -import iconLeftWard from './left-ward' -import iconLeft from './left' -import iconLineChart from './line-chart' -import iconLineHeight from './line-height' -import iconLineThrought from './line-throught' -import iconLink from './link' -import iconLoading from './loading' -import iconLock from './lock' -import iconMailContent from './mail-content' -import iconMail from './mail' -import iconMale from './male' -import iconMarkOn from './mark-on' -import iconMeh from './meh' -import iconMessageCircle from './message-circle' -import iconMinscreen from './minscreen' -import iconMinscreenLeft from './minscreen-left' -import iconMinusCircle from './minus-circle' -import iconMinusSquare from './minus-square' -import iconMinus from './minus' -import iconMobileView from './mobile-view' -import iconMobile from './mobile' -import iconMore from './more' -import iconNew from './new' -import iconNoPremission from './no-premission' -import iconNodeOpen from './node-open' -import iconNode from './node' -import iconNodejs from './nodejs' -import iconNone from './none' -import iconOffLine from './off-line' -import iconOnLine from './on-line' -import iconOperationfaildL from './operationfaild-l' -import iconOperationfaild from './operationfaild' -import iconOuterLink from './outer-link' -import iconPagelink from './pagelink' -import iconPagerFirst from './pager-first' -import iconPagerLast from './pager-last' -import iconPagerNext from './pager-next' -import iconPagerPrev from './pager-prev' -import iconPanelMax from './panel-max' -import iconPanelMini from './panel-mini' -import iconPanelNormal from './panel-normal' -import iconPauseCircle from './pause-circle' -import iconPause from './pause' -import iconPicture from './picture' -import iconPieChart from './pie-chart' -import iconPlusCircle from './plus-circle' -import iconPlusSquare from './plus-square' -import iconPlus from './plus' -import iconPopup from './popup' -import iconPreChecked from './pre-checked' -import iconPrintPreview from './print-preview' -import iconPushpin from './pushpin' -import iconRadio from './radio' -import iconRadioselected from './radioselected' -import iconReactjs from './reactjs' -import iconRedo from './redo' -import iconRefres from './refres' -import iconRenew from './renew' -import iconRepeat from './repeat' -import iconReplace from './replace' -import iconReplies from './replies' -import iconRightFrozen from './right-frozen' -import iconRightO from './right-o' -import iconRight from './right' -import iconRightward from './rightward' -import iconRowReverse from './row-reverse' -import iconSandwichCollapse from './sandwich-collapse' -import iconSandwichExpand from './sandwich-expand' -import iconSave from './save' -import iconScissor from './scissor' -import iconSearch from './search' -import iconSelect from './select' -import iconSent from './sent' -import iconSeparate from './separate' -import iconSetting from './setting' -import iconShare from './share' -import iconShareArrow from './share-arrow' -import iconShoppingCard from './shopping-card' -import iconSmileO from './smile-o' -import iconSmile from './smile' -import iconSortDefault from './sort-default' -import iconSort from './sort' -import iconStarActive from './star-active' -import iconStarDisable from './star-disable' -import iconStarO from './star-o' -import iconStartCircle from './start-circle' -import iconStart from './start' -import iconStatistics from './statistics' -import iconStop from './stop' -import iconStreamSolid from './stream-solid' -import iconSuccess from './success' -import iconSuccessful from './successful' -import iconTabletView from './tablet-view' -import iconTaskCooperation from './task-cooperation' -import iconTelephoneCircle from './telephone-circle' -import iconTelephone from './telephone' -import iconTextAlign from './text-align' -import iconTextDecoration from './text-decoration' -import iconTextTab from './text-tab' -import iconText from './text' -import iconTime from './time' -import iconTotal from './total' -import iconTriangleDown from './triangle-down' -import iconUndelete from './undelete' -import iconUnderline from './underline' -import iconUndo from './undo' -import iconUnfilter from './unfilter' -import iconUnfreeze from './unfreeze' -import iconUnknow from './unknow' -import iconUnknown from './unknown' -import iconUnlock from './unlock' -import iconUnsent from './unsent' -import iconUpO from './up-o' -import iconUp from './up' -import iconUpload from './upload' -import iconUser from './user' -import iconVersiontree from './versiontree' -import iconView from './view' -import iconVuejs from './vuejs' -import iconWarningTriangle from './warning-triangle' -import iconWarning from './warning' -import iconWebPlus from './web-plus' -import iconWriting from './writing' -import iconYes from './yes' -import iconZoomIn from './zoom-in' -import iconZoomOut from './zoom-out' -export { - iconAdd, - iconAdministrator, - iconAlignBaseline, - iconAlignCenter, - iconAlignFlexCenter, - iconAlignFlexEnd, - iconAlignFlexStart, - iconAlignJustify, - iconAlignLeft, - iconAlignRight, - iconAlignStretch, - iconAngularjs, - iconApp, - iconApplication, - iconAreaChart, - iconArrowDown, - iconArrowLeft, - iconArrowRight, - iconArrowUp, - iconAscending, - iconAssociation, - iconAttachment, - iconBarChart, - iconBefilter, - iconBoat, - iconBoxSolid, - iconBusy, - iconCalculator, - iconCalendar, - iconCheckOut, - iconCheck, - iconCheckedLinear, - iconCheckedSur, - iconCheckedTrue, - iconChevronDown, - iconChevronLeft, - iconChevronRight, - iconChevronUp, - iconClearFilter, - iconClockWork, - iconCloseCircle, - iconCloseSquare, - iconClose, - iconCloudDownload, - iconCloudUpload, - iconCode, - iconCoin, - iconColReverse, - iconCommission, - iconConmentRefresh, - iconCopySolid, - iconCopy, - iconCrop, - iconCourse, - iconCueL, - iconCustom, - iconCustomerService, - iconDataSource, - iconDefault, - iconDefinedFiltration, - iconDel, - iconDeletePage, - iconDeleted, - iconDeltaDownO, - iconDeltaDown, - iconDeltaLeftO, - iconDeltaLeft, - iconDeltaRightO, - iconDeltaRight, - iconDeltaUpO, - iconDeltaUp, - iconDerive, - iconDescending, - iconDesktopView, - iconDialog, - iconDialog2, - iconDirectionCol, - iconDirectionRow, - iconDotChart, - iconDotDownload, - iconDotIpv4, - iconDoubleLeft, - iconDoubleRight, - iconDownO, - iconDown, - iconDownloadCloud, - iconDownloadLink, - iconDownload, - iconDraft, - iconEdit, - iconEditorTab, - iconEllipsis, - iconEmailAdd, - iconEmailCircle, - iconEnd, - iconError, - iconEspaceAuto, - iconEspace, - iconExcel, - iconException, - iconExclamation, - iconExport, - iconExpressSearch, - iconEyeclose, - iconEyeopen, - iconEditorAlignCenter, - iconEditorAlignLeft, - iconEditorAlignRight, - iconEditorBackground, - iconEditorBold, - iconEditorCode, - iconEditorDeleteline, - iconEditorEraser, - iconEditorItalic, - iconEditorLeftBorder, - iconEditorList, - iconEditorListDot, - iconEditorListNum, - iconEditorMenuLeft, - iconEditorMenuRight, - iconEditorQuote, - iconEditorRedo, - iconEditorRightBorder, - iconEditorSub, - iconEditorSubtitle, - iconEditorSuper, - iconEditorTable, - iconEditorTextcolor, - iconEditorTitle, - iconEditorUnderline, - iconEditorUndo, - iconEditorVideo, - iconFileCloudupload, - iconFileExcel, - iconFile, - iconFilesCircle, - iconFiles, - iconFiletext, - iconFileupload, - iconFiltered, - iconFlag, - iconFolderClosed, - iconFolderOpened, - iconFontColor, - iconFontFamily, - iconFontSize, - iconFontStyle, - iconFontWeight, - iconFreezeLeft, - iconFreezeRight, - iconFrownO, - iconFrown, - iconFullscreen, - iconFullscreenLeft, - iconMinscreenLeft, - iconGrade, - iconGroupTransfer, - iconGroup, - iconHalfchecked, - iconHalfselect, - iconHeartempty, - iconHelpCircle, - iconHelpQuery, - iconHelpSolid, - iconHelp, - iconHelpful, - iconHideLeft, - iconHideRight, - iconHideTopleft, - iconImport, - iconInfoCircle, - iconInfoSolid, - iconInfo, - iconInformation, - iconJs, - iconJusitfyCenter, - iconJusitfyFlexEnd, - iconJusitfySpaceAround, - iconJusitfySpaceBetween, - iconJustitfyFlexStart, - iconLanguage, - iconLeave, - iconLeftFrozen, - iconLeftO, - iconLeftWard, - iconLeft, - iconLineChart, - iconLineHeight, - iconLineThrought, - iconLink, - iconLoading, - iconLock, - iconMailContent, - iconMail, - iconMale, - iconMarkOn, - iconMeh, - iconMessageCircle, - iconMinscreen, - iconMinusCircle, - iconMinusSquare, - iconMinus, - iconMobileView, - iconMobile, - iconMore, - iconNew, - iconNoPremission, - iconNodeOpen, - iconNode, - iconNodejs, - iconNone, - iconOffLine, - iconOnLine, - iconOperationfaildL, - iconOperationfaild, - iconOuterLink, - iconPagelink, - iconPagerFirst, - iconPagerLast, - iconPagerNext, - iconPagerPrev, - iconPanelMax, - iconPanelMini, - iconPanelNormal, - iconPauseCircle, - iconPause, - iconPicture, - iconPieChart, - iconPlusCircle, - iconPlusSquare, - iconPlus, - iconPopup, - iconPreChecked, - iconPrintPreview, - iconPushpin, - iconRadio, - iconRadioselected, - iconReactjs, - iconRedo, - iconRefres, - iconRenew, - iconRepeat, - iconReplace, - iconReplies, - iconRightFrozen, - iconRightO, - iconRight, - iconRightward, - iconRowReverse, - iconSandwichCollapse, - iconSandwichExpand, - iconSave, - iconScissor, - iconSearch, - iconSelect, - iconSent, - iconSeparate, - iconSetting, - iconShare, - iconShareArrow, - iconShoppingCard, - iconSmileO, - iconSmile, - iconSortDefault, - iconSort, - iconStarActive, - iconStarDisable, - iconStarO, - iconStartCircle, - iconStart, - iconStatistics, - iconStop, - iconStreamSolid, - iconSuccess, - iconSuccessful, - iconTabletView, - iconTaskCooperation, - iconTelephoneCircle, - iconTelephone, - iconTextAlign, - iconTextDecoration, - iconTextTab, - iconText, - iconTime, - iconTotal, - iconTriangleDown, - iconUndelete, - iconUnderline, - iconUndo, - iconUnfilter, - iconUnfreeze, - iconUnknow, - iconUnknown, - iconUnlock, - iconUnsent, - iconUpO, - iconUp, - iconUpload, - iconUser, - iconVersiontree, - iconView, - iconVuejs, - iconWarningTriangle, - iconWarning, - iconWebPlus, - iconWriting, - iconYes, - iconZoomIn, - iconZoomOut -} - -export default { - iconAdd, - iconAdministrator, - iconAlignBaseline, - iconAlignCenter, - iconAlignFlexCenter, - iconAlignFlexEnd, - iconAlignFlexStart, - iconAlignJustify, - iconAlignLeft, - iconAlignRight, - iconAlignStretch, - iconAngularjs, - iconApp, - iconApplication, - iconAreaChart, - iconArrowDown, - iconArrowLeft, - iconArrowRight, - iconArrowUp, - iconAscending, - iconAssociation, - iconAttachment, - iconBarChart, - iconBefilter, - iconBoat, - iconBoxSolid, - iconBusy, - iconCalculator, - iconCalendar, - iconCheckOut, - iconCheck, - iconCheckedLinear, - iconCheckedSur, - iconCheckedTrue, - iconChevronDown, - iconChevronLeft, - iconChevronRight, - iconChevronUp, - iconClearFilter, - iconClockWork, - iconCloseCircle, - iconCloseSquare, - iconClose, - iconCloudDownload, - iconCloudUpload, - iconCode, - iconCoin, - iconColReverse, - iconCommission, - iconConmentRefresh, - iconCopySolid, - iconCopy, - iconCourse, - iconCueL, - iconCustom, - iconCustomerService, - iconCrop, - iconDataSource, - iconDefault, - iconDefinedFiltration, - iconDel, - iconDeletePage, - iconDeleted, - iconDeltaDownO, - iconDeltaDown, - iconDeltaLeftO, - iconDeltaLeft, - iconDeltaRightO, - iconDeltaRight, - iconDeltaUpO, - iconDeltaUp, - iconDerive, - iconDescending, - iconDesktopView, - iconDialog, - iconDialog2, - iconDirectionCol, - iconDirectionRow, - iconDotChart, - iconDotDownload, - iconDotIpv4, - iconDoubleLeft, - iconDoubleRight, - iconDownO, - iconDown, - iconDownloadCloud, - iconDownloadLink, - iconDownload, - iconDraft, - iconEdit, - iconEditorTab, - iconEllipsis, - iconEmailAdd, - iconEmailCircle, - iconEnd, - iconError, - iconEspaceAuto, - iconEspace, - iconExcel, - iconException, - iconExclamation, - iconExport, - iconExpressSearch, - iconEyeclose, - iconEyeopen, - iconEditorAlignCenter, - iconEditorAlignLeft, - iconEditorAlignRight, - iconEditorBackground, - iconEditorBold, - iconEditorCode, - iconEditorDeleteline, - iconEditorEraser, - iconEditorItalic, - iconEditorLeftBorder, - iconEditorList, - iconEditorListDot, - iconEditorListNum, - iconEditorMenuLeft, - iconEditorMenuRight, - iconEditorQuote, - iconEditorRedo, - iconEditorRightBorder, - iconEditorSub, - iconEditorSubtitle, - iconEditorSuper, - iconEditorTable, - iconEditorTextcolor, - iconEditorTitle, - iconEditorUnderline, - iconEditorUndo, - iconEditorVideo, - iconFileCloudupload, - iconFileExcel, - iconFile, - iconFilesCircle, - iconFiles, - iconFiletext, - iconFileupload, - iconFiltered, - iconFlag, - iconFolderClosed, - iconFolderOpened, - iconFontColor, - iconFontFamily, - iconFontSize, - iconFontStyle, - iconFontWeight, - iconFreezeLeft, - iconFreezeRight, - iconFrownO, - iconFrown, - iconFullscreen, - iconFullscreenLeft, - iconGrade, - iconGroupTransfer, - iconGroup, - iconHalfchecked, - iconHalfselect, - iconHeartempty, - iconHelpCircle, - iconHelpQuery, - iconHelpSolid, - iconHelp, - iconHelpful, - iconHideLeft, - iconHideRight, - iconHideTopleft, - iconImport, - iconInfoCircle, - iconInfoSolid, - iconInfo, - iconInformation, - iconJs, - iconJusitfyCenter, - iconJusitfyFlexEnd, - iconJusitfySpaceAround, - iconJusitfySpaceBetween, - iconJustitfyFlexStart, - iconLanguage, - iconLeave, - iconLeftFrozen, - iconLeftO, - iconLeftWard, - iconLeft, - iconLineChart, - iconLineHeight, - iconLineThrought, - iconLink, - iconLoading, - iconLock, - iconMailContent, - iconMail, - iconMale, - iconMarkOn, - iconMeh, - iconMessageCircle, - iconMinscreenLeft, - iconMinscreen, - iconMinusCircle, - iconMinusSquare, - iconMinus, - iconMobileView, - iconMobile, - iconMore, - iconNew, - iconNoPremission, - iconNodeOpen, - iconNode, - iconNodejs, - iconNone, - iconOffLine, - iconOnLine, - iconOperationfaildL, - iconOperationfaild, - iconOuterLink, - iconPagelink, - iconPagerFirst, - iconPagerLast, - iconPagerNext, - iconPagerPrev, - iconPanelMax, - iconPanelMini, - iconPanelNormal, - iconPauseCircle, - iconPause, - iconPicture, - iconPieChart, - iconPlusCircle, - iconPlusSquare, - iconPlus, - iconPopup, - iconPreChecked, - iconPrintPreview, - iconPushpin, - iconRadio, - iconRadioselected, - iconReactjs, - iconRedo, - iconRefres, - iconRenew, - iconRepeat, - iconReplace, - iconReplies, - iconRightFrozen, - iconRightO, - iconRight, - iconRightward, - iconRowReverse, - iconSandwichCollapse, - iconSandwichExpand, - iconSave, - iconScissor, - iconSearch, - iconSelect, - iconSent, - iconSeparate, - iconSetting, - iconShare, - iconShareArrow, - iconShoppingCard, - iconSmileO, - iconSmile, - iconSortDefault, - iconSort, - iconStarActive, - iconStarDisable, - iconStarO, - iconStartCircle, - iconStart, - iconStatistics, - iconStop, - iconStreamSolid, - iconSuccess, - iconSuccessful, - iconTabletView, - iconTaskCooperation, - iconTelephoneCircle, - iconTelephone, - iconTextAlign, - iconTextDecoration, - iconTextTab, - iconText, - iconTime, - iconTotal, - iconTriangleDown, - iconUndelete, - iconUnderline, - iconUndo, - iconUnfilter, - iconUnfreeze, - iconUnknow, - iconUnknown, - iconUnlock, - iconUnsent, - iconUpO, - iconUp, - iconUpload, - iconUser, - iconVersiontree, - iconView, - iconVuejs, - iconWarningTriangle, - iconWarning, - iconWebPlus, - iconWriting, - iconYes, - iconZoomIn, - iconZoomOut -} diff --git a/packages/icon/package.json b/packages/icon/package.json deleted file mode 100644 index 8ace4c8b2..000000000 --- a/packages/icon/package.json +++ /dev/null @@ -1,11 +0,0 @@ -{ - "name": "@opentiny/vue-icon", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "sideEffects": false, - "dependencies": { - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/image-viewer/index.js b/packages/image-viewer/index.js deleted file mode 100644 index 2d3ac7f93..000000000 --- a/packages/image-viewer/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import ImageViewer from './src/index' - -/* istanbul ignore next */ -ImageViewer.install = function (Vue) { - Vue.component(ImageViewer.name, ImageViewer) -} - -ImageViewer.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - ImageViewer.install(window.Vue) - } -} - -export default ImageViewer diff --git a/packages/image-viewer/package.json b/packages/image-viewer/package.json deleted file mode 100644 index fe8744b85..000000000 --- a/packages/image-viewer/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-image-viewer", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/image-viewer/src/index.js b/packages/image-viewer/src/index.js deleted file mode 100644 index ee8017b18..000000000 --- a/packages/image-viewer/src/index.js +++ /dev/null @@ -1,104 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const $constants = { - MODE: { - CONTAIN: { - name: 'contain', - icon: 'icon-fullscreen' - }, - ORIGINAL: { - name: 'original', - icon: 'icon-minscreen' - } - }, - DEFAULT_POPPER_ZINDEX: Number.POSITIVE_INFINITY -} - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'ImageViewer', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - urlList: { - type: Array, - default: () => [] - }, - zIndex: { - type: Number, - default: $constants.DEFAULT_POPPER_ZINDEX - }, - previewVisible: { - type: Boolean, - default: false - }, - closeShow: { - type: Boolean, - default: false - }, - arrowShow: { - type: Boolean, - default: false - }, - toolShow: { - type: Boolean, - default: false - }, - showIndex: { - type: Boolean, - default: false - }, - imageFullCurrent: { - type: Boolean, - default: false - }, - startPosition: { - type: Number, - default: 0 - }, - asyncClose: { - type: Boolean, - default: false - }, - deleteButton: { - type: Boolean, - default: false - }, - onSwitch: { - type: Function, - default: () => { - // do nothing - } - }, - onClose: { - type: Function, - default: () => { - // do nothing - } - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/image-viewer/src/mobile.vue b/packages/image-viewer/src/mobile.vue deleted file mode 100644 index 1fa9583a8..000000000 --- a/packages/image-viewer/src/mobile.vue +++ /dev/null @@ -1,148 +0,0 @@ - - - - diff --git a/packages/image-viewer/src/mobileTouch.js b/packages/image-viewer/src/mobileTouch.js deleted file mode 100644 index 12e3da413..000000000 --- a/packages/image-viewer/src/mobileTouch.js +++ /dev/null @@ -1,115 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { directive } from '@opentiny/vue-common' -import { isObject } from '@opentiny/vue-renderless/common/type' - -class TinyTouch { - constructor(element, tinyBinding, type) { - const that = this - that.element = element - that.tinyBinding = tinyBinding - that.touchType = type - that.tinyVueTouches = { x: 0, y: 0 } - that.tinyVueMoves = true - that.tinyVueLeave = true - that.tinyLongTouch = true - that.tinyVueCallBack = isObject(tinyBinding.value) ? tinyBinding.value.fn : tinyBinding.value - that.element.addEventListener('touchstart', (e) => { - that.start(e) - }) - that.element.addEventListener('touchend', (e) => { - that.end(e) - }) - that.element.addEventListener('touchmove', (e) => { - that.move(e) - }) - } - start(e) { - if (e.touches >= 2) { - return - } - - this.tinyVueMoves = true - this.tinyVueLeave = true - this.tinyLongTouch = true - this.tinyVueTouches = { - x: e.changedTouches[0].pageX, - y: e.changedTouches[0].pageY - } - - this.time = setTimeout(() => { - if (this.tinyVueLeave && this.tinyVueMoves) { - this.touchType == 'longtap' && this.tinyVueCallBack(this.tinyBinding.value, e) - this.tinyLongTouch = false - } - }, 1000) - } - end(e) { - if (e.touches >= 2) { - return - } - - let disX = e.changedTouches[0].pageX - this.tinyVueTouches.x - let disY = e.changedTouches[0].pageY - this.tinyVueTouches.y - - clearTimeout(this.time) - - if (Math.abs(disX) > 10 || Math.abs(disY) > 100) { - this.touchType == 'swipe' && this.tinyVueCallBack(this.tinyBinding.value, e) - - if (Math.abs(disX) > Math.abs(disY)) { - if (disX > 10) { - this.touchType == 'swiperight' && this.tinyVueCallBack(this.tinyBinding.value, e) - } - - if (disX < -10) { - this.touchType == 'swipeleft' && this.tinyVueCallBack(this.tinyBinding.value, e) - } - } else { - if (disY > 10) { - this.touchType == 'swipedown' && this.tinyVueCallBack(this.tinyBinding.value, e) - } - - if (disY < -10) { - this.touchType == 'swipeup' && this.tinyVueCallBack(this.tinyBinding.value, e) - } - } - } else { - if (this.tinyLongTouch && this.tinyVueMoves) { - this.touchType == 'tap' && this.tinyVueCallBack(this.tinyBinding.value, e) - this.tinyVueLeave = false - } - } - } - move() { - this.tinyVueMoves = false - } -} - -const mapDirective = () => { - const deactives = {} - const names = ['tap', 'swipe', 'swipeleft', 'swiperight', 'swipedown', 'swipeup', 'longtap'] - - names.forEach((name) => { - deactives[name] = directive({ - vTouch: { - bind(el, tinyBinding) { - new TinyTouch(el, tinyBinding, name) - } - } - }).vTouch - }) - - return deactives -} - -export default mapDirective() diff --git a/packages/image-viewer/src/pc.vue b/packages/image-viewer/src/pc.vue deleted file mode 100644 index c513aafc6..000000000 --- a/packages/image-viewer/src/pc.vue +++ /dev/null @@ -1,94 +0,0 @@ - - - - diff --git a/packages/image/index.js b/packages/image/index.js deleted file mode 100644 index 8f649e544..000000000 --- a/packages/image/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Image from './src/index' -import '@opentiny/vue-theme/image/index.css' - -/* istanbul ignore next */ -Image.install = function (Vue) { - Vue.component(Image.name, Image) -} - -Image.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Image.install(window.Vue) - } -} - -export default Image diff --git a/packages/image/package.json b/packages/image/package.json deleted file mode 100644 index 66279586b..000000000 --- a/packages/image/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-image", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-image-viewer": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/image/src/index.js b/packages/image/src/index.js deleted file mode 100644 index bfa498c2a..000000000 --- a/packages/image/src/index.js +++ /dev/null @@ -1,50 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - NONE: 'none', - CONTAIN: 'contain', - COVER: 'cover', - FILL: 'fill', - SCALE_DOWN: 'scale-down', - DEFAULT_POPPER_ZINDEX: Number.POSITIVE_INFINITY -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'Image', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - fit: String, - lazy: Boolean, - previewSrcList: { - type: Array, - default: () => [] - }, - scrollContainer: {}, - src: String, - zIndex: { - type: Number, - default: $constants.DEFAULT_POPPER_ZINDEX - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/image/src/pc.vue b/packages/image/src/pc.vue deleted file mode 100644 index 18132d5cb..000000000 --- a/packages/image/src/pc.vue +++ /dev/null @@ -1,51 +0,0 @@ - - - - diff --git a/packages/input/index.js b/packages/input/index.js deleted file mode 100644 index 64b9a008a..000000000 --- a/packages/input/index.js +++ /dev/null @@ -1,33 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Input from './src/index' - -Input.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Input.install = function (Vue) { - Vue.component(Input.name, Input) -} - -Input.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Input.install(window.Vue) - } -} - -export default Input diff --git a/packages/input/package.json b/packages/input/package.json deleted file mode 100644 index dbf7d9336..000000000 --- a/packages/input/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-input", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-action-sheet": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/input/src/index.js b/packages/input/src/index.js deleted file mode 100644 index 1dcbaa560..000000000 --- a/packages/input/src/index.js +++ /dev/null @@ -1,123 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const $constants = { - INPUT_PC: 'tiny-input__', - INPUTGROUP_PC: 'tiny-input-group__', - INPUT_MOBILE: 'tiny-mobile-input__', - INPUTGROUP_MOBILE: 'tiny-mobile-input-group__', - Mode: 'pc', - inputMode(mode) { - return mode === this.Mode ? this.INPUT_PC : this.INPUT_MOBILE - }, - inputGroupMode(mode) { - return mode === this.Mode ? this.INPUTGROUP_PC : this.INPUTGROUP_MOBILE - }, - VALIDATE_ICON: { - Validating: 'tiny-icon-loading', - Success: 'tiny-icon-circle-check', - Error: 'tiny-icon-circle-close' - }, - COMPONENT_NAME: { - FormItem: 'FormItem' - } -} - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'Input', - inheritAttrs: false, - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - name: String, - size: String, - form: String, - label: String, - height: Number, - resize: String, - tabindex: { type: String, default: '1' }, - disabled: Boolean, - readonly: Boolean, - suffixIcon: [Object, String], - prefixIcon: [Object, String], - modelValue: [String, Number], - type: { - type: String, - default: 'text' - }, - vertical: { - type: Boolean, - default: false - }, - selectMenu: { - type: Array, - default: () => [] - }, - isSelect: { - type: Boolean, - default: false - }, - mobileTips: String, - counter: { - type: Boolean, - default: false - }, - autosize: { - type: [Boolean, Object], - default: false - }, - clearable: { - type: Boolean, - default: false - }, - autocomplete: { - type: String, - default: 'off' - }, - showPassword: { - type: Boolean, - default: false - }, - showWordLimit: { - type: Boolean, - default: false - }, - showTitle: { - type: Boolean, - default: false - }, - validateEvent: { - type: Boolean, - default: true - }, - // mobile特有属性 - textareaTitle: { - type: String, - default: '标题' - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/input/src/mobile.vue b/packages/input/src/mobile.vue deleted file mode 100644 index 91d99cd8a..000000000 --- a/packages/input/src/mobile.vue +++ /dev/null @@ -1,226 +0,0 @@ - - - - diff --git a/packages/input/src/pc.vue b/packages/input/src/pc.vue deleted file mode 100644 index 48a4f8412..000000000 --- a/packages/input/src/pc.vue +++ /dev/null @@ -1,187 +0,0 @@ - - - - diff --git a/packages/ip-address/index.js b/packages/ip-address/index.js deleted file mode 100644 index 371385a23..000000000 --- a/packages/ip-address/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import IpAddress from './src/index' -import '@opentiny/vue-theme/ip-address/index.css' - -IpAddress.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -IpAddress.install = function (Vue) { - Vue.component(IpAddress.name, IpAddress) -} - -IpAddress.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - IpAddress.install(window.Vue) - } -} - -export default IpAddress diff --git a/packages/ip-address/package.json b/packages/ip-address/package.json deleted file mode 100644 index 0e43d910a..000000000 --- a/packages/ip-address/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-ip-address", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/ip-address/src/index.js b/packages/ip-address/src/index.js deleted file mode 100644 index 6df916de7..000000000 --- a/packages/ip-address/src/index.js +++ /dev/null @@ -1,58 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'IpAddress', - props: { - ...$props, - size: String, - - /** - * @property {String} value - 显示值 - */ - modelValue: String, - - /** - * @property {String} [type = IPv4] - IP地址输入组件类型('IPv4', 'IPv6',)可选择 - */ - type: { - type: String, - default: 'IPv4', - validator: (value) => ~['IPv4', 'IPv6'].indexOf(value) - }, - - /** - * @property {Boolean} readonly - 只读 - */ - readonly: Boolean, - - /** - * @property {Boolean} disabled - 禁用 - */ - disabled: Boolean, - - /** - * @property {String, Object} [delimiter = .] - 组件IP段显示的分隔符改为图标 - */ - delimiter: { - type: [String, Object], - default: 'icon-dot-ipv4' - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/ip-address/src/pc.vue b/packages/ip-address/src/pc.vue deleted file mode 100644 index 5c284fd91..000000000 --- a/packages/ip-address/src/pc.vue +++ /dev/null @@ -1,64 +0,0 @@ - - - - diff --git a/packages/layout/index.js b/packages/layout/index.js deleted file mode 100644 index 875281dda..000000000 --- a/packages/layout/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Layout from './src/index' -import '@opentiny/vue-theme/layout/index.css' - -/* istanbul ignore next */ -Layout.install = function (Vue) { - Vue.component(Layout.name, Layout) -} - -Layout.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Layout.install(window.Vue) - } -} - -export default Layout diff --git a/packages/layout/package.json b/packages/layout/package.json deleted file mode 100644 index 04f31aaa4..000000000 --- a/packages/layout/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-layout", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/layout/src/index.js b/packages/layout/src/index.js deleted file mode 100644 index 1e72fa395..000000000 --- a/packages/layout/src/index.js +++ /dev/null @@ -1,39 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'Layout', - provide() { - return { - layout: this - } - }, - props: { - ...$props, - tag: { - type: String, - default: 'div' - }, - size: { - type: String, - default: 'medium', - validator: (value) => ~['medium', 'small', 'mini'].indexOf(value) - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/layout/src/pc.vue b/packages/layout/src/pc.vue deleted file mode 100644 index 099faee1f..000000000 --- a/packages/layout/src/pc.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - - diff --git a/packages/link-menu/index.js b/packages/link-menu/index.js deleted file mode 100644 index a0829d49b..000000000 --- a/packages/link-menu/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import LinkMenu from './src/index' -import '@opentiny/vue-theme/link-menu/index.css' - -/* istanbul ignore next */ -LinkMenu.install = function (Vue) { - Vue.component(LinkMenu.name, LinkMenu) -} - -LinkMenu.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - LinkMenu.install(window.Vue) - } -} - -export default LinkMenu diff --git a/packages/link-menu/package.json b/packages/link-menu/package.json deleted file mode 100644 index 4880f0751..000000000 --- a/packages/link-menu/package.json +++ /dev/null @@ -1,21 +0,0 @@ -{ - "name": "@opentiny/vue-link-menu", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-input": "~0.1.0", - "@opentiny/vue-tree": "~0.1.0", - "@opentiny/vue-button": "~0.1.0", - "@opentiny/vue-dialog-box": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/link-menu/src/index.js b/packages/link-menu/src/index.js deleted file mode 100644 index d1b093d57..000000000 --- a/packages/link-menu/src/index.js +++ /dev/null @@ -1,70 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import { iconSearch } from '@opentiny/vue-icon' -import PCTemplate from './pc' - -const $constants = { - DIALOG_TITLE: 'ui.linkMenu.title' -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'LinkMenu', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - icon: Object, - searchIcon: { - type: Object, - default: () => iconSearch() - }, - data: { - type: Array - }, - maxItem: { - type: Number, - validator: (value) => value >= 0 - }, - title: { - type: String, - default: '' - }, - defaultExpandAll: { - type: Boolean, - default: false - }, - ellipsis: { - type: Boolean, - default: true - }, - wrap: { - type: Boolean, - default: false - }, - props: { - default: () => ({ children: 'children', disabled: 'disabled', label: 'label' }) - }, - getMenuDataSync: Function, - keepSelectedNodes: { - type: Boolean, - default: true - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/link-menu/src/pc.vue b/packages/link-menu/src/pc.vue deleted file mode 100644 index 8d041a938..000000000 --- a/packages/link-menu/src/pc.vue +++ /dev/null @@ -1,100 +0,0 @@ - - - - diff --git a/packages/link/index.js b/packages/link/index.js deleted file mode 100644 index f09685805..000000000 --- a/packages/link/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Link from './src/index' -import '@opentiny/vue-theme/link/index.css' - -/* istanbul ignore next */ -Link.install = function (Vue) { - Vue.component(Link.name, Link) -} - -Link.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Link.install(window.Vue) - } -} - -export default Link diff --git a/packages/link/package.json b/packages/link/package.json deleted file mode 100644 index 4ec68d550..000000000 --- a/packages/link/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-link", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/link/src/index.js b/packages/link/src/index.js deleted file mode 100644 index ebbcc8db7..000000000 --- a/packages/link/src/index.js +++ /dev/null @@ -1,36 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $prefix, $props, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'Link', - props: { - ...$props, - type: { - type: String, - default: 'default' - }, - underline: { - type: Boolean, - default: true - }, - href: String, - icon: [Object, String], - disabled: Boolean - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/link/src/pc.vue b/packages/link/src/pc.vue deleted file mode 100644 index 11b938f78..000000000 --- a/packages/link/src/pc.vue +++ /dev/null @@ -1,40 +0,0 @@ - - - - diff --git a/packages/list/index.js b/packages/list/index.js deleted file mode 100644 index 198e7c0da..000000000 --- a/packages/list/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import List from './src/index.vue' -import '@opentiny/vue-theme-mobile/list/index.css' - -/* istanbul ignore next */ -List.install = function (Vue) { - Vue.component(List.name, List) -} - -List.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - List.install(window.Vue) - } -} - -export default List diff --git a/packages/list/package.json b/packages/list/package.json deleted file mode 100644 index 57a0ff9a9..000000000 --- a/packages/list/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-list", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/list/src/index.vue b/packages/list/src/index.vue deleted file mode 100644 index 7f1fa942d..000000000 --- a/packages/list/src/index.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - - diff --git a/packages/loading/index.js b/packages/loading/index.js deleted file mode 100644 index cd7d47d09..000000000 --- a/packages/loading/index.js +++ /dev/null @@ -1,41 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import service from './src/service.js' -import directive from './src/directive.js' -import '@opentiny/vue-theme/loading/index.css' -import { setupComponent } from '@opentiny/vue-common' - -let Loadings = {} - -/* istanbul ignore next */ -Loadings.install = function (app) { - app.directive('loading', directive) -} - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Loadings.install(window.Vue) - } -} - -setupComponent.TINYLoading = { - init(root) { - root.$loading = service - } -} - -Loadings.service = service -Loadings.directive = directive -Loadings.version = process.env.COMPONENT_VERSION - -export default Loadings diff --git a/packages/loading/package.json b/packages/loading/package.json deleted file mode 100644 index e154f679d..000000000 --- a/packages/loading/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-loading", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/loading/src/index.js b/packages/loading/src/index.js deleted file mode 100644 index ce1a054e8..000000000 --- a/packages/loading/src/index.js +++ /dev/null @@ -1,45 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import { constants, tinyMode } from './service' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const template = () => { - if (process.env.TINY_MODE === 'pc') { - return PCTemplate - } else if (process.env.TINY_MODE === 'mobile') { - return MobileTemplate - } else { - return tinyMode === 'mobile' ? MobileTemplate : PCTemplate - } -} - -export default { - name: $prefix + 'Loading', - emits: [], - props: { - ...$props, - type: { - type: String, - validator: (value) => ~['primary', 'simple'].indexOf(value) - }, - loadtext: { - type: String, - default: () => constants.LOAD_ICON_TEXT - }, - _constants: Object - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/loading/src/index.vue b/packages/loading/src/index.vue deleted file mode 100644 index 9bee12a7f..000000000 --- a/packages/loading/src/index.vue +++ /dev/null @@ -1,45 +0,0 @@ - - - - diff --git a/packages/loading/src/mobile.vue b/packages/loading/src/mobile.vue deleted file mode 100644 index ab3228ebc..000000000 --- a/packages/loading/src/mobile.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - - \ No newline at end of file diff --git a/packages/loading/src/pc.vue b/packages/loading/src/pc.vue deleted file mode 100644 index 9e7f6f338..000000000 --- a/packages/loading/src/pc.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - \ No newline at end of file diff --git a/packages/locale/format.js b/packages/locale/format.js deleted file mode 100644 index 7d6740503..000000000 --- a/packages/locale/format.js +++ /dev/null @@ -1,38 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -const RE_NARGS = /(%|)\{([0-9a-zA-Z_]+)\}/g - -export default function (string, ...args) { - if (args.length === 1 && typeof args[0] === 'object') { - args = args[0] - } - - if (!args || !args.hasOwnProperty) { - args = {} - } - - return string.replace(RE_NARGS, (match, prefix, i, index) => { - let result - - if (string[index - 1] === '{' && string[index + match.length] === '}') { - return i - } else { - result = Object.prototype.hasOwnProperty.call(args, i) ? args[i] : null - - if (result === null || result === undefined) { - return '' - } - - return result - } - }) -} diff --git a/packages/locale/glob.js b/packages/locale/glob.js deleted file mode 100644 index 3610cf35a..000000000 --- a/packages/locale/glob.js +++ /dev/null @@ -1,161 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { formatNumber, recoverNumber } from '@opentiny/vue-renderless/common/decimal' -import { toDate, getDateWithNewTimezone } from '@opentiny/vue-renderless/common/date' -import { isPlainObject, isDate, isNull } from '@opentiny/vue-renderless/common/type' -import { formatDate } from '@opentiny/vue-renderless/common/deps/date-util' -import { isNumber } from '@opentiny/vue-renderless/common/type' - -export const getNumberFormat = (config) => { - const groupSize = 3 - let groupSeparator = ',' - let decimalSeparator = '.' - - if (isPlainObject(config)) { - return config - } - - if (typeof config === 'string') { - const match = config.match(/\d{2}([^\d]?)\d{3}([^\d]?)\d{2}/) - - if (match && match.length === 3) { - groupSeparator = match[1] - decimalSeparator = match[2] - } - } - - return { - groupSeparator, - groupSize, - decimalSeparator - } -} - -export const getDateFormat = (config) => { - const { DateFormat = 'yyyy-MM-dd', TimeFormat = 'HH:mm:ss' } = config - - return { - DateFormat, - DateTimeFormat: `${DateFormat} ${TimeFormat}`, - TimeFormat - } -} - -const TZRE = /(-|\+)(\d{2}):?(\d{2})$/ - -export const getStrTimezone = (value) => { - const localTimeZone = 0 - new Date().getTimezoneOffset() / 60 - const match = typeof value === 'string' && value.match(TZRE) - - if (match) { - const minoffset = Number(match[2]) + Number(match[3]) / 60 - value = minoffset * `${match[1]}1` - } - - if (isNumber(value) && value >= -12 && value <= 12) { - return value - } - - return localTimeZone -} - -const getOptionFormatConfig = (opt) => () => opt - -const setOptionFormatConfig = (opt) => (obj) => Object.assign(opt, obj) - -const getOptionNumberFormat = (opt) => () => opt.NumberFormat - -const getOptionDateFormat = (opt) => () => ({ - DateTimeFormat: opt.DateTimeFormat, - TimeFormat: opt.TimeFormat, - Timezone: opt.Timezone, - DateFormat: opt.DateFormat, - DbTimezone: opt.DbTimezone -}) - -/** - * - * @param {Date|String} value 日期或日期字符串 - * @param {String} format 格式化模式 - * @returns {String} - */ -const formatOptionDate = (opt, t) => (value, format, convert) => { - if (isNull(value)) { - return value - } - - let date = isDate(value) ? value : toDate(value) - let dbtimezone = opt.DbTimezone - let includeTz = value.match && value.match(TZRE) - const convers = format === false || convert === false - - if (includeTz) { - dbtimezone = getStrTimezone(value) - date = toDate(value.replace('T', ' ').slice(0, -5)) - } - - if (!convers) { - date = this.getDateWithNewTimezone(date, dbtimezone, opt.Timezone) - } - - return isDate(date) ? formatDate(date, format || opt.DateFormat, t) : null -} - -/** - * - * @param {Number} value 数字 - * @param {Object} format 格式化选项 - * @returns {String} - */ -const formatOptionNumber = (opt) => (value, format) => formatNumber(value, { ...opt.NumberFormat, ...format }) - -/** - * - * @param {String} value 格式化后的字符串 - * @param {Object} format 格式化选项 - * @returns {Number} - */ -const recoverOptionNumber = (opt) => (value, format) => recoverNumber(value, { ...opt.NumberFormat, ...format }) - -/** - * - * @param {Date} value Date - * @param {Number} from - * @param {Number} to - * @returns {String} - */ -const getOptionDateWithNewTimezone = (opt) => (value, from, to) => { - from = from === 0 ? from : from || opt.DbTimezone - to = to === 0 ? to : to || opt.Timezone - - return getDateWithNewTimezone(value, from, to) -} - -export default (t) => (config) => { - const opt = { - ...getDateFormat(config), - NumberFormat: getNumberFormat(config.NumberFormat), - DbTimezone: getStrTimezone(config.DbTimezone), - Timezone: getStrTimezone(config.Timezone) - } - - return { - getFormatConfig: getOptionFormatConfig(opt), - setFormatConfig: setOptionFormatConfig(opt), - getNumberFormat: getOptionNumberFormat(opt), - getDateFormat: getOptionDateFormat(opt), - formatDate: formatOptionDate(opt, t), - formatNumber: formatOptionNumber(opt), - recoverNumber: recoverOptionNumber(opt), - getDateWithNewTimezone: getOptionDateWithNewTimezone(opt) - } -} diff --git a/packages/locale/index.js b/packages/locale/index.js deleted file mode 100644 index 90346a9b3..000000000 --- a/packages/locale/index.js +++ /dev/null @@ -1,36 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import * as all from 'vue' -import * as vue2 from '@opentiny/vue-locale/vue2' -import * as vue3 from '@opentiny/vue-locale/vue3' -import glob from './glob' - -const vue = Object.keys(all).length > 1 ? vue3 : vue2 - -export const { use, t, i18n, initI18n, extend, zhCN, enUS, language } = vue - -export const globalization = glob(t) - -export const version = process.env.COMPONENT_VERSION - -export default { - use, - t, - i18n, - initI18n, - extend, - zhCN, - enUS, - language, - ...vue.default, - globalization -} diff --git a/packages/locale/package.json b/packages/locale/package.json deleted file mode 100644 index e4b8784b1..000000000 --- a/packages/locale/package.json +++ /dev/null @@ -1,10 +0,0 @@ -{ - "name": "@opentiny/vue-locale", - "version": "0.1.0", - "description": "", - "main": "index.js", - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/locale/vue2.js b/packages/locale/vue2.js deleted file mode 100644 index 0bc1a6f27..000000000 --- a/packages/locale/vue2.js +++ /dev/null @@ -1,105 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Vue from 'vue' -import zhCN from '@opentiny/vue-locale/lang/zh-CN' -import enUS from '@opentiny/vue-locale/lang/en' -import format from '@opentiny/vue-locale/format' -import { extend } from '@opentiny/vue-renderless/common/object' - -let lang = zhCN - -let i18nHandler = null - -const translate = (message, options, path) => { - let paths = path.split('.') - let current = lang - for (let pos = 0, len = paths.length; pos < len; pos++) { - const property = paths[pos] - message = current[property] || '' - if (pos === len - 1) { - return format(message, options) - } - if (!message) { - return '' - } - current = message - } - - return '' -} - -export function t(path, options) { - let message = i18nHandler && i18nHandler.apply(this, arguments) - if (message === null || message === undefined || message === path) { - return translate(message, options, path) - } else { - return message - } -} - -export const use = (language) => { - lang = language || lang - return lang -} - -export const language = () => lang.code - -export const i18n = (func) => { - i18nHandler = - func || - function () { - const vuei18n = Object.getPrototypeOf(this || Vue).$t - - if (typeof vuei18n === 'function' && vuei18n !== t) { - return vuei18n.apply(this, arguments) - } - } - - return i18nHandler -} - -export const initI18n = ({ VueI18n, messages = {}, i18n = {}, merge }) => { - if (typeof merge !== 'function') { - merge = ({ lang, i18n, messages }) => extend(true, lang, i18n.messages, messages) - } - - const lang = { zhCN, enUS } - - if (typeof VueI18n === 'function') { - const vueI18n = new VueI18n({ - locale: i18n.locale || 'zhCN', - messages: merge({ lang, i18n, messages }) - }) - - i18nHandler = (key, value) => vueI18n.t(key, value) - - return vueI18n - } - - if (Vue && typeof Vue.prototype.$t !== 'function') { - Vue.prototype.$t = t - } - - return merge({ lang, i18n, messages }) -} - -export { zhCN, enUS } - -export default { - extend, - i18n, - initI18n, - t, - use, - enUS, - zhCN -} diff --git a/packages/locale/vue3.js b/packages/locale/vue3.js deleted file mode 100644 index 07ade6345..000000000 --- a/packages/locale/vue3.js +++ /dev/null @@ -1,95 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import zhCN from '@opentiny/vue-locale/lang/zh-CN' -import enUS from '@opentiny/vue-locale/lang/en' -import format from '@opentiny/vue-locale/format' -import { extend } from '@opentiny/vue-renderless/common/object' - -let lang = zhCN -let i18nHandler = null - -const translate = (options, path) => { - const array = path.split('.') - let value = null - let current = lang - for (let i = 0, j = array.length; i < j; i++) { - const property = array[i] - value = current[property] || '' - if (i === j - 1) { - return format(value, options) - } - if (!value) { - return '' - } - current = value - } - return '' -} - -export function t(path, options) { - if (i18nHandler) { - return i18nHandler.apply(this, arguments) - } - return translate(options, path) -} - -export const use = (l) => { - lang = l || lang - return lang -} - -export const language = () => lang.code - -export const i18n = (fn) => { - i18nHandler = fn || t - return i18nHandler -} - -export const initI18n = ({ app, createI18n, messages = {}, i18n = {}, merge }) => { - if (typeof merge !== 'function') { - merge = ({ lang, i18n, messages }) => extend(true, lang, i18n.messages, messages) - } - - const lang = { - zhCN, - enUS - } - - if (typeof createI18n === 'function') { - const vueI18n = createI18n({ - locale: i18n.locale || 'zhCN', - messages: merge({ lang, i18n, messages }) - }) - - i18nHandler = (key, value) => vueI18n.global.t(key, value) - - return vueI18n - } - - if (app && app.config && app.config.globalProperties) { - app.config.globalProperties.$t = t - } - - return merge({ lang, i18n, messages }) -} - -export { zhCN, enUS } - -export default { - use, - t, - i18n, - initI18n, - extend, - zhCN, - enUS -} diff --git a/packages/locales/index.js b/packages/locales/index.js deleted file mode 100644 index 2247f0c0b..000000000 --- a/packages/locales/index.js +++ /dev/null @@ -1,18 +0,0 @@ -import Locales from './src/index.vue' -import '@opentiny/vue-theme/locales/index.css' - -/* istanbul ignore next */ -Locales.install = function (Vue) { - Vue.component(Locales.name, Locales) -} - -Locales.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Locales.install(window.Vue) - } -} - -export default Locales diff --git a/packages/locales/package.json b/packages/locales/package.json deleted file mode 100644 index 2015aa12b..000000000 --- a/packages/locales/package.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "name": "@opentiny/vue-locales", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-popover": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/locales/src/index.vue b/packages/locales/src/index.vue deleted file mode 100644 index dcbc751d3..000000000 --- a/packages/locales/src/index.vue +++ /dev/null @@ -1,78 +0,0 @@ - - - diff --git a/packages/logon-user/index.js b/packages/logon-user/index.js deleted file mode 100644 index fefce4784..000000000 --- a/packages/logon-user/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import LogonUser from './src/index.vue' - -/* istanbul ignore next */ -LogonUser.install = function (Vue) { - Vue.component(LogonUser.name, LogonUser) -} - -LogonUser.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - LogonUser.install(window.Vue) - } -} - -export default LogonUser diff --git a/packages/logon-user/package.json b/packages/logon-user/package.json deleted file mode 100644 index c5e6b04f3..000000000 --- a/packages/logon-user/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-logon-user", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/logon-user/src/index.vue b/packages/logon-user/src/index.vue deleted file mode 100644 index 89ae47ddc..000000000 --- a/packages/logon-user/src/index.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/packages/logout/index.js b/packages/logout/index.js deleted file mode 100644 index dc295e7ce..000000000 --- a/packages/logout/index.js +++ /dev/null @@ -1,18 +0,0 @@ -import Logout from './src/index' -import '@opentiny/vue-theme/logout/index.css' - -/* istanbul ignore next */ -Logout.install = function (Vue) { - Vue.component(Logout.name, Logout) -} - -Logout.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Logout.install(window.Vue) - } -} - -export default Logout diff --git a/packages/logout/package.json b/packages/logout/package.json deleted file mode 100644 index 712fcb5e6..000000000 --- a/packages/logout/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-logout", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/logout/src/index.js b/packages/logout/src/index.js deleted file mode 100644 index f71aac7b9..000000000 --- a/packages/logout/src/index.js +++ /dev/null @@ -1,26 +0,0 @@ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc.vue' - -const template = () => PCTemplate - -export default { - name: $prefix + 'Logout', - props: { - ...$props, - guestRole: { - type: String, - default: '-Default-' - }, - getLogoutUrl: Function, - redirectUrl: String, - isLocal: Boolean, - network: Function, - isMock: Boolean, - isGuestUser: Function, - showLogin: Function, - beforeLogout: Function - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/logout/src/pc.vue b/packages/logout/src/pc.vue deleted file mode 100644 index 768809a09..000000000 --- a/packages/logout/src/pc.vue +++ /dev/null @@ -1,17 +0,0 @@ - - - diff --git a/packages/milestone/index.js b/packages/milestone/index.js deleted file mode 100644 index d8beb1146..000000000 --- a/packages/milestone/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Milestone from './src/index' -import '@opentiny/vue-theme/milestone/index.css' - -/* istanbul ignore next */ -Milestone.install = function (Vue) { - Vue.component(Milestone.name, Milestone) -} - -Milestone.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Milestone.install(window.Vue) - } -} - -export default Milestone diff --git a/packages/milestone/package.json b/packages/milestone/package.json deleted file mode 100644 index 97d369c52..000000000 --- a/packages/milestone/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-milestone", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-tooltip": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/milestone/src/index.js b/packages/milestone/src/index.js deleted file mode 100644 index c27ca1b09..000000000 --- a/packages/milestone/src/index.js +++ /dev/null @@ -1,96 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - DEFAULT_COLOR: '#1890FF', - DEFAULT_BACK_COLOR: '#FFFFFF', - BOX_SHADOW_PX: '0px 0px 0px 4px', - FLAG_CONTENT_CLS: '.content' -} - -const template = function () { - return PCTemplate -} - -export default { - name: $prefix + 'Milestone', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - showNumber: { - type: Boolean, - default: true - }, - solid: { - type: Boolean, - default: false - }, - lineStyle: { - type: [String, Number], - default: 1 - }, - flagBefore: { - type: Boolean, - default: false - }, - completedField: { - type: String, - default: 'completed' - }, - milestonesStatus: { - type: Object, - default: () => ({}) - }, - statusField: { - type: String, - default: 'status' - }, - nameField: { - type: String, - default: 'name' - }, - flagField: { - type: String, - default: 'flags' - }, - flagNameField: { - type: String, - default: 'name' - }, - flagContentField: { - type: String, - default: 'content' - }, - flagStatusField: { - type: String, - default: 'status' - }, - timeField: { - type: String, - default: 'time' - }, - data: [Object, Array], - space: Number, - start: { - type: Number, - default: -1 - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/milestone/src/pc.vue b/packages/milestone/src/pc.vue deleted file mode 100644 index efe79e518..000000000 --- a/packages/milestone/src/pc.vue +++ /dev/null @@ -1,129 +0,0 @@ - - - - diff --git a/packages/mini-picker/index.js b/packages/mini-picker/index.js deleted file mode 100644 index f913e6d94..000000000 --- a/packages/mini-picker/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import MiniPicker from './src/index.vue' -import '@opentiny/vue-theme-mobile/mini-picker/index.css' - -/* istanbul ignore next */ -MiniPicker.install = function (Vue) { - Vue.component(MiniPicker.name, MiniPicker) -} - -MiniPicker.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - MiniPicker.install(window.Vue) - } -} - -export default MiniPicker diff --git a/packages/mini-picker/package.json b/packages/mini-picker/package.json deleted file mode 100644 index 1fbcab699..000000000 --- a/packages/mini-picker/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-mini-picker", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-picker-column": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/mini-picker/src/index.vue b/packages/mini-picker/src/index.vue deleted file mode 100644 index 63996701c..000000000 --- a/packages/mini-picker/src/index.vue +++ /dev/null @@ -1,110 +0,0 @@ - - - - diff --git a/packages/modal/index.js b/packages/modal/index.js deleted file mode 100644 index 8474c30a5..000000000 --- a/packages/modal/index.js +++ /dev/null @@ -1,120 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { createComponent, setupComponent } from '@opentiny/vue-common' -import { MsgQueue } from '@opentiny/vue-renderless/modal' -import TINYModal from './src/index' - -TINYModal.version = process.env.COMPONENT_VERSION - -TINYModal.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -export function Modal(options) { - return new Promise((resolve) => { - if (options && options.id && MsgQueue.some((comp) => comp.id === options.id)) { - resolve('exist') - } else { - let events = options.events || {} - let $modal - - options.events = { - ...events, - hide(params) { - events.hide && events.hide.call(this, params) - - $modal.beforeUnmouted() - resolve(params.type) - } - } - - $modal = createComponent({ - el: document.createElement('div'), - propsData: options, - component: TINYModal - }) - - $modal.open() - } - }) -} - -const modal = Modal - -const types = ['alert', 'confirm', 'message'] - -types.forEach((type, index) => { - let defOpts = { showFooter: true } - - if (index === 2) { - defOpts = { - mask: false, - lockView: false, - showHeader: false - } - } - - defOpts.type = type - - if (index === 1) { - defOpts.status = 'question' - } - - TINYModal[type] = Modal[type] = function (message, title, options) { - let opts - - if (typeof message === 'object' && message !== null) { - opts = message - } else if (title) { - opts = { title } - } - - if (message === undefined || message === null) { - message = '' - } - - return modal({ - message: message.toString(), - type, - ...defOpts, - ...opts, - ...options - }) - } -}) - -export let alert = Modal.alert -export let message = Modal.message -export let confirm = Modal.confirm - -TINYModal.installed = false -setupComponent.TINYModal = { - install(Vue) { - if (TINYModal.installed) return - - Vue.component(TINYModal.name, TINYModal) - - TINYModal.installed = true - }, - init(root) { - root.$alert = Modal.alert - root.$message = Modal.message - root.$confirm = Modal.confirm - } -} - -TINYModal.install = function (Vue) { - setupComponent.TINYModal.install(Vue) -} - -export default TINYModal diff --git a/packages/modal/package.json b/packages/modal/package.json deleted file mode 100644 index 9a773939d..000000000 --- a/packages/modal/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-modal", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-button": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/modules.json b/packages/modules.json new file mode 100644 index 000000000..122105e1a --- /dev/null +++ b/packages/modules.json @@ -0,0 +1,1548 @@ +{ + "ActionMenu": { + "path": "vue/src/action-menu/index.ts", + "type": "component", + "exclude": false + }, + "ActionSheet": { + "path": "vue/src/action-sheet/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "mobile" + }, + "Alert": { + "path": "vue/src/alert/index.ts", + "type": "component", + "exclude": false + }, + "AlertMobile": { + "path": "vue/src/alert/src/mobile.vue", + "type": "template", + "exclude": false + }, + "AlertPc": { + "path": "vue/src/alert/src/pc.vue", + "type": "template", + "exclude": false + }, + "Amount": { + "path": "vue/src/amount/index.ts", + "type": "component", + "exclude": false + }, + "Anchor": { + "path": "vue/src/anchor/index.ts", + "type": "component", + "exclude": false + }, + "Anchor": { + "path": "packages/anchor/index.js", + "type": "component", + "exclude": false + }, + "Anchor": { + "path": "packages/anchor/index.js", + "type": "component", + "exclude": false + }, + "Area": { + "path": "vue/src/area/index.ts", + "type": "component", + "exclude": false + }, + "Autocomplete": { + "path": "vue/src/autocomplete/index.ts", + "type": "component", + "exclude": false + }, + "AutocompletePc": { + "path": "vue/src/autocomplete/src/pc.vue", + "type": "template", + "exclude": false + }, + "AutonaviMap": { + "path": "vue/src/chart/autonavi-map/index.ts", + "type": "component", + "exclude": false + }, + "Avatar": { + "path": "vue/src/avatar/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "mobile" + }, + "Badge": { + "path": "vue/src/badge/index.ts", + "type": "component", + "exclude": false + }, + "BadgeMobile": { + "path": "vue/src/badge/src/mobile.vue", + "type": "template", + "exclude": false + }, + "BadgePc": { + "path": "vue/src/badge/src/pc.vue", + "type": "template", + "exclude": false + }, + "BaiduMap": { + "path": "vue/src/chart/baidu-map/index.ts", + "type": "component", + "exclude": false + }, + "Breadcrumb": { + "path": "vue/src/breadcrumb/index.ts", + "type": "component", + "exclude": false + }, + "BreadcrumbItem": { + "path": "vue/src/breadcrumb-item/index.ts", + "type": "component", + "exclude": false + }, + "BreadcrumbItemPc": { + "path": "vue/src/breadcrumb-item/src/pc.vue", + "type": "template", + "exclude": false + }, + "BreadcrumbPc": { + "path": "vue/src/breadcrumb/src/pc.vue", + "type": "template", + "exclude": false + }, + "BulletinBoard": { + "path": "vue/src/bulletin-board/index.ts", + "type": "component", + "exclude": false + }, + "BulletinBoardPc": { + "path": "vue/src/bulletin-board/src/pc.vue", + "type": "template", + "exclude": false + }, + "Button": { + "path": "vue/src/button/index.ts", + "type": "component", + "exclude": false + }, + "ButtonGroup": { + "path": "vue/src/button-group/index.ts", + "type": "component", + "exclude": false + }, + "ButtonGroupPc": { + "path": "vue/src/button-group/src/pc.vue", + "type": "template", + "exclude": false + }, + "ButtonMobile": { + "path": "vue/src/button/src/mobile.vue", + "type": "template", + "exclude": false + }, + "ButtonPc": { + "path": "vue/src/button/src/pc.vue", + "type": "template", + "exclude": false + }, + "Calendar": { + "path": "vue/src/calendar/index.ts", + "type": "component", + "exclude": false + }, + "CalendarPc": { + "path": "vue/src/calendar/src/pc.vue", + "type": "template", + "exclude": false + }, + "CardTemplate": { + "path": "vue/src/card-template/index.ts", + "type": "component", + "exclude": false + }, + "CardTemplatePc": { + "path": "vue/src/card-template/src/pc.vue", + "type": "template", + "exclude": false + }, + "Carousel": { + "path": "vue/src/carousel/index.ts", + "type": "component", + "exclude": false + }, + "CarouselItem": { + "path": "vue/src/carousel-item/index.ts", + "type": "component", + "exclude": false + }, + "CarouselItemPc": { + "path": "vue/src/carousel-item/src/pc.vue", + "type": "template", + "exclude": false + }, + "CarouselPc": { + "path": "vue/src/carousel/src/pc.vue", + "type": "template", + "exclude": false + }, + "Cascader": { + "path": "vue/src/cascader/index.ts", + "type": "component", + "exclude": false + }, + "CascaderMenu": { + "path": "vue/src/cascader-menu/index.ts", + "type": "component", + "exclude": false + }, + "CascaderNode": { + "path": "vue/src/cascader-node/index.ts", + "type": "component", + "exclude": false + }, + "CascaderPanel": { + "path": "vue/src/cascader-panel/index.ts", + "type": "component", + "exclude": false + }, + "CascaderPc": { + "path": "vue/src/cascader/src/pc.vue", + "type": "template", + "exclude": false + }, + "Chart": { + "path": "vue/src/chart/index.ts", + "type": "component", + "exclude": false + }, + "ChartBar": { + "path": "vue/src/chart/chart-bar/index.ts", + "type": "component", + "exclude": false + }, + "ChartBoxplot": { + "path": "vue/src/chart/chart-boxplot/index.ts", + "type": "component", + "exclude": false + }, + "ChartCandle": { + "path": "vue/src/chart/chart-candle/index.ts", + "type": "component", + "exclude": false + }, + "ChartCore": { + "path": "vue/src/chart/chart-core/index.ts", + "type": "component", + "exclude": false + }, + "ChartFunnel": { + "path": "vue/src/chart/chart-funnel/index.ts", + "type": "component", + "exclude": false + }, + "ChartGauge": { + "path": "vue/src/chart/chart-gauge/index.ts", + "type": "component", + "exclude": false + }, + "ChartGraph": { + "path": "vue/src/chart/chart-graph/index.ts", + "type": "component", + "exclude": false + }, + "ChartHeatmap": { + "path": "vue/src/chart/chart-heatmap/index.ts", + "type": "component", + "exclude": false + }, + "ChartHistogram": { + "path": "vue/src/chart/chart-histogram/index.ts", + "type": "component", + "exclude": false + }, + "ChartLine": { + "path": "vue/src/chart/chart-line/index.ts", + "type": "component", + "exclude": false + }, + "ChartLiquidfill": { + "path": "vue/src/chart/chart-liquidfill/index.ts", + "type": "component", + "exclude": false + }, + "ChartMap": { + "path": "vue/src/chart/chart-map/index.ts", + "type": "component", + "exclude": false + }, + "ChartPie": { + "path": "vue/src/chart/chart-pie/index.ts", + "type": "component", + "exclude": false + }, + "ChartRadar": { + "path": "vue/src/chart/chart-radar/index.ts", + "type": "component", + "exclude": false + }, + "ChartRing": { + "path": "vue/src/chart/chart-ring/index.ts", + "type": "component", + "exclude": false + }, + "ChartSankey": { + "path": "vue/src/chart/chart-sankey/index.ts", + "type": "component", + "exclude": false + }, + "ChartScatter": { + "path": "vue/src/chart/chart-scatter/index.ts", + "type": "component", + "exclude": false + }, + "ChartSunburst": { + "path": "vue/src/chart/chart-sunburst/index.ts", + "type": "component", + "exclude": false + }, + "ChartTree": { + "path": "vue/src/chart/chart-tree/index.ts", + "type": "component", + "exclude": false + }, + "ChartWaterfall": { + "path": "vue/src/chart/chart-waterfall/index.ts", + "type": "component", + "exclude": false + }, + "ChartWordcloud": { + "path": "vue/src/chart/chart-wordcloud/index.ts", + "type": "component", + "exclude": false + }, + "Checkbox": { + "path": "vue/src/checkbox/index.ts", + "type": "component", + "exclude": false + }, + "CheckboxButton": { + "path": "vue/src/checkbox-button/index.ts", + "type": "component", + "exclude": false + }, + "CheckboxButtonPc": { + "path": "vue/src/checkbox-button/src/pc.vue", + "type": "template", + "exclude": false + }, + "CheckboxGroup": { + "path": "vue/src/checkbox-group/index.ts", + "type": "component", + "exclude": false + }, + "CheckboxGroupMobile": { + "path": "vue/src/checkbox-group/src/mobile.vue", + "type": "template", + "exclude": false + }, + "CheckboxGroupPc": { + "path": "vue/src/checkbox-group/src/pc.vue", + "type": "template", + "exclude": false + }, + "CheckboxMobile": { + "path": "vue/src/checkbox/src/mobile.vue", + "type": "template", + "exclude": false + }, + "CheckboxPc": { + "path": "vue/src/checkbox/src/pc.vue", + "type": "template", + "exclude": false + }, + "Col": { + "path": "vue/src/col/index.ts", + "type": "component", + "exclude": false + }, + "ColPc": { + "path": "vue/src/col/src/pc.vue", + "type": "template", + "exclude": false + }, + "Collapse": { + "path": "vue/src/collapse/index.ts", + "type": "component", + "exclude": false + }, + "CollapseItem": { + "path": "vue/src/collapse-item/index.ts", + "type": "component", + "exclude": false + }, + "CollapseItemPc": { + "path": "vue/src/collapse-item/src/pc.vue", + "type": "template", + "exclude": false + }, + "CollapsePc": { + "path": "vue/src/collapse/src/pc.vue", + "type": "template", + "exclude": false + }, + "CollapseTransition": { + "path": "vue/src/collapse-transition/index.ts", + "type": "component", + "exclude": false + }, + "Common": { + "path": "vue-common/src/index.ts", + "type": "module", + "exclude": false + }, + "Company": { + "path": "vue/src/company/index.ts", + "type": "component", + "exclude": false + }, + "CompanyPc": { + "path": "vue/src/company/src/pc.vue", + "type": "template", + "exclude": false + }, + "Container": { + "path": "vue/src/container/index.ts", + "type": "component", + "exclude": false + }, + "ContainerPc": { + "path": "vue/src/container/src/pc.vue", + "type": "template", + "exclude": false + }, + "Country": { + "path": "vue/src/country/index.ts", + "type": "component", + "exclude": false + }, + "CountryPc": { + "path": "vue/src/country/src/pc.vue", + "type": "template", + "exclude": false + }, + "CreditCard": { + "path": "vue/src/credit-card/index.ts", + "type": "component", + "exclude": false + }, + "CreditCardForm": { + "path": "vue/src/credit-card-form/index.ts", + "type": "component", + "exclude": false + }, + "CreditCardFormPc": { + "path": "vue/src/credit-card-form/src/pc.vue", + "type": "template", + "exclude": false + }, + "CreditCardPc": { + "path": "vue/src/credit-card/src/pc.vue", + "type": "template", + "exclude": false + }, + "Crop": { + "path": "vue/src/crop/index.ts", + "type": "component", + "exclude": false + }, + "Currency": { + "path": "vue/src/currency/index.ts", + "type": "component", + "exclude": false + }, + "CurrencyPc": { + "path": "vue/src/currency/src/pc.vue", + "type": "template", + "exclude": false + }, + "DatePanel": { + "path": "vue/src/date-panel/index.ts", + "type": "component", + "exclude": false + }, + "DatePicker": { + "path": "vue/src/date-picker/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "all" + }, + "DatePickerMobile": { + "path": "vue/src/date-picker/src/mobile.vue", + "type": "template", + "exclude": false + }, + "DatePickerPc": { + "path": "vue/src/date-picker/src/pc.vue", + "type": "template", + "exclude": false + }, + "DateRange": { + "path": "vue/src/date-range/index.ts", + "type": "component", + "exclude": false + }, + "DateTable": { + "path": "vue/src/date-table/index.ts", + "type": "component", + "exclude": false + }, + "Dept": { + "path": "vue/src/dept/index.ts", + "type": "component", + "exclude": false + }, + "DeptPc": { + "path": "vue/src/dept/src/pc.vue", + "type": "template", + "exclude": false + }, + "DetailPage": { + "path": "vue/src/detail-page/index.ts", + "type": "component", + "exclude": false + }, + "DetailPagePc": { + "path": "vue/src/detail-page/src/pc.vue", + "type": "template", + "exclude": false + }, + "DialogBox": { + "path": "vue/src/dialog-box/index.ts", + "type": "component", + "exclude": false + }, + "DialogBoxMobile": { + "path": "vue/src/dialog-box/src/mobile.vue", + "type": "template", + "exclude": false + }, + "DialogBoxPc": { + "path": "vue/src/dialog-box/src/pc.vue", + "type": "template", + "exclude": false + }, + "DropRoles": { + "path": "vue/src/drop-roles/index.ts", + "type": "component", + "exclude": false + }, + "DropRolesPc": { + "path": "vue/src/drop-roles/src/pc.vue", + "type": "template", + "exclude": false + }, + "DropTimes": { + "path": "vue/src/drop-times/index.ts", + "type": "component", + "exclude": false + }, + "DropTimesPc": { + "path": "vue/src/drop-times/src/pc.vue", + "type": "template", + "exclude": false + }, + "Dropdown": { + "path": "vue/src/dropdown/index.ts", + "type": "component", + "exclude": false + }, + "DropdownItem": { + "path": "vue/src/dropdown-item/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "mobile" + }, + "DropdownItemMobile": { + "path": "vue/src/dropdown-item/src/mobile.vue", + "type": "template", + "exclude": false + }, + "DropdownItemPc": { + "path": "vue/src/dropdown-item/src/pc.vue", + "type": "template", + "exclude": false + }, + "DropdownMenu": { + "path": "vue/src/dropdown-menu/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "mobile" + }, + "DropdownMenuMobile": { + "path": "vue/src/dropdown-menu/src/mobile.vue", + "type": "template", + "exclude": false + }, + "DropdownMenuPc": { + "path": "vue/src/dropdown-menu/src/pc.vue", + "type": "template", + "exclude": false + }, + "Espace": { + "path": "vue/src/espace/index.ts", + "type": "component", + "exclude": false + }, + "EspacePc": { + "path": "vue/src/espace/src/pc.vue", + "type": "template", + "exclude": false + }, + "Exception": { + "path": "vue/src/exception/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "mobile" + }, + "FallMenu": { + "path": "vue/src/fall-menu/index.ts", + "type": "component", + "exclude": false + }, + "FallMenuPc": { + "path": "vue/src/fall-menu/src/pc.vue", + "type": "template", + "exclude": false + }, + "FileUpload": { + "path": "vue/src/file-upload/index.ts", + "type": "component", + "exclude": false + }, + "FileUploadMobile": { + "path": "vue/src/file-upload/src/mobile.vue", + "type": "template", + "exclude": false + }, + "FileUploadPc": { + "path": "vue/src/file-upload/src/pc.vue", + "type": "template", + "exclude": false + }, + "Floatbar": { + "path": "vue/src/floatbar/index.ts", + "type": "component", + "exclude": false + }, + "FloatbarPc": { + "path": "vue/src/floatbar/src/pc.vue", + "type": "template", + "exclude": false + }, + "Form": { + "path": "vue/src/form/index.ts", + "type": "component", + "exclude": false + }, + "FormItem": { + "path": "vue/src/form-item/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "all" + }, + "FormMobile": { + "path": "vue/src/form/src/mobile.vue", + "type": "template", + "exclude": false + }, + "FormPc": { + "path": "vue/src/form/src/pc.vue", + "type": "template", + "exclude": false + }, + "Fullscreen": { + "path": "vue/src/fullscreen/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "all" + }, + "Grid": { + "path": "vue/src/grid/index.ts", + "type": "component", + "exclude": false + }, + "GridColumn": { + "path": "vue/src/grid-column/index.ts", + "type": "component", + "exclude": false + }, + "GridManager": { + "path": "vue/src/grid-manager/index.ts", + "type": "component", + "exclude": false + }, + "GridToolbar": { + "path": "vue/src/grid-toolbar/index.ts", + "type": "component", + "exclude": false + }, + "GridToolbarCustom": { + "path": "vue/src/grid-toolbar/src/custom.vue", + "type": "template", + "exclude": false + }, + "GridToolbarCustom-select": { + "path": "vue/src/grid-toolbar/src/custom-select.vue", + "type": "template", + "exclude": false + }, + "GridToolbarCustom-select": { + "path": "packages/grid-toolbar/src/custom-select.vue", + "type": "template", + "exclude": false + }, + "GridToolbarCustom-select": { + "path": "packages/grid-toolbar/src/custom-select.vue", + "type": "template", + "exclude": false + }, + "GridToolbarCustom-switch": { + "path": "vue/src/grid-toolbar/src/custom-switch.vue", + "type": "template", + "exclude": false + }, + "Hrapprover": { + "path": "vue/src/hrapprover/index.ts", + "type": "component", + "exclude": false + }, + "HrapproverPc": { + "path": "vue/src/hrapprover/src/pc.vue", + "type": "template", + "exclude": false + }, + "Icon": { + "path": "vue-icon/index.ts", + "type": "module", + "exclude": false + }, + "Image": { + "path": "vue/src/image/index.ts", + "type": "component", + "exclude": false + }, + "ImagePc": { + "path": "vue/src/image/src/pc.vue", + "type": "template", + "exclude": false + }, + "ImageViewer": { + "path": "vue/src/image-viewer/index.ts", + "type": "component", + "exclude": false + }, + "ImageViewerMobile": { + "path": "vue/src/image-viewer/src/mobile.vue", + "type": "template", + "exclude": false + }, + "ImageViewerPc": { + "path": "vue/src/image-viewer/src/pc.vue", + "type": "template", + "exclude": false + }, + "IndexBar": { + "path": "vue/src/index-bar/index.ts", + "type": "component", + "exclude": false + }, + "IndexBarAnchor": { + "path": "vue/src/index-bar-anchor/index.ts", + "type": "component", + "exclude": false + }, + "Input": { + "path": "vue/src/input/index.ts", + "type": "component", + "exclude": false + }, + "InputMobile": { + "path": "vue/src/input/src/mobile.vue", + "type": "template", + "exclude": false + }, + "InputPc": { + "path": "vue/src/input/src/pc.vue", + "type": "template", + "exclude": false + }, + "InputTall-storage": { + "path": "vue/src/input/src/tall-storage.vue", + "type": "template", + "exclude": false + }, + "IpAddress": { + "path": "vue/src/ip-address/index.ts", + "type": "component", + "exclude": false + }, + "IpAddressPc": { + "path": "vue/src/ip-address/src/pc.vue", + "type": "template", + "exclude": false + }, + "Layout": { + "path": "vue/src/layout/index.ts", + "type": "component", + "exclude": false + }, + "LayoutPc": { + "path": "vue/src/layout/src/pc.vue", + "type": "template", + "exclude": false + }, + "Link": { + "path": "vue/src/link/index.ts", + "type": "component", + "exclude": false + }, + "LinkMenu": { + "path": "vue/src/link-menu/index.ts", + "type": "component", + "exclude": false + }, + "LinkMenuPc": { + "path": "vue/src/link-menu/src/pc.vue", + "type": "template", + "exclude": false + }, + "LinkPc": { + "path": "vue/src/link/src/pc.vue", + "type": "template", + "exclude": false + }, + "List": { + "path": "vue/src/list/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "mobile" + }, + "Loading": { + "path": "vue/src/loading/index.ts", + "type": "component", + "exclude": false + }, + "LoadingMobile": { + "path": "vue/src/loading/src/mobile.vue", + "type": "template", + "exclude": false + }, + "LoadingPc": { + "path": "vue/src/loading/src/pc.vue", + "type": "template", + "exclude": false + }, + "Locale": { + "path": "vue-locale/src/index.ts", + "type": "module", + "exclude": false + }, + "Locales": { + "path": "vue/src/locales/index.ts", + "type": "component", + "exclude": false + }, + "LogonUser": { + "path": "vue/src/logon-user/index.ts", + "type": "component", + "exclude": false + }, + "Logout": { + "path": "vue/src/logout/index.ts", + "type": "component", + "exclude": false + }, + "LogoutPc": { + "path": "vue/src/logout/src/pc.vue", + "type": "template", + "exclude": false + }, + "Milestone": { + "path": "vue/src/milestone/index.ts", + "type": "component", + "exclude": false + }, + "MilestonePc": { + "path": "vue/src/milestone/src/pc.vue", + "type": "template", + "exclude": false + }, + "MiniPicker": { + "path": "vue/src/mini-picker/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "mobile" + }, + "Modal": { + "path": "vue/src/modal/index.ts", + "type": "component", + "exclude": false + }, + "ModalMobile": { + "path": "vue/src/modal/src/mobile.vue", + "type": "template", + "exclude": false + }, + "ModalPc": { + "path": "vue/src/modal/src/pc.vue", + "type": "template", + "exclude": false + }, + "MonthRange": { + "path": "vue/src/month-range/index.ts", + "type": "component", + "exclude": false + }, + "MonthTable": { + "path": "vue/src/month-table/index.ts", + "type": "component", + "exclude": false + }, + "MultiSelect": { + "path": "vue/src/multi-select/index.ts", + "type": "component", + "exclude": false + }, + "MultiSelectMobile": { + "path": "vue/src/multi-select/src/mobile.vue", + "type": "template", + "exclude": false + }, + "NavBar": { + "path": "vue/src/nav-bar/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "mobile" + }, + "NavMenu": { + "path": "vue/src/nav-menu/index.ts", + "type": "component", + "exclude": false + }, + "NavMenuPc": { + "path": "vue/src/nav-menu/src/pc.vue", + "type": "template", + "exclude": false + }, + "Notify": { + "path": "vue/src/notify/index.ts", + "type": "component", + "exclude": false + }, + "Numeric": { + "path": "vue/src/numeric/index.ts", + "type": "component", + "exclude": false + }, + "NumericMobile": { + "path": "vue/src/numeric/src/mobile.vue", + "type": "template", + "exclude": false + }, + "NumericPc": { + "path": "vue/src/numeric/src/pc.vue", + "type": "template", + "exclude": false + }, + "Option": { + "path": "vue/src/option/index.ts", + "type": "component", + "exclude": false + }, + "OptionGroup": { + "path": "vue/src/option-group/index.ts", + "type": "component", + "exclude": false + }, + "Pager": { + "path": "vue/src/pager/index.ts", + "type": "component", + "exclude": false + }, + "PagerItem": { + "path": "vue/src/pager-item/index.ts", + "type": "component", + "exclude": false, + "private": "Pager" + }, + "Panel": { + "path": "vue/src/panel/index.ts", + "type": "component", + "exclude": true + }, + "PanelPc": { + "path": "vue/src/panel/src/pc.vue", + "type": "template", + "exclude": false + }, + "Picker": { + "path": "vue/src/picker/index.ts", + "type": "component", + "exclude": false + }, + "PickerColumn": { + "path": "vue/src/picker-column/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "mobile" + }, + "PopUpload": { + "path": "vue/src/pop-upload/index.ts", + "type": "component", + "exclude": false + }, + "PopUploadPc": { + "path": "vue/src/pop-upload/src/pc.vue", + "type": "template", + "exclude": false + }, + "Popeditor": { + "path": "vue/src/popeditor/index.ts", + "type": "component", + "exclude": false + }, + "PopeditorPc": { + "path": "vue/src/popeditor/src/pc.vue", + "type": "template", + "exclude": false + }, + "Popover": { + "path": "vue/src/popover/index.ts", + "type": "component", + "exclude": false + }, + "PopoverMobile": { + "path": "vue/src/popover/src/mobile.vue", + "type": "template", + "exclude": false + }, + "PopoverPc": { + "path": "vue/src/popover/src/pc.vue", + "type": "template", + "exclude": false + }, + "Popup": { + "path": "vue/src/popup/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "mobile" + }, + "Progress": { + "path": "vue/src/progress/index.ts", + "type": "component", + "exclude": false + }, + "ProgressMobile": { + "path": "vue/src/progress/src/mobile.vue", + "type": "template", + "exclude": false + }, + "ProgressPc": { + "path": "vue/src/progress/src/pc.vue", + "type": "template", + "exclude": false + }, + "PullRefresh": { + "path": "vue/src/pull-refresh/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "mobile" + }, + "Radio": { + "path": "vue/src/radio/index.ts", + "type": "component", + "exclude": false + }, + "RadioButton": { + "path": "vue/src/radio-button/index.ts", + "type": "component", + "exclude": false + }, + "RadioButtonPc": { + "path": "vue/src/radio-button/src/pc.vue", + "type": "template", + "exclude": false + }, + "RadioGroup": { + "path": "vue/src/radio-group/index.ts", + "type": "component", + "exclude": false + }, + "RadioGroupPc": { + "path": "vue/src/radio-group/src/pc.vue", + "type": "template", + "exclude": false + }, + "RadioMobile": { + "path": "vue/src/radio/src/mobile.vue", + "type": "template", + "exclude": false + }, + "RadioPc": { + "path": "vue/src/radio/src/pc.vue", + "type": "template", + "exclude": false + }, + "Rate": { + "path": "vue/src/rate/index.ts", + "type": "component", + "exclude": false + }, + "RatePc": { + "path": "vue/src/rate/src/pc.vue", + "type": "template", + "exclude": false + }, + "Roles": { + "path": "vue/src/roles/index.ts", + "type": "component", + "exclude": false + }, + "RolesPc": { + "path": "vue/src/roles/src/pc.vue", + "type": "template", + "exclude": false + }, + "Row": { + "path": "vue/src/row/index.ts", + "type": "component", + "exclude": false + }, + "RowPc": { + "path": "vue/src/row/src/pc.vue", + "type": "template", + "exclude": false + }, + "ScrollText": { + "path": "vue/src/scroll-text/index.ts", + "type": "component", + "exclude": false + }, + "ScrollTextPc": { + "path": "vue/src/scroll-text/src/pc.vue", + "type": "template", + "exclude": false + }, + "Scrollbar": { + "path": "vue/src/scrollbar/index.ts", + "type": "component", + "exclude": false + }, + "ScrollbarBar": { + "path": "vue/src/scrollbar/src/bar.vue", + "type": "template", + "exclude": false + }, + "Search": { + "path": "vue/src/search/index.ts", + "type": "component", + "exclude": false + }, + "SearchMobile": { + "path": "vue/src/search/src/mobile.vue", + "type": "template", + "exclude": false + }, + "SearchPc": { + "path": "vue/src/search/src/pc.vue", + "type": "template", + "exclude": false + }, + "Select": { + "path": "vue/src/select/index.ts", + "type": "component", + "exclude": false + }, + "SelectDropdown": { + "path": "vue/src/select-dropdown/index.ts", + "type": "component", + "exclude": false + }, + "SelectDropdownPc": { + "path": "vue/src/select-dropdown/src/pc.vue", + "type": "template", + "exclude": false + }, + "SelectPc": { + "path": "vue/src/select/src/pc.vue", + "type": "template", + "exclude": false + }, + "SlideBar": { + "path": "vue/src/slide-bar/index.ts", + "type": "component", + "exclude": false + }, + "SlideBarPc": { + "path": "vue/src/slide-bar/src/pc.vue", + "type": "template", + "exclude": false + }, + "Slider": { + "path": "vue/src/slider/index.ts", + "type": "component", + "exclude": false + }, + "SliderMobile": { + "path": "vue/src/slider/src/mobile.vue", + "type": "template", + "exclude": false + }, + "SliderPc": { + "path": "vue/src/slider/src/pc.vue", + "type": "template", + "exclude": false + }, + "Split": { + "path": "vue/src/split/index.ts", + "type": "component", + "exclude": false + }, + "SplitPc": { + "path": "vue/src/split/src/pc.vue", + "type": "template", + "exclude": false + }, + "Steps": { + "path": "vue/src/steps/index.ts", + "type": "component", + "exclude": false + }, + "StepsPc": { + "path": "vue/src/steps/src/pc.vue", + "type": "template", + "exclude": false + }, + "SvgIcon": { + "path": "vue/src/svg-icon/index.ts", + "type": "component", + "exclude": false + }, + "Switch": { + "path": "vue/src/switch/index.ts", + "type": "component", + "exclude": false + }, + "SwitchMobile": { + "path": "vue/src/switch/src/mobile.vue", + "type": "template", + "exclude": false + }, + "SwitchPc": { + "path": "vue/src/switch/src/pc.vue", + "type": "template", + "exclude": false + }, + "TabItem": { + "path": "vue/src/tab-item/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "all" + }, + "Tabbar": { + "path": "vue/src/tabbar/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "mobile" + }, + "TabbarItem": { + "path": "vue/src/tabbar-item/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "mobile" + }, + "TabbarItemMobile": { + "path": "vue/src/tabbar-item/src/mobile.vue", + "type": "template", + "exclude": false, + "onlyMode": "mobile" + }, + "Table": { + "path": "vue/src/table/index.ts", + "type": "component", + "exclude": false + }, + "TableMobile": { + "path": "vue/src/table/src/mobile.vue", + "type": "template", + "exclude": false + }, + "TablePc": { + "path": "vue/src/table/src/pc.vue", + "type": "template", + "exclude": false + }, + "Tabs": { + "path": "vue/src/tabs/index.ts", + "type": "component", + "exclude": false + }, + "TabsMobile": { + "path": "vue/src/tabs/src/mobile.vue", + "type": "template", + "exclude": false + }, + "TabsPc": { + "path": "vue/src/tabs/src/pc.vue", + "type": "template", + "exclude": false + }, + "TabsTab-navTab-bar": { + "path": "packages/tabs/src/tab-bar.vue", + "type": "template", + "exclude": false + }, + "TabsTab-navTab-bar": { + "path": "packages/tabs/src/tab-bar.vue", + "type": "template", + "exclude": false + }, + "Tag": { + "path": "vue/src/tag/index.ts", + "type": "component", + "exclude": false + }, + "TagPc": { + "path": "vue/src/tag/src/pc.vue", + "type": "template", + "exclude": false + }, + "TextPopup": { + "path": "vue/src/text-popup/index.ts", + "type": "component", + "exclude": false + }, + "TextPopupPc": { + "path": "vue/src/text-popup/src/pc.vue", + "type": "template", + "exclude": false + }, + "Time": { + "path": "vue/src/time/index.ts", + "type": "component", + "exclude": false + }, + "TimeLine": { + "path": "vue/src/time-line/index.ts", + "type": "component", + "exclude": false + }, + "TimeLineMobile": { + "path": "vue/src/time-line/src/mobile.vue", + "type": "template", + "exclude": false + }, + "TimeLinePc": { + "path": "vue/src/time-line/src/pc.vue", + "type": "template", + "exclude": false + }, + "TimePanel": { + "path": "vue/src/time-panel/index.ts", + "type": "component", + "exclude": false + }, + "TimePicker": { + "path": "vue/src/time-picker/index.ts", + "type": "component", + "exclude": false + }, + "TimeRange": { + "path": "vue/src/time-range/index.ts", + "type": "component", + "exclude": false + }, + "TimeSelect": { + "path": "vue/src/time-select/index.ts", + "type": "component", + "exclude": false + }, + "TimeSpinner": { + "path": "vue/src/time-spinner/index.ts", + "type": "component", + "exclude": false + }, + "ToggleMenu": { + "path": "vue/src/toggle-menu/index.ts", + "type": "component", + "exclude": false + }, + "ToggleMenuPc": { + "path": "vue/src/toggle-menu/src/pc.vue", + "type": "template", + "exclude": false + }, + "Tooltip": { + "path": "vue/src/tooltip/index.ts", + "type": "component", + "exclude": false + }, + "TopBox": { + "path": "vue/src/top-box/index.ts", + "type": "component", + "exclude": false + }, + "TopBoxPc": { + "path": "vue/src/top-box/src/pc.vue", + "type": "template", + "exclude": false + }, + "Transfer": { + "path": "vue/src/transfer/index.ts", + "type": "component", + "exclude": false + }, + "TransferPanel": { + "path": "vue/src/transfer-panel/index.ts", + "type": "component", + "exclude": false + }, + "TransferPc": { + "path": "vue/src/transfer/src/pc.vue", + "type": "template", + "exclude": false + }, + "Tree": { + "path": "vue/src/tree/index.ts", + "type": "component", + "exclude": false + }, + "TreeMenu": { + "path": "vue/src/tree-menu/index.ts", + "type": "component", + "exclude": false + }, + "TreePc": { + "path": "vue/src/tree/src/pc.vue", + "type": "template", + "exclude": false + }, + "TreeTree-node": { + "path": "vue/src/tree/src/tree-node.vue", + "type": "template", + "exclude": false + }, + "Upload": { + "path": "vue/src/upload/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "all" + }, + "UploadDragger": { + "path": "vue/src/upload-dragger/index.ts", + "type": "component", + "exclude": false + }, + "UploadList": { + "path": "vue/src/upload-list/index.ts", + "type": "component", + "exclude": false, + "onlyMode": "all" + }, + "User": { + "path": "vue/src/user/index.ts", + "type": "component", + "exclude": false + }, + "UserAccount": { + "path": "vue/src/user-account/index.ts", + "type": "component", + "exclude": false + }, + "UserAccountPc": { + "path": "vue/src/user-account/src/pc.vue", + "type": "template", + "exclude": false + }, + "UserContact": { + "path": "vue/src/user-contact/index.ts", + "type": "component", + "exclude": false + }, + "UserContactPc": { + "path": "vue/src/user-contact/src/pc.vue", + "type": "template", + "exclude": false + }, + "UserHead": { + "path": "vue/src/user-head/index.ts", + "type": "component", + "exclude": false + }, + "UserHeadMobile": { + "path": "vue/src/user-head/src/mobile.vue", + "type": "template", + "exclude": false + }, + "UserHeadPc": { + "path": "vue/src/user-head/src/pc.vue", + "type": "template", + "exclude": false + }, + "UserLink": { + "path": "vue/src/user-link/index.ts", + "type": "component", + "exclude": false + }, + "UserLinkPc": { + "path": "vue/src/user-link/src/pc.vue", + "type": "template", + "exclude": false + }, + "UserPc": { + "path": "vue/src/user/src/pc.vue", + "type": "template", + "exclude": false + }, + "Wheel": { + "path": "vue/src/wheel/index.ts", + "type": "component", + "exclude": false + }, + "Wizard": { + "path": "vue/src/wizard/index.ts", + "type": "component", + "exclude": false + }, + "WizardPc": { + "path": "vue/src/wizard/src/pc.vue", + "type": "template", + "exclude": false + }, + "YearTable": { + "path": "vue/src/year-table/index.ts", + "type": "component", + "exclude": false + }, + "IndexBar": { + "path": "packages/index-bar/index.js", + "type": "component", + "exclude": false + }, + "IndexBarAnchor": { + "path": "packages/index-bar-anchor/index.js", + "type": "component", + "exclude": false + }, + "IndexBar": { + "path": "packages/index-bar/index.js", + "type": "component", + "exclude": false + }, + "IndexBarAnchor": { + "path": "packages/index-bar-anchor/index.js", + "type": "component", + "exclude": false + } +} diff --git a/packages/month-range/index.js b/packages/month-range/index.js deleted file mode 100644 index 1d6f40669..000000000 --- a/packages/month-range/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import MonthRange from './src/index.vue' - -/* istanbul ignore next */ -MonthRange.install = function (Vue) { - Vue.component(MonthRange.name, MonthRange) -} - -MonthRange.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - MonthRange.install(window.Vue) - } -} - -export default MonthRange diff --git a/packages/month-range/package.json b/packages/month-range/package.json deleted file mode 100644 index 432c6b27f..000000000 --- a/packages/month-range/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-month-range", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0", - "@opentiny/vue-month-table": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/month-range/src/index.vue b/packages/month-range/src/index.vue deleted file mode 100644 index 15bedb79d..000000000 --- a/packages/month-range/src/index.vue +++ /dev/null @@ -1,127 +0,0 @@ - - - - diff --git a/packages/month-table/index.js b/packages/month-table/index.js deleted file mode 100644 index 4dfe72540..000000000 --- a/packages/month-table/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import MonthTable from './src/index.vue' - -/* istanbul ignore next */ -MonthTable.install = function (Vue) { - Vue.component(MonthTable.name, MonthTable) -} - -MonthTable.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - MonthTable.install(window.Vue) - } -} - -export default MonthTable diff --git a/packages/month-table/package.json b/packages/month-table/package.json deleted file mode 100644 index a546113a0..000000000 --- a/packages/month-table/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-month-table", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/month-table/src/index.vue b/packages/month-table/src/index.vue deleted file mode 100644 index 3a46a07d4..000000000 --- a/packages/month-table/src/index.vue +++ /dev/null @@ -1,55 +0,0 @@ - - - - diff --git a/packages/nav-bar/index.js b/packages/nav-bar/index.js deleted file mode 100644 index 2128d9d6e..000000000 --- a/packages/nav-bar/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import NavBar from './src/index.vue' -import '@opentiny/vue-theme-mobile/nav-bar/index.css' - -/* istanbul ignore next */ -NavBar.install = function (Vue) { - Vue.component(NavBar.name, NavBar) -} - -NavBar.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - NavBar.install(window.Vue) - } -} - -export default NavBar diff --git a/packages/nav-bar/package.json b/packages/nav-bar/package.json deleted file mode 100644 index 43d73513b..000000000 --- a/packages/nav-bar/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-nav-bar", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/nav-bar/src/index.vue b/packages/nav-bar/src/index.vue deleted file mode 100644 index c9bedcdba..000000000 --- a/packages/nav-bar/src/index.vue +++ /dev/null @@ -1,90 +0,0 @@ - - diff --git a/packages/nav-menu/index.js b/packages/nav-menu/index.js deleted file mode 100644 index 0c6d4bd75..000000000 --- a/packages/nav-menu/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import NavMenu from './src/index' -import '@opentiny/vue-theme/nav-menu/index.css' - -/* istanbul ignore next */ -NavMenu.install = function (Vue) { - Vue.component(NavMenu.name, NavMenu) -} - -NavMenu.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - NavMenu.install(window.Vue) - } -} - -export default NavMenu diff --git a/packages/nav-menu/package.json b/packages/nav-menu/package.json deleted file mode 100644 index 07bcfc14e..000000000 --- a/packages/nav-menu/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-nav-menu", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/nav-menu/src/index.js b/packages/nav-menu/src/index.js deleted file mode 100644 index ccd61af1d..000000000 --- a/packages/nav-menu/src/index.js +++ /dev/null @@ -1,45 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'NavMenu', - props: { - ...$props, - data: Array, - overflow: { - type: String, - default: 'auto', - validator(value) { - return /^(auto|retract|fixed|hidden)$/.test(value) - } - }, - parentKey: String, - beforeSkip: Function, - fetchMenuData: Function, - fields: Object, - prevent: { - type: Boolean, - default: false - }, - allowFullUrl: { - type: Boolean, - default: false - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/nav-menu/src/pc.vue b/packages/nav-menu/src/pc.vue deleted file mode 100644 index 8ec09869b..000000000 --- a/packages/nav-menu/src/pc.vue +++ /dev/null @@ -1,124 +0,0 @@ - - - - diff --git a/packages/notify/index.js b/packages/notify/index.js deleted file mode 100644 index b4909d24f..000000000 --- a/packages/notify/index.js +++ /dev/null @@ -1,160 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ - -import { createComponent } from '@opentiny/vue-common' -import NotifyConstructor from './src/index.vue' -import '@opentiny/vue-theme/notify/index.css' -import { iconSuccessful, iconError, iconInfoSolid, iconWarning } from '@opentiny/vue-icon' - -let seed = 1 -let instances = [] - -const IconMap = { - warning: iconWarning(), - error: iconError(), - info: iconInfoSolid(), - success: iconSuccessful() -} - -const durationMap = { - info: 5000, - success: 5000, - warning: 10000, - error: 10000 -} - -const positionList = ['top-right', 'bottom-right'] - -const debounce = (fn, debounceDelay) => { - let timer = null - - return async function () { - if (timer) { - clearTimeout(timer) - } - - let instance = null - - await new Promise((resolve) => { - timer = setTimeout(() => { - instance = fn.apply(this, arguments) - timer = null - - resolve() - }, debounceDelay) - }) - - return instance - } -} - -const notify = (options) => { - if (!~Object.keys(IconMap).indexOf(options.type)) { - options.type = 'info' - } - - options.duration = options.duration ? options.duration : durationMap[options.type] - options.position = !~positionList.indexOf(options.position) ? 'bottom-right' : options.position - !options.statusIcon && options.type && (options.statusIcon = IconMap[options.type]) - - const id = 'notify_' + seed++ - const userOnClose = options.onClose - const position = options.position - - options.onClose = function () { - Notify.close(id, userOnClose) - } - - const instance = createComponent({ - el: document.createElement('div'), - propsData: options, - component: NotifyConstructor - }) - instance.id = id - document.body.appendChild(instance.$el) - - let verticalOffset = options.offset || 0 - - instances - .filter((item) => item.state.position === position) - .forEach((item) => { - verticalOffset += item.$el.offsetHeight + 16 - }) - - verticalOffset += options.verticalOffset ? Number(options.verticalOffset) : 16 - instances.push(instance) - - instance.dom = instance.$el - instance.dom.style.zIndex = instance.getZindex() - instance.state.verticalOffset = verticalOffset - instance.state.visible = true - - return instance -} - -const Notify = (options) => { - let { debounceDelay } = options - - if (debounceDelay) { - return debounce(() => notify(options), debounceDelay) - } else { - return notify(options) - } -} -Notify.close = function (id, userOnClose) { - let index = -1 - let len = instances.length - let instance - - for (let i = 0; i < len; i++) { - let tmp = instances[i] - if (tmp.id === id) { - index = i - instance = tmp - break - } - } - - if (!instance) { - return - } - - typeof userOnClose === 'function' && userOnClose(instance) - let lastHeight = instance.$el.offsetHeight - instance.$el.parentNode.removeChild(instance.$el) - instances.splice(index, 1) - - if (len <= 1) { - return - } - - let removedPosition = instance.position - let copys = instances.slice(index) - - copys.forEach((copy) => { - if (copy.position === removedPosition) { - let height = parseInt(copy.dom.style[instance.state.verticalProperty], 10) - lastHeight - 16 - copy.dom.style[instance.state.verticalProperty] = height + 'px' - } - }) -} - -Notify.closeAll = function () { - let copys = instances.slice(0) - - copys = copys.reverse() - copys.forEach((instance) => { - instance.close() - }) -} - -export default Notify diff --git a/packages/notify/package.json b/packages/notify/package.json deleted file mode 100644 index e2444509b..000000000 --- a/packages/notify/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-notify", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/notify/src/index.vue b/packages/notify/src/index.vue deleted file mode 100644 index 650014d12..000000000 --- a/packages/notify/src/index.vue +++ /dev/null @@ -1,119 +0,0 @@ - - diff --git a/packages/numeric/index.js b/packages/numeric/index.js deleted file mode 100644 index f7b93e2c3..000000000 --- a/packages/numeric/index.js +++ /dev/null @@ -1,33 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Numeric from './src/index' - -Numeric.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Numeric.install = function (Vue) { - Vue.component(Numeric.name, Numeric) -} - -Numeric.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Numeric.install(window.Vue) - } -} - -export default Numeric diff --git a/packages/numeric/package.json b/packages/numeric/package.json deleted file mode 100644 index 57b7e239a..000000000 --- a/packages/numeric/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-numeric", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/numeric/src/index.js b/packages/numeric/src/index.js deleted file mode 100644 index 4caae7f75..000000000 --- a/packages/numeric/src/index.js +++ /dev/null @@ -1,126 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const $constants = { - MAX: 'aria-valuemax', - MIN: 'aria-valuemin', - VALUENOW: 'aria-valuenow', - DISABLED: 'aria-disabled', - KEY: 'role', - VALUE: 'spinbutton', - EVENT_NAME: { - blur: 'form.blur', - change: 'form.change' - }, - COMPONENT_NAME: 'FormItem' -} - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'Numeric', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - allowEmpty: { - type: Boolean, - default: false - }, - circulate: Boolean, - controls: { - type: Boolean, - default: true - }, - controlsPosition: { - type: String, - default: '' - }, - disabled: Boolean, - format: [Object, String], - hideUnit: { - type: Boolean, - default: false - }, - holdZero: { - type: Boolean, - default: true - }, - label: String, - max: { - type: [Number, String], - default: Infinity - }, - min: { - type: [Number, String], - default: -Infinity - }, - modelTruncation: { - type: Boolean, - default: true - }, - modelValue: {}, - mouseWheel: Boolean, - name: String, - placeholder: String, - plugin: Function, - precision: { - type: Number, - validator(val) { - return val >= 0 && val === parseInt(val, 10) - } - }, - size: String, - step: { - type: [Number, String], - default: 1 - }, - stepStrictly: { - type: Boolean, - default: false - }, - strictInput: { - type: Boolean, - default: false - }, - stringMode: Boolean, - tabindex: { - type: String, - default: '1' - }, - theme: { - type: String, - default: '' - }, - unit: String, - unitCenter: { - type: Boolean, - default: false - }, - validateEvent: { - type: Boolean, - default: true - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/numeric/src/mobile.vue b/packages/numeric/src/mobile.vue deleted file mode 100644 index 59217fec7..000000000 --- a/packages/numeric/src/mobile.vue +++ /dev/null @@ -1,106 +0,0 @@ - - - - diff --git a/packages/numeric/src/pc.vue b/packages/numeric/src/pc.vue deleted file mode 100644 index 5ce7b0f99..000000000 --- a/packages/numeric/src/pc.vue +++ /dev/null @@ -1,129 +0,0 @@ - - - - diff --git a/packages/option-group/index.js b/packages/option-group/index.js deleted file mode 100644 index 976d63266..000000000 --- a/packages/option-group/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import OptionGroup from './src/index.vue' -import '@opentiny/vue-theme/option-group/index.css' - -/* istanbul ignore next */ -OptionGroup.install = function (Vue) { - Vue.component(OptionGroup.name, OptionGroup) -} - -OptionGroup.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - OptionGroup.install(window.Vue) - } -} - -export default OptionGroup diff --git a/packages/option-group/package.json b/packages/option-group/package.json deleted file mode 100644 index d5d71f732..000000000 --- a/packages/option-group/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-option-group", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/option-group/src/index.vue b/packages/option-group/src/index.vue deleted file mode 100644 index 4bc7362d3..000000000 --- a/packages/option-group/src/index.vue +++ /dev/null @@ -1,41 +0,0 @@ - - - - diff --git a/packages/option/index.js b/packages/option/index.js deleted file mode 100644 index 6a91783bf..000000000 --- a/packages/option/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Option from './src/index.vue' -import '@opentiny/vue-theme/option/index.css' - -/* istanbul ignore next */ -Option.install = function (Vue) { - Vue.component(Option.name, Option) -} - -Option.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Option.install(window.Vue) - } -} - -export default Option diff --git a/packages/option/package.json b/packages/option/package.json deleted file mode 100644 index 878975005..000000000 --- a/packages/option/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-option", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/option/src/index.vue b/packages/option/src/index.vue deleted file mode 100644 index 3bac2e2e5..000000000 --- a/packages/option/src/index.vue +++ /dev/null @@ -1,74 +0,0 @@ - - - - diff --git a/packages/pager-item/index.js b/packages/pager-item/index.js deleted file mode 100644 index fe150cfc9..000000000 --- a/packages/pager-item/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import PagerItem from './src/index.vue' - -/* istanbul ignore next */ -PagerItem.install = function (Vue) { - Vue.component(PagerItem.name, PagerItem) -} - -PagerItem.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - PagerItem.install(window.Vue) - } -} - -export default PagerItem diff --git a/packages/pager-item/package.json b/packages/pager-item/package.json deleted file mode 100644 index c812b03fd..000000000 --- a/packages/pager-item/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-pager-item", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/pager-item/src/index.vue b/packages/pager-item/src/index.vue deleted file mode 100644 index 784ed975d..000000000 --- a/packages/pager-item/src/index.vue +++ /dev/null @@ -1,66 +0,0 @@ - - - - diff --git a/packages/pager/index.js b/packages/pager/index.js deleted file mode 100644 index 14d8a71b8..000000000 --- a/packages/pager/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Pager from './src/index.vue' -import '@opentiny/vue-theme/pager/index.css' - -/* istanbul ignore next */ -Pager.install = function (Vue) { - Vue.component(Pager.name, Pager) -} - -Pager.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Pager.install(window.Vue) - } -} - -export default Pager diff --git a/packages/pager/package.json b/packages/pager/package.json deleted file mode 100644 index c97442b30..000000000 --- a/packages/pager/package.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "name": "@opentiny/vue-pager", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-popover": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0", - "@opentiny/vue-pager-item": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/pager/src/index.vue b/packages/pager/src/index.vue deleted file mode 100644 index af56ef743..000000000 --- a/packages/pager/src/index.vue +++ /dev/null @@ -1,649 +0,0 @@ - - diff --git a/packages/panel/index.js b/packages/panel/index.js deleted file mode 100644 index a26382426..000000000 --- a/packages/panel/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Panel from './src/index' - -/* istanbul ignore next */ -Panel.install = function (Vue) { - Vue.component(Panel.name, Panel) -} - -Panel.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Panel.install(window.Vue) - } -} - -export default Panel diff --git a/packages/panel/package.json b/packages/panel/package.json deleted file mode 100644 index 262260e3c..000000000 --- a/packages/panel/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-panel", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/panel/src/index.js b/packages/panel/src/index.js deleted file mode 100644 index 87c046075..000000000 --- a/packages/panel/src/index.js +++ /dev/null @@ -1,51 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $prefix, $props, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'Panel', - props: { - ...$props, - expand: { - type: Boolean, - default: true - }, - foot: { - type: String - }, - head: { - type: String - }, - iconOpen: { - type: String, - default: 'icon-chevron-down' - }, - iconClose: { - type: String, - default: 'icon-chevron-right' - }, - isToggle: { - type: Boolean, - default: false - }, - transition: { - type: String, - default: 'panel' - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/panel/src/pc.vue b/packages/panel/src/pc.vue deleted file mode 100644 index 1e1c6b6a3..000000000 --- a/packages/panel/src/pc.vue +++ /dev/null @@ -1,57 +0,0 @@ - - - - diff --git a/packages/picker-column/index.js b/packages/picker-column/index.js deleted file mode 100644 index 5ee4da01c..000000000 --- a/packages/picker-column/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import PickerColumn from './src/index.vue' -import '@opentiny/vue-theme-mobile/picker-column/index.css' - -/* istanbul ignore next */ -PickerColumn.install = function (Vue) { - Vue.component(PickerColumn.name, PickerColumn) -} - -PickerColumn.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - PickerColumn.install(window.Vue) - } -} - -export default PickerColumn diff --git a/packages/picker-column/package.json b/packages/picker-column/package.json deleted file mode 100644 index cd3779fd4..000000000 --- a/packages/picker-column/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-picker-column", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/picker-column/src/index.vue b/packages/picker-column/src/index.vue deleted file mode 100644 index 0850537b5..000000000 --- a/packages/picker-column/src/index.vue +++ /dev/null @@ -1,56 +0,0 @@ - - - - diff --git a/packages/picker/index.js b/packages/picker/index.js deleted file mode 100644 index 817613b64..000000000 --- a/packages/picker/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Picker from './src/index.vue' -import '@opentiny/vue-theme/picker/index.css' -import '@opentiny/vue-theme/input/index.css' - -Picker.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Picker.install = function (Vue) { - Vue.component(Picker.name, Picker) -} - -Picker.version = process.env.COMPONENT_VERSION - -export default Picker diff --git a/packages/picker/package.json b/packages/picker/package.json deleted file mode 100644 index cb464a144..000000000 --- a/packages/picker/package.json +++ /dev/null @@ -1,24 +0,0 @@ -{ - "name": "@opentiny/vue-picker", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-input": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0", - "@opentiny/vue-date-panel": "~0.1.0", - "@opentiny/vue-date-range": "~0.1.0", - "@opentiny/vue-month-range": "~0.1.0", - "@opentiny/vue-time": "~0.1.0", - "@opentiny/vue-time-range": "~0.1.0", - "@opentiny/vue-time-panel": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/picker/src/index.vue b/packages/picker/src/index.vue deleted file mode 100644 index 077a7b9e1..000000000 --- a/packages/picker/src/index.vue +++ /dev/null @@ -1,257 +0,0 @@ - - - - diff --git a/packages/pop-upload/index.js b/packages/pop-upload/index.js deleted file mode 100644 index e6061091c..000000000 --- a/packages/pop-upload/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import PopUpload from './src/index' -import '@opentiny/vue-theme/pop-upload/index.css' - -/* istanbul ignore next */ -PopUpload.install = function (Vue) { - Vue.component(PopUpload.name, PopUpload) -} - -PopUpload.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - PopUpload.install(window.Vue) - } -} - -export default PopUpload diff --git a/packages/pop-upload/package.json b/packages/pop-upload/package.json deleted file mode 100644 index d903d44a8..000000000 --- a/packages/pop-upload/package.json +++ /dev/null @@ -1,21 +0,0 @@ -{ - "name": "@opentiny/vue-pop-upload", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-alert": "~0.1.0", - "@opentiny/vue-button": "~0.1.0", - "@opentiny/vue-modal": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-file-upload": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/pop-upload/src/index.js b/packages/pop-upload/src/index.js deleted file mode 100644 index 1dd778a00..000000000 --- a/packages/pop-upload/src/index.js +++ /dev/null @@ -1,99 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - KB: 'KB', - FILE_NAME: 'ui.popupload.fileName', - FILE_SIZE: 'ui.popupload.fileSize', - FILE_STATUS: 'ui.popupload.fileStatus', - DIALOG_TITLE: 'ui.popupload.dialogTitle', - UPLOAD_ERROR: 'ui.popupload.uploadError', - ERROR_NUM_TIPS: 'ui.popupload.errorNumTips', - UPLOAD_SUCCESS: 'ui.popupload.uploadSuccess', - TIPS_TITLE_TEXT: 'ui.popupload.tipsFileText', - ERROR_TYPE_TIPS: 'ui.popupload.errorTypeTips', - ERROR_SIZE_TIPS: 'ui.popupload.errorSizeTips', - SAVE_BUTTON_TEXT: 'ui.popupload.saveButtonText', - UPLOAD_BUTTON_TEXT: 'ui.popupload.uploadButtonText', - CANCEL_BUTTTON_TEXT: 'ui.popupload.cancelButtonText', - UPLOADS_BUTTON_TEXT: 'ui.popupload.uploadsButtonText', - LIMIT_UPLOAD_FILE_TYPE: 'ui.popupload.limitUploadFileType', - LIMIT_UPLOAD_FILE_SIZE: 'ui.popupload.limitUploadFileSize', - LIMIT_UPLOAD_FILE_NUMBER: 'ui.popupload.limitUploadFileNumber' -} - -const template = function () { - return PCTemplate -} - -export default { - name: $prefix + 'PopUpload', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - size: String, - data: Object, - uploadName: String, - dialogTitle: { - type: String, - default: '' - }, - action: { - type: String, - default: '' - }, - uploadButtonText: { - type: String, - default: '' - }, - headers: { - type: Object, - default: () => ({}) - }, - withCredentials: { - type: Boolean, - default: false - }, - limit: Number, - multiple: Boolean, - disabled: { - type: Boolean, - default: false - }, - filters: { - type: Object, - default: () => ({}) - }, - accept: String, - submitButtonText: { - typee: String, - default: '' - }, - cancelButtonText: { - typee: String, - default: '' - }, - uploadFileType: Array, - beforeUpload: Function, - beforeRemove: Function, - maxUploadFileSize: Number, - httpRequest: Function - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/pop-upload/src/pc.vue b/packages/pop-upload/src/pc.vue deleted file mode 100644 index 8cae3faae..000000000 --- a/packages/pop-upload/src/pc.vue +++ /dev/null @@ -1,148 +0,0 @@ - - - - diff --git a/packages/popeditor/index.js b/packages/popeditor/index.js deleted file mode 100644 index 136170145..000000000 --- a/packages/popeditor/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Popeditor from './src/index' -import '@opentiny/vue-theme/popeditor/index.css' - -Popeditor.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Popeditor.install = function (Vue) { - Vue.component(Popeditor.name, Popeditor) -} - -Popeditor.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Popeditor.install(window.Vue) - } -} - -export default Popeditor diff --git a/packages/popeditor/package.json b/packages/popeditor/package.json deleted file mode 100644 index 494f5357e..000000000 --- a/packages/popeditor/package.json +++ /dev/null @@ -1,21 +0,0 @@ -{ - "name": "@opentiny/vue-popeditor", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-input": "~0.1.0", - "@opentiny/vue-grid": "~0.1.0", - "@opentiny/vue-pager": "~0.1.0", - "@opentiny/vue-dialog-box": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/popeditor/src/index.js b/packages/popeditor/src/index.js deleted file mode 100644 index 0e47fe7ce..000000000 --- a/packages/popeditor/src/index.js +++ /dev/null @@ -1,209 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import { iconPopup, iconSearch } from '@opentiny/vue-icon' -import PCTemplate from './pc' - -const $constants = { - TITLE: 'ui.popeditor.title', - COLUMNS_TYPE: { - selection: 'selection', - radio: 'radio', - index: 'index', - width: 40 - }, - GRID_REF: { - history: 'historyGrid', - source: 'sourceGrid' - }, - TAG_NAME: 'INPUT', - MODAL_WIDTH: { - multi: 900, - radio: 600 - }, - ACTIVE_NAME: { - history: 'history', - source: 'source' - }, - TYPE_GRID: 'grid', - TYPE_TREE: 'tree', - ID: 'id', - LABEL: 'label' -} - -const template = function () { - return PCTemplate -} - -export default { - name: $prefix + 'Popeditor', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - modelValue: { - type: [String, Number, Array], - default: '' - }, - tabindex: { - type: String, - default: '1' - }, - placeholder: { - type: String, - default: '' - }, - size: String, - trigger: { - type: String, - default: 'default' - }, - icon: { - type: Object, - default() { - return iconPopup() - } - }, - iconSearch: { - type: Object, - default() { - return iconSearch() - } - }, - title: { - type: String, - default: '' - }, - textField: { - type: String, - default: 'label' - }, - textSplit: { - type: String, - default: '/' - }, - valueField: { - type: String, - default: 'id' - }, - valueSplit: { - type: String, - default: ';' - }, - popseletor: { - type: String, - default: 'grid', - validator(value) { - return ['grid', 'tree'].indexOf(value) !== -1 - } - }, - conditions: { - type: Array, - default() { - return [] - } - }, - width: { - type: [String, Number], - default: '' - }, - gridOp: { - type: Object, - default() { - return { - columns: [], - data: [] - } - } - }, - remoteSearch: Function, - dataset: Object, - alwaysLoad: { - type: Boolean, - default: false - }, - treeOp: { - type: Object, - default() { - return { - data: [] - } - } - }, - pagerOp: { - type: Object, - default() { - return {} - } - }, - disabled: { - type: Boolean, - default: false - }, - readonly: { - type: Boolean, - default: true - }, - multi: { - type: Boolean, - default: false - }, - showClearBtn: { - type: Boolean, - default: true - }, - showPager: { - type: Boolean, - default: false - }, - showHistory: { - type: Boolean, - default: false - }, - autoLookup: { - type: Boolean, - default: true - }, - beforeReset: Function, - resize: { - type: Boolean, - default: false - }, - dialogClass: { - type: String, - default: '' - }, - textRenderSource: Function, - draggable: { - type: Boolean, - default: true - }, - placement: { - type: String, - default: 'bottom-start' - }, - popperAppendToBody: { - type: Boolean, - default: true - }, - suggest: Boolean, - beforeClose: { - type: Function, - default: () => () => true - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/popeditor/src/pc.vue b/packages/popeditor/src/pc.vue deleted file mode 100644 index d39b61f07..000000000 --- a/packages/popeditor/src/pc.vue +++ /dev/null @@ -1,314 +0,0 @@ - - - - diff --git a/packages/popover/index.js b/packages/popover/index.js deleted file mode 100644 index 5bfa0c06a..000000000 --- a/packages/popover/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Popover from './src/index' -import '@opentiny/vue-theme/popover/index.css' - -/* istanbul ignore next */ -Popover.install = function (Vue) { - Vue.component(Popover.name, Popover) -} - -Popover.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -Popover.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Popover.install(window.Vue) - } -} - -export default Popover diff --git a/packages/popover/package.json b/packages/popover/package.json deleted file mode 100644 index be54560d3..000000000 --- a/packages/popover/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-popover", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/popover/src/index.js b/packages/popover/src/index.js deleted file mode 100644 index 1676e5f4f..000000000 --- a/packages/popover/src/index.js +++ /dev/null @@ -1,99 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - inheritAttrs: true, - name: $prefix + 'Popover', - props: { - ...$props, - appendToBody: { - type: Boolean, - default: true - }, - arrowOffset: { - type: Number, - default: 0 - }, - boundariesPadding: { - type: Number, - default: 5 - }, - closeDelay: { - type: Number, - default: 200 - }, - content: String, - disabled: Boolean, - modelValue: Boolean, - offset: { - default: 0 - }, - openDelay: { - type: Number, - default: 0 - }, - placement: { - type: String, - default: 'bottom' - }, - popper: {}, - popperClass: String, - popperOptions: { - type: Object, - default: () => ({ gpuAcceleration: false }) - }, - reference: {}, - tabindex: { - type: Number, - default: 0 - }, - title: String, - transformOrigin: { - type: [Boolean, String], - default: true - }, - transition: { - type: String, - default: 'fade-in-linear' - }, - trigger: { - type: String, - default: 'click', - validator: (value) => ~['click', 'focus', 'hover', 'manual'].indexOf(value) - }, - visibleArrow: { - default: true - }, - width: { - type: [String, Number] - }, - height: { - type: [String, Number] - }, - maxHeight: { - type: [String, Number] - }, - listData: [Object, Array] - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/popover/src/index.vue b/packages/popover/src/index.vue deleted file mode 100644 index 64b019560..000000000 --- a/packages/popover/src/index.vue +++ /dev/null @@ -1,113 +0,0 @@ - - - - diff --git a/packages/popover/src/mobile.vue b/packages/popover/src/mobile.vue deleted file mode 100644 index 246029c06..000000000 --- a/packages/popover/src/mobile.vue +++ /dev/null @@ -1,54 +0,0 @@ - - - - diff --git a/packages/popover/src/pc.vue b/packages/popover/src/pc.vue deleted file mode 100644 index bc7f20471..000000000 --- a/packages/popover/src/pc.vue +++ /dev/null @@ -1,42 +0,0 @@ - - - - diff --git a/packages/popup/index.js b/packages/popup/index.js deleted file mode 100644 index 1e7115104..000000000 --- a/packages/popup/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Popup from './src/index.vue' -import '@opentiny/vue-theme-mobile/popup/index.css' - -Popup.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Popup.install = function (Vue) { - Vue.component(Popup.name, Popup) -} - -Popup.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Popup.install(window.Vue) - } -} - -export default Popup diff --git a/packages/popup/package.json b/packages/popup/package.json deleted file mode 100644 index b01a0bded..000000000 --- a/packages/popup/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-popup", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/popup/src/index.vue b/packages/popup/src/index.vue deleted file mode 100644 index d4533d5fc..000000000 --- a/packages/popup/src/index.vue +++ /dev/null @@ -1,102 +0,0 @@ - - - - diff --git a/packages/progress/index.js b/packages/progress/index.js deleted file mode 100644 index 2d7bc1cc8..000000000 --- a/packages/progress/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Progress from './src/index' - -/* istanbul ignore next */ -Progress.install = function (Vue) { - Vue.component(Progress.name, Progress) -} - -Progress.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Progress.install(window.Vue) - } -} - -export default Progress diff --git a/packages/progress/package.json b/packages/progress/package.json deleted file mode 100644 index 57c13bb94..000000000 --- a/packages/progress/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-progress", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/progress/src/index.js b/packages/progress/src/index.js deleted file mode 100644 index c8d46f374..000000000 --- a/packages/progress/src/index.js +++ /dev/null @@ -1,95 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const $constants = { - PROGRESS_TYPE: { - LINE: 'line', - CIRCLE: 'circle', - DASHBOARD: 'dashboard' - }, - PROGRESS_STATUS: { - SUCCESS: 'success', - EXCEPTION: 'exception', - WARNING: 'warning' - }, - STATUS_TO_COLOR: { - success: '#13ce66', - exception: '#ff4949', - warning: '#e6a23c' - }, - STATUS_DEFAULT_COLOR: '#20a0ff', - ICON_CIRCLE_WARNING: 'icon-warning', - ICON_CIRCLE_SUCCESS: 'icon-successful', - ICON_CIRCLE_EXCEPTION: 'icon-error', - ICON_SUCCESS: 'icon-yes', - ICON_EXCEPTION: 'icon-close', - ICON_WARNING: 'icon-warning' -} - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'Progress', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - color: { - type: [String, Array, Function], - default: '' - }, - format: Function, - percentage: { - type: Number, - default: 0, - required: true, - validator: (val) => val >= 0 && val <= 100 - }, - showText: { - type: Boolean, - default: true - }, - status: { - type: String, - validator: (value) => !!$constants.PROGRESS_STATUS[value.toUpperCase()] - }, - strokeWidth: { - type: Number, - default: 6 - }, - textInside: { - type: Boolean, - default: false - }, - type: { - type: String, - default: $constants.PROGRESS_TYPE.LINE, - validator: (value) => !!$constants.PROGRESS_TYPE[value.toUpperCase()] - }, - width: { - type: Number, - default: 126 - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/progress/src/mobile.vue b/packages/progress/src/mobile.vue deleted file mode 100644 index 82cc86c8f..000000000 --- a/packages/progress/src/mobile.vue +++ /dev/null @@ -1,84 +0,0 @@ - - - - diff --git a/packages/progress/src/pc.vue b/packages/progress/src/pc.vue deleted file mode 100644 index 0670da8f0..000000000 --- a/packages/progress/src/pc.vue +++ /dev/null @@ -1,100 +0,0 @@ - - - - diff --git a/packages/pull-refresh/index.js b/packages/pull-refresh/index.js deleted file mode 100644 index d9b0160ba..000000000 --- a/packages/pull-refresh/index.js +++ /dev/null @@ -1,33 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import PullRefresh from './src/index.vue' - -PullRefresh.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -PullRefresh.install = function (Vue) { - Vue.component(PullRefresh.name, PullRefresh) -} - -PullRefresh.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - PullRefresh.install(window.Vue) - } -} - -export default PullRefresh diff --git a/packages/pull-refresh/package.json b/packages/pull-refresh/package.json deleted file mode 100644 index d2050f6d4..000000000 --- a/packages/pull-refresh/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-pull-refresh", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-locale": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/radio-button/index.js b/packages/radio-button/index.js deleted file mode 100644 index 0c5859b2e..000000000 --- a/packages/radio-button/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import RadioButton from './src/index' -import '@opentiny/vue-theme/radio-button/index.css' - -/* istanbul ignore next */ -RadioButton.install = function (Vue) { - Vue.component(RadioButton.name, RadioButton) -} - -RadioButton.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - RadioButton.install(window.Vue) - } -} - -export default RadioButton diff --git a/packages/radio-button/package.json b/packages/radio-button/package.json deleted file mode 100644 index 48ca6b5e4..000000000 --- a/packages/radio-button/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-radio-button", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/radio-button/src/index.js b/packages/radio-button/src/index.js deleted file mode 100644 index 2a08b0a3e..000000000 --- a/packages/radio-button/src/index.js +++ /dev/null @@ -1,41 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - RADIO_GROUP: 'RadioGroup' -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'RadioButton', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - name: String, - text: String, - events: { - type: Object, - default: () => ({}) - }, - label: {}, - disabled: Boolean - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/radio-button/src/pc.vue b/packages/radio-button/src/pc.vue deleted file mode 100644 index 7c9b5e55e..000000000 --- a/packages/radio-button/src/pc.vue +++ /dev/null @@ -1,58 +0,0 @@ - - - - diff --git a/packages/radio-group/index.js b/packages/radio-group/index.js deleted file mode 100644 index 2b1050875..000000000 --- a/packages/radio-group/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import RadioGroup from './src/index' -import '@opentiny/vue-theme/radio-group/index.css' - -RadioGroup.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -RadioGroup.install = function (Vue) { - Vue.component(RadioGroup.name, RadioGroup) -} - -RadioGroup.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - RadioGroup.install(window.Vue) - } -} - -export default RadioGroup diff --git a/packages/radio-group/package.json b/packages/radio-group/package.json deleted file mode 100644 index f602adebf..000000000 --- a/packages/radio-group/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-radio-group", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-radio": "~0.1.0", - "@opentiny/vue-radio-button": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/radio-group/src/index.js b/packages/radio-group/src/index.js deleted file mode 100644 index 86495ba3e..000000000 --- a/packages/radio-group/src/index.js +++ /dev/null @@ -1,40 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'RadioGroup', - componentName: 'RadioGroup', - props: { - ...$props, - modelValue: {}, - size: String, - fill: String, - textColor: String, - disabled: Boolean, - vertical: Boolean, - options: { - type: Array, - default: () => [] - }, - type: { - type: String, - default: 'radio' - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/radio-group/src/pc.vue b/packages/radio-group/src/pc.vue deleted file mode 100644 index 4b13cd5ae..000000000 --- a/packages/radio-group/src/pc.vue +++ /dev/null @@ -1,42 +0,0 @@ - - - - diff --git a/packages/radio/index.js b/packages/radio/index.js deleted file mode 100644 index 1daca433a..000000000 --- a/packages/radio/index.js +++ /dev/null @@ -1,33 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Radio from './src/index' - -Radio.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Radio.install = function (Vue) { - Vue.component(Radio.name, Radio) -} - -Radio.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Radio.install(window.Vue) - } -} - -export default Radio diff --git a/packages/radio/package.json b/packages/radio/package.json deleted file mode 100644 index 3640252ef..000000000 --- a/packages/radio/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-radio", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/radio/src/index.js b/packages/radio/src/index.js deleted file mode 100644 index b09310752..000000000 --- a/packages/radio/src/index.js +++ /dev/null @@ -1,53 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const $constants = { - RADIO_GROUP: 'RadioGroup' -} - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'Radio', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - modelValue: {}, - label: {}, - disabled: Boolean, - name: String, - border: Boolean, - size: String, - text: String, - events: { - type: Object, - default: () => ({}) - }, - tabindex: { - type: String, - default: '1' - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/radio/src/mobile.vue b/packages/radio/src/mobile.vue deleted file mode 100644 index 2dd33178c..000000000 --- a/packages/radio/src/mobile.vue +++ /dev/null @@ -1,58 +0,0 @@ - - - - diff --git a/packages/radio/src/pc.vue b/packages/radio/src/pc.vue deleted file mode 100644 index 3629014de..000000000 --- a/packages/radio/src/pc.vue +++ /dev/null @@ -1,70 +0,0 @@ - - - - diff --git a/packages/rate/index.js b/packages/rate/index.js deleted file mode 100644 index a30aef345..000000000 --- a/packages/rate/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Rate from './src/index' -import '@opentiny/vue-theme/rate/index.css' - -Rate.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Rate.install = function (Vue) { - Vue.component(Rate.name, Rate) -} - -Rate.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Rate.install(window.Vue) - } -} - -export default Rate diff --git a/packages/rate/package.json b/packages/rate/package.json deleted file mode 100644 index e086a6867..000000000 --- a/packages/rate/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-rate", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/rate/src/index.js b/packages/rate/src/index.js deleted file mode 100644 index e87c34b88..000000000 --- a/packages/rate/src/index.js +++ /dev/null @@ -1,123 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import { t } from '@opentiny/vue-locale' -import PCTemplate from './pc' - -const $constants = { - RATENODECLS: 'tiny-rate__star', - ICON_PREFIXCLS: '.tiny-rate__icon', - DECIMALCLS: 'tiny-rate__decimal' -} - -const template = function () { - return PCTemplate -} - -export default { - name: $prefix + 'Rate', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - allowHalf: { - type: Boolean, - default: false - }, - colors: { - type: Array, - default: () => ['#FFBB33', '#FFBB33', '#FFBB33'] - }, - disabled: { - type: Boolean, - default: false - }, - disabledVoidColor: { - type: String, - default: 'rgba(25,25,25,0.05)' - }, - disabledVoidIconClass: { - type: String, - default: 'icon-star-active' - }, - highThreshold: { - type: Number, - default: 4 - }, - iconClasses: { - type: Array, - default: () => ['icon-star-active', 'icon-star-active', 'icon-star-active'] - }, - lowThreshold: { - type: Number, - default: 2 - }, - max: { - type: Number, - default: 5 - }, - modelValue: { - type: Number, - default: 0 - }, - radio: { - // 是否单选其他形态 - type: Boolean, - default: false - }, - scoreTemplate: { - type: String, - default: '{value}' - }, - showScore: { - type: Boolean, - default: false - }, - showText: { - type: Boolean, - default: false - }, - size: { - type: String, - default: '16px' - }, - space: { - type: String, - default: '24px' - }, - textColor: { - type: String, - default: '#191919' - }, - textOnBottom: { - type: Boolean, - default: false - }, - texts: { - type: Array, - default: () => [t('ui.rate.level.poor'), t('ui.rate.level.fair'), t('ui.rate.level.average'), t('ui.rate.level.good'), t('ui.rate.level.excellent')] - }, - voidColor: { - type: String, - default: 'rgba(25,25,25,0.05)' - }, - voidIconClass: { - type: String, - default: 'icon-star-active' - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/rate/src/pc.vue b/packages/rate/src/pc.vue deleted file mode 100644 index eede859d2..000000000 --- a/packages/rate/src/pc.vue +++ /dev/null @@ -1,82 +0,0 @@ - - - - diff --git a/packages/renderless/CHANGELOG.md b/packages/renderless/CHANGELOG.md new file mode 100644 index 000000000..e6bf996ef --- /dev/null +++ b/packages/renderless/CHANGELOG.md @@ -0,0 +1,41 @@ +# Change Log + +All notable changes to this project will be documented in this file. +See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + +## [5.0.34-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/@opentiny/vue-renderless@5.0.33-mf.0...@opentiny/vue-renderless@5.0.34-mf.0) (2023-02-08) + +**Note:** Version bump only for package @opentiny/vue-renderless + + + + + +## [5.0.33-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/@opentiny/vue-renderless@5.0.32-mf.0...@opentiny/vue-renderless@5.0.33-mf.0) (2023-02-08) + +**Note:** Version bump only for package @opentiny/vue-renderless + + + + + +## [5.0.32-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/@opentiny/vue-renderless@5.0.31-beta.0...@opentiny/vue-renderless@5.0.32-mf.0) (2023-02-08) + +**Note:** Version bump only for package @opentiny/vue-renderless + + + + + +## 5.0.31-beta.0 (2023-02-08) + + +### Bug Fixes + +* 参数名错误 ([aeebbba](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/aeebbbaf42ce46d250b02050c009729a8b0c1611)) +* 修正 form-item 的 renderless 参数名错误 ([3b0925a](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/3b0925a91971d953780d94fd9193fa92a1b1fd4f)) + + +### Features + +* 增加 build:renderless ([b29dacb](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/b29dacb0fa68d919c6d749660d1ece8ea336e18e)) diff --git a/packages/renderless/README.md b/packages/renderless/README.md new file mode 100644 index 000000000..4780432f4 --- /dev/null +++ b/packages/renderless/README.md @@ -0,0 +1,7 @@ +# @opentiny/vue-renderless + +This is for TINY's own internal use only, currently as a dependency for @opentiny/vue. + +It can also be used as a renderless functions for implementing a custom UI component. + +For all instructions, please check out the home page: [https://open.codehub.huawei.com/innersource/originjs/tiny/opentiny-vue/home](https://open.codehub.huawei.com/innersource/originjs/tiny/opentiny-vue/home) diff --git a/packages/renderless/package.json b/packages/renderless/package.json new file mode 100644 index 000000000..f9257137d --- /dev/null +++ b/packages/renderless/package.json @@ -0,0 +1,36 @@ +{ + "name": "@opentiny/vue-renderless", + "private": true, + "version": "3.7.0", + "description": "An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.", + "homepage": "https://opentiny.design/tiny-vue", + "keywords": [ + "vue", + "vue3", + "frontend", + "component-library", + "components", + "vue-components", + "opentiny", + "renderless-components", + "headless-components" + ], + "author": "OpenTiny Team", + "license": "MIT", + "sideEffects": false, + "scripts": { + "build": "tsup", + "postversion": "pnpm build" + }, + "dependencies": { + "xss": "1.0.11" + }, + "exports": { + "./package.json": "./package.json", + "./*": "./src/*" + }, + "devDependencies": { + "esno": "^0.16.3", + "tsup": "^6.5.0" + } +} diff --git a/packages/renderless/scripts/postbuild.ts b/packages/renderless/scripts/postbuild.ts new file mode 100644 index 000000000..00657a00d --- /dev/null +++ b/packages/renderless/scripts/postbuild.ts @@ -0,0 +1,12 @@ +import { resolve } from 'node:path' +import { promises as fs } from 'node:fs' + +async function run() { + const content = await fs.readFile(resolve('package.json'), 'utf8') + const packageJson = JSON.parse(content) + delete packageJson.exports + delete packageJson.private + await fs.writeFile(resolve('dist', 'package.json'), JSON.stringify(packageJson, null, 2)) +} + +void run() diff --git a/packages/renderless/src/action-menu/index.ts b/packages/renderless/src/action-menu/index.ts new file mode 100644 index 000000000..e6cd5098f --- /dev/null +++ b/packages/renderless/src/action-menu/index.ts @@ -0,0 +1,23 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +export const handleMoreClick = (emit) => () => { + emit('more-click') +} + +export const handleItemClick = (emit) => (data) => { + emit('item-click', data) +} + +export const visibleChange = (emit) => (status) => { + emit('visible-change', status) +} diff --git a/packages/renderless/src/action-menu/vue.ts b/packages/renderless/src/action-menu/vue.ts new file mode 100644 index 000000000..57f9c78f5 --- /dev/null +++ b/packages/renderless/src/action-menu/vue.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { handleMoreClick, handleItemClick, visibleChange } from './index' + +export const api = ['state', 'handleMoreClick', 'handleItemClick', 'visibleChange'] + +export const renderless = (props, { computed, reactive }, { emit, nextTick }) => { + const api = { + handleMoreClick: handleMoreClick(emit), + handleItemClick: handleItemClick(emit), + visibleChange: visibleChange(emit) + } + const state = reactive({ + visibleOptions: computed(() => props.options.slice(0, props.maxShowNum)), + moreOptions: computed(() => props.options.slice(props.maxShowNum)), + spacing: computed(() => (String(props.spacing).includes('px') ? props.spacing : props.spacing + 'px')) + }) + + Object.assign(api, { + state + }) + + return api +} diff --git a/packages/renderless/src/action-sheet/index.ts b/packages/renderless/src/action-sheet/index.ts new file mode 100644 index 000000000..8215368d4 --- /dev/null +++ b/packages/renderless/src/action-sheet/index.ts @@ -0,0 +1,71 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const setSheetStyle = ({ state, props }) => () => { + if (props.contentPosition) { + // 展示在视图中间 + state.sheetMaskStyle = { + 'position': 'absolute', + } + state.sheetContentStyle = { + 'position': 'absolute', + 'max-height': props.height, + } + } else { + // 固定在页面底部 + state.sheetMaskStyle = { + 'position': 'fixed', + } + state.sheetContentStyle = { + 'position': 'fixed', + 'max-height': props.height, + } + } +} + +export const initScrollMenu = ({ state, nextTick, refs, BScroll }) => () => { + nextTick(() => { + const { scrollMenu } = refs + if (!state.scroll) { + state.scroll = new BScroll(scrollMenu, { + probeType: 3, + click: true + }) + } else { + state.scroll.refresh() + } + }) +} + +export const visibleHandle = ({ emit, state }) => () => { + state.scroll = null + emit('update:visible', false) + emit('close', false) +} + +export const watchVisible = ({ emit, props, state }) => (value) => { + state.active = props.modelValue + + setTimeout(() => { + value ? (state.toggle = true) : (state.toggle = false) + }, 0) + + emit('update:visible', value) +} + +export const menuHandle = ({ emit, state }) => (item) => { + state.active = item.id + state.scroll = null + emit('update:visible', false) + emit('update:modelValue', item.id) + emit('click', item) +} diff --git a/packages/renderless/src/action-sheet/vue.ts b/packages/renderless/src/action-sheet/vue.ts new file mode 100644 index 000000000..1dc2f86ff --- /dev/null +++ b/packages/renderless/src/action-sheet/vue.ts @@ -0,0 +1,47 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { setSheetStyle, initScrollMenu, visibleHandle, watchVisible, menuHandle } from './index' + +export const api = ['state', 'setSheetStyle', 'initScrollMenu', 'visibleHandle', 'menuHandle'] + +export const renderless = (props, { reactive, watch }, { emit, nextTick, refs }, { BScroll }) => { + const api = {} + const state = reactive({ + toggle: false, + active: null, + sheetMaskStyle: {}, + sheetContentStyle: {}, + scroll: null, + }) + + watch(() => props.visible, + (value) => { + if (value) { + api.setSheetStyle({ state, props }) + api.initScrollMenu({ state, nextTick, refs, BScroll }) + } + api.watchVisible(value) + }, + ) + + Object.assign(api, { + state, + setSheetStyle: setSheetStyle({ state, props }), + initScrollMenu: initScrollMenu({ state, nextTick, refs, BScroll }), + visibleHandle: visibleHandle({ emit, state }), + watchVisible: watchVisible({ emit, props, state }), + menuHandle: menuHandle({ state, emit }), + }) + + return api +} diff --git a/packages/renderless/src/alert/index.ts b/packages/renderless/src/alert/index.ts new file mode 100644 index 000000000..1a0344457 --- /dev/null +++ b/packages/renderless/src/alert/index.ts @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const close = ({ emit, state }) => () => { + state.show = false + emit('close') +} + +export const computedGetIcon = ({ constants, props }) => () => props.icon || constants.ICON_MAP[props.type] + +export const computedGetTitle = ({ constants, t, props }) => () => props.title || t(constants.TITLE_MAP[props.type]) diff --git a/packages/renderless/src/alert/vue.ts b/packages/renderless/src/alert/vue.ts new file mode 100644 index 000000000..368dd81c4 --- /dev/null +++ b/packages/renderless/src/alert/vue.ts @@ -0,0 +1,35 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { close, computedGetIcon, computedGetTitle } from './index' + +export const api = ['close', 'state'] + +export const renderless = (props, { computed, reactive }, { t, emit, constants }) => { + const api = { + computedGetIcon: computedGetIcon({ constants, props }), + computedGetTitle: computedGetTitle({ constants, props, t }) + } + + const state = reactive({ + show: true, + getIcon: computed(() => api.computedGetIcon()), + getTitle: computed(() => api.computedGetTitle()) + }) + + Object.assign(api, { + state, + close: close({ state, emit }) + }) + + return api +} diff --git a/packages/renderless/src/amount/index.ts b/packages/renderless/src/amount/index.ts new file mode 100644 index 000000000..557e02c2f --- /dev/null +++ b/packages/renderless/src/amount/index.ts @@ -0,0 +1,299 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' +import { formatNumber } from '@opentiny/vue-renderless/common/decimal' +import { getMiniDecimal, equalsDecimal } from '@opentiny/vue-renderless/common/bigInt' +import { isNumber } from '@opentiny/vue-renderless/common/type' + +export const initService = (service) => { + const { utils = {} } = service || {} + const noopFn = () => null + + return { + getCurrencyPrecision: utils.getCurrencyPrecision || noopFn, + getNumberFormat: utils.getNumberFormat || noopFn + } +} + +export const getDecimal = (props) => (value) => getMiniDecimal(value, props.plugin) + +export const closePopper = (state) => () => { + state.visible = false +} + +export const popInput = ({ editorState, props, state, api }) => (value) => { + value = api.onInputPreprocess(value) + + const { fraction, groupSeparator } = state.format + + value = value.replace(/^-+/, '-') + + const groups = value.split(groupSeparator).map((val) => val.trim()) + + value = groups.join('') + + if (value !== '-' && api.getDecimal(value).isNaN()) { + value = editorState.lastInput + } else { + value = value + .split('.') + .map((a, i) => (i && props.strictInput && typeof fraction === 'number' ? a.substr(0, fraction) : a)) + .join('.') + } + + editorState.lastInput = value + editorState.amount = value +} + +export const toggleVisible = ({ api, props, state, editorState }) => () => { + if (props.disabled || !props.popUp) { + return + } + + state.lock = true + state.visible = !state.visible + + if (state.visible) { + const { date, currency } = state + + Object.assign(editorState, { + amount: state.amount, + date, + currency + }) + + api.addOutSideEvent(state.visible) + } +} + +export const innerFormat = ({ state, props }) => (value) => { + const { fraction, zeroize, rounding } = state.format + const { modelTruncation } = props + const fractionLen = (value.split('.')[1] || '').length + + if (value === '-') { + return 0 + } + + if (!modelTruncation && fractionLen > fraction) { + return value + } + + return formatNumber(value, { + fraction, + zeroize, + groupSeparator: '', + decimalSeparator: '.', + rounding + }) +} + +export const save = ({ api, state, editorState }) => () => { + const { amount, date, currency } = editorState + + Object.assign(state, { amount, date, currency }) + + api.closePopper() + + let num = api.innerFormat(String(state.amount)) + + state.amount = isNaN(num) ? 0 : num + + if (!equalsDecimal(state.lastInput, state.amount) || state.lastCurrency !== currency || state.lastDate !== date) { + api.emitChange() + } + + state.lastInput = state.amount + state.lastCurrency = currency + state.lastDate = date + + api.initText() +} + +export const reset = ({ state, editorState }) => () => { + const { amount, date, currency } = state + Object.assign(editorState, { amount, date, currency }) +} + +export const emitChange = ({ emit, state }) => () => { + const { date, currency } = state + const emitAmount = Number(state.amount) + + emit('update:modelValue', emitAmount) + emit('update:currency', currency) + emit('update:date', date) + emit('change', { amount: emitAmount, date, currency }) +} + +export const inputFocus = ({ state, props }) => () => { + let amount = String(state.amount) + + state.isFocus = true + state.lock = false + + const { fraction } = state.format + const fractionLen = (amount.split('.')[1] || '').length + + if (fractionLen < fraction && props.holdZero) { + amount = formatNumber(amount, { fraction }) + } + + state.amountText = amount +} + +export const inputBlur = ({ api, state, props }) => () => { + if (state.amountText !== '') { + let amount = api.innerFormat(String(state.amountText)) + + if (isNaN(amount)) { + state.amount = '' + } + + state.amount = props.holdZero ? amount : api.getDecimal(amount).toString() + } + + state.isFocus = false + state.amountText = formatNumber(state.amount, state.format) + + if (!equalsDecimal(state.lastInput, state.amount)) { + api.emitChange() + } + + state.lastInput = state.amount +} + +export const handelClick = ({ api, refs }) => (e) => { + const contains = refs.root.contains(e.target) + + if (!contains) { + api.closePopper() + } +} + +export const addOutSideEvent = (api) => (visible) => { + if (visible) { + on(document, 'click', api.handelClick) + } else { + off(document, 'click', api.handelClick) + } +} + +export const initText = ({ state }) => () => { + let amount = String(state.amount) + + state.amountText = amount ? (state.isFocus ? amount : formatNumber(state.amount, state.format)) : '' +} + +export const onInputPreprocess = (props) => (value) => { + const inputElem = event.target + + if (value) { + const i = value.lastIndexOf('-') + + if ((i === 0 && !props.negative) || i > 0) { + const tmpArr = value.split('') + + tmpArr.splice(i, 1) + + inputElem.value = value = tmpArr.join('') + inputElem.selectionStart = inputElem.selectionEnd = i + } + } + + return value +} + +export const onInput = ({ state, props, api }) => (value) => { + value = api.onInputPreprocess(value) + + const { fraction, groupSeparator } = state.format + + value = event.target.value.replace(/^-+/, '-') + + const groups = value.split(groupSeparator).map((val) => val.trim()) + + value = groups.join('') + + if (value !== '-' && api.getDecimal(value).isNaN()) { + value = state.lastInput + } else { + value = value + .split('.') + .map((a, i) => (i && props.strictInput && typeof fraction === 'number' ? a.substr(0, fraction) : a)) + .join('.') + } + + event.target.value = value + state.amount = value + state.amountText = value +} + +export const getPrecision = ({ service, props, currency }) => { + const { format = {}, rounding: r, digits, type } = props + let fraction + let rounding = format.rounding + + const { getCurrencyPrecision, getNumberFormat } = service + const serFra = getCurrencyPrecision(type, currency) || {} + const serFmt = getNumberFormat() || {} + + const defaultFmt = { + groupSeparator: ',', + groupSize: 3, + decimalSeparator: '.', + zeroize: props.holdZero + } + + fraction = isNumber(format.fraction) ? format.fraction : isNumber(serFra.fraction) ? serFra.fraction : digits + + if (r === false) { + rounding = 0 + } else { + rounding = isNumber(rounding) ? rounding : isNumber(serFra.rounding) ? serFra.rounding : 5 + } + + return { ...defaultFmt, fraction, rounding, ...serFmt, ...format } +} + +export const getAmountText = ({ state, props }) => () => + props.hideCurrency ? (typeof state.amountText === 'string' ? state.amountText.replace(state.currency, '') : state.amountText) : state.amountText + +export const watchModelValue = ({ api, state }) => () => { + let value = api.initAmount() + + state.amount = value + state.lastInput = value + + api.initText() +} + +export const watchCurrency = ({ api, state, editorState }) => (value) => { + state.currency = value + editorState.currency = value + state.lastCurrency = value + + api.initText() +} + +export const initAmount = (props) => () => { + let value = props.modelValue + + value = value === null || isNaN(Number(value)) ? '' : value + + if (!props.negative && value && Number(value) < 0) { + value -= 0 + value = Math.abs(value) + } + + return value +} diff --git a/packages/renderless/src/amount/vue.ts b/packages/renderless/src/amount/vue.ts new file mode 100644 index 000000000..e779da32b --- /dev/null +++ b/packages/renderless/src/amount/vue.ts @@ -0,0 +1,154 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + closePopper, + popInput, + save, + reset, + inputBlur, + emitChange, + inputFocus, + toggleVisible, + addOutSideEvent, + handelClick, + initText, + onInput, + getPrecision, + getDecimal, + innerFormat, + getAmountText, + initService, + watchModelValue, + watchCurrency, + onInputPreprocess, + initAmount +} from './index' + +export const api = [ + 't', + 'popInput', + 'state', + 'editorState', + 'save', + 'reset', + 'inputBlur', + 'init', + 'toggleVisible', + 'inputFocus', + 'closePopper', + 'onInput', + 'getAmountText' +] + +const initState = ({ reactive, computed, props, $service, editorState }) => { + const state = reactive({ + visible: false, + amount: props.modelValue || '', + currency: props.currency, + date: props.date, + overMaxLen: false, + isFocus: false, + lock: false, + amountText: '', + lastInput: props.modelValue, + lastCurrency: props.currency, + lastDate: props.date, + format: computed(() => ({ + ...getPrecision({ service: $service, props, currency: editorState.currency }), + prefix: state.currency + })) + }) + + return state +} + +const initEditorState = ({ reactive, props }) => + reactive({ + amount: '', + date: '', + currency: props.currency, + lastInput: props.modelValue + }) + +const initApi = ({ api, t, editorState, props, state, emit, refs }) => { + Object.assign(api, { + state, + t, + editorState, + getDecimal: getDecimal(props), + innerFormat: innerFormat({ state, props }), + getAmountText: getAmountText({ state, props }), + initAmount: initAmount(props), + onInputPreprocess: onInputPreprocess(props), + onInput: onInput({ state, props, api }), + initText: initText({ state }), + inputFocus: inputFocus({ state, props }), + inputBlur: inputBlur({ api, props, state }), + closePopper: closePopper(state), + emitChange: emitChange({ emit, state }), + popInput: popInput({ editorState, api, state, props }), + save: save({ api, state, editorState, props }), + reset: reset({ api, state, editorState }), + handelClick: handelClick({ api, refs }), + addOutSideEvent: addOutSideEvent(api), + watchModelValue: watchModelValue({ api, state }), + watchCurrency: watchCurrency({ api, state, editorState }), + toggleVisible: toggleVisible({ api, props, state, editorState }) + }) +} + +const initWatch = ({ watch, props, state, api }) => { + watch(() => props.modelValue, api.watchModelValue, { immediate: true }) + + watch(() => props.currency, api.watchCurrency, { immediate: true }) + + watch( + () => props.date, + (value) => { + state.date = value + state.lastDate = value + }, + { immediate: true } + ) + + watch( + () => props.rounding, + (value) => { + state.format.rounding = value + } + ) + + watch( + () => props.digits, + (value) => { + state.format.fraction = value + } + ) +} + +export const renderless = (props, { onUnmounted, computed, reactive, watch }, { t, emit, refs, service }) => { + const api = {} + const $service = initService(service) + const editorState = initEditorState({ reactive, props }) + const state = initState({ reactive, computed, props, $service, editorState }) + + initApi({ api, t, editorState, props, state, emit, refs }) + + api.getDecimal(0) // 初始化Decimal + + initWatch({ watch, props, state, api }) + + onUnmounted(() => api.addOutSideEvent(false)) + + return api +} diff --git a/packages/renderless/src/anchor/index.ts b/packages/renderless/src/anchor/index.ts new file mode 100644 index 000000000..8fe1781fa --- /dev/null +++ b/packages/renderless/src/anchor/index.ts @@ -0,0 +1,157 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { addClass, removeClass } from '@opentiny/vue-renderless/common/deps/dom' + +const setFixAnchor = ({ vm }) => { + const { fixRef } = vm.$refs + if (fixRef) { + fixRef.style.top = fixRef.offsetTop + } +} + +const setMarkClass = ({ state, props }) => { + const { scrollContainer } = state + const { markClass } = props + const activeContentEl = scrollContainer.querySelector(`${state.currentLink}`) + if (markClass) { + addClass(activeContentEl, markClass) + setTimeout(() => { + removeClass(activeContentEl, markClass) + }, 1000) + } +} + +const setScrollContainer = ({ state, api, cb = null }) => { + const currentContainer = api.getContainer() + const { scrollContainer } = state + if (scrollContainer !== currentContainer) { + removeClass(scrollContainer, 'tiny-anchor-scroll-container') + state.scrollContainer = currentContainer + addClass(currentContainer, 'tiny-anchor-scroll-container') + cb && cb() + } +} + +const updateSkidPosition = ({ vm, state, emit }) => { + const { currentLink } = state + const activeEl = vm.$refs[currentLink] + const { skidRef, maskRef, anchorRef } = vm.$refs + + if (!activeEl || !anchorRef) { + return + } + emit('onChange', currentLink) + + const { offsetHeight, offsetWidth } = activeEl + const { top: linkTitleClientTop, left: linkTitleClientLeft } = activeEl.getBoundingClientRect() + const { top: anchorClientTop, left: anchorClientLeft } = anchorRef.getBoundingClientRect() + + const offsetTop = linkTitleClientTop - anchorClientTop + const offsetLeft = linkTitleClientLeft - anchorClientLeft + addClass(skidRef, 'tiny-anchor-orbit-skid--active') + skidRef.style.top = `${offsetTop}px` + skidRef.style.height = `${offsetHeight}px` + if (maskRef) { + maskRef.style.top = `${offsetTop}px` + maskRef.style.height = `${offsetHeight}px` + maskRef.style.maxWidth = `${offsetWidth + offsetLeft}px` + } +} + +const getCurrentAnchor = ({ vm, state, link, emit }) => { + if (state.currentLink === link) { return } + state.currentLink = link + updateSkidPosition({ vm, state, emit }) +} + +const addObserver = ({ props, state }) => { + const { links } = props + const { intersectionObserver } = state + const observer = (list) => { + list.forEach(item => { + const link = item.link + if (item.children) { + observer(item.children) + } else { + const linkEl = document.querySelector(link) + linkEl && intersectionObserver.observe(linkEl) + } + }) + } + observer(links) +} + +const setCurrentHash = (state) => { + if (state.currentHash !== location.hash) { + state.currentHash = location.hash + return true + } + return false +} + +export const getContainer = ({ props }) => () => props.containerId ? document.querySelector(props.containerId) : document.body + +export const mounted = ({ vm, state, api }) => () => { + setScrollContainer({ state, api }) + setFixAnchor({ vm }) + api.onItersectionObserver() + setCurrentHash(state) +} + +export const updated = ({ state, api }) => () => { + const cb = api.onItersectionObserver + setScrollContainer({ state, api, cb }) +} + +export const unmounted = ({ state }) => () => { + const { intersectionObserver } = state + intersectionObserver.disconnect() +} + +export const onItersectionObserver = ({ vm, state, props, emit }) => () => { + state.intersectionObserver = new IntersectionObserver((entries) => { + entries.forEach(item => { + const key = item.target.id + state.observerLinks[key] = item + }) + + for (let item of Object.values(state.observerLinks)) { + if (item.isIntersecting && item.intersectionRatio > 0) { + const link = `#${item.target.id}` + getCurrentAnchor({ vm, state, link, emit }) + break + } + } + }) + + addObserver({ props, state }) +} + +export const linkClick = ({ state, vm, emit, props }) => (e, item) => { + const { link, title } = item + const emitLink = { link, title } + emit('linkClick', e, emitLink) + + const isChangeHash = setCurrentHash(state) + const { scrollContainer } = state + state.currentLink = link + updateSkidPosition({ vm, state, emit }) + setMarkClass({ state, props }) + + if (scrollContainer !== document.body && !isChangeHash) { + const linkEl = scrollContainer.querySelector(item.link) + const top = linkEl.offsetTop + const param = { top, left: 0, behavior: 'smooth' } + scrollContainer.scrollTo(param) + } +} diff --git a/packages/renderless/src/anchor/vue.ts b/packages/renderless/src/anchor/vue.ts new file mode 100644 index 000000000..60a473f5d --- /dev/null +++ b/packages/renderless/src/anchor/vue.ts @@ -0,0 +1,42 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICElinksMapNSES FOR MORE DETAILS. +* +*/ + +import { mounted, updated, unmounted, getContainer, linkClick, onItersectionObserver } from './index' + +export const api = ['state', 'getContainer', 'linkClick', 'onItersectionObserver'] + +export const renderless = (props, { onMounted, onUnmounted, onUpdated, reactive }, { vm, emit }) => { + const api = {} + const state = reactive({ + currentLink: '', + observerLinks: {}, + intersectionObserver: null, + scrollContainer: null, + currentHash: '' + }) + + Object.assign(api, { + state, + mounted: mounted({ vm, state, api }), + updated: updated({ state, api }), + unmounted: unmounted({ state }), + getContainer: getContainer({ props }), + linkClick: linkClick({ state, vm, emit, props }), + onItersectionObserver: onItersectionObserver({ vm, state, props, emit }) + }) + + onMounted(api.mounted) + onUpdated(api.updated) + onUnmounted(api.unmounted) + + return api +} diff --git a/packages/renderless/src/area/index.ts b/packages/renderless/src/area/index.ts new file mode 100644 index 000000000..0f636ae1a --- /dev/null +++ b/packages/renderless/src/area/index.ts @@ -0,0 +1,140 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const fetchDefaultData = ({ emit, fetchArea, nextTick, props, refs, state }) => () => { + let parent = '' + + nextTick(() => { + emit('change-jcr', parent, refs.refInstance.$parent) + }) + + let promise + + if (props.fetchJcr) { + promise = props.fetchJcr() + } else { + if (typeof fetchArea !== 'function') { + throw new TypeError('[TINY Error][Area] Prop fetchJcr is not configured') + } + + promise = fetchArea({ label: 'JCR', parent }) + } + + promise.then((data) => (state.jcrData = data)) + + state.jcr = '' + state.region = '' + state.rep = '' + state.office = '' + + emit('update:modelValue', [state.jcr, state.region, state.rep, state.office]) +} + +export const getRegion = ({ emit, fetchArea, nextTick, props, refs, state }) => (value) => { + state.jcr = value + + nextTick(() => { + emit('change-region', value, refs.refInstance.$parent) + }) + + let promise + + if (props.fetchRegion) { + promise = props.fetchRegion() + } else { + if (typeof fetchArea !== 'function') { + throw new TypeError('[TINY Error][Area] Prop fetchRegion is not configured') + } + + promise = fetchArea({ label: 'Region', parent: value }) + } + + promise.then((data) => (state.regionData = data)) + + state.region = '' + state.office = '' + state.rep = '' + + emit('update:modelValue', [state.jcr, state.region, state.rep, state.office]) +} + +export const getRep = ({ emit, fetchArea, nextTick, props, refs, state }) => (value) => { + state.region = value + + nextTick(() => { + emit('change-rep', value, refs.refInstance.$parent) + }) + + let promise + + if (props.fetchRep) { + promise = props.fetchRep() + } else { + if (typeof fetchArea !== 'function') { + throw new TypeError('[TINY Error][Area] Prop fetchRep is not configured') + } + + promise = fetchArea({ label: 'Rep. Office', parent: value }) + } + + promise.then((data) => (state.repData = data)) + + state.office = '' + state.rep = '' + + emit('update:modelValue', [state.jcr, state.region, state.rep, state.office]) +} + +export const getOffice = ({ emit, fetchArea, nextTick, props, refs, state }) => (value) => { + state.rep = value + + nextTick(() => { + emit('change-office', value, refs.refInstance.$parent) + }) + + let promise + + if (props.fetchOffice) { + promise = props.fetchOffice() + } else { + if (typeof fetchArea !== 'function') { + throw new TypeError('[TINY Error][Area] Prop fetchOffice is not configured') + } + + promise = fetchArea({ label: 'Office', parent: value }) + } + + promise.then((data) => (state.officeData = data)) + + state.office = '' + emit('update:modelValue', [state.jcr, state.region, state.rep, state.office]) +} + +export const changeOffice = ({ emit, state }) => (value) => { + state.office = value + emit('update:modelValue', [state.jcr, state.region, state.rep, state.office]) +} + +export const beforeMount = ({ api, props }) => () => { + api.fetchDefaultData() + + let { modelValue } = props + + if (Array.isArray(modelValue) && modelValue.length) { + let [jcr = '', region = '', rep = '', office = ''] = modelValue + + api.getRegion(jcr) + api.getRep(region) + api.getOffice(rep) + api.changeOffice(office) + } +} diff --git a/packages/renderless/src/area/vue.ts b/packages/renderless/src/area/vue.ts new file mode 100644 index 000000000..7460fb289 --- /dev/null +++ b/packages/renderless/src/area/vue.ts @@ -0,0 +1,45 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getRegion, changeOffice, getRep, getOffice, fetchDefaultData, beforeMount } from './index' + +export const api = ['state', 'getRep', 'getRegion', 'getOffice', 'changeOffice'] + +export const renderless = (props, { onBeforeMount, reactive }, { emit, service, refs, nextTick }) => { + const api = {} + const { fetchArea } = service || {} + + const state = reactive({ + jcr: '', + region: '', + rep: '', + office: '', + jcrData: [], + regionData: [], + repData: [], + officeData: [] + }) + + Object.assign(api, { + state, + changeOffice: changeOffice({ emit, state }), + beforeMount: beforeMount({ api, props }), + getRep: getRep({ emit, fetchArea, nextTick, props, refs, state }), + getRegion: getRegion({ emit, fetchArea, nextTick, props, refs, state }), + getOffice: getOffice({ emit, fetchArea, nextTick, props, refs, state }), + fetchDefaultData: fetchDefaultData({ emit, fetchArea, nextTick, props, refs, state }) + }) + + onBeforeMount(api.beforeMount) + + return api +} diff --git a/packages/renderless/src/autocomplete/index.ts b/packages/renderless/src/autocomplete/index.ts new file mode 100644 index 000000000..db37212a7 --- /dev/null +++ b/packages/renderless/src/autocomplete/index.ts @@ -0,0 +1,164 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const getData = ({ props, state, updatePopper, nextTick }) => (queryString) => { + if (state.suggestionDisabled) { + return + } + + state.loading = true + + props.fetchSuggestions(queryString, (suggestions) => { + state.loading = false + + if (state.suggestionDisabled) { + return + } + + if (Array.isArray(suggestions)) { + state.suggestions = suggestions + state.highlightedIndex = props.highlightFirstItem ? 0 : -1 + } else { + throw new TypeError('[TINY Error][Autocomplete]autocomplete suggestions must be an array') + } + + nextTick(updatePopper) + }) +} + +export const handleChange = ({ api, emit, state, props }) => (value) => { + state.activated = true + emit('update:modelValue', value) + state.suggestionDisabled = false + + if (!props.triggerOnFocus && !value) { + state.suggestionDisabled = true + state.suggestions = [] + + return + } + + api.debouncedGetData(value) +} + +export const handleFocus = ({ api, emit, props, state }) => (event) => { + state.activated = true + emit('focus', event) + + if (props.triggerOnFocus) { + state.suggestionDisabled = false + api.debouncedGetData(props.modelValue) + } +} + +export const handleBlur = ({ emit, state }) => (event) => { + state.suggestionDisabled = true + emit('blur', event) +} + +export const handleClear = ({ emit, state }) => () => { + state.activated = false + emit('clear') +} + +export const close = (state) => () => { + state.activated = false +} + +export const handleKeyEnter = ({ api, emit, nextTick, props, state }) => (event) => { + if (state.suggestionVisible && state.highlightedIndex >= 0 && state.highlightedIndex < state.suggestions.length) { + event.preventDefault() + api.select(state.suggestions[state.highlightedIndex]) + } else if (props.selectWhenUnmatched) { + emit('select', { value: props.modelValue }) + + nextTick(() => { + state.suggestions = [] + state.highlightedIndex = -1 + }) + } +} + +export const select = ({ emit, nextTick, props, state }) => (item) => { + emit('update:modelValue', item[props.valueKey]) + emit('select', item) + + nextTick(() => { + state.activated = false + state.suggestions = [] + state.highlightedIndex = -1 + }) +} + +export const highlight = ({ constants, refs, state }) => (index) => { + if (!state.suggestionVisible || state.loading) { + return + } + + if (index < 0) { + state.highlightedIndex = -1 + return + } + + if (index >= state.suggestions.length) { + index = state.suggestions.length - 1 + } + + const suggestion = refs.popper.querySelector(constants.WARP_CLS) + const suggestionList = suggestion.querySelectorAll(constants.ITEM_CLS) + let highlightItem = suggestionList[index] + let scrollTop = suggestion.scrollTop + let offsetTop = highlightItem.offsetTop + + if (offsetTop + highlightItem.scrollHeight > scrollTop + suggestion.clientHeight) { + suggestion.scrollTop += highlightItem.scrollHeight + } + + if (offsetTop < scrollTop) { + suggestion.scrollTop -= highlightItem.scrollHeight + } + + state.highlightedIndex = index + + let $input = refs.input.getInput() + + $input.setAttribute('aria-activedescendant', `${state.id}-item-${state.highlightedIndex}`) +} + +export const computedVisible = (state) => { + const suggestions = state.suggestions + let isValidData = Array.isArray(suggestions) && suggestions.length > 0 + + return (isValidData || state.loading) && state.activated +} + +export const watchVisible = ({ suggestionState, refs }) => (val) => { + let $input = refs.input.getInput() + + if ($input) { + suggestionState.dropdownWidth = $input.offsetWidth + 'px' + suggestionState.showPopper = val + } +} + +export const mounted = ({ refs, state, suggestionState }) => () => { + const input = refs.input + const $input = input.getInput() + + suggestionState.popperElm = refs.popper + suggestionState.referenceElm = $input + + $input.setAttribute('role', 'textbox') + $input.setAttribute('aria-autocomplete', 'list') + $input.setAttribute('aria-controls', 'id') + $input.setAttribute('aria-activedescendant', `${state.id}-item-${state.highlightedIndex}`) +} diff --git a/packages/renderless/src/autocomplete/vue.ts b/packages/renderless/src/autocomplete/vue.ts new file mode 100644 index 000000000..f28f45871 --- /dev/null +++ b/packages/renderless/src/autocomplete/vue.ts @@ -0,0 +1,121 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import debounce from '@opentiny/vue-renderless/common/deps/debounce' +import userPopper from '@opentiny/vue-renderless/common/deps/vue-popper' +import { guid } from '@opentiny/vue-renderless/common/string' +import { + computedVisible, + watchVisible, + mounted, + getData, + handleChange, + handleFocus, + handleBlur, + handleClear, + close, + handleKeyEnter, + select, + highlight +} from './index' + +export const api = [ + 'state', + 'select', + 'suggestionState', + 'getInput', + 'handleChange', + 'close', + 'handleFocus', + 'handleBlur', + 'handleClear', + 'handleKeyEnter', + 'highlight', + 'select', + 'doDestroy' +] + +const initState = ({ reactive, $prefix, computed }) => { + const state = reactive({ + activated: false, + suggestions: [], + loading: false, + highlightedIndex: -1, + suggestionDisabled: false, + id: $prefix + '-' + guid(), + suggestionVisible: computed(() => computedVisible(state)) + }) + + return state +} + +const initSuggestionState = ({ reactive, parent, showPopper, popperElm, referenceElm }) => + reactive({ + parent, + dropdownWidth: '', + showPopper, + popperElm, + referenceElm + }) + +const initApi = ({ api, state, doDestroy, suggestionState, emit, refs, props, updatePopper, nextTick, constants }) => { + api.getData = getData({ props, state, updatePopper, nextTick }) + + Object.assign(api, { + state, + doDestroy, + suggestionState, + close: close(state), + handleBlur: handleBlur({ emit, state }), + mounted: mounted({ refs, state, suggestionState }), + highlight: highlight({ constants, refs, state }), + handleClear: handleClear({ emit, state }), + select: select({ emit, nextTick, props, state }), + watchVisible: watchVisible({ suggestionState, refs }), + handleChange: handleChange({ api, emit, state, props }), + handleFocus: handleFocus({ api, emit, props, state }), + handleKeyEnter: handleKeyEnter({ api, emit, nextTick, props, state }), + debouncedGetData: debounce(props.debounce, api.getData) + }) +} + +export const renderless = ( + props, + { computed, onBeforeUnmount, onMounted, reactive, watch, toRefs, onDeactivated }, + { $prefix, refs, parent, emit, constants, nextTick, slots } +) => { + const api = {} + const state = initState({ reactive, $prefix, computed }) + + const { showPopper, popperElm, referenceElm, doDestroy, updatePopper } = userPopper({ + reactive, + watch, + refs, + emit, + slots, + nextTick, + props, + onBeforeUnmount, + toRefs, + onDeactivated + }) + + const suggestionState = initSuggestionState({ reactive, parent, showPopper, popperElm, referenceElm }) + + initApi({ api, state, doDestroy, suggestionState, emit, refs, props, updatePopper, nextTick, constants }) + + watch(() => state.suggestionVisible, api.watchVisible) + + onMounted(api.mounted) + + return api +} diff --git a/packages/renderless/src/autonavi-map/index.ts b/packages/renderless/src/autonavi-map/index.ts new file mode 100644 index 000000000..7ce515b3e --- /dev/null +++ b/packages/renderless/src/autonavi-map/index.ts @@ -0,0 +1,31 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { getAmap } from '@opentiny/vue-renderless/chart-core/deps/utils' + +export const amap = (columns, rows, settings, extra) => { + const { key, v, amap, useOuterMap, url } = settings + const { _once } = extra + const registerSign = 'amap_register' + + if (_once[registerSign]) { + return {} + } + + _once[registerSign] = true + + if (useOuterMap) { + return { amap } + } + + return getAmap({ key, version: v, url }).then(() => ({ amap })) +} diff --git a/packages/renderless/src/avatar/index.ts b/packages/renderless/src/avatar/index.ts new file mode 100644 index 000000000..29d196249 --- /dev/null +++ b/packages/renderless/src/avatar/index.ts @@ -0,0 +1,43 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const handleError = ({ props, state }) => () => { + const { error } = props + const errorFlag = error ? error() : undefined + + if (errorFlag !== false) { + if (state.isSrcImageExist) { + state.isSrcImageExist = false + } else { + state.isDefaultImageExist = false + } + } +} + +export const computedAvatarClass = (contants) => (props) => { + const { size, icon, shape } = props + let classList = [contants.COMPONENT_PREFIX] + + if (size && typeof size === 'string') { + classList.push(`${contants.COMPONENT_PREFIX}--${size}`) + } + + if (icon) { + classList.push(`${contants.COMPONENT_PREFIX}--${contants.icon}`) + } + + if (shape) { + classList.push(`${contants.COMPONENT_PREFIX}--${shape}`) + } + + return classList.join(' ') +} diff --git a/packages/renderless/src/avatar/vue.ts b/packages/renderless/src/avatar/vue.ts new file mode 100644 index 000000000..16273156b --- /dev/null +++ b/packages/renderless/src/avatar/vue.ts @@ -0,0 +1,34 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { computedAvatarClass, handleError } from './index' + +export const api = ['state', 'handleError'] + +export const renderless = (props, { computed, reactive }, { constants }) => { + const api = { + computedAvatarClass: computedAvatarClass(constants) + } + + const state = reactive({ + isSrcImageExist: true, + isDefaultImageExist: true, + avatarClass: computed(() => api.computedAvatarClass(props)) + }) + + Object.assign(api, { + state, + handleError: handleError({ props, state }) + }) + + return api +} diff --git a/packages/renderless/src/badge/index.ts b/packages/renderless/src/badge/index.ts new file mode 100644 index 000000000..b6367a59a --- /dev/null +++ b/packages/renderless/src/badge/index.ts @@ -0,0 +1,22 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const computedContent = ({ props, state }) => () => + typeof state.valueRef === 'number' && typeof props.max === 'number' ? (props.max < state.valueRef ? `${props.max}+` : state.valueRef) : state.valueRef + +export const computedValueRef = ({ props }) => () => { + if (typeof props.value === 'number') { + return props.value + } + + return typeof props.modelValue === 'number' ? props.modelValue : undefined +} diff --git a/packages/renderless/src/badge/vue.ts b/packages/renderless/src/badge/vue.ts new file mode 100644 index 000000000..36c47051d --- /dev/null +++ b/packages/renderless/src/badge/vue.ts @@ -0,0 +1,34 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { computedContent, computedValueRef } from './index' +import { xss } from '@opentiny/vue-renderless/common/xss' + +export const api = ['state'] + +export const renderless = (props, { computed, reactive }) => { + const api = { + computedValueRef: computedValueRef({ props }) + } + + const state = reactive({ + isOverstep: false, + valueRef: computed(() => api.computedValueRef()), + content: computed(() => api.computedContent()), + href: computed(() => xss.filterUrl(props.href)) + }) + + api.state = state + api.computedContent = computedContent({ props, state }) + + return api +} diff --git a/packages/renderless/src/baidu-map/index.ts b/packages/renderless/src/baidu-map/index.ts new file mode 100644 index 000000000..fe78720bf --- /dev/null +++ b/packages/renderless/src/baidu-map/index.ts @@ -0,0 +1,31 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { getBmap } from '@opentiny/vue-renderless/chart-core/deps/utils' + +export const bmap = (columns, rows, settings, extra) => { + const { key, v, bmap, useOuterMap, url } = settings + const { _once } = extra + const registerSign = 'bmap_register' + + if (_once[registerSign]) { + return {} + } + + _once[registerSign] = true + + if (useOuterMap) { + return { bmap } + } + + return getBmap({ key, version: v, url }).then(() => ({ bmap })) +} diff --git a/packages/renderless/src/breadcrumb-item/index.ts b/packages/renderless/src/breadcrumb-item/index.ts new file mode 100644 index 000000000..50bd140a5 --- /dev/null +++ b/packages/renderless/src/breadcrumb-item/index.ts @@ -0,0 +1,13 @@ +export const linkClick = ({ props, refs, router, emit, breadcrumbEmitter, constants }) => (event) => { + const { replace, to, option } = props + const currentBreadcrumbItem = { link: refs.link, replace, to, event, option } + + breadcrumbEmitter.emit(constants.EVENT_NAME.breadcrumbItemSelect, currentBreadcrumbItem) + emit('select', currentBreadcrumbItem) + + if (!to || !router) { + return + } + + replace ? router.replace(to) : router.push(to) +} diff --git a/packages/renderless/src/breadcrumb-item/vue.ts b/packages/renderless/src/breadcrumb-item/vue.ts new file mode 100644 index 000000000..9bc17372b --- /dev/null +++ b/packages/renderless/src/breadcrumb-item/vue.ts @@ -0,0 +1,38 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' +import { linkClick } from './index' + +export const api = ['linkClick'] + +export const renderless = (props, { onMounted, onBeforeUnmount, inject }, { refs, router, emit }) => { + const breadcrumbEmitter = inject('breadcrumbEmitter') + const breadcrumb = inject('breadcrumb') + const constants = breadcrumb._constants + + const api = { + linkClick: linkClick({ props, refs, router, emit, breadcrumbEmitter, constants }) + } + + onMounted(() => { + on(refs.link, 'click', api.linkClick) + }) + + onBeforeUnmount(() => { + off(refs.link, 'click', api.linkClick) + }) + + return { + api + } +} diff --git a/packages/renderless/src/breadcrumb/index.ts b/packages/renderless/src/breadcrumb/index.ts new file mode 100644 index 000000000..8a5fc5195 --- /dev/null +++ b/packages/renderless/src/breadcrumb/index.ts @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const breadcrumbItemSelect = ({ emit, state, constants }) => { + state.breadcrumbEmitter.on(constants.EVENT_NAME.breadcrumbItemSelect, (value) => { + state.currentBreadcrumbItem = value + emit('select', value) + }) +} diff --git a/packages/renderless/src/breadcrumb/vue.ts b/packages/renderless/src/breadcrumb/vue.ts new file mode 100644 index 000000000..f1ef6f759 --- /dev/null +++ b/packages/renderless/src/breadcrumb/vue.ts @@ -0,0 +1,32 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { breadcrumbItemSelect } from './index' + +export const api = ['breadcrumbItemSelect'] + +export const renderless = (props, { reactive, provide }, { emit, constants, emitter }) => { + const state = reactive({ + breadcrumbEmitter: emitter(), + currentBreadcrumbItem: {} + }) + + const api = { + breadcrumbItemSelect: () => breadcrumbItemSelect({ api, emit, state, constants }) + } + + provide('breadcrumbEmitter', state.breadcrumbEmitter) + + api.breadcrumbItemSelect() + + return api +} diff --git a/packages/renderless/src/bulletin-board/index.ts b/packages/renderless/src/bulletin-board/index.ts new file mode 100644 index 000000000..f3c2c846b --- /dev/null +++ b/packages/renderless/src/bulletin-board/index.ts @@ -0,0 +1,32 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { xss } from '@opentiny/vue-renderless/common/xss.js' + +export const getRoute = (route) => `/${route || ''}`.replace(/^\/+/, '/') + +export const computedDataList = ({ props, state }) => () => { + const list = props.data[Number(state.actName) - 1] || [] + + list.forEach((subItem) => { + subItem.url = xss.filterUrl(subItem.url) + }) + + return list +} + +export const computedMoreLink = ({ props }) => () => { + if (props.moreLink) { + props.moreLink.url = xss.filterUrl(props.moreLink.url) + } + return props.moreLink +} diff --git a/packages/renderless/src/bulletin-board/vue.ts b/packages/renderless/src/bulletin-board/vue.ts new file mode 100644 index 000000000..8572e2bdb --- /dev/null +++ b/packages/renderless/src/bulletin-board/vue.ts @@ -0,0 +1,41 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getRoute, computedDataList, computedMoreLink } from './index' + +export const api = ['state', 'getRoute'] + +export const renderless = (props, { reactive, computed, watch }) => { + const api = {} + const state = reactive({ + actName: props.activeName, + dataList: computed(() => api.computedDataList()), + moreLink: computed(() => api.computedMoreLink()) + }) + + watch( + () => props.activeName, + (value) => { + state.actName = value + }, + { immediate: true } + ) + + Object.assign(api, { + state, + getRoute, + computedDataList: computedDataList({ props, state }), + computedMoreLink: computedMoreLink({ props }) + }) + + return api +} diff --git a/packages/renderless/src/button-group/index.ts b/packages/renderless/src/button-group/index.ts new file mode 100644 index 000000000..38dcba115 --- /dev/null +++ b/packages/renderless/src/button-group/index.ts @@ -0,0 +1,29 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const handleClick = ({ emit, props, state }) => (node) => { + if (!state.disabled) { + state.value = node[props.valueField] + emit('update:modelValue', state.value) + } +} + +export const moreNodeClick = ({ emit, props, state }) => (node) => { + if (!state.disabled) { + const index = state.moreData.indexOf(node) + + state.moreData.splice(index, 1, state.buttonData[state.buttonData.length - 1]) + state.buttonData.splice(state.buttonData.length - 1, 1, node) + state.value = node[props.valueField] + emit('update:modelValue', state.value) + } +} diff --git a/packages/renderless/src/button-group/vue.ts b/packages/renderless/src/button-group/vue.ts new file mode 100644 index 000000000..c85248de3 --- /dev/null +++ b/packages/renderless/src/button-group/vue.ts @@ -0,0 +1,51 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { handleClick } from './index' + +export const api = ['state', 'handleClick', 'moreNodeClick'] + +export const renderless = (props, { computed, reactive, watch, inject }, { emit, parent }) => { + parent.tinyForm = parent.tinyForm || inject('form', null) + + const state = reactive({ + value: props.modelValue, + buttonData: props.data?.slice(0, props.showMore) || [], + moreData: props.data?.slice(props.showMore, props.data.length) || [], + formDisabled: computed(() => (parent.tinyForm || {}).disabled), + disabled: computed(() => props.disabled || state.formDisabled), + attributeValue: computed(() => { + if (state.disabled) { + return { disabled: state.disabled } + } + + return props.plain ? { plain: props.plain } : '' + }) + }) + + watch( + () => props.modelValue, + (value) => { + if (!state.disabled && state.value !== value) { + state.value = value + } + }, + { immediate: true } + ) + + const api = { + state, + handleClick: handleClick({ emit, props, state }) + } + + return api +} diff --git a/packages/renderless/src/button/index.ts b/packages/renderless/src/button/index.ts new file mode 100644 index 000000000..71a38148e --- /dev/null +++ b/packages/renderless/src/button/index.ts @@ -0,0 +1,25 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const handleClick = ({ emit, props, state }) => (event) => { + if (props.nativeType === 'button' && props.resetTime > 0) { + state.disabled = true + + state.timer = setTimeout(() => { + state.disabled = false + }, props.resetTime) + } + + emit('click', event) +} + +export const clearTimer = (state) => () => clearTimeout(state.timer) diff --git a/packages/renderless/src/button/vue.ts b/packages/renderless/src/button/vue.ts new file mode 100644 index 000000000..9ecd31268 --- /dev/null +++ b/packages/renderless/src/button/vue.ts @@ -0,0 +1,45 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { handleClick, clearTimer } from './index' + +export const api = ['state', 'handleClick'] + +export const renderless = (props, { computed, onBeforeUnmount, reactive, watch, inject }, { emit, parent }) => { + parent.tinyForm = parent.tinyForm || inject('form', null) + + const state = reactive({ + timer: null, + disabled: props.disabled, + plain: computed(() => props.plain || (parent.buttonGroup || {}).plain), + formDisabled: computed(() => (parent.tinyForm || {}).disabled), + buttonDisabled: computed(() => props.disabled || state.disabled || (parent.buttonGroup || {}).disabled || state.formDisabled) + }) + + watch( + () => props.disabled, + (value) => { + state.disabled = value + }, + { immediate: true } + ) + + const api = { + state, + clearTimer: clearTimer(state), + handleClick: handleClick({ emit, props, state }) + } + + onBeforeUnmount(api.clearTimer) + + return api +} diff --git a/packages/renderless/src/calendar/index.ts b/packages/renderless/src/calendar/index.ts new file mode 100644 index 000000000..85b855223 --- /dev/null +++ b/packages/renderless/src/calendar/index.ts @@ -0,0 +1,416 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { isLeapYear } from '@opentiny/vue-renderless/common/date' +import { copyArray } from '@opentiny/vue-renderless/common/object' + +/** + * 获取指定年月的总天数 + * @method + * @param {Number} year - 年 + * @param {Number} month - 月 + * @returns {Number} - 总天数 + */ +export const getDays = (year, month) => [31, isLeapYear(year) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31][month - 1] + +/** + * 根据日期获取星期 + * @method + * @param {Number} year - 年 + * @param {Number} month - 月 + * @param {Number} month - 日 + * @returns {Number} - 星期 + */ +export const getWeek = (year, month, day) => new Date(`${year}/${month}/${day}`).getDay() + +/** + * 上月日期 + * @method + * @param {Number} year - 年 + * @param {Number} month - 月 + * @returns {Object} - 年月 + */ +export const lastMonth = (year, month) => { + // 年月转换成整型 + year = Number(year) + month = Number(month) + + if (month === 1) { + year-- + month = 12 + } else { + month-- + } + + return { year, month } +} + +/** + * 下月日期 + * @method + * @param {Number} year - 年 + * @param {Number} month - 月 + * @returns {Object} - 年月 + */ +export const nextMonth = (year, month) => { + // 年月转换成整型 + year = Number(year) + month = Number(month) + + if (month === 12) { + year++ + month = 1 + } else { + month++ + } + + return { year, month } +} + +/** + * 获取日历数据 + * @method + * @param {Number} year - 年 + * @param {Number} month - 月 + * @returns {Object} - 日历 + */ +export const getCalendar = (year, month) => { + if (year && month && month <= 12) { + const days = getDays(year, month) + const firstWeek = getWeek(year, month, 1) + const lastWeek = getWeek(year, month, days) + const last = lastMonth(year, month) + const lastDays = getDays(last.year, last.month) + + let remainDays = 0 + const totalDays = days + firstWeek + 7 - lastWeek - 1 + + // 补齐日期不足6行的(日期固定为6行) + if (totalDays / 7 < 6 && totalDays / 7 >= 5) { + remainDays = 6 * 7 - totalDays + } + + return { + last: { + start: lastDays - (firstWeek - 1), + end: lastDays + }, + current: { + start: 1, + end: days + }, + next: { + start: 1, + end: 7 - lastWeek - 1 + remainDays + } + } + } +} + +/** + * 将一维数组转换成 7*N 的二维数组 + * @method + * @param {Array} array - 一维数据 + * @returns {Array} - 7*N 日历数据 + */ +export const transformArray = (array) => { + const result = [] + let index = 0 + + if (array && array.length) { + const length = array.length / 7 + + for (let i = 0; i < length; i++) { + result[i] = [] + + for (let j = 0; j < 7; j++) { + result[i][j] = array[index++] + } + } + } + + return result +} + +/** + * 时间转换成年月日时分秒 + * @method + * @param {Number | String} time - 时间戳或标准的日期字符 + * @returns {Object} - 年月日时分秒 + */ +export const parseDate = (time) => { + /* istanbul ignore next */ + const date = new Date(time && typeof time === 'number' ? time : 0) + + return { + year: date.getFullYear(), + month: date.getMonth() + 1, + day: date.getDate(), + hours: date.getHours(), + minutes: date.getMinutes(), + seconds: date.getSeconds() + } +} + +export const computedCalendar = ({ state }) => () => { + const calendar = getCalendar(state.activeYear, state.activeMonth) + const result = [] + + if (calendar) { + const { last, current, next } = calendar + + if (last && calendar.last.end >= calendar.last.start) { + for (let i = last.start; i <= last.end; i++) { + result.push({ value: i, isLast: true }) + } + } + /* istanbul ignore else */ + if (current) { + for (let i = current.start; i <= current.end; i++) { + result.push({ value: i }) + } + } + + if (next.end >= next.start) { + for (let i = next.start; i <= next.end; i++) { + result.push({ value: i, isNext: true }) + } + } + } + + return transformArray(result) +} + +export const computedEventList = ({ props, state }) => () => { + let result = [] + + if (props.events && props.events.length) { + result = props.events.filter((item) => { + const { year, month } = parseDate(item.time) + + return Number(state.activeYear) === year && Number(state.activeMonth) === month + }) + } + + return result +} + +export const toggeModel = (state) => (mode) => { + const isYearOrMonth = /^(year|month)$/.test(mode) + + state.displayMode = isYearOrMonth ? mode : state.displayMode === 'year' ? 'month' : 'year' +} + +/** + * 选中月份 + * @private + * @param {Number} month - 月份 + */ +export const selectMonth = (state) => (month) => { + if (month && typeof month === 'number' && month <= 12) { + state.activeMonth = month + } +} + +/** + * 选中日 + * @public + * @param {Number} day + */ +export const selectDay = (state) => (day) => { + if (day && day.value) { + if (day.isLast) { + const { year, month } = lastMonth(state.activeYear, state.activeMonth) + + state.activeMonth = month + state.activeYear = year + } + + if (day.isNext) { + const { year, month } = nextMonth(state.activeYear, state.activeMonth) + + state.activeMonth = month + state.activeYear = year + } + + state.selectedTip = `You selected date: ${state.activeYear}-${state.activeMonth}-${day.value}` + + state.selectedDate = Number(new Date(`${state.activeYear}/${state.activeMonth}/${day.value}`)) + } +} + +/** + * 获取指定日期的事件 + * @private + * @param {Number} day + * @returns {Array} + */ +export const getEventByDay = (state) => (day) => { + let events = [] + + if (state.eventList && state.eventList.length) { + events = copyArray(state.eventList) + .filter(({ time }) => { + const date = new Date(time) + + return date.getDate() === day && date.getFullYear() === Number(state.activeYear) && date.getMonth() + 1 === Number(state.activeMonth) + }) + .map((event) => { + event.parseTime = parseDate(event.time) + return event + }) + } + + return events +} + +/** + * 获取指定月份的事件 + * @private + * @param {Number} month + * @returns {Array} + */ +export const getEventByMonth = ({ props, state }) => (month) => { + let events = [] + + if (props.events) { + events = copyArray(props.events) + .filter(({ time }) => { + const date = new Date(time) + + return date.getFullYear() === Number(state.activeYear) && date.getMonth() + 1 === month + }) + .map((event) => { + event.parseTime = parseDate(event.time) + return event + }) + } + + return events +} + +/** + * 获取时间戳 + * @private + * @param {Number} day + * @returns {Number} + */ +export const getTime = (state) => (day) => Number(new Date(`${state.activeYear}/${state.activeMonth}/${day}`)) + +/** + * 获取年列表(今年上下10年) + * @private + * @returns {Array} + */ +export const getYearList = () => () => { + const date = new Date() + const year = date.getFullYear() + const yesrs = [] + + for (let i = year - 10; i < year + 10; i++) { + yesrs.push(i) + } + + return yesrs +} + +/** + * 是否是今天 + * @private + * @param {Number} day + * @returns {Boolean} + */ +export const isToday = (state) => (day) => { + const date = new Date() + let year = Number(state.activeYear) + let month = Number(state.activeMonth) + + if (day.isLast) { + const lastDate = lastMonth(state.activeYear, state.activeMonth) + + year = lastDate.year + month = lastDate.month + } + + if (day.isNext) { + const nextDate = nextMonth(state.activeYear, state.activeMonth) + + year = nextDate.year + month = nextDate.month + } + + return date.getDate() === day.value && date.getFullYear() === year && date.getMonth() + 1 === month +} + +/** + * 是否是当月 + * @private + * @param {Number} month + * @returns {Boolean} + */ +export const isThisMonth = (state) => (month) => { + const date = new Date() + const year = Number(state.activeYear) + + return date.getMonth() + 1 === month && date.getFullYear() === year +} + +/** + * 生成月份(3*4数组) + * @private + * @param {Number} month + * @returns {Boolean} + */ +export const genMonths = () => { + const result = [] + let index = 1 + + for (let i = 0; i < 3; i++) { + result[i] = [] + + for (let j = 0; j < 4; j++) { + result[i][j] = index++ + } + } + + return result +} + +/** + * 选中当前日期 + * @private + * @returns {Number} + */ +export const toToday = (state) => () => { + const year = new Date().getFullYear() + const month = new Date().getMonth() + 1 + const day = new Date().getDate() + + state.activeMonth = month + state.activeYear = year + + state.selectedTip = `You selected date: ${year}-${month}-${day}` + state.selectedDate = Number(new Date(`${year}/${month}/${day}`)) +} + +/** + * 获取当前日期 + * @private + * @returns {Number} + */ +export const getCurrentDate = () => { + const day = new Date().getDate() + const month = new Date().getMonth() + 1 + const year = new Date().getFullYear() + + return Number(new Date(`${year}/${month}/${day}`)) +} diff --git a/packages/renderless/src/calendar/vue.ts b/packages/renderless/src/calendar/vue.ts new file mode 100644 index 000000000..40bf0e9d5 --- /dev/null +++ b/packages/renderless/src/calendar/vue.ts @@ -0,0 +1,131 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + computedCalendar, + computedEventList, + toggeModel, + selectMonth, + selectDay, + getEventByDay, + getEventByMonth, + getTime, + getYearList, + isToday, + isThisMonth, + genMonths, + toToday, + getCurrentDate +} from './index' + +export const api = [ + 'state', + 'renderProxy', + 'isToday', + 'isThisMonth', + 'getEventByMonth', + 'getEventByDay', + 'selectDay', + 'selectMonth', + 'toggeModel', + 'getTime', + 'genMonths', + 'toToday' +] + +const initState = ({ reactive, props, computed, api }) => { + const state = reactive({ + index: 0, + selectedTip: '', + selectedDate: getCurrentDate(), + showYear: false, + showMonth: false, + activeYear: props.year, + displayMode: props.mode, + activeMonth: props.month, + dropdownYear: computed(() => api.getYearList()), + calendar: computed(() => api.computedCalendar()), + eventList: computed(() => api.computedEventList()) + }) + + return state +} + +const initWatch = ({ watch, props, state, emit }) => { + watch( + () => props.year, + (value, oldValue) => { + if (value !== oldValue) { + state.activeYear = value + } + }, + { immediate: true } + ) + + watch( + () => props.month, + (value, oldValue) => { + if (value !== oldValue) { + state.activeMonth = value + } + }, + { immediate: true } + ) + + watch( + () => state.activeYear, + (value, oldValue) => { + if (value !== oldValue) { + emit('year-change', value, oldValue) + emit('update:modelValue', value, oldValue) // 兼容以前的写法 + } + } + ) + + watch( + () => state.activeMonth, + (value, oldValue) => { + if (value !== oldValue) { + emit('month-change', value, oldValue) + } + } + ) +} + +const initApi = ({ api, state, t, props }) => { + Object.assign(api, { + state, + genMonths, + computedCalendar: computedCalendar({ state }), + computedEventList: computedEventList({ props, state }), + getTime: getTime(state), + isToday: isToday(state), + selectDay: selectDay(state), + getYearList: getYearList(t), + toggeModel: toggeModel(state), + selectMonth: selectMonth(state), + isThisMonth: isThisMonth(state), + getEventByDay: getEventByDay(state), + getEventByMonth: getEventByMonth({ props, state }), + toToday: toToday(state) + }) +} + +export const renderless = (props, { computed, reactive, watch }, { t, emit }) => { + const api = {} + const state = initState({ reactive, props, computed, api }) + + initWatch({ watch, props, state, emit }) + initApi({ api, state, t, props }) + + return api +} diff --git a/packages/renderless/src/card-template/index.ts b/packages/renderless/src/card-template/index.ts new file mode 100644 index 000000000..cb5b24796 --- /dev/null +++ b/packages/renderless/src/card-template/index.ts @@ -0,0 +1,42 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import PopupManager from '@opentiny/vue-renderless/common/deps/popup-manager' + +export const toolClick = (showMoreTools) => (cb) => { + typeof cb === 'function' && cb() + showMoreTools.value = false +} + +export const computedMoreTools = ({ props }) => () => (Array.isArray(props.tools) && props.tools.length > 3 ? props.tools.slice(2) : []) + +export const computedTools = ({ props, state, constants, refs, t }) => () => { + let result = [] + const tools = props.tools + + if (Array.isArray(tools) && tools.length) { + if (tools.length <= 3) { + result = tools + } else { + result = [].concat(tools[0], tools[1], { + icon: constants.MOREICON, + title: t('ui.base.more'), + click() { + state.showMoreTools = !state.showMoreTools + refs.selector.style.zIndex = PopupManager.nextZIndex() + } + }) + } + } + + return result +} diff --git a/packages/renderless/src/card-template/vue.ts b/packages/renderless/src/card-template/vue.ts new file mode 100644 index 000000000..e2be69a84 --- /dev/null +++ b/packages/renderless/src/card-template/vue.ts @@ -0,0 +1,34 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { toolClick, computedTools, computedMoreTools } from './index' + +export const api = ['state', 'toolClick'] + +export const renderless = (props, { computed, reactive }, { t, refs, constants }) => { + const api = { + computedMoreTools: computedMoreTools({ props }) + } + + const state = reactive({ + isEnter: false, + showMoreTools: false, + moreTools: computed(() => api.computedMoreTools(props)), + currentTools: computed(() => api.computedTools()) + }) + + api.state = state + api.computedTools = computedTools({ constants, props, refs, state, t }) + api.toolClick = toolClick(state) + + return api +} diff --git a/packages/renderless/src/carousel-item/index.ts b/packages/renderless/src/carousel-item/index.ts new file mode 100644 index 000000000..e8909a13c --- /dev/null +++ b/packages/renderless/src/carousel-item/index.ts @@ -0,0 +1,90 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +export const processIndex = ({ activeIndex, index, length }) => { + if (activeIndex === 0 && index === length - 1) { + return -1 + } else if (activeIndex === length - 1 && index === 0) { + return length + } else if (index < activeIndex - 1 && activeIndex - index >= length / 2) { + return length + 1 + } else if (index > activeIndex + 1 && index - activeIndex >= length / 2) { + return -2 + } + + return index +} + +export const calculateTranslate = ({ CARD_SCALE, state }) => ({ activeIndex, index, parentWidth }) => { + if (state.inStage) { + return (parentWidth * ((2 - CARD_SCALE) * (index - activeIndex) + 1)) / 4 + } else if (index < activeIndex) { + return (-(1 + CARD_SCALE) * parentWidth) / 4 + } + + return ((3 + CARD_SCALE) * parentWidth) / 4 +} + +export const translateItem = ({ api, CARD_SCALE, parent, state }) => ({ activeIndex, index, oldIndex }) => { + const parentHeight = parent.$parent.$el.offsetHeight + const parentWidth = parent.$parent.$el.offsetWidth + const vnode = parent.$parent + const length = vnode.state.items.length + const { TYPE_CARD, TYPE_VERTICAL } = parent.$constants + + if (vnode.type !== TYPE_CARD && oldIndex !== undefined) { + state.animating = index === activeIndex || index === oldIndex + } + + if (index !== activeIndex && length > 2 && vnode.loop) { + index = api.processIndex({ index, activeIndex, length }) + } + + if (vnode.type === TYPE_CARD) { + state.inStage = Math.round(Math.abs(index - activeIndex)) <= 1 + state.active = index === activeIndex + + state.translate = api.calculateTranslate({ + index, + activeIndex, + parentWidth + }) + + state.scale = state.active ? 1 : CARD_SCALE + } else { + state.active = index === activeIndex + + state.translate = vnode.type === TYPE_VERTICAL ? parentHeight * (index - activeIndex) : parentWidth * (index - activeIndex) + } + + state.ready = true +} + +export const handleItemClick = (parent) => () => { + const vnode = parent.$parent + + if (vnode && vnode.type === parent.$constants.TYPE_CARD) { + const index = vnode.state.items.findIndex((item) => item.$el === parent.$el) + vnode.setActiveItem(index) + } +} + +export const computedTransform = ({ parent, TYPE_VERTICAL }) => (state) => { + const TRANSLATE = + parent.$parent.type === TYPE_VERTICAL ? `translateY(${state.translate}px) scale(${state.scale})` : `translateX(${state.translate}px) scale(${state.scale})` + + return { + msTransform: TRANSLATE, + webkitTransform: TRANSLATE, + transform: TRANSLATE + } +} diff --git a/packages/renderless/src/carousel-item/vue.ts b/packages/renderless/src/carousel-item/vue.ts new file mode 100644 index 000000000..a3772e38d --- /dev/null +++ b/packages/renderless/src/carousel-item/vue.ts @@ -0,0 +1,71 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { processIndex, calculateTranslate, translateItem, handleItemClick, computedTransform } from './index' + +export const api = [ + 'state', + 'hover', + 'translate', + 'scale', + 'active', + 'ready', + 'inStage', + 'animating', + 'isOblique', + 'hasTitle', + 'getTransform', + 'processIndex', + 'calculateTranslate', + 'translateItem', + 'handleItemClick' +] + +export const renderless = (props, { computed, onMounted, onUnmounted, reactive }, { parent, dispatch }) => { + const api = {} + const CARD_SCALE = parent.$constants.CARD_SCALE + const TYPE_VERTICAL = parent.$constants.TYPE_VERTICAL + + const state = reactive({ + scale: 1, + translate: 0, + hover: false, + ready: false, + active: false, + inStage: false, + animating: false, + isOblique: false, + carouselParent: parent.$parent, + hasTitle: computed(() => !!props.title), + getTransform: computed(() => api.computedTransform(state)) + }) + + Object.assign(api, { + state, + processIndex, + handleItemClick: handleItemClick(parent), + computedTransform: computedTransform({ parent, TYPE_VERTICAL }), + calculateTranslate: calculateTranslate({ CARD_SCALE, state }), + translateItem: translateItem({ api, CARD_SCALE, parent, state }) + }) + + onMounted(() => { + dispatch('Carousel', 'updateItems', []) + dispatch('Carousel', 'complete', []) + }) + + onUnmounted(() => { + parent.$parent && parent.$parent.updateItems() + }) + + return api +} diff --git a/packages/renderless/src/carousel/index.ts b/packages/renderless/src/carousel/index.ts new file mode 100644 index 000000000..0f84e0641 --- /dev/null +++ b/packages/renderless/src/carousel/index.ts @@ -0,0 +1,153 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import throttle from '@opentiny/vue-renderless/common/deps/throttle' +import { POSITION } from '@opentiny/vue-renderless/common' + +export const handleMouseEnter = ({ api, state }) => () => { + state.hover = true + api.pauseTimer() +} + +export const handleMouseLeave = ({ api, state }) => () => { + state.hover = false + api.startTimer() +} + +export const itemInStage = (state) => ({ item, index }) => { + const length = state.items.length + const arr = state.items + + if ((index === length - 1 && item.inStage && arr[0].active) || (item.inStage && arr[index + 1] && arr[index + 1].active)) { + return POSITION.Left + } else if ((index === 0 && item.inStage && arr[length - 1].active) || (item.inStage && arr[index - 1] && arr[index - 1].active)) { + return POSITION.Right + } + + return false +} + +export const handleButtonEnter = ({ api, state }) => (arrow) => { + state.items.forEach((item, index) => { + if (arrow === api.itemInStage({ item, index })) { + item.hover = true + } + }) +} + +export const handleButtonLeave = (state) => () => { + state.items.forEach((item) => { + item.hover = false + }) +} + +export const resetItemPosition = (state) => (oldIndex) => { + if (state.completed) { + state.items.forEach((item, index) => { + item.translateItem({ activeIndex: state.activeIndex, index, oldIndex }) + }) + } +} + +export const playSlides = ({ props, state }) => () => { + if (state.activeIndex < state.items.length - 1) { + state.activeIndex++ + } else if (props.loop) { + state.activeIndex = 0 + } +} + +export const pauseTimer = (state) => () => clearInterval(state.timer) + +export const startTimer = ({ api, props, state }) => () => { + if (props.interval <= 0 || !props.autoplay) { + return + } + + state.timer = setInterval(api.playSlides, props.interval) +} + +export const setActiveItem = ({ api, props, state }) => (index) => { + if (typeof index === 'string') { + const filteredItems = state.items.filter((item) => item.name === index) + + if (filteredItems.length > 0) { + index = state.items.indexOf(filteredItems[0]) + } + } + + index = Number(index) + + if (isNaN(index) || index !== Math.floor(index)) { + return + } + + const length = state.items.length + const oldIndex = state.activeIndex + + if (index < 0) { + state.activeIndex = props.loop ? length - 1 : 0 + } else if (index >= length) { + state.activeIndex = props.loop ? 0 : length - 1 + } else { + state.activeIndex = index + } + + if (oldIndex === state.activeIndex) { + api.resetItemPosition(oldIndex) + } +} + +export const prev = ({ api, state }) => () => api.setActiveItem(state.activeIndex - 1) + +export const next = ({ api, state }) => () => api.setActiveItem(state.activeIndex + 1) + +export const handleIndicatorClick = (state) => (index) => { + state.activeIndex = index +} + +export const handleIndicatorHover = ({ props, state }) => (index) => { + if (props.trigger === 'hover' && index !== state.activeIndex) { + state.activeIndex = index + } +} + +export const watchItems = ({ props, api }) => (value) => { + if (value.length) { + api.setActiveItem(props.initialIndex) + } +} + +export const watchActiveIndex = ({ emit, api }) => ({ value, oldValue }) => { + api.resetItemPosition(oldValue) + emit('change', value, oldValue) +} + +export const watchAutoplay = (api) => (value) => (value ? api.startTimer() : api.pauseTimer()) + +export const throttledArrowClick = (api) => throttle(300, true, (index) => api.setActiveItem(index)) + +export const throttledIndicatorHover = (api) => throttle(300, (index) => api.handleIndicatorHover(index)) + +export const computedHasLable = (items) => items.some((item) => item.label.toString().length > 0) + +export const onComplete = ({ count, emit, props, state }) => (total) => { + if (count++ === total) { + state.completed = true + + if (props.initialIndex < state.items.length && props.initialIndex >= 0) { + state.activeIndex = props.initialIndex + } + + emit('complete') + } +} diff --git a/packages/renderless/src/carousel/vue.ts b/packages/renderless/src/carousel/vue.ts new file mode 100644 index 000000000..3d52006d1 --- /dev/null +++ b/packages/renderless/src/carousel/vue.ts @@ -0,0 +1,195 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + onComplete, + handleMouseEnter, + handleMouseLeave, + itemInStage, + handleButtonEnter, + handleButtonLeave, + resetItemPosition, + playSlides, + pauseTimer, + startTimer, + setActiveItem, + prev, + next, + handleIndicatorClick, + handleIndicatorHover, + watchItems, + watchActiveIndex, + watchAutoplay, + throttledArrowClick, + throttledIndicatorHover, + computedHasLable +} from './index' +import { addResizeListener, removeResizeListener } from '@opentiny/vue-renderless/common/deps/resize-event' + +export const api = [ + 'state', + 'items', + 'activeIndex', + 'containerWidth', + 'hover', + 'hasLabel', + 'onComplete', + 'handleMouseEnter', + 'handleMouseLeave', + 'itemInStage', + 'handleButtonEnter', + 'handleButtonLeave', + 'updateItems', + 'resetItemPosition', + 'playSlides', + 'pauseTimer', + 'startTimer', + 'setActiveItem', + 'prev', + 'next', + 'handleIndicatorClick', + 'handleIndicatorHover', + 'throttledArrowClick', + 'throttledIndicatorHover' +] + +const initState = ({ reactive, computed, api }) => { + const state = reactive({ + items: [], + timer: null, + hover: false, + activeIndex: -1, + completed: false, + containerWidth: 0, + hasLabel: computed(() => api.computedHasLable(state.items)) + }) + + return state +} + +const initApi = ({ api, state, props, emit }) => { + Object.assign(api, { + state, + computedHasLable, + playSlides: playSlides({ props, state }), + pauseTimer: pauseTimer(state), + onComplete: onComplete({ count: 0, emit, props, state }), + itemInStage: itemInStage(state), + resetItemPosition: resetItemPosition(state), + handleButtonLeave: handleButtonLeave(state), + handleIndicatorClick: handleIndicatorClick(state), + handleIndicatorHover: handleIndicatorHover({ props, state }), + watchItems: watchItems({ api, props }), + watchActiveIndex: watchActiveIndex({ api, emit }), + watchAutoplay: watchAutoplay(api), + startTimer: startTimer({ api, props, state }), + prev: prev({ api, state }), + next: next({ api, state }), + setActiveItem: setActiveItem({ api, props, state }), + handleMouseEnter: handleMouseEnter({ api, state }), + handleMouseLeave: handleMouseLeave({ api, state }), + handleButtonEnter: handleButtonEnter({ api, state }), + throttledArrowClick: throttledArrowClick(api), + throttledIndicatorHover: throttledIndicatorHover(api) + }) +} + +const initWatch = ({ watch, props, api, state }) => { + watch(() => props.autoplay, api.watchAutoplay) + + watch( + () => props.loop, + () => { + api.setActiveItem(state.activeIndex) + } + ) +} + +export const useItems = ({ api, onMounted, state, watch, constants, childrenHandler }) => { + const updateItems = () => { + const $children = [] + + childrenHandler(({ options, vm }) => { + options.name === constants.CHILD_NAME && $children.push(vm) + }) + + state.items = $children + } + + watch( + () => state.items, + (value) => state.completed && api.watchItems(value) + ) + + onMounted(updateItems) + + return { + updateItems + } +} + +export const useActiveIndex = ({ api, state, watch }) => { + watch( + () => state.activeIndex, + (value, oldValue) => api.watchActiveIndex({ value, oldValue }), + { immediate: true } + ) +} + +export const useResizeListener = ({ api, onBeforeUnmount, onMounted, parent }) => { + onMounted(() => { + addResizeListener(parent.$el, api.resetItemPosition) + }) + + onBeforeUnmount(() => { + if (parent.$el) { + removeResizeListener(parent.$el, api.resetItemPosition) + } + }) +} + +export const renderless = (props, { computed, onMounted, onBeforeUnmount, reactive, watch }, { vm, parent, constants, emit, childrenHandler }) => { + const api = {} + const state = initState({ reactive, computed, api }) + + initApi({ api, state, props, emit }) + + const { updateItems } = useItems({ + api, + vm, + onMounted, + state, + watch, + constants, + childrenHandler + }) + + api.updateItems = updateItems + + useActiveIndex({ api, parent, props, state, watch }) + useResizeListener({ api, onBeforeUnmount, onMounted, parent }) + + initWatch({ watch, props, api, state }) + + onMounted(() => { + api.startTimer() + api.onComplete(state.items.length) + }) + + parent.$on('updateItems', api.updateItems) + + parent.$on('complete', () => { + api.onComplete(state.items.length) + }) + + return api +} diff --git a/packages/renderless/src/cascader-menu/index.ts b/packages/renderless/src/cascader-menu/index.ts new file mode 100644 index 000000000..35c94b8bc --- /dev/null +++ b/packages/renderless/src/cascader-menu/index.ts @@ -0,0 +1,48 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const handleExpand = (state) => (e) => (state.activeNode = e.target) + +export const handleMouseMove = ({ api, parent, refs, state, svg }) => (e) => { + const { hoverZone } = refs + + if (!state.activeNode || !hoverZone) { + return + } + + if (state.activeNode.contains(e.target)) { + clearTimeout(state.hoverTimer) + + const { left } = refs.cascaderMenu.$parent.$el.getBoundingClientRect() + const startX = e.clientX - left + const { offsetWidth, offsetHeight } = refs.cascaderMenu.$parent.$el + const top = state.activeNode.offsetTop + const bottom = top + state.activeNode.offsetHeight + + hoverZone.innerHTML = ` + ${svg}${startX} ${top} L${offsetWidth} 0 V${top} Z" /> + ${svg}${startX} ${bottom} L${offsetWidth} ${offsetHeight} V${bottom} Z" /> + ` + } else if (!state.hoverTimer) { + state.hoverTimer = setTimeout(api.clearHoverZone, parent.state.config.hoverThreshold) + } +} + +export const clearHoverZone = (refs) => () => { + const { hoverZone } = refs + + if (!hoverZone) { + return + } + + hoverZone.innerHTML = '' +} diff --git a/packages/renderless/src/cascader-menu/vue.ts b/packages/renderless/src/cascader-menu/vue.ts new file mode 100644 index 000000000..3cdddb19f --- /dev/null +++ b/packages/renderless/src/cascader-menu/vue.ts @@ -0,0 +1,38 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { handleExpand, handleMouseMove, clearHoverZone } from './index' +import { CASCADER } from '@opentiny/vue-renderless/common' +import { random } from '@opentiny/vue-renderless/common/string' + +export const api = ['state', 'handleMouseMove', 'handleExpand'] + +export const renderless = (props, { computed, reactive }, { vm, parent }) => { + const refs = vm.$refs + const api = {} + const state = reactive({ + activeNode: null, + hoverTimer: null, + id: Math.floor(random() * 10000), + isEmpty: computed(() => !props.nodes.length), + menuId: computed(() => `${CASCADER.MenuConnector}${state.id}-${props.index}`) + }) + + Object.assign(api, { + state, + clearHoverZone: clearHoverZone(refs), + handleExpand: handleExpand(state), + handleMouseMove: handleMouseMove({ api, parent, refs, state, svg: CASCADER.SvgStr }) + }) + + return api +} diff --git a/packages/renderless/src/cascader-node/index.ts b/packages/renderless/src/cascader-node/index.ts new file mode 100644 index 000000000..83e997268 --- /dev/null +++ b/packages/renderless/src/cascader-node/index.ts @@ -0,0 +1,58 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const comptCheckPath = ({ api, parent, state }) => () => { + if (!state.config.checkStrictly) { + return false + } + + return parent.state.checkedNodePaths.some((checkedPath) => api.isInPath(checkedPath)) +} + +export const handleExpand = ({ api, parent, props, state }) => () => { + const { multiple, checkStrictly } = state.config + + if ((!checkStrictly && state.isDisabled) || props.node.loading) { + return + } + + if (state.config.lazy && !props.node.loaded) { + parent.lazyLoad(props.node, () => { + if (!state.isLeaf) { + api.handleExpand() + } + + if (multiple) { + const checked = state.isLeaf ? props.node.checked : false + api.handleMultiCheckChange(checked) + } + }) + } else { + parent.handleExpand(props.node) + } +} + +export const handleCheckChange = ({ api, parent, dispatch, state }) => () => { + parent.handleCheckChange(state.value) + api.handleExpand() + dispatch('TinyCascaderPanel', 'close', false) +} + +export const handleMultiCheckChange = ({ parent, props }) => (checked) => { + props.node.doCheck(checked) + parent.calculateMultiCheckedValue() +} + +export const isInPath = (props) => (pathNodes) => { + const selectedPathNode = pathNodes[props.node.level - 1] || {} + return selectedPathNode.uid === props.node.uid +} diff --git a/packages/renderless/src/cascader-node/vue.ts b/packages/renderless/src/cascader-node/vue.ts new file mode 100644 index 000000000..f8e33c3f4 --- /dev/null +++ b/packages/renderless/src/cascader-node/vue.ts @@ -0,0 +1,41 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { comptCheckPath, handleExpand, isInPath, handleCheckChange, handleMultiCheckChange } from './index' + +export const api = ['state', 'handleMultiCheckChange', 'handleCheckChange', 'handleExpand'] + +export const renderless = (props, { computed, reactive, inject }, { dispatch }) => { + const parent = inject('panel') + const api = {} + const state = reactive({ + config: computed(() => parent.state.config), + isLeaf: computed(() => props.node.isLeaf), + isDisabled: computed(() => props.node.isDisabled), + checkedValue: computed(() => parent.state.checkedValue), + isChecked: computed(() => props.node.isSameNode(state.checkedValue)), + inActivePath: computed(() => api.isInPath(parent.state.activePath)), + inCheckedPath: computed(() => api.comptCheckPath()), + value: computed(() => props.node.getValueByOption()) + }) + + Object.assign(api, { + state, + isInPath: isInPath(props), + handleExpand: handleExpand({ api, props, parent, state }), + comptCheckPath: comptCheckPath({ api, parent, state }), + handleCheckChange: handleCheckChange({ api, parent, dispatch, state }), + handleMultiCheckChange: handleMultiCheckChange({ parent, props }) + }) + + return api +} diff --git a/packages/renderless/src/cascader-panel/index.ts b/packages/renderless/src/cascader-panel/index.ts new file mode 100644 index 000000000..4e291e38f --- /dev/null +++ b/packages/renderless/src/cascader-panel/index.ts @@ -0,0 +1,341 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { isNull } from '@opentiny/vue-renderless/common/type' +import { isEqual } from '@opentiny/vue-renderless/common/object' +import { isEmpty } from '@opentiny/vue-renderless/cascader' +import { KEY_CODE, CASCADER } from '@opentiny/vue-renderless/common' + +export const watchCheckedValue = ({ api, emit, props, state }) => (value) => { + if (!isEqual(value, props.modelValue)) { + state.checkStrictly && api.calculateCheckedNodePaths() + + emit('update:modelValue', value) + emit('change', value) + } +} + +export const initStore = ({ api, props, state, Store }) => () => { + if (state.config.lazy && isEmpty(props.options)) { + api.lazyLoad() + } else { + state.store = new Store(props.options, state.config) + state.menus = [state.store.getNodes()] + + api.syncMenuState() + } +} + +export const syncCheckedValue = ({ api, props, state }) => () => { + if (!isEqual(props.modelValue, state.checkedValue)) { + state.checkedValue = props.modelValue + api.syncMenuState() + } +} + +export const syncMenuState = ({ api, nextTick, state }) => () => { + api.syncActivePath() + + state.multiple && api.syncMultiCheckState() + state.checkStrictly && api.calculateCheckedNodePaths() + + nextTick(() => api.scrollIntoView) +} + +export const syncMultiCheckState = ({ api, state }) => () => { + const nodes = api.getFlattedNodes(state.leafOnly) + + nodes.forEach((node) => { + node.syncCheckState(state.checkedValue) + }) +} + +export const syncActivePath = ({ api, state }) => () => { + if (!isEmpty(state.activePath)) { + const nodes = state.activePath.map((node) => api.getNodeByValue(node.getValue())) + + if (isNull(nodes[0])) { + state.activePath = [] + } else { + api.expandNodes(nodes) + } + } else if (!isEmpty(state.checkedValue)) { + const value = state.multiple ? state.checkedValue[0] : state.checkedValue + const checkedNode = api.getNodeByValue(value) || {} + const nodes = (checkedNode.pathNodes || []).slice(0, -1) + + api.expandNodes(nodes) + } else { + state.activePath = [] + state.menus = [state.store.getNodes()] + } +} + +export const expandNodes = (api) => (nodes) => nodes.forEach((node) => api.handleExpand(node, true)) + +export const coerceTruthyValueToArray = (val) => { + if (Array.isArray(val)) { + return val + } else if (val) { + return [val] + } + + return [] +} + +export const calculateCheckedNodePaths = ({ api, state }) => () => { + const checkedValues = state.multiple ? coerceTruthyValueToArray(state.checkedValue) : [state.checkedValue] + + state.checkedNodePaths = checkedValues.map((v) => { + const checkedNode = api.getNodeByValue(v) + return checkedNode ? checkedNode.pathNodes : [] + }) +} + +export const focusNode = (api) => (el) => { + if (!el) { + return + } + + el.focus() + !api.isLeaf(el) && el.click() +} + +export const getMenuIndex = () => (el) => { + if (!el) { + return + } + + const pieces = el.id.split('-') + return Number(pieces[pieces.length - 2]) +} + +export const checkNode = (api) => (el) => { + if (!el) { + return + } + + const input = el.querySelector('input') + + if (input) { + input.click() + } else if (api.isLeaf(el)) { + el.click() + } +} + +export const handleKeyDown = ({ api, emit, menus }) => (event) => { + const { target, keyCode } = event + + if (keyCode === KEY_CODE.ArrowUp) { + const prev = api.getSibling(target, -1) + focusNode(prev) + } else if (keyCode === KEY_CODE.ArrowDown) { + const next = api.getSibling(target, 1) + focusNode(next) + } else if (keyCode === KEY_CODE.ArrowLeft) { + const preMenu = menus[getMenuIndex(target) - 1] + + if (preMenu) { + const expandedNode = preMenu.$el.querySelector(CASCADER.CascaderNodeExpand) + focusNode(expandedNode) + } + } else if (keyCode === KEY_CODE.ArrowRight) { + const nextMenu = menus[getMenuIndex(target) + 1] + + if (nextMenu) { + const firstNode = nextMenu.$el.querySelector(CASCADER.CascaderNodeTab) + focusNode(firstNode) + } + } else if (keyCode === KEY_CODE.Enter) { + checkNode(target) + } else if (~[KEY_CODE.Escape, KEY_CODE.Tab].indexOf(keyCode)) { + emit('close') + } +} + +export const handleExpand = ({ emit, state }) => (node, silent) => { + const { level } = node + const path = state.activePath.slice(0, level - 1) + const menus = state.menus.slice(0, level) + + if (!node.isLeaf) { + path.push(node) + menus.push(node.children) + } + + state.activePath = path + state.menus = menus + + if (!silent) { + const pathValues = path.map((node) => node.getValue()) + + emit('active-item-change', pathValues) + emit('expand-change', pathValues) + } +} + +export const handleCheckChange = (state) => (value) => { + state.checkedValue = value +} + +export const lazyLoad = ({ api, $parent, state, Store }) => (node, onFullfiled) => { + if (!node) { + node = node || { root: true, level: 0 } + state.store = new Store([], state.config) + state.menus = [state.store.getNodes()] + } + + node.loading = true + + const afterLoad = (dataList) => { + const parent = node.root ? null : node + dataList && dataList.length && state.store.appendNodes(dataList, parent) + + node.loading = false + node.loaded = true + + if (Array.isArray(state.checkedValue)) { + const nodeValue = state.checkedValue[state.loadCount++] + const valueKey = state.config.value + const leafKey = state.config.leaf + + if (Array.isArray(dataList) && dataList.filter((item) => item[valueKey] === nodeValue).length > 0) { + const checkedNode = state.store.getNodeByValue(nodeValue) + + if (!checkedNode.data[leafKey]) { + api.lazyLoad(checkedNode, () => { + api.handleExpand(checkedNode) + }) + } + + if ($parent.computePresentText && state.loadCount === state.checkedValue.length) { + $parent.computePresentText() + } + } + } + + onFullfiled && onFullfiled(dataList) + } + + state.config.lazyLoad(node, afterLoad) +} + +export const calculateMultiCheckedValue = ({ api, state }) => () => { + state.checkedValue = api.getCheckedNodes(state.leafOnly).map((node) => node.getValueByOption()) +} + +export const scrollIntoView = ({ menus }) => () => { + menus.forEach((menu) => { + const menuElement = menu.$el + + if (menuElement) { + const container = menuElement.querySelector(CASCADER.ScrollWrap) + const activeNode = menuElement.querySelector(CASCADER.CascaderActice) || menuElement.querySelector(CASCADER.ActivePath) + + scrollIntoView(container, activeNode) + } + }) +} + +export const getNodeByValue = (state) => (val) => state.store.getNodeByValue(val) + +export const getFlattedNodes = (state) => (leafOnly) => { + const cached = !state.config.lazy + return state.store.getFlattedNodes(leafOnly, cached) +} + +export const getCheckedNodes = ({ api, state }) => (leafOnly, cascaderCheckedValue) => { + const isCascaderChecked = (str, checkedValue) => { + let flag = true + + if (!state.multiple || !checkedValue) { + return flag + } + + flag = false + + if (!Array.isArray(checkedValue)) { + return flag + } + for (let i = 0; i < checkedValue.length; i++) { + if (Array.isArray(checkedValue[i]) && checkedValue[i].length) { + flag = checkedValue[i][checkedValue[i].length - 1] === str + } + + if (flag) { + break + } + } + return flag + } + + if (state.multiple) { + const nodes = api.getFlattedNodes(leafOnly) + return nodes.filter((node) => node.checked && isCascaderChecked(node.value, cascaderCheckedValue)) + } + + return isEmpty(state.checkedValue) ? [] : [api.getNodeByValue(state.checkedValue)] +} + +export const clearCheckedNodes = ({ api, state }) => () => { + const { multiple, emitPath } = state.config + + if (multiple) { + api + .getCheckedNodes(state.leafOnly) + .filter((node) => !node.isDisabled) + .forEach((node) => node.doCheck(false)) + + api.calculateMultiCheckedValue() + } else { + state.checkedValue = emitPath ? [] : null + } +} + +export const isLeaf = () => (el) => !el.getAttribute('data-owns') + +export const getSibling = (el, distance) => { + const { parentNode } = el + + if (parentNode) { + const siblings = parentNode.querySelectorAll(CASCADER.CascaderNodeTab) + const index = Array.prototype.indexOf.call(siblings, el) + + return siblings[index + distance] || null + } + + return null +} + +export const valueEquals = (a, b) => { + if (a === b) { + return true + } + if (!(Array.isArray(b))) { + return false + } + if (!(Array.isArray(a))) { + return false + } + if (a.length !== b.length) { + return false + } + + for (let i = 0, len = a.length; i !== len; ++i) { + if (a[i] !== b[i]) { + return false + } + } + + return true +} diff --git a/packages/renderless/src/cascader-panel/node.ts b/packages/renderless/src/cascader-panel/node.ts new file mode 100644 index 000000000..78a989c53 --- /dev/null +++ b/packages/renderless/src/cascader-panel/node.ts @@ -0,0 +1,174 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { isEqual } from '@opentiny/vue-renderless/common/object' +import { capitalize } from '@opentiny/vue-renderless/common/string' +import { isNull } from '@opentiny/vue-renderless/common/type' + +let uid = 0 + +export default class Node { + constructor(data, config, parentNode) { + Object.assign(this, { data, config, uid: uid++ }) + + this.parent = parentNode || null + this.level = !this.parent ? 1 : this.parent.level + 1 + + this.initState() + this.initChildren() + } + + initState() { + const { value, label } = this.config + + this.value = this.data[value] + this.label = this.data[label] + this.pathNodes = this.calculatePathNodes() + this.path = this.pathNodes.map((node) => node.value) + this.pathLabels = this.pathNodes.map((node) => node.label) + + // lazy load + Object.assign(this, { loading: false, loaded: false }) + } + + initChildren() { + const { config } = this + const childrenKey = config.children + const childrenData = this.data[childrenKey] + + this.hasChildren = Array.isArray(childrenData) + this.children = (childrenData || []).map((child) => new Node(child, config, this)) + } + + get isLeaf() { + const { data, loaded, hasChildren, children, config } = this + const { lazy, leaf } = config + + if (lazy) { + const leafValue = data[leaf] + const isLeaf = !isNull(leafValue) ? leafValue : loaded ? !children.length : false + + this.hasChildren = !isLeaf + + return isLeaf + } + + return !hasChildren + } + + get isDisabled() { + const { data, parent, config } = this + const { checkStrictly, disabled } = config + const disabledKey = disabled + + return data[disabledKey] || (!checkStrictly && parent && parent.isDisabled) + } + + calculatePathNodes() { + const nodes = [this] + let parentNode = this.parent + + while (parentNode) { + nodes.unshift(parentNode) + parentNode = parentNode.parent + } + + return nodes + } + + getValue() { + return this.value + } + + getPath() { + return this.path + } + + getValueByOption() { + return this.config.emitPath ? this.getPath() : this.getValue() + } + + getText(allLevels, separator) { + return allLevels ? this.pathLabels.join(separator) : this.label + } + + isSameNode(checkedValue) { + const value = this.getValueByOption() + const isMultiple = this.config.multiple && Array.isArray(checkedValue) + + return isMultiple ? checkedValue.some((val) => isEqual(val, value)) : isEqual(checkedValue, value) + } + + emit(eventName, ...args) { + const { parent } = this + const handlerName = `onChild${capitalize(eventName)}` + + if (parent) { + parent[handlerName] && parent[handlerName](...args) + parent.emit(eventName, ...args) + } + } + + broadcast(eventName, ...args) { + const handlerName = `onParent${capitalize(eventName)}` + + this.children.forEach((child) => { + if (child) { + child.broadcast(eventName, ...args) + child[handlerName] && child[handlerName](...args) + } + }) + } + + onParentCheck(checked) { + !this.isDisabled && this.setCheckState(checked) + } + + onChildCheck() { + const { children } = this + const validChildren = children.filter((child) => !child.isDisabled) + const checked = validChildren.length ? validChildren.every((child) => child.checked) : false + + this.setCheckState(checked) + } + + syncCheckState(checkedValue) { + const value = this.getValueByOption() + const checked = this.isSameNode(checkedValue, value) + + this.doCheck(checked) + } + + setCheckState(checked) { + const totalNum = this.children.length + + const checkedNum = this.children.reduce((prevChild, nextChild) => { + const num = nextChild.checked ? 1 : nextChild.indeterminate ? 0.5 : 0 + return prevChild + num + }, 0) + + this.checked = checked + this.indeterminate = checkedNum !== totalNum && checkedNum > 0 + } + + doCheck(isChecked) { + if (this.checked !== isChecked) { + if (this.config.checkStrictly) { + this.checked = isChecked + } else { + this.broadcast('check', isChecked) + this.setCheckState(isChecked) + this.emit('check') + } + } + } +} diff --git a/packages/renderless/src/cascader-panel/store.ts b/packages/renderless/src/cascader-panel/store.ts new file mode 100644 index 000000000..e5962349e --- /dev/null +++ b/packages/renderless/src/cascader-panel/store.ts @@ -0,0 +1,75 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import Node from './node' +import { valueEquals, coerceTruthyValueToArray as toArray } from './index' + +const flatNodes = (data, leafOnly) => + data.reduce((prev, node) => { + if (node.isLeaf) { + prev.push(node) + } else { + !leafOnly && prev.push(node) + prev = prev.concat(flatNodes(node.children, leafOnly)) + } + + return prev + }, []) + +export default class Store { + constructor(data, config) { + this.config = config + this.initNodes(data) + } + + getNodes() { + return this.nodes + } + + initNodes(data) { + data = toArray(data) + + this.nodes = data.map((nodeData) => new Node(nodeData, this.config)) + this.flattedNodes = this.getFlattedNodes(false, false) + this.leafNodes = this.getFlattedNodes(true, false) + } + + appendNode(nodeData, parentNode) { + const { config, nodes } = this + const node = new Node(nodeData, config, parentNode) + const children = parentNode ? parentNode.children : nodes + + children.push(node) + } + + appendNodes(nodeDataList, parentNode) { + nodeDataList = toArray(nodeDataList) + nodeDataList.forEach((nodeData) => this.appendNode(nodeData, parentNode)) + } + + getFlattedNodes(leafOnly, cached = true) { + const { leafNodes, flattedNodes } = this + const cachedNodes = leafOnly ? leafNodes : flattedNodes + return cached ? cachedNodes : flatNodes(this.nodes, leafOnly) + } + + getNodeByValue(value) { + if (value) { + const lazy = !this.config.lazy + const nodes = this.getFlattedNodes(false, lazy).filter((node) => valueEquals(node.path, value) || node.value === value) + + return nodes && nodes.length ? nodes[0] : null + } + + return null + } +} diff --git a/packages/renderless/src/cascader-panel/vue.ts b/packages/renderless/src/cascader-panel/vue.ts new file mode 100644 index 000000000..6fed2d38f --- /dev/null +++ b/packages/renderless/src/cascader-panel/vue.ts @@ -0,0 +1,161 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + initStore, + checkNode, + getMenuIndex, + isLeaf, + focusNode, + getCheckedNodes, + clearCheckedNodes, + getFlattedNodes, + getNodeByValue, + scrollIntoView, + calculateMultiCheckedValue, + lazyLoad, + handleCheckChange, + handleExpand, + handleKeyDown, + calculateCheckedNodePaths, + expandNodes, + syncActivePath, + watchCheckedValue, + syncCheckedValue, + syncMenuState, + syncMultiCheckState +} from './index' +import { merge } from '@opentiny/vue-renderless/common/object' +import { isEmpty } from '@opentiny/vue-renderless/cascader' +import Store from './store.js' + +export const api = [ + 'state', + 'handleKeyDown', + 'getCheckedNodes', + 'clearCheckedNodes', + 'scrollIntoView', + 'handleExpand', + 'handleCheckChange', + 'getNodeByValue', + 'calculateMultiCheckedValue', + 'lazyLoad', + 'getFlattedNodes' +] + +const initDefaultProps = () => ({ + expandTrigger: 'click', + multiple: false, + checkStrictly: false, + emitPath: true, + lazy: false, + lazyLoad: () => undefined, + value: 'value', + label: 'label', + children: 'children', + leaf: 'leaf', + disabled: 'disabled', + hoverThreshold: 500 +}) + +const initState = ({ reactive, props, computed, parent, slots }) => { + const DefaultProps = initDefaultProps() + + const state = reactive({ + checkedValue: null, + checkedNodePaths: [], + store: [], + menus: [], + activePath: [], + loadCount: 0, + config: computed(() => merge({ ...DefaultProps }, props.props || {})), + multiple: computed(() => state.config.multiple), + checkStrictly: computed(() => state.config.checkStrictly), + leafOnly: computed(() => !state.checkStrictly), + isHoverMenu: computed(() => state.config.expandTrigger === 'hover'), + renderLabelFn: computed( + () => props.renderLabel || slots.default || (parent.$parent?.$options.componentName === 'TinyCascader' && parent.$parent.$scopedSlots.default) + ) + }) + + return state +} + +const initApi = ({ api, state, menus, props, nextTick, parent, emit }) => { + Object.assign(api, { + state, + isLeaf: isLeaf(), + getMenuIndex: getMenuIndex(), + getNodeByValue: getNodeByValue(state), + getFlattedNodes: getFlattedNodes(state), + handleCheckChange: handleCheckChange(state), + scrollIntoView: scrollIntoView({ menus }), + syncActivePath: syncActivePath({ api, state }), + initStore: initStore({ api, props, state, Store }), + syncMenuState: syncMenuState({ api, nextTick, state }), + syncMultiCheckState: syncMultiCheckState({ api, state }), + calculateCheckedNodePaths: calculateCheckedNodePaths({ api, state }), + lazyLoad: lazyLoad({ api, $parent: parent, state, Store }), + syncCheckedValue: syncCheckedValue({ api, props, state }), + focusNode: focusNode(api), + checkNode: checkNode(api), + expandNodes: expandNodes(api), + handleExpand: handleExpand({ emit, state }), + getCheckedNodes: getCheckedNodes({ api, state }), + clearCheckedNodes: clearCheckedNodes({ api, state }), + calculateMultiCheckedValue: calculateMultiCheckedValue({ api, state }), + watchCheckedValue: watchCheckedValue({ api, emit, props, state }), + handleKeyDown: handleKeyDown({ api, emit, menus }) + }) +} + +const initWatch = ({ watch, state, props, api }) => { + watch( + () => props.options, + () => api.initStore(), + { deep: true, immediate: true } + ) + + watch( + () => props.modelValue, + () => { + api.syncCheckedValue() + state.checkStrictly && api.calculateCheckedNodePaths() + } + ) + + watch( + () => state.checkedValue, + (value) => { + api.watchCheckedValue(value) + }, + { deep: true } + ) +} + +export const renderless = (props, { computed, onMounted, reactive, watch }, { nextTick, emit, parent, childrenHandler, slots }) => { + const api = {} + const menus = [] + const state = initState({ reactive, props, computed, parent, slots }) + + childrenHandler(({ vm }) => { + menus.push(vm) + }) + + initApi({ api, state, menus, props, nextTick, parent, emit }) + + initWatch({ watch, state, props, api }) + + onMounted(() => !isEmpty(props.modelValue) && api.syncCheckedValue()) + + return api +} diff --git a/packages/renderless/src/cascader/index.ts b/packages/renderless/src/cascader/index.ts new file mode 100644 index 000000000..38a263e2f --- /dev/null +++ b/packages/renderless/src/cascader/index.ts @@ -0,0 +1,474 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import browser from '@opentiny/vue-renderless/common/browser' +import { isNull } from '@opentiny/vue-renderless/common/type' +import debounce from '@opentiny/vue-renderless/common/deps/debounce' +import { isEqual } from '@opentiny/vue-renderless/common/object' +import { addResizeListener } from '@opentiny/vue-renderless/common/deps/resize-event' +import { KEY_CODE, CASCADER } from '@opentiny/vue-renderless/common' + +const initMigratingProps = () => ({ + expandTrigger: { newProp: CASCADER.PropsExpandTri, type: String }, + changeOnSelect: { newProp: CASCADER.PropsCheckStric, type: Boolean }, + hoverThreshold: { newProp: CASCADER.PropsHover, type: Number } +}) + +const kebabCase = (str) => { + const hyphenateRE = /([^-])([A-Z])/g + + return str.replace(hyphenateRE, '$1-$2').replace(hyphenateRE, '$1-$2').toLowerCase() +} + +export const getConfig = ({ parent, props }) => () => { + const config = props.props || {} + const { $attrs } = parent + const migratingProps = initMigratingProps() + + Object.keys(migratingProps).forEach((oldProp) => { + const { newProp, type } = migratingProps[oldProp] + let oldValue = $attrs[oldProp] || $attrs[kebabCase(oldProp)] + + if (isNull(config[newProp]) && !isNull(oldProp)) { + if (oldValue === '' && type === Boolean) { + oldValue = true + } + + config[newProp] = oldValue + } + }) + + return config +} + +export const computClearVisible = ({ props, state }) => () => { + if (!props.clearable || state.isDisabled || state.filtering || !state.inputHover) { + return false + } + + return state.multiple ? !!state.checkedNodes.filter((node) => !node.isDisabled).length : !!state.presentText +} + +export const computePresentContent = ({ api, state }) => () => { + if (state.config.multiple) { + api.computePresentTags() + state.presentText = state.presentTags.length ? ' ' : null + } else { + api.computePresentText() + } +} + +export const watchValue = ({ api, state }) => (value) => { + if (!isEqual(value, state.checkedValue)) { + state.checkedValue = value + api.computePresentContent() + } +} + +export const watchCheckedValue = ({ api, emit, state }) => (value) => { + const { checkStrictly, multiple } = state.config + + api.computePresentContent() + + if (!multiple && !checkStrictly && state.dropDownVisible) { + api.toggleDropDownVisible(false) + } + + emit('update:modelValue', value) + emit('change', value) + + setTimeout(api.updateStyle) +} + +export const isEmpty = (val) => { + if (isNull(val)) { + return true + } + if (typeof val === 'boolean') { + return false + } + if (typeof val === 'number') { + return !val + } + if (val instanceof Error) { + return val.message === '' + } + + const type = Object.prototype.toString.call(val) + + if (~['[object String]', '[object Array]'].indexOf(type)) { + return !val.length + } + + if (~['[object File]', '[object Map]', '[object Set]'].indexOf(type)) { + return !val.size + } + + if (type === '[object Object]') { + return !Object.keys(val).length + } + + return false +} + +export const selfMounted = ({ api, parent, props, refs, state }) => () => { + const { input } = refs + const inputSizeMap = { medium: 36, small: 32, mini: 28 } + + input.$parent.popperElm = refs.popper + + if (input && input.$el) { + state.inputInitialHeight = input.$el.offsetHeight || inputSizeMap[state.realSize] || 30 + } + + if (!isEmpty(props.modelValue)) { + api.computePresentContent() + } + + api.filterHandler = debounce(props.debounce, () => { + if (!state.inputValue) { + state.filtering = false + return + } + + const before = props.beforeFilter(state.inputValue) + + if (before && before.then) { + before.then(api.getSuggestions) + } else if (before !== false) { + api.getSuggestions() + } else { + state.filtering = false + } + }) + + addResizeListener(parent.$el, api.updateStyle) +} + +export const toggleDropDownVisible = ({ emit, nextTick, refs, state, updatePopper }) => (visible) => { + if (state.isDisabled) { + return + } + + const { input } = refs + + visible = !isNull(visible) ? visible : !state.dropDownVisible + + if (visible !== state.dropDownVisible) { + state.dropDownVisible = visible + + if (visible) { + nextTick(() => { + updatePopper() + state.panel.scrollIntoView() + }) + } + + input && input.getInput && input.getInput().setAttribute('aria-expanded', visible) + + emit('visible-change', visible) + } +} + +export const handleDropdownLeave = (state) => () => { + state.filtering = false + state.inputValue = state.presentText +} + +export const handleKeyDown = ({ api }) => (event) => { + switch (event.keyCode) { + case KEY_CODE.Enter: + api.toggleDropDownVisible() + break + case KEY_CODE.ArrowDown: + api.toggleDropDownVisible(true) + api.focusFirstNode() + event.preventDefault() + break + case KEY_CODE.Escape: + case KEY_CODE.Tab: + api.toggleDropDownVisible(false) + break + default: + break + } +} + +export const handleFocus = (emit) => (e) => { + emit('focus', e) +} + +export const handleBlur = ({ constants, dispatch, emit, state }) => (e) => { + dispatch(constants.COMPONENT_NAME.FormItem, constants.EVENT_NAME.FormBlur, [state.multiple ? state.presentText : state.inputValue]) + emit('blur', e) +} + +export const handleInput = ({ api, state, refs }) => (val, event) => { + event = event || window.event + + if (!event) { + return + } + + const reference = refs.reference + const key = 'init-flag' + const value = 'true' + const isIE = browser.name === 'ie' + + if (isIE && reference.getAttribute(key) !== value && !event.target.value) { + reference.setAttribute(key, value) + return + } + + !state.dropDownVisible && api.toggleDropDownVisible(true) + state.presentText = val + + if (event && event.isComposing) { + return + } + + if (val) { + api.filterHandler() + } else { + state.filtering = false + } +} + +export const handleClear = (state) => () => { + state.presentText = '' + state.panel.clearCheckedNodes() +} + +export const handleExpandChange = ({ constants, dispatch, emit, nextTick, state, updatePopper }) => (value) => { + nextTick(() => { + dispatch(constants.COMPONENT_NAME.FormItem, constants.EVENT_NAME.FormBlur, [state.multiple ? state.presentText : state.inputValue]) + + updatePopper(state.panel.$parent) + }) + + emit('expand-change', value) + emit('active-item-change', value) +} + +export const focusFirstNode = ({ refs, state }) => () => { + const { popper, suggestionPanel } = refs + let firstNode = null + + if (state.filtering && suggestionPanel) { + firstNode = suggestionPanel.$el.querySelector(CASCADER.SugItem) + } else { + const firstMenu = popper.querySelector(CASCADER.CascaderMenu) + firstNode = firstMenu.querySelector(CASCADER.CascaderNodeTab) + } + + if (firstNode) { + firstNode.focus() + !state.filtering && firstNode.click() + } +} + +export const computePresentText = ({ props, state }) => () => { + if (!isEmpty(state.checkedValue)) { + const node = state.panel.getNodeByValue(state.checkedValue) + + if (node && (state.config.checkStrictly || node.isLeaf)) { + state.presentText = node.getText(props.showAllLevels, props.separator) + return + } + } + + state.inputValue = null + state.presentText = null +} + +export const computePresentTags = ({ api, props, state }) => () => { + const checkedNodes = api.getCheckedNodes(state.leafOnly) + const tags = [] + + const genTag = (node) => { + const text = node.getText(props.showAllLevels, props.separator) + const closable = !state.isDisabled && !node.isDisabled + + return { node, key: node.uid, text, hitState: false, closable } + } + + if (checkedNodes.length) { + const [first, ...rest] = checkedNodes + const restCount = rest.length + + tags.push(genTag(first)) + + if (restCount) { + if (props.collapseTags) { + tags.push({ key: -1, text: `+ ${restCount}`, closable: false }) + } else { + rest.forEach((node) => tags.push(genTag(node))) + } + } + } + + state.checkedNodes = checkedNodes + state.presentTags = tags +} + +export const getSuggestions = ({ nextTick, props, state, updatePopper }) => () => { + let filterMethod = null + + if (!(props.filterMethod && typeof props.filterMethod === 'function')) { + filterMethod = (node, keyword) => ~node.text.indexOf(keyword) + } else { + filterMethod = props.filterMethod + } + + const suggestions = state.panel.getFlattedNodes(state.leafOnly).filter((node) => { + if (node.isDisabled) { + return false + } + + node.text = node.getText(props.showAllLevels, props.separator) || '' + + return filterMethod(node, state.inputValue) + }) + + if (state.multiple) { + state.presentTags.forEach((tag) => { + tag.hitState = false + }) + } else { + suggestions.forEach((node) => { + node.checked = isEqual(state.checkedValue, node.getValueByOption()) + }) + } + + state.filtering = true + state.suggestions = suggestions + + nextTick(() => updatePopper()) +} + +export const handleSuggestionKeyDown = ({ api }) => (event) => { + event = event || window.event + + if (!event) { + return + } + + const { keyCode, target } = event + + if (keyCode === KEY_CODE.Enter) { + target.click() + } else if (keyCode === KEY_CODE.ArrowUp) { + const prev = target.previousElementSibling + prev && prev.focus() + } else if (keyCode === KEY_CODE.ArrowDown) { + const next = target.nextElementSibling + next && next.focus() + } else if (~[KEY_CODE.Escape, KEY_CODE.Tab].indexOf(keyCode)) { + api.toggleDropDownVisible(false) + } +} + +export const handleDelete = ({ api, state }) => () => { + const lastIndex = state.presentTags.length - 1 + const lastTag = state.presentTags[lastIndex] + + state.pressDeleteCount = state.inputValue ? 0 : state.pressDeleteCount + 1 + + if (!lastTag) { + return + } + + if (state.pressDeleteCount) { + if (lastTag.hitState) { + api.deleteTag(lastIndex) + } else { + lastTag.hitState = true + } + } +} + +export const handleSuggestionClick = ({ api, state }) => (index) => { + const targetNode = state.suggestions[index] + + if (state.multiple) { + const { checked } = targetNode + + targetNode.doCheck(!checked) + state.panel.calculateMultiCheckedValue() + } else { + state.checkedValue = targetNode.getValueByOption() + api.toggleDropDownVisible(false) + } +} + +export const deleteTag = ({ emit, state }) => (index) => { + const val = state.checkedValue[index] + state.checkedValue = state.checkedValue.filter((n, i) => i !== index) + + emit('remove-tag', val) +} + +export const updateStyle = ({ parent, refs, state, updatePopper }) => () => { + const $el = parent.$el + const { suggestionPanel } = refs + const inputInner = $el.querySelector(CASCADER.InputClass) + + if (!inputInner) { + return + } + + const tags = $el.querySelector(CASCADER.TagClass) + let suggestionPanelEl = null + + if (suggestionPanel && (suggestionPanelEl = suggestionPanel.$el)) { + const suggestionList = suggestionPanelEl.querySelector(CASCADER.ListClass) + suggestionList.style.minWidth = inputInner.offsetWidth + 'px' + } + + if (tags) { + const offsetHeight = tags.offsetHeight + const height = Math.max(offsetHeight + 6, state.inputInitialHeight) + 'px' + + inputInner.style.height = height + + updatePopper() + } +} + +export const getCheckedNodes = (state) => (leafOnly) => state.panel.getCheckedNodes(leafOnly, state.checkedValue) + +export const setInputHeightToTag = ({ nextTick, parent }) => () => { + nextTick(() => { + const parentEl = parent.$el + const height = parentEl.querySelector(CASCADER.TagClass).offsetHeight + 6 + 'px' + + parentEl.querySelector(CASCADER.InputClass).style.height = height + }) +} + +export const presentTextHandler = ({ state, value }) => { + if (state.inputValue) { + if (state.inputValue !== value) { + state.inputValue = value + } + } else { + if (value) { + state.inputValue = value + } + } +} + +export const handleBeforeUpdate = ({ props, api }) => () => { + if (!isEmpty(props.modelValue)) { + api.computePresentContent() + } +} diff --git a/packages/renderless/src/cascader/vue.ts b/packages/renderless/src/cascader/vue.ts new file mode 100644 index 000000000..9aba5ec20 --- /dev/null +++ b/packages/renderless/src/cascader/vue.ts @@ -0,0 +1,211 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + getConfig, + deleteTag, + getCheckedNodes, + updateStyle, + handleSuggestionClick, + handleDelete, + handleSuggestionKeyDown, + getSuggestions, + handleExpandChange, + computePresentText, + focusFirstNode, + handleClear, + handleInput, + handleBlur, + handleFocus, + handleKeyDown, + handleDropdownLeave, + toggleDropDownVisible, + computePresentTags, + selfMounted, + watchCheckedValue, + computClearVisible, + computePresentContent, + watchValue, + setInputHeightToTag, + presentTextHandler, + handleBeforeUpdate +} from './index' +import { removeResizeListener } from '@opentiny/vue-renderless/common/deps/resize-event' +import userPopper from '@opentiny/vue-renderless/common/deps/vue-popper' +import { DATEPICKER } from '@opentiny/vue-renderless/common' + +export const api = [ + 'state', + 'getCheckedNodes', + 'computePresentText', + 'handleSuggestionClick', + 'handleSuggestionKeyDown', + 'handleExpandChange', + 'handleDropdownLeave', + 'handleDelete', + 'deleteTag', + 'handleClear', + 'handleInput', + 'handleBlur', + 'handleFocus', + 'toggleDropDownVisible', + 'handleKeyDown' +] + +const initState = ({ reactive, props, computed, parent, api, refs, t, constants }) => { + const state = reactive({ + dropDownVisible: false, + checkedValue: props.modelValue || null, + inputHover: false, + inputValue: null, + presentText: null, + presentTags: [], + checkedNodes: [], + filtering: false, + suggestions: [], + inputInitialHeight: 0, + pressDeleteCount: 0, + realSize: computed(() => props.size), + formDisabled: computed(() => (parent.tinyForm || {}).disabled), + disabled: computed(() => props.disabled || state.formDisabled), + tagSize: computed(() => (~['small', 'mini'].indexOf(state.realSize) ? 'mini' : 'small')), + isDisabled: computed(() => state.disabled), + config: computed(() => api.getConfig()), + multiple: computed(() => state.config.multiple), + leafOnly: computed(() => !state.config.checkStrictly), + readonly: computed(() => !props.filterable || state.multiple), + clearBtnVisible: computed(() => api.computClearVisible()), + panel: computed(() => refs.panel), + placeholder: computed(() => props.placeholder || t(constants.placeholder)), + inputValues: computed(() => (state.multiple ? state.presentText : state.inputValue)) + }) + + return state +} + +const initApi = ({ api, state, constants, dispatch, emit, refs, props, updatePopper, nextTick, parent }) => { + Object.assign(api, { + state, + handleBlur: handleBlur({ constants, dispatch, emit, state }), + handleFocus: handleFocus(emit), + handleClear: handleClear(state), + getCheckedNodes: getCheckedNodes(state), + deleteTag: deleteTag({ emit, state }), + handleDropdownLeave: handleDropdownLeave(state), + focusFirstNode: focusFirstNode({ refs, state }), + computClearVisible: computClearVisible({ props, state }), + updateStyle: updateStyle({ parent, refs, state, updatePopper }), + getSuggestions: getSuggestions({ nextTick, props, state, updatePopper }), + handleExpandChange: handleExpandChange({ constants, emit, dispatch, nextTick, state, updatePopper }), + getConfig: getConfig({ parent, props }), + setInputHeightToTag: setInputHeightToTag({ nextTick, parent }), + handleSuggestionClick: handleSuggestionClick({ api, state }), + handleDelete: handleDelete({ api, state }), + computePresentText: computePresentText({ props, state }), + handleSuggestionKeyDown: handleSuggestionKeyDown({ api }), + handleInput: handleInput({ api, state, refs }), + handleKeyDown: handleKeyDown({ api }), + watchValue: watchValue({ api, state }), + computePresentTags: computePresentTags({ api, props, state }), + computePresentContent: computePresentContent({ api, state }), + watchCheckedValue: watchCheckedValue({ api, emit, state }), + toggleDropDownVisible: toggleDropDownVisible({ emit, nextTick, refs, state, updatePopper }), + selfMounted: selfMounted({ api, parent, props, refs, state }), + handleBeforeUpdate: handleBeforeUpdate({ props, api }) + }) +} + +const initWatch = ({ watch, state, api, props, nextTick, updatePopper }) => { + watch(() => state.disabled, api.computePresentContent) + + watch(() => props.modelValue, api.watchValue) + + watch(() => state.checkedValue, api.watchCheckedValue) + + watch( + () => props.options, + () => nextTick(api.computePresentContent), + { deep: true, immediate: true } + ) + + watch( + () => state.presentText, + (value) => presentTextHandler({ state, value }) + ) + + watch( + () => state.presentTags, + (value, oldvalue) => { + state.multiple && (value.length || oldvalue.length) && nextTick(() => api.updateStyle()) + } + ) + + watch( + () => state.filtering, + () => nextTick(() => updatePopper()) + ) + + watch(() => state.multiple, api.setInputHeightToTag) + + watch( + () => state.dropDownVisible, + (value) => value && setTimeout(() => updatePopper()) + ) + + watch( + () => Array.isArray(state.checkedValue) && state.checkedValue.length, + () => setTimeout(() => updatePopper()) + ) +} + +export const renderless = ( + props, + { computed, onMounted, onBeforeUnmount, onDeactivated, onUpdated, onBeforeUpdate, reactive, toRefs, watch, inject }, + { t, refs, emit, nextTick, constants, parent, slots, dispatch } +) => { + parent.tinyForm = parent.tinyForm || inject('form', null) + + const { updatePopper } = userPopper({ + reactive, + watch, + emit, + props: { + ...props, + placement: DATEPICKER.PlacementMap.left, + popperOptions: { boundariesPadding: 0, gpuAcceleration: false }, + visibleArrow: true, + offset: 0, + boundariesPadding: 5, + arrowOffset: 35 + }, + toRefs, + refs, + slots, + nextTick, + onBeforeUnmount, + onDeactivated + }) + + const api = {} + const state = initState({ reactive, props, computed, parent, api, refs, t, constants }) + + initApi({ api, state, constants, dispatch, emit, refs, props, updatePopper, nextTick, parent }) + + initWatch({ watch, state, api, props, nextTick, updatePopper }) + + onBeforeUpdate(api.handleBeforeUpdate) + onUpdated(api.updateStyle) + onMounted(api.selfMounted) + onBeforeUnmount(() => removeResizeListener(parent.$el, api.updateStyle)) + + return api +} diff --git a/packages/renderless/src/chart-bar/index.ts b/packages/renderless/src/chart-bar/index.ts new file mode 100644 index 000000000..ecd161bcd --- /dev/null +++ b/packages/renderless/src/chart-bar/index.ts @@ -0,0 +1,296 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getFormated, getStackMap, get, set, cloneDeep } from '@opentiny/vue-renderless/chart-core/deps/utils' +import { itemPoint, itemLabel, itemContent } from '@opentiny/vue-renderless/chart-core/deps/constants' +import { isNull } from '@opentiny/vue-renderless/common/type' + +// default opacity of bar while dim-axis type is 'value' +const VALUE_AXIS_OPACITY = 0.5 + +const getValueAxisData = (dims) => { + const max = Math.max(...dims) + const min = Math.min(...dims) + let { result = [], i = min } = {} + + for (; i <= max; i++) { + result.push(i) + } + + return result +} + +const getBarDimAxis = (args) => { + const { innerRows, dimAxisName, dimension, axisVisible, dimAxisType, dims } = args + + return dimension.map((item) => ({ + type: 'category', + name: dimAxisName, + nameLocation: 'middle', + nameGap: 22, + data: dimAxisType === 'value' ? getValueAxisData(dims) : innerRows.map((row) => row[item]), + axisLabel: { + formatter(value) { + return String(value) + } + }, + show: axisVisible, + axisTick: { show: true, alignWithLabel: true, lineStyle: { color: '#191919', opacity: 0.1, width: 2 } }, + axisLine: { show: true, lineStyle: { color: '#191919', opacity: 0.1, width: 2 } }, + axisPointer: { type: 'shadow', z: 1, shadowStyle: { color: '#f5f5f5' } } + })) +} + +const factoryFmt = ({ meaAxisType, i, digit }) => (val) => getFormated(val, meaAxisType[i], digit) + +const getBarMeaAxis = (args) => { + const { axisVisible, digit, max, meaAxisName, meaAxisType, min, scale } = args + const meaAxisBase = { type: 'value', axisTick: { show: false }, show: axisVisible } + let { meaAxis = [], i = 0, formatter } = {} + + for (; i < 2; i++) { + if (meaAxisType[i]) { + formatter = factoryFmt({ meaAxisType, i, digit }) + + meaAxis[i] = { ...meaAxisBase, axisLabel: { formatter } } + } else { + meaAxis[i] = { ...meaAxisBase } + } + + Object.assign(meaAxis[i], { + max: max[i] || null, + min: min[i] || null, + name: meaAxisName[i] || '', + scale: scale[i] || false + }) + } + + return meaAxis +} + +const getBarTooltip = (args) => { + const { axisSite, digit, isHistogram, labelMap, meaAxisType } = args + let secondAxis = (!isHistogram ? axisSite.top : axisSite.right) || [] + + if (labelMap) { + secondAxis = secondAxis.map((item) => (typeof labelMap[item] === 'undefined' ? item : labelMap[item])) + } + + let formatter = function (items) { + let { tplt = [], seriesName, type } = {} + + tplt.push(`${items[0].name}
    `) + + items.forEach((item) => { + seriesName = item.seriesName + type = ~secondAxis.indexOf(seriesName) ? meaAxisType[1] : meaAxisType[0] + + tplt.push(itemPoint(item.color)) + tplt.push(itemLabel(seriesName)) + tplt.push(itemContent(getFormated(item.value, type, digit))) + tplt.push('
    ') + }) + + return tplt.join('') + } + + return { trigger: 'axis', formatter } +} + +const getValueData = (seriesTemp, dims) => { + const max = Math.max(...dims) + const min = Math.min(...dims) + let { result = [], i = min, index } = {} + + for (; i <= max; i++) { + index = dims.indexOf(i) + result.push(~index ? seriesTemp[index] : null) + } + + return result +} + +const getBarSeries = (args) => { + const { axisSite, barGap, dimAxisType, dims, innerRows, isHistogram, itemStyle } = args + const { label, labelMap, metrics, opacity, showLine = [], stack } = args + let { secondAxis, secondDimAxisIndex, series = [], seriesTemp = {}, stackMap, stackNum = 0 } = {} + + secondAxis = (isHistogram ? axisSite.right : axisSite.top) || [] + secondDimAxisIndex = isHistogram ? 'yAxisIndex' : 'xAxisIndex' + stackMap = stack && getStackMap(stack) + + metrics.forEach((item) => (seriesTemp[item] = [])) + innerRows.forEach((row) => metrics.forEach((item) => seriesTemp[item].push(row[item]))) + + series = Object.keys(seriesTemp).map((item) => { + let name = !isNull(labelMap[item]) ? labelMap[item] : item + let type = ~showLine.indexOf(item) ? 'line' : 'bar' + let data = dimAxisType === 'value' ? getValueData(seriesTemp[item], dims) : seriesTemp[item] + let axisIndex = ~secondAxis.indexOf(item) ? '1' : '0' + + let seriesItem = { name, type, data, [secondDimAxisIndex]: axisIndex } + + if (seriesItem.type === 'line') { + const emphasis = { itemStyle: { borderColor: '#fff', borderWidth: 2 } } + const defaultSeriesItem = { symbol: 'circle', symbolSize: 8, showSymbol: false, emphasis } + + seriesItem = Object.assign(defaultSeriesItem, seriesItem) + } + + const defaultItemStyle = { borderRadius: isHistogram ? [4, 4, 0, 0] : [0, 4, 4, 0] } + const defaultLabel = { position: 'top' } + + stack && stackMap[item] && (seriesItem.stack = stackMap[item]) + + if (Object.keys(stack).length) { + // 堆叠图 + if (stackNum === Object.keys(stackMap).length - 1 || isNull(seriesItem.stack)) { + seriesItem.itemStyle = Object.assign(defaultItemStyle, seriesItem.itemStyle) + } + if (!isNull(seriesItem.stack)) { + stackNum++ + } + + seriesItem.itemStyle = { borderWidth: 2, borderColor: 'transparent', ...seriesItem.itemStyle } + } else { + // 非堆叠图 + seriesItem.itemStyle = Object.assign(defaultItemStyle, seriesItem.itemStyle) + } + + seriesItem.label = Object.assign(defaultLabel, label) + + itemStyle && (seriesItem.itemStyle = itemStyle) + + let itemOpacity = opacity || get(seriesItem, 'itemStyle.opacity') + + dimAxisType === 'value' && Object.assign(seriesItem, { barGap, barCategoryGap: '1%' }) + dimAxisType === 'value' && isNull(itemOpacity) && (itemOpacity = VALUE_AXIS_OPACITY) + + !isNull(itemOpacity) && set(seriesItem, 'itemStyle.opacity', itemOpacity) + + return seriesItem + }) + + return series.length ? series : false +} + +const getLegend = (args) => { + const { metrics, labelMap, legendName } = args + + if (!legendName && !labelMap) { + return { data: metrics } + } + + const data = labelMap ? metrics.map((item) => (isNull(labelMap[item]) ? item : labelMap[item])) : metrics + + return { + data, + formatter(name) { + return !isNull(legendName[name]) ? legendName[name] : name + } + } +} + +const getDims = (rows, dimension) => rows.map((row) => row[dimension[0]]) + +export const bar = (columns, rows, settings, extra) => { + const innerRows = cloneDeep(rows) + const { axisSite = {}, dimension = [columns[0]], axisVisible = true, stack = {} } = settings + const { digit = 2, dataOrder = false, scale = [false, false], min = [null, null], max = [null, null] } = settings + const { legendName = {}, labelMap = {}, label, itemStyle, showLine, barGap = '-100%', opacity } = settings + const { tooltipVisible, legendVisible } = extra + let { metrics = columns.slice(), meaAxisType, dimAxisType, meaAxisName, dimAxisName, isHistogram = false } = {} + + if (axisSite.bottom && axisSite.top) { + metrics = axisSite.top.concat(axisSite.bottom) + } else if (!axisSite.right && axisSite.bottom) { + metrics = axisSite.bottom + } else if (settings.metrics) { + metrics = settings.metrics + } else { + metrics.splice(columns.indexOf(dimension[0]), 1) + } + + dimAxisType = settings.yAxisType || 'category' + meaAxisType = settings.xAxisType || ['normal', 'normal'] + dimAxisName = settings.yAxisName || '' + meaAxisName = settings.xAxisName || [] + + if (dataOrder) { + let { label, order } = dataOrder + + if (label && order) { + innerRows.sort((a, b) => (order === 'desc' ? a[label] - b[label] : b[label] - a[label])) + } + } + + let dims = getDims(innerRows, dimension) + let legend = legendVisible && getLegend({ metrics, labelMap, legendName }) + let yAxis = getBarDimAxis({ innerRows, dimAxisName, dimension, axisVisible, dimAxisType, dims }) + let xAxis = getBarMeaAxis({ axisVisible, meaAxisType, meaAxisName, scale, digit, max, min }) + let args = { axisSite, isHistogram, metrics, stack, itemStyle, label, labelMap, showLine } + + Object.assign(args, { dimAxisType, dims, barGap, dimension, innerRows, opacity }) + + let tooltip = tooltipVisible && getBarTooltip({ axisSite, isHistogram, meaAxisType, digit, labelMap }) + let options = { legend, yAxis, series: getBarSeries(args), xAxis, tooltip } + + return options +} + +export const histogram = (columns, rows, settings, extra) => { + const innerRows = cloneDeep(rows) + const { axisSite = {}, dimension = [columns[0]], stack = {}, axisVisible = true } = settings + const { digit = 2, dataOrder = false, scale = [false, false], min = [null, null], max = [null, null] } = settings + const { labelMap = {}, legendName = {}, label, itemStyle, showLine, barGap = '-100%', opacity } = settings + const { tooltipVisible, legendVisible } = extra + + if (dataOrder) { + let { label, order } = dataOrder + + if (label && order) { + innerRows.sort((a, b) => (order === 'desc' ? a[label] - b[label] : b[label] - a[label])) + } + } + + let { metrics, meaAxisType, dimAxisType, meaAxisName, dimAxisName, isHistogram = true, dims, legend } = {} + + metrics = columns.slice() + + if (axisSite.right && axisSite.left) { + metrics = axisSite.left.concat(axisSite.right) + } else if (!axisSite.right && axisSite.left) { + metrics = axisSite.left + } else if (settings.metrics) { + metrics = settings.metrics + } else { + metrics.splice(columns.indexOf(dimension[0]), 1) + } + + dimAxisType = settings.xAxisType || 'category' + meaAxisType = settings.yAxisType || ['normal', 'normal'] + dimAxisName = settings.xAxisName || '' + meaAxisName = settings.yAxisName || [] + dims = getDims(innerRows, dimension) + legend = legendVisible && getLegend({ metrics, labelMap, legendName }) + + let xAxis = getBarDimAxis({ innerRows, dimAxisName, dimension, axisVisible, dimAxisType, dims }) + let yAxis = getBarMeaAxis({ meaAxisName, meaAxisType, axisVisible, digit, scale, min, max }) + let args = { innerRows, metrics, stack, axisSite, isHistogram, labelMap, itemStyle, label } + + Object.assign(args, { showLine, dimAxisType, dimension, barGap, opacity, dims }) + + let tooltip = tooltipVisible && getBarTooltip({ axisSite, isHistogram, meaAxisType, digit, labelMap }) + let options = { legend, yAxis, series: getBarSeries(args), xAxis, tooltip } + + return options +} diff --git a/packages/renderless/src/chart-boxplot/index.ts b/packages/renderless/src/chart-boxplot/index.ts new file mode 100644 index 000000000..621bba1ed --- /dev/null +++ b/packages/renderless/src/chart-boxplot/index.ts @@ -0,0 +1,172 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getFormated, htmlHandler, getLegend } from '@opentiny/vue-renderless/chart-core/deps/utils' +import { itemPoint, itemLabel, itemContent } from '@opentiny/vue-renderless/chart-core/deps/constants' + +const getXAxis = (args) => { + const { columns, xAxisName, axisVisible, xAxisType } = args + + return [ + { + type: xAxisType, + nameLocation: 'middle', + nameGap: 22, + name: xAxisName || '', + axisTick: { show: true, lineStyle: { color: '#eee' } }, + data: columns, + show: axisVisible + } + ] +} + +const getSeries = (args) => { + const { area, areaStyle, itemStyle, label, lineStyle, outliers = [], rows } = args + let { series = [], arr = ['boxplot', 'scatter'] } = {} + + arr.forEach((item) => { + if (item === 'scatter' && !outliers.length) { + return + } + + let data = item === 'boxplot' ? rows : outliers + let seriesItem = { name: '', type: item, data } + + area && (seriesItem.areaStyle = {}) + label && (seriesItem.label = label) + lineStyle && (seriesItem.lineStyle = lineStyle) + itemStyle && (seriesItem.itemStyle = itemStyle) + areaStyle && (seriesItem.areaStyle = areaStyle) + + series.push(seriesItem) + }) + + return series +} + +const factoryFmt = ({ yAxisType, i, digit }) => (val) => getFormated(val, yAxisType[i], digit) + +const getYAxis = (args) => { + const { axisVisible, digit, max, min, scale, yAxisName, yAxisType } = args + const yAxisBase = { type: 'value', axisTick: { show: false }, show: axisVisible } + let { yAxis = [], len = yAxisType.length >= 2 ? 2 : 1, i = 0 } = {} + + for (; i < len; i++) { + if (!yAxisType[i]) { + yAxis[i] = { ...yAxisBase } + } else { + let formatter = factoryFmt({ yAxisType, i, digit }) + let yAxisAdv = { axisLabel: { formatter } } + + yAxis[i] = { ...yAxisBase, ...yAxisAdv } + + let name = yAxisName[i] || '' + + Object.assign(yAxis[i], { name, scale: scale[i] || false, min: min[i] || null, max: max[i] || null }) + } + } + + return yAxis +} + +const tooltipTemplate = ({ data, seriesType, seriesName, color, value, name }, tooltipLabel) => { + let tpl = [] + + if (seriesType === 'boxplot') { + const tips = [] + + tooltipLabel.forEach((label, idx) => { + tips.push(`${itemPoint(color)}${itemLabel(label)}${itemContent(data[idx + 1])}`) + }) + + tpl.push(tips.join('
    ')) + } else { + tpl.push(itemPoint(color)) + + if (Array.isArray(value)) { + tpl.push(value.join(': ')) + } else { + tpl.push(`${seriesName || name}: `) + tpl.push(value) + } + + tpl.push('
    ') + } + + return tpl +} + +const getTooltip = (args) => { + const { tooltipFormatter, tooltipLabel } = args + + return { + trigger: 'item', // axis item + formatter(items) { + if (tooltipFormatter) { + return tooltipFormatter.apply(null, arguments) + } + + let tpl = [] + const { name, axisValueLabel } = items[0] || {} + const title = name || axisValueLabel + + title && tpl.push(`${title}
    `) + + if (Array.isArray(items)) { + items.forEach((item) => { + tpl = tpl.concat(tooltipTemplate(item, tooltipLabel)) + }) + } else { + tpl = tooltipTemplate(items, tooltipLabel) + } + + return tpl.join('') + } + } +} + +export const boxplot = (columns, rows, settings, extra) => { + rows = Array.isArray(rows) ? rows : [] + columns = Array.isArray(columns) ? columns : [] + + const { axisSite = {}, yAxisType = ['normal'], xAxisType = 'category', yAxisName = '', xAxisName = '' } = settings + const { axisVisible = true, area, scale = [false, false], min = [null, null], max = [null, null] } = settings + const { nullAddZero = false, digit = 2, legendName = {}, labelMap = {}, label, itemStyle } = settings + const { lineStyle, areaStyle, tooltipLabel = ['lower', 'Q1', 'median', 'Q3', 'upper'] } = settings + const { legendVisible, outliers, tooltipFormatter, tooltipVisible } = extra + let metrics = columns.slice() + + if (axisSite.right && axisSite.left) { + metrics = axisSite.left.concat(axisSite.right) + } else if (!axisSite.right && axisSite.left) { + metrics = axisSite.left + } else if (settings.metrics) { + metrics = settings.metrics + } + + const legend = legendVisible && getLegend({ metrics, legendName, labelMap }) + const getParams = () => ({ tooltipFormatter, tooltipLabel: htmlHandler(tooltipLabel), digit }) + const tooltip = tooltipVisible && getTooltip(getParams()) + const xAxis = getXAxis({ columns, xAxisName, axisVisible, xAxisType }) + const yAxisParams = { yAxisName, yAxisType, axisVisible } + + Object.assign(yAxisParams, { scale, min, max, digit }) + + const yAxis = getYAxis(yAxisParams) + const seriesParams = { rows, axisSite, metrics, area, nullAddZero, labelMap, label } + + Object.assign(seriesParams, { itemStyle, lineStyle, areaStyle, xAxisType, outliers }) + + const series = getSeries(seriesParams) + + return { legend, xAxis, series, yAxis, tooltip } +} diff --git a/packages/renderless/src/chart-candle/index.ts b/packages/renderless/src/chart-candle/index.ts new file mode 100644 index 000000000..426b631ef --- /dev/null +++ b/packages/renderless/src/chart-candle/index.ts @@ -0,0 +1,251 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getFormated } from '@opentiny/vue-renderless/chart-core/deps/utils' +import { itemPoint, itemLabel, itemContent } from '@opentiny/vue-renderless/chart-core/deps/constants' +import { isNull } from '@opentiny/vue-renderless/common/type' + +const DEF_MA = [5, 10, 20, 30] +const DEF_DOWN_COLOR = '#eb171f' +const DEF_UP_COLOR = '#00a874' +const DEF_START = 50 +const DEF_END = 100 +const SHOW_FALSE = { show: false } +let defaultKName = '' + +const getCandleLegend = (args) => { + const { MA, labelMap, legendName, showMA } = args + let data = [defaultKName] + + showMA && (data = data.concat(MA.map((v) => `MA${v}`))) + labelMap && (data = data.map((v) => (isNull(labelMap[v]) ? v : labelMap[v]))) + + function formatter(name) { + return isNull(legendName[name]) ? name : legendName[name] + } + + return { data, formatter } +} + +const getCandleTooltip = (args) => { + const { dataType, digit, labelMap, metrics } = args + + function position(pos, params, el, elRect, size) { + const result = { top: 10 } + const side = pos[0] < size.viewSize[0] / 2 ? 'right' : 'left' + + result[side] = 60 + + return result + } + + function formatter(options) { + const tplt = [] + + tplt.push(`${itemContent(options[0].axisValue)}
    `) + + options.forEach((opt) => { + const { color, componentSubType, data, seriesName } = opt + + const name = isNull(labelMap[seriesName]) ? seriesName : labelMap[seriesName] + + tplt.push(`${itemPoint(color)}${itemContent(name)}: `) + + if (componentSubType === 'candlestick') { + tplt.push('
    ') + + metrics.slice(0, 4).forEach((m, i) => { + const name = isNull(labelMap[m]) ? m : labelMap[m] + const value = getFormated(data[i + 1], dataType, digit) + + tplt.push(`${itemLabel(`- ${name}`)}${itemContent(value)}
    `) + }) + } else if (componentSubType === 'line') { + const value = getFormated(data, dataType, digit) + tplt.push(`${itemContent(value)}
    `) + } else if (componentSubType === 'bar') { + const value = getFormated(data[1], dataType, digit) + tplt.push(`${itemContent(value)}
    `) + } + }) + + return tplt.join('') + } + + return { axisPointer: { type: 'cross' }, formatter, position, trigger: 'axis' } +} + +const getCandleVisualMap = (args) => { + const { MA, downColor, showMA, upColor } = args + let seriesIndex = showMA ? 1 + MA.length : 1 + let pieces = [ + { value: 1, color: downColor }, + { value: -1, color: upColor } + ] + + return { dimension: 2, pieces, seriesIndex, show: false } +} + +const getCandleGrid = (args) => { + const { showVol } = args + let height = showVol ? '50%' : '65%' + + return [ + { containLabel: false, left: '10%', right: '8%', top: '10%', height }, + { containLabel: false, left: '10%', right: '8%', top: '65%', height: '16%' } + ] +} + +const getCandleXAxis = (args) => { + const { dims: data } = args + const { type = 'category', scale = true, boundaryGap = false, splitLine = SHOW_FALSE } = {} + const { axisLine = { onZero: false }, axisTick = SHOW_FALSE, axisLabel = SHOW_FALSE } = {} + const { min = 'dataMin', max = 'dataMax', gridIndex = 1 } = {} + + return [ + { axisLine, boundaryGap, data, max, min, scale, splitLine, type }, + { axisLine, boundaryGap, data, max, min, scale, splitLine, type, axisLabel, axisTick, gridIndex } + ] +} + +const getCandleYAxis = (args) => { + const { dataType, digit } = args + const { scale = true, gridIndex = 1, splitNumber = 2, axisLine = SHOW_FALSE } = {} + const { axisTick = SHOW_FALSE, axisLabel = SHOW_FALSE, splitLine = SHOW_FALSE } = {} + const formatter = (val) => getFormated(val, dataType, digit) + + return [ + { scale, axisTick, axisLabel: { formatter } }, + { scale, axisTick, axisLabel, gridIndex, splitNumber, axisLine, splitLine } + ] +} + +const getCandleDataZoom = (args) => { + const { start, end } = args + + return [ + { type: 'inside', xAxisIndex: [0, 1], start, end }, + { type: 'slider', xAxisIndex: [0, 1], start, end, show: true, top: '85%' } + ] +} + +const calculateMA = (dayCount, data, digit) => { + let result = [] + + data.forEach((d, k) => { + if (k < dayCount) { + result.push('-') + } else { + let { acc = 0, i = 0 } = {} + + for (; i < dayCount; i++) { + acc += data[k - i][1] + } + + result.push(Number((acc / dayCount).toFixed(digit))) + } + }) + + return result +} + +const getCandleSeries = (args) => { + const { MA, digit, downColor, itemStyle, labelMap, showMA, showVol, upColor, values, volumes } = args + const style = itemStyle || { color: upColor, color0: downColor, borderColor: null, borderColor0: null } + const lineStyle = { opacity: 0.5 } + const name = isNull(labelMap[defaultKName]) ? defaultKName : labelMap[defaultKName] + const series = [{ name, data: values, type: 'candlestick', itemStyle: style }] + + if (showMA) { + MA.forEach((d) => { + const key = `MA${d}` + const serieName = isNull(labelMap[key]) ? key : labelMap[key] + const serieData = calculateMA(d, values, digit) + + series.push({ name: serieName, data: serieData, type: 'line', lineStyle, smooth: true }) + }) + } + + if (showVol) { + series.push({ name: 'Volume', data: volumes, type: 'bar', xAxisIndex: 1, yAxisIndex: 1 }) + } + + return series +} + +export const candle = (columns, rows, settings, extra) => { + const { dimension = columns[0], metrics = columns.slice(1, 6), digit = 2, itemStyle } = settings + const { labelMap = {}, legendName = {}, MA = DEF_MA, showMA = false, showVol = false } = settings + const { showDataZoom = false, downColor = DEF_DOWN_COLOR, upColor = DEF_UP_COLOR } = settings + const { start = DEF_START, end = DEF_END, dataType } = settings + const { tooltipVisible, legendVisible, t } = extra + const isLiteData = Array.isArray(rows[0]) + const { dims = [], values = [], volumes = [] } = {} + const candleMetrics = metrics.slice(0, 4) + const volumeMetrics = metrics[4] + + defaultKName = t('ui.chart.kName') + + if (isLiteData) { + rows.forEach((row) => { + const itemResult = [] + + dims.push(row[columns.indexOf(dimension)]) + + candleMetrics.forEach((item) => itemResult.push(row[columns.indexOf(item)])) + + values.push(itemResult) + + volumeMetrics && volumes.push(row[columns.indexOf(volumeMetrics)]) + }) + } else { + rows.forEach((row, index) => { + const itemResult = [] + + dims.push(row[dimension]) + + candleMetrics.forEach((item) => itemResult.push(row[item])) + + values.push(itemResult) + + if (volumeMetrics) { + const status = row[metrics[0]] > row[metrics[1]] ? 1 : -1 + + volumes.push([index, row[volumeMetrics], status]) + } + }) + } + + let params = { MA, labelMap, legendName, showMA } + const legend = legendVisible && getCandleLegend(params) + + params = { dataType, digit, labelMap, metrics } + + const tooltip = tooltipVisible && getCandleTooltip(params) + + params = { downColor, upColor, MA, showMA } + + const visualMap = showVol && getCandleVisualMap(params) + const dataZoom = showDataZoom && getCandleDataZoom({ start, end }) + const grid = getCandleGrid({ showVol }) + const xAxis = getCandleXAxis({ dims }) + const yAxis = getCandleYAxis({ dataType, digit }) + + params = { values, volumes, upColor, downColor, showMA } + Object.assign(params, { MA, showVol, labelMap, digit, itemStyle }) + + const series = getCandleSeries(params) + + const axisPointer = { link: { xAxisIndex: 'all' } } + + return { legend, tooltip, visualMap, grid, xAxis, yAxis, dataZoom, series, axisPointer } +} diff --git a/packages/renderless/src/chart-core/deps/constants.ts b/packages/renderless/src/chart-core/deps/constants.ts new file mode 100644 index 000000000..2f237ff2b --- /dev/null +++ b/packages/renderless/src/chart-core/deps/constants.ts @@ -0,0 +1,113 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +const sf = () => ({ show: false }) +const DEFAULT_THEME = { + categoryAxis: { axisLine: sf(), axisTick: sf(), splitLine: sf() }, + valueAxis: { axisLine: sf() }, + line: { smooth: true }, + grid: { containLabel: true, left: 10, right: 10 } +} + +let DEFAULT_COLORS = ['#19d4ae', '#5ab1ef', '#fa6e86', '#ffb980', '#0067a6', '#c4b4e4'] + +DEFAULT_COLORS = DEFAULT_COLORS.concat(['#d87a80', '#9cbbff', '#d9d0c7', '#87a997', '#d49ea2', '#5b4947', '#7ba3a8']) + +const HEAT_MAP_COLOR = ['#5990FD', '#2DA769', '#EEBA18', '#F43146'] + +const HEAT_BMAP_COLOR = ['blue', 'blue', 'green', 'yellow', 'red'] + +const SAAS_DEFAULT_COLORS_10 = ['#6d8ff0', '#00a874', '#bd72f0', '#54bcce', '#fdc000', '#9185f0', '#82dbb1', '#f46087', '#2070f3', '#ee8ddb'] + +const SAAS_DEFAULT_COLORS_18 = [ + '#2070f3', + '#50c291', + '#bd72f0', + '#54bcce', + '#fdc000', + '#6d8ff0', + '#71c14c', + '#87d5e5', + '#9185f0', + '#82dbb1', + '#ada6ed', + '#97da7e', + '#f46087', + '#ee8ddb', + '#f09596', + '#f36900', + '#daa61b', + '#efb9e3' +] + +const DEFAULT_CONFIG = { + tooltip: { + backgroundColor: '#fff', + borderColor: '#fff', + padding: [8, 16], + textStyle: { + color: '#191919', + fontSize: '14' + }, + extraCssText: 'box-shadow:0 8px 20px rgba(0, 0, 0, 0.16);' + }, + legend: { + icon: 'circle', + bottom: 0, + itemGap: 24, + itemWidth: 10, + itemHeight: 10, + itemStyle: { + borderColor: 'transparent' + } + } +} + +const itemPoint = (color) => + [ + '' + ].join('') + +const itemLabel = (seriesName, onlyLabel) => + ['${seriesName}`].join('') + +const itemContent = (content) => ['${content}`].join('') + +const STATIC_PROPS = ['initOptions', 'loading', 'dataEmpty', 'judgeWidth', 'widthChangeDelay'] + +let ECHARTS_SETTINGS = ['grid', 'dataZoom', 'visualMap', 'toolbox', 'title', 'legend', 'xAxis'] + +ECHARTS_SETTINGS = ECHARTS_SETTINGS.concat(['yAxis', 'radar', 'tooltip', 'axisPointer', 'brush', 'geo']) +ECHARTS_SETTINGS = ECHARTS_SETTINGS.concat(['timeline', 'graphic', 'series', 'backgroundColor', 'textStyle']) + +export { + DEFAULT_THEME, + DEFAULT_COLORS, + HEAT_MAP_COLOR, + HEAT_BMAP_COLOR, + itemPoint, + itemLabel, + itemContent, + STATIC_PROPS, + ECHARTS_SETTINGS, + DEFAULT_CONFIG, + SAAS_DEFAULT_COLORS_10, + SAAS_DEFAULT_COLORS_18 +} diff --git a/packages/renderless/src/chart-core/deps/numerify.ts b/packages/renderless/src/chart-core/deps/numerify.ts new file mode 100644 index 000000000..cc676e27b --- /dev/null +++ b/packages/renderless/src/chart-core/deps/numerify.ts @@ -0,0 +1,317 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +let ABBR = { th: 3, mi: 6, bi: 9, tr: 12 } +let abbrLabel = { th: 'k', mi: 'm', bi: 'b', tr: 't' } +let DEFAULT_OPTIONS = { zeroFormat: null, nullFormat: null, defaultFormat: '0,0', scalePercentBy100: true, abbrLabel } +let [TRILLION, BILLION, MILLION, THOUSAND] = [1e12, 1e9, 1e6, 1e3] + +const numIsNaN = (value) => typeof value === 'number' && isNaN(value) +let options = {} +let formats = {} + +function getBoundedPrecision(value, maxDecimals, optionals) { + let splitValue = value.toString().split('e-') + let exponent = splitValue.length === 2 ? Number(splitValue[1]) : 0 + + splitValue = splitValue[0].split('.') + exponent = splitValue.length === 2 ? splitValue[1].length + exponent : exponent + + let minDecimals = maxDecimals - (optionals || 0) + return Math.min(Math.max(exponent, minDecimals), maxDecimals) +} + +function toFixed(value, maxDecimals, roundingFunction, optionals) { + let boundedPrecision = getBoundedPrecision(value, maxDecimals, optionals) + let power = 10 ** boundedPrecision + + let output = (roundingFunction(value * `1e+${boundedPrecision}`) / power).toFixed(boundedPrecision) + + if (optionals > maxDecimals - boundedPrecision) { + let optionalsRegExp = new RegExp('\\.?0{1,' + (optionals - (maxDecimals - boundedPrecision)) + '}$') + + output = output.replace(optionalsRegExp, '') + } + + return output +} + +function judgForFunc(num, abs, abbrForce) { + let flag + + if (num === 0) { + flag = (abs >= TRILLION && !abbrForce) || abbrForce === 't' + } else if (num === 1) { + flag = (abs < TRILLION && abs >= BILLION && !abbrForce) || abbrForce === 'b' + } else if (num === 2) { + flag = (abs < BILLION && abs >= MILLION && !abbrForce) || abbrForce === 'm' + } else if (num === 3) { + flag = (abs < MILLION && abs >= THOUSAND && !abbrForce) || abbrForce === 'k' + } + + return flag +} + +const negativeSigned = function ({ format, value }) { + return ~format.indexOf('+') ? format.indexOf('+') : value < 0 ? format.indexOf('-') : -1 +} + +const updateAbbrV = function (params) { + let { abbr, abbrForce, format, value, abs } = params + abbrForce = format.match(/a(k|m|b|t)?/) + abbrForce = abbrForce ? abbrForce[1] : false + + if (~format.indexOf(' a')) { + abbr = ' ' + } + + format = format.replace(new RegExp(abbr + 'a[kmbt]?'), '') + + if (judgForFunc(0, abs, abbrForce)) { + abbr += options.abbrLabel.tr + value = value / TRILLION + } else if (judgForFunc(1, abs, abbrForce)) { + abbr += options.abbrLabel.bi + value = value / BILLION + } else if (judgForFunc(2, abs, abbrForce)) { + abbr += options.abbrLabel.mi + value = value / MILLION + } else if (judgForFunc(3, abs, abbrForce)) { + abbr += options.abbrLabel.th + value = value / THOUSAND + } + + Object.assign(params, { abbr, abbrForce, format, value, abs }) +} + +const handlePrecision = function (params) { + let { roundingFunction, value, format } = params + let number = value.toString().split('.')[0] + let precision = format.split('.')[1] + if (precision) { + if (~precision.indexOf('[')) { + precision = precision.replace(']', '') + precision = precision.split('[') + + params.decimal = toFixed(value, precision[0].length + precision[1].length, roundingFunction, precision[1].length) + } else { + params.decimal = toFixed(value, precision.length, roundingFunction) + } + + number = params.decimal.split('.')[0] + params.decimal = ~params.decimal.indexOf('.') ? '.' + params.decimal.split('.')[1] : '' + + if (params.optDec && Number(params.decimal.slice(1)) === 0) { + params.decimal = '' + } + } else { + number = toFixed(value, 0, roundingFunction) + } + return number +} + +function formatNumber(params) { + let number = handlePrecision(params) + let thousands = params.format.indexOf(',') + + let leadingCount = (params.format.split('.')[0].split(',')[0].match(/0/g) || []).length + + if (params.abbr && !params.abbrForce && Number(number) >= 1000 && params.abbr !== ABBR.trillion) { + number = String(Number(number) / 1000) + params.abbr = ABBR.million + } + + if (~number.indexOf('-')) { + number = number.slice(1) + params.neg = true + } + + if (number.length < leadingCount) { + for (let i = leadingCount - number.length; i > 0; i--) { + number = '0' + number + } + } + + if (thousands > -1) { + number = number.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1,') + } + + if (!params.format.indexOf('.')) { + number = '' + } + return number +} + +function getOutStr({ decimal, negFlag, neg, signed, abbr }, number) { + let outStr = number + decimal + (abbr || '') + + if (negFlag) { + outStr = negFlag && neg ? `(${outStr})` : outStr + } else { + if (signed >= 0) { + const symbol = neg ? '-' : '+' + outStr = signed === 0 ? symbol + outStr : outStr + symbol + } else if (neg) { + outStr = '-' + outStr + } + } + return outStr +} + +function numberToFormat(options, value, format, roundingFunction) { + let params = { + abs: Math.abs(value), + negFlag: false, + optDec: false, + abbr: '', + decimal: '', + neg: false, + abbrForce: void 0, + signed: void 0, + format: format || '', + value: value || 0, + roundingFunction + } + + if (~format.indexOf('(')) { + params.negFlag = true + params.format = format.replace(/[(|)]/g, '') + } else if (~params.format.indexOf('+') || ~params.format.indexOf('-')) { + params.signed = negativeSigned(params) + + params.format = format.replace(/[+|-]/g, '') + } + + if (~params.format.indexOf('a')) { + updateAbbrV(params) + } + + if (~params.format.indexOf('[.]')) { + params.optDec = true + params.format = format.replace('[.]', '.') + } + + const number = formatNumber(params) + + return getOutStr(params, number) +} + +function extend(target, sub) { + Object.keys(sub).forEach((key) => { + target[key] = sub[key] + }) +} + +let numerifyPercent = { + regexp: /%/, + + format: function format(value, formatType, roundingFunction, numerify) { + let space = ~formatType.indexOf(' %') ? ' ' : '' + let outStr = void 0 + + if (numerify.options.scalePercentBy100) { + value = value * 100 + } + + formatType = formatType.replace(/\s?%/, '') + outStr = numerify._numberToFormat(value, formatType, roundingFunction) + + if (~outStr.indexOf(')')) { + outStr = outStr.split('') + outStr.splice(-1, 0, space + '%') + outStr = outStr.join('') + } else { + outStr = outStr + space + '%' + } + + return outStr + } +} + +extend(options, DEFAULT_OPTIONS) + +let numerify + +function format(value, formatType, roundingFunc) { + let { zeroFormat, nullFormat, defaultFormat } = options + + formatType = formatType || defaultFormat + roundingFunc = roundingFunc || Math.round + + let { output, fmtFunc } = {} + + if (value === 0 && zeroFormat !== null) { + output = zeroFormat + } else if (value === null && nullFormat !== null) { + output = nullFormat + } else { + for (let key in formats) { + if (formats[key] && formatType.match(formats[key].regexp)) { + fmtFunc = formats[key].format + break + } + } + + fmtFunc = fmtFunc || numberToFormat.bind(null, options) + output = fmtFunc(value, formatType, roundingFunc, numerify) + } + + return output +} + +numerify = function (input, formatType, roundingFunc) { + let { zeroFormat, nullFormat } = options + let value = Number(input) || null + + if (typeof input === 'undefined' || input === 0) { + value = 0 + } else if (numIsNaN(input) || input === null) { + value = null + } else if (typeof input === 'string') { + value = Number(input) + + if (input === zeroFormat && zeroFormat) { + value = 0 + } else if ((input === nullFormat && nullFormat) || !input.replace(/[^0-9]+/g, '').length) { + value = null + } + } + + return format(value, formatType, roundingFunc) +} + +const _register = (name, format) => { + formats[name] = format +} + +const _unregister = (name) => { + formats[name] = null +} + +const _setOptions = (opts) => { + extend(options, opts) +} + +const _reset = () => { + extend(options, DEFAULT_OPTIONS) +} + +numerify.options = options +numerify._numberToFormat = numberToFormat.bind(null, options) +numerify.register = _register +numerify.unregister = _unregister +numerify.setOptions = _setOptions +numerify.reset = _reset + +numerify.register('percentage', numerifyPercent) + +export default numerify diff --git a/packages/renderless/src/chart-core/deps/utils.ts b/packages/renderless/src/chart-core/deps/utils.ts new file mode 100644 index 000000000..c8884b9f5 --- /dev/null +++ b/packages/renderless/src/chart-core/deps/utils.ts @@ -0,0 +1,241 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { extend, copyArray } from '@opentiny/vue-renderless/common/object' +import { isObject, typeOf as getType, isNull } from '@opentiny/vue-renderless/common/type' +import _debounce from '@opentiny/vue-renderless/common/deps/debounce' +import _numerify from './numerify' +import { escapeHtml } from '@opentiny/vue-renderless/common/string' +import { xss } from '@opentiny/vue-renderless/common' + +export { setObj as set, getObj as get, isEqual } from '@opentiny/vue-renderless/common/object' + +export { typeOf as getType, isObject } from '@opentiny/vue-renderless/common/type' + +export const debounce = (callback, delay) => _debounce(delay, false, callback) + +export const camelToKebab = (str) => str.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase() + +export const cloneDeep = (data) => { + if (isObject(data)) { + return extend(true, data) + } else if (Array.isArray(data)) { + return copyArray(data) + } else { + return data + } +} + +export const getFormated = (value, type, digit, defaultVal = '-') => { + if (isNaN(value)) { + return defaultVal + } + + if (!type) { + return value + } + + if (getType(type) === 'function') { + return type(value, _numerify) + } + + digit = !isNaN(digit) ? ++digit : 0 + + const digitStr = `.[${new Array(digit).join(0)}]` + let formatter = type + + if (type === 'KMB') { + formatter = digit ? `0,0${digitStr}a` : '0,0a' + } else if (type === 'normal') { + formatter = digit ? `0,0${digitStr}` : '0,0' + } else if (type === 'percent') { + formatter = digit ? `0,0${digitStr}%` : '0,0.[00]%' + } + + return _numerify(value, formatter) +} + +export const getStackMap = (stack) => { + const result = {} + + Object.keys(stack).forEach((item) => { + stack[item].forEach((name) => { + result[name] = item + }) + }) + + return result +} + +export const $get = (url) => + new Promise((resolve, reject) => { + const http = new XMLHttpRequest() + + url = xss.filterUrl(url) + http.open('GET', url) + http.send(null) + + http.onload = () => { + resolve(JSON.parse(http.responseText)) + } + + http.onerror = () => { + reject(JSON.parse(http.responseText)) + } + }) + +const mapPromise = {} + +export const getMapJSON = ({ position, positionJsonLink, beforeRegisterMapOnce, mapURLProfix = '' }) => { + const link = positionJsonLink || `${mapURLProfix}${position}.json` + + if (!mapPromise[link]) { + mapPromise[link] = $get(link).then((res) => { + if (beforeRegisterMapOnce) { + res = beforeRegisterMapOnce(res) + } + + return res + }) + } + + return mapPromise[link] +} + +let { amapPromise = null, bmapPromise = null } = {} + +export const getAmap = ({ key, version, url }) => { + if (!amapPromise) { + amapPromise = new Promise((resolve) => { + let cbName = 'amap' + Date.now() + let script = document.createElement('script') + let ver = version || '1.4.3' + + window[cbName] = resolve + script.src = [`${url}?v=${ver}`, `key=${key}`, `callback=${cbName}`].join('&') + + document.body.appendChild(script) + }) + } + + return amapPromise +} + +export const getBmap = ({ key, version, url }) => { + if (!bmapPromise) { + bmapPromise = new Promise((resolve) => { + let cbName = 'bmap' + Date.now() + let script = document.createElement('script') + let ver = version || '2.0' + + window[cbName] = resolve + script.src = [`${url}?v=${ver}`, `ak=${key}`, `callback=${cbName}`].join('&') + + document.body.appendChild(script) + }) + } + + return bmapPromise +} + +export const setArrayValue = (arr, index, value) => { + let store = arr[index] + + if (typeof store === 'undefined') { + arr[index] = [value] + return + } + + store.push(value) +} + +export const numerify = _numerify + +// 合并对象或数组 +export const merge = (source, other) => { + if (typeof source !== 'object' || typeof other !== 'object') { + return other === undefined ? source : other + } + + return Object.keys({ ...source, ...other }).reduce( + (acc, key) => { + acc[key] = merge(source[key], other[key]) + return acc + }, + Array.isArray(source) ? [] : {} + ) +} + +export const htmlHandler = (data) => { + if (!data || !Array.isArray(data)) { + return data + } + + return cloneDeep(data).map((item) => { + if (typeof item === 'string' && /<[a-z]+/i.test(item)) { + return escapeHtml(item) + } else if (typeof item === 'object') { + for (let key in item) { + if (typeof item[key] === 'string' && /<[a-z]+/i.test(item[key])) { + item[key] = escapeHtml(item[key]) + } + } + + return item + } else { + return item + } + }) +} + +export const getLegend = (args, legendItemStyle) => { + const { metrics, legendName, labelMap } = args + + if (!labelMap && !legendName) { + return { data: metrics } + } + + const data = labelMap ? metrics.map((item) => (isNull(labelMap[item]) ? item : labelMap[item])) : metrics + + return { + ...legendItemStyle, + data, + formatter(name) { + return isNull(legendName[name]) ? name : legendName[name] + } + } +} + +export const hexToRgb = (hex) => { + const reg = /^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6})/ + if (!reg.test(hex)) { + return + } + + hex = hex.replace(/#/g, '').toLowerCase() + let len = hex.length + if (len === 3) { + let t = '' + for (let i = 0; i < len; i++) { + t += hex.slice(i, i + 1).concat(hex.slice(i, i + 1)) + } + hex = t + } + + const rgbs = [] + for (let i = 0; i < 6; i += 2) { + let s = hex.slice(i, i + 2) + rgbs.push(parseInt(s, 16)) + } + + return rgbs.join(',') +} diff --git a/packages/renderless/src/chart-core/index.ts b/packages/renderless/src/chart-core/index.ts new file mode 100644 index 000000000..6869503f9 --- /dev/null +++ b/packages/renderless/src/chart-core/index.ts @@ -0,0 +1,437 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' +import { DEFAULT_COLORS, DEFAULT_THEME, STATIC_PROPS, ECHARTS_SETTINGS, SAAS_DEFAULT_COLORS_10, SAAS_DEFAULT_COLORS_18, DEFAULT_CONFIG } from './deps/constants' +import { getType, debounce, isObject, cloneDeep, isEqual, htmlHandler } from './deps/utils' +import setAnimation from './modules/animation' +import setExtend from './modules/extend' +import setMark from './modules/mark' + +export const computedCanvasStyle = (props) => () => ({ + width: props.width, + height: props.height, + position: 'relative' +}) + +const calcColors = (data) => (data.length <= 10 ? SAAS_DEFAULT_COLORS_10 : SAAS_DEFAULT_COLORS_18) + +export const computedChartColor = (props) => () => { + let defaultColors = DEFAULT_COLORS + let { data } = props + const { extend } = props + + if (data && Array.isArray(data.rows)) { + defaultColors = calcColors(data.rows) + } else if (Array.isArray(data)) { + defaultColors = calcColors(data) + } else if (extend && Array.isArray(extend.series)) { + defaultColors = calcColors(extend.series) + } else if (extend && extend.series && Array.isArray(extend.series.data)) { + defaultColors = calcColors(extend.series.data) + } + + return props.colors || (props.theme && props.theme.color) || defaultColors +} + +export const dataHandler = ({ api, props, state, echartsLib, t, vm }) => () => { + if (!api.chartHandler) { + return + } + + let data = props.data + let isBoxplot = false + + if (vm.prepareBoxplotData && Array.isArray(data)) { + isBoxplot = true + const obj = vm.prepareBoxplotData(data) + + data = { + columns: obj.axisData, + rows: obj.boxData, + outliers: obj.outliers + } + } + + let { columns = [], rows = [] } = data + + const extra = { + tooltipVisible: props.tooltipVisible, + legendVisible: props.legendVisible, + echarts: state.echarts, + color: state.chartColor, + tooltipFormatter: props.tooltipFormatter, + _once: state.once, + echartsLib, + t, + vm + } + + columns = htmlHandler(columns) + rows = htmlHandler(rows) + + if (isBoxplot) { + extra.outliers = data.outliers + } + + if (props.beforeConfig) { + data = props.beforeConfig(data) + } + + let options = api.chartHandler(columns, rows, props.settings, extra) + + if (options) { + if (typeof options.then === 'function') { + options.then(api.optionsHandler) + } else { + api.optionsHandler(options) + } + } +} + +export const nextTickResize = ({ api, nextTick }) => () => nextTick(api.resize) + +export const resize = ({ props, vm, api }) => () => { + if (!props.cancelResizeCheck) { + if (vm.$el && vm.$el.clientWidth && vm.$el.clientHeight) { + api.echartsResize() + } + } else { + api.echartsResize() + } +} + +export const echartsResize = (state) => () => state.echarts && state.echarts.resize() + +const setOptionsLegend = ({ props, options }) => { + if (props.legendPosition && options.legend) { + options.legend[props.legendPosition] = 10 + + if (~['left', 'right'].indexOf(props.legendPosition)) { + options.legend.top = 'middle' + options.legend.orient = 'vertical' + } + } +} + +const selfSetting = ({ props, options }) => { + ECHARTS_SETTINGS.forEach((setting) => { + if (props[setting]) { + options[setting] = props[setting] + } + }) +} + +const applyMarks = ({ props, options }) => { + if (props.markArea || props.markLine || props.markPoint) { + const marks = { + markArea: props.markArea, + markLine: props.markLine, + markPoint: props.markPoint + } + + const series = options.series + + if (Array.isArray(series)) { + series.forEach((item) => { + setMark(item, marks) + }) + } else if (isObject(series)) { + setMark(series, marks) + } + } +} + +const afterConfig = ({ props, options }) => { + if (props.afterConfig) { + options = props.afterConfig(options) + } + + return options +} + +const mapChartNotMerge = (props) => { + let setOptionOpts = props.setOptionOpts + + if ((props.settings.bmap || props.settings.amap) && !isObject(setOptionOpts)) { + setOptionOpts = false + } + + return setOptionOpts +} + +const afterSetOption = ({ props, state, options, echartsLib }) => { + if (props.afterSetOption) { + props.afterSetOption(state.echarts, options, echartsLib) + } +} + +const afterSetOptionOnce = ({ props, state, options, echartsLib }) => { + if (props.afterSetOptionOnce && !state.once.afterSetOptionOnce) { + state.once.afterSetOptionOnce = true + props.afterSetOptionOnce(state.echarts, options, echartsLib) + } +} + +export const judgeWidthHandler = ({ props, api, vm, nextTick }) => () => { + if (!props.judgeWidth) { + return + } + + if (vm.$el.clientWidth || vm.$el.clientHeight) { + api.resize() + } else { + nextTick(() => { + if (vm.$el.clientWidth || vm.$el.clientHeight) { + api.resize() + } else { + setTimeout(() => { + api.resize() + }, props.widthChangeDelay) + } + }) + } +} + +const setOption = ({ state, options, setOptionOpts, emit, api, props, echartsLib }) => { + state.echarts.setOption(options, setOptionOpts) + emit('ready', state.echarts, options, echartsLib) + if (!state.once['ready-once']) { + state.once['ready-once'] = true + emit('ready-once', state.echarts, options, echartsLib) + } + api.judgeWidthHandler(options) + afterSetOption({ props, state, options, echartsLib }) + afterSetOptionOnce({ props, state, options, echartsLib }) +} + +export const optionsHandler = ({ props, state, emit, echartsLib, api, vm }) => (options) => { + if (options.tooltip) { + const defaultTooltip = DEFAULT_CONFIG.tooltip || {} + options.tooltip = { ...defaultTooltip, ...options.tooltip } + } + if (options.legend) { + const defaultLegend = DEFAULT_CONFIG.legend || {} + options.legend = { ...defaultLegend, ...options.legend } + } + setOptionsLegend({ props, options }) + options.color = state.chartColor + selfSetting({ props, options }) + setAnimation({ options, animation: props.animation }) + applyMarks({ props, options }) + if (props.extend) { + setExtend({ options, extend: props.extend }) + options.series.label = { show: false, ...options.series.label } + options.series.radius = ['25%', '100%'] + } + options = afterConfig({ props, options }) + let setOptionOpts = mapChartNotMerge(props) + if (props.notSetUnchange && props.notSetUnchange.length) { + props.notSetUnchange.forEach((item) => { + const value = options[item] + if (value) { + if (isEqual(value, state.store[item])) { + options[item] = undefined + } else { + state.store[item] = cloneDeep(value) + } + } + }) + if (isObject(setOptionOpts)) { + setOptionOpts.notMerge = false + } else { + setOptionOpts = false + } + } + if (vm._isDestroyed) { + return + } + setOption({ state, options, setOptionOpts, emit, api, props, echartsLib }) +} + +export const resizeableHandler = ({ api, state }) => (resizeable) => { + if (resizeable && !state.once.onresize) { + api.addResizeListener() + } + + if (!resizeable && state.once.onresize) { + api.removeResizeListener() + } +} + +export const init = ({ state, props, api, refs, echartsLib, markRaw }) => () => { + if (state.echarts) { + return + } + + const ictThemeName = {} + const { settings } = props + if (settings.line) { + ictThemeName.line = settings.line + } + + const themeName = props.themeName || props.theme || DEFAULT_THEME + state.echarts = markRaw(echartsLib.init(refs.canvas, themeName, { ...themeName, ...ictThemeName }, props.initOptions)) + + if (props.data) { + api.changeHandler() + } + + api.createEventProxy() + + if (props.resizeable) { + api.addResizeListener() + } +} + +export const addResizeListener = ({ state, api }) => () => { + on(window, 'resize', api.resizeHandler) + state.once.onresize = true +} + +export const removeResizeListener = ({ state, api }) => () => { + off(window, 'resize', api.resizeHandler) + state.once.onresize = false +} + +export const addWatchToProps = ({ props, watch, api }) => () => { + Object.keys(props).forEach((prop) => { + if (!~STATIC_PROPS.indexOf(prop)) { + const opts = {} + + if (~['[object Object]', '[object Array]'].indexOf(getType(props[prop]))) { + opts.deep = true + } else { + opts.immediate = true + } + + watch( + () => prop, + () => { + api.changeHandler() + }, + opts + ) + } + }) +} + +/* + * 只要用户使用 on 方法绑定的事件都做一层代理, + * 是否真正执行相应的事件方法取决于该方法是否仍然存在 events 中 + * 实现 events 的动态响应 + */ +export const createEventProxy = ({ props, state }) => () => { + const keys = Object.keys(props.events || {}) + + keys.length && + keys.forEach((event) => { + if (!state.registeredEvents.includes(event)) { + state.registeredEvents.push(event) + + state.echarts.on( + event, + ((event) => (...args) => { + if (event in props.events) { + props.events[event].apply(null, args) + } + })(event) + ) + } + }) +} + +export const themeChange = ({ api, state }) => () => { + api.clean() + state.echarts = null + api.init() +} + +export const clean = ({ props, state, api }) => () => { + if (props.resizeable) { + api.removeResizeListener() + } + + state.echarts.dispose() +} + +export const watchOnMounted = ({ api, vm, watch, props, t }) => { + watch( + () => props.data, + (value) => value && api.changeHandler(), + { deep: true } + ) + + watch( + () => props.settings, + (value) => { + if (value.type && vm.chartLib) { + api.chartHandler = vm.chartLib[value.type] + } + + api.changeHandler() + }, + { deep: true } + ) + + watch( + () => [props.width, props.height], + () => api.nextTickResize() + ) + + watch( + () => props.events, + () => api.createEventProxy(), + { deep: true } + ) + + watch( + () => [props.theme, props.themeName], + () => api.themeChange() + ) + + watch( + () => props.resizeable, + () => api.resizeableHandler() + ) + + // NEXT 。。 + watch( + () => t('ui.chart.emptyText'), + () => api.changeHandler() + ) + + watch( + () => props.extend, + () => api.changeHandler(), + { deep: true } + ) +} + +export const mounted = ({ state, api, vm, props, watch, t }) => () => { + state.echarts = null + state.registeredEvents = [] + state.once = {} + state.store = {} + + api.chartHandler = vm.chartHandler + api.resizeHandler = debounce(api.resize, props.resizeDelay) + api.changeHandler = debounce(api.dataHandler, props.changeDelay) + + api.addWatchToProps() + api.init() + watchOnMounted({ watch, props, api, vm, t }) +} + +export const changeHandler = ({ api, props }) => () => debounce(api.dataHandler, props.changeDelay) + +export const resizeHandler = ({ api, props }) => () => debounce(api.resize, props.resizeDelay) diff --git a/packages/renderless/src/chart-core/modules/animation.ts b/packages/renderless/src/chart-core/modules/animation.ts new file mode 100644 index 000000000..c74f9e2c4 --- /dev/null +++ b/packages/renderless/src/chart-core/modules/animation.ts @@ -0,0 +1,21 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default ({ options, animation }) => { + if (!animation) { + return + } + + Object.keys(animation).forEach((key) => { + options[key] = animation[key] + }) +} diff --git a/packages/renderless/src/chart-core/modules/extend.ts b/packages/renderless/src/chart-core/modules/extend.ts new file mode 100644 index 000000000..078b7ec73 --- /dev/null +++ b/packages/renderless/src/chart-core/modules/extend.ts @@ -0,0 +1,46 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { set, isObject, merge } from '../deps/utils' + +const isArr = Array.isArray + +export default ({ options, extend }) => { + if (!extend) { + return + } + + Object.keys(extend).forEach((key) => { + const value = extend[key] + + if (~key.indexOf('.')) { + set(options, key, value) + } else if (typeof value === 'function') { + options[key] = value(options[key]) + } else if (isArr(options[key]) && isArr(value)) { + const attrList = ['series', 'yAxis', 'xAxis', 'color', 'dataZoom', 'legend', 'toolbox', 'grid', 'graphic', 'timeline', 'visualMap', 'brush'] + if (~attrList.indexOf(key)) { + options[key] = merge(options[key], value) + } + } else { + if (isArr(options[key]) && isObject(options[key][0])) { + options[key].forEach((option, i) => (options[key][i] = { ...option, ...value })) + } else if (isObject(options[key])) { + let optionBase = options[key] + + options[key] = { ...optionBase, ...value } + } else { + options[key] = value + } + } + }) +} diff --git a/packages/renderless/src/chart-core/modules/mark.ts b/packages/renderless/src/chart-core/modules/mark.ts new file mode 100644 index 000000000..a241d3585 --- /dev/null +++ b/packages/renderless/src/chart-core/modules/mark.ts @@ -0,0 +1,19 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default (seriesItem, marks) => { + Object.keys(marks).forEach((key) => { + if (marks[key]) { + seriesItem[key] = marks[key] + } + }) +} diff --git a/packages/renderless/src/chart-core/vue.ts b/packages/renderless/src/chart-core/vue.ts new file mode 100644 index 000000000..56f9571a0 --- /dev/null +++ b/packages/renderless/src/chart-core/vue.ts @@ -0,0 +1,102 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + computedCanvasStyle, + computedChartColor, + dataHandler, + nextTickResize, + resize, + echartsResize, + optionsHandler, + judgeWidthHandler, + resizeableHandler, + init, + addResizeListener, + removeResizeListener, + addWatchToProps, + createEventProxy, + themeChange, + clean, + mounted, + changeHandler, + resizeHandler +} from './index' +import { camelToKebab } from './deps/utils' + +export const api = [ + 'state', + 'camelToKebab', + 'dataHandler', + 'nextTickResize', + 'resize', + 'echartsResize', + 'optionsHandler', + 'judgeWidthHandler', + 'resizeableHandler', + 'init', + 'addResizeListener', + 'removeResizeListener', + 'addWatchToProps', + 'createEventProxy', + 'themeChange', + 'clean', + 'mounted', + 'changeHandler', + 'resizeHandler' +] + +export const renderless = (props, { computed, onBeforeUnmount, onMounted, reactive, watch, markRaw }, { t, vm, refs, emit, nextTick }, { echartsLib }) => { + let api = {} + const state = reactive({ + chartColor: computed(() => api.computedChartColor()), + canvasStyle: computed(() => api.computedCanvasStyle()) + }) + + api = { + state, + camelToKebab, + computedChartColor: computedChartColor(props), + computedCanvasStyle: computedCanvasStyle(props) + } + + onMounted(() => api.mounted()) + onBeforeUnmount(() => api.clean()) + + return Object.assign(api, { + resize: resize({ props, vm, api }), + echartsResize: echartsResize(state), + clean: clean({ props, state, api }), + themeChange: themeChange({ api, state }), + changeHandler: changeHandler({ api, props }), + resizeHandler: resizeHandler({ api, props }), + nextTickResize: nextTickResize({ api, nextTick }), + init: init({ state, props, api, refs, echartsLib, markRaw }), + createEventProxy: createEventProxy({ api, props, state }), + addResizeListener: addResizeListener({ state, api }), + resizeableHandler: resizeableHandler({ api, state }), + mounted: mounted({ api, state, vm, props, watch, t }), + removeResizeListener: removeResizeListener({ state, api }), + addWatchToProps: addWatchToProps({ vm, props, watch, api }), + dataHandler: dataHandler({ api, props, state, echartsLib, t, vm }), + judgeWidthHandler: judgeWidthHandler({ props, api, vm, nextTick }), + + optionsHandler: optionsHandler({ + props, + state, + emit, + echartsLib, + api, + vm + }) + }) +} diff --git a/packages/renderless/src/chart-funnel/index.ts b/packages/renderless/src/chart-funnel/index.ts new file mode 100644 index 000000000..274c09eb6 --- /dev/null +++ b/packages/renderless/src/chart-funnel/index.ts @@ -0,0 +1,110 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getFormated } from '@opentiny/vue-renderless/chart-core/deps/utils' +import { itemPoint, itemLabel, itemContent } from '@opentiny/vue-renderless/chart-core/deps/constants' +import { isNull } from '@opentiny/vue-renderless/common/type' + +const getFunnelTooltip = (dataType, digit) => { + function formatter(item) { + let tpl = [] + tpl.push(itemPoint(item.color)) + + tpl.push(`${itemLabel(item.name)}${itemContent(getFormated(item.data.realValue, dataType, digit))}`) + + return tpl.join('') + } + + return { trigger: 'item', formatter } +} + +const getFunnelLegend = (args) => { + const { data, legendName } = args + + function formatter(name) { + return isNull(legendName[name]) ? name : legendName[name] + } + + return { data, formatter } +} + +const getFunnelSeries = (args) => { + const { ascending, dimension, itemStyle, label, labelLine, metrics, rows, sequence, useDefaultOrder } = args + let { series = { type: 'funnel' }, falseFunnel = false } = {} + + series.minSize = 8 + + let innerRows = rows.sort((a, b) => sequence.indexOf(a[dimension]) - sequence.indexOf(b[dimension])) + + innerRows.some((row, index) => index && row[metrics] > innerRows[index - 1][metrics] && (falseFunnel = true)) + + const step = 100 / innerRows.length + + if (falseFunnel && !useDefaultOrder) { + const handler = (row, index) => ({ name: row[dimension], value: (index + 1) * step, realValue: row[metrics] }) + + series.data = innerRows.slice().reverse().map(handler) + } else { + series.data = innerRows.map((row) => ({ name: row[dimension], value: row[metrics], realValue: row[metrics] })) + } + + let total = 0 + rows.forEach((row) => { + total += row[metrics] + }) + series.label = { + position: 'inside', + color: '#fff', + formatter(item) { + let { value } = item + return `${Number(value / total).toFixed(2) * 100}%` + } + } + + ascending && (series.sort = 'ascending') + label && (series.label = label) + labelLine && (series.labelLine = labelLine) + itemStyle && (series.itemStyle = itemStyle) + + return series +} + +export const funnel = (outerColumns, outerRows, settings, extra) => { + const { columns = outerColumns.slice(), rows = outerRows.slice() } = {} + const { dataType = 'normal', dimension = columns[0], sequence = rows.map((row) => row[dimension]) } = settings + const { digit = 2, ascending, label, labelLine, legendName = {}, itemStyle, filterZero, useDefaultOrder } = settings + const { tooltipVisible, legendVisible } = extra + let metrics + + if (settings.metrics) { + metrics = settings.metrics + } else { + let temp = columns.slice() + + temp.splice(columns.indexOf(dimension), 1) + metrics = temp[0] + } + + let innerRows = rows.sort((a, b) => sequence.indexOf(a[dimension]) - sequence.indexOf(b[dimension])) + + filterZero && (innerRows = innerRows.filter((row) => row[metrics])) + + const tooltip = tooltipVisible && getFunnelTooltip(dataType, digit) + const legend = legendVisible && getFunnelLegend({ data: innerRows.map((row) => row[dimension]), legendName }) + const seriesParam = { dimension, metrics, rows: innerRows, sequence, ascending } + + Object.assign(seriesParam, { label, labelLine, itemStyle, filterZero, useDefaultOrder }) + + const series = getFunnelSeries(seriesParam) + + return { tooltip, legend, series } +} diff --git a/packages/renderless/src/chart-gauge/index.ts b/packages/renderless/src/chart-gauge/index.ts new file mode 100644 index 000000000..5c12ed894 --- /dev/null +++ b/packages/renderless/src/chart-gauge/index.ts @@ -0,0 +1,104 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getFormated, isObject } from '@opentiny/vue-renderless/chart-core/deps/utils' +import { isNull } from '@opentiny/vue-renderless/common/type' +import { itemLabel, itemContent } from '@opentiny/vue-renderless/chart-core/deps/constants' + +const getTooltip = (args) => { + const { dataType, digit, tooltipFormatter } = args + + return { + formatter(options) { + if (tooltipFormatter) { + return tooltipFormatter.apply(null, arguments) + } + + const tpl = [] + const { seriesName, data } = options + const { value, name } = data + + tpl.push(`${itemLabel(seriesName)}`) + tpl.push(`${itemContent(getFormated(value, dataType[seriesName], digit))} ${name}`) + + return tpl.join('') + } + } +} + +const getPoint = () => ({ + show: false, + width: 10, + length: 10, + icon: 'path://M511.999488 819.413462 72.8374 204.586538 951.1626 204.586538Z', + offsetCenter: [0, '-106%'], + itemStyle: { color: 'auto' } +}) + +function getSeries(args) { + const { dataName, dataType, digit, dimension, labelMap, metrics, rows, seriesMap } = args + + const series = rows.map((row) => { + const label = row[dimension] + const seriesItem = seriesMap[label] + + const formatter2 = function (value) { + return getFormated(value, dataType[label], digit) + } + + const result = { + type: 'gauge', + name: !isNull(labelMap[label]) ? labelMap[label] : label, + data: [{ name: dataName[label] || '', value: row[metrics] }], + detail: { + fontSize: 60, + color: '#191919', + offsetCenter: [0, 0], + valueAnimation: true, + formatter: !dataType + ? '{value}' + : (value) => { + const res = getFormated(value, dataType[label], digit) + return dataType[label] === 'percent' ? res.split('%')[0] + '{percent|%}' : res + }, + rich: { percent: { fontSize: 12, color: '#4e4e4e', padding: [0, 0, -20, 0] } } + }, + axisLabel: { formatter: formatter2 }, + itemStyle: { color: '#6D8FF0' }, + pointer: getPoint(), + axisLine: { roundCap: true }, + progress: { show: true, roundCap: true, width: 8, color: '#6D8FF0' }, + axisTick: { show: false }, + splitLine: { length: 8, distance: 0, lineStyle: { width: 1, color: 'rgba(25,25,25,0.10)' } }, + title: { offsetCenter: [0, '25%'], color: '#191919', fontSize: 14 } + } + + if (seriesItem) { + Object.keys(seriesItem).forEach((key) => (isObject(result[key]) ? Object.assign(result[key], seriesItem[key]) : (result[key] = seriesItem[key]))) + } + + return result + }) + + return series +} + +export const gauge = (columns, rows, settings, extra) => { + const { dataName = {}, dataType = {}, digit = 2, labelMap = {} } = settings + const { dimension = columns[0], metrics = columns[1], seriesMap = {} } = settings + const { tooltipFormatter, tooltipVisible } = extra + const tooltip = tooltipVisible && getTooltip({ tooltipFormatter, dataType }) + const seriesParams = { rows, dimension, metrics, digit, dataType, labelMap, seriesMap, dataName } + const series = getSeries(seriesParams) + + return { tooltip, series } +} diff --git a/packages/renderless/src/chart-graph/index.ts b/packages/renderless/src/chart-graph/index.ts new file mode 100644 index 000000000..18077dc7a --- /dev/null +++ b/packages/renderless/src/chart-graph/index.ts @@ -0,0 +1,39 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { itemPoint, itemLabel, itemContent } from '@opentiny/vue-renderless/chart-core/deps/constants' + +const getTooltip = () => ({ + trigger: 'item', + formatter(item) { + const tpl = [] + const { name, value, color, dataType } = item + + color && tpl.push(itemPoint(color)) + tpl.push(itemLabel(`${name}`, !value)) + if (dataType === 'node') { + value && tpl.push(`${itemContent(value)}
    `) + } + + return tpl.join('') + } +}) + +const getGraphSeries = () => [{ type: 'graph', label: { textBorderWidth: 1, color: '#fff', textBorderColor: 'inherit' } }] + +export const graph = (columns, rows, settings, extra) => { + const { tooltipVisible } = extra + const tooltip = tooltipVisible && getTooltip({}) + const series = getGraphSeries() + + return { tooltip, series } +} diff --git a/packages/renderless/src/chart-heatmap/index.ts b/packages/renderless/src/chart-heatmap/index.ts new file mode 100644 index 000000000..7347a8958 --- /dev/null +++ b/packages/renderless/src/chart-heatmap/index.ts @@ -0,0 +1,224 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getFormated, getBmap, getAmap, getMapJSON } from '@opentiny/vue-renderless/chart-core/deps/utils' +import { HEAT_MAP_COLOR, itemPoint, itemLabel, itemContent } from '@opentiny/vue-renderless/chart-core/deps/constants' + +const getAxisList = (rows, label) => { + const result = [] + + rows.forEach((row) => !result.includes(row[label]) && result.push(row[label])) + + return result +} + +const getData = (args) => { + const { extraMetrics, innerXAxisList, innerYAxisList, metrics, rows, type, xDim, yDim } = args + let result = null + + if (type !== 'cartesian') { + result = rows.map((row) => ({ value: [row[xDim], row[yDim], metrics ? row[metrics] : 1] })) + } else { + result = rows.map((row) => { + let { xIndex, yIndex, value, extra } = {} + + yIndex = innerYAxisList.indexOf(row[yDim]) + xIndex = innerXAxisList.indexOf(row[xDim]) + extra = extraMetrics.map((m) => row[m] || '-') + value = metrics ? row[metrics] : 1 + + return { value: [xIndex, yIndex, value].concat(extra), label: { show: true, color: '#191919' } } + }) + } + + return result +} + +let getAxis = (list, name, type) => ({ + data: list, + name, + nameLocation: 'end', + type: 'category', + splitArea: { show: false }, + splitLine: { show: true, lineStyle: { color: '#6d8ff0' } }, + axisLabel: { show: true, color: '#4E4E4E' }, + offset: type === 'y' ? 25 : 5, + zlevel: 1 +}) + +const getVisualMap = (args) => { + const { innerMin: min, innerMax: max, type, heatColor, series } = args + let { extra } = {} + + if (type === 'map') { + extra = {} + !series[0].data.length && (extra.show = false) + } else if (type === 'bmap' || type === 'amap') { + extra = { show: false } + } else { + extra = { dimension: 2 } + } + + const defaultColor = type === 'map' || type === 'bmap' || type === 'amap' ? HEAT_MAP_COLOR : ['#fff', '#6D8FF0'] + + return Object.assign(extra, { + min, + max, + calculable: true, + left: 'right', + bottom: 'center', + orient: 'vertical', + align: 'left', + borderColor: '#6D8FF0', + inverse: true, + inRange: { color: heatColor || defaultColor } + }) +} + +const getSeries = (args) => [{ type: 'heatmap', data: args.chartData }] + +const getTooltip = (args) => { + const { dataType, innerXAxisList, innerYAxisList, digit, extraMetrics, metrics } = args + + function formatter({ color, data }) { + let { value: dataVal } = data + let [xDim, yDim, value, ...extraData] = dataVal + const tplt = [itemContent(`${innerXAxisList[xDim]} ~ ${innerYAxisList[yDim]}
    `)] + + extraMetrics.forEach((m, index) => tplt.push(`${m}: ${extraData[index]}
    `)) + + tplt.push(`${itemPoint(color)}${itemLabel(metrics)}${itemContent(getFormated(value, dataType, digit))}
    `) + + return tplt.join('') + } + + return { trigger: 'item', formatter } +} + +const fixParam = ({ type, rows, dimension, metrics, extraMetrics, chartData, innerXAxisList, innerYAxisList }) => { + let chartDataParams + + if (type !== 'cartesian') { + chartDataParams = { rows, xDim: dimension[0], yDim: dimension[1] } + + Object.assign(chartDataParams, { metrics, type, extraMetrics }) + + chartData = getData(chartDataParams) + } else { + let flag = !innerXAxisList || !innerXAxisList.length + + flag && (innerXAxisList = getAxisList(rows, dimension[0])) + + flag = !innerYAxisList || !innerYAxisList.length + + flag && (innerYAxisList = getAxisList(rows, dimension[1])) + + chartDataParams = { xDim: dimension[0], yDim: dimension[1], rows } + + Object.assign(chartDataParams, { innerXAxisList, innerYAxisList, metrics, type, extraMetrics }) + + chartData = getData(chartDataParams) + } + + return { chartData, innerXAxisList, innerYAxisList } +} + +const getResult = (args) => { + let { type, options, pointSize, blurSize, res, key, v, bmap, mapOrigin, geo, beforeRegisterMap } = args + let { echarts, specialAreas, position, positionJsonLink, beforeRegisterMapOnce } = args + let { mapURLProfix, amap, tooltip, xAxis, yAxis } = args + + if (type === 'bmap') { + Object.assign(options.series[0], { coordinateSystem: 'bmap', pointSize, blurSize }) + + res = getBmap(key, v).then(() => ({ bmap, ...options })) + } else if (type === 'map') { + options.series[0].coordinateSystem = 'geo' + let json = mapOrigin + + if (json) { + const geoAttr = { map: mapOrigin, ...geo } + + beforeRegisterMap && (json = beforeRegisterMap(json)) + + echarts.registerMap(mapOrigin, json, specialAreas) + + res = new Promise((resolve) => resolve({ geo: geoAttr, ...options })) + } else { + let params = { position, positionJsonLink, beforeRegisterMapOnce, mapURLProfix } + + res = getMapJSON(params).then((json) => { + const geoAttr = { map: position, ...geo } + + beforeRegisterMap && (json = beforeRegisterMap(json)) + + echarts.registerMap(position, json, specialAreas) + + return { geo: geoAttr, ...options } + }) + } + } else if (type === 'amap') { + Object.assign(options.series[0], { coordinateSystem: 'amap', pointSize, blurSize }) + + res = getAmap(key, v).then(() => ({ amap, ...options })) + } else { + res = { tooltip, xAxis, yAxis, ...options } + } + + return res +} + +export const heatmap = (columns, rows, settings, extra) => { + const { type = 'cartesian' } = settings // cartesian, map, bmap, + const { dimension = [columns[0], columns[1]] } = settings + const { dataType = 'normal', min, max, digit, bmap, amap, geo, key, v = '2.0' } = settings + const { position, mapOrigin, positionJsonLink, beforeRegisterMap, pointSize = 10, blurSize = 5 } = settings + const { heatColor, yAxisName, xAxisName, beforeRegisterMapOnce, specialAreas = {} } = settings + const { metrics = columns[2], mapURLProfix = 'https://unpkg.com/echarts@3.6.2/map/json/' } = settings + const { tooltipVisible, echartsLib: echarts } = extra + + let { xAxisList: innerXAxisList, yAxisList: innerYAxisList } = settings + // add extraMetrics prop for data which only display in tooltip + let { chartData = [], extraMetrics = [], mainColumn = dimension.concat([metrics]) } = {} + + columns.forEach((column) => !~mainColumn.indexOf(column) && extraMetrics.push(column)) + + let ret = fixParam({ type, rows, dimension, metrics, extraMetrics, chartData, innerXAxisList, innerYAxisList }) + + chartData = ret.chartData + innerXAxisList = ret.innerXAxisList + innerYAxisList = ret.innerYAxisList + + let metricsList = metrics ? rows.map((row) => row[metrics]) : [0, 5] + + !metricsList.length && (metricsList = [0]) + + const innerMin = min || Math.min.apply(null, metricsList) + const innerMax = max || Math.max.apply(null, metricsList) + const xAxis = getAxis(innerXAxisList, xAxisName, 'x') + const yAxis = getAxis(innerYAxisList, yAxisName, 'y') + const series = getSeries({ chartData }) + const visualMap = getVisualMap({ innerMin, innerMax, type, heatColor, series }) + const tooltipParams = { dataType, innerXAxisList, innerYAxisList, digit, extraMetrics, metrics } + const tooltip = tooltipVisible && getTooltip(tooltipParams) + const options = { visualMap, series, grid: { left: 25, right: 80, width: 'auto', height: 'auto' } } + + let res + let args = { type, options, pointSize, blurSize, res, key, v, bmap, mapOrigin, geo, beforeRegisterMap } + + Object.assign(args, { echarts, specialAreas, position, positionJsonLink, beforeRegisterMapOnce }) + Object.assign(args, { mapURLProfix, amap, tooltip, xAxis, yAxis }) + + res = getResult(args) + + return res +} diff --git a/packages/renderless/src/chart-line/index.ts b/packages/renderless/src/chart-line/index.ts new file mode 100644 index 000000000..5f5d3f940 --- /dev/null +++ b/packages/renderless/src/chart-line/index.ts @@ -0,0 +1,221 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getFormated, getStackMap, getLegend, hexToRgb, set } from '@opentiny/vue-renderless/chart-core/deps/utils' +import { isNull } from '@opentiny/vue-renderless/common/type' +import { itemPoint, itemLabel, itemContent, SAAS_DEFAULT_COLORS_10 } from '@opentiny/vue-renderless/chart-core/deps/constants' + +const getLineXAxis = (args) => { + const { xAxisType, dimension, rows, xAxisName, axisVisible } = args + + return dimension.map((item, idx) => ({ + nameLocation: 'middle', + type: xAxisType, + name: xAxisName[idx] || '', + nameGap: 22, + show: axisVisible, + data: rows.map((row) => row[item]), + axisTick: { show: true, lineStyle: { color: '#191919', opacity: 0.1, width: 2 }, alignWithLabel: true }, + axisLine: { show: true, lineStyle: { color: '#191919', opacity: 0.1, width: 2 } }, + axisPointer: { show: true, type: 'line', lineStyle: { color: '#191919', opacity: 0.3, type: 'solid' } } + })) +} + +const getAreaSeries = ({ color, seriesItem }) => { + const colorStops = [ + { offset: 0, color: `rgba(${hexToRgb(color)}, 0.5)` }, + { offset: 1, color: `rgba(${hexToRgb(color)}, 0.1)` } + ] + + seriesItem.areaStyle = { color: { type: 'linear', x: 0, y: 0, x2: 0, y2: 1, colorStops } } +} + +const setSingLineSeries = ({ defaultSeriesItem, seriesItem }) => { + // 单条折线 + defaultSeriesItem.showSymbol = true + set(defaultSeriesItem, 'emphasis.itemStyle.color', SAAS_DEFAULT_COLORS_10[0]) + seriesItem.label = { show: true, ...seriesItem.label } + seriesItem.itemStyle = { color: 'transparent', ...seriesItem.itemStyle } + seriesItem.lineStyle = { color: SAAS_DEFAULT_COLORS_10[0], ...seriesItem.lineStyle } + seriesItem.animation = seriesItem.animation || false +} + +const getLineSeries = (args) => { + const { areaStyle, axisSite, area, dimension, itemStyle, label } = args + const { labelMap, lineStyle, metrics, nullAddZero, rows, stack, color, smooth } = args + + const dataTempObj = {} + const stackMapData = stack && getStackMap(stack) + let series = [] + + metrics.forEach((item) => (dataTempObj[item] = [])) + + rows.forEach((row) => { + metrics.forEach((item) => { + let value = null + + if (!isNull(row[item])) { + value = row[item] + } else if (nullAddZero) { + value = 0 + } + + dataTempObj[item].push([row[dimension[0]], value]) + }) + }) + + metrics.forEach((item, i) => { + let name = !isNull(labelMap[item]) ? labelMap[item] : item + const isSmooth = !(smooth === false) + let seriesItem = { smooth: isSmooth, name, type: 'line', data: dataTempObj[item] } + + const emphasis = { itemStyle: { borderColor: '#fff', borderWidth: 2 } } + let defaultSeriesItem = { symbol: 'circle', symbolSize: 8, showSymbol: false, emphasis } + + area && getAreaSeries({ color: color[i], seriesItem }) + metrics.length === 1 && !isSmooth && setSingLineSeries({ defaultSeriesItem, seriesItem }) + + seriesItem = Object.assign(defaultSeriesItem, seriesItem) + + axisSite.right && (seriesItem.yAxisIndex = ~axisSite.right.indexOf(item) ? 1 : 0) + stack && stackMapData[item] && (seriesItem.stack = stackMapData[item]) + label && (seriesItem.label = label) + itemStyle && (seriesItem.itemStyle = itemStyle) + lineStyle && (seriesItem.lineStyle = lineStyle) + areaStyle && (seriesItem.areaStyle = areaStyle) + + series.push(seriesItem) + }) + + return series +} + +const getLineYAxis = (args) => { + const { yAxisType, yAxisName, scale, axisVisible, max, min, digit } = args + + const yAxisBase = { + type: 'value', + show: axisVisible, + axisTick: { + show: false + } + } + + let yAxis = [] + + for (let k = 0; k < 2; k++) { + if (yAxisType[k]) { + yAxis[k] = { + ...yAxisBase, + axisLabel: { + formatter(val) { + return getFormated(val, yAxisType[k], digit) + } + } + } + } else { + yAxis[k] = { ...yAxisBase } + } + + yAxis[k].name = yAxisName[k] || '' + yAxis[k].scale = scale[k] || false + yAxis[k].min = min[k] || null + yAxis[k].max = max[k] || null + } + + return yAxis +} + +const getLineTooltip = (args) => { + const { axisSite, yAxisType, digit, labelMap, tooltipFormatter } = args + const rightItemsArr = axisSite.right || [] + + const rightListArr = labelMap ? rightItemsArr.map((item) => (labelMap[item] === undefined ? item : labelMap[item])) : rightItemsArr + + return { + formatter(items) { + if (tooltipFormatter) { + return tooltipFormatter.apply(null, arguments) + } + + let template = [] + const { name, axisValueLabel } = items[0] + const title = name || axisValueLabel + + template.push(`${title}
    `) + + items.forEach(({ seriesName, data, color }) => { + if (color === 'transparent' && items.length === 1) { + color = SAAS_DEFAULT_COLORS_10[0] + } + let showData = null + + const type = ~rightListArr.indexOf(seriesName) ? yAxisType[1] : yAxisType[0] + + const itemData = Array.isArray(data) ? data[1] : data + showData = getFormated(itemData, type, digit) + + template.push(itemPoint(color)) + template.push(`${itemLabel(seriesName)}${itemContent(showData)}`) + template.push('
    ') + }) + + return template.join('') + }, + trigger: 'axis' + } +} + +export const line = (columns, rows, settings, extra) => { + rows = Array.isArray(rows) ? rows : [] + columns = Array.isArray(columns) ? columns : [] + + const { axisSite = {}, yAxisType = ['normal', 'normal'], xAxisType = 'category', yAxisName = [] } = settings + const { dimension = [columns[0]], xAxisName = [], axisVisible = true, area, stack } = settings + const { scale = [false, false], min = [null, null], max = [null, null], nullAddZero = false, digit = 2 } = settings + const { legendName = {}, labelMap = {}, label, itemStyle, lineStyle, areaStyle, smooth } = settings + + const { tooltipVisible, legendVisible, tooltipFormatter, color } = extra + let metrics = columns.slice() + + if (axisSite.right && axisSite.left) { + metrics = axisSite.left.concat(axisSite.right) + } else if (settings.metrics) { + metrics = settings.metrics + } else if (axisSite.left && !axisSite.right) { + metrics = axisSite.left + } else { + metrics.splice(columns.indexOf(dimension[0]), 1) + } + + let legendItemStyle + if (metrics.length === 1) { + legendItemStyle = { itemStyle: { color: SAAS_DEFAULT_COLORS_10[0] } } + } + + const legend = legendVisible && getLegend({ legendName, metrics, labelMap, legendItemStyle }) + + const tooltip = tooltipVisible && getLineTooltip({ axisSite, digit, labelMap, tooltipFormatter, xAxisType, yAxisType }) + + const xAxis = getLineXAxis({ axisVisible, dimension, xAxisName, xAxisType, rows }) + + const yAxis = getLineYAxis({ axisVisible, digit, max, min, scale, yAxisType, yAxisName }) + const seriesParam = { areaStyle, area, axisSite, dimension, itemStyle, lineStyle } + + Object.assign(seriesParam, { label, labelMap, metrics, nullAddZero, rows, xAxisType, stack, color, smooth }) + + const series = getLineSeries(seriesParam) + + let options = { legend, xAxis, series, yAxis, tooltip } + + return options +} diff --git a/packages/renderless/src/chart-liquidfill/index.ts b/packages/renderless/src/chart-liquidfill/index.ts new file mode 100644 index 000000000..5c2d3da90 --- /dev/null +++ b/packages/renderless/src/chart-liquidfill/index.ts @@ -0,0 +1,79 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getFormated, isObject } from '@opentiny/vue-renderless/chart-core/deps/utils' +import { itemLabel, itemContent } from '@opentiny/vue-renderless/chart-core/deps/constants' + +const isArr = Array.isArray + +const getTooltip = (args) => { + const { tooltipFormatter, dataType, digit } = args + function formatter(options) { + const { seriesName, value } = options + + if (!tooltipFormatter) { + return [`${itemLabel(seriesName)}`, itemContent(getFormated(value, dataType, digit))].join('') + } + + return tooltipFormatter.apply(null, arguments) + } + + return { show: true, formatter } +} + +const getSeries = (args) => { + const { dimension, metrics, rows, seriesMap, wave } = args + let itemWave = wave + let len = isArr(seriesMap) ? seriesMap.length : 0 + + return rows.slice().map((item, index) => { + let { data = [], result = { type: 'liquidFill' }, name = item[dimension] } = {} + let { val = Number(item[metrics]), itemMap = {} } = {} + + if (isArr(seriesMap)) { + itemMap = seriesMap[index] ? seriesMap[index] : seriesMap[len - 1] + } else if (isObject(seriesMap[name])) { + itemMap = seriesMap[name] + } + + if (isArr(wave) && isArr(wave[0])) { + itemWave = !isArr(wave[index]) ? wave[wave.length - 1] : wave[index] + } + + // 根据传入的数据(rows)和额外配置(seriesMap)的数据组合data + data.push({ value: val }) + + if (itemWave.length && itemWave) { + data = data.concat(itemWave.map((val) => ({ value: val }))) + } + + result.itemStyle = { shadowBlur: 0 } + result.label = { color: '#6D8FF0' } + result.backgroundStyle = { color: '#F4F3F9' } + result.outline = { itemStyle: { borderColor: '#6D8FF0', shadowBlur: 0 } } + !itemMap.color && (result.itemStyle = Object.assign(result.itemStyle, { color: '#6D8FF0' })) + + result = Object.assign(result, { data, name }, itemMap) + + return result + }) +} + +export const liquidfill = (columns, rows, settings, extra) => { + const { dimension = columns[0], metrics = columns[1] } = settings + const { seriesMap = {}, dataType = 'percent', digit = 2, wave = [] } = settings + const { tooltipVisible, tooltipFormatter } = extra + const tooltip = tooltipVisible && getTooltip({ tooltipFormatter, dataType, digit }) + const series = getSeries({ rows, columns, dimension, metrics, seriesMap, wave }) + + return { tooltip, series } +} diff --git a/packages/renderless/src/chart-map/index.ts b/packages/renderless/src/chart-map/index.ts new file mode 100644 index 000000000..ac7f162de --- /dev/null +++ b/packages/renderless/src/chart-map/index.ts @@ -0,0 +1,146 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getFormated, getMapJSON, getLegend as getLegendMap } from '@opentiny/vue-renderless/chart-core/deps/utils' +import { itemPoint, itemLabel, itemContent } from '@opentiny/vue-renderless/chart-core/deps/constants' +import { isNull } from '@opentiny/vue-renderless/common/type' + +const getTooltip = ({ dataType, digit, dataStore, metrics, color, labelMap }) => { + function formatter(item) { + let tplt = [] + + if (!item.name) { + return '' + } + + tplt.push(`${itemLabel(item.name)}
    `) + + metrics.forEach((label, index) => { + let title = isNull(labelMap[label]) ? label : labelMap[label] + + tplt.push(`${itemPoint(color[index])}${itemLabel(title)}`) + if (dataStore[item.name]) { + tplt.push(itemContent(getFormated(dataStore[item.name][label], dataType[label], digit))) + } else { + tplt.push(itemContent('-')) + } + tplt.push('
    ') + }) + + return tplt.join('') + } + + return { formatter } +} + +const setGeoLabel = (value, target, label) => { + if (typeof value === 'object') { + target[label] = value + } else if (value) { + target[label] = { show: true } + } +} + +const getSeries = (args) => { + let { position, selectData, dimension, metrics, rows, label, selectedMode, roam, center, aspectScale, zoom } = args + const { boundingCoords, labelMap, scaleLimit, mapGrid, itemStyle = { areaColor: 'rgba(25,25,25,0.05)' } } = args + const { result = [], mapBase = { type: 'map', map: position } } = {} + const { emphasis = { itemStyle: { areaColor: 'rgba(25,25,25,0.2)' }, label: { color: '#191919' } } } = {} + + metrics.forEach((itemName) => { + const name = !isNull(labelMap[itemName]) ? labelMap[itemName] : itemName + const data = [] + const itemResult = { name, data, selectedMode, roam, center, aspectScale, boundingCoords, zoom, scaleLimit, ...mapBase } + + if (mapGrid) { + Object.keys(mapGrid).forEach((key) => (itemResult[key] = mapGrid[key])) + } + + setGeoLabel(itemStyle, itemResult, 'itemStyle') + setGeoLabel(label, itemResult, 'label') + + rows.forEach((row) => itemResult.data.push({ name: row[dimension], value: row[itemName], selected: selectData })) + + itemResult.emphasis = emphasis + itemResult.label = { color: '#191919', ...itemResult.label } + + result.push(itemResult) + }) + + return result +} + +const registerMap = (args, mapOrigin, echarts) => { + const { _once, registerSign, beforeRegisterMap, beforeRegisterMapOnce } = args + const { registerSignOnce, position, specialAreas } = args + + if (!_once[registerSign] && beforeRegisterMap) { + mapOrigin = beforeRegisterMap(mapOrigin) + } + + if (!_once[registerSign] && beforeRegisterMapOnce && !_once[registerSignOnce]) { + _once[registerSignOnce] = true + mapOrigin = beforeRegisterMapOnce(mapOrigin) + } + + if (!_once[registerSign]) { + _once[registerSign] = true + echarts.registerMap(position, mapOrigin, specialAreas) + } +} + +export const map = (columns, rows, settings, extra) => { + const { position = '', selectData = false, selectedMode, label = true, dataType = {}, digit = 2 } = settings + const { dimension = columns[0], roam, center, aspectScale, boundingCoords, zoom } = settings + const { scaleLimit, legendName = {}, labelMap = {}, mapGrid, itemStyle, positionJsonLink, emphasis } = settings + const { beforeRegisterMap, beforeRegisterMapOnce, mapURLProfix = extra.baseUrl || '', specialAreas = {} } = settings + const { mapOrigin } = settings + + let metrics = columns.slice(0) + + if (!settings.metrics) { + metrics.splice(columns.indexOf(dimension), 1) + } else { + metrics = settings.metrics + } + + const { tooltipVisible, legendVisible, color, _once, echartsLib: echarts } = extra + const dataStore = {} + + rows.forEach((row) => (dataStore[row[dimension]] = row)) + + const tooltip = tooltipVisible && getTooltip({ dataType, digit, dataStore, metrics, color, labelMap }) + const legend = legendVisible && getLegendMap({ metrics, legendName, labelMap }) + const seriesParams = { position, selectData, label, itemStyle, dimension, metrics, rows, selectedMode, roam } + + Object.assign(seriesParams, { center, aspectScale, boundingCoords, zoom, labelMap, scaleLimit, mapGrid, emphasis }) + + const series = getSeries(seriesParams) + const registerSign = `MAP_REGISTER_${position}` + const registerSignOnce = `ONCE_MAP_REGISTER_${position}` + const registerOptions = { _once, beforeRegisterMap, beforeRegisterMapOnce, position } + + Object.assign(registerOptions, { specialAreas, registerSign, registerSignOnce }) + + if (mapOrigin) { + registerMap(registerOptions, mapOrigin, echarts) + + return { series, tooltip, legend } + } else { + const param = { position, positionJsonLink, beforeRegisterMapOnce, mapURLProfix } + + return getMapJSON(param).then((json) => { + registerMap(registerOptions, json, echarts) + return { series, tooltip, legend } + }) + } +} diff --git a/packages/renderless/src/chart-pie/index.ts b/packages/renderless/src/chart-pie/index.ts new file mode 100644 index 000000000..cdc539ce6 --- /dev/null +++ b/packages/renderless/src/chart-pie/index.ts @@ -0,0 +1,197 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getFormated, setArrayValue, cloneDeep } from '@opentiny/vue-renderless/chart-core/deps/utils' +import { itemPoint, itemLabel, itemContent } from '@opentiny/vue-renderless/chart-core/deps/constants' +import { isNull } from '@opentiny/vue-renderless/common/type' + +const pieRadius = 100 +const ringRadius = [90, 100] +const roseRingRadius = [20, 100] +const pieOffsetY = '50%' + +const modifySeries = ({ series, limitShowNum, t }) => { + let firstSerie = series[0] + + if (limitShowNum && limitShowNum < firstSerie.data.length) { + let firstSerieData = firstSerie.data + let remainArr = firstSerieData.slice(limitShowNum, firstSerieData.length) + let sum = 0 + + remainArr.forEach((item) => (sum += item.value)) + + firstSerie.data = firstSerieData.slice(0, limitShowNum) + firstSerie.data.push({ name: t('ui.chart.other'), value: sum }) + } +} + +const getPieSeries = (args) => { + const { dataType, digit, dimension, emphasis, innerRows, isRing, itemStyle, label, labelLine } = args + const { level, limitShowNum, metrics, offsetY, percentShow, radius, roseType, selectedMode, t } = args + + let { series = [], levelTemp = {}, rowsTemp = [] } = {} + + if (!level) { + rowsTemp.push(innerRows) + } else { + level.forEach((levelItems, index) => levelItems.forEach((item) => setArrayValue(levelTemp, item, index))) + + innerRows.forEach((row) => { + let itemLevel = levelTemp[row[dimension]] + + if (itemLevel && itemLevel.length) { + itemLevel.forEach((levelItem) => setArrayValue(rowsTemp, levelItem, row)) + } + }) + } + + let serieBase = { type: 'pie', selectedMode, emphasis, roseType, center: ['50%', offsetY] } + let rowsCount = rowsTemp.length + let centerWidth = radius / rowsCount + + rowsTemp.forEach((dataRows, index) => { + let serie = { data: [], ...serieBase } + + if (!index) { + serie.radius = isRing ? radius : centerWidth + } else { + let outerWidth = centerWidth + (radius / (2 * rowsCount)) * (2 * index - 1) + let innerWidth = outerWidth + radius / (2 * rowsCount) + + serie.radius = [outerWidth, innerWidth] + } + + rowsCount > 1 && index === 0 && (serie.label = { position: 'inner' }) + serie.label = { color: '#191919', ...label } + + serie.labelLine = { smooth: true, lineStyle: { color: '#bbb' }, ...labelLine } + + serie.itemStyle = { borderWidth: 2, borderColor: '#fff', ...itemStyle } + + if (percentShow) { + let position = rowsCount > 1 && index === 0 ? 'inner' : 'outside' + let formatter = function (item) { + let tplt = [] + + tplt.push(`${item.name}:`) + tplt.push(getFormated(item.value, dataType, digit)) + tplt.push(`(${item.percent}%)`) + + return tplt.join('') + } + + serie.label = { normal: { show: true, position, formatter } } + } + + serie.data = dataRows.map((row) => ({ name: row[dimension], value: row[metrics] })) + + series.push(serie) + }) + + modifySeries({ series, limitShowNum, t }) + + return series +} + +const getPieLegend = (args) => { + const { dimension, innerRows, legendLimit, legendName, level, limitShowNum, t } = args + let { legend = [], levelTemp = [] } = {} + + if (level) { + level.forEach((levelItem) => levelItem.forEach((item) => levelTemp.push(item))) + + legend = levelTemp + } else if (limitShowNum && limitShowNum < innerRows.length) { + for (let i = limitShowNum - 1; i >= 0; i--) { + legend.unshift(innerRows[i][dimension]) + } + + legend.push(t('ui.chart.other')) + } else { + legend = innerRows.map((row) => row[dimension]) + } + + if (legend.length) { + let show = legend.length < legendLimit + let formatter = function (name) { + return !isNull(legendName[name]) ? legendName[name] : name + } + + return { data: legend, show, formatter } + } else { + return false + } +} + +const getPieTooltip = (args) => { + const { dataType, digit, dimension, innerRows, limitShowNum, metrics, t } = args + let { localeOther = t('ui.chart.other'), remainArr, sum = 0 } = {} + let mapHandler = (row) => { + sum += row[metrics] + return { name: row[dimension], value: row[metrics] } + } + + remainArr = innerRows.map(mapHandler).slice(limitShowNum, innerRows.length) + + let formatter = function (item) { + let tplt = [itemPoint(item.color)] + let percent + + if (!limitShowNum || item.name !== localeOther) { + tplt.push(itemLabel(item.name)) + tplt.push(itemContent(getFormated(item.value, dataType, digit))) + tplt.push(itemContent(`(${item.percent}%)`)) + } else { + tplt.push(localeOther + ':') + + remainArr.forEach(({ name, value }) => { + percent = getFormated(value / sum, 'percent') + + tplt.push(`
    ${itemLabel(name)}`) + tplt.push(itemContent(getFormated(value, dataType, digit))) + tplt.push(itemContent(percent)) + }) + } + + return tplt.join('') + } + + return { formatter } +} + +export const pie = (columns, rows, settings, extra, isRing) => { + const innerRows = cloneDeep(rows) + const { dataType = 'normal', digit = 2, dimension = columns[0], emphasis = { scale: true } } = settings + const { itemStyle, label = false, labelLine, legendLimit = 30, legendName = {}, level = false } = settings + const { limitShowNum = 0, metrics = columns[1], offsetY = pieOffsetY, percentShow } = settings + const { roseType = false, selectedMode = false } = settings + const { radius = isRing ? (roseType ? roseRingRadius : ringRadius) : pieRadius } = settings + const { legendVisible, t, tooltipVisible } = extra + + limitShowNum && innerRows.sort((a, b) => b[metrics] - a[metrics]) + + const seriesParams = { dataType, digit, dimension, emphasis, innerRows, isRing, itemStyle } + + Object.assign(seriesParams, { label, labelLine, legendName, level, limitShowNum, metrics, offsetY }) + Object.assign(seriesParams, { percentShow, radius, roseType, selectedMode, t }) + + const series = getPieSeries(seriesParams) + const legendParams = { dimension, innerRows, legendLimit, legendName, level, limitShowNum, t } + const legend = legendVisible && getPieLegend(legendParams) + const pieTooltip = getPieTooltip({ dataType, innerRows, limitShowNum, digit, metrics, dimension, t }) + const tooltip = tooltipVisible && pieTooltip + const options = { legend, series, tooltip } + + return options +} + +export const ring = (columns, rows, settings, extra) => pie(columns, rows, settings, extra, true) diff --git a/packages/renderless/src/chart-radar/index.ts b/packages/renderless/src/chart-radar/index.ts new file mode 100644 index 000000000..46baf86ac --- /dev/null +++ b/packages/renderless/src/chart-radar/index.ts @@ -0,0 +1,143 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getFormated } from '@opentiny/vue-renderless/chart-core/deps/utils' +import { itemPoint, itemLabel, itemContent } from '@opentiny/vue-renderless/chart-core/deps/constants' +import { isNull } from '@opentiny/vue-renderless/common/type' + +const getRadarLegend = (rows, dimension, legendName) => { + let legendData = rows.map((row) => row[dimension]) + + function formatter(name) { + return isNull(legendName[name]) ? name : legendName[name] + } + + return { data: legendData, formatter } +} + +const getRadarTooltip = (dataType, radar, digit) => { + const { typeTemp = [], nameTemp = [] } = {} + + radar.indicator.forEach((item, i) => { + typeTemp[i] = dataType[item.name] + nameTemp[i] = item.name + }) + + function formatter(item) { + const tplt = [] + + tplt.push(itemPoint(item.color)) + tplt.push(`${item.name}
    `) + + item.data.value.forEach((val, i) => { + tplt.push(`${itemLabel(nameTemp[i])}`) + tplt.push(`${itemContent(getFormated(val, typeTemp[i], digit))}
    `) + }) + + return tplt.join('') + } + + return { formatter } +} + +const getRadarSetting = (rows, metrics, labelMap) => { + const settingBase = { + indicator: [], + shape: 'circle', + splitNumber: 5, + name: { textStyle: { color: '#191919' } }, + splitLine: { lineStyle: { color: 'rgba(25,25,25,0.10)' } }, + splitArea: { show: false }, + axisLine: { lineStyle: { color: 'rgba(25,25,25,0.10)' } } + } + let indicatorTemp = {} + + rows.forEach((items) => { + metrics.forEach((item) => { + const key = isNull(labelMap[item]) ? item : labelMap[item] + + if (indicatorTemp[key]) { + indicatorTemp[key].push(items[item]) + } else { + indicatorTemp[key] = [items[item]] + } + }) + }) + + settingBase.indicator = Object.keys(indicatorTemp).map((key) => ({ + name: key, + max: Math.max.apply(null, indicatorTemp[key]) + })) + + return settingBase +} + +const getRadarSeries = (args) => { + const { areaStyle, dimension, itemStyle, label, labelMap, lineStyle, metrics, radar, rows } = args + let radarIndexObj = {} + + radar.indicator.forEach((item, i) => (radarIndexObj[item.name] = i)) + + const seriesData = rows.map((row) => { + const serieData = { + value: [], + name: row[dimension], + symbol: 'circle', + symbolSize: 8, + showSymbol: false, + emphasis: { itemStyle: { borderColor: '#fff', borderWidth: 2 } } + } + + Object.keys(row).forEach((key) => { + if (~metrics.indexOf(key)) { + let k = isNull(labelMap[key]) ? radarIndexObj[key] : radarIndexObj[labelMap[key]] + + serieData.value[k] = row[key] + } + }) + + return serieData + }) + + const result = { data: seriesData, name: dimension, type: 'radar', areaStyle: { normal: { opacity: 0.3 } } } + + label && (result.label = label) + itemStyle && (result.itemStyle = itemStyle) + lineStyle && (result.lineStyle = lineStyle) + areaStyle && (result.areaStyle = areaStyle) + + return [result] +} + +export const radar = (columns, rows, settings, extra) => { + const { dataType = {}, legendName = {}, labelMap = {}, dimension = columns[0] } = settings + const { digit = 2, label, itemStyle, lineStyle, areaStyle } = settings + const { tooltipVisible, legendVisible } = extra + let metrics = columns.slice() + + if (!settings.metrics) { + metrics.splice(columns.indexOf(dimension), 1) + } else { + metrics = settings.metrics + } + + const legend = legendVisible && getRadarLegend(rows, dimension, legendName) + const radar = getRadarSetting(rows, metrics, labelMap) + const tooltip = tooltipVisible && getRadarTooltip(dataType, radar, digit) + const serieParams = { rows, dimension, metrics, radar } + + Object.assign(serieParams, { label, itemStyle, lineStyle, labelMap, areaStyle }) + + const series = getRadarSeries(serieParams) + + return { legend, radar, series, tooltip } +} diff --git a/packages/renderless/src/chart-sankey/index.ts b/packages/renderless/src/chart-sankey/index.ts new file mode 100644 index 000000000..67b327721 --- /dev/null +++ b/packages/renderless/src/chart-sankey/index.ts @@ -0,0 +1,106 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getFormated } from '@opentiny/vue-renderless/chart-core/deps/utils' +import { itemPoint, itemLabel, itemContent } from '@opentiny/vue-renderless/chart-core/deps/constants' +import { isNull } from '@opentiny/vue-renderless/common/type' + +const getTooltip = (args) => { + const { digit, itemDataType, linksDataType } = args + const formatter = function (item) { + const { name, data, value, color } = item + const tplt = [] + + color && tplt.push(itemPoint(color)) + tplt.push(itemLabel(`${name}`)) + + if (!data || !data.source) { + tplt.push(`${itemContent(getFormated(value, itemDataType, digit))}
    `) + } else { + tplt.push(`${itemContent(getFormated(value, linksDataType, digit))}
    `) + } + + return tplt.join('') + } + + return { trigger: 'item', formatter } +} + +const getSeries = (args) => { + const { dimension, itemStyle, label, lineStyle, links, metrics, rows, useDataValue, valueFull } = args + const dataMap = {} + const seriesData = rows.map((row) => { + dataMap[row[dimension]] = row[metrics] + return { name: row[dimension], value: row[metrics] } + }) + + let { innerLinks = links, mapHandler = null } = {} + + if (useDataValue) { + mapHandler = (link) => ({ ...link, value: dataMap[link.target] }) + } else if (!valueFull) { + mapHandler = (link) => (isNull(link.value) ? { ...link, value: dataMap[link.target] } : link) + } + + if (mapHandler) { + innerLinks = links.map(mapHandler) + } + + let result = { type: 'sankey', data: seriesData, links: innerLinks, focusNodeAdjacency: 'allEdges', nodeWidth: 12 } + result = Object.assign(result, { itemStyle: { opacity: 0.2 }, lineStyle: { opacity: 0.05 } }) + + let total = 0 + + seriesData.forEach((item) => { + const isExist = innerLinks.some((data) => data.target === item.name) + if (!isExist) { + total += item.value + } + }) + + const defaultLabel = { + backgroundColor: 'transparent', + lineHeight: 16, + formatter(item) { + return `{name|${item.name}}\n{value|${Number(item.value / total).toFixed(2) * 100}%}` + }, + rich: { name: { color: '#4e4e4e' }, value: { color: '#818181', padding: [4, 0, 0, 0] } } + } + + result.label = Object.assign(defaultLabel, label || {}) + + result.lineStyle = { + color: 'source', + opacity: 0.5, + ...(lineStyle || {}) + } + + result.itemStyle = { borderWidth: 0, ...itemStyle } + + return [result] +} + +export const sankey = (columns, rows, settings) => { + const { dataType = ['normal', 'normal'], dimension = columns[0], digit = 2, label } = settings + const { links, lineStyle, itemStyle, metrics = columns[1], useDataValue = false, valueFull = false } = settings + + if (!links) { + return + } + + const { itemDataType = dataType[0], linksDataType = dataType[1] } = {} + const tooltip = getTooltip({ itemDataType, linksDataType, digit }) + const seriesParams = { rows, dimension, metrics, links, valueFull, useDataValue, label, itemStyle, lineStyle } + const series = getSeries(seriesParams) + + return { tooltip, series } +} diff --git a/packages/renderless/src/chart-scatter/index.ts b/packages/renderless/src/chart-scatter/index.ts new file mode 100644 index 000000000..c2ff5e665 --- /dev/null +++ b/packages/renderless/src/chart-scatter/index.ts @@ -0,0 +1,222 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getFormated, hexToRgb } from '@opentiny/vue-renderless/chart-core/deps/utils' +import { itemPoint, itemLabel, itemContent } from '@opentiny/vue-renderless/chart-core/deps/constants' +import { line } from '@opentiny/vue-renderless/chart-line' +import { isNull } from '@opentiny/vue-renderless/common/type' + +const getScatterLegend = (dataLabels, legendName) => { + function formatter(name) { + return isNull(legendName[name]) ? name : legendName[name] + } + + return { data: dataLabels, formatter, itemStyle: { borderWidth: 1 } } +} + +const getTooltipContent = (item, args) => { + const { labelMap, columns } = args + const { dataType, digit } = args + const template = [] + const { color, seriesName, data } = item + const { value } = data + + template.push(`${itemPoint(color)} ${seriesName}
    `) + + value.forEach((d, i) => { + const name = labelMap[columns[i]] || columns[i] + const num = isNaN(d) ? d : getFormated(d, dataType[columns[i]], digit) + + template.push(`${itemLabel(name)}${itemContent(num)}
    `) + }) + + return template.join('') +} + +const getScatterTooltip = (args) => { + const { tooltipTrigger } = args + + function formatter(item) { + return Array.isArray(item) ? item.map((i) => getTooltipContent(i, args)).join('') : getTooltipContent(item, args) + } + + return { trigger: tooltipTrigger, formatter } +} + +const getScatterXAxis = (args) => { + const { rows, dataLabels, dimension } = args + const { xAxisName, axisVisible, xAxisType } = args + const data = [] + + dataLabels.forEach((dataLabel) => { + const items = rows[dataLabel] + + items.forEach((item) => { + const name = item[dimension] + + name && !~data.indexOf(name) && data.push(name) + }) + }) + + return [ + { + type: xAxisType, + show: axisVisible, + name: xAxisName, + data, + offset: 5, + axisLabel: { show: true, color: '#4E4E4E' } + } + ] +} + +const getScatterYAxis = (args) => { + const { axisVisible, dataType, digit, min } = args + const { metrics, max, scale, yAxisName } = args + + function formatter(val) { + return getFormated(val, dataType[metrics[0]], digit) + } + + let result = { type: 'value', show: axisVisible, scale, min, max } + + Object.assign(result, { + axisTick: { show: false }, + name: yAxisName, + offset: 10, + axisLabel: { show: true, formatter, color: '#4E4E4E' }, + splitLine: { show: true, lineStyle: { color: 'rgba(25,25,25,0.10)' } } + }) + + return result +} + +const getScatterSeries = (args) => { + const { columns, cursor, dataLabels, dimension, itemStyle, label, metrics, color } = args + const { rows, symbol, symbolRotate, symbolSize, symbolSizeMax, symbolOffset } = args + const extraMetrics = columns.filter((column) => !~metrics.indexOf(column) && column !== dimension) + const numbers = [] + + dataLabels.forEach((dataLabel) => rows[dataLabel].forEach((row) => numbers.push(row[metrics[1]]))) + + const { maxNum = Math.max(...numbers), series = [] } = {} + + dataLabels.forEach((dataLabel, index) => { + const { result = [], itemData = rows[dataLabel] } = {} + + itemData.forEach((item) => { + const itemResult = { value: [] } + + itemResult.value.push(item[dimension], item[metrics[0]], item[metrics[1]]) + + extraMetrics.forEach((ext) => itemResult.value.push(item[ext])) + + itemResult.symbolSize = symbolSize || (item[metrics[1]] / maxNum) * symbolSizeMax + + result.push(itemResult) + }) + + const serie = { + type: 'scatter', + data: result, + name: dataLabel, + label, + itemStyle: { borderWidth: 1, borderColor: color[index], color: `rgba(${hexToRgb(color[index])}, 0.3)`, ...(itemStyle || {}) } + } + + Object.assign(serie, { symbol, symbolRotate, symbolOffset, cursor }) + + series.push(serie) + }) + + return series +} + +const getSeries = (args) => { + const { cursor, label, tooltip, itemStyle, symbolSizeMax } = args + const { series, color, symbol, symbolSize, symbolRotate, symbolOffset } = args + series.forEach((item, index) => { + const itemBase = { type: 'scatter', symbol } + const numbers = [] + const data = item.data + + data.forEach((row) => numbers.push(row[1])) + + const maxNum = Math.max(...numbers) + + item.data = data.map((item) => ({ + value: item, + symbolSize: symbolSize || (item[1] / maxNum) * symbolSizeMax + })) + + Object.assign(itemBase, { + symbolRotate, + symbolOffset, + cursor, + label, + tooltip, + itemStyle: { borderWidth: 1, borderColor: color[index], color: `rgba(${hexToRgb(color[index])}, 0.3)`, ...(itemStyle || {}) }, + emphasis: { itemStyle: { borderWidth: 1, borderColor: color[index] } } + }) + Object.assign(item, itemBase) + }) + return series +} + +export const scatter = (columns, rows, settings, extra) => { + const { dimension = columns[0], metrics = [columns[1], columns[2]], dataType = {} } = settings + const { xAxisType = 'category', xAxisName, yAxisName, digit = 2, legendName = {} } = settings + const { labelMap = {}, tooltipTrigger = 'item', axisVisible = true, symbolSizeMax = 50, symbol } = settings + const { symbolSize, symbolRotate, symbolOffset, cursor, min, max, scale, label, itemStyle } = settings + const { tooltipVisible, legendVisible, color } = extra + const tooltip = tooltipVisible && getScatterTooltip({ tooltipTrigger, labelMap, columns, dataType, digit }) + + if (Array.isArray(rows)) { + const lineSettings = { + ...settings, + ...{ + yAxisName: yAxisName ? [yAxisName] : undefined, + xAxisName: xAxisName ? [xAxisName] : undefined, + dimension: dimension ? [dimension] : undefined, + max: max ? [max] : undefined, + min: min ? [min] : undefined, + scale: scale ? [scale] : undefined + } + } + + const options = line(columns, rows, lineSettings, extra) + + if (!options || !options.series) { + return {} + } + + const baseObj = { color, symbol, symbolSize, symbolRotate, symbolOffset, cursor, label, itemStyle, symbolSizeMax } + options.series = getSeries({ tooltip, series: options.series, ...baseObj }) + options.legend = { itemStyle: { borderWidth: 1 }, ...(options.legend || {}) } + + return options + } + + const dataLabels = Object.keys(rows) + const legend = legendVisible && getScatterLegend(dataLabels, legendName) + const xAxisParam = { xAxisName, axisVisible, xAxisType, dataLabels, dimension, rows } + const xAxis = getScatterXAxis(xAxisParam) + const yAxisParam = { min, max, scale, yAxisName, dataType, metrics, digit, axisVisible } + const yAxis = getScatterYAxis(yAxisParam) + const seriesParam = { rows, dataLabels, columns, metrics, dimension, label, itemStyle, symbol } + + Object.assign(seriesParam, { symbolSizeMax, symbolSize, symbolRotate, symbolOffset, cursor, color }) + + const series = getScatterSeries(seriesParam) + + return { legend, tooltip, xAxis, yAxis, series } +} diff --git a/packages/renderless/src/chart-sunburst/index.ts b/packages/renderless/src/chart-sunburst/index.ts new file mode 100644 index 000000000..cf2e24db5 --- /dev/null +++ b/packages/renderless/src/chart-sunburst/index.ts @@ -0,0 +1,46 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { itemPoint, itemLabel, itemContent } from '@opentiny/vue-renderless/chart-core/deps/constants' + +const getTooltip = () => ({ + trigger: 'item', + formatter(item) { + const tpl = [] + const { name, value, color } = item + + if (name) { + color && tpl.push(itemPoint(color)) + tpl.push(`${itemLabel('label')}${itemContent(name)}`) + tpl.push('
    ') + } + + color && tpl.push(itemPoint(color)) + tpl.push(`${itemLabel('sum')}${itemContent(value)}`) + + return tpl.join('') + } +}) + +export const sunburst = (columns, rows, settings, extra) => { + const defaultItemStyle = { borderWidth: 2 } + + const series = { type: 'sunburst', itemStyle: defaultItemStyle } + + const { tooltipVisible } = extra + + const tooltip = tooltipVisible && getTooltip({}) + + let options = { series, tooltip } + + return options +} diff --git a/packages/renderless/src/chart-tree/index.ts b/packages/renderless/src/chart-tree/index.ts new file mode 100644 index 000000000..ee8ddce32 --- /dev/null +++ b/packages/renderless/src/chart-tree/index.ts @@ -0,0 +1,85 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { isObject } from '@opentiny/vue-renderless/chart-core/deps/utils' +import { itemLabel, itemContent, SAAS_DEFAULT_COLORS_10 } from '@opentiny/vue-renderless/chart-core/deps/constants' + +const getTreeLegend = (args) => { + const { dimension, rows } = args + const result = rows.map((row) => row[dimension]) + + return { data: result } +} + +const getTreeTooltip = (args) => { + const { tooltipFormatter } = args + + return { + trigger: 'item', + triggerOn: 'mousemove', + formatter(item) { + if (tooltipFormatter) { + return tooltipFormatter.apply(null, arguments) + } + let template = [] + const { treeAncestors, value } = item + let names = [] + treeAncestors.forEach((ancestor, idx) => { + idx && names.push(ancestor.name) + }) + template.push(`${itemLabel(names.join('.'))}`) + template.push(`${itemContent(value)}`) + + return template.join('') + } + } +} + +const getTreeSeries = (args) => { + const { dimension, metrics, rows, seriesMap } = args + const series = [] + + rows.forEach((row) => { + const seriesItem = seriesMap[row[dimension]] + const label = { position: 'right', fontSize: 12, color: '#191919' } + const itemStyle = { color: SAAS_DEFAULT_COLORS_10[0] } + const lineStyle = { color: 'rgba(25 ,25 ,25 , 0.10)' } + const symbolSize = 16 + const result = { type: 'tree', name: row[dimension], data: row[metrics], itemStyle, label, lineStyle, symbolSize } + + if (seriesItem) { + Object.keys(seriesItem).forEach((key) => { + if (!isObject(result[key])) { + result[key] = seriesItem[key] + } else { + Object.assign(result[key], seriesItem[key]) + } + }) + } + + series.push(result) + }) + + return series +} + +export const tree = (columns, rows, settings, extra) => { + const { dimension = columns[0], metrics = columns[1], seriesMap = {} } = settings + const { legendVisible, tooltipFormatter, tooltipVisible } = extra + const seriesParam = { dimension, metrics, rows, seriesMap } + const series = getTreeSeries(seriesParam) + const legendParam = { dimension, rows } + const legend = legendVisible && rows.length > 1 && getTreeLegend(legendParam) + const tooltip = tooltipVisible && getTreeTooltip({ tooltipFormatter }) + + return { series, legend, tooltip } +} diff --git a/packages/renderless/src/chart-waterfall/index.ts b/packages/renderless/src/chart-waterfall/index.ts new file mode 100644 index 000000000..afada47b1 --- /dev/null +++ b/packages/renderless/src/chart-waterfall/index.ts @@ -0,0 +1,135 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getFormated } from '@opentiny/vue-renderless/chart-core/deps/utils' +import { isNull } from '@opentiny/vue-renderless/common/type' +import { itemLabel, itemContent, SAAS_DEFAULT_COLORS_10 } from '@opentiny/vue-renderless/chart-core/deps/constants' + +const getWaterfallTooltip = (dataType, digit) => { + let trigger = 'axis' + let axisPointer = { type: 'shadow' } + let formatter = function (items) { + const item = items[1] + + return [`${itemContent(item.name)}
    ${itemLabel(item.seriesName)}`, `${itemContent(getFormated(item.value, dataType, digit))}`].join('') + } + + return { trigger, axisPointer, formatter } +} + +const getWaterfallXAxis = (args) => { + const { axisVisible, dimension, labelMap, remainName, remainStatus, rows, totalName, xAxisName } = args + + let xAxisData = [totalName].concat(rows.map((row) => row[dimension])) + + remainStatus === 'have-remain' && (xAxisData = xAxisData.concat([remainName])) + + let name = (labelMap && labelMap[xAxisName]) || xAxisName + + const xAxis = { type: 'category', name, splitLine: { show: false }, data: xAxisData, show: axisVisible } + const axisLine = { show: true, lineStyle: { color: '#191919', opacity: 0.1, width: 2 } } + const axisPointer = { type: 'shadow', z: 1, shadowStyle: { color: '#f5f5f5' } } + + return { + ...xAxis, + axisLine, + axisPointer + } +} + +const getWaterfallYAxis = (args) => { + const { axisVisible, dataType, digit, labelMap, yAxisName } = args + let name = !isNull(labelMap[yAxisName]) ? labelMap[yAxisName] : yAxisName + let formatter = function (val) { + return getFormated(val, dataType, digit) + } + + return { type: 'value', name, axisTick: { show: false }, axisLabel: { formatter }, show: axisVisible } +} + +const getWaterfallSeries = (args) => { + const { dataSum, dataType, digit, metrics, remainStatus, rows, t, totalNum } = args + const seriesBase = { type: 'bar', stack: t('ui.chart.summation') } + let { dataSumTemp = dataSum, totalNumTemp = totalNum, assistData, mainData } = {} + const rowData = rows.map((row) => row[metrics]) + + if (remainStatus === 'have-remain') { + assistData = [0].concat(rows.map((row) => (totalNumTemp -= row[metrics]))).concat([0]) + mainData = [totalNum].concat(rowData).concat([totalNum - dataSum]) + } else { + assistData = [0].concat(rows.map((row) => (dataSumTemp -= row[metrics]))) + mainData = [dataSum].concat(rowData) + } + + const series = [] + let seriesAdv = { + name: t('ui.chart.auxiliary'), + itemStyle: { opacity: 0 }, + emphasis: { itemStyle: { opacity: 0 } }, + data: assistData + } + + series.push(Object.assign(seriesAdv, seriesBase)) + + let formatter = function (item) { + return getFormated(item.value, dataType, digit) + } + + seriesAdv = { + name: t('ui.chart.value'), + label: { show: true, position: 'top', formatter }, + data: mainData + } + + series.push( + Object.assign(seriesAdv, { + ...seriesBase, + itemStyle: { borderRadius: [4, 4, 0, 0] }, + color: SAAS_DEFAULT_COLORS_10[0] + }) + ) + + return series +} + +const getWaterfallRemainStatus = (dataSum, totalNum) => (!totalNum ? 'not-total' : totalNum <= dataSum ? 'none-remain' : 'have-remain') + +export const waterfall = (columns, rows, settings, extra) => { + const { tooltipVisible, t } = extra + const { axisVisible = true, dataType = 'normal', dimension = columns[0] } = settings + const { remainName = t('ui.chart.other'), totalName = t('ui.chart.total') } = settings + const { totalNum, xAxisName = dimension, digit = 2, labelMap = {} } = settings + + let metricsTemp = columns.slice() + + metricsTemp.splice(metricsTemp.indexOf(dimension), 1) + + const { metrics = metricsTemp[0], yAxisName = metrics } = {} + const tooltip = tooltipVisible && getWaterfallTooltip(dataType, digit) + + const dataSum = parseFloat(rows.reduce((pre, cur) => pre + Number(cur[metrics]), 0).toFixed(digit)) + const remainStatus = getWaterfallRemainStatus(dataSum, totalNum) + const xAxisParams = { dimension, rows, remainStatus, totalName } + + Object.assign(xAxisParams, { remainName, xAxisName, labelMap, axisVisible }) + + const xAxis = getWaterfallXAxis(xAxisParams) + const yAxisParams = { dataType, yAxisName, axisVisible, digit, labelMap } + const yAxis = getWaterfallYAxis(yAxisParams) + const seriesParams = { dataType, rows, dimension, metrics } + + Object.assign(seriesParams, { totalNum, remainStatus, dataSum, digit, t }) + + const series = getWaterfallSeries(seriesParams) + + return { series, tooltip, xAxis, yAxis } +} diff --git a/packages/renderless/src/chart-wordcloud/index.ts b/packages/renderless/src/chart-wordcloud/index.ts new file mode 100644 index 000000000..fe3916c6b --- /dev/null +++ b/packages/renderless/src/chart-wordcloud/index.ts @@ -0,0 +1,85 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { random } from '@opentiny/vue-renderless/common/string' +import { itemLabel, itemContent } from '@opentiny/vue-renderless/chart-core/deps/constants' + +const isArr = Array.isArray + +const getSeries = (args) => { + const { color, dimension, metrics, rows, shape, sizeMax, sizeMin } = args + let normalColor + + if (!isArr(color) && !!color) { + normalColor = color + } else { + normalColor = () => { + const rgb = [Math.round(random() * 160), Math.round(random() * 160), Math.round(random() * 160)].join(',') + return 'rgb(' + rgb + ')' + } + } + + let textStyle = { normal: { color: normalColor }, color: normalColor } + const baseType = { type: 'wordCloud', textStyle, shape, sizeRange: [sizeMin, sizeMax] } + const len = isArr(color) ? color.length : 0 + + baseType.data = rows.slice().map((row, i) => { + const text = { name: row[dimension], value: row[metrics] } + + if (len > 0) { + let wordColor = color[i % len] + text.textStyle = { + normal: { + color: wordColor + }, + color: wordColor + } + } + + return text + }) + + Object.assign(baseType, { rotationRange: [0, 0], gridSize: 10 }) + + return [baseType] +} + +const getTooltip = (args) => { + const { tooltipFormatter } = args + + function formatter(params) { + const { data } = params + const { name, value } = data + + if (tooltipFormatter) { + return tooltipFormatter.apply(null, params) + } + + return `${itemLabel(name)}${itemContent(value)}` + } + + return { show: true, formatter } +} + +const shapeSquare = (theta) => Math.min(1 / Math.abs(Math.cos(theta)), 1 / Math.abs(Math.sin(theta))) + +export const wordcloud = (columns, rows, settings, extra) => { + const { dimension = columns[0], metrics = columns[1], color = '' } = settings + const { sizeMax = 60, sizeMin = 12, shape } = settings + const { tooltipVisible, tooltipFormatter, color: colors } = extra + const seriesParams = { dimension, metrics, rows, sizeMax, sizeMin } + Object.assign(seriesParams, { color: color || colors, shape: shape || shapeSquare }) + const series = getSeries(seriesParams) + const tooltip = tooltipVisible && getTooltip({ tooltipFormatter }) + + return { series, tooltip } +} diff --git a/packages/renderless/src/checkbox-button/index.ts b/packages/renderless/src/checkbox-button/index.ts new file mode 100644 index 000000000..906df5f24 --- /dev/null +++ b/packages/renderless/src/checkbox-button/index.ts @@ -0,0 +1,88 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const handleChange = ({ state, props, emit, nextTick, dispatch, constants }) => (event) => { + if (state.isLimitExceeded) { + return + } + + let value + + if (event.target.checked) { + value = props.trueLabel === undefined ? true : props.trueLabel + } else { + value = props.falseLabel === undefined ? false : props.falseLabel + } + + emit('change', value, event) + + nextTick(() => { + if (state.checkboxGroup) { + dispatch(constants.CHECKBOX_GROUP, 'change', [state.checkboxGroup.modelValue]) + } + }) +} + +export const computedGetModelGet = ({ state, props }) => () => + state.checkboxGroup ? state.store : props.modelValue !== undefined ? props.modelValue : state.selfModel + +export const computedGetModelSet = ({ state, props, emit, dispatch, constants }) => (value) => { + if (state.checkboxGroup) { + state.isLimitExceeded = false + + state.checkboxGroup.min !== undefined && value.length < state.checkboxGroup.min && (state.isLimitExceeded = true) + + state.checkboxGroup.max !== undefined && value.length > state.checkboxGroup.max && (state.isLimitExceeded = true) + + state.isLimitExceeded === false && dispatch(constants.CHECKBOX_GROUP, 'update:modelValue', [value]) + } else if (props.modelValue !== undefined) { + emit('update:modelValue', value) + } else { + state.selfModel = value + } +} + +export const computedCheckboxGroup = ({ parent, constants }) => () => { + let parentObj = parent.$parent + + while (parentObj) { + if (parentObj.$options.componentName !== constants.CHECKBOX_GROUP) { + parentObj = parentObj.$parent + } else { + return parentObj + } + } + + return false +} + +export const computedIsDisabled = ({ state, props }) => () => + state.checkboxGroup ? state.checkboxGroup.disabled || props.disabled || state.isLimitDisabled : props.disabled + +export const computedActiveStyle = (state) => () => ({ + backgroundColor: state.checkboxGroup.fill || '', + borderColor: state.checkboxGroup.fill || '', + color: state.checkboxGroup.textColor || '', + 'box-shadow': '-1px 0 0 0 ' + state.checkboxGroup.fill +}) + +export const computedFormItemSize = (props) => () => (props.formItem || {}).formItemSize + +export const computedSize = ({ state, formItemSize }) => () => (state.checkboxGroup && state.checkboxGroup.state.checkboxGroupSize) || formItemSize.value + +export const toggleEvent = ({ parent, props, type }) => { + const inputEl = parent.$el.querySelector('input') + + Object.keys(props.events).forEach((ev) => { + inputEl[type + 'EventListener'](ev, props.events[ev]) + }) +} diff --git a/packages/renderless/src/checkbox-button/vue.ts b/packages/renderless/src/checkbox-button/vue.ts new file mode 100644 index 000000000..09a430d6f --- /dev/null +++ b/packages/renderless/src/checkbox-button/vue.ts @@ -0,0 +1,85 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + handleChange, + computedGetModelGet, + computedGetModelSet, + computedCheckboxGroup, + computedActiveStyle, + computedFormItemSize, + computedSize, + computedIsDisabled, + toggleEvent +} from './index' +import { addToStore, computedIsChecked, computedStore, computedIsLimitDisabled } from '@opentiny/vue-renderless/checkbox' + +export const api = ['state', 'handleChange'] + +const initState = ({ reactive, computed, api }) => { + const state = reactive({ + focus: false, + selfModel: false, + isLimitExceeded: false, + model: computed({ + get: () => api.computedGetModelGet(), + set: (value) => api.computedGetModelSet(value) + }), + size: computed(() => api.computedSize()), + store: computed(() => api.computedStore()), + isChecked: computed(() => api.computedIsChecked()), + isDisabled: computed(() => api.computedIsDisabled()), + activeStyle: computed(() => api.computedActiveStyle()), + checkboxGroup: computed(() => api.computedCheckboxGroup()), + isLimitDisabled: computed(() => api.computedIsLimitDisabled()) + }) + + return state +} + +const initApi = ({ api, state, props, formItemSize, parent, constants, emit, nextTick, dispatch }) => { + Object.assign(api, { + state, + addToStore: addToStore({ state, props }), + computedStore: computedStore({ state, props }), + computedActiveStyle: computedActiveStyle(state), + computedFormItemSize: computedFormItemSize(props), + computedSize: computedSize({ state, formItemSize }), + computedIsChecked: computedIsChecked({ state, props }), + computedIsLimitDisabled: computedIsLimitDisabled(state), + computedIsDisabled: computedIsDisabled({ state, props }), + computedGetModelGet: computedGetModelGet({ state, props }), + computedCheckboxGroup: computedCheckboxGroup({ parent, constants }), + handleChange: handleChange({ state, props, emit, nextTick, dispatch, constants }), + computedGetModelSet: computedGetModelSet({ state, props, emit, dispatch, constants }) + }) +} + +export const renderless = (props, { computed, onMounted, onBeforeUnmount, reactive }, { parent, emit, dispatch, constants, nextTick }) => { + const api = {} + const formItemSize = computed(() => api.computedFormItemSize()) + const state = initState({ reactive, computed, api }) + + initApi({ api, state, props, formItemSize, parent, constants, emit, nextTick, dispatch }) + + onBeforeUnmount(() => { + toggleEvent({ parent, props, type: 'remove' }) + }) + + onMounted(() => { + toggleEvent({ parent, props, type: 'add' }) + + props.checked && api.addToStore() + }) + + return api +} diff --git a/packages/renderless/src/checkbox-group/index.ts b/packages/renderless/src/checkbox-group/index.ts new file mode 100644 index 000000000..4b0dbc847 --- /dev/null +++ b/packages/renderless/src/checkbox-group/index.ts @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const computedFormItemSize = (props) => () => (props.formItem || {}).formItemSize + +export const computedCheckboxGroupSize = ({ props, formItemSize }) => () => props.size || formItemSize.value diff --git a/packages/renderless/src/checkbox-group/vue.ts b/packages/renderless/src/checkbox-group/vue.ts new file mode 100644 index 000000000..00e5d8203 --- /dev/null +++ b/packages/renderless/src/checkbox-group/vue.ts @@ -0,0 +1,42 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { computedFormItemSize, computedCheckboxGroupSize } from './index' + +export const api = ['state'] + +export const renderless = (props, { computed, reactive, watch }, { dispatch, constants }) => { + const api = { + computedFormItemSize: computedFormItemSize(props) + } + + const formItemSize = computed(() => api.computedFormItemSize()) + + const state = reactive({ + checkboxGroupSize: computed(() => api.computedCheckboxGroupSize()) + }) + + Object.assign(api, { + state, + computedCheckboxGroupSize: computedCheckboxGroupSize({ + props, + formItemSize + }) + }) + + watch( + () => props.modelValue, + (value) => dispatch(constants.FORM_ITEM, constants.FORM_CHANGE, [value]) + ) + + return api +} diff --git a/packages/renderless/src/checkbox/index.ts b/packages/renderless/src/checkbox/index.ts new file mode 100644 index 000000000..8dc7bfcdb --- /dev/null +++ b/packages/renderless/src/checkbox/index.ts @@ -0,0 +1,121 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const addToStore = ({ state, props }) => () => { + if (Array.isArray(state.model) && !state.model.includes(props.label)) { + state.model.push(props.label) + } else { + state.model = props.trueLabel || true + } +} + +export const handleChange = ({ state, props, emit, nextTick, dispatch, constants }) => (event) => { + if (state.isLimitExceeded) { + return + } + + let moduleValue + if (event.target.checked) { + moduleValue = props.trueLabel === undefined ? true : props.trueLabel + } else { + moduleValue = props.falseLabel === undefined ? false : props.falseLabel + } + emit('change', moduleValue, event) + + nextTick(() => { + state.isGroup && dispatch(constants.CHECKBOX_GROUP, 'change', [state.checkboxGroup.modelValue]) + }) +} + +// prettier-ignore +export const computedGetModelGet = ({ state, props }) => () => { + const model = state.isGroup + ? state.store + : props.modelValue !== undefined + ? props.modelValue + : state.selfModel + + return ~[undefined, null].indexOf(model) ? [] : model +} + +export const computedGetModelSet = ({ state, dispatch, emit, constants }) => (value) => { + if (state.isGroup) { + state.isLimitExceeded = false + + state.checkboxGroup.min !== undefined && value.length < state.checkboxGroup.min && (state.isLimitExceeded = true) + + state.checkboxGroup.max !== undefined && value.length > state.checkboxGroup.max && (state.isLimitExceeded = true) + + state.isLimitExceeded === false && dispatch(constants.CHECKBOX_GROUP, 'update:modelValue', [value]) + } else { + emit('update:modelValue', value) + state.selfModel = value + } +} + +export const computedIsChecked = ({ state, props }) => () => { + if (typeof state.model === 'boolean') { + return state.model + } else if (Array.isArray(state.model)) { + return state.model.includes(props.label) + } else if (state.model !== null && state.model !== undefined) { + return state.model === props.trueLabel + } +} + +export const computedIsGroup = ({ state, parent, constants }) => () => { + let parentObj = parent.$parent + + while (parentObj) { + if (parentObj.$options.componentName !== constants.CHECKBOX_GROUP) { + parentObj = parentObj.$parent + } else { + state.checkboxGroup = parentObj + return true + } + } + + return false +} + +export const computedStore = ({ state, props }) => () => (state.checkboxGroup ? state.checkboxGroup.modelValue : props.modelValue) + +export const computedIsLimitDisabled = (state) => () => { + const { max, min } = state.checkboxGroup + + return (!!(max || min) && state.model.length >= max && !state.isChecked) || (state.model.length <= min && state.isChecked) +} + +export const computedIsDisabled = ({ state, props }) => () => + (state.isGroup ? state.checkboxGroup.disabled || props.disabled || state.isLimitDisabled : props.disabled) || state.formDisabled + +export const computedFormItemSize = (props) => () => (props.formItem || {}).formItemSize + +export const computedCheckboxSize = ({ state, props, formItemSize }) => () => { + const tempCheckboxSize = props.size || formItemSize.value + + return state.isGroup ? state.checkboxGroup.state.checkboxGroupSize || tempCheckboxSize : tempCheckboxSize +} + +export const mounted = ({ props, emit, api, parent }) => () => { + props.checked && api.addToStore() + + props.indeterminate && parent.$el.setAttribute('aria-controls', props.controls) + + emit('complete', true) +} + +export const toggleEvent = ({ parent, props, type }) => { + const inputEl = parent.$el + + Object.keys(props.events).forEach((ev) => inputEl[type + 'EventListener'](ev, props.events[ev])) +} diff --git a/packages/renderless/src/checkbox/vue.ts b/packages/renderless/src/checkbox/vue.ts new file mode 100644 index 000000000..687344571 --- /dev/null +++ b/packages/renderless/src/checkbox/vue.ts @@ -0,0 +1,80 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + addToStore, + handleChange, + computedGetModelGet, + computedGetModelSet, + computedIsChecked, + computedIsGroup, + computedStore, + computedIsLimitDisabled, + computedIsDisabled, + computedFormItemSize, + computedCheckboxSize, + mounted, + toggleEvent +} from './index' + +export const api = ['state', 'handleChange'] + +export const renderless = (props, { computed, onMounted, onBeforeUnmount, reactive, watch, inject }, { parent, emit, constants, nextTick, dispatch }) => { + parent.tinyForm = parent.tinyForm || inject('form', null) + const api = { dispatch } + const state = reactive({ + ...{ focus: false, selfModel: false, isLimitExceeded: false }, + store: computed(() => api.computedStore()), + isGroup: computed(() => api.computedIsGroup()), + isChecked: computed(() => api.computedIsChecked()), + isDisabled: computed(() => api.computedIsDisabled()), + checkboxSize: computed(() => api.computedCheckboxSize()), + isLimitDisabled: computed(() => api.computedIsLimitDisabled()), + formDisabled: computed(() => (parent.tinyForm || {}).disabled), + model: computed({ get: () => api.computedGetModelGet(), set: (value) => api.computedGetModelSet(value) }) + }) + Object.assign(api, { + state, + addToStore: addToStore({ state, props }), + computedStore: computedStore({ state, props }), + computedFormItemSize: computedFormItemSize(props), + computedIsChecked: computedIsChecked({ state, props }), + computedIsLimitDisabled: computedIsLimitDisabled(state), + computedIsDisabled: computedIsDisabled({ state, props }), + computedGetModelGet: computedGetModelGet({ state, props }), + computedIsGroup: computedIsGroup({ state, parent, constants }), + computedGetModelSet: computedGetModelSet({ state, dispatch, emit, constants }) + }) + const formItemSize = computed(() => api.computedFormItemSize()) + api.computedCheckboxSize = computedCheckboxSize({ state, props, formItemSize }) + Object.assign(api, { + mounted: mounted({ emit, props, api, parent }), + handleChange: handleChange({ state, props, emit, nextTick, dispatch: api.dispatch, constants }) + }) + + watch( + () => props.modelValue, + (value) => props.validateEvent && api.dispatch(constants.FORM_ITEM, constants.FORM_CHANGE, value) + ) + + onBeforeUnmount(() => { + toggleEvent({ parent, props, type: 'remove' }) + }) + + onMounted(() => { + dispatch('Tooltip', 'tooltip-update') + toggleEvent({ parent, props, type: 'add' }) + api.mounted() + }) + + return api +} diff --git a/packages/renderless/src/col/index.ts b/packages/renderless/src/col/index.ts new file mode 100644 index 000000000..9a3fcc4d4 --- /dev/null +++ b/packages/renderless/src/col/index.ts @@ -0,0 +1,136 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const setSubitemAttrValue = ({ className, item, value }) => { + if (value) { + if (typeof value === 'number') { + className[`col-${item}-`] = value + } else { + if ('span' in value) { + className[`col-${item}-`] = value.span + } + + if ('offset' in value) { + className[`col-${item}-offset-`] = value.offset + } + + if ('push' in value) { + className[`col-${item}-push-`] = value.push + } + + if ('pull' in value) { + className[`col-${item}-pull-`] = value.pull + } + } + } +} + +export const setGlobalAttrValue = ({ attr, className, value }) => { + attr = attr ? attr + '-' : '' + className[`col-xs-${attr}`] = value + className[`col-sm-${attr}`] = value + className[`col-md-${attr}`] = value + className[`col-lg-${attr}`] = value + className[`col-xl-${attr}`] = value +} + +export const getClassName = ({ api, props }) => () => { + const span = props.span + const offset = props.offset + const push = props.move ? props.move : 0 + const pull = props.move ? 0 : -props.move + + const subitems = { + xs: props.xs, + sm: props.sm, + md: props.md, + lg: props.lg, + xl: props.xl + } + + const className = {} + const result = [] + let item = {} + + if (span) { + api.setGlobalAttrValue({ attr: '', value: span, className }) + } + + if (offset) { + api.setGlobalAttrValue({ attr: 'offset', value: offset, className }) + } + + if (push) { + api.setGlobalAttrValue({ attr: 'push', value: push, className }) + } + + /* istanbul ignore if */ + if (pull) { + api.setGlobalAttrValue({ attr: 'pull', value: pull, className }) + } + + for (item of Object.keys(subitems)) { + api.setSubitemAttrValue({ item, value: subitems[item], className }) + } + + for (item of Object.keys(className)) { + result.push(item + className[item]) + } + + return result.join(' ') +} + +export const row = (pcontext) => () => { + const ROW_NAME = 'Row' + const COL_NAME = 'Col' + + let parent = pcontext.$parent.$parent + /* istanbul ignore next */ + let parentName = parent ? parent.$options.componentName : null + let depth = 10 + + /* istanbul ignore next */ + while (parent && parentName !== ROW_NAME && parentName !== COL_NAME && depth--) { + parent = parent.$parent + + /* istanbul ignore next */ + parentName = parent && parent.$options ? parent.$options.componentName : null + } + + /* istanbul ignore next */ + return parentName === ROW_NAME ? parent : null +} + +export const getStyle = ({ props, state }) => () => { + const parent = state.row + const no = props.no + const styles = [] + let gutter = parent ? parent.gutter : null + let noSpace = parent ? parent.noSpace : null + let order = '' + + if (gutter) { + gutter = gutter / 2 + styles.push(`padding-left:${gutter}px;padding-right:${gutter}px;`) + } else if (noSpace) { + styles.push('padding-left:0;padding-right:0;') + } + + if (parent && parent.flex && parent.order) { + /* istanbul ignore next */ + order = parent.order === 'asc' ? no : -no + + styles.push(`order:${order};-webkit-order:${order};-ms-order:${order};-moz-order:${order};`) + } + + return styles.join('') +} diff --git a/packages/renderless/src/col/vue.ts b/packages/renderless/src/col/vue.ts new file mode 100644 index 000000000..a01eef184 --- /dev/null +++ b/packages/renderless/src/col/vue.ts @@ -0,0 +1,35 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { setSubitemAttrValue, setGlobalAttrValue, getClassName, getStyle, row } from './index' + +export const api = ['state'] + +export const renderless = (props, { computed, reactive }, { parent }) => { + const api = {} + const state = reactive({ + row: computed(() => api.row()), + style: computed(() => api.getStyle()), + className: computed(() => api.getClassName()) + }) + + Object.assign(api, { + state, + row: row(parent), + setGlobalAttrValue, + setSubitemAttrValue, + getStyle: getStyle({ props, state }), + getClassName: getClassName({ api, props }) + }) + + return api +} diff --git a/packages/renderless/src/collapse-item/index.ts b/packages/renderless/src/collapse-item/index.ts new file mode 100644 index 000000000..7fc7eeb21 --- /dev/null +++ b/packages/renderless/src/collapse-item/index.ts @@ -0,0 +1,34 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const handleFocus = ({ state, interval }) => () => { + setTimeout(() => { + if (!state.isClick) { + state.focusing = true + } else { + state.isClick = false + } + }, interval) +} + +export const handleHeaderClick = ({ componentName, dispatch, eventName, props, parent, state }) => () => { + if (props.disabled) { + return + } + + dispatch(componentName, eventName, parent) + + state.focusing = false + state.isClick = true +} + +export const handleEnterClick = ({ componentName, dispatch, eventName, parent }) => () => dispatch(componentName, eventName, parent) diff --git a/packages/renderless/src/collapse-item/vue.ts b/packages/renderless/src/collapse-item/vue.ts new file mode 100644 index 000000000..874b4d751 --- /dev/null +++ b/packages/renderless/src/collapse-item/vue.ts @@ -0,0 +1,40 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { handleFocus, handleEnterClick, handleHeaderClick } from './index' +import { guid } from '@opentiny/vue-renderless/common/string' + +export const api = ['state', 'isActive', 'handleFocus', 'handleEnterClick', 'handleHeaderClick'] + +export const renderless = (props, { computed, reactive }, { parent, constants, dispatch }) => { + const _constants = parent.collapse._constants + const componentName = _constants.COMPONENT_NAME.Collapse + const eventName = _constants.EVENT_NAME.CollapseItemClick + + const state = reactive({ + id: guid(), + isClick: false, + focusing: false, + contentHeight: 0, + contentWrapStyle: { height: 'auto', display: 'block' }, + isActive: computed(() => parent.collapse.state.activeNames.includes(props.name)) + }) + + const api = { + state, + handleFocus: handleFocus({ state, interval: constants.INTERVAL }), + handleEnterClick: handleEnterClick({ componentName, dispatch, eventName, parent }), + handleHeaderClick: handleHeaderClick({ componentName, dispatch, eventName, props, parent, state }) + } + + return api +} diff --git a/packages/renderless/src/collapse/index.ts b/packages/renderless/src/collapse/index.ts new file mode 100644 index 000000000..e8b3ab19f --- /dev/null +++ b/packages/renderless/src/collapse/index.ts @@ -0,0 +1,48 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const setActiveNames = ({ emit, props, state }) => (activeNames) => { + activeNames = [].concat(activeNames) + const value = props.accordion ? activeNames[0] : activeNames + state.activeNames = activeNames + + emit('update:modelValue', value) + emit('change', value) +} + +export const handleItemClick = ({ api, props, state }) => (item) => { + const activeNames = state.activeNames.slice(0) + const index = activeNames.indexOf(item.name) + const beforeClose = () => { + let result = props.beforeClose ? props.beforeClose(item, state.activeNames) : true + + return new Promise((resolve) => { + if (result && result.then) { + result.then(() => resolve(true)).catch(() => resolve(false)) + } else { + resolve(result) + } + }) + } + + beforeClose().then((next) => { + if (props.accordion) { + if (next || !activeNames.length) { + api.setActiveNames(activeNames[0] === item.name ? '' : item.name) + } + } else { + index > -1 ? next && activeNames.splice(index, 1) : activeNames.push(item.name) + + api.setActiveNames(activeNames) + } + }) +} diff --git a/packages/renderless/src/collapse/vue.ts b/packages/renderless/src/collapse/vue.ts new file mode 100644 index 000000000..9c1aec086 --- /dev/null +++ b/packages/renderless/src/collapse/vue.ts @@ -0,0 +1,42 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { setActiveNames, handleItemClick } from './index' + +export const api = ['state'] + +export const renderless = (props, { reactive, watch }, { parent, emit, constants }) => { + const eventName = constants.EVENT_NAME.CollapseItemClick + + const state = reactive({ + activeNames: [] + }) + + const api = { + state, + setActiveNames: setActiveNames({ emit, props, state }) + } + + api.handleItemClick = handleItemClick({ api, props, state }) + + watch( + () => props.modelValue, + (value) => { + state.activeNames = value || value === 0 ? [].concat(value) : [] + }, + { immediate: true } + ) + + parent.$on(eventName, api.handleItemClick) + + return api +} diff --git a/packages/renderless/src/common/array.ts b/packages/renderless/src/common/array.ts new file mode 100644 index 000000000..dc562b6e4 --- /dev/null +++ b/packages/renderless/src/common/array.ts @@ -0,0 +1,240 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { SORT } from '@opentiny/vue-renderless/common' +import { isSame } from '@opentiny/vue-renderless/common/type' +import { getObj } from '@opentiny/vue-renderless/common/object' + +/** + * 返回在数组中可以找到一个给定元素的第一个索引,如果不存在,则返回-1。 + * 修复数组原生的 indexOf 方法不能判断 NaN 的问题 + * + * let arr1 = [1, 2, 3, 4] + * let arr2 = [1, 2, NaN, 4] + * indexOf(arr1, 2) // 1 + * indexOf(arr2, NaN) // 2 + * + * @param {Array} arr 要查找的数组 + * @param {Object} data 需要查找的数据 + * @param {Function} [predicate] 断言函数,缺省为 isSame, 两个参数为数组的元素和查找的数据 + * @returns {Number} + */ +export const indexOf = (arr, data, predicate = isSame) => { + if (Array.isArray(arr) && typeof predicate === 'function') { + for (let i = 0, len = arr.length; i < len; i++) { + if (predicate(arr[i], data)) { + return i + } + } + } + + return -1 +} + +/** + * 在数组里查找对象,调用自定义的断言函数。 + * + * let arr = [1, 2, 3, 4] + * find(arr, function (value) { return value > 2 }) // 3 + * + * @param {Array} arr 要查找的数组 + * @param {Function} predicate 断言函数 + * @returns {Object} + */ +export const find = (arr, predicate) => { + const index = indexOf(arr, undefined, predicate) + return index !== -1 ? arr[index] : undefined +} + +/** + * 从数组中删除指定元素,并返回该数组。 + * + * let arr1 = [1, 2, 3, 4] + * let arr2 = [1, 2, NaN, 4] + * remove(arr1, 2, 2) // [1, 4] + * remove(arr2, NaN) // [1, 2, 4] + * + * @param {Array} arr 源数组 + * @param {Object} data 需要删除的数据 + * @param {Number} count 删除元素个数,默认为 1 + * @returns {Array} + */ +export const remove = (arr, data, count = 1) => { + if (Array.isArray(arr) && arr.length) { + const index = indexOf(arr, data) + if (index > -1) { + arr.splice(index, count) + } + } + + return arr +} + +/** + * 对象数组自定义排序,并返回该数组。 + * + * sort([ {a:100}, {a:1}, {a:NaN}, {a:10} ], 'a') // [ {a:1}, {a:10}, {a:100}, {a:NaN} ] + * sort([ {a:100}, {a:1}, {a:NaN}, {a:10} ], 'a','desc') // [ {a:100}, {a:10}, {a:1}, {a:NaN} ] + * + * @param {Array} arr 需要排序的对象数组 + * @param {string} field 要排序的对象字段 + * @param {String} sort 排序方向,取值为 "asc" 或 "desc" + * @returns {Array} 排好序的对象数组 + */ +export const sort = (arr, field, sort = SORT.Asc) => { + if (Array.isArray(arr) && arr.length > 1) { + arr.sort((x, y) => { + const compare = sort === SORT.Asc ? [1, -1] : [-1, 1] + const xField = getObj(x, field) + const yField = getObj(y, field) + + if (isNaN(xField)) { + return sort === SORT.Asc ? 1 : -1 + } else if (isNaN(yField)) { + return -1 + } + + return xField > yField ? compare[0] : compare[1] + }) + } + + return arr +} + +/** + * 向数组中添加不重复的数据,并返回该数组。 + * + * let arr = [ 1, 2, NaN, 4] + * push(arr, 1) // [ 1, 2, NaN, 4] + * push(arr, NaN) // [ 1, 2, NaN, 4] + * push(arr, 5) // [ 1, 2, NaN, 4, 5] + * + * @param {Array} arr 源数组 + * @param {Object} data 需要增加的数据 + * @returns {Array} + */ +export const push = (arr, data) => { + if (Array.isArray(arr) && !arr.some((value) => isSame(value, data))) { + arr.push(data) + } + + return arr +} + +/** + * 去除数组中的重复的值,并返回新数组。 + * + * let arr = [ 1, NaN, 2, NaN, 2, 3, 4] + * unique(arr) // [ 1, NaN, 2, 3, 4] + * + * @param {Array} arr + * @returns {Array} + */ +export const unique = (arr) => { + if (Array.isArray(arr)) { + const array = [] + + for (let i = 0, len = arr.length; i < len; i++) { + const value = arr[i] + if (indexOf(array, value) === -1) { + array.push(value) + } + } + + return array + } + + return arr +} + +const extend = (to, _from) => { + Object.keys(_from).forEach((key) => (to[key] = _from[key])) + + return to +} + +/** + * 数组转对象 + * + * let arr = [ { key1: value1 }, { key2: value2 } ] + * toObject(arr) // { key1: value1, key2: value2 } + * + * @param {Array} arr + * @returns {Object} + */ +export const toObject = (arr) => { + const res = {} + + for (let i = 0; i < arr.length; i++) { + if (arr[i]) { + extend(res, arr[i]) + } + } + + return res +} + +/** + * 将 id 与 pid 构成的扁平数据转换成 children 的树状数据 + * + * let data = [{ id: 100, pId: 0, label: '首页'}, { id: 101, pId: 100, label: '指南'}] + * transformPidToChildren(data) // [ 0: { id: 100, label: "首页", children: [ 0: { id: 101, label: "指南" } ] } ] + * + * @param {Array} data id 与 pid 构成的扁平数据的数组 + * @param {String} [pidName] pid 的属性名,缺省为 pId + * @param {String} [childrenName] children 的属性名,缺省为 children + * @param {String} [idName] id 的属性名,缺省为 id + * @returns {Array} + */ +export const transformPidToChildren = (data, pidName = 'pId', childrenName = 'children', idName = 'id') => { + const result = [] + + Array.isArray(data) && + data.forEach((item) => { + if (item[pidName] == '0') { + result.push(item) + } else { + const parent = find(data, (i) => i[idName] == item[pidName]) + + if (!parent) { + return + } + + if (!parent[childrenName]) { + parent[childrenName] = [] + } + + parent[childrenName].push(item) + } + + delete item[pidName] + }) + + return result +} + +/** + * 将pid标识的普通数组转换树结构数据 + * @param {*} data + * @param {*} key + * @param {*} parentKey + */ +export const transformTreeData = (data, key = 'id', parentKey = 'pId') => { + if (!Array.isArray(data)) { + data = [data] + } + + data = data.map((item) => ({ ...item })) + + const treeData = transformPidToChildren(data, parentKey, 'children', key) + return treeData +} diff --git a/packages/renderless/src/common/bigInt.ts b/packages/renderless/src/common/bigInt.ts new file mode 100644 index 000000000..642df3ab9 --- /dev/null +++ b/packages/renderless/src/common/bigInt.ts @@ -0,0 +1,409 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { fillChar } from '@opentiny/vue-renderless/common/string' + +const BigInt = window.BigInt + +export function supportBigInt() { + return typeof BigInt === 'function' +} + +export function trimNumber(numStr) { + let string = numStr.toString().trim() + let negative = string.startsWith('-') + + if (negative) { + string = string.slice(1) + } + + string = string // Remove decimal 0. `1.000` => `1.`, `1.100` => `1.1` + .replace(/(\.\d*[^0])0*$/, '$1') // Remove useless decimal. `1.` => `1` + .replace(/\.0*$/, '') // Remove integer 0. `0001` => `1`, 000.1' => `.1` + .replace(/^0+/, '') + + if (string.startsWith('.')) { + string = '0'.concat(string) + } + + let trimStr = string || '0' + let splitNumber = trimStr.split('.') + let integerStr = splitNumber[0] || '0' + let decimalStr = splitNumber[1] || '0' + + if (integerStr === '0' && decimalStr === '0') { + negative = false + } + + let negativeStr = negative ? '-' : '' + + return { + negative, + negativeStr, + trimStr, + integerStr, + decimalStr, + fullStr: ''.concat(negativeStr).concat(trimStr) + } +} + +export function isE(number) { + let str = String(number) + return !isNaN(Number(str)) && ~str.indexOf('e') +} + +export function validateNumber(num) { + if (typeof num === 'number') { + return !isNaN(num) + } // Empty + + if (!num) { + return false + } + + return ( + // Normal type: 11.28 + /^\s*-?\d+(\.\d+)?\s*$/.test(num) || // Pre-number: 1. + /^\s*-?\d+\.\s*$/.test(num) || // Post-number: .1 + /^\s*-?\.\d+\s*$/.test(num) + ) +} + +/** + * [Legacy] Convert 1e-9 to 0.000000001. + * This may lose some precision if user really want 1e-9. + */ + +export function getNumberPrecision(number) { + let numStr = String(number) + + if (isE(number)) { + let precision = Number(numStr.slice(numStr.indexOf('e-') + 2)) + let decimalMatch = numStr.match(/\.(\d+)/) + + if (decimalMatch === null || decimalMatch === void 0 ? void 0 : decimalMatch[1]) { + precision += decimalMatch[1].length + } + + return precision + } + + return ~numStr.indexOf('.') && validateNumber(numStr) ? numStr.length - numStr.indexOf('.') - 1 : 0 +} + +/** + * Convert number (includes scientific notation) to -xxx.yyy format + */ + +export function num2str(number) { + let numStr = String(number) + + if (isE(number)) { + if (number > Number.MAX_SAFE_INTEGER) { + return String(supportBigInt() ? BigInt(number).toString() : Number.MAX_SAFE_INTEGER) + } + + if (number < Number.MIN_SAFE_INTEGER) { + return String(supportBigInt() ? BigInt(number).toString() : Number.MIN_SAFE_INTEGER) + } + + numStr = number.toFixed(getNumberPrecision(numStr)) + } + + return trimNumber(numStr).fullStr +} + +function pluginDecimal(decimal) { + if (!decimal.add) { + Object.assign(decimal, { + add: decimal.plus, + lessEquals: decimal.isLessThan, + equals: decimal.isEqualTo + }) + } + + return decimal +} + +const DecimalCls = { + CLS: null +} + +let setDecimalClass + +export function getMiniDecimal(value, decimal) { + // We use BigInt here. Will fallback to Number if not support. + if (!DecimalCls.CLS) { + setDecimalClass(decimal) + } + + return pluginDecimal(new DecimalCls.CLS(value)) +} + +export class BigIntDecimal { + constructor(value) { + if ((!value && value !== 0) || !String(value).trim()) { + this.empty = true + return + } + + this.origin = String(value) + this.negative = void 0 + this.integer = void 0 + this.decimal = void 0 + this.decimalLen = void 0 + this.empty = void 0 + this.nan = void 0 + + if (value === '-') { + this.nan = true + + return + } + + let mergedValue = isE(value) ? Number(value) : value + + if (typeof mergedValue !== 'string') { + num2str(mergedValue) + } + const f = Function + const convertBigInt = (str) => f(`return BigInt(${str})`)() + if (validateNumber(mergedValue)) { + const trimRet = trimNumber(mergedValue) + this.negative = trimRet.negative + const numbers = trimRet.trimStr.split('.') + this.integer = BigInt(numbers[0]) + const decimalStr = numbers[1] || '0' + this.decimal = convertBigInt(decimalStr) + } else { + this.nan = true + } + } + + getDecimalStr() { + return this.decimal.toString().padStart(this.decimalLen, '0') + } + + getIntegerStr() { + return this.integer.toString() + } + + getMark() { + return this.negative ? '-' : '' + } + + /** + * Align BigIntDecimal with same decimal length. e.g. 12.3 + 5 = 1230000 + * This is used for add function only. + */ + alignDecimal(decimalLength) { + const string = `${this.getMark()}${this.getIntegerStr()}${this.getDecimalStr().padEnd(decimalLength, '0')}` + + return BigInt(string) + } + + add(value) { + if (this.isInvalidate()) { + return new BigIntDecimal(value) + } + + const offsetObj = new BigIntDecimal(value) + if (offsetObj.isInvalidate()) { + return this + } + + const maxDecimalLength = Math.max(this.getDecimalStr().length, offsetObj.getDecimalStr().length) + const offsetAlignedDecimal = offsetObj.alignDecimal(maxDecimalLength) + const myAlignedDecimal = this.alignDecimal(maxDecimalLength) + + const valueStr = `${myAlignedDecimal + offsetAlignedDecimal}` + + const { negativeStr: str, trimStr } = trimNumber(valueStr) + const hydrateValueStr = `${str}${trimStr.padStart(maxDecimalLength + 1, '0')}` + + return getMiniDecimal(`${hydrateValueStr.slice(0, -maxDecimalLength)}.${hydrateValueStr.slice(-maxDecimalLength)}`) + } + + negate() { + const clone = new BigIntDecimal(this.toString()) + clone.negative = !clone.negative + + return clone + } + + isNaN() { + return this.nan + } + + isEmpty() { + return this.empty + } + + isInvalidate() { + return this.isEmpty() || this.isNaN() + } + + lessEquals(target) { + return this.add(target.negate().toString()).toNumber() <= 0 + } + + equals(target) { + return this.toString() === (target && target.toString()) + } + + toNumber() { + if (this.isNaN()) { + return NaN + } + + return Number(this.toString()) + } + + toString(safe = true) { + if (!safe) { + return this.origin + } + + if (this.isInvalidate()) { + return '' + } + + return trimNumber(`${this.getMark()}${this.getIntegerStr()}.${this.getDecimalStr()}`).fullStr + } +} + +export class NumberDecimal { + constructor(value = '') { + if ((!value && value !== 0) || !String(value).trim()) { + this.empty = true + return + } + this.origin = '' + this.number = void 0 + this.empty = void 0 + + this.origin = String(value) + this.number = Number(value) + } + + negate() { + return new NumberDecimal(-this.toNumber()) + } + + add(value) { + if (this.isInvalidate()) { + return new NumberDecimal(value) + } + + const target = Number(value) + + if (isNaN(target)) { + return this + } + + const number = this.number + target + + if (number < Number.MIN_SAFE_INTEGER) { + return new NumberDecimal(Number.MIN_SAFE_INTEGER) + } + + if (number > Number.MAX_SAFE_INTEGER) { + return new NumberDecimal(Number.MAX_SAFE_INTEGER) + } + + const maxPrecision = Math.max(getNumberPrecision(target), getNumberPrecision(this.number)) + return new NumberDecimal(number.toFixed(maxPrecision)) + } + + isNaN() { + return isNaN(this.number) + } + + isEmpty() { + return this.empty + } + + isInvalidate() { + return this.isEmpty() || this.isNaN() + } + + equals(target) { + return this.toNumber() === (target && target.toNumber()) + } + + lessEquals(target) { + return this.add(target.negate().toString()).toNumber() <= 0 + } + + toNumber() { + return this.number + } + + toString(safe = true) { + if (!safe) { + return this.origin + } + + if (this.isInvalidate()) { + return '' + } + + return num2str(this.number) + } +} + +setDecimalClass = function (decimaljs) { + DecimalCls.CLS = supportBigInt() ? BigIntDecimal : typeof decimaljs === 'function' ? decimaljs : NumberDecimal +} + +export { setDecimalClass } + +export function lessEquals(value1, value2) { + return getMiniDecimal(value1).lessEquals(getMiniDecimal(value2)) +} + +export function equalsDecimal(value1, value2) { + return getMiniDecimal(value1).equals(getMiniDecimal(value2)) +} + +export function toFixed(numStr, precision, rounding = 5) { + if (numStr === '') { + return '' + } + const separatorStr = '.' + const { negativeStr, integerStr, decimalStr } = trimNumber(numStr) + const precisionDecimalStr = `${separatorStr}${decimalStr}` + const numberWithoutDecimal = `${negativeStr}${integerStr}` + + if (precision >= 0) { + // We will get last + 1 number to check if need advanced number + const advancedNum = Number(decimalStr[precision]) + + if (advancedNum >= rounding && rounding !== 0) { + const advancedDecimal = getMiniDecimal(`${integerStr}${separatorStr}${decimalStr}`).add(`0.${fillChar('', precision, true)}${10 - advancedNum}`) + + return toFixed(negativeStr + advancedDecimal.toString(), precision, 0) + } + + if (precision === 0) { + return numberWithoutDecimal + } + + return `${numberWithoutDecimal}${separatorStr}${fillChar(decimalStr, precision, true).slice(0, precision)}` + } + + if (precisionDecimalStr === '.0') { + return numberWithoutDecimal + } + + return `${numberWithoutDecimal}${precisionDecimalStr}` +} diff --git a/packages/renderless/src/common/browser.ts b/packages/renderless/src/common/browser.ts new file mode 100644 index 000000000..5e8b77c1d --- /dev/null +++ b/packages/renderless/src/common/browser.ts @@ -0,0 +1,89 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +const getIEVersion = () => { + let version = 8 + if (!!document.addEventListener && !!window.performance) { + version = 9 + if (!!window.atob && !!window.matchMedia) { + version = 10 + if (!window.attachEvent && !document.all) { + version = 11 + } + } + } + return version +} + +const isEdge = (browser) => { + if (browser.chrome && ~navigator.userAgent.indexOf('Edg')) { + browser.name = 'edge' + browser.edge = true + delete browser.chrome + } else if (!document.documentMode && !!window.StyleMedia) { + browser.name = 'edge' + browser.edge = true + } +} + +export default (() => { + const isMobile = /(Android|webOS|iPhone|iPad|iPod|SymbianOS|BlackBerry|Windows Phone)/.test(navigator.userAgent) + const browser = { + name: undefined, + version: undefined, + isDoc: typeof document !== 'undefined', + isMobile, + isPC: !isMobile, + isNode: typeof window === 'undefined' + } + + let matches + + if (!!window.chrome && (!!window.chrome.webstore || /^Google\b/.test(window.navigator.vendor))) { + browser.name = 'chrome' + browser.chrome = true + matches = navigator.userAgent.match(/chrome\/(\d+)/i) + browser.version = !!matches && !!matches[1] && parseInt(matches[1], 10) + matches = undefined + } else if (!!document.all || !!document.documentMode) { + browser.name = 'ie' + browser.version = getIEVersion() + browser.ie = true + } else if (typeof window.InstallTrigger !== 'undefined') { + browser.name = 'firefox' + browser.firefox = true + } else if (Object.prototype.toString.call(window.HTMLElement).indexOf('Constructor') > 0) { + browser.name = 'safari' + browser.safari = true + } else if ((!!window.opr && !!window.opr.addons) || !!window.opera) { + browser.name = 'opera' + browser.opera = true + } + + isEdge(browser) + + if (!~['ie', 'chrome'].indexOf(browser.name)) { + const reg = browser.name + '/(\\d+)' + matches = navigator.userAgent.match(new RegExp(reg, 'i')) + browser.version = !!matches && !!matches[1] && parseInt(matches[1], 10) + matches = undefined + } + + if (browser.isDoc) { + const bodyEl = document.body || document.documentElement; + ['webkit', 'khtml', 'moz', 'ms', 'o'].forEach((core) => { + browser['-' + core] = !!bodyEl[core + 'MatchesSelector'] + }) + } + + return browser +})() diff --git a/packages/renderless/src/common/dataset/index.ts b/packages/renderless/src/common/dataset/index.ts new file mode 100644 index 000000000..1e8712bb9 --- /dev/null +++ b/packages/renderless/src/common/dataset/index.ts @@ -0,0 +1,142 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { format } from '@opentiny/vue-renderless/common/string' +import { isObject } from '@opentiny/vue-renderless/common/type' +import { transformTreeData } from '@opentiny/vue-renderless/common/array' + +/** + * 转换过滤参数 + * @param {*} filters + */ +const getFilterStr = (filters) => { + const filterArr = {} + + Object.keys(filters).forEach((property) => { + const { type, value } = filters[property] + + if (type === 'enum') { + filterArr[property] = { type: value.map(() => 0), value } + + if (value.length > 1) { + filters[property].relation = 'or' + } + } + + if (type === 'input') { + const { relation, text } = value + + filterArr[property] = { + type: [relation === 'startwith' ? 8 : relation === 'equals' ? 0 : 6], + value: text + } + } + }) + + return JSON.stringify(filterArr) +} + +/** + * 根据命名空间取对象的值 + * + * @param {*} obj + * @param {*} names + */ +const getNsObj = (obj, names) => { + const arr = Array.isArray(names) ? names : names.split('.') + const curkey = arr.shift() + const curObj = obj[curkey] + + if (isObject(curObj) && arr.length) { + return getNsObj(curObj, arr) + } + + return curObj +} + +const handlerArgs = (options, args) => { + if (args) { + const { page, sort, filters } = args + const { currentPage, pageSize } = page || {} + const filterStr = getFilterStr(filters || {}) + const orderBy = sort && sort.property ? sort.property + ' ' + sort.order : '' + + options.url = format(options.url, { + curPage: currentPage, + pageSize, + filterStr, + orderBy + }) + } +} + +const transForm = (response, tree) => { + const { result, pageVO } = response + const { key = 'id', parentKey } = tree || {} + let data = result || response + + if (parentKey) { + data = transformTreeData(data, key, parentKey) + } + + return pageVO ? { result: data, page: { total: pageVO.totalRows } } : data +} + +/** + * dataset简单数据处理 + * @param {*} dataset + * @param {*} service + */ +export const getDataset = ({ dataset, service, tree }, args) => + new Promise((resolve, reject) => { + const { source, value, api } = dataset || {} + const $service = service || (dataset && dataset.service) + if (Array.isArray(dataset)) { + return resolve(transForm(dataset, tree)) + } + if (Array.isArray(value)) { + return resolve(transForm(value, tree)) + } + if (!$service) { + return resolve([]) + } + if (isObject(source) && source.url) { + const { type = 'GET', data, beforeRequest, afterRequest, success, hideErr, url, method, ...options } = source + options.url = url + options.method = method || type.toLocaleLowerCase() + const mergeTarget = options.method === 'get' ? 'params' : 'data' + options[mergeTarget] = data || {} + const afterRequestFn = afterRequest || success + const config = { ...options } + handlerArgs(config, args) + beforeRequest && beforeRequest(config, args) + $service.network + .request(config) + .then((response) => { + afterRequestFn && afterRequestFn(response.data) + resolve(transForm(response.data, tree)) + }) + .catch((error) => { + hideErr || reject(error) + }) + } else if (api) { + const fetchFn = getNsObj($service, api.name) + fetchFn && + fetchFn({ ...api.data, ...args }) + .then((response) => { + resolve(transForm(response, tree)) + }) + .catch((error) => { + reject(error) + }) + } + }) diff --git a/packages/renderless/src/common/date.ts b/packages/renderless/src/common/date.ts new file mode 100644 index 000000000..171b7743d --- /dev/null +++ b/packages/renderless/src/common/date.ts @@ -0,0 +1,529 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { isDate, isNumber, isNumeric } from '@opentiny/vue-renderless/common/type' +import { fillChar } from '@opentiny/vue-renderless/common/string' + +const daysInMonths = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31] +const yyyymmddReg = new RegExp( + '^(\\d{4})(/|-)(((0)?[1-9])|(1[0-2]))((/|-)(((0)?[1-9])|([1-2][0-9])|(3[0-1])))' + + '?( ((0)?[0-9]|1[0-9]|20|21|22|23):([0-5]?[0-9])((:([0-5]?[0-9]))?(.([0-9]{1,6}))?)?)?$' +) +const mmddyyyyReg = new RegExp( + '^(((0)?[1-9])|(1[0-2]))(/|-)(((0)?[1-9])|([1-2][0-9])|(3[0-1]))?(/|-)?(\\d{4})' + + '( ((0)?[0-9]|1[0-9]|20|21|22|23):([0-5]?[0-9])((:([0-5]?[0-9]))?(.([0-9]{1,6}))?)?)?$' +) +const iso8601Reg = new RegExp( + '^(\\d{4})-(((0)?[1-9])|(1[0-2]))-(((0)?[1-9])|([1-2][0-9])|(3[0-1]))T' + + '(((0)?[0-9]|1[0-9]|20|21|22|23):([0-5]?[0-9])((:([0-5]?[0-9]))?(.([0-9]{1,6}))?)?)?(Z|([+-])' + + '((0)?[0-9]|1[0-9]|20|21|22|23):?([0-5]?[0-9]))$' +) + +const dateFormatRegs = { + 'y{1,4}': /y{1,4}/, + 'M{1,2}': /M{1,2}/, + 'd{1,2}': /d{1,2}/, + 'h{1,2}': /h{1,2}/, + 'm{1,2}': /m{1,2}/, + 's{1,2}': /s{1,2}/, + 'S{1,3}': /S{1,3}/, + 'Z{1,1}': /Z{1,1}/ +} + +const maxDateValues = { + YEAR: 9999, + MONTH: 11, + DATE: 31, + HOUR: 23, + MINUTE: 59, + SECOND: 59, + MILLISECOND: 999 +} + +const timezone1 = '-12:00,-11:00,-10:00,-09:30,-08:00,-07:00,-06:00,-05:00,-04:30,-04:00,-03:30,-02:00,-01:00' +const timezone2 = '-00:00,+00:00,+01:00,+02:00,+03:00,+03:30,+04:00,+04:30,+05:00,+05:30,+05:45,+06:00' +const timezone3 = '+06:30,+07:00,+08:00,+09:00,+10:00,+10:30,+11:00,+11:30,+12:00,+12:45,+13:00,+14:00' +const timezones = [].concat(timezone1.split(','), timezone2.split(','), timezone3.split(',')) + +const getTimezone = (date) => { + const timezoneoffset = 0 - date.getTimezoneOffset() / 60 + let timezone + + if (timezoneoffset === 0) { + timezone = 'Z' + } else if (timezoneoffset > 0) { + timezone = '+' + (timezoneoffset > 10 ? timezoneoffset : '0' + timezoneoffset) + '00' + } else { + timezone = (timezoneoffset < -10 ? timezoneoffset : '-0' + -timezoneoffset) + '00' + } + + return timezone +} + +/** + * 判断年份是否为闰年。 + * + * isLeapYear(2017) // false + * isLeapYear(2000) // true + * + * @param {Number} year 年份 + * @returns {Boolean} + */ +export const isLeapYear = (year) => year % 400 === 0 || (year % 4 === 0 && year % 100 !== 0) + +const getDateFromData = ({ year, month, date, hours, minutes, seconds, milliseconds }) => { + let daysInMonth = daysInMonths[month] + + if (isLeapYear(year) && month === 1) { + daysInMonth += 1 + } + + if (date <= daysInMonth) { + return new Date(year, month, date, hours, minutes, seconds, milliseconds) + } +} + +const yyyymmddDateParser = (m) => { + /* istanbul ignore else */ + if (m.length === 23) { + const year = Number(m[1]) + const month = m[3] - 1 + const date = Number(m[9] || 1) + const hours = m[15] || 0 + const minutes = m[17] || 0 + const seconds = m[20] || 0 + const milliseconds = m[22] || 0 + + return getDateFromData({ + date, + year, + hours, + month, + seconds, + minutes, + milliseconds + }) + } +} + +const mmddyyyyDateParser = (m) => { + /* istanbul ignore else */ + if (m.length === 22) { + const year = Number(m[12]) + const month = m[1] - 1 + const date = Number(m[6] || 1) + const hours = m[14] || 0 + const minutes = m[16] || 0 + const seconds = m[19] || 0 + const milliseconds = m[21] || 0 + + return getDateFromData({ + year, + month, + date, + hours, + minutes, + seconds, + milliseconds + }) + } +} + +const iso8601DateParser = (m) => { + if (m.length !== 25) { + return + } + const year = Number(m[1]) + const month = m[2] - 1 + const date = Number(m[6]) + const offset = new Date(year, month, date).getTimezoneOffset() + const hours = m[12] || 0 + const minutes = m[14] || 0 + const seconds = m[17] || 0 + const milliseconds = m[19] || 0 + let timeZone = m[20] + const sign = m[21] + const offsetHours = m[22] || 0 + const offsetMinutes = m[24] || 0 + let daysInMonth = daysInMonths[month] + let actHours + let actMinutes + if (isLeapYear(year) && month === 1) { + daysInMonth += 1 + } + if (date <= daysInMonth) { + if (timeZone === 'Z') { + actHours = hours - offset / 60 + actMinutes = minutes + } else { + if (!timeZone.includes(':')) { + timeZone = timeZone.substr(0, 3) + ':' + timeZone.substr(3) + } + if (!timezones.includes(timeZone)) { + return + } + + actHours = sign === '+' ? hours - offsetHours - offset / 60 : Number(hours) + Number(offsetHours) - offset / 60 + actMinutes = sign === '+' ? minutes - offsetMinutes : Number(minutes) + Number(offsetMinutes) + } + return new Date(year, month, date, actHours, actMinutes, seconds, milliseconds) + } +} + +const dateParsers = [ + [yyyymmddReg, yyyymmddDateParser], + [mmddyyyyReg, mmddyyyyDateParser], + [iso8601Reg, iso8601DateParser] +] + +const parseDate = (str) => { + for (let i = 0, len = dateParsers.length; i < len; i++) { + const m = dateParsers[i][0].exec(str) + + if (m && m.length > 0) { + return dateParsers[i][1](m) + } + } +} + +const matchDateArray = (arr, value, text) => { + if (text) { + switch (text) { + case 'yyyy': + case 'yy': + arr[0] = value + break + case 'M': + case 'MM': + arr[1] = value - 1 + break + case 'd': + case 'dd': + arr[2] = value + break + case 'h': + case 'hh': + arr[3] = value + break + case 'm': + case 'mm': + arr[4] = value + break + case 's': + case 'ss': + arr[5] = value + break + case 'S': + case 'SS': + case 'SSS': + arr[6] = value + break + default: + break + } + } +} + +const getDateArray = (str, dateFormat) => { + const arr = [0, -1, 0, 0, 0, 0] + + if (str.length !== dateFormat.length) { + return arr + } + + let valuePos = 0 + let textPos = 0 + + for (let i = 0, len = str.length; i < len; i++) { + const charValue = str.substr(i, 1) + const notNum = isNaN(Number(charValue)) || charValue.trim() === '' + + if ((notNum && charValue === dateFormat.substr(i, 1)) || i === len - 1) { + let value + let text + + if (notNum) { + value = str.substring(valuePos, i) + valuePos = i + 1 + const end = dateFormat.indexOf(charValue, textPos) + + text = dateFormat.substring(textPos, end === -1 ? dateFormat.length : end) + + textPos = end + 1 + } else { + value = str.substring(valuePos, len) + text = dateFormat.substring(textPos, len) + } + + if (value.length === text.length || value) { + matchDateArray(arr, value, text) + } + } + } + + return arr +} + +const invalideTime = (time, min, max) => isNaN(time) || time < min || time > max + +const invalideValue = ({ year, month, date, hours, minutes, seconds, milliseconds }) => + invalideTime(year, 0, maxDateValues.YEAR) || + invalideTime(month, 0, maxDateValues.MONTH) || + invalideTime(date, 0, maxDateValues.DATE) || + invalideTime(hours, 0, maxDateValues.HOUR) || + invalideTime(minutes, 0, maxDateValues.MINUTE) || + invalideTime(seconds, 0, maxDateValues.SECOND) || + invalideTime(milliseconds, 0, maxDateValues.MILLISECOND) + +const innerParse = (value, dateFormat) => { + if (typeof dateFormat === 'string') { + const arr = getDateArray(value, dateFormat) + const year = Number(arr[0]) + const month = Number(arr[1]) + const date = Number(arr[2] || 1) + const hours = Number(arr[3] || 0) + const minutes = Number(arr[4] || 0) + const seconds = Number(arr[5] || 0) + const milliseconds = Number(arr[6] || 0) + + if ( + invalideValue({ + year, + month, + date, + hours, + minutes, + seconds, + milliseconds + }) + ) { + return + } + + return getDateFromData({ + year, + date, + month, + minutes, + hours, + milliseconds, + seconds + }) + } else { + return parseDate(value) + } +} + +/** + * 将字符串或数字转换成 Date 类型。 + * + * toDate('2008/02/02') // new Date(2008, 1, 2) + * toDate(Date.UTC(2008, 1, 2)) // new Date(Date.UTC(2008, 1, 2)) + * toDate('2008/2/2', 'yyyy/M/d') // new Date(2008, 1, 2) + * toDate('2008/02') // new Date(2008, 1, 1) + * toDate('02/2008') // new Date(2008, 1, 1) + * toDate('2008-02-01T20:08+08:00') // new Date(Date.UTC(2008, 0, 31, 16)) + * toDate('2008-02-01T04:08-08:00') // new Date(Date.UTC(2008, 1, 1, 8)) + * + * @param {String|Number} value 日期类型字符串或数字 + * @param {String} [dateFormat] 转换格式 + * + * 当 value 为字符串类型时,如果不提供,则尽可能按常见格式去解析。 + * 常见格式为 yyyy[/-]MM[/-]dd hh:mm:ss.SSS, MM[/-]dd [/-]yyyy hh:mm:ss.SSS 及 ISO8601 时间格式。 + * + * 如果提供,则按具体格式严格匹配解析,并且年份必须为4位。 + * - yyyy 代表年份 + * - M 或 MM 代表1位或2位的月份 + * - d 或 dd 代表1位或2位的天数 + * - h 或 hh 代表24小时的1位或2位的小时 + * - m 或 mm 代表1位或2位的分钟, + * - s 或 ss 代表1位或2位的秒 + * - S 或 SS 或 SSS 代表1位或2位或3位的毫秒 + * + * @param {String} [minDate] 最小时间,默认为 0001-01-01 00:00:00.000 + * @returns {Date} + */ +export const toDate = (value, dateFormat, minDate) => { + let date + + if (isNumber(value)) { + date = new Date(value) + } else if (typeof value === 'string') { + date = innerParse(value, dateFormat) + } + + if (minDate) { + const min = (minDate && toDate(minDate)) || new Date(1, 1, 1, 0, 0, 0) + return date && date < min ? min : date + } + + return date +} + +/** + * 将 Date 实例转换成日期字符串。 + * 当 date 为日期字符串时,如果只有2个参数,则第2个参数为格式化后的格式化字符串 + * 如果有3个参数,则第2个参数为转换的格式化参数,第3个参数为格式化后的格式化参数 + * + * let date = new Date(2014, 4, 4, 1, 2, 3, 4) + * format(date) // "2014/05/04 01:02:03" + * format(date, 'yyyy/MM/dd hh:mm:ss.SSS') // "2014/05/04 01:02:03.004" + * format(date, 'yyyy/MM/dd hh:mm:ss.SSSZ') // "2014/05/04 01:02:03.004+0800" + * format(date, 'yyyy年MM月dd日 hh时mm分ss秒SSS毫秒') // "2014年05月04日 01时02分03秒004毫秒" + * format('2008/01/02', 'yyyy/MM/dd hh:mm:ss.SSS') // "2008/02/02 00:00:00.000" + * format('2014/01/02/03/04/05/06', 'yyyy/MM/dd/hh/mm/ss', 'yyyy年MM月dd日 hh时mm分ss秒') // "2014年01月02日 03时04分05秒006毫秒" + * + * @param {Date|String} date Date 实例或日期字符串 + * @param {String} [dateFormat='yyyy/MM/dd hh:mm:ss'] 转换格式 + * + * 常见格式为 yyyy[/-]MM[/-]dd hh:mm:ss.SSS, MM[/-]dd [/-]yyyy hh:mm:ss.SSS 及 ISO8601 时间格式。 + * + * 如果提供,则按具体格式严格匹配解析,并且年份必须为4位。 + * - yyyy 代表年份 + * - M 或 MM 代表1位或2位的月份 + * - d 或 dd 代表1位或2位的天数 + * - h 或 hh 代表24小时的1位或2位的小时 + * - m 或 mm 代表1位或2位的分钟, + * - s 或 ss 代表1位或2位的秒 + * - S 或 SS 或 SSS 代表1位或2位或3位的毫秒 + * + * @returns {String} + */ +export const format = function (date, dateFormat = 'yyyy/MM/dd hh:mm:ss') { + if (isDate(date)) { + if (typeof dateFormat === 'string') { + const o = { + 'y{1,4}': date.getFullYear(), + 'M{1,2}': date.getMonth() + 1, + 'd{1,2}': date.getDate(), + 'h{1,2}': date.getHours(), + 'm{1,2}': date.getMinutes(), + 's{1,2}': date.getSeconds(), + 'S{1,3}': date.getMilliseconds(), + 'Z{1,1}': getTimezone(date) + } + + Object.keys(o).forEach((k) => { + const m = dateFormat.match(dateFormatRegs[k]) + + if (k && m && m.length) { + dateFormat = dateFormat.replace(m[0], k === 'Z{1,1}' ? o[k] : fillChar(o[k].toString(), m[0].length)) + } + }) + + return dateFormat + } + } else if (typeof date === 'string' && arguments.length >= 2) { + let afterFormat = dateFormat + + if (arguments.length === 2) { + dateFormat = undefined + } else { + afterFormat = arguments[2] + } + + const dateValue = toDate(date, dateFormat) + return dateValue ? format(dateValue, afterFormat) : '' + } +} + +/** + * 将当前操作的时间变更时区,主要用于转换一个其他时区的时间。 + * + * let date = new Date(2017, 0, 1) + * getDateWithNewTimezone(date, 0, -2) + * + * @param {Date} date Date 实例或日期字符串 + * @param {Number} otz 原时区 -12~13 + * @param {Number} ntz 目标时区 -12~13 默认为当前时区 + * @returns {Date} + */ +export const getDateWithNewTimezone = (date, otz, ntz) => { + if (!isDate(date) || !isNumeric(otz) || !isNumeric(ntz)) { + return + } + + const otzOffset = -otz * 60 + const ntzOffset = -ntz * 60 + const utc = date.getTime() + otzOffset * 60000 + + return new Date(utc - ntzOffset * 60000) +} + +/** + * 按时区将 Date 实例转换成字符串。 + * + * toDateStr(new Date(2017, 0, 1, 12, 30), 'yyyy/MM/dd hh:mm', 3) // "2017/01/01 15:30" + * toDateStr('2008/01/02', 'yyyy/MM/dd hh:mm', 3) // "2008/01/02 03:00" + * + * @param {Date|String} date Date 实例或日期字符串 + * @param {String} dateFormat 转换格式 + * @param {Number} [timezone] 时区 + * @returns {String} + */ +export const toDateStr = (date, dateFormat, timezone) => { + if (date && isNumeric(timezone)) { + timezone = parseFloat(parseFloat(timezone).toFixed(2)) + + date = getDateWithNewTimezone(isDate(date) ? date : new Date(toDate(date)), 0, timezone) + } + + return format(date, dateFormat) +} + +/** + * 获取日期所在周的第一天,默认周一为第一天(可扩展周日为第一天)。 + * + * getWeekOfFirstDay() // 返回当前日期所在周的周一同一时间 + * getWeekOfFirstDay(true) // 返回当前日期所在周的周日同一时间 + * getWeekOfFirstDay(new Date(2019, 8, 5)) // new Date(2019, 8, 2) + * getWeekOfFirstDay(new Date(2019, 8, 5)), true) // new Date(2019, 8, 1) + * + * @param {Date} [date=new Date()] date 日期实例,默认当天 + * @param {Boolean} [isSunFirst] 是否设置周日为第一天,非必填 + * @returns {Date} + */ +export const getWeekOfFirstDay = (date, isSunFirst) => { + typeof date === 'boolean' && (isSunFirst = date) + isDate(date) || (date = new Date()) + + const day = date.getDay() + let dayOfMonth = date.getDate() + + if (day === 0) { + !isSunFirst && (dayOfMonth -= 6) + } else { + dayOfMonth = dayOfMonth - day + (!isSunFirst && 1) + } + + return new Date(date.getFullYear(), date.getMonth(), dayOfMonth) +} + +const TZRE = /(-|\+)(\d{2}):?(\d{2})$/ + +export const getLocalTimezone = () => 0 - new Date().getTimezoneOffset() / 60 + +export const getStrTimezone = (value) => { + const localTimeZone = getLocalTimezone() + const match = typeof value === 'string' && value.match(TZRE) + + if (match) { + const minoffset = Number(match[2]) + Number(match[3]) / 60 + value = minoffset * `${match[1]}1` + } + + if (isNumber(value) && value >= -12 && value <= 12) { + return value + } + + return localTimeZone +} diff --git a/packages/renderless/src/common/decimal.ts b/packages/renderless/src/common/decimal.ts new file mode 100644 index 000000000..efe33a5c7 --- /dev/null +++ b/packages/renderless/src/common/decimal.ts @@ -0,0 +1,261 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getMiniDecimal, toFixed as roundFixed } from './bigInt' + +export { roundFixed } + +const DECIMAL_SEPARATOR = '.' + +const asInteger = (number) => { + const tokens = number.split(DECIMAL_SEPARATOR) + const integer = tokens[0] + const fractional = tokens[1] + let value + let exp + + if (fractional) { + value = parseInt(number.split(DECIMAL_SEPARATOR).join(''), 10) + exp = fractional.length * -1 + } else { + const trailingZeros = integer.match(/0+$/) + if (trailingZeros) { + const length = trailingZeros[0].length + value = integer.substr(0, integer.length - length) + exp = length + } else { + value = integer + exp = 0 + } + } + + return { value, exp } +} + +const zero = (exp) => { + let result + + if (exp <= 0) { + result = '' + } else if (String.prototype.repeat) { + result = '0'.repeat(exp) + } else { + result = ((times) => { + const zeros = [] + + for (let i = 0; i < times; i++) { + zeros.push(0) + } + return zeros.join('') + })(exp) + } + + return result +} + +const negExp = (str, position) => { + position = Math.abs(position) + + const offset = position - str.length + let sep = DECIMAL_SEPARATOR + + if (offset >= 0) { + str = zero(offset) + str + sep = '0.' + } + + const length = str.length + const dif = length - position + const head = str.substr(0, dif) + const tail = str.substring(dif, length) + + return head + sep + tail +} + +const posExp = (str, exp) => String(str + zero(exp)) + +const format = (num, exp) => (exp >= 0 ? posExp : negExp)(String(num), exp) + +/** + * Decimal 类,解决 JS 的计算精度问题。 + * + * // 加法运算 1.1 + 2.2 = 3.3000000000000003 + * Decimal.add(1.1, 2.2).toNumber() // 3.3 + * new Decimal('1.1').add('2.2').toString() // "3.3" + * + * // 减法运算 0.3 - 0.1 = 0.19999999999999998 + * Decimal.sub(0.3, 0.1).toNumber() // 0.2 + * new Decimal('0.3').sub('0.1').toString() // "0.2" + * + * // 乘法运算 4.01 * 2.01 = 8.060099999999998 + * Decimal.mul(4.01, 2.01).toNumber() // 8.0601 + * new Decimal('4.01').mul('2.01').toString() // "8.0601" + * + * // 除法运算 0.3 / 0.1 = 2.9999999999999996 + * Decimal.div(0.3, 0.1).toNumber() // 3 + * new Decimal('0.3').div('0.1').toString() // "3" + * + * @param {Number|String|} num 数字或字符串代表的数字 + * @returns {Number} + */ +export function Decimal(num) { + if (!this || this.constructor !== Decimal) { + return new Decimal(num) + } + + if (num instanceof Decimal) { + return num + } + + this.internal = String(num) + this.asInt = asInteger(this.internal) + this.add = (target) => { + const operands = [this, new Decimal(target)] + operands.sort((x, y) => x.asInt.exp - y.asInt.exp) + const smallest = operands[0].asInt.exp + const biggest = operands[1].asInt.exp + const x = Number(format(operands[1].asInt.value, biggest - smallest)) + const y = Number(operands[0].asInt.value) + + return new Decimal(format(String(x + y), smallest)) + } + + this.sub = (target) => new Decimal(this.add(target * -1)) + this.mul = (target) => { + target = new Decimal(target) + const result = String(this.asInt.value * target.asInt.value) + const exp = this.asInt.exp + target.asInt.exp + + return new Decimal(format(result, exp)) + } + + this.div = (target) => { + target = new Decimal(target) + + const smallest = Math.min(this.asInt.exp, target.asInt.exp) + const absSmallest = 10 ** Math.abs(smallest) + const x = Decimal.mul(absSmallest, this) + const y = Decimal.mul(absSmallest, target) + + return new Decimal(x / y) + } + + this.toString = () => this.internal + this.toNumber = () => Number(this.internal) +} + +Decimal.add = (a, b) => new Decimal(a).add(b) +Decimal.mul = (a, b) => new Decimal(a).mul(b) +Decimal.sub = (a, b) => new Decimal(a).sub(b) +Decimal.div = (a, b) => new Decimal(a).div(b) + +/** + * 使用定点表示法表示给定数字的字符串,解决 JS 的计算精度问题。 + * + * toFixed(1.1 + 2.2, 2) // "3.30" + * toFixed(0.3 - 0.1, 2) // "0.20" + * toFixed(4.01 * 2.01, 4) // "8.0601" + * toFixed(0.3 / 0.1, 2) // "3.00" + * toFixed(0.0001, 2) // "0.00" + * toFixed(0.0001, 3) // "0.000" + * toFixed(0.0001, 4) // "0.0001" + * toFixed(0.0001, 5) // "0.00010" + * toFixed(-0.0001, 2) // "0.00" + * toFixed(-0.0001, 3) // "0.000" + * toFixed(-0.0001, 4) // "-0.0001" + * toFixed(-0.0001, 5) // "-0.00010" + * + * @param {Number} num 需精确计算的数字 + * @param {Number} [fraction=0] 浮点数的小数部分,默认0位 + * @returns {String} + */ +export const toFixed = (num, fraction = 0) => { + const sign = num < 0 ? '-' : '' + + num = Math.abs(num) + + const npmPow = num.toString().length < (2 ** 53).toString().length - 1 ? 10 ** fraction : 10 ** (fraction - 1) + const result = new Decimal(Math.round(new Decimal(num).mul(npmPow))).div(npmPow).toString() + + const numResult = Number(result) + + return numResult ? sign + numResult.toFixed(fraction) : numResult.toFixed(fraction) +} + +const formatInteger = (value, { secondaryGroupSize = 3, groupSize = 0, groupSeparator = ',' }) => { + const negative = /^-\d+/.test(value) + let result = negative ? value.slice(1) : value + const secSize = secondaryGroupSize || groupSize + + if (groupSize && result.length > groupSize) { + let left = result.slice(0, 0 - groupSize) + const right = result.slice(0 - groupSize) + + left = left.replace(new RegExp(`\\B(?=(\\d{${secSize}})+(?!\\d))`, 'g'), groupSeparator) + result = `${left}${groupSeparator}${right}` + } + + return `${negative ? '-' : ''}${result}` +} + +const reverseString = (str) => { + const arr = [] + + for (let i = 0; i < str.length; i++) { + arr.push(str[i]) + } + + return arr.reverse().join('') +} + +const formatDecimal = (num, { fractionGroupSize = 0, fractionGroupSeparator = '\xA0' }) => { + const RE = new RegExp(`\\B(?=(\\d{${fractionGroupSize}})+(?!\\d))`, 'g') + + return reverseString(reverseString(num).replace(RE, fractionGroupSeparator)) +} + +export const formatNumber = (value, format = {}) => { + const { fraction, rounding, prefix = '', decimalSeparator = '.', suffix = '' } = format + let reslut = getMiniDecimal(value) + + if (reslut.isNaN() || !reslut.toString()) { + return value + } + + reslut = roundFixed(reslut.toString(), fraction, rounding) + + format.zeroize === false && reslut.match(/\./) && (reslut = reslut.replace(/\.?0+$/g, '')) + + const number = reslut + .toString() + .split('.') + .slice(0, 2) + .map((str, index) => (index ? formatDecimal(str, format) : formatInteger(str, format))) + .join(decimalSeparator) + + return `${prefix}${number}${suffix}` +} + +export const recoverNumber = (number, format = {}) => { + const { prefix = '', suffix = '', decimalSeparator = '.' } = format + let result = number + + if (typeof number === 'string') { + result = number + .replace(new RegExp(`^${prefix}(.+)${suffix}$`), ($1, $2) => $2) + .split(decimalSeparator) + .map((s) => s.replace(/[^\d]/g, '')) + .join('.') + } + + return Number(result) +} diff --git a/packages/renderless/src/common/deps/ResizeObserver.ts b/packages/renderless/src/common/deps/ResizeObserver.ts new file mode 100644 index 000000000..bb7d741e9 --- /dev/null +++ b/packages/renderless/src/common/deps/ResizeObserver.ts @@ -0,0 +1,605 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' + +const MapShim = (function () { + if (typeof Map !== 'undefined') { + return Map + } + + const getIndex = (arr, key) => { + let result = -1 + + arr.some((entry, index) => { + if (entry[0] === key) { + result = index + return true + } + + return false + }) + + return result + } + + return (function () { + function obClass() { + this.__entries__ = [] + } + + Object.defineProperty(obClass.prototype, 'size', { + get() { + return this.__entries__.length + }, + enumerable: true, + configurable: true + }) + + obClass.prototype.get = function (key) { + const index = getIndex(this.__entries__, key) + const entry = this.__entries__[index] + + return entry && entry[1] + } + + obClass.prototype.set = function (key, value) { + const index = getIndex(this.__entries__, key) + + if (~index) { + this.__entries__[index][1] = value + } else { + this.__entries__.push([key, value]) + } + } + + obClass.prototype.delete = function (key) { + const entries = this.__entries__ + const index = getIndex(entries, key) + + if (~index) { + entries.splice(index, 1) + } + } + + obClass.prototype.clear = function () { + this.__entries__.splice(0) + } + + obClass.prototype.has = function (key) { + return !!~getIndex(this.__entries__, key) + } + + obClass.prototype.forEach = function (callback, ctx) { + if (ctx === void 0) { + ctx = null + } + + for (let _i = 0, _a = this.__entries__; _i < _a.length; _i++) { + const entry = _a[_i] + + callback.call(ctx, entry[1], entry[0]) + } + } + + return obClass + })() +})() + +const func = window.Function +const isBrowser = window !== 'undefined' && document !== 'undefined' && window.document === document + +const global$1 = (function () { + const isMath = (val) => val.Math === Math + + if (typeof global !== 'undefined' && isMath(global)) { + return global + } + + if (typeof self !== 'undefined' && isMath(self)) { + return self + } + + if (typeof window !== 'undefined' && isMath(window)) { + return window + } + return func('return this')() +})() + +const requestAnimationFrame$1 = (function () { + if (typeof requestAnimationFrame === 'function') { + return requestAnimationFrame.bind(global$1) + } + + return function (callback) { + return setTimeout(() => callback(Date.now()), 1000 / 60) + } +})() + +let trailingTimeout = 2 + +function throttle(callback, delayTime) { + let leading = false + let trailing = false + let lastCallTime = 0 + let proxy + + const resolvePending = () => { + if (leading) { + leading = false + callback() + } + + trailing && proxy() + } + + const timeoutCallback = () => { + requestAnimationFrame$1(resolvePending) + } + + proxy = () => { + const timeStamps = Date.now() + + if (leading) { + if (timeStamps - lastCallTime < trailingTimeout) { + return + } + + trailing = true + } else { + leading = true + trailing = false + + setTimeout(timeoutCallback, delayTime) + } + + lastCallTime = timeStamps + } + + return proxy +} + +const REFRESH_DELAY = 20 +const transitionKeys = ['top', 'right', 'bottom', 'left', 'width', 'height', 'size', 'weight'] +const mutationObserverSupported = typeof MutationObserver !== 'undefined' +const ResizeObserverController = (function () { + function ResizeObserverController() { + this.observers_ = [] + this.connected_ = false + this.mutationEventsAdded_ = false + this.mutationsObserver_ = null + this.onTransitionEnd_ = this.onTransitionEnd_.bind(this) + this.refresh = throttle(this.refresh.bind(this), REFRESH_DELAY) + } + + ResizeObserverController.prototype.addObserver = function (observer) { + !~this.observers_.indexOf(observer) && this.observers_.push(observer) + !this.connected_ && this.connect_() + } + + ResizeObserverController.prototype.removeObserver = function (observer) { + const observers = this.observers_ + const index = observers.indexOf(observer) + + ~index && observers.splice(index, 1) + + if (!observers.length && this.connected_) { + this.disconnect_() + } + } + + ResizeObserverController.prototype.refresh = function () { + const changesDetected = this.updateObservers_() + + changesDetected && this.refresh() + } + + ResizeObserverController.prototype.updateObservers_ = function () { + const activeObservers = this.observers_.filter((observer) => { + observer.gatherActive() + return observer.hasActive() + }) + + activeObservers.forEach((observer) => observer.broadcastActive()) + + return activeObservers.length > 0 + } + + ResizeObserverController.prototype.connect_ = function () { + if (!isBrowser || this.connected_) { + return + } + + on(document, 'transitionend', this.onTransitionEnd_) + on(window, 'resize', this.refresh) + + if (mutationObserverSupported) { + this.mutationsObserver_ = new MutationObserver(this.refresh) + + const options = { + attributes: true, + childList: true, + characterData: true, + subtree: true + } + + this.mutationsObserver_.observe(document, options) + } else { + on(document, 'DOMSubtreeModified', this.refresh) + this.mutationEventsAdded_ = true + } + + this.connected_ = true + } + + ResizeObserverController.prototype.disconnect_ = function () { + if (!isBrowser || !this.connected_) { + return + } + + off(document, 'transitionend', this.onTransitionEnd_) + off(window, 'resize', this.refresh) + + this.mutationsObserver_ && this.mutationsObserver_.disconnect() + + if (this.mutationEventsAdded_) { + off(document, 'DOMSubtreeModified', this.refresh) + } + + this.mutationsObserver_ = null + this.mutationEventsAdded_ = false + this.connected_ = false + } + + ResizeObserverController.prototype.onTransitionEnd_ = function (_a) { + const _b = _a.propertyName + const propertyName = _b === void 0 ? '' : _b + const isReflowProperty = transitionKeys.some((key) => !!~propertyName.indexOf(key)) + + isReflowProperty && this.refresh() + } + + ResizeObserverController.getInstance = function () { + if (!this._instance) { + this._instance = new ResizeObserverController() + } + + return this._instance + } + + ResizeObserverController._instance = null + return ResizeObserverController +})() + +const defineConfigurable = function (target, props) { + for (let i = 0, a = Object.keys(props); i < a.length; i++) { + const key = a[i] + + Object.defineProperty(target, key, { + value: props[key], + configurable: true, + writable: false, + enumerable: false + }) + } + + return target +} + +const createRectInit = function (x, y, width, height) { + return { x, y, width, height } +} + +const getWindowOf = function (target) { + const ownerGlobal = target && target.ownerDocument && target.ownerDocument.defaultView + return ownerGlobal || global$1 +} + +const emptyRect = createRectInit(0, 0, 0, 0) +const toFloat = (value) => parseFloat(value) || 0 + +const getBordersSize = function (styles) { + let positions = [] + + for (let i = 1; i < arguments.length; i++) { + positions[i - 1] = arguments[i] + } + + return positions.reduce((size, position) => { + const value = styles[`border-${position}-width`] + + return size + toFloat(value) + }, 0) +} + +const getPaddings = function (styles) { + const positions = ['top', 'right', 'bottom', 'left'] + let paddings = {} + + for (let i = 0, pos = positions; i < pos.length; i++) { + const position = pos[i] + const value = styles[`padding-${position}`] + + paddings[position] = toFloat(value) + } + + return paddings +} + +const getSVGContentRect = function (target) { + const bbox = target.getBBox() + return createRectInit(0, 0, bbox.width, bbox.height) +} + +const isDocumentElement = function (target) { + return target === getWindowOf(target).document.documentElement +} + +const getHTMLElementContentRect = function (target) { + const clientWidth = target.clientWidth + const clientHeight = target.clientHeight + + if (!clientHeight && !clientWidth) { + return emptyRect + } + + const styles = getWindowOf(target).getComputedStyle(target) + const paddings = getPaddings(styles) + + const vertPad = paddings.top + paddings.bottom + const horizPad = paddings.left + paddings.right + + let width = toFloat(styles.width) + let height = toFloat(styles.height) + + if (styles.boxSizing === 'border-box') { + if (Math.round(height + vertPad) !== clientHeight) { + height -= getBordersSize(styles, 'top', 'bottom') + vertPad + } + + if (Math.round(width + horizPad) !== clientWidth) { + width -= getBordersSize(styles, 'left', 'right') + horizPad + } + } + + if (!isDocumentElement(target)) { + const horizScrollbar = Math.round(height + vertPad) - clientHeight + const vertScrollbar = Math.round(width + horizPad) - clientWidth + + if (Math.abs(horizScrollbar) !== 1) { + height -= horizScrollbar + } + + if (Math.abs(vertScrollbar) !== 1) { + width -= vertScrollbar + } + } + + return createRectInit(paddings.left, paddings.top, width, height) +} + +const isSVGGraphicsElement = (function () { + if (typeof SVGGraphicsElement !== 'undefined') { + return (target) => target instanceof getWindowOf(target).SVGGraphicsElement + } + + return (target) => target instanceof getWindowOf(target).SVGElement && typeof target.getBBox === 'function' +})() + +const getContentRect = function (target) { + if (!isBrowser) { + return emptyRect + } + + if (isSVGGraphicsElement(target)) { + return getSVGContentRect(target) + } + + return getHTMLElementContentRect(target) +} + +const createReadOnlyRect = function (_a) { + const x = _a.x + const y = _a.y + const width = _a.width + const height = _a.height + const Constr = typeof DOMRectReadOnly !== 'undefined' ? DOMRectReadOnly : Object + const rect = Object.create(Constr.prototype) + + defineConfigurable(rect, { + x, + y, + width, + height, + top: y, + right: x + width, + bottom: height + y, + left: x + }) + + return rect +} + +const ResizeObservation = (function () { + function ResizeObservation(target) { + this.broadcastWidth = 0 + this.broadcastHeight = 0 + this.contentRect_ = createRectInit(0, 0, 0, 0) + this.target = target + } + + ResizeObservation.prototype.broadcastRect = function () { + const rect = this.contentRect_ + this.broadcastWidth = rect.width + this.broadcastHeight = rect.height + + return rect + } + + ResizeObservation.prototype.isActive = function () { + const rect = getContentRect(this.target) + this.contentRect_ = rect + + return rect.width !== this.broadcastWidth || rect.height !== this.broadcastHeight + } + + return ResizeObservation +})() + +const ResizeObserverEntry = (function () { + function ResizeObserverEntry(target, rectInit) { + const contentRect = createReadOnlyRect(rectInit) + + defineConfigurable(this, { target, contentRect }) + } + + return ResizeObserverEntry +})() + +const ResizeObserverSPI = (function () { + function ResizeObserverSPI(callback, controller, callbackCtx) { + this.observations_ = new MapShim() + this.activeObservations_ = [] + + if (typeof callback !== 'function') { + throw new TypeError('[TINY-Resize] The callback provided as parameter 1 is not a function.') + } + + this.callback_ = callback + this.controller_ = controller + this.callbackCtx_ = callbackCtx + } + + ResizeObserverSPI.prototype.observe = function (target) { + if (!arguments.length) { + throw new TypeError('[TINY-Resize] 1 argument required, but only 0 present.') + } + + if (typeof Element === 'undefined' || !(Element instanceof Object)) { + return + } + + if (!(target instanceof getWindowOf(target).Element)) { + throw new TypeError('[TINY-Resize] parameter 1 is not of type "Element".') + } + + const obserVations = this.observations_ + + if (obserVations.has(target)) { + return + } + + obserVations.set(target, new ResizeObservation(target)) + + this.controller_.addObserver(this) + this.controller_.refresh() + } + + ResizeObserverSPI.prototype.unobserve = function (target) { + if (!arguments.length) { + throw new TypeError('[TINY-Resize]1 argument required, but only 0 present.') + } + + if (typeof Element === 'undefined' || !(Element instanceof Object)) { + return + } + + if (!(target instanceof getWindowOf(target).Element)) { + throw new TypeError('[TINY-Resize] parameter 1 is not of type "Element".') + } + + const obserVations = this.observations_ + + if (!obserVations.has(target)) { + return + } + + obserVations.delete(target) + + !obserVations.size && this.controller_.removeObserver(this) + } + + ResizeObserverSPI.prototype.gatherActive = function () { + const me = this + this.clearActive() + + this.observations_.forEach((observation) => { + observation.isActive() && me.activeObservations_.push(observation) + }) + } + + ResizeObserverSPI.prototype.disconnect = function () { + this.clearActive() + this.observations_.clear() + this.controller_.removeObserver(this) + } + + ResizeObserverSPI.prototype.broadcastActive = function () { + if (!this.hasActive()) { + return + } + + const ctx = this.callbackCtx_ + const entries = this.activeObservations_.map((observation) => new ResizeObserverEntry(observation.target, observation.broadcastRect())) + + this.callback_.call(ctx, entries, ctx) + this.clearActive() + } + + ResizeObserverSPI.prototype.hasActive = function () { + return this.activeObservations_.length > 0 + } + + ResizeObserverSPI.prototype.clearActive = function () { + this.activeObservations_.splice(0) + } + + return ResizeObserverSPI +})() + +const observers = typeof WeakMap !== 'undefined' ? new WeakMap() : new MapShim() + +const ResizeObserver = (function () { + function ResizeObserver(callback) { + if (!(this instanceof ResizeObserver)) { + throw new TypeError('[TINY-Resize] Cannot call a class as a function.') + } + + if (!arguments.length) { + throw new TypeError('[TINY-Resize] 1 argument required, but only 0 present.') + } + + const controller = ResizeObserverController.getInstance() + const observer = new ResizeObserverSPI(callback, controller, this) + + observers.set(this, observer) + } + + return ResizeObserver +})(); +['observe', 'unobserve', 'disconnect'].forEach((method) => { + ResizeObserver.prototype[method] = function () { + let _a + + return (_a = observers.get(this))[method].apply(_a, arguments) + } +}) + +const index = (function () { + if (typeof global$1.ResizeObserver !== 'undefined') { + return global$1.ResizeObserver + } + + return ResizeObserver +})() + +export default index diff --git a/packages/renderless/src/common/deps/after-leave.ts b/packages/renderless/src/common/deps/after-leave.ts new file mode 100644 index 000000000..6de1387e4 --- /dev/null +++ b/packages/renderless/src/common/deps/after-leave.ts @@ -0,0 +1,42 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +const AfterLave = 'after-leave' +const Speed = 300 + +export default (instance, callback, speed = Speed, once = false) => { + if (!instance || !callback) { + throw new Error('instance & callback is required') + } + + let called = false + + const eventCallback = function () { + if (called) { + return + } + + called = true + + if (typeof callback === 'function') { + callback.apply(null, arguments) + } + } + + if (once) { + instance.$once(AfterLave, eventCallback) + } else { + instance.$on(AfterLave, eventCallback) + } + + setTimeout(eventCallback, speed + 100) +} diff --git a/packages/renderless/src/common/deps/clickoutside.ts b/packages/renderless/src/common/deps/clickoutside.ts new file mode 100644 index 000000000..f152d01d1 --- /dev/null +++ b/packages/renderless/src/common/deps/clickoutside.ts @@ -0,0 +1,94 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { on } from '@opentiny/vue-renderless/common/deps/dom' + +const isServer = typeof window === 'undefined' +const nodeList = [] +const nameSpace = '@@clickoutsideContext' +let startClick +let seed = 0 + +if (!isServer) { + on(document, 'mousedown', (event) => (startClick = event)) + + on(document, 'mouseup', (event) => { + nodeList.forEach((node) => node[nameSpace].documentHandler(event, startClick)) + }) +} + +const createDocumentHandler = (el, binding, vnode) => + function (mouseup = {}, mousedown = {}) { + let popperElm = vnode.context.popperElm || vnode.context.state.popperElm + + if ( + !mouseup.target || + !mousedown.target || + el.contains(mouseup.target) || + el.contains(mousedown.target) || + el === mouseup.target || + (popperElm && (popperElm.contains(mouseup.target) || popperElm.contains(mousedown.target))) + ) { + return + } + + if (binding.expression && el[nameSpace].methodName && vnode.context[el[nameSpace].methodName]) { + vnode.context[el[nameSpace].methodName]() + } else { + el[nameSpace].bindingFn && el[nameSpace].bindingFn() + } + } + +/** + * v-clickoutside + * @desc 点击元素外面才会触发的事件 + * @example + * ```vue + *
    + * ``` + */ +export default { + bind: (el, binding, vnode) => { + nodeList.push(el) + const id = seed++ + + el[nameSpace] = { + id, + documentHandler: createDocumentHandler(el, binding, vnode), + methodName: binding.expression, + bindingFn: binding.value + } + }, + + update: (el, binding, vnode) => { + el[nameSpace].documentHandler = createDocumentHandler(el, binding, vnode) + el[nameSpace].methodName = binding.expression + el[nameSpace].bindingFn = binding.value + }, + + unbind: (el) => { + if (el.nodeType !== Node.ELEMENT_NODE) { + return + } + + let len = nodeList.length + + for (let i = 0; i < len; i++) { + if (nodeList[i][nameSpace].id === el[nameSpace].id) { + nodeList.splice(i, 1) + break + } + } + + delete el[nameSpace] + } +} diff --git a/packages/renderless/src/common/deps/date-util.ts b/packages/renderless/src/common/deps/date-util.ts new file mode 100644 index 000000000..6fe8deab8 --- /dev/null +++ b/packages/renderless/src/common/deps/date-util.ts @@ -0,0 +1,297 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import fecha from '@opentiny/vue-renderless/common/deps/date' +import { isNull } from '@opentiny/vue-renderless/common/type' +import { isLeapYear } from '@opentiny/vue-renderless/common/date' +import { DATEPICKER } from '@opentiny/vue-renderless/common' + +const weeks = DATEPICKER.Weeks +const months = DATEPICKER.MonhtList +const defaultYMD = DATEPICKER.DateFormats.date +const defaultHMS = DATEPICKER.DateFormats.time + +const newArray = (start, end) => { + let res = [] + + for (let i = start; i <= end; i++) { + res.push(i) + } + + return res +} + +export const getI18nSettings = (t) => ({ + dayNamesShort: weeks.map((week) => t(`ui.datepicker.weeks.${week}`)), + dayNames: weeks.map((week) => t(`ui.datepicker.weeks.${week}`)), + monthNamesShort: months.map((month) => t(`ui.datepicker.months.${month}`)), + monthNames: months.map((month, index) => t(`ui.datepicker.month${index + 1}`)), + amPm: ['am', 'pm'] +}) + +export const isDate = function (date) { + if (isNull(date)) { + return false + } + if (isNaN(new Date(date).getTime())) { + return false + } + if (Array.isArray(date)) { + return false + } + + return true +} + +export const toDate = (date) => (isDate(date) ? new Date(date) : null) + +export const isDateObject = (val) => val instanceof Date + +export const formatDate = (date, format, t) => { + date = toDate(date) + if (!date) { + return '' + } + + return fecha.format(date, format || defaultYMD, getI18nSettings(t)) +} + +export const parseDate = (string, format, t) => fecha.parse(string, format || defaultYMD, getI18nSettings(t)) + +export const getDayCountOfMonth = (year, month) => { + if (~[3, 5, 8, 10].indexOf(month)) { + return 30 + } + + if (month === 1) { + return isLeapYear(year) ? 29 : 28 + } + + return 31 +} + +export const getDayCountOfYear = (year) => (isLeapYear(year) ? 366 : 365) + +export const getFirstDayOfMonth = (date) => { + const temp = new Date(date.getTime()) + temp.setDate(1) + return temp.getDay() +} + +export const prevDate = (date, amount = 1) => new Date(date.getFullYear(), date.getMonth(), date.getDate() - amount) + +export const nextDate = (date, amount = 1) => new Date(date.getFullYear(), date.getMonth(), date.getDate() + amount) + +export const getStartDateOfMonth = (year, month) => { + const res = new Date(year, month, 1) + const day = res.getDay() + + return day === 0 ? prevDate(res, 7) : prevDate(res, day) +} + +export const getWeekNumber = (src) => { + if (!isDate(src)) { + return null + } + + const date = new Date(src.getTime()) + + date.setHours(0, 0, 0, 0) + date.setDate(date.getDate() + 3 - ((date.getDay() + 6) % 7)) + + const week1 = new Date(date.getFullYear(), 0, 4) + + return 1 + Math.round(((date.getTime() - week1.getTime()) / 86400000 - 3 + ((week1.getDay() + 6) % 7)) / 7) +} + +export const getRangeHours = (ranges = []) => { + const hours = [] + let disHours = [] + + ranges.forEach((range) => { + const value = range.map((date) => date.getHours()) + disHours = disHours.concat(newArray(value[0], value[1])) + }) + + let isDisabled + + if (disHours.length) { + isDisabled = (i) => !~disHours.indexOf(i) + } else { + isDisabled = () => false + } + + for (let i = 0; i < 24; i++) { + hours[i] = isDisabled(i) + } + + return hours +} + +const setRangeData = (arr, start, end, value) => { + for (let i = start; i < end; i++) { + arr[i] = value + } +} + +export const range = (length) => Array.apply(null, { length }).map((_, n) => n) + +export const getMonthDays = (date) => { + const temp = new Date(date.getFullYear(), date.getMonth() + 1, 0) + const days = temp.getDate() + + return range(days).map((_, index) => index + 1) +} + +export const getPrevMonthLastDays = (date, amount) => { + if (amount <= 0) { + return [] + } + + const timeValue = new Date(date.getTime()) + timeValue.setDate(0) + const lastDay = timeValue.getDate() + + return range(amount).map((_, index) => lastDay - (amount - index - 1)) +} + +export const getRangeMinutes = (ranges, hour) => { + const sixty = 60 + const minutes = new Array(sixty) + + if (ranges.length > 0) { + ranges.forEach((range) => { + const [startDate, endDate] = range + const startHour = startDate.getHours() + const startMinute = startDate.getMinutes() + const endHour = endDate.getHours() + const endMinute = endDate.getMinutes() + const equealStartHour = startHour === hour + + if (equealStartHour && endHour !== hour) { + setRangeData(minutes, startMinute, sixty, true) + } else if (equealStartHour && endHour === hour) { + setRangeData(minutes, startMinute, endMinute + 1, true) + } else if (!equealStartHour && endHour === hour) { + setRangeData(minutes, 0, endMinute + 1, true) + } else if (startHour < hour && endHour > hour) { + setRangeData(minutes, 0, sixty, true) + } + }) + } else { + setRangeData(minutes, 0, sixty, true) + } + + return minutes +} + +export const modifyDate = (date, y, m, d) => { + date = toDate(date) + + return new Date(y, m, d, date.getHours(), date.getMinutes(), date.getSeconds(), date.getMilliseconds()) +} + +export const modifyTime = (date, h, m, s) => { + date = toDate(date) + + return new Date(date.getFullYear(), date.getMonth(), date.getDate(), h, m, s, date.getMilliseconds()) +} + +export const modifyWithTimeString = (date, time, t) => { + if (isNull(date) || !time) { + return date + } + + time = parseDate(time, defaultHMS, t) + return modifyTime(date, time.getHours(), time.getMinutes(), time.getSeconds()) +} + +export const clearTime = (date) => new Date(date.getFullYear(), date.getMonth(), date.getDate()) + +export const clearMilliseconds = (date) => + new Date(date.getFullYear(), date.getMonth(), date.getDate(), date.getHours(), date.getMinutes(), date.getSeconds(), 0) + +export const limitTimeRange = (date, ranges, format = defaultHMS) => { + if (ranges.length === 0) { + return date + } + + const normalizeDate = (date) => fecha.parse(fecha.format(date, format), format) + + const ndate = normalizeDate(date) + const nranges = ranges.map((range) => range.map(normalizeDate)) + + if (nranges.some((nrange) => ndate >= nrange[0] && ndate <= nrange[1])) { + return date + } + + let minDate = nranges[0][0] + let maxDate = minDate + + nranges.forEach((nrange) => { + let minTempDate = (minDate = new Date(Math.min(nrange[0], minDate))) + maxDate = new Date(Math.max(nrange[1], minTempDate)) + }) + + const ret = ndate < minDate ? minDate : maxDate + return modifyDate(ret, date.getFullYear(), date.getMonth(), date.getDate()) +} + +export const timeWithinRange = (date, selectableRange, format) => { + const limitedDate = limitTimeRange(date, selectableRange, format) + return limitedDate.getTime() === date.getTime() +} + +export const changeYearMonthAndClampDate = (date, year, month) => { + const monthDate = Math.min(date.getDate(), getDayCountOfMonth(year, month)) + return modifyDate(date, year, month, monthDate) +} + +export const nextMonth = (date) => { + const year = date.getFullYear() + const month = date.getMonth() + const isLast = month === 11 + + return isLast ? changeYearMonthAndClampDate(date, year + 1, 0) : changeYearMonthAndClampDate(date, year, month + 1) +} + +export const prevMonth = (date) => { + const year = date.getFullYear() + const month = date.getMonth() + const isFirst = month === 0 + + return isFirst ? changeYearMonthAndClampDate(date, year - 1, 11) : changeYearMonthAndClampDate(date, year, month - 1) +} + +export const nextYear = (date, next = 1) => { + const year = date.getFullYear() + const month = date.getMonth() + + return changeYearMonthAndClampDate(date, year + next, month) +} + +export const prevYear = (date, prev = 1) => { + const year = date.getFullYear() + const month = date.getMonth() + + return changeYearMonthAndClampDate(date, year - prev, month) +} + +export const extractTimeFormat = (dateFormat) => dateFormat.replace(/\W?D{1,2}|\W?Do|\W?d{1,4}|\W?M{1,4}|\W?y{2,4}/g, '').trim() + +export const extractDateFormat = (dateFormat) => + dateFormat + .replace(/\W?m{1,2}|\W?ZZ/g, '') + .replace(/\W?h{1,2}|\W?s{1,3}|\W?a/gi, '') + .trim() + +export const validateRangeInOneMonth = (startDate, endDate) => startDate.getMonth() === endDate.getMonth() && startDate.getFullYear() === endDate.getFullYear() diff --git a/packages/renderless/src/common/deps/date.ts b/packages/renderless/src/common/deps/date.ts new file mode 100644 index 000000000..0638f81e0 --- /dev/null +++ b/packages/renderless/src/common/deps/date.ts @@ -0,0 +1,330 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { DATEPICKER } from '@opentiny/vue-renderless/common' +import { isNull, isDate } from '@opentiny/vue-renderless/common/type' + +const fecha = {} +const digitsReg = ['\\d\\d?', '\\d{3}', '\\d{4}'] +const twoDigits = digitsReg[0] +const threeDigits = digitsReg[1] +const fourDigits = digitsReg[2] +const word = '[^\\s]+' +const literal = /\[([^]*?)\]/gm +const noop = () => undefined +const formats = { + shortDate: 'M/D/yy', + mediumDate: 'MMM d, yyyy', + longDate: 'MMMM d, yyyy', + fullDate: 'dddd, MMMM d, yyyy', + default: 'ddd MMM dd yyyy HH:mm:ss', + shortTime: 'HH:mm', + mediumTime: 'HH:mm:ss', + longTime: 'HH:mm:ss.SSS' +} + +const shorten = (arr, sLen) => { + let newArr = [] + + for (let i = 0, len = arr.length; i < len; i++) { + newArr.push(arr[i].substr(0, sLen)) + } + + return newArr +} + +const monthUpdate = (arrName) => (date, value, i18n) => { + const index = i18n[arrName].indexOf(value.charAt(0).toUpperCase() + value.substr(1).toLowerCase()) + + if (~index) { + date.month = index + } +} + +const pad = (val, len) => { + val = String(val) + len = len || 2 + + while (val.length < len) { + val = '0' + val + } + + return val +} + +const regexEscape = (str) => str.replace(/[|\\{()[^$+*?.-]/g, '\\$&') + +const fullTimeReg = /d{1,4}|M{1,4}|yy(?:yy)?|S{1,3}|Do|ZZ|([HhMsDm])\1?|[aA]|"[^"]*"|'[^']*'/g +const dayNames = DATEPICKER.fullWeeks +const monthNames = DATEPICKER.fullMonths +const monthNamesShort = shorten(monthNames, 3) +const dayNamesShort = shorten(dayNames, 3) +const parts = ['th', 'st', 'nd', 'rd'] + +fecha.i18n = { + dayNames, + monthNames, + dayNamesShort, + monthNamesShort, + amPm: ['am', 'pm'], + doFn: (D) => D + parts[D % 10 > 3 ? 0 : ((D - (D % 10) !== 10) * D) % 10] +} + +const formatFlags = { + D: (dateObj) => dateObj.getDay(), + DD: (dateObj) => pad(dateObj.getDay()), + Do: (dateObj, i18n) => i18n.doFn(dateObj.getDate()), + d: (dateObj) => dateObj.getDate(), + dd: (dateObj) => pad(dateObj.getDate()), + ddd: (dateObj, i18n) => i18n.dayNamesShort[dateObj.getDay()], + dddd: (dateObj, i18n) => i18n.dayNames[dateObj.getDay()], + M: (dateObj) => dateObj.getMonth() + 1, + MM: (dateObj) => pad(dateObj.getMonth() + 1), + MMM: (dateObj, i18n) => i18n.monthNamesShort[dateObj.getMonth()], + MMMM: (dateObj, i18n) => i18n.monthNames[dateObj.getMonth()], + yy: (dateObj) => pad(String(dateObj.getFullYear()), 4).substr(2), + yyyy: (dateObj) => pad(dateObj.getFullYear(), 4), + h: (dateObj) => dateObj.getHours() % 12 || 12, + hh: (dateObj) => pad(dateObj.getHours() % 12 || 12), + H: (dateObj) => dateObj.getHours(), + HH: (dateObj) => pad(dateObj.getHours()), + m: (dateObj) => dateObj.getMinutes(), + mm: (dateObj) => pad(dateObj.getMinutes()), + s: (dateObj) => dateObj.getSeconds(), + ss: (dateObj) => pad(dateObj.getSeconds()), + S: (dateObj) => Math.round(dateObj.getMilliseconds() / 100), + SS: (dateObj) => pad(Math.round(dateObj.getMilliseconds() / 10), 2), + SSS: (dateObj) => pad(dateObj.getMilliseconds(), 3), + a: (dateObj, i18n) => (dateObj.getHours() < 12 ? i18n.amPm[0] : i18n.amPm[1]), + A: (dateObj, i18n) => (dateObj.getHours() < 12 ? i18n.amPm[0].toUpperCase() : i18n.amPm[1].toUpperCase()), + ZZ: (dateObj) => { + const offset = dateObj.getTimezoneOffset() + return (offset > 0 ? '-' : '+') + pad(Math.floor(Math.abs(offset) / 60) * 100 + (Math.abs(offset) % 60), 4) + } +} + +const parseFlags = { + d: [ + twoDigits, + (date, value) => { + date.day = value + } + ], + Do: [ + twoDigits + word, + (date, value) => { + date.day = parseInt(value, 10) + } + ], + M: [ + twoDigits, + (date, value) => { + date.month = value - 1 + } + ], + yy: [ + twoDigits, + (date, value) => { + const now = new Date() + const cent = Number(String(now.getFullYear()).substr(0, 2)) + date.year = String(value > 68 ? cent - 1 : cent) + value + } + ], + h: [ + twoDigits, + (date, value) => { + date.hour = value + } + ], + m: [ + twoDigits, + (date, value) => { + date.minute = value + } + ], + s: [ + twoDigits, + (date, value) => { + date.second = value + } + ], + yyyy: [ + fourDigits, + (date, value) => { + date.year = value + } + ], + S: [ + '\\d', + (date, value) => { + date.millisecond = value * 100 + } + ], + SS: [ + '\\d{2}', + (date, value) => { + date.millisecond = value * 10 + } + ], + SSS: [ + threeDigits, + (date, value) => { + date.millisecond = value + } + ], + D: [twoDigits, noop], + ddd: [word, noop], + MMM: [word, monthUpdate('monthNamesShort')], + MMMM: [word, monthUpdate('monthNames')], + a: [ + word, + (date, value, i18n) => { + const val = value.toLowerCase() + if (val === i18n.amPm[0]) { + date.isPm = false + } else if (val === i18n.amPm[1]) { + date.isPm = true + } + } + ], + ZZ: [ + '[^\\s]*?[\\+\\-]\\d\\d:?\\d\\d|[^\\s]*?Z', + (date, value) => { + let parts = String(value).match(/([+-]|\d\d)/gi) + let minutes + + if (parts) { + minutes = Number(parts[1] * 60) + parseInt(parts[2], 10) + date.timezoneOffset = parts[0] === '+' ? minutes : -minutes + } + } + ] +} + +const fmts = ['A', 'DD', 'dd', 'mm', 'hh', 'MM', 'ss', 'hh', 'H', 'HH'] + +fecha.masks = formats +parseFlags.dddd = parseFlags.ddd + +fmts.forEach((name) => { + if (name === 'MM') { + parseFlags[name] = parseFlags[name.substr(0, 1)] + } else { + parseFlags[name] = parseFlags[name.substr(0, 1).toLowerCase()] + } +}) + +fecha.format = (dateObj, mask, i18nSettings) => { + const i18n = i18nSettings || fecha.i18n + + if (typeof dateObj === 'number') { + dateObj = new Date(dateObj) + } + + if (!isDate(dateObj) || isNaN(dateObj.getTime())) { + throw new Error('Invalid Date in fecha.format') + } + + mask = fecha.masks[mask] || mask || fecha.masks.default + + let literals = [] + + mask = mask.replace(literal, ($0, $1) => { + literals.push($1) + return '@@@' + }) + + mask = mask.replace(fullTimeReg, ($0) => ($0 in formatFlags ? formatFlags[$0](dateObj, i18n) : $0.slice(1, $0.length - 1))) + + return mask.replace(/@@@/g, () => literals.shift()) +} + +const getNewFormat = (format, parseInfo) => { + let literals = [] + + let newFormat = regexEscape(format).replace(fullTimeReg, ($0) => { + if (parseFlags[$0]) { + const info = parseFlags[$0] + parseInfo.push(info[1]) + + return '(' + info[0] + ')' + } + + return $0 + }) + + newFormat = newFormat.replace(/@@@/g, () => literals.shift()) + + return newFormat +} + +const getDate = (dateInfo) => { + let date + const today = new Date() + + if (!isNull(dateInfo.timezoneOffset)) { + dateInfo.minute = Number(dateInfo.minute || 0) - Number(dateInfo.timezoneOffset) + + const { year, month, day, hour, minute, second, millisecond } = dateInfo + + date = new Date(Date.UTC(year || today.getFullYear(), month || 0, day || 1, hour || 0, minute || 0, second || 0, millisecond || 0)) + } else { + const { year, month, day, hour, minute, second, millisecond } = dateInfo + + date = new Date(year || today.getFullYear(), month || 0, day || 1, hour || 0, minute || 0, second || 0, millisecond || 0) + } + return date +} + +fecha.parse = (dateStr, format, i18nSettings) => { + const i18n = i18nSettings || fecha.i18n + + if (typeof format !== 'string') { + throw new TypeError('Invalid format in fecha.parse') + } + + format = fecha.masks[format] || format + + if (dateStr.length > 1000) { + return null + } + + let dateInfo = {} + let parseInfo = [] + let literals = [] + + format = format.replace(literal, ($0, $1) => { + literals.push($1) + return '@@@' + }) + + const newFormat = getNewFormat(format, parseInfo) + const matches = dateStr.match(new RegExp(newFormat, 'i')) + + if (!matches) { + return null + } + + for (let i = 1, len = matches.length; i < len; i++) { + parseInfo[i - 1](dateInfo, matches[i], i18n) + } + + if (dateInfo.isPm === true && !isNull(dateInfo.hour) && Number(dateInfo.hour) !== 12) { + dateInfo.hour = Number(dateInfo.hour) + 12 + } else if (dateInfo.isPm === false && Number(dateInfo.hour) === 12) { + dateInfo.hour = 0 + } + + return getDate(dateInfo) +} + +export default fecha diff --git a/packages/renderless/src/common/deps/debounce.ts b/packages/renderless/src/common/deps/debounce.ts new file mode 100644 index 000000000..202a9a9f1 --- /dev/null +++ b/packages/renderless/src/common/deps/debounce.ts @@ -0,0 +1,17 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import throttle from '@opentiny/vue-renderless/common/deps/throttle' + +export default function (delay, atBegin, callback) { + return callback === undefined ? throttle(delay, atBegin, false) : throttle(delay, callback, atBegin !== false) +} diff --git a/packages/renderless/src/common/deps/dom.ts b/packages/renderless/src/common/deps/dom.ts new file mode 100644 index 000000000..ebbe8ce2e --- /dev/null +++ b/packages/renderless/src/common/deps/dom.ts @@ -0,0 +1,253 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { hasOwn, isObject, isNull } from '@opentiny/vue-renderless/common/type' + +const isServer = typeof window === 'undefined' +const SPECIAL_CHARS_REGEXP = /([:\-_]+(.))/g +const MOZ_HACK_REGEXP = /^moz([A-Z])/ +const ieVersion = isServer ? 0 : Number(document.documentMode) + +const trim = (string) => (string || '').replace(/^[\s\uFEFF]+|[\s\uFEFF]+$/g, '') + +const camelCase = (name) => + name.replace(SPECIAL_CHARS_REGEXP, (_, separator, letter, offset) => (offset ? letter.toUpperCase() : letter)).replace(MOZ_HACK_REGEXP, 'Moz$1') + +export const on = (() => { + if (!isServer) { + return (el, event, handler) => { + if (el && event && handler) { + el.addEventListener(event, handler, false) + } + } + } else { + return (el, event, handler) => { + if (el && event && handler) { + el.attachEvent('on' + event, handler) + } + } + } +})() + +export const off = (() => { + if (!isServer) { + return (el, event, handler) => { + if (el && event) { + el.removeEventListener(event, handler, false) + } + } + } else { + return (el, event, handler) => { + if (el && event) { + el.detachEvent('on' + event, handler) + } + } + } +})() + +export const once = (el, event, fn) => { + const listener = function () { + if (fn) { + fn.apply(this, arguments) + } + + off(el, event, listener) + } + + on(el, event, listener) +} + +export const hasClass = (el, clazz) => { + if (!el || !clazz) { + return false + } + + if (clazz.includes(' ')) { + throw new Error('className should not contain space.') + } + + if (el.classList) { + return el.classList.contains(clazz) + } + + return (' ' + el.className + ' ').includes(' ' + clazz + ' ') +} + +export const addClass = (el, clazz) => { + if (!el) { + return + } + + const classes = (clazz || '').split(' ') + let curClass = el.className + + for (let i = 0, len = classes.length; i < len; i++) { + const clsName = classes[i] + + if (clsName) { + if (el.classList) { + el.classList.add(clsName) + } else if (!hasClass(el, clsName)) { + curClass += ' ' + clsName + } + } + } + + if (!el.classList) { + el.className = curClass + } +} + +export const removeClass = (el, clazz) => { + if (!el || !clazz) { + return + } + + const classes = clazz.split(' ') + let curClass = ' ' + el.className + ' ' + + for (let i = 0, len = classes.length; i < len; i++) { + const clsName = classes[i] + + if (clsName) { + if (el.classList) { + el.classList.remove(clsName) + } else if (hasClass(el, clsName)) { + curClass = curClass.replace(' ' + clsName + ' ', ' ') + } + } + } + + if (!el.classList) { + el.className = trim(curClass) + } +} + +export const getStyle = (el, styleName) => { + if (isServer) { + return + } + if (!el || !styleName) { + return null + } + + styleName = camelCase(styleName) + + if (styleName === 'float') { + styleName = 'cssFloat' + } + + try { + const computed = document.defaultView.getComputedStyle(el, '') + + return el.style[styleName] || computed ? computed[styleName] : null + } catch (e) { + return el.style[styleName] + } +} + +export const setStyle = (el, name, value) => { + if (!el || !name) { + return + } + + if (typeof name === 'object') { + for (const prop in name) { + if (hasOwn.call(name, prop)) { + setStyle(el, prop, name[prop]) + } + } + } else { + name = camelCase(name) + + if (name === 'opacity' && ieVersion < 9) { + el.style.filter = isNaN(value) ? '' : 'alpha(opacity=' + value * 100 + ')' + } else { + el.style[name] = value + } + } +} + +export const isScroll = (el, vertical) => { + if (isServer) { + return + } + + const determinedDirection = !isNull(vertical) + let overflow + + if (determinedDirection) { + overflow = vertical ? getStyle(el, 'overflow-y') : getStyle(el, 'overflow-x') + } else { + overflow = getStyle(el, 'overflow') + } + + return overflow.match(/(scroll|auto)/) +} + +export const getScrollContainer = (el, vertical) => { + if (isServer) { + return + } + + let parent = el + + while (parent) { + if (~[window, document, document.documentElement].indexOf(parent)) { + return window + } + + if (isScroll(parent, vertical)) { + return parent + } + + parent = parent.parentNode + } + + return parent +} + +export const isInContainer = (el, container) => { + if (isServer || !el || !container) { + return false + } + + const elRect = el.getBoundingClientRect() + let containerRect + + if (~[window, document, document.documentElement].indexOf(container) || isNull(container)) { + containerRect = { + top: 0, + right: window.innerWidth, + bottom: window.innerHeight, + left: 0 + } + } else { + containerRect = container.getBoundingClientRect() + } + + return elRect.top < containerRect.bottom && elRect.bottom > containerRect.top && elRect.right > containerRect.left && elRect.left < containerRect.right +} + +export const isVNode = (node) => node !== null && isObject(node) && hasOwn.call(node, 'componentOptions') + +export const getDomNode = () => { + let documentElement = document.documentElement + let bodyElem = document.body + + return { + scrollTop: documentElement.scrollTop || bodyElem.scrollTop, + scrollLeft: documentElement.scrollLeft || bodyElem.scrollLeft, + visibleHeight: documentElement.clientHeight || bodyElem.clientHeight, + visibleWidth: documentElement.clientWidth || bodyElem.clientWidth + } +} diff --git a/packages/renderless/src/common/deps/eSpaceCtrl.ts b/packages/renderless/src/common/deps/eSpaceCtrl.ts new file mode 100644 index 000000000..00a9ddc0d --- /dev/null +++ b/packages/renderless/src/common/deps/eSpaceCtrl.ts @@ -0,0 +1,417 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +let ws = null +const url = 'ws://localhost' +const ports = [27197, 27198, 27199] +let index = 0 +let connected +let pollingInterval = 1000 +let timeout = 30000 +let cid = 0 +let callbacks = {} +let pollingTimer +let userStatus = {} +const heartbeatInterval = 20 * 1000 +let heartbeatTimer = null +let connectTimer = null +let apiTimers = {} +let events = {} +let out = {} + +let error = () => undefined +let ready = () => undefined + +const clearCallback = function (cid) { + clearTimeout(apiTimers[cid]) + + delete callbacks[cid] + delete apiTimers[cid] +} + +const onopen = function () { + connectTimer = setTimeout(() => { + ws.close() + }, 5000) +} + +const send = function (argv, cb) { + let id = cid++ + id = String(id) + argv.cid = id + + if (!connected) { + cb && setTimeout(cb, 0, { ok: false, message: 'eSpace is not logged in.' }) + return + } + + if (typeof cb === 'function') { + callbacks[id] = cb + + apiTimers[id] = setTimeout(() => { + cb({ ok: false, message: 'time out' }) + clearCallback(id) + }, timeout) + } + + ws.send(JSON.stringify(argv)) +} + +const sendHeartbeat = function () { + heartbeatTimer = setTimeout(() => { + if (connected) { + send( + { + type: 'heartbeat' + }, + () => { + sendHeartbeat() + } + ) + } else { + clearTimeout(heartbeatTimer) + } + }, heartbeatInterval) +} + +const connectionSucceeded = function (data) { + connected = true + + sendHeartbeat() + clearTimeout(pollingTimer) + clearTimeout(connectTimer) + ready(data) +} + +const onmessage = function (evt) { + let data = evt.data + if (typeof data !== 'string') { + return + } + + data = data.replace(/^\d+/, '') + if (!data) { + return + } + + try { + data = JSON.parse(data) + } catch (e) { + return !e + } + + if (connected) { + let event = events[data.type] + + if (event) { + return event(data.data) + } + + let cid = data.cid + let cb = callbacks[cid] + + if (cb) { + if (data.ok) { + cb(null, data.data) + } else { + cb({ ok: data.ok }) + } + + clearCallback(cid) + } + } else { + if (data.type === 'eSpace-ctrl-connection-success') { + connectionSucceeded(data.data) + } else { + ws.close() + } + } +} + +const bindEvents = function () { + ws.onopen = onopen + ws.onclose = onclose + ws.onmessage = onmessage +} + +const connect = function (interval) { + pollingTimer = setTimeout(() => { + if (index >= ports.length) { + index = 0 + } + + ws = new WebSocket(url + ':' + ports[index++]) + + bindEvents() + }, interval || 0) +} + +const onclose = function () { + if (connected || typeof connected === 'undefined') { + connected = false + error() + } + + connect(pollingInterval) +} + +out.init = function (conf) { + if (conf) { + timeout = conf.timeout || 30000 + pollingInterval = conf.pollingInterval || 0 + } + + connect() +} + +out.ready = function (cb) { + ready = cb +} + +out.error = function (cb) { + error = cb +} + +const attrToArr = function (name, total, object) { + let result = [] + + for (let i = 0; i < total; i++) { + let attrName = name + if (i) { + attrName += i + } + + let attrVal = object[attrName] + if (attrVal) { + result.push(attrVal) + } + } + + return result +} + +/** + * 事件绑定 + * @param {String} event 事件名 + * @param {Function} hander 事件处理函数 + * + * example: + * out.on('user-status-change', function (data){ + * // do something + * }) + */ +out.on = function (event, hander) { + events[event] = hander +} + +/** + * 获取用户信息 + * @param {String|Array} accounts 单个帐号或者帐号数组 + * @param {Function} cb 回调函数 + */ +out.getUserInfo = function (account, cb) { + const fn = function (err, data) { + if (err) { + return cb(err) + } + + const formatInfo = function (user) { + return { + account: user.account, + name: user.name, + mobile: attrToArr('mobile', 6, user), + 'office_phone': attrToArr('office_phone', 6, user), + 'home_phone': user.home_phone, + 'ip_phone': user.ip_phone, + 'other_phone': user.other_phone + } + } + + if (data.account) { + cb(null, formatInfo(data)) + } else { + let result = {} + + for (let p in data) { + if (Object.prototype.hasOwnProperty.call(data, p)) { + let user = data[p] + result[p] = user ? formatInfo(user) : user + } + } + cb(null, result) + } + } + + send( + { + type: 'get-user-info', + param: account + }, + fn + ) +} + +/** + * 订阅用户状态 + * @param {String|Array} accounts 单个帐号或者帐号数组 + * @param {Function} cb 回调函数 + */ +out.subscribeUserStatus = function (accounts, cb) { + if (Array.isArray(accounts)) { + accounts.forEach((account) => { + userStatus[account] = true + }) + } + + send( + { + type: 'subscribe-user-status', + param: accounts + }, + cb + ) +} + +/** + * 拉起单人语音 + * @param {String} account 帐号 + * @param {String} num 可选,电话号码或voip + * @param {Function} cb 回调函数 + */ +out.eSpaceCall = function (account, num, cb) { + send( + { + type: 'espace-call', + param: { + account, + number: num + } + }, + cb + ) +} + +/** + * 拉起单人语音 + * @param {String} account 帐号 + * @param {Function} cb 回调函数 + */ +out.eSpaceCallByAccount = function (account, cb) { + send( + { + type: 'espace-call', + param: { + account + } + }, + cb + ) +} + +/** + * 拉起单人语音 + * @param {String} number 电话号码 + * @param {Function} cb 回调函数 + */ +out.eSpaceCallByNumber = function (number, cb) { + send( + { + type: 'espace-call', + param: { + number + } + }, + cb + ) +} + +/** + * 拉起单聊IM窗口 + * @param {String} account 帐号 + * @param {Function} cb 回调函数 + */ +out.showImDialog = function (account, cb) { + send( + { + type: 'show-espace-im-dialog', + param: account + }, + cb + ) +} + +/** + * 拉起群组IM窗口 + * @param {String} gid 群组id + * @param {Function} cb 回调函数 + */ +out.showGroupDialog = function (gid, cb) { + send( + { + type: 'show-espace-im-group-dialog', + param: gid + }, + cb + ) +} + +/** + * 添加到联系人列表 + * @param {String} account 帐号 + * @param {Function} cb 回调函数 + */ +out.addContactList = function (account, cb) { + send( + { + type: 'add-contact-list', + param: account + }, + cb + ) +} + +if (!window.WebSocket) { + const notFn = function () { + return undefined + } + + for (let api in out) { + if (Object.prototype.hasOwnProperty.call(out, api)) { + let fn = out[api] + + if (typeof fn === 'function') { + out[api] = notFn + } + } + } +} + +let initialized = false + +export function init() { + if (!initialized) { + localStorage.setItem('eSpaceCtrl_initialized', 0) + out.init({ timeout: 3000, pollingInterval: 1000 }) + out.ready(() => { + localStorage.setItem('eSpaceCtrl_initialized', 1) + }) + out.error(() => { + localStorage.setItem('eSpaceCtrl_initialized', 0) + }) + + initialized = true + } + + return out +} + +export default out diff --git a/packages/renderless/src/common/deps/fullscreen/apis.ts b/packages/renderless/src/common/deps/fullscreen/apis.ts new file mode 100644 index 000000000..ab5bd9ae7 --- /dev/null +++ b/packages/renderless/src/common/deps/fullscreen/apis.ts @@ -0,0 +1,197 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { extend } from '@opentiny/vue-renderless/common/object' +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' +import screenfull from '@opentiny/vue-renderless/common/deps/fullscreen/screenfull' + +const defaults = { + callback: () => undefined, + fullscreenClass: 'fullscreen', + pageOnly: false, + teleport: false +} + +let token +let parentNode + +const setStyle = (element, style) => { + element.style.position = style.position + element.style.left = style.left + element.style.top = style.top + element.style.width = style.width + element.style.height = style.height + element.style.zIndex = style.zIndex +} + +const resetElement = (api) => { + const targetEle = api.targetElement + + if (targetEle) { + // 移除全屏class + targetEle.classList.remove(api.opts.fullscreenClass) + + if (api.opts.teleport || api.opts.pageOnly) { + if (api.opts.teleport && parentNode) { + // 还原位置 + parentNode.insertBefore(targetEle, token) + parentNode.removeChild(token) + } + // 移除样式 + if (targetEle.__styleCache) { + setStyle(targetEle, targetEle.__styleCache) + } + } + } +} + +const setTargetStyle = (target, options) => { + const { position, left, top, width, height, zIndex } = target.style + // 添加全屏class + target.classList.add(options.fullscreenClass) + // teleport或者网页全屏时,为目标元素添加全屏样式 + if (options.teleport || options.pageOnly) { + const style = { + position: 'fixed', + left: '0', + top: '0', + width: '100%', + height: '100%' + } + + target.__styleCache = { position, left, top, width, height, zIndex } + options.zIndex && (style.zIndex = options.zIndex) + setStyle(target, style) + } +} + +const getOptions = (screenfull, options, target) => { + options = extend({}, defaults, options) + + // body不可teleport + if (target === document.body) { + options.teleport = false + } + // 不支持全屏api则自动启用网页全屏 + if (!screenfull.isEnabled) { + options.pageOnly = true + } + return options +} + +const api = { + targetElement: null, + opts: null, + isEnabled: screenfull.isEnabled, + isFullscreen: false, + toggle(target, options, force) { + if (force === undefined) { + // 如果已经是全屏状态,则退出 + return !this.isFullscreen ? this.request(target, options) : this.exit() + } + + return force ? this.request(target, options) : this.exit() + }, + request(targetEle, options) { + if (this.isFullscreen) { + return Promise.resolve() + } + // 默认全屏对象为body + if (!targetEle) { + targetEle = document.body + } + + this.opts = getOptions(screenfull, options, targetEle) + + setTargetStyle(targetEle, this.opts) + // teleport:将目标元素挪到body下,并在原地留一个标记用于还原 + if (this.opts.teleport) { + parentNode = targetEle.parentNode + + if (parentNode) { + token = document.createComment('fullscreen-token') + parentNode.insertBefore(token, targetEle) + document.body.appendChild(targetEle) + } + } + + if (this.opts.pageOnly) { + // 网页全屏模式 按键回调 + const keypressCallback = (e) => { + if (e.key === 'Escape') { + off(document, 'keyup', keypressCallback) + this.exit() + } + } + + this.isFullscreen = true + this.targetElement = targetEle + + off(document, 'keyup', keypressCallback) + on(document, 'keyup', keypressCallback) + + if (this.opts.callback) { + this.opts.callback(this.isFullscreen) + } + + return Promise.resolve() + } else { + // 全屏api模式 全屏api事件回调 + const fullScreenCallback = () => { + if (!screenfull.isFullscreen) { + // 退出全屏时解绑回调 + screenfull.off('change', fullScreenCallback) + resetElement(this) + } + + this.isFullscreen = screenfull.isFullscreen + + this.targetElement = !this.opts.teleport ? screenfull.targetElement : targetEle || null + + if (this.opts.callback) { + this.opts.callback(screenfull.isFullscreen) + } + } + + screenfull.on('change', fullScreenCallback) + + return screenfull.request(this.opts.teleport ? document.body : targetEle) + } + }, + exit() { + if (!this.isFullscreen) { + return Promise.resolve() + } + + if (this.opts.pageOnly) { + resetElement(this) + + this.isFullscreen = false + this.targetElement = null + + if (this.opts.callback) { + this.opts.callback(this.isFullscreen) + } + + return Promise.resolve() + } + + return screenfull.exit() + } +} + +// 向下兼容 +api.support = api.isEnabled +api.getState = () => api.isFullscreen +api.enter = api.request + +export default api diff --git a/packages/renderless/src/common/deps/fullscreen/screenfull.ts b/packages/renderless/src/common/deps/fullscreen/screenfull.ts new file mode 100644 index 000000000..269756ff2 --- /dev/null +++ b/packages/renderless/src/common/deps/fullscreen/screenfull.ts @@ -0,0 +1,156 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' + +const fullscreenApi = ['fullscreenElement', 'fullscreenEnabled', 'requestFullscreen', 'exitFullscreen', 'fullscreenchange', 'fullscreenerror'] + +const fullscreenApiMoz = [ + 'mozFullScreenElement', + 'mozFullScreenEnabled', + 'mozRequestFullScreen', + 'mozCancelFullScreen', + 'mozfullscreenchange', + 'mozfullscreenerror' +] + +const fullscreenApiWebkit = [ + 'webkitFullscreenElement', + 'webkitFullscreenEnabled', + 'webkitRequestFullscreen', + 'webkitExitFullscreen', + 'webkitfullscreenchange', + 'webkitfullscreenerror' +] + +const fullscreenApiMs = ['msFullscreenElement', 'msFullscreenEnabled', 'msRequestFullscreen', 'msExitFullscreen', 'MSFullscreenChange', 'MSFullscreenError'] + +const fullscreenApiMap = [fullscreenApi, fullscreenApiWebkit, fullscreenApiMoz, fullscreenApiMs] + +const document = typeof window !== 'undefined' && typeof window.document !== 'undefined' ? window.document : {} + +let fullscreenEvents = null + +const getFullScreenEvents = () => { + for (let i = 0, len = fullscreenApiMap.length; i < len; i++) { + let eventName = fullscreenApiMap[i] + + if (eventName && eventName[1] in document) { + fullscreenEvents = {} + + for (i = 0; i < eventName.length; i++) { + fullscreenEvents[fullscreenApiMap[0][i]] = eventName[i] + } + + return + } + } +} + +getFullScreenEvents() + +const eventNameMap = { + change: fullscreenEvents && fullscreenEvents.fullscreenchange, + error: fullscreenEvents && fullscreenEvents.fullscreenerror +} + +const screenfull = { + request(element, options) { + return new Promise((resolve, reject) => { + const onFullscreenEntered = () => { + this.off('change', onFullscreenEntered) + resolve() + } + + this.on('change', onFullscreenEntered) + + element = element || document.documentElement + + if (element[fullscreenEvents && fullscreenEvents.requestFullscreen]) { + const promiseReturn = element[fullscreenEvents && fullscreenEvents.requestFullscreen](options) + + if (promiseReturn instanceof Promise) { + promiseReturn.then(onFullscreenEntered).catch(reject) + } + } + }) + }, + exit() { + return new Promise((resolve, reject) => { + if (!this.isFullscreen) { + resolve() + return + } + + const onFullscreenExit = () => { + this.off('change', onFullscreenExit) + resolve() + } + + this.on('change', onFullscreenExit) + + if (document[fullscreenEvents && fullscreenEvents.exitFullscreen]) { + const promiseReturn = document[fullscreenEvents && fullscreenEvents.exitFullscreen]() + + if (promiseReturn instanceof Promise) { + promiseReturn.then(onFullscreenExit).catch(reject) + } + } + }) + }, + toggle(element, options) { + return this.isFullscreen ? this.exit() : this.request(element, options) + }, + onchange(callback) { + this.on('change', callback) + }, + onerror(callback) { + this.on('error', callback) + }, + on(event, callback) { + const eventName = eventNameMap[event] + + if (eventName) { + on(document, eventName, callback) + } + }, + off(event, callback) { + const eventName = eventNameMap[event] + + if (eventName) { + off(document, eventName, callback) + } + }, + raw: fullscreenEvents +} + +Object.defineProperties(screenfull, { + isFullscreen: { + get() { + return !!document[fullscreenEvents && fullscreenEvents.fullscreenElement] + } + }, + element: { + enumerable: true, + get() { + return document[fullscreenEvents && fullscreenEvents.fullscreenElement] + } + }, + isEnabled: { + enumerable: true, + get() { + return !!document[fullscreenEvents && fullscreenEvents.fullscreenEnabled] + } + } +}) + +export default screenfull diff --git a/packages/renderless/src/common/deps/letter-only.ts b/packages/renderless/src/common/deps/letter-only.ts new file mode 100644 index 000000000..b06eac3cf --- /dev/null +++ b/packages/renderless/src/common/deps/letter-only.ts @@ -0,0 +1,38 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' + +/** + * v-letter-only + * @desc 只接受输入非数字字符 + * @example + * ```vue + * + * ``` + */ +const checkValue = (event) => { + if (event.charCode >= 48 && event.charCode <= 57) { + event.preventDefault() + } + + return true +} + +export default { + bind(element) { + on(element, 'keypress', checkValue) + }, + unbind(element) { + off(element, 'keypress', checkValue) + } +} diff --git a/packages/renderless/src/common/deps/memorize.ts b/packages/renderless/src/common/deps/memorize.ts new file mode 100644 index 000000000..d005a940f --- /dev/null +++ b/packages/renderless/src/common/deps/memorize.ts @@ -0,0 +1,162 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +class Memorize { + constructor(value, options = {}) { + if (value && typeof value === 'object') { + options = value + } else { + value = [] + } + + if (typeof options.key !== 'string' || !options.key) { + throw new Error('Memorize Initialization error.') + } + + this._prefix = 'tiny_memorize_' + this._customField1 = 'frequency' + this._customField2 = 'time' + this._sortBy = (options.sortBy || 'frequency').toUpperCase() + this._sort = (options.sort || 'desc').toUpperCase() + this._dataKey = options.dataKey || 'value' + this._highlightClass = options.highlightClass || 'memorize-highlight' + this._highlightNum = options.highlightNum || Infinity + this._cacheNum = options.cacheNum || Infinity + this._serialize = options.serialize || JSON.stringify + this._deserialize = options.deserialize || JSON.parse + this.setKey(options.key) + this.assemble(value) + } + + setKey(storeKey) { + this._storeKey = this._prefix + (storeKey || Number(new Date())) + } + + getValue(isSort = true) { + const storeVlue = window.localStorage[this._storeKey] || '' + + if (storeVlue) { + try { + const list = this._deserialize(storeVlue) + return isSort ? this.sort(list) : list + } catch (e) { + return [] + } + } + + return [] + } + + setValue(value) { + try { + window.localStorage.setItem(this._storeKey, this._serialize(value)) + } catch (e) { + throw new Error('Memorize set localStorage error.') + } + } + + clear() { + window.localStorage.removeItem(this._storeKey) + } + + add(dataKey) { + const list = this.getValue(false) + const newData = { + key: dataKey + } + + newData[this._customField1] = 1 + newData[this._customField2] = Number(new Date()) + + if (list.length < this._cacheNum) { + list.push(newData) + this.setValue(list) + } + } + + updateByKey(dataKey) { + let isChanged = false + const list = this.getValue(false) + + list.some((item) => { + if (item.key === dataKey) { + item[this._customField1] = (item[this._customField1] || 0) + 1 + item[this._customField2] = Number(new Date()) + isChanged = true + + return true + } + + return false + }) + + isChanged ? this.setValue(list) : this.add(dataKey) + } + + sort(list) { + if (Array.isArray(list)) { + return list.sort((x, y) => { + const isDesc = this._sort === 'DESC' + const compare = isDesc ? [-1, 1] : [1, -1] + + const sortField = this._sortBy === 'FREQUENCY' ? this._customField1 : this._customField2 + + const xField = x[sortField] + const yField = y[sortField] + + if (isNaN(xField)) { + return isDesc ? -1 : 1 + } else if (isNaN(yField)) { + return -1 + } + + return xField > yField ? compare[0] : compare[1] + }) + } else { + return list + } + } + + assemble(list) { + const storeValue = this.getValue(true) + if (!(Array.isArray(list) && list.length) || !storeValue.length) { + return list + } + + let matchCount = 0 + const handler = (storeItem) => (listItem, index) => { + if (listItem[this._dataKey] === storeItem.key) { + matchCount++ + list.splice(index, 1) + + if (matchCount <= this._highlightNum) { + listItem._highlightClass = this._highlightClass + } + + list.unshift(listItem) + + return true + } + + return false + } + + for (let i = storeValue.length - 1; i > -1; i--) { + const storeItem = storeValue[i] + list.some(handler(storeItem)) + } + + return list + } +} + +export default Memorize diff --git a/packages/renderless/src/common/deps/modal-queue.ts b/packages/renderless/src/common/deps/modal-queue.ts new file mode 100644 index 000000000..bb1eb1abd --- /dev/null +++ b/packages/renderless/src/common/deps/modal-queue.ts @@ -0,0 +1,14 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +const queue = [] +export default queue diff --git a/packages/renderless/src/common/deps/number-only.ts b/packages/renderless/src/common/deps/number-only.ts new file mode 100644 index 000000000..1aced397f --- /dev/null +++ b/packages/renderless/src/common/deps/number-only.ts @@ -0,0 +1,40 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' + +/** + * v-number-only + * @desc 只接受输入数字 + * @example + * ```vue + * + * ``` + */ +const checkValue = (event) => { + event.target.value = event.target.value.replace(/[^0-9]/g, '') + + if (event.charCode >= 48 && event.charCode <= 57) { + return true + } + + event.preventDefault() +} + +export default { + bind(element) { + on(element, 'keypress', checkValue) + }, + unbind(element) { + off(element, 'keypress', checkValue) + } +} diff --git a/packages/renderless/src/common/deps/popper.ts b/packages/renderless/src/common/deps/popper.ts new file mode 100644 index 000000000..084cbba6c --- /dev/null +++ b/packages/renderless/src/common/deps/popper.ts @@ -0,0 +1,815 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' +import PopupManager from '@opentiny/vue-renderless/common/deps/popup-manager' +import { typeOf } from '@opentiny/vue-renderless/common/type' +import { xss } from '@opentiny/vue-renderless/common/xss.js' + +const win = window +const positions = ['left', 'right', 'top', 'bottom'] +const modifiers = ['shift', 'offset', 'preventOverflow', 'keepTogether', 'arrow', 'flip', 'applyStyle'] + +const DEFAULTS = { + arrowOffset: 0, + arrowElement: '[x-arrow]', + boundariesElement: 'viewport', + boundariesPadding: 5, + flipBehavior: 'flip', + forceAbsolute: false, + gpuAcceleration: true, + offset: 0, + placement: 'bottom', + preventOverflowOrder: positions, + modifiers, + modifiersIgnored: [] +} + +const getRealElement = (el) => (el.jquery ? el[0] : el) + +const setStyle = (el, styles) => { + const isNumeric = (n) => n !== '' && !isNaN(parseFloat(n)) && isFinite(n) + + Object.keys(styles).forEach((prop) => { + let unit = '' + + if (~['width', 'height', 'top', 'right', 'bottom', 'left'].indexOf(prop) && isNumeric(styles[prop])) { + unit = 'px' + } + + el.style[prop] = styles[prop] + unit + }) +} + +const getSupportedPropertyName = (property) => { + let prefixes = ['', 'ms', 'webkit', 'moz', 'o'] + let bodyEl = win.document.body + + for (let i = 0; i < prefixes.length; i++) { + let toCheck = prefixes[i] ? prefixes[i] + property.charAt(0).toUpperCase() + property.slice(1) : property + + if (typeof bodyEl.style[toCheck] !== 'undefined') { + return toCheck + } + } + + return null +} + +const addClassNames = (el, classNames) => { + classNames.forEach((className) => { + el.classList.add(className) + }) +} + +const addAttributes = (el, attributes) => { + attributes.forEach((attribute) => { + const attrs = attribute.split(':') + + el.setAttribute(attrs[0], attrs[1] || '') + }) +} + +const getOffsetParent = (el) => { + let offsetParent = el.offsetParent + + return offsetParent === win.document.body || !offsetParent ? win.document.documentElement : offsetParent +} + +const getStyleComputedProperty = (el, property) => { + if (!el || el.nodeType !== 1) { + return + } + + let css = win.getComputedStyle(el, null) + + return css[property] +} + +const isFixed = (el) => { + if (el === win.document.body) { + return false + } + + if (getStyleComputedProperty(el, 'position') === 'fixed') { + return true + } + + return el.parentNode ? isFixed(el.parentNode) : el +} + +const getBoundingClientRect = (el) => { + let rectObj = el.getBoundingClientRect() + let isIE = navigator.userAgent.includes('MSIE') + let rectTop = isIE && el.tagName === 'HTML' ? -el.scrollTop : rectObj.top + + return { + left: rectObj.left, + top: rectTop, + right: rectObj.right, + bottom: rectObj.bottom, + width: rectObj.right - rectObj.left, + height: rectObj.bottom - rectTop + } +} + +// 判断el的overflow是不是可能滚动的 +const isScrollElement = (el) => { + const scrollTypes = ['scroll', 'auto'] + + return ( + scrollTypes.includes(getStyleComputedProperty(el, 'overflow')) || + scrollTypes.includes(getStyleComputedProperty(el, 'overflow-x')) || + scrollTypes.includes(getStyleComputedProperty(el, 'overflow-y')) + ) +} + +// 查找滚动元素,只找第一个就返回 +export const getScrollParent = (el) => { + let parent = el.parentNode + + if (!parent) { + return el + } + + if (parent === win.document) { + if (win.document.body.scrollTop || win.document.body.scrollLeft) { + return win.document.body + } + return win.document.documentElement + } + + if (isScrollElement(parent)) { + return parent + } + + return getScrollParent(el.parentNode) +} + +const getOffsetRectRelativeToCustomParent = (el, parent, fixed) => { + let { top, left, width, height } = getBoundingClientRect(el) + let parentRect = getBoundingClientRect(parent) + + if (fixed) { + let { scrollTop, scrollLeft } = getScrollParent(parent) + parentRect.top += scrollTop + parentRect.bottom += scrollTop + parentRect.left += scrollLeft + parentRect.right += scrollLeft + } + + let rect = { + top: top - parentRect.top, + left: left - parentRect.left, + bottom: top - parentRect.top + height, + right: left - parentRect.left + width, + width, + height + } + + return rect +} + +const getScrollTopValue = (el) => (el == document.body ? Math.max(document.documentElement.scrollTop, document.body.scrollTop) : el.scrollTop) + +const getScrollLeftValue = (el) => (el == document.body ? Math.max(document.documentElement.scrollLeft, document.body.scrollLeft) : el.scrollLeft) + +const getMaxWH = (body, html) => { + const height = Math.max(body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight) + const width = Math.max(body.scrollWidth, body.offsetWidth, html.clientWidth, html.scrollWidth, html.offsetWidth) + return { width, height } +} + +const adjustArrowStyle = (arrowStyle, side, arrowRect, popperRect, popperOptions) => { + let params = popperOptions.placement.split('-') + if (popperOptions.adjustArrow && ~['top', 'bottom'].indexOf(params[0]) && side === 'left') { + if (params[1] === 'start') { + arrowStyle.left = 8 + } else if (!params[1]) { + arrowStyle.left = (popperRect.width - arrowRect.width) / 2 + } + } + return arrowStyle +} + +const getOuterSizes = (el) => { + let _display = el.style.display + let _visibility = el.style.visibility + + el.style.display = 'block' + el.style.visibility = 'hidden' + + let styles = win.getComputedStyle(el) + let x = parseFloat(styles.marginTop) + parseFloat(styles.marginBottom) + let y = parseFloat(styles.marginLeft) + parseFloat(styles.marginRight) + let result = { width: el.offsetWidth + y, height: el.offsetHeight + x } + + el.style.display = _display + el.style.visibility = _visibility + + return result +} + +const getOppositePlacement = (placement) => { + let hash = { left: 'right', right: 'left', bottom: 'top', top: 'bottom' } + + return placement.replace(/left|right|bottom|top/g, (matched) => hash[matched]) +} + +const getPopperClientRect = (popperOffsets) => { + let offsets = { ...popperOffsets } + + offsets.right = offsets.left + offsets.width + offsets.bottom = offsets.top + offsets.height + + return offsets +} + +const getArrayKeyIndex = (arr, keyToFind) => { + let i = 0 + + for (let value of arr) { + if (value === keyToFind) { + return i + } + + i++ + } + + return null +} + +export const getAllScrollParents = (el, parents = []) => { + const parent = el.parentNode + + if (parent) { + isScrollElement(parent) && parents.push(parent) + return getAllScrollParents(parent, parents) + } + + return parents +} + +const getOffsetRect = (el) => { + let elementRect = { + width: el.offsetWidth, + height: el.offsetHeight, + left: el.offsetLeft, + top: el.offsetTop + } + + elementRect.right = elementRect.left + elementRect.width + elementRect.bottom = elementRect.top + elementRect.height + + return elementRect +} + +function Popper(reference, popper, options) { + this._reference = getRealElement(reference) + this.state = {} + + let isNotDefined = typeof popper === 'undefined' || popper === null + let isConfig = popper && Object.prototype.toString.call(popper) === '[object Object]' + + if (isNotDefined || isConfig) { + this._popper = this.parse(isConfig ? popper : {}) + } else { + this._popper = getRealElement(popper) + } + + this._options = { ...DEFAULTS, ...options } + + this._options.modifiers = this._options.modifiers.map((modifier) => { + if (~this._options.modifiersIgnored.indexOf(modifier)) { + return undefined + } + + if (modifier === 'applyStyle') { + this._popper.setAttribute('x-placement', this._options.placement) + } + + return this.modifiers[modifier] || modifier + }) + + this.state.position = this._getPosition(this._popper, this._reference) + + setStyle(this._popper, { position: this.state.position, top: 0 }) + + this.update() + this._setupEventListeners() + this._oldreference = this._reference + this._oldreference._popper = this._popper.style || {} + + return this +} + +Popper.prototype.destroy = function () { + this._popper.removeAttribute('x-placement') + + const popperStyle = (this._reference === this._oldreference && this._oldreference._popper) || {} + + this._popper.style.position = '' + this._popper.style.top = popperStyle.top || '' + this._popper.style.left = popperStyle.left || '' + this._popper.style[getSupportedPropertyName('transform')] = '' + this._removeEventListeners() + + this._options.removeOnDestroy && this._popper.remove() + + return this +} + +Popper.prototype.onCreate = function (callback) { + callback(this) + return this +} + +Popper.prototype.onUpdate = function (callback) { + this.state.updateCallback = callback + return this +} + +Popper.prototype.update = function () { + let data = { instance: this, styles: {} } + + this.popperOuterSize = null + data.placement = data._originalPlacement = this._options.placement + data.offsets = this._getOffsets(this._popper, this._reference, data.placement) + + data.boundaries = this._getBoundaries(data, this._options.boundariesPadding, this._options.boundariesElement) + + data = this.runModifiers(data, this._options.modifiers) + + typeof this.state.updateCallback === 'function' && this.state.updateCallback(data) +} + +Popper.prototype.parse = function (config) { + let defaultConfig = { + attributes: [], + arrowTagName: 'div', + arrowClassNames: ['popper__arrow'], + arrowAttributes: ['x-arrow'], + classNames: ['popper'], + content: '', + contentType: 'text', + parent: win.document.body, + tagName: 'div' + } + config = { ...defaultConfig, ...config } + const { tagName, classNames, attributes, contentType, content, arrowTagName } = config + let docEl = win.document + let popper = docEl.createElement(tagName) + addClassNames(popper, classNames) + addAttributes(popper, attributes) + if (contentType === 'node') { + popper.appendChild(getRealElement(content)) + } else if (contentType === 'html') { + popper.innerHTML = xss.filterHtml(content) + } else { + popper.textContent = content + } + + if (arrowTagName) { + let arrow = docEl.createElement(arrowTagName) + addClassNames(arrow, config.arrowClassNames) + addAttributes(arrow, config.arrowAttributes) + popper.appendChild(arrow) + } + let parent = getRealElement(config.parent) + if (typeof parent === 'string') { + parent = docEl.querySelectorAll(config.parent) + if (parent && parent.length) { + parent = parent[0] + } else { + throw new Error('ERROR: the given `parent` does not exists!') + } + } + if (parent.length > 1 && parent instanceof Element === false) { + parent = parent[0] + } + parent.appendChild(popper) + + return popper +} + +Popper.prototype._getPosition = function (popper, reference) { + let container = getOffsetParent(reference) + + if (this._options.forceAbsolute) { + return 'absolute' + } + + let isParentFixed = isFixed(reference, container) + return isParentFixed ? 'fixed' : 'absolute' +} + +Popper.prototype._getOffsets = function (popper, reference, placement) { + placement = placement.split('-')[0] + + let popperOffsets = {} + popperOffsets.position = this.state.position + + let isParentFixed = popperOffsets.position === 'fixed' + let referenceOffsets = getOffsetRectRelativeToCustomParent(reference, getOffsetParent(popper), isParentFixed) + + // 利用 popperOuterSize 来减少一次outerSize的计算 + let { width, height } = this.popperOuterSize ? this.popperOuterSize : (this.popperOuterSize = getOuterSizes(popper)) + + if (~['right', 'left'].indexOf(placement)) { + popperOffsets.top = referenceOffsets.top + referenceOffsets.height / 2 - height / 2 + + if (placement === 'left') { + popperOffsets.left = referenceOffsets.left - width + } else { + popperOffsets.left = referenceOffsets.right + } + } else { + popperOffsets.left = referenceOffsets.left + referenceOffsets.width / 2 - width / 2 + + if (placement === 'top') { + popperOffsets.top = referenceOffsets.top - height + } else { + popperOffsets.top = referenceOffsets.bottom + } + } + + popperOffsets.width = width + popperOffsets.height = height + + return { + popper: popperOffsets, + reference: referenceOffsets + } +} + +Popper.prototype._setupEventListeners = function () { + this.state.updateBound = this.update.bind(this) + + on(win, 'resize', this.state.updateBound) + + if (this._options.boundariesElement !== 'window') { + let target = getScrollParent(this._reference) + + if (target === win.document.body || target === win.document.documentElement) { + target = win + } + this.state.scrollTarget = target + + // 只有bubbling时,才启用所有祖先监听,根源在此。 getAll..Parents函数只有这一处调用 + if (this._options.bubbling || PopupManager.globalScroll) { + let targets = getAllScrollParents(this._reference) + + this.state.scrollTargets = targets || [] + targets.forEach((target) => { + on(target, 'scroll', this.state.updateBound) + }) + } else { + on(target, 'scroll', this.state.updateBound) + } + } +} + +Popper.prototype._removeEventListeners = function () { + off(win, 'resize', this.state.updateBound) + + if (this._options.boundariesElement !== 'window' && this.state.scrollTarget) { + off(this.state.scrollTarget, 'scroll', this.state.updateBound) + this.state.scrollTarget = null + + // 移除祖先监听 + if (this._options.bubbling || PopupManager.globalScroll) { + let targets = this.state.scrollTargets || [] + + targets.forEach((target) => { + off(target, 'scroll', this.state.updateBound) + }) + this.state.scrollTargets = null + } + } + + this.state.updateBound = null +} + +Popper.prototype._getBoundaries = function (data, padding, boundariesElement) { + let boundaries = {} + + if (boundariesElement === 'window') { + let body = win.document.body + let html = win.document.documentElement + let { width, height } = getMaxWH(body, html) + + boundaries = { top: 0, right: width, bottom: height, left: 0 } + } else if (boundariesElement === 'viewport') { + let offsetParent = getOffsetParent(this._popper) + let scrollParent = getScrollParent(this._popper) + let offsetParentRect = getOffsetRect(offsetParent) + let isFixed = data.offsets.popper.position === 'fixed' + let scrollTop = isFixed ? 0 : getScrollTopValue(scrollParent) + let scrollLeft = isFixed ? 0 : getScrollLeftValue(scrollParent) + + boundaries = { + top: 0 - (offsetParentRect.top - scrollTop), + right: win.document.documentElement.clientWidth - (offsetParentRect.left - scrollLeft), + bottom: win.document.documentElement.clientHeight - (offsetParentRect.top - scrollTop), + left: 0 - (offsetParentRect.left - scrollLeft) + } + } else { + if (getOffsetParent(this._popper) === boundariesElement) { + const { clientWidth, clientHeight } = boundariesElement + + boundaries = { + right: clientWidth, + bottom: clientHeight, + top: 0, + left: 0 + } + } else { + boundaries = getOffsetRect(boundariesElement) + } + } + + boundaries.right -= padding + boundaries.left += padding + boundaries.bottom = boundaries.bottom - padding + boundaries.top = boundaries.top + padding + + return boundaries +} + +Popper.prototype.isModifierRequired = function (requesting, requested) { + let index = getArrayKeyIndex(this._options.modifiers, requesting) + + return !!this._options.modifiers.slice(0, index).filter((modifier) => modifier === requested).length +} + +Popper.prototype.runModifiers = function (data, modifiers, ends) { + let modifiersToRun = modifiers.slice() + const _options = this._options + + if (ends !== undefined) { + modifiersToRun = _options.modifiers.slice(0, getArrayKeyIndex(_options.modifiers, ends)) + } + + modifiersToRun.forEach((modifier) => { + if (typeOf(modifier) === 'function') { + data = modifier.call(this, data) + } + }) + + return data +} + +Popper.prototype.modifiers = {} + +Popper.prototype.modifiers.applyStyle = function (data) { + let styles = { position: data.offsets.popper.position } + let left = Math.round(data.offsets.popper.left) + let top = Math.round(data.offsets.popper.top) + let prefixedProperty + + if (this._options.gpuAcceleration && (prefixedProperty = getSupportedPropertyName('transform'))) { + styles[prefixedProperty] = `translate3d(${left}px, ${top}px, 0)` + Object.assign(styles, { top: 0, left: 0 }) + } else { + Object.assign(styles, { top, left }) + } + + Object.assign(styles, data.styles) + + setStyle(this._popper, styles) + + this._popper.setAttribute('x-placement', data.placement) + + const modifiers = this.modifiers + + if (this.isModifierRequired(modifiers.applyStyle, modifiers.arrow) && data.offsets.arrow) { + setStyle(data.arrowElement, data.offsets.arrow) + } + + return data +} + +Popper.prototype.modifiers.shift = function (data) { + let placement = data.placement + let basePlacement = placement.split('-')[0] + let shiftVariation = placement.split('-')[1] + + if (shiftVariation) { + let { top, left, height, width } = data.offsets.reference + let popper = getPopperClientRect(data.offsets.popper) + + let shiftOffsets = { + y: { + start: { top }, + end: { top: top + height - popper.height } + }, + x: { + start: { left }, + end: { left: left + width - popper.width } + } + } + + let axis = ~['bottom', 'top'].indexOf(basePlacement) ? 'x' : 'y' + + data.offsets.popper = Object.assign(popper, shiftOffsets[axis][shiftVariation]) + } + + return data +} + +Popper.prototype.modifiers.preventOverflow = function (data) { + let order = this._options.preventOverflowOrder + let popper = getPopperClientRect(data.offsets.popper) + + let check = { + top: () => { + let { top } = popper + + if (top < data.boundaries.top) { + top = Math.max(top, data.boundaries.top) + } + + return { top } + }, + right: () => { + let { left } = popper + + if (popper.right > data.boundaries.right) { + left = Math.min(left, data.boundaries.right - popper.width) + } + + return { left } + }, + bottom: () => { + let { top } = popper + + if (popper.bottom > data.boundaries.bottom) { + top = Math.min(top, data.boundaries.bottom - popper.height) + } + + return { top } + }, + left: () => { + let { left } = popper + + if (popper.left < data.boundaries.left) { + left = Math.max(left, data.boundaries.left) + } + + return { left } + } + } + + order.forEach((direction) => { + data.offsets.popper = Object.assign(popper, check[direction]()) + }) + return data +} + +Popper.prototype.modifiers.keepTogether = function (data) { + let popper = getPopperClientRect(data.offsets.popper) + let reference = data.offsets.reference + + if (popper.right < Math.floor(reference.left)) { + data.offsets.popper.left = Math.floor(reference.left) - popper.width + } + + if (popper.left > Math.floor(reference.right)) { + data.offsets.popper.left = Math.floor(reference.right) + } + + if (popper.bottom < Math.floor(reference.top)) { + data.offsets.popper.top = Math.floor(reference.top) - popper.height + } + + if (popper.top > Math.floor(reference.bottom)) { + data.offsets.popper.top = Math.floor(reference.bottom) + } + + return data +} + +Popper.prototype.modifiers.flip = function (data) { + if (!this.isModifierRequired(this.modifiers.flip, this.modifiers.preventOverflow)) { + return data + } + + if (data.flipped && data.placement === data._originalPlacement) { + return data + } + + const placements = data.placement.split('-') + let placement = placements[0] + let placementOpposite = getOppositePlacement(placement) + let variation = placements[1] || '' + let flipOrderArr = [] + + if (this._options.flipBehavior === 'flip') { + flipOrderArr = [placement, placementOpposite] + } else { + flipOrderArr = this._options.flipBehavior + } + + flipOrderArr.forEach((step, index) => { + if (placement !== step || flipOrderArr.length === index + 1) { + return + } + + placement = data.placement.split('-')[0] + placementOpposite = getOppositePlacement(placement) + + let popperOffsets = getPopperClientRect(data.offsets.popper) + let a = ~['right', 'bottom'].indexOf(placement) + let p = Math.floor(data.offsets.reference[placement]) + let po = Math.floor(popperOffsets[placementOpposite]) + + if ((a && p > po) || (!a && p < po)) { + data.flipped = true + data.placement = flipOrderArr[index + 1] + + if (variation) { + data.placement += `-${variation}` + } + + data.offsets.popper = this._getOffsets(this._popper, this._reference, data.placement).popper + + data = this.runModifiers(data, this._options.modifiers, this._flip) + } + }) + return data +} + +Popper.prototype.modifiers.offset = function (data) { + let offset = this._options.offset + let popper = data.offsets.popper + + if (~data.placement.indexOf('left')) { + popper.top -= offset + } else if (~data.placement.indexOf('right')) { + popper.top += offset + } else if (~data.placement.indexOf('top')) { + popper.left -= offset + } else if (~data.placement.indexOf('bottom')) { + popper.left += offset + } + + return data +} + +Popper.prototype.modifiers.arrow = function (data) { + let arrow = this._options.arrowElement + let arrowOffset = this._options.arrowOffset + + if (typeof arrow === 'string') { + arrow = this._popper.querySelector(arrow) + } + + if (!arrow || !this._popper.contains(arrow) || !this.isModifierRequired(this.modifiers.arrow, this.modifiers.keepTogether)) { + return data + } + + let arrowStyle = {} + let placement = data.placement.split('-')[0] + let popper = getPopperClientRect(data.offsets.popper) + let reference = data.offsets.reference + let isVertical = ~['left', 'right'].indexOf(placement) + let len = isVertical ? 'height' : 'width' + let opSide = isVertical ? 'bottom' : 'right' + let altSide = isVertical ? 'left' : 'top' + let side = isVertical ? 'top' : 'left' + + let popperRect = this.popperOuterSize ? this.popperOuterSize : (this.popperOuterSize = getOuterSizes(this._popper)) + let arrowRect = getOuterSizes(arrow) + let arrowSize = arrowRect[len] + + if (reference[opSide] - arrowSize < popper[side]) { + data.offsets.popper[side] -= popper[side] - (reference[opSide] - arrowSize) + } + + if (reference[side] + arrowSize > popper[opSide]) { + data.offsets.popper[side] += reference[side] + arrowSize - popper[opSide] + } + + let center = reference[side] + (arrowOffset || reference[len] / 2 - arrowSize / 2) + let sideValue = center - popper[side] + + sideValue = Math.max(Math.min(popper[len] - arrowSize - 8, sideValue), 8) + + arrowStyle[side] = sideValue + arrowStyle[altSide] = '' + data.offsets.arrow = adjustArrowStyle(arrowStyle, side, arrowRect, popperRect, this._options) + data.arrowElement = arrow + + return data +} + +export default Popper diff --git a/packages/renderless/src/common/deps/popup-manager.ts b/packages/renderless/src/common/deps/popup-manager.ts new file mode 100644 index 000000000..23e425cfa --- /dev/null +++ b/packages/renderless/src/common/deps/popup-manager.ts @@ -0,0 +1,238 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { KEY_CODE } from '@opentiny/vue-renderless/common' +import { addClass, removeClass, on } from '@opentiny/vue-renderless/common/deps/dom' + +let hasModal = false +const isServer = typeof window === 'undefined' + +const instances = {} + +const classes = { + leave: 'v-modal-leave', + enter: 'v-modal-enter', + modal: 'v-modal' +} + +const removeStack = (modalStack, id) => { + for (let i = modalStack.length - 1; i >= 0; i--) { + if (modalStack[i].id === id) { + modalStack.splice(i, 1) + break + } + } +} + +let getModal + +const PopupManager = { + step: 2, + zIndex: 2000, + globalScroll: false, // 是否打开全局滚动监听 + modalFade: true, + modalStack: [], + deregister: (id) => { + if (id) { + instances[id] = null + delete instances[id] + } + }, + getInstance: (id) => instances[id], + register: (id, instance) => { + if (id && instance) { + instances[id] = instance + } + }, + nextZIndex: () => { + const zIndex = PopupManager.zIndex + PopupManager.zIndex += PopupManager.step + return zIndex + }, + openModal(id, zIndex, dom, modalClass, modalFade) { + if (isServer) { + return + } + if (!id || zIndex === undefined) { + return + } + + this.modalFade = modalFade + const modalStack = this.modalStack + + for (let i = 0, len = modalStack.length; i < len; i++) { + const modal = modalStack[i] + + if (modal.id === id) { + return + } + } + + const modalDom = getModal() + + addClass(modalDom, classes.modal) + + if (this.modalFade && !hasModal) { + addClass(modalDom, classes.enter) + } + + if (modalClass) { + const classArr = modalClass.trim().split(/\s+/) + classArr.forEach((cls) => addClass(modalDom, cls)) + } + + setTimeout(() => { + removeClass(modalDom, classes.enter) + }, 200) + + let parentNode + + if (dom && dom.parentNode && dom.parentNode.nodeType !== 11) { + parentNode = dom.parentNode + } else { + parentNode = document.body + } + + parentNode.appendChild(modalDom) + + if (zIndex) { + modalDom.style.zIndex = zIndex + } + + modalDom.style.display = '' + modalDom.tabIndex = 0 + + this.modalStack.push({ id, zIndex, modalClass }) + }, + doOnModalClick: () => { + const modalStack = PopupManager.modalStack + const topPopup = modalStack[modalStack.length - 1] + if (!topPopup) { + return + } + + const instance = PopupManager.getInstance(topPopup.id) + if (instance && instance.closeOnClickModal) { + typeof instance.close === 'function' && instance.close() + } + }, + closeModal(id) { + const modalStack = this.modalStack + const modalDom = getModal() + + if (modalStack.length > 0) { + const topPopup = modalStack[modalStack.length - 1] + + if (topPopup.id === id) { + if (topPopup.modalClass) { + const classArr = topPopup.modalClass.trim().split(/\s+/) + classArr.forEach((cls) => removeClass(modalDom, cls)) + } + + modalStack.pop() + + const stackSize = modalStack.length + + if (stackSize > 0) { + modalDom.style.zIndex = modalStack[stackSize - 1].zIndex + } + } else { + removeStack(modalStack, id) + } + } + + if (modalStack.length === 0) { + this.modalFade && addClass(modalDom, classes.leave) + + setTimeout(() => { + if (modalStack.length === 0) { + if (modalDom.parentNode) { + modalDom.parentNode.removeChild(modalDom) + } + + modalDom.style.display = 'none' + PopupManager.modalDom = undefined + } + + removeClass(modalDom, classes.leave) + }, 200) + } + } +} + +getModal = () => { + if (isServer) { + return + } + + let modalDom = PopupManager.modalDom + + if (modalDom) { + hasModal = true + } else { + hasModal = false + modalDom = document.createElement('div') + PopupManager.modalDom = modalDom + + modalDom.addEventListener( + 'touchmove', + (event) => { + event.preventDefault() + event.stopPropagation() + }, + { passive: true } + ) + + on(modalDom, 'click', () => { + PopupManager.doOnModalClick && PopupManager.doOnModalClick() + }) + } + + return modalDom +} + +const getTopPopup = () => { + if (isServer) { + return + } + + const modalStack = PopupManager.modalStack + + if (modalStack.length > 0) { + const topPopup = modalStack[modalStack.length - 1] + if (!topPopup) { + return + } + + const instance = PopupManager.getInstance(topPopup.id) + return instance + } +} + +if (!isServer) { + // handle `esc` key when the popup is shown + on(window, 'keydown', (event) => { + if (event.keyCode === KEY_CODE.Escape) { + const topPopup = getTopPopup() + + if (topPopup && topPopup.closeOnPressEscape) { + if (topPopup.handleClose) { + topPopup.handleClose('esc') + } else { + topPopup.handleAction ? topPopup.handleAction('cancel') : topPopup.close() + } + } + } + }) +} + +export default PopupManager diff --git a/packages/renderless/src/common/deps/repeat-click.ts b/packages/renderless/src/common/deps/repeat-click.ts new file mode 100644 index 000000000..8b2d0c4be --- /dev/null +++ b/packages/renderless/src/common/deps/repeat-click.ts @@ -0,0 +1,42 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { on, once } from '@opentiny/vue-renderless/common/deps/dom' + +export default (el, binding) => { + let interval = null + let startTime + + const handler = () => { + typeof binding.value === 'function' && binding.value.apply() + } + + const clear = () => { + if (Date.now() - startTime < 100) { + handler() + } + + clearInterval(interval) + interval = null + } + + on(el, 'mousedown', (e) => { + if (e.button !== 0) { + return + } + + startTime = Date.now() + once(document, 'mouseup', clear) + clearInterval(interval) + interval = setInterval(handler, 100) + }) +} diff --git a/packages/renderless/src/common/deps/requestAnimationFrame.ts b/packages/renderless/src/common/deps/requestAnimationFrame.ts new file mode 100644 index 000000000..9c72240a1 --- /dev/null +++ b/packages/renderless/src/common/deps/requestAnimationFrame.ts @@ -0,0 +1,44 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +!(function () { + let lastTime = 0 + const vendors = ['ms', 'moz', 'webkit', 'o'] + + for (let x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) { + window.requestAnimationFrame = window[vendors[x] + 'RequestAnimationFrame'] + + window.cancelAnimationFrame = window[vendors[x] + 'CancelAnimationFrame'] || window[vendors[x] + 'CancelRequestAnimationFrame'] + } + + if (!window.requestAnimationFrame) { + window.requestAnimationFrame = function (callback) { + const now = new Date().getTime() + const timeToCall = Math.max(0, 16 - (now - lastTime)) + const timeCallback = now + timeToCall + + const id = window.setTimeout(() => { + callback(timeCallback) + }, timeToCall) + + lastTime = now + timeToCall + + return id + } + } + + if (!window.cancelAnimationFrame) { + window.cancelAnimationFrame = function (id) { + clearTimeout(id) + } + } +})() diff --git a/packages/renderless/src/common/deps/resize-event.ts b/packages/renderless/src/common/deps/resize-event.ts new file mode 100644 index 000000000..d973e6afa --- /dev/null +++ b/packages/renderless/src/common/deps/resize-event.ts @@ -0,0 +1,57 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import ResizeObserver from '@opentiny/vue-renderless/common/deps/ResizeObserver' + +const isServer = typeof window === 'undefined' +const cacheKey = '__resizeListeners__' + +/* istanbul ignore next */ +const resizeHandler = (entries) => { + entries.forEach((entry) => { + const listeners = entry.target[cacheKey] || [] + + if (listeners.length) { + listeners.forEach((fn) => { + fn() + }) + } + }) +} + +/* istanbul ignore next */ +export const addResizeListener = (el, fn) => { + if (isServer) { + return + } + + if (!el[cacheKey]) { + el[cacheKey] = [] + el.__ro__ = new ResizeObserver(resizeHandler) + el.__ro__.observe(el) + } + + el[cacheKey].push(fn) +} + +/* istanbul ignore next */ +export const removeResizeListener = (el, fn) => { + if (!el || !el[cacheKey]) { + return + } + + el[cacheKey].splice(el[cacheKey].indexOf(fn), 1) + + if (!el[cacheKey].length) { + el.__ro__.disconnect() + } +} diff --git a/packages/renderless/src/common/deps/scroll-into-view.ts b/packages/renderless/src/common/deps/scroll-into-view.ts new file mode 100644 index 000000000..e6bda0c09 --- /dev/null +++ b/packages/renderless/src/common/deps/scroll-into-view.ts @@ -0,0 +1,43 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +const isServer = typeof window === 'undefined' + +export default (container, selected) => { + if (isServer) { + return + } + + if (!selected) { + container.scrollTop = 0 + return + } + + const offsetParents = [] + let { offsetParent, offsetTop, offsetHeight } = selected + + while (offsetParent && container !== offsetParent && container.contains(offsetParent)) { + offsetParents.push(offsetParent) + offsetParent = offsetParent.offsetParent + } + + const top = offsetTop + offsetParents.reduce((prev, curr) => prev + curr.offsetTop, 0) + const bottom = top + offsetHeight + const viewRectTop = container.scrollTop + const viewRectBottom = viewRectTop + container.clientHeight + + if (top < viewRectTop) { + container.scrollTop = top + } else if (bottom > viewRectBottom) { + container.scrollTop = bottom - container.clientHeight + } +} diff --git a/packages/renderless/src/common/deps/scrollbar-width.ts b/packages/renderless/src/common/deps/scrollbar-width.ts new file mode 100644 index 000000000..bb14c6777 --- /dev/null +++ b/packages/renderless/src/common/deps/scrollbar-width.ts @@ -0,0 +1,49 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +let scrollBarWidth +const isServer = typeof window === 'undefined' + +export default function () { + if (isServer) { + return 0 + } + if (scrollBarWidth !== undefined) { + return scrollBarWidth + } + + const container = document.createElement('div') + container.className = 'tiny-scrollbar' + container.style.visibility = 'hidden' + container.style.position = 'absolute' + container.style.top = '-9999px' + + const outer = document.createElement('div') + outer.className = 'tiny-scrollbar__wrap' + outer.style.width = '100px' + + container.appendChild(outer) + document.body.appendChild(container) + const widthNoScroll = outer.offsetWidth + outer.style.overflow = 'scroll' + + const inner = document.createElement('div') + inner.style.width = '100%' + + outer.appendChild(inner) + + const widthWithScroll = inner.offsetWidth + outer.parentNode.removeChild(outer) + scrollBarWidth = widthNoScroll - widthWithScroll + + return scrollBarWidth +} diff --git a/packages/renderless/src/common/deps/throttle.ts b/packages/renderless/src/common/deps/throttle.ts new file mode 100644 index 000000000..8ec392e9e --- /dev/null +++ b/packages/renderless/src/common/deps/throttle.ts @@ -0,0 +1,79 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +/** + * Throttle execution of a function. Especially useful for rate limiting + * execution of handlers on events like resize and scroll. + * + * @param {Number} delay A zero-or-greater delay in milliseconds. For event callbacks, + * values around 100 or 250 (or even higher) are most useful. + * @param {Boolean} [noTrailing] Optional, defaults to false. If noTrailing is true, + * callback will only execute every `delay` milliseconds while the + * throttled-function is being called. If noTrailing is false or unspecified, + * callback will be executed one final time + * after the last throttled-function call. + * (After the throttled-function has not been called for `delay` milliseconds, + * the internal counter is reset) + * @param {Function} callback A function to be executed after delay milliseconds. + * The `this` context and all arguments are passed through, as-is, + * to `callback` when the throttled-function is executed. + * @param {Boolean} [debounceMode] If `debounceMode` is true (at begin), + * schedule `clear` to execute after `delay` ms. + * If `debounceMode` is false (at end), + * schedule `callback` to execute after `delay` ms. + * + * @return {Function} A new, throttled, function. + */ + +export default function (delay, noTrailing, callback, debounceMode) { + let timeoutID + let lastExec = 0 + + if (typeof noTrailing !== 'boolean') { + debounceMode = callback + callback = noTrailing + noTrailing = undefined + } + + function wrapper() { + const me = this + const elapsed = new Date().valueOf() - lastExec + const args = arguments + + function exec() { + lastExec = new Date().valueOf() + callback.apply(me, args) + } + + function clear() { + timeoutID = undefined + } + + if (debounceMode && !timeoutID) { + exec() + } + + if (timeoutID) { + clearTimeout(timeoutID) + } + + const isUndMode = debounceMode === undefined + + if (isUndMode && elapsed > delay) { + exec() + } else if (noTrailing !== true) { + timeoutID = setTimeout(debounceMode ? clear : exec, isUndMode ? delay - elapsed : delay) + } + } + + return wrapper +} diff --git a/packages/renderless/src/common/deps/touch.ts b/packages/renderless/src/common/deps/touch.ts new file mode 100644 index 000000000..c00ce5193 --- /dev/null +++ b/packages/renderless/src/common/deps/touch.ts @@ -0,0 +1,48 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +const MIN_DISTANCE = 10 + +function getDirection(w, h) { + if (h > w && h > MIN_DISTANCE) { + return 'vertical' + } else if (w > h && w > MIN_DISTANCE) { + return 'horizontal' + } + return '' +} + +export const resetTouchStatus = (state) => { + state.direction = '' + state.deltaX = 0 + state.deltaY = 0 + state.offsetX = 0 + state.offsetY = 0 +} + +export const touchStart = (state) => (event) => { + resetTouchStatus(state) + + state.startX = event.touches[0].clientX + state.startY = event.touches[0].clientY +} + +export const touchMove = (state) => (event) => { + const touch = event.touches[0] + + state.deltaX = touch.clientX - state.startX + state.deltaY = touch.clientY - state.startY + state.offsetX = Math.abs(state.deltaX) + state.offsetY = Math.abs(state.deltaY) + + state.direction = state.direction || getDirection(state.offsetX, state.offsetY) +} diff --git a/packages/renderless/src/common/deps/tree-model/node.ts b/packages/renderless/src/common/deps/tree-model/node.ts new file mode 100644 index 000000000..970bd6b4a --- /dev/null +++ b/packages/renderless/src/common/deps/tree-model/node.ts @@ -0,0 +1,606 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { merge } from '@opentiny/vue-renderless/common/object' +import { markNodeData, NODE_KEY } from '@opentiny/vue-renderless/common/deps/tree-model/util' +import { indexOf } from '@opentiny/vue-renderless/common/array' +import { hasOwn, typeOf } from '@opentiny/vue-renderless/common/type' +import debounce from '@opentiny/vue-renderless/common/deps/debounce' + +const defaultChildrenKey = 'children' + +const getPropertyFromData = (node, prop) => { + const props = node.store.props + const dataData = node.data || {} + const config = props[prop] + + if (typeOf(config) === 'string') { + return dataData[config] + } else if (typeOf(config) === 'function') { + return config(dataData, node) + } else if (typeof config === 'undefined') { + const dataProp = dataData[prop] + return dataProp === undefined ? '' : dataProp + } +} + +export const getChildState = (node) => { + let all = true + let none = true + let allWithoutDisable = true + + for (let i = 0, len = node.length; i < len; i++) { + const { checked, disabled, indeterminate } = node[i] + + if (checked !== true || indeterminate) { + all = false + + if (!disabled) { + allWithoutDisable = false + } + } + + if (checked !== false || indeterminate) { + none = false + } + } + + const half = !all && !none + + return { all, none, allWithoutDisable, half } +} + +const reInitChecked = (node) => { + const childNodes = node.childNodes + + if (childNodes.length === 0) { + return + } + + const { all, none, half } = getChildState(childNodes) + + if (all) { + Object.assign(node, { checked: true, indeterminate: false }) + } else if (half) { + Object.assign(node, { checked: false, indeterminate: true }) + } else if (none) { + Object.assign(node, { checked: false, indeterminate: false }) + } + + const parent = node.parent + + if (!parent || parent.level === 0) { + return + } + + !node.store.checkStrictly && reInitChecked(parent) +} + +let nodeIdSeed = 0 +const lazyInitChecked = debounce(0, (node) => reInitChecked(node)) + +export default class Node { + constructor(options) { + this.init(options) + + const store = this.store + + if (!store) { + throw new Error('[TINY-Tree][Node]store is required!') + } + + store.registerNode(this) + + const props = store.props + + if (props && typeof props.isLeaf !== 'undefined') { + const isLeaf = getPropertyFromData(this, 'isLeaf') + + if (typeof isLeaf === 'boolean') { + this.isLeafByUser = isLeaf + } + } + + this.initExpandState() + + if (!Array.isArray(this.data)) { + markNodeData(this, this.data) + } + + if (!this.data) { + return + } + + this.expandByDefaultKeys() + + const { key, lazy, currentNodeKey } = store + + if (key && currentNodeKey !== undefined && this.key === currentNodeKey) { + store.currentNode = this + store.currentNode.isCurrent = true + } + + lazy && store._initDefaultCheckedNode(this) + + this.updateLeafState() + } + + initExpandState() { + const { store, data, level } = this + + if (store.lazy !== true && data) { + this.setData(data) + + if (store.defaultExpandAll) { + this.expanded = true + } + } else if (level > 0 && store.lazy && store.defaultExpandAll) { + this.expand() + } + } + + init(options) { + this.id = nodeIdSeed++ + this.checked = false + this.indeterminate = false + this.expanded = false + this.visible = true + this.isCurrent = false + this.text = null + this.data = null + this.parent = null + + Object.keys(options).forEach((key) => { + if (hasOwn.call(options, key)) { + this[key] = options[key] + } + }) + this.isLeaf = !!(this.data && this.data.isLeaf) + this.loaded = false + this.loading = false + this.childNodes = [] + this.level = 0 + + if (this.parent) { + this.level = this.parent.level + 1 + } + } + + expandByDefaultKeys() { + const { defaultExpandedKeys, key, autoExpandParent } = this.store + + if (key && defaultExpandedKeys && ~defaultExpandedKeys.indexOf(this.key)) { + this.expand(null, autoExpandParent) + } + } + + setData(data) { + if (!Array.isArray(data)) { + markNodeData(this, data) + } + + this.data = data + this.childNodes = [] + let children + + if (this.level === 0 && Array.isArray(this.data)) { + children = this.data + } else { + children = getPropertyFromData(this, defaultChildrenKey) || [] + } + + for (let i = 0, len = children.length; i < len; i++) { + const data = children[i] + + this.insertChild({ data }) + } + } + + get key() { + const { store, data } = this + const nodeKey = store.key + + if (data) { + return data[nodeKey] + } + + return null + } + + get label() { + return getPropertyFromData(this, 'label') + } + + get disabled() { + return getPropertyFromData(this, 'disabled') + } + + get nextSibling() { + const parent = this.parent + + if (parent) { + const childNodes = parent.childNodes + const index = childNodes.indexOf(this) + + if (~index) { + return childNodes[index + 1] + } + } + + return null + } + + get previousSibling() { + const parent = this.parent + + if (parent) { + const childNodes = parent.childNodes + const index = childNodes.indexOf(this) + + if (~index) { + return index > 0 ? childNodes[index - 1] : null + } + } + + return null + } + + remove() { + const parent = this.parent + + parent && parent.removeChild(this) + } + + contains(target, deep = true) { + const walkTree = (parent) => { + const children = parent.childNodes || [] + let isContain = false + + for (let i = 0, len = children.length; i < len; i++) { + const child = children[i] + + if (child === target || (deep && walkTree(child))) { + isContain = true + break + } + } + + return isContain + } + + return walkTree(this) + } + + insertChild(child, index, batch) { + if (!child) { + throw new Error('[TINY-Tree] insertChild error: child is required.') + } + + const insertNode = ({ arr, index, item }) => { + if (typeof index === 'undefined' || index < 0) { + arr.push(item) + } else { + arr.splice(index, 0, item) + } + } + + if (!(child instanceof Node)) { + if (!batch) { + const children = this.getChildren(true) + + if (!~children.indexOf(child.data)) { + insertNode({ arr: children, index, item: child.data }) + } + } + + merge(child, { parent: this, store: this.store }) + + child = new Node(child) + } + + child.level = this.level + 1 + + insertNode({ arr: this.childNodes, index, item: child }) + + this.updateLeafState() + } + + insertBefore(child, beforeNode) { + let index + + if (beforeNode) { + index = this.childNodes.indexOf(beforeNode) + } + + this.insertChild(child, index) + } + + insertAfter(child, afterNode) { + let index + + if (afterNode) { + index = this.childNodes.indexOf(afterNode) + if (~index) { + index += 1 + } + } + + this.insertChild(child, index) + } + + removeChild(child) { + const children = this.getChildren() || [] + let index = children.indexOf(child.data) + + if (~index) { + children.splice(index, 1) + } + + index = this.childNodes.indexOf(child) + + if (~index) { + this.store && this.store.deregisterNode(child) + child.parent = null + this.childNodes.splice(index, 1) + } + + this.updateLeafState() + } + + removeChildByData(data) { + let removeNode = null + + for (let i = 0, len = this.childNodes.length; i < len; i++) { + const child = this.childNodes[i] + + if (child.data === data) { + removeNode = child + break + } + } + + removeNode && this.removeChild(removeNode) + } + + expand(callback, expandParent) { + const expandNodes = () => { + if (expandParent) { + let parentNode = this.parent + + while (parentNode.level > 0) { + parentNode.expanded = true + parentNode = parentNode.parent + } + } + + this.expanded = true + callback && callback() + } + + if (this.shouldLoadData()) { + this.loadData((data) => { + if (Array.isArray(data)) { + if (this.checked) { + this.setChecked(true, true) + } else if (!this.store.checkStrictly) { + reInitChecked(this) + } + expandNodes() + } + }) + } else { + expandNodes() + } + } + + doCreateChildren(array, defaultProps = {}) { + array.forEach((data) => { + this.insertChild(merge({ data }, defaultProps), undefined, true) + }) + } + + collapse() { + this.expanded = false + } + + shouldLoadData() { + return this.store.lazy === true && this.store.load && !this.loaded + } + + updateLeafState() { + const { store, loaded, isLeafByUser } = this + const lazy = store.lazy + + if (lazy === true && loaded !== true && typeof isLeafByUser !== 'undefined') { + this.isLeaf = isLeafByUser + return + } + + const childs = this.childNodes + + if (!lazy || (lazy === true && loaded === true)) { + this.isLeaf = !childs || childs.length === 0 + return + } + + this.isLeaf = false + } + + getChildren(forceInit = false) { + const { level, data } = this + + if (level === 0) { + return data + } + + if (!data) { + return null + } + + const props = this.store.props + let childrenKey = defaultChildrenKey + + if (props) { + childrenKey = props.children || defaultChildrenKey + } + + if (data[childrenKey] === undefined) { + data[childrenKey] = null + } + + if (forceInit && !data[childrenKey]) { + data[childrenKey] = [] + } + + return data[childrenKey] + } + + setChecked(value, isDeepChecked, recursion, passValue) { + this.checked = value === true + this.indeterminate = value === 'half' + + const { checkStrictly, checkDescendants } = this.store + + if (checkStrictly) { + return + } + + let ret = this.setCheckedInner({ + checkDescendants, + value, + isDeepChecked, + passValue + }) + let returnFlag = ret.returnFlag + passValue = ret.passValue + value = ret.value + + if (returnFlag) { + return + } + + const parentNode = this.parent + if (!parentNode || parentNode.level === 0) { + return + } + + if (!recursion) { + this.store.lazy ? lazyInitChecked(parentNode) : reInitChecked(parentNode) + } + } + + setCheckedInner({ checkDescendants, value, isDeepChecked, passValue }) { + let returnFlag = false + + if (this.shouldLoadData() && !checkDescendants) { + return { value, passValue, returnFlag } + } + + const { all, allWithoutDisable } = getChildState(this.childNodes) + + if (!this.isLeaf && !all && allWithoutDisable) { + this.checked = false + value = false + } + + const batchSetChecked = () => { + if (isDeepChecked) { + const childNodes = this.childNodes + + for (let i = 0, len = childNodes.length; i < len; i++) { + const childNode = childNodes[i] + + passValue = passValue || value !== false + + const isCheck = childNode.disabled ? childNode.checked : passValue + + childNode.setChecked(isCheck, isDeepChecked, true, passValue) + } + + const { half, all } = getChildState(childNodes) + + if (!all) { + this.checked = all + this.indeterminate = half + } + } + } + + if (this.shouldLoadData()) { + const afterLoad = () => { + batchSetChecked() + reInitChecked(this) + } + + this.loadData(afterLoad, { checked: value !== false }) + + returnFlag = true + } else { + batchSetChecked() + } + + return { value, passValue, returnFlag } + } + + updateChildren() { + const children = this.getChildren() || [] + const oldChildren = this.childNodes.map((child) => child.data) + const newChildrenMap = {} + const newChildren = [] + + children.forEach((item, index) => { + const key = item[NODE_KEY] + const isNodeExists = !!key && indexOf(oldChildren, key, (item, data) => item[NODE_KEY] === data) >= 0 + + if (isNodeExists) { + newChildrenMap[key] = { index, data: item } + } else { + newChildren.push({ index, data: item }) + } + }) + + if (!this.store.lazy) { + oldChildren.forEach((item) => { + if (!newChildrenMap[item[NODE_KEY]]) { + this.removeChildByData(item) + } + }) + } + + newChildren.forEach(({ data, index }) => { + this.insertChild({ data }, index) + }) + + this.updateLeafState() + } + + loadData(callback, defaultProps = {}) { + const { lazy, load } = this.store + + if (lazy === true && load && !this.loaded && (!this.loading || Object.keys(defaultProps).length)) { + this.loading = true + + this.store.load(this, (children) => { + this.loading = false + this.loaded = true + this.childNodes = [] + + this.doCreateChildren(children, defaultProps) + this.updateLeafState() + + callback && callback.call(this, children) + }) + } else { + callback && callback.call(this) + } + } +} diff --git a/packages/renderless/src/common/deps/tree-model/tree-store.ts b/packages/renderless/src/common/deps/tree-model/tree-store.ts new file mode 100644 index 000000000..b47bbe78d --- /dev/null +++ b/packages/renderless/src/common/deps/tree-model/tree-store.ts @@ -0,0 +1,389 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { hasOwn, isNull } from '@opentiny/vue-renderless/common/type' +import { getNodeKey } from '@opentiny/vue-renderless/common/deps/tree-model/util' +import Node from '@opentiny/vue-renderless/common/deps/tree-model/node' + +export default class TreeStore { + constructor(options) { + this.currentNode = null + this.currentNodeKey = null + + for (let option in options) { + if (hasOwn.call(options, option)) { + this[option] = options[option] + } + } + + this.nodesMap = {} + + this.root = new Node({ data: this.data, store: this }) + + if (this.lazy && this.load) { + this.load(this.root, (data) => { + this.root.doCreateChildren(data) + this._initDefaultCheckedNodes() + }) + } else { + this._initDefaultCheckedNodes() + } + } + + filter(value) { + const { lazy, getMappingData, filterNodeMethod } = this + + const walkTree = (node) => { + const childNodes = node.root ? node.root.childNodes : node.childNodes + + childNodes.forEach((child) => { + const mappingData = getMappingData.call(this, child.data) + + child.visible = filterNodeMethod.call(child, value, mappingData, child) + + walkTree(child) + }) + + if (!node.visible && childNodes.length) { + let allHidden = !childNodes.some(({ visible }) => visible) + + if (node.root) { + node.root.visible = allHidden === false + } else { + node.visible = allHidden === false + } + } + + if (!value) { + return + } + if (node.visible && !node.isLeaf && !lazy) { + node.expand() + } + } + + walkTree(this) + } + + getMappingData(data) { + const props = this.props || {} + const mapping = {} + + Object.keys(props).forEach((key) => { + if (hasOwn.call(props, key)) { + mapping[key] = data[props[key]] + } + }) + + return Object.assign(data, mapping) + } + + setData(newVal) { + if (newVal !== this.root.data) { + this.root.setData(newVal) + this._initDefaultCheckedNodes() + } else { + this.root.updateChildren() + } + } + + getNode(data) { + if (data instanceof Node) { + return data + } + + const nodeKey = typeof data !== 'object' ? data : getNodeKey(this.key, data) + + return this.nodesMap[nodeKey] || null + } + + insertBefore(data, insertData) { + const refNode = this.getNode(insertData) + refNode.parent.insertBefore({ data }, refNode) + } + + insertAfter(data, insertData) { + const refNode = this.getNode(insertData) + refNode.parent.insertAfter({ data }, refNode) + } + + remove(data) { + const treeNode = this.getNode(data) + + if (treeNode && treeNode.parent) { + if (treeNode === this.currentNode) { + this.currentNode = null + } + + treeNode.parent.removeChild(treeNode) + } + } + + append(data, parentData) { + const parentNode = parentData ? this.getNode(parentData) : this.root + + parentNode && parentNode.insertChild({ data }) + } + + setDefaultCheckedKey(newValue) { + if (newValue !== this.defaultCheckedKeys) { + this.defaultCheckedKeys = newValue + this._initDefaultCheckedNodes() + } + } + + _initDefaultCheckedNodes() { + const defaultCheckedKeys = this.defaultCheckedKeys || [] + const nodesMap = this.nodesMap + + defaultCheckedKeys.forEach((checkedKey) => { + const node = nodesMap[checkedKey] + + node && node.setChecked(true, !this.checkStrictly) + }) + } + + _initDefaultCheckedNode(node) { + const defaultCheckedKeys = this.defaultCheckedKeys || [] + + ~defaultCheckedKeys.indexOf(node.key) && node.setChecked(true, !this.checkStrictly) + } + + getCheckedKeys(leafOnly = false) { + return this.getCheckedNodes(leafOnly).map((node) => (node || {})[this.key]) + } + + getHalfCheckedKeys() { + return this.getHalfCheckedNodes().map((node) => (node || {})[this.key]) + } + + deregisterNode(node) { + const key = this.key + if (!key || !node || !node.data) { + return + } + + node.childNodes.forEach((child) => { + this.deregisterNode(child) + }) + + delete this.nodesMap[node.key] + } + + registerNode(node) { + const key = this.key + if (!key || !node || !node.data) { + return + } + + const nodeKey = node.key + if (nodeKey !== undefined) { + this.nodesMap[nodeKey] = node + } + } + + getCheckedNodes(leafOnly = false, includeHalfChecked = false) { + const checkedNodes = [] + + const walkTree = (node) => { + const childNodes = node.root ? node.root.childNodes : node.childNodes + + childNodes.forEach((child) => { + const { checked, indeterminate, isLeaf, data } = child + + if ((checked || (includeHalfChecked && indeterminate)) && (!leafOnly || (leafOnly && isLeaf))) { + checkedNodes.push(data) + } + + walkTree(child) + }) + } + + walkTree(this) + + return checkedNodes + } + + getHalfCheckedNodes() { + const nodes = [] + + const walkTree = (node) => { + const childNodes = node.root ? node.root.childNodes : node.childNodes + + childNodes.forEach((child) => { + const { indeterminate, data } = child + + indeterminate && nodes.push(data) + + walkTree(child) + }) + } + + walkTree(this) + + return nodes + } + + _getAllNodes() { + const allNodes = [] + const nodesMap = this.nodesMap + + Object.keys(nodesMap).forEach((nodeKey) => { + hasOwn.call(nodesMap, nodeKey) && allNodes.push(nodesMap[nodeKey]) + }) + + return allNodes + } + + updateChildren(key, data) { + const node = this.nodesMap[key] + if (!node) { + return + } + + const childNodes = node.childNodes + + for (let i = childNodes.length - 1; i >= 0; i--) { + this.remove(childNodes[i].data) + } + + for (let i = 0, len = data.length; i < len; i++) { + const child = data[i] + this.append(child, node.data) + } + } + + _setCheckedKeys(key, leafOnly = false, checkedKeys = {}) { + const nodes = this._getAllNodes().sort((prevNode, nextNode) => nextNode.level - prevNode.level) + const cache = Object.create(null) + const keys = Object.keys(checkedKeys) + + nodes.forEach((node) => { + node.setChecked(false, false) + }) + + for (let i = 0, len = nodes.length; i < len; i++) { + const node = nodes[i] + const nodeKey = node.data[key].toString() + let checked = ~keys.indexOf(nodeKey) + + if (!checked) { + if (node.checked && !cache[nodeKey]) { + node.setChecked(false, false) + } + } else { + let parentNode = node.parent + + while (parentNode && parentNode.level > 0) { + cache[parentNode.data[key]] = true + parentNode = parentNode.parent + } + + if (node.isLeaf || this.checkStrictly) { + node.setChecked(true, false) + } else if (leafOnly) { + node.setChecked(false, false) + + const walkTree = (node) => { + const childNodes = node.childNodes + + childNodes.forEach((child) => { + !child.isLeaf && child.setChecked(false, false) + + walkTree(child) + }) + } + + walkTree(node) + } else { + node.setChecked(true, true) + } + } + } + } + + setDefaultExpandedKeys(keys) { + keys = keys || [] + this.defaultExpandedKeys = keys + + keys.forEach((key) => { + const node = this.getNode(key) + node && node.expand(null, this.autoExpandParent) + }) + } + + setCheckedKeys(keys, leafOnly = false) { + this.defaultCheckedKeys = keys + const checkedKeys = {} + + keys.forEach((key) => { + checkedKeys[key] = true + }) + + this._setCheckedKeys(this.key, leafOnly, checkedKeys) + } + + setCheckedNodes(array, leafOnly = false) { + const key = this.key + const checkedKeys = {} + + array.forEach((item) => { + checkedKeys[(item || {})[key]] = true + }) + + this._setCheckedKeys(key, leafOnly, checkedKeys) + } + + setChecked(data, checked, deep) { + const node = this.getNode(data) + + node && node.setChecked(!!checked, deep) + } + + setCurrentNode(currentNode) { + const prevNode = this.currentNode + + if (prevNode) { + prevNode.isCurrent = false + } + + this.currentNode = currentNode + + if (currentNode) { + this.currentNode.isCurrent = true + } + } + + getCurrentNode() { + return this.currentNode + } + + setCurrentNodeKey(key) { + if (isNull(key)) { + this.currentNode && (this.currentNode.isCurrent = false) + this.currentNode = null + + return + } + + const node = this.getNode(key) + + node && this.setCurrentNode(node) + } + + setUserCurrentNode(node) { + const key = node[this.key] + const currNode = this.nodesMap[key] + + this.setCurrentNode(currNode) + } +} diff --git a/packages/renderless/src/common/deps/tree-model/util.ts b/packages/renderless/src/common/deps/tree-model/util.ts new file mode 100644 index 000000000..b00ff9593 --- /dev/null +++ b/packages/renderless/src/common/deps/tree-model/util.ts @@ -0,0 +1,33 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const NODE_KEY = '$treeNodeId' + +export const getNodeKey = function (key, data) { + if (!key) { + return data[NODE_KEY] + } + return data[key] +} + +export const markNodeData = function (node, data) { + if (!data || data[NODE_KEY]) { + return + } + + Object.defineProperty(data, NODE_KEY, { + value: node.id, + enumerable: false, + configurable: false, + writable: false + }) +} diff --git a/packages/renderless/src/common/deps/upload-ajax.ts b/packages/renderless/src/common/deps/upload-ajax.ts new file mode 100644 index 000000000..57302b929 --- /dev/null +++ b/packages/renderless/src/common/deps/upload-ajax.ts @@ -0,0 +1,113 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { hasOwn } from '@opentiny/vue-renderless/common/type' +import { xss } from '@opentiny/vue-renderless/common/xss.js' + +const getBody = (xhr) => { + const text = xhr.responseText || xhr.response + + if (!text) { + return text + } + + try { + return JSON.parse(text) + } catch (e) { + return text + } +} + +const getError = (action, option, xhr) => { + let errorText + + if (xhr.response) { + errorText = xhr.response.error || xhr.response + } else if (xhr.responseText) { + errorText = xhr.responseText + } else { + errorText = `fail to post ${action} ${xhr.status}` + } + + const error = new Error(errorText) + + error.status = xhr.status + error.method = 'post' + error.url = action + + return error +} + +export default (option) => { + if (typeof XMLHttpRequest === 'undefined') { + return + } + + const xhr = new XMLHttpRequest() + const action = xss.filterUrl(option.action) + + if (xhr.upload) { + xhr.upload.onprogress = (event) => { + if (event.total > 0) { + event.percent = (event.loaded / event.total) * 100 + } + + option.onProgress(event) + } + } + + const formData = new FormData() + + if (option.data) { + Object.keys(option.data).forEach((key) => { + formData.append(key, option.data[key]) + }) + } + + if (Array.isArray(option.file)) { + option.file.forEach((file) => { + formData.append(option.filename, file, file.name) + }) + } else { + formData.append(option.filename, option.file, option.file.name) + } + + xhr.onerror = (event) => { + option.onError(event) + } + + xhr.onload = () => { + if (xhr.status < 200 || xhr.status >= 300) { + return option.onError(getError(action, option, xhr)) + } + + option.onSuccess(getBody(xhr)) + } + + xhr.open('post', action, true) + + if (option.withCredentials && 'withCredentials' in xhr) { + xhr.withCredentials = true + } + + const headers = option.headers || {} + + for (let header in headers) { + if (hasOwn.call(headers, header) && headers[header] !== null) { + xhr.setRequestHeader(header, headers[header]) + } + } + + xhr.send(formData) + + return xhr +} diff --git a/packages/renderless/src/common/deps/vue-emitter.ts b/packages/renderless/src/common/deps/vue-emitter.ts new file mode 100644 index 000000000..87286b95e --- /dev/null +++ b/packages/renderless/src/common/deps/vue-emitter.ts @@ -0,0 +1,47 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default (vm) => { + const broadcast = (vm, componentName, eventName, params) => { + vm.$children.forEach((child) => { + const name = child.$options.componentName + + if (name === componentName) { + child.$emit(eventName, params) + } else { + broadcast(child, componentName, eventName, params) + } + }) + } + + return { + dispatch(componentName, eventName, params) { + let parent = vm.$parent || vm.$root + let name = parent.$options.componentName + + while (parent && !parent.$attrs.novalid && (!name || name !== componentName)) { + parent = parent.$parent + + if (parent) { + name = parent.$options.componentName + } + } + + if (parent) { + parent.$emit.apply(parent, [eventName].concat(params)) + } + }, + broadcast(componentName, eventName, params) { + broadcast(vm, componentName, eventName, params) + } + } +} diff --git a/packages/renderless/src/common/deps/vue-popper.ts b/packages/renderless/src/common/deps/vue-popper.ts new file mode 100644 index 000000000..deb6f6b70 --- /dev/null +++ b/packages/renderless/src/common/deps/vue-popper.ts @@ -0,0 +1,247 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import PopupManager from '@opentiny/vue-renderless/common/deps/popup-manager' +import PopperJS from '@opentiny/vue-renderless/common/deps/popper' +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' + +const stop = (e) => { + e.stopPropagation() +} +const isServer = typeof window === 'undefined' + +const getReference = ({ state, props, refs, slots }) => { + let reference = state.referenceElm || props.reference || (refs.reference && refs.reference.$el) || refs.reference + + if (!reference && slots.reference && slots.reference()[0]) { + state.referenceElm = slots.reference()[0].elm || slots.reference()[0].el + reference = state.referenceElm + } + + return reference +} + +const getReferMaxZIndex = (reference) => { + if (!reference || !reference.nodeType) { + return + } + + let getZIndex = (dom) => parseInt(window.getComputedStyle(dom).zIndex, 10) || 0 + let max = getZIndex(reference) + let z + + do { + reference = reference.parentNode + z = getZIndex(reference) + max = z > max ? z : max + // webcomponents场景下,shadowRoot的nodeType是文档片段,文档片段没有父节点且无法做为getComputedStyle的参数 + } while (reference !== document.body && reference?.parentNode?.nodeType !== 11) + + return `${max + 1}` +} + +const appendPopper = ({ options, props, state, parent }) => { + if (props.appendToBody || props.popperAppendToBody) { + document.body.appendChild(state.popperElm) + } else { + parent && parent.$el && parent.$el.appendChild(state.popperElm) + options.forceAbsolute = true + } +} + +const setWatchFn = ({ watch, props, state, emit, nextTick, updatePopper, destroyPopper, onBeforeUnmount, onDeactivated, doDestroy }) => { + watch( + () => props.modelValue, + (val) => { + if (props.trigger === 'manual') { + state.showPopper = val + emit('update:modelValue', val) + } + } + ) + + watch( + () => state.showPopper, + (val) => { + if (props.disabled) { + return + } + + val ? nextTick(updatePopper) : destroyPopper() + props.trigger === 'manual' && emit('update:modelValue', val) + } + ) + + const removeBodyElm = () => { + if (state.popperElm && state.popperElm.parentNode === document.body) { + off(state.popperElm, 'click', stop) + document.body.removeChild(state.popperElm) + } + } + + onBeforeUnmount(() => { + nextTick(() => { + doDestroy(true) + removeBodyElm() + }) + }) + + onDeactivated(() => { + doDestroy(true) + removeBodyElm() + }) +} + +const createPopperFn = ({ state, props, refs, slots, appendArrow, emit, resetTransformOrigin, nextTick, updatePopper, nextZIndex, parent }) => (dom) => { + if (isServer) { + return + } + + state.currentPlacement = state.currentPlacement || props.placement + + if (!/^(top|bottom|left|right)(-start|-end)?$/g.test(state.currentPlacement)) { + return + } + + const options = props.popperOptions || { gpuAcceleration: false } + state.popperElm = state.popperElm || props.popper || refs.popper || dom + const popper = state.popperElm + let reference = getReference({ state, props, refs, slots }) + + if (!popper || !reference || reference.nodeType !== Node.ELEMENT_NODE) { + return + } + + if (props.visibleArrow) { + appendArrow(popper) + } + + appendPopper({ options, props, state, parent }) + + if (props.popperJS && state.popperJS.destroy) { + state.popperJS.destroy() + } + + options.placement = state.currentPlacement + options.offset = props.offset || 0 + options.arrowOffset = props.arrowOffset || 0 + options.adjustArrow = props.adjustArrow || false + + state.popperJS = new PopperJS(reference, popper, options) + state.popperJS.onCreate(() => { + emit('created', state) + resetTransformOrigin() + // 原来代码逻辑会触发2次updatePopper,暂时注释掉这一处,待观察 + // new PopperJS 内部已经调用this.update了,所以屏蔽: nextTick(updatePopper) + }) + + if (typeof options.onUpdate === 'function') { + state.popperJS.onUpdate(options.onUpdate) + } + + state.popperJS._popper.style.zIndex = nextZIndex(state.popperJS._reference) + on(state.popperElm, 'click', stop) +} + +const appendArrowFn = (state) => (el) => { + let hash + if (state.appended) { + return + } + state.appended = true + + for (const item in el.attributes) { + if (el.attributes[item].name.startsWith('_v-')) { + hash = el.attributes[item].name + break + } + } + + const div = document.createElement('div') + + if (hash) { + div.setAttribute(hash, '') + } + + div.setAttribute('x-arrow', '') + div.className = 'popper__arrow' + el.appendChild(div) +} + +const resetTransformOriginFn = (state, props) => () => { + if (!props.transformOrigin) { + return + } + + const placementMap = { top: 'bottom', bottom: 'top', left: 'right', right: 'left' } + const placement = state.popperJS._popper.getAttribute('x-placement').split('-')[0] + const origin = placementMap[placement] + + if (typeof props.transformOrigin === 'string') { + state.popperJS._popper.style.transformOrigin = props.transformOrigin + } else { + state.popperJS._popper.style.transformOrigin = ['top', 'bottom'].includes(placement) ? `center ${origin}` : `${origin} center` + } +} + +export default ({ parent, emit, nextTick, onBeforeUnmount, onDeactivated, props, watch, reactive, refs, slots, toRefs }) => { + const state = reactive({ + popperJS: null, + appended: false, + popperElm: null, + showPopper: props.manual ? Boolean(props.modelValue) : false, + referenceElm: null, + currentPlacement: '' + }) + + const nextZIndex = (reference) => (props.zIndex === 'relative' ? getReferMaxZIndex(reference) : PopupManager.nextZIndex()) + const appendArrow = appendArrowFn(state) + const resetTransformOrigin = resetTransformOriginFn(state, props) + let createPopper + const updatePopper = (dom) => { + const popperJS = state.popperJS + if (popperJS) { + popperJS.update() + if (popperJS._popper && dom !== true) { + // dom===true的场景仅在select组件动态更新面版时,不更新zIndex + popperJS._popper.style.zIndex = nextZIndex(popperJS._reference) + } + } else { + createPopper(dom) + } + } + createPopper = createPopperFn({ state, props, refs, slots, appendArrow, emit, resetTransformOrigin, nextTick, updatePopper, nextZIndex, parent }) + const doDestroy = (forceDestroy) => { + if (!state.popperJS || (state.showPopper && !forceDestroy)) { + return + } + state.popperJS.destroy() + state.popperJS = null + } + const destroyPopper = (remove) => { + if (state.popperJS) { + resetTransformOrigin() + } + + if (remove) { + if (state.popperElm) { + const parentNode = state.popperElm.parentNode + if (parentNode) { + parentNode.removeChild(state.popperElm) + } + } + } + } + setWatchFn({ watch, props, state, emit, nextTick, updatePopper, destroyPopper, onBeforeUnmount, onDeactivated, doDestroy }) + + return { doDestroy, appendArrow, createPopper, updatePopper, destroyPopper, resetTransformOrigin, ...toRefs(state) } +} diff --git a/packages/renderless/src/common/deps/vue-popup.ts b/packages/renderless/src/common/deps/vue-popup.ts new file mode 100644 index 000000000..15333586d --- /dev/null +++ b/packages/renderless/src/common/deps/vue-popup.ts @@ -0,0 +1,210 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { merge } from '@opentiny/vue-renderless/common/object' +import PopupManager from '@opentiny/vue-renderless/common/deps/popup-manager' +import getScrollBarWidth from '@opentiny/vue-renderless/common/deps/scrollbar-width' +import { getStyle, addClass, removeClass, hasClass } from '@opentiny/vue-renderless/common/deps/dom' + +let idSeed = 1 +let scrollBarWidth +const isServer = typeof window === 'undefined' +const popLockClass = 'tiny-popup-parent--hidden' + +const setWatchFn = ({ onMounted, onBeforeUnmount, watch, vm, api, props, state, nextTick }) => { + onMounted(() => { + vm._popupId = `popup-${idSeed++}` + PopupManager.register(vm._popupId, vm) + }) + + onBeforeUnmount(() => { + PopupManager.deregister(vm._popupId) + PopupManager.closeModal(vm._popupId) + + api.restoreBodyStyle() + }) + + watch( + () => props.visible, + (val) => { + if (val) { + if (vm._opening) { + return + } + if (state.rendered) { + api.open() + } else { + state.rendered = true + nextTick(() => { + api.open() + }) + } + } else { + api.close() + } + } + ) +} + +const modifyBodyStyle = ({ bodyHasOverflow, bodyOverflowY, state }) => { + if (scrollBarWidth > 0 && (bodyHasOverflow || bodyOverflowY === 'scroll') && state.withoutHiddenClass) { + document.body.style.paddingRight = `${state.computedBodyPaddingRight + scrollBarWidth}px` + } +} + +const openFn = (state, vm, api) => (options) => { + if (!state.rendered) { + state.rendered = true + } + + const props = merge({}, vm.$props || vm, options) + + if (vm._closeTimer) { + clearTimeout(vm._closeTimer) + vm._closeTimer = null + } + + clearTimeout(vm._openTimer) + + const openDelay = Number(props.openDelay) + + if (openDelay > 0) { + vm._openTimer = setTimeout(() => { + vm._openTimer = null + api.doOpen(props) + }, openDelay) + } else { + api.doOpen(props) + } +} +const modifyStateOnLockScroll = (state) => { + state.withoutHiddenClass = !hasClass(document.body, popLockClass) + + if (state.withoutHiddenClass) { + state.bodyPaddingRight = document.body.style.paddingRight + + state.computedBodyPaddingRight = parseInt(getStyle(document.body, 'paddingRight'), 10) + } +} + +const doOpenFn = (vm, state, props, api) => (properties) => { + if (isServer || (vm.willOpen && !vm.willOpen()) || state.opened) { + return + } + + vm._opening = true + + const dom = vm.$el + const modal = properties.modal + const zIndex = properties.zIndex + + if (zIndex) { + PopupManager.zIndex = zIndex + } + + if (modal) { + if (vm._closing) { + PopupManager.closeModal(vm._popupId) + vm._closing = false + } + + PopupManager.openModal(vm._popupId, PopupManager.nextZIndex(), props.modalAppendToBody ? undefined : dom, properties.modalClass, properties.modalFade) + + if (properties.lockScroll) { + modifyStateOnLockScroll(state) + + scrollBarWidth = getScrollBarWidth() + + const bodyHasOverflow = document.documentElement.clientHeight < document.body.scrollHeight + + const bodyOverflowY = getStyle(document.body, 'overflowY') + + modifyBodyStyle({ bodyHasOverflow, bodyOverflowY, state }) + + addClass(document.body, popLockClass) + } + } + + if (getComputedStyle(dom).position === 'static') { + dom.style.position = 'absolute' + } + + dom.style.zIndex = PopupManager.nextZIndex() + state.opened = true + + api.onOpen && api.onOpen() + api.doAfterOpen() +} + +const closeFn = (api, vm) => () => { + if (api.willClose && !api.willClose()) { + return + } + + if (vm._openTimer !== null) { + clearTimeout(vm._openTimer) + vm._openTimer = null + } + + clearTimeout(vm._closeTimer) + + const closeDelay = Number(vm.closeDelay) + + if (closeDelay > 0) { + vm._closeTimer = setTimeout(() => { + vm._closeTimer = null + api.doClose() + }, closeDelay) + } else { + api.doClose() + } +} + +export default ({ api, nextTick, onBeforeUnmount, onMounted, props, reactive, toRefs, vm, watch }) => { + const state = reactive({ opened: false, rendered: false, bodyPaddingRight: null, withoutHiddenClass: true, computedBodyPaddingRight: 0 }) + + setWatchFn({ onMounted, onBeforeUnmount, watch, vm, api, props, state, nextTick }) + + const open = openFn(state, vm, api) + const doOpen = doOpenFn(vm, state, props, api) + const doAfterOpen = () => { + vm._opening = false + } + const close = closeFn(api, vm) + const doClose = () => { + vm._closing = true + api.onClose && api.onClose() + + if (props.lockScroll) { + setTimeout(api.restoreBodyStyle, 200) + } + + state.opened = false + api.doAfterClose() + } + + const doAfterClose = () => { + PopupManager.closeModal(vm._popupId) + vm._closing = false + } + + const restoreBodyStyle = () => { + if (props.modal && state.withoutHiddenClass) { + document.body.style.paddingRight = state.bodyPaddingRight + removeClass(document.body, popLockClass) + } + + state.withoutHiddenClass = true + } + + return { open, close, doOpen, doClose, doAfterOpen, doAfterClose, PopupManager, restoreBodyStyle, ...toRefs(state) } +} diff --git a/packages/renderless/src/common/event.ts b/packages/renderless/src/common/event.ts new file mode 100644 index 000000000..58171a771 --- /dev/null +++ b/packages/renderless/src/common/event.ts @@ -0,0 +1,48 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +/** + * 触发事件,并返回是否在事件中执行了 preventDefault 方法,支持事件传递附加参数。 + * + * // 触发事件,返回 false 则退出 + * if (!emitEvent(emit, 'before', 1)) { + * return + * } + * + * // @before='before' 定义事件执行的函数 + * function before(event, value) { + * // value: 1 + * event.preventDefault() // 通知事件宿主停止执行 + * } + * + * @param {Function} emit 触发事件的函数 + * @param {String} name 事件的名称 + * @returns {Boolean} + */ +export const emitEvent = (emit, name, ...args) => { + let cancel = false + + if (typeof emit === 'function' && typeof name === 'string') { + const event = document.createEvent('HTMLEvents') + + event.initEvent(name, false, true) + event.preventDefault = () => { + cancel = true + } + + args.unshift(event) + args.unshift(name) + emit.apply(null, args) + } + + return !cancel +} diff --git a/packages/renderless/src/common/index.ts b/packages/renderless/src/common/index.ts new file mode 100644 index 000000000..d4f23f66b --- /dev/null +++ b/packages/renderless/src/common/index.ts @@ -0,0 +1,285 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { log as uLog, xss } from '@opentiny/vue-renderless/common/xss.js' + +export const KEY_CODE = { + Backspace: 8, + Tab: 9, + Clear: 12, + Enter: 13, + Shift: 16, + Control: 17, + Alt: 18, + CapsLock: 20, + Escape: 27, + Space: 32, + PageUp: 33, + PageDown: 34, + End: 35, + Home: 36, + 'ArrowLeft': 37, + 'ArrowUp': 38, + 'ArrowRight': 39, + 'ArrowDown': 40, + Insert: 45, + Delete: 46, + Colon: 58, + Semicolon: 59, + LessThan: 60, + Equals: 61, + GreaterThan: 62, + QuestionMark: 63, + AtMark: 64, + KeyA: 65, + KeyB: 66, + KeyC: 67, + KeyD: 68, + 'KeyE': 69, + 'KeyF': 70, + 'KeyG': 71, + 'KeyH': 72, + KeyI: 73, + KeyJ: 74, + KeyK: 75, + KeyL: 76, + KeyM: 77, + KeyN: 78, + KeyO: 79, + KeyP: 80, + KeyQ: 81, + 'KeyR': 82, + 'KeyS': 83, + 'KeyT': 84, + 'KeyU': 85, + KeyV: 86, + KeyW: 87, + KeyX: 88, + KeyY: 89, + KeyZ: 90, + 'Digit0': 48, + 'Digit1': 49, + 'Digit2': 50, + 'Digit3': 51, + Digit4: 52, + Digit5: 53, + Digit6: 54, + Digit7: 55, + Digit8: 56, + Digit9: 57, + 'F1': 112, + 'F2': 113, + 'F3': 114, + 'F4': 115, + F5: 116, + F6: 117, + F7: 118, + F8: 119, + F9: 120, + F10: 121, + F11: 122, + F12: 123, + 'NumLock': 144, + 'Numpad0': 96, + 'Numpad1': 97, + 'Numpad2': 98, + Numpad3: 99, + Numpad4: 100, + Numpad5: 101, + Numpad6: 102, + Numpad7: 103, + Numpad8: 104, + Numpad9: 105, + 'NumpadMultiply': 106, + 'NumpadAdd': 107, + 'NumpadEnter': 13, + 'NumpadSubtract': 109, + NumpadDecimal: 110, + NumpadDivide: 111, + NumpadComma: 190 +} + +export const POSITION = { Left: 'left', Right: 'right', Top: 'top', Bottom: 'bottom' } + +export const SORT = { Asc: 'asc', Desc: 'desc' } + +export const REFRESH_INTERVAL = 100 + +export const IPTHRESHOLD = { Min: 0, Max: 255, NonNumeric: 25 } + +export const DATE = { + FullDatetime: 'yyyy-MM-dd hh:mm:ss.SSS', + LongDatetime: 'yyyy-MM-dd hh:mm:ss', + Datetime: 'yyyy-MM-dd hh:mm', + Date: 'yyyy-MM-dd', + FullTime: 'hh:mm:ss.SSS', + LongTime: 'hh:mm:ss', + Time: 'hh:mm', + YearMonth: 'yyyy-MM' +} + +const TriggerTypes = 'date,datetime,time,time-select,week,month,year,daterange,monthrange,timerange,datetimerange,dates' + +export const DATEPICKER = { + Day: 'day', + Date: 'date', + Dates: 'dates', + Year: 'year', + Month: 'month', + Week: 'week', + Normal: 'normal', + Today: 'today', + PreMonth: 'pre-month', + NextMonth: 'next-month', + YearI18n: 'ui.datepicker.year', + List: [38, 40, 37, 39], + YearObj: { 38: -4, 40: 4, 37: -1, 39: 1 }, + WeekObj: { 38: -1, 40: 1, 37: -1, 39: 1 }, + DayObj: { 38: -7, 40: 7, 37: -1, 39: 1 }, + Aviailable: 'available', + Default: 'default', + Current: 'current', + InRange: 'in-range', + StartDate: 'start-date', + EndDate: 'end-date', + Selected: 'selected', + Disabled: 'disabled', + Range: 'range', + fullMonths: 'January,February,March,April,May,June,July,August,September,October,November,December'.split(','), + fullWeeks: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'], + MonhtList: ['jan', 'feb', 'mar', 'apr', 'may', 'jun', 'jul', 'aug', 'sep', 'oct', 'nov', 'dec'], + Weeks: ['sun', 'mon', 'tue', 'wed', 'thu', 'fri', 'sat'], + PlacementMap: { + left: 'bottom-start', + center: 'bottom', + right: 'bottom-end' + }, + TriggerTypes: TriggerTypes.split(','), + DateFormats: { + year: 'yyyy', + month: 'yyyy-MM', + time: 'HH:mm:ss', + week: 'yyyywWW', + date: 'yyyy-MM-dd', + timerange: 'HH:mm:ss', + monthrange: 'yyyy-MM', + daterange: 'yyyy-MM-dd', + datetime: 'yyyy-MM-dd HH:mm:ss', + datetimerange: 'yyyy-MM-dd HH:mm:ss' + }, + Time: 'time', + TimeRange: 'timerange', + IconTime: 'icon-time', + IconDate: 'icon-Calendar', + DateRange: 'daterange', + DateTimeRange: 'datetimerange', + MonthRange: 'monthrange', + TimeSelect: 'time-select', + TimesTamp: 'timestamp', + DateTime: 'datetime', + SelectbaleRange: 'selectableRange', + Start: '09:00', + End: '18:00', + Step: '00:30', + CompareOne: '-1:-1', + CompareHundred: '100:100', + selClass: '.selected', + queryClass: '.tiny-picker-panel__content', + disableClass: '.time-select-item:not(.disabled)', + defaultClass: '.default', + Qurtyli: 'li', + MappingKeyCode: { 40: 1, 38: -1 }, + DatePicker: 'DatePicker', + TimePicker: 'TimePicker' +} + +export const BROWSER_NAME = { + IE: 'ie', + Edge: 'edge', + Chrome: 'chrome', + Firefox: 'firefox' +} + +export const MOUSEDELTA = 120 + +export const VALIDATE_STATE = { + Validating: 'validating', + Success: 'success', + Error: 'error' +} + +export const CASCADER = { + SvgStr: '', + formInutValue: '', + formClose: '', + hwVersion: '&hw_doc_version=', + heightStr: '&tmb_height=', + widthStr: '&hw_thumb_width=', + imgPreview: 'edoc/previewImage', + hwId: '?hw_doc_id=', + viewThumb: 'viewThumb', + viewImage: 'viewImage', + methodFlag: '?methodFlag=', + code: '&hw_document_code=', + imgDom: '', + constants: 320, + twenty: 20 +} + +export const version = process.env.RUNTIME_VERSION + +export const log = (data, type = 'log') => { + uLog.logger[type](data) +} + +export { xss } diff --git a/packages/renderless/src/common/object.ts b/packages/renderless/src/common/object.ts new file mode 100644 index 000000000..d859b8975 --- /dev/null +++ b/packages/renderless/src/common/object.ts @@ -0,0 +1,412 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { hasOwn, typeOf, isObject, isPlainObject, isNull } from '@opentiny/vue-renderless/common/type' + +/** + * 将对象的每个属性值进行循环处理。 + * + * let obj = { name: 'jacky', age: 28, job: 'coder', dept: 'it' } + * each(obj, function (field, value) { + * if (field === 'name') { + * // do something + * } + * }) + * + * @param {Object} obj 要处理的对象 + * @param {Function} handle 进行循环处理的函数,参数为对象属性名及属性值 + */ +export const each = (obj, handle) => { + if (typeof handle !== 'function') { + return + } + for (const name in obj) { + if (hasOwn.call(obj, name)) { + if (handle(name, obj[name]) === false) { + break + } + } + } +} + +let extend + +/** + * 获得指定的命名空间的值对象。 + * + * getObj({ a: { b: 1 } }, 'a.b') // 1 + * getObj({ a: { b: 1 } }, 'data.a.b', true) // 1 + * getObj({ a: { b: undefined } }, 'a.b') // undefined + * + * @param {Object} data 查找数据源 + * @param {String} names 查找属性命名空间字符串 + * @param {Boolean} [isExceptRoot] 是否排除 names 的第一个节点,默认 false + * @returns {Object} + */ +export const getObj = (data, names, isExceptRoot) => { + if (!data || !isPlainObject(data) || !names || typeof names !== 'string') { + return + } + + names = names.split('.') + + let obj = data + const len = names.length + + if (len > 1) { + const startIndex = isExceptRoot ? 1 : 0 + + for (let i = startIndex; i < len; i++) { + obj = obj[names[i]] + + if (isNull(obj)) { + return obj + } + } + + return obj + } else { + return obj[names[0]] + } +} + +/** + * 设置指定的命名空间的值对象。 + * + * let obj = { limit: 5, data: { a: 1, b: 2 }, info: { a: 1, b: 2 } } + * setObj(obj, 'limit', 10) // obj.limit = 10 + * setObj(obj, 'data', { c: 3 }, true) // obj.data = { a: 1, b: 2, c: 3 } + * setObj(obj, 'info', { c: 3 }) // obj.info = { c: 3 } + * setObj(obj, 'info.c', { d: 4 }, true) // obj.info = { c: { d: 4 } } + * setObj(obj, 'info.c', { e: 5 }, true) // obj.info = { c: { d: 4, e: 5 } } + * + * @param {Object} data 设置数据源 + * @param {String} names 查找属性命名空间字符串 + * @param {Object} value 设置的值 + * @param {boolean} [isMerge] 是否覆盖还是合并,默认覆盖 + * @returns {Object} + */ +export const setObj = (data, names, value, isMerge) => { + if (!data || !isPlainObject(data) || !names || typeof names !== 'string') { + return data + } + + names = names.split('.') + + const obj = data + let len = names.length + let item = names[0] + + if (len > 1) { + len-- + + let tmpl = obj + let name, target + + for (let i = 0; i < len; i++) { + name = names[i] + target = tmpl[name] + + if (target === null || !isPlainObject(target)) { + tmpl[name] = {} + target = tmpl[name] + } + + tmpl = target + } + + item = names[len] + + isMerge ? (isPlainObject(tmpl[item]) ? extend(true, tmpl[item], value) : (tmpl[item] = value)) : (tmpl[item] = value) + } else { + isMerge ? (isPlainObject(obj[item]) ? extend(true, obj[item], value) : (obj[item] = value)) : (obj[item] = value) + } + + return obj +} + +/** + * 根据指定的字段属性名,复制对应的数据。 + * + * let obj = { a: 1, b: '2', c: [3, 4, 5], d: { e: 'good' } } + * copyField(obj, ['a', 'b']) // { a: 1, b: '2' } + * copyField(obj, ['a', 'b'], false, true) // { c: [3, 4, 5], d: { e: 'good' } } + * + * @param {Object} data 源数据,合并数据源 + * @param {Array} [fields] 指定的值得命名空间字符串的数值 + * @param {Boolean} [isMerge] 是否覆盖还是合并,默认false覆盖 + * @param {Boolean} [isExclude] 是否排除指定的fields复制,默认false + * @returns {Array} + */ +export const copyField = (data, fields, isMerge, isExclude) => { + const setValue = (obj, result, name, key, isMerge) => { + const include = key.indexOf(name) === 0 + const keySplit = key.split(name) + const hasNextDot = keySplit[1] && keySplit[1].indexOf('.') === 0 + + if (name === key || (include && hasNextDot)) { + if (name !== key) { + each(getObj(obj, name), (field) => { + setValue(obj, result, `${name}.${field}`, key) + }) + } + } else { + if (!fields.includes(name)) { + setObj(result, name, getObj(obj, name), isMerge) + } + } + } + const innerCopyFields = (obj, fields, isMerge, isExclude) => { + const result = {} + + if (isExclude) { + each(obj, (name) => fields.forEach((key) => setValue(obj, result, name, key, isMerge))) + } else { + fields.forEach((field) => setObj(result, field, getObj(obj, field), isMerge)) + } + + return result + } + + if (isPlainObject(data)) { + return Array.isArray(fields) ? innerCopyFields(data, fields, isMerge, isExclude) : extend(isMerge !== false, {}, data) + } + + return data +} + +/** + * 复制数组数据,数据如包含对象,则深度复制,并返回一个新数组,如果不是数组则直接返回原对象。 + * + * let arr1 = [ 1, 2, { name: 'jacky' } ] + * let arr2 = copyArray(arr1) + * arr1[ 2 ].name = 'kevin' + * // arr2[ 2 ].name: 'jacky' + * + * @param {Array} arr 要复制的数组 + * @returns {Array} + */ +export const copyArray = (arr) => (Array.isArray(arr) ? arr.map((item) => copyField(item)) : arr) + +/** + * 对象复制,支持深度复制,修复 $.extend 数组复制的问题, 参数同 $.extend。 + * + * let obj1 = { a: 1, b: 2 } + * let obj2 = { c: 3, d: 4 } + * extend(obj1, obj2) // { a: 1, b: 2, c: 3, d: 4 } + * + * @param {Boolean} deep 如果是 true,合并成为递归(又叫做深拷贝)。仅支持 true | 空 + * @param {Object} target 对象扩展,这将接收新的属性。 + * @param {Object} object1 一个对象,它包含额外的属性合并到第一个参数。 + * @param {Object} objectN 包含额外的属性合并到第一个参数 + * @returns {Object} + */ + +const deepCopy = (target, name, deep, copy, src) => { + let copyIsArray + if (deep && copy && (isPlainObject(copy) || (copyIsArray = Array.isArray(copy)))) { + if (copyIsArray) { + copyIsArray = false + target[name] = copyArray(copy) + } else { + const clone = src && isPlainObject(src) ? src : {} + target[name] = extend(deep, clone, copy) + } + } else if (copy !== undefined) { + try { + target[name] = copy + } catch (e) { + // do nothing + } + } +} + +extend = function () { + const args = arguments + const length = args.length + let target = args[0] || {} + let i = 1 + let deep = false + + if (typeOf(target) === 'boolean') { + deep = target + target = args[i] || {} + i++ + } + + if (!isObject(target) && typeOf(target) !== 'function') { + target = {} + } + + if (i === length) { + target = this + i-- + } + + for (; i < length; i++) { + const options = args[i] + + if (options !== null && isObject(options)) { + const names = Object.keys(options) + + for (const name of names) { + const src = target[name] + const copy = options[name] + + if (target !== copy) { + deepCopy(target, name, deep, copy, src) + } + } + } + } + + return target +} + +let isEachEqual + +/** + * 比较两个对象是否相等。 + * + * isEqual({ a: { b: 1 } }, { a: { b: 1, c: 2 } }, false, [ 'a.b' ]) // false + * isEqual({ a: { b: 1 } }, { a: { b: 1, c: 2 } }, true, [ 'a.b' ]) // true + * + * @param {Object} sourceData 源对象 + * @param {Object} targetData 目标对象 + * @param {Boolean} [deep] 是否深度比较,默认深度比较, 只有指定false才不进行深度比较 + * @param {Array} [fields] 指定需要比较的字段的数组 + * @returns {Boolean} + */ +export const isEqual = (sourceData, targetData, deep, fields) => { + if (typeOf(sourceData) === typeOf(targetData)) { + deep = deep !== false + + if (Array.isArray(fields)) { + const _sourceData = copyField(sourceData, fields) + const _targetData = copyField(targetData, fields) + + return isEqual(_sourceData, _targetData, deep) + } + + const source = isEachEqual(sourceData, targetData, deep) + const target = isEachEqual(targetData, sourceData, deep) + + return source === target && source !== false + } + + return false +} + +/** + * 循环遍历两个对象,判断对象的属性是否完全相等。 + * + * isEachEqual({a: 1}, {a: 1}) // true + * isEachEqual({a: 1, b: {c: 3, d: 4}}, {a: 1, b: {c: 3, d: 5}}) // false + * + * @param {Object} data1 数据源对象 + * @param {Object} data2 对比目标对象 + * @param {Boolean} [deep] 是否深度遍历 + * @returns {Boolean} + */ +isEachEqual = (data1, data2, deep) => { + if (!isPlainObject(data1)) { + if (!Array.isArray(data1)) { + return data1 === data2 + } + if (data1.length !== data2.length) { + return false + } + + for (let i = 0, length = data1.length; i < length; i++) { + const result = isEqual(data1[i], data2[i], deep) + + if (!result) { + return false + } + } + + return true + } + + let bEqual = true + const names = Object.keys(data1) + + for (const name of names) { + if (hasOwn.call(data2, name)) { + const _data1 = data1[name] + const _data2 = data2[name] + + if ((deep && isObject(_data1)) || Array.isArray(_data1)) { + bEqual = isEachEqual(_data1, _data2, deep) + } else { + bEqual = _data1 === _data2 + } + } else { + bEqual = false + } + + if (bEqual === false) { + break + } + } + + return bEqual +} + +export { isEachEqual, extend } + +/** + * 将json对象序列化为字符串。 + * + * let obj = { a: 1, b: 2 } + * toJsonStr(obj) // '{"a":1,"b":2}' + * obj.prop = obj + * toJsonStr(obj) // undefined + * toJsonStr(null) // 'null' + * + * @param {Object} obj + * @returns {String} + */ +export const toJsonStr = (obj) => { + try { + return JSON.stringify(obj) + } catch (e) { + return undefined + } +} + +/** + * 将一个或多个源对象简单合并到目标对象中,合并时排除非 OwnProperty 及 undefined 属性。 + * + * merge({ a: 1 }, { b: { c: 2 } }, { d: 3 }) // { a: 1, b: { c: 2 }, d: 3 } + * + * @param {Object} target 目标对象 + * @param {Object} [source] 源对象 + * @returns {Object} + */ +export const merge = function (target) { + for (let i = 1, len = arguments.length; i < len; i++) { + const source = arguments[i] || {} + + for (const prop in source) { + if (hasOwn.call(source, prop)) { + const value = source[prop] + + if (value !== undefined) { + target[prop] = value + } + } + } + } + + return target +} diff --git a/packages/renderless/src/common/runtime.ts b/packages/renderless/src/common/runtime.ts new file mode 100644 index 000000000..0ad510aec --- /dev/null +++ b/packages/renderless/src/common/runtime.ts @@ -0,0 +1,98 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +/* + * 以下是能对外抛出给用户使用的通用方法(运行时用) + * 涉及以下的依赖统一使用包名路径的形式引入 + * 导出对象命名规范:以文件名称的驼峰格式 + */ +import * as array from '@opentiny/vue-renderless/common/array' +import browser from '@opentiny/vue-renderless/common/browser' +import * as date from '@opentiny/vue-renderless/common/date' +import * as decimal from '@opentiny/vue-renderless/common/decimal' +import * as object from '@opentiny/vue-renderless/common/object' +import * as string from '@opentiny/vue-renderless/common/string' +import * as type from '@opentiny/vue-renderless/common/type' +import * as dataset from '@opentiny/vue-renderless/common/dataset' +import afterLeave from '@opentiny/vue-renderless/common/deps/after-leave' +import clickoutside from '@opentiny/vue-renderless/common/deps/clickoutside' +import debounce from '@opentiny/vue-renderless/common/deps/debounce' +import * as dom from '@opentiny/vue-renderless/common/deps/dom' +import popper from '@opentiny/vue-renderless/common/deps/popper' +import popupManager from '@opentiny/vue-renderless/common/deps/popup-manager' +import * as resizeEvent from '@opentiny/vue-renderless/common/deps/resize-event' +import * as scrollbarWidth from '@opentiny/vue-renderless/common/deps/scrollbar-width' +import throttle from '@opentiny/vue-renderless/common/deps/throttle' +import vueEmitter from '@opentiny/vue-renderless/common/deps/vue-emitter' +import vuePopper from '@opentiny/vue-renderless/common/deps/vue-popper' +import vuePopup from '@opentiny/vue-renderless/common/deps/vue-popup' +import validate from '@opentiny/vue-renderless/common/validate' +import memorize from '@opentiny/vue-renderless/common/deps/memorize' +import * as common from '@opentiny/vue-renderless/common' + +const version = process.env.RUNTIME_VERSION + +const Renderless = { + browser, + array, + date, + object, + decimal, + type, + string, + afterLeave, + dataset, + clickoutside, + dom, + debounce, + popper, + resizeEvent, + popupManager, + scrollbarWidth, + vueEmitter, + vuePopper, + throttle, + vuePopup, + memorize, + common, + validate, + version +} + +export default Renderless + +export { + array, + browser, + date, + decimal, + object, + string, + type, + dataset, + afterLeave, + clickoutside, + debounce, + dom, + popper, + popupManager, + resizeEvent, + scrollbarWidth, + throttle, + vueEmitter, + vuePopper, + vuePopup, + validate, + memorize, + common, + version +} diff --git a/packages/renderless/src/common/string.ts b/packages/renderless/src/common/string.ts new file mode 100644 index 000000000..342094d26 --- /dev/null +++ b/packages/renderless/src/common/string.ts @@ -0,0 +1,761 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { isPlainObject, isNumber, isNumeric, isNull } from '@opentiny/vue-renderless/common/type' +import { getObj, toJsonStr } from '@opentiny/vue-renderless/common/object' +import { toFixed } from '@opentiny/vue-renderless/common/decimal' +import { nanoid } from '@opentiny/vue-renderless/common/xss.js' + +/** + * 文本替换格式类型 + */ +export const formatTypes = { + text: 'text', + url: 'url', + html: 'html', + tmpl: 'tmpl' +} + +/** + * 字符对应的字符编码 + */ +export const escapeChars = { + '&': '&', + '<': '<', + '>': '>', + '"': '"', + '\'': ''', + '[': '[', + ']': ']' +} + +/** + * 判断是否为null、undefined、空字符串 + * + * isNullOrEmpty('') // true + * + * @param {Object} value 需判断的对象 + * @return {Boolean} + */ +export const isNullOrEmpty = (value) => value === null || value === undefined || (typeof value === 'string' && value.trim().length === 0) + +function cached(fn) { + let cache = Object.create(null) + + return function cachedFn(str) { + const hit = cache[str] + return hit || (cache[str] = fn(str)) + } +} + +const camelizeRE = /-(\w)/g +export const camelize = cached((str) => str.replace(camelizeRE, (_, c) => (c ? c.toUpperCase() : ''))) + +/** + * 将字符串首写字母大写。 + * + * capitalize('hello') // "Hello" + * + * @param {String} string 要转换的字符串 + * @returns {String} + */ +export const capitalize = cached((str) => str.charAt(0).toUpperCase() + str.slice(1)) + +const hyphenateRE = /\B([A-Z])/g +export const hyphenate = cached((str) => str.replace(hyphenateRE, '-$1').toLowerCase()) + +/** + * 解析Json字符串成对象。 + * + * let str = '{ "value": "v1", "text": "t1" }' + * toJson(str) // { value: 'v1', text: 't1' } + * + * @param {String} string 要解析的Json字符串 + * @returns {Object} + */ +export const toJson = (string) => { + try { + return JSON.parse(string) + } catch (e) { + return undefined + } +} + +function getLengthInUtf16(string) { + const len = string.length + let count = 0 + + for (let i = 0; i < len; i++) { + let charCode = string.charCodeAt(i) + + /* istanbul ignore else */ + if (charCode <= 0xFFFF) { + count += 2 + } else { + count += 4 + } + } + + return count +} + +function getLengthInUtf8(string) { + const len = string.length + let count = 0 + + for (let i = 0; i < len; i++) { + let charCode = string.charCodeAt(i) + + /* istanbul ignore else */ + if (charCode <= 0x007F) { + count += 1 + } else if (charCode <= 0x07FF) { + count += 2 + } else if (charCode <= 0xFFFF) { + count += 3 + } else { + count += 4 + } + } + + return count +} + +function getLengthDefault(string) { + const len = string.length + let count = 0 + + for (let i = 0; i < len; i++) { + count++ + + if (string.charCodeAt(i) >> 8) { + count++ + } + } + + return count +} + +/** + * 计算字符串长度或所占的内存字节数。 + * 默认计算方式(中文算两个长度,数字字母算一个),也可指定为 'basic','UTF-16','UTF-8',或自定义的计算规则。 + * + * getLength('12ED') // => 4 + * getLength('深圳') // => 4 + * getLength('好a','basic') // '好a' => 2,'a' => 1 + * getLength('好a','UTF-8') // 好a' => 4,'a' => 1 + * getLength('好a','UTF-16') //'好a' => 4,'a' => 2 + * getLength(str, function (str) { + * return (str + 'xx').length + * }) + * + * UTF-8 是一种可变长度的 Unicode 编码格式,使用一至四个字节为每个字符编码 + * + * 000000 - 00007F(128个代码) 0zzzzzzz(00-7F) 一个字节 + * 000080 - 0007FF(1920个代码) 110yyyyy(C0-DF) 10zzzzzz(80-BF) 两个字节 + * 000800 - 00D7FF 注: Unicode在范围 D800-DFFF 中不存在任何字符 + * 00E000 - 00FFFF(61440个代码) 1110xxxx(E0-EF) 10yyyyyy 10zzzzzz 三个字节 + * 010000 - 10FFFF(1048576个代码) 11110www(F0-F7) 10xxxxxx 10yyyyyy 10zzzzzz 四个字节 + * + * + * 定义参考 http://zh.wikipedia.org/wiki/UTF-8 + * + * UTF-16 大部分使用两个字节编码,编码超出 65535 的使用四个字节 + * + * 000000 - 00FFFF 两个字节 + * 010000 - 10FFFF 四个字节 + * + * 定义参考 http://zh.wikipedia.org/wiki/UTF-16 + * + * @param {String} string + * @param {String|Function} regular 长度规则:'basic'、'UTF-16'、'UTF-8'或自定义的计算规则函数 + * @return {Number} + */ +export const getLength = (string, regular) => { + if (!string || typeof string !== 'string') { + return 0 + } + + let count = 0 + + if (typeof regular === 'string') { + regular = regular.toLowerCase() + + if (regular === 'utf-16' || regular === 'utf16') { + count = getLengthInUtf16(string) + } else if (regular === 'utf-8' || regular === 'utf8') { + count = getLengthInUtf8(string) + } else { + count = string.replace(/[\uD800-\uDBFF][\uDC00-\uDFFF]/g, '_').length + } + } else if (typeof regular === 'function') { + return regular(string) + } else { + count = getLengthDefault(string) + } + + return count +} + +/** + * 填充字符串,根据填充模式参数,在字符串前面或后面补充字附到指定的长度。 + * + * fillChar('1', 3) // "001" + * fillChar('1', 3, true) // "100" + * fillChar('1', 3, true, ' ') // "1 " + * + * @param {String} string 被填充的字符串 + * @param {Number} length 填充到某个长度 + * @param {Boolean} [append=false] 是否在后面填充,默认为在前面填充 + * @param {String} [chr="0"] 填充的字符,默认为0 + * @returns {String} + */ +export const fillChar = (string, length, append, chr = '0') => { + if (typeof string === 'string' && typeof chr === 'string' && isNumber(length)) { + let len = string.length - length + + if (len > 0) { + return append ? string.substr(0, length) : string.substr(len, length) + } else { + const appendStr = [] + len = Math.abs(len) / chr.length + + for (; len > 0; len--) { + appendStr.push(chr) + } + + const s = appendStr.join('') + + return append ? string + s : s + string + } + } +} + +/** + * 生成一个guid。 + * + * guid('#') // #16722423 + * + * @param {String} [prefix] guid前缀,可选值,默认为空字符串 + * @param {Number} [length] 生成的guid的长度,可选值,默认为8 + * @returns {String} + */ +export const random = nanoid.random + +export const guid = (prefix = '', length = 8) => prefix + random().toString().substr(2, length) + +/** + * 将HTML字符串进行编码。 + * + * escapeHtml('
    &&
    ') // "<div>&&</div>" + * + * @param {String} string 要编码的字符串 + * @param {Boolean} [isReplaceSpace] 是否替换空格 + * @returns {String} + */ +export const escapeHtml = (string, isReplaceSpace) => { + if (!string || typeof string !== 'string') { + return string + } + + string = string.replace(/[&<>"']/g, (chr) => escapeChars[chr]) + return isReplaceSpace ? string.replace(/\s/g, ' ') : string +} + +/** + * 将URL字符串进行转义。 + * + * let str = '< >& []""' + "'" + * escape(str) // "< >& []""'" + * escape(str, 'uri', true) // "%3C%20%3E%26%20%5B%5D%22%22'" + * escape(str, true) // "< >& []""'" + * escape(str, 'html', true) // "< >& []""'" + * escape(str, 'prop', true) // "< >& []""'" + * + * @param {String} string 需要转换的字符串 + * @param {String} [escapeType] 转换类型,可选值:uri, html, prop + * @param {Boolean} [isReplaceSpace] 是否替换空格, 默认不替换 + * @returns {String} + */ +export const escape = (string, escapeType, isReplaceSpace) => { + if (!string || typeof string !== 'string') { + return string + } + + if (typeof escapeType === 'boolean') { + isReplaceSpace = !!escapeType + } + + if (escapeType === 'uri') { + return encodeURIComponent(string) + } else if (escapeType === 'html') { + return escapeHtml(string, isReplaceSpace) + } else if (escapeType === 'prop') { + string = escapeHtml(string, isReplaceSpace) + return string.replace(/[[\]]/g, (chr) => escapeChars[chr]) + } + + string = string.replace(/[<>"]/g, (chr) => escapeChars[chr]) + return isReplaceSpace ? string.replace(/\s/g, ' ') : string +} + +const getFormat = ({ sign, format, hasSign }) => { + switch (sign) { + case '#': + format = formatTypes.text + break + case '@': + format = formatTypes.url + break + case '$': + format = formatTypes.html + break + case '%': + format = formatTypes.tmpl + break + default: + hasSign = false + break + } + + return { format, hasSign } +} + +/** + * 使用具体的对象字段代替字符串中的字段占位符。 + * + * fieldFormat('url:{{url}}', { url: 'http://abc.com/a&b' }) // "url:http://abc.com/a&b" + * fieldFormat('url:{{#url}}', { url: 'http://abc.com/a&b' }) // "url:http://abc.com/a&b" + * fieldFormat('url:{{@url}}', { url: 'http://abc.com/a&b' }) // "url:http%3A%2F%2Fabc.com%2Fa%26b" + * fieldFormat('url:{{$url}}', { url: 'http://abc.com/a&b' }) // "url:http://abc.com/a&b" + * fieldFormat('url:{{%url}}', { url: 'http://abc.com/a&b' }) // "url:{{http://abc.com/a&b}}" + * + * @param {String} string 要替换的字符串模板 + * @param {Object} data 要替换模板的数据 + * @param {String} [type="html"] 替换的类型:"text"、"url"、"tmpl"、"html",默认"html" + * @returns {String} + */ +export const fieldFormat = (string, data, type = 'html') => { + if (typeof string === 'string') { + return string.replace(/(\/)?\{\{([\s\S]*?)}}/g, (match, slash = '', offset = '') => { + const sign = offset.substr(0, 1) + let hasSign = true + let format = formatTypes.html + let ret = getFormat({ sign, format, hasSign }) + + format = ret.format + hasSign = ret.hasSign + + if (hasSign) { + offset = (offset || '').substring(1) + } else if (type) { + format = type + } + + let value = getObj(data, offset) + + if (isNull(value)) { + value = '' + } + + if (format === formatTypes.tmpl) { + value = `{{${value}}}` + } else { + if (format === formatTypes.url) { + value = encodeURIComponent(value) + } else { + value = format === formatTypes.html ? escapeHtml(value) : value + } + } + + return format === formatTypes.url && value.length === 0 ? '' : slash + value + }) + } +} + +const getFormatText = () => (str, reg, args, format) => + str.replace(reg, (m, i, j, k) => { + if (!isNullOrEmpty(i) && !isNullOrEmpty(k)) { + return `{${j}}` + } + + const value = args[j] + const string = isPlainObject(value) ? toJsonStr(value) : value + + if (isNullOrEmpty(value)) { + return '' + } + + return typeof value === 'string' && typeof format === 'function' ? format(string) : string + }) + +const getResult = ({ type, res, formatText, string, reg, args }) => { + if (type === formatTypes.url) { + res = formatText(string, reg, args, encodeURIComponent) + } else if (type === formatTypes.html) { + res = formatText(string, reg, args, escapeHtml) + } else { + res = formatText(string, reg, args) + } + + return res +} + +const judgForFunc = (args, formatTypes, type) => { + const lastArg = args[args.length - 1] + + if (lastArg !== formatTypes.text && lastArg !== formatTypes.url && lastArg !== formatTypes.html) { + args = Array.prototype.slice.call(args, 1) + } else { + args = Array.prototype.slice.call(args, 1, args.length - 1) + type = lastArg + } + + return { args, type } +} + +const checkParam = ({ data, args, type, _arguments }) => { + if (Array.isArray(data)) { + args = data + } else { + const judgObj = judgForFunc(_arguments, formatTypes, type) + + args = judgObj.args + type = judgObj.type + } + + return { args, type } +} + +/** + * 使用具体的值替换字符串中的数字占位符。 + * + * format('{0}', 1) // "1" + * format('{0}', 1, 'text') // "1" + * format('{0}{1}', [1, 2, 'text']) // "12" + * format('age:{{age}}', { age: 20 }) // "age:20" + * format('\\{0\\}{1}', [0, 1]) // "{0}1" + * format('{0}', [{ age: 20 }]) // "{"age":20}" + * format('{0}', [ 'http://abc.com/a&b' ], 'url') // "http%3A%2F%2Fabc.com%2Fa%26b" + * format('{0}', [ '
    &&
    ' ], 'html') // "<div>&&</div>" + * + * @param {String} string 要替换的字符串模板 + * @param {Object|Array|String} data 要替换模板的数据 + * @param {String} [type="text"] 替换的类型:"text"、"url"、"html",默认"text" + * @returns {String} + */ +export const format = function (string, data, type = 'text') { + if (typeof string !== 'string' || arguments.length < 2) { + return string + } + + let args, res + + if (isPlainObject(data)) { + return fieldFormat(string, data, type) + } + + const ret = checkParam({ data, args, type, _arguments: arguments }) + + args = ret.args + type = ret.type + + const reg = /(\\)?\{(\d+)(\\)?}/g + const formatText = getFormatText() + + res = getResult({ type, res, formatText, string, reg, args }) + + return res +} + +const getTruthyValue = ({ string, length, ellipsis }) => { + const flag = typeof string === 'string' && isNumber(length) && length < string.length + const truthyValue = flag && format(ellipsis, string.substr(0, length)) + + return { flag, truthyValue } +} + +/** + * 将字符串按指定长度截断。 + * + * truncate('abc', 5) // "abc" + * truncate('abc', 2) // "ab..." + * + * @param {String} string 要截断的字符串 + * @param {Number} length 要截断的长度 + * @param {String} [ellipsis="{0}..."] 截断类型,通常携带{0}占位符 + * @returns {String} + */ +export const truncate = (string, length, ellipsis = '{0}...') => { + const { flag, truthyValue } = getTruthyValue({ string, length, ellipsis }) + + return flag ? truthyValue : string +} + +/** + * 尝试按指定函数转换字符串,如果转换结果为 NaN,则返回 defaultValue。 + * + * tryToConvert(toInt, null, 0) // 0 + * + * @param {Function} convert 指定的转换的函数 + * @param {Number|String} defaultValue 若为 NaN 时,返回的缺省值 + * @param {Number|String} value 要转换的字符串或多个参数 + * @returns {Number|String} + */ +export const tryToConvert = (convert, defaultValue, ...args) => { + const result = convert.apply(null, args) + return isNaN(result) ? defaultValue : result +} + +/** + * 将字符串解析成十进制整数。 + * + * toInt(100) // 100 + * toInt('100.01') // 100 + * + * @param {Number|String} value 要解析的字符串 + * @returns {Number} + */ +export const toInt = (value) => (isNumber(value) ? Number(value.toFixed(0)) : typeof value === 'string' ? parseInt(value, 10) : NaN) + +/** + * 尝试将字符串解析成十进制整数。如果 value 是个无效的整数,则返回 defaultValue。 + * + * tryToInt(100) // 100 + * tryToInt('100.01') // 100 + * tryToInt(null, 100) // 100 + * + * @param {Number|String} value 要解析的字符串 + * @param {Number|String} defaultValue 若为 NaN 时,返回的缺省值 + * @returns {Number|String} + */ +export const tryToInt = (value, defaultValue) => tryToConvert(toInt, defaultValue, value) + +/** + * 将字符串解析成数值。 + * + * toNumber(100) // 100 + * toNumber('100.01') // 100.01 + * + * @param {Number|String} value 要解析的字符串 + * @returns {Number} + */ +export const toNumber = (value) => (isNumber(value) ? value : typeof value === 'string' ? parseFloat(value) : NaN) + +/** + * 尝试将字符串解析成数值。如果 value 是个无效的数字,则返回 defaultValue。 + * + * tryToNumber(100) // 100 + * tryToNumber('100.01') // 100.01 + * tryToNumber(null, 100) // 100 + * + * @param {Number|String} value 要解析的字符串 + * @param {Number|String} defaultValue 若为 NaN 时,返回的缺省值 + * @returns {Number|String} + */ +export const tryToNumber = (value, defaultValue) => tryToConvert(toNumber, defaultValue, value) + +/** + * 将字符串解析成浮点数。 + * + * toDecimal(100) // "100.00" + * toDecimal("100.01", 2) // "100.01" + * toDecimal(0.8 - 0.6, 2, true) // "0.2" + * toDecimal(0.8 - 0.6, 2, false) // "0.20" + * + * @param {Number|String} value 要解析的数字或字符串 + * @param {Number} [fraction=2] 浮点数的小数部分,默认2位 + * @param {Boolean} [isTruncate=false] 是否截断,默认为四舍五入,不截断 + * @returns {String} + */ +export const toDecimal = (value, fraction = 2, isTruncate = false) => { + let result = NaN + + if (isNumber(value)) { + result = value + } + + if (typeof value === 'string') { + const val = parseFloat(value) + if (!isNaN(val)) { + result = val + } + } + + if (isNumber(result)) { + if (isTruncate) { + result = toFixed( + value + .toString() + .split('.') + .slice(0, 2) + .map((str, index) => (index ? str.slice(0, fraction) : str)) + .join('.'), + fraction + ) + } else { + result = toFixed(result, fraction) + } + } + + return result +} + +/** + * 尝试将字符串解析成浮点数。如果 value 是个无效的浮点数,则返回 defaultValue。 + * + * tryToDecimal(100) // "100.00" + * tryToDecimal("100.01", 2) // "100.01" + * tryToDecimal(0.8 - 0.6, 2, true) // "0.2" + * tryToDecimal(0.8 - 0.6, 2, false) // "0.20" + * tryToDecimal(null, 2, false, 100) // 100 + * + * @param {Number|String} value 要解析的数字或字符串 + * @param {Number} [fraction=2] 浮点数的小数部分,默认2位 + * @param {Boolean} [isTruncate=false] 是否截断,默认为四舍五入,不截断 + * @param {Number|String} [defaultValue] 若为 NaN 时,返回的缺省值 + * @returns {Number|String} + */ +export const tryToDecimal = (value, fraction, isTruncate, defaultValue) => tryToConvert(toDecimal, defaultValue, value, fraction, isTruncate) + +/** + * 将数字或字符串转换成货币格式。 + * + * toCurrency(100) // "100.00" + * toCurrency(100, 2) // "100.00" + * toCurrency(1234.56) // "1,234.56" + * toCurrency(100, 2, '${0}') // "$100.00" + * + * @param {Number|String} value 要解析的数字或字符串 + * @param {Number} [fraction=2] 浮点数的小数部分,默认2位 + * @param {String} [placeholder] 货币符号,占位符格式,例如 "${0}" + * @param {Boolean} [isTruncate=false] 是否截断,默认为四舍五入,不截断 + * @returns {String} + */ +export const toCurrency = (value, fraction, placeholder, isTruncate) => { + if (isNumeric(value)) { + let val = toDecimal(Number(value), fraction, isTruncate) + val = String(val).replace(/(^|[^\w.])(\d{4,})/g, ($0, $1, $2) => $1 + $2.replace(/\d(?=(?:\d\d\d)+(?!\d))/g, '$&,')) + return placeholder ? format(placeholder, val) : val + } + + return NaN +} + +/** + * 尝试将数字转换成货币格式。如果 value 是个无效的金额,则返回 defaultValue。 + * + * tryToCurrency(100) // "100.00" + * tryToCurrency(100, 2) // "100.00" + * tryToCurrency(1234.56) // "1,234.56" + * tryToCurrency(100, 2, '${0}') // "$100.00" + * tryToCurrency(null, 3, '¥{0}', '金额错误') // "金额错误" + * + * @param {Number|String} value 要转换的数值 + * @param {Number} [fraction=2] 浮点数的小数部分,默认2位 + * @param {String} [placeholder] 货币符号,占位符格式,例如 "${0}" + * @param {Number|String} [defaultValue] 若为 NaN 时,返回的缺省值 + * @returns {Number|String} + */ +export const tryToCurrency = (value, fraction, placeholder, defaultValue) => (isNaN(toNumber(value)) ? defaultValue : toCurrency(value, fraction, placeholder)) + +/** + * 转换成布尔值或0(表示false),1(表示true)。 + * + * toBoolValue(1) // 1 + * toBoolValue(true) // true + * toBoolValue('true') // true + * toBoolValue({}) // true + * toBoolValue('') // false + * + * @param {Number|String|Boolean} value 要转换的值 + * @returns {Boolean|number} + */ +export const toBoolValue = (value) => { + if (isNumber(value)) { + return value ? 1 : 0 + } else if (isNull(value) || value === 'false') { + return false + } else if (value === 'true') { + return true + } else if (typeof value === 'boolean') { + return value + } + + return !!value +} + +/** + * 将数值按百分比显示。 + * + * toRate(0.1) // "10.00%" + * toRate(10, 100, 2) // "10.00%" + * + * @param {Number} value 要转换的值 + * @param {Number} [total=1] 百分比基数,默认为1 + * @param {Number} [fraction=2] 数值的小数部分,默认为2 + * @returns {String} + */ +export const toRate = (value, total = 1, fraction = 2) => (isNumber(value) && isNumber(total) ? `${toDecimal((value * 100) / total, fraction)}%` : value) + +/** + * 文件大小值 单位互相转换。 + * + * toFileSize(1024) // "1.00KB" + * toFileSize(1024, 'B') // "1024.00B" + * toFileSize(1024, 'KB', 'B') // "1.00KB" + * toFileSize(1024, 'MB', 'KB') // "1.00MB" + * + * @param {Number} value 文件大小数值 + * @param {String} unit 转换后的单位 + * @param {String} [currUnit] 当前大小单位,默认为B,值可为B、KB、MB、GB、TB、PB、EB、ZB、YB + * @returns {String} + */ +export const toFileSize = (value, unit, currUnit) => { + if (isNumeric(value)) { + value = Number(value) + + if (value === 0) { + return `0${currUnit || unit || 'B'}` + } + + const fileSize = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'] + + let index = fileSize.indexOf(currUnit) + if (index > -1) { + for (let i = 0; i < index; i++) { + value *= 1024 + } + } + + index = fileSize.indexOf(unit) + if (index < 0) { + index = fileSize.length - 1 + } + + let level = 0 + for (let i = 0; i < index && (value <= -1024 || value >= 1024); i++) { + value /= 1024.0 + level++ + } + + return toDecimal(value, 2) + fileSize[level] + } + + return value +} + +/** + * 检查文本中是否包含韩文 + * @param {String} text + */ +export const isKorean = (text) => /([(\uAC00-\uD7AF)|(\u3130-\u318F)])+/gi.test(text) diff --git a/packages/renderless/src/common/type.ts b/packages/renderless/src/common/type.ts new file mode 100644 index 000000000..a9ba98fd0 --- /dev/null +++ b/packages/renderless/src/common/type.ts @@ -0,0 +1,185 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const toString = Object.prototype.toString +export const hasOwn = Object.prototype.hasOwnProperty + +const getProto = Object.getPrototypeOf +const fnToString = hasOwn.toString +const ObjectFunctionString = fnToString.call(Object) + +const class2type = { + '[object Error]': 'error', + '[object Object]': 'object', + '[object RegExp]': 'regExp', + '[object Date]': 'date', + '[object Array]': 'array', + '[object Function]': 'function', + '[object String]': 'string', + '[object Number]': 'number', + '[object Boolean]': 'boolean' +} + +export const isNull = (x) => x === null || x === undefined || x === 'undefined' + +/** + * 返回 JavaScript 对象的类型。 + * + * 如果对象是 undefined 或 null,则返回相应的'undefined'或'null'。 + * + * 其他一切都将返回它的类型'object'。 + * + * typeOf( undefined ) === 'undefined' + * typeOf() === 'undefined' + * typeOf( window.notDefined ) === 'undefined' + * typeOf( null ) === 'null' + * typeOf( true ) === 'boolean' + * typeOf( 3 ) === 'number' + * typeOf( "test" ) === 'string' + * typeOf( function (){} ) === 'function' + * typeOf( [] ) === 'array' + * typeOf( new Date() ) === 'date' + * typeOf( new Error() ) === 'error' + * typeOf( /test/ ) === 'regExp' + * + * @param {Object} obj 对象 + * @returns {String} + */ +export const typeOf = (obj) => (isNull(obj) ? String(obj) : class2type[toString.call(obj)] || 'object') + +/** + * 判断对象是否为 object 类型。 + * + * isObject({}) // true + * + * @param {Object} obj 对象 + * @returns {Boolean} + */ +export const isObject = (obj) => typeOf(obj) === 'object' + +/** + * 判断对象是否为 function 类型。 + * + * isObject(function (){) // true + * + * @param {Object} fn 函数 + * @returns {Boolean} + */ +export const isFunction = (fn) => typeOf(fn) === 'function' + +/** + * 判断对象是否为简单对象。 + * + * 即不是 HTML 节点对象,也不是 window 对象,而是纯粹的对象(通过 '{}' 或者 'new Object' 创建的)。 + * + * let obj = {} + * isPlainObject(obj) //true + * + * @param {Object} obj 对象 + * @returns {Boolean} + */ +export const isPlainObject = (obj) => { + if (!obj || toString.call(obj) !== '[object Object]') { + return false + } + + const proto = getProto(obj) + if (!proto) { + return true + } + + const Ctor = hasOwn.call(proto, 'constructor') && proto.constructor + return typeof Ctor === 'function' && fnToString.call(Ctor) === ObjectFunctionString +} + +/** + * 检查对象是否为空(不包含任何属性)。 + * + * let obj = {} + * isEmptyObject(obj) // true + * + * @param {Object} obj 对象 + * @returns {Boolean} + */ +export const isEmptyObject = (obj) => { + const type = typeOf(obj) + + if (type === 'object' || type === 'array') { + for (const name in obj) { + if (hasOwn.call(obj, name)) { + return false + } + } + } + + return true +} + +/** + * 判断对象是否为数字类型。 + * + * isNumber(369) // true + * + * @param {Object} value 对象 + * @returns {Boolean} + */ +export const isNumber = (value) => typeof value === 'number' && isFinite(value) + +/** + * 判断对象是否代表一个数值。 + * + * isNumeric('-10') // true + * isNumeric(16) // true + * isNumeric(0xFF) // true + * isNumeric('0xFF') // true + * isNumeric('8e5') // true + * isNumeric(3.1415) // true + * isNumeric(+10) // true + * isNumeric('') // false + * isNumeric({}) // false + * isNumeric(NaN) // false + * isNumeric(null) // false + * isNumeric(true) // false + * isNumeric(Infinity) // false + * isNumeric(undefined) // false + * + * @param {Object} value 对象 + * @returns {Boolean} + */ +export const isNumeric = (value) => value - parseFloat(value) >= 0 + +/** + * 判断对象是否为日期类型。 + * + * let date = new Date() + * isDate(date) // true + * + * @param {Object} value 对象 + * @returns {Boolean} + */ +export const isDate = (value) => typeOf(value) === 'date' + +/** + * 判断两个值是否值相同且类型相同。 + * + * 注:在 JavaScript 里 NaN === NaN 为 false,因此不能简单的用 === 来判断。 + * + * isSame(1, 1) // true + * isSame(NaN, NaN) // true + * + * @param {Object} x 对象 + * @param {Object} y 对象 + * @returns {Boolean} + */ +export const isSame = (x, y) => x === y || (typeof x === 'number' && typeof y === 'number' && isNaN(x) && isNaN(y)) + +export const isRegExp = (value) => typeOf(value) === 'regExp' diff --git a/packages/renderless/src/common/validate/index.ts b/packages/renderless/src/common/validate/index.ts new file mode 100644 index 000000000..15821600c --- /dev/null +++ b/packages/renderless/src/common/validate/index.ts @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import Schema from './schema' +import validators from './validations/index' +import getDefaultMessage from './messages' + +Schema.validators = validators +Schema.getDefaultMessage = getDefaultMessage + +export default Schema diff --git a/packages/renderless/src/common/validate/messages.ts b/packages/renderless/src/common/validate/messages.ts new file mode 100644 index 000000000..c804a4489 --- /dev/null +++ b/packages/renderless/src/common/validate/messages.ts @@ -0,0 +1,73 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +const getTypesObj = (translate) => ({ + string: translate('validation.types.string'), + method: translate('validation.types.method'), + array: translate('validation.types.array'), + object: translate('validation.types.object'), + number: translate('validation.types.number'), + date: translate('validation.types.date'), + boolean: translate('validation.types.boolean'), + integer: translate('validation.types.integer'), + float: translate('validation.types.float'), + regexp: translate('validation.types.regexp'), + email: translate('validation.types.email'), + url: translate('validation.types.url'), + hex: translate('validation.types.hex'), + digits: translate('validation.types.digits'), + time: translate('validation.types.time'), + dateYM: translate('validation.types.dateYM'), + dateYMD: translate('validation.types.dateYMD'), + dateTime: translate('validation.types.dateTime'), + longDateTime: translate('validation.types.longDateTime'), + version: translate('validation.types.version'), + speczh: translate('validation.types.speczh'), + specialch: translate('validation.types.specialch'), + specialch2: translate('validation.types.hex'), + acceptImg: translate('validation.types.acceptImg'), + acceptFile: translate('validation.types.acceptFile'), + fileSize: translate('validation.types.fileSize') +}) +export default (translate = (value) => value) => ({ + default: translate('validation.default'), + required: translate('validation.required'), + enum: translate('validation.enum'), + whitespace: translate('validation.whitespace'), + date: { + format: translate('validation.date.format'), + parse: translate('validation.date.parse'), + invalid: translate('validation.date.invalid') + }, + types: getTypesObj(translate), + string: { + len: translate('validation.string.len'), + min: translate('validation.string.min'), + max: translate('validation.string.max'), + range: translate('validation.string.range') + }, + number: { + len: translate('validation.number.len'), + min: translate('validation.number.min'), + max: translate('validation.number.max'), + range: translate('validation.number.range') + }, + array: { + len: translate('validation.array.len'), + min: translate('validation.array.min'), + max: translate('validation.array.max'), + range: translate('validation.array.range') + }, + pattern: { + mismatch: translate('validation.pattern.mismatch') + } +}) diff --git a/packages/renderless/src/common/validate/rules/enum.ts b/packages/renderless/src/common/validate/rules/enum.ts new file mode 100644 index 000000000..204163320 --- /dev/null +++ b/packages/renderless/src/common/validate/rules/enum.ts @@ -0,0 +1,23 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import * as util from '../util' + +const ENUM = 'enum' + +export default function (rule, checkValue, source, errors, options) { + rule[ENUM] = Array.isArray(rule[ENUM]) ? rule[ENUM] : [] + + if (!rule[ENUM].includes(checkValue)) { + errors.push(util.format(options.messages[ENUM], rule.fullField, rule[ENUM].join(', '))) + } +} diff --git a/packages/renderless/src/common/validate/rules/index.ts b/packages/renderless/src/common/validate/rules/index.ts new file mode 100644 index 000000000..410bdf24e --- /dev/null +++ b/packages/renderless/src/common/validate/rules/index.ts @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import type from './type' +import range from './range' +import enumRule from './enum' +import pattern from './pattern' +import required from './required' +import whitespace from './whitespace' + +export default { + type, + range, + pattern, + required, + whitespace, + enum: enumRule +} diff --git a/packages/renderless/src/common/validate/rules/pattern.ts b/packages/renderless/src/common/validate/rules/pattern.ts new file mode 100644 index 000000000..bae33fd48 --- /dev/null +++ b/packages/renderless/src/common/validate/rules/pattern.ts @@ -0,0 +1,31 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import * as util from '../util' + +export default function (rule, checkValue, source, errors, options) { + if (rule.pattern) { + if (rule.pattern instanceof RegExp) { + rule.pattern.lastIndex = 0 + + if (!rule.pattern.test(checkValue)) { + errors.push(util.format(options.messages.pattern.mismatch, rule.fullField, checkValue, rule.pattern)) + } + } else if (typeof rule.pattern === 'string') { + const _pattern = new RegExp(rule.pattern) + + if (!_pattern.test(checkValue)) { + errors.push(util.format(options.messages.pattern.mismatch, rule.fullField, checkValue, rule.pattern)) + } + } + } +} diff --git a/packages/renderless/src/common/validate/rules/range.ts b/packages/renderless/src/common/validate/rules/range.ts new file mode 100644 index 000000000..0e0581532 --- /dev/null +++ b/packages/renderless/src/common/validate/rules/range.ts @@ -0,0 +1,64 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import * as util from '../util' +import { isNumber } from '@opentiny/vue-renderless/common/type' +import { getLength } from '@opentiny/vue-renderless/common/string' + +function getErro({ min, max, val, key, rule, errors, util, options }) { + if (min && !max && val < rule.min) { + errors.push(util.format(options.messages[key].min, rule.fullField, rule.min)) + } else if (max && !min && val > rule.max) { + errors.push(util.format(options.messages[key].max, rule.fullField, rule.max)) + } else if (min && max && (val < rule.min || val > rule.max)) { + errors.push(util.format(options.messages[key].range, rule.fullField, rule.min, rule.max)) + } +} + +export default function (rule, checkValue, source, errors, options) { + const len = isNumber(rule.len) + const min = isNumber(rule.min) + const max = isNumber(rule.max) + let val = checkValue + let key = null + const num = isNumber(checkValue) + const str = typeof checkValue === 'string' + const arr = Array.isArray(checkValue) + + if (num) { + key = 'number' + } else if (str) { + key = 'string' + } else if (arr) { + key = 'array' + } + + if (!key) { + return false + } + + if (arr) { + val = checkValue.length + } + + if (str) { + val = getLength(checkValue, 'string') + } + + if (len) { + if (val !== rule.len) { + errors.push(util.format(options.messages[key].len, rule.fullField, rule.len)) + } + } else { + getErro({ min, max, val, key, rule, errors, util, options }) + } +} diff --git a/packages/renderless/src/common/validate/rules/required.ts b/packages/renderless/src/common/validate/rules/required.ts new file mode 100644 index 000000000..c8b44fff6 --- /dev/null +++ b/packages/renderless/src/common/validate/rules/required.ts @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import * as util from '../util' +import { hasOwn } from '@opentiny/vue-renderless/common/type' + +export default function ({ rule, checkValue, source, errors, options, type }) { + if (rule.required && (!hasOwn.call(source, rule.field) || util.isEmptyValue(checkValue, type || rule.type))) { + errors.push(util.format(options.messages.required, rule.fullField)) + } +} diff --git a/packages/renderless/src/common/validate/rules/type.ts b/packages/renderless/src/common/validate/rules/type.ts new file mode 100644 index 000000000..a4fa97ab3 --- /dev/null +++ b/packages/renderless/src/common/validate/rules/type.ts @@ -0,0 +1,126 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import * as util from '../util' +import required from './required' +import { format } from '@opentiny/vue-renderless/common/date' +import { isNullOrEmpty } from '@opentiny/vue-renderless/common/string' +import { isNumber, isObject, isDate, typeOf } from '@opentiny/vue-renderless/common/type' + +const emailReg1 = '^(([^<>()\\[\\]\\\\.,;:\\s@"]+(\\.[^<>()\\[\\]\\\\.,;:\\s@"]+)*)|(".+"))' +const emailReg = new RegExp(emailReg1 + '@((\\[[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}])|(([a-zA-Z\\-0-9]+\\.)+[a-zA-Z]{2,6}))$') + +const pattern = { + acceptImg: /\.(png|jpe?g|gif)$/, + acceptFile: /\.(doc?x|xls?x|ppt?x|txt)$/, + email: emailReg, + fileSize: /^\d+(\.\d+)?[KMGTPEZY]?B$/i, + hex: /^#?([a-f0-9]{6}|[a-f0-9]{3})$/i, + speczh: /^[0-9a-zA-Z_\u4E00-\u9FA5]+$/, + specialch: /^[0-9a-zA-Z_\-.]+$/, + specialch2: /^[0-9a-zA-Z_-]+$/, + url: /^([a-zA-Z]{3,}):\/\/([\w-]+\.)+[\w]+(\/[a-zA-Z- ./?%&=]*)?/i, + version: /^\d+\.\d+(\.\d+)*$/ +} + +const types = { + integer: (value) => types.number(value) && parseInt(value, 10) === value, + float: (value) => types.number(value) && !types.integer(value), + array: Array.isArray, + regexp(value) { + if (value instanceof RegExp) { + return true + } + try { + return !!new RegExp(value) + } catch (e) { + return false + } + }, + date: isDate, + number: isNumber, + object: (value) => isObject(value) && !types.array(value), + method: (value) => typeOf(value) === 'function', + + email: (value) => isNullOrEmpty(value) || (!!value.match(pattern.email) && value.length < 255), + + url: (value) => isNullOrEmpty(value) || !!value.match(pattern.url), + hex: (value) => isNullOrEmpty(value) || !!value.match(pattern.hex), + digits: (value) => isNullOrEmpty(value) || /^\d+$/.test(value), + + time: (value) => isNullOrEmpty(value) || /^((0)[0-9]|1[0-9]|20|21|22|23):([0-5][0-9])$/.test(value), + + dateYM: (value) => isNullOrEmpty(value) || format(value, 'yyyy-MM') === value, + + dateYMD: (value) => isNullOrEmpty(value) || format(value, 'yyyy-MM-dd') === value, + + dateTime: (value) => isNullOrEmpty(value) || format(value, 'yyyy-MM-dd hh:mm') === value, + + longDateTime: (value) => isNullOrEmpty(value) || format(value, 'yyyy-MM-dd hh:mm:ss') === value, + + version: (value) => isNullOrEmpty(value) || !!value.match(pattern.version), + speczh: (value) => isNullOrEmpty(value) || !!value.match(pattern.speczh), + + specialch: (value) => isNullOrEmpty(value) || !!value.match(pattern.specialch), + + specialch2: (value) => isNullOrEmpty(value) || !!value.match(pattern.specialch2), + + acceptImg: (value) => isNullOrEmpty(value) || !!value.match(pattern.acceptImg), + + acceptFile: (value) => isNullOrEmpty(value) || !!value.match(pattern.acceptFile), + + fileSize: (value) => isNullOrEmpty(value) || !!value.match(pattern.fileSize) +} + +export default function (rule, value, source, errors, options) { + if (rule.required && value === undefined) { + required(rule, value, source, errors, options) + return + } + + const custom = [ + 'array', + 'acceptImg', + 'acceptFile', + 'date', + 'digits', + 'dateTime', + 'dateYM', + 'dateYMD', + 'email', + 'float', + 'fileSize', + 'hex', + 'integer', + 'longDateTime', + 'method', + 'number', + 'object', + 'regexp', + 'speczh', + 'specialch', + 'specialch2', + 'time', + 'version', + 'url' + ] + + const ruleType = rule.type + + if (custom.includes(ruleType)) { + if (!types[ruleType](value)) { + errors.push(util.format(options.messages.types[ruleType], rule.fullField, rule.type)) + } + } else if (ruleType && typeof value !== rule.type) { + errors.push(util.format(options.messages.types[ruleType], rule.fullField, rule.type)) + } +} diff --git a/packages/renderless/src/common/validate/rules/whitespace.ts b/packages/renderless/src/common/validate/rules/whitespace.ts new file mode 100644 index 000000000..fdaa03263 --- /dev/null +++ b/packages/renderless/src/common/validate/rules/whitespace.ts @@ -0,0 +1,19 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import * as util from '../util' + +export default function (rule, checkValue, source, errors, options) { + if (/^\s+$/.test(checkValue) || checkValue === '') { + errors.push(util.format(options.messages.whitespace, rule.fullField)) + } +} diff --git a/packages/renderless/src/common/validate/schema.ts b/packages/renderless/src/common/validate/schema.ts new file mode 100644 index 000000000..047ed5081 --- /dev/null +++ b/packages/renderless/src/common/validate/schema.ts @@ -0,0 +1,358 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { format, complementError, asyncMap, warning, deepMerge, convertFieldsError } from './util' +import { hasOwn, isFunction } from '@opentiny/vue-renderless/common/type' + +function Schema(descriptor, translate) { + Schema.getSystemMessage = () => Schema.getDefaultMessage(translate) + Schema.messages = Schema.getSystemMessage(translate) + Schema.systemMessages = Schema.messages + + this.rules = null + this._messages = Schema.systemMessages + this.define(descriptor) +} + +const getCompleteFn = (validCallback) => (results) => { + let idx + let errors = [] + let fields = {} + + function addValid(eror) { + if (Array.isArray(eror)) { + errors = errors.concat(...eror) + } else { + errors.push(eror) + } + } + + for (idx = 0; idx < results.length; idx++) { + addValid(results[idx]) + } + + if (errors.length) { + fields = convertFieldsError(errors) + } else { + errors = null + fields = null + } + + validCallback(errors, fields) +} + +const isDeep = (rule, data) => { + let deep = (rule.type === 'object' || rule.type === 'array') && (typeof rule.fields === 'object' || typeof rule.defaultField === 'object') + + deep = deep && (rule.required || (!rule.required && data.value)) + + return deep +} + +const getFieldsSchema = (rule, data) => { + let schema = {} + function addFullfield(key, item) { + return { + ...item, + fullField: `${rule.fullField}.${key}` + } + } + + if (rule.defaultField) { + for (const k in data.value) { + if (hasOwn.call(data.value, k)) { + schema[k] = rule.defaultField + } + } + } + + schema = { + ...schema, + ...data.rule.fields + } + + for (const f in schema) { + if (hasOwn.call(schema, f)) { + const fieldSchema = Array.isArray(schema[f]) ? schema[f] : [schema[f]] + + schema[f] = fieldSchema.map(addFullfield.bind(null, f)) + } + } + + return schema +} + +const arrayed = (failds) => { + if (!Array.isArray(failds)) { + failds = [failds] + } + + return failds +} + +const getRequiredErrorFeilds = ({ rule, failds, options }) => { + if (rule.message) { + failds = [].concat(rule.message).map(complementError(rule)) + } else if (options.error) { + failds = [options.error(rule, format(options.messages.required, rule.field))] + } else { + failds = [] + } + + return failds +} + +const setDataRuleOptions = ({ data, options }) => { + if (data.rule.options) { + let { messages, error } = options + + Object.assign(data.rule.options, { messages, error }) + } +} + +const getValidateCallback = ({ failds, doIt }) => (errs) => { + const finalErrors = [] + + if (failds && failds.length) { + finalErrors.push(...failds) + } + + if (errs && errs.length) { + finalErrors.push(...errs) + } + + doIt(finalErrors.length ? finalErrors : null) +} + +const asyncCallback = (options, rule, errorFields, doIt, data) => (e = []) => { + let failds = e + const deep = isDeep(rule, data) + + failds = arrayed(failds) + + if (!options.suppressWarning && failds.length) { + Schema.warning('async-validator:', failds) + } + + if (failds.length && rule.message) { + failds = [].concat(rule.message) + } + + failds = failds.map(complementError(rule)) + + if (options.first && failds.length) { + errorFields[rule.field] = 1 + return doIt(failds) + } + + if (deep) { + if (rule.required && !data.value) { + failds = getRequiredErrorFeilds({ rule, failds, options }) + + return doIt(failds) + } + const schema = new Schema(getFieldsSchema(rule, data)) + schema.messages(options.messages) + setDataRuleOptions({ data, options }) + schema.validate(data.value, data.rule.options || options, getValidateCallback({ failds, doIt })) + } else { + doIt(failds) + } +} + +Schema.prototype = { + messages(messages) { + if (messages) { + this._messages = deepMerge(Schema.getSystemMessage(), messages) + } + + return this._messages + }, + define(rules) { + if (!rules) { + throw new Error('Cannot configure a schema with no rules') + } + + if (Array.isArray(rules) || typeof rules !== 'object') { + throw new TypeError('Rules must be an object') + } + + this.rules = {} + let rule + + Object.keys(rules).forEach((key) => { + if (hasOwn.call(rules, key)) { + rule = rules[key] + this.rules[key] = Array.isArray(rule) ? rule : [rule] + } + }) + }, + getSeries(options, source, source_) { + let arr + let value + const series = {} + const keys = options.keys || Object.keys(this.rules) + + keys.forEach((key) => { + arr = this.rules[key] + value = source[key] + + arr.forEach((r) => { + let rule = r + + if (typeof rule.transform === 'function') { + if (source === source_) { + source = { ...source } + } + + source[key] = rule.transform(value) + value = source[key] + } + + if (typeof rule === 'function') { + rule = { validator: rule } + } else { + rule = { ...rule } + } + + rule.validator = this.getValidationMethod(rule) + rule.field = key + rule.fullField = rule.fullField || key + rule.type = this.getType(rule) + + options.custom && Object.assign(rule, options.custom) + + if (!rule.validator) { + return + } + + series[key] = series[key] || [] + series[key].push({ rule, value, source, field: key }) + }) + }) + + return series + }, + mergeMessage(options) { + if (options.messages) { + let messages = this.messages() + + if (messages === Schema.systemMessages) { + messages = Schema.getSystemMessage() + } + + deepMerge(messages, options.messages) + + options.messages = messages + } else { + options.messages = this.messages() + } + }, + validate(source_, o = {}, oc = () => undefined) { + let source = source_ + let options = o + let validCallback = oc + if (typeof options === 'function') { + validCallback = options + options = {} + } + if (!this.rules || Object.keys(this.rules).length === 0) { + validCallback && validCallback() + return Promise.resolve() + } + const complete = getCompleteFn(validCallback) + this.mergeMessage(options) + const seriesData = this.getSeries(options, source, source_) + const errorFields = {} + return asyncMap( + seriesData, + options, + (data, doIt) => { + const rule = data.rule + const validHandler = asyncCallback(options, rule, errorFields, doIt, data) + let validResult + if (rule.asyncValidator) { + validResult = rule.asyncValidator(rule, data.value, validHandler, data.source, options) + } else if (rule.validator) { + validResult = rule.validator(rule, data.value, validHandler, data.source, options) + if (validResult === true) { + validHandler() + } else if (validResult === false) { + validHandler(rule.message || `${rule.field} fails`) + } else if (Array.isArray(validResult)) { + validHandler(validResult) + } else if (validResult instanceof Error) { + validHandler(validResult.message) + } + } + if (validResult && validResult.then) { + validResult.then( + () => validHandler(), + (e) => validHandler(e) + ) + } + }, + (results) => { + complete(results) + } + ) + }, + getValidationMethod(rule) { + if (isFunction(rule.validator)) { + return rule.validator + } + + const ruleKeys = Object.keys(rule) + const messageIndex = ruleKeys.indexOf('message') + + if (messageIndex > -1) { + ruleKeys.splice(messageIndex, 1) + } + + if (ruleKeys.length === 1 && ruleKeys[0] === 'required') { + return Schema.validators.required + } + + return Schema.validators[this.getType(rule)] || false + }, + getType(rule) { + if (rule.type === undefined && rule.pattern instanceof RegExp) { + rule.type = 'pattern' + } + + if (typeof rule.validator !== 'function' && rule.type && !hasOwn.call(Schema.validators, rule.type)) { + throw new Error(format('Unknown rule type %s', rule.type)) + } + + return rule.type || 'string' + } +} + +Schema.register = (type, validator) => { + if (typeof validator !== 'function') { + throw new TypeError('Cannot register a validator by type, validator is not a function') + } + + Schema.validators[type] = validator +} + +Schema.validators = {} + +Schema.warning = warning + +Schema.messages = {} + +Schema.systemMessages = {} + +Schema.getDefaultMessage = () => undefined + +export default Schema diff --git a/packages/renderless/src/common/validate/util.ts b/packages/renderless/src/common/validate/util.ts new file mode 100644 index 000000000..f83ab8571 --- /dev/null +++ b/packages/renderless/src/common/validate/util.ts @@ -0,0 +1,257 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { hasOwn, isNull } from '@opentiny/vue-renderless/common/type' + +const formatRegExp = /%[sdj%]/g + +export let warning = () => undefined + +export function convertFieldsError(errors) { + if (!errors || !errors.length) { + return null + } + + const fields = {} + + errors.forEach((error) => { + const field = error.field + fields[field] = fields[field] || [] + fields[field].push(error) + }) + + return fields +} + +export function format(...args) { + let i = 1 + const checkData = args[0] + const len = args.length + + if (typeof checkData === 'function') { + return checkData.apply(null, args.slice(1)) + } + + if (typeof checkData === 'string') { + let str = String(checkData).replace(formatRegExp, (matchChar) => { + if (matchChar === '%%') { + return '%' + } + + if (i >= len) { + return matchChar + } + + switch (matchChar) { + case '%j': + try { + return JSON.stringify(args[i++]) + } catch (e) { + return '[Circular]' + } + case '%d': + return Number(args[i++]) + case '%s': + return String(args[i++]) + default: + return matchChar + } + }) + + return str + } + + return checkData +} + +function isNativeStringType(type) { + return ~[ + 'string', + 'url', + 'hex', + 'email', + 'pattern', + 'digits', + 'time', + 'dateYMD', + 'longDateTime', + 'dateTime', + 'dateYM', + 'version', + 'speczh', + 'specialch', + 'specialch2', + 'acceptImg', + 'acceptFile', + 'fileSize' + ].indexOf(type) +} + +export function isEmptyValue(data, dataType) { + if (isNull(data)) { + return true + } + + if (dataType === 'array' && Array.isArray(data) && !data.length) { + return true + } + + if (isNativeStringType(dataType) && typeof data === 'string' && !data) { + return true + } + + return false +} + +export function isEmptyObject(data) { + return Object.keys(data).length === 0 +} + +function asyncParallelArray(arrData, func, callback) { + let count = 0 + const results = [] + const arrLength = arrData.length + + function checkCount(errors) { + results.push.apply(results, errors) + + count++ + + if (count === arrLength) { + callback(results) + } + } + + arrData.forEach((rule) => { + func(rule, checkCount) + }) +} + +function asyncSerialArray(arr, fn, cb) { + let idx = 0 + const arrLength = arr.length + + function checkNext(errorList) { + if (errorList && errorList.length) { + cb(errorList) + return + } + + const original = idx + idx = idx + 1 + + if (original < arrLength) { + fn(arr[original], checkNext) + } else { + cb([]) + } + } + + checkNext([]) +} + +function flattenObjArr(objArr) { + const result = [] + + Object.keys(objArr).forEach((item) => { + result.push.apply(result, objArr[item]) + }) + + return result +} + +export function asyncMap(objArray, option, func, callback) { + if (option.first) { + const pending = new Promise((resolve, reject) => { + const errorFn = reject + const next = (errors) => { + callback(errors) + return errors.length ? errorFn({ errors, fields: convertFieldsError(errors) }) : resolve() + } + const flattenArr = flattenObjArr(objArray) + asyncSerialArray(flattenArr, func, next) + }) + + pending.catch((error) => error) + return pending + } + + let firstFields = option.firstFields || [] + + if (firstFields === true) { + firstFields = Object.keys(objArray) + } + + let total = 0 + const objArrayKeys = Object.keys(objArray) + const objArrLength = objArrayKeys.length + const results = [] + const pending = new Promise((resolve, reject) => { + const errorFn = reject + const next = (errors) => { + results.push.apply(results, errors) + total++ + if (total === objArrLength) { + callback(results) + return results.length ? errorFn({ errors: results, fields: convertFieldsError(results) }) : resolve() + } + } + + objArrayKeys.forEach((key) => { + const arr = objArray[key] + if (~firstFields.indexOf(key)) { + asyncSerialArray(arr, func, next) + } else { + asyncParallelArray(arr, func, next) + } + }) + }) + + pending.catch((e) => e) + + return pending +} + +export function complementError(rule) { + return (onError) => { + if (onError && onError.message) { + onError.field = onError.field || rule.fullField + return onError + } + + return { + message: typeof onError === 'function' ? onError() : onError, + field: onError.field || rule.fullField + } + } +} + +export function deepMerge(target, sources) { + if (!sources) { + return target + } + for (const source in sources) { + if (hasOwn.call(sources, source)) { + const value = sources[source] + + if (typeof value === 'object' && typeof target[source] === 'object') { + target[source] = { + ...target[source], + ...value + } + } else { + target[source] = value + } + } + } + return target +} diff --git a/packages/renderless/src/common/validate/validations/array.ts b/packages/renderless/src/common/validate/validations/array.ts new file mode 100644 index 000000000..fb14af0e3 --- /dev/null +++ b/packages/renderless/src/common/validate/validations/array.ts @@ -0,0 +1,35 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import rules from '../rules/index' +import { isEmptyValue } from '../util' +import { hasOwn } from '@opentiny/vue-renderless/common/type' + +export default function (rule, checkValue, callback, source, options) { + const errors = [] + const validate = rule.required || (!rule.required && hasOwn.call(source, rule.field)) + + if (validate) { + if (isEmptyValue(checkValue, 'array') && !rule.required) { + return callback() + } + + rules.required({ rule, checkValue, source, errors, options, type: 'array' }) + + if (!isEmptyValue(checkValue, 'array')) { + rules.type(rule, checkValue, source, errors, options) + rules.range(rule, checkValue, source, errors, options) + } + } + + callback(errors) +} diff --git a/packages/renderless/src/common/validate/validations/date.ts b/packages/renderless/src/common/validate/validations/date.ts new file mode 100644 index 000000000..4dd593d68 --- /dev/null +++ b/packages/renderless/src/common/validate/validations/date.ts @@ -0,0 +1,47 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import rules from '../rules/index' +import { isEmptyValue } from '../util' +import { hasOwn } from '@opentiny/vue-renderless/common/type' + +export default function (rule, checkValue, callback, source, options) { + const errors = [] + const validate = rule.required || (!rule.required && hasOwn.call(source, rule.field)) + const isValidDateStr = (value) => value && typeof value === 'string' && new Date(value).toString() !== 'Invalid Date' + + if (validate) { + if (isEmptyValue(checkValue) && !rule.required) { + return callback() + } + + rules.required({ rule, checkValue, source, errors, options }) + + if (!isEmptyValue(checkValue)) { + let dateObject + + if (typeof checkValue === 'number' || isValidDateStr(checkValue)) { + dateObject = new Date(checkValue) + } else { + dateObject = checkValue + } + + rules.type(rule, dateObject, source, errors, options) + + if (dateObject && typeof dateObject.getTime === 'function') { + rules.range(rule, dateObject.getTime(), source, errors, options) + } + } + } + + callback(errors) +} diff --git a/packages/renderless/src/common/validate/validations/enum.ts b/packages/renderless/src/common/validate/validations/enum.ts new file mode 100644 index 000000000..4786da576 --- /dev/null +++ b/packages/renderless/src/common/validate/validations/enum.ts @@ -0,0 +1,36 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import rules from '../rules/index' +import { isEmptyValue } from '../util' +import { hasOwn } from '@opentiny/vue-renderless/common/type' + +const ENUM = 'enum' + +export default function (rule, checkValue, callback, source, options) { + const errors = [] + const validate = rule.required || (!rule.required && hasOwn.call(source, rule.field)) + + if (validate) { + if (isEmptyValue(checkValue) && !rule.required) { + return callback() + } + + rules.required({ rule, checkValue, source, errors, options }) + + if (checkValue !== undefined) { + rules[ENUM](rule, checkValue, source, errors, options) + } + } + + callback(errors) +} diff --git a/packages/renderless/src/common/validate/validations/float.ts b/packages/renderless/src/common/validate/validations/float.ts new file mode 100644 index 000000000..57c9967e5 --- /dev/null +++ b/packages/renderless/src/common/validate/validations/float.ts @@ -0,0 +1,35 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import rules from '../rules/index' +import { isEmptyValue } from '../util' +import { hasOwn } from '@opentiny/vue-renderless/common/type' + +export default function (rule, checkValue, cb, source, options) { + const errors = [] + const validate = rule.required || (!rule.required && hasOwn.call(source, rule.field)) + + if (validate) { + if (isEmptyValue(checkValue) && !rule.required) { + return cb() + } + + rules.required({ rule, checkValue, source, errors, options }) + + if (checkValue !== undefined) { + rules.type(rule, checkValue, source, errors, options) + rules.range(rule, checkValue, source, errors, options) + } + } + + cb(errors) +} diff --git a/packages/renderless/src/common/validate/validations/index.ts b/packages/renderless/src/common/validate/validations/index.ts new file mode 100644 index 000000000..432748433 --- /dev/null +++ b/packages/renderless/src/common/validate/validations/index.ts @@ -0,0 +1,55 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import date from './date' +import type from './type' +import float from './float' +import array from './array' +import string from './string' +import method from './method' +import number from './number' +import integer from './integer' +import pattern from './pattern' +import required from './required' +import enumValidator from './enum' + +export default { + date, + float, + array, + string, + method, + number, + integer, + pattern, + required, + hex: type, + url: type, + time: type, + email: type, + digits: type, + dateYM: type, + speczh: type, + dateYMD: type, + version: type, + fileSize: type, + regexp: method, + object: method, + dateTime: type, + specialch: type, + boolean: method, + acceptImg: type, + specialch2: type, + acceptFile: type, + longDateTime: type, + enum: enumValidator +} diff --git a/packages/renderless/src/common/validate/validations/integer.ts b/packages/renderless/src/common/validate/validations/integer.ts new file mode 100644 index 000000000..82bbea6d7 --- /dev/null +++ b/packages/renderless/src/common/validate/validations/integer.ts @@ -0,0 +1,35 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import rules from '../rules/index' +import { isEmptyValue } from '../util' +import { hasOwn } from '@opentiny/vue-renderless/common/type' + +export default function (rule, checkValue, callback, source, options) { + const errors = [] + const validate = rule.required || (!rule.required && hasOwn.call(source, rule.field)) + + if (validate) { + if (isEmptyValue(checkValue) && !rule.required) { + return callback() + } + + rules.required({ rule, checkValue, source, errors, options }) + + if (undefined !== checkValue) { + rules.type(rule, checkValue, source, errors, options) + rules.range(rule, checkValue, source, errors, options) + } + } + + callback(errors) +} diff --git a/packages/renderless/src/common/validate/validations/method.ts b/packages/renderless/src/common/validate/validations/method.ts new file mode 100644 index 000000000..a4171a9f1 --- /dev/null +++ b/packages/renderless/src/common/validate/validations/method.ts @@ -0,0 +1,34 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import rules from '../rules/index' +import { isEmptyValue } from '../util' +import { hasOwn } from '@opentiny/vue-renderless/common/type' + +export default function (rule, checkValue, callback, source, options) { + const validate = rule.required || (!rule.required && hasOwn.call(source, rule.field)) + const errors = [] + + if (validate) { + if (!rule.required && isEmptyValue(checkValue)) { + return callback() + } + + rules.required({ rule, checkValue, source, errors, options }) + + if (undefined !== checkValue) { + rules.type(rule, checkValue, source, errors, options) + } + } + + callback(errors) +} diff --git a/packages/renderless/src/common/validate/validations/number.ts b/packages/renderless/src/common/validate/validations/number.ts new file mode 100644 index 000000000..608e363d5 --- /dev/null +++ b/packages/renderless/src/common/validate/validations/number.ts @@ -0,0 +1,39 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import rules from '../rules/index' +import { isEmptyValue } from '../util' +import { hasOwn } from '@opentiny/vue-renderless/common/type' + +export default function (rule, checkValue, callback, source, options) { + const errors = [] + const validate = rule.required || (!rule.required && hasOwn.call(source, rule.field)) + + if (validate) { + if (checkValue === '') { + checkValue = undefined + } + + if (!rule.required && isEmptyValue(checkValue)) { + return callback() + } + + rules.required({ rule, checkValue, source, errors, options }) + + if (checkValue !== undefined) { + rules.type(rule, checkValue, source, errors, options) + rules.range(rule, checkValue, source, errors, options) + } + } + + callback(errors) +} diff --git a/packages/renderless/src/common/validate/validations/pattern.ts b/packages/renderless/src/common/validate/validations/pattern.ts new file mode 100644 index 000000000..90fc68502 --- /dev/null +++ b/packages/renderless/src/common/validate/validations/pattern.ts @@ -0,0 +1,34 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import rules from '../rules/index' +import { isEmptyValue } from '../util' +import { hasOwn } from '@opentiny/vue-renderless/common/type' + +export default function (rule, checkValue, callback, source, options) { + const errors = [] + const validate = rule.required || (!rule.required && hasOwn.call(source, rule.field)) + + if (validate) { + if (isEmptyValue(checkValue, 'string') && !rule.required) { + return callback() + } + + rules.required({ rule, checkValue, source, errors, options }) + + if (!isEmptyValue(checkValue, 'string')) { + rules.pattern(rule, checkValue, source, errors, options) + } + } + + callback(errors) +} diff --git a/packages/renderless/src/common/validate/validations/required.ts b/packages/renderless/src/common/validate/validations/required.ts new file mode 100644 index 000000000..0993d3464 --- /dev/null +++ b/packages/renderless/src/common/validate/validations/required.ts @@ -0,0 +1,21 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import rules from '../rules/index' + +export default function (rule, checkValue, callback, source, options) { + const errors = [] + const type = Array.isArray(checkValue) ? 'array' : typeof checkValue + + rules.required({ rule, checkValue, source, errors, options, type }) + callback(errors) +} diff --git a/packages/renderless/src/common/validate/validations/string.ts b/packages/renderless/src/common/validate/validations/string.ts new file mode 100644 index 000000000..977049f2b --- /dev/null +++ b/packages/renderless/src/common/validate/validations/string.ts @@ -0,0 +1,47 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import rules from '../rules/index' +import { isEmptyValue } from '../util' +import { hasOwn } from '@opentiny/vue-renderless/common/type' + +export default function (rule, checkValue, callback, source, options) { + const errors = [] + const validate = rule.required || (!rule.required && hasOwn.call(source, rule.field)) + + if (validate) { + if (isEmptyValue(checkValue, 'string') && !rule.required) { + return callback() + } + + rules.required({ + rule, + checkValue, + source, + errors, + options, + type: 'string' + }) + + if (!isEmptyValue(checkValue, 'string')) { + rules.type(rule, checkValue, source, errors, options) + rules.range(rule, checkValue, source, errors, options) + rules.pattern(rule, checkValue, source, errors, options) + + if (rule.whitespace === true) { + rules.whitespace(rule, checkValue, source, errors, options) + } + } + } + + callback(errors) +} diff --git a/packages/renderless/src/common/validate/validations/type.ts b/packages/renderless/src/common/validate/validations/type.ts new file mode 100644 index 000000000..159795b90 --- /dev/null +++ b/packages/renderless/src/common/validate/validations/type.ts @@ -0,0 +1,42 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import rules from '../rules/index' +import { isEmptyValue } from '../util' +import { hasOwn } from '@opentiny/vue-renderless/common/type' + +export default function (rule, checkValue, callback, source, options) { + const ruleType = rule.type + const errors = [] + const validate = rule.required || (!rule.required && hasOwn.call(source, rule.field)) + + if (validate) { + if (isEmptyValue(checkValue, ruleType) && !rule.required) { + return callback() + } + + rules.required({ + rule, + checkValue, + source, + errors, + options, + type: ruleType + }) + + if (!isEmptyValue(checkValue, ruleType)) { + rules.type(rule, checkValue, source, errors, options) + } + } + + callback(errors) +} diff --git a/packages/renderless/src/common/xss.ts b/packages/renderless/src/common/xss.ts new file mode 100644 index 000000000..f36c0b883 --- /dev/null +++ b/packages/renderless/src/common/xss.ts @@ -0,0 +1,359 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import * as xss$1 from 'xss' + +let getWindow = function () { + return typeof window === 'undefined' ? global : window +} +let isWeb = function () { + return !(typeof window === 'undefined') +} + +let _win$2 = getWindow() +let reverseUrlAlphabet = 'tcirzywvqlkjhgfbZQG_FLOWHSUBDNIMYREVKCAJxp57XP043891T62-modnaesu' +let urlAlphabet$1 = reverseUrlAlphabet.split('').reverse().join('') +let buffer +let bufferOffset +let allocBuffer = function (bytes) { + return new Uint8Array(new ArrayBuffer(bytes)) +} +let randomFill = function (buffer) { + return _win$2.crypto.getRandomValues(buffer) +} +let defFillPool = function (bytes) { + if (!buffer || buffer.length < bytes) { + buffer = allocBuffer(bytes * 128) + randomFill(buffer) + bufferOffset = 0 + } else if (bufferOffset + bytes > buffer.length) { + randomFill(buffer) + bufferOffset = 0 + } + bufferOffset += bytes +} +let nanoid$2 = function (size) { + if (size === void 0) { + size = 21 + } + defFillPool((size -= 0)) + let uniq = '' + for (let i = bufferOffset - size; i < bufferOffset; i++) { + uniq += urlAlphabet$1[buffer[i] & 63] + } + return uniq +} +let defRandomFunc = function (bytes) { + defFillPool((bytes -= 0)) + return buffer.subarray(bufferOffset - bytes, bufferOffset) +} +let defCustomRandom = function (alphabet, defaultSize, randomFunc) { + let mask = (2 << (31 - Math.clz32((alphabet.length - 1) | 1))) - 1 + let step = Math.ceil((1.6 * mask * defaultSize) / alphabet.length) + return function (size) { + if (size === void 0) { + size = defaultSize + } + let uniq = '' + let bytes = randomFunc(step) + let i = step + while (i--) { + uniq += alphabet[bytes[i] & mask] || '' + if (uniq.length === size) { + return uniq + } + } + } +} +let customAlphabet$1 = function (alphabet, defaultSize) { + if (defaultSize === void 0) { + defaultSize = 21 + } + return defCustomRandom(alphabet, defaultSize, defRandomFunc) +} + +function isIE(window) { + return isWeb() && (window.document.all || window.document.documentMode) && !window.crypto && window.msCrypto +} +function initForIE(window) { + if (isIE(window)) { + window.crypto = window.msCrypto + let getRandomValuesDef = window.crypto.getRandomValues + window.crypto.getRandomValues = function (array) { + let values = getRandomValuesDef.call(window.crypto, array) + let result = [] + for (let i = 0; i < array.length; i++) { + result[i] = values[i] + } + return result + } + } +} +let _win$1 = getWindow() +initForIE(_win$1) +let MAX_UINT32_PLUS_ONE = 4294967296 +let urlAlphabet = urlAlphabet$1 +let nanoid$1 = nanoid$2 +let customAlphabet = customAlphabet$1 +let random = function () { + if (!isWeb()) { + return 0 + } + return _win$1.crypto.getRandomValues(new _win$1.Uint32Array(1))[0] / MAX_UINT32_PLUS_ONE +} +let api = { + urlAlphabet, + nanoid: nanoid$1, + customAlphabet +} + +let _nanoid = Object.freeze({ + __proto__: null, + random, + api, + 'default': api +}) + +let xssOptions = { + enableAttrs: true, + enableHtml: true, + enableUrl: true, + html: { + whiteList: { + a: ['class', 'style', 'contenteditable', 'data-id', 'data-title', 'data-size', 'data-last-modified'], + address: ['class', 'style'], + area: ['class', 'style'], + article: ['class', 'style'], + aside: ['class', 'style'], + audio: ['class', 'style'], + b: ['class', 'style'], + bdi: ['class', 'style'], + bdo: ['class', 'style'], + big: ['class', 'style'], + blockquote: ['class', 'style'], + br: ['class', 'style'], + caption: ['class', 'style'], + center: ['class', 'style'], + cite: ['class', 'style'], + code: ['class', 'style'], + col: ['class', 'style'], + colgroup: ['class', 'style'], + dd: ['class', 'style'], + del: ['class', 'style'], + details: ['class', 'style'], + div: [ + 'class', + 'style', + 'spellcheck', + 'data-gramm', + 'spellcheck', + 'data-mode', + 'data-position', + 'data-row', + 'data-cell', + 'data-rowspan', + 'data-colspan', + 'data-cell-bg', + 'data-parent-bg' + ], + dl: ['class', 'style'], + dt: ['class', 'style'], + em: ['class', 'style'], + figcaption: ['class', 'style'], + figure: ['class', 'style'], + font: ['class', 'style'], + footer: ['class', 'style'], + h1: ['class', 'style'], + h2: ['class', 'style'], + h3: ['class', 'style'], + h4: ['class', 'style'], + h5: ['class', 'style'], + h6: ['class', 'style'], + header: ['class', 'style'], + hr: ['class', 'style'], + i: ['class', 'style', 'data-image-id', 'data-image'], + img: ['class', 'style', 'devui-editorx-image', 'style', 'data-image-id'], + input: ['class', 'style', 'data-formula', 'data-link', 'data-video'], + ins: ['class', 'style'], + li: ['class', 'style'], + mark: ['class', 'style'], + nav: ['class', 'style'], + ol: ['class', 'style'], + p: ['class', 'style'], + pre: ['class', 'style'], + s: ['class', 'style'], + section: ['class', 'style'], + small: ['class', 'style'], + span: ['class', 'style', 'contenteditable', 'color', 'style'], + sub: ['class', 'style'], + summary: ['class', 'style'], + sup: ['class', 'style'], + strong: ['class', 'style'], + strike: ['class', 'style'], + svg: ['class', 'style', 't', 'viewBox', 'version', 'xmlns', 'p-id', 'xmlns:xlink'], + path: ['d', 'p-id'], + table: ['class', 'style'], + tbody: ['class', 'style'], + td: ['class', 'style', 'data-row', 'data-cell', 'data-cell-bg', 'data-parent-bg'], + tfoot: ['class', 'style'], + th: ['class', 'style'], + thead: ['class', 'style'], + tr: ['class', 'style', 'data-row'], + tt: ['class', 'style'], + u: ['class', 'style'], + ul: ['class', 'style'], + video: ['class', 'style'] + } + } +} +let defaultWhiteList = (xss$1.getDefaultWhiteList && xss$1.getDefaultWhiteList()) || {} +xssOptions.html.whiteList = Object.assign(defaultWhiteList, xssOptions.html.whiteList) +let xssFilterHtml = new xss$1.FilterXSS(xssOptions.html) +let getXssOption = function () { + return xssOptions +} +let setXssOption = function (option) { + let _a + let whiteList + if ((_a = option === null || option === void 0 ? void 0 : option.html) === null || _a === void 0 ? void 0 : _a.whiteList) { + whiteList = Object.assign(xssOptions.html.whiteList, option.html.whiteList) + } + xssOptions = Object.assign(xssOptions, option) + if (whiteList) { + xssOptions.html.whiteList = whiteList + } + xssFilterHtml = new xss$1.FilterXSS(xssOptions.html) +} +let filterHtml = function (content) { + if (!xssOptions.enableHtml || typeof content !== 'string') { + return content + } + return xssFilterHtml.process(content) +} +let setFilterHtml = function (filter) { + filterHtml = filter +} +let filterAttrs = function (content) { + if (!xssOptions.enableAttrs || typeof content !== 'string') { + return content + } + return content.replace(/<.*?>/gi, '').replace(/on[a-z]+=/gi, '') +} +let setFilterAttrs = function (filter) { + filterAttrs = filter +} +let filterUrl = function (content) { + if (!xssOptions.enableUrl || typeof content !== 'string') { + return content + } + let filteredUrl = content.replace(/&#(\w+)(^\w|;)?/g, (match, dec) => String.fromCharCode(dec)).trim() + if (!filteredUrl) { + return '' + } + if (['.', '/'].includes(filteredUrl[0])) { + return filteredUrl + } + let urlParse = filteredUrl.match(/^([^:]+):/gm) + if (!urlParse) { + return filteredUrl + } + if (/^([^\w]*)(javascript|data|vbscript)/im.test(urlParse[0])) { + return '' + } + return filteredUrl +} +let setFilterUrl = function (filter) { + filterUrl = filter +} +let index = { + getXssOption, + setXssOption, + filterHtml, + setFilterHtml, + filterAttrs, + setFilterAttrs, + filterUrl, + setFilterUrl +} + +let _xss = Object.freeze({ + __proto__: null, + getXssOption, + setXssOption, + get filterHtml() { + return filterHtml + }, + setFilterHtml, + get filterAttrs() { + return filterAttrs + }, + setFilterAttrs, + get filterUrl() { + return filterUrl + }, + setFilterUrl, + 'default': index +}) + +let _win = getWindow() +let _cnsl = 'console' +let _console = _win[_cnsl] || {} +let isOpen = true +let _print = {} +let _log = function (csl, type) { + return function () { + let args = [] + for (let i = 0; i < arguments.length; i++) { + args[i] = arguments[i] + } + if (!isOpen) { + return + } + if (csl[type] && typeof csl[type] === 'function') { + csl[type].apply(csl, args) + } + } +} +let _initPrint = function (csl) { + Object.keys(csl).forEach((type) => { + _print[type] = _log(csl, type) + }) + return _print +} +let switchLogger = function (flag) { + isOpen = !!flag +} +let setLogger = function (type, fn) { + if (_print && Object.hasOwnProperty.call(_print, type)) { + _print[type] = fn + } +} +let logger = _initPrint(_console) + +let _logger = Object.freeze({ + __proto__: null, + switchLogger, + setLogger, + logger, + 'default': logger +}) + +let def = { + nanoid: _nanoid, + xss: _xss, + log: _logger +} +let nanoid = _nanoid +let xss = _xss +let log = _logger + +export { def as default, log, nanoid, xss } diff --git a/packages/renderless/src/company/index.ts b/packages/renderless/src/company/index.ts new file mode 100644 index 000000000..538edb2fd --- /dev/null +++ b/packages/renderless/src/company/index.ts @@ -0,0 +1,55 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const init = ({ state, props, service }) => () => { + const { textField, valueField } = service.fields + + if (state.source) { + state.options = state.source.map((item) => ({ + label: item[textField], + value: item[valueField] + })) + } else { + service.fetchCompany().then((data) => { + const list = data || [] + + state.source = props.max ? list.slice(0, props.max) : list + + state.options = state.source.map((item) => ({ + label: item[textField], + value: item[valueField] + })) + }) + } +} + +export const change = (emit) => (value) => { + emit('update:modelValue', value) + emit('change', value) +} + +export const initService = ({ props, service }) => { + const { setting = {}, fetchCompany } = service || {} + const { options = {} } = setting + + const defaultCompanySetting = { + textField: 'tx_corporation_cn', + valueField: 'tx_coa' + } + + const fetchCompanyNoop = () => Promise.resolve([]) + + return { + fetchCompany: props.fetchCompany || fetchCompany || fetchCompanyNoop, + fields: props.fields || options.Company || defaultCompanySetting + } +} diff --git a/packages/renderless/src/company/vue.ts b/packages/renderless/src/company/vue.ts new file mode 100644 index 000000000..2e745d1d1 --- /dev/null +++ b/packages/renderless/src/company/vue.ts @@ -0,0 +1,43 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { init, change, initService } from './index' + +export const api = ['state', 'change', 'clear', 'visibleChange'] + +export const renderless = (props, { watch, reactive }, { emit, service }) => { + const $service = initService({ props, service }) + + const state = reactive({ + options: [], + source: null, + selectedValue: props.modelValue + }) + + const api = { + state, + change: change(emit), + init: init({ state, props, service: $service }) + } + + watch( + () => props.modelValue, + (propsValue) => { + state.selectedValue = propsValue + }, + { immediate: true } + ) + + api.init() + + return api +} diff --git a/packages/renderless/src/container/index.ts b/packages/renderless/src/container/index.ts new file mode 100644 index 000000000..978da263a --- /dev/null +++ b/packages/renderless/src/container/index.ts @@ -0,0 +1,100 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { isNumber } from '@opentiny/vue-renderless/common/type' + +export const computedShowHeader = ({ constants, props }) => () => props.pattern !== constants.SIMPLE + +export const computedShowFooter = ({ constants, props }) => () => props.pattern === constants.LEGEND || props.pattern === constants.CLASSIC + +export const computedShowAside = ({ constants, props }) => () => props.pattern !== constants.CLASSIC + +const transferWidthOrHeight = (value) => (isNumber(value) ? value + 'px' : value) + +export const computedHeaderStyle = ({ constants, props }) => () => { + if (props.pattern === constants.FASHION) { + return { + height: transferWidthOrHeight(props.headerHeight), + left: transferWidthOrHeight(props.asideWidth) + } + } + + return { + height: transferWidthOrHeight(props.headerHeight) + } +} + +export const computedAsideStyle = ({ constants, props }) => () => { + if (props.pattern === constants.SIMPLE || props.pattern === constants.FASHION) { + return { + top: transferWidthOrHeight(0), + width: transferWidthOrHeight(props.asideWidth) + } + } + + return { + width: transferWidthOrHeight(props.asideWidth), + top: transferWidthOrHeight(props.headerHeight) + } +} + +export const computedMainStyle = ({ constants, props }) => () => { + if (props.pattern === constants.DEFAULT || props.pattern === constants.FASHION) { + return { + top: transferWidthOrHeight(props.headerHeight), + left: transferWidthOrHeight(props.asideWidth), + bottom: transferWidthOrHeight(0) + } + } + + if (props.pattern === constants.LEGEND) { + return { + top: transferWidthOrHeight(props.headerHeight), + left: transferWidthOrHeight(props.asideWidth), + bottom: transferWidthOrHeight(props.footerHeight) + } + } + + if (props.pattern === constants.SIMPLE) { + return { + top: transferWidthOrHeight(0), + left: transferWidthOrHeight(props.asideWidth), + bottom: transferWidthOrHeight(0) + } + } + + if (props.pattern === constants.CLASSIC) { + return { + top: transferWidthOrHeight(props.headerHeight), + left: transferWidthOrHeight(0), + bottom: transferWidthOrHeight(props.footerHeight) + } + } +} + +export const computedFooterStyle = ({ constants, props }) => () => { + if (props.pattern === constants.CLASSIC) { + return { + height: transferWidthOrHeight(props.footerHeight), + left: transferWidthOrHeight(0) + } + } else if (props.pattern === constants.LEGEND) { + return { + height: transferWidthOrHeight(props.footerHeight), + left: transferWidthOrHeight(props.asideWidth) + } + } + + return { + height: transferWidthOrHeight(props.footerHeight) + } +} diff --git a/packages/renderless/src/container/vue.ts b/packages/renderless/src/container/vue.ts new file mode 100644 index 000000000..d249779ce --- /dev/null +++ b/packages/renderless/src/container/vue.ts @@ -0,0 +1,49 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + computedShowHeader, + computedShowAside, + computedShowFooter, + computedHeaderStyle, + computedAsideStyle, + computedMainStyle, + computedFooterStyle +} from './index' + +export const api = ['state'] + +export const renderless = (props, { computed, reactive }, { constants }) => { + const api = {} + const state = reactive({ + showAside: computed(() => api.computedShowAside()), + showHeader: computed(() => api.computedShowHeader()), + showFooter: computed(() => api.computedShowFooter()), + mainStyle: computed(() => api.computedMainStyle()), + asideStyle: computed(() => api.computedAsideStyle()), + headerStyle: computed(() => api.computedHeaderStyle()), + footerStyle: computed(() => api.computedFooterStyle()) + }) + + Object.assign(api, { + state, + computedShowAside: computedShowAside({ constants, props }), + computedShowHeader: computedShowHeader({ constants, props }), + computedShowFooter: computedShowFooter({ constants, props }), + computedMainStyle: computedMainStyle({ constants, props }), + computedAsideStyle: computedAsideStyle({ constants, props }), + computedHeaderStyle: computedHeaderStyle({ constants, props }), + computedFooterStyle: computedFooterStyle({ constants, props }) + }) + + return api +} diff --git a/packages/renderless/src/country/index.ts b/packages/renderless/src/country/index.ts new file mode 100644 index 000000000..999b0c794 --- /dev/null +++ b/packages/renderless/src/country/index.ts @@ -0,0 +1,53 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const change = (emit) => (value) => { + emit('update:modelValue', value) + emit('change', value) +} + +export const init = ({ state, service }) => () => { + const { textField, valueField } = service.fields + + if (state.source) { + state.options = state.source.map((item) => ({ + label: item[textField], + value: item[valueField] + })) + } else { + service.fetchCountry().then((data) => { + state.source = data || [] + + state.options = state.source.map((item) => ({ + value: item[valueField], + label: item[textField] + })) + }) + } +} + +export const initService = ({ props, service }) => { + const { fetchCountry, setting = {} } = service || {} + const { options = {} } = setting + + const defaultCountrySetting = { + textField: 'territory_short_name', + valueField: 'territory_code' + } + + const fetchCountryNoop = () => Promise.resolve([]) + + return { + fetchCountry: props.fetchCountry || fetchCountry || fetchCountryNoop, + fields: props.fields || options.Country || defaultCountrySetting + } +} diff --git a/packages/renderless/src/country/vue.ts b/packages/renderless/src/country/vue.ts new file mode 100644 index 000000000..31f815442 --- /dev/null +++ b/packages/renderless/src/country/vue.ts @@ -0,0 +1,44 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { init, change, initService } from './index' + +export const api = ['state', 'change', 'emit'] + +export const renderless = (props, { watch, reactive }, { service, emit }) => { + const $service = initService({ props, service }) + + const state = reactive({ + source: null, + options: [], + selectedValue: props.modelValue + }) + + const api = { + state, + emit, + change: change(emit), + init: init({ state, service: $service }) + } + + watch( + () => props.modelValue, + (newValue) => { + state.selectedValue = newValue + }, + { immediate: true } + ) + + api.init() + + return api +} diff --git a/packages/renderless/src/credit-card-form/index.ts b/packages/renderless/src/credit-card-form/index.ts new file mode 100644 index 000000000..7d2b8e147 --- /dev/null +++ b/packages/renderless/src/credit-card-form/index.ts @@ -0,0 +1,140 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +export const generateMonthValue = (month) => (month < 10 ? `0${month}` : month) + +export const changeName = ({ emit, state }) => (event) => { + state.formData.cardName = event.target.value + emit('input-card-name', state.formData.cardName) +} + +export const changeNumber = ({ emit, state }) => (event) => { + state.formData.cardNumber = event.target.value + state.mainCardNumber = event.target.value + let value = state.formData.cardNumber.replace(/\D/g, '') + + if (/^3[47]\d{0,13}$/.test(value)) { + // american express, 15 digits + state.formData.cardNumber = value.replace(/^(\d{4})(?=\d)/, '$1 ').replace(/^(\d{4}) (\d{6})(?=\d)/, '$1 $2 ') + + state.cardNumberMaxLength = 17 + } else if (/^3(?:0[0-5]|[68]\d)\d{0,11}$/.test(value)) { + // diner's club, 14 digits + state.formData.cardNumber = value.replace(/^(\d{4})(?=\d)/, '$1 ').replace(/^(\d{4}) (\d{6})(?=\d)/, '$1 $2 ') + + state.cardNumberMaxLength = 16 + } else if (/^\d{0,16}$/.test(value)) { + // regular cc number, 16 digits + state.formData.cardNumber = value + .replace(/^(\d{4})(?=\d)/, '$1 ') + .replace(/^(\d{4}) (\d{4})(?=\d)/, '$1 $2 ') + .replace(/^(\d{4}) (\d{4}) (\d{4})(?=\d)/, '$1 $2 $3 ') + + state.cardNumberMaxLength = 19 + } + + emit('input-card-number', state.formData.cardNumber) +} + +export const changeMonth = ({ emit, state }) => () => { + emit('input-card-month', state.cardMonth) +} + +export const changeYear = ({ emit, state }) => () => { + emit('input-card-year', state.cardYear) +} + +export const changeCvv = ({ emit, state }) => (event) => { + state.formData.cardCvv = event.target.value + emit('input-card-cvv', state.formData.cardCvv) +} + +export const invaildCard = (props) => () => { + let number = props.formData.cardNumber + let sum = 0 + let isOdd = true + + if (!number) { + return true + } + + for (let i = number.length - 1; i >= 0; i--) { + let code = number.charAt(i) + + if (isOdd) { + sum += code + } else { + code = code * 2 + + if (code > 9) { + code = code.toString().split('').join('+') + } + + sum += code + } + + isOdd = !isOdd + } + + if (sum % 10 !== 0) { + return true + } + + return false +} + +export const handleSubmit = ({ api, emit, props, state }) => () => { + const invaildCard = api.invaildCard() + + emit('submit', { + invaildCard, + ...props.formData, + cardNumber: state.mainCardNumber.replace(/ /g, '') + }) +} + +export const blurCardNumber = ({ api, state }) => () => { + if (state.isCardNumberMasked) { + api.maskCardNumber() + } +} + +export const maskCardNumber = ({ props, state }) => () => { + state.mainCardNumber = props.formData.cardNumber + let arr = props.formData.cardNumber.split('') + + arr.forEach((element, index) => { + if (index > 4 && index < 14 && element.trim() !== '') { + arr[index] = '*' + } + }) + + props.formData.cardNumber = arr.join('') +} + +export const unMaskCardNumber = ({ props, state }) => () => { + props.formData.cardNumber = state.mainCardNumber +} + +export const focusCardNumber = (api) => () => { + api.unMaskCardNumber() +} + +export const toggleMask = ({ api, state }) => () => { + state.isCardNumberMasked = !state.isCardNumberMasked + + if (state.isCardNumberMasked) { + api.maskCardNumber() + } else { + api.unMaskCardNumber() + } +} diff --git a/packages/renderless/src/credit-card-form/vue.ts b/packages/renderless/src/credit-card-form/vue.ts new file mode 100644 index 000000000..913905b8b --- /dev/null +++ b/packages/renderless/src/credit-card-form/vue.ts @@ -0,0 +1,141 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + generateMonthValue, + changeName, + changeNumber, + changeMonth, + changeYear, + changeCvv, + invaildCard, + blurCardNumber, + maskCardNumber, + unMaskCardNumber, + focusCardNumber, + toggleMask, + handleSubmit +} from './index' + +export const api = [ + 'state', + 'generateMonthValue', + 'changeName', + 'changeNumber', + 'changeMonth', + 'changeYear', + 'changeCvv', + 'invaildCard', + 'blurCardNumber', + 'maskCardNumber', + 'unMaskCardNumber', + 'focusCardNumber', + 'toggleMask', + 'handleSubmit' +] + +const initState = ({ reactive, props, computed }) => { + const state = reactive({ + fields: { + cardCvv: 'v-card-cvv', + cardName: 'v-card-name', + cardYear: 'v-card-year', + cardMonth: 'v-card-month', + cardNumber: 'v-card-number' + }, + minCardYear: new Date().getFullYear(), + isCardNumberMasked: true, + mainCardNumber: props.formData.cardNumber, + cardNumberMaxLength: 19, + cardMonth: props.formData.cardMonth, + cardYear: props.formData.cardYear, + formData: props.formData, + minCardMonth: computed(() => (props.formData.cardYear === state.minCardYear ? new Date().getMonth() + 1 : 1)) + }) + + return state +} + +const initApi = ({ api, state, emit, props }) => { + Object.assign(api, { + state, + generateMonthValue, + changeCvv: changeCvv({ emit, state }), + changeYear: changeYear({ emit, state }), + changeName: changeName({ emit, state }), + invaildCard: invaildCard(props), + changeMonth: changeMonth({ emit, state }), + changeNumber: changeNumber({ emit, state }), + maskCardNumber: maskCardNumber({ props, state }), + unMaskCardNumber: unMaskCardNumber({ props, state }), + toggleMask: toggleMask({ api, state }), + handleSubmit: handleSubmit({ api, emit, props, state }), + blurCardNumber: blurCardNumber({ api, state }), + focusCardNumber: focusCardNumber(api) + }) +} + +const initWatch = ({ watch, state, props, emit }) => { + watch( + () => state.cardYear, + (value) => { + state.formData.cardYear = value + emit('update:formData', state.formData) + } + ) + + watch( + () => state.formData.cardNumber, + () => emit('update:formData', state.formData) + ) + + watch( + () => state.formData.cardName, + () => emit('update:formData', state.formData) + ) + + watch( + () => state.formData.cardCvv, + () => emit('update:formData', state.formData) + ) + + watch( + () => state.cardMonth, + (value) => { + state.formData.cardMonth = value + emit('update:formData', state.formData) + } + ) + + watch( + () => props.formData.cardYear, + () => { + if (props.formData.cardMonth < state.minCardMonth) { + state.cardMonth = '' + } + }, + { immediate: true } + ) +} + +export const renderless = (props, { computed, onMounted, reactive, watch }, { emit }) => { + const api = {} + const state = initState({ reactive, props, computed }) + + initApi({ api, state, emit, props }) + + onMounted(api.maskCardNumber) + + initWatch({ watch, state, props, emit }) + + return api +} diff --git a/packages/renderless/src/credit-card/index.ts b/packages/renderless/src/credit-card/index.ts new file mode 100644 index 000000000..1ed8383d0 --- /dev/null +++ b/packages/renderless/src/credit-card/index.ts @@ -0,0 +1,120 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const cardType = (number) => { + if (number.startsWith('4')) { + return 'visa' + } + + if (/^(34|37)/.test(number)) { + return 'amex' + } + + if (/^5[1-5]/.test(number)) { + return 'mastercard' + } + + if (number.startsWith('6011')) { + return 'discover' + } + + if (number.startsWith('62')) { + return 'unionpay' + } + + if (number.startsWith('9792')) { + return 'troy' + } + + if (/^3(?:0([0-5]|9)|[689]\\d?)\\d{0,11}/.test(number)) { + return 'dinersclub' + } + + if (/^35(2[89]|[3-8])/.test(number)) { + return 'jcb' + } + + return '' +} + +export const changeFocus = ({ refs, state }) => () => { + let target = refs[state.currentFocus] + + if (target) { + const transform = `translateX(${target.offsetLeft}px) translateY(${target.offsetTop}px)` + + state.focusElementStyle = { + transform, + width: `${target.offsetWidth}px`, + height: `${target.offsetHeight}px` + } + } else { + state.focusElementStyle = null + } +} + +export const getIsNumberMasked = (props) => (index, n) => + index > 4 && index < 14 && props.labels.cardNumber.length > index && n.trim() !== '' && props.isCardNumberMasked + +export const changePlaceholder = ({ api, nextTick, state }) => () => { + if (state.cardType === 'amex') { + state.currentPlaceholder = state.amexCardPlaceholder + } else if (state.cardType === 'dinersclub') { + state.currentPlaceholder = state.dinersCardPlaceholder + } else { + state.currentPlaceholder = state.defaultCardPlaceholder + } + + nextTick(() => { + api.changeFocus() + }) +} + +export const focus = ({ props, state }) => (event) => { + const element = event.target + + state.isFocused = true + + if (element.id === props.fields.cardYear || element.id === props.fields.cardMonth) { + state.currentFocus = 'cardDate' + } else { + state.currentFocus = element.id + } + + state.isCardFlipped = element.id === props.fields.cardCvv +} + +export const blur = ({ props, state }) => (event) => { + const element = event.target + + state.isCardFlipped = !element.id === props.fields.cardCvv + + setTimeout(() => { + if (!state.isFocused) { + state.currentFocus = null + } + }, 300) + + state.isFocused = false +} + +export const toggleEvent = ({ api, fieldsEls, type }) => { + if (fieldsEls) { + for (let i = 0; i < fieldsEls.length; i++) { + const element = fieldsEls[i] + const eventType = `${type}EventListener` + + element[eventType]('focus', api.focus) + element[eventType]('blur', api.blur) + } + } +} diff --git a/packages/renderless/src/credit-card/vue.ts b/packages/renderless/src/credit-card/vue.ts new file mode 100644 index 000000000..30105fdf6 --- /dev/null +++ b/packages/renderless/src/credit-card/vue.ts @@ -0,0 +1,84 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { cardType, changeFocus, getIsNumberMasked, changePlaceholder, focus, blur, toggleEvent } from './index' + +export const api = ['state', 'changeFocus', 'getIsNumberMasked', 'changePlaceholder'] + +const initState = ({ reactive, props, computed }) => { + const state = reactive({ + isFocused: false, + currentFocus: null, + isCardFlipped: false, + focusElementStyle: null, + currentPlaceholder: '', + amexCardPlaceholder: '#### ###### #####', + dinersCardPlaceholder: '#### ###### ####', + defaultCardPlaceholder: '#### #### #### ####', + cardType: computed(() => cardType(props.labels.cardNumber)) + }) + + return state +} + +const initApi = ({ api, state, props, refs, nextTick }) => { + Object.assign(api, { + state, + blur: blur({ props, state }), + focus: focus({ props, state }), + changeFocus: changeFocus({ refs, state }), + getIsNumberMasked: getIsNumberMasked(props), + changePlaceholder: changePlaceholder({ api, nextTick, state }) + }) +} + +const initWatch = ({ watch, state, api }) => { + watch( + () => state.currentFocus, + () => { + if (state.currentFocus) { + api.changeFocus() + } else { + state.focusElementStyle = null + } + }, + { immediate: true } + ) + + watch(() => state.cardType, api.changePlaceholder, { immediate: true }) +} + +export const renderless = (props, { computed, onMounted, reactive, watch, onBeforeUnmount }, { refs, nextTick, parent }) => { + const api = {} + const state = initState({ reactive, props, computed }) + + initApi({ api, state, props, refs, nextTick }) + + initWatch({ watch, state, api }) + + let fieldsEls + + onMounted(() => { + api.changePlaceholder() + + fieldsEls = parent.$parent.$el.querySelectorAll('[data-credit-card-field]') + + toggleEvent({ api, fieldsEls, type: 'add' }) + }) + + onBeforeUnmount(() => { + toggleEvent({ api, fieldsEls, type: 'remove' }) + fieldsEls = null + }) + + return api +} diff --git a/packages/renderless/src/crop/index.ts b/packages/renderless/src/crop/index.ts new file mode 100644 index 000000000..390ae0d17 --- /dev/null +++ b/packages/renderless/src/crop/index.ts @@ -0,0 +1,203 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' +import { toFileSize } from '@opentiny/vue-renderless/common/string' + +export const computedCropImages = ({ constants, t }) => () => t(constants.CROP_IMAGE) + +export const watchImageSrc = (state) => (value) => (state.src = value) + +export const watchAlt = (state) => (value) => (state.alt = value || 'image') + +export const watchVisible = ({ api, state }) => (value) => { + if (value) { + on(document.body, 'keydown', api.shortcutKeys) + } else { + off(document.body, 'keydown', api.shortcutKeys) + } + + state.cropvisible = value +} + +export const shortcutKeys = (api) => (e) => { + if (e.keyCode == 187 && e.ctrlKey) { + e.preventDefault() + api.zoom(0.1) + } + + if (e.keyCode == 189 && e.ctrlKey) { + e.preventDefault() + api.zoom(-0.1) + } + + if (e.keyCode == 38 && e.ctrlKey) { + e.preventDefault() + api.move(0, 1) + } + + if (e.keyCode == 40 && e.ctrlKey) { + e.preventDefault() + api.move(0, -1) + } + + if (e.keyCode == 37 && e.ctrlKey) { + e.preventDefault() + api.move(1, 0) + } + + if (e.keyCode == 39 && e.ctrlKey) { + e.preventDefault() + api.move(-1, 0) + } +} + +export const closeCrop = ({ emit, state }) => () => { + emit('update:cropvisible', false) + emit('update:visible', false) + + state.cropImg = '' +} + +export const createCrop = ({ emit, props, refs, state }) => () => { + const Cropper = props.plugin + const cropImage = refs.cropImage + + state.cropper = new Cropper(cropImage, { + modal: props.modal, + guides: props.guides, + center: props.center, + movable: props.movable, + restore: props.restore, + viewMode: props.viewMode, + zoomable: props.zoomable, + autoCrop: props.autoCrop, + dragMode: props.dragMode, + rotatable: props.rotatable, + responsive: props.responsive, + background: props.background, + aspectRatio: props.aspectRatio, + zoomOnWheel: props.zoomOnWheel, + autoCropArea: props.autoCropArea, + wheelZoomRatio: props.wheelZoomRatio, + minCropBoxWidth: props.minCropBoxWidth, + minCropBoxHeight: props.minCropBoxHeight, + minContainerWidth: props.minContainerWidth, + minContainerHeight: props.minContainerHeight, + preview: document.querySelectorAll('.croppreview'), + ready() { + emit('ready') + }, + cropstart(e) { + emit('cropstart', e) + }, + cropmove(e) { + emit('cropmove', e) + }, + cropend(e) { + emit('cropend', e) + }, + crop(e) { + emit('crop', e) + } + }) +} + +export const closeCropArea = (api) => () => api.clear() + +export const clear = (state) => () => state.cropper.clear() + +export const cropImage = ({ api, emit, props, state }) => () => { + state.cropImg = api.getCroppedCanvas().toDataURL('image/jpeg', props.quality) + + if (props.cropType.toLowerCase() === 'base64') { + emit('cropdata', api.getCroppedCanvas().toDataURL('image/jpeg', props.quality)) + } else if (props.cropType.toLowerCase() === 'blob') { + let canvas = api.getCroppedCanvas() + + canvas.toBlob( + (blobObj) => { + emit('cropdata', blobObj) + }, + 'image/jpeg', + props.quality + ) + } +} + +export const getCroppedCanvas = (state) => () => state.cropper.getCroppedCanvas() + +export const getCropBoxData = (state) => () => state.cropper.getCropBoxData() + +export const getData = (state) => (rounded) => state.cropper.getData(!!rounded) + +export const move = (state) => (offsetX, offsetY) => state.cropper.move(offsetX, offsetY) + +export const reset = (state) => () => state.cropper.reset() + +export const setCropBoxData = (state) => ({ left, top, width, height }) => state.cropper.setCropBoxData({ left, top, width, height }) + +export const setData = (state) => (data) => data !== null && typeof data === 'object' && state.cropper.setData(data) + +export const disable = (state) => () => state.cropper.disable() + +export const enable = (state) => () => state.cropper.enable() + +export const destroy = (state) => () => state.cropper.destroy() + +export const scale = (state) => (scaleX, scaleY) => state.cropper.scale(scaleX, scaleY) + +export const scaleX = (state) => (x) => state.cropper.scaleX(x) + +export const scaleY = (state) => (x) => state.cropper.scaleY(x) + +export const getContainerData = (state) => () => state.cropper.getContainerData() + +export const getImageData = (state) => () => state.cropper.getImageData() + +export const getCanvasData = (state) => () => state.cropper.getCanvasData() + +export const setAspectRatio = (state) => (s) => state.cropper.setAspectRatio(s) + +export const setDragMode = (state) => (s) => state.cropper.setDragMode(s) + +export const setCanvasData = (state) => ({ width, height, left, top }) => state.cropper.setCanvasData({ width, height, left, top }) + +export const rotate = (state) => (deg) => state.cropper.rotate(deg) + +export const setImage = ({ api, state, props }) => (e) => { + const file = e.target.files[0] + let unit = props.maxSize.match(/[a-zA-Z]+/gi) + + unit = unit && (unit[0].length > 1 ? unit[0] : unit[0] + 'B') + + const size = toFileSize(Number(props.maxSize.match(/[0-9]+/gi)[0]), 'B', unit || 'B') + + if (file === undefined || !file.type.includes('image/') || Number(file.size) > Number(size.split('B')[0])) { + return + } + + const reader = new FileReader() + + reader.onload = (event) => { + state.src = event.target.result + api.replace(event.target.result) + } + + reader.readAsDataURL(file) +} + +export const replace = (state) => (url) => state.cropper.replace(url) + +export const showFileChooser = (refs) => () => refs.cropInput.click() + +export const zoom = (state) => (percent) => state.cropper.zoom(percent) diff --git a/packages/renderless/src/crop/vue.ts b/packages/renderless/src/crop/vue.ts new file mode 100644 index 000000000..6933d239d --- /dev/null +++ b/packages/renderless/src/crop/vue.ts @@ -0,0 +1,202 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + watchImageSrc, + shortcutKeys, + watchVisible, + clear, + replace, + computedCropImages, + watchAlt, + getCroppedCanvas, + setCanvasData, + setDragMode, + setAspectRatio, + getImageData, + getCanvasData, + scale, + scaleY, + getContainerData, + scaleX, + destroy, + disable, + enable, + closeCropArea, + closeCrop, + createCrop, + setImage, + cropImage, + getCropBoxData, + getData, + move, + reset, + rotate, + setCropBoxData, + setData, + showFileChooser, + zoom +} from './index' + +export const api = [ + 'state', + 'clear', + 'replace', + 'getCroppedCanvas', + 'setCanvasData', + 'setDragMode', + 'setAspectRatio', + 'getCanvasData', + 'getImageData', + 'getContainerData', + 'scaleY', + 'scale', + 'scaleX', + 'destroy', + 'enable', + 'closeCropArea', + 'disable', + 'closeCrop', + 'getCropBoxData', + 'getData', + 'move', + 'reset', + 'rotate', + 'setCropBoxData', + 'setData', + 'showFileChooser', + 'setImage', + 'cropImage', + 'zoom' +] + +const initRenderIcon = (api) => { + const renderIcon = [ + { + method: () => api.showFileChooser(), + icon: 'IconNew' + }, + { + method: () => api.zoom(0.1), + icon: 'IconZoomIn' + }, + { + method: () => api.zoom(-0.1), + icon: 'IconZoomOut' + }, + { + method: () => api.rotate(-45), + icon: 'IconRepeat' + }, + { + method: () => api.rotate(45), + icon: 'IconRefres' + }, + { + method: () => api.closeCropArea(), + icon: 'IconCrop' + }, + { + method: () => api.reset(), + icon: 'IconConmentRefresh' + }, + { + method: () => api.cropImage(), + icon: 'IconYes' + }, + { + method: () => api.closeCrop(), + icon: 'IconClose' + } + ] + + return renderIcon +} + +const initState = ({ reactive, props, computed, api }) => { + const state = reactive({ + src: props.src, + cropImg: '', + cropper: '', + alt: props.alt, + data: null, + cropvisible: props.cropvisible, + + renderIcon: initRenderIcon(api), + + previewShow: props.previewShow, + cropImages: computed(() => api.computedCropImages()) + }) + + return state +} + +const initApi = ({ api, state, emit, refs, props, constants, t }) => { + Object.assign(api, { + state, + zoom: zoom(state), + move: move(state), + clear: clear(state), + reset: reset(state), + scale: scale(state), + rotate: rotate(state), + enable: enable(state), + scaleX: scaleX(state), + scaleY: scaleY(state), + replace: replace(state), + setData: setData(state), + getData: getData(state), + disable: disable(state), + destroy: destroy(state), + watchAlt: watchAlt(state), + setDragMode: setDragMode(state), + getImageData: getImageData(state), + watchImageSrc: watchImageSrc(state), + setCanvasData: setCanvasData(state), + getCanvasData: getCanvasData(state), + closeCrop: closeCrop({ emit, state }), + setCropBoxData: setCropBoxData(state), + setAspectRatio: setAspectRatio(state), + getCropBoxData: getCropBoxData(state), + showFileChooser: showFileChooser(refs), + getCroppedCanvas: getCroppedCanvas(state), + getContainerData: getContainerData(state), + createCrop: createCrop({ emit, props, refs, state }), + computedCropImages: computedCropImages({ constants, t }), + shortcutKeys: shortcutKeys(api), + closeCropArea: closeCropArea(api), + setImage: setImage({ api, state, props }), + cropImage: cropImage({ api, emit, props, state }), + watchVisible: watchVisible({ api, state }) + }) +} + +const initWatch = ({ watch, props, api }) => { + watch(() => props.cropvisible, api.watchVisible) + + watch(() => props.src, api.watchImageSrc, { immediate: true }) + + watch(() => props.alt, api.watchAlt, { immediate: true }) +} + +export const renderless = (props, { computed, onMounted, reactive, watch }, { t, emit, refs, constants }) => { + const api = {} + const state = initState({ reactive, props, computed, api }) + + initApi({ api, state, emit, refs, props, constants, t }) + + onMounted(api.createCrop) + + initWatch({ watch, props, api }) + + return api +} diff --git a/packages/renderless/src/currency/index.ts b/packages/renderless/src/currency/index.ts new file mode 100644 index 000000000..023786ebe --- /dev/null +++ b/packages/renderless/src/currency/index.ts @@ -0,0 +1,80 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { isUndefined, isNull } from '@opentiny/vue-renderless/grid/static' +import { log } from '@opentiny/vue-renderless/common' + +export const init = ({ state, service, api }) => () => { + const { textField, valueField } = service.fields + + service.fetchCurrency().then((data) => { + api.fixServiceData(data).then((result) => { + state.options = result.map((item) => ({ + label: item[textField], + value: item[valueField] + })) + }) + }) +} + +export const change = (emit) => (value) => { + emit('update:modelValue', value) + emit('change', value) +} + +export const initService = ({ props, service }) => { + const defaultCurrencySetting = { + textField: 'currency_code', + valueField: 'currency_code' + } + + const { setting = {}, fetchCurrency } = service || {} + const { options = {} } = setting + + const fetchCurrencyNoop = () => Promise.resolve([]) + + return { + fetchCurrency: props.fetchCurrency || fetchCurrency || fetchCurrencyNoop, + fields: props.fields || options.Currency || defaultCurrencySetting + } +} + +export const fixServiceData = ({ props, service }) => (data) => { + const { textField, valueField } = service.fields + + return new Promise((resolve) => { + data = data || [] + data = Array.isArray(data) ? data : [] + + const result = [] + + data.forEach((option) => { + option = option || {} + + const value = option[valueField] + const text = option[textField] + + if (isUndefined(value) || isNull(value)) { + if (text) { + option[valueField] = text + } else { + log('data error. set it to the default value.', 'warn') + option[textField] = option[valueField] = props.currency + } + } + + result.push(option) + }) + + resolve(result) + }) +} diff --git a/packages/renderless/src/currency/vue.ts b/packages/renderless/src/currency/vue.ts new file mode 100644 index 000000000..f0006e19a --- /dev/null +++ b/packages/renderless/src/currency/vue.ts @@ -0,0 +1,44 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { init, fixServiceData, change, initService } from './index' + +export const api = ['state', 'change'] + +export const renderless = (props, { watch, reactive }, { service, emit }) => { + const api = {} + const $service = initService({ props, service }) + + const state = reactive({ + options: [], + selectedValue: props.modelValue + }) + + Object.assign(api, { + state, + change: change(emit), + fixServiceData: fixServiceData({ props, service: $service }), + init: init({ state, service: $service, api }) + }) + + watch( + () => props.modelValue, + (param) => { + state.selectedValue = param + }, + { immediate: true } + ) + + api.init() + + return api +} diff --git a/packages/renderless/src/date-panel/index.ts b/packages/renderless/src/date-panel/index.ts new file mode 100644 index 000000000..4580958f1 --- /dev/null +++ b/packages/renderless/src/date-panel/index.ts @@ -0,0 +1,530 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getWeekData } from '@opentiny/vue-renderless/picker' +import debounce from '@opentiny/vue-renderless/common/deps/debounce' +import { + isDate, + parseDate, + modifyDate, + modifyTime, + clearTime, + prevYear, + nextYear, + prevMonth, + nextMonth, + timeWithinRange, + clearMilliseconds, + modifyWithTimeString, + changeYearMonthAndClampDate, + formatDate, + extractTimeFormat +} from '@opentiny/vue-renderless/common/deps/date-util' +import { DATEPICKER } from '@opentiny/vue-renderless/common' +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' +import { getDateWithNewTimezone, getLocalTimezone } from '@opentiny/vue-renderless/common/date' +import { fillChar } from '@opentiny/vue-renderless/common/string' + +export const getYearLabel = ({ state, t }) => () => { + const yearTranslation = t(DATEPICKER.YearI18n) + + if (state.currentView === DATEPICKER.Year) { + const startYear = Math.floor(state.year / 10) * 10 + + if (yearTranslation) { + return startYear + ' ' + yearTranslation + ' - ' + (startYear + 9) + ' ' + yearTranslation + } + + return startYear + ' - ' + (startYear + 9) + } + + return state.year + ' ' + yearTranslation +} + +export const watchValue = ({ api, state }) => (value) => { + if (state.selectionMode === DATEPICKER.Dates && state.value) { + return + } + + if (isDate(value)) { + state.date = state.selectionMode === 'week' ? getWeekData(value) : new Date(value) + } else { + state.date = api.getDefaultValue() + } +} + +export const watchDefaultValue = ({ state }) => (value) => { + if (!isDate(state.value)) { + state.date = value ? new Date(value) : new Date() + } +} + +export const watchTimePickerVisible = ({ nextTick, vm }) => (value) => { + if (value) { + nextTick(() => { + vm.$refs.timepicker.adjustSpinners() + }) + } +} + +export const watchSelectionMode = ({ state }) => (value) => { + if (value === DATEPICKER.Month) { + /* istanbul ignore next */ + if (state.currentView !== DATEPICKER.Year || state.currentView !== DATEPICKER.Month) { + state.currentView = DATEPICKER.Month + } + } else if (value === DATEPICKER.Dates) { + state.currentView = DATEPICKER.Date + } else if (value === DATEPICKER.Year) { + state.currentView = DATEPICKER.Year + } +} + +export const proxyTimePickerDataProperties = ({ refs, state, watch }) => () => { + const format = (timeFormat) => { + if (refs.timepicker) { + refs.timepicker.state.format = timeFormat + } + } + + const value = (value) => { + if (refs.timepicker) { + refs.timepicker.state.value = null + + if (value) { + refs.timepicker.state.value = value + } + } + } + + const date = (date) => { + if (refs.timepicker) { + refs.timepicker.state.date = date + } + } + + const selectableRange = (selectableRange) => { + if (refs.timepicker) { + refs.timepicker.state.selectableRange = selectableRange + } + } + + watch(() => state.value, value) + watch(() => state.date, date, { deep: true }) + watch(() => state.selectableRange, selectableRange, { deep: true }) + + format(state.timeFormat) + value(state.value) + date(state.date) + selectableRange(state.selectableRange) +} + +export const handleClear = ({ api, state, emit }) => () => { + state.date = api.getDefaultValue() + emit('pick', null) +} + +export const cusEmit = ({ state, emit }) => (value, ...args) => { + if (!value) { + emit('pick', value, ...args) + } else if (Array.isArray(value)) { + const dates = value.map((date) => (state.showTime ? clearMilliseconds(date) : clearTime(date))) + + emit('pick', dates, ...args) + } else { + emit('pick', state.showTime ? clearMilliseconds(value) : clearTime(value), ...args) + } + + state.userInputDate = null + state.userInputTime = null +} + +export const showMonthPicker = ({ state }) => () => (state.currentView = DATEPICKER.Month) + +export const showYearPicker = ({ state }) => () => (state.currentView = DATEPICKER.Year) + +export const cusPrevMonth = ({ state }) => () => (state.date = prevMonth(state.date)) + +export const cusNextMonth = ({ state }) => () => (state.date = nextMonth(state.date)) + +export const cusPrevYear = ({ state }) => () => { + if (state.currentView === DATEPICKER.Year) { + state.date = prevYear(state.date, 10) + } else { + state.date = prevYear(state.date) + } +} + +export const cusNextYear = ({ state }) => () => { + if (state.currentView === DATEPICKER.Year) { + state.date = nextYear(state.date, 10) + } else { + state.date = nextYear(state.date) + } +} + +export const handleShortcutClick = (api) => (shortcut) => { + if (shortcut.onClick) { + const picker = { + $emit: (type, start, end) => { + api.doPick(start, end) + } + } + + shortcut.onClick(picker) + } +} + +export const doPick = (emit) => (date) => { + emit('pick', date, false) +} + +export const handleTimePick = ({ api, state, t }) => (value, visible, first) => { + if (isDate(value)) { + const newDate = state.value + ? modifyTime(state.value, value.getHours(), value.getMinutes(), value.getSeconds()) + : modifyWithTimeString(api.getDefaultValue(), state.defaultTime, t) + + state.date = newDate + api.cusEmit(state.date, true) + } else { + api.cusEmit(value, true) + } + + if (!first) { + state.timePickerVisible = visible + } +} + +export const handleTimePickClose = (state) => () => { + state.timePickerVisible = false +} + +export const handleMonthPick = ({ api, state }) => (month) => { + if (state.selectionMode === DATEPICKER.Month) { + state.date = modifyDate(state.date, state.year, month, 1) + api.cusEmit(state.date) + } else { + state.date = changeYearMonthAndClampDate(state.date, state.year, month) + state.currentView = DATEPICKER.Date + } +} + +export const handleDatePick = ({ api, state, t }) => (value) => { + if (state.selectionMode === DATEPICKER.Day) { + let newDate = state.value + ? modifyDate(state.value, value.getFullYear(), value.getMonth(), value.getDate()) + : modifyWithTimeString(value, state.defaultTime, t) + + if (!api.checkDateWithinRange(newDate)) { + newDate = modifyDate(state.selectableRange[0][0], value.getFullYear(), value.getMonth(), value.getDate()) + } + + state.date = newDate + + api.cusEmit(state.date, state.showTime) + } else if (state.selectionMode === DATEPICKER.Week) { + api.cusEmit(value.date) + } else if (state.selectionMode === DATEPICKER.Dates) { + api.cusEmit(value, true) + } +} + +export const handleYearPick = ({ api, state }) => (year) => { + if (state.selectionMode === DATEPICKER.Year) { + state.date = modifyDate(state.date, year, 0, 1) + api.cusEmit(state.date) + } else { + state.date = changeYearMonthAndClampDate(state.date, year, state.month) + state.currentView = DATEPICKER.Month + } +} + +const dateToLocaleStringForIE = (timezone, value) => { + const localTimezone = getLocalTimezone() + const offsetTimezone = timezone - localTimezone + const offsetTime = new Date(value).getTime() + offsetTimezone * 3600000 + + return new Date(offsetTime) +} + +export const changeToNow = ({ api, state }) => () => { + const now = new Date() + const timezone = state.timezone + const isServiceTimezone = timezone.isServiceTimezone + let disabledDate = !state.disabledDate + + if (isServiceTimezone) { + const date = getDateWithNewTimezone(now, getLocalTimezone(), timezone.to) + + state.date = date + disabledDate = disabledDate || !state.disabledDate(date) + } else { + disabledDate = disabledDate || !state.disabledDate(now) + } + + if (disabledDate && api.checkDateWithinRange(now)) { + if (!isServiceTimezone) { + if (state.showTimezone && state.selectedTz) { + state.date = dateToLocaleStringForIE(state.selectedTz.offset, state.date) + } else { + state.date = now + } + } + + api.cusEmit(state.date) + state.emitDbTime(now) + } +} + +export const confirm = ({ api, state, t }) => () => { + if (state.selectionMode === DATEPICKER.Dates) { + api.cusEmit(state.value) + } else { + let value = state.value ? state.value : modifyWithTimeString(api.getDefaultValue(), state.defaultTime, t) + const timezone = state.timezone + + // state.value 为空,保持与 now 的逻辑一样 + if (!state.value && timezone.isServiceTimezone) { + value = state.date = getDateWithNewTimezone(value, getLocalTimezone(), timezone.to) + } else { + state.date = new Date(value) + } + + api.cusEmit(value) + } +} + +export const resetView = ({ state }) => () => { + if (state.selectionMode === DATEPICKER.Month) { + state.currentView = DATEPICKER.Month + } else if (state.selectionMode === DATEPICKER.Year) { + state.currentView = DATEPICKER.Year + } else { + state.currentView = DATEPICKER.Date + } +} + +export const handleEnter = (api) => () => { + on(document.body, 'keydown', api.handleKeydown) +} + +export const handleLeave = ({ api, emit }) => () => { + emit('dodestroy') + off(document.body, 'keydown', api.handleKeydown) +} + +export const handleKeydown = ({ api, state }) => (event) => { + const keyCode = event.keyCode + + if (state.visible && !state.timePickerVisible) { + if (DATEPICKER.List.includes(keyCode)) { + api.handleKeyControl(keyCode) + event.stopPropagation() + event.preventDefault() + } + + if (keyCode === 13 && state.userInputDate === null && state.userInputTime === null) { + api.cusEmit(state.date, false) + } + } +} + +export const handleKeyControl = ({ state, emit }) => (keyCode) => { + const mapping = { + year: { + ...DATEPICKER.YearObj, + offset: (date, step) => date.setFullYear(date.getFullYear() + step) + }, + month: { + ...DATEPICKER.YearObj, + offset: (date, step) => date.setMonth(date.getMonth() + step) + }, + week: { + ...DATEPICKER.WeekObj, + offset: (date, step) => date.setDate(date.getDate() + step * 7) + }, + day: { + ...DATEPICKER.DayObj, + offset: (date, step) => date.setDate(date.getDate() + step) + } + } + + const mode = state.selectionMode + const year = 3.1536e10 + const now = state.date.getTime() + const newDate = new Date(state.date.getTime()) + + while (Math.abs(now - newDate.getTime()) <= year) { + const map = mapping[mode] + map.offset(newDate, map[keyCode]) + + if (!(typeof state.disabledDate === 'function' && state.disabledDate(newDate))) { + state.date = newDate + emit('pick', newDate, true) + break + } + } +} + +export const handleVisibleTimeChange = ({ api, refs, state, t }) => (value) => { + const time = parseDate(value, state.timeFormat, t) + + if (time && api.checkDateWithinRange(time)) { + state.date = modifyDate(time, state.year, state.month, state.monthDate) + state.userInputTime = null + + if (refs.timepicker) { + refs.timepicker.state.value = state.date + } + + state.timePickerVisible = false + api.cusEmit(state.date, true) + } +} + +export const handleVisibleDateChange = ({ api, state, t }) => (value) => { + const date = parseDate(value, state.dateFormat, t) + + if (date) { + if (typeof state.disabledDate === 'function' && state.disabledDate(date)) { + return + } + + state.date = modifyTime(date, state.date.getHours(), state.date.getMinutes(), state.date.getSeconds()) + state.userInputDate = null + + api.resetView() + api.cusEmit(state.date, true) + } +} + +export const isValidValue = ({ api, state }) => (value) => + value && !isNaN(value) && (typeof state.disabledDate === 'function' ? !state.disabledDate(value) : true) && api.checkDateWithinRange(value) + +export const getDefaultValue = (state) => () => (state.defaultValue ? new Date(state.defaultValue) : new Date()) + +export const checkDateWithinRange = ({ state }) => (date) => + state.selectableRange.length > 0 ? timeWithinRange(date, state.selectableRange, state.format || 'HH:mm:ss') : true + +export const selectTz = ({ emit, state }) => (tz) => { + if (state.timezone.isServiceTimezone) { + return + } + + state.tz = tz.name + state.selectedTz = tz + state.showpopup = false + state.value = dateToLocaleStringForIE(tz.offset, state.date) + + emit('select-change', { tz, date: state.value }) +} + +export const searchTz = ({ api, state }) => (input) => api.debounceChange(state, input) + +export const debounceChange = debounce(500, (state, input) => { + if (!input) { + state.showpopup = false + return + } + + const tzList = state.renderTzdata.slice() + let count = 0 + const filterAry = [] + + state.renderTzdata = tzList.map((tz) => { + if (tz.name.toLowerCase().includes(input)) { + tz.visible = false + filterAry.push(tz) + count++ + } else { + tz.visible = true + } + + return tz + }) + + if (count === 1) { + state.tz = filterAry[0].name + state.showpopup = false + } else { + state.showpopup = true + } +}) + +export const toggleTz = (state) => () => { + if (state.timezone.isServiceTimezone) { + return + } + + state.renderTzdata = + state.renderTzdata && + state.renderTzdata.map((item) => { + item.visible = false + return item + }) + + state.showpopup = true +} + +export const handleTzPickClose = (state) => () => (state.showpopup = false) + +export const getRenderTz = ({ state }) => (value) => { + if (!state.showTimezone || !value) { + return + } + + state.renderTzdata = value[state.lang] + + if (state.renderTzdata) { + const { isServiceTimezone, to } = state.timezone + const selectedTz = state.selectedTz || {} + const defaultTimezone = selectedTz.tz ? selectedTz.tz : state.defaultTimezone + let findTimezoneKey + + if (to === 0) { + findTimezoneKey = '' + } else { + findTimezoneKey = to > 0 ? '+' : '-' + findTimezoneKey = findTimezoneKey + fillChar(String(Math.abs(to)), 2) + ':00' + } + + findTimezoneKey = `(UTC${findTimezoneKey})` + + state.renderTzdata.some((item) => { + // 切换国际化、defaultTimezone、全局时区默认选中时区的第一个匹配值 + if (~[selectedTz.tz, defaultTimezone].indexOf(item.tz) || (isServiceTimezone && ~item.name.indexOf(findTimezoneKey))) { + state.selectedTz = item + state.tz = state.selectedTz.name + + return true + } + + return false + }) || (state.selectedTz = undefined) + } +} + +export const computerVisibleTime = ({ state, t }) => () => + state.userInputTime !== null ? state.userInputTime : formatDate(state.value || state.defaultValue, state.timeFormat, t) + +export const computerVisibleDate = ({ state, t }) => () => + state.userInputDate !== null ? state.userInputDate : formatDate(state.value || state.defaultValue, state.dateFormat, t) + +export const computerTimeFormat = ({ state }) => () => (state.format ? extractTimeFormat(state.timefmt || state.format) : DATEPICKER.DateFormats.timerange) + +export const watchVisible = ({ api, state }) => () => { + if (state.needChangeTimezoneData) { + api.getRenderTz(state.timezoneData) + state.needChangeTimezoneData = false + } +} diff --git a/packages/renderless/src/date-panel/vue.ts b/packages/renderless/src/date-panel/vue.ts new file mode 100644 index 000000000..490f61a66 --- /dev/null +++ b/packages/renderless/src/date-panel/vue.ts @@ -0,0 +1,232 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + proxyTimePickerDataProperties, + getRenderTz, + toggleTz, + handleTzPickClose, + debounceChange, + searchTz, + selectTz, + handleYearPick, + cusPrevYear, + cusNextYear, + cusPrevMonth, + cusNextMonth, + handleTimePickClose, + handleMonthPick, + handleDatePick, + changeToNow, + confirm, + resetView, + handleKeydown, + handleLeave, + handleEnter, + getYearLabel, + showYearPicker, + showMonthPicker, + handleTimePick, + checkDateWithinRange, + cusEmit, + getDefaultValue, + isValidValue, + handleVisibleDateChange, + handleVisibleTimeChange, + handleKeyControl, + handleShortcutClick, + watchValue, + watchDefaultValue, + watchSelectionMode, + watchTimePickerVisible, + handleClear, + doPick, + computerVisibleTime, + computerVisibleDate, + computerTimeFormat, + watchVisible +} from './index' +import { getWeekNumber, extractDateFormat } from '@opentiny/vue-renderless/common/deps/date-util' +import { DATEPICKER, DATE } from '@opentiny/vue-renderless/common' + +export const api = [ + 'state', + 'isValidValue', + 'handleTzPickClose', + 'toggleTz', + 'searchTz', + 'selectTz', + 'confirm', + 'cusPrevYear', + 'cusNextYear', + 'cusPrevMonth', + 'cusNextMonth', + 'changeToNow', + 'handleMonthPick', + 'handleYearPick', + 'handleDatePick', + 'showMonthPicker', + 'showYearPicker', + 'handleTimePick', + 'handleEnter', + 'handleVisibleTimeChange', + 'handleVisibleDateChange', + 'handleLeave', + 'handleShortcutClick', + 'handleTimePickClose' +] + +const initState = ({ reactive, computed, api, i18n }) => { + const state = reactive({ + popperClass: '', + date: new Date(), + value: '', + defaultValue: null, + defaultTime: null, + showTime: false, + selectionMode: DATEPICKER.Day, + shortcuts: '', + visible: false, + currentView: DATEPICKER.Date, + disabledDate: '', + cellClassName: '', + selectableRange: [], + firstDayOfWeek: 7, + showWeekNumber: false, + timePickerVisible: false, + format: '', + timeFmt: '', + timezone: {}, + arrowControl: false, + userInputDate: null, + userInputTime: null, + showTimezone: false, + showpopup: false, + tz: '', + selectedTz: null, + animationName: '', + year: computed(() => state.date.getFullYear()), + month: computed(() => state.date.getMonth()), + week: computed(() => getWeekNumber(state.date)), + monthDate: computed(() => state.date.getDate()), + footerVisible: computed(() => state.showTime || state.selectionMode === DATEPICKER.Dates), + visibleTime: computed(() => api.computerVisibleTime()), + visibleDate: computed(() => api.computerVisibleDate()), + yearLabel: computed(() => api.getYearLabel()), + timeFormat: computed(() => api.computerTimeFormat()), + dateFormat: computed(() => (state.format ? extractDateFormat(state.format.replace(state.timefmt, '')) : DATE.Date)), + lang: computed(() => (i18n ? i18n.locale.replace(/_/g, '-') : 'zh-CN')), + isShowTz: computed(() => state.showTimezone && state.showTime), + isShowFooter: computed(() => state.footerVisible && state.currentView === 'date') + }) + + state.needChangeTimezoneData = true // 控制重新渲染时区列表 + + return state +} + +const initWatch = ({ watch, state, api, nextTick }) => { + watch( + () => state.isShowTz, + () => { + setTimeout(() => state.fnUpdatePopper && state.fnUpdatePopper()) + } + ) + + watch( + () => state.isShowFooter, + () => { + setTimeout(() => state.fnUpdatePopper && state.fnUpdatePopper()) + } + ) + + watch( + () => state.lang, + () => (state.needChangeTimezoneData = true) + ) + + watch(() => state.defaultValue, api.watchDefaultValue) + + watch(() => state.value, api.watchValue) + + watch(() => state.timePickerVisible, api.watchTimePickerVisible) + + watch(() => state.selectionMode, api.watchSelectionMode) + + watch( + () => state.timePickerVisible, + () => nextTick(api.proxyTimePickerDataProperties) + ) + + watch(() => state.visible, api.watchVisible) +} + +const initApi = ({ api, state, t, emit, nextTick, vm, refs, watch }) => { + Object.assign(api, { + t, + state, + debounceChange, + toggleTz: toggleTz(state), + watchVisible: watchVisible({ api, state }), + getRenderTz: getRenderTz({ state }), + selectTz: selectTz({ emit, state }), + handleTzPickClose: handleTzPickClose(state), + getDefaultValue: getDefaultValue(state), + showYearPicker: showYearPicker({ state }), + handleTimePickClose: handleTimePickClose(state), + cusNextMonth: cusNextMonth({ state }), + cusPrevMonth: cusPrevMonth({ state }), + resetView: resetView({ state }), + showMonthPicker: showMonthPicker({ state }), + cusNextYear: cusNextYear({ state }), + cusPrevYear: cusPrevYear({ state }), + watchDefaultValue: watchDefaultValue({ state }), + getYearLabel: getYearLabel({ state, t }), + cusEmit: cusEmit({ state, emit }), + watchTimePickerVisible: watchTimePickerVisible({ nextTick, vm }), + checkDateWithinRange: checkDateWithinRange({ state }), + watchSelectionMode: watchSelectionMode({ state }), + proxyTimePickerDataProperties: proxyTimePickerDataProperties({ refs, state, watch }), + handleKeyControl: handleKeyControl({ state, emit }), + doPick: doPick(emit), + searchTz: searchTz({ api, state }), + handleEnter: handleEnter(api), + handleLeave: handleLeave({ api, emit }), + changeToNow: changeToNow({ api, state }), + isValidValue: isValidValue({ api, state }), + handleClear: handleClear({ api, state, emit }), + watchValue: watchValue({ api, state }), + handleKeydown: handleKeydown({ api, state }), + confirm: confirm({ api, state, t }), + handleMonthPick: handleMonthPick({ api, state }), + handleVisibleDateChange: handleVisibleDateChange({ api, state, t }), + handleTimePick: handleTimePick({ api, state, t }), + handleVisibleTimeChange: handleVisibleTimeChange({ api, refs, state, t }), + handleYearPick: handleYearPick({ api, state }), + handleDatePick: handleDatePick({ api, state, t }), + handleShortcutClick: handleShortcutClick(api), + computerVisibleTime: computerVisibleTime({ state, t }), + computerVisibleDate: computerVisibleDate({ state, t }), + computerTimeFormat: computerTimeFormat({ state }) + }) +} + +export const renderless = (props, { computed, reactive, watch, nextTick }, { t, refs, emit: $emit, vm, i18n }) => { + const api = {} + const emit = props.emitter ? props.emitter.emit : $emit + const state = initState({ reactive, computed, api, i18n }) + + initApi({ api, state, t, emit, nextTick, vm, refs, watch }) + initWatch({ watch, state, api, nextTick }) + + return api +} diff --git a/packages/renderless/src/date-picker/index.ts b/packages/renderless/src/date-picker/index.ts new file mode 100644 index 000000000..697132f7e --- /dev/null +++ b/packages/renderless/src/date-picker/index.ts @@ -0,0 +1,283 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const getMonthEndDay = (constants) => (year, month) => constants.MonthDay - new Date(year, month - 1, constants.MonthDay).getDate() + +export const getTrueValue = (value) => { + if (!value) { + return 0 + } + + while (isNaN(parseInt(value, 10))) { + if (value.length > 1) { + value = value.slice(1) + } else { + return 0 + } + } + + return parseInt(value, 10) +} + +export const getBoundary = ({ api, constants, props }) => ({ type, value: val }) => { + const boundary = props[`${type}${constants.CapDate}`] + const year = boundary.getFullYear() + let month = 1 + let date = 1 + let hour = 0 + let minute = 0 + + if (type === constants.Max) { + month = constants.TotalMonth + date = api.getMonthEndDay(val.getFullYear(), val.getMonth() + 1) + hour = constants.Hours + minute = constants.Minutes + } + + if (val.getFullYear() === year) { + month = boundary.getMonth() + 1 + if (val.getMonth() + 1 === month) { + date = boundary.getDate() + if (val.getDate() === date) { + hour = boundary.getHours() + if (val.getHours() === hour) { + minute = boundary.getMinutes() + } + } + } + } + + return { + [`${type}${constants.CapYear}`]: year, + [`${type}${constants.CapMonth}`]: month, + [`${type}${constants.CapDate}`]: date, + [`${type}${constants.CapHour}`]: hour, + [`${type}${constants.CapMinute}`]: minute + } +} + +export const updateInnerValue = ({ api, constants, props, refs, state }) => () => { + const indexes = refs.picker && refs.picker.getIndexes() + + const getValue = (index) => { + const { values } = state.originColumns[index] + return getTrueValue(values[indexes[index]]) + } + + const year = getValue(0) + const month = getValue(1) + const maxDate = api.getMonthEndDay(year, month) + + let date + if (props.type === constants.YearMonth) { + date = 1 + } else { + date = getValue(2) + } + + date = date > maxDate ? maxDate : date + + let hour = 0 + let minute = 0 + + if (props.type === constants.DateTime) { + hour = getValue(3) + minute = getValue(4) + } + + const value = new Date(year, month - 1, date, hour, minute) + + state.innerValue = api.formatValue(value) +} + +export const formatValue = (props) => (value) => { + if (!Object.prototype.toString.call(value) === '[object Date]' && !isNaN(value.getTime())) { + value = props.minDate + } + + value = Math.max(value, props.minDate.getTime()) + value = Math.min(value, props.maxDate.getTime()) + + return new Date(value) +} + +export const onChange = ({ api, emit, refs, nextTick }) => () => { + api.updateInnerValue() + + nextTick(() => { + nextTick(() => { + emit('change', refs.picker) + document.body.style.overflow = '' + }) + }) +} + +export const padZero = (num, targetLength = 2) => { + let str = String(num) + + while (str.length < targetLength) { + str = '0' + str + } + + return str +} + +export const updateColumnValue = ({ constants, nextTick, props, refs, state }) => () => { + const value = state.innerValue + const { formatter } = props + + let values = [formatter('year', `${value.getFullYear()}`), formatter('month', padZero(value.getMonth() + 1)), formatter('day', padZero(value.getDate()))] + + if (props.type === constants.DateTime) { + values.push(formatter('hour', padZero(value.getHours())), formatter('minute', padZero(value.getMinutes()))) + } + + if (props.type === constants.YearMonth) { + values = values.slice(0, 2) + } + + nextTick(() => { + refs.picker.setValues(values) + }) +} + +export const getRanges = ({ api, constants, props, state }) => () => { + const { maxYear, maxDate, maxMonth, maxHour, maxMinute } = api.getBoundary({ + type: constants.Max, + value: state.innerValue + }) + + const { minYear, minDate, minMonth, minHour, minMinute } = api.getBoundary({ + type: constants.Min, + value: state.innerValue + }) + + const result = [ + { + type: constants.Year, + range: [minYear, maxYear] + }, + { + type: 'month', + range: [minMonth, maxMonth] + }, + { + type: constants.Day, + range: [minDate, maxDate] + }, + { + type: constants.Hour, + range: [minHour, maxHour] + }, + { + type: constants.Minute, + range: [minMinute, maxMinute] + } + ] + + if (props.type === constants.Date) { + result.splice(3, 2) + } + if (props.type === constants.YearMonth) { + result.splice(2, 3) + } + return result +} + +export function times(n, iteratee) { + let index = -1 + const result = Array(n) + + while (++index < n) { + result[index] = iteratee(index) + } + + return result +} + +export const getOrigiCol = (state) => () => + state.ranges.map(({ type, range: rangeArr }) => { + let values = times(rangeArr[1] - rangeArr[0] + 1, (index) => { + const value = padZero(rangeArr[0] + index) + return value + }) + + return { + type, + values + } + }) + +export const getColumns = ({ props, state }) => () => + state.originColumns.map((column) => ({ + values: column.values.map((value) => props.formatter(column.type, value)) + })) + +export const onConfirm = ({ api, emit, state }) => () => { + state.visible = false + emit('confirm', state.innerValue) + emit('update:modelValue', state.innerValue) + emit('update:visible', state.visible) + document.body.style.overflow = '' + state.displayValue = api.getDisplayValue() + state.clearable = false +} + +export const onCancel = ({ emit, state }) => () => { + state.visible = false + emit('cancel') + emit('update:visible', state.visible) + document.body.style.overflow = '' +} + +export const getDisplayValue = ({ constants, DATE, props, state }) => () => { + const format = function (value, fmt) { + const o = { + 'M+': value.getMonth() + 1, + 'd+': value.getDate(), + 'h+': value.getHours(), + 'm+': value.getMinutes(), + 's+': value.getSeconds(), + 'q+': Math.floor((value.getMonth() + 3) / 3), + 'S': value.getMilliseconds() + } + + if (/(y+)/.test(fmt)) { + fmt = fmt.replace(RegExp.$1, String(value.getFullYear()).substr(4 - RegExp.$1.length)) + } + for (let k in o) { + if (new RegExp('(' + k + ')').test(fmt)) { + fmt = fmt.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ('00' + o[k]).substr(String(o[k]).length)) + } + } + return fmt + } + + return format(state.innerValue, props.type === constants.DateTime ? DATE.Datetime : DATE.Date) +} + +export const hookMounted = ({ constants, parent, refs, nextTick }) => () => { + nextTick(() => { + parent.$emit(constants.HookMounted, refs.refrence.$el) + }) +} + +export const showPickerAndlockSrcoll = ({ constants, state }) => () => { + state.visible = true + document.body.style.overflow = constants.Hidden + state.isReadonly = true +} + +export const clearDisplayValue = (state) => () => { + state.displayValue = '' + state.clearable = true +} diff --git a/packages/renderless/src/date-picker/vue.ts b/packages/renderless/src/date-picker/vue.ts new file mode 100644 index 000000000..c9a150075 --- /dev/null +++ b/packages/renderless/src/date-picker/vue.ts @@ -0,0 +1,128 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + getBoundary, + clearDisplayValue, + showPickerAndlockSrcoll, + hookMounted, + getMonthEndDay, + getDisplayValue, + getRanges, + onConfirm, + onCancel, + getOrigiCol, + getColumns, + updateInnerValue, + formatValue, + onChange, + updateColumnValue +} from './index' +import { DATE } from '../common' + +export const api = ['state', 'clearDisplayValue', 'showPickerAndlockSrcoll', 'hookMounted', 'onConfirm', 'onCancel', 'onChange'] + +const setWatchFn = ({ api, watch, props, state, emit }) => { + watch( + () => props.minDate, + () => api.updateInnerValue(), + { + lazy: true + } + ) + watch( + () => props.visible, + (value) => (state.visible = value), + { lazy: true } + ) + watch( + () => props.maxDate, + () => api.updateInnerValue(), + { + lazy: true + } + ) + watch( + () => props.modelValue, + (value) => { + if (value) { + const val = api.formatValue(new Date(value)) + if (val.valueOf() !== state.innerValue.valueOf()) { + state.innerValue = val + } + state.displayValue = api.getDisplayValue() + } + }, + { + immediate: true + } + ) + watch( + () => state.columns, + () => api.updateColumnValue(), + { + lazy: true + } + ) + watch( + () => state.innerValue, + (value) => emit('input', value), + { + lazy: true + } + ) +} + +export const renderless = (props, context, { computed, onMounted, reactive, watch }, { constants, emit, nextTick, refs, parent }) => { + const api = { formatValue: formatValue(props), getMonthEndDay: getMonthEndDay(constants), hookMounted: hookMounted({ constants, parent, refs, nextTick }) } + + const state = reactive({ + visible: false, + innerValue: formatValue(props)(props.modelValue), + ranges: computed(() => api.getRanges()), + originColumns: computed(() => api.getOrigiCol()), + columns: computed(() => api.getColumns()), + displayValue: '', + isReadonly: false, + clearable: props.clearable + }) + + Object.assign(api, { + state, + getOrigiCol: getOrigiCol(state), + onCancel: onCancel({ emit, state }), + getColumns: getColumns({ props, state }), + clearDisplayValue: clearDisplayValue(state), + getDisplayValue: getDisplayValue({ constants, DATE, props, state }), + showPickerAndlockSrcoll: showPickerAndlockSrcoll({ constants, state }), + updateColumnValue: updateColumnValue({ constants, nextTick, props, refs, state }) + }) + + api.getBoundary = getBoundary({ api, constants, props }) + api.updateInnerValue = updateInnerValue({ api, constants, props, refs, state }) + api.getRanges = getRanges({ api, constants, props, state }) + + setWatchFn({ api, watch, props, state, emit }) + + onMounted(() => { + api.updateColumnValue() + + nextTick(() => { + api.updateInnerValue() + }) + }) + + return Object.assign(api, { + onConfirm: onConfirm({ api, emit, state }), + onChange: onChange({ api, emit, refs, nextTick }) + }) +} diff --git a/packages/renderless/src/date-range/index.ts b/packages/renderless/src/date-range/index.ts new file mode 100644 index 000000000..6e49c5b6c --- /dev/null +++ b/packages/renderless/src/date-range/index.ts @@ -0,0 +1,446 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { + isDate, + nextDate, + parseDate, + formatDate, + modifyDate, + modifyTime, + nextYear, + prevYear, + nextMonth, + prevMonth, + modifyWithTimeString +} from '@opentiny/vue-renderless/common/deps/date-util' + +export const calcDefaultValue = (defaultValue) => { + if (Array.isArray(defaultValue)) { + return [new Date(defaultValue[0]), new Date(defaultValue[1])] + } else if (defaultValue) { + return [new Date(defaultValue), nextDate(new Date(defaultValue), 1)] + } + + return [new Date(), nextDate(new Date(), 1)] +} + +export const getMinVisibleDate = ({ state, t }) => () => { + if (state.dateUserInput.min !== null) { + return state.dateUserInput.min + } + + if (state.minDate) { + return formatDate(state.minDate, state.dateFormat, t) + } + + return '' +} + +export const getMaxVisibleDate = ({ state, t }) => () => { + if (state.dateUserInput.max !== null) { + return state.dateUserInput.max + } + + if (state.maxDate || state.minDate) { + return formatDate(state.maxDate || state.minDate, state.dateFormat, t) + } + + return '' +} + +export const getMinVisibleTime = ({ state, t }) => () => { + if (state.timeUserInput.min !== null) { + return state.timeUserInput.min + } + + if (state.minDate) { + return formatDate(state.minDate, state.timeFormat, t) + } + + return '' +} + +export const getMaxVisibleTime = ({ state, t }) => () => { + if (state.timeUserInput.max !== null) { + return state.timeUserInput.max + } + + if (state.maxDate || state.minDate) { + return formatDate(state.maxDate || state.minDate, state.timeFormat, t) + } + + return '' +} + +export const getEnableMonthArrow = (state) => () => { + const nextMonth = (state.leftMonth + 1) % 12 + const yearOffset = state.leftMonth + 1 >= 12 ? 1 : 0 + + return state.unlinkPanels && new Date(state.leftYear + yearOffset, nextMonth) < new Date(state.rightYear, state.rightMonth) +} + +export const watchMinDate = ({ state, t, vm }) => (value) => { + state.dateUserInput.min = null + state.timeUserInput.min = null + + const minTimePicker = vm.$refs.minTimePicker + + if (!minTimePicker) { + return + } + + if (state.maxDate && state.maxDate < state.minDate) { + const format = 'HH:mm:ss' + + minTimePicker.state.selectableRange = [[parseDate(formatDate(state.minDate, format, t), format, t), parseDate('23:59:59', format, t)]] + } + + if (value) { + minTimePicker.state.value = value + } +} + +export const watchMaxDate = ({ state, vm }) => (value) => { + state.dateUserInput.max = null + state.timeUserInput.max = null + + const maxTimePicker = vm.$refs.maxTimePicker + + if (value && maxTimePicker) { + maxTimePicker.state.value = value + } +} + +export const watchMinTimePickerVisible = ({ nextTick, state, vm }) => (value) => { + if (value) { + nextTick(() => { + vm.$refs.minTimePicker.state.value = state.minDate + }) + } +} + +export const watchMaxTimePickerVisible = ({ nextTick, state, vm }) => (value) => { + if (value) { + nextTick(() => { + vm.$refs.maxTimePicker.state.value = state.maxDate + }) + } +} + +export const watchValue = ({ state }) => (value) => { + if (!value) { + state.minDate = null + state.maxDate = null + } else if (Array.isArray(value)) { + state.minDate = isDate(value[0]) ? new Date(value[0]) : null + state.maxDate = isDate(value[1]) ? new Date(value[1]) : null + + if (state.minDate) { + state.leftDate = state.minDate + + if (state.unlinkPanels && state.maxDate) { + const minDateYear = state.minDate.getFullYear() + const minDateMonth = state.minDate.getMonth() + const maxDateYear = state.maxDate.getFullYear() + const maxDateMonth = state.maxDate.getMonth() + + state.rightDate = minDateYear === maxDateYear && minDateMonth === maxDateMonth ? nextMonth(state.maxDate) : state.maxDate + } else { + state.rightDate = nextMonth(state.leftDate) + } + } else { + state.leftDate = calcDefaultValue(state.defaultValue)[0] + state.rightDate = nextMonth(state.leftDate) + } + } +} + +export const watchDefault = ({ state }) => (value) => { + if (!Array.isArray(state.value)) { + const [left, right] = calcDefaultValue(value) + + state.leftDate = left + state.rightDate = value && value[1] && state.unlinkPanels ? right : nextMonth(state.leftDate) + } +} + +export const handleClear = ({ emit, state }) => () => { + state.minDate = null + state.maxDate = null + state.leftDate = calcDefaultValue(state.defaultValue)[0] + state.rightDate = nextMonth(state.leftDate) + state.rangeState.selecting = false + state.rangeState.endDate = null + + emit('pick', null) +} + +export const handleChangeRange = (state) => (val) => { + state.minDate = val.minDate + state.maxDate = val.maxDate + state.rangeState = val.rangeState +} + +export const handleDateInput = ({ state, t }) => (value, type) => { + state.dateUserInput[type] = value + + if (value.length !== state.dateFormat.length) { + return + } + + const parsedValue = parseDate(value, state.dateFormat, t) + + if (parsedValue) { + if (typeof state.disabledDate === 'function' && state.disabledDate(new Date(parsedValue))) { + return + } + + if (type === 'min') { + state.minDate = modifyDate(state.minDate || new Date(), parsedValue.getFullYear(), parsedValue.getMonth(), parsedValue.getDate()) + + state.leftDate = new Date(parsedValue) + + if (!state.unlinkPanels) { + state.rightDate = nextMonth(state.leftDate) + } + } else { + state.maxDate = modifyDate(state.maxDate || new Date(), parsedValue.getFullYear(), parsedValue.getMonth(), parsedValue.getDate()) + + state.rightDate = new Date(parsedValue) + + if (!state.unlinkPanels) { + state.leftDate = prevMonth(parsedValue) + } + } + } +} + +export const handleDateChange = ({ state, t }) => (value, type) => { + const parsedValue = parseDate(value, state.dateFormat, t) + + if (parsedValue) { + if (type === 'min') { + state.minDate = modifyDate(state.minDate || new Date(), parsedValue.getFullYear(), parsedValue.getMonth(), parsedValue.getDate()) + + if (state.minDate > state.maxDate) { + state.maxDate = state.minDate + } + } else { + state.maxDate = modifyDate(state.maxDate || new Date(), parsedValue.getFullYear(), parsedValue.getMonth(), parsedValue.getDate()) + + if (state.maxDate < state.minDate) { + state.minDate = state.maxDate + } + } + } +} + +export const handleTimeInput = ({ state, t }) => (value, type) => { + state.timeUserInput[type] = value + + if (value.length !== state.timeFormat.length) { + return + } + + const parsedValue = parseDate(value, state.timeFormat, t) + + if (parsedValue) { + if (type === 'min') { + state.minDate = modifyTime(state.minDate, parsedValue.getHours(), parsedValue.getMinutes(), parsedValue.getSeconds()) + } else { + state.maxDate = modifyTime(state.maxDate, parsedValue.getHours(), parsedValue.getMinutes(), parsedValue.getSeconds()) + } + } +} + +export const handleTimeChange = ({ state, t, vm }) => (value, type) => { + const parsedValue = parseDate(value, state.timeFormat, t) + + if (parsedValue) { + if (type === 'min') { + state.minDate = modifyTime(state.minDate, parsedValue.getHours(), parsedValue.getMinutes(), parsedValue.getSeconds()) + + if (state.minDate > state.maxDate) { + state.maxDate = state.minDate + } + + vm.$refs.minTimePicker.state.value = state.minDate + state.minTimePickerVisible = false + } else { + state.maxDate = modifyTime(state.maxDate, parsedValue.getHours(), parsedValue.getMinutes(), parsedValue.getSeconds()) + + if (state.maxDate < state.minDate) { + state.minDate = state.maxDate + } + + vm.$refs.maxTimePicker.state.value = state.minDate + state.maxTimePickerVisible = false + } + } +} + +export const handleRangePick = ({ api, state, t }) => (val, close = true) => { + const defaultTime = state.defaultTime || [] + const minDate = modifyWithTimeString(val.minDate, defaultTime[0], t) + const maxDate = modifyWithTimeString(val.maxDate, defaultTime[1], t) + + if (state.maxDate === maxDate && state.minDate === minDate) { + return + } + + state.onPick && state.onPick(val) + state.maxDate = maxDate + state.minDate = minDate + + setTimeout(() => { + state.maxDate = maxDate + state.minDate = minDate + }, 10) + + if (!close || state.showTime) { + return + } + + api.handleConfirm() +} + +export const handleShortcutClick = (api) => (shortcut) => { + if (shortcut.onClick) { + const picker = { + $emit: (type, [start, end]) => { + api.doPick(start, end) + } + } + + shortcut.onClick(picker) + } +} + +export const doPick = (emit) => (start, end) => { + emit('pick', [start, end], false) +} + +export const handleMinTimePick = ({ state }) => (value, visible, first) => { + state.minDate = state.minDate || new Date() + + if (value) { + state.minDate = modifyTime(state.minDate, value.getHours(), value.getMinutes(), value.getSeconds()) + } + + if (!first) { + state.minTimePickerVisible = visible + } + + if (!state.maxDate || (state.maxDate && state.maxDate.getTime() < state.minDate.getTime())) { + state.maxDate = new Date(state.minDate) + } +} + +export const handleMinTimeClose = (state) => () => (state.minTimePickerVisible = false) + +export const handleMaxTimePick = ({ state }) => (value, visible, first) => { + if (state.maxDate && value) { + state.maxDate = modifyTime(state.maxDate, value.getHours(), value.getMinutes(), value.getSeconds()) + } + + if (!first) { + state.maxTimePickerVisible = visible + } + + if (state.maxDate && state.minDate && state.minDate.getTime() > state.maxDate.getTime()) { + state.minDate = new Date(state.maxDate) + } +} + +export const handleMaxTimeClose = (state) => () => (state.maxTimePickerVisible = false) + +export const leftPrevYear = ({ state }) => () => { + state.leftDate = prevYear(state.leftDate) + + if (!state.unlinkPanels) { + state.rightDate = nextMonth(state.leftDate) + } +} + +export const leftPrevMonth = ({ state }) => () => { + state.leftDate = prevMonth(state.leftDate) + + if (!state.unlinkPanels) { + state.rightDate = nextMonth(state.leftDate) + } +} + +export const rightNextYear = ({ state }) => () => { + const { leftDate, rightDate, unlinkPanels } = state + + if (!unlinkPanels) { + state.leftDate = nextYear(leftDate) + state.rightDate = nextMonth(state.leftDate) + } else { + state.rightDate = nextYear(rightDate) + } +} + +export const rightNextMonth = ({ state }) => () => { + if (!state.unlinkPanels) { + state.leftDate = nextMonth(state.leftDate) + state.rightDate = nextMonth(state.leftDate) + } else { + state.rightDate = nextMonth(state.rightDate) + } +} + +export const leftNextYear = ({ state }) => () => (state.leftDate = nextYear(state.leftDate)) + +export const leftNextMonth = ({ state }) => () => (state.leftDate = nextMonth(state.leftDate)) + +export const rightPrevYear = ({ state }) => () => (state.rightDate = prevYear(state.rightDate)) + +export const rightPrevMonth = ({ state }) => () => (state.rightDate = prevMonth(state.rightDate)) + +export const handleConfirm = ({ api, emit, state }) => (visible = false) => { + if (api.isValidValue([state.minDate, state.maxDate])) { + emit('pick', [state.minDate, state.maxDate], visible) + } +} + +export const isValidValue = ({ state }) => (value) => + Array.isArray(value) && + value && + value[0] && + value[1] && + isDate(value[0]) && + isDate(value[1]) && + value[0].getTime() <= value[1].getTime() && + (typeof state.disabledDate === 'function' ? !state.disabledDate(value[0]) && !state.disabledDate(value[1]) : true) + +export const resetView = ({ state }) => () => { + state.minDate = state.value && isDate(state.value[0]) ? new Date(state.value[0]) : null + state.maxDate = state.value && isDate(state.value[0]) ? new Date(state.value[1]) : null +} + +export const setTimeFormat = ({ nextTick, vm, state }) => () => { + nextTick(() => { + vm.$refs.maxTimePicker.state.format = state.timeFormat + vm.$refs.minTimePicker.state.format = state.timeFormat + }) +} + +export const computerBtnDisabled = ({ state, api }) => () => + !(state.minDate && state.maxDate && !state.selecting && api.isValidValue([state.minDate, state.maxDate])) + +export const computerLabel = ({ state, t }) => (type) => + `${state[type].getFullYear()} ${t('ui.datepicker.year')} ${t(`ui.datepicker.month${state[type].getMonth() + 1}`)}` + +export const computerEnableYearArrow = (state) => () => + state.unlinkPanels && state.rightYear * 12 + state.rightMonth - (state.leftYear * 12 + state.leftMonth + 1) >= 12 diff --git a/packages/renderless/src/date-range/vue.ts b/packages/renderless/src/date-range/vue.ts new file mode 100644 index 000000000..443cf8ced --- /dev/null +++ b/packages/renderless/src/date-range/vue.ts @@ -0,0 +1,193 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + getMinVisibleDate, + watchValue, + resetView, + isValidValue, + handleConfirm, + rightPrevMonth, + rightPrevYear, + leftNextMonth, + leftNextYear, + rightNextMonth, + rightNextYear, + leftPrevMonth, + leftPrevYear, + handleMaxTimeClose, + handleMaxTimePick, + handleMinTimeClose, + handleMinTimePick, + handleShortcutClick, + handleRangePick, + handleTimeChange, + handleTimeInput, + handleDateChange, + handleDateInput, + handleChangeRange, + watchDefault, + handleClear, + getMaxVisibleDate, + watchMaxTimePickerVisible, + watchMinTimePickerVisible, + watchMaxDate, + watchMinDate, + getMinVisibleTime, + getEnableMonthArrow, + getMaxVisibleTime, + doPick, + setTimeFormat, + computerBtnDisabled, + computerLabel, + computerEnableYearArrow +} from './index' +import { nextMonth, extractDateFormat, extractTimeFormat } from '@opentiny/vue-renderless/common/deps/date-util' + +export const api = [ + 'state', + 'handleShortcutClick', + 'handleConfirm', + 'handleClear', + 'handleChangeRange', + 'rightNextMonth', + 'rightNextYear', + 'rightPrevMonth', + 'rightPrevYear', + 'handleRangePick', + 'leftNextMonth', + 'leftNextYear', + 'leftPrevMonth', + 'leftPrevYear', + 'handleMaxTimePick', + 'handleDateInput', + 'handleMinTimePick', + 'handleTimeChange', + 'handleTimeInput', + 'handleMinTimeClose', + 'handleDateChange', + 'handleMaxTimeClose' +] + +const initState = ({ reactive, computed, api }) => { + const state = reactive({ + popperElm: null, + popperClass: '', + value: [], + defaultValue: null, + defaultTime: null, + minDate: '', + maxDate: '', + leftDate: new Date(), + rightDate: nextMonth(new Date()), + rangeState: { endDate: null, selecting: false, row: null, column: null }, + showTime: false, + format: '', + arrowControl: false, + unlinkPanels: false, + firstDayOfWeek: 7, + minTimePickerVisible: false, + maxTimePickerVisible: false, + shortcuts: '', + visible: '', + disabledDate: '', + cellClassName: '', + dateUserInput: { min: null, max: null }, + timeUserInput: { min: null, max: null }, + btnDisabled: computed(() => api.computerBtnDisabled()), + leftLabel: computed(() => api.computerLabel('leftDate')), + rightLabel: computed(() => api.computerLabel('rightDate')), + leftYear: computed(() => state.leftDate.getFullYear()), + leftMonth: computed(() => state.leftDate.getMonth()), + leftMonthDate: computed(() => state.leftDate.getDate()), + rightYear: computed(() => state.rightDate.getFullYear()), + rightMonth: computed(() => state.rightDate.getMonth()), + rightMonthDate: computed(() => state.rightDate.getDate()), + minVisibleDate: computed(() => api.getMinVisibleDate()), + maxVisibleDate: computed(() => api.getMaxVisibleDate()), + minVisibleTime: computed(() => api.getMinVisibleTime()), + maxVisibleTime: computed(() => api.getMaxVisibleTime()), + timeFormat: computed(() => (state.format ? extractTimeFormat(state.format) : 'HH:mm:ss')), + dateFormat: computed(() => (state.format ? extractDateFormat(state.format) : 'yyyy-MM-dd')), + enableMonthArrow: computed(() => api.getEnableMonthArrow()), + enableYearArrow: computed(() => api.computerEnableYearArrow()) + }) + + return state +} + +const initWatch = ({ watch, state, api }) => { + watch(() => state.minDate, api.watchMinDate) + watch(() => state.maxDate, api.watchMaxDate) + watch(() => state.minTimePickerVisible, api.watchMinTimePickerVisible) + watch(() => state.maxTimePickerVisible, api.watchMaxTimePickerVisible) + watch(() => state.value, api.watchValue) + watch(() => state.defaultValue, api.watchDefault) + watch(() => state.showTime, api.setTimeFormat) +} + +const initApi = ({ api, state, t, vm, nextTick, refs, emit }) => { + Object.assign(api, { + t, + state, + computerLabel: computerLabel({ state, t }), + resetView: resetView({ state }), + watchMaxDate: watchMaxDate({ state, vm }), + handleChangeRange: handleChangeRange(state), + handleMaxTimeClose: handleMaxTimeClose(state), + handleMinTimeClose: handleMinTimeClose(state), + isValidValue: isValidValue({ state }), + leftNextYear: leftNextYear({ state }), + getEnableMonthArrow: getEnableMonthArrow(state), + leftNextMonth: leftNextMonth({ state }), + rightPrevYear: rightPrevYear({ state }), + rightPrevMonth: rightPrevMonth({ state }), + rightNextMonth: rightNextMonth({ state }), + leftPrevYear: leftPrevYear({ state }), + handleMaxTimePick: handleMaxTimePick({ state }), + handleMinTimePick: handleMinTimePick({ state }), + getMaxVisibleTime: getMaxVisibleTime({ state, t }), + getMinVisibleTime: getMinVisibleTime({ state, t }), + getMaxVisibleDate: getMaxVisibleDate({ state, t }), + getMinVisibleDate: getMinVisibleDate({ state, t }), + rightNextYear: rightNextYear({ state }), + leftPrevMonth: leftPrevMonth({ state }), + handleDateChange: handleDateChange({ state, t }), + handleTimeChange: handleTimeChange({ state, t, vm }), + watchMinDate: watchMinDate({ state, t, vm }), + handleTimeInput: handleTimeInput({ nextTick, refs, state, t }), + watchMaxTimePickerVisible: watchMaxTimePickerVisible({ nextTick, state, vm }), + watchMinTimePickerVisible: watchMinTimePickerVisible({ nextTick, state, vm }), + handleDateInput: handleDateInput({ state, t }), + doPick: doPick(emit), + watchValue: watchValue({ state }), + watchDefault: watchDefault({ state }), + handleClear: handleClear({ emit, state }), + setTimeFormat: setTimeFormat({ nextTick, vm, state }), + handleConfirm: handleConfirm({ api, emit, state }), + handleRangePick: handleRangePick({ api, state, t }), + handleShortcutClick: handleShortcutClick(api), + computerBtnDisabled: computerBtnDisabled({ state, api }), + computerEnableYearArrow: computerEnableYearArrow(state) + }) +} + +export const renderless = (props, { computed, reactive, watch, nextTick }, { t, refs, emit: $emit, vm }) => { + const api = {} + const emit = props.emitter ? props.emitter.emit : $emit + const state = initState({ reactive, computed, api }) + + initApi({ api, state, t, vm, nextTick, refs, emit }) + initWatch({ watch, state, api }) + + return api +} diff --git a/packages/renderless/src/date-table/index.ts b/packages/renderless/src/date-table/index.ts new file mode 100644 index 000000000..d3eae17b7 --- /dev/null +++ b/packages/renderless/src/date-table/index.ts @@ -0,0 +1,432 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { formatDate } from '@opentiny/vue-renderless/common/deps/date-util' +import { getFirstDayOfMonth, getDayCountOfMonth, getWeekNumber, prevDate, nextDate, isDate, clearTime } from '@opentiny/vue-renderless/common/deps/date-util' +import { DATEPICKER } from '@opentiny/vue-renderless/common' + +const formatJudg = ({ day, offset, j, i, cell, count, dateCountOfLastMonth }) => { + const nodfpm = day + offset < 0 ? 7 + day + offset : day + offset + + if (j + i * 7 >= nodfpm) { + cell.text = count++ + } else { + cell.text = dateCountOfLastMonth - (nodfpm - (j % 7)) + 1 + i * 7 + cell.type = DATEPICKER.PreMonth + } + + return { count } +} + +export const getOffsetDay = (props) => () => { + const week = props.firstDayOfWeek + return week > 3 ? 7 - week : -week +} + +export const getWeeks = ({ props, state }) => () => { + const week = props.firstDayOfWeek + return state.constWeeks.concat(state.constWeeks).slice(week, week + 7) +} + +export const getDateTimestamp = (time) => { + if (typeof time === 'number' || typeof time === 'string') { + return clearTime(new Date(time)).getTime() + } else if (time instanceof Date) { + return clearTime(time).getTime() + } + + return NaN +} + +export const arrayFindIndex = (arr, pred) => { + for (let i = 0, len = arr.length; i !== len; ++i) { + if (pred(arr[i])) { + return i + } + } + + return -1 +} + +export const arrayFind = (arr, pred) => { + const idx = arrayFindIndex(arr, pred) + return ~idx ? arr[idx] : undefined +} + +const getSelected = ({ props, cell, format, t, cellDate, selectedDate }) => { + let selected = cell.selected + + if (props.selectionMode === 'dates') { + selected = arrayFind(selectedDate, (date) => formatDate(date, format, t) === formatDate(cellDate, format, t)) + } else { + selected = arrayFind(selectedDate, (date) => date.getTime() === cellDate.getTime()) + } + + return selected +} + +export const getCell = ({ state, props }) => (row, i, j) => { + const now = getDateTimestamp(new Date()) + let cell = row[props.showWeekNumber ? j + 1 : j] + + if (!cell) { + cell = { + row: i, + column: j, + inRange: false, + start: false, + end: false, + type: DATEPICKER.Normal + } + } + + cell.type = DATEPICKER.Normal + + const index = i * 7 + j + const time = nextDate(state.startDate, index - state.offsetDay).getTime() + + cell.inRange = time >= getDateTimestamp(props.minDate) && time <= getDateTimestamp(props.maxDate) + cell.start = props.minDate && time === getDateTimestamp(props.minDate) + cell.end = props.maxDate && time === getDateTimestamp(props.maxDate) + + // isToday + time === now && (cell.type = DATEPICKER.Today) + + return { cell, cellDate: new Date(time) } +} + +const doCount = ({ i, day, offset, j, cell, count, dateCountOfLastMonth, dateCountOfMonth }) => { + if (i >= 0 && i <= 1) { + const ret = formatJudg({ + day, + offset, + j, + i, + cell, + count, + dateCountOfLastMonth + }) + count = ret.count + } else { + if (count <= dateCountOfMonth) { + cell.text = count++ + } else { + cell.text = count++ - dateCountOfMonth + cell.type = DATEPICKER.NextMonth + } + } + + return count +} + +export const coerceTruthyValueToArray = (val) => (Array.isArray(val) ? val : val ? [val] : []) + +export const getRows = ({ api, props, state, t, vm }) => () => { + const date = new Date(state.year, state.month, 1) + let day = getFirstDayOfMonth(date) + const dateCountOfMonth = getDayCountOfMonth(date.getFullYear(), date.getMonth()) + const dateCountOfLastMonth = getDayCountOfMonth(date.getFullYear(), date.getMonth() === 0 ? 11 : date.getMonth() - 1) + + day = day === 0 ? 7 : day + + const offset = state.offsetDay + const rows = state.tableRows + const startDate = state.startDate + const disabledDate = props.disabledDate + const cellClassName = props.cellClassName + const selectedDate = props.selectionMode === DATEPICKER.Dates ? coerceTruthyValueToArray(props.value) : [] + let count = 1 + + for (let i = 0; i < 6; i++) { + const row = rows[i] + + if (props.showWeekNumber && !row[0]) { + row[0] = { + type: DATEPICKER.Week, + text: getWeekNumber(nextDate(startDate, i * 7 + 1)) + } + } + + for (let j = 0; j < 7; j++) { + const { cell, cellDate } = api.getCell(row, i, j, DATEPICKER.Normal, props) + + count = doCount({ i, day, offset, j, cell, count, dateCountOfLastMonth, dateCountOfMonth }) + + cell.disabled = typeof disabledDate === 'function' && disabledDate(cellDate) + cell.selected = getSelected({ props, cell, api, format: DATEPICKER.DateFormats.date, t, cellDate, selectedDate }) + cell.customClass = typeof cellClassName === 'function' && cellClassName(cellDate) + + vm.$set(row, props.showWeekNumber ? j + 1 : j, cell) + } + + if (props.selectionMode === DATEPICKER.Week) { + const [start, end] = props.showWeekNumber ? [1, 7] : [0, 6] + const isWeekActive = api.isWeekActive(row[start + 1]) + + Object.assign(row[start], { inRange: isWeekActive, start: isWeekActive }) + Object.assign(row[end], { inRange: isWeekActive, end: isWeekActive }) + } + } + + return rows +} + +export const watchMinDate = ({ api, props }) => (value, oldvalue) => { + if (getDateTimestamp(value) !== getDateTimestamp(oldvalue)) { + api.markRange(props.minDate, props.maxDate) + } +} + +export const watchMaxDate = ({ api, props }) => (value, oldvalue) => { + if (getDateTimestamp(value) !== getDateTimestamp(oldvalue)) { + api.markRange(props.minDate, props.maxDate) + } +} + +export const cellMatchesDate = (state) => (cell, date) => { + const value = new Date(date) + + return state.year === value.getFullYear() && state.month === value.getMonth() && Number(cell.text) === value.getDate() +} + +export const getCellRangeClasses = ({ props }) => (cell, classes) => { + if (cell.type === DATEPICKER.Normal || cell.type === DATEPICKER.Today || props.selectionMode === DATEPICKER.Week) { + classes.push(DATEPICKER.InRange) + + if (cell.start) { + classes.push(DATEPICKER.StartDate) + } + + if (cell.end) { + classes.push(DATEPICKER.EndDate) + } + } +} + +export const getCellClasses = ({ api, props, state }) => (cell) => { + let classes = [] + const selectionMode = props.selectionMode + + const defaultValue = props.defaultValue ? (Array.isArray(props.defaultValue) ? props.defaultValue : [props.defaultValue]) : [] + + if ((cell.type === DATEPICKER.Normal || cell.type === DATEPICKER.Today) && !cell.disabled) { + classes.push(DATEPICKER.Aviailable) + + if (cell.type === DATEPICKER.Today) { + classes.push(DATEPICKER.Today) + } + } else { + classes.push(cell.type) + } + + if (cell.type === DATEPICKER.Normal && defaultValue.some((date) => api.cellMatchesDate(cell, date))) { + classes.push(DATEPICKER.Default) + } + + if (selectionMode === DATEPICKER.Day && ~[DATEPICKER.Normal, DATEPICKER.Today].indexOf(cell.type) && api.cellMatchesDate(cell, props.value || state.date)) { + classes.push(DATEPICKER.Current) + } + + if (cell.inRange) { + api.getCellRangeClasses(cell, classes) + } + + if (cell.disabled) { + classes.push(DATEPICKER.Disabled) + } + + if (cell.selected) { + classes.push(DATEPICKER.Selected) + } + + if (cell.customClass) { + classes.push(cell.customClass) + } + + return classes.join(' ') +} + +export const getDateOfCell = ({ props, state }) => (row, column) => { + const offsetFromStart = row * 7 + (column - (props.showWeekNumber ? 1 : 0)) - state.offsetDay + + return nextDate(state.startDate, offsetFromStart) +} + +export const isWeekActive = ({ props, state }) => (cell) => { + if (props.selectionMode !== DATEPICKER.Week) { + return false + } + + const newDate = new Date(state.year, state.month, 1) + const year = newDate.getFullYear() + const month = newDate.getMonth() + + if (cell.type === DATEPICKER.PreMonth) { + newDate.setMonth(month === 0 ? 11 : month - 1) + newDate.setFullYear(month === 0 ? year - 1 : year) + } + + if (cell.type === DATEPICKER.NextMonth) { + newDate.setMonth(month === 11 ? 0 : month + 1) + newDate.setFullYear(month === 11 ? year + 1 : year) + } + + newDate.setDate(parseInt(cell.text, 10)) + + if (isDate(props.value)) { + const dayOffset = ((props.value.getDay() - props.firstDayOfWeek + 7) % 7) - 1 + const weekDate = prevDate(props.value, dayOffset) + + return weekDate.getTime() === newDate.getTime() + } + + return false +} + +export const markRange = ({ props, state }) => (minDate, maxDate) => { + const minDateTimestamp = getDateTimestamp(minDate) + const maxDateTimestamp = getDateTimestamp(maxDate) || minDateTimestamp + + minDate = Math.min(minDateTimestamp, maxDateTimestamp) + maxDate = Math.max(minDateTimestamp, maxDateTimestamp) + + const startDate = state.startDate + const rows = state.rows + + for (let i = 0, k = rows.length; i < k; i++) { + const row = rows[i] + + for (let j = 0, l = row.length; j < l; j++) { + if (!props.showWeekNumber || j !== 0) { + const cell = row[j] + const index = i * 7 + j + (props.showWeekNumber ? -1 : 0) + const time = nextDate(startDate, index - state.offsetDay).getTime() + + cell.inRange = minDate && time >= minDate && time <= maxDate + cell.start = minDate && time === minDate + cell.end = maxDate && time === maxDate + } + } + } +} + +export const handleMouseMove = ({ api, emit, props, state }) => (event) => { + if (!props.rangeState.selecting) { + return + } + + let targetEl = event.target + + if (targetEl.tagName === 'SPAN') { + targetEl = targetEl.parentNode.parentNode + } + + if (targetEl.tagName === 'DIV') { + targetEl = targetEl.parentNode + } + + if (targetEl.tagName !== 'TD') { + return + } + + const row = targetEl.parentNode.rowIndex - 1 + const column = targetEl.cellIndex + + if (state.rows[row][column].disabled) { + return + } + + if (row !== state.lastRow || column !== state.lastColumn) { + state.lastRow = row + state.lastColumn = column + + emit('changerange', { + minDate: props.minDate, + maxDate: props.maxDate, + rangeState: { + selecting: true, + endDate: api.getDateOfCell(row, column) + } + }) + } +} + +const getTarget = (event) => { + let target = event.target + + if (target.tagName === 'SPAN') { + target = target.parentNode.parentNode + } + + if (target.tagName === 'DIV') { + target = target.parentNode + } + + return target +} + +export const removeFromArray = (arr, pred) => { + const idx = typeof pred === 'function' ? arrayFindIndex(arr, pred) : arr.indexOf(pred) + + return idx >= 0 ? [...arr.slice(0, idx), ...arr.slice(idx + 1)] : arr +} + +export const handleClick = ({ api, emit, props, state }) => (event) => { + let target = getTarget(event) + + if (target.tagName !== 'TD') { + return + } + + const row = target.parentNode.rowIndex - 1 + const column = props.selectionMode === DATEPICKER.Week ? 1 : target.cellIndex + const cell = state.rows[row][column] + + if (cell.disabled || cell.type === DATEPICKER.Week) { + return + } + + const newDate = api.getDateOfCell(row, column) + + if (props.selectionMode === DATEPICKER.Range) { + if (!props.rangeState.selecting) { + emit('pick', { minDate: newDate, maxDate: null }) + props.rangeState.selecting = true + } else { + if (newDate >= props.minDate) { + emit('pick', { minDate: props.minDate, maxDate: newDate }) + } else { + emit('pick', { minDate: newDate, maxDate: props.minDate }) + } + + props.rangeState.selecting = false + } + } else if (props.selectionMode === DATEPICKER.Day) { + emit('pick', newDate) + } else if (props.selectionMode === DATEPICKER.Week) { + const weekNumber = getWeekNumber(newDate) + const value = newDate.getFullYear() + 'w' + weekNumber + + emit('pick', { + year: newDate.getFullYear(), + week: weekNumber, + value, + date: newDate + }) + } else if (props.selectionMode === DATEPICKER.Dates) { + const value = props.value || [] + + const newValue = cell.selected ? removeFromArray(value, (date) => date.getTime() === newDate.getTime()) : [...value, newDate] + + emit('pick', newValue) + } +} diff --git a/packages/renderless/src/date-table/vue.ts b/packages/renderless/src/date-table/vue.ts new file mode 100644 index 000000000..b7feaa60d --- /dev/null +++ b/packages/renderless/src/date-table/vue.ts @@ -0,0 +1,93 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + getOffsetDay, + getWeeks, + getRows, + handleClick, + watchMinDate, + watchMaxDate, + cellMatchesDate, + getCellClasses, + getDateOfCell, + isWeekActive, + markRange, + handleMouseMove, + getCellRangeClasses, + getCell +} from './index' +import { getStartDateOfMonth } from '@opentiny/vue-renderless/common/deps/date-util' + +export const api = ['state', 'getCellClasses', 'isWeekActive', 'handleMouseMove', 'handleClick'] + +const initState = ({ reactive, computed, api, props }) => { + const state = reactive({ + tableRows: [[], [], [], [], [], []], + lastRow: null, + lastColumn: null, + constWeeks: ['sun', 'mon', 'tue', 'wed', 'thu', 'fri', 'sat'], + rows: computed(() => api.getRows()), + weeks: computed(() => api.getWeeks()), + month: computed(() => props.date.getMonth()), + offsetDay: computed(() => api.getOffsetDay()), + year: computed(() => props.date.getFullYear()), + startDate: computed(() => getStartDateOfMonth(state.year, state.month)), + date: props.value + }) + + return state +} + +const initApi = ({ api, state, props, emit, t, vm }) => { + Object.assign(api, { + t, + state, + getOffsetDay: getOffsetDay(props), + getWeeks: getWeeks({ props, state }), + markRange: markRange({ props, state }), + cellMatchesDate: cellMatchesDate(state), + getDateOfCell: getDateOfCell({ props, state }), + getCell: getCell({ state, props }), + isWeekActive: isWeekActive({ props, state }), + watchMaxDate: watchMaxDate({ api, props }), + watchMinDate: watchMinDate({ api, props }), + handleMouseMove: handleMouseMove({ api, emit, props, state }), + getRows: getRows({ api, props, state, t, vm }), + handleClick: handleClick({ api, emit, props, state }), + getCellClasses: getCellClasses({ api, props, state }), + getCellRangeClasses: getCellRangeClasses({ props }) + }) +} + +const initWatch = ({ watch, props, api }) => { + watch( + () => props.rangeState, + (value) => api.markRange(props.minDate, value.endDate), + { deep: true } + ) + + watch(() => props.minDate, api.watchMinDate) + + watch(() => props.maxDate, api.watchMaxDate) +} + +export const renderless = (props, { computed, reactive, watch }, { t, vm, emit }) => { + const api = {} + const state = initState({ reactive, computed, api, props }) + + initApi({ api, state, props, emit, t, vm }) + + initWatch({ watch, props, api }) + + return api +} diff --git a/packages/renderless/src/dept/index.ts b/packages/renderless/src/dept/index.ts new file mode 100644 index 000000000..8ba123b47 --- /dev/null +++ b/packages/renderless/src/dept/index.ts @@ -0,0 +1,270 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const setSelectData = ({ state, deptState }) => () => { + const texts = [] + + for (let i = 0; i < deptState.length; i++) { + const value = deptState[i].value + if (value === '') { + break + } + + const options = deptState[i].options + const selectedOp = options.find((op) => op.hrCode === value) + texts.push(selectedOp.hrName) + } + + state.labels = texts +} + +export const setDefaultSearch = ({ api, state }) => () => { + state.searchValue = '' + api.searchMethod() +} + +export const openDialog = ({ props, state, api, emit }) => () => { + if (props.disabled || state.formDisabled) { + return + } + + api.setDefaultSearch() + + state.open = true + emit('open') +} + +const formatJudgCofim = (deptState) => { + let value = '' + + for (let i = 0; i < deptState.length; i++) { + if (deptState[i].value === '') { + break + } + + value = deptState[i].value + } + + return value +} + +export const resetDeptState = (deptState) => (state) => { + const depeStates = state || deptState + + depeStates.forEach((dept) => { + dept.value = '' + dept.options = [] + dept.disable = true + }) +} + +export const getDisplay = ({ api, deptState, state }) => (value) => { + if (value === state.current) { + return + } + + state.current = value + api.resetDeptState() + + if (!value) { + state.display = '' + state.labels = [] + state.lastLabels = [] + state.lastDeptState = deptState.map((item) => ({ ...item })) + + return + } + + api.setDeptState(value, true).then(() => { + api.setSelectData() + + state.lastLabels = state.labels + + const { hrapprover } = state + state.display = hrapprover ? hrapprover.state.approvalPerson : state.labels.join('/') + }) +} + +export const getCurrentList = ({ deptState, api }) => (level, show) => { + if (!show) { + return + } + + const value = level ? deptState[level - 1].value : '' + api.getDeptList({ level, value }) +} + +export const getDeptList = ({ api, state, deptState }) => ({ level, value, auto }) => { + if (level > 8) { + return + } + + const upperCode = level ? value : undefined + state.loading = true + + return api.fetchDeptList(upperCode).then((list) => { + deptState[level].options = list + state.loading = false + + if (list.length) { + deptState[level].disable = false + + if (auto && state.autoSelect && list.length === 1) { + let { hrCode } = list[0] + deptState[level].value = hrCode + api.selectChange({ level, value: hrCode }) + } + } + }) +} + +export const selectChange = ({ emit, api, state, deptState }) => ({ level, value }) => { + api.resetDeptState(deptState.slice(level + 1, 9)) + api.setSelectData() + + const current = formatJudgCofim(deptState) + const { hrapprover } = state + + if (hrapprover) { + emit('selected', current) + } else { + emit('selected', value, level) + } + + if (value) { + api.getDeptList({ level: level + 1, value, auto: true }) + } +} + +export const searchMethod = ({ api, state }) => (query) => { + state.loading = true + + api.fetchDeptByValue(query).then((list) => { + state.searchOptions = list + state.loading = false + }) +} + +export const searchChange = (api) => (value) => { + if (!value) { + return + } + + api.resetDeptState() + api.setDeptState(value).then(() => { + api.setSelectData() + }) +} + +export const confirm = ({ api, props, state }) => () => { + let isClose = true + + if (!props.beforeConfirm) { + isClose = api.doConfirm() + state.open = !isClose + return + } + + if (typeof props.beforeConfirm === 'function') { + const before = props.beforeConfirm() + + if (before && before.then) { + before.then( + () => { + isClose = api.doConfirm() + state.open = !isClose + }, + () => undefined + ) + + return + } + + if (before !== false) { + isClose = api.doConfirm() + state.open = !isClose + } + } +} + +export const closeDialog = (emit) => () => emit('close') + +export const cancel = ({ emit, state, deptState }) => () => { + state.labels = state.lastLabels + deptState.forEach((item, i) => Object.assign(item, state.lastDeptState[i])) + + emit('cancel') + state.open = false +} + +export const initService = ({ props, service }) => { + const { fetchDeptList, fetchDeptByValue, fetchDept } = service || {} + const noopFnCreator = (propName) => () => Promise.reject(new Error(`[TINY Error][Dept] Prop ${propName} is not configured`)) + + return { + fetchDeptList: props.fetchDeptList || fetchDeptList || noopFnCreator('fetchDeptList'), + fetchDeptByValue: props.fetchDeptByValue || fetchDeptByValue || noopFnCreator('fetchDeptByValue'), + fetchDept: props.fetchDept || fetchDept || noopFnCreator('fetchDept') + } +} +export const doConfirm = ({ emit, props, state, deptState }) => () => { + state.current = formatJudgCofim(deptState) + + const { hrapprover } = state + + if (hrapprover) { + if (state.current && !hrapprover.state.approvalPerson) { + hrapprover.showModal() + return false + } else { + state.display = hrapprover.state.approvalPerson + } + } else { + state.display = state.labels.join('/') + } + + state.lastLabels = state.labels + state.lastDeptState = deptState.map((item) => ({ ...item })) + + if (props.modelValue !== state.current) { + emit('change', state.current) + } + emit('update:modelValue', state.current) + emit('confirm', state.current) + + return true +} + +export const setDeptState = ({ api, state, deptState }) => (value, isInit) => + api.fetchDept(value).then((info) => { + for (let i = 0; i < deptState.length; i++) { + const textField = `l${i}_Name` + const valueField = `l${i}_Dept_Code` + + if (info && info[textField]) { + const hrName = info[textField] + const hrCode = info[valueField] + + deptState[i].options.push({ hrName, hrCode }) + deptState[i].value = hrCode + deptState[i].disable = false + } else { + api.getDeptList({ level: i, value, auto: true }).then(() => { + if (isInit) { + state.lastDeptState = deptState.map((item) => ({ ...item })) + } + }) + + break + } + } + }) diff --git a/packages/renderless/src/dept/vue.ts b/packages/renderless/src/dept/vue.ts new file mode 100644 index 000000000..dbfd68afa --- /dev/null +++ b/packages/renderless/src/dept/vue.ts @@ -0,0 +1,110 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + setSelectData, + initService, + openDialog, + setDefaultSearch, + closeDialog, + resetDeptState, + getDisplay, + searchMethod, + getCurrentList, + getDeptList, + selectChange, + searchChange, + confirm, + cancel, + doConfirm, + setDeptState +} from './index' + +export const api = [ + 'select', + 'state', + 'deptState', + 'openDialog', + 'getCurrentList', + 'confirm', + 'searchMethod', + 'searchChange', + 'selectChange', + 'closeDialog', + 'cancel' +] + +const initState = ({ reactive, computed, parent, props, inject, lastDeptState }) => { + const state = reactive({ + lastDeptState, + lastLabels: [], + labels: [], + display: '', + open: false, + loading: false, + searchValue: '', + searchOptions: [], + current: '', + formDisabled: computed(() => (parent.tinyForm || {}).disabled), + disabled: props.disabled, + autoSelect: props.autoSelect, + hrapprover: inject('hrapprover', null) + }) + + return state +} + +const initApi = ({ api, state, deptState, emit, $service, props }) => { + Object.assign(api, { + state, + deptState, + closeDialog: closeDialog(emit), + resetDeptState: resetDeptState(deptState), + fetchDept: $service.fetchDept, + fetchDeptList: $service.fetchDeptList, + fetchDeptByValue: $service.fetchDeptByValue, + setSelectData: setSelectData({ deptState, state }), + cancel: cancel({ emit, state, deptState }), + doConfirm: doConfirm({ emit, props, state, deptState }), + searchChange: searchChange(api), + searchMethod: searchMethod({ api, state }), + openDialog: openDialog({ api, emit, props, state }), + selectChange: selectChange({ api, emit, state, deptState }), + setDefaultSearch: setDefaultSearch({ api, state }), + getCurrentList: getCurrentList({ api, deptState }), + confirm: confirm({ api, props, state }), + getDeptList: getDeptList({ api, deptState, state }), + getDisplay: getDisplay({ api, deptState, state }), + setDeptState: setDeptState({ api, state, deptState }) + }) +} + +export const renderless = (props, { onBeforeUnmount, reactive, watch, inject, computed }, { service, emit, parent }) => { + parent.tinyForm = parent.tinyForm || inject('form', null) + + const api = {} + const $service = initService({ props, service }) + const deptLevels = ['company', 'dept1', 'dept2', 'dept3', 'dept4', 'dept5', 'dept6', 'dept7', 'dept8'] + const deptState = deptLevels.map((title) => reactive({ title, options: [], value: '', disable: true })) + const lastDeptState = deptLevels.map((title) => reactive({ title, options: [], value: '', disable: true })) + const state = initState({ reactive, computed, parent, props, inject, lastDeptState }) + + initApi({ api, state, deptState, emit, $service, props }) + + watch(() => props.modelValue, api.getDisplay, { immediate: true }) + + onBeforeUnmount(() => { + state.open = false + }) + + return api +} diff --git a/packages/renderless/src/detail-page/index.ts b/packages/renderless/src/detail-page/index.ts new file mode 100644 index 000000000..c06c177a2 --- /dev/null +++ b/packages/renderless/src/detail-page/index.ts @@ -0,0 +1,89 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const computedCancel = ({ constants, props, t }) => () => props.cancelButton || t(constants.CANCEL_BUTTTON_TEXT) + +export const computedconfirm = ({ constants, props, t }) => () => props.saveButton || t(constants.SAVE_BUTTON_TEXT) + +export const computedSetLocalTips = ({ constants, props, t }) => () => props.tips || t(constants.LOCAL_TIPS) + +export const computedSetValueTitle = ({ constants, props, t }) => () => props.valueTitle || t(constants.VALUE_TITLE) + +export const computedSetLocalTitle = ({ constants, props, t }) => () => props.title || t(constants.LOCAL_TITLE) + +export const computedSetLabelTitle = ({ constants, props, t }) => () => props.labelTitle || t(constants.LABEL_TITLE) + +export const computedSetDialogTitle = ({ constants, props, t }) => () => props.dialogTitle || t(constants.DIALOG_TITLE) + +export const showDialog = (state) => () => { + state.isShowDialog = true + + state.cloneValue = state.value.map((item) => { + if (item.hidden != undefined) { + return { ...item } + } else { + return { ...item, hidden: false } + } + }) +} + +export const closeDialog = (state) => () => { + state.isShowDialog = false +} + +export const checkAllHander = (state) => () => + (state.cloneValue = state.cloneValue.map((item) => ({ + ...item, + hidden: state.checkAll + }))) + +export const checkValueHiddenItem = (state) => (index) => { + let hiddenItemCount = 0 + if (typeof index === 'number') { + state.cloneValue[index].hidden = !state.cloneValue[index].hidden + } + state.cloneValue.forEach((item) => { + if (item.hidden) { + ++hiddenItemCount + } + }) + + if (hiddenItemCount > 0 && hiddenItemCount < state.cloneValue.length) { + state.checkAll = false + return true + } else if (hiddenItemCount === 0) { + state.checkAll = false + return false + } else if (hiddenItemCount === state.cloneValue.length) { + state.checkAll = true + return false + } +} + +export const saveHandler = ({ emit, state, alert }) => () => { + if (state.checkAll) { + alert({ message: state.tips, title: '', status: 'warning' }) + emit('saveWarning') + return + } + + state.value = state.cloneValue + state.isShowDialog = false +} + +export const watchValue = (state) => (value) => { + state.value = value +} + +export const watchTextSplit = (state) => (value) => { + state.textSplit = value +} diff --git a/packages/renderless/src/detail-page/vue.ts b/packages/renderless/src/detail-page/vue.ts new file mode 100644 index 000000000..eaf9c87c6 --- /dev/null +++ b/packages/renderless/src/detail-page/vue.ts @@ -0,0 +1,86 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + watchTextSplit, + watchValue, + showDialog, + saveHandler, + checkAllHander, + checkValueHiddenItem, + closeDialog, + computedCancel, + computedconfirm, + computedSetLocalTips, + computedSetValueTitle, + computedSetLocalTitle, + computedSetLabelTitle, + computedSetDialogTitle +} from './index' + +export const api = ['state', 'valueChange', 'showDialog', 'closeDialog', 'checkAllHander', 'saveHandler', 'checkValueHiddenItem'] + +const initState = ({ reactive, computed, api, props }) => { + const state = reactive({ + value: props.modelValue, + cloneValue: props.modelValue, + textSplit: props.textSplit, + isShowDialog: false, + checkAll: false, + indeterminate: computed(() => api.checkValueHiddenItem()), + tips: computed(() => api.computedSetLocalTips()), + saveButton: computed(() => api.computedconfirm()), + cancelButton: computed(() => api.computedCancel()), + title: computed(() => api.computedSetLocalTitle()), + labelTitle: computed(() => api.computedSetLabelTitle()), + valueTitle: computed(() => api.computedSetValueTitle()), + dialogTitle: computed(() => api.computedSetDialogTitle()) + }) + + return state +} + +const initApi = ({ api, state, emit, alert, constants, props, t }) => { + Object.assign(api, { + state, + watchValue: watchValue(state), + showDialog: showDialog(state), + closeDialog: closeDialog(state), + watchTextSplit: watchTextSplit(state), + checkAllHander: checkAllHander(state), + saveHandler: saveHandler({ emit, state, alert }), + checkValueHiddenItem: checkValueHiddenItem(state), + computedCancel: computedCancel({ constants, props, t }), + computedconfirm: computedconfirm({ constants, props, t }), + computedSetLocalTips: computedSetLocalTips({ constants, props, t }), + computedSetValueTitle: computedSetValueTitle({ constants, props, t }), + computedSetLocalTitle: computedSetLocalTitle({ constants, props, t }), + computedSetLabelTitle: computedSetLabelTitle({ constants, props, t }), + computedSetDialogTitle: computedSetDialogTitle({ api, constants, props, t }) + }) +} + +const initWatch = ({ watch, props, api }) => { + watch(() => props.modelValue, api.watchValue, { immediate: true }) + watch(() => props.textSplit, api.watchTextSplit, { immediate: true }) +} + +export const renderless = (props, { computed, reactive, watch }, { t, emit, constants }, { alert }) => { + const api = {} + const state = initState({ reactive, computed, api, props }) + + initApi({ api, state, emit, alert, constants, props, t }) + + initWatch({ watch, props, api }) + + return api +} diff --git a/packages/renderless/src/dialog-box/index.ts b/packages/renderless/src/dialog-box/index.ts new file mode 100644 index 000000000..f8766efc3 --- /dev/null +++ b/packages/renderless/src/dialog-box/index.ts @@ -0,0 +1,261 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { on, off, addClass, removeClass } from '@opentiny/vue-renderless/common/deps/dom' +import { emitEvent } from '@opentiny/vue-renderless/common/event' +import { getDomNode } from '@opentiny/vue-renderless/common/deps/dom' + +export const computedAnimationName = ({ constants, props }) => () => (props.rightSlide ? constants.DIALOG_SLIDER_RIGHT : constants.DIALOG_FADE) + +export const computedAddUnit = (value) => (isNaN(Number(value)) ? value : value + 'px') + +export const computedStyle = ({ props, state }) => () => { + const style = {} + let { width, top, rightSlide } = props + + if (top === undefined) { + top = rightSlide ? '0' : '15vh' + } + + width = computedAddUnit(width) + top = computedAddUnit(top) + + if (!state.isFull) { + style.width = width + style.top = top + + if (rightSlide) { + style.right = 0 + style.height = 'calc(100vh - ' + style.top + ')' + } else { + style.left = 'calc((100vw - ' + width + ') / 2)' + } + } + + return style +} + +export const watchVisible = ({ api, constants, emit, nextTick, parent, props, refs, state }) => (val) => { + const el = parent.$el + + if (props.lockScroll) { + val ? api.showScrollbar() : api.hideScrollbar() + } + + state.move = false + state.isFull = props.fullscreen + + emit('update:visible', val) + + if (val) { + state.closed = false + emit('open') + /* istanbul ignore next */ + on(el, 'scroll', api.updatePopper) + + nextTick(() => { + refs.dialog.scrollTop = 0 + }) + + if (props.appendToBody) { + document.body.appendChild(el) + } + } else { + /* istanbul ignore next */ + off(el, 'scroll', api.updatePopper) + + if (!state.closed) { + state.emitter.emit('boxclose', props.isFormReset) + emit('close') + } + + if (props.destroyOnClose) { + nextTick(() => state.key++) + } + + if (props.rightSlide) { + const dialogBoxDom = el.querySelector(constants.DIALOG_BOX_CLASS) || el + dialogBoxDom.style.left = '' + } + } +} + +export const mounted = ({ api, parent, props }) => () => { + if (props.lockScroll && props.visible) { + api.showScrollbar() + } + + if (props.visible) { + const el = parent.$el + + api.open() + + if (props.appendToBody) { + document.body.appendChild(el) + } + } +} + +export const unMounted = ({ api, parent, props }) => () => { + const el = parent.$el + + api.hideScrollbar() + + if (props.appendToBody && el && el.parentNode) { + el.parentNode.removeChild(el) + } +} + +export const handleWrapperClick = ({ api, props }) => () => { + if (!props.closeOnClickModal) { + return + } + + api.handleClose('mask') +} + +export const handleClose = ({ api, constants, emit, parent, props }) => (type = 'close') => { + if (typeof props.beforeClose === 'function' && props.beforeClose(type) === false) { + return + } + + const el = parent.$el + + if (props.rightSlide) { + const dialogBoxDom = el.querySelector(constants.DIALOG_BOX_CLASS) || el + dialogBoxDom.style.left = '' + } + + if (!emitEvent(emit, 'before-close', api.hide)) { + return + } + + api.hide() +} + +export const hide = ({ api, emit, state, props }) => (cancel) => { + if (cancel !== false) { + state.emitter.emit('boxclose', props.isFormReset) + + emit('update:visible', false) + emit('change', false) + emit('close') + + state.closed = true + api.hideScrollbar() + } +} + +export const handleConfirm = ({ api, emit }) => () => { + emit('confirm') + api.handleClose() +} + +export const handleCancel = ({ api, emit }) => () => { + emit('cancel') + api.handleClose() +} + +export const updatePopper = ({ api, constants }) => () => { + api.broadcast(constants.SELECT_DROPDOWN, 'updatePopper') + api.broadcast(constants.DROPDOWN_MENU, 'updatePopper') +} + +export const afterEnter = (emit) => () => { + emit('opened') +} + +export const afterLeave = (emit) => () => { + emit('closed') +} + +const findPopoverComponent = ({ vm, componentList }) => { + const children = vm.$children + + if (!children || children.length === 0) { + return + } + + children.forEach((child) => { + const tag = child.$options.componentName + + if (tag === 'Select') { + componentList.push(child) + } + + findPopoverComponent({ vm: child, componentList }) + }) + + return componentList +} + +const closeAllPopover = (parent) => { + findPopoverComponent({ vm: parent, componentList: [] }).forEach((component) => { + component.state.visible = false + }) +} + +export const handleDrag = ({ parent, props, state, emit }) => (event) => { + if (!props.draggable) { + return + } + + let modalBoxElem = parent.$el.querySelector('.tiny-dialog-box') + event.preventDefault() + + let demMousemove = document.onmousemove + let demMouseup = document.onmouseup + let disX = event.clientX - modalBoxElem.offsetLeft + let disY = event.clientY - modalBoxElem.offsetTop + let { visibleHeight, visibleWidth } = getDomNode() + + document.onmousemove = (event) => { + event.preventDefault() + + if (!state.move) { + emit('drag-start', event) + closeAllPopover(parent) + state.move = true + } + + let offsetWidth = modalBoxElem.offsetWidth + let offsetHeight = modalBoxElem.offsetHeight + let maxX = visibleWidth - offsetWidth + let maxY = visibleHeight - offsetHeight + let left = event.clientX - disX + let top = event.clientY - disY + + left = left < 0 ? 0 : left > maxX ? maxX : left + top = top < 0 ? 0 : top > maxY ? maxY : top + + modalBoxElem.style.left = `${left}px` + modalBoxElem.style.top = `${top}px` + + state.emitter.emit('boxdrag') + emit('drag-move', event) + } + + document.onmouseup = () => { + document.onmousemove = demMousemove + document.onmouseup = demMouseup + state.move = false + props.draggable && emit('drag-end', event) + } +} + +export const showScrollbar = (lockScrollClass) => () => { + addClass(document.body, lockScrollClass) +} + +export const hideScrollbar = (lockScrollClass) => () => { + removeClass(document.body, lockScrollClass) +} diff --git a/packages/renderless/src/dialog-box/vue.ts b/packages/renderless/src/dialog-box/vue.ts new file mode 100644 index 000000000..89292f285 --- /dev/null +++ b/packages/renderless/src/dialog-box/vue.ts @@ -0,0 +1,165 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { + afterEnter, + afterLeave, + computedAnimationName, + computedStyle, + handleConfirm, + handleCancel, + watchVisible, + hide, + handleClose, + handleWrapperClick, + mounted, + unMounted, + updatePopper, + handleDrag, + showScrollbar, + hideScrollbar +} from './index' +import usePopup from '@opentiny/vue-renderless/common/deps/vue-popup' + +export const api = ['afterEnter', 'afterLeave', 'handleClose', 'handleWrapperClick', 'handleCancel', 'handleConfirm', 'handleDrag', 'state'] + +const initState = ({ reactive, computed, api, emitter, props }) => { + const state = reactive({ + emitter: emitter(), + key: 0, + x: null, + y: null, + top: null, + left: null, + max: null, + move: false, + closed: false, + dragable: null, + isFull: props.fullscreen, + style: computed(() => api.computedStyle()), + animationName: computed(() => api.computedAnimationName()) + }) + + return state +} + +const mergeState = ({ reactive, state, toRefs, usePopups }) => { + const { bodyPaddingRight, computedBodyPaddingRight, opened, rendered, withoutHiddenClass } = usePopups + + const merge = reactive({ + bodyPaddingRight, + computedBodyPaddingRight, + opened, + rendered, + withoutHiddenClass, + ...toRefs(state) + }) + + return merge +} + +const initApi = ({ emit, api, state, parent, props, lockScrollClass, constants, usePopups, nextTick, refs, broadcast }) => { + const { open, close, doOpen, doClose } = usePopups + const { doAfterOpen, doAfterClose, restoreBodyStyle } = usePopups + Object.assign(api, { + state, + open, + close, + doOpen, + doClose, + doAfterOpen, + doAfterClose, + restoreBodyStyle, + broadcast, + handleCancel: handleCancel({ api, emit }), + handleConfirm: handleConfirm({ api, emit }), + updatePopper: updatePopper({ api, constants }), + handleWrapperClick: handleWrapperClick({ api, props }), + hide: hide({ api, emit, state, props }), + handleClose: handleClose({ api, constants, emit, parent, props }), + watchVisible: watchVisible({ + api, + constants, + emit, + nextTick, + parent, + props, + refs, + state + }), + computedStyle: computedStyle({ state, props }), + mounted: mounted({ api, parent, props }), + unMounted: unMounted({ api, parent, props }), + computedAnimationName: computedAnimationName({ constants, props }), + afterEnter: afterEnter(emit), + afterLeave: afterLeave(emit), + hideScrollbar: hideScrollbar(lockScrollClass), + showScrollbar: showScrollbar(lockScrollClass), + handleDrag: handleDrag({ parent, props, state, emit }) + }) +} + +const initWatch = ({ watch, state, api, props }) => { + watch(() => props.visible, api.watchVisible) + + watch( + () => props.fullscreen, + (value) => { + state.isFull = value + } + ) +} + +export const renderless = ( + props, + { computed, onBeforeUnmount, onMounted, toRefs, reactive, watch }, + { vm, emitter, parent, emit, constants, nextTick, refs, mode, broadcast } +) => { + const api = {} + const lockScrollClass = constants.scrollLockClass(mode) + let state = initState({ reactive, computed, api, emitter, props }) + const usePopups = usePopup({ + api, + nextTick, + onBeforeUnmount, + onMounted, + props, + reactive, + state, + toRefs, + vm, + watch + }) + + initApi({ + api, + state, + parent, + props, + emit, + constants, + usePopups, + lockScrollClass, + nextTick, + refs, + broadcast + }) + + state = mergeState({ reactive, state, toRefs, usePopups }) + + initWatch({ watch, state, api, props }) + + onMounted(api.mounted) + onBeforeUnmount(api.unMounted) + + return api +} diff --git a/packages/renderless/src/drop-roles/index.ts b/packages/renderless/src/drop-roles/index.ts new file mode 100644 index 000000000..1f0b8ab6a --- /dev/null +++ b/packages/renderless/src/drop-roles/index.ts @@ -0,0 +1,69 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const init = ({ state, service, emit }) => () => { + let promise + const { textField, valueField } = service.fields + + if (state.source) { + promise = new Promise((resolve) => resolve(state.source)) + } else { + promise = Promise.all([service.fetchRole(), service.fetchCurrentRole()]).then((result) => { + const [validRoles, currentRole] = result + + if (validRoles) { + state.source = validRoles + + if (currentRole && currentRole[valueField]) { + state.selectedValue = currentRole[valueField] + emit('update:modelValue', state.selectedValue) + } + } else { + state.source = [] + } + + return state.source + }) + } + + promise.then((data) => { + state.options = data.map((item) => ({ + label: item[textField], + value: item[valueField] + })) + + emit('render', state.options, state.selectedValue) + }) +} + +export const change = (emit) => (value) => { + emit('update:modelValue', value) + emit('change', value) +} + +export const initService = ({ props, service }) => { + const { setting = {}, fetchRole, fetchCurrentRole } = service || {} + const { options = {} } = setting + + const noopFnCreator = (propName) => () => Promise.reject(new Error(`[TINY Error][DropRoles] Prop ${propName} is not configured`)) + + const defaultDropRolesSetting = { + textField: 'roleName', + valueField: 'roleId' + } + + return { + fetchRole: props.fetchRole || fetchRole || noopFnCreator('fetchRole'), + fetchCurrentRole: props.fetchCurrentRole || fetchCurrentRole || noopFnCreator('fetchCurrentRole'), + fields: props.fields || options.DropRoles || defaultDropRolesSetting + } +} diff --git a/packages/renderless/src/drop-roles/vue.ts b/packages/renderless/src/drop-roles/vue.ts new file mode 100644 index 000000000..446fe960b --- /dev/null +++ b/packages/renderless/src/drop-roles/vue.ts @@ -0,0 +1,44 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { init, change, initService } from './index' + +export const api = ['state', 'change'] + +export const renderless = (props, { onMounted, reactive, watch }, { parent, emit, service }) => { + const $service = initService({ props, service }) + + const state = reactive({ + options: [], + source: null, + selectedValue: props.modelValue, + attrs: parent.$attr + }) + + watch( + () => props.modelValue, + (value) => { + state.selectedValue = value + }, + { immediate: true } + ) + + const api = { + state, + change: change(emit), + init: init({ state, service: $service, emit }) + } + + onMounted(api.init) + + return api +} diff --git a/packages/renderless/src/drop-times/index.ts b/packages/renderless/src/drop-times/index.ts new file mode 100644 index 000000000..8b36c2bf4 --- /dev/null +++ b/packages/renderless/src/drop-times/index.ts @@ -0,0 +1,34 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { format } from '@opentiny/vue-renderless/common/date' + +export const init = ({ state, props }) => () => { + let list = [] + let value + + for (let minutes = props.start; minutes <= props.end; minutes += props.step) { + value = format(new Date(0, 0, 0, 0, minutes, 0), 'hh:mm') + + list.push({ + label: value, + value + }) + } + + state.options = list +} + +export const change = (emit) => (value) => { + emit('update:modelValue', value) + emit('change', value) +} diff --git a/packages/renderless/src/drop-times/vue.ts b/packages/renderless/src/drop-times/vue.ts new file mode 100644 index 000000000..578e4cf88 --- /dev/null +++ b/packages/renderless/src/drop-times/vue.ts @@ -0,0 +1,37 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { init, change } from './index' + +export const api = ['state', 'change'] + +export const renderless = (props, { onMounted, reactive, watch }, { emit }) => { + const state = reactive({ + options: [], + selectedValue: props.modelValue + }) + + watch( + () => props.modelValue, + (newValue) => (state.selectedValue = newValue) + ) + + const api = { + state, + change: change(emit), + init: init({ state, props, emit }) + } + + onMounted(api.init) + + return api +} diff --git a/packages/renderless/src/dropdown-item/index.ts b/packages/renderless/src/dropdown-item/index.ts new file mode 100644 index 000000000..f76a7da15 --- /dev/null +++ b/packages/renderless/src/dropdown-item/index.ts @@ -0,0 +1,139 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' + +export const getTitle = (props) => () => { + if (props.title) { + return props.title + } + + const match = props.options.filter((option) => option.value === props.modelValue) + + return match.length ? match[0].text : '' +} + +export const bindScroll = ({ api, parent }) => (value) => { + const action = value ? on : off + action(parent.state.scroller, 'scroll', api.onScroll, true) +} + +export const toggle = ({ parent, props, state }) => (show) => { + if (show === state.showPopup) { + return + } + + state.transition = !props.options.immediate + state.showPopup = show + + if (show) { + parent.updateOffset() + state.showWrapper = true + } +} + +export const onScroll = (parent) => () => parent.updateOffset() + +export const clickWrapper = (parent) => (event) => parent.$el && event.stopPropagation() + +export const clickItem = ({ emit, props, state }) => (value) => { + state.showPopup = false + + if (value !== props.modelValue) { + emit('update:modelValue', value) + emit('change', value) + } +} + +export const getItemStyle = ({ parent, state }) => () => ({ + zIndex: parent.zIndex, + top: parent.direction === 'down' ? state.offset + 'px' : '', + bottom: parent.direction !== 'down' ? state.offset + 'px' : '' +}) + +export const getOptionStyle = (state) => (tag, tags) => { + if (tags.includes(tag.value)) { + return { + color: state.activeColor ? state.activeColor : '#f36f64', + border: `1px solid ${state.activeColor ? state.activeColor : '#f36f64'}` + } + } else { + return { + color: '#333' + } + } +} + +export const closed = ({ emit, state }) => () => { + state.showWrapper = false + emit('closed') +} + +export const open = (emit) => () => emit('open') + +export const opened = (emit) => () => emit('opened') + +export const close = (emit) => () => emit('close') + +export const tagClick = ({ emit, props }) => (key, tag, event) => { + event.preventDefault() + event.stopPropagation() + + const filterValue = props.modelValue.slice() + const value = filterValue[key] + const index = value.indexOf(tag.value) + + if (index === -1) { + value.push(tag.value) + } else { + value.splice(index, 1) + } + + filterValue[key] = value + emit('update:modelValue', filterValue) +} + +export const confirm = ({ emit, props, state }) => () => { + state.showPopup = false + emit('confirm', props.modelValue) +} + +export const reset = ({ emit, props }) => () => { + const len = props.modelValue.length + const array = [] + + for (let i = 0; i < len; i++) { + array.push([]) + } + + emit('update:modelValue', array) + emit('reset', array) +} + +export const clickOutside = (parent) => () => { + if (parent.closeOnClickOutside && parent.closeOnClickOverlay) { + parent.state.children.forEach((item) => { + item.toggle(false) + }) + } +} + +export const handleClick = ({ props, dispatch, vm, emit }) => (event) => { + // 此处需要手动阻止事件冒泡,如果使用@click.sotp在vue2.x下会导致在自循环组件(dropdown-item)事件绑定错乱 + event.stopPropagation() + + const data = { itemData: props.itemData, vm } + + emit('item-click', data) + // 此处需要传递一个对象,如果是数组[param1,param2],会导致vue2和vue3的表现形式不一样 + dispatch('TinyDropdown', 'menu-item-click', data) +} diff --git a/packages/renderless/src/dropdown-item/vue.ts b/packages/renderless/src/dropdown-item/vue.ts new file mode 100644 index 000000000..dfa843815 --- /dev/null +++ b/packages/renderless/src/dropdown-item/vue.ts @@ -0,0 +1,112 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { + tagClick, + confirm, + clickOutside, + getOptionStyle, + reset, + getTitle, + bindScroll, + toggle, + onScroll, + open, + opened, + close, + closed, + clickItem, + clickWrapper, + getItemStyle, + handleClick +} from './index' + +export const api = [ + 'state', + 'confirm', + 'clickOutside', + 'getOptionStyle', + 'reset', + 'tagClick', + 'clickItem', + 'clickWrapper', + 'toggle', + 'open', + 'opened', + 'close', + 'closed', + 'handleClick' +] + +const initState = ({ reactive, computed, api, props, parent, dropdownMenu }) => { + const state = reactive({ + sort: props.modelValue, + transition: true, + getTitle: false, + showWrapper: false, + showPopup: false, + duration: parent.duration, + overlay: computed(() => parent.overlay), + offset: computed(() => parent.state.offset), + direction: computed(() => parent.direction), + displayTitle: computed(() => api.getTitle()), + itemStyle: computed(() => api.getItemStyle()), + activeColor: computed(() => parent.activeColor), + closeOnClickOverlay: computed(() => parent.closeOnClickOverlay), + children: [], + textField: dropdownMenu?.textField || props.textField, + popperClass: dropdownMenu?.popperClass || '' + }) + + return state +} + +const initApi = ({ api, state, emit, props, parent, dispatch, vm }) => { + Object.assign(api, { + state, + open: open(emit), + opened: opened(emit), + close: close(emit), + getTitle: getTitle(props), + onScroll: onScroll(parent), + reset: reset({ emit, props }), + closed: closed({ emit, state }), + clickWrapper: clickWrapper(parent), + clickOutside: clickOutside(parent), + tagClick: tagClick({ emit, props }), + getOptionStyle: getOptionStyle(state), + toggle: toggle({ parent, props, state }), + clickItem: clickItem({ emit, props, state }), + getItemStyle: getItemStyle({ parent, state }), + bindScroll: bindScroll({ api, parent }), + confirm: confirm({ emit, props, state }), + handleClick: handleClick({ props, dispatch, vm, emit }) + }) +} + +export const renderless = (props, { computed, reactive, watch, inject }, { parent, emit, vm, dispatch, mode }) => { + const api = {} + const dropdownMenu = inject('dropdownMenu', null) + + if (mode === 'mobile') { + dropdownMenu.state.children = [...dropdownMenu.state.children, vm] + } + parent = parent.$parent + + const state = initState({ reactive, computed, api, props, parent, dropdownMenu }) + + initApi({ api, state, emit, props, parent, dispatch, vm }) + + watch(() => state.showPopup, api.bindScroll) + + return api +} diff --git a/packages/renderless/src/dropdown-menu/index.ts b/packages/renderless/src/dropdown-menu/index.ts new file mode 100644 index 000000000..b536010fb --- /dev/null +++ b/packages/renderless/src/dropdown-menu/index.ts @@ -0,0 +1,147 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import userPopper from '@opentiny/vue-renderless/common/deps/vue-popper' + +export const toggleItem = (state) => (active, item) => { + if (item.disabled) { + return + } + + if (item.type == 'sort') { + if (!item.modelValue || item.modelValue === 'desc') { + item.state.sort = 'asc' + item.$emit('update:modelValue', 'asc') + item.$emit('click', 'asc') + } else { + item.state.sort = 'desc' + item.$emit('update:modelValue', 'desc') + item.$emit('click', 'desc') + } + } else { + const singleton = state.children.length === 1 && item.state.showPopup + + state.children.forEach((item, index) => { + if (index === active && !singleton) { + item.toggle(true) + } else if (item.state.showPopup) { + item.toggle(false, { immediate: true }) + } + }) + } +} + +export const updateOffset = ({ props, state, refs }) => () => { + if (!refs.menu) { + return + } + + const rect = refs.menu.getBoundingClientRect() + + if (props.direction === 'down') { + state.offset = rect.bottom + } else { + state.offset = window.innerHeight - rect.top + } +} + +export const clickOutside = ({ props, state }) => () => { + if (props.closeOnClickOutside && props.closeOnClickOverlay) { + state.children.forEach((item) => { + item.type !== 'filter' && item.toggle(false) + }) + } +} + +export const getScroller = (el, root) => { + const overflowScrollReg = /scroll|auto/i + let node = el + let getComputedStyle = window.getComputedStyle + + while (node && node.tagName !== 'HTML' && node.nodeType === 1 && node !== root) { + const { overflowY } = getComputedStyle(node) + + if (overflowScrollReg.test(overflowY)) { + if (node.tagName !== 'BODY') { + return node + } + + const { overflowY: htmlOverflowY } = getComputedStyle(node.parentNode) + + if (overflowScrollReg.test(htmlOverflowY)) { + return node + } + } + + node = node.parentNode + } + + return root +} + +export const useVuePopper = ({ api, props, hooks, instance, state }) => { + const { inject, nextTick, onBeforeUnmount, onDeactivated, onMounted, reactive, toRefs, watch } = hooks + const { emit, refs, slots, vm, parent } = instance + const dropdown = inject('dropdown') + + const popper = userPopper({ + emit, + nextTick, + onBeforeUnmount, + onDeactivated, + props: { + popperOptions: { boundariesPadding: 0, gpuAcceleration: false }, + offset: 0, + boundariesPadding: 5, + ...props + }, + reactive, + refs, + slots, + toRefs, + watch + }) + + onMounted(() => { + dropdown.popperElm = popper.popperElm.value = vm.$el + popper.referenceElm.value = dropdown.$el + dropdown.initDomOperation() + }) + + onBeforeUnmount(() => { + popper.destroyPopper('remove') + popper.popperElm = null + popper.referenceElm = null + }) + + api.doDestroy = popper.doDestroy + state.size = dropdown.size + state.showPopper = popper.showPopper.value + + parent.$on('updatePopper', () => { + if (state.showPopper) { + popper.updatePopper() + } + }) + + parent.$on('visible', (value) => { + state.showPopper = value + popper.showPopper.value = value + }) + + watch( + () => props.placement, + (value) => { + popper.currentPlacement.value = value + } + ) +} diff --git a/packages/renderless/src/dropdown-menu/vue.ts b/packages/renderless/src/dropdown-menu/vue.ts new file mode 100644 index 000000000..00e20f70e --- /dev/null +++ b/packages/renderless/src/dropdown-menu/vue.ts @@ -0,0 +1,46 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { toggleItem, updateOffset, clickOutside, getScroller, useVuePopper } from './index' + +export const api = ['state', 'toggleItem', 'updateOffset', 'clickOutside', 'doDestroy'] + +export const renderless = (props, hooks, instance) => { + const api = {} + const { reactive, provide } = hooks + const { refs, nextTick, mode, vm } = instance + const state = reactive({ + offset: 0, + scroller: null, + children: [], + size: '', + showPopper: false + }) + + if (mode === 'mobile') { + provide('dropdownMenu', vm) + nextTick(() => { + state.scroller = getScroller(refs.menu) + }) + } else { + useVuePopper({ api, hooks, props, instance, state }) + } + + Object.assign(api, { + state, + toggleItem: toggleItem(state), + clickOutside: clickOutside({ props, refs, state }), + updateOffset: updateOffset({ props, state, refs }) + }) + + return api +} diff --git a/packages/renderless/src/dropdown/index.ts b/packages/renderless/src/dropdown/index.ts new file mode 100644 index 000000000..7b2a680b4 --- /dev/null +++ b/packages/renderless/src/dropdown/index.ts @@ -0,0 +1,237 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { KEY_CODE } from '@opentiny/vue-renderless/common' +import { addClass, removeClass, on, off } from '@opentiny/vue-renderless/common/deps/dom' + +export const watchVisible = ({ broadcast, emit, nextTick }) => (value) => { + broadcast('TinyDropdownMenu', 'visible', value) + + /** + * 此处必须延时处理,不然 Vue3 环境下会从 nextTick 冒出一个错误: + * + * Uncaught (in promise) TypeError: Cannot read properties of null (reading 'length') + * + * 场景:visible-change 事件中,使用 Modal 静态方法 + */ + + nextTick(() => emit('visible-change', value)) +} + +export const watchFocusing = ({ parent }) => (value) => { + const selfDefine = parent.$el.querySelector('.tiny-dropdown-selfdefine') + + if (selfDefine) { + value ? addClass(selfDefine, 'focusing') : removeClass(selfDefine, 'focusing') + } +} + +export const show = ({ props, state }) => () => { + if (props.disabled) { + return + } + + clearTimeout(state.timeout) + + state.timeout = setTimeout( + () => { + state.visible = true + }, + props.trigger === 'click' ? 0 : props.showTimeout + ) +} + +export const hide = ({ api, props, state }) => () => { + if (props.disabled) { + return + } + + api.removeTabindex() + + if (props.tabindex >= 0) { + api.resetTabindex(state.triggerElm) + } + + clearTimeout(state.timeout) + + state.timeout = setTimeout( + () => { + state.visible = false + }, + props.trigger === 'click' ? 0 : props.hideTimeout + ) +} + +export const handleClick = ({ api, props, state, emit }) => () => { + if (props.disabled) { + return + } + + emit('handle-click', state.visible) + + state.visible ? api.hide() : api.show() +} + +export const handleTriggerKeyDown = ({ api, state }) => (event) => { + const keyCode = event.keyCode + + if (~[KEY_CODE.ArrowUp, KEY_CODE.ArrowDown].indexOf(keyCode)) { + api.removeTabindex() + api.resetTabindex(state.menuItems[0]) + state.menuItems[0].focus() + + event.preventDefault() + event.stopPropagation() + } else if (keyCode === KEY_CODE.Enter) { + api.handleClick() + } else if (~[KEY_CODE.Tab, KEY_CODE.Escape].indexOf(keyCode)) { + api.hide() + } +} + +export const handleItemKeyDown = ({ api, props, state }) => (event) => { + const keyCode = event.keyCode + const target = event.target + const currentIndex = state.menuItemsArray.indexOf(target) + const max = state.menuItemsArray.length - 1 + + let nextIndex + + if (~[KEY_CODE.ArrowUp, KEY_CODE.ArrowDown].indexOf(keyCode)) { + if (keyCode === KEY_CODE.ArrowUp) { + nextIndex = currentIndex !== 0 ? currentIndex - 1 : 0 + } else { + nextIndex = currentIndex < max ? currentIndex + 1 : max + } + + api.removeTabindex() + api.resetTabindex(state.menuItems[nextIndex]) + state.menuItems[nextIndex].focus() + + event.preventDefault() + event.stopPropagation() + } else if (keyCode === KEY_CODE.Enter) { + api.triggerElmFocus() + + target.click() + + if (props.hideOnClick) { + state.visible = false + } + } else if (~[KEY_CODE.Tab, KEY_CODE.Escape].indexOf(keyCode)) { + api.hide() + api.triggerElmFocus() + } +} + +export const resetTabindex = ({ api }) => (el) => { + api.removeTabindex() + + el.setAttribute('tabindex', '0') +} + +export const removeTabindex = ({ state }) => () => { + state.triggerElm.setAttribute('tabindex', '-1') + state.menuItemsArray.forEach((item) => { + item.setAttribute('tabindex', '-1') + }) +} + +export const initAria = ({ state, props }) => () => { + state.dropdownElm.setAttribute('id', state.listId) + state.triggerElm.setAttribute('aria-haspopup', 'list') + state.triggerElm.setAttribute('aria-controls', state.listId) + + if (!props.splitButton) { + state.triggerElm.setAttribute('role', 'button') + state.triggerElm.setAttribute('tabindex', props.tabindex) + addClass(state.triggerElm, 'tiny-dropdown-selfdefine') + } +} + +const toggleFocus = ({ state, value }) => () => { + state.focusing = value +} + +export const initEvent = ({ api, props, state, vm }) => () => { + state.triggerElm = props.splitButton ? vm.$refs.trigger.$el : vm.$refs.trigger + + on(state.triggerElm, 'keydown', api.handleTriggerKeyDown) + state.dropdownElm.addEventListener('keydown', api.handleItemKeyDown, true) + + if (!props.splitButton) { + on(state.triggerElm, 'focus', toggleFocus({ state, value: true })) + on(state.triggerElm, 'blur', toggleFocus({ state, value: false })) + on(state.triggerElm, 'click', toggleFocus({ state, value: false })) + } + + if (props.trigger === 'hover') { + on(state.triggerElm, 'mouseenter', api.show) + on(state.triggerElm, 'mouseleave', api.hide) + on(state.dropdownElm, 'mouseenter', api.show) + on(state.dropdownElm, 'mouseleave', api.hide) + } else if (props.trigger === 'click') { + on(state.triggerElm, 'click', api.handleClick) + } +} + +export const handleMenuItemClick = ({ props, state, emit }) => (itemData, instance) => { + if (props.hideOnClick) { + state.visible = false + } + + emit('item-click', itemData, instance) +} + +export const triggerElmFocus = ({ state }) => () => { + state.triggerElm.focus && state.triggerElm.focus() +} + +export const initDomOperation = ({ api, state, vm }) => () => { + state.dropdownElm = vm.popperElm + state.menuItems = state.dropdownElm.querySelectorAll('[tabindex="-1"]') + state.menuItemsArray = [].slice.call(state.menuItems) + + api.initEvent() + api.initAria() +} + +export const handleMainButtonClick = ({ api, emit }) => (event) => { + emit('button-click', event) + api.hide() +} + +export const mounted = ({ api, vm }) => () => { + vm.$on('menu-item-click', api.handleMenuItemClick) +} + +export const beforeDistory = ({ api, state }) => () => { + if (state.triggerElm) { + off(state.triggerElm, 'keydown', api.handleTriggerKeyDown) + off(state.triggerElm, 'focus', toggleFocus({ state, value: true })) + off(state.triggerElm, 'blur', toggleFocus({ state, value: false })) + off(state.triggerElm, 'click', toggleFocus({ state, value: false })) + off(state.triggerElm, 'mouseenter', api.show) + off(state.triggerElm, 'mouseleave', api.hide) + off(state.triggerElm, 'click', api.handleClick) + state.triggerElm = null + } + + if (state.dropdownElm) { + state.dropdownElm.removeEventListener('keydown', api.handleItemKeyDown, true) + + off(state.dropdownElm, 'mouseenter', api.show) + off(state.dropdownElm, 'mouseleave', api.hide) + + state.dropdownElm = null + } +} diff --git a/packages/renderless/src/dropdown/vue.ts b/packages/renderless/src/dropdown/vue.ts new file mode 100644 index 000000000..5407a60a6 --- /dev/null +++ b/packages/renderless/src/dropdown/vue.ts @@ -0,0 +1,79 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { guid } from '@opentiny/vue-renderless/common/string' + +import { + watchVisible, + watchFocusing, + show, + hide, + handleClick, + handleTriggerKeyDown, + handleItemKeyDown, + resetTabindex, + removeTabindex, + initAria, + initEvent, + handleMenuItemClick, + handleMainButtonClick, + triggerElmFocus, + initDomOperation, + mounted, + beforeDistory +} from './index' + +export const api = ['state', 'handleMainButtonClick', 'hide', 'show', 'initDomOperation', 'handleClick'] + +export const renderless = (props, { reactive, watch, provide, onMounted }, { emit, parent, broadcast, vm, nextTick }) => { + const api = {} + const state = reactive({ + visible: false, + timeout: null, + focusing: false, + menuItems: null, + menuItemsArray: null, + triggerElm: null, + dropdownElm: null, + listId: `dropdown-menu-${guid()}` + }) + + provide('dropdown', vm) + + Object.assign(api, { + state, + watchVisible: watchVisible({ broadcast, emit, nextTick }), + watchFocusing: watchFocusing({ parent }), + show: show({ props, state }), + hide: hide({ api, props, state }), + mounted: mounted({ api, vm }), + handleClick: handleClick({ api, props, state, emit }), + handleTriggerKeyDown: handleTriggerKeyDown({ api, state }), + handleItemKeyDown: handleItemKeyDown({ api, props, state }), + resetTabindex: resetTabindex({ api }), + removeTabindex: removeTabindex({ state }), + initAria: initAria({ state, props }), + initEvent: initEvent({ api, props, state, vm }), + handleMenuItemClick: handleMenuItemClick({ props, state, emit }), + handleMainButtonClick: handleMainButtonClick({ api, emit }), + triggerElmFocus: triggerElmFocus({ state }), + initDomOperation: initDomOperation({ api, state, vm }), + beforeDistory: beforeDistory({ api, state }) + }) + + watch(() => state.visible, api.watchVisible) + watch(() => state.focusing, api.watchFocusing) + + onMounted(api.mounted) + + return api +} diff --git a/packages/renderless/src/espace/index.ts b/packages/renderless/src/espace/index.ts new file mode 100644 index 000000000..972dd368c --- /dev/null +++ b/packages/renderless/src/espace/index.ts @@ -0,0 +1,138 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { xss } from '@opentiny/vue-renderless/common' + +export const getUserHref = ({ api, props }) => (item) => { + const type = item.type ? String(item.type).toLocaleLowerCase() : '' + const value = item.value ? String(item.value).toLocaleLowerCase() : '' + let href = '' + + if (props.isNewImMode) { + if (type === 'im' || type === 'sip') { + href = 'javascript:;' + } else { + href = `${type}:${value}` + } + + if (type === 'im' || type === 'sip') { + api.testUID(value) + } + } else { + href = `${type}:${value}` + } + + return xss.filterUrl(href) +} + +export const getUserTitle = (item) => { + const type = item.type ? String(item.type).toLocaleLowerCase() : '' + const value = item.value ? String(item.value).toLocaleLowerCase() : '' + const title = `${type}:${value}` + + return title +} + +export const doUserAction = ({ api, props, state, eSpaceCtrl }) => (item) => { + state.dataItem = item + + const type = item.type ? String(item.type).toLocaleLowerCase() : '' + + if (props.isNewImMode) { + if (eSpaceCtrl) { + if (state.initialized) { + if (type === 'im') { + api.openEspace() + } else if (type === 'sip') { + api.soundEspace() + } + } else { + if (type === 'im' || type === 'sip') { + api.initEspaceLink() + } + } + } + } +} + +export const initEspaceLink = ({ api, props, state, eSpaceCtrl, eSpaceCtrlDisabled }) => () => { + const flag = localStorage.getItem('eSpaceCtrl_initialized') + const dataItem = state.dataItem + const type = dataItem.type ? String(dataItem.type).toLocaleLowerCase() : '' + + if (Number(flag)) { + state.initialized = true + + if (type === 'im') { + api.openEspace() + } else if (type === 'sip') { + api.soundEspace() + } + } else if (!eSpaceCtrlDisabled) { + const timeout = props.timeout || 3000 + const pollingInterval = props.pollingInterval || 1000 + const options = { timeout, pollingInterval } + + eSpaceCtrl.init && eSpaceCtrl.init(options) + + eSpaceCtrl.ready && + eSpaceCtrl.ready(() => { + state.initialized = true + + if (type === 'im') { + api.openEspace() + } else if (type === 'sip') { + api.soundEspace() + } + }) + + eSpaceCtrl.error && + eSpaceCtrl.error(() => { + state.initialized = false + }) + } +} + +export const openEspace = ({ api, state, eSpaceCtrl }) => () => { + const dataItem = state.dataItem + const uid = dataItem.value ? String(dataItem.value).toLocaleLowerCase() : '' + + if (uid && api.testUID(uid)) { + eSpaceCtrl.showImDialog(uid) + } +} + +export const testUID = (uid) => { + uid = uid ? String(uid).toLocaleLowerCase() : '' + + if (uid) { + const employer = /^[a-z]\d+$/i + const employee = /^[a-z]{3}\d+$/i + + if (!employer.test(uid) && !employee.test(uid)) { + return false + } + + return true + } + + return false +} + +export const soundEspace = ({ api, state, eSpaceCtrl }) => () => { + const dataItem = state.dataItem + const uid = dataItem.value ? String(dataItem.value).toLocaleLowerCase() : '' + + if (uid && api.testUID(uid)) { + eSpaceCtrl.eSpaceCallByAccount(uid) + } +} diff --git a/packages/renderless/src/espace/vue.ts b/packages/renderless/src/espace/vue.ts new file mode 100644 index 000000000..28d8f20e7 --- /dev/null +++ b/packages/renderless/src/espace/vue.ts @@ -0,0 +1,43 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { init } from '@opentiny/vue-renderless/common/deps/eSpaceCtrl' +import { getUserHref, getUserTitle, doUserAction, initEspaceLink, openEspace, testUID, soundEspace } from './index' + +export const api = ['getUserHref', 'getUserTitle', 'doUserAction', 'initEspaceLink', 'openEspace', 'testUID', 'soundEspace'] + +export const renderless = (props, { reactive }, { service }) => { + const api = {} + const { setting = {} } = service || {} + const { widgets = {} } = setting + + const eSpaceCtrlDisabled = widgets.ESpaceCtrl && !widgets.ESpaceCtrl.autoLink + const eSpaceCtrl = eSpaceCtrlDisabled ? {} : init() + + const state = reactive({ + initialized: false, + dataItem: null + }) + + Object.assign(api, { + state, + testUID, + getUserTitle, + getUserHref: getUserHref({ api, props }), + initEspaceLink: initEspaceLink({ api, props, state, eSpaceCtrl, eSpaceCtrlDisabled }), + doUserAction: doUserAction({ api, props, state, eSpaceCtrl }), + openEspace: openEspace({ api, state, eSpaceCtrl }), + soundEspace: soundEspace({ api, state, eSpaceCtrl }) + }) + + return api +} diff --git a/packages/renderless/src/exception/index.ts b/packages/renderless/src/exception/index.ts new file mode 100644 index 000000000..98fed3f0b --- /dev/null +++ b/packages/renderless/src/exception/index.ts @@ -0,0 +1,20 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +export const create = (emit) => () => emit('btn-click') + +export const getMessage = + ({ props, t }) => + () => { + const types = ['build', 'weaknet', 'pcview', 'busy', 'noperm'] + return props.message || t(`ui.exception.${~types.indexOf(props.type) ? props.type : 'nodata'}`) + } diff --git a/packages/renderless/src/exception/vue.ts b/packages/renderless/src/exception/vue.ts new file mode 100644 index 000000000..cd435b5e9 --- /dev/null +++ b/packages/renderless/src/exception/vue.ts @@ -0,0 +1,30 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { create, getMessage } from './index' + +export const api = ['state', 'create'] + +export const renderless = (props, { computed, reactive }, { t, emit }) => { + const api = { + create: create(emit), + getMessage: getMessage({ props, t }) + } + + const state = reactive({ + message: computed(() => api.getMessage({ props, t })) + }) + + api.state = state + + return api +} diff --git a/packages/renderless/src/fall-menu/index.ts b/packages/renderless/src/fall-menu/index.ts new file mode 100644 index 000000000..4129bb43c --- /dev/null +++ b/packages/renderless/src/fall-menu/index.ts @@ -0,0 +1,118 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { REFRESH_INTERVAL } from '@opentiny/vue-renderless/common' +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' +import PopupManager from '@opentiny/vue-renderless/common/deps/popup-manager' +import { xss } from '@opentiny/vue-renderless/common/xss.js' + +export const arrowClick = (state) => (opt) => { + state.pager += opt +} + +export const overContent = (state) => (on) => { + state.isActive = on +} + +export const mouseover = ({ fall, props, state }) => (index) => { + const popupBox = fall.value + + state.activeNode = index + + let level2Array = props.data[index].children || [] + + level2Array.forEach((level2) => { + let level3Array = level2.children || [] + + level3Array.forEach((level3) => { + level3.url = xss.filterUrl(level3.url) + }) + }) + + state.level2data = level2Array + + if (popupBox && state.level2data.length > 0) { + popupBox.style.zIndex = PopupManager.nextZIndex() + state.isActive = true + } +} + +export const mouseout = (state) => () => { + state.isActive = false + state.activeNode = null +} + +export const computePx = ({ props, refs, state }) => () => { + const list = refs.list + const width = list.parentElement.clientWidth + const arr = list.querySelectorAll('li') + const set = { data: [], offset: [], index: [] } + const liWidth = [] + let innerwidth = 0 + let start = 0 + + for (let i = 0, len = arr.length; i < len; i++) { + innerwidth += arr[i].clientWidth + liWidth.push(arr[i].clientWidth) + + if (innerwidth > width || i === len - 1) { + set.data.push(props.data.slice(start, i)) + set.offset.push(`-${arr[start].offsetLeft}px`) + set.index.push(i) + + innerwidth = arr[i].clientWidth + start = i + } + } + + const pagers = set.index.length + + const lastRange = set.data.length === 1 ? liWidth : liWidth.slice(set.index[pagers - 2], set.index[pagers]) + + if (lastRange.reduce((a, b) => a + b) > width) { + set.data.push(props.data[start]) + set.offset.push(`-${arr[start].offsetLeft}px`) + } + + set.size = set.data.length + state.pagerData = set +} + +export const reRender = ({ api, state, timeout }) => () => { + timeout && clearTimeout(timeout) + + timeout = setTimeout(() => { + api.computePx() + }, REFRESH_INTERVAL) + + state.pager = 1 +} + +export const mounted = ({ api }) => () => { + api.computePx() + on(window, 'resize', api.reRender) +} + +/* istanbul ignore next */ +export const beforeDestroy = (api) => () => off(window, 'resize', api.reRender) + +export const computeLeft = ({ state }) => () => state.pagerData.offset[state.pager - 1] + +export const computeData = ({ props }) => () => { + if (Array.isArray(props.data) && props.data.length) { + props.data.forEach((level1) => { + level1.url = xss.filterUrl(level1.url) + }) + } + + return props.data +} diff --git a/packages/renderless/src/fall-menu/vue.ts b/packages/renderless/src/fall-menu/vue.ts new file mode 100644 index 000000000..57170c55e --- /dev/null +++ b/packages/renderless/src/fall-menu/vue.ts @@ -0,0 +1,59 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { mouseover, mouseout, computePx, reRender, arrowClick, overContent, mounted, beforeDestroy, computeLeft, computeData } from './index' + +export const api = ['state', 'fall', 'arrowClick', 'mouseover', 'mouseout', 'overContent', 'reRender', 'left'] + +const initState = ({ reactive, computed, api, props }) => { + const state = reactive({ + pager: 1, + level2data: [], + activeNode: null, + isActive: props.value, + pagerData: { data: [], offset: [], index: [] }, + left: computed(() => api.computeLeft()), + data: computed(() => api.computeData()) + }) + + return state +} + +const initApi = ({ api, state, fall, props, refs }) => { + Object.assign(api, { + fall, + state, + computePx: computePx({ props, refs, state }), + mounted: mounted({ api }), + computeLeft: computeLeft({ state }), + beforeDestroy: beforeDestroy(api), + computeData: computeData({ props }), + arrowClick: arrowClick(state), + overContent: overContent(state), + mouseout: mouseout(state), + mouseover: mouseover({ props, fall, state }), + reRender: reRender({ api, state }) + }) +} + +export const renderless = (props, { computed, reactive, onMounted, onBeforeUnmount, ref }, { refs }) => { + const api = {} + const fall = ref(null) + const state = initState({ reactive, computed, api, props }) + + initApi({ api, state, fall, props, refs }) + + onMounted(api.mounted) + onBeforeUnmount(api.beforeDestroy) + + return api +} diff --git a/packages/renderless/src/file-upload/index.ts b/packages/renderless/src/file-upload/index.ts new file mode 100644 index 000000000..d302b95d8 --- /dev/null +++ b/packages/renderless/src/file-upload/index.ts @@ -0,0 +1,1599 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { extend } from '@opentiny/vue-renderless/common/object' +import { xss, log } from '@opentiny/vue-renderless/common/xss' +import uploadAjax from '@opentiny/vue-renderless/common/deps/upload-ajax' + +let initTokenPromise = null + +const shaMap = { + sHA256: 'SHA256' +} + +export const initService = ({ props, service }) => { + const noopFnCreator = (propName) => () => { + if (propName) { + return Promise.reject(new Error(`[TINY Error][FileUpload] Prop ${propName} is not configured`)) + } else { + return Promise.reject(new Error('[TINY Error][FileUpload] This component depends on @opentiny/vue-service')) + } + } + + const { network = {}, common = {} } = service || {} + const { request, get, post, all, spread, CancelToken = {} } = network + + const noopFn = noopFnCreator() + + return { + get: get || noopFn, + post: post || noopFn, + request: request || noopFn, + all: all || noopFn, + spread: spread || noopFn, + cancelToken: CancelToken.source || noopFn, + getSingleUploadUrl: common.getSingleUploadUrl || noopFn, + getFileUploadUrl: common.getFileUploadUrl || noopFn, + getFileDownloadUrl: common.getFileDownloadUrl || noopFn, + getSingleDownloadUrl: common.getSingleDownloadUrl || noopFn, + getPackageDownloadUrl: common.getPackageDownloadUrl || noopFn, + getLargeFileInitUrl: common.getLargeFileInitUrl || noopFn, + getChunkUploadUrl: common.getChunkUploadUrl || noopFn, + getPreviewUrl: common.getPreviewUrl || noopFn, + getDocumentInfoUrl: common.getDocumentInfoUrl || noopFn, + httpRequest: props.httpRequest || request || uploadAjax + } +} + +export const computedUploadDisabled = ({ props, state }) => () => props.disabled || (state.elForm || {}).disabled + +export const computedUploadingSize = (state) => () => state.uploadingFiles.reduce((total, file) => total + file.size, 0) + +export const watchListType = ({ constants, state }) => (type) => { + if (type === constants.LIST_TYPE.PICTURE_CARD || type === constants.LIST_TYPE.PICTURE) { + state.uploadFiles = state.uploadFiles.map((file) => { + if (!file.url && file.raw) { + try { + file.url = URL.createObjectURL(file.raw) + } catch (err) { + // do nothing + } + } + + return file + }) + } +} + +export const watchFileList = ({ constants, state }) => (fileList) => { + state.uploadFiles = + fileList && + fileList.map((item) => { + item.uid = item.uid || Date.now() + state.tempIndex++ + item.status = item.status || constants.FILE_STATUS.SUCESS + + return item + }) +} + +const isNonFuncPropBeforeUpload = ({ flag, doUpload, file }) => !flag && doUpload(file) + +const onBeforeIsPromise = ({ before, rawFile, file, doUpload, autoRemove, api }) => { + before.then( + (processedFile) => { + const fileType = Object.prototype.toString.call(processedFile) + + if (fileType === '[object File]' || fileType === '[object Blob]') { + if (fileType === '[object Blob]') { + processedFile = new File([processedFile], rawFile.name, { type: rawFile.type }) + } + + for (const p in rawFile) { + if (Object.prototype.hasOwnProperty.call(rawFile, p)) { + processedFile[p] = rawFile[p] + } + } + + file.raw = processedFile + } + + doUpload(file) + }, + () => { + if (autoRemove) { + if (!Array.isArray(rawFile)) { + api.handleRemove(null, rawFile) + } else { + rawFile.forEach((raw) => api.handleRemove(null, raw)) + } + } + } + ) +} + +export const beforeUpload = ({ props, api, Modal, constants, t, state }) => (file, autoRemove, doUpload) => { + if (state.isEdm && file.name.length > 255) { + if (autoRemove) { + const rawFile = file.raw + if (Array.isArray(rawFile)) { + rawFile.forEach((raw) => api.handleRemove(null, raw)) + } else { + api.handleRemove(null, rawFile) + } + } + return Modal.message({ + message: `${t(constants.EDM.THEFILENAME)}"${file.name}"${t(constants.EDM.FILENAMEEXCEEDS)}`, + status: 'warning' + }) + } + + let flag = typeof props.beforeUpload === 'function' + + isNonFuncPropBeforeUpload({ flag, doUpload, file }) + + if (flag) { + const { rawFile = file.raw, before = props.beforeUpload(rawFile) } = {} + + if (before && before.then) { + onBeforeIsPromise({ before, rawFile, file, doUpload, autoRemove, api }) + } else if (before !== false) { + doUpload(file) + } else { + if (autoRemove) { + if (Array.isArray(rawFile)) { + rawFile.forEach((raw) => api.handleRemove(null, raw)) + } else { + api.handleRemove(null, rawFile) + } + } + } + } +} + +export const startUpload = ({ state, constants, refs, Modal, api, t }) => (file, isList) => { + if (file.size > state.docSize && file.size > state.chunkSize) { + file.isLargeFile = true + + isList && + state.uploadFiles.forEach((f) => { + if (f.cacheSign === file.cacheSign) { + f.percentage = 0 + } + }) + + api.largeDocumentUpload(file) + + Modal.message({ + message: `${file.name}${t(constants.EDM.LARGEFILEKEY)}`, + status: 'warning' + }) + } else { + refs[constants.UPLOAD_INNER].upload(file.raw) + } +} + +const calcFileForMobile = (rawFile, file) => { + const fileName = rawFile.name.lastIndexOf('.') + const fileNameLen = rawFile.name.length + + file.fileType = rawFile.name.substring(fileName + 1, fileNameLen) + + const size = rawFile.size / 1024 + + if (size < 1024) { + file.size = Math.round(size * 10 ** 1) / 10 ** 1 + 'KB' + } else { + const fileSize = size / 1024 + file.size = Math.round(fileSize * 10 ** 1) / 10 ** 1 + 'MB' + } +} + +export const properFileSize = ({ props, state, constants, Modal, t }) => (file) => { + let maxSize = 0 + + if (Array.isArray(props.fileSize) && props.fileSize[1]) { + maxSize = Math.min(state.singleMaxSize, props.fileSize[1] / 1024).toFixed(2) + } else { + maxSize = Math.min(state.singleMaxSize) + } + + if (file.size > maxSize * 1024 * 1024) { + Modal.message({ + message: `${file.name} ${t(constants.EDM.EXCEED)} ${maxSize} MB`, + status: 'warning' + }) + + return false + } + + if (file.size <= 0) { + Modal.message({ + message: `${file.name} ${t(constants.EDM.FILEEMPTY)}`, + status: 'warning' + }) + + return false + } + + const userMin = (props.fileSize && (props.fileSize[0] || props.fileSize)) || 0 + + if (file.size <= userMin * 1024) { + Modal.message({ + message: `${t(constants.EDM.SIZE).replace(/{name}/, file.name)} ${userMin} KB`, + status: 'warning' + }) + + return false + } + + return true +} + +export const addFileToList = ({ api, constants, emit, props, state, mode }) => (rawFile, updateId) => { + rawFile.uid = Date.now() + state.tempIndex++ + + let file = { status: constants.FILE_STATUS.READY, name: rawFile.name, size: rawFile.size } + + Object.assign(file, { percentage: 0, uid: rawFile.uid, raw: rawFile, response: {} }) + + if (state.isEdm) { + let fileBase = { serverName: '', docRelativePath: '', docId: '', docVersion: '', cacheSign: rawFile.uid } + + file = Object.assign(file, fileBase) + + props.edm.upload.isFolder && (file.path = rawFile.webkitRelativePath.match(/.*\//g)[0]) + } + + state.cacheDocuments[file.uid] = file + + mode === 'mobile' && calcFileForMobile(rawFile, file) + + if (~[constants.LIST_TYPE.PICTURE_CARD, constants.LIST_TYPE.PICTURE].indexOf(props.listType)) { + try { + file.url = URL.createObjectURL(rawFile) + } catch (err) { + return + } + } + + if (state.isEdm && state.isSuccess) { + const proper = api.properFileSize(file) + if (!proper) { + return + } + + state.updateId = updateId || props.edm.updateId || '' + if (state.updateId) { + const index = state.uploadFiles.findIndex((item) => item.docId === updateId) + state.uploadFiles.splice(index, 1, file) + emit('change', file, state.uploadFiles) + return + } + } + + state.uploadFiles.push(file) + state.currentUploadingFileUids.push(file.uid) + emit('change', file, state.uploadFiles) +} + +const rawfileUpload = ({ state, props, refs, constants, rawFiles, api }) => { + if (!state.isEdm && props.autoUpload) { + if (props.multiple && props.mergeService) { + const handler = (file) => refs[constants.UPLOAD_INNER].upload(file.raw) + rawFiles.length && api.beforeUpload({ raw: rawFiles }, true, handler) + } else { + rawFiles.forEach((rawFile) => { + const file = api.getFile(rawFile) + const handler = (file) => refs[constants.UPLOAD_INNER].upload(file.raw) + api.beforeUpload(file, true, handler) + }) + } + } +} + +export const handleStart = ({ api, constants, props, state, refs }) => (rawFiles, updateId) => { + state.currentUploadingFileUids = [] + rawFiles.forEach((rawFile) => api.addFileToList(rawFile, updateId)) + const { UPLOADING, READY } = constants.FILE_STATUS + state.uploadingFiles = state.uploadFiles.filter((file) => [UPLOADING, READY].includes(file.status)) + if (state.isEdm && state.isSuccess) { + rawFiles.forEach((rawFile) => { + const file = api.getFile(rawFile) + if (!file) { + return + } + api.beforeUpload(file, true, (file) => { + typeof props.edm.upload.loading === 'function' && props.edm.upload.loading(file) + new Promise((resolve) => { + if (props.edm.isCheckCode !== true) { + return resolve() + } + if (file.size > state.docSize && file.size > state.chunkSize && !state.isEntireCheckCode) { + return resolve() + } + const reader = new FileReader() + reader.readAsArrayBuffer(file.raw) + reader.onload = (e) => { + const cryptoJS = props.edm.upload.plugin() + const wordArray = cryptoJS.lib.WordArray.create(e.target.result) + const hash = cryptoJS[shaMap.shaMap](wordArray).toString() + file.hash = file.raw.hash = hash + resolve(hash) + } + }).then(() => { + if (props.autoUpload) { + const tokenParams = { token: props.edm.upload.token, file, type: 'upload' } + api.getToken(tokenParams).then((data) => { + if (data) { + file.status = constants.FILE_STATUS.UPLOADING + api.startUpload(file, true) + } + }) + } + }) + }) + }) + } + rawfileUpload({ state, props, refs, constants, rawFiles, api }) +} + +export const calcUploadingFilesInfo = ({ state }) => () => { + const totalLoadedSize = state.uploadingFiles.reduce((loadedSize, file) => { + const loaded = (file.size * file.percentage) / 100 + return loadedSize + loaded + }, 0) + + const uploadedFiles = state.uploadingFiles.filter((file) => file.percentage === 100) + + let percentage = Math.floor((totalLoadedSize / state.uploadingSize) * 100) + percentage = Math.min(percentage, 100) + + return { + percentage, + uploadList: state.uploadingFiles, + uploadedCount: uploadedFiles.length + } +} + +export const handleProgress = ({ api, constants, emit, state }) => (event, rawFile) => { + if (Array.isArray(rawFile)) { + state.uploadFiles.forEach((file) => { + if (rawFile.some((raw) => file.uid === raw.uid)) { + file.status = constants.FILE_STATUS.UPLOADING + + if (event.lengthComputable) { + file.percentage = Math.floor((event.loaded * 100) / event.total) || 0 + } + + emit('progress', file, state.uploadFiles, api.calcUploadingFilesInfo()) + } + }) + } else { + const file = api.getFile(rawFile) + + if (file) { + file.status = constants.FILE_STATUS.UPLOADING + + if (event.lengthComputable && !file.isLargeFile) { + file.percentage = Math.floor((event.loaded * 100) / event.total) || 0 + if (file.percentage >= 100) { + file.isFinished = true + } + emit('progress', file, state.uploadFiles, api.calcUploadingFilesInfo()) + } + } + } +} + +export const handleSuccess = ({ api, constants, emit, state, props }) => (res, rawFile) => { + const currentUploadFiles = state.uploadFiles.filter((file) => state.currentUploadingFileUids.includes(file.uid)) + if (Array.isArray(rawFile)) { + state.uploadFiles.forEach((file) => { + if (rawFile.some((raw) => file.uid === raw.uid)) { + file.status = constants.FILE_STATUS.SUCESS + file.percentage = 100 + file.response = res + emit('success', res, file, currentUploadFiles) + emit('change', file, state.uploadFiles) + delete file.cancelToken + } + }) + } else { + const file = api.getFile(rawFile) + delete file.cancelToken + if (props.edm.upload && file && res.data && res.data.status !== 200) { + file.status = constants.FILE_STATUS.FAIL + emit('error', res, file, state.uploadFiles) + return + } + + if (file) { + file.status = constants.FILE_STATUS.SUCESS + file.percentage = 100 + if (!file.isFinished) { + emit('progress', file, state.uploadFiles, api.calcUploadingFilesInfo()) + } + + file.isLargeFile && delete res.config + file.response = res + + if (state.isEdm && res.data.result) { + file.serverName = res.data.result.serverName + file.docRelativePath = res.data.result.docRelativePath + file.docId = res.data.result.docId + file.docVersion = res.data.result.version + file.docSize = res.data.result.docSize + file.isLargeFile && delete file.raw + Object.assign(file, res.data.result) + } + emit('success', res, file, currentUploadFiles) + emit('change', file, state.uploadFiles) + } + } + api.clearUploadingFiles() +} + +export const handleError = ({ api, constants, emit, state }) => (err, rawFile) => { + const file = api.getFile(rawFile) + + if (file) { + file.status = constants.FILE_STATUS.FAIL + file.percentage = 100 + + if (!state.isEdm) { + state.uploadFiles.splice(state.uploadFiles.indexOf(file), 1) + } + + api.clearUploadingFiles() + emit('error', err, file, state.uploadFiles) + emit('change', file, state.uploadFiles) + } +} + +export const handleRemove = ({ api, emit, props, state }) => (file, raw) => { + if (raw) { + file = api.getFile(raw) + } + + let doRemove = () => { + api.abort(file) + + let fileList = state.uploadFiles + + fileList.splice(fileList.indexOf(file), 1) + emit('remove', file, fileList) + } + + if (!props.beforeRemove) { + doRemove() + } else if (typeof props.beforeRemove === 'function') { + const before = props.beforeRemove(file, state.uploadFiles) + + if (before && before.then) { + before.then( + () => { + doRemove() + }, + () => undefined + ) + } else if (before !== false) { + doRemove() + } + } +} + +export const clearUploadingFiles = ({ constants, state }) => () => { + const { SUCESS, FAIL } = constants.FILE_STATUS + const isUploadComplete = state.uploadingFiles.every((file) => [SUCESS, FAIL].includes(file.status)) + + if (isUploadComplete) { + state.uploadingFiles = [] + } +} + +export const getFile = (state) => (rawFile) => { + let fileList = state.uploadFiles + let target + + fileList.every((item) => { + target = rawFile.uid === item.uid ? item : null + return !target + }) + + return target +} + +export const abort = ({ constants, refs }) => (file) => refs[constants.UPLOAD_INNER].abort(file) + +export const clearFiles = (state) => () => { + state.uploadFiles = [] +} + +export const submit = ({ api, constants, refs, state, props }) => () => { + const files = state.uploadFiles.filter((file) => file.status === constants.FILE_STATUS.READY) + + if (state.isEdm && state.isSuccess) { + files.forEach((file) => { + api + .getToken({ + token: props.edm.upload.token, + file, + type: 'upload' + }) + .then((data) => { + if (data) { + api.beforeUpload(file, false, (file) => { + api.startUpload(file) + }) + } + }) + }) + } else { + if (props.multiple && props.mergeService) { + const rawFiles = files.map((file) => file.raw) + rawFiles.length && + api.beforeUpload({ raw: rawFiles }, false, (file) => { + refs[constants.UPLOAD_INNER].upload(file.raw) + }) + } else { + files.forEach((file) => { + api.beforeUpload(file, false, (file) => { + refs[constants.UPLOAD_INNER].upload(file.raw) + }) + }) + } + } +} + +export const handleClick = ({ constants, refs }) => () => refs[constants.UPLOAD_INNER].handleClick() + +export const getFileUploadUrl = (service) => () => service.getFileUploadUrl() + +export const updateUrl = ({ api, props, state }) => () => { + if (props.action) { + state.url = props.action + } else { + api.getFileUploadUrl().then((url) => (state.url = url)) + } +} + +const getTranslateFile = ({ api, isChunk }) => (data, type, index) => { + if (isChunk) { + if (index === 0) { + api.setWriterFile({ data, index }) + } + } else { + const content = data.headers['content-disposition'] + const name = content.match(/fileName.?=(.*)/)[1] || content.match(/fileName=(.*)/)[1] + const blob = new Blob([data.data], { type: type !== 'zip' ? 'application / x - xls' : 'application/zip' }) + + if (window && window.navigator.msSaveOrOpenBlob) { + window.navigator.msSaveOrOpenBlob(blob, decodeURIComponent(name)) + return + } + + const url = window.URL || window.webkitURL || window.moxURL + const downloadHref = xss.filterUrl(url.createObjectURL(blob)) + let downloadLink = document.createElement('a') + + downloadLink.href = downloadHref + downloadLink.download = decodeURIComponent(name) + downloadLink.click() + } +} + +const getHandleSuccess = ({ downloadOps, file, translateFile, isChunk, state }) => (data, type, index) => { + if (isChunk) { + state.dowuloadChunkFile.set(index, new Uint8Array(data.data)) + translateFile(data, type, index) + } else { + if (data.data.type.includes('application/json')) { + const reader = new FileReader() + + reader.onload = (e) => { + if (typeof downloadOps.fail === 'function') { + downloadOps.fail(JSON.parse(e.target.result), file) + } + } + + reader.readAsText(data.data) + } else { + typeof downloadOps.loading === 'function' && downloadOps.loading(file) + + translateFile(data, type) + } + } +} + +const getCalcProgress = () => (evt) => { + let total = Number(evt.target.getResponseHeader('Content-Size')) + total = Math.max(total, evt.loaded) + + let progress = Math.ceil((evt.loaded / total) * 100) || 0 + progress = Math.max(progress, 0) + progress = Math.min(progress, 100) + + return progress +} + +const modifyServiceUrlSingle = ({ file, serviceUrl, range, constants }) => { + if (typeof file === 'object') { + let tempFile = { ...file, ...range } + + delete tempFile.docId + delete tempFile.docVersion + delete tempFile['x-download-sign'] + + for (let key in tempFile) { + if (Object.prototype.hasOwnProperty.call(tempFile, key)) { + const value = tempFile[key] + const dataType = typeof value + + if (!~['undefined', 'object', 'function'].indexOf(dataType)) { + serviceUrl += `&${key}=${value}` + } + } + } + + file.status = constants.FILE_STATUS.DOWNLOADING + file.percentage = 0 + } + + return serviceUrl +} + +const getKiaScanTip = ({ data, t, Modal, constants }) => { + if (data.status === '12079') { + return Modal.message({ + message: `${t(constants.EDM.KIASCANTIP)}`, + status: 'warning' + }) + } +} + +const getServiceUrl = ({ url, file }) => + url.replace(/{docId}/, file.docId || file) + `${~url.indexOf('?') ? '&' : '?'}x-download-sign=true&docVersion=${file.docVersion || ''}` + +const downloadFileSingle = (args) => { + let { file, service, constants, props, state, batchIndex, isChunk, api } = args + let { calcProgress, emit, handleSuccess, t, Modal, range = {}, isBatch } = args + let sdResolver = (url) => { + let serviceUrl = getServiceUrl({ url, file }) + serviceUrl = modifyServiceUrlSingle({ file, serviceUrl, range, constants }) + serviceUrl = xss.filterUrl(serviceUrl) + let params = { + withCredentials: props.withCredentials, + headers: Object.assign(props.headers, state.headers), + responseType: isChunk ? 'arraybuffer' : 'blob', + hideErr: true, + onDownloadProgress(evt) { + let progress = calcProgress(evt, isChunk) + if (progress !== 100) { + !isChunk && emit('download', progress, evt) + } + if (typeof file === 'object') { + file.percentage = progress + } + } + } + service + .get(serviceUrl, params) + .then((data) => { + if (getKiaScanTip({ data, t, Modal, constants })) { + return + } + const { checkcode, 'content-size': fileSize } = data.headers + !isChunk && emit('download', 100, { checkcode, fileSize }) + handleSuccess(data, '', range.index) + if (typeof file === 'object') { + file.percentage = 100 + setTimeout(() => (file.status = constants.FILE_STATUS.SUCESS), 1000) + } + api.afterDownload({ batchIndex, data, file }) + }) + .catch((data) => { + if (data.response && data.response.status === 401) { + const downloadOps = props.edm.download || {} + const tokenParams = { token: downloadOps.token, file, type: 'download' } + api.getToken(tokenParams).then((data) => { + api.afterDownload({ batchIndex, data, file, range, isChunk, isBatch }) + }) + } + }) + } + service.getSingleDownloadUrl().then(sdResolver) +} + +const downloadFileBatch = (args) => { + let { api, downloadOps, file, service, props, state, calcProgress, emit, handleSuccess } = args + let { t, Modal, constants, range = {} } = args + let tokenParams = { token: downloadOps.packageToken, file, type: 'download' } + api.getToken(tokenParams).then((data) => { + if (!data) { + return + } + + const params = { downloadTOs: [], attachdownloadTOs: [], isZip: 'true', transformType: 'sync', type: 'package' } + const hasWmType = file.some((item) => Boolean(item.wmType)) + + if (hasWmType) { + params.attachdownloadTOs = file + } else { + params.downloadTOs = file + } + + service.getPackageDownloadUrl().then((url) => { + url += `${~url.indexOf('?') ? '&' : '?'}x-download-sign=true` + url = xss.filterUrl(url) + + service + .post( + url, + { ...params, ...range }, + { + withCredentials: props.withCredentials, + headers: Object.assign(props.headers, state.headers), + responseType: 'blob', + onDownloadProgress(evt) { + let progress = calcProgress(evt) + if (progress !== 100) { + emit('download', progress, evt) + } + } + } + ) + .then((data) => { + if (getKiaScanTip({ data, t, Modal, constants })) { + return + } + const { 'content-size': fileSize } = data.headers + emit('download', 100, { fileSize }) + handleSuccess(data, 'zip') + }) + }) + }) +} + +export const downloadFile = ({ api, state, props }) => (file) => { + if (!state.isEdm) { + api.ordinaryDownload(file) + return + } + + const isBatch = Array.isArray(file) + + if (isBatch) { + return api.downloadFileInner({ file, isBatch }) + } + + const downloadOps = props.edm.download || {} + let tokenParams = { token: downloadOps.token, file, type: 'download' } + api.getToken(tokenParams).then((data) => { + if (!data) { + return + } + + api.getDownloadFileInfo({ docId: file.docId }).then((res) => { + let fileInfo + if (res && res.outDocQueryList[0].verInfo[0]) { + fileInfo = res.outDocQueryList[0].verInfo[0].docInfo[0] + } + const { fileSize } = fileInfo + const isLargeFile = fileSize > state.docSize && fileSize > state.chunkSize && fileSize > 10 * 1024 * 1024 * 1024 + + if (isLargeFile) { + api.largeDocumentDownload({ file: fileInfo, isBatch }) + } else { + api.downloadFileInner({ file, isBatch }) + } + }) + }) +} + +export const getDownloadFileInfo = ({ state, props, service }) => ({ docId }) => + service.getDocumentInfoUrl().then( + (url) => + new Promise((resolve, reject) => { + service + .request({ + method: 'post', + url: xss.filterUrl(url), + withCredentials: props.withCredentials, + headers: Object.assign(props.headers, state.headers), + data: { docInfoVO: { ids: [docId], docType: '', docVersion: '' } } + }) + .then((res) => { + if (res.data.status === 200) { + resolve(res.data.result) + } else { + reject(res) + } + }) + }) + ) + +export const largeDocumentDownload = ({ api, state }) => ({ file, isBatch }) => { + const chunkSize = Math.ceil(file.fileSize / state.chunkSize) + state.dowuloadChunkFile.set('chunkSize', chunkSize) + state.dowuloadChunkFile.set('fileSize', file.fileSize) + state.dowuloadChunkFile.set('docName', file.docName) + + file.chunkSize = chunkSize + const batches = api.sliceDownloadChunk(file) + api.batchSegmentDownload({ batchIndex: 0, batches, docId: file.docId, isBatch }) +} + +export const sliceDownloadChunk = ({ state }) => (file) => { + const chunkSize = file.chunkSize + const downloadChunkArray = [[]] + + state.downloadBatchQueue[file.docId + '-0'] = 0 + state.downloadBatchQueueListen[file.docId + '-0'] = 0 + + for (let i = 0; i < chunkSize; i++) { + const startRange = i * state.chunkSize + const endRange = Math.min(file.fileSize, startRange + state.chunkSize) + + const lastIndex = downloadChunkArray.length - 1 + + if (downloadChunkArray[lastIndex].length < state.downloadChunkLimit) { + downloadChunkArray[lastIndex].push({ startRange, endRange, index: i }) + } else { + state.downloadBatchQueue[file.docId + '-' + downloadChunkArray.length] = 0 + state.downloadBatchQueueListen[file.docId + '-' + downloadChunkArray.length] = 0 + downloadChunkArray.push([]) + downloadChunkArray[lastIndex + 1].push({ + startRange, + endRange, + index: i + }) + } + } + + return downloadChunkArray +} + +export const batchSegmentDownload = ({ state, api }) => ({ batchIndex, batches, docId, isBatch }) => { + if (batchIndex < batches.length) { + const batch = batches[batchIndex] + const key = docId + '-' + batchIndex + + Object.defineProperty(state.downloadBatchQueue, key, { + get() { + return state.downloadBatchQueueListen[key] + }, + set(value) { + state.downloadBatchQueueListen[key] = value + + if (value >= batch.length) { + api.batchSegmentDownload({ + docId, + batchIndex: ++batchIndex, + batches, + isBatch + }) + } + } + }) + + let index = 0 + while (batch.length - index > 0) { + api.downloadFileInner({ batchIndex, range: batch[index++], file: { docId }, isBatch, isChunk: true }) + } + } +} + +export const downloadFileInner = ({ api, props, service, state, emit, constants, t, Modal }) => ({ batchIndex, file, range, isBatch, isChunk }) => { + const downloadOps = props.edm.download || {} + const translateFile = getTranslateFile({ api, isChunk }) + const handleSuccess = getHandleSuccess({ downloadOps, file, translateFile, isChunk, state }) + const calcProgress = getCalcProgress() + + let { isFinished = false } = {} + + if (!isBatch) { + let args = { api, downloadOps, file, service, constants, props, state, t, Modal, isChunk } + + Object.assign(args, { calcProgress, isFinished, emit, handleSuccess, range, batchIndex, isBatch }) + + downloadFileSingle(args) + + return + } + + const params = { api, downloadOps, file, service, props, state, calcProgress, emit, handleSuccess, t, Modal, range } + isBatch && downloadFileBatch(params) +} + +export const afterDownload = ({ api, state }) => ({ batchIndex, range, data, file, isBatch, isChunk }) => { + if (data.status === 200) { + const key = file.docId + '-' + batchIndex + const count = state.downloadBatchQueue[key] + state.downloadBatchQueue[key] = count + 1 + } else { + const countDownloadReplay = state.downloadReplayAtoms[file.docId + '-' + range.index] + + if (countDownloadReplay && countDownloadReplay >= 2) { + const msgArray = ['The number of retry times exceeds the threshold! [docId:', file.docId, ', chunk:', range.index, ']'] + + log.logger.warn(msgArray.join('')) + delete state.downloadReplayAtoms[file.docId + '-' + range.index] + } else { + const msgArray = ['replay ', countDownloadReplay, '! [docId:', file.docId, ', chunk:', range.index, ']'] + + log.logger.warn(msgArray.join('')) + + state.downloadReplayAtoms[file.docId + '-' + range.index] = countDownloadReplay + 1 + + api.downloadFileInner({ batchIndex, range, file, isBatch, isChunk }) + } + } +} + +export const setWriterFile = ({ state, emit, props }) => ({ data, index }) => { + const fileStream = + props.plugin && + props.plugin.createWriteStream(state.dowuloadChunkFile.get('docName'), { + size: data.byteLength + }) + const writer = fileStream.getWriter() + + let downloaded = 0 + const fileSize = state.dowuloadChunkFile.get('fileSize') + + const writerStreamSaver = () => { + let chunk = state.dowuloadChunkFile.get(index) + if (chunk) { + writer.write(chunk).then(() => { + downloaded += chunk.byteLength + state.dowuloadChunkFile.delete(index) + if (index + 1 === state.dowuloadChunkFile.get('chunkSize')) { + emit('download', 100) + writer.close() + } else { + const progress = Math.ceil((downloaded / fileSize) * 100) || 0 + if (progress !== 100) { + emit('download', progress) + } + index++ + writerStreamSaver() + } + chunk = null + }) + } else { + setTimeout(() => { + writerStreamSaver() + }, 1000) + } + } + + writerStreamSaver() +} + +export const getFormData = ({ constants, props, state }) => ({ formData, file, type }) => { + if (state.isEdm && props.edm.upload) { + const propData = props.data || {} + const edmData = props.edm.upload.params || {} + const params = { ...propData, ...edmData } + + for (let key in params) { + if (Object.prototype.hasOwnProperty.call(params, key)) { + formData.set(key, params[key] || '') + } + } + } + + if (props.edm.isCheckCode === true) { + formData.append(constants.EDM.ISCHECKCODE, 'Y') + file.hash && formData.append(constants.EDM.CHECKCODE, file.hash) + } else { + formData.append(constants.EDM.ISCHECKCODE, 'N') + } + + const updateId = state.updateId || props.edm.updateId + if (type === constants.EDM.CHUNKINIT) { + formData.append(constants.EDM.FILESIZE, file.size) + formData.append(constants.EDM.CHUNKS, file.chunkSize) + formData.append(constants.EDM.FILENAME, file.name) + + updateId && formData.append(constants.EDM.DOCID, updateId) + } else { + formData.append(constants.EDM.MULTIPART, file, file.filename) + formData.append(constants.EDM.CHUNK, file.chunk) + formData.append(constants.EDM.LOWERNAME, file.filename) + + const docId = updateId || file.docId + formData.append(constants.EDM.DOCID, docId) + } + + updateId && formData.append('updateFile', true) + + return formData +} + +export const largeDocumentUpload = ({ api, Modal, state, t, emit, constants }) => (file) => { + const chunkSize = Math.ceil(file.size / state.chunkSize) + + file.chunkSize = chunkSize + file.cancelToken = [] + + api + .segmentUploadInit(file) + .then((data) => { + if (data) { + file.records = data.chunks + file.docId = data.docId + state.largeFileInfo[data.docId] = file + + const batches = api.sliceChunk(file) + + api.batchSegmentUpload({ + docId: data.docId, + batchIndex: 0, + batches, + progress: { size: file.size, trunks: [], file } + }) + } else { + Modal.message({ + message: t('ui.fileUpload.init'), + status: 'warning', + duration: '1000' + }) + const fileData = api.getFile(file) + state.uploadFiles.splice(state.uploadFiles.indexOf(fileData), 1) + } + }) + .catch((err) => { + file.status = constants.FILE_STATUS.FAIL + emit('error', err, file, state.uploadFiles) + }) +} + +export const segmentUploadInit = ({ api, props, service, state, constants }) => (file) => { + const formData = new FormData() + + return new Promise((resolve, reject) => { + service.getLargeFileInitUrl().then((data) => { + service + .request({ + method: 'post', + url: xss.filterUrl(data), + data: api.getFormData({ formData, file, type: constants.EDM.CHUNKINIT }), + withCredentials: props.withCredentials, + headers: Object.assign(props.headers, state.headers) + }) + .then((data) => { + if (data.data.status === 200) { + resolve(data.data.result) + } else { + reject(data) + } + }) + }) + }) +} + +const afterUpload = ({ data, file, batchIndex, state, api, progress }) => { + if (data.status === 200) { + const key = file.docId + '-' + batchIndex + const count = state.batchQueue[key] + + state.batchQueue[key] = count + 1 + } else { + const countReplay = state.replayAtoms[file.docId + '-' + file.chunk] + + if (countReplay && countReplay >= 2) { + const msgArray = ['The number of retry times exceeds the threshold! [docId:', file.docId, ', chunk:', file.chunk, ']'] + log.logger.warn(msgArray.join('')) + + delete state.replayAtoms[file.docId + '-' + file.chunk] + } else { + const msgArray = ['replay ', countReplay, '! [docId:', file.docId, ', chunk:', file.chunk, ']'] + + log.logger.warn(msgArray.join('')) + + state.replayAtoms[file.docId + '-' + file.chunk] = countReplay + 1 + + api.segmentUpload(batchIndex, file, progress) + } + } +} + +const chunkUpload = ({ state, service, postChunk }) => { + if (!state.chunkUploadUrl) { + service.getChunkUploadUrl().then((data) => { + state.chunkUploadUrl = data + postChunk(data) + }) + } else { + postChunk(state.chunkUploadUrl) + } +} + +const segmentUploadInner = ({ api, props, service, state, emit, constants, batchIndex, file, progress }) => { + const formData = new FormData() + const postChunk = (url) => { + const source = service.cancelToken() + if (progress.file.cancelToken) { + progress.file.cancelToken.push(source.cancel) + service + .request({ + method: 'post', + url: xss.filterUrl(url), + data: api.getFormData({ formData, file, type: '' }), + withCredentials: props.withCredentials, + headers: Object.assign(props.headers, state.headers), + cancelToken: source.token, + hideErr: true, + onUploadProgress(event) { + progress.trunks[file.chunk] = event.loaded + const count = progress.trunks.reduce((a, b) => a + b) + let percentage = Math.floor((count / progress.size) * 100) || 0 + file.percentage = Math.floor((event.loaded / event.total) * 100) + event.percentage = progress.file.percentage = percentage > 100 ? 100 : percentage + if (percentage >= 100) { + progress.file.isFinished = true + } + emit('progress', progress.file, state.uploadFiles, api.calcUploadingFilesInfo()) + } + }) + .then((data) => { + afterUpload({ data, file, batchIndex, state, api, progress }) + if (progress.file.percentage === 100) { + progress.file.status = constants.FILE_STATUS.SUCESS + } + }) + .catch((data) => { + if (data.response && data.response.status === 401) { + const tokenParams = { token: props.edm.upload.token, file, type: 'upload' } + api.getToken(tokenParams).then((data) => { + afterUpload({ data, file, batchIndex, state, api, progress }) + }) + } else { + file.state = constants.FILE_STATUS.FAIL + } + }) + } + } + chunkUpload({ state, service, postChunk }) +} + +export const segmentUpload = ({ api, props, service, state, emit, constants }) => (batchIndex, file, progress) => { + if (typeof file.then === 'function') { + file.then((file) => { + segmentUploadInner({ + batchIndex, + api, + service, + state, + emit, + props, + file, + constants, + progress + }) + }) + } else { + segmentUploadInner({ + api, + props, + service, + state, + emit, + constants, + batchIndex, + file, + progress + }) + } +} + +export const batchSegmentUpload = ({ api, constants, props, refs, state }) => ({ docId, batchIndex, batches, progress }) => { + if (batchIndex < batches.length && progress.file.cancelToken) { + const key = docId + '-' + batchIndex + const batch = batches[batchIndex] + + Object.defineProperty(state.batchQueue, key, { + get() { + return state.batchQueueListen[key] + }, + set(value) { + state.batchQueueListen[key] = value + + if (value >= batch.length) { + api.batchSegmentUpload({ + docId, + batchIndex: ++batchIndex, + batches, + progress + }) + } + } + }) + + let index = 0 + + while (batch.length - index > 0) { + api.segmentUpload(batchIndex, batch[index++], progress) + } + } else { + typeof props.edm.upload.closeloading === 'function' && props.edm.upload.closeloading() + + refs[constants.UPLOAD_INNER].upload(state.largeFileInfo[docId]) + } +} + +export const sliceChunk = ({ state, props }) => (file) => { + const chunkSize = file.chunkSize + const chunkBatchArray = [[]] + + state.batchQueue[file.docId + '-0'] = 0 + state.batchQueueListen[file.docId + '-0'] = 0 + + for (let i = 0; i < chunkSize; i++) { + if (file.records.includes(i.toString())) { + continue + } + + const start = i * state.chunkSize + const end = Math.min(file.size, start + state.chunkSize) + const atom = file.raw.slice(start, end) + + atom.chunk = i + 1 + atom.filename = file.name + atom.docId = file.docId + atom.chunkSize = chunkSize + atom.cacheSign = file.cacheSign + atom.records = file.records + atom.percentage = file.percentage + + const promise = new Promise((resolve) => { + if (props.edm.isCheckCode !== true) { + return resolve(atom) + } + const reader = new FileReader() + + reader.readAsArrayBuffer(atom) + reader.onload = (e) => { + if (props.edm.isCheckCode === true) { + const cryptoJS = props.edm.upload.plugin() + const wordArray = cryptoJS.lib.WordArray.create(e.target.result) + const hash = cryptoJS[shaMap.shaMap](wordArray).toString() + atom.hash = hash + } + resolve(atom) + } + }) + + const lastIndex = chunkBatchArray.length - 1 + + if (chunkBatchArray[lastIndex].length < state.chunkBatchLimit) { + chunkBatchArray[lastIndex].push(promise) + } else { + state.batchQueue[file.docId + '-' + chunkBatchArray.length] = 0 + state.batchQueueListen[file.docId + '-' + chunkBatchArray.length] = 0 + chunkBatchArray.push([]) + chunkBatchArray[lastIndex + 1].push(promise) + } + } + + return chunkBatchArray +} + +export const getToken = ({ constants, props, state, t, Modal }) => ({ token, file, isOnlinePreview = false, type = '', isinit = false }) => { + if (props.edm.isExtranet && !isOnlinePreview) { + // EDM 外网场景除在线预览其他场景不需要调用 EDM Token + state.isSuccess = true + state.accept = props.accept + state.singleMaxSize = props.edm.singleFileMaxSize || 200 + + return Promise.resolve(true) + } + + if ((state.isEdm && !token) || typeof token !== 'function') { + Modal.message({ + message: t(constants.EDM.I18NKEY), + status: 'warning', + duration: '2000' + }) + + return new Promise((resolve) => { + resolve(false) + }) + } + + return new Promise((resolve, reject) => { + try { + let promise + + if (isinit) { + !initTokenPromise && (initTokenPromise = token(file)) + promise = initTokenPromise + } else { + promise = token(file) + } + + promise.then((data) => { + const result = data || {} + const whitelist = (result.config && result.config.fileWhiteList) || '' + + state.isSuccess = true + state.accept = type === 'download' || type === 'preview' ? props.accept : `${whitelist},${props.accept}` + + state.headers[constants.EDM.EDMTOKEN] = result.edmToken || '' + state.headers[constants.EDM.TRACEID] = result.traceId || '' + + if (result.config) { + state.singleMaxSize = result.config.singleFileMaxSize + } + state.edmToken = result + resolve(true) + }) + } catch (error) { + reject(new Error(error)) + } + }) +} + +const getTokenResolver = ({ reject, api, file, state, resolve, props, constants, service }) => (data) => { + if (!data) { + const message = '[TINY Error][FileUpload] No edm token' + reject(new Error(message)) + return + } + + const iframeUrl = api.getPreviewUrlSync(file) + + if (iframeUrl) { + state.showPreview = true + state.iframeUrl = iframeUrl + resolve(state.iframeUrl) + return + } + + const watermark = props.edm.preview.watermark || {} + const params = state.fileWater ? constants.EDM.FORMAT : '' + const downParams = state.fileWater ? constants.EDM.WATER : constants.EDM.SOURCE + const tools = props.edm.preview.plugin + + service.all([service.getPreviewUrl(), service.getSingleDownloadUrl()]).then( + service.spread((previewUrl, downloadurl) => { + const serviceUrl = props.edm.preview.serviceUrl + const infoUrl = serviceUrl || previewUrl.replace(/{docId}/, file.docId) + `?${params}docVersion=${file.docVersion}` + + const pageUrl = serviceUrl || previewUrl.replace(/{docId}/, file.docId) + `?type=doc&pageNum=1&${params}docVersion=${file.docVersion}` + + const downloadUrl = + serviceUrl + downloadurl.replace(/{docId}/, file.docId) + `?docId=${file.docId}&docVersion=${file.docVersion}&${downParams}from=Experience&` + + tools.setIsEDM3(true) + tools.setDocumentInfoUrl(infoUrl) + tools.setDownloadUrl(downloadUrl, true) + tools.setPageUrl(pageUrl) + + tools.setWatermarkParameters({ + showWatermark: watermark.showWatermark || 1, + rotation: watermark.rotation || 30, + text: watermark.text || '' + }) + + tools.setPdfjsPaht(props.edm.preview.packageName || constants.EDM.JSLIB) + tools.setAuthToken(state.headers[constants.EDM.EDMTOKEN]) + + state.showPreview = true + state.iframeUrl = props.edm.preview.previewUrl + `${constants.EDM.URLCONTS}${file.docVersion}&docId=${file.docId}` + resolve(state.iframeUrl) + }) + ) +} + +export const previewFile = ({ api, constants, props, service, state }) => (file) => + new Promise((resolve, reject) => { + try { + const tokenParams = { isOnlinePreview: true, file, type: 'preview', token: props.edm.preview.token } + const tokenCatcher = (e) => { + reject(new Error(e)) + } + const tokenResolver = getTokenResolver({ reject, api, file, state, resolve, props, constants, service }) + + api.getToken(tokenParams).then(tokenResolver).catch(tokenCatcher) + } catch (e) { + reject(new Error(e)) + } + }) + +export const getNewTabPreviewUrl = ({ api, props }) => (file) => + new Promise((resolve, reject) => { + api + .getToken({ + token: props.edm.preview.token, + file, + isOnlinePreview: true, + type: 'preview' + }) + .then((data) => { + if (!data) { + reject(new Error('[TINY Error][FileUpload] No edm token')) + return + } + + const iframeUrl = api.getPreviewUrlSync(file) + if (!iframeUrl) { + reject(new Error(new Error('[TINY Error][FileUpload] No preview url'))) + } else { + resolve(iframeUrl) + } + }) + .catch((e) => { + reject(new Error(e)) + }) + }) + +export const getPreviewUrlSync = ({ constants, props, state }) => (file) => { + const edm = props.edm || {} + const preview = edm.preview || {} + const online = preview.online + + if (!online) { + return + } + + const html = online.jslibhtml.split('?').shift() + + if (!html) { + return + } + + const watermark = preview.watermark || {} + const paramsData = { + ...online, + ...watermark, + ...{ + jslibhtml: html, + authToken: state.headers[constants.EDM.EDMTOKEN], + docId: file.docId, + docVersion: file.docVersion || file.version || 'V1', + type: 'doc', + pageNum: '1' + } + } + + const params = [] + + for (let key in paramsData) { + if (Object.prototype.hasOwnProperty.call(paramsData, key)) { + params.push(`${key}=${paramsData[key]}`) + } + } + + const iframeUrl = html + '?' + params.join('&') + + return iframeUrl +} + +export const previewImage = ({ api, props, service, state }) => (file) => + new Promise((resolve, reject) => { + try { + api + .getToken({ + token: props.edm.preview.token, + file, + type: 'preview' + }) + .then((data) => { + if (!data) { + reject(new Error('[TINY Error][FileUpload] No edm token')) + return + } + + service.getPreviewUrl().then((url) => { + const imgParam = Object.assign(file, { + type: 'image', + imageType: 'image' + }) + + url = url.replace(/{docId}/, file.docId) + + service + .post(xss.filterUrl(url), imgParam, { + withCredentials: props.withCredentials, + headers: Object.assign(props.headers, state.headers), + responseType: 'blob' + }) + .then((data) => { + const blob = new Blob([data.data]) + const URL = window.URL || window.webkitURL + const link = URL.createObjectURL(blob) + + resolve(link) + }) + }) + }) + } catch (e) { + reject(new Error(e)) + } + }) + +export const getDialogConfigObj = ({ props, state }) => () => { + const dialogConfigDefault = { + class: 'single-download-modal single-download-modal1', + style: '', + props: { + lockScroll: true, + visible: state.showPreview, + dragable: true, + title: '文档预览', + width: '60%' + }, + on: { + 'update:visible': (value) => (state.showPreview = value) + } + } + let dialogConfig = {} + + if (props.edm && props.edm.preview && typeof props.edm.preview.dialogConfig === 'object') { + dialogConfig = props.edm.preview.dialogConfig || {} + } + + const dialogConfigCopy = extend(true, {}, dialogConfig) + const events = dialogConfigCopy.events || {} + // clazz、style只接受字符串值 + const clazz = dialogConfigCopy.class || '' + const style = dialogConfigCopy.style || '' + + delete dialogConfigCopy.events + delete dialogConfigCopy.class + delete dialogConfigCopy.style + + return extend(true, {}, dialogConfigDefault, { + class: `${dialogConfigDefault.class} ${clazz}`, + style: `${style}`, + props: { ...dialogConfigCopy }, + on: { ...events } + }) +} + +export const computeDocChunkSize = ({ props, state, SIZE_2G, SIZE_20M, SIZE_8M }) => () => { + const isDefaultChunkSize = !(props.edm && props.edm.chunkSize) + let { docSize = SIZE_20M, chunkSize = SIZE_8M } = props.edm || {} + docSize = docSize < 0 ? 0 : docSize + docSize = docSize > SIZE_2G ? SIZE_2G : docSize + + if (docSize) { + chunkSize = chunkSize < 0 ? 0 : chunkSize + } + if (!isDefaultChunkSize) { + const chunkSizes = [64 * 1024, 32 * 1024, 16 * 1024, 8 * 1024, 4 * 1024, 2 * 1024, 0 * 1024] + chunkSizes.some((size) => { + if (chunkSize >= size) { + chunkSize = Math.max(size, 2 * 1024) + return true + } + return false + }) + } + + state.docSize = docSize * 1024 + state.chunkSize = chunkSize * 1024 +} + +export const updateFile = ({ constants, refs }) => (file) => { + refs[constants.UPLOAD_INNER].handleUpdate(file) +} + +export const onBeforeDestroy = (state) => () => { + state.uploadFiles.forEach((file) => { + if (file.url && file.url.indexOf('blob:') === 0) { + URL.revokeObjectURL(file.url) + } + }) +} diff --git a/packages/renderless/src/file-upload/vue.ts b/packages/renderless/src/file-upload/vue.ts new file mode 100644 index 000000000..acd8eead9 --- /dev/null +++ b/packages/renderless/src/file-upload/vue.ts @@ -0,0 +1,248 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { downloadFile as ordinaryDownload } from '@opentiny/vue-renderless/upload-list' + +import { + initService, + getNewTabPreviewUrl, + previewFile, + getToken, + downloadFile, + batchSegmentUpload, + segmentUpload, + sliceChunk, + segmentUploadInit, + largeDocumentUpload, + getFormData, + abort, + clearFiles, + computedUploadDisabled, + getFile, + handleStart, + handleProgress, + handleSuccess, + handleError, + handleRemove, + onBeforeDestroy, + submit, + watchListType, + watchFileList, + handleClick, + getFileUploadUrl, + updateUrl, + previewImage, + startUpload, + getDialogConfigObj, + computeDocChunkSize, + updateFile, + getPreviewUrlSync, + beforeUpload, + computedUploadingSize, + clearUploadingFiles, + calcUploadingFilesInfo, + properFileSize, + addFileToList, + getDownloadFileInfo, + largeDocumentDownload, + sliceDownloadChunk, + batchSegmentDownload, + downloadFileInner, + setWriterFile, + afterDownload +} from './index' +import { isEmptyObject } from '@opentiny/vue-renderless/common/type' + +export const api = [ + 'state', + 'getNewTabPreviewUrl', + 'previewFile', + 'downloadFile', + 'abort', + 'clearFiles', + 'getFile', + 'handleStart', + 'handleProgress', + 'handleSuccess', + 'handleError', + 'handleRemove', + 'submit', + 'handleClick', + 'getFileUploadUrl', + 'updateUrl', + 'previewImage', + 'updateFile' +] + +const initState = ({ api, reactive, computed, inject, ref, vm, props, httpRequest }) => { + const state = reactive({ + url: '', + tempIndex: 1, + draging: false, + uploadFiles: [], + dragOver: false, + httpRequest, + form: inject('form', ref({ default: '' })), + listeners: vm.$listeners, + docSize: 0, // unit(B) + chunkSize: 0, + chunkBatchLimit: 20, + downloadChunkLimit: 5, + batchQueue: {}, + batchQueueListen: {}, + batchCancelToken: {}, + replayAtoms: {}, + chunkUploadUrl: '', + largeFileInfo: {}, + headers: {}, + accept: '', + edmToken: {}, + isSuccess: false, + singleMaxSize: 200, + formData: {}, + showPreview: false, + iframeUrl: '', + fileWater: false, + tabUrl: '', + cacheDocuments: {}, + isEdm: computed(() => !isEmptyObject(props.edm)), + uploadDisabled: computed(() => api.computedUploadDisabled()), + dialogConfigObj: computed(() => api.getDialogConfigObj()), + uploadingFiles: [], + currentUploadingFileUids: [], + uploadingSize: computed(() => api.computedUploadingSize()), + isEntireCheckCode: computed(() => !('isEntireCheckCode' in props.edm && props.edm.isEntireCheckCode !== true)), + downloadBatchQueue: {}, + downloadBatchQueueListen: {}, + dowuloadChunkFile: new Map(), + downloadReplayAtoms: {} + }) + + return state +} + +const initApi = ({ api, state, props, constants, refs, $service, t, Modal }) => { + const { SIZE_2G, SIZE_20M, SIZE_8M } = constants.EDM + + Object.assign(api, { + state, + sliceChunk: sliceChunk({ state, props }), + getFormData: getFormData({ constants, props, state }), + abort: abort({ constants, refs }), + handleClick: handleClick({ constants, refs }), + getFile: getFile(state), + clearFiles: clearFiles(state), + watchFileList: watchFileList({ constants, state }), + watchListType: watchListType({ constants, state }), + onBeforeDestroy: onBeforeDestroy(state), + computedUploadDisabled: computedUploadDisabled({ props, state }), + computedUploadingSize: computedUploadingSize(state), + getFileUploadUrl: getFileUploadUrl($service), + getToken: getToken({ constants, props, state, t, Modal }), + getDialogConfigObj: getDialogConfigObj({ props, state }), + computeDocChunkSize: computeDocChunkSize({ props, state, SIZE_2G, SIZE_20M, SIZE_8M }), + updateFile: updateFile({ constants, refs }), + getPreviewUrlSync: getPreviewUrlSync({ constants, props, state }), + ordinaryDownload: ordinaryDownload($service), + clearUploadingFiles: clearUploadingFiles({ constants, state }), + calcUploadingFilesInfo: calcUploadingFilesInfo({ state }), + properFileSize: properFileSize({ props, state, constants, Modal, t }) + }) +} + +const mergeApi = ({ api, props, $service, state, constants, emit, mode, Modal, t, refs }) => { + Object.assign(api, { + segmentUploadInit: segmentUploadInit({ api, props, service: $service, state, constants }), + segmentUpload: segmentUpload({ api, props, service: $service, state, emit, constants }), + addFileToList: addFileToList({ api, constants, emit, props, state, mode }), + downloadFile: downloadFile({ api, state, props }), + previewImage: previewImage({ api, props, service: $service, state }), + previewFile: previewFile({ api, constants, Modal, props, service: $service, state, t }), + getNewTabPreviewUrl: getNewTabPreviewUrl({ api, props }), + submit: submit({ api, constants, Modal, refs, props, state, t }), + handleStart: handleStart({ api, constants, props, state, refs }), + batchSegmentUpload: batchSegmentUpload({ api, constants, props, refs, state }), + largeDocumentUpload: largeDocumentUpload({ api, Modal, state, emit, constants, t }), + handleProgress: handleProgress({ api, constants, emit, state }), + handleSuccess: handleSuccess({ api, constants, emit, Modal, props, state }), + handleError: handleError({ api, constants, emit, state }), + handleRemove: handleRemove({ api, emit, props, state }), + updateUrl: updateUrl({ api, props, service: $service, state }), + startUpload: startUpload({ api, state, constants, refs, Modal, t }), + beforeUpload: beforeUpload({ api, props, Modal, constants, t, state }), + getDownloadFileInfo: getDownloadFileInfo({ api, props, state, service: $service }), + largeDocumentDownload: largeDocumentDownload({ api, state }), + sliceDownloadChunk: sliceDownloadChunk({ api, state }), + batchSegmentDownload: batchSegmentDownload({ state, api }), + downloadFileInner: downloadFileInner({ api, props, service: $service, state, emit, constants, t, Modal }), + setWriterFile: setWriterFile({ state, emit, props }), + afterDownload: afterDownload({ api, state }) + }) +} + +const initWatch = ({ watch, state, api, props, $service }) => { + watch( + () => props.edm.upload, + (value) => value && api.getToken({ token: value.token, isinit: true }), + { immediate: true, deep: true } + ) + + watch(() => props.listType, api.watchListType) + + watch( + () => props.fileList, + (value) => api.watchFileList(value), + { immediate: true, deep: true } + ) + + watch( + () => props.action, + () => { + if (!props.httpRequest && !state.isEdm) { + api.updateUrl() + } + }, + { immediate: true } + ) + + watch( + () => state.isSuccess, + (value) => value && $service.getSingleUploadUrl().then((url) => (state.url = url)), + { immediate: true } + ) + + watch(() => props.edm, api.computeDocChunkSize, { deep: true, immediate: true }) +} + +export const renderless = ( + props, + { computed, inject, onBeforeUnmount, provide, reactive, ref, watch }, + { t, vm, refs, parent, emit, service, mode, constants }, + { Modal } +) => { + const api = {} + const $service = initService({ props, service }) + const httpRequest = $service.httpRequest + const state = initState({ reactive, computed, api, inject, ref, vm, props, httpRequest }) + + initApi({ api, state, props, constants, refs, $service, t, Modal }) + mergeApi({ api, props, $service, state, constants, emit, mode, Modal, t, refs }) + + provide('uploader', parent) + + // 注册生命周期函数必须要在(watch)异步函数/组件之前,否则会 Vue3 警告 + onBeforeUnmount(api.onBeforeDestroy) + + initWatch({ watch, state, api, props, $service }) + + return api +} diff --git a/packages/renderless/src/floatbar/index.ts b/packages/renderless/src/floatbar/index.ts new file mode 100644 index 000000000..2e4dcf83b --- /dev/null +++ b/packages/renderless/src/floatbar/index.ts @@ -0,0 +1,23 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { xss } from '@opentiny/vue-renderless/common/xss.js' + +export const computeData = ({ props }) => { + if (Array.isArray(props.data) && props.data.length) { + props.data.forEach((item) => { + item.url = xss.filterUrl(item.url) + }) + } + + return props.data +} diff --git a/packages/renderless/src/floatbar/vue.ts b/packages/renderless/src/floatbar/vue.ts new file mode 100644 index 000000000..011ef3abf --- /dev/null +++ b/packages/renderless/src/floatbar/vue.ts @@ -0,0 +1,25 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { computeData } from './index' + +export const api = ['state'] + +export const renderless = (props, { computed, reactive }) => { + const state = reactive({ + data: computed(() => computeData({ props })) + }) + + const api = { state } + + return api +} diff --git a/packages/renderless/src/form-item/index.ts b/packages/renderless/src/form-item/index.ts new file mode 100644 index 000000000..f061c094b --- /dev/null +++ b/packages/renderless/src/form-item/index.ts @@ -0,0 +1,417 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { POSITION, VALIDATE_STATE } from '@opentiny/vue-renderless/common' +import { merge } from '@opentiny/vue-renderless/common/object' +import Validator from '@opentiny/vue-renderless/common/validate' +import { isNull } from '@opentiny/vue-renderless/common/type' +import debounce from '@opentiny/vue-renderless/common/deps/debounce' + +export const watchError = (state) => (value) => { + if (!isNull(value) && state.getValidateType === 'tip') { + state.canShowTip = true + } + + state.validateMessage = value + state.validateState = value ? VALIDATE_STATE.Error : '' +} + +export const watchValidateStatus = (state) => (value) => { + state.validateState = value +} + +export const computedGetValidateType = ({ props, state }) => () => props.validateType || (state.formInstance ? state.formInstance.validateType : '') + +export const computedLabelStyle = ({ props, state }) => () => { + const result = {} + + if (state.form.labelPosition === POSITION.Top) { + return result + } + + const labelWidth = props.labelWidth || state.form.labelWidth + + if (labelWidth) { + result.width = labelWidth + } + + return result +} + +export const computedValueStyle = ({ props, state }) => () => { + const result = {} + + if (state.form.labelPosition === POSITION.Top) { + return result.width = '100%' + } + + const labelWidth = props.labelWidth || state.form.labelWidth + + if (labelWidth) { + if (labelWidth === 'auto') { + result.width = labelWidth + } else { + result.width = `calc(100% - ${labelWidth})` + } + } + + return result +} + +export const computedContentStyle = ({ props, state }) => () => { + const result = {} + const label = props.label + + if (state.form.labelPosition === POSITION.Top || state.form.inline) { + return result + } + + if (!label && !props.labelWidth && state.isNested) { + return result + } + + const labelWidth = props.labelWidth || state.form.labelWidth + + if (labelWidth === 'auto') { + if (props.labelWidth === 'auto') { + result.marginLeft = state.computedLabelWidth + } else if (state.form.labelWidth === 'auto') { + result.marginLeft = state.formInstance.state.autoLabelWidth + } + } else { + result.marginLeft = labelWidth + } + + return result +} + +export const computedForm = ({ constants, instance, state }) => () => { + const { FORM_NAME, FORM_ITEM_NAME } = constants + let parent = instance.$parent + let parentName = parent.$options.componentName + + while (parentName !== FORM_NAME) { + if (parentName === FORM_ITEM_NAME) { + state.isNested = true + } + + parent = parent.$parent + parentName = parent.$options.componentName + } + + return parent +} + +export const computedIsRequired = ({ api, state }) => () => { + if (state.validationRequired) { + return true + } + + let rules = api.getRules() + let isRequired = false + + if (rules && rules.length) { + rules.every((rule) => { + if (rule.required) { + isRequired = true + return false + } + + return true + }) + } + + return isRequired +} + +export const getPropByPath = (obj, path, strict) => { + let findObj = obj + + path = path.replace(/\[(\w+)\]/g, '.$1') + path = path.replace(/^\./, '') + + let index = 0 + let keys = path.split('.') + + for (let len = keys.length; index < len - 1; ++index) { + if (!findObj && !strict) { + break + } + + let key = keys[index] + + if (key in findObj) { + findObj = findObj[key] + } else { + if (strict) { + throw new Error('[Tiny Form] please transfer a valid prop path to form item!') + } + + break + } + } + + return { + o: findObj, + k: keys[index], + v: findObj ? findObj[keys[index]] : null + } +} + +export const computedFieldValue = ({ props, state }) => () => { + const model = state.form.model + + if (!model || !props.prop) { + return + } + + let path = props.prop + + if (path.includes(':')) { + path = path.replace(/:/, '.') + } + + return getPropByPath(model, path, true).v +} + +export const mounted = ({ api, instance, props, state, refs }) => () => { + state.tooltip = refs.tooltip + + if (props.prop) { + api.dispatch('Form', 'form:addField', instance) + + let initialValue = state.fieldValue + + if (Array.isArray(initialValue)) { + initialValue = [].concat(initialValue) + } + + state.initialValue = initialValue + api.addValidateEvents() + } +} + +export const unmounted = ({ api, instance, state }) => () => { + state.canShowTip = false + api.dispatch('Form', 'form:removeField', instance) +} + +export const validate = ({ api, props, state, t }) => (trigger, callback = () => undefined) => { + state.validateDisabled = false + + const rules = api.getFilteredRule(trigger) + + if ((!rules || rules.length === 0) && props.required === undefined) { + callback() + return true + } + + state.validateState = VALIDATE_STATE.Validating + + const descriptor = {} + + if (rules && rules.length > 0) { + rules.forEach((rule) => { + delete rule.trigger + }) + } + + descriptor[props.prop] = rules + + const validator = new Validator(descriptor, t) + const model = {} + + model[props.prop] = state.fieldValue + + validator.validate(model, { firstFields: true }, (errors, invalidFields) => { + api.clearValidate() + + const handlerError = () => { + state.validateState = !errors ? VALIDATE_STATE.Success : VALIDATE_STATE.Error + + state.validateMessage = errors ? errors[0].message : '' + state.canShowTip = !!errors + + callback(state.validateMessage, invalidFields) + + state.formInstance && state.formInstance.$emit('validate', props.prop, !errors, state.validateMessage || null) + } + + if (errors && state.stowed[0] === errors[0].field) { + handlerError() + + /* + * 去掉了nextTick,修改为同步校验,保证 "第一次校验" 和 "重置后再次校验" 都是同步校验 + * + * 只在两次或多次触发相同field情况下执行异步触发校验 + * nextTick(handlerError) + */ + + return + } + + errors && (state.stowed[0] = errors[0].field) + + handlerError() + }) +} + +export const clearValidate = (state) => () => { + state.validateState = '' + state.validateMessage = '' + state.validateDisabled = false +} + +export const resetField = ({ api, nextTick, props, state }) => () => { + if (state.getValidateType === 'tip') { + state.canShowTip = false + } + + state.validateState = '' + state.validateMessage = '' + + let model = state.form.model + let value = state.fieldValue + let path = props.prop + + if (path.includes(':')) { + path = path.replace(/:/, '.') + } + + let prop = getPropByPath(model, path, true) + + state.validateDisabled = true + + if (Array.isArray(value)) { + prop.o[prop.k] = [].concat(state.initialValue) + } else { + prop.o[prop.k] = state.initialValue + } + // reset validateDisabled after onFieldChange triggered + nextTick(() => { + state.validateDisabled = false + }) + + setTimeout(() => state.validateState && (state.validateState = '')) + + api.broadcast('timeSelect', 'fieldReset', state.initialValue) +} + +export const getRules = ({ props, state }) => () => { + let formRules = state.form.rules + const selfRules = props.rules + const requiredRule = props.required !== undefined ? { required: !!props.required } : [] + const prop = getPropByPath(formRules, props.prop || '') + + formRules = formRules ? prop.o[props.prop || ''] || prop.v : [] + + return [].concat(selfRules || formRules || []).concat(requiredRule) +} + +export const getFilteredRule = (api) => (trigger) => { + const rules = api.getRules() + + return rules + .filter((rule) => { + if (!rule.trigger || trigger === '') { + return true + } + + if (Array.isArray(rule.trigger)) { + return rule.trigger.includes(trigger) + } + + return rule.trigger === trigger + }) + .map((rule) => merge({}, rule)) +} + +export const onFieldBlur = (api) => () => { + api.validate('blur') +} + +export const onFieldChange = ({ api, state }) => () => { + if (state.validateDisabled) { + state.validateDisabled = false + return + } + + api.validate('change') +} + +export const updateComputedLabelWidth = (state) => (width) => { + state.computedLabelWidth = width ? `${width}px` : '' +} + +export const addValidateEvents = ({ api, instance, props, state }) => () => { + const rules = api.getRules() + + if (rules.length || props.required !== undefined) { + const manual = props.manual || (state.formInstance ? state.formInstance.manual : false) + + if (!manual) { + instance.$on('form.blur', api.onFieldBlur) + instance.$on('form.change', api.onFieldChange) + } + } +} + +export const removeValidateEvents = (instance) => () => { + instance.$off() +} + +export const updateTip = ({ refs, state }) => () => { + if (state.getValidateType !== 'tip' && !state.canShowTip) { + return + } + + const tooltip = refs.tooltip + + if (!tooltip) { + return + } + + tooltip.updatePopper() +} + +export const getValueByPath = (object, prop) => { + prop = prop || '' + + const paths = prop.split('.') + let current = object + let result = null + + for (let i = 0, len = paths.length; i < len; i++) { + const path = paths[i] + + if (!current) { + break + } + + if (i === len - 1) { + result = current[path] + break + } + + current = current[path] + } + + return result +} + +export const wrapValidate = ({ validateFunc, props }) => { + if (props.validateDebounce) { + return debounce(50, validateFunc) + } else { + return validateFunc + } +} diff --git a/packages/renderless/src/form-item/vue.ts b/packages/renderless/src/form-item/vue.ts new file mode 100644 index 000000000..db1b1f9af --- /dev/null +++ b/packages/renderless/src/form-item/vue.ts @@ -0,0 +1,139 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + validate, + clearValidate, + resetField, + getRules, + getFilteredRule, + onFieldBlur, + onFieldChange, + updateComputedLabelWidth, + addValidateEvents, + removeValidateEvents, + mounted, + unmounted, + watchError, + watchValidateStatus, + computedLabelStyle, + computedValueStyle, + computedContentStyle, + computedForm, + computedIsRequired, + computedFieldValue, + computedGetValidateType, + updateTip, + wrapValidate +} from './index' + +export const api = [ + 'state', + 'validate', + 'clearValidate', + 'resetField', + 'getRules', + 'getFilteredRule', + 'onFieldBlur', + 'onFieldChange', + 'updateComputedLabelWidth', + 'addValidateEvents', + 'removeValidateEvents', + 'updateTip' +] + +const initState = ({ reactive, computed, api, mode, inject, props }) => { + const state = reactive({ + mode, + validateState: '', + validateMessage: '', + validateDisabled: false, + validator: {}, + stowed: [], + isNested: false, + computedLabelWidth: '', + initialValue: null, + canShowTip: false, + // 兼容 2.0 validation 的 required + validationRequired: false, + tooltip: null, + formInstance: inject('form', null), + labelFor: computed(() => props.for || props.prop), + labelStyle: computed(() => api.computedLabelStyle()), + valueStyle: computed(() => api.computedValueStyle()), + contentStyle: computed(() => api.computedContentStyle()), + form: computed(() => api.computedForm()), + fieldValue: computed(() => api.computedFieldValue()), + isRequired: computed(() => api.computedIsRequired()), + formSize: computed(() => state.formInstance.size), + formItemSize: computed(() => props.size || state.formSize), + sizeClass: computed(() => state.formItemSize), + getValidateType: computed(() => api.computedGetValidateType()) + }) + + return state +} + +const initApi = ({ api, state, dispatch, broadcast, refs, props, constants, instance, t, nextTick }) => { + Object.assign(api, { + state, + dispatch, + broadcast, + watchError: watchError(state), + updateTip: updateTip({ refs, state }), + watchValidateStatus: watchValidateStatus(state), + computedLabelStyle: computedLabelStyle({ props, state }), + computedValueStyle: computedValueStyle({ props, state }), + computedContentStyle: computedContentStyle({ props, state }), + computedForm: computedForm({ constants, instance, state }), + computedFieldValue: computedFieldValue({ props, state }), + computedGetValidateType: computedGetValidateType({ props, state }), + clearValidate: clearValidate(state), + getRules: getRules({ props, state }), + updateComputedLabelWidth: updateComputedLabelWidth(state), + removeValidateEvents: removeValidateEvents(instance), + unmounted: unmounted({ api, instance, state }), + mounted: mounted({ api, instance, props, state, refs }), + computedIsRequired: computedIsRequired({ api, state }), + resetField: resetField({ api, nextTick, props, state }), + getFilteredRule: getFilteredRule(api), + onFieldBlur: onFieldBlur(api), + onFieldChange: onFieldChange({ api, state }), + addValidateEvents: addValidateEvents({ api, instance, props, state }), + validate: wrapValidate({ validateFunc: validate({ api, props, state, t }), props }) + }) +} + +const initWatch = ({ watch, api, props }) => { + watch(() => props.error, api.watchError, { immediate: true }) + + watch(() => props.validateStatus, api.watchValidateStatus) +} + +export const renderless = ( + props, + { computed, inject, onMounted, onUnmounted, provide, reactive, watch }, + { vm: instance, constants, t, nextTick, refs, broadcast, dispatch, mode } +) => { + const api = {} + const state = initState({ reactive, computed, api, mode, inject, props }) + + provide('formItem', instance) + + initApi({ api, state, dispatch, broadcast, refs, props, constants, instance, t, nextTick }) + initWatch({ watch, api, props }) + + onMounted(api.mounted) + onUnmounted(api.unmounted) + + return api +} diff --git a/packages/renderless/src/form/index.ts b/packages/renderless/src/form/index.ts new file mode 100644 index 000000000..a42da412e --- /dev/null +++ b/packages/renderless/src/form/index.ts @@ -0,0 +1,184 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { merge } from '@opentiny/vue-renderless/common/object' + +export const watchRules = ({ api, props, state }) => (newRules = {}, oldRules = {}) => { + const newValidFields = Object.keys(newRules) + const oldValidFields = Object.keys(oldRules) + const removeValidFields = oldValidFields.filter((item) => !newValidFields.includes(item)) + api.clearValidate(removeValidFields) + + state.fields.forEach((field) => { + field.removeValidateEvents() + field.addValidateEvents() + }) + + if (props.validateOnRuleChange) { + api.validate(() => undefined) + } +} + +export const computedAutoLabelWidth = ({ state }) => () => { + if (!state.potentialLabelWidthArr.length) { + return 0 + } + + const max = Math.max(...state.potentialLabelWidthArr) + + return max ? `${max}px` : '' +} + +export const created = ({ parent, state }) => () => { + parent.$on('form:addField', (field) => { + if (field) { + state.fields.push(field) + } + }) + /* istanbul ignore next */ + parent.$on('form:removeField', (field) => { + if (field.prop) { + state.fields.splice(state.fields.indexOf(field), 1) + } + }) +} + +export const resetFields = ({ props, state }) => () => { + if (!props.model) { + return + } + + state.fields.forEach((field) => { + field.resetField() + }) +} + +export const updateTip = ({ props, state }) => () => { + if (!props.model) { + return + } + + state.fields.forEach((field) => { + field.updateTip() + }) +} + +export const clearValidate = (state) => (props = []) => { + const fields = props.length + ? typeof props === 'string' + ? state.fields.filter((field) => props === field.prop) + : state.fields.filter((field) => props.includes(field.prop)) + : state.fields + + fields.forEach((field) => { + field.clearValidate() + }) +} + +export const validate = ({ props, state }) => (callback) => { + if (!props.model) { + return + } + + let promise + + if (typeof callback !== 'function' && window.Promise) { + promise = new window.Promise((resolve, reject) => { + callback = (valid) => { + valid ? resolve(valid) : reject(valid) + } + }) + } + + let valid = true + let count = 0 + + // 如果需要验证的fields为空,调用验证时立刻返回callback + if (state.fields.length === 0 && callback) { + callback(true) + } + + let invalidFields = {} + + state.fields.forEach((field) => { + field.validate('', (message, field) => { + if (message) { + valid = false + } + + invalidFields = merge({}, invalidFields, field) + + if (typeof callback === 'function' && ++count === state.fields.length) { + callback(valid, invalidFields) + } + }) + }) + + if (promise) { + return promise + } +} + +export const validateField = (state) => (props, cb) => { + props = [].concat(props) + + const fields = state.fields.filter((field) => props.includes(field.prop)) + + if (!fields.length) { + return + } + + fields.forEach((field) => { + field.validate('', cb) + }) +} + +export const getLabelWidthIndex = (state) => (width) => { + const index = state.potentialLabelWidthArr.indexOf(width) + + if (index === -1) { + throw new Error('unpected width ', width) + } + + return index +} + +export const registerLabelWidth = ({ api, state }) => (val, oldVal) => { + if (val && oldVal) { + const index = api.getLabelWidthIndex(oldVal) + state.potentialLabelWidthArr.splice(index, 1, val) + } else if (val) { + state.potentialLabelWidthArr.push(val) + } +} + +export const deregisterLabelWidth = ({ api, state }) => (val) => { + const index = api.getLabelWidthIndex(val) + state.potentialLabelWidthArr.splice(index, 1) +} + +export const bindDialogEvent = ({ api, dialog, state }) => { + if (dialog) { + dialog.state.emitter.on('boxclose', (isFormReset = true) => { + isFormReset ? api.resetFields() : api.clearValidate() + }) + + dialog.state.emitter.on('boxdrag', () => { + if (!state.timer) { + state.timer = setTimeout(() => { + state.timer = null + api.updateTip() + }, 10) + } + }) + } +} diff --git a/packages/renderless/src/form/vue.ts b/packages/renderless/src/form/vue.ts new file mode 100644 index 000000000..0787799de --- /dev/null +++ b/packages/renderless/src/form/vue.ts @@ -0,0 +1,88 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { + watchRules, + computedAutoLabelWidth, + created, + resetFields, + clearValidate, + validate, + validateField, + getLabelWidthIndex, + registerLabelWidth, + deregisterLabelWidth, + updateTip, + bindDialogEvent +} from './index' + +export const api = [ + 'state', + 'resetFields', + 'clearValidate', + 'validate', + 'validateField', + 'getLabelWidthIndex', + 'registerLabelWidth', + 'deregisterLabelWidth', + 'updateTip' +] + +export const renderless = (props, { computed, inject, provide, reactive, watch }, { parent }) => { + const api = {} + const dialog = inject('dialog', null) + + const state = reactive({ + fields: [], + timer: null, + potentialLabelWidthArr: [], + autoLabelWidth: computed(() => api.computedAutoLabelWidth()), + hasRequired: computed(() => { + if (props.rules) { + return Object.values(props.rules).find((ruleOrRules) => { + if (Array.isArray(ruleOrRules)) { + return ruleOrRules.some((r) => r.required) + } else { + return ruleOrRules.required + } + }) + } else { + return false + } + }) + }) + + Object.assign(api, { + state, + updateTip: updateTip({ props, state }), + computedAutoLabelWidth: computedAutoLabelWidth({ state }), + created: created({ parent, state }), + resetFields: resetFields({ props, state }), + clearValidate: clearValidate(state), + validate: validate({ props, state }), + validateField: validateField(state), + getLabelWidthIndex: getLabelWidthIndex(state), + registerLabelWidth: registerLabelWidth({ api, state }), + deregisterLabelWidth: deregisterLabelWidth({ api, state }), + watchRules: watchRules({ api, props, state }) + }) + + api.created() + + provide('form', parent) + + bindDialogEvent({ api, dialog, state }) + + watch(() => props.rules, api.watchRules) + + return api +} diff --git a/packages/renderless/src/fullscreen/index.ts b/packages/renderless/src/fullscreen/index.ts new file mode 100644 index 000000000..8790a9e86 --- /dev/null +++ b/packages/renderless/src/fullscreen/index.ts @@ -0,0 +1,141 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' + +export const toggle = ({ state, api }) => (value) => { + if (value === undefined) { + // 如果已经是全屏状态,则退出 + if (state.isFullscreen) { + api.exit() + } else { + api.request() + } + } else { + value ? api.request() : api.exit() + } +} + +export const request = ({ props, state, vm, sf, api }) => () => { + const change = () => { + if (state.isPageOnly) { + state.isFullscreen = true + + api.onChangeFullscreen() + off(document, 'keyup', api.keypressCallback) + on(document, 'keyup', api.keypressCallback) + } else { + sf.off('change', api.fullScreenCallback) + sf.on('change', api.fullScreenCallback) + sf.request(props.teleport ? document.body : vm.$el) + } + if (props.teleport) { + // teleport:将目标元素挪到body下,并在原地留一个标记用于还原 + if (vm.$el.parentNode === document.body) { + return + } + + state.__parentNode = vm.$el.parentNode + state.__token = document.createComment('fullscreen-token') + state.__parentNode.insertBefore(state.__token, vm.$el) + + document.body.appendChild(vm.$el) + } + } + + props.beforeChange ? props.beforeChange(change) : change() +} + +export const exit = ({ state, api, sf, props }) => () => { + const change = () => { + if (!state.isFullscreen) { + return + } + + if (state.isPageOnly) { + state.isFullscreen = false + + api.onChangeFullscreen() + off(document, 'keyup', api.keypressCallback) + } else { + sf.exit() + } + } + + props.beforeChange ? props.beforeChange(change) : change() +} + +export const shadeClick = ({ props, vm, api }) => (e) => { + if (e.target === vm.$el) { + if (props.exitOnClickWrapper) { + api.exit() + } + } +} + +// 全屏api事件回调 +export const fullScreenCallback = ({ state, sf, api }) => () => { + if (!sf.isFullscreen) { + sf.off('change', api.fullScreenCallback) + } + + state.isFullscreen = sf.isFullscreen + + api.onChangeFullscreen() +} + +// 按键回调 +export const keypressCallback = (api) => (e) => { + if (e.key === 'Escape') { + api.exit() + } +} + +// isFullscreen变化时,上报事件 +export const onChangeFullscreen = ({ props, state, vm, emit }) => () => { + if (!state.isFullscreen) { + if (props.teleport && state.__parentNode) { + // 还原位置 + state.__parentNode.insertBefore(vm.$el, state.__token) + state.__parentNode.removeChild(state.__token) + } + } + + emit('change', state.isFullscreen) + emit('update:fullscreen', state.isFullscreen) +} + +export const enter = (api) => () => { + api.request() +} + +export const getState = (state) => () => state.isFullscreen + +export const computeWrapperStyle = ({ props, state }) => () => { + let style = {} + + if ((state.isPageOnly || props.teleport) && state.isFullscreen) { + Object.assign(style, { + position: 'fixed', + left: '0', + top: '0', + width: '100%', + height: '100%' + }) + } + + if (style && props.zIndex) { + style.zIndex = props.zIndex + } + + return style +} diff --git a/packages/renderless/src/fullscreen/vue.ts b/packages/renderless/src/fullscreen/vue.ts new file mode 100644 index 000000000..35eb02d83 --- /dev/null +++ b/packages/renderless/src/fullscreen/vue.ts @@ -0,0 +1,57 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import sf from '@opentiny/vue-renderless/common/deps/fullscreen/screenfull' +import { exit, enter, toggle, request, getState, shadeClick, keypressCallback, fullScreenCallback, onChangeFullscreen, computeWrapperStyle } from './index' + +export const api = ['state', 'exit', 'enter', 'toggle', 'request', 'getState', 'shadeClick', 'keypressCallback', 'fullScreenCallback', 'onChangeFullscreen'] + +export const renderless = (props, { reactive, computed, watch }, { vm, emit }) => { + const api = {} + + const state = reactive({ + isFullscreen: false, + isEnabled: false, + support: computed(() => state.isEnabled), + // 如果不支持浏览器全屏,改用网页全屏 + isPageOnly: computed(() => props.pageOnly || !sf.isEnabled), + wrapperStyle: computed(() => api.computeWrapperStyle()) + }) + + Object.assign(api, { + state, + getState: getState(state), + enter: enter(api), + exit: exit({ state, api, sf, props }), + toggle: toggle({ state, api }), + keypressCallback: keypressCallback(api), + shadeClick: shadeClick({ props, vm, api }), + request: request({ props, state, vm, sf, api }), + fullScreenCallback: fullScreenCallback({ state, sf, api }), + computeWrapperStyle: computeWrapperStyle({ props, state }), + onChangeFullscreen: onChangeFullscreen({ props, state, vm, emit }) + }) + + watch( + () => props.fullscreen, + (value) => { + if (value !== state.isFullscreen) { + value ? api.request() : api.exit() + } + }, + { lazy: true } + ) + + state.isEnabled = sf.isEnabled + + return api +} diff --git a/packages/renderless/src/grid/core/index.ts b/packages/renderless/src/grid/core/index.ts new file mode 100644 index 000000000..5ce8d05fe --- /dev/null +++ b/packages/renderless/src/grid/core/index.ts @@ -0,0 +1,16 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import StoreMap from './storeMap' +import Interceptor from './interceptor' + +export { StoreMap, Interceptor } diff --git a/packages/renderless/src/grid/core/interceptor.ts b/packages/renderless/src/grid/core/interceptor.ts new file mode 100644 index 000000000..68f991d99 --- /dev/null +++ b/packages/renderless/src/grid/core/interceptor.ts @@ -0,0 +1,72 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import { toString, each, remove } from '../static' + +const toType = (type) => toString(type).replace('_', '').toLowerCase() +const eventTypes = [ + 'created', + 'mounted', + 'activated', + 'beforeDestroy', + 'destroyed', + 'event.clearActived', + 'event.clearFilter', + 'event.showMenu', + 'event.keydown' +].map(toType) +const _storeMap = {} + +const Interceptor = { + mixin(map) { + each(map, (callback, type) => Interceptor.add(type, callback)) + return Interceptor + }, + get(type) { + return _storeMap[toType(type)] || [] + }, + add(type, callback) { + const selfType = toType(type) + + if (callback && ~eventTypes.indexOf(selfType)) { + _storeMap[selfType] = _storeMap[selfType] ? _storeMap[selfType] : [] + + _storeMap[selfType].push(callback) + } + + return Interceptor + }, + delete(type, callback) { + const eList = _storeMap[toType(type)] + + if (eList) { + remove(eList, (cb) => cb === callback) + } + + return Interceptor + } +} + +export default Interceptor diff --git a/packages/renderless/src/grid/core/storeMap.ts b/packages/renderless/src/grid/core/storeMap.ts new file mode 100644 index 000000000..c34fded48 --- /dev/null +++ b/packages/renderless/src/grid/core/storeMap.ts @@ -0,0 +1,47 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +// 全局的快捷菜单 +const _storeMap = {} + +const storeMap = { + mixin(map) { + Object.assign(_storeMap, map) + return storeMap + }, + get(type) { + return _storeMap[type] + }, + add(type, callback) { + _storeMap[type] = callback + return storeMap + }, + delete(type) { + delete _storeMap[type] + return storeMap + } +} + +export default storeMap diff --git a/packages/renderless/src/grid/plugins/export.ts b/packages/renderless/src/grid/plugins/export.ts new file mode 100644 index 000000000..e9ab24c19 --- /dev/null +++ b/packages/renderless/src/grid/plugins/export.ts @@ -0,0 +1,207 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import { xss } from '@opentiny/vue-renderless/common/xss.js' +import browser from '@opentiny/vue-renderless/common/browser' +import { toTreeArray } from '../static' +import { getCellValue, getFuncText } from '../utils' +import { exportExcel } from './exportExcel' + +const getCsvLabelData = (columns, oData, tableElem) => { + const trElemList = tableElem.querySelectorAll('.tiny-grid__body-wrapper.body__wrapper .tiny-grid-body__row') + + const trData = [] + + for (let i = 0, len = trElemList.length; i < len; i++) { + const item = {} + const trElem = trElemList[i] + + columns.forEach((column) => { + const cell = trElem.querySelector(`.${column.id}`) + item[column.id] = cell ? cell.innerText.trim() : '' + }) + + trData.push(item) + } + + return trData +} + +const getCsvData = (opts, oData, oColumns, tableElem) => { + const isOriginal = opts.original + let columns = opts.columns ? opts.columns : oColumns + + if (opts.columnFilterMethod) { + columns = columns.filter(opts.columnFilterMethod) + } + + let datas = opts.data ? opts.data : isOriginal ? oData : getCsvLabelData(columns, oData, tableElem) + + if (opts.dataFilterMethod) { + datas = datas.filter(opts.dataFilterMethod) + } + + return { columns, datas } +} + +const getCsvContent = ($table, opts, oColumns, oData) => { + const isOriginal = opts.original + const tableEl = $table.$el + const tab = opts.useTabs === false ? '' : '\t' + const { columns, datas } = getCsvData(opts, oData, oColumns, tableEl) + let content = datas.length ? '\uFEFF' : '' + const transfrom = (str) => { + if (typeof str === 'string' && str.replace(/ /g, '').match(/[\s,"]/)) { + str = '"' + str.replace(/"/g, '""') + '"' + } + + return str + tab + } + + if (opts.isHeader) { + content += columns.map(({ own }) => transfrom(getFuncText(own.title || own.label))).join(',') + '\n' + } + + datas.forEach((row, rowIndex) => { + if (isOriginal) { + content += + columns + .map((column) => { + if (column.type === 'index') { + return column.indexMethod ? column.indexMethod(rowIndex) : rowIndex + 1 + } + + return transfrom(getCellValue(row, column)) + }) + .join(',') + '\n' + } else { + content += columns.map((column) => transfrom(row[column.id])).join(',') + '\n' + } + }) + + if (opts.isFooter) { + const footerData = $table.footerData + const footers = opts.footerFilterMethod ? footerData.filter(opts.footerFilterMethod) : footerData + const filterMaps = $table.tableColumn.map((column) => ~columns.indexOf(column)) + + footers.forEach((rows) => { + content += rows.filter((val, colIndex) => filterMaps[colIndex]).join(',') + '\n' + }) + } + + return content +} + +const getCsvUrl = (opts, content) => { + if (window.Blob && window.URL && window.URL.createObjectURL && browser.name !== 'safari') { + return URL.createObjectURL(new Blob([content], { type: 'text/csv' })) + } + + return `data:attachment/csv;charset=utf-8,${encodeURIComponent(content)}` +} + +const downloadCsc = (options, content) => { + if (!options.download) { + return Promise.resolve(content) + } + + if (navigator.msSaveBlob && window.Blob) { + navigator.msSaveBlob(new Blob([content], { type: 'text/csv;charset=utf-8' }), options.filename) + } else if (browser.name === 'ie') { + const win = window.top.open('about:blank', '_blank') + + win.opener = null + win.document.charset = 'utf-8' + win.document.write(content) + win.document.close() + win.document.execCommand('SaveAs', options.filename) + win.close() + } else { + const linkElem = document.createElement('a') + + linkElem.target = '_blank' + linkElem.rel = 'noopener noreferrer' + linkElem.download = options.filename + linkElem.href = xss.filterUrl(getCsvUrl(options, content)) + document.body.appendChild(linkElem) + linkElem.click() + document.body.removeChild(linkElem) + } +} + +/** + * 导出 csv 文件 + * 如果是启用了可视渲染,则只能导出数据源,可以配合 dataFilterMethod 函数自行转换数据 + * 如果是树表格,则默认是导出所有节点 + */ +export default { + _exportCsv(options) { + let { visibleColumn, scrollXLoad, scrollYLoad, treeConfig } = this + + let mergedOpts = { + columns: null, + columnFilterMethod: (column) => column.property && !['index', 'selection', 'radio'].includes(column.type), + download: true, + data: null, + dataFilterMethod: null, + filename: 'table.csv', + footerFilterMethod: null, + isHeader: true, + isFooter: true, + original: !!treeConfig, + ...options + } + + if (!mergedOpts.filename.includes('.csv')) { + mergedOpts.filename += '.csv' + } + + if (!mergedOpts.original) { + if (scrollXLoad || scrollYLoad) { + mergedOpts.original = true + } + } + + let columns = visibleColumn + let oData = this.tableFullData + + if (treeConfig) { + oData = toTreeArray(oData, treeConfig) + } + + oData.forEach((value) => { + Object.keys(value).forEach((key) => { + if (value[key] === 0) { + value[key] = '0' + } + }) + }) + + return downloadCsc(mergedOpts, getCsvContent(this, mergedOpts, columns, oData)) + }, + _exportExcel(options) { + exportExcel(this, options) + } +} diff --git a/packages/renderless/src/grid/plugins/exportExcel.ts b/packages/renderless/src/grid/plugins/exportExcel.ts new file mode 100644 index 000000000..f1c6e5117 --- /dev/null +++ b/packages/renderless/src/grid/plugins/exportExcel.ts @@ -0,0 +1,585 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { extend } from '@opentiny/vue-renderless/common/object' +import browser from '@opentiny/vue-renderless/common/browser' + +const isIE = browser.name === 'ie' +const rgbRegExp = /^rgba?\((\d+),\s(\d+),\s(\d+)([\s\S]*)\)$/ +const hexRegExp = /^#([a-zA-Z0-9]{3}|[a-zA-Z0-9]{6})$/ + +function computeColor(rgbColor) { + const rgb = rgbRegExp.exec(rgbColor).slice(1, 4) + return parseInt(rgb[0]).toString(16) + parseInt(rgb[1]).toString(16) + parseInt(rgb[2]).toString(16) +} + +function getBgc(dom) { + const getComputedStyle = window.getComputedStyle + + const backgroundColor = isIE ? dom.currentStyle.backgroundColor : getComputedStyle(dom).backgroundColor + + if (rgbRegExp.test(backgroundColor)) { + return computeColor(backgroundColor) + } else if (hexRegExp.test(backgroundColor)) { + const bgc = backgroundColor.slice(1) + + if (bgc.length === 3) { + return bgc + .split('') + .map((s) => s + s) + .join('') + } + + return bgc + } + + return 'ffffff' +} + +function funcFromCodePoint() { + let codeUnitArr = [] + let codeLength = 0 + let resultStr = '' + + for (let i = 0, length = arguments.length; i !== length; ++i) { + let cp = Number(arguments[i]) + + if (!(cp < 0x10FFFF && cp >>> 0 === cp)) { + throw new RangeError('Invalid code point: ' + cp) + } + + if (cp <= 0xFFFF) { + codeLength = codeUnitArr.push(cp) + } else { + cp -= 0x10000 + codeLength = codeUnitArr.push((cp >> 10) + 0xD800, (cp % 0x400) + 0xDC00) + } + + if (codeLength >= 0x3FFF) { + resultStr += String.fromCharCode.apply(null, codeUnitArr) + codeUnitArr.length = 0 + } + } + + return resultStr + String.fromCharCode.apply(null, codeUnitArr) +} + +const defaultOptions = { + plugins: { + XLSX: null, // xlsx 插件 + XLSXX: null, // xlsx-style 插件 + FileSaver: null // FileSaver 插件 + }, + table: { + sheetName: 'tiny-sheet', + formatMethod: ({ value, type }) => ({ value, type }), + styleMethod: ({ style }) => style, + rowHeightMethod: ({ height }) => height, + columnWidthMethod: ({ width }) => width, + mergesMethod: (merges) => merges + } +} + +function s2ab(s) { + const buf = new ArrayBuffer(s.length) + const view = new Uint8Array(buf) + + for (let i = 0; i !== s.length; i++) { + view[i] = s.charCodeAt(i) & 0xFF + } + + return buf +} + +function adjustHeight(hpx) { + const n = parseInt(hpx / 36) + return hpx - 10 * n +} + +function initHeaderDatas({ datas, headerRowCount, headerTrs }) { + let maxColSpanCount = [-1, 0] + + for (let i = 0; i < headerRowCount; i++) { + const childNodes = headerTrs[i].childNodes + let colSpanCount = 0 + + for (let j = 0; j < childNodes.length; j++) { + if (~childNodes[j].className.split(/\s/).indexOf('col__gutter')) { + break + } + + colSpanCount += childNodes[j].colSpan + } + + if (colSpanCount > maxColSpanCount[1]) { + maxColSpanCount[0] = i + maxColSpanCount[1] = colSpanCount + } + } + + for (let i = 0; i < headerRowCount; i++) { + datas.push([]) + + for (let j = 0; j < maxColSpanCount[1]; j++) { + datas[i].push('') + } + } +} + +function buildHeaderMerges({ datas, headerTrs, rowHeightMethod, ths, ws }) { + for (let i = 0; i < headerTrs.length; i++) { + const headerTrRect = headerTrs[i].getBoundingClientRect() + const childNodes = headerTrs[i].childNodes + let rowHeight = Math.round(headerTrRect.height) + let lastColSpan = 0 + + rowHeight = rowHeightMethod ? rowHeightMethod({ rowIndex: i, height: rowHeight }) : rowHeight + ws['!rows'].push({ hpx: adjustHeight(rowHeight) }) + + for (let j = 0; j < childNodes.length; j++) { + if (~childNodes[j].className.split(/\s/).indexOf('col__gutter')) { + break + } + + ths.push(childNodes[j]) + + const colSpan = childNodes[j].colSpan + const rowSpan = childNodes[j].rowSpan + const textContent = childNodes[j].textContent + + if (colSpan > 1) { + ws['!merges'].push({ + s: { r: i, c: lastColSpan }, + e: { r: i, c: lastColSpan + colSpan - 1 } + }) + } + + if (rowSpan > 1) { + ws['!merges'].push({ + s: { r: i, c: lastColSpan }, + e: { r: i + rowSpan - 1, c: lastColSpan } + }) + } + + if (i !== headerTrs.length - 1) { + datas[i].splice(lastColSpan, 1, textContent) + } + + lastColSpan += colSpan + } + } +} + +function buildColids({ $table, colids, columnWidthMethod, datas, ths, ws }) { + const getColWidth = (column, level) => { + if (column.children) { + for (let i = 0; i < column.children.length; i++) { + getColWidth(column.children[i], level + 1) + } + } else { + const colid = column.id + + for (let i = 0; i < ths.length; i++) { + if (ths[i].dataset.colid === colid) { + colids.push(colid) + + const thRect = ths[i].getBoundingClientRect() + let columnWidth = Math.round(thRect.width) + + columnWidth = columnWidthMethod + ? columnWidthMethod({ + columnIndex: colids.length - 1, + width: columnWidth + }) + : columnWidth + ws['!cols'].push({ wch: Math.round(columnWidth / 10) }) + datas[level].splice(colids.length - 1, 1, typeof column.title === 'string' ? column.title : ths[i].textContent) + + break + } + } + } + } + const collectColumn = $table.collectColumn + + for (let i = 0; i < collectColumn.length; i++) { + getColWidth(collectColumn[i], 0) + } +} + +function buildHeader({ $table, colids, datas, headerRowCount, headerTrs, opts, ws }) { + if (headerRowCount === 0) { + return + } + + const rowHeightMethod = opts.table.rowHeightMethod + const columnWidthMethod = opts.table.columnWidthMethod + const ths = [] + + initHeaderDatas({ datas, headerRowCount, headerTrs }) + + buildHeaderMerges({ datas, headerTrs, rowHeightMethod, ths, ws }) + + buildColids({ $table, colids, columnWidthMethod, datas, ths, ws }) +} + +function updateRowsDatas({ childNodes, colids, datas, i, offset, rowHeight, rowHeightMethod, ws }) { + rowHeight = rowHeightMethod ? rowHeightMethod({ rowIndex: i + offset, height: rowHeight }) : rowHeight + ws['!rows'].push({ hpx: adjustHeight(rowHeight) }) + datas.push([]) + + for (let j = 0; j < colids.length; j++) { + let rowTd = null + let textContent = '' + + for (let k = 0; k < childNodes.length; k++) { + if (childNodes[k].dataset.colid === colids[j]) { + rowTd = childNodes[k] + break + } + } + + if (rowTd) { + textContent = rowTd.textContent + rowTd = null + } + + datas[offset + i].push(textContent) + } +} + +function updateMerges({ childNodes, colids, i, offset, ws }) { + for (let j = 0; j < childNodes.length; j++) { + const colSpan = childNodes[j].colSpan + const rowSpan = childNodes[j].rowSpan + const colid = childNodes[j].dataset.colid + const sc = colids.indexOf(colid) + const sr = offset + i + + if (colSpan > 1 && rowSpan > 1) { + ws['!merges'].push({ + s: { r: sr, c: sc }, + e: { r: sr + rowSpan - 1, c: sc + colSpan - 1 } + }) + } else if (colSpan > 1) { + ws['!merges'].push({ + s: { r: sr, c: sc }, + e: { r: sr, c: sc + colSpan - 1 } + }) + } else if (rowSpan > 1) { + ws['!merges'].push({ + s: { r: sr, c: sc }, + e: { r: sr + rowSpan - 1, c: sc } + }) + } + } +} + +function buildBody({ bodyRowCount, bodyTrs, colids, datas, headerRowCount, opts, ws }) { + if (bodyRowCount === 0) { + return + } + + const rowHeightMethod = opts.table.rowHeightMethod + const offset = headerRowCount + + for (let i = 0; i < bodyTrs.length; i++) { + const bodyTrRect = bodyTrs[i].getBoundingClientRect() + const childNodes = bodyTrs[i].childNodes + let rowHeight = Math.round(bodyTrRect.height) + + updateRowsDatas({ + colids, + childNodes, + i, + datas, + rowHeight, + rowHeightMethod, + offset, + ws + }) + + updateMerges({ childNodes, colids, i, offset, ws }) + } +} + +function genExcelColNames() { + const excelColNames = [] + const f = funcFromCodePoint + + for (let i = -1; i < 26; i++) { + for (let j = 0; j < 26; j++) { + excelColNames.push((i === -1 ? '' : f(65 + i)) + f(65 + j)) + } + } + + return excelColNames +} + +function buildRef({ colids, datas, excelColNames, ws }) { + // fullref + let fullref = '' + + if (colids.length > 0 && datas.length > 0) { + fullref = 'A1:' + excelColNames[colids.length - 1] + datas.length + } + + ws['!fullref'] = fullref + ws['!ref'] = fullref +} + +function updateCellStyle({ bodyRowCount, bodyTrBgcArr, footerTrBgc, headerRowCount, headerWrapperBgc, rowIndex, showBorder, style }) { + style.font = { name: 'Microsoft YaHei', sz: 12, color: { rgb: '000000' } } + + if (rowIndex < headerRowCount) { + style.fill = { fgColor: { rgb: headerWrapperBgc } } + + style.font.bold = true + } else if (rowIndex < headerRowCount + bodyRowCount) { + style.fill = { fgColor: { rgb: bodyTrBgcArr[rowIndex - headerRowCount] } } + } else { + style.fill = { fgColor: { rgb: footerTrBgc } } + } + + if (showBorder) { + style.border = { + top: { style: 'thin', color: { rgb: '000000' } }, + bottom: { style: 'thin', color: { rgb: '000000' } }, + left: { style: 'thin', color: { rgb: '000000' } }, + right: { style: 'thin', color: { rgb: '000000' } } + } + } + + style.alignment = { vertical: 'center', horizontal: 'left', wrapText: false } +} + +function buildDatas({ showBorder, bodyRowCount, bodyTrBgcArr, headerRowCount, colids, datas, footerTrBgc, headerWrapperBgc, excelColNames, opts, $table, ws }) { + if (datas.length === 0) { + return + } + + const styleMethod = opts.table.styleMethod + const formatMethod = opts.table.formatMethod + const fullColumn = $table.getTableColumn().fullColumn + const isIndexColData = (i, j, indexColIndex, headerRowCount, bodyRowCount) => indexColIndex === j && i >= headerRowCount && i < headerRowCount + bodyRowCount + let indexColIndex + + for (let i = 0; i < fullColumn.length; i++) { + if (fullColumn[i].type === 'index') { + indexColIndex = colids.indexOf(fullColumn[i].id) + break + } + } + + for (let i = 0; i < datas.length; i++) { + for (let j = 0; j < datas[i].length; j++) { + let type = isIndexColData(i, j, indexColIndex, headerRowCount, bodyRowCount) ? 'n' : 's' + let value = isIndexColData(i, j, indexColIndex, headerRowCount, bodyRowCount) ? parseInt(datas[i][j]) : datas[i][j].trim() + let style = {} + + updateCellStyle({ bodyRowCount, bodyTrBgcArr, columnIndex: j, footerTrBgc, headerRowCount, headerWrapperBgc, rowIndex: i, showBorder, style }) + + if (styleMethod) { + style = styleMethod({ rowIndex: i, columnIndex: j, style }) + } + + if (formatMethod) { + const ret = formatMethod({ rowIndex: i, columnIndex: j, value, type }) + type = ret.type + value = ret.value + } + + ws[excelColNames[j] + (i + 1)] = { t: type, v: value, s: style } + } + } +} + +function buildWb({ XLSXX, opts, ws }) { + ws = ws['!cols'].length === 0 || ws['!rows'].length === 0 ? {} : ws + + const sheetName = opts.table.sheetName + const merges = ws['!merges'] + + if (merges) { + const mergesMethod = opts.table.mergesMethod + ws['!merges'] = mergesMethod ? mergesMethod(merges) : merges + } + + const wb = { + Props: { + Application: 'SheetJS', + SheetNames: [sheetName], + Worksheets: 1 + }, + SSF: XLSXX.SSF.get_table(), + SheetNames: [sheetName], + Sheets: { + [sheetName]: ws + } + } + + return wb +} + +function computeBodyTrBgcArr(bodyTrs, isStripe) { + const arr = [] + + for (let i = 0; i < bodyTrs.length; i++) { + arr.push(isStripe ? getBgc(bodyTrs[i]) : 'ffffff') + } + + return arr +} + +function queryDom($table) { + const headerTrs = $table.$el.querySelectorAll('.tiny-grid__header-wrapper.body__wrapper .tiny-grid-header__row') + const bodyTrs = $table.$el.querySelectorAll('.tiny-grid__body-wrapper.body__wrapper .tiny-grid-body__row:not(.group)') + const footerTrs = $table.$el.querySelectorAll('.tiny-grid__footer-wrapper.body__wrapper .tiny-grid-footer__row') + const headerWrapper = $table.$el.querySelector('.tiny-grid__header-wrapper.body__wrapper') + + return { bodyTrs, footerTrs, headerTrs, headerWrapper } +} + +function getTableAttr($table, headerWrapper, bodyTrs) { + const showBorder = ~$table.$el.className.split(/\s/).indexOf('tiny-grid__border') + const isStripe = ~$table.$el.className.split(/\s/).indexOf('tiny-grid__stripe') + const headerWrapperBgc = headerWrapper ? getBgc(headerWrapper) : 'ffffff' + const bodyTrBgcArr = computeBodyTrBgcArr(bodyTrs, isStripe) + const footerTrBgc = 'ffffff' + + return { showBorder, headerWrapperBgc, bodyTrBgcArr, footerTrBgc } +} + +function buildColidsByVisibleColumn({ $table, bodyRowCount, bodyTrs, colids, opts, ws }) { + if (colids.length > 0 || bodyRowCount === 0) { + return + } + + const columnWidthMethod = opts.table.columnWidthMethod + const tds = [] + + for (let i = 0; i < bodyTrs.length; i++) { + for (let j = 0; j < bodyTrs[i].childNodes.length; j++) { + tds.push(bodyTrs[i].childNodes[j]) + } + } + + for (let i = 0; i < $table.visibleColumn.length; i++) { + let colid = $table.visibleColumn[i].id + + for (let j = 0; j < tds.length; j++) { + if (tds[j].dataset.colid === colid) { + colids.push(colid) + + const tdRect = tds[j].getBoundingClientRect() + const colSpan = tds[j].colSpan + let columnWidth = Math.round(tdRect.width / colSpan) + + columnWidth = columnWidthMethod + ? columnWidthMethod({ + columnIndex: colids.length - 1, + width: columnWidth + }) + : columnWidth + ws['!cols'].push({ wch: Math.round(columnWidth / 10) }) + + break + } + } + } +} + +function buildFooter({ bodyRowCount, colids, datas, footerRowCount, footerTrs, headerRowCount, opts, ws }) { + if (footerRowCount === 0) { + return + } + + const rowHeightMethod = opts.table.rowHeightMethod + const offset = headerRowCount + bodyRowCount + + for (let i = 0; i < footerTrs.length; i++) { + const footerTrRect = footerTrs[i].getBoundingClientRect() + const childNodes = footerTrs[i].childNodes + let rowHeight = Math.round(footerTrRect.height) + + updateRowsDatas({ + childNodes, + colids, + datas, + i, + offset, + rowHeight, + rowHeightMethod, + ws + }) + + updateMerges({ childNodes, colids, i, offset, ws }) + } +} + +function createExcelFromDom($table, opts) { + const { XLSXX } = opts.plugins + const { bodyTrs, footerTrs, headerTrs, headerWrapper } = queryDom($table) + const { showBorder, headerWrapperBgc, bodyTrBgcArr, footerTrBgc } = getTableAttr($table, headerWrapper, bodyTrs) + const headerRowCount = headerTrs.length + const bodyRowCount = bodyTrs.length + const footerRowCount = footerTrs.length + const ws = {} + const datas = [] + const colids = [] + const excelColNames = genExcelColNames() + + ws['!rows'] = [] + ws['!cols'] = [] + ws['!merges'] = [] + + buildHeader({ $table, colids, datas, headerRowCount, headerTrs, opts, ws }) + + buildColidsByVisibleColumn({ $table, bodyRowCount, bodyTrs, colids, opts, ws }) + + buildBody({ bodyRowCount, bodyTrs, colids, datas, headerRowCount, opts, ws }) + + buildFooter({ bodyRowCount, colids, datas, footerRowCount, footerTrs, headerRowCount, opts, ws }) + + buildRef({ colids, datas, excelColNames, ws }) + + buildDatas({ $table, bodyRowCount, bodyTrBgcArr, colids, datas, excelColNames, footerTrBgc, headerRowCount, headerWrapperBgc, opts, showBorder, ws }) + + return buildWb({ XLSXX, opts, ws }) +} + +export function exportExcel($table, options) { + const opts = extend(true, {}, options) + + opts.plugins = opts.plugins || {} + + if (!opts.plugins.XLSX || !opts.plugins.XLSXX || !opts.plugins.FileSaver) { + return + } + + opts.table = opts.table || {} + + opts.table.sheetName = opts.table.sheetName || defaultOptions.table.sheetName + opts.table.formatMethod = opts.table.formatMethod || defaultOptions.table.formatMethod + opts.table.styleMethod = opts.table.styleMethod || defaultOptions.table.styleMethod + opts.table.rowHeightMethod = opts.table.rowHeightMethod || defaultOptions.table.rowHeightMethod + opts.table.columnWidthMethod = opts.table.columnWidthMethod || defaultOptions.table.columnWidthMethod + opts.table.mergesMethod = opts.table.mergesMethod || defaultOptions.table.mergesMethod + + const wb = createExcelFromDom($table, opts) + + const { XLSXX, FileSaver } = opts.plugins + const wopts = { bookType: 'xlsx', bookSST: false, type: 'binary' } + const wbout = XLSXX.write(wb, wopts) + + FileSaver.saveAs(new Blob([s2ab(wbout)], { type: '' }), opts.table.sheetName + '.xlsx') +} diff --git a/packages/renderless/src/grid/plugins/header.ts b/packages/renderless/src/grid/plugins/header.ts new file mode 100644 index 000000000..342ca51d4 --- /dev/null +++ b/packages/renderless/src/grid/plugins/header.ts @@ -0,0 +1,95 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +const columnIsVisible = (children) => Array.isArray(children) && children.length && children.some((column) => column.visible) + +export const getAllColumns = (columns) => { + const result = [] + + columns.forEach((column) => { + if (column.visible) { + const children = column.children + + if (columnIsVisible(children)) { + result.push(column) + result.push.apply(result, getAllColumns(children)) + } else { + result.push(column) + } + } + }) + + return result +} + +export const convertToRows = (originColumns) => { + let maxLevel = 1 + const walkTree = (column, parent) => { + if (parent) { + column.level = parent.level + 1 + + if (maxLevel < column.level) { + maxLevel = column.level + } + } + + const children = column.children + + if (columnIsVisible(children)) { + let colSpan = 0 + + children.forEach((childColumn) => { + if (childColumn.visible) { + walkTree(childColumn, column) + colSpan += childColumn.colSpan + } + }) + column.colSpan = colSpan + } else { + column.colSpan = 1 + } + } + + originColumns.forEach((column) => { + column.level = 1 + walkTree(column) + }) + + const allRows = [] + + for (let i = 0; i < maxLevel; i++) { + allRows.push([]) + } + + const allColumns = getAllColumns(originColumns) + + allColumns.forEach((column) => { + column.rowSpan = columnIsVisible(column.children) ? 1 : maxLevel - column.level + 1 + + allRows[column.level - 1].push(column) + }) + + return allRows +} diff --git a/packages/renderless/src/grid/plugins/resize.ts b/packages/renderless/src/grid/plugins/resize.ts new file mode 100644 index 000000000..f9fbb30cb --- /dev/null +++ b/packages/renderless/src/grid/plugins/resize.ts @@ -0,0 +1,99 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import browser from '@opentiny/vue-renderless/common/browser' +import { remove } from '../static' + +let resizeTimeout +let defaultInterval = 250 +const eventStore = [] +let eventHandle + +const eventListener = () => { + clearTimeout(resizeTimeout) + resizeTimeout = setTimeout(eventHandle, defaultInterval) +} + +eventHandle = () => { + if (eventStore.length) { + eventStore.forEach((item) => { + item.tarList.forEach((el) => { + const { target, width, heighe } = el + const clientWidth = target.clientWidth + const clientHeight = target.clientHeight + const rWidth = clientWidth && width !== clientWidth + const rHeight = clientHeight && heighe !== clientHeight + + if (rWidth || rHeight) { + el.width = clientWidth + el.heighe = clientHeight + requestAnimationFrame(item.callback) + } + }) + }) + + eventListener() + } +} + +class ResizeObserverPolyfill { + constructor(callback, resizeInterval) { + this.tarList = [] + this.callback = callback + defaultInterval = resizeInterval + } + + observe(targetObj) { + if (targetObj) { + if (!this.tarList.includes(targetObj)) { + this.tarList.push({ + target: targetObj, + width: targetObj.clientWidth, + heighe: targetObj.clientHeight + }) + } + + if (!eventStore.length) { + eventListener() + } + + if (!eventStore.includes(this)) { + eventStore.push(this) + } + } + } + + unobserve(target) { + remove(eventStore, (item) => ~item.tarList.indexOf(target)) + } + + disconnect() { + remove(eventStore, (item) => item === this) + } +} + +const Resize = browser.isDoc ? window.ResizeObserver || ResizeObserverPolyfill : ResizeObserverPolyfill + +export default Resize diff --git a/packages/renderless/src/grid/static/array/arrayEach.ts b/packages/renderless/src/grid/static/array/arrayEach.ts new file mode 100644 index 000000000..6b03f5edf --- /dev/null +++ b/packages/renderless/src/grid/static/array/arrayEach.ts @@ -0,0 +1,38 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +const arrayEach = (obj, iterate, context) => { + if (obj) { + if (obj.forEach) { + obj.forEach(iterate, context) + } else { + for (let index = 0, len = obj.length; index < len; index++) { + iterate.call(context, obj[index], index, obj) + } + } + } +} + +export default arrayEach diff --git a/packages/renderless/src/grid/static/array/arrayIndexOf.ts b/packages/renderless/src/grid/static/array/arrayIndexOf.ts new file mode 100644 index 000000000..faa3b6e66 --- /dev/null +++ b/packages/renderless/src/grid/static/array/arrayIndexOf.ts @@ -0,0 +1,38 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +const arrayIndexOf = (obj, val) => { + if (obj.indexOf) { + return obj.indexOf(val) + } + + for (let index = 0, len = obj.length; index < len; index++) { + if (val === obj[index]) { + return index + } + } +} + +export default arrayIndexOf diff --git a/packages/renderless/src/grid/static/array/eachTree.ts b/packages/renderless/src/grid/static/array/eachTree.ts new file mode 100644 index 000000000..d69a8ba8a --- /dev/null +++ b/packages/renderless/src/grid/static/array/eachTree.ts @@ -0,0 +1,54 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import helperCreateTreeFunc from './helperCreateTreeFunc' +import each from '../base/each' + +const eachTreeItem = ({ parent, obj, iterate, context, path, node, parseChildren, opts }) => { + each(obj, (item, index) => { + const paths = path.concat([`${index}`]) + const nodes = node.concat([item]) + + iterate.call(context, item, index, obj, paths, parent, nodes) + + if (item && parseChildren) { + paths.push(parseChildren) + eachTreeItem({ + item, + obj: item[parseChildren], + context, + iterate, + node: nodes, + parseChildren, + path: paths, + opts + }) + } + }) +} + +const eachTree = helperCreateTreeFunc(eachTreeItem) + +export default eachTree diff --git a/packages/renderless/src/grid/static/array/every.ts b/packages/renderless/src/grid/static/array/every.ts new file mode 100644 index 000000000..58e49b395 --- /dev/null +++ b/packages/renderless/src/grid/static/array/every.ts @@ -0,0 +1,28 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import helperCreateIterateHandleFn from './helperCreateIterateHandle' + +export default helperCreateIterateHandleFn('every', 1, 1, false, true) diff --git a/packages/renderless/src/grid/static/array/filterTree.ts b/packages/renderless/src/grid/static/array/filterTree.ts new file mode 100644 index 000000000..ede41fc53 --- /dev/null +++ b/packages/renderless/src/grid/static/array/filterTree.ts @@ -0,0 +1,46 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import eachTree from './eachTree' + +const filterTree = (obj, iterate, options, context) => { + let result = [] + + if (obj && iterate) { + eachTree( + obj, + (...args) => { + if (iterate.apply(context, args)) { + result.push(args[0]) + } + }, + options + ) + } + + return result +} + +export default filterTree diff --git a/packages/renderless/src/grid/static/array/find.ts b/packages/renderless/src/grid/static/array/find.ts new file mode 100644 index 000000000..f065aa0aa --- /dev/null +++ b/packages/renderless/src/grid/static/array/find.ts @@ -0,0 +1,30 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import helperCreateIterateHandle from './helperCreateIterateHandle' + +const find = helperCreateIterateHandle('find', 1, 3, true) + +export default find diff --git a/packages/renderless/src/grid/static/array/findTree.ts b/packages/renderless/src/grid/static/array/findTree.ts new file mode 100644 index 000000000..597bc55bf --- /dev/null +++ b/packages/renderless/src/grid/static/array/findTree.ts @@ -0,0 +1,61 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ +import helperCreateTreeFunc from './helperCreateTreeFunc' + +const findTreeItem = ({ parent, obj, iterate, context, path, node, parseChildren, opts }) => { + if (obj) { + for (let index = 0, len = obj.length; index < len; index++) { + const item = obj[index] + const paths = path.concat([`${index}`]) + const nodes = node.concat([item]) + + if (iterate.call(context, item, index, obj, paths, parent, nodes)) { + return { index, item, path, items: obj, parent, nodes } + } + + if (parseChildren && item) { + const newPath = paths.concat([parseChildren]) + const match = findTreeItem({ + parent: item, + obj: item[parseChildren], + iterate, + context, + path: newPath, + node: nodes, + parseChildren, + opts + }) + + if (match) { + return match + } + } + } + } +} + +const findTree = helperCreateTreeFunc(findTreeItem) + +export default findTree diff --git a/packages/renderless/src/grid/static/array/helperCreateIterateHandle.ts b/packages/renderless/src/grid/static/array/helperCreateIterateHandle.ts new file mode 100644 index 000000000..c84340a11 --- /dev/null +++ b/packages/renderless/src/grid/static/array/helperCreateIterateHandle.ts @@ -0,0 +1,79 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import hasOwnProp from '../base/hasOwnProp' + +const handle = ({ useArray, obj, iterate, context, matchValue, restIndex }) => { + let value + let flag = 0 + + if (useArray && Array.isArray(obj)) { + for (let index = 0, len = obj.length; index < len; index++) { + if (!!iterate.call(context, obj[index], index, obj) === matchValue) { + value = [true, false, index, obj[index]][restIndex] + flag = 1 + break + } + } + } else { + for (let key of Object.keys(obj)) { + if (hasOwnProp(obj, key)) { + if (!!iterate.call(context, obj[key], key, obj) === matchValue) { + value = [true, false, key, obj[key]][restIndex] + flag = 2 + break + } + } + } + } + + return { value, flag } +} + +const helperCreateIterateHandle = (prop, useArray, restIndex, matchValue, defaultValue) => (obj, iterate, context) => { + if (!obj || !iterate) { + return defaultValue + } + if (prop && obj[prop]) { + return obj[prop](iterate, context) + } else { + const ret = handle({ + useArray, + obj, + iterate, + context, + matchValue, + restIndex + }) + + if (ret.flag) { + return ret.value + } + } + + return defaultValue +} + +export default helperCreateIterateHandle diff --git a/packages/renderless/src/grid/static/array/helperCreateTreeFunc.ts b/packages/renderless/src/grid/static/array/helperCreateTreeFunc.ts new file mode 100644 index 000000000..8b5897622 --- /dev/null +++ b/packages/renderless/src/grid/static/array/helperCreateTreeFunc.ts @@ -0,0 +1,43 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +const helperCreateTreeFunc = (handle) => (obj, iterate, options, context) => { + let opts = options || {} + let optChildren = opts.children || 'children' + const params = { + item: null, + obj, + iterate, + context, + path: [], + node: [], + parseChildren: optChildren, + opts + } + + return handle(params) +} + +export default helperCreateTreeFunc diff --git a/packages/renderless/src/grid/static/array/includes.ts b/packages/renderless/src/grid/static/array/includes.ts new file mode 100644 index 000000000..b58d8c372 --- /dev/null +++ b/packages/renderless/src/grid/static/array/includes.ts @@ -0,0 +1,17 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import indexOf from '../base/indexOf' + +const includes = (obj, val) => ~indexOf(obj, val) + +export default includes diff --git a/packages/renderless/src/grid/static/array/lastArrayEach.ts b/packages/renderless/src/grid/static/array/lastArrayEach.ts new file mode 100644 index 000000000..fb688cc2e --- /dev/null +++ b/packages/renderless/src/grid/static/array/lastArrayEach.ts @@ -0,0 +1,32 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +const lastArrayEach = (obj, iterate, context) => { + for (let len = obj.length - 1; len >= 0; len--) { + iterate.call(context, obj[len], len, obj) + } +} + +export default lastArrayEach diff --git a/packages/renderless/src/grid/static/array/map.ts b/packages/renderless/src/grid/static/array/map.ts new file mode 100644 index 000000000..48203ae00 --- /dev/null +++ b/packages/renderless/src/grid/static/array/map.ts @@ -0,0 +1,50 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import each from '../base/each' +import isFunction from '../base/isFunction' +import property from '../function/property' + +const map = function (obj, iterate, context) { + let result = [] + + if (obj && arguments.length > 1) { + if (!isFunction(iterate)) { + iterate = property(iterate) + } + + if (obj.map) { + return obj.map(iterate, context) + } else { + each(obj, (...args) => { + result.push(iterate.apply(context, args)) + }) + } + } + + return result +} + +export default map diff --git a/packages/renderless/src/grid/static/array/mapTree.ts b/packages/renderless/src/grid/static/array/mapTree.ts new file mode 100644 index 000000000..5ad867030 --- /dev/null +++ b/packages/renderless/src/grid/static/array/mapTree.ts @@ -0,0 +1,56 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import helperCreateTreeFunc from './helperCreateTreeFunc' +import map from './map' + +const mapTreeItem = ({ parent, obj, iterate, context, path, node, parseChildren, opts }) => { + let mapChildren = opts.mapChildren || parseChildren + + return map(obj, (item, index) => { + const paths = path.concat([`${index}`]) + const nodes = node.concat([item]) + const rest = iterate.call(context, item, index, obj, paths, parent, nodes) + + if (rest && item && parseChildren && item[parseChildren]) { + rest[mapChildren] = mapTreeItem({ + item, + obj: item[parseChildren], + iterate, + context, + path: paths, + node: nodes, + parseChildren, + opts + }) + } + + return rest + }) +} + +const mapTree = helperCreateTreeFunc(mapTreeItem) + +export default mapTree diff --git a/packages/renderless/src/grid/static/array/slice.ts b/packages/renderless/src/grid/static/array/slice.ts new file mode 100644 index 000000000..de8b5e742 --- /dev/null +++ b/packages/renderless/src/grid/static/array/slice.ts @@ -0,0 +1,38 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +const slice = (array, startIndex, endIndex) => { + let result = [] + + if (array) { + for (startIndex = startIndex || 0, endIndex = endIndex || array.length; startIndex < endIndex; startIndex++) { + result.push(array[startIndex]) + } + } + + return result +} + +export default slice diff --git a/packages/renderless/src/grid/static/array/sortBy.ts b/packages/renderless/src/grid/static/array/sortBy.ts new file mode 100644 index 000000000..8d0532d0e --- /dev/null +++ b/packages/renderless/src/grid/static/array/sortBy.ts @@ -0,0 +1,107 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import arrayEach from './arrayEach' +import toArray from './toArray' +import map from './map' +import isFunction from '../base/isFunction' +import isUndefined from '../base/isUndefined' +import isNull from '../base/isNull' +import get from '../base/get' +import property from '../function/property' + +// 支持中文、数字、字母排序 > null > undefined +const sortByDef = (v1, v2) => { + if (isUndefined(v1) || isUndefined(v2)) { + return isUndefined(v2) ? 1 : -1 + } + + if (isNull(v1) || isNull(v2)) { + return isNull(v2) ? 1 : -1 + } + + return v1 && v1.localeCompare ? v1.localeCompare(v2) : v1 > v2 ? 1 : -1 +} + +const sortMultis = (name, compares) => (item1, item2) => { + let v1 = item1[name] + let v2 = item2[name] + + if (v1 === v2) { + return compares ? compares(item1, item2) : 0 + } + + return sortByDef(v1, v2) +} + +const getSortPros = (arr, list, iterate, context) => { + iterate = Array.isArray(iterate) ? iterate : [iterate] + + arrayEach(iterate, (prop, index) => { + let eachCallback + + if (isFunction(prop)) { + eachCallback = (val, key) => { + val[index] = prop.call(context, val.data, key, arr) + } + } else { + eachCallback = (val) => { + val[index] = get(val.data, prop) + } + } + + arrayEach(list, eachCallback) + }) + + return iterate +} + +const sortBy = (arr, iterate, context, STR_UNDEFINED) => { + if (arr) { + if (iterate === STR_UNDEFINED) { + return toArray(arr).sort(sortByDef) + } + + let compares + let list = map(arr, (item) => ({ data: item })) + let sortPros = getSortPros(arr, list, iterate, context) + let len = sortPros.length + + if (len) { + while (len >= 0) { + compares = sortMultis(len, compares) + len-- + } + + list = list.sort(compares) + } + + return map(list, property('data')) + } + + return [] +} + +export default sortBy diff --git a/packages/renderless/src/grid/static/array/sum.ts b/packages/renderless/src/grid/static/array/sum.ts new file mode 100644 index 000000000..1dc04765b --- /dev/null +++ b/packages/renderless/src/grid/static/array/sum.ts @@ -0,0 +1,55 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import each from '../base/each' +import isFunction from '../base/isFunction' +import toNumber from '../number/toNumber' + +const sum = (array, iterate, context) => { + let result = 0 + let eachCallback + + if (iterate) { + if (isFunction(iterate)) { + eachCallback = (...args) => { + result += toNumber(iterate.apply(context, args)) + } + } else { + eachCallback = (val) => { + result += toNumber(val[iterate]) + } + } + } else { + eachCallback = (val) => { + result += toNumber(val) + } + } + + each(array, eachCallback) + + return result +} + +export default sum diff --git a/packages/renderless/src/grid/static/array/toArray.ts b/packages/renderless/src/grid/static/array/toArray.ts new file mode 100644 index 000000000..5ecf90a09 --- /dev/null +++ b/packages/renderless/src/grid/static/array/toArray.ts @@ -0,0 +1,30 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import map from './map' + +const toArray = (arr) => map(arr, (item) => item) + +export default toArray diff --git a/packages/renderless/src/grid/static/array/toTreeArray.ts b/packages/renderless/src/grid/static/array/toTreeArray.ts new file mode 100644 index 000000000..335bff70b --- /dev/null +++ b/packages/renderless/src/grid/static/array/toTreeArray.ts @@ -0,0 +1,52 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import each from '../base/each' +import assign from '../object/assign' + +const defaultOptions = { parentKey: 'parentId', key: 'id', children: 'children' } + +const unTreeList = (result, array, opts) => { + let optChildren = opts.children + let optData = opts.data + + each(array, (item) => { + const children = item[optChildren] + + if (optData) { + item = item[optData] + } + + result.push(item) + + children && unTreeList(result, children, opts) + }) + + return result +} + +const toTreeArray = (array, options) => unTreeList([], array, assign({}, defaultOptions, options)) + +export default toTreeArray diff --git a/packages/renderless/src/grid/static/base/clear.ts b/packages/renderless/src/grid/static/base/clear.ts new file mode 100644 index 000000000..df9c7c1f5 --- /dev/null +++ b/packages/renderless/src/grid/static/base/clear.ts @@ -0,0 +1,78 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import isNull from './isNull' +import isObject from './isObject' +import assign from '../object/assign' +import isPlainObject from './isPlainObject' +import objectEach from '../object/objectEach' +import helperDeleteProperty from './helperDeleteProperty' + +const clear = function (obj, defs, assigns) { + if (!obj) { + return obj + } + let isDefs = arguments.length > 1 && (isNull(defs) || !isObject(defs)) + let extds = isDefs ? assigns : defs + + if (isPlainObject(obj)) { + let eachCallback + + if (isDefs) { + eachCallback = (val, key) => { + obj[key] = defs + } + } else { + eachCallback = (val, key) => { + helperDeleteProperty(obj, key) + } + } + + objectEach(obj, eachCallback) + + if (extds) { + assign(obj, extds) + } + } else if (Array.isArray(obj)) { + if (isDefs) { + let len = obj.length + + while (len > 0) { + len-- + obj[len] = defs + } + } else { + obj.length = 0 + } + + if (extds) { + obj.push.apply(obj, extds) + } + } + + return obj +} + +export default clear diff --git a/packages/renderless/src/grid/static/base/clone.ts b/packages/renderless/src/grid/static/base/clone.ts new file mode 100644 index 000000000..3c6a830fb --- /dev/null +++ b/packages/renderless/src/grid/static/base/clone.ts @@ -0,0 +1,24 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import isPlainObject from './isPlainObject' +import objectMap from '../object/objectMap' +import map from '../array/map' + +let deepClone +const startClone = (func, obj, deep) => func(obj, deep ? (val) => deepClone(val, deep) : (val) => val) + +deepClone = (val, deep) => (isPlainObject(val) ? startClone(objectMap, val, deep) : Array.isArray(val) ? startClone(map, val, deep) : val) + +const clone = (obj, deep) => (obj ? deepClone(obj, deep) : obj) + +export default clone diff --git a/packages/renderless/src/grid/static/base/destructuring.ts b/packages/renderless/src/grid/static/base/destructuring.ts new file mode 100644 index 000000000..554e7c4c7 --- /dev/null +++ b/packages/renderless/src/grid/static/base/destructuring.ts @@ -0,0 +1,47 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import keys from './keys' +import slice from '../array/slice' +import assign from '../object/assign' +import includes from '../array/includes' +import arrayEach from '../array/arrayEach' + +const destructuring = function (destination, sources) { + if (destination && sources) { + let rest = assign.apply(this, [{}].concat(slice(arguments, 1))) + let restKeys = keys(rest) + + arrayEach(keys(destination), (key) => { + if (includes(restKeys, key)) { + destination[key] = rest[key] + } + }) + } + + return destination +} + +export default destructuring diff --git a/packages/renderless/src/grid/static/base/each.ts b/packages/renderless/src/grid/static/base/each.ts new file mode 100644 index 000000000..2db29d24c --- /dev/null +++ b/packages/renderless/src/grid/static/base/each.ts @@ -0,0 +1,37 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import arrayEach from '../array/arrayEach' +import objectEach from '../object/objectEach' + +const each = (obj, iterate, context) => { + if (obj) { + return Array.isArray(obj) ? arrayEach(obj, iterate, context) : objectEach(obj, iterate, context) + } + + return obj +} + +export default each diff --git a/packages/renderless/src/grid/static/base/eqNull.ts b/packages/renderless/src/grid/static/base/eqNull.ts new file mode 100644 index 000000000..237ad83d7 --- /dev/null +++ b/packages/renderless/src/grid/static/base/eqNull.ts @@ -0,0 +1,31 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import isNullType from './isNull' +import isUndefinedType from './isUndefined' + +const eqNull = (object) => isNullType(object) || isUndefinedType(object) + +export default eqNull diff --git a/packages/renderless/src/grid/static/base/findIndexOf.ts b/packages/renderless/src/grid/static/base/findIndexOf.ts new file mode 100644 index 000000000..c751370c4 --- /dev/null +++ b/packages/renderless/src/grid/static/base/findIndexOf.ts @@ -0,0 +1,38 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import helperCreateiterateIndexOf from './helperCreateiterateIndexOf' + +const findIndexOf = helperCreateiterateIndexOf((obj, iterate, context) => { + for (let index = 0, len = obj.length; index < len; index++) { + if (iterate.call(context, obj[index], index, obj)) { + return index + } + } + + return -1 +}) + +export default findIndexOf diff --git a/packages/renderless/src/grid/static/base/get.ts b/packages/renderless/src/grid/static/base/get.ts new file mode 100644 index 000000000..ae51323ec --- /dev/null +++ b/packages/renderless/src/grid/static/base/get.ts @@ -0,0 +1,80 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import eqNull from './eqNull' +import hasOwnProp from './hasOwnProp' +import isUndefined from './isUndefined' +import helperGetHGSKeys from './helperGetHGSKeys' +import staticHGKeyRE from '../static/staticHGKeyRE' + +const valGet = (obj, key) => { + const matchs = key ? key.match(staticHGKeyRE) : '' + + return matchs ? (matchs[1] ? (obj[matchs[1]] ? obj[matchs[1]][matchs[2]] : undefined) : obj[matchs[2]]) : obj[key] +} + +const pathGet = (obj, property) => { + if (!obj) { + return + } + + let rest + let index = 0 + + const getRest = (len, props) => { + for (rest = obj; index < len; index++) { + rest = valGet(rest, props[index]) + + if (eqNull(rest)) { + return + } + } + } + + if (obj[property] || hasOwnProp(obj, property)) { + return obj[property] + } else { + const props = helperGetHGSKeys(property) + const len = props.length + + if (len) { + getRest(len, props) + } + + return rest + } +} + +const get = (obj, property, defaultValue) => { + if (eqNull(obj)) { + return defaultValue + } + + const result = pathGet(obj, property) + + return isUndefined(result) ? defaultValue : result +} + +export default get diff --git a/packages/renderless/src/grid/static/base/has.ts b/packages/renderless/src/grid/static/base/has.ts new file mode 100644 index 000000000..bd11bc38c --- /dev/null +++ b/packages/renderless/src/grid/static/base/has.ts @@ -0,0 +1,94 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import hasOwn from './hasOwnProp' +import staticHGKeyRE from '../static/staticHGKeyRE' +import helperGetHGSKeys from './helperGetHGSKeys' + +const formatterArgs = (matchs, rest, isHas) => { + let arrIndex = matchs[1] + let objProp = matchs[2] + + if (arrIndex) { + if (rest[arrIndex]) { + if (hasOwn(rest[arrIndex], objProp)) { + isHas = true + rest = rest[arrIndex][objProp] + } + } + } else { + if (hasOwn(rest, objProp)) { + isHas = true + rest = rest[objProp] + } + } + + return { isHas, rest } +} + +const has = (obj, property) => { + if (!obj) { + return + } + + const compare = (property) => { + let prop, matchs, rest, isHas + let props = helperGetHGSKeys(property) + let index = 0 + let len = props.length + let flag = false + + for (rest = obj; index < len; index++) { + isHas = false + prop = props[index] + matchs = prop ? prop.match(staticHGKeyRE) : '' + + if (matchs) { + const args = formatterArgs(matchs, rest, isHas) + + isHas = args.isHas + rest = args.rest + } else { + hasOwn(rest, prop) && ((isHas = true), (rest = rest[prop])) + } + + if (isHas) { + index === len - 1 && (flag = true) + } else { + break + } + } + + return flag + } + + if (hasOwn(obj, property)) { + return true + } else { + return compare(property) + } +} + +export default has diff --git a/packages/renderless/src/grid/static/base/hasOwnProp.ts b/packages/renderless/src/grid/static/base/hasOwnProp.ts new file mode 100644 index 000000000..786ecbef3 --- /dev/null +++ b/packages/renderless/src/grid/static/base/hasOwnProp.ts @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +const hasOwnProp = (obj, key) => Object.prototype.hasOwnProperty.call(obj, key) + +export default hasOwnProp diff --git a/packages/renderless/src/grid/static/base/helperCreateGetObjects.ts b/packages/renderless/src/grid/static/base/helperCreateGetObjects.ts new file mode 100644 index 000000000..eda7066f5 --- /dev/null +++ b/packages/renderless/src/grid/static/base/helperCreateGetObjects.ts @@ -0,0 +1,58 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import each from './each' + +const helperCreateGetObjects = (name, getIndex) => { + let proMethod = Object[name] + + return (obj) => { + let result = [] + + if (!obj) { + return result + } + if (proMethod) { + return proMethod(obj) + } + + let eachCallback + + if (getIndex > 1) { + eachCallback = (key) => { + result.push([String(key), obj[key]]) + } + } else { + eachCallback = function () { + result.push(arguments[getIndex]) + } + } + each(obj, eachCallback) + + return result + } +} + +export default helperCreateGetObjects diff --git a/packages/renderless/src/grid/static/base/helperCreateInInObjectString.ts b/packages/renderless/src/grid/static/base/helperCreateInInObjectString.ts new file mode 100644 index 000000000..35eb85708 --- /dev/null +++ b/packages/renderless/src/grid/static/base/helperCreateInInObjectString.ts @@ -0,0 +1,34 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +let objectToString = Object.prototype.toString + +function helperCreateInInObjectString(type) { + return function (obj) { + return '[object ' + type + ']' === objectToString.call(obj) + } +} + +export default helperCreateInInObjectString diff --git a/packages/renderless/src/grid/static/base/helperCreateInTypeof.ts b/packages/renderless/src/grid/static/base/helperCreateInTypeof.ts new file mode 100644 index 000000000..1433bd67a --- /dev/null +++ b/packages/renderless/src/grid/static/base/helperCreateInTypeof.ts @@ -0,0 +1,30 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +export default function helperCreateInTypeof(type) { + return function (obj) { + return typeof obj === type + } +} diff --git a/packages/renderless/src/grid/static/base/helperCreateIndexOf.ts b/packages/renderless/src/grid/static/base/helperCreateIndexOf.ts new file mode 100644 index 000000000..79ef5dab2 --- /dev/null +++ b/packages/renderless/src/grid/static/base/helperCreateIndexOf.ts @@ -0,0 +1,46 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +const helperCreateIndexOf = (name, callback) => (obj, val) => { + if (!obj) { + return -1 + } + if (typeof obj === 'string' || Array.isArray(obj)) { + if (obj[name]) { + return obj[name](val) + } + + return callback(obj, val) + } + + for (let key of Object.keys(obj)) { + if (val === obj[key]) { + return key + } + } + return -1 +} + +export default helperCreateIndexOf diff --git a/packages/renderless/src/grid/static/base/helperCreateiterateIndexOf.ts b/packages/renderless/src/grid/static/base/helperCreateiterateIndexOf.ts new file mode 100644 index 000000000..a44ad08a5 --- /dev/null +++ b/packages/renderless/src/grid/static/base/helperCreateiterateIndexOf.ts @@ -0,0 +1,47 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import isFunction from './isFunction' +import isString from './isString' +import hasOwnProp from './hasOwnProp' + +const helperCreateiterateIndexOf = (callback) => (obj, iterate, context) => { + if (!obj || !isFunction(iterate)) { + return -1 + } + if (Array.isArray(obj) || isString(obj)) { + return callback(obj, iterate, context) + } + + for (let key of Object.keys(obj)) { + if (hasOwnProp(obj, key) && iterate.call(context, obj[key], key, obj)) { + return key + } + } + + return -1 +} + +export default helperCreateiterateIndexOf diff --git a/packages/renderless/src/grid/static/base/helperDefaultCompare.ts b/packages/renderless/src/grid/static/base/helperDefaultCompare.ts new file mode 100644 index 000000000..fe0ec9377 --- /dev/null +++ b/packages/renderless/src/grid/static/base/helperDefaultCompare.ts @@ -0,0 +1,30 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +function helperDefaultCompare(v1, v2) { + return v1 === v2 +} + +export default helperDefaultCompare diff --git a/packages/renderless/src/grid/static/base/helperDeleteProperty.ts b/packages/renderless/src/grid/static/base/helperDeleteProperty.ts new file mode 100644 index 000000000..1e67e01c6 --- /dev/null +++ b/packages/renderless/src/grid/static/base/helperDeleteProperty.ts @@ -0,0 +1,34 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +const helperDeleteProperty = (obj, property) => { + try { + delete obj[property] + } catch (e) { + obj[property] = undefined + } +} + +export default helperDeleteProperty diff --git a/packages/renderless/src/grid/static/base/helperEqualCompare.ts b/packages/renderless/src/grid/static/base/helperEqualCompare.ts new file mode 100644 index 000000000..c70474ff1 --- /dev/null +++ b/packages/renderless/src/grid/static/base/helperEqualCompare.ts @@ -0,0 +1,94 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import { isDate, isRegExp } from '@opentiny/vue-renderless/common/type' +import isNumber from './isNumber' +import isString from './isString' +import isBoolean from './isBoolean' +import isUndefined from './isUndefined' +import keys from './keys' +import every from '../array/every' + +let equalVal + +const helperEqualCompare = ({ val1, val2, compare, func, key, obj1, obj2 }) => { + if (val1 === val2) { + return true + } + + if (val1 && val2 && !isNumber(val1) && !isNumber(val2) && !isString(val1) && !isString(val2)) { + if (isRegExp(val1)) { + return compare(String(val1), String(val2), key, obj1, obj2) + } + + if (isDate(val1) || isBoolean(val1)) { + return compare(Number(val1), Number(val2), key, obj1, obj2) + } + + return equalVal(val1, val2, func, key, compare) + } + + return compare(val1, val2, key, obj1, obj2) +} + +equalVal = (val1, val2, func, key, compare) => { + let result, val1Keys, val2Keys + let isObj1Arr = Array.isArray(val1) + let isObj2Arr = Array.isArray(val2) + + if (isObj1Arr || isObj2Arr ? isObj1Arr && isObj2Arr : val1.constructor === val2.constructor) { + val1Keys = keys(val1) + val2Keys = keys(val2) + + if (func) { + result = func(val1, val2, key) + } + + if (val1Keys.length === val2Keys.length) { + if (isUndefined(result)) { + return every( + val1Keys, + (key, index) => + key === val2Keys[index] && + helperEqualCompare({ + val1: val1[key], + val2: val2[val2Keys[index]], + compare, + func, + key: isObj1Arr || isObj2Arr ? index : key, + obj1: val1, + obj2: val2 + }) + ) + } + + return !!result + } + + return false + } +} + +export default helperEqualCompare diff --git a/packages/renderless/src/grid/static/base/helperGetHGSKeys.ts b/packages/renderless/src/grid/static/base/helperGetHGSKeys.ts new file mode 100644 index 000000000..3e77c699a --- /dev/null +++ b/packages/renderless/src/grid/static/base/helperGetHGSKeys.ts @@ -0,0 +1,30 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +const helperGetHGSKeys = (property) => + // 以最快的方式判断数组,可忽略准确性 + property ? (property.splice && property.join ? property : String(property).split('.')) : [] + +export default helperGetHGSKeys diff --git a/packages/renderless/src/grid/static/base/indexOf.ts b/packages/renderless/src/grid/static/base/indexOf.ts new file mode 100644 index 000000000..2c49a0667 --- /dev/null +++ b/packages/renderless/src/grid/static/base/indexOf.ts @@ -0,0 +1,29 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import helperCreateIndexOfFn from './helperCreateIndexOf' +import arrayIndexOfFn from '../array/arrayIndexOf' + +export default helperCreateIndexOfFn('indexOf', arrayIndexOfFn) diff --git a/packages/renderless/src/grid/static/base/isArray.ts b/packages/renderless/src/grid/static/base/isArray.ts new file mode 100644 index 000000000..58f110fb1 --- /dev/null +++ b/packages/renderless/src/grid/static/base/isArray.ts @@ -0,0 +1,36 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import helperCreateInInObjectString from './helperCreateInInObjectString' + +/** + * 判断是否数组 + * + * @param {Object} obj 对象 + * @return {Boolean} + */ +let isArray = Array.isArray || helperCreateInInObjectString('Array') + +export default isArray diff --git a/packages/renderless/src/grid/static/base/isBoolean.ts b/packages/renderless/src/grid/static/base/isBoolean.ts new file mode 100644 index 000000000..8fffc3426 --- /dev/null +++ b/packages/renderless/src/grid/static/base/isBoolean.ts @@ -0,0 +1,28 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +const isBoolean = (obj) => typeof obj === 'boolean' + +export default isBoolean diff --git a/packages/renderless/src/grid/static/base/isDate.ts b/packages/renderless/src/grid/static/base/isDate.ts new file mode 100644 index 000000000..50deb06d4 --- /dev/null +++ b/packages/renderless/src/grid/static/base/isDate.ts @@ -0,0 +1,35 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ +import helperCreateInInObjectString from './helperCreateInInObjectString' + +/** + * 判断是否Date对象 + * + * @param {Object} obj 对象 + * @return {Boolean} + */ +let isDate = helperCreateInInObjectString('Date') + +export default isDate diff --git a/packages/renderless/src/grid/static/base/isEmpty.ts b/packages/renderless/src/grid/static/base/isEmpty.ts new file mode 100644 index 000000000..76ad51c87 --- /dev/null +++ b/packages/renderless/src/grid/static/base/isEmpty.ts @@ -0,0 +1,21 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import isObject from './isObject' +const isEmpty = (obj) => { + if (isObject(obj)) { + return Object.keys(obj).length === 0 + } + return true +} + +export default isEmpty diff --git a/packages/renderless/src/grid/static/base/isEqual.ts b/packages/renderless/src/grid/static/base/isEqual.ts new file mode 100644 index 000000000..c12d9f37a --- /dev/null +++ b/packages/renderless/src/grid/static/base/isEqual.ts @@ -0,0 +1,35 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import helperEqlCompare from './helperEqualCompare' + +const isEqual = (obj1, obj2) => + helperEqlCompare({ + val1: obj1, + val2: obj2, + compare: (v1, v2) => v1 === v2 + }) + +export default isEqual diff --git a/packages/renderless/src/grid/static/base/isFunction.ts b/packages/renderless/src/grid/static/base/isFunction.ts new file mode 100644 index 000000000..fa635b260 --- /dev/null +++ b/packages/renderless/src/grid/static/base/isFunction.ts @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +const isFunction = (obj) => typeof obj === 'function' + +export default isFunction diff --git a/packages/renderless/src/grid/static/base/isNaN.ts b/packages/renderless/src/grid/static/base/isNaN.ts new file mode 100644 index 000000000..5296cf35d --- /dev/null +++ b/packages/renderless/src/grid/static/base/isNaN.ts @@ -0,0 +1,30 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import isNumber from './isNumber' + +const isNumberNaN = (obj) => isNumber(obj) && isNaN(obj) + +export default isNumberNaN diff --git a/packages/renderless/src/grid/static/base/isNull.ts b/packages/renderless/src/grid/static/base/isNull.ts new file mode 100644 index 000000000..a6a4a5f51 --- /dev/null +++ b/packages/renderless/src/grid/static/base/isNull.ts @@ -0,0 +1,28 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +const isNull = (object) => object === null + +export default isNull diff --git a/packages/renderless/src/grid/static/base/isNumber.ts b/packages/renderless/src/grid/static/base/isNumber.ts new file mode 100644 index 000000000..ff66e1647 --- /dev/null +++ b/packages/renderless/src/grid/static/base/isNumber.ts @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +const isNumber = (obj) => typeof obj === 'number' + +export default isNumber diff --git a/packages/renderless/src/grid/static/base/isObject.ts b/packages/renderless/src/grid/static/base/isObject.ts new file mode 100644 index 000000000..e1939418f --- /dev/null +++ b/packages/renderless/src/grid/static/base/isObject.ts @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +const isObject = (obj) => typeof obj === 'object' && obj !== null + +export default isObject diff --git a/packages/renderless/src/grid/static/base/isPlainObject.ts b/packages/renderless/src/grid/static/base/isPlainObject.ts new file mode 100644 index 000000000..ba4cbafb4 --- /dev/null +++ b/packages/renderless/src/grid/static/base/isPlainObject.ts @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { isPlainObject } from '@opentiny/vue-renderless/common/type' + +export default isPlainObject diff --git a/packages/renderless/src/grid/static/base/isRegExp.ts b/packages/renderless/src/grid/static/base/isRegExp.ts new file mode 100644 index 000000000..a8d2a7143 --- /dev/null +++ b/packages/renderless/src/grid/static/base/isRegExp.ts @@ -0,0 +1,36 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import helperCreateInInObjectString from './helperCreateInInObjectString' + +/** + * 判断是否RegExp对象 + * + * @param {Object} obj 对象 + * @return {Boolean} + */ +let isRegExp = helperCreateInInObjectString('RegExp') + +export default isRegExp diff --git a/packages/renderless/src/grid/static/base/isSet.ts b/packages/renderless/src/grid/static/base/isSet.ts new file mode 100644 index 000000000..7fa86a809 --- /dev/null +++ b/packages/renderless/src/grid/static/base/isSet.ts @@ -0,0 +1,29 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ +const supportSet = typeof Set !== 'undefined' + +const isSet = (obj) => supportSet && obj instanceof Set + +export default isSet diff --git a/packages/renderless/src/grid/static/base/isString.ts b/packages/renderless/src/grid/static/base/isString.ts new file mode 100644 index 000000000..339a37853 --- /dev/null +++ b/packages/renderless/src/grid/static/base/isString.ts @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +const isString = (obj) => typeof obj === 'string' + +export default isString diff --git a/packages/renderless/src/grid/static/base/isUndefined.ts b/packages/renderless/src/grid/static/base/isUndefined.ts new file mode 100644 index 000000000..f01257c86 --- /dev/null +++ b/packages/renderless/src/grid/static/base/isUndefined.ts @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +const isUndefined = (obj) => typeof obj === 'undefined' + +export default isUndefined diff --git a/packages/renderless/src/grid/static/base/keys.ts b/packages/renderless/src/grid/static/base/keys.ts new file mode 100644 index 000000000..3cfb25342 --- /dev/null +++ b/packages/renderless/src/grid/static/base/keys.ts @@ -0,0 +1,30 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import helperCreateGetObjects from './helperCreateGetObjects' + +const keys = helperCreateGetObjects('keys', 1) + +export default keys diff --git a/packages/renderless/src/grid/static/base/lastEach.ts b/packages/renderless/src/grid/static/base/lastEach.ts new file mode 100644 index 000000000..201274ac7 --- /dev/null +++ b/packages/renderless/src/grid/static/base/lastEach.ts @@ -0,0 +1,37 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import lastArrayEach from '../array/lastArrayEach' +import lastObjectEach from '../object/lastObjectEach' + +const lastEach = (obj, iterate, context) => { + if (obj) { + return Array.isArray(obj) ? lastArrayEach(obj, iterate, context) : lastObjectEach(obj, iterate, context) + } + + return obj +} + +export default lastEach diff --git a/packages/renderless/src/grid/static/base/remove.ts b/packages/renderless/src/grid/static/base/remove.ts new file mode 100644 index 000000000..93c986d0d --- /dev/null +++ b/packages/renderless/src/grid/static/base/remove.ts @@ -0,0 +1,74 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import helperDeleteProperty from './helperDeleteProperty' +import isFunction from './isFunction' +import each from './each' +import arrayEach from '../array/arrayEach' +import lastEach from './lastEach' +import clear from './clear' +import eqNull from './eqNull' + +const pluckProperty = (name) => (obj, key) => key === name + +const remove = (obj, iterate, context) => { + if (obj) { + if (!eqNull(iterate)) { + let removeIndexs = [] + let rest = [] + + if (!isFunction(iterate)) { + iterate = pluckProperty(iterate) + } + + each(obj, (item, index, rest) => { + if (iterate.call(context, item, index, rest)) { + removeIndexs.push(index) + } + }) + + if (Array.isArray(obj)) { + lastEach(removeIndexs, (item) => { + rest.push(obj[item]) + obj.splice(item, 1) + }) + } else { + rest = {} + arrayEach(removeIndexs, (key) => { + rest[key] = obj[key] + helperDeleteProperty(obj, key) + }) + } + + return rest + } + + return clear(obj) + } + + return obj +} + +export default remove diff --git a/packages/renderless/src/grid/static/base/set.ts b/packages/renderless/src/grid/static/base/set.ts new file mode 100644 index 000000000..c6c0f2ed7 --- /dev/null +++ b/packages/renderless/src/grid/static/base/set.ts @@ -0,0 +1,78 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import helperGetHGSKeys from './helperGetHGSKeys' +import hasOwn from './hasOwnProp' + +const sKeyRE = /(.+)\[(\d+)\]$/ + +const valSet = (obj, key, isSet, value) => { + if (obj[key]) { + if (isSet) { + obj[key] = value + } + } else { + const matchs = key ? key.match(sKeyRE) : null + const rest = isSet ? value : {} + + if (matchs) { + const key = matchs[1] + const index = parseInt(matchs[2]) + + if (obj[key]) { + obj[key][index] = rest + } else { + obj[key] = new Array(index + 1) + obj[key][index] = rest + } + } else { + obj[key] = rest + } + + return rest + } + + return obj[key] +} + +const set = (obj, property, value) => { + if (obj) { + if (obj[property] || hasOwn(obj, property)) { + obj[property] = value + } else { + let rest = obj + let props = helperGetHGSKeys(property) + let len = props.length + + for (let index = 0; index < len; index++) { + rest = valSet(rest, props[index], index === len - 1, value) + } + } + } + + return obj +} + +export default set diff --git a/packages/renderless/src/grid/static/base/toJSONString.ts b/packages/renderless/src/grid/static/base/toJSONString.ts new file mode 100644 index 000000000..1f20beae0 --- /dev/null +++ b/packages/renderless/src/grid/static/base/toJSONString.ts @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +const toJSONString = (obj) => JSON.stringify(obj) || '' + +export default toJSONString diff --git a/packages/renderless/src/grid/static/base/toStringJSON.ts b/packages/renderless/src/grid/static/base/toStringJSON.ts new file mode 100644 index 000000000..788aa6e27 --- /dev/null +++ b/packages/renderless/src/grid/static/base/toStringJSON.ts @@ -0,0 +1,43 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import isObject from './isObject' +import isString from './isString' + +const toStringJSON = (str) => { + if (isObject(str)) { + return str + } else if (isString(str)) { + try { + return JSON.parse(str) + } catch (error) { + // do nothing + } + } + + return {} +} + +export default toStringJSON diff --git a/packages/renderless/src/grid/static/base/uniqueId.ts b/packages/renderless/src/grid/static/base/uniqueId.ts new file mode 100644 index 000000000..d135bca24 --- /dev/null +++ b/packages/renderless/src/grid/static/base/uniqueId.ts @@ -0,0 +1,17 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +let __uniqueId = 0 + +const uniqueId = (prefix) => (prefix ? String(prefix) : 0) + ++__uniqueId + +export default uniqueId diff --git a/packages/renderless/src/grid/static/browse/browse.ts b/packages/renderless/src/grid/static/browse/browse.ts new file mode 100644 index 000000000..a1c541ccf --- /dev/null +++ b/packages/renderless/src/grid/static/browse/browse.ts @@ -0,0 +1,91 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import staticStrUndefined from '../static/staticStrUndefined' +import staticDocument from '../static/staticDocument' +import staticWindow from '../static/staticWindow' +import assign from '../object/assign' +import arrayEach from '../array/arrayEach' +function isBrowseStorage(storage) { + try { + let testKey = '__tiny_t' + + storage.setItem(testKey, 1) + storage.removeItem(testKey) + + return true + } catch (e) { + return false + } +} + +function isBrowseType(type) { + return navigator.userAgent.includes(type) +} + +/** + * 获取浏览器内核 + * @return Object + */ +function browse() { + let $body, isChrome, isEdge + let isMobile = false + let result = { + isNode: false, + isMobile, + isPC: false, + isDoc: !!staticDocument + } + + if (!staticWindow && typeof process !== staticStrUndefined) { + result.isNode = true + } else { + isEdge = isBrowseType('Edge') + isChrome = isBrowseType('Chrome') + isMobile = /(Android|webOS|iPhone|iPad|iPod|SymbianOS|BlackBerry|Windows Phone)/.test(navigator.userAgent) + + if (result.isDoc) { + $body = staticDocument.body || staticDocument.documentElement + arrayEach(['webkit', 'khtml', 'moz', 'ms', 'o'], (core) => { + result['-' + core] = !!$body[core + 'MatchesSelector'] + }) + } + + assign(result, { + edge: isEdge, + firefox: isBrowseType('Firefox'), + msie: !isEdge && result['-ms'], + safari: !isChrome && !isEdge && isBrowseType('Safari'), + isMobile, + isPC: !isMobile, + isLocalStorage: isBrowseStorage(staticWindow.localStorage), + isSessionStorage: isBrowseStorage(staticWindow.sessionStorage) + }) + } + + return result +} + +export default browse diff --git a/packages/renderless/src/grid/static/function/property.ts b/packages/renderless/src/grid/static/function/property.ts new file mode 100644 index 000000000..b4a059f3a --- /dev/null +++ b/packages/renderless/src/grid/static/function/property.ts @@ -0,0 +1,29 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ +import isNull from '../base/isNull' + +const property = (key, defs) => (object) => (isNull(object) ? defs : object[key]) + +export default property diff --git a/packages/renderless/src/grid/static/function/throttle.ts b/packages/renderless/src/grid/static/function/throttle.ts new file mode 100644 index 000000000..0537a04ee --- /dev/null +++ b/packages/renderless/src/grid/static/function/throttle.ts @@ -0,0 +1,87 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +/** + * 创建一个策略函数,当被重复调用函数的时候,至少每隔多少秒毫秒调用一次该函数 + * + * @param {Function} callback 回调 + * @param {Number} wait 多少秒毫 + * @param {Object} options 参数{leading: 是否在之前执行, trailing: 是否在之后执行} + * @return {Function} + */ +function throttle(callback, wait, options) { + let args + let context + let ops = options || {} + let flag = false + let timeout = 0 + let optLeading = 'leading' in ops ? ops.leading : true + let optTrailing = 'trailing' in ops ? ops.trailing : false + let endFn + + const runFn = function () { + flag = true + callback.apply(context, args) + timeout = setTimeout(endFn, wait) + } + + endFn = function () { + timeout = 0 + + if (!flag && optTrailing === true) { + runFn() + } + } + + const cancelFn = function () { + let rest = timeout !== 0 + + clearTimeout(timeout) + flag = false + timeout = 0 + + return rest + } + + const throttled = function () { + args = arguments + context = this + flag = false + + if (timeout === 0) { + if (optLeading === true) { + runFn() + } else if (optTrailing === true) { + timeout = setTimeout(endFn, wait) + } + } + } + + throttled.cancel = cancelFn + + return throttled +} + +export default throttle diff --git a/packages/renderless/src/grid/static/index.ts b/packages/renderless/src/grid/static/index.ts new file mode 100644 index 000000000..949008401 --- /dev/null +++ b/packages/renderless/src/grid/static/index.ts @@ -0,0 +1,135 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +// 对象相关的方法 +import assign from './object/assign' +import extend from './object/extend' +import objectEach from './object/objectEach' +import lastObjectEach from './object/lastObjectEach' +import objectMap from './object/objectMap' +import values from './object/values' + +// 数组相关的方法 +import map from './array/map' +import every from './array/every' +import find from './array/find' +import arrayEach from './array/arrayEach' +import lastArrayEach from './array/lastArrayEach' +import toArray from './array/toArray' +import sortBy from './array/sortBy' +import slice from './array/slice' +import includes from './array/includes' +import sum from './array/sum' +import toTreeArray from './array/toTreeArray' +import findTree from './array/findTree' +import eachTree from './array/eachTree' +import mapTree from './array/mapTree' +import filterTree from './array/filterTree' +import arrayIndexOf from './array/arrayIndexOf' + +// 基础方法 +import isNull from './base/isNull' +import isUndefined from './base/isUndefined' +import isFunction from './base/isFunction' +import isObject from './base/isObject' +import isString from './base/isString' +import isPlainObject from './base/isPlainObject' +import eqNull from './base/eqNull' +import each from './base/each' +import indexOf from './base/indexOf' +import keys from './base/keys' +import clone from './base/clone' +import lastEach from './base/lastEach' +import remove from './base/remove' +import clear from './base/clear' +import isBoolean from './base/isBoolean' +import isNumber from './base/isNumber' +import isEmpty from './base/isEmpty' +import isSet from './base/isSet' +import isEqual from './base/isEqual' +import uniqueId from './base/uniqueId' +import findIndexOf from './base/findIndexOf' +import toStringJSON from './base/toStringJSON' +import toJSONString from './base/toJSONString' +import has from './base/has' +import get from './base/get' +import set from './base/set' +import destructuring from './base/destructuring' + +// 数值相关方法 +import toNumber from './number/toNumber' + +// 字符串相关的方法 +import template from './string/template' +import toString from './string/toString' + +// 函数相关的方法 +import property from './function/property' + +const isArray = Array.isArray + +export { + assign, + extend, + objectEach, + lastObjectEach, + objectMap, + values, + map, + every, + find, + arrayEach, + lastArrayEach, + toArray, + sortBy, + slice, + includes, + sum, + toTreeArray, + findTree, + eachTree, + mapTree, + filterTree, + arrayIndexOf, + isArray, + isNull, + isUndefined, + isFunction, + isObject, + isString, + isPlainObject, + eqNull, + each, + indexOf, + keys, + clone, + lastEach, + remove, + clear, + isBoolean, + isNumber, + isEmpty, + isSet, + isEqual, + uniqueId, + findIndexOf, + toStringJSON, + toJSONString, + has, + get, + set, + destructuring, + toNumber, + template, + toString, + property +} diff --git a/packages/renderless/src/grid/static/number/helperCreateToNumber.ts b/packages/renderless/src/grid/static/number/helperCreateToNumber.ts new file mode 100644 index 000000000..71a1985e1 --- /dev/null +++ b/packages/renderless/src/grid/static/number/helperCreateToNumber.ts @@ -0,0 +1,38 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +const helperCreateToNumber = (handle) => (str) => { + if (str) { + let num = handle(str) + + if (!isNaN(num)) { + return num + } + } + + return 0 +} + +export default helperCreateToNumber diff --git a/packages/renderless/src/grid/static/number/toNumber.ts b/packages/renderless/src/grid/static/number/toNumber.ts new file mode 100644 index 000000000..434a3b2e8 --- /dev/null +++ b/packages/renderless/src/grid/static/number/toNumber.ts @@ -0,0 +1,30 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import helperCreateToNumber from './helperCreateToNumber' + +const toNumber = helperCreateToNumber(parseFloat) + +export default toNumber diff --git a/packages/renderless/src/grid/static/object/assign.ts b/packages/renderless/src/grid/static/object/assign.ts new file mode 100644 index 000000000..7be52eaaa --- /dev/null +++ b/packages/renderless/src/grid/static/object/assign.ts @@ -0,0 +1,73 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import arrayEach from '../array/arrayEach' +import keys from '../base/keys' +import clone from '../base/clone' + +let objectAssignFns = Object.assign + +const handleAssign = (destination, args, isClone) => { + let len = args.length + + for (let source, index = 1; index < len; index++) { + source = args[index] + + let eachCallback + + if (isClone) { + eachCallback = (key) => { + destination[key] = clone(source[key], isClone) + } + } else { + eachCallback = (key) => { + destination[key] = source[key] + } + } + + arrayEach(keys(args[index]), eachCallback) + } + + return destination +} + +const assign = function (target) { + if (target) { + let args = arguments + + if (target === true) { + if (args.length > 1) { + target = Array.isArray(target[1]) ? [] : {} + return handleAssign(target, args, true) + } + } else { + return objectAssignFns ? objectAssignFns.apply(Object, args) : handleAssign(target, args) + } + } + + return target +} + +export default assign diff --git a/packages/renderless/src/grid/static/object/extend.ts b/packages/renderless/src/grid/static/object/extend.ts new file mode 100644 index 000000000..99c57b5ff --- /dev/null +++ b/packages/renderless/src/grid/static/object/extend.ts @@ -0,0 +1,17 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import assign from './assign' + +const extend = assign + +export default extend diff --git a/packages/renderless/src/grid/static/object/lastObjectEach.ts b/packages/renderless/src/grid/static/object/lastObjectEach.ts new file mode 100644 index 000000000..0e5a2acb1 --- /dev/null +++ b/packages/renderless/src/grid/static/object/lastObjectEach.ts @@ -0,0 +1,35 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import lastArrayEach from '../array/lastArrayEach' +import keys from '../base/keys' + +const lastObjectEach = (obj, iterate, context) => { + lastArrayEach(keys(obj), (key) => { + iterate.call(context, obj[key], key, obj) + }) +} + +export default lastObjectEach diff --git a/packages/renderless/src/grid/static/object/objectEach.ts b/packages/renderless/src/grid/static/object/objectEach.ts new file mode 100644 index 000000000..959d6d8a3 --- /dev/null +++ b/packages/renderless/src/grid/static/object/objectEach.ts @@ -0,0 +1,38 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import hasOwnProp from '../base/hasOwnProp' + +const objectEach = (obj, iterate, context) => { + if (obj) { + Object.keys(obj).forEach((key) => { + if (hasOwnProp(obj, key)) { + iterate.call(context, obj[key], key, obj) + } + }) + } +} + +export default objectEach diff --git a/packages/renderless/src/grid/static/object/objectMap.ts b/packages/renderless/src/grid/static/object/objectMap.ts new file mode 100644 index 000000000..e5c7a3c7f --- /dev/null +++ b/packages/renderless/src/grid/static/object/objectMap.ts @@ -0,0 +1,50 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import each from '../base/each' +import isFunction from '../base/isFunction' +import property from '../function/property' + +const objectMap = (obj, iterate, context) => { + let result = {} + + if (obj) { + if (iterate) { + if (!isFunction(iterate)) { + iterate = property(iterate) + } + + each(obj, (val, index) => { + result[index] = iterate.call(context, val, index, obj) + }) + } else { + return obj + } + } + + return result +} + +export default objectMap diff --git a/packages/renderless/src/grid/static/object/values.ts b/packages/renderless/src/grid/static/object/values.ts new file mode 100644 index 000000000..fa69fc96e --- /dev/null +++ b/packages/renderless/src/grid/static/object/values.ts @@ -0,0 +1,29 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import objectEach from './objectEach' + +const values = (obj, iterator, ctx) => { + const objectValues = [] + + objectEach( + obj, + (val) => { + objectValues.push(val) + }, + ctx + ) + + return objectValues +} + +export default values diff --git a/packages/renderless/src/grid/static/static/staticDocument.ts b/packages/renderless/src/grid/static/static/staticDocument.ts new file mode 100644 index 000000000..82d366157 --- /dev/null +++ b/packages/renderless/src/grid/static/static/staticDocument.ts @@ -0,0 +1,30 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import staticStrUndefined from './staticStrUndefined' + +let staticDocument = typeof document === staticStrUndefined ? 0 : document + +export default staticDocument diff --git a/packages/renderless/src/grid/static/static/staticHGKeyRE.ts b/packages/renderless/src/grid/static/static/staticHGKeyRE.ts new file mode 100644 index 000000000..c892ab8c2 --- /dev/null +++ b/packages/renderless/src/grid/static/static/staticHGKeyRE.ts @@ -0,0 +1,28 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +const staticHGKeyRE = /(.+)?\[(\d+)\]$/ + +export default staticHGKeyRE diff --git a/packages/renderless/src/grid/static/static/staticParseInt.ts b/packages/renderless/src/grid/static/static/staticParseInt.ts new file mode 100644 index 000000000..fcc3eb94b --- /dev/null +++ b/packages/renderless/src/grid/static/static/staticParseInt.ts @@ -0,0 +1,28 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +let staticParseInt = parseInt + +export default staticParseInt diff --git a/packages/renderless/src/grid/static/static/staticStrUndefined.ts b/packages/renderless/src/grid/static/static/staticStrUndefined.ts new file mode 100644 index 000000000..db39d3e0d --- /dev/null +++ b/packages/renderless/src/grid/static/static/staticStrUndefined.ts @@ -0,0 +1,28 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +let staticStrUndefined = 'undefined' + +export default staticStrUndefined diff --git a/packages/renderless/src/grid/static/static/staticWindow.ts b/packages/renderless/src/grid/static/static/staticWindow.ts new file mode 100644 index 000000000..24d5f57c0 --- /dev/null +++ b/packages/renderless/src/grid/static/static/staticWindow.ts @@ -0,0 +1,30 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import staticStrUndefined from './staticStrUndefined' + +let staticWindow = typeof window === staticStrUndefined ? 0 : window + +export default staticWindow diff --git a/packages/renderless/src/grid/static/string/template.ts b/packages/renderless/src/grid/static/string/template.ts new file mode 100644 index 000000000..755d52a3b --- /dev/null +++ b/packages/renderless/src/grid/static/string/template.ts @@ -0,0 +1,39 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import toValString from './toString' +import get from '../base/get' + +const template = (str, obj) => { + let rest = toValString(str) + + if (rest && obj) { + return rest.replace(/\{{2}([.\w[\]\s]+)\}{2}/g, (match, keys) => get(obj, keys)) + } + + return rest +} + +export default template diff --git a/packages/renderless/src/grid/static/string/toString.ts b/packages/renderless/src/grid/static/string/toString.ts new file mode 100644 index 000000000..01e51c90d --- /dev/null +++ b/packages/renderless/src/grid/static/string/toString.ts @@ -0,0 +1,40 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ +import eqNull from '../base/eqNull' +import isNumber from '../base/isNumber' + +const toValString = (obj) => { + if (isNumber(obj)) { + if (String(obj).includes('e-')) { + let isNegative = obj < 0 + + return (isNegative ? '-' : '') + '0' + String((isNegative ? Math.abs(obj) : obj) + 1).substr(1) + } + } + + return String(eqNull(obj) ? '' : obj) +} + +export default toValString diff --git a/packages/renderless/src/grid/utils/column.ts b/packages/renderless/src/grid/utils/column.ts new file mode 100644 index 000000000..e1484f485 --- /dev/null +++ b/packages/renderless/src/grid/utils/column.ts @@ -0,0 +1,85 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { isBoolean } from '../static' +import { initFilter } from './common' + +let columnUniqueId = 0 + +function setBasicProperty(column, context) { + column.id = `col_${++columnUniqueId}` + column.type = context.type + column.prop = context.prop + column.rules = context.rules + column.required = context.required + column.property = context.field || context.prop + column.title = context.title + column.label = context.label + column.width = context.width + column.minWidth = context.minWidth + column.resizable = context.resizable + column.fixed = context.fixed + column.align = context.align + column.headerAlign = context.headerAlign + column.footerAlign = context.footerAlign + column.showOverflow = context.showOverflow + column.showHeaderOverflow = context.showHeaderOverflow + column.showTip = context.showTip + column.showHeaderTip = context.showHeaderTip + column.className = context.class || context.className + column.headerClassName = context.headerClassName + column.footerClassName = context.footerClassName + column.indexMethod = context.indexMethod + column.formatText = context.formatText + column.formatValue = context.formatValue + column.format = context.formatConfig + column.sortable = context.sortable + column.sortBy = context.sortBy + column.sortMethod = context.sortMethod + column.remoteSort = context.remoteSort + column.filterMultiple = isBoolean(context.filterMultiple) ? context.filterMultiple : true + column.filterMethod = context.filterMethod + column.filterRender = context.filterRender + column.filter = context.filter && initFilter(context.filter) + column.treeNode = context.treeNode + column.renderer = context.renderer + column.editor = context.editor +} + +function ColumnConfig(context, { renderHeader, renderCell, renderData } = {}, config = {}) { + // 基本属性 + setBasicProperty(this, context) + // 自定义参数 + this.params = context.params + // 渲染属性 + this.visible = true + this.level = 1 + this.rowSpan = 1 + this.colSpan = 1 + this.order = null + this.renderWidth = 0 + this.renderHeight = 0 + this.resizeWidth = 0 + this.renderLeft = 0 + this.model = {} + this.renderHeader = renderHeader || context.renderHeader + this.renderCell = renderCell || context.renderCell + this.renderData = renderData + this.showIcon = isBoolean(context.showIcon) ? context.showIcon : true + this.loading = false + // 单元格插槽,只对 grid 有效 + this.slots = context.slots + this.own = context + this.asyncPrefix = config.constant.asyncPrefix +} + +export const getColumnConfig = (context, options, config) => (context instanceof ColumnConfig ? context : new ColumnConfig(context, options, config)) diff --git a/packages/renderless/src/grid/utils/common.ts b/packages/renderless/src/grid/utils/common.ts new file mode 100644 index 000000000..3bae309cd --- /dev/null +++ b/packages/renderless/src/grid/utils/common.ts @@ -0,0 +1,190 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import { extend } from '@opentiny/vue-renderless/common/object' +import { isNull } from '@opentiny/vue-renderless/common/type' +import { find } from '@opentiny/vue-renderless/common/array' +import { get, isFunction, set, findTree } from '../static' + +export const gridSize = ['medium', 'small', 'mini'] + +export const getSize = ({ size, $parent }) => size || ($parent && gridSize.includes($parent.size) ? $parent.size : null) + +export const getFuncText = (content) => (isFunction(content) ? content() : content) + +// 行主键 key +export const getRowkey = ($table) => $table.rowId + +// 行主键 value +export const getRowid = ($table, row) => { + const rowId = get(row, getRowkey($table)) + return rowId ? encodeURIComponent(rowId) : '' +} + +// 获取所有的列,排除分组 +export const getColumnList = (columns) => { + const result = [] + + columns.forEach((column) => { + result.push.apply(result, column.children && column.children.length ? getColumnList(column.children) : [column]) + }) + + return result +} + +export const getClass = (property, params) => (property ? (isFunction(property) ? property(params) : property) : '') + +export const getFilters = (filters) => + (filters || []).map(({ label, value, data, checked }) => ({ + label, + value, + data, + _data: data, + checked: !!checked + })) + +export const initFilter = (filter) => { + const filterOpt = extend({}, filter, true) + + filterOpt.condition = { + input: '', + relation: 'equals', + empty: null, + type: null, + value: [] + } + filterOpt.hasFilter = false + filterOpt.custom = null + + return filterOpt +} + +export const formatText = (value) => `${isNull(value) ? '' : value}` + +export const setCellValue = (row, column, value) => { + const { format, property } = column + + // 处理异步列 + if (format && format.async && Array.isArray(format.data) && format.data.length > 0 && value) { + let labelText = '' + const { enabled, valueSplit, textSplit } = format.async.splitConfig || {} + const findCellValue = (optionValue) => + find(format.data, (col) => { + if (typeof col === 'object') { + const colLabel = get(col, format.async.text || 'label') + const colValue = get(col, format.async.value || 'value') + + col.label = colLabel + + return optionValue === colValue || optionValue === colLabel + } + + return optionValue === col + }) + + if (enabled) { + const labelTexts = [] + + value.split(valueSplit || ',').forEach((item) => { + const findValue = findCellValue(item) + + if (findValue) { + labelTexts.push(findValue.label) + } + }) + + labelText = labelTexts.join(textSplit || ',') + } else { + labelText = findCellValue(value) + } + + set(row, column.asyncPrefix + property, labelText ? labelText.label : labelText) + } + + set(row, property, value) +} + +export const hasChildrenList = (item) => item && item.children && item.children.length > 0 + +export const destroyColumn = ($table, { columnConfig }) => { + const matchObj = findTree($table.collectColumn, (column) => column === columnConfig) + + if (matchObj) { + matchObj.items.splice(matchObj.index, 1) + } + + $table.collectColumn = $table.collectColumn.slice(0) +} + +export const emitEvent = (vnode, type, args) => { + if (vnode.tableListeners[type]) { + vnode.$emit.apply(vnode, [type].concat(args)) + } +} + +export const assemColumn = ($table, $column, instance) => { + const { columnConfig, $el: elm, $scopedSlots, $slots, $parent } = instance + const { collectColumn } = $table + + columnConfig.slots = $scopedSlots || $slots + + const parentNode = elm.parentNode + const insertIndex = [].indexOf.call(parentNode.children, elm) + + if (!$column || $column !== $parent) { + collectColumn.splice(insertIndex, 0, columnConfig) + } else { + const parentConfig = $column.columnConfig + + if (!parentConfig.children) { + parentConfig.children = [] + } + parentConfig.children.splice(insertIndex, 0, columnConfig) + } + + $table.collectColumn = collectColumn.slice(0) +} + +export const getCellValue = (row, column) => get(row, column.property) + +export const getListeners = ($attrs, $listeners) => { + const regHyphenate = /\B([A-Z])/g + const regEventPrefix = /^on[A-Z]/ + const listeners = {} + + if ($listeners) { + return $listeners + } + + Object.keys($attrs).forEach((name) => { + const event = $attrs[name] + + if (regEventPrefix.test(name) && typeof event === 'function') { + listeners[name.substr(2).replace(regHyphenate, '-$1').toLowerCase()] = event + } + }) + + return listeners +} diff --git a/packages/renderless/src/grid/utils/dom.ts b/packages/renderless/src/grid/utils/dom.ts new file mode 100644 index 000000000..b2fcb8872 --- /dev/null +++ b/packages/renderless/src/grid/utils/dom.ts @@ -0,0 +1,273 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import { getRowid } from './common' +import { hasClass } from '@opentiny/vue-renderless/common/deps/dom' +import { arrayIndexOf } from '../static' + +const ATTR_NAME = 'data-rowid' +const CELL_CLS = '.tiny-grid-cell' +const ROW_CLS = '.tiny-grid-body__row' +const htmlEl = document.querySelector('html') +const bodyEl = document.body + +export const isPx = (val) => val && /^\d+(px)?$/.test(val) + +export const isScale = (val) => val && /^\d+%$/.test(val) + +export const updateCellTitle = (event) => { + const cellEl = event.currentTarget.querySelector(CELL_CLS) + const content = cellEl.innerText + + if (cellEl.getAttribute('title') !== content) { + cellEl.setAttribute('title', content) + } +} + +export const rowToVisible = ($table, row) => { + $table.$nextTick(() => { + const tableBodyVnode = $table.$refs.tableBody + + if (tableBodyVnode) { + const gridbodyEl = tableBodyVnode.$el + const trEl = gridbodyEl.querySelector(`[${ATTR_NAME}="${getRowid($table, row)}"]`) + + if (trEl) { + const bodyHeight = gridbodyEl.clientHeight + const bodySrcollTop = gridbodyEl.scrollTop + const trOffsetTop = trEl.offsetTop + (trEl.offsetParent ? trEl.offsetParent.offsetTop : 0) + const trHeight = trEl.clientHeight + + if (trOffsetTop < bodySrcollTop || trOffsetTop > bodySrcollTop + bodyHeight) { + // 如果跨行滚动 + gridbodyEl.scrollTop = trOffsetTop + } else if (trOffsetTop + trHeight >= bodyHeight + bodySrcollTop) { + gridbodyEl.scrollTop = bodySrcollTop + trHeight + } + } else { + // 如果是虚拟渲染跨行滚动 + if ($table.scrollYLoad) { + gridbodyEl.scrollTop = ($table.afterFullData.indexOf(row) - 1) * $table.scrollYStore.rowHeight + } + } + } + }) +} + +function getFixedLeft($table, from, column, body, offset) { + let scrollLeft = $table.elemStore['main-body-wrapper'].scrollLeft + offset + + if (!column.fixed) { + from.fixed === 'left' && (scrollLeft = 0) + from.fixed === 'right' && (scrollLeft = body.scrollWidth) + } + + return scrollLeft +} + +function setBodyLeft(body, td, $table, column, move) { + const { isLeftArrow, isRightArrow, from } = move || {} + const bodyWidth = body.clientWidth + const bodySrcollLeft = body.scrollLeft + const tdOffsetLeft = td.offsetLeft + (td.offsetParent ? td.offsetParent.offsetLeft : 0) + const tdWidth = td.clientWidth + + if (tdOffsetLeft < bodySrcollLeft || tdOffsetLeft > bodySrcollLeft + bodyWidth) { + // 如果跨列滚动 + from !== column && (body.scrollLeft = tdOffsetLeft) + } else if (tdOffsetLeft + tdWidth >= bodyWidth + bodySrcollLeft) { + body.scrollLeft = bodySrcollLeft + tdWidth + } + + if (from) { + const direction = isLeftArrow ? 'left' : isRightArrow ? 'right' : null + const fixedDom = $table.elemStore[`${direction}-body-list`] + const mainBody = $table.elemStore['main-body-wrapper'] + const { left, right } = td.getBoundingClientRect() + let offset = 0 + + if (isLeftArrow && fixedDom) { + const div = fixedDom.querySelector('td.fixed__hidden') + const division = div ? div.getBoundingClientRect().left : fixedDom.getBoundingClientRect().right + + division > left && (offset = left - division) + } + + if (isRightArrow && fixedDom) { + const div = fixedDom.querySelector('td:not(.fixed__hidden)') || fixedDom + const division = div.getBoundingClientRect().left + + division < right && (offset = right - division) + } + + mainBody.scrollLeft = getFixedLeft($table, from, column, body, offset) + } +} + +export const colToVisible = ($table, column, move) => { + $table.$nextTick(() => { + const gridbodyEl = $table.$refs.tableBody.$el + const tdElem = gridbodyEl.querySelector(`.${column.id}`) + + if (tdElem) { + setBodyLeft(gridbodyEl, tdElem, $table, column, move) + } else if ($table.scrollXLoad) { + // 如果是虚拟渲染跨行滚动 + const visibleColumn = $table.visibleColumn + let scrollLeft = 0 + + for (let index = 0; index < visibleColumn.length; index++) { + if (visibleColumn[index] === column) { + break + } + + scrollLeft += visibleColumn[index].renderWidth + } + + gridbodyEl.scrollLeft = scrollLeft + } + }) +} + +export const getDomNode = () => { + const documentElement = document.documentElement + const bodyElement = document.body + + return { + scrollTop: documentElement.scrollTop || bodyElement.scrollTop, + scrollLeft: documentElement.scrollLeft || bodyElement.scrollLeft, + visibleHeight: documentElement.clientHeight || bodyElement.clientHeight, + visibleWidth: documentElement.clientWidth || bodyElement.clientWidth + } +} + +export const getEventTargetNode = (event, container, queryCls) => { + let targetEl + let target = event.target + + while (target && target.nodeType && target !== document) { + if (queryCls && hasClass(target, queryCls)) { + targetEl = target + } else if (target === container) { + return { + flag: queryCls ? !!targetEl : true, + container, + targetElem: targetEl + } + } + + target = target.parentNode + } + + return { flag: false } +} + +function getNodeOffset(el, container, rest) { + if (el) { + const parentEl = el.parentNode + + rest.top += el.offsetTop + rest.left += el.offsetLeft + + if (parentEl && parentEl !== htmlEl && parentEl !== bodyEl) { + rest.top -= parentEl.scrollTop + rest.left -= parentEl.scrollLeft + } + + if (container && (el === container || el.offsetParent === container) ? 0 : el.offsetParent) { + return getNodeOffset(el.offsetParent, container, rest) + } + } + + return rest +} + +/** + * 获取元素相对于 document 的位置 + */ +export const getOffsetPos = (el, container) => getNodeOffset(el, container, { left: 0, top: 0 }) + +export const getAbsolutePos = (el) => { + const bounding = el.getBoundingClientRect() + const { scrollTop, scrollLeft } = getDomNode() + + return { + top: scrollTop + bounding.top, + left: scrollLeft + bounding.left + } +} + +/** + * 获取单元格节点索引 + */ +export const getCellNodeIndex = (cell) => { + const trEl = cell.parentNode + const columnIndex = arrayIndexOf(trEl.children, cell) + const rowIndex = arrayIndexOf(trEl.parentNode.children, trEl) + + return { columnIndex, rowIndex } +} + +/** + * 获取选中单元格矩阵范围 + */ +export const getRowNodes = (trList, cellNode, targetCellNode) => { + const startColIndex = cellNode.columnIndex + const startRowIndex = cellNode.rowIndex + const targetColIndex = targetCellNode.columnIndex + const targetRowIndex = targetCellNode.rowIndex + const rows = [] + + for (let rowIndex = Math.min(startRowIndex, targetRowIndex), rowLen = Math.max(startRowIndex, targetRowIndex); rowIndex <= rowLen; rowIndex++) { + const cells = [] + const trEl = trList[rowIndex] + + for (let colIndex = Math.min(startColIndex, targetColIndex), colLen = Math.max(startColIndex, targetColIndex); colIndex <= colLen; colIndex++) { + cells.push(trEl.children[colIndex]) + } + + rows.push(cells) + } + + return rows +} + +export const getCellIndexs = (cell) => { + const trEl = cell.parentNode + const rowid = trEl.getAttribute(ATTR_NAME) + const columnIndex = [].indexOf.call(trEl.children, cell) + const rowIndex = [].indexOf.call(trEl.parentNode.children, trEl) + + return { rowid, rowIndex, columnIndex } +} + +export const getCell = ($table, { row, column }) => + new Promise((resolve) => { + $table.$nextTick(() => { + const bodyElem = $table.$refs[`${column.fixed || 'table'}Body`] + + resolve((bodyElem || $table.$refs.tableBody).$el.querySelector(`${ROW_CLS}[${ATTR_NAME}="${getRowid($table, row)}"] .${column.id}`)) + }) + }) diff --git a/packages/renderless/src/grid/utils/event.ts b/packages/renderless/src/grid/utils/event.ts new file mode 100644 index 000000000..e5ed008a9 --- /dev/null +++ b/packages/renderless/src/grid/utils/event.ts @@ -0,0 +1,61 @@ +/** + * MIT License + * + * Copyright (c) 2019 Xu Liangzhan + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +import browser from '@opentiny/vue-renderless/common/browser' +import { remove } from '../static' +import { on } from '@opentiny/vue-renderless/common/deps/dom' + +// 监听全局事件 +const wheelName = browser.isDoc && /Firefox/i.test(navigator.userAgent) ? 'DOMMouseScroll' : 'mousewheel' +const eventStore = [] + +const GlobalEvent = { + on(comp, type, cb) { + if (cb) { + eventStore.push({ comp, type, cb }) + } + }, + off(comp, type) { + remove(eventStore, (item) => item.comp === comp && item.type === type) + }, + trigger(event) { + eventStore.forEach(({ comp, type, cb }) => { + if (type === event.type || (type === 'mousewheel' && event.type === wheelName)) { + cb.call(comp, event) + } + }) + } +} + +if (browser.isDoc) { + on(document, 'keydown', GlobalEvent.trigger) + on(document, 'contextmenu', GlobalEvent.trigger) + on(window, 'mousedown', GlobalEvent.trigger) + on(window, 'blur', GlobalEvent.trigger) + on(window, 'resize', GlobalEvent.trigger) + on(window, wheelName, GlobalEvent.trigger) +} + +export default GlobalEvent diff --git a/packages/renderless/src/grid/utils/index.ts b/packages/renderless/src/grid/utils/index.ts new file mode 100644 index 000000000..209cb8779 --- /dev/null +++ b/packages/renderless/src/grid/utils/index.ts @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import GlobalEvent from './event' + +export * from './column' +export * from './common' +export * from './dom' +export { GlobalEvent } diff --git a/packages/renderless/src/hrapprover/index.ts b/packages/renderless/src/hrapprover/index.ts new file mode 100644 index 000000000..7eed44f6b --- /dev/null +++ b/packages/renderless/src/hrapprover/index.ts @@ -0,0 +1,126 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { extend } from '@opentiny/vue-renderless/common/object' + +export const getHrList = ({ api, props, state }) => (deptCode) => { + state.loading = true + + const params = { + code: deptCode, + category: props.category + } + + return api.fetchHrapprover(params).then((data) => { + const hraInfo = [] + + data.forEach((info) => { + const person = info.approval_Person + + if (!person) { + return + } + + const persons = person.split('#') + + persons.forEach((val) => { + const newInfo = extend({}, info, { 'approval_person': val }) + hraInfo.push(newInfo) + }) + }) + + state.loading = false + return hraInfo + }) +} + +export const selectedDept = ({ api, state }) => (value) => { + if (!value) { + state.hrList = [] + state.approvalPerson = '' + return + } + + api + .getHrList(value) + .then((result) => { + state.hrList = result + + const hasApproval = result.some((item) => item.approval_person === state.approvalPerson) + + if (!hasApproval) { + state.approvalPerson = '' + } + }) + .catch(() => { + state.hrList = [] + }) +} + +export const getDisplay = ({ api, state }) => (value) => { + if (state.current === value) { + return + } + + state.current = value + + if (!value) { + state.hrList = [] + state.lastHrList = [] + state.approvalPerson = '' + + return + } + + api + .getHrList(value) + .then((result) => { + state.hrList = result + state.lastHrList = result + + const hasApproval = result.some((item) => item.approval_person === state.approvalPerson) + + if (!hasApproval) { + state.approvalPerson = '' + } + }) + .catch(() => { + state.hrList = [] + state.lastHrList = [] + state.approvalPerson = '' + }) +} + +export const resetPerson = ({ props, state }) => () => { + state.approvalPerson = props.approvalPerson +} + +export const hrChange = ({ emit, state }) => (value) => { + state.current = value + emit('update:modelValue', value) + emit('update:approvalPerson', state.approvalPerson) +} + +export const initService = ({ props, service }) => { + const { fetchHrapprover } = service || {} + + const fetchHrapproverNoop = () => Promise.reject(new Error('[TINY Error][Hrapprover] Prop fetchHrapprover is not configured')) + + return { + fetchHrapprover: props.fetchHrapprover || fetchHrapprover || fetchHrapproverNoop + } +} + +export const cancel = ({ state }) => () => { + state.approvalPerson = state.overdueData + state.hrList = state.lastHrList +} diff --git a/packages/renderless/src/hrapprover/vue.ts b/packages/renderless/src/hrapprover/vue.ts new file mode 100644 index 000000000..b030fd3e2 --- /dev/null +++ b/packages/renderless/src/hrapprover/vue.ts @@ -0,0 +1,74 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getHrList, selectedDept, resetPerson, hrChange, initService, getDisplay, cancel } from './index' + +export const api = ['state', 'hrChange', 'selectedDept', 'resetPerson', 'getDisplay', 'cancel'] + +const initState = ({ reactive, props }) => { + const state = reactive({ + hrList: [], + lastHrList: [], + dept: props.modelValue, + current: '', + approvalPerson: props.approvalPerson, + overdueData: '', + loading: false + }) + + return state +} + +const initApi = ({ api, state, emit, props, $service }) => { + Object.assign(api, { + state, + hrChange: hrChange({ emit, state }), + resetPerson: resetPerson({ props, state }), + fetchHrapprover: $service.fetchHrapprover, + cancel: cancel({ state }), + getHrList: getHrList({ api, props, state }), + selectedDept: selectedDept({ api, state }), + getDisplay: getDisplay({ api, state }) + }) +} + +const initWatch = ({ watch, state, api, props }) => { + watch( + () => props.modelValue, + (value) => { + state.dept = value + + api.getDisplay(value) + }, + { immediate: true } + ) + + watch( + () => props.approvalPerson, + (value) => { + state.overdueData = value + state.approvalPerson = value + }, + { immediate: true } + ) +} + +export const renderless = (props, { reactive, watch }, { service, emit }) => { + const api = {} + const $service = initService({ props, service }) + const state = initState({ reactive, props }) + + initApi({ api, state, emit, props, $service }) + initWatch({ watch, state, api, props }) + + return api +} diff --git a/packages/renderless/src/image-viewer/index.ts b/packages/renderless/src/image-viewer/index.ts new file mode 100644 index 000000000..00cbfb782 --- /dev/null +++ b/packages/renderless/src/image-viewer/index.ts @@ -0,0 +1,474 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' +import { KEY_CODE } from '@opentiny/vue-renderless/common' +import PopupManager from '@opentiny/vue-renderless/common/deps/popup-manager' + +const isFirefox = () => !!window.navigator.userAgent.match(/firefox/i) + +const mousewheelEventName = isFirefox() ? 'DOMMouseScroll' : 'mousewheel' + +export const rafThrottle = (fn) => { + let locked = false + + return function (...args) { + if (locked) { + return + } + + locked = true + + window.requestAnimationFrame(() => { + fn.apply(this, args) + locked = false + }) + } +} + +export const hide = ({ props, api }) => () => { + api.deviceSupportUninstall() + props.onClose() +} + +export const deviceSupportInstall = ({ state, api }) => () => { + state._keyDownHandler = rafThrottle((event) => { + const keyCode = event.keyCode + + switch (keyCode) { + case KEY_CODE.Escape: + api.hide() + break + case KEY_CODE.Space: + api.toggleMode() + break + case KEY_CODE.ArrowLeft: + api.prev() + break + case KEY_CODE.ArrowUp: + api.handleActions('zoomIn') + break + case KEY_CODE.ArrowRight: + api.next() + break + case KEY_CODE.ArrowDown: + api.handleActions('zoomOut') + break + default: + break + } + }) + + state._mouseWheelHandler = rafThrottle((event) => { + const delta = event.wheelDelta ? event.wheelDelta : -event.detail + + if (delta > 0) { + api.handleActions('zoomIn', { + zoomRate: 0.015, + enableTransition: false + }) + } else { + api.handleActions('zoomOut', { + zoomRate: 0.015, + enableTransition: false + }) + } + }) + + on(document, 'keydown', state._keyDownHandler) + on(document, mousewheelEventName, state._mouseWheelHandler) +} + +export const deviceSupportUninstall = (state) => () => { + off(document, 'keydown', state._keyDownHandler) + off(document, mousewheelEventName, state._mouseWheelHandler) + + state._keyDownHandler = null + state._mouseWheelHandler = null +} + +export const handleImgLoad = (state) => () => (state.loading = false) + +export const handleImgError = ({ state, t }) => (event) => { + state.loading = false + event.target.alt = t('ui.imageViewer.loadErrorAlt') +} + +export const handleMouseDown = (state) => (event) => { + if (state.loading || event.button !== 0) { + return + } + + const { offsetX, offsetY } = state.transform + const startX = event.pageX + const startY = event.pageY + + state._dragHandler = rafThrottle((event) => { + state.transform.offsetX = offsetX + event.pageX - startX + state.transform.offsetY = offsetY + event.pageY - startY + }) + + on(document, 'mousemove', state._dragHandler) + on(document, 'mouseup', () => off(document, 'mousemove', state._dragHandler)) + + event.preventDefault() +} + +export const reset = (state) => () => + (state.transform = { + scale: 1, + deg: 0, + offsetX: 0, + offsetY: 0, + enableTransition: false + }) + +export const toggleMode = ({ state, constants, api }) => () => { + if (state.loading) { + return + } + + const MODE = constants.MODE + const modeNames = Object.keys(MODE) + const modeValues = [] + + modeNames.forEach((key) => { + modeValues.push(MODE[key]) + }) + + let index = -1 + + modeValues.forEach((item, inx) => { + if (item.name === state.mode.name) { + index = inx + } + }) + + const nextIndex = (index + 1) % modeNames.length + + state.mode = MODE[modeNames[nextIndex]] + + api.reset() +} + +export const prev = ({ state, props }) => () => { + if (state.isFirst && !state.infinite) { + return + } + + const len = props.urlList.length + + state.index = (state.index - 1 + len) % len +} + +export const next = ({ state, props }) => () => { + if (state.isLast && !state.infinite) { + return + } + + const len = props.urlList.length + + state.index = (state.index + 1) % len +} + +export const handleActions = (state) => (action, options = {}) => { + if (state.loading) { + return + } + + const { zoomRate, rotateDeg, enableTransition } = { + zoomRate: 0.2, + rotateDeg: 90, + enableTransition: true, + ...options + } + const { transform } = state + + if (action === 'zoomOut') { + if (transform.scale > 0.2) { + transform.scale = parseFloat((transform.scale - zoomRate).toFixed(3)) + } + } else if (action === 'zoomIn') { + transform.scale = parseFloat((transform.scale + zoomRate).toFixed(3)) + } else if (action === 'clocelise') { + transform.deg += rotateDeg + } else if (action === 'anticlocelise') { + transform.deg -= rotateDeg + } + + transform.enableTransition = enableTransition +} + +export const computedIsSingle = (props) => () => props.urlList.length <= 1 + +export const computedIsFirst = (state) => () => state.index === 0 + +export const computedIsLast = ({ state, props }) => () => state.index === props.urlList.length - 1 + +export const computedCurrentImg = ({ state, props }) => () => props.urlList[state.index] + +export const computedImgStyle = ({ state, constants }) => () => { + const { offsetX, offsetY, scale, deg, enableTransition } = state.transform + const transition = enableTransition ? 'transform .3s' : '' + + const style = { + transform: `scale(${scale}) rotate(${deg}deg)`, + transition, + 'margin-top': `${offsetY}px`, + 'margin-left': `${offsetX}px` + } + + if (JSON.stringify(state.mode) === JSON.stringify(constants.MODE.CONTAIN)) { + style.maxWidth = style.maxHeight = '100%' + } + + return style +} + +export const watchVisible = (state) => (value) => (state.previewVisible = value) + +export const handleVisible = ({ state, emit, props }) => () => { + state.transform.scale = 1 + state.transform.deg = 0 + + setTimeout(() => { + if (props.startPosition !== 0) { + state.index = (props.startPosition - 1 + state.urlList.length) % state.urlList.length + state.imageTransform = state.index * state.imageItemWidth + state.imageTransformSize = -state.index * state.imageItemWidth + } else { + state.index = 0 + state.imageTransform = state.index * state.imageItemWidth + state.imageTransformSize = -state.index * state.imageItemWidth + } + }, 300) + + emit('update:preview-visible', false) + emit('close', state.index, state.urlList[state.index]) +} + +export const getImageWidth = ({ state, parent, props }) => () => { + let imageW = 0 + const len = state.urlList.length + + imageW = parent.$el.querySelector('.tiny-mobile-image-viewer__canvas').offsetWidth + + state.imageList = parent.$el.querySelectorAll('.tiny-mobile-image-viewer__item') + + state.imageItemWidth = imageW + state.iamgeAllWidth = state.urlList.length * imageW + + if (props.startPosition !== 0) { + state.index = props.startPosition + state.imageTransition = 0 + + const transformX = state.index * state.imageItemWidth + + state.imageTransform = transformX + state.imageTransformSize = -transformX + } + + if (state.index === 0 && props.deleteButton && state.delete) { + state.imageTransition = 0 + + const transformX = state.index * state.imageItemWidth + + state.imageTransform = transformX + state.imageTransformSize = -transformX + } + + setTimeout(() => { + state.imageTransition = 300 + }, 0) + + if (props.startPosition === 0) { + state.arrowStyle = 'N' + } + + if (props.startPosition === len - 1) { + state.arrowStyle = 'Y' + } +} + +export const swipeLeft = ({ state, emit }) => () => { + if (state.isLast && !state.infinite) { + return + } + + const len = state.urlList.length + + if (state.index >= state.urlList.length - 2) { + state.arrowStyle = 'Y' + } else { + state.arrowStyle = null + } + + if (state.imageTransform === state.iamgeAllWidth) { + state.imageTransformSize = state.imageTransform = 0 + state.imageList[0].style.transform = null + + return + } + + if (state.imageTransform == state.iamgeAllWidth - state.imageItemWidth && state.index == state.urlList.length - 1) { + return + } + + state.index = (state.index + 1) % len + + const transformX = state.index * state.imageItemWidth + + state.imageTransform = transformX + state.imageTransformSize = -transformX + + emit('change', state.index, state.urlList[state.index]) +} + +export const swipeRight = ({ state, emit }) => () => { + if (state.isFirst && !state.infinite) { + return + } + + const len = state.urlList.length + + if (state.index <= 1) { + state.arrowStyle = 'N' + } else { + state.arrowStyle = null + } + + if (state.imageTransform == 0 && state.index == 0) { + return + } + + state.index = (state.index - 1 + len) % len + + const transformX = state.index * state.imageItemWidth + + state.imageTransform = transformX + state.imageTransformSize = -transformX + + emit('change', state.index, state.urlList[state.index]) +} + +export const handleDelete = ({ api, emit, state }) => () => { + if (state.urlList.length <= 1) { + state.delete = false + return + } + + state.delete = true + + const currenIndex = state.index + const urlList = state.urlList + + urlList.splice(currenIndex, 1) + state.urlList = urlList + state.index = 0 + + api.getImageWidth() + + emit('newImageList', state.urlList, currenIndex) +} + +const preventDefault = (event, isStopPropagation) => { + if (typeof event.cancelable !== 'boolean' || event.cancelable) { + event.preventDefault() + } + + if (isStopPropagation) { + event.stopPropagation() + } +} + +export const touchstart = (state) => (e) => { + const touches = e.touches + const events = touches[0] + const events2 = touches[1] + + preventDefault(e) + + state.pageX = events.pageX + state.pageY = events.pageY + state.moveable = true + + if (events2) { + state.pageX2 = events2.pageX + state.pageY2 = events2.pageY + } + + state.originScale = state.scale || 1 +} + +export const touchmove = (state) => (event) => { + if (!state.moveable) { + return + } + + preventDefault(event) + + const touches = event.touches + const events = touches[0] + const events2 = touches[1] + + if (events2) { + if (!state.pageX2) { + state.pageX2 = events2.pageX + } + + if (!state.pageY2) { + state.pageY2 = events2.pageY + } + + const getDistance = (start, stop) => Math.hypot(stop.x - start.x, stop.y - start.y) + + const zoom = + getDistance( + { + x: events.pageX, + y: events.pageY + }, + { + x: events2.pageX, + y: events2.pageY + } + ) / + getDistance( + { + x: state.pageX, + y: state.pageY + }, + { + x: state.pageX2, + y: state.pageY2 + } + ) + + let newScale = state.originScale * zoom + + if (newScale > 3) { + newScale = 3 + } + + state.scale = newScale + state.transform.scale = newScale + } +} + +export const touchend = (state) => () => { + state.moveable = false + state.pageX2 = 0 + state.pageY2 = 0 +} + +export const computeZIndex = ({ constants, props }) => () => + props.zIndex === constants.DEFAULT_POPPER_ZINDEX || props.zIndex < 1 ? PopupManager.nextZIndex() : props.zIndex diff --git a/packages/renderless/src/image-viewer/vue.ts b/packages/renderless/src/image-viewer/vue.ts new file mode 100644 index 000000000..2ed749bcb --- /dev/null +++ b/packages/renderless/src/image-viewer/vue.ts @@ -0,0 +1,191 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + computedIsSingle, + watchVisible, + computedIsFirst, + computedIsLast, + computedCurrentImg, + computedImgStyle, + hide, + deviceSupportInstall, + deviceSupportUninstall, + handleImgLoad, + handleImgError, + handleMouseDown, + reset, + toggleMode, + prev, + next, + handleActions, + handleVisible, + getImageWidth, + swipeLeft, + swipeRight, + handleDelete, + touchstart, + touchmove, + touchend, + computeZIndex +} from './index' + +export const api = [ + 'state', + 'zIndex', + 'touchstart', + 'touchmove', + 'touchend', + 'urlList', + 'hide', + 'prev', + 'next', + 'handleActions', + 'toggleMode', + 'handleImgLoad', + 'handleImgError', + 'handleMouseDown', + 'handleVisible', + 'swipeLeft', + 'swipeRight', + 'handleDelete' +] + +const initState = ({ reactive, computed, api, mode, props, constants }) => { + const state = reactive({ + index: mode == 'pc' ? 0 : props.startPosition, + isShow: false, + infinite: true, + loading: false, + transform: { scale: 1, deg: 0, offsetX: 0, offsetY: 0, objfit: 'contain', enableTransition: false }, + urlList: props.urlList, + mode: constants.MODE.CONTAIN, + previewVisible: props.previewVisible, + fullScreen: props.imageFullCurrent, + hammer: null, + imageItemWidth: 0, + imageAllWidth: 0, + imageTransform: 0, + imageTransformSize: 0, + imageTransition: 300, + imageList: null, + arrowStyle: null, + delete: false, + isLast: computed(() => api.computedIsLast()), + isFirst: computed(() => api.computedIsFirst()), + isSingle: computed(() => api.computedIsSingle()), + imgStyle: computed(() => api.computedImgStyle()), + currentImg: computed(() => api.computedCurrentImg()), + zIndex: computed(() => api.computeZIndex()) + }) + + return state +} + +const initApi = ({ api, state, props, parent, nextTick, emit, t, constants }) => { + Object.assign(api, { + state, + touchstart: touchstart(state), + touchmove: touchmove(state), + touchend: touchend(state), + reset: reset(state), + prev: prev({ state, props }), + next: next({ state, props }), + getImageWidth: getImageWidth({ state, parent, props, nextTick }), + handleVisible: handleVisible({ state, emit, props }), + handleActions: handleActions(state), + handleImgLoad: handleImgLoad(state), + handleMouseDown: handleMouseDown(state), + computedIsFirst: computedIsFirst(state), + computedIsSingle: computedIsSingle(props), + handleImgError: handleImgError({ state, t }), + computedIsLast: computedIsLast({ state, props }), + watchVisible: watchVisible(state), + deviceSupportUninstall: deviceSupportUninstall(state), + computedCurrentImg: computedCurrentImg({ state, props }), + computedImgStyle: computedImgStyle({ state, constants }), + computeZIndex: computeZIndex({ constants, props }), + hide: hide({ props, api }), + deviceSupportInstall: deviceSupportInstall({ state, api }), + toggleMode: toggleMode({ state, constants, api }), + swipeRight: swipeRight({ api, state, emit }), + swipeLeft: swipeLeft({ api, state, emit }), + handleDelete: handleDelete({ api, state, emit }) + }) +} + +const initWatch = ({ watch, state, api, props, nextTick, vm }) => { + watch( + () => state.index, + (value) => { + api.reset() + props.onSwitch(value) + }, + { immediate: true } + ) + + watch( + () => props.previewVisible, + (value) => { + api.watchVisible(value) + + if (props.previewVisible) { + nextTick(() => { + state.urlList = props.urlList + api.getImageWidth() + }) + } + }, + { immediate: true } + ) + + watch( + () => state.currentImg, + (value) => { + nextTick(() => { + const index = state.urlList.indexOf(value) + + let imageIns = vm.$refs[`img_${index}`] + if (Array.isArray(imageIns)) { + imageIns = imageIns[0] + } + + if (imageIns) { + state.loading = !imageIns.complete + } + }) + }, + { immediate: true } + ) +} + +export const renderless = (props, { computed, onMounted, onUpdated, reactive, watch }, { t, parent, nextTick, emit, constants, vm, mode }) => { + const api = {} + const state = initState({ reactive, computed, api, mode, props, constants }) + + initApi({ api, state, props, parent, nextTick, emit, t, constants }) + + initWatch({ watch, state, api, props, nextTick, vm }) + + onMounted(api.deviceSupportInstall) + + onUpdated(() => { + if (props.asyncClose) { + setTimeout(() => { + state.previewVisible = false + emit('update:preview-visible', false) + }, 3000) + } + }) + + return api +} diff --git a/packages/renderless/src/image/index.ts b/packages/renderless/src/image/index.ts new file mode 100644 index 000000000..3d82594f3 --- /dev/null +++ b/packages/renderless/src/image/index.ts @@ -0,0 +1,152 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { on, off, getScrollContainer, isInContainer } from '@opentiny/vue-renderless/common/deps/dom' +import { typeOf } from '@opentiny/vue-renderless/common/type' +import '@opentiny/vue-renderless/common/deps/requestAnimationFrame' +import { rafThrottle } from '@opentiny/vue-renderless/image-viewer' + +const isSupportObjectFit = () => document.documentElement.style.objectFit !== undefined + +const isHtmlElement = (node) => node && node.nodeType === Node.ELEMENT_NODE + +export const computedGetImageStyle = ({ props, api }) => () => { + const { fit } = props + + if (fit) { + return isSupportObjectFit() ? { 'object-fit': fit } : api.getImageStyle(fit) + } + + return {} +} + +export const computedGetAlignCenter = ({ props, constants }) => () => !isSupportObjectFit() && props.fit !== constants.FILL + +export const computedGetPreview = (props) => () => Array.isArray(props.previewSrcList) && props.previewSrcList.length > 0 + +export const loadImage = ({ state, api, attrs, props }) => () => { + state.loading = true + state.error = false + + const img = new Image() + + img.onload = (event) => api.handleLoad(event, img) + img.onerror = api.handleError + + Object.keys(attrs).forEach((key) => { + if (key !== 'onError' && key !== 'onLoad') { + const value = attrs[key] + img.setAttribute(key, value) + } + }) + + img.src = props.src +} + +export const handleLoad = ({ state, emit }) => (event, img) => { + state.imageWidth = img.width + state.imageHeight = img.height + state.loading = false + + emit('load', event) +} + +export const handleError = ({ state, emit }) => (event) => { + state.loading = false + state.error = true + + emit('error', event) +} + +export const handleLazyLoad = ({ state, api, vm, nextTick }) => () => { + if (isInContainer(vm.$el, state._scrollContainer)) { + nextTick(() => (state.show = true)) + api.removeLazyLoadListener() + } +} + +export const addLazyLoadListener = ({ props, state, api, vm }) => () => { + const { scrollContainer } = props + let _scrollContainer = null + + if (isHtmlElement(scrollContainer)) { + _scrollContainer = scrollContainer + } else if (typeOf(scrollContainer) === 'string') { + _scrollContainer = document.querySelector(scrollContainer) + } else { + _scrollContainer = getScrollContainer(vm.$el) + } + + if (_scrollContainer) { + state._scrollContainer = _scrollContainer + state._lazyLoadHandler = rafThrottle(api.handleLazyLoad) + on(_scrollContainer, 'scroll', state._lazyLoadHandler) + api.handleLazyLoad() + } +} + +export const removeLazyLoadListener = (state) => () => { + const { _scrollContainer, _lazyLoadHandler } = state + + if (!_scrollContainer || !_lazyLoadHandler) { + return + } + + off(_scrollContainer, 'scroll', _lazyLoadHandler) + state._scrollContainer = null + state._lazyLoadHandler = null +} + +/** + * simulate object-fit behavior to compatible with IE11 and other browsers which not support object-fit + */ +export const getImageStyle = ({ state, vm, constants }) => (fit) => { + const { imageWidth, imageHeight } = state + const { clientWidth: containerWidth, clientHeight: containerHeight } = vm.$el + + if (!imageWidth || !imageHeight || !containerWidth || !containerHeight) { + return {} + } + + const vertical = imageWidth / imageHeight < 1 + + if (fit === constants.SCALE_DOWN) { + const isSmaller = imageWidth < containerWidth && imageHeight < containerHeight + fit = isSmaller ? constants.NONE : constants.CONTAIN + } + + if (fit === constants.NONE) { + return { width: 'auto', height: 'auto' } + } + + if (fit === constants.CONTAIN) { + return vertical ? { width: 'auto' } : { height: 'auto' } + } + + if (fit === constants.COVER) { + return vertical ? { height: 'auto' } : { width: 'auto' } + } + + return {} +} + +export const clickHandler = (state) => () => (state.showViewer = true) + +export const closeViewer = (state) => () => (state.showViewer = false) + +export const mounted = ({ props, api }) => () => { + if (props.lazy) { + api.addLazyLoadListener() + } else { + api.loadImage() + } +} diff --git a/packages/renderless/src/image/vue.ts b/packages/renderless/src/image/vue.ts new file mode 100644 index 000000000..9aaf68e49 --- /dev/null +++ b/packages/renderless/src/image/vue.ts @@ -0,0 +1,90 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + computedGetImageStyle, + computedGetAlignCenter, + computedGetPreview, + loadImage, + handleLoad, + handleError, + handleLazyLoad, + addLazyLoadListener, + removeLazyLoadListener, + getImageStyle, + clickHandler, + closeViewer, + mounted +} from './index' + +export const api = ['state', 'src', 'zIndex', 'previewSrcList', 'loadImage', 'clickHandler', 'closeViewer', 'handleLoad', 'handleError'] + +const initState = ({ reactive, computed, api, props }) => { + const state = reactive({ + error: false, + loading: true, + imageWidth: 0, + imageHeight: 0, + show: !props.lazy, + showViewer: false, + getPreview: computed(() => api.computedGetPreview()), + getImageStyle: computed(() => api.computedGetImageStyle()), + getAlignCenter: computed(() => api.computedGetAlignCenter()) + }) + + return state +} + +const initApi = ({ api, state, emit, props, vm, constants, nextTick, attrs }) => { + Object.assign(api, { + state, + closeViewer: closeViewer(state), + clickHandler: clickHandler(state), + handleLoad: handleLoad({ state, emit }), + handleError: handleError({ state, emit }), + computedGetPreview: computedGetPreview(props), + removeLazyLoadListener: removeLazyLoadListener(state), + getImageStyle: getImageStyle({ state, vm, constants }), + computedGetAlignCenter: computedGetAlignCenter({ props, constants }), + mounted: mounted({ api, props }), + handleLazyLoad: handleLazyLoad({ api, state, vm, nextTick }), + loadImage: loadImage({ api, state, props, attrs }), + computedGetImageStyle: computedGetImageStyle({ api, props }), + addLazyLoadListener: addLazyLoadListener({ api, props, state, vm }) + }) +} + +const initWatch = ({ watch, state, api, props }) => { + watch( + () => props.src, + (value, oldValue) => value !== oldValue && state.show && api.loadImage() + ) + + watch( + () => state.show, + (value) => value && api.loadImage() + ) +} + +export const renderless = (props, { computed, onBeforeUnmount, onMounted, reactive, watch }, { vm, emit, constants, nextTick, attrs }) => { + const api = {} + const state = initState({ reactive, computed, api, props }) + + initApi({ api, state, emit, props, vm, constants, nextTick, attrs }) + + initWatch({ watch, state, api, props }) + + onMounted(api.mounted) + onBeforeUnmount(() => props.lazy && api.removeLazyLoadListener()) + + return api +} diff --git a/packages/renderless/src/index-bar-anchor/vue.ts b/packages/renderless/src/index-bar-anchor/vue.ts new file mode 100644 index 000000000..a106482ab --- /dev/null +++ b/packages/renderless/src/index-bar-anchor/vue.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import {} from './index' + +export const api = ['state'] + +export const renderless = (props, { computed, reactive, onMounted, onUpdated, watch }, { emit, parent, refs }) => { + const state = reactive({}) + + const api = { + state + } + + Object.assign(api, { + state + }) + + return api +} diff --git a/packages/renderless/src/index-bar/index.ts b/packages/renderless/src/index-bar/index.ts new file mode 100644 index 000000000..2c74b899f --- /dev/null +++ b/packages/renderless/src/index-bar/index.ts @@ -0,0 +1,87 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +export const switchIndex = (index, state, emit) => { + if (index === state.index) { + return + } + emit('select', index) + state.index = index + if (index < state.childrenAnchor.length) { + const item = state.childrenAnchor[index] + document.documentElement.scrollTop = item.offsetTop + } +} + +export const handleTouchDown = + ({ state }) => + () => { + state.isMouseDown = true + } + +export const handleTouchMove = + ({ emit, state }) => + (e) => { + console.log(e, state.isMouseDown) + if (state.isMouseDown && e.target.id) { + switchIndex(Number(e.target.id), state, emit) + } + } + +export const handleTouchUp = + ({ state }) => + () => { + state.isMouseDown = false + } + +export const handleIndexClick = + ({ emit, state }) => + (value) => { + switchIndex(value.index, state, emit) + } + +export const updateAnchorChildren = + ({ state, refs }) => + () => { + const node = refs.indexBarContent + if (node) { + state.childrenAnchor = [] + getAnchorChildren(node, state) + } + } + +export const getAnchorChildren = (node, state) => { + node.childNodes.forEach((ele) => { + if (ele.className === 'tiny-mobile-index-bar-anchor') { + state.childrenAnchor.push(ele) + } else { + getAnchorChildren(ele, state) + } + }) +} + +export const handleScroll = + ({ state }) => + () => { + findTopAnchor(state) + } + +export const findTopAnchor = (state) => { + const scrollTop = document.documentElement.scrollTop + for (let index = 0; index < state.childrenAnchor.length; index++) { + const item = state.childrenAnchor[index] + if (item.offsetTop + item.offsetHeight > scrollTop) { + state.index = index + break + } + } +} diff --git a/packages/renderless/src/index-bar/vue.ts b/packages/renderless/src/index-bar/vue.ts new file mode 100644 index 000000000..f557d2ae2 --- /dev/null +++ b/packages/renderless/src/index-bar/vue.ts @@ -0,0 +1,83 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { handleScroll, updateAnchorChildren, handleTouchDown, handleTouchMove, handleTouchUp, handleIndexClick } from './index' + +export const api = [ + 'state', + 'handleIndexClick', + 'handleScroll', + 'updateAnchorChildren', + 'handleTouchDown', + 'handleTouchMove', + 'handleTouchUp', + 'handleIndexClick' +] + +export const renderless = (props, { computed, reactive, onMounted, onUnmounted, onUpdated, watch }, { emit, parent, refs }) => { + const state = reactive({ + index: 0, + childrenAnchor: [], + isFistUpdate: true + }) + + const api = { + state, + isMouseDown: false, + handleScroll: handleScroll({ state }), + updateAnchorChildren: updateAnchorChildren({ emit, parent, refs, state }), + handleTouchDown: handleTouchDown({ state }), + handleTouchMove: handleTouchMove({ emit, state }), + handleTouchUp: handleTouchUp({ state }), + handleIndexClick: handleIndexClick({ emit, parent, refs, state }) + } + + Object.assign(api, { + state + }) + + onMounted((e) => { + window.addEventListener('scroll', api.handleScroll) + }) + + onUnmounted(() => { + window.removeEventListener('scroll', api.handleScroll) + }) + + watch( + () => state.index, + (value, oldValue) => { + const isChange = value !== oldValue && value >= 0 && value < parent.indexList.length + if (isChange) { + emit('change', value) + } + }, + { immediate: false } + ) + + watch( + () => props.indexList, + () => { + api.updateAnchorChildren({ refs, state }) + }, + { immediate: false, deep: true } + ) + + onUpdated(() => { + if (state.isFistUpdate) { + state.isFistUpdate = false + api.updateAnchorChildren({ refs, state }) + } + }) + + return api +} diff --git a/packages/renderless/src/input/index.ts b/packages/renderless/src/input/index.ts new file mode 100644 index 000000000..3c810fc1f --- /dev/null +++ b/packages/renderless/src/input/index.ts @@ -0,0 +1,317 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { isSame } from '@opentiny/vue-renderless/common/type' + +const HIDDEN_STYLE = ` +height:0 !important;visibility:hidden !important;overflow:hidden !important; +position:absolute !important;z-index:-1000 !important;top:0 !important;right:0 !important +` + +const CONTEXT_STYLE = [ + 'width', + 'line-height', + 'padding-top', + 'padding-bottom', + 'padding-left', + 'padding-right', + 'border-width', + 'box-sizing', + 'letter-spacing', + 'font-family', + 'font-weight', + 'font-size', + 'text-rendering', + 'text-transform', + 'text-indent' +] + +const STYLE = { + BoxSizing: 'box-sizing', + BorderBox: 'border-box', + ContentBox: 'content-box', + PaddingTop: 'padding-top', + PaddingBottom: 'padding-bottom', + BorderTopWidth: 'border-top-width', + BorderBottomWidth: 'border-bottom-width' +} + +const isServer = typeof window === 'undefined' +const isKorean = (text) => /([(\uAC00-\uD7AF)|(\u3130-\u318F)])+/gi.test(text) + +export const showBox = (state) => () => { + if (state.inputDisabled) { + return false + } + + state.boxVisibility = true +} + +export const calculateNodeStyling = () => (targetElement) => { + const style = window.getComputedStyle(targetElement) + const boxSizing = style.getPropertyValue(STYLE.BoxSizing) + + const paddingSize = parseFloat(style.getPropertyValue(STYLE.PaddingBottom)) + parseFloat(style.getPropertyValue(STYLE.PaddingTop)) + + const borderSize = parseFloat(style.getPropertyValue(STYLE.BorderBottomWidth)) + parseFloat(style.getPropertyValue(STYLE.BorderTopWidth)) + + const contextStyle = CONTEXT_STYLE.map((name) => `${name}:${style.getPropertyValue(name)}`).join(';') + + return { contextStyle, paddingSize, borderSize, boxSizing } +} + +export const calcTextareaHeight = ({ api, hiddenTextarea, props }) => (targetElement, minRows = 1, maxRows = null) => { + if (!hiddenTextarea) { + hiddenTextarea = document.createElement('textarea') + document.body.appendChild(hiddenTextarea) + } + + const { paddingSize, borderSize, boxSizing, contextStyle } = api.calculateNodeStyling(targetElement) + + hiddenTextarea.setAttribute('style', `${contextStyle};${HIDDEN_STYLE}`) + hiddenTextarea.value = targetElement.value || targetElement.placeholder || '' + + let height = hiddenTextarea.scrollHeight + const textareaStyle = {} + + if (boxSizing === STYLE.BorderBox) { + height = height + borderSize * 2 + paddingSize + } else if (boxSizing === STYLE.ContentBox) { + height = height - paddingSize + } + + hiddenTextarea.value = '' + + const singleRowHeight = hiddenTextarea.scrollHeight - paddingSize + + if (minRows !== null) { + let minHeight = singleRowHeight * minRows + + if (boxSizing === STYLE.BorderBox) { + minHeight = minHeight + paddingSize + borderSize + } + + if (props.size) { + minHeight = props.size == 'mini' ? minHeight * 0.67 : props.size == 'small' ? minHeight : minHeight * 1.17 + } + + if (props.height) { + minHeight = props.height + } + + height = Math.max(minHeight, height) + textareaStyle.minHeight = `${minHeight}px` + } + + if (maxRows !== null) { + let maxHeight = singleRowHeight * maxRows + + if (boxSizing === STYLE.BorderBox) { + maxHeight += borderSize + paddingSize + } + + height = Math.min(maxHeight, height) + } + + textareaStyle.height = `${height}px` + + hiddenTextarea.parentNode && hiddenTextarea.parentNode.removeChild(hiddenTextarea) + + hiddenTextarea = null + + return textareaStyle +} + +export const getInput = (refs) => () => refs.input || refs.textarea + +export const blur = (api) => () => api.getInput().blur() + +export const focus = (api) => () => api.getInput().focus() + +export const select = (api) => () => api.getInput().select() + +export const handleBlur = ({ api, componentName, eventName, emit, props, state }) => (event) => { + state.focused = false + + emit('blur', event) + + api.isMemoryStorage.value = false + + if (props.validateEvent) { + api.dispatch(componentName, eventName, [props.modelValue]) + } +} + +export const handleFocus = ({ api, emit, state }) => (event) => { + state.focused = true + + emit('focus', event) + + api.searchMemory(event.target.value) +} + +export const handleInput = ({ api, emit, nextTick, state }) => (event) => { + if (state.isComposing) { + return + } + + if (event.target.value === state.nativeInputValue) { + return + } + + emit('update:modelValue', event.target.value) + + emit('input', event) + + api.searchMemory(event.target.value) + + nextTick(api.setNativeInputValue) +} + +export const handleChange = (emit) => (event) => emit('change', event.target.value) + +export const resizeTextarea = ({ api, parent, refs, state }) => () => { + if (isServer) { + return + } + + const { autosize, type } = parent + + if (type !== 'textarea') { + return + } + + if (!autosize) { + state.textareaCalcStyle = { + minHeight: api.calcTextareaHeight(refs.textarea).minHeight + } + + return + } + + const minRows = autosize.minRows + const maxRows = autosize.maxRows + + state.textareaCalcStyle = api.calcTextareaHeight(refs.textarea, minRows, maxRows) +} + +export const setNativeInputValue = ({ api, state }) => () => { + const input = api.getInput() + + if (!input) { + return + } + + if (isSame(input.value, state.nativeInputValue)) { + return + } + + input.value = state.nativeInputValue +} + +export const handleCompositionStart = (state) => () => (state.isComposing = true) + +export const handleCompositionUpdate = (state) => (event) => { + const text = event.target.value + const lastCharacter = text[text.length - 1] || '' + + state.isComposing = !isKorean(lastCharacter) +} + +export const handleCompositionEnd = ({ api, state }) => (event) => { + if (state.isComposing) { + state.isComposing = false + api.handleInput(event) + } +} + +export const calcIconOffset = ({ CLASS_PREFIX, parent }) => (place) => { + const elList = [].slice.call(parent.$el.querySelectorAll(`.${CLASS_PREFIX.Input}${place}`) || []) + + if (!elList.length) { + return + } + + let el = null + + for (let i = 0, len = elList.length; i < len; i++) { + if (elList[i].parentNode === parent.$el) { + el = elList[i] + break + } + } + + if (!el) { + return + } + + const pendantMap = { suffix: 'append', prefix: 'prepend' } + const pendant = pendantMap[place] + + if (parent.$slots[pendant]) { + const dom = parent.$el.querySelector(`.${CLASS_PREFIX.InputGroup}${pendant}`) + let transform + + if (place === 'suffix') { + transform = `translateX(-${dom.offsetWidth}px)` + } else if (place === 'prefix') { + transform = `translate(${dom.offsetWidth}px, -50%)` + } + + el.style.transform = transform + } else { + el.removeAttribute('style') + } +} + +export const updateIconOffset = (api) => () => { + api.calcIconOffset('prefix') + api.calcIconOffset('suffix') +} + +export const clear = (emit) => () => { + emit('update:modelValue', '') + emit('change', '') + emit('clear') +} + +export const handlePasswordVisible = ({ api, nextTick, state }) => () => { + state.passwordVisible = !state.passwordVisible + nextTick(api.focus) +} + +export const getSuffixVisible = ({ parent, props, state }) => () => + parent.$slots.suffix || props.suffixIcon || state.showClear || props.showPassword || state.isWordLimitVisible || (state.validateState && state.needStatusIcon) + +export const textLength = (value) => { + if (typeof value === 'number') { + return String(value).length + } + + return (value || '').length +} + +export const watchFormSelect = ({ emit, props, state }) => (value) => { + if (props.isSelect) { + emit('update:modelValue', value) + emit('change', value) + + const filterData = props.selectMenu.length && props.selectMenu.filter((item) => item.id === value).shift() + + state.checkedLable = filterData ? filterData.label : '' + } +} + +export const hasSelection = (api) => () => { + const input = api.getInput() + return input && input.selectionStart !== input.selectionEnd +} diff --git a/packages/renderless/src/input/vue.ts b/packages/renderless/src/input/vue.ts new file mode 100644 index 000000000..1f9c2df0c --- /dev/null +++ b/packages/renderless/src/input/vue.ts @@ -0,0 +1,253 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + blur, + showBox, + watchFormSelect, + clear, + focus, + select, + getInput, + textLength, + handleBlur, + handleFocus, + handleInput, + handleChange, + calcIconOffset, + resizeTextarea, + getSuffixVisible, + updateIconOffset, + calcTextareaHeight, + setNativeInputValue, + calculateNodeStyling, + handleCompositionEnd, + handlePasswordVisible, + handleCompositionStart, + handleCompositionUpdate, + hasSelection +} from './index' +import useStorageBox from '@opentiny/vue-renderless/tall-storage/vue-storage-box' + +export const api = [ + 'blur', + 'showBox', + 'clear', + 'focus', + 'state', + 'select', + 'getInput', + 'handleBlur', + 'handleInput', + 'handleFocus', + 'handleChange', + 'calcIconOffset', + 'resizeTextarea', + 'getSuffixVisible', + 'updateIconOffset', + 'calcTextareaHeight', + 'setNativeInputValue', + 'calculateNodeStyling', + 'handleCompositionEnd', + 'handlePasswordVisible', + 'handleCompositionStart', + 'handleCompositionUpdate', + 'addMemory', + 'searchMemory', + 'selectedMemory', + 'storageData', + 'isMemoryStorage', + 'hasSelection' +] + +const initState = ({ reactive, computed, mode, props, parent, constants }) => { + const state = reactive({ + mode, + focused: false, + hovering: false, + isComposing: false, + passwordVisible: false, + boxVisibility: false, + textareaCalcStyle: {}, + checkedLable: '', + sheetvalue: props.modelValue, + inputSize: computed(() => props.size || state.formItemSize), + showClear: computed(() => props.clearable && !state.inputDisabled && !props.readonly && state.nativeInputValue && (state.focused || state.hovering)), + upperLimit: computed(() => parent.$attrs.maxlength), + textLength: computed(() => textLength(props.modelValue)), + inputExceed: computed(() => state.isWordLimitVisible && state.textLength > state.upperLimit), + formItemSize: computed(() => (parent.formItem || {}).formItemSize), + validateIcon: computed(() => constants.VALIDATE_ICON[state.validateState]), + showWordLimit: computed(() => props.showWordLimit && parent.$attrs.maxlength), + inputDisabled: computed(() => props.disabled || (parent.tinyForm || {}).disabled), + validateState: computed(() => (parent.formItem ? parent.formItem.validateState : '')), + textareaStyle: computed(() => ({ + ...state.textareaCalcStyle, + resize: props.resize + })), + needStatusIcon: computed(() => (parent.tinyForm ? parent.tinyForm.statusIcon : false)), + showPwdVisible: computed(() => props.showPassword && !state.inputDisabled && !props.readonly && (!!state.nativeInputValue || state.focused)), + nativeInputValue: computed(() => (props.modelValue === null || props.modelValue === undefined ? '' : String(props.modelValue))), + + isWordLimitVisible: computed( + () => + ((props.showWordLimit && parent.$attrs.maxlength) || props.counter) && + (parent.type === 'text' || parent.type === 'textarea') && + !state.inputDisabled && + !props.readonly && + !props.showPassword + ) + }) + + return state +} + +const initApi = ({ api, state, dispatch, broadcast, emit, refs, props, CLASS_PREFIX, parent }) => { + Object.assign(api, { + state, + dispatch, + broadcast, + showBox: showBox(state), + clear: clear(emit), + getInput: getInput(refs), + handleChange: handleChange(emit), + watchFormSelect: watchFormSelect({ emit, props, state }), + calcIconOffset: calcIconOffset({ CLASS_PREFIX, parent }), + getSuffixVisible: getSuffixVisible({ parent, props, state }), + calculateNodeStyling: calculateNodeStyling(), + handleCompositionStart: handleCompositionStart(state), + handleCompositionUpdate: handleCompositionUpdate(state) + }) +} + +const mergeApi = ({ storages, api, componentName, props, emit, eventName, nextTick, parent, state, refs }) => { + const { storageData, isMemoryStorage, addMemory, searchMemory, selectedMemory } = storages + + return Object.assign(api, { + addMemory, + storageData, + searchMemory, + selectedMemory, + isMemoryStorage, + blur: blur(api), + focus: focus(api), + select: select(api), + handleBlur: handleBlur({ + api, + componentName, + emit, + eventName: eventName.blur, + props, + state + }), + handleFocus: handleFocus({ api, emit, state }), + handleInput: handleInput({ api, emit, nextTick, state }), + resizeTextarea: resizeTextarea({ api, parent, refs, state }), + updateIconOffset: updateIconOffset(api), + calcTextareaHeight: calcTextareaHeight({ + api, + hiddenTextarea: null, + props + }), + setNativeInputValue: setNativeInputValue({ api, state }), + handleCompositionEnd: handleCompositionEnd({ api, state }), + handlePasswordVisible: handlePasswordVisible({ api, nextTick, state }), + hasSelection: hasSelection(api) + }) +} + +const initWatch = ({ watch, state, api, props, nextTick, emit, componentName, eventName }) => { + watch( + () => props.modelValue, + (value) => { + if (state.mode === 'mobile') { + state.sheetvalue = value + emit('update:modelValue', value) + } + + nextTick(api.resizeTextarea) + + if (props.validateEvent) { + api.dispatch(componentName, eventName.change, [value]) + } + } + ) + + watch( + () => props.size, + () => nextTick(api.resizeTextarea), + { immediate: true } + ) + + watch( + () => state.nativeInputValue, + () => { + api.setNativeInputValue() + } + ) + + watch( + () => props.type, + () => { + nextTick(() => { + api.setNativeInputValue() + api.resizeTextarea() + api.updateIconOffset() + }) + } + ) + + watch( + () => state.sheetvalue, + (value) => api.watchFormSelect(value), + { immediate: true } + ) +} + +export const renderless = ( + props, + { computed, onMounted, onUpdated, reactive, toRefs, watch, inject }, + { vm, refs, parent, emit, constants, nextTick, broadcast, dispatch, mode } +) => { + const api = {} + const componentName = constants.COMPONENT_NAME.FormItem + const eventName = { change: 'form.change', blur: 'form.blur' } + const CLASS_PREFIX = { + Input: constants.inputMode(mode), + InputGroup: constants.inputGroupMode(mode) + } + const state = initState({ reactive, computed, mode, props, parent, constants }) + + initApi({ api, state, dispatch, broadcast, emit, refs, props, CLASS_PREFIX, parent }) + + const storages = useStorageBox({ api, props, reactive, toRefs }) + + parent.tinyForm = parent.tinyForm || inject('form', null) + + mergeApi({ api, storages, componentName, emit, eventName, props, state, nextTick, parent, refs }) + + initWatch({ watch, state, api, props, nextTick, emit, componentName, eventName }) + + onMounted(() => { + api.setNativeInputValue() + api.resizeTextarea() + api.updateIconOffset() + dispatch('Select', 'input-mounted', vm.$el) + dispatch('Tooltip', 'tooltip-update', vm.$el) + }) + + onUpdated(() => { + nextTick(api.updateIconOffset) + }) + + return api +} diff --git a/packages/renderless/src/ip-address/index.ts b/packages/renderless/src/ip-address/index.ts new file mode 100644 index 000000000..84232419d --- /dev/null +++ b/packages/renderless/src/ip-address/index.ts @@ -0,0 +1,268 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { KEY_CODE, IPTHRESHOLD } from '@opentiny/vue-renderless/common' + +export const isIP6 = (str) => /^IPv6$/i.test(str) + +export const isIP4 = (str) => /^IPv4$/i.test(str) + +export const ipValidator = ({ props, api }) => (value) => { + let result = true + + if (props.type) { + /* istanbul ignore else */ + if (api.isIP6(props.type)) { + result = typeof value === 'string' + } else if (api.isIP4(props.type)) { + result = /^((2(5[0-5]|[0-4]\d))|[0-1]?\d{1,2})(\.((2(5[0-5]|[0-4]\d))|[0-1]?\d{1,2})){3}$/.test(value) + } + } + + return result +} + +export const getCursorPosition = (el) => { + let cursorPos = 0 + let selectRange = null + /* istanbul ignore if */ + if (document.selection) { + selectRange = document.selection.createRange() + selectRange.moveStart('character', -el.value.length) + cursorPos = selectRange.text.length + } + /* istanbul ignore if */ + if (el.selectionStart || el.selectionStart === '0') { + cursorPos = el.selectionStart + } + + return cursorPos +} + +export const getValue = ({ api, props, state }) => () => { + const valueArr = [] + let result = '' + + if (api.isIP6(props.type)) { + result = state.address[0].value || '' + } else { + state.address.forEach((item) => { + if (api.isIP4(props.type) && item.value) { + item.value = item.value.replace(/\D/g, '') + } + + item.value && valueArr.push(item.value) + }) + + result = state.address.filter((item) => item.value).length === 4 ? valueArr.join('.') : '' + } + + return result +} + +export const setValue = ({ api, props, state }) => (value) => { + if (value) { + /* istanbul ignore else */ + if (api.ipValidator(value)) { + if (api.isIP6(props.type)) { + state.address = [{ value }] + } else { + state.address = value.split('.').map((item) => ({ value: item })) + } + } + } else { + state.address = api.isIP6(props.type) ? [{ value: '' }] : [{ value: '' }, { value: '' }, { value: '' }, { value: '' }] + } +} + +const activeEvent = ({ emit, parent, state, index, event, type }) => { + const target = event && event.target ? event.target : parent.$el.querySelectorAll('input')[index || 0] + + type === 'focus' && (state.active = true) + + if (!event) { + if (target && !state.isSelected) { + state.isSelected = true + target[type]() + + setTimeout(() => { + state.isSelected = false + }, 10) + + emit(type, target.value, index) + } + } else { + !state.isSelected && emit(type, target.value, index) + } +} + +export const focus = ({ emit, parent, state }) => ({ index, event }) => { + activeEvent({ emit, parent, state, index, event, type: 'focus' }) +} + +export const select = ({ emit, parent, state }) => ({ index, event }) => { + activeEvent({ emit, parent, state, index, event, type: 'select' }) +} + +export const inputEvent = ({ api, componentName, emit, eventName, props }) => ({ item, index }) => { + const val = item.value.trim() + let value = '' + + if (api.isIP4(props.type)) { + if (!index && api.ipValidator(val)) { + api.setValue(val) + } else if (isNaN(val) || val < IPTHRESHOLD.Min || val > IPTHRESHOLD.Max) { + item.value = '' + } + } else { + item.value = val.replace(/[\u4E00-\u9FA5]/g, '') + } + + value = api.getValue() + + emit('update:modelValue', value, index) + api.dispatch(componentName, eventName, [value]) +} + +export const change = ({ api, emit }) => () => { + const value = api.getValue() + emit('change', value) +} + +export const blur = ({ api, componentName, emit, eventName, props, state }) => ({ item, index }) => { + state.active = false + state.isDel = false + + if (api.isIP4(props.type)) { + item.value = item.value.replace(/\D/g, '') + } + + emit('blur', item.value, index) + api.dispatch(componentName, eventName, [item.value]) +} + +export const keyup = ({ api, props }) => ({ item, index, event }) => { + const { keyCode } = event + const value = item.value.trim() + const nextIndex = index + 1 + + if (api.isIP4(props.type)) { + if (isNaN(item.value)) { + item.value = item.value.replace(/\D/g, '') + return false + } + + if ([KEY_CODE.Tab, KEY_CODE.Space, KEY_CODE.NumpadDecimal, KEY_CODE.NumpadComma].includes(keyCode) && value) { + api.select({ index: nextIndex }) + return false + } + + /* istanbul ignore next */ + if ((value === '0' || value > IPTHRESHOLD.NonNumeric || value.length === 3) && !isNaN(event.key)) { + api.focus({ index: nextIndex }) + api.select({ index: nextIndex }) + + return false + } + } +} + +const checkError1 = ({ Space, NumpadDecimal, NumpadComma, keyCode, value }) => [Space, NumpadDecimal, NumpadComma].includes(keyCode) && value + +// NEXT 屏蔽选中时,替换值大于255 +const checkError2 = (newValue) => newValue && (isNaN(newValue) || newValue > IPTHRESHOLD.Max) + +// NEXT 当内容为"0"时,屏蔽输入 +const checkError3 = ({ isfilterKeyCodes, isSelected, value }) => !isfilterKeyCodes && !isSelected && value === '0' + +// NEXT 当内容加输入的数字大于255时,屏蔽输入 +const checkError4 = ({ isfilterKeyCodes, isSelected, value, key }) => !isfilterKeyCodes && !isSelected && value + key > IPTHRESHOLD.Max + +// NEXT 屏蔽非数字键 +const checkError5 = ({ key, isfilterKeyCodes, value, ctrlKey, keyCode, KeyV }) => isNaN(key) && !isfilterKeyCodes && !(!value && ctrlKey && keyCode === KeyV) + +const isError = ({ key, value, isSelected, isfilterKeyCodes, ctrlKey, keyCode, newValue }) => { + const { Space, NumpadDecimal, NumpadComma, KeyV } = KEY_CODE + + return ( + checkError1({ Space, NumpadDecimal, NumpadComma, keyCode, value }) || + checkError2(newValue) || + checkError3({ isfilterKeyCodes, isSelected, value }) || + checkError4({ isfilterKeyCodes, isSelected, value, key }) || + checkError5({ key, isfilterKeyCodes, value, ctrlKey, keyCode, KeyV }) + ) +} + +export const keydown = ({ api, props, state }) => ({ item, index, event }) => { + const { target, key, keyCode, ctrlKey } = event + const value = item.value + const selectionStart = target.selectionStart + const selectionEnd = target.selectionEnd + const isSelected = selectionStart !== selectionEnd + const cursorPosition = api.getCursorPosition(target) + const isfilterKeyCodes = state.filterKeyCodes.includes(keyCode) + const nextIndex = index + 1 + const lastIndex = index - 1 + const newValue = isSelected && !isfilterKeyCodes && value.substr(0, selectionStart) + key + value.substr(selectionEnd) + + if (api.isIP4(props.type)) { + state.isDel = keyCode === KEY_CODE.Backspace || keyCode === KEY_CODE.Delete + + if (keyCode === KEY_CODE.Backspace && cursorPosition === 0 && !selectionEnd) { + api.focus({ index: lastIndex }) + + return false + } + + if (keyCode === KEY_CODE.ArrowLeft && cursorPosition === 0) { + api.focus({ index: lastIndex }) + event.preventDefault() + + return false + } + + // NEXT 光标在最后位置时,按右方向键跳到下一个输入框 + if (keyCode === KEY_CODE.ArrowRight && cursorPosition === value.length) { + api.focus({ index: nextIndex }) + event.preventDefault() + + return false + } + + if ( + isError({ + key, + value, + isSelected, + isfilterKeyCodes, + ctrlKey, + keyCode, + newValue + }) + ) { + event.preventDefault() + return false + } + } +} + +export const getHeightOfSize = (size, isLineHeight = 'height') => { + const sizeMap = { + medium: '42px', + small: '36px', + mini: '24px' + } + + const sizePX = sizeMap[size] + + return sizePX ? isLineHeight + ':' + sizePX + ';' : '' +} diff --git a/packages/renderless/src/ip-address/vue.ts b/packages/renderless/src/ip-address/vue.ts new file mode 100644 index 000000000..235bdcb02 --- /dev/null +++ b/packages/renderless/src/ip-address/vue.ts @@ -0,0 +1,143 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { + isIP6, + isIP4, + ipValidator, + getCursorPosition, + getValue, + setValue, + focus, + select, + inputEvent, + change, + blur, + keyup, + keydown, + getHeightOfSize +} from './index' +import { KEY_CODE } from '@opentiny/vue-renderless/common' + +export const api = ['state', 'focus', 'inputEvent', 'blur', 'keyup', 'keydown', 'change', 'select'] + +const initState = ({ reactive, computed, handleValue, parent, props }) => { + const state = reactive({ + ...handleValue.state, + active: false, + isSelected: false, + + filterKeyCodes: [KEY_CODE.AtMark, KEY_CODE.Backspace, KEY_CODE.ArrowLeft, KEY_CODE.ArrowRight, KEY_CODE.Tab, KEY_CODE.Delete], + + formDisabled: computed(() => (parent.tinyForm || {}).disabled), + disabled: computed(() => props.disabled || state.formDisabled), + heightStyle: computed(() => getHeightOfSize(props.size)), + lineHeightStyle: computed(() => getHeightOfSize(props.size, 'line-height')), + allHeightStyle: computed(() => `${state.heightStyle}${state.lineHeightStyle}`) + }) + + return state +} + +const initApi = ({ state, api, dispatch, handleValue, emit, broadcast, parent, componentName, props, eventName }) => { + Object.assign(api, { + ...handleValue.api, + state, + dispatch, + broadcast, + getCursorPosition, + focus: focus({ emit, props, parent, state }), + select: select({ emit, props, parent, state }), + blur: blur({ + api, + componentName, + emit, + eventName: eventName.blur, + props, + state + }), + keyup: keyup({ api, props, parent }), + change: change({ api, emit }), + keydown: keydown({ api, props, state }), + inputEvent: inputEvent({ api, emit, props, componentName, eventName: eventName.change }) + }) +} + +export const useHandleValue = ({ componentName, dispatch, eventName, props, reactive, toRefs, watch }) => { + const state = reactive({ + address: [], + isDel: false + }) + + const api = { + isIP6, + isIP4 + } + + api.getValue = getValue({ api, props, state }) + api.setValue = setValue({ api, props, state }) + api.ipValidator = ipValidator({ api, props }) + + watch( + () => props.modelValue, + (value) => { + if (!state.isDel) { + api.setValue(value) + dispatch(componentName, eventName, [value]) + } + }, + { immediate: true } + ) + + return { + state: toRefs(state), + api + } +} + +export const renderless = (props, { reactive, toRefs, watch, inject, computed }, { $prefix, emit, parent, broadcast, dispatch }) => { + const api = {} + const componentName = 'FormItem' + const eventName = { + change: 'form.change', + blur: 'form.blur' + } + + parent.tinyForm = parent.tinyForm || inject('form', null) + + const handleValue = useHandleValue({ + componentName, + dispatch, + eventName: eventName.change, + props, + reactive, + toRefs, + watch + }) + + const state = initState({ reactive, computed, handleValue, parent, props }) + + initApi({ + api, + state, + handleValue, + dispatch, + broadcast, + emit, + props, + parent, + componentName, + eventName + }) + + return api +} diff --git a/packages/renderless/src/layout/vue.ts b/packages/renderless/src/layout/vue.ts new file mode 100644 index 000000000..eac72c1e4 --- /dev/null +++ b/packages/renderless/src/layout/vue.ts @@ -0,0 +1,17 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +// layout renderless + +export const api = [] + +export const renderless = () => ({}) diff --git a/packages/renderless/src/link-menu/index.ts b/packages/renderless/src/link-menu/index.ts new file mode 100644 index 000000000..f30913462 --- /dev/null +++ b/packages/renderless/src/link-menu/index.ts @@ -0,0 +1,125 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { mapTree } from '@opentiny/vue-renderless/grid/static' +import { copyArray } from '@opentiny/vue-renderless/common/object' + +export const dialogTitle = ({ constants, props, t }) => () => props.title || t(constants.DIALOG_TITLE) + +export const showDialog = (state) => () => (state.boxVisibility = true) + +export const hideDialog = ({ api, state, vm, props }) => () => { + if (!props.keepSelectedNodes) { + state.currentCheckNode.forEach((item) => { + const isNode = state.listItem.filter((data) => data.id === item.id) + + if (isNode.length) { + vm.$refs.tree.setChecked(item, true, true) + + if (item.disabled !== undefined) { + item.disabled = false + } + } else { + vm.$refs.tree.setChecked(item, false, true) + } + }) + + state.getNodeValue = copyArray(state.listItem) + + if (state.getNodeValue.length === props.maxItem) { + api.disabledTreeNode(state.getNodeValue, true) + } else if (state.getNodeValue.length < props.maxItem) { + api.disabledTreeNode(state.getNodeValue, false) + } + + state.currentCheckNode = [] + } + + state.boxVisibility = false +} + +export const sureNodevalue = (state) => () => { + state.listItem = state.getNodeValue.slice() + state.currentCheckNode = [] + state.boxVisibility = false +} + +export const filterNode = () => (value, data) => data.label.includes(value) + +export const getValue = ({ api, props, state }) => (value) => { + if (!props.keepSelectedNodes) { + state.currentCheckNode.push(value) + } + + let index = -1 + + state.getNodeValue.forEach((data, indexx) => { + if (data.id === value.id) { + index = indexx + } + }) + + index !== -1 ? state.getNodeValue.splice(index, 1) : state.getNodeValue.push(value) + + if (state.getNodeValue.length === props.maxItem) { + api.disabledTreeNode(state.getNodeValue, true) + } else if (state.getNodeValue.length < props.maxItem) { + api.disabledTreeNode(state.getNodeValue, false) + } +} + +export const disabledTreeNode = (state) => (arr, isDisabled) => { + state.datas.forEach((item) => { + if (!item.children) { + const index = arr.filter((data) => data.id === item.id) + + if (!index.length) { + item.disabled = isDisabled + } + } else { + item.children.forEach((item) => { + const index = arr.filter((data) => data.id === item.id) + + if (!index.length) { + item.disabled = isDisabled + } + }) + } + }) +} + +export const initData = ({ state, props, service, api }) => () => { + let data = props.data + + if (!data && typeof service.getMenuDataSync === 'function') { + const menuData = service.getMenuDataSync() + data = api.setMenuKey({ newData: [], menuData }) + } + + state.datas = mapTree(data || [], (item) => ({ ...item, disabled: false })) +} + +export const disabledParentNode = (state) => () => { + state.datas.forEach((item) => { + if (item.children) { + item.disabled = true + } + }) +} + +export const initService = ({ props, service }) => { + const $service = service || { base: {} } + + return { + getMenuDataSync: props.getMenuDataSync || $service.base.getMenuDataSync + } +} diff --git a/packages/renderless/src/link-menu/vue.ts b/packages/renderless/src/link-menu/vue.ts new file mode 100644 index 000000000..68cc7a7cc --- /dev/null +++ b/packages/renderless/src/link-menu/vue.ts @@ -0,0 +1,96 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { initData, dialogTitle, disabledParentNode, filterNode, getValue, hideDialog, showDialog, sureNodevalue, disabledTreeNode, initService } from './index' +import { copyArray } from '@opentiny/vue-renderless/common/object' +import { setMenuKey } from '@opentiny/vue-renderless/tree-menu' + +export const api = ['state', 'initData', 'filterNode', 'getValue', 'hideDialog', 'setMenuKey', 'showDialog', 'sureNodevalue'] + +const initState = ({ reactive, computed, api }) => { + const state = reactive({ + filterText: '', + datas: [], + disabled: false, + alertShow: false, + boxVisibility: false, + listItem: [], + getNodeValue: [], + currentCheckNode: [], + titles: computed(() => api.dialogTitle()) + }) + + return state +} + +const initWatch = ({ watch, state, props, nextTick, vm }) => { + watch( + () => state.filterText, + (value) => nextTick(() => vm.$refs.tree.filter(value)) + ) + + watch( + () => props.data, + (value) => { + if (value) { + const changeData = copyArray(value) + + changeData.forEach((item) => { + if (!item.children) { + item.disabled = false + } else { + item.children.forEach((item) => { + item.disabled = false + }) + } + }) + + state.datas = changeData + } + }, + { immediate: true } + ) +} + +const initApi = ({ api, state, constants, props, t, service, vm }) => { + Object.assign(api, { + state, + filterNode: filterNode(), + showDialog: showDialog(state), + sureNodevalue: sureNodevalue(state), + disabledTreeNode: disabledTreeNode(state), + disabledParentNode: disabledParentNode(state), + dialogTitle: dialogTitle({ constants, props, t }), + setMenuKey: setMenuKey(api), + getValue: getValue({ api, state, props }), + initData: initData({ state, props, service, api }), + hideDialog: hideDialog({ api, state, vm, props }) + }) +} + +export const renderless = (props, { computed, onMounted, reactive, watch }, { t, vm, service, constants, nextTick }) => { + service = initService({ props, service }) + + const api = {} + const state = initState({ reactive, computed, api }) + + initWatch({ watch, state, props, nextTick, vm }) + + onMounted(() => { + api.initData() + api.disabledParentNode(state) + }) + + initApi({ api, state, constants, props, t, service, vm }) + + return api +} diff --git a/packages/renderless/src/link/index.ts b/packages/renderless/src/link/index.ts new file mode 100644 index 000000000..f48e72490 --- /dev/null +++ b/packages/renderless/src/link/index.ts @@ -0,0 +1,17 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const handleClick = ({ emit, props, state }) => (event) => { + if (!state.disabled && !props.href) { + emit('click', event) + } +} diff --git a/packages/renderless/src/link/vue.ts b/packages/renderless/src/link/vue.ts new file mode 100644 index 000000000..a82d839e0 --- /dev/null +++ b/packages/renderless/src/link/vue.ts @@ -0,0 +1,29 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { handleClick } from './index' + +export const api = ['state', 'handleClick'] + +export const renderless = (props, { inject, reactive, computed }, { emit, parent }) => { + parent.tinyForm = parent.tinyForm || inject('form', null) + + const state = reactive({ + formDisabled: computed(() => (parent.tinyForm || {}).disabled), + disabled: computed(() => props.disabled || state.formDisabled) + }) + + return { + state, + handleClick: handleClick({ emit, props, state }) + } +} diff --git a/packages/renderless/src/list/index.ts b/packages/renderless/src/list/index.ts new file mode 100644 index 000000000..6acb9d093 --- /dev/null +++ b/packages/renderless/src/list/index.ts @@ -0,0 +1,22 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const clickList = ({ emit, props }) => () => { + const list = { + id: props.id, + content: props.content, + subtext: props.subText, + contentdes: props.contentDes + } + + emit('click', list) +} diff --git a/packages/renderless/src/list/vue.ts b/packages/renderless/src/list/vue.ts new file mode 100644 index 000000000..56eec8176 --- /dev/null +++ b/packages/renderless/src/list/vue.ts @@ -0,0 +1,28 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { clickList } from './index' + +export const api = ['state', 'clickList'] + +export const renderless = (props, { reactive }, { emit }) => { + const state = reactive({ + test: '1' + }) + + const api = { + state, + clickList: clickList({ emit, props }) + } + + return api +} diff --git a/packages/renderless/src/loading/index.ts b/packages/renderless/src/loading/index.ts new file mode 100644 index 000000000..4663d3d3d --- /dev/null +++ b/packages/renderless/src/loading/index.ts @@ -0,0 +1,43 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import afterLeave from '@opentiny/vue-renderless/common/deps/after-leave' +import { removeClass } from '@opentiny/vue-renderless/common/deps/dom' + +export const handleAfterLeave = (emit) => () => { + emit('after-leave') +} + +export const setText = (state) => (text) => { + state.text = text +} + +export const close = ({ state, constants, vm }) => () => { + afterLeave( + vm, + () => { + const target = state.fullscreen || state.body ? document.body : state.target + + removeClass(target, constants.PARENT_RELATIVE_CLS) + removeClass(target, constants.PARENT_HIDDEN_CLS) + + if (vm.$el && vm.$el.parentNode) { + vm.$el.parentNode.removeChild(vm.$el) + } + + state.closed = true + }, + 300 + ) + + state.visible = false +} diff --git a/packages/renderless/src/loading/vue.ts b/packages/renderless/src/loading/vue.ts new file mode 100644 index 000000000..bcf54fb27 --- /dev/null +++ b/packages/renderless/src/loading/vue.ts @@ -0,0 +1,36 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { handleAfterLeave, setText, close } from './index' + +export const api = ['state', 'handleAfterLeave', 'setText', 'close'] + +export const renderless = (props, { reactive }, { constants, vm, emit }) => { + const state = reactive({ + text: null, + spinner: null, + visible: false, + customClass: '', + background: null, + fullscreen: true, + closed: false + }) + + const api = { + state, + setText: setText(state), + handleAfterLeave: handleAfterLeave(emit), + close: close({ state, constants, vm }) + } + + return api +} diff --git a/packages/renderless/src/locales/index.ts b/packages/renderless/src/locales/index.ts new file mode 100644 index 000000000..a53aae454 --- /dev/null +++ b/packages/renderless/src/locales/index.ts @@ -0,0 +1,106 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { xss } from '@opentiny/vue-renderless/common' + +export const getLocales = ({ api, service, state }) => () => { + Promise.all([service.getLocale(), service.getCurrentLocale()]).then(([locales, current]) => { + state.locales = locales || ['zhCN'] + state.current = (Array.isArray(current) ? current[0] : current) || 'zhCN' + api.setText(current) + }) +} + +export const setText = (state) => () => { + const { current, locales } = state + const len = locales.length + + state.text = len === 2 ? (locales.indexOf(current) === 0 ? locales[1] : locales[0]) : current +} + +export const switchLanguage = ({ api, state, service }) => (lang) => { + const { locales, current } = state + const domain = service.getDomain() + const hasMultiLocale = state.locales.length === 2 + + state.current = hasMultiLocale ? (state.current = locales.indexOf(current) === 0 ? locales[1] : locales[0]) : lang + + const expires = new Date(new Date().getTime() + 3600000).toGMTString() + const currLang = state.current.substring(0, 2) === 'zh' ? 'zh' : 'en' + + document.cookie = `lang=${currLang};expires=${expires};domain=${domain};path=/` + + api.setText() +} + +export const changeLocale = ({ props, service, vnode }) => (value, oldValue) => { + if (!value || !oldValue) { + return + } + + const { local, changeLang } = props + if (typeof changeLang === 'function') { + changeLang(value) + return + } + + if (local) { + value.slice(0, 2) === 'zh' ? vnode.use(vnode.zhCN) : vnode.use(vnode.enUS) + return + } + + const { content = '' } = service.customized + service.getCustomized().then((data) => { + data = data || [] + const setting = data.filter((item) => item.settingKey === vnode.constants.GLOBAL)[0] || {} + + service.getChangeLocaleUrl(value).then((url) => { + try { + const settingContent = JSON.parse(setting[content]) + settingContent.lang = value + settingContent.common.lang = value + + setting[content] = JSON.stringify(settingContent) + + service.pushCustomized(setting).then(() => { + window.location.href = xss.filterUrl(url) + }) + } catch (error) { + window.location.href = xss.filterUrl(url) + } + }) + }) +} + +export const initService = ({ props, service }) => { + const { common = {}, utils = {}, setting = {}, fetchSsoUpdate, pushCustomized } = service || {} + const { options = {} } = setting + + const noopFnCreator = (propName) => () => { + if (propName) { + return Promise.reject(new Error(`[TINY Error][Locale] Prop ${propName} is not configured`)) + } else { + return Promise.resolve(null) + } + } + + return { + getLocale: props.getLocale || common.getLocale || noopFnCreator('getLocale'), + getCurrentLocale: props.getCurrentLocale || common.getCurrentLocale || noopFnCreator('getCurrentLocale'), + getChangeLocaleUrl: props.getChangeLocaleUrl || common.getChangeLocaleUrl || noopFnCreator('getChangeLocaleUrl'), + fetchSsoUpdate: props.fetchSsoUpdate || fetchSsoUpdate || noopFnCreator('fetchSsoUpdate'), + getDomain: props.getDomain || utils.getDomain || noopFnCreator('getDomain'), + getCustomized: common.getCustomized || noopFnCreator(), + pushCustomized: pushCustomized || noopFnCreator(), + customized: options.Customized || {} + } +} diff --git a/packages/renderless/src/locales/vue.ts b/packages/renderless/src/locales/vue.ts new file mode 100644 index 000000000..249719b48 --- /dev/null +++ b/packages/renderless/src/locales/vue.ts @@ -0,0 +1,42 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getLocales, setText, switchLanguage, initService, changeLocale } from './index' + +export const api = ['state', 'switchLanguage', 't', 'changeLocale'] + +export const renderless = (props, { reactive, watch }, { t, service }, vnode) => { + const api = {} + const $service = initService({ props, service }) + + const state = reactive({ + current: '', + locales: [], + visible: false, + text: '' + }) + + Object.assign(api, { + t, + state, + setText: setText(state), + changeLocale: changeLocale({ props, service: $service, vnode }), + switchLanguage: switchLanguage({ api, service: $service, state }), + getLocales: getLocales({ api, service: $service, state }) + }) + + api.getLocales() + + watch(() => state.current, api.changeLocale, { immediate: true }) + + return api +} diff --git a/packages/renderless/src/logon-user/index.ts b/packages/renderless/src/logon-user/index.ts new file mode 100644 index 000000000..e7849272c --- /dev/null +++ b/packages/renderless/src/logon-user/index.ts @@ -0,0 +1,29 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const init = ({ service, state }) => () => { + const { getUserInfo } = service + + getUserInfo().then((user) => { + state.userName = user.userCN + }) +} + +export const initService = ({ props, service }) => { + const { base = {} } = service || {} + + const getUserInfoNoop = () => Promise.reject(new Error('[TINY Error][LogonUser] Prop getUserInfo is not configured')) + + return { + getUserInfo: props.getUserInfo || base.getUserInfo || getUserInfoNoop + } +} diff --git a/packages/renderless/src/logon-user/vue.ts b/packages/renderless/src/logon-user/vue.ts new file mode 100644 index 000000000..39815dccd --- /dev/null +++ b/packages/renderless/src/logon-user/vue.ts @@ -0,0 +1,32 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { init, initService } from './index' + +export const api = ['state'] + +export const renderless = (props, { reactive }, { service }) => { + const $service = initService({ props, service }) + + const state = reactive({ + userName: '' + }) + + const api = { + state, + init: init({ service: $service, state }) + } + + api.init() + + return api +} diff --git a/packages/renderless/src/logout/index.ts b/packages/renderless/src/logout/index.ts new file mode 100644 index 000000000..e29dc2408 --- /dev/null +++ b/packages/renderless/src/logout/index.ts @@ -0,0 +1,108 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { xss } from '@opentiny/vue-renderless/common' + +export const logout = ({ service, state, props }) => () => { + let { isMock, isLocal, redirectUrl = '', getLogoutUrl, showLogin } = service + + if (typeof props.beforeLogout === 'function') { + if (props.beforeLogout(redirectUrl) === false) { + return + } + } + + if (state.logout) { + showLogin() + return + } + + const location = window.location + + if (redirectUrl) { + const isFullPath = redirectUrl.includes('//') + + if (!isFullPath) { + redirectUrl.indexOf('#/') === 0 || (redirectUrl = '#/' + redirectUrl) + + redirectUrl = location.protocol + '//' + location.host + location.pathname + redirectUrl + } + } else { + redirectUrl = location.href + } + + redirectUrl = xss.filterUrl(redirectUrl) + + if (!isMock || !isLocal) { + getLogoutUrl(redirectUrl).then((url) => { + let temp = decodeURIComponent(url) + + if (/%[a-fA-F0-9]{2}/.test(temp)) { + temp = decodeURIComponent(temp) + } + + location.href = xss.filterUrl(temp) + }) + } else { + location.href = xss.filterUrl(redirectUrl) + } + + state.logout = true +} + +export const initService = ({ props, service }) => { + const noopFnCreator = (propName) => () => { + if (propName) { + return Promise.reject(new Error(`[TINY Error][Logout] Prop ${propName} is not configured`)) + } else { + return Promise.reject(new Error('[TINY Error][Logout] This component depends on @opentiny/vue-service')) + } + } + + const { base = {}, common = {}, setting = {}, network = {}, ajax = {}, message = {} } = service || {} + const { options = {}, services = {}, redirectUrl = '', local = false } = setting + const { isMock = () => false } = network + const { getUserInfoSync = noopFnCreator() } = base + const { config = noopFnCreator() } = ajax + const { subscribe = noopFnCreator(), publish = noopFnCreator() } = message + + return { + getLogoutUrl: props.getLogoutUrl || common.getLogoutUrl || noopFnCreator('getLogoutUrl'), + redirectUrl: props.redirectUrl || redirectUrl, + isLocal: props.isLocal || local, + network: props.network || network, + isMock: props.isMock || isMock(), + isGuestUser: props.isGuestUser || (() => getUserInfoSync().userAccount === props.guestRole), + + showLogin: + props.showLogin || + (() => { + window.document.domain = options.Domain + const gateway = config() + + subscribe({ + topic: 'tiny.ui.closeLoginDialog', + callback() { + // 登陆后刷新页面 + window.location.reload() + } + }) + + publish({ + topic: 'tiny.ui.displayLoginDialog', + data: { + url: gateway.getRequestUrl(services.Framework.RebuildSession) + } + }) + }) + } +} diff --git a/packages/renderless/src/logout/vue.ts b/packages/renderless/src/logout/vue.ts new file mode 100644 index 000000000..e2172b58d --- /dev/null +++ b/packages/renderless/src/logout/vue.ts @@ -0,0 +1,30 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { logout, initService } from './index' + +export const api = ['state', 'logout'] + +export const renderless = (props, { reactive }, { service }) => { + const $service = initService({ props, service }) + + const state = reactive({ + logout: $service.isGuestUser() + }) + + const api = { + state, + logout: logout({ service: $service, state, props }) + } + + return api +} diff --git a/packages/renderless/src/milestone/index.ts b/packages/renderless/src/milestone/index.ts new file mode 100644 index 000000000..b45d73bc8 --- /dev/null +++ b/packages/renderless/src/milestone/index.ts @@ -0,0 +1,89 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +const hexToRgb = (hex) => { + hex = hex.slice(1) + + if (hex.length == 3) { + hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2] + } + + return { + r: parseInt(hex.slice(0, 2), 16), + g: parseInt(hex.slice(2, 4), 16), + b: parseInt(hex.slice(4, 6), 16) + } +} + +export const handleClick = ({ emit }) => ({ index, node }) => { + emit('click', index, node) +} + +/* istanbul ignore next */ +export const flagOprate = ({ constants, refs, state }) => ({ event, over, text }) => { + const tooltip = refs.tooltip + + if (over) { + const textEl = event.target.querySelector(constants.FLAG_CONTENT_CLS) + + state.tipContent = text + tooltip.state.referenceElm = event.target + tooltip.doDestroy() + tooltip.setExpectedState(true) + textEl && textEl.scrollWidth > textEl.clientWidth && tooltip.handleShowPopper() + } else { + tooltip.setExpectedState(false) + tooltip.handleClosePopper() + } +} + +export const getMileIcon = ({ constants, props }) => (node) => { + const status = props.milestonesStatus[node[props.statusField]] || constants.DEFAULT_COLOR + + const isCompleted = node[props.statusField] === props.completedField + const switchColor = isCompleted && !props.solid + const { r, g, b } = hexToRgb(status) + + return { + background: switchColor ? constants.DEFAULT_BACK_COLOR : status, + color: switchColor ? status : constants.DEFAULT_BACK_COLOR, + boxShadow: `rgba(${r},${g},${b},.4) ${constants.BOX_SHADOW_PX}` + } +} + +export const getMileContent = (props) => ({ data, index }) => { + const content = data[props.flagBefore ? index : index + 1][props.flagField] + return Array.isArray(content) ? content : [] +} + +export const getLineColor = (props) => (status) => { + let background = '' + + if (status) { + if (/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/.test(props.lineStyle)) { + background = props.lineStyle + } + + if (props.lineStyle === 2) { + background = props.milestonesStatus[status] + } else if (props.lineStyle === 1) { + background = status === props.completedField ? props.milestonesStatus[status] : '' + } + } + + return { background } +} + +export const handleFlagClick = (emit) => ({ idx, flag }) => { + emit('flagclick', idx, flag) // deprecated 原事件flagclick v3.5.0废弃,v3.17.0移除;移除原因:命名规范 + emit('flag-click', idx, flag) +} diff --git a/packages/renderless/src/milestone/vue.ts b/packages/renderless/src/milestone/vue.ts new file mode 100644 index 000000000..86f6d2c82 --- /dev/null +++ b/packages/renderless/src/milestone/vue.ts @@ -0,0 +1,44 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { handleClick, flagOprate, getMileIcon, getMileContent, getLineColor, handleFlagClick } from './index' + +export const api = [ + 'state', + 'showTip', + 'handleClick', + 'handleFlagClick', + 'flagOprate', + 'getMileIcon', + 'getMileContent', + 'getMileFlagStyle', + 'getLineColor', + 'getStatus' +] + +export const renderless = (props, { reactive }, { emit, refs, constants }) => { + const state = reactive({ + tipContent: '' + }) + + const api = { + state, + getLineColor: getLineColor(props), + getMileContent: getMileContent(props), + handleFlagClick: handleFlagClick(emit), + handleClick: handleClick({ emit, state }), + getMileIcon: getMileIcon({ constants, props }), + flagOprate: flagOprate({ constants, refs, state }) + } + + return api +} diff --git a/packages/renderless/src/mini-picker/index.ts b/packages/renderless/src/mini-picker/index.ts new file mode 100644 index 000000000..17248b5f5 --- /dev/null +++ b/packages/renderless/src/mini-picker/index.ts @@ -0,0 +1,189 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const visibleHandle = (emit) => () => emit('update:visible', false) + +export const watchVisible = (emit) => ({ state, value }) => { + setTimeout(() => { + value ? (state.toggle = true) : (state.toggle = false) + }, 0) + + emit('update:visible', value) +} + +export const getDataType = (state) => () => { + const { columns } = state + const firstColumn = columns[0] || {} + + if (firstColumn.children) { + return 'cascade' + } + + if (firstColumn.values) { + return 'object' + } + + return 'text' +} + +export const format = ({ state, api }) => () => { + const { columns, dataType } = state + + if (dataType === 'text') { + state.formattedColumns = [{ values: columns }] + } else if (dataType === 'cascade') { + api.formatCascade() + } else { + state.formattedColumns = columns + } +} + +export const formatCascade = ({ state, props }) => () => { + const formatted = [] + let cursor = { children: state.columns } + + while (cursor && cursor.children) { + const defaultIndex = cursor.defaultIndex || Number(state.defaultIndex) + + formatted.push({ + values: cursor.children.map((item) => item[props.valueKey]), + defaultIndex + }) + + cursor = cursor.children[defaultIndex] + } + + state.formattedColumns = formatted +} + +export const change = (api) => (index) => { + api.onChange(index) +} + +export const setColumnValue = (api) => (index, value) => { + const column = api.getColumn(index) + column && column.setValue(value) +} + +export const setValues = (api) => (values) => { + values.forEach((value, index) => { + api.setColumnValue(index, value) + }) +} + +export const getColumnValue = (api) => (index) => { + const column = api.getColumn(index) + return column && column.getValue() +} + +export const confirm = ({ api, refs }) => () => { + const children = refs.childrenPicker + + children && children.forEach((child) => child.onTransitionEnd()) + api.emitEvent('confirm') + api.visibleHandle() +} + +export const cancel = ({ api, emit }) => () => { + emit('cancel') + api.visibleHandle() +} + +export const emitEvent = ({ api, state, emit }) => (event) => { + if (state.dataType === 'text') { + emit(event, api.getColumnValue(0), api.getColumnIndex(0)) + } else { + emit(event, api.getValues(), api.getIndexes()) + } +} + +export const getColumn = (refs) => (index) => { + const children = refs.childrenPicker + return children[index] +} + +export const getColumnIndex = (api) => (columnIndex) => (api.getColumn(columnIndex) || {}).state.currentIndex + +export const getValues = (refs) => () => refs.childrenPicker && refs.childrenPicker.map((child) => child.getValue()) + +export const getIndexes = (refs) => () => refs.childrenPicker && refs.childrenPicker.map((child) => child.state.currentIndex) + +export const setIndexes = (api) => (indexes) => { + indexes.forEach((optionIndex, columnIndex) => { + api.setColumnIndex(columnIndex, optionIndex) + }) +} + +export const setColumnIndex = (api) => (columnIndex, optionIndex) => { + const column = api.getColumn(columnIndex) + column && column.setIndex(optionIndex) +} + +export const getColumnValues = (refs) => (index) => (refs.childrenPicker[index] || {}).state.columnsItem.values + +export const setColumnValues = (refs) => (index, options) => { + const children = refs.childrenPicker + const column = children[index] + + if (column) { + column.setOptions(options) + } +} + +export const onCascadeChange = ({ api, state, props }) => (columnIndex) => { + const { columns } = state + let cursor = { children: columns } + const indexes = api.getIndexes() + + for (let i = 0; i <= columnIndex; i++) { + cursor = cursor.children[indexes[i]] + } + + while (columnIndex < state.formattedColumns.length) { + if (cursor.children && cursor.children.length !== 0) { + columnIndex++ + + api.setColumnValues( + columnIndex, + cursor.children.map((item) => item[props.valueKey]) + ) + + cursor = cursor.children[cursor.defaultIndex || 0] + } else { + columnIndex++ + api.setColumnValues(columnIndex, []) + } + } +} + +export const onChange = ({ api, state, emit }) => (columnIndex) => { + if (state.dataType === 'cascade') { + api.onCascadeChange(columnIndex) + } + + if (api.dataType === 'text') { + emit('change', api.getColumnValue(0), api.getColumnIndex(0)) + } else { + emit('change', api.getValues(), columnIndex) + } +} + +export const getChildrenComponent = ({ state, vm, constants }) => { + const childrenName = constants.CHILDREN_PICKER + const children = [] + + for (let index = 0; index < state.formattedColumns.length; index++) { + children.push(Array.isArray(vm.$refs[childrenName + index]) ? vm.$refs[childrenName + index][0] : vm.$refs[childrenName + index]) + } + + return children +} diff --git a/packages/renderless/src/mini-picker/vue.ts b/packages/renderless/src/mini-picker/vue.ts new file mode 100644 index 000000000..b300b67ac --- /dev/null +++ b/packages/renderless/src/mini-picker/vue.ts @@ -0,0 +1,141 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + visibleHandle, + watchVisible, + formatCascade, + format, + getDataType, + change, + setColumnValue, + setValues, + getColumnValue, + confirm, + cancel, + getColumnIndex, + getValues, + getIndexes, + setIndexes, + setColumnIndex, + getColumnValues, + setColumnValues, + onChange, + onCascadeChange, + emitEvent, + getColumn, + getChildrenComponent +} from './index' + +export const api = [ + 'state', + 'visibleHandle', + 'watchVisible', + 'change', + 'setValues', + 'getColumnValue', + 'confirm', + 'cancel', + 'getColumnIndex', + 'getValues', + 'getIndexes', + 'setIndexes', + 'setColumnIndex', + 'getColumnValues', + 'setColumnValues', + 'onChange', + 'onCascadeChange', + 'emitEvent', + 'getColumn', + 'setColumnValue' +] + +const initState = ({ reactive, computed, props, api }) => { + const state = reactive({ + columns: props.columns, + toggle: false, + itemHeight: Number(props.itemHeight), + defaultIndex: props.defaultIndex, + visibleItemCount: props.visibleItemCount, + clumnsWrapHeight: null, + formattedColumns: [], + dataType: computed(() => api.getDataType()) + }) + + return state +} + +const initApi = ({ api, props, state, emit, refs }) => { + Object.assign(api, { + state, + getColumn: getColumn(refs), + getValues: getValues(refs), + getIndexes: getIndexes(refs), + getDataType: getDataType(state), + visibleHandle: visibleHandle(emit), + formatCascade: formatCascade({ state, props }), + getColumnValues: getColumnValues(refs), + setColumnValues: setColumnValues(refs), + emitEvent: emitEvent({ api, state, emit }), + change: change(api), + onChange: onChange({ api, state, emit }), + cancel: cancel({ api, emit }), + confirm: confirm({ api, refs }), + format: format({ state, api }), + setValues: setValues(api), + setIndexes: setIndexes(api), + watchVisible: watchVisible(emit), + setColumnIndex: setColumnIndex(api), + getColumnValue: getColumnValue(api), + getColumnIndex: getColumnIndex(api), + setColumnValue: setColumnValue(api), + onCascadeChange: onCascadeChange({ api, state, props }) + }) +} + +const initWatch = ({ watch, props, state, api }) => { + watch( + () => props.visible, + (value) => { + api.watchVisible({ state, value }) + } + ) + + watch( + () => props.columns, + (value) => { + state.columns = value + api.format() + } + ) +} + +export const renderless = (props, { computed, onMounted, reactive, watch }, { emit, nextTick, vm, constants }) => { + const api = {} + const refs = { childrenPicker: null } + const state = initState({ reactive, computed, props, api }) + + initApi({ api, props, state, emit, refs }) + + initWatch({ watch, props, state, api }) + + onMounted(() => { + nextTick(() => { + refs.childrenPicker = getChildrenComponent({ state, vm, constants }) + }) + + api.format() + state.clumnsWrapHeight = state.itemHeight * state.visibleItemCount + }) + + return api +} diff --git a/packages/renderless/src/modal/index.ts b/packages/renderless/src/modal/index.ts new file mode 100644 index 000000000..ba8d2311e --- /dev/null +++ b/packages/renderless/src/modal/index.ts @@ -0,0 +1,614 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { KEY_CODE } from '@opentiny/vue-renderless/common' +import { on, off, addClass, hasClass, removeClass } from '@opentiny/vue-renderless/common/deps/dom' +import PopupManager from '@opentiny/vue-renderless/common/deps/popup-manager' +import { getDomNode } from '@opentiny/vue-renderless/common/deps/dom' + +const DragClass = 'is__drag' + +const emitZoom = ({ params, parent, emit, event }) => { + let { $listeners, events = {} } = parent + if ($listeners.zoom) { + emit('zoom', params, event) + } else if (events.zoom) { + events.zoom.call(parent, params, event) + } +} + +export const MsgQueue = [] + +export const computedIsMsg = () => (props) => props.type === 'message' + +export const watchValue = (api) => (visible) => (visible ? api.open() : api.close('hide')) + +export const created = ({ api, props, state }) => () => { + if (props.modelValue) { + api.open() + } + + state.modalZindex = props.zIndex || PopupManager.nextZIndex() +} + +export const mounted = ({ api, parent, props }) => () => { + let modalBoxElem = api.getBox() + + Object.assign(modalBoxElem.style, { + width: props.width ? (isNaN(props.width) ? props.width : `${props.width}px`) : null, + + height: props.height ? (isNaN(props.height) ? props.height : `${props.height}px`) : null + }) + + if (props.escClosable) { + on(document, 'keydown', api.handleGlobalKeydownEvent) + } + + document.body.appendChild(parent.$el) +} + +export const beforeUnmouted = ({ api, parent }) => () => { + off(document, 'keydown', api.handleGlobalKeydownEvent) + api.removeMsgQueue() + + if (parent.$el.parentNode) { + parent.$el.parentNode.removeChild(parent.$el) + } +} + +export const selfClickEvent = ({ api, parent, props }) => (event) => { + if (props.maskClosable && event.target === parent.$el) { + api.close('mask') + } +} + +export const updateZindex = ({ state, props }) => () => { + state.modalZindex = props.zIndex || PopupManager.nextZIndex() +} + +export const handleEvent = ({ api, emit, parent, props }) => (type, event) => { + // close,confirm,cancel + if (~['close', 'confirm', 'cancel'].indexOf(type) && typeof props.beforeClose === 'function' && props.beforeClose(type) === false) { + return + } + + const { events = {} } = parent + + const params = { + type, + $modal: parent + } + + emit(type, params, event) + events[type] && events[type].call(parent, params) + api.close(type) +} + +export const closeEvent = (api) => (event) => { + api.handleEvent('close', event) +} + +export const confirmEvent = (api) => (event) => { + api.handleEvent('confirm', event) +} + +export const cancelEvent = (api) => (event) => { + api.handleEvent('cancel', event) +} + +export const open = ({ api, emit, nextTick, parent, props, state }) => () => { + let { $listeners, events = {} } = parent + + if (!state.visible) { + let params = { type: 'show', $modal: parent } + + state.visible = true + state.contentVisible = false + api.updateZindex() + + if (!events.show) { + emit('update:modelValue', true) + emit('show', params) + } + + setTimeout(() => { + state.contentVisible = true + + if (!$listeners.show && events.show) { + nextTick(() => { + events.show.call(parent, params) + }) + } + }, 10) + + if (state.isMsg) { + api.addMsgQueue() + + setTimeout(() => { + api.close(params.type) + }, parseFloat(props.duration)) + } else { + nextTick(() => { + let modalBoxElem = api.getBox() + + let clientVisibleWidth = document.documentElement.clientWidth || document.body.clientWidth + + let clientVisibleHeight = document.documentElement.clientHeight || document.body.clientHeight + + modalBoxElem.style.left = `${clientVisibleWidth / 2 - modalBoxElem.offsetWidth / 2}px` + + if (modalBoxElem.offsetHeight + modalBoxElem.offsetTop + props.marginSize > clientVisibleHeight) { + modalBoxElem.style.top = `${props.marginSize}px` + } + + if (props.fullscreen) { + nextTick(api.maximize) + } + }) + } + } +} + +export const addMsgQueue = ({ api, parent }) => () => { + if (!~MsgQueue.indexOf(parent)) { + MsgQueue.push(parent) + } + + api.updateStyle() +} + +export const removeMsgQueue = ({ api, parent }) => () => { + const index = MsgQueue.indexOf(parent) + + if (~index) { + MsgQueue.splice(index, 1) + } + + api.updateStyle() +} + +export const updateStyle = (nextTick) => () => { + nextTick(() => { + let offsetTop = 0 + + MsgQueue.forEach((comp) => { + offsetTop += parseFloat(comp.top) + comp.state.modalTop = offsetTop + + const modalBox = comp.$el.querySelector('.tiny-modal__box') + + offsetTop += modalBox.clientHeight + }) + }) +} + +export const close = ({ emit, parent, props, state }) => (type) => { + // esc,hide,mask,show,... + if (!~['close', 'confirm', 'cancel'].indexOf(type) && typeof props.beforeClose === 'function' && props.beforeClose(type) === false) { + return + } + + let { events = {} } = parent + + state.emitter.emit('boxclose', props.isFormReset) + + if (state.visible) { + state.contentVisible = false + + setTimeout(() => { + state.visible = false + + let params = { type, $modal: parent } + + if (events.hide) { + events.hide.call(parent, params) + } else { + emit('update:modelValue', false) + emit('hide', params) + } + }, 200) + } +} + +export const handleGlobalKeydownEvent = (api) => (event) => { + if (event.keyCode === KEY_CODE.Escape) { + api.close('esc') + } +} + +export const getBox = (refs) => () => refs.modalBox + +export const maximize = ({ api, nextTick, props, state }) => () => + nextTick().then(() => { + if (!state.zoomLocat) { + let marginSize = props.marginSize + let modalBoxElement = api.getBox() + let { visibleHeight, visibleWidth } = getDomNode() + + state.zoomLocat = { + top: modalBoxElement.offsetTop, + left: modalBoxElement.offsetLeft, + width: modalBoxElement.clientWidth, + height: modalBoxElement.clientHeight + } + + Object.assign(modalBoxElement.style, { + width: `${visibleWidth - marginSize * 2}px`, + height: `${visibleHeight - marginSize * 2}px`, + top: `${marginSize}px`, + left: `${marginSize}px` + }) + + state.emitter.emit('boxdrag') + } + }) + +export const revert = ({ api, nextTick, state }) => () => + nextTick().then(() => { + let zoomLocat = state.zoomLocat + + if (zoomLocat) { + let modalBoxElement = api.getBox() + + state.zoomLocat = null + + Object.assign(modalBoxElement.style, { + width: `${zoomLocat.width}px`, + height: `${zoomLocat.height}px`, + top: `${zoomLocat.top}px`, + left: `${zoomLocat.left}px` + }) + + state.emitter.emit('boxdrag') + } + }) + +export const toggleZoomEvent = ({ api, emit, parent, state }) => (event) => { + let params = { type: state.zoomLocat ? 'min' : 'max', $modal: parent } + const callback = state.zoomLocat ? api.revert : api.maximize + + return callback().then(() => { + emitZoom({ params, parent, emit, event }) + }) +} + +function getEventTargetNode(event, container, queryCls) { + let targetElem + let target = event.target + + while (target && target.nodeType && target !== document) { + if (queryCls && hasClass(target, queryCls)) { + targetElem = target + } else if (target === container) { + return { + flag: queryCls ? !!targetElem : true, + container, + targetElem + } + } + + target = target.parentNode + } + + return { flag: false } +} + +export const mousedownEvent = ({ api, nextTick, props, state, emit }) => (event) => { + let modalBoxElement = api.getBox() + if (!state.zoomLocat && event.button === 0 && !getEventTargetNode(event, modalBoxElement, 'trigger__btn').flag) { + event.preventDefault() + let demMousemove = document.onmousemove + let demMouseup = document.onmouseup + let disX = event.clientX - modalBoxElement.offsetLeft + let disY = event.clientY - modalBoxElement.offsetTop + let { visibleHeight, visibleWidth } = getDomNode() + document.onmousemove = (event) => { + event.preventDefault() + state.emitter.emit('boxdrag') + let offsetWidth = modalBoxElement.offsetWidth + let offsetHeight = modalBoxElement.offsetHeight + let minX = props.marginSize + let maxX = visibleWidth - offsetWidth - props.marginSize + let minY = props.marginSize + let maxY = visibleHeight - offsetHeight - props.marginSize + let left = event.clientX - disX + let top = event.clientY - disY + if (left < minX) { + left = minX + } + if (left > maxX) { + left = maxX + } + if (top < minY) { + top = minY + } + if (top > maxY) { + top = maxY + } + modalBoxElement.style.left = `${left}px` + modalBoxElement.style.top = `${top}px` + addClass(modalBoxElement, DragClass) + emit('custom-mousemove', event) + } + + document.onmouseup = (event) => { + document.onmousemove = demMousemove + document.onmouseup = demMouseup + nextTick(() => { + removeClass(modalBoxElement, DragClass) + }) + emit('custom-mouseup', event) + } + emit('custom-mousedown', event) + } +} + +const computeLeft = ({ width, offsetWidth, x, minWidth, temp, offsetLeft, marginSize, left }) => { + width = offsetWidth - x + width = width < minWidth ? minWidth : width + temp = offsetLeft + offsetWidth - marginSize + width = width > temp ? temp : width + left = offsetLeft + offsetWidth - width + + return { width, left } +} + +const computeTop = ({ height, offsetHeight, y, minHeight, temp, offsetTop, marginSize, top }) => { + height = offsetHeight - y + height = height < minHeight ? minHeight : height + temp = offsetTop + offsetHeight - marginSize + height = height > temp ? temp : height + top = offsetTop + offsetHeight - height + + return { height, top } +} + +const computeRight = ({ width, offsetWidth, x, minWidth, temp, visibleWidth, offsetLeft, marginSize }) => { + width = offsetWidth + x + width = width < minWidth ? minWidth : width + temp = visibleWidth - offsetLeft - marginSize + width = width > temp ? temp : width + + return { width } +} + +const computeBottom = ({ height, offsetHeight, y, minHeight, temp, visibleHeight, offsetTop, marginSize }) => { + height = offsetHeight + y + height = height < minHeight ? minHeight : height + temp = visibleHeight - offsetTop - marginSize + height = height > temp ? temp : height + + return { height } +} + +const updateModalBox = ({ ret: { width, left, height, top }, modalBoxElem: modalBoxElement }) => { + if (width) { + modalBoxElement.style.width = `${width}px` + } + + if (left) { + modalBoxElement.style.left = `${left}px` + } + + if (height) { + modalBoxElement.style.height = `${height}px` + } + + if (top) { + modalBoxElement.style.top = `${top}px` + } +} + +const updateWl = ({ width, offsetWidth, x, minWidth, temp, offsetLeft, marginSize, left, modalBoxElem }) => { + updateModalBox({ + ret: computeLeft({ + width, + offsetWidth, + x, + minWidth, + temp, + offsetLeft, + marginSize, + left + }), + modalBoxElem + }) +} + +const updateWr = ({ width, offsetWidth, x, minWidth, temp, visibleWidth, offsetLeft, marginSize, modalBoxElem }) => { + updateModalBox({ + ret: computeRight({ + width, + offsetWidth, + x, + minWidth, + temp, + visibleWidth, + offsetLeft, + marginSize + }), + modalBoxElem + }) +} + +const updateSt = ({ height, offsetHeight, y, minHeight, temp, offsetTop, marginSize, top, modalBoxElem }) => { + updateModalBox({ + ret: computeTop({ + height, + offsetHeight, + y, + minHeight, + temp, + offsetTop, + marginSize, + top + }), + modalBoxElem + }) +} + +const updateSb = ({ height, offsetHeight, y, minHeight, temp, visibleHeight, offsetTop, marginSize, modalBoxElem }) => { + updateModalBox({ + ret: computeBottom({ + height, + offsetHeight, + y, + minHeight, + temp, + visibleHeight, + offsetTop, + marginSize + }), + modalBoxElem + }) +} + +const setModalBoxStyle = ({ params, delta: { x, y } }) => { + const { visibleHeight, visibleWidth, modalBoxElem, type, props } = params + const { offsetWidth, offsetHeight, offsetLeft, offsetTop } = modalBoxElem + const { minWidth, minHeight, marginSize } = props + const [width, left, temp, height, top] = [0, 0, 0, 0, 0] + + switch (type) { + case 'wl': + updateWl({ offsetWidth, width, minWidth, x, offsetLeft, temp, marginSize, left, modalBoxElem }) + break + case 'wr': + updateWr({ width, offsetWidth, x, minWidth, temp, visibleWidth, offsetLeft, marginSize, modalBoxElem }) + break + case 'st': + updateSt({ height, offsetHeight, y, minHeight, temp, offsetTop, marginSize, top, modalBoxElem }) + break + case 'sb': + updateSb({ height, offsetHeight, y, minHeight, temp, visibleHeight, offsetTop, marginSize, modalBoxElem }) + break + case 'swst': + updateWl({ width, offsetWidth, x, minWidth, temp, offsetLeft, marginSize, left, modalBoxElem }) + updateSt({ height, offsetHeight, y, minHeight, temp, offsetTop, marginSize, top, modalBoxElem }) + break + case 'sest': + updateWr({ offsetWidth, width, x, temp, minWidth, marginSize, visibleWidth, offsetLeft, modalBoxElem }) + updateSt({ height, offsetHeight, y, minHeight, temp, offsetTop, marginSize, top, modalBoxElem }) + break + case 'swlb': + updateWl({ width, offsetWidth, minWidth, x, temp, marginSize, offsetLeft, modalBoxElem, left }) + updateSb({ height, offsetHeight, y, minHeight, temp, visibleHeight, offsetTop, marginSize, modalBoxElem }) + break + case 'selb': + updateWr({ width, offsetWidth, minWidth, x, visibleWidth, offsetLeft, marginSize, temp, modalBoxElem }) + updateSb({ height, offsetHeight, y, minHeight, temp, visibleHeight, offsetTop, marginSize, modalBoxElem }) + break + default: + break + } +} +const updateDelta = ({ event, delta, state }) => { + if (state.prevEvent) { + delta.x += event.screenX - state.prevEvent.screenX + delta.y += event.screenY - state.prevEvent.screenY + } + state.prevEvent = event +} + +function _findFormComponent(vm, formList) { + const children = vm.$children + + if (children && children.length === 0) { + return + } + + children.forEach((child) => { + const tag = child.$options.componentName + + if (/^Form$/.test(tag)) { + formList.push(child) + } + + _findFormComponent(child, formList) + }) +} + +function findFormComponent(vm) { + const formList = [] + _findFormComponent(vm, formList) + return formList +} + +export const updateFormTip = (parent) => { + const formList = findFormComponent(parent) + + if (formList.length > 0) { + formList.forEach((form) => { + form.updateTip() + }) + } +} + +export const dragEvent = ({ api, emit, parent, props, state }) => (event) => { + event.preventDefault() + + const delta = { x: 0, y: 0 } + const { visibleHeight, visibleWidth } = getDomNode() + const modalBoxElem = api.getBox() + const demMousemove = document.onmousemove + const demMouseup = document.onmouseup + + const params = { + props, + offsetTop: modalBoxElem.offsetTop, + offsetLeft: modalBoxElem.offsetLeft, + visibleWidth, + modalBoxElem, + visibleHeight, + disX: event.clientX, + disY: event.clientY, + type: event.target.dataset.type + } + + document.onmousemove = (event) => { + updateFormTip(parent) + updateDelta({ event, delta, state }) + setModalBoxStyle({ params, delta }) + + delta.x = delta.y = 0 + + addClass(modalBoxElem, DragClass) + + emitZoom({ + params: { type: 'resize', $modal: parent }, + parent, + emit, + event + }) + } + + document.onmouseup = () => { + state.zoomLocat = null + document.onmousemove = demMousemove + document.onmouseup = demMouseup + + setTimeout(() => { + removeClass(modalBoxElem, DragClass) + state.prevEvent = null + }, 50) + } +} + +export const resetFormTip = (parent, isFormReset = true) => { + const formList = findFormComponent(parent) + + if (formList.length > 0) { + formList.forEach((form) => { + isFormReset ? form.resetFields() : form.clearValidate() + }) + } +} diff --git a/packages/renderless/src/modal/vue.ts b/packages/renderless/src/modal/vue.ts new file mode 100644 index 000000000..7b3aaf540 --- /dev/null +++ b/packages/renderless/src/modal/vue.ts @@ -0,0 +1,108 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + dragEvent, + handleEvent, + mousedownEvent, + toggleZoomEvent, + revert, + maximize, + getBox, + handleGlobalKeydownEvent, + close, + updateStyle, + addMsgQueue, + removeMsgQueue, + computedIsMsg, + watchValue, + created, + mounted, + beforeUnmouted, + selfClickEvent, + updateZindex, + closeEvent, + confirmEvent, + cancelEvent, + open +} from './index' + +export const api = [ + 'state', + 'dragEvent', + 'mousedownEvent', + 'toggleZoomEvent', + 'revert', + 'maximize', + 'getBox', + 'close', + 'updateStyle', + 'selfClickEvent', + 'updateZindex', + 'closeEvent', + 'confirmEvent', + 'cancelEvent', + 'open', + 'beforeUnmouted' +] + +export const renderless = (props, { computed, onMounted, onBeforeUnmount, reactive, watch }, { refs, emit, emitter, nextTick, broadcast, vm: parent }) => { + const api = {} + const state = reactive({ + emitter: emitter(), + visible: false, + contentVisible: false, + cumsumZindex: 0, + modalTop: 0, + modalZindex: 0, + zoomLocat: null, + isMsg: computed(() => api.computedIsMsg(props)), + prevEvent: null + }) + + Object.assign(api, { + state, + broadcast, + computedIsMsg: computedIsMsg(), + updateStyle: updateStyle(nextTick), + getBox: getBox(refs), + watchValue: watchValue(api), + created: created({ api, props, state }), + mounted: mounted({ api, parent, props }), + beforeUnmouted: beforeUnmouted({ api, parent }), + selfClickEvent: selfClickEvent({ api, parent, props }), + updateZindex: updateZindex({ state, props }), + handleEvent: handleEvent({ api, emit, parent, props }), + closeEvent: closeEvent(api), + confirmEvent: confirmEvent(api), + cancelEvent: cancelEvent(api), + open: open({ api, emit, nextTick, parent, props, state }), + addMsgQueue: addMsgQueue({ api, parent }), + removeMsgQueue: removeMsgQueue({ api, parent }), + close: close({ emit, parent, props, state }), + handleGlobalKeydownEvent: handleGlobalKeydownEvent(api), + maximize: maximize({ api, nextTick, props, state }), + revert: revert({ api, nextTick, state }), + toggleZoomEvent: toggleZoomEvent({ api, emit, parent, state }), + mousedownEvent: mousedownEvent({ api, nextTick, props, state, emit }), + dragEvent: dragEvent({ api, emit, parent, props, state }) + }) + + watch(() => props.modelValue, api.watchValue) + + api.created() + + onMounted(api.mounted) + onBeforeUnmount(api.beforeUnmouted) + + return api +} diff --git a/packages/renderless/src/month-range/index.ts b/packages/renderless/src/month-range/index.ts new file mode 100644 index 000000000..7825ea9c8 --- /dev/null +++ b/packages/renderless/src/month-range/index.ts @@ -0,0 +1,168 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { isDate, modifyWithTimeString, prevYear, nextYear, nextMonth } from '@opentiny/vue-renderless/common/deps/date-util' + +export const calcDefaultValue = (defaultValue) => { + if (Array.isArray(defaultValue)) { + return [new Date(defaultValue[0]), new Date(defaultValue[1])] + } else if (defaultValue) { + return [new Date(defaultValue), nextMonth(new Date(defaultValue))] + } + + return [new Date(), nextMonth(new Date())] +} + +export const watchValue = ({ state }) => (value) => { + if (!value) { + state.maxDate = null + state.minDate = null + } else if (Array.isArray(value)) { + if (isDate(value[0])) { + state.minDate = new Date(value[0]) + } else { + state.minDate = null + } + + if (isDate(value[1])) { + state.maxDate = new Date(value[1]) + } else { + state.maxDate = null + } + + if (state.minDate) { + state.leftDate = state.minDate + + if (state.maxDate && state.unlinkPanels) { + const maxDateYear = state.maxDate.getFullYear() + const minDateYear = state.minDate.getFullYear() + + state.rightDate = maxDateYear === minDateYear ? nextYear(state.maxDate) : state.maxDate + } else { + state.rightDate = nextYear(state.leftDate) + } + } else { + state.leftDate = calcDefaultValue(state.defaultValue)[0] + state.rightDate = nextYear(state.leftDate) + } + } +} + +export const watchDefaultValue = ({ state }) => (value) => { + if (!Array.isArray(state.value)) { + const [left, right] = calcDefaultValue(value) + + state.leftDate = left + + state.rightDate = value && value[1] && left.getFullYear() !== right.getFullYear() && state.unlinkPanels ? right : nextYear(state.leftDate) + } +} + +export const handleClear = ({ emit, state }) => () => { + state.minDate = null + state.maxDate = null + state.leftDate = calcDefaultValue(state.defaultValue)[0] + state.rightDate = nextYear(state.leftDate) + + emit('pick', null) +} + +export const handleChangeRange = (state) => (val) => { + state.minDate = val.minDate + state.maxDate = val.maxDate + state.rangeState = val.rangeState +} + +export const handleRangePick = ({ api, state, t }) => (val, close = true) => { + const defaultTime = state.defaultTime || [] + const maxDate = modifyWithTimeString(val.maxDate, defaultTime[1], t) + const minDate = modifyWithTimeString(val.minDate, defaultTime[0], t) + + if (state.minDate === minDate && state.maxDate === maxDate) { + return + } + + if (state.onPick) { + state.onPick(val) + } + + state.minDate = minDate + state.maxDate = maxDate + + setTimeout(() => { + state.minDate = minDate + state.maxDate = maxDate + }, 10) + + if (!close) { + return + } + + api.handleConfirm() +} + +export const handleShortcutClick = (api) => (shortcut) => { + if (shortcut.onClick) { + const choose = { + $emit: (type, [start, end]) => { + api.doPick(start, end) + } + } + + shortcut.onClick(choose) + } +} + +export const doPick = (emit) => (begin, end) => { + emit('pick', [begin, end], false) +} + +export const leftPrevYear = (state) => () => { + state.leftDate = prevYear(state.leftDate) + + if (!state.unlinkPanels) { + state.rightDate = prevYear(state.rightDate) + } +} + +export const rightNextYear = (state) => () => { + if (!state.unlinkPanels) { + state.leftDate = nextYear(state.leftDate) + } + + state.rightDate = nextYear(state.rightDate) +} + +export const leftNextYear = (state) => () => (state.leftDate = nextYear(state.leftDate)) + +export const rightPrevYear = (state) => () => (state.rightDate = prevYear(state.rightDate)) + +export const handleConfirm = ({ api, emit, state }) => (visible = false) => { + if (api.isValidValue([state.minDate, state.maxDate])) { + emit('pick', [state.minDate, state.maxDate], visible) + } +} + +export const isValidValue = (state) => (value) => + Array.isArray(value) && + value && + value[1] && + value[0] && + isDate(value[1]) && + isDate(value[0]) && + value[0].getTime() <= value[1].getTime() && + (typeof state.disabledDate === 'function' ? !state.disabledDate(value[1]) && !state.disabledDate(value[0]) : true) + +export const resetView = (state) => () => { + state.minDate = state.value && isDate(state.value[0]) ? new Date(state.value[0]) : null + state.maxDate = state.value && isDate(state.value[0]) ? new Date(state.value[1]) : null +} diff --git a/packages/renderless/src/month-range/vue.ts b/packages/renderless/src/month-range/vue.ts new file mode 100644 index 000000000..0d8b2018e --- /dev/null +++ b/packages/renderless/src/month-range/vue.ts @@ -0,0 +1,94 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + resetView, + isValidValue, + handleConfirm, + rightPrevYear, + leftNextYear, + rightNextYear, + leftPrevYear, + handleClear, + watchValue, + watchDefaultValue, + handleChangeRange, + handleRangePick, + handleShortcutClick, + doPick +} from './index' +import { nextYear } from '@opentiny/vue-renderless/common/deps/date-util' + +export const api = ['state', 'rightNextYear', 'rightPrevYear', 'handleRangePick', 'handleShortcutClick', 'handleChangeRange', 'leftPrevYear', 'leftNextYear'] + +const initState = ({ reactive, computed, api, t }) => { + const state = reactive({ + popperClass: '', + value: [], + defaultValue: null, + defaultTime: null, + minDate: '', + maxDate: '', + leftDate: new Date(), + rightDate: nextYear(new Date()), + rangeState: { endDate: null, selecting: false, row: null, column: null }, + shortcuts: '', + visible: '', + disabledDate: '', + format: '', + arrowControl: false, + unlinkPanels: false, + + btnDisabled: computed(() => !(state.minDate && state.maxDate && !state.selecting && api.isValidValue([state.minDate, state.maxDate]))), + + leftLabel: computed(() => state.leftDate.getFullYear() + ' ' + t('ui.datepicker.year')), + rightLabel: computed(() => state.rightDate.getFullYear() + ' ' + t('ui.datepicker.year')), + leftYear: computed(() => state.leftDate.getFullYear()), + + rightYear: computed(() => + state.rightDate.getFullYear() === state.leftDate.getFullYear() ? state.leftDate.getFullYear() + 1 : state.rightDate.getFullYear() + ), + + enableYearArrow: computed(() => state.unlinkPanels && state.rightYear > state.leftYear + 1) + }) + + return state +} + +export const renderless = (props, { computed, reactive, watch }, { t, emit: $emit }) => { + const api = {} + const emit = props.emitter ? props.emitter.emit : $emit + const state = initState({ reactive, computed, api, t }) + + Object.assign(api, { + state, + resetView: resetView(state), + handleChangeRange: handleChangeRange(state), + isValidValue: isValidValue(state), + leftNextYear: leftNextYear(state), + leftPrevYear: leftPrevYear(state), + doPick: doPick(emit), + rightNextYear: rightNextYear(state), + rightPrevYear: rightPrevYear(state), + watchValue: watchValue({ state }), + handleClear: handleClear({ emit, state }), + watchDefaultValue: watchDefaultValue({ state }), + handleConfirm: handleConfirm({ api, emit, state }), + handleRangePick: handleRangePick({ api, state, t }), + handleShortcutClick: handleShortcutClick(api) + }) + + watch(() => state.value, api.watchValue) + watch(() => state.defaultValue, api.watchDefaultValue) + + return api +} diff --git a/packages/renderless/src/month-table/index.ts b/packages/renderless/src/month-table/index.ts new file mode 100644 index 000000000..02f91242b --- /dev/null +++ b/packages/renderless/src/month-table/index.ts @@ -0,0 +1,240 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { toDate } from '@opentiny/vue-renderless/common/date' +import { hasClass } from '@opentiny/vue-renderless/common/deps/dom' +import { range as rangeDate, getDayCountOfMonth, nextDate } from '@opentiny/vue-renderless/common/deps/date-util' +import { arrayFindIndex, coerceTruthyValueToArray, arrayFind } from '@opentiny/vue-renderless/date-table' +import { DATEPICKER } from '@opentiny/vue-renderless/common' + +export const datesInMonth = (year, month) => { + const numOfDays = getDayCountOfMonth(year, month) + const firstDay = new Date(year, month, 1) + + return rangeDate(numOfDays).map((n) => nextDate(firstDay, n)) +} + +export const clearDate = (date) => new Date(date.getFullYear(), date.getMonth()) + +export const getMonthTimestamp = (time) => { + if (typeof time === 'number' || typeof time === 'string') { + return clearDate(new Date(time)).getTime() + } else if (time instanceof Date) { + return clearDate(time).getTime() + } + + return NaN +} + +export const getRows = ({ props, state, vm }) => () => { + const tableRows = state.tableRows + const disabledDate = state.disabledDate + const selectedDate = [] + const now = getMonthTimestamp(new Date()) + const { date, minDate, maxDate } = props + + for (let i = 0; i < 3; i++) { + const row = tableRows[i] + + for (let j = 0; j < 4; j++) { + let cell = row[j] + + if (!cell) { + cell = { + type: DATEPICKER.Normal, + row: i, + column: j, + inRange: false, + start: false, + end: false + } + } + + cell.type = DATEPICKER.Normal + + const index = i * 4 + j + const time = new Date(date.getFullYear(), index).getTime() + + cell.start = minDate && time === getMonthTimestamp(minDate) + cell.end = maxDate && time === getMonthTimestamp(maxDate) + cell.inRange = time >= getMonthTimestamp(minDate) && time <= getMonthTimestamp(maxDate) + + const isToday = time === now + + if (isToday) { + cell.type = DATEPICKER.Today + } + + cell.text = index + + let cellDate = new Date(time) + + cell.disabled = typeof disabledDate === 'function' && disabledDate(cellDate) + cell.selected = arrayFind(selectedDate, (selectDate) => selectDate.getTime() === cellDate.getTime()) + + vm.$set(row, j, cell) + } + } + + return tableRows +} + +export const markRange = ({ props, state }) => (minDate, maxDate) => { + minDate = Math.min(getMonthTimestamp(minDate), getMonthTimestamp(maxDate)) + maxDate = Math.max(getMonthTimestamp(minDate), getMonthTimestamp(maxDate)) + const rows = state.rows + + for (let i = 0, len = rows.length; i < len; i++) { + const row = rows[i] + + for (let j = 0, l = row.length; j < l; j++) { + const cell = row[j] + const index = i * 4 + j + const time = new Date(props.date.getFullYear(), index).getTime() + + cell.start = minDate && time === minDate + cell.end = maxDate && time === maxDate + cell.inRange = minDate && time >= minDate && time <= maxDate + } + } +} + +export const watchDate = ({ api, props }) => (value, oldvalue) => { + if (getMonthTimestamp(value) !== getMonthTimestamp(oldvalue)) { + api.markRange(props.minDate, props.maxDate) + } +} + +const getTarget = (event) => { + let target = event.target + + if (target.tagName === 'A') { + target = target.parentNode.parentNode + } + + if (target.tagName === 'DIV') { + target = target.parentNode + } + + if (target.tagName !== 'TD') { + return + } + + return target +} + +export const handleMouseMove = ({ api, emit, props, state }) => (event) => { + if (!props.rangeState.selecting) { + return + } + + const target = getTarget(event) + + if (!target) { + return + } + + const row = target.parentNode.rowIndex + const colu = target.cellIndex + + if (state.rows[row][colu].disabled) { + return + } + + if (row !== state.lastRow || colu !== state.lastColumn) { + state.lastColumn = colu + state.lastRow = row + + emit('changerange', { + maxDate: props.maxDate, + minDate: props.minDate, + rangeState: { + selecting: true, + endDate: api.getMonthOfCell(row * 4 + colu) + } + }) + } +} + +export const handleMonthTableClick = ({ api, emit, props }) => (event) => { + const target = getTarget(event) + + if (!target) { + return + } + + if (hasClass(target, 'disabled')) { + return + } + + const column = target.cellIndex + const row = target.parentNode.rowIndex + const month = row * 4 + column + const newDate = api.getMonthOfCell(month) + + if (props.selectionMode === DATEPICKER.Range) { + if (props.rangeState.selecting) { + if (newDate < props.minDate) { + emit('pick', { minDate: newDate, maxDate: props.minDate }) + } else { + emit('pick', { minDate: props.minDate, maxDate: newDate }) + } + + props.rangeState.selecting = false + } else { + emit('pick', { minDate: newDate, maxDate: null }) + props.rangeState.selecting = true + } + } else { + emit('pick', month) + } +} + +export const cellMatchesDate = (props) => (cell, date) => { + const value = new Date(date) + + return props.date.getFullYear() === value.getFullYear() && Number(cell.text) === value.getMonth() +} + +export const getCellStyle = ({ api, props }) => (cell) => { + const style = {} + const year = props.date.getFullYear() + const today = new Date() + const month = cell.text + + const defaultValue = props.defaultValue ? (Array.isArray(props.defaultValue) ? props.defaultValue : [props.defaultValue]) : [] + + style.disabled = typeof props.disabledDate === 'function' ? datesInMonth(year, month).every(props.disabledDate) : false + + const execDate = typeof props.value === 'object' ? props.value : toDate(props.value) + + style.current = arrayFindIndex(coerceTruthyValueToArray(execDate), (date) => date.getFullYear() === year && date.getMonth() === month) >= 0 + + style.today = today.getFullYear() === year && today.getMonth() === month + style.default = defaultValue.some((date) => api.cellMatchesDate(cell, date)) + + if (cell.inRange) { + style[DATEPICKER.InRange] = true + + if (cell.start) { + style[DATEPICKER.StartDate] = true + } + + if (cell.end) { + style[DATEPICKER.EndDate] = true + } + } + + return style +} + +export const getMonthOfCell = (props) => (month) => new Date(props.date.getFullYear(), month, 1) diff --git a/packages/renderless/src/month-table/vue.ts b/packages/renderless/src/month-table/vue.ts new file mode 100644 index 000000000..6657a584a --- /dev/null +++ b/packages/renderless/src/month-table/vue.ts @@ -0,0 +1,64 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + getRows, + getMonthTimestamp, + markRange, + watchDate, + handleMouseMove, + handleMonthTableClick, + cellMatchesDate, + getCellStyle, + getMonthOfCell +} from './index' +import { DATEPICKER } from '@opentiny/vue-renderless/common' + +export const api = ['state', 'handleMonthTableClick', 'handleMouseMove', 'getCellStyle'] + +export const renderless = (props, { computed, reactive, watch }, { t, vm, emit }) => { + const api = {} + const { MonhtList } = DATEPICKER + const state = reactive({ + months: MonhtList, + tableRows: [[], [], []], + lastRow: null, + lastColumn: null, + rows: computed(() => api.getRows()) + }) + + Object.assign(api, { + t, + state, + getMonthOfCell: getMonthOfCell(props), + cellMatchesDate: cellMatchesDate(props), + markRange: markRange({ api, props, state }), + watchDate: watchDate({ api, props }), + getMonthTimestamp: getMonthTimestamp(api), + handleMouseMove: handleMouseMove({ api, emit, props, state }), + handleMonthTableClick: handleMonthTableClick({ api, emit, props }), + getCellStyle: getCellStyle({ api, props }), + getRows: getRows({ props, state, vm }) + }) + + watch( + () => props.rangeState, + (value) => api.markRange(props.minDate, value.endDate), + { deep: true } + ) + + watch(() => props.minDate, api.watchDate) + + watch(() => props.maxDate, api.watchDate) + + return api +} diff --git a/packages/renderless/src/multi-select/index.ts b/packages/renderless/src/multi-select/index.ts new file mode 100644 index 000000000..5d63602f7 --- /dev/null +++ b/packages/renderless/src/multi-select/index.ts @@ -0,0 +1,239 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { cloneDeep } from '@opentiny/vue-renderless/chart-core/deps/utils' + +export const created = ({ props, state, refs, nextTick }) => () => { + nextTick(() => { + state.dataSource = cloneDeep(props.dataSource) + state.defaultSelectedArray = cloneDeep(props.defaultSelectedArray) + state.labelLevelsInfo = getLabelLevelsInfo(refs) + state.labelsStyle = getLabelsStyle(state) + state.headerInfo = state.dataSource.map((item) => { + return { isSelected: false, title: item.title, isUP: false } + }) + }) +} + +export const handleClick = ({ api, props, state }) => (value) => { + state.wheelData = props.dataSource[value]?.children + if (state.headerIndex === -1) { + // 首次点击 + state.showWheel = true + state.headerIndex = value + state.headerInfo[value] = getNewHeaderInfo(state.headerInfo, value, true) + state.defaultSelectedIndexs = state.defaultSelectedArray[value] ?? api.loadDefault(value) + } else if (state.headerIndex !== value) { + // 切换 + state.showWheel = true + state.headerInfo[state.headerIndex] = getNewHeaderInfo(state.headerInfo, state.headerIndex, false) // 上一个 + state.headerIndex = value + state.headerInfo[value] = getNewHeaderInfo(state.headerInfo, value, true) + state.defaultSelectedIndexs = state.defaultSelectedArray[value] ?? api.loadDefault(value) // 下一个 + } else { + // 收起与展开 + state.showWheel = !state.showWheel + const { isUP } = state.headerInfo[value] + state.headerInfo[value] = getNewHeaderInfo(state.headerInfo, value, !isUP) + } +} + +export const confirm = ({ state, emit }) => () => { + const wheelLevelItems = getWheelLevelItems(state.wheelData, state.defaultSelectedIndexs) + const { selectedLabels, selectedItems } = getSelected(wheelLevelItems, state.defaultSelectedIndexs) + state.headerInfo[state.headerIndex] = { isSelected: true, title: selectedLabels, isUP: false } + state.defaultSelectedArray[state.headerIndex] = state.defaultSelectedIndexs + emit('confirm', selectedItems, state.headerIndex, state.defaultSelectedIndexs) + state.showWheel = false +} + +export const reset = ({ api, props, state, emit }) => () => { + state.headerInfo[state.headerIndex] = { isSelected: false, title: '', isUP: false } + state.defaultSelectedIndexs = props.defaultSelectedArray[state.headerIndex] ?? api.loadDefault(state.headerIndex) + state.defaultSelectedArray[state.headerIndex] = state.defaultSelectedIndexs + emit('reset', [], state.headerIndex, state.defaultSelectedIndexs) + state.showWheel = false +} + +export const wheelChange = (state) => (indexs) => { + state.defaultSelectedIndexs = indexs +} + +export const clickWheelItem = ({ state, emit }) => (indexs, text, item) => { + if (indexs.length === 0) { + // 反选 + state.defaultSelectedIndexs = [-1] + state.headerInfo[state.headerIndex] = { isSelected: false, title: '', isUP: false } + } else { + state.defaultSelectedIndexs = indexs + state.headerInfo[state.headerIndex] = { isSelected: true, title: text, isUP: false } + } + state.defaultSelectedArray[state.headerIndex] = state.defaultSelectedIndexs + emit('confirm', item, state.headerIndex, indexs) + state.showWheel = false +} + +export const getWheelLevelItems = (wheelData, newIndexs) => { + const level_1 = wheelData + const level_n = getNextLevel([], wheelData, newIndexs, 0) + let wheelLevelItems = [] + if (level_n.length === 0) { + // 单列 + wheelLevelItems = [level_1] + } else { + // 多列 + wheelLevelItems = [level_1, ...level_n] + } + return wheelLevelItems +} + +export const getNextLevel = (levelItems, children, nextIndexs, start) => { + let levelItem = children[nextIndexs[start]]?.children ?? [] + if (start !== nextIndexs.length - 1) { + levelItems.push(levelItem) + return getNextLevel(levelItems, levelItem, nextIndexs, ++start) + } else { + return levelItems + } +} + +export const getSelected = (wheelLevelItems, selectedIndexs) => { + const selectedItems = [] + wheelLevelItems.forEach((levelItem, i) => { + const index = selectedIndexs[i] + if (levelItem[index]) { + selectedItems.push(levelItem[index]) + } + }) + const selectedLabels = selectedItems.map(item => item?.label).join(' ') + return { selectedLabels, selectedItems } +} + +export const loadDefault = ({ props, state }) => (value) => { + const current = props.defaultSelectedArray[value] ?? [] + let defaultSelectedIndexs = [] + if (state.dataSource[state.headerIndex]?.hasFooter) { + // 有确认,重置按钮。此情况不可点击,可滚动,且初始化默认选中每列第一个 + const defaultL = current.length + const dataSL = getMaxFloor(state.wheelData) + if (defaultL <= dataSL) { + defaultSelectedIndexs = current.concat(new Array(dataSL - defaultL).fill(0)) + } else { + defaultSelectedIndexs = current.slice(0, dataSL) + } + } else { + // 无确认,重置按钮。此情况默认为单列,可点击,且初始化默认不选中 + defaultSelectedIndexs = current.length > 0 ? current : [-1] + } + return defaultSelectedIndexs +} + +export const getMaxFloor = (treeData) => { + let maxFloor = 0 + const loop = (data, level) => { + data.forEach((item) => { + item.level = level + if (level > maxFloor) { + maxFloor = level + } + if (item?.children?.length > 0) { + loop(item.children, level + 1) + } + }) + } + loop(treeData, 1) + return maxFloor +} + +export const getNewHeaderInfo = (headerInfo, index, isUP) => { + return { isSelected: headerInfo[index]?.isSelected, title: headerInfo[index]?.title, isUP } +} + +export const getLabelLevelsInfo = (refs) => { + const { headerBox, label } = refs + if (!headerBox || !label) return [] + const totalWidth = getRect(getEl(headerBox)).width + const labelWidth = label.map((node) => getRect(getEl(node))).map((rect) => rect.width) + return labelWidth.map((labelWidth, idx) => { + const isOver25 = totalWidth * 0.25 < labelWidth + return { + idx, + labelWidth, + totalWidth, + isOver25 + } + }) +} + +export const getRect = (el) => { + return { + top: el.offsetTop, + left: el.offsetLeft, + width: el.offsetWidth, + height: el.offsetHeight + } +} + +export const getEl = (node) => { + return node.$el || node +} + +export const getLabelsStyle = (state) => { + const over25Labels = state.labelLevelsInfo.filter((i) => i && !i.isOver25) + + // 不超过总宽度25%的头部下拉项 + let widthInfo = over25Labels + const len = state.dataSource.length + if (len >= 4) { + return getStyleConfig(state.labelLevelsInfo, { width: `${((1 / len) * 100).toFixed(2)}%` }) + } + if (!widthInfo.length || widthInfo.length === state.labelLevelsInfo.length) { + // 所有下拉项同时不超过或者超过25%宽度 + return getStyleConfig(state.labelLevelsInfo, { maxWidth: `${((1 / len) * 100).toFixed(2)}%` }) + } + let fillArr + if (widthInfo.length === 1) { + // 一个不超出25% + fillArr = getFillArray(state, widthInfo, '37.5%') + } else if (widthInfo.length === 2) { + // 两个不超出25% + fillArr = getFillArray(state, widthInfo, '50%') + } + widthInfo = widthInfo.concat(fillArr) + return widthInfo.reduce((styles, item) => { + styles[item.idx] = item.maxWidth ? { maxWidth: item.maxWidth } : { maxWidth: '25%' } + return styles + }, {}) +} + +export const getStyleConfig = (data, style) => { + return data.reduce((styleConfig, _, idx) => { + styleConfig[idx] = style + return styleConfig + }, {}) +} + +export const getFillArray = (state, widthInfo, maxWidth) => { + // 头部下拉项索引集合 + const labelIndexArr = state.labelLevelsInfo.map((_, idx) => idx) + + // 头部下拉项宽度超过25%索引集合 + const mapWidthInfoArr = widthInfo.map((i) => i.idx) + return labelIndexArr + .filter((i) => !mapWidthInfoArr.includes(i)) + .map((i) => { + return { + idx: i, + maxWidth + } + }) +} diff --git a/packages/renderless/src/multi-select/vue.ts b/packages/renderless/src/multi-select/vue.ts new file mode 100644 index 000000000..7a7c29835 --- /dev/null +++ b/packages/renderless/src/multi-select/vue.ts @@ -0,0 +1,93 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + created, + handleClick, + confirm, + reset, + wheelChange, + clickWheelItem, + loadDefault +} from './index' + +export const api = [ + 'state', + 'created', + 'handleClick', + 'confirm', + 'reset', + 'wheelChange', + 'clickWheelItem', + 'loadDefault' +] + +const initState = (reactive) => { + const state = reactive({ + dataSource: [], + wheelData: [], + headerIndex: -1, + showWheel: false, + labelLevelsInfo: [], + labelsStyle: [], + wheelIndex: [], + wheelText: '', + headerInfo: [], + defaultSelectedIndexs: [], + defaultSelectedArray: [], + }) + + return state +} + +const initApi = ({ api, props, state, emit, nextTick, refs }) => { + Object.assign(api, { + state, + created: created({ props, state, refs, nextTick }), + handleClick: handleClick({ api, props, state }), + confirm: confirm({ state, emit }), + reset: reset({ api, props, state, emit }), + wheelChange: wheelChange(state), + clickWheelItem: clickWheelItem({ state, emit }), + loadDefault: loadDefault({ props, state }), + }) +} + +const initWatch = ({ watch, props, state, refs, nextTick }) => { + watch( + () => props.dataSource, + () => { + api.created({ props, state, refs, nextTick }) + } + ) + watch( + () => props.defaultSelectedArray, + () => { + api.created({ props, state, refs, nextTick }) + } + ) +} + +export const renderless = (props, { onMounted, reactive, watch }, { emit, nextTick, refs }) => { + const api = {} + const state = initState(reactive) + + initApi({ api, props, state, emit, nextTick, refs }) + + initWatch({ watch, props, state, refs, nextTick }) + + onMounted(() => { + api.created({ props, state, refs, nextTick }) + }) + + return api +} diff --git a/packages/renderless/src/nav-menu/index.ts b/packages/renderless/src/nav-menu/index.ts new file mode 100644 index 000000000..843637d9f --- /dev/null +++ b/packages/renderless/src/nav-menu/index.ts @@ -0,0 +1,395 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { isEmptyObject, isObject } from '@opentiny/vue-renderless/common/type' +import PopupManager from '@opentiny/vue-renderless/common/deps/popup-manager' +import { mapTree } from '@opentiny/vue-renderless/grid/static' +import { transformTreeData } from '@opentiny/vue-renderless/common/array' +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' +import { xss } from '@opentiny/vue-renderless/common/xss.js' + +const { nextZIndex } = PopupManager + +export const computedIsShowMore = ({ props, state }) => () => !/^(retract|fixed|hidden)$/.test(props.overflow) && state.more && state.more.length + +export const computedPopClass = (state) => () => (!state.showMore && state.subMenus && state.subMenus.length === 1 ? 'single' : '') + +export const computedSubMenus = (state) => () => { + let arr = state.subMenu + + if (state.subMenu && !isEmptyObject(state.subMenu)) { + if (!state.subMenu.map((item) => item.children && !isEmptyObject(item.children)).reduce((pre, cur) => pre || cur)) { + arr = [{ children: state.subMenu }] + } + } + + return arr +} + +export const computedMenuStyle = ({ props, state }) => () => { + let result = { + maxWidth: `${state.width}px` + } + + if (props.overflow === 'retract') { + result.width = '0px' + } + + return result +} + +export const computedPopStyle = (state) => () => ({ + top: `${state.popMenuTop}px` +}) + +export const watchWidth = ({ api, nextTick }) => () => nextTick(() => api.classify()) + +class CloneObject { + constructor(json, props) { + this.props = props + + if (json) { + this.data = this.getType(json) + this.traverse(json, this.data) + } + } + + traverse(node, newObject) { + if (/^(string|undefined)$/.test(typeof node) || node === null) { + newObject = node + } else if (Array.isArray(node)) { + this.traverseArray(node, newObject) + } else if (typeof node === 'object') { + this.traverseObject(node, newObject) + } + + return this + } + + traverseArray(node, newObject) { + for (let i = 0; i < node.length; i++) { + newObject.push(this.getType(node[i])) + + if (node[i] && typeof node[i] === 'object') { + this.traverse(node[i], newObject[i]) + } + } + } + + traverseObject(node, newObject) { + Object.keys(node).forEach((key) => { + if (/^(name|url|route|title|name|children)$/.test(key)) { + let alias = key + + if (key === 'url') { + if (!(this.props.prevent || this.props.allowFullUrl)) { + alias = 'route' + } + } + + if (key === 'name') { + alias = 'title' + } + + newObject[alias] = this.getType(node[key]) + + if (newObject[alias] && typeof newObject[alias] === 'object') { + this.traverse(node[key], newObject[alias]) + } + } + }) + } + + getType(object) { + let result + + if (/^(string|undefined)$/.test(typeof object) || object === null) { + result = object + } else if (Array.isArray(object)) { + result = [] + } else if (typeof object === 'object') { + result = {} + } + + return result + } +} + +export const initData = ({ fetchMenuData, fields, props, state }) => () => { + const { textField = 'title', urlField = 'url', key = 'id' } = fields || {} + const { parentKey, data } = props + const isFullUrl = (url) => /^(https?:\/\/|\/\/)[\s\S]+$/.test(url) + + const buildData = (item) => { + const router = item[urlField] || item.route + + return { + title: item[textField], + route: router ? router.replace(/^#\/?/, '') : null, + url: item.url, + id: item.id, + pid: item.pid, + isFullUrl: props.allowFullUrl && isFullUrl(router), + target: item.target + } + } + + if (data) { + state.data = mapTree(parentKey ? transformTreeData(data, key, parentKey) : data, buildData) + return + } + + const menuData = props.fetchMenuData && fetchMenuData() + + if (isObject(menuData) && menuData.then) { + menuData.then((data) => { + state.data = mapTree(props.parentKey ? transformTreeData(data, key, props.parentKey) : data, buildData) + }) + + return + } + + if (!menuData) { + state.data = [] + return + } + + let arr = [] + + if (menuData && menuData.length) { + let getMenuData = new CloneObject(menuData, props).data + + arr = typeof getMenuData === 'object' && Array.isArray(getMenuData) ? getMenuData : [getMenuData] + } + + state.data = mapTree(parentKey ? transformTreeData(arr, key, parentKey) : arr, buildData) +} + +export const mounted = ({ api, props, router, route, state }) => () => { + api.calcWidth() + + on(window, 'resize', api.calcWidth) + + if (router) { + state.afterEach = () => { + api.setActiveMenu(api.getSelectedIndex(route.path)) + } + + router.afterEach(state.afterEach) + } + + props.data && props.data.length && route && api.setActiveMenu(api.getSelectedIndex(route.path)) +} + +export const unMounted = ({ api, state, router }) => () => { + if (router && router.afterHooks) { + const index = router.afterHooks.indexOf(state.afterEach) + + router.afterHooks.splice(index, 1) + } + + state.afterEach = null + off(window, 'resize', api.calcWidth) +} + +export const getSelectedIndex = (state) => (path) => { + let length = state.data.length + let index = -1 + + if (path !== '/') { + path = path.replace(/^#?\//, '') + + let exp = new RegExp('("url":"#/?' + path + '"|"url":"/?' + path + '"|"route":"/?' + path + '")', 'i') + + for (let i = 0; i < length; i++) { + if (exp.test(JSON.stringify(state.data[i]))) { + index = i + break + } + } + } + + return index +} + +export const showSetting = ({ parent, state }) => () => { + state.isShowSetting = true + + const setting = parent.$el.querySelector('.more-setting') + + setting.style.zIndex = nextZIndex() +} + +export const willHideSetting = (state) => () => (state.isShowSetting = false) + +export const showSubMenu = ({ api, nextTick, parent, state }) => (list, { more, index }, event) => { + if (list || more) { + state.subMenu !== list ? api.hideSubMenu() : api.stopHideSubMenu() + state.showMore = !!more + state.subMenu = list + state.showPopmenu = true + + nextTick(() => { + const popmenu = parent.$el.querySelector('.popmenu') + + if (popmenu) { + popmenu.style.zIndex = nextZIndex() + + if (popmenu.classList.contains('single') && event) { + popmenu.style.left = `${event.target.offsetLeft}px` + } else { + popmenu.style.left = 0 + } + + popmenu.style.height = 'auto' + popmenu.style.display = 'block' + } + }) + + if (index !== undefined) { + state.activeIndex = index + } + + if (more && list && list.length && state.subActiveIndex === -1) { + state.subActiveIndex = 0 + } + } else { + api.hideSubMenu() + } +} + +export const hideSubMenu = ({ api, parent, state }) => () => { + api.stopHideSubMenu() + state.showMore = false + state.showPopmenu = false + state.activeIndex = -1 + state.subActiveIndex = -1 + + const popmenu = parent.$el.querySelector('.popmenu') + + popmenu.style.height = 'auto' + popmenu.style.display = 'none' +} + +export const willHideSubMenu = ({ api, state }) => () => { + api.stopHideSubMenu() + + state.timer = setTimeout(() => { + api.hideSubMenu() + }, 20) +} + +export const stopHideSubMenu = (state) => () => { + clearTimeout(state.timer) +} + +export const setSubMenu = (state) => (value, index) => { + state.subActiveIndex = index + state.subMenu = value +} + +export const isHide = ({ parent, state }) => (event) => !state.width || event.offsetTop >= parent.$el.offsetHeight + +export const hidePopmenu = (api) => (item) => { + if (item.url || item.route) { + api.setActiveMenu(api.getSelectedIndex(item.url || item.route)) + api.hideSubMenu() + } +} + +export const clickMenu = ({ api, props }) => (item, index) => { + if (item.url || item.route) { + if (props.beforeSkip) { + props.beforeSkip(item) && api.skip(item, true) + } else { + api.skip(item) + } + } + + index !== undefined && api.setActiveMenu(index) + + api.hidePopmenu(item) +} + +export const skip = ({ api, router, fields }) => (item, flag = false) => { + if (item.isFullUrl) { + const { urlField = 'url' } = fields || {} + const router = item[urlField] || item.route + + return (window.open(xss.filterUrl(router)).opener = null) + } + + const address = !item.route || !flag ? api.getUrl(item).replace(/^#/, '') : item.route.replace(/^\/+/, '/').replace('#/', '') + + if (address) { + return router.push(address) + } else { + return '' + } +} + +export const getPoint = ({ api, parent }) => () => { + const items = parent.$el.querySelectorAll('.menu>li') + let index = 0 + + if (items) { + index = items.length + + for (let i = 0; i < items.length; i++) { + if (api.isHide(items[i])) { + index = index - (items.length - i) + break + } + } + } + + return index +} + +export const classify = ({ api, props, state }) => () => { + const isRetractOrFixed = /^(retract|fixed)$/.test(props.overflow) + const menuCount = isRetractOrFixed ? 0 : props.overflow === 'hidden' ? props.data.length : api.getPoint() + + state.more = state.data.slice(menuCount) +} + +export const calcWidth = ({ parent, props, state }) => () => { + let el = parent.$el + let logoWidth = parent.$slots.logo ? el.querySelector('.slot-logo').offsetWidth : 0 + let toolbarWidth = parent.$slots.toolbar ? el.querySelector('.slot-toolbar').offsetWidth : 0 + let menuWidth = el.offsetWidth + let width = props.overflow === 'retract' ? 0 : menuWidth - toolbarWidth - logoWidth + + width = width - 120 - (toolbarWidth ? 50 : 10) - (logoWidth ? 100 : 0) + state.width = width < 200 ? 0 : width + state.popMenuTop = el.offsetHeight +} + +export const getTag = (props) => (item) => (item.url && 'a') || (item.route && (!props.beforeSkip ? 'router-link' : 'a')) || 'span' + +export const getUrl = () => (item) => item.url || '' + +export const getRoute = (props) => (item) => (!props.beforeSkip ? `/${item.route || ''}`.replace(/^\/+/, '/').replace('#/', '') : '') + +export const setActiveMenu = (state) => (index) => (state.selectedIndex = typeof index !== 'undefined' ? index : -1) + +export const initService = ({ props, service }) => { + const fetchMenuData = () => Promise.reject(new Error('[TINY Error][NavMenu] Prop fetchMenuData is not configured')) + + const { base = {}, setting = {} } = service || {} + const { options = {} } = setting + + return { + fetchMenuData: props.fetchMenuData || base.getMenuDataSync || fetchMenuData, + fields: props.fields || options.NavMenu + } +} diff --git a/packages/renderless/src/nav-menu/vue.ts b/packages/renderless/src/nav-menu/vue.ts new file mode 100644 index 000000000..dff8afb68 --- /dev/null +++ b/packages/renderless/src/nav-menu/vue.ts @@ -0,0 +1,141 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + computedIsShowMore, + computedPopClass, + computedSubMenus, + computedMenuStyle, + computedPopStyle, + watchWidth, + initData, + mounted, + unMounted, + getSelectedIndex, + showSetting, + willHideSetting, + showSubMenu, + hideSubMenu, + willHideSubMenu, + stopHideSubMenu, + setSubMenu, + isHide, + hidePopmenu, + clickMenu, + skip, + getPoint, + classify, + calcWidth, + getTag, + getUrl, + getRoute, + setActiveMenu, + initService +} from './index' + +export const api = [ + 'state', + 'getSelectedIndex', + 'showSetting', + 'willHideSetting', + 'showSubMenu', + 'hideSubMenu', + 'willHideSubMenu', + 'stopHideSubMenu', + 'setSubMenu', + 'isHide', + 'hidePopmenu', + 'clickMenu', + 'skip', + 'getPoint', + 'classify', + 'calcWidth', + 'getTag', + 'getUrl', + 'getRoute', + 'setActiveMenu' +] + +const initState = ({ reactive, api, computed }) => + reactive({ + data: [], + more: [], + width: -1, + popMenuTop: 0, + subMenu: [], + showMore: false, + showPopmenu: false, + timer: null, + activeIndex: -1, + subActiveIndex: -1, + selectedIndex: -1, + isShowSetting: false, + marginLeft: 0, + isShowMore: computed(() => api.computedIsShowMore()), + popClass: computed(() => api.computedPopClass()), + subMenus: computed(() => api.computedSubMenus()), + menuStyle: computed(() => api.computedMenuStyle()), + popStyle: computed(() => api.computedPopStyle()) + }) + +const initApi = ({ api, state, props, parent, fetchMenuData, fields, router, route, nextTick }) => { + Object.assign(api, { + state, + getUrl: getUrl(), + getTag: getTag(props), + getRoute: getRoute(props), + setSubMenu: setSubMenu(state), + isHide: isHide({ parent, state }), + setActiveMenu: setActiveMenu(state), + willHideSetting: willHideSetting(state), + stopHideSubMenu: stopHideSubMenu(state), + calcWidth: calcWidth({ parent, props, state }), + getSelectedIndex: getSelectedIndex(state), + showSetting: showSetting({ parent, state }), + initData: initData({ fetchMenuData, fields, props, state }), + computedIsShowMore: computedIsShowMore({ props, state }), + computedPopClass: computedPopClass(state), + computedSubMenus: computedSubMenus(state), + computedMenuStyle: computedMenuStyle({ props, state }), + computedPopStyle: computedPopStyle(state), + skip: skip({ api, router, fields }), + hidePopmenu: hidePopmenu(api), + getPoint: getPoint({ api, parent }), + clickMenu: clickMenu({ api, props }), + unMounted: unMounted({ api, state, router }), + mounted: mounted({ api, props, router, route, state }), + classify: classify({ api, props, state }), + watchWidth: watchWidth({ api, nextTick }), + willHideSubMenu: willHideSubMenu({ api, state }), + hideSubMenu: hideSubMenu({ api, parent, state }), + showSubMenu: showSubMenu({ api, nextTick, parent, state }) + }) +} + +export const renderless = (props, { computed, onMounted, onUnmounted, reactive, watch }, { parent, nextTick, service, router, route }) => { + const api = {} + const { fetchMenuData, fields } = initService({ props, service }) + const state = initState({ reactive, api, computed }) + + initApi({ api, state, props, parent, fetchMenuData, fields, router, route, nextTick }) + + api.initData() + + watch(() => state.width, api.watchWidth, { deep: true, immediate: true }) + + watch(() => state.data, api.watchWidth) + + onMounted(api.mounted) + onUnmounted(api.unMounted) + + return api +} diff --git a/packages/renderless/src/notify/index.ts b/packages/renderless/src/notify/index.ts new file mode 100644 index 000000000..58fc2b1e6 --- /dev/null +++ b/packages/renderless/src/notify/index.ts @@ -0,0 +1,82 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { KEY_CODE } from '@opentiny/vue-renderless/common' +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' +import PopupManager from '@opentiny/vue-renderless/common/deps/popup-manager' + +export const startTimer = ({ api, state }) => () => { + if (state.duration > 0) { + state.timer = setTimeout(() => { + !state.closed && api.close() + }, state.duration) + } +} + +export const clearTimer = (state) => () => { + clearTimeout(state.timer) + state.timer = null +} + +export const click = ({ emit, state }) => () => { + typeof state.onClick === 'function' && this.onClick() + emit('click', '') +} + +export const close = ({ state, props }) => () => { + if (!props.beforeClose || (typeof props.beforeClose === 'function' && props.beforeClose())) { + typeof props.onClose === 'function' && props.onClose() + state.closed = true + } +} + +export const watchClosed = (state) => (value) => { + if (value) { + state.visible = false + } +} + +export const getTypeClass = (constants) => (state) => (state.type && constants[state.type.toUpperCase()] ? `icon-${constants[state.type]}` : '') + +export const getOffsetStyle = (state) => { + const side = {} + + side[state.verticalProperty] = `${state.verticalOffset}px` + + return side +} + +export const getZindex = () => PopupManager.nextZIndex() + +export const getPositionSide = (state) => (state.position.startsWith('top-') ? 'top' : 'bottom') + +export const bindKeyDown = ({ api, state }) => (event) => { + if (event.keyCode === KEY_CODE.Delete || event.keyCode === KEY_CODE.Backspace) { + api.clearTimer() + } else if (event.keyCode === KEY_CODE.Escape) { + !state.closed && api.close() + } else { + api.startTimer() + } +} + +export const bindEvent = ({ api, state }) => () => { + if (state.timer) { + api.clearTimer() + } + + api.startTimer() + + on(document, 'keydown', api.bindKeyDown) +} + +export const unBindEvent = (api) => () => off(document, 'keydown', api.bindKeyDown) diff --git a/packages/renderless/src/notify/vue.ts b/packages/renderless/src/notify/vue.ts new file mode 100644 index 000000000..1cbd7bfbc --- /dev/null +++ b/packages/renderless/src/notify/vue.ts @@ -0,0 +1,65 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { clearTimer, startTimer, close, bindEvent, unBindEvent, click, watchClosed, getOffsetStyle, getPositionSide, getZindex } from './index' + +export const api = [ + 'state', + 'clearTimer', + 'startTimer', + 'close', + 'bindEvent', + 'unBindEvent', + 'click', + 'watchClosed', + 'getOffsetStyle', + 'getPositionSide', + 'getZindex' +] + +export const renderless = (props, { computed, onBeforeUnmount, onMounted, reactive, watch }, { emit }) => { + const api = {} + const state = reactive({ + timer: null, + closed: false, + visible: true, + duration: computed(() => props.duration), + showClose: true, + verticalOffset: 0, + position: computed(() => props.position), + dangerouslyUseHTMLString: false, + positionStyle: computed(() => api.getOffsetStyle(state)), + verticalProperty: computed(() => api.getPositionSide(state)), + customClass: computed(() => props.customClass) + }) + + Object.assign(api, { + state, + getZindex, + getOffsetStyle, + getPositionSide, + close: close({ state, props }), + click: click({ emit, state }), + clearTimer: clearTimer(state), + bindEvent: bindEvent({ api, state }), + unBindEvent: unBindEvent(api), + startTimer: startTimer({ api, state }), + watchClosed: watchClosed(state) + }) + + watch(() => state.closed, api.watchClosed, { immediate: true }) + + onMounted(api.bindEvent) + onBeforeUnmount(api.unBindEvent) + + return api +} diff --git a/packages/renderless/src/numeric/index.ts b/packages/renderless/src/numeric/index.ts new file mode 100644 index 000000000..4a203e23a --- /dev/null +++ b/packages/renderless/src/numeric/index.ts @@ -0,0 +1,361 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { formatNumber, roundFixed } from '@opentiny/vue-renderless/common/decimal' +import { getMiniDecimal, lessEquals, equalsDecimal } from '@opentiny/vue-renderless/common/bigInt' +import { isNumber, isNull } from '@opentiny/vue-renderless/common/type' +import { MOUSEDELTA } from '@opentiny/vue-renderless/common' +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' + +export const initService = (service) => { + const { utils = {} } = service || {} + const noopFn = () => null + + return { + getUnitPrecision: utils.getUnitPrecision || noopFn, + getNumberFormat: utils.getNumberFormat || noopFn + } +} + +export const getDecimal = (props) => (value) => getMiniDecimal(value, props.plugin) + +export const watchValue = ({ api, state }) => (value) => { + if (value === state.currentValue) { + return + } + + api.setCurrentValue(value) +} + +export const toPrecision = (state) => ({ num, precision }) => { + if (precision === undefined) { + precision = state.numPrecision + } + + return parseFloat(Math.round(num * 10 ** precision) / 10 ** precision) +} + +export const getPrecision = () => (value) => { + if (value === undefined) { + return 0 + } + + const valueString = value.toString() + const dotPosition = valueString.indexOf('.') + let precision = 0 + + if (dotPosition !== -1) { + precision = valueString.length - dotPosition - 1 + } + + return precision +} + +export const internalIncrease = ({ api, state }) => ({ val, step }) => { + const decimal = api.getDecimal(val) + + if (decimal.isNaN() && val !== undefined) { + return state.currentValue + } + + return decimal.add(step).toString() +} + +export const internalDecrease = ({ api, state }) => ({ val, step }) => { + const decimal = api.getDecimal(val) + + if (decimal.isNaN() && val !== undefined) { + return state.currentValue + } + + return decimal.add(`-${step}`).toString() +} + +export const increase = ({ api, props, state }) => () => { + if (state.inputDisabled || state.maxDisabled) { + return + } + + const value = props.modelValue || 0 + let newVal = api.internalIncrease({ val: value, step: props.step }) + + if (!props.circulate || !isFinite(props.max) || !isFinite(props.min)) { + api.setCurrentValue(newVal) + return + } + + if (!lessEquals(newVal, props.max) || lessEquals(newVal, props.min)) { + newVal = props.min + } + + api.setCurrentValue(newVal) +} + +export const decrease = ({ api, props, state }) => () => { + if (state.inputDisabled || state.minDisabled) { + return + } + + const value = props.modelValue || 0 + let newVal = api.internalDecrease({ val: value, step: props.step }) + + if (!props.circulate || !isFinite(props.max) || !isFinite(props.min)) { + api.setCurrentValue(newVal) + return + } + + if (!lessEquals(props.min, newVal) || lessEquals(props.max, newVal)) { + newVal = props.max + } + + api.setCurrentValue(newVal) +} + +export const handleBlur = ({ constants, dispatch, emit, props, state, api }) => (event) => { + state.inputStatus = false + api.setCurrentValue(event.target.value) + emit('blur', event) + + if (props.validateEvent) { + dispatch(constants.COMPONENT_NAME, constants.EVENT_NAME.blur, [state.displayValue]) + } +} + +export const handleFocus = ({ emit, state, props, api }) => (event) => { + state.inputStatus = true + + const currentValue = api.getDecimal(state.currentValue) + + if (!currentValue.isNaN() && !isNull(state.currentValue)) { + const fractionLen = (currentValue.toString().split('.')[1] || '').length + + if (fractionLen < state.format.fraction && props.holdZero) { + state.currentValue = formatNumber(state.currentValue, { + fraction: state.format.fraction + }) + state.userInput = state.currentValue + state.lastInput = state.currentValue + } + } + + emit('focus', event) +} + +export const focus = (refs) => () => { + refs.input.focus() +} + +const getEmitValue = (args) => { + let { newVal, emitValue, allowEmpty, defaultVal, bigNew, oldVal } = args + let { max, min, api, props, format, plugin, stringMode } = args + + if (!newVal && newVal !== 0) { + emitValue = allowEmpty ? undefined : defaultVal + } else if (bigNew.isNaN()) { + emitValue = oldVal + } else { + if (isFinite(max) && lessEquals(max, newVal)) { + newVal = max + } + + if (isFinite(min) && lessEquals(newVal, min)) { + newVal = min + } + + emitValue = api.getDecimal(newVal).toString() + + if (props.modelTruncation) { + emitValue = roundFixed(emitValue, format.fraction, format.rounding, plugin) + } + + if (!props.holdZero) { + emitValue = api.getDecimal(emitValue).toString() + } + + if (!stringMode) { + emitValue = Number(emitValue) + } + } + + return { newVal, emitValue } +} + +export const setCurrentValue = ({ api, constants, dispatch, emit, props, state }) => (newVal) => { + const { max, min, allowEmpty, validateEvent, stringMode, plugin } = props + const { format } = state + const oldVal = state.currentValue + const bigNew = api.getDecimal(newVal) + const defaultVal = isFinite(min) ? min : 0 + + let emitValue = bigNew.toString() + + if (equalsDecimal(state.currentValue, newVal)) { + state.userInput = state.currentValue + return + } + + let args = { newVal, emitValue, allowEmpty, defaultVal, bigNew, oldVal } + + Object.assign(args, { max, min, api, props, format, plugin, stringMode }) + + let ret = getEmitValue(args) + + newVal = ret.newVal + emitValue = ret.emitValue + + state.userInput = emitValue + state.lastInput = emitValue + + if (emitValue !== oldVal) { + emit('update:modelValue', emitValue) + emit('change', emitValue, oldVal) + + state.currentValue = emitValue + state.userInput = emitValue + + if (validateEvent && oldVal === '') { + dispatch(constants.COMPONENT_NAME, constants.EVENT_NAME.blur, [state.currentValue]) + } + + if (validateEvent) { + dispatch(constants.COMPONENT_NAME, constants.EVENT_NAME.change, [state.currentValue]) + } + } +} + +export const handleInput = ({ state, api, emit, props }) => (event) => { + const { fraction } = state.format + const emitError = () => { + if (state.pasting) { + emit('paste-error', event.target.value) + } + } + let value = event.target.value.replace(/^-+/, '-') + + if (value !== '-' && api.getDecimal(value).isNaN()) { + emitError() + + if (!(value === '' && props.allowEmpty)) { + value = state.lastInput + } + } else { + value = value + .split('.') + .map((a, i) => { + if (i && a.length > fraction) { + emitError() + } + + return i && state.strictInput && typeof fraction === 'number' ? a.substr(0, fraction) : a + }) + .join('.') + } + + event.target.value = isNull(value) ? '' : value + state.lastInput = value + state.userInput = value + api.setCurrentValue(value === '-' ? 0 : value) +} + +export const handleInputChange = ({ api }) => (event) => { + const value = event.target.value + + api.setCurrentValue(value === '-' ? 0 : value) +} + +export const select = (refs) => () => refs.input.select() + +export const mounted = ({ constants, parent, props, state }) => () => { + const innerInput = parent.$el.querySelector('input') + + innerInput.setAttribute(constants.KEY, constants.VALUE) + innerInput.setAttribute(constants.MAX, props.max) + innerInput.setAttribute(constants.MIN, props.min) + innerInput.setAttribute(constants.VALUENOW, state.currentValue) + innerInput.setAttribute(constants.DISABLED, state.inputDisabled) + + state.onPase = () => { + state.pasting = true + setTimeout(() => (state.pasting = false)) + } + + on(innerInput, 'paste', state.onPase) +} + +export const unmounted = ({ parent, state }) => () => { + const innerInput = parent.$el.querySelector('input') + + off(innerInput, 'paste', state.onPase) +} + +export const updated = ({ constants, parent, state }) => () => { + const innerInput = parent.$el.querySelector('input') + + innerInput && innerInput.setAttribute(constants.VALUENOW, state.currentValue) +} + +export const displayValue = ({ props, state }) => () => { + const { currentValue, inputStatus, userInput } = state + + if (inputStatus) { + return userInput + } + + if (props.allowEmpty && currentValue === '') { + return '' + } + + return formatNumber(currentValue, state.format) +} + +export const getNumPecision = ({ api, props }) => () => { + const stepPrecision = api.getPrecision(props.step) + + if (props.precision !== undefined) { + return props.precision + } else { + return Math.max(api.getPrecision(props.modelValue), stepPrecision) + } +} + +export const mouseEvent = ({ api, props, state }) => (event) => { + if (props.mouseWheel && state.inputStatus) { + let delta = 0 + + if (event.wheelDelta) { + delta = event.wheelDelta / MOUSEDELTA + } + + delta > 0 ? api.increase() : api.decrease() + + return false + } +} + +export const getUnitPrecision = ({ service, props }) => { + let fraction, rounding + const { format = {}, precision, unit } = props + const defaultFmt = { + groupSeparator: '', + decimalSeparator: '.', + zeroize: props.holdZero + } + + const { getUnitPrecision, getNumberFormat } = service + const serFra = getUnitPrecision(unit) || {} + const serFmt = getNumberFormat() || {} + + fraction = isNumber(precision) ? precision : isNumber(format.fraction) ? format.fraction : serFra.fraction + rounding = isNumber(format.rounding) ? format.rounding : serFra.rounding + + return { ...defaultFmt, fraction, rounding, ...serFmt, ...format } +} diff --git a/packages/renderless/src/numeric/vue.ts b/packages/renderless/src/numeric/vue.ts new file mode 100644 index 000000000..a55396e42 --- /dev/null +++ b/packages/renderless/src/numeric/vue.ts @@ -0,0 +1,120 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + watchValue, + toPrecision, + getPrecision, + internalIncrease, + internalDecrease, + focus, + decrease, + handleBlur, + handleFocus, + setCurrentValue, + handleInput, + handleInputChange, + select, + mounted, + updated, + increase, + displayValue, + getNumPecision, + mouseEvent, + getUnitPrecision, + getDecimal, + unmounted, + initService +} from './index' + +export const api = ['state', 'decrease', 'increase', 'handleBlur', 'handleFocus', 'handleInput', 'handleInputChange', 'mouseEvent', 'focus', 'select'] + +const initState = ({ reactive, computed, props, api, $service, parent }) => { + const state = reactive({ + currentValue: props.modelValue, + userInput: props.modelValue, + lastInput: props.modelValue, + inputStatus: false, + decimal: null, + strictInput: computed(() => props.strictInput), + inputSize: computed(() => props.size || state.formSize), + formSize: computed(() => (parent.tinyForm || {}).size), + formDisabled: computed(() => (parent.tinyForm || {}).disabled), + inputDisabled: computed(() => props.disabled || state.formDisabled), + displayValue: computed(() => api.displayValue()), + numPrecision: computed(() => api.getNumPecision()), + + minDisabled: computed(() => (!props.circulate && api.internalDecrease({ val: props.modelValue, step: props.step }) < props.min) || state.formDisabled), + + maxDisabled: computed(() => (!props.circulate && api.internalIncrease({ val: props.modelValue, step: props.step }) > props.max) || state.formDisabled), + + controlsAtRight: computed(() => props.controls && props.controlsPosition === 'right'), + + format: computed(() => getUnitPrecision({ service: $service, props })) + }) + + return state +} + +const initApi = ({ api, props, state, parent, refs, emit, dispatch, constants }) => { + Object.assign(api, { + state, + focus: focus(refs), + select: select(refs), + getPrecision: getPrecision(), + toPrecision: toPrecision(state), + updated: updated({ constants, parent, props, refs, state }), + mounted: mounted({ constants, parent, props, refs, state }), + unmounted: unmounted({ parent, state }), + getDecimal: getDecimal(props), + handleFocus: handleFocus({ emit, state, props, api }), + decrease: decrease({ api, props, state }), + increase: increase({ api, props, state }), + handleInput: handleInput({ state, api, emit, props }), + getNumPecision: getNumPecision({ api, props }), + displayValue: displayValue({ props, state }), + internalDecrease: internalDecrease({ api, state }), + internalIncrease: internalIncrease({ api, state }), + handleInputChange: handleInputChange({ api }), + mouseEvent: mouseEvent({ api, props, state }), + handleBlur: handleBlur({ constants, dispatch, emit, props, state, api }), + watchValue: watchValue({ api, state }), + setCurrentValue: setCurrentValue({ api, constants, dispatch, emit, props, state }) + }) + + api.getDecimal(0) +} + +const initWatch = ({ watch, props, api }) => { + watch(() => props.modelValue, api.watchValue, { immediate: true }) +} + +export const renderless = ( + props, + { computed, onMounted, onUpdated, onUnmounted, reactive, watch, inject }, + { parent, emit, refs, constants, dispatch, service } +) => { + const api = {} + const $service = initService(service) + const state = initState({ reactive, computed, props, api, $service, parent }) + + parent.tinyForm = parent.tinyForm || inject('form', null) + + initApi({ api, props, state, parent, refs, emit, dispatch, constants }) + initWatch({ watch, props, api }) + + onMounted(api.mounted) + onUpdated(api.updated) + onUnmounted(api.unmounted) + + return api +} diff --git a/packages/renderless/src/option-group/index.ts b/packages/renderless/src/option-group/index.ts new file mode 100644 index 000000000..ab8df05db --- /dev/null +++ b/packages/renderless/src/option-group/index.ts @@ -0,0 +1,23 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const queryChange = ({ select, state, vm }) => () => { + state.visible = true + + if (Array.isArray(select.state.options)) { + const groupOptions = select.state.options.filter((option) => option.state.parent && vm && option.state.parent.label === vm.label) + + if (Array.isArray(groupOptions)) { + state.visible = groupOptions.some((option) => option.visible === true) + } + } +} diff --git a/packages/renderless/src/option-group/vue.ts b/packages/renderless/src/option-group/vue.ts new file mode 100644 index 000000000..d743a956c --- /dev/null +++ b/packages/renderless/src/option-group/vue.ts @@ -0,0 +1,47 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { queryChange } from './index' + +export const api = ['state', 'queryChange'] + +export const renderless = (props, { onMounted, reactive, watch, inject }, { broadcast, vm }) => { + const select = inject('select') + const constants = select._constants + + const state = reactive({ + visible: true + }) + + const api = { + state, + queryChange: queryChange({ select, state, vm }) + } + + watch( + () => props.disabled, + (value) => { + broadcast(constants.COMPONENT_NAME.Option, constants.EVENT_NAME.handleGroupDisabled, value) + }, + { immediate: true } + ) + + onMounted(() => { + if (props.disabled) { + broadcast(constants.COMPONENT_NAME.Option, constants.EVENT_NAME.handleGroupDisabled, props.disabled) + } + + select.state.selectEmitter.on(constants.EVENT_NAME.queryChange, api.queryChange) + }) + + return api +} diff --git a/packages/renderless/src/option/index.ts b/packages/renderless/src/option/index.ts new file mode 100644 index 000000000..fb7156b90 --- /dev/null +++ b/packages/renderless/src/option/index.ts @@ -0,0 +1,64 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getObj } from '@opentiny/vue-renderless/common/object' + +const escapeRegexpString = (value = '') => String(value).replace(/[|\\{}()[\]^$+*?.]/g, '\\$&') + +export const isEqual = ({ select, state }) => (a, b) => { + if (!state.isObject) { + return a === b + } else { + const valueKey = select.valueKey + return getObj(a, valueKey) === getObj(b, valueKey) + } +} + +export const contains = ({ select, state }) => (arr = [], target = null) => { + if (!state.isObject) { + return arr && arr.includes(target) + } else { + const valueKey = select.valueKey + + return arr && arr.some((item) => getObj(item, valueKey) === getObj(target, valueKey)) + } +} + +export const handleGroupDisabled = (state) => (val) => { + state.groupDisabled = val +} + +export const hoverItem = ({ select, props, state, vm }) => () => { + if (!props.disabled && !state.groupDisabled) { + select.state.hoverIndex = select.state.options.indexOf(vm) + } +} + +export const selectOptionClick = ({ props, state, select, constants, vm }) => () => { + if (props.disabled !== true && state.groupDisabled !== true) { + select.state.selectEmitter.emit(constants.EVENT_NAME.handleOptionClick, vm, true) + } +} + +export const queryChange = ({ select, props, state }) => (query) => { + state.visible = new RegExp(escapeRegexpString(query), 'i').test(state.currentLabel) || props.created + + select.state.filteredOptionsCount += state.visible ? 1 : -1 +} + +export const toggleEvent = ({ props, refs, type }) => { + const optionEl = refs.option + + Object.keys(props.events).forEach((ev) => { + optionEl[type + 'EventListener'](ev, props.events[ev]) + }) +} diff --git a/packages/renderless/src/option/vue.ts b/packages/renderless/src/option/vue.ts new file mode 100644 index 000000000..faed0d408 --- /dev/null +++ b/packages/renderless/src/option/vue.ts @@ -0,0 +1,133 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { isEqual, contains, handleGroupDisabled, hoverItem, selectOptionClick, queryChange, toggleEvent } from './index' + +export const api = ['state', 'visible', 'hoverItem', 'selectOptionClick'] + +const initState = ({ reactive, computed, props, api, markRaw, select, parent }) => { + const state = reactive({ + parent: markRaw(parent), + created: computed(() => props.created), + index: -1, + select: markRaw(select), + hover: false, + visible: true, + hitState: false, + groupDisabled: false, + disabled: computed(() => props.disabled), + isObject: computed(() => Object.prototype.toString.call(props.value).toLowerCase() === '[object object]'), + currentLabel: computed(() => props.label || (state.isObject ? '' : props.value)), + currentValue: computed(() => props.value || props.label || ''), + itemSelected: computed(() => { + if (!select.multiple) { + return api.isEqual(props.value, select.modelValue) + } else { + return api.contains(select.modelValue, props.value) + } + }), + + limitReached: computed(() => { + if (select.multiple) { + const multipleLimit = select.state.multipleLimit + return !state.itemSelected && (select.modelValue || []).length >= multipleLimit && multipleLimit > 0 + } else { + return false + } + }), + + selectCls: computed(() => (state.itemSelected ? 'checked-sur' : 'check')) + }) + + return state +} + +const initApi = ({ api, props, state, select, constants, vm }) => { + Object.assign(api, { + state, + isEqual: isEqual({ select, state }), + contains: contains({ select, state }), + hoverItem: hoverItem({ select, vm, props, state }), + queryChange: queryChange({ select, props, state }), + selectOptionClick: selectOptionClick({ constants, vm, props, state, select }), + handleGroupDisabled: handleGroupDisabled(state) + }) +} + +const initWatch = ({ watch, props, state, select, constants }) => { + watch( + () => state.currentLabel, + () => { + if (!props.created && !select.remote) { + select.state.selectEmitter.emit(constants.EVENT_NAME.setSelected) + } + } + ) + + watch( + () => props.value, + (value, oldVal) => { + const { remote, valueKey } = select + + if (!props.created && !remote) { + if (valueKey && typeof value === 'object' && typeof oldVal === 'object' && value[valueKey] === oldVal[valueKey]) { + return + } + + select.state.selectEmitter.emit(constants.EVENT_NAME.setSelected) + } + } + ) +} + +const initOnMounted = ({ onMounted, props, api, vm, state, refs, constants, select }) => { + onMounted(() => { + state.el = vm.$el + + toggleEvent({ props, refs, type: 'add' }) + select.state.selectEmitter.on(constants.EVENT_NAME.queryChange, api.queryChange) + }) +} + +const initOnBeforeUnmount = ({ onBeforeUnmount, props, select, refs, vm }) => { + onBeforeUnmount(() => { + const index = select.state.cachedOptions.indexOf(vm) + + toggleEvent({ props, refs, type: 'remove' }) + + if (index === -1) { + select.state.cachedOptions.splice(index, 1) + } + + select.onOptionDestroy(select.state.options.indexOf(vm)) + }) +} + +export const renderless = (props, { computed, onMounted, onBeforeUnmount, reactive, watch, inject, markRaw }, { vm, refs, parent }) => { + const api = {} + const select = inject('select') + const constants = select._constants + const state = initState({ reactive, computed, props, api, markRaw, select, parent }) + + initApi({ api, props, state, select, constants, vm }) + initWatch({ watch, props, state, select, constants }) + initOnMounted({ onMounted, props, api, vm, state, refs, constants, select }) + initOnBeforeUnmount({ onBeforeUnmount, props, select, refs, vm }) + + select.state.options.push(markRaw(vm)) + select.state.cachedOptions.push(markRaw(vm)) + select.state.optionsCount++ + select.state.filteredOptionsCount++ + vm.$on(constants.EVENT_NAME.handleGroupDisabled, api.handleGroupDisabled) + + return api +} diff --git a/packages/renderless/src/pager-item/index.ts b/packages/renderless/src/pager-item/index.ts new file mode 100644 index 000000000..e03bc810c --- /dev/null +++ b/packages/renderless/src/pager-item/index.ts @@ -0,0 +1,139 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const getPages = ({ props, state }) => () => { + const pagerCount = props.pagerCount + const halfPagerCount = (pagerCount - 1) / 2 + const currentPage = Number(props.currentPage) + const pageCount = Number(props.pageCount) + let showPrevMore = false + let showNextMore = false + + if (pageCount > pagerCount) { + if (currentPage < pageCount - halfPagerCount) { + showNextMore = true + } + + if (currentPage > pagerCount - halfPagerCount) { + showPrevMore = true + } + } + + const pages = [] + + if (showPrevMore && !showNextMore) { + const startPage = pageCount - (pagerCount - 2) + + for (let i = startPage; i < pageCount; i++) { + pages.push(i) + } + } else if (!showPrevMore && showNextMore) { + for (let i = 2; i < pagerCount; i++) { + pages.push(i) + } + } else if (showPrevMore && showNextMore) { + const offset = Math.floor(pagerCount / 2) - 1 + + for (let i = currentPage - offset; i <= currentPage + offset; i++) { + pages.push(i) + } + } else { + for (let i = 2; i < pageCount; i++) { + pages.push(i) + } + } + + state.showPrevMore = showPrevMore + state.showNextMore = showNextMore + + return pages +} + +const getClassListVal = (parentNode) => { + let classListVal = [] + const classList = parentNode.classList + + if (classList) { + let index = 0 + + for (const key in classList) { + if (Object.prototype.hasOwnProperty.call(classList, key) && typeof Number(key) === 'number') { + classListVal[index] = classList[key] + index++ + } + } + } else { + classListVal = parentNode.className.split(/\s+/) + } + + return classListVal +} + +export const onPagerClick = ({ emit, props, vm }) => (event) => { + const target = event.target + + if (target.tagName === 'UL' || props.disabled) { + return + } + + let newPage = Number(event.target.textContent) + const { tagName, parentNode } = target + const parentEl = tagName === 'LI' ? target : tagName === 'svg' ? parentNode : parentNode.parentNode + const pageCount = props.pageCount + const currentPage = props.currentPage + const pagerCountOffset = props.pagerCount - 2 + const classListVal = getClassListVal(parentEl) + + if (classListVal.includes('dot')) { + if (classListVal.includes('quickprev')) { + newPage = currentPage - pagerCountOffset + } else if (classListVal.includes('quicknext')) { + newPage = currentPage + pagerCountOffset + } + } + + /* istanbul ignore if */ + if (!isNaN(newPage)) { + if (newPage < 1) { + newPage = 1 + } + + if (newPage > pageCount) { + newPage = pageCount + } + } + + const callback = () => { + if (newPage !== currentPage) { + emit('change', newPage) + } + } + + if (props.isBeforePageChange && newPage !== currentPage) { + let params = { newPage, currentPage, callback } + vm.$parent.beforePagerChangeHandler(params) + } else { + callback() + } +} + +export const onMouseenter = ({ props, state }) => (direction) => { + if (props.disabled) { + return + } + + if (direction === 'left') { + state.quickprevIconClass = props.doubleLeftIcon + } else { + state.quicknextIconClass = props.doubleRightIcon + } +} diff --git a/packages/renderless/src/pager-item/vue.ts b/packages/renderless/src/pager-item/vue.ts new file mode 100644 index 000000000..152e9acce --- /dev/null +++ b/packages/renderless/src/pager-item/vue.ts @@ -0,0 +1,58 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getPages, onPagerClick, onMouseenter } from './index' + +export const api = ['state', 'onPagerClick', 'onMouseenter'] + +export const renderless = (props, { computed, reactive, watch }, { emit, vm }) => { + const api = { + onPagerClick: onPagerClick({ emit, props, vm }) + } + + const state = reactive({ + current: null, + showPrevMore: false, + showNextMore: false, + quicknextIconClass: props.popupIcon, + quickprevIconClass: props.popupIcon, + pagers: computed(() => api.getPages()) + }) + + Object.assign(api, { + state, + getPages: getPages({ props, state }), + onMouseenter: onMouseenter({ props, state }) + }) + + watch( + () => state.showPrevMore, + (value) => { + if (!value) { + state.quickprevIconClass = props.popupIcon + } + }, + { immediate: true } + ) + + watch( + () => state.showNextMore, + (value) => { + if (!value) { + state.quicknextIconClass = props.popupIcon + } + }, + { immediate: true } + ) + + return api +} diff --git a/packages/renderless/src/panel/index.ts b/packages/renderless/src/panel/index.ts new file mode 100644 index 000000000..98997cc28 --- /dev/null +++ b/packages/renderless/src/panel/index.ts @@ -0,0 +1,37 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { emitEvent } from '@opentiny/vue-renderless/common/event' + +export const toggle = ({ api, state }) => () => { + state.isShow ? api.collapse() : api.expand() +} + +export const expand = ({ emit, state }) => () => { + if (!emitEvent(emit, 'before-expand')) { + return + } + + state.isShow = true + + emit('expand', true) +} + +export const collapse = ({ emit, state }) => () => { + if (!emitEvent(emit, 'before-collapse')) { + return + } + + state.isShow = false + + emit('collapse', false) +} diff --git a/packages/renderless/src/panel/vue.ts b/packages/renderless/src/panel/vue.ts new file mode 100644 index 000000000..e20fce2f8 --- /dev/null +++ b/packages/renderless/src/panel/vue.ts @@ -0,0 +1,31 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { collapse, expand, toggle } from './index' + +export const api = ['state', 'toggle'] + +export const renderless = (props, { reactive }, { emit }) => { + const api = {} + const state = reactive({ + isShow: props.expand + }) + + Object.assign(api, { + state, + collapse: collapse({ emit, state }), + expand: expand({ emit, state }), + toggle: toggle({ api, state }) + }) + + return api +} diff --git a/packages/renderless/src/picker-column/index.ts b/packages/renderless/src/picker-column/index.ts new file mode 100644 index 000000000..3e368e3aa --- /dev/null +++ b/packages/renderless/src/picker-column/index.ts @@ -0,0 +1,269 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' + +export const computedWrapperStyle = (state) => () => { + const wrapperStyle = { + transform: `translate3d(0, ${state.offset + state.baseOffset}px, 0)`, + transitionDuration: `${state.duration}ms`, + transitionProperty: state.duration ? 'all' : 'none', + lineHeight: `${state.itemHeight}px` + } + + return wrapperStyle +} + +export const computedBaseOffset = ({ state, props }) => () => (state.itemHeight * (props.visibleItemCount - 1)) / 2 + +export const onClickItem = ({ api, state }) => (index) => { + if (state.moving) { + return + } + + state.duration = state.defaultDuration + api.setIndex(index, true) +} + +export const setIndex = ({ api, state, emit }) => (index, emitChange) => { + index = api.adjustIndex(index) || 0 + + const offset = -index * state.itemHeight + + const trigger = () => { + if (index !== state.currentIndex) { + state.currentIndex = index + + if (emitChange) { + emit('change', index) + } + } + } + + if (state.moving && offset !== state.offset) { + state.transitionEndTrigger = trigger + } + + trigger() + state.offset = offset +} + +const range = (num, min, max) => Math.min(Math.max(num, min), max) + +const isOptionDisabled = (option) => option !== null && typeof option === 'object' && option.disabled + +export const adjustIndex = (state) => (index) => { + index = range(index, 0, state.count) + + for (let i = index; i < state.count; i++) { + if (!isOptionDisabled(state.columnsItem.values[i])) { + return i + } + } + + for (let i = index - 1; i >= 0; i--) { + if (!isOptionDisabled(state.columnsItem.values[i])) { + return i + } + } +} + +export const onTouchstart = ({ refs, state }) => (event) => { + state.direction = '' + state.deltaX = 0 + state.deltaY = 0 + state.offsetX = 0 + state.offsetY = 0 + state.startX = event.touches[0].clientX + state.startY = event.touches[0].clientY + + if (state.moving) { + const style = window.getComputedStyle(refs.track) + const transform = style.transform || style.webkitTransform + const translateY = Number(transform.slice(7, transform.length - 1).split(', ')[5]) + + state.offset = Math.min(0, translateY - state.baseOffset) + state.startOffset = state.offset + } else { + state.startOffset = state.offset + } + + state.duration = 0 + state.transitionEndTrigger = null + state.touchStartTime = Date.now() + state.momentumOffset = state.startOffset +} + +const getDirection = (x, y) => { + const MIN_DISTANCE = 10 + + if (x > y && x > MIN_DISTANCE) { + return 'horizontal' + } + + if (y > x && y > MIN_DISTANCE) { + return 'vertical' + } + + return '' +} + +export const onTouchmove = ({ state }) => (event) => { + const touch = event.touches[0] + + state.deltaX = touch.clientX - state.startX + state.deltaY = touch.clientY - state.startY + state.offsetX = Math.abs(state.deltaX) + state.offsetY = Math.abs(state.deltaY) + state.direction = state.direction || getDirection(state.offsetX, state.offsetY) + + if (state.direction === 'vertical') { + state.moving = true + } + + state.offset = range(state.startOffset + state.deltaY, -(state.count * state.itemHeight), state.itemHeight) + + const now = Date.now() + + if (now - state.touchStartTime > state.momentumLimitTime) { + state.touchStartTime = now + state.momentumOffset = state.offset + } +} + +export const onTouchend = ({ api, state }) => () => { + const distance = state.offset - state.momentumOffset + const duration = Date.now() - state.touchStartTime + const allowMomentum = duration < state.momentumLimitTime && Math.abs(distance) > state.momentumLimitDistance + + if (allowMomentum) { + api.momentum(distance, duration) + return + } + + const index = range(Math.round(-state.offset / state.itemHeight), 0, state.count - 1) + + state.duration = state.defaultDuration + api.setIndex(index, true) + + setTimeout(() => { + state.moving = false + }, 0) +} + +export const mountedHandler = ({ api, refs, state }) => () => { + const track = refs.track + + on(track, 'touchstart', api.onTouchstart) + on(track, 'touchmove', api.onTouchmove) + on(track, 'touchend', api.onTouchend) + + state.clumnsWrapHeight = state.itemHeight * state.visibleItemCount + + state.maskStyle = { + backgroundSize: `100% ${(state.clumnsWrapHeight - state.itemHeight) / 2}px` + } +} + +export const beforeUnmountHandler = ({ api, refs }) => () => { + const track = refs.track + + off(track, 'touchstart', api.onTouchstart) + off(track, 'touchmove', api.onTouchmove) + off(track, 'touchend', api.onTouchend) +} + +export const momentum = ({ api, state, props }) => (distance, duration) => { + const speed = Math.abs(distance / duration) + + distance = state.offset + (speed / 0.002) * (distance < 0 ? -1 : 1) + + const index = range(Math.round(-distance / state.itemHeight), 0, state.count - 1) + + state.duration = Number(props.swipeDuration) + api.setIndex(index, true) +} + +export const onTransitionEnd = (state) => () => { + state.moving = false + state.duration = 0 + + if (state.transitionEndTrigger) { + state.transitionEndTrigger() + state.transitionEndTrigger = null + } +} + +export const setValue = ({ api, state }) => (value) => { + const { columnsItem } = state + const values = columnsItem.values + + for (let i = 0; i < values.length; i++) { + if (api.getOptionText(values[i]) === value) { + return api.setIndex(i) + } + } +} + +export const getOptionText = ({ state, props }) => (option) => { + if (option !== null && typeof option === 'object' && props.valueKey in option) { + return option[state.valueKey] + } + + return option +} + +export const getValue = (state) => () => state.columnsItem.values[state.currentIndex] + +let deepAssign + +const assignKey = (to, from, key) => { + const { hasOwnProperty } = Object.prototype + const val = from[key] + + if (val === undefined || val === null) { + return + } + + if (!hasOwnProperty.call(to, key) || typeof val !== 'object') { + to[key] = val + } else { + to[key] = deepAssign(Object(to[key]), from[key]) + } +} + +deepAssign = (to, from) => { + Object.keys(from).forEach((key) => { + assignKey(to, from, key) + }) + + return to +} + +export const deepClone = (obj) => { + if (Array.isArray(obj)) { + return obj.map((item) => deepClone(item)) + } + + if (typeof obj === 'object') { + return deepAssign({}, obj) + } + + return obj +} + +export const setOptions = ({ api, state, props }) => (options) => { + if (JSON.stringify(options) !== JSON.stringify(state.columnsItem.values)) { + state.columnsItem.values = deepClone(options) + api.setIndex(props.defaultIndex) + } +} diff --git a/packages/renderless/src/picker-column/vue.ts b/packages/renderless/src/picker-column/vue.ts new file mode 100644 index 000000000..3016a832e --- /dev/null +++ b/packages/renderless/src/picker-column/vue.ts @@ -0,0 +1,124 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + computedWrapperStyle, + computedBaseOffset, + onClickItem, + setIndex, + adjustIndex, + mountedHandler, + momentum, + onTransitionEnd, + getOptionText, + setValue, + getValue, + setOptions, + deepClone, + beforeUnmountHandler, + onTouchstart, + onTouchmove, + onTouchend +} from './index' + +export const api = ['state', 'onClickItem', 'onTransitionEnd', 'setValue', 'getValue', 'setOptions', 'setIndex'] + +const initState = ({ reactive, computed, props, api }) => { + const state = reactive({ + columnsItem: props.columnsItem, + columnsItemArr: props.columnsItem.values, + currentIndex: props.defaultIndex, + itemHeight: props.itemHeight, + visibleItemCount: props.visibleItemCount, + offset: 0, + duration: 0, + startOffset: 0, + moving: false, + defaultDuration: 200, + momentumLimitTime: 300, + momentumLimitDistance: 15, + touchStartTime: null, + momentumOffset: 0, + direction: '', + deltaX: 0, + deltaY: 0, + offsetX: 0, + offsetY: 0, + count: props.columnsItem.values.length, + transitionEndTrigger: null, + clumnsWrapHeight: null, + maskStyle: null, + wrapperStyle: computed(() => api.computedWrapperStyle()), + baseOffset: computed(() => api.computedBaseOffset()) + }) + + return state +} + +const initApi = ({ api, props, state, refs, emit }) => { + Object.assign(api, { + state, + getValue: getValue(state), + adjustIndex: adjustIndex(state), + onTouchmove: onTouchmove({ state }), + onTouchstart: onTouchstart({ state }), + getOptionText: getOptionText({ state, props }), + onTransitionEnd: onTransitionEnd(state), + computedBaseOffset: computedBaseOffset({ state, props }), + computedWrapperStyle: computedWrapperStyle(state), + setValue: setValue({ api, state }), + onTouchend: onTouchend({ api, state }), + setOptions: setOptions({ api, state, props }), + momentum: momentum({ api, state, props }), + setIndex: setIndex({ api, state, emit }), + onClickItem: onClickItem({ api, state }), + mountedHandler: mountedHandler({ api, state, refs }), + beforeUnmountHandler: beforeUnmountHandler({ api, refs }) + }) +} + +const initWatch = ({ watch, props, state, api }) => { + watch(() => props.defaultIndex, api.setIndex, { immediate: true }) + + watch( + () => props.columnsItem, + (value) => { + state.columnsItem = value + }, + { immediate: true } + ) + + watch( + () => props.columnsItem.values, + (value) => { + state.count = value.length + }, + { immediate: true } + ) +} + +export const renderless = (props, { computed, onMounted, reactive, watch, onBeforeUnmount }, { emit, refs }) => { + const api = {} + const state = initState({ reactive, computed, props, api }) + + initApi({ api, props, state, refs, emit }) + + api.setIndex(state.currentIndex) + state.columnsItem = deepClone(props.columnsItem) + + initWatch({ watch, props, state, api }) + + onMounted(api.mountedHandler) + onBeforeUnmount(api.beforeUnmountHandler) + + return api +} diff --git a/packages/renderless/src/picker/index.ts b/packages/renderless/src/picker/index.ts new file mode 100644 index 000000000..9d543b64d --- /dev/null +++ b/packages/renderless/src/picker/index.ts @@ -0,0 +1,945 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { toDate, getDateWithNewTimezone, getStrTimezone, getLocalTimezone } from '@opentiny/vue-renderless/common/date' +import { isNumber, isDate } from '@opentiny/vue-renderless/common/type' +import userPopper from '@opentiny/vue-renderless/common/deps/vue-popper' +import { DATEPICKER } from '@opentiny/vue-renderless/common' +import { formatDate, parseDate, isDateObject, getWeekNumber } from '@opentiny/vue-renderless/common/deps/date-util' +import { extend } from '@opentiny/vue-renderless/common/object' +import globalTimezone from '@opentiny/vue-renderless/picker/timezone' + +const iso8601Reg = /^\d{4}-\d{2}-\d{2}(.)\d{2}:\d{2}:\d{2}(.+)$/ + +export const getPanel = ({ DatePanel, DateRangePanel, MonthRangePanel, TimePanel, TimeRangePanel, TimeSelect }) => (type) => { + if (type === DATEPICKER.DateRange || type === DATEPICKER.DateTimeRange) { + return DateRangePanel + } else if (type === DATEPICKER.MonthRange) { + return MonthRangePanel + } else if (type === DATEPICKER.TimeRange) { + return TimeRangePanel + } else if (type === DATEPICKER.Time) { + return TimePanel + } else if (type === DATEPICKER.TimeSelect) { + return TimeSelect + } + + return DatePanel +} + +export const watchPickerVisible = ({ api, vm, dispatch, emit, props, state }) => (value) => { + if (props.readonly || state.pickerDisabled) { + return + } + + if (value) { + api.showPicker() + + state.valueOnOpen = Array.isArray(props.modelValue) ? [...props.modelValue] : props.modelValue + } else { + api.hidePicker() + api.emitChange(props.modelValue) + state.userInput = null + + if (props.validateEvent) { + dispatch('FormItem', 'form.blur') + } + + emit('blur', vm) + api.blur() + } +} + +export const getValueEmpty = (props) => () => { + const modelValue = props.modelValue + + if (Array.isArray(modelValue)) { + for (let i = 0, len = modelValue.length; i < len; i++) { + if (modelValue[i]) { + return false + } + } + } else { + if (modelValue) { + return false + } + } + + return true +} + +export const getMode = ({ state }) => () => { + if (state.type === DATEPICKER.Week) { + return DATEPICKER.Week + } else if (state.type === DATEPICKER.Month) { + return DATEPICKER.Month + } else if (state.type === DATEPICKER.Year) { + return DATEPICKER.Year + } else if (state.type === DATEPICKER.Dates) { + return DATEPICKER.Dates + } + + return DATEPICKER.Day +} + +export const formatAsFormatAndType = ({ api }) => (value, customFormat, type) => { + if (!value) { + return null + } + + const formatter = (api.typeValueResolveMap()[type] || api.typeValueResolveMap().default).formatter + const format = customFormat || DATEPICKER.DateFormats[type] + + return formatter(value, format) +} + +export const displayValue = ({ api, props, state }) => () => { + const formattedValue = api.formatAsFormatAndType(state.parsedValue, state.format, state.type, props.rangeSeparator) + + if (Array.isArray(state.userInput)) { + return [state.userInput[0] || (formattedValue && formattedValue[0]) || '', state.userInput[1] || (formattedValue && formattedValue[1]) || ''] + } else if (state.userInput !== null) { + return state.userInput + } else if (formattedValue) { + return state.type === DATEPICKER.Dates ? formattedValue.join(', ') : formattedValue + } + + return '' +} + +export const parseAsFormatAndType = ({ api }) => (value, customFormat, type, rangeSeparator = '-') => { + if (!value) { + return null + } + + const parser = (api.typeValueResolveMap()[type] || api.typeValueResolveMap().default).parser + const format = customFormat || DATEPICKER.DateFormats[type] + + return parser(value, format, rangeSeparator) +} + +export const parsedValue = ({ api, props, state, t }) => () => { + if (!props.modelValue) { + return props.modelValue + } + if (state.type === DATEPICKER.TimeSelect) { + return props.modelValue + } + + const valueIsDateObject = isDateObject(props.modelValue) || (Array.isArray(props.modelValue) && props.modelValue.every(isDateObject)) + + const { from, to, isServiceTimezone } = state.timezone + + if (valueIsDateObject && !isServiceTimezone) { + return props.modelValue + } + + if (state.valueFormat) { + let date = props.modelValue + + if (isServiceTimezone) { + if (Array.isArray(date)) { + date = [].concat(date).map((item) => (isDate(item) ? formatDate(item, state.valueFormat, t) : item)) + } else { + date = formatDate(date, state.valueFormat, t) + } + } + + const result = api.parseAsFormatAndType(date, state.valueFormat, state.type, props.rangeSeparator) + + if (Array.isArray(result)) { + return result.map((date) => getDateWithNewTimezone(date, from, to)) + } + + return getDateWithNewTimezone(result || props.modelValue, from, to) + } + + const trans = (value) => (typeof value === 'string' || isNumber(value) ? toDate(value) : value) + const values = [].concat(props.modelValue).map((val) => getDateWithNewTimezone(trans(val), from, to)) + + return values.length > 1 ? values : values[0] +} + +export const getTimezone = ({ props, utils }) => () => { + const { dbTimezone, timezone, isutc8, type = 'date', iso8601 } = props + const setting = utils.getDateFormat && utils.getDateFormat() + const { DbTimezone, Timezone } = setting || {} + const cur = getLocalTimezone() + const isTzNumber = (z) => typeof z === 'number' && z >= -12 && z <= 12 + + if (!~type.indexOf('datetime')) { + return { from: cur, to: cur } + } + + let serveTimezone = isTzNumber(dbTimezone) ? dbTimezone : isTzNumber(DbTimezone) ? DbTimezone : cur + let clientTimezone = isTzNumber(timezone) ? timezone : isTzNumber(Timezone) ? Timezone : cur + const value = props.modelValue + const str = (Array.isArray(value) ? value[0] : value) || '' + const match = typeof str === 'string' && str.match(/(-|\+)(\d{2}):?(\d{2})$/) + + if ((iso8601 || setting) && match) { + serveTimezone = getStrTimezone(str) + } + + return { + from: serveTimezone, + to: isutc8 ? 8 : clientTimezone, + isServiceTimezone: !!setting + } +} + +const nullOrString = (value) => { + const arr = Array.isArray(value) ? value : [value] + return arr.every((val) => (!val && !isNumber(val)) || typeof val === 'string') +} + +export const getValueFormat = ({ props, utils }) => { + const { valueFormat, iso8601, modelValue: value, type = 'date' } = props + const setting = utils.getDateFormat && utils.getDateFormat() + let suffix = '' + let separator = ' ' + + if (!valueFormat && ~type.indexOf('datetime') && (iso8601 || setting) && nullOrString(value)) { + const str = (Array.isArray(value) ? value[0] : value) || '' + const match = str.match(iso8601Reg) + + if (match && match.length === 3) { + suffix = match[2] || '' + separator = match[1] + } + + return `yyyy-MM-dd${separator}HH:mm:ss${suffix}` + } + + return valueFormat +} + +export const dateFormatter = ({ t }) => (value, format) => { + if (format === DATEPICKER.TimesTamp) { + return value.getTime() + } + return formatDate(value, format, t) +} + +export const dateParser = ({ t }) => (text, format) => { + if (format === DATEPICKER.TimesTamp) { + return new Date(Number(text)) + } + return parseDate(text, format, t) +} + +export const rangeFormatter = (api) => (value, format) => { + if (Array.isArray(value) && value.length === 2) { + const start = value[0] + const end = value[1] + + if (start && end) { + return [api.dateFormatter(start, format), api.dateFormatter(end, format)] + } + } + + return '' +} + +export const rangeParser = (api) => (array, format, separator) => { + if (!Array.isArray(array)) { + array = array.split(separator) + } + + if (array.length === 2) { + const range1 = array[0] + const range2 = array[1] + + return [api.dateParser(range1, format), api.dateParser(range2, format)] + } + + return [] +} + +export const getWeekData = (value) => { + const valueday = new Date(value).getDay() + let newDate = new Date(value) + + if (valueday >= 2) { + newDate.setTime(new Date(value).getTime() - (valueday - 1) * 86400000) + } else if (valueday === 0) { + newDate.setTime(new Date(value).getTime() + (valueday + 1) * 86400000) + } + + return newDate +} + +const getDefaultOfTypeValueResolveMap = () => ({ + formatter(value) { + return value ? String(value) : '' + }, + parser(text) { + return text === undefined || text === '' ? null : text + } +}) + +const getWeekOfTypeValueResolveMap = ({ t, api }) => ({ + formatter(value, format) { + const weekDate = getWeekData(value) + let week = getWeekNumber(weekDate) + let month = weekDate.getMonth() + const trueDate = new Date(weekDate) + + if (week === 1 && month === 11) { + trueDate.setHours(0, 0, 0, 0) + trueDate.setDate(trueDate.getDate() + 3 - ((trueDate.getDay() + 6) % 7)) + } + + let date = formatDate(trueDate, format, t) + + date = /WW/.test(date) ? date.replace(/WW/, week < 10 ? '0' + week : week) : date.replace(/W/, week) + + return date + }, + parser(text, format) { + return api.typeValueResolveMap().date.parser(text, format) + } +}) + +const getNumberOfTypeValueResolveMap = () => ({ + formatter(value) { + return value ? String(value) : '' + }, + parser(text) { + let result = Number(text) + + return !isNaN(text) ? result : null + } +}) + +const getDatesOfTypeValueResolveMap = (api) => ({ + formatter(value, format) { + return value.map((date) => api.dateFormatter(date, format)) + }, + parser(value, format) { + return (typeof value === 'string' ? value.split(', ') : value).map((date) => (date instanceof Date ? date : api.dateParser(date, format))) + } +}) + +export const typeValueResolveMap = ({ api, t }) => () => ({ + default: getDefaultOfTypeValueResolveMap(), + week: getWeekOfTypeValueResolveMap({ t, api }), + date: { formatter: api.dateFormatter, parser: api.dateParser }, + datetime: { formatter: api.dateFormatter, parser: api.dateParser }, + daterange: { formatter: api.rangeFormatter, parser: api.rangeParser }, + monthrange: { formatter: api.rangeFormatter, parser: api.rangeParser }, + datetimerange: { formatter: api.rangeFormatter, parser: api.rangeParser }, + timerange: { formatter: api.rangeFormatter, parser: api.rangeParser }, + time: { formatter: api.dateFormatter, parser: api.dateParser }, + month: { formatter: api.dateFormatter, parser: api.dateParser }, + year: { formatter: api.dateFormatter, parser: api.dateParser }, + number: getNumberOfTypeValueResolveMap(), + dates: getDatesOfTypeValueResolveMap(api) +}) + +export const firstInputId = ({ props, state }) => () => { + const obj = {} + let id + + if (state.ranged) { + id = props.id && props.id[0] + } else { + id = props.id + } + + if (id) { + obj.id = id + } + + return obj +} + +export const secondInputId = ({ props, state }) => () => { + const obj = {} + let id + + if (state.ranged) { + id = props.id && props.id[1] + } + + if (id) { + obj.id = id + } + + return obj +} + +export const focus = ({ api, props, refs }) => () => (!props.ranged ? refs.reference.focus() : api.handleFocus()) + +export const blur = (state) => () => state.refInput.forEach((input) => input.blur()) + +export const parseValue = ({ api, props, state }) => (value) => { + const isParsed = isDateObject(value) || (Array.isArray(value) && value.every(isDateObject)) + + if (state.valueFormat && !isParsed) { + return api.parseAsFormatAndType(value, state.valueFormat, state.type, props.rangeSeparator) || value + } + + return value +} + +export const formatToValue = ({ api, props, state }) => (date) => { + const isFormattable = isDateObject(date) || (Array.isArray(date) && date.every(isDateObject)) + + if (state.valueFormat && isFormattable) { + return api.formatAsFormatAndType(date, state.valueFormat, state.type, props.rangeSeparator) + } + + return date +} + +export const parseString = ({ api, state }) => (value) => { + const type = Array.isArray(value) ? state.type : state.type.replace(DATEPICKER.Range, '') + return api.parseAsFormatAndType(value, state.format, type) +} + +export const formatToString = ({ api, state }) => (value) => { + const type = Array.isArray(value) ? state.type : state.type.replace(DATEPICKER.Range, '') + return api.formatAsFormatAndType(value, state.format, type) +} + +export const handleMouseEnter = ({ props, state }) => () => { + if (props.readonly || state.pickerDisabled) { + return + } + + if (!state.valueIsEmpty && props.clearable) { + state.showClose = true + } +} + +export const handleChange = ({ api, state }) => () => { + if (state.userInput) { + const value = api.parseString(state.displayValue) + + if (value) { + state.picker.state.value = value + + if (api.isValidValue(value)) { + api.emitInput(value) + state.userInput = null + } + } + } + + if (state.userInput === '') { + api.emitInput(null) + api.emitChange(null) + state.userInput = null + } +} + +export const handleStartInput = (state) => (event) => { + if (state.userInput) { + state.userInput = [event.target.value, state.userInput[1]] + } else { + state.userInput = [event.target.value, null] + } +} + +export const handleEndInput = (state) => (event) => { + if (state.userInput) { + state.userInput = [state.userInput[0], event.target.value] + } else { + state.userInput = [null, event.target.value] + } +} + +export const handleStartChange = ({ api, state }) => () => { + const value = api.parseString(state.userInput && state.userInput[0]) + + if (value) { + let newValue + + if (state.displayValue[1]) { + state.userInput = [api.formatToString(value), state.displayValue[1]] + newValue = [value, state.picker.state.value && state.picker.state.value[1]] + } else { + let now = new Date() + + if (now.getTime() < value.getTime()) { + state.userInput = [api.formatToString(value), api.formatToString(value)] + newValue = [value, value] + } else { + state.userInput = [api.formatToString(value), api.formatToString(now)] + newValue = [value, now] + } + } + + state.picker.state.value = newValue + + if (api.isValidValue(newValue)) { + api.emitInput(newValue) + state.userInput = null + } + } +} + +export const handleEndChange = ({ api, state }) => () => { + const value = api.parseString(state.userInput && state.userInput[1]) + + if (value) { + let newValue + + if (state.displayValue[0]) { + state.userInput = [state.displayValue[0], api.formatToString(value)] + newValue = [state.picker.state.value && state.picker.state.value[0], value] + } else { + let now = new Date() + + if (now.getTime() < value.getTime()) { + state.userInput = [api.formatToString(now), api.formatToString(value)] + newValue = [now, value] + } else { + state.userInput = [api.formatToString(value), api.formatToString(value)] + newValue = [value, value] + } + } + + state.picker.state.value = newValue + + if (api.isValidValue(newValue)) { + api.emitInput(newValue) + + state.userInput = null + } + } +} + +export const handleClickIcon = ({ api, props, state }) => (event) => { + if (props.readonly || state.pickerDisabled) { + return + } + + if (state.showClose) { + state.valueOnOpen = props.modelValue + event.stopPropagation() + api.emitInput(null) + api.emitChange(null) + state.showClose = false + + if (state.picker && typeof state.picker.handleClear === 'function') { + state.picker.handleClear() + } + } else { + state.pickerVisible = !state.pickerVisible + } +} + +export const handleClose = ({ api, props, state }) => () => { + if (!state.pickerVisible) { + return + } + + state.pickerVisible = false + + if (state.type === DATEPICKER.Dates) { + const oldValue = api.parseAsFormatAndType(state.valueOnOpen, state.valueFormat, state.type, props.rangeSeparator) || state.valueOnOpen + + api.emitInput(oldValue) + } +} + +export const handleFocus = ({ emit, refs, state }) => () => { + const type = state.type + + if (DATEPICKER.TriggerTypes.includes(type) && !state.pickerVisible) { + state.pickerVisible = true + } + + emit('focus', refs.reference) +} + +export const handleKeydown = ({ api, state }) => (event) => { + const keyCode = event.keyCode + + // ESC + if (keyCode === 27) { + state.pickerVisible = false + event.stopPropagation() + return + } + + // Tab + if (keyCode === 9) { + if (!state.ranged) { + api.handleChange() + state.pickerVisible = state.picker.state.visible = false + api.blur() + event.stopPropagation() + } else { + setTimeout(() => { + if (!state.refInput.includes(document.activeElement)) { + state.pickerVisible = false + api.blur() + event.stopPropagation() + } + }, 0) + } + + return + } + + // Enter + if (keyCode === 13) { + if (state.userInput === '' || api.isValidValue(api.parseString(state.displayValue))) { + api.handleChange() + state.pickerVisible = state.picker.state.visible = false + api.blur() + } + + event.stopPropagation() + + return + } + + if (state.userInput) { + event.stopPropagation() + return + } + + if (state.picker && state.picker.handleKeydown) { + state.picker.handleKeydown(event) + } +} + +export const hidePicker = ({ destroyPopper, state }) => () => { + if (state.picker) { + state.picker.resetView && state.picker.resetView() + state.pickerVisible = state.picker.visible = state.picker.state.visible = false + destroyPopper() + } +} + +export const showPicker = ({ api, nextTick, updatePopper, state }) => () => { + if (state.$isServer) { + return + } + + if (!state.picker) { + api.mountPicker() + } + + state.pickerVisible = state.picker.state.visible = true + state.picker.state.value = state.parsedValue + state.picker.resetView && state.picker.resetView() + + nextTick(() => { + updatePopper(state.picker.$el) + state.picker.adjustSpinners && state.picker.adjustSpinners() + }) +} + +export const handlePick = ({ state, api }) => (date = '', visible = false) => { + state.userInput = null + state.pickerVisible = state.picker.state.visible = visible + + api.emitInput(date) + + state.date = date + state.picker.resetView && state.picker.resetView() +} + +export const handleSelectRange = (state) => (start, end, pos) => { + if (state.refInput.length === 0) { + return + } + + const adjust = (value, start, end) => { + if (!value) { + return { start, end } + } + const valueReg = /(\d+):(\d+):(\d+)(\s+.+)?/ + + if (valueReg.test(value)) { + const matched = valueReg.exec(value) + const hourLength = matched[1].length + const minuteLength = matched[2].length + const secondLength = matched[3].length + + if (start === 0) { + end = hourLength + } else if (start === 3) { + start = hourLength + 1 + end = hourLength + minuteLength + 1 + } else { + start = hourLength + minuteLength + 2 + end = hourLength + minuteLength + secondLength + 2 + } + } + + return { start, end } + } + + if (!pos || pos === 'min') { + const value = state.refInput[0].value + const res = adjust(value, start, end) + + state.refInput[0].setSelectionRange(res.start, res.end) + state.refInput[0].focus() + } else if (pos === 'max') { + const value = state.refInput[1].value + const res = adjust(value, start, end) + + state.refInput[1].setSelectionRange(res.start, res.end) + state.refInput[1].focus() + } +} + +export const mountPicker = ({ api, props, state, vm, updatePopper }) => () => { + state.picker = vm.$refs.picker + state.picker.state.defaultValue = props.defaultValue + state.picker.state.defaultTime = props.defaultTime + state.picker.state.popperClass = props.popperClass + state.picker.state.popperAppendToBody = props.popperAppendToBody + state.picker.state.fnUpdatePopper = updatePopper + state.picker.state.currentInstans = state.picker + state.picker.state.timezone = state.timezone + state.picker.state.timezoneData = state.timezoneData + state.picker.state.showTimezone = props.showTimezone || state.timezone.isServiceTimezone + state.picker.state.width = state.reference.getBoundingClientRect().width + state.picker.state.timefmt = props.timeFormat || '' + state.picker.state.showTime = state.type === DATEPICKER.DateTime || state.type === DATEPICKER.DateTimeRange + state.picker.state.selectionMode = state.selectionMode + state.picker.state.defaultTimezone = props.defaultTimezone + state.picker.state.unlinkPanels = props.unlinkPanels + state.picker.state.emitDbTime = api.emitDbTime + state.picker.state.arrowControl = state.arrowControl || props.timeArrowControl || props.arrowControl || false + + api.updateOptions() + state.picker.resetView && state.picker.resetView() +} + +export const updateOptions = ({ api, props, state }) => () => { + if (!state.picker) { + return + } + + const options = props.pickerOptions + + if (options && options.selectableRange) { + let ranges = options.selectableRange + const parser = api.typeValueResolveMap().datetimerange.parser + const format = DATEPICKER.DateFormats.timerange + + ranges = Array.isArray(ranges) ? ranges : [ranges] + + state.picker.state.selectableRange = ranges.map((range) => parser(range, format, props.rangeSeparator)) + } + + for (const option in options) { + if (option in options && option !== DATEPICKER.SelectbaleRange) { + state.picker.state[option] = options[option] + } + } + + if (props.format) { + state.picker.state.format = props.format + } +} + +export const valueEquals = (left, right) => { + const dateEquals = (a, b) => { + const bIsDate = b instanceof Date + const aIsDate = a instanceof Date + + if (aIsDate && bIsDate) { + return a.getTime() === b.getTime() + } + + if (!aIsDate && !bIsDate) { + return a === b + } + + return false + } + + const aIsArray = Array.isArray(left) + const bIsArray = Array.isArray(right) + + if (aIsArray && bIsArray) { + if (left.length !== right.length) { + return false + } + + return left.every((item, index) => dateEquals(item, right[index])) + } + + if (!aIsArray && !bIsArray) { + return dateEquals(left, right) + } + + return false +} + +export const emitChange = ({ api, dispatch, emit, props, state }) => (val) => { + if (!valueEquals(val, state.valueOnOpen)) { + emit('change', val) + + state.valueOnOpen = val + + if (props.validateEvent) { + dispatch('FormItem', 'form.change', val) + } + + api.emitDbTime(props.value) + } +} + +export const emitInput = ({ api, emit, props, state }) => (val) => { + let value = val + const { from, to } = state.timezone + + if (props.type === 'datetime') { + value = getDateWithNewTimezone(value, to, from) + } else if (props.type === 'datetimerange' && Array.isArray(value)) { + value = value.map((val) => getDateWithNewTimezone(val, to, from)) + } + + const formatted = api.formatToValue(value) || val + + if (!valueEquals(props.modelValue, formatted)) { + emit('update:modelValue', formatted) + } +} + +export const isValidValue = ({ api, state }) => (value) => { + if (!state.picker) { + api.mountPicker() + } + + if (state.picker.isValidValue) { + return value && state.picker.isValidValue(value) + } + + return true +} + +export const watchIsRange = ({ api, state, TimePanel, TimeRangePanel }) => (value) => { + state.type = value ? DATEPICKER.TimeRange : DATEPICKER.Time + state.panel = value ? TimeRangePanel : TimePanel + api.mountPicker() +} + +export const getType = ({ props }) => () => { + if (props.componentName === DATEPICKER.DatePicker) { + return props.type + } else if (props.componentName === DATEPICKER.TimePicker) { + return props.isRange ? DATEPICKER.TimeRange : DATEPICKER.Time + } + + return DATEPICKER.TimeSelect +} + +export const watchModelValue = ({ api, props, state, dispatch }) => (value, oldValue) => { + api.emitChange(props.modelValue) + + if (!valueEquals(value, oldValue) && !state.pickerVisible && props.validateEvent) { + dispatch('FormItem', 'form.change', value) + } +} + +export const computedFormat = ({ props, utils }) => () => { + let { type, format } = props + + if (!format && utils.getDateFormat) { + const config = utils.getDateFormat() || {} + + if (~['date', 'dates', 'daterange'].indexOf(type)) { + format = config.DateFormat + } + + if (~['datetime', 'datetimerange'].indexOf(type)) { + format = config.DateTimeFormat + } + } + + return format +} + +export const computedTriggerClass = ({ props, state }) => () => + props.suffixIcon || props.prefixIcon || (state.type.includes(DATEPICKER.Time) ? DATEPICKER.IconTime : DATEPICKER.IconDate) + +export const computedHaveTrigger = ({ props }) => () => + typeof props.showTrigger !== 'undefined' ? props.showTrigger : DATEPICKER.TriggerTypes.includes(props.type) + +export const intiPopper = ({ props, hooks, vnode }) => { + const { reactive, watch, toRefs, onBeforeUnmount, onDeactivated } = hooks + const { emit, refs, slots, nextTick } = vnode + const placementMap = DATEPICKER.PlacementMap + + return userPopper({ + reactive, + watch, + emit, + props: { + ...props, + popperOptions: { boundariesPadding: 0, gpuAcceleration: false }, + visibleArrow: true, + offset: 0, + boundariesPadding: 5, + arrowOffset: 35, + placement: placementMap[props.align] || placementMap.left + }, + toRefs, + refs, + slots, + nextTick, + onBeforeUnmount, + onDeactivated + }) +} + +export const emitDbTime = ({ emit, state, t }) => (date) => { + const { isServiceTimezone, from } = state.timezone + + // 防止死循环,此处必须判断 + if (isServiceTimezone && !valueEquals(date, state.dbTime)) { + let hasDate = false + const dbTime = [].concat(date).map((item) => { + if (isDate(item)) { + hasDate = true + let currentDate = getDateWithNewTimezone(item, getLocalTimezone(), from) + + if (state.valueFormat) { + currentDate = formatDate(currentDate, state.valueFormat, t) + } + + return currentDate + } + + return item + }) + + state.dbTime = dbTime.length > 1 ? dbTime : dbTime[0] + + hasDate && emit('input', state.dbTime) + } +} + +export const initGlobalTimezone = ({ api, state, props }) => () => { + const { isServiceTimezone } = state.timezone + + // Date 类型要特色处理 + if (isServiceTimezone) { + state.timezoneData = globalTimezone + } else if (props.showTimezone) { + state.timezoneData = props.timezoneData ? extend(true, {}, props.timezoneData) : globalTimezone + } + + api.emitDbTime(props.value) +} diff --git a/packages/renderless/src/picker/timezone.ts b/packages/renderless/src/picker/timezone.ts new file mode 100644 index 000000000..c3bb745b3 --- /dev/null +++ b/packages/renderless/src/picker/timezone.ts @@ -0,0 +1,1182 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'enUS': [ + { + name: '(UTC-12:00)International Date Line West', + code: '001-12', + offset: -12, + tz: 'Etc/GMT+12' + }, + { + name: '(UTC+13:00)Samoa', + code: '002-11', + offset: 14, + tz: 'Pacific/Apia' + }, + { + name: '(UTC-11:00)Coordinated Universal Time-11', + code: '003-11', + offset: -11, + tz: 'Etc/GMT+11' + }, + { + name: '(UTC-10:00)Hawaii', + code: '004-10', + offset: -10, + tz: 'Pacific/Honolulu' + }, + { + name: '(UTC-09:00)Alaska', + code: '005-9', + offset: -9, + tz: 'America/Anchorage' + }, + { + name: '(UTC-08:00)Pacific Time (US & Canada)', + code: '006-8', + offset: -8, + tz: 'America/Los_Angeles' + }, + { + name: '(UTC-08:00)Baja California', + code: '007-8', + offset: -8, + tz: 'America/Santa_Isabel' + }, + { + name: '(UTC-07:00)Chihuahua, La Paz, Mazatlan', + code: '008-7', + offset: -7, + tz: 'America/Chihuahua' + }, + { + name: '(UTC-07:00)Mountain Time (US & Canada)', + code: '009-7', + offset: -7, + tz: 'America/Denver' + }, + { + name: '(UTC-07:00)Arizona', + code: '010-7', + offset: -7, + tz: 'America/Phoenix' + }, + { + name: '(UTC-06:00)Guadalajara, Mexico City, Monterey', + code: '011-6', + offset: -6, + tz: 'America/Mexico_City' + }, + { + name: '(UTC-06:00)Saskatchewan', + code: '012-6', + offset: -6, + tz: 'America/Regina' + }, + { + name: '(UTC-06:00)Central Time (US & Canada)', + code: '013-6', + offset: -6, + tz: 'America/Chicago' + }, + { + name: '(UTC-06:00)Central America', + code: '014-6', + offset: -6, + tz: 'America/Guatemala' + }, + { + name: '(UTC-05:00)Bogota, Lima, Quito', + code: '015-5', + offset: -5, + tz: 'America/Bogota' + }, + { + name: '(UTC-05:00)Eastern Time (US & Canada)', + code: '016-5', + offset: -5, + tz: 'America/New_York' + }, + { + name: '(UTC-05:00)Indiana(East)', + code: '017-5', + offset: -5, + tz: 'America/Indiana/Indianapolis' + }, + { + name: '(UTC-04:30)Caracas', + code: '018-4.5', + offset: -4, + tz: 'America/Caracas' + }, + { + name: '(UTC-04:00)Atlantic Time (Canada)', + code: '019-4', + offset: -4, + tz: 'America/Halifax' + }, + { + name: '(UTC-04:00)Cuiaba', + code: '020-4', + offset: -4, + tz: 'America/Cuiaba' + }, + { + name: '(UTC-04:00)Georgetown, La Paz, Manaus, San Juan', + code: '021-4', + offset: -4, + tz: 'America/La_Paz' + }, + { + name: '(UTC-04:00)Santiago', + code: '022-4', + offset: -3, + tz: 'America/Santiago' + }, + { + name: '(UTC-04:00)Asuncion', + code: '023-4', + offset: -3, + tz: 'America/Asuncion' + }, + { + name: '(UTC-03:30)Newfoundland', + code: '024-3.5', + offset: -3.5, + tz: 'America/St_Johns' + }, + { + name: '(UTC-03:00)Brasilia', + code: '025-3', + offset: -3, + tz: 'America/Sao_Paulo' + }, + { + name: '(UTC-03:00)Buenos Aires', + code: '026-3', + offset: -3, + tz: 'America/Argentina/Buenos_Aires' + }, + { + name: '(UTC-03:00)Greenland', + code: '027-3', + offset: -3, + tz: 'America/Godthab' + }, + { + name: '(UTC-03:00)Cayenne, Fortaleza', + code: '028-3', + offset: -3, + tz: 'America/Cayenne' + }, + { + name: '(UTC-03:00)Montevideo', + code: '029-3', + offset: -3, + tz: 'America/Montevideo' + }, + { + name: '(UTC-11:00)Coordinated Universal Time-11', + code: '030-2', + offset: -11, + tz: 'Etc/GMT+11' + }, + { + name: '(UTC-02:00)Mid-Atlantic', + code: '031-2', + offset: -4, + tz: 'America/Halifax' + }, + { + name: '(UTC-01:00)Cape Verde Is', + code: '032-1', + offset: -1, + tz: 'Atlantic/Cape_Verde' + }, + { + name: '(UTC-01:00)Azores', + code: '033-1', + offset: -1, + tz: 'Atlantic/Azores' + }, + { + name: '(UTC)Dublin, Edinburgh, Lisbon, London', + code: '034-0', + offset: 0, + tz: 'Europe/London' + }, + { + name: '(UTC)Casablanca', + code: '035-0', + offset: 1, + tz: 'Africa/Casablanca' + }, + { + name: '(UTC)Monrovia, Reykjavik', + code: '036-0', + offset: 0, + tz: 'Atlantic/Reykjavik' + }, + { + name: '(UTC)Coordinated Universal Time', + code: '037-0', + offset: 0, + tz: 'Etc/GMT' + }, + { + name: '(UTC+01:00)Amsterdam, Berlin, Bern, Rome, Stockholm, Vienna', + code: '038+1', + offset: 1, + tz: 'Europe/Berlin' + }, + { + name: '(UTC+01:00)Belgrade, Bratislava, Budapest, Ljubljana, Prague', + code: '039+1', + offset: 1, + tz: 'Europe/Budapest' + }, + { + name: '(UTC+01:00)Brussels, Copenhagen, Madrid, Paris', + code: '040+1', + offset: 1, + tz: 'Europe/Paris' + }, + { + name: '(UTC+01:00)Sarajevo, Skopje, Warsaw, Zagreb', + code: '041+1', + offset: 1, + tz: 'Europe/Warsaw' + }, + { + name: '(UTC+01:00)Windhoek', + code: '042+1', + offset: 2, + tz: 'Africa/Windhoek' + }, + { + name: '(UTC+01:00)West Central Africa', + code: '043+1', + offset: 1, + tz: 'Africa/Lagos' + }, + { + name: '(UTC+02:00)Amman', + code: '044+2', + offset: 2, + tz: 'Asia/Amman' + }, + { + name: '(UTC+02:00)Beirut', + code: '045+2', + offset: 2, + tz: 'Asia/Beirut' + }, + { + name: '(UTC+02:00)Damascus', + code: '046+2', + offset: 2, + tz: 'Asia/Damascus' + }, + { + name: '(UTC+02:00)Harare, Pretoria', + code: '047+2', + offset: 2, + tz: 'Africa/Johannesburg' + }, + { + name: '(UTC+02:00)Helsinki, Kiev, Riga, Sofia, Tallinn, Vilnius', + code: '048+2', + offset: 2, + tz: 'Europe/Kiev' + }, + { + name: '(UTC+02:00)Cairo', + code: '049+2', + offset: 2, + tz: 'Africa/Cairo' + }, + { + name: '(UTC+02:00)Minsk', + code: '050+2', + offset: 3, + tz: 'Europe/Minsk' + }, + { + name: '(UTC+02:00)Athens, Bucharest, Istanbul', + code: '051+2', + offset: 3, + tz: 'Europe/Istanbul' + }, + { + name: '(UTC+02:00)Jerusalem', + code: '052+2', + offset: 2, + tz: 'Asia/Jerusalem' + }, + { + name: '(UTC+03:00)Baghdad', + code: '053+3', + offset: 3, + tz: 'Asia/Baghdad' + }, + { + name: '(UTC+03:00)Kuwait, Riyadh', + code: '054+3', + offset: 3, + tz: 'Asia/Riyadh' + }, + { + name: '(UTC+03:00)Moscow, St. Petersburg, Volgograd', + code: '055+3', + offset: 3, + tz: 'Europe/Moscow' + }, + { + name: '(UTC+03:00)Nairobi', + code: '056+3', + offset: 3, + tz: 'Africa/Nairobi' + }, + { + name: '(UTC+03:30)Teheran', + code: '057+3.5', + offset: 3.5, + tz: 'Asia/Tehran' + }, + { + name: '(UTC+04:00)Abu Dhabi, Muscat', + code: '058+4', + offset: 4, + tz: 'Asia/Dubai' + }, + { + name: '(UTC+04:00)Yerevan', + code: '059+4', + offset: 4, + tz: 'Asia/Yerevan' + }, + { + name: '(UTC+04:00)Baku', + code: '060+4', + offset: 4, + tz: 'Asia/Baku' + }, + { + name: '(UTC+04:00)Tbilisi', + code: '061+4', + offset: 4, + tz: 'Asia/Tbilisi' + }, + { + name: '(UTC+04:00)Port Louis', + code: '062+4', + offset: 4, + tz: 'Indian/Mauritius' + }, + { + name: '(UTC+04:30)Kabul', + code: '063+4.5', + offset: 4.5, + tz: 'Asia/Kabul' + }, + { + name: '(UTC+05:00)Tashkent', + code: '064+5', + offset: 5, + tz: 'Asia/Tashkent' + }, + { + name: '(UTC+05:00)Yekaterinburg', + code: '065+5', + offset: 5, + tz: 'Asia/Yekaterinburg' + }, + { + name: '(UTC+05:00)Islamabad, Karachi', + code: '066+5', + offset: 5, + tz: 'Asia/Karachi' + }, + { + name: '(UTC+05:30)Chennai, Kolkata, Mumbai, New Delhi', + code: '067+5.5', + offset: 5.5, + tz: 'Asia/Kolkata' + }, + { + name: '(UTC+05:30)Sri Jayawardenepura', + code: '068+5.5', + offset: 5.5, + tz: 'Asia/Colombo' + }, + { + name: '(UTC+05:45)Katmandu', + code: '069+5.75', + offset: 5.75, + tz: 'Asia/Kathmandu' + }, + { + name: '(UTC+06:00)Astana', + code: '070+6', + offset: 6, + tz: 'Asia/Almaty' + }, + { + name: '(UTC+06:00)Dhaka', + code: '071+6', + offset: 6, + tz: 'Asia/Dhaka' + }, + { + name: '(UTC+07:00)Novosibirsk', + code: '072+6', + offset: 7, + tz: 'Asia/Novosibirsk' + }, + { + name: '(UTC+06:30)Yangon(Rangoon)', + code: '073+6.5', + offset: 6.5, + tz: 'Asia/Yangon' + }, + { + name: '(UTC+07:00)Krasnoyarsk', + code: '074+7', + offset: 7, + tz: 'Asia/Krasnoyarsk' + }, + { + name: '(UTC+07:00)Bangkok, Hanoi, Jakarta', + code: '075+7', + offset: 7, + tz: 'Asia/Bangkok' + }, + { + name: '(UTC+08:00)Beijing, Chongqing, Hong Kong, Urumqi', + code: '076+8', + offset: 8, + tz: 'Asia/Shanghai' + }, + { + name: '(UTC+08:00)Kuala Lumpur, Singapore', + code: '077+8', + offset: 8, + tz: 'Asia/Singapore' + }, + { + name: '(UTC+08:00)Perth', + code: '078+8', + offset: 8, + tz: 'Australia/Perth' + }, + { + name: '(UTC+08:00)Taipei', + code: '079+8', + offset: 8, + tz: 'Asia/Taipei' + }, + { + name: '(UTC+08:00)Ulaanbaatar', + code: '080+8', + offset: 8, + tz: 'Asia/Ulaanbaatar' + }, + { + name: '(UTC+08:00)Irkutsk', + code: '081+8', + offset: 8, + tz: 'Asia/Irkutsk' + }, + { + name: '(UTC+09:00)Osaka, Sapporo, Tokyo', + code: '082+9', + offset: 9, + tz: 'Asia/Tokyo' + }, + { + name: '(UTC+09:00)Seoul', + code: '083+9', + offset: 9, + tz: 'Asia/Seoul' + }, + { + name: '(UTC+09:00)Yakutsk', + code: '084+9', + offset: 9, + tz: 'Asia/Yakutsk' + }, + { + name: '(UTC+09:30)Adelaide', + code: '085+9.5', + offset: 10.5, + tz: 'Australia/Adelaide' + }, + { + name: '(UTC+09:30)Darwin', + code: '086+9.5', + offset: 9.5, + tz: 'Australia/Darwin' + }, + { + name: '(UTC+10:00)Brisbane', + code: '087+10', + offset: 10, + tz: 'Australia/Brisbane' + }, + { + name: '(UTC+10:00)Vladivostok', + code: '088+10', + offset: 10, + tz: 'Asia/Vladivostok' + }, + { + name: '(UTC+10:00)Guam, Port Moresby', + code: '089+10', + offset: 10, + tz: 'Pacific/Port_Moresby' + }, + { + name: '(UTC+10:00)Hobart', + code: '090+10', + offset: 11, + tz: 'Australia/Hobart' + }, + { + name: '(UTC+10:00)Canberra, Melbourne, Sydney', + code: '091+10', + offset: 11, + tz: 'Australia/Sydney' + }, + { + name: '(UTC+11:00)Magadan', + code: '092+11', + offset: 11, + tz: 'Asia/Magadan' + }, + { + name: '(UTC+11:00)Solomon Is, New Caledonia', + code: '093+11', + offset: 11, + tz: 'Pacific/Guadalcanal' + }, + { + name: '(UTC+12:00)Auckland, Wellington', + code: '094+12', + offset: 13, + tz: 'Pacific/Auckland' + }, + { + name: '(UTC+12:00)Fiji', + code: '095+12', + offset: 13, + tz: 'Pacific/Fiji' + }, + { + name: '(UTC+12:00)Coordinated Universal Time+12', + code: '096+12', + offset: 12, + tz: 'Etc/GMT-12' + }, + { + name: '(UTC+13:00)Nuku`alofa', + code: '097+13', + offset: 13, + tz: 'Pacific/Tongatapu' + } + ], + 'zhCN': [ + { + name: '(UTC-12:00)国际日期变更线西', + code: '001-12', + offset: -12, + tz: 'Etc/GMT+12' + }, + { + name: '(UTC+13:00) 萨摩亚群岛', + code: '002-11', + offset: 14, + tz: 'Pacific/Apia' + }, + { + name: '(UTC-11:00)协调世界时-11', + code: '003-11', + offset: -11, + tz: 'Etc/GMT+11' + }, + { + name: '(UTC-10:00)夏威夷', + code: '004-10', + offset: -10, + tz: 'Pacific/Honolulu' + }, + { + name: '(UTC-09:00)阿拉斯加', + code: '005-9', + offset: -9, + tz: 'America/Anchorage' + }, + { + name: '(UTC-08:00)太平洋时间(美国和加拿大)', + code: '006-8', + offset: -8, + tz: 'America/Los_Angeles' + }, + { + name: '(UTC-08:00)下加利福尼亚州', + code: '007-8', + offset: -8, + tz: 'America/Santa_Isabel' + }, + { + name: '(UTC-07:00)奇瓦瓦,拉巴斯,马萨特兰', + code: '008-7', + offset: -7, + tz: 'America/Chihuahua' + }, + { + name: '(UTC-07:00)山地时间(美国和加拿大)', + code: '009-7', + offset: -7, + tz: 'America/Denver' + }, + { + name: '(UTC-07:00)亚利桑那', + code: '010-7', + offset: -7, + tz: 'America/Phoenix' + }, + { + name: '(UTC-06:00)瓜达拉哈拉,墨西哥城,蒙特雷', + code: '011-6', + offset: -6, + tz: 'America/Mexico_City' + }, + { + name: '(UTC-06:00)萨斯喀彻温', + code: '012-6', + offset: -6, + tz: 'America/Regina' + }, + { + name: '(UTC-06:00)中部时间(美国和加拿大)', + code: '013-6', + offset: -6, + tz: 'America/Chicago' + }, + { + name: '(UTC-06:00)中美洲', + code: '014-6', + offset: -6, + tz: 'America/Guatemala' + }, + { + name: '(UTC-05:00)波哥大,利马,基多', + code: '015-5', + offset: -5, + tz: 'America/Bogota' + }, + { + name: '(UTC-05:00)东部时间(美国和加拿大)', + code: '016-5', + offset: -5, + tz: 'America/New_York' + }, + { + name: '(UTC-05:00)印地安那州(东部)', + code: '017-5', + offset: -5, + tz: 'America/Indiana/Indianapolis' + }, + { + name: '(UTC-04:30)加拉加斯', + code: '018-4.5', + offset: -4, + tz: 'America/Caracas' + }, + { + name: '(UTC-04:00)大西洋时间(加拿大)', + code: '019-4', + offset: -4, + tz: 'America/Halifax' + }, + { + name: '(UTC-04:00)库亚巴', + code: '020-4', + offset: -4, + tz: 'America/Cuiaba' + }, + { + name: '(UTC-04:00)乔治敦,拉巴斯,马瑙斯,圣胡安', + code: '021-4', + offset: -4, + tz: 'America/La_Paz' + }, + { + name: '(UTC-04:00)圣地亚哥', + code: '022-4', + offset: -3, + tz: 'America/Santiago' + }, + { + name: '(UTC-04:00)亚松森', + code: '023-4', + offset: -3, + tz: 'America/Asuncion' + }, + { + name: '(UTC-03:30)纽芬兰', + code: '024-3.5', + offset: -3.5, + tz: 'America/St_Johns' + }, + { + name: '(UTC-03:00)巴西利亚', + code: '025-3', + offset: -3, + tz: 'America/Sao_Paulo' + }, + { + name: '(UTC-03:00)布宜诺斯艾利斯', + code: '026-3', + offset: -3, + tz: 'America/Argentina/Buenos_Aires' + }, + { + name: '(UTC-03:00)格陵兰', + code: '027-3', + offset: -3, + tz: 'America/Godthab' + }, + { + name: '(UTC-03:00)卡宴,福塔雷萨', + code: '028-3', + offset: -3, + tz: 'America/Cayenne' + }, + { + name: '(UTC-03:00)蒙得维的亚', + code: '029-3', + offset: -3, + tz: 'America/Montevideo' + }, + { + name: '(UTC-11:00)协调世界时-11', + code: '030-2', + offset: -11, + tz: 'Etc/GMT+11' + }, + { + name: '(UTC-02:00)中大西洋', + code: '031-2', + offset: -4, + tz: 'America/Halifax' + }, + { + name: '(UTC-01:00)佛得角群岛', + code: '032-1', + offset: -1, + tz: 'Atlantic/Cape_Verde' + }, + { + name: '(UTC-01:00)亚速尔群岛', + code: '033-1', + offset: -1, + tz: 'Atlantic/Azores' + }, + { + name: '(UTC)都柏林,爱丁堡,里斯本,伦敦', + code: '034-0', + offset: 0, + tz: 'Europe/London' + }, + { + name: '(UTC)卡萨布兰卡', + code: '035-0', + offset: 1, + tz: 'Africa/Casablanca' + }, + { + name: '(UTC)蒙罗维亚,雷克雅未克', + code: '036-0', + offset: 0, + tz: 'Atlantic/Reykjavik' + }, + { + name: '(UTC)协调世界时', + code: '037-0', + offset: 0, + tz: 'Etc/GMT' + }, + { + name: '(UTC+01:00)阿姆斯特丹,柏林,伯尔尼,罗马,斯德哥尔摩,维也纳', + code: '038+1', + offset: 1, + tz: 'Europe/Berlin' + }, + { + name: '(UTC+01:00)贝尔格莱德,布拉迪斯拉发,布达佩斯,卢布尔雅那,布拉格', + code: '039+1', + offset: 1, + tz: 'Europe/Budapest' + }, + { + name: '(UTC+01:00)布鲁塞尔,哥本哈根,马德里,巴黎', + code: '040+1', + offset: 1, + tz: 'Europe/Paris' + }, + { + name: '(UTC+01:00)萨拉热窝,斯科普里,华沙,萨格勒布', + code: '041+1', + offset: 1, + tz: 'Europe/Warsaw' + }, + { + name: '(UTC+01:00)温得和克', + code: '042+1', + offset: 2, + tz: 'Africa/Windhoek' + }, + { + name: '(UTC+01:00)中非西部', + code: '043+1', + offset: 1, + tz: 'Africa/Lagos' + }, + { + name: '(UTC+02:00)安曼', + code: '044+2', + offset: 2, + tz: 'Asia/Amman' + }, + { + name: '(UTC+02:00)贝鲁特', + code: '045+2', + offset: 2, + tz: 'Asia/Beirut' + }, + { + name: '(UTC+02:00)大马士革', + code: '046+2', + offset: 2, + tz: 'Asia/Damascus' + }, + { + name: '(UTC+02:00)哈拉雷,比勒陀利亚', + code: '047+2', + offset: 2, + tz: 'Africa/Johannesburg' + }, + { + name: '(UTC+02:00)赫尔辛基,基辅,里加,索非亚,塔林,维尔纽斯', + code: '048+2', + offset: 2, + tz: 'Europe/Kiev' + }, + { + name: 'UTC+02:00)开罗', + code: '049+2', + offset: 2, + tz: 'Africa/Cairo' + }, + { + name: '(UTC+02:00)明斯克', + code: '050+2', + offset: 3, + tz: 'Europe/Minsk' + }, + { + name: '(UTC+02:00)雅典,布加勒斯特,伊斯坦布尔', + code: '051+2', + offset: 3, + tz: 'Europe/Istanbul' + }, + { + name: '(UTC+02:00)耶路撒冷', + code: '052+2', + offset: 2, + tz: 'Asia/Jerusalem' + }, + { + name: '(UTC+03:00)巴格达', + code: '053+3', + offset: 3, + tz: 'Asia/Baghdad' + }, + { + name: '(UTC+03:00)科威特,利雅得', + code: '054+3', + offset: 3, + tz: 'Asia/Riyadh' + }, + { + name: '(UTC+03:00)莫斯科,圣彼得堡,伏尔加格勒', + code: '055+3', + offset: 3, + tz: 'Europe/Moscow' + }, + { + name: '(UTC+03:00)内罗毕', + code: '056+3', + offset: 3, + tz: 'Africa/Nairobi' + }, + { + name: '(UTC+03:30)德黑兰', + code: '057+3.5', + offset: 3.5, + tz: 'Asia/Tehran' + }, + { + name: '(UTC+04:00)阿布扎比,马斯喀特', + code: '058+4', + offset: 4, + tz: 'Asia/Dubai' + }, + { + name: '(UTC+04:00)埃里温', + code: '059+4', + offset: 4, + tz: 'Asia/Yerevan' + }, + { + name: '(UTC+04:00)巴库', + code: '060+4', + offset: 4, + tz: 'Asia/Baku' + }, + { + name: '(UTC+04:00)第比利斯', + code: '061+4', + offset: 4, + tz: 'Asia/Tbilisi' + }, + { + name: '(UTC+04:00)路易港', + code: '062+4', + offset: 4, + tz: 'Indian/Mauritius' + }, + { + name: '(UTC+04:30)喀布尔', + code: '063+4.5', + offset: 4.5, + tz: 'Asia/Kabul' + }, + { + name: '(UTC+05:00)塔什干', + code: '064+5', + offset: 5, + tz: 'Asia/Tashkent' + }, + { + name: '(UTC+05:00)叶卡捷琳堡', + code: '065+5', + offset: 5, + tz: 'Asia/Yekaterinburg' + }, + { + name: '(UTC+05:00)伊斯兰堡,卡拉奇', + code: '066+5', + offset: 5, + tz: 'Asia/Karachi' + }, + { + name: '(UTC+05:30)钦奈,加尔各答,孟买,新德里', + code: '067+5.5', + offset: 5.5, + tz: 'Asia/Kolkata' + }, + { + name: '(UTC+05:30)斯里加亚渥登普拉', + code: '068+5.5', + offset: 5.5, + tz: 'Asia/Colombo' + }, + { + name: '(UTC+05:45)加德满都', + code: '069+5.75', + offset: 5.75, + tz: 'Asia/Kathmandu' + }, + { + name: '(UTC+06:00)阿斯塔纳', + code: '070+6', + offset: 6, + tz: 'Asia/Almaty' + }, + { + name: '(UTC+06:00)达卡', + code: '071+6', + offset: 6, + tz: 'Asia/Dhaka' + }, + { + name: '(UTC+07:00)新西伯利亚', + code: '072+6', + offset: 7, + tz: 'Asia/Novosibirsk' + }, + { + name: '(UTC+06:30)仰光', + code: '073+6.5', + offset: 6.5, + tz: 'Asia/Yangon' + }, + { + name: '(UTC+07:00)克拉斯诺亚尔斯克', + code: '074+7', + offset: 7, + tz: 'Asia/Krasnoyarsk' + }, + { + name: '(UTC+07:00)曼谷,河内,雅加达', + code: '075+7', + offset: 7, + tz: 'Asia/Bangkok' + }, + { + name: '(UTC+08:00)北京,重庆,香港特别行政区,乌鲁木齐', + code: '076+8', + offset: 8, + tz: 'Asia/Shanghai' + }, + { + name: '(UTC+08:00)吉隆坡,新加坡', + code: '077+8', + offset: 8, + tz: 'Asia/Singapore' + }, + { + name: '(UTC+08:00)珀斯', + code: '078+8', + offset: 8, + tz: 'Australia/Perth' + }, + { + name: '(UTC+08:00)台北', + code: '079+8', + offset: 8, + tz: 'Asia/Taipei' + }, + { + name: '(UTC+08:00)乌兰巴托', + code: '080+8', + offset: 8, + tz: 'Asia/Ulaanbaatar' + }, + { + name: '(UTC+08:00)伊尔库茨克', + code: '081+8', + offset: 8, + tz: 'Asia/Irkutsk' + }, + { + name: '(UTC+09:00)大阪,札幌,东京', + code: '082+9', + offset: 9, + tz: 'Asia/Tokyo' + }, + { + name: '(UTC+09:00)首尔', + code: '083+9', + offset: 9, + tz: 'Asia/Seoul' + }, + { + name: '(UTC+09:00)雅库茨克', + code: '084+9', + offset: 9, + tz: 'Asia/Yakutsk' + }, + { + name: '(UTC+09:30)阿德莱德', + code: '085+9.5', + offset: 10.5, + tz: 'Australia/Adelaide' + }, + { + name: '(UTC+09:30)达尔文', + code: '086+9.5', + offset: 9.5, + tz: 'Australia/Darwin' + }, + { + name: '(UTC+10:00)布里斯班', + code: '087+10', + offset: 10, + tz: 'Australia/Brisbane' + }, + { + name: '(UTC+10:00)符拉迪沃斯托克', + code: '088+10', + offset: 10, + tz: 'Asia/Vladivostok' + }, + { + name: '(UTC+10:00)关岛,莫尔兹比港', + code: '089+10', + offset: 10, + tz: 'Pacific/Port_Moresby' + }, + { + name: '(UTC+10:00)霍巴特', + code: '090+10', + offset: 11, + tz: 'Australia/Hobart' + }, + { + name: '(UTC+10:00)堪培拉,墨尔本,悉尼', + code: '091+10', + offset: 11, + tz: 'Australia/Sydney' + }, + { + name: '(UTC+11:00)马加丹', + code: '092+11', + offset: 11, + tz: 'Asia/Magadan' + }, + { + name: '(UTC+11:00)所罗门群岛,新喀里多尼亚', + code: '093+11', + offset: 11, + tz: 'Pacific/Guadalcanal' + }, + { + name: '(UTC+12:00)奥克兰,惠灵顿', + code: '094+12', + offset: 13, + tz: 'Pacific/Auckland' + }, + { + name: '(UTC+12:00)斐济', + code: '095+12', + offset: 13, + tz: 'Pacific/Fiji' + }, + { + name: '(UTC+12:00)协调世界时+12', + code: '096+12', + offset: 12, + tz: 'Etc/GMT-12' + }, + { + name: '(UTC+13:00)努库阿洛法', + code: '097+13', + offset: 13, + tz: 'Pacific/Tongatapu' + } + ] +} diff --git a/packages/renderless/src/picker/vue.ts b/packages/renderless/src/picker/vue.ts new file mode 100644 index 000000000..c07701bd2 --- /dev/null +++ b/packages/renderless/src/picker/vue.ts @@ -0,0 +1,242 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + getPanel, + getType, + watchIsRange, + parseAsFormatAndType, + watchPickerVisible, + getValueEmpty, + getMode, + displayValue, + typeValueResolveMap, + formatAsFormatAndType, + dateFormatter, + dateParser, + rangeFormatter, + rangeParser, + parsedValue, + firstInputId, + secondInputId, + focus, + blur, + parseValue, + formatToValue, + parseString, + formatToString, + handleMouseEnter, + handleChange, + handleStartInput, + handleEndInput, + handleStartChange, + handleEndChange, + handleClose, + handleFocus, + handleKeydown, + hidePicker, + showPicker, + emitInput, + isValidValue, + emitChange, + mountPicker, + updateOptions, + handleClickIcon, + handlePick, + handleSelectRange, + getTimezone, + getValueFormat, + watchModelValue, + computedFormat, + computedTriggerClass, + computedHaveTrigger, + intiPopper, + initGlobalTimezone, + emitDbTime +} from './index' +import { DATEPICKER } from '@opentiny/vue-renderless/common' + +export const api = [ + 'state', + 'btnClick', + 'handleEndChange', + 'handleEndInput', + 'focus', + 'handleFocus', + 'handleStartChange', + 'handleStartInput', + 'handleKeydown', + 'handleMouseEnter', + 'handleClickIcon', + 'handleMouseEnter', + 'handleChange', + 'handleClose', + 'handlePick', + 'handleSelectRange', + 'handleSelectChange', + 'popperElm' +] + +const initState = ({ api, reactive, refs, computed, props, utils }) => { + const state = reactive({ + date: null, + pickerVisible: false, + showClose: false, + userInput: null, + valueOnOpen: null, + popperElm: null, + unwatchPickerOptions: null, + ranged: computed(() => state.type.includes(DATEPICKER.Range)), + reference: computed(() => refs.reference.$el || refs.reference), + formDisabled: computed(() => (parent.tinyForm || {}).disabled), + refInput: computed(() => (state.reference ? [].slice.call(state.reference.querySelectorAll('input')) : [])), + valueIsEmpty: computed(() => api.getValueEmpty()), + triggerClass: computed(() => api.computedTriggerClass()), + selectionMode: computed(() => api.getMode()), + haveTrigger: computed(() => api.computedHaveTrigger()), + displayValue: computed(() => api.displayValue()), + parsedValue: computed(() => api.parsedValue()), + pickerSize: computed(() => props.size), + pickerDisabled: computed(() => props.disabled || state.formDisabled), + firstInputId: computed(() => api.firstInputId()), + secondInputId: computed(() => api.secondInputId()), + type: computed(() => api.getType()), + timezone: computed(() => api.getTimezone()), + valueFormat: computed(() => getValueFormat({ props, utils })), + format: computed(() => api.computedFormat()) + }) + + return state +} + +const initApi2 = ({ api, props, state, t }) => { + Object.assign(api, { + t, + state, + blur: blur(state), + getMode: getMode({ state }), + getType: getType({ props }), + dateParser: dateParser({ t }), + rangeParser: rangeParser(api), + rangeFormatter: rangeFormatter(api), + dateFormatter: dateFormatter({ t }), + getValueEmpty: getValueEmpty(props), + handleEndInput: handleEndInput(state), + handleStartInput: handleStartInput(state), + firstInputId: firstInputId({ props, state }), + secondInputId: secondInputId({ props, state }), + handleMouseEnter: handleMouseEnter({ props, state }), + initGlobalTimezone: initGlobalTimezone({ api, state, props }), + parseValue: parseValue({ api, props, state }), + handleSelectRange: handleSelectRange(state) + }) +} + +const initApi = ({ api, props, hooks, state, vnode, others, utils }) => { + const { t, emit, refs, dispatch, nextTick, vm } = vnode + const { TimePanel, TimeRangePanel } = others + const { destroyPopper, popperElm, updatePopper } = intiPopper({ props, hooks, vnode }) + + state.popperElm = popperElm + state.picker = null + + Object.assign(api, { + destroyPopper, + emitDbTime: emitDbTime({ emit, state, t }), + hidePicker: hidePicker({ destroyPopper, state }), + handleSelectChange: ({ tz, date }) => emit('select-change', { tz, date }), + getPanel: getPanel(others), + handleFocus: handleFocus({ emit, refs, state }), + getTimezone: getTimezone({ props, utils }), + emitChange: emitChange({ api, dispatch, emit, props, state }), + parsedValue: parsedValue({ api, props, state, t }), + parseAsFormatAndType: parseAsFormatAndType({ api }), + typeValueResolveMap: typeValueResolveMap({ api, t }), + updateOptions: updateOptions({ api, props, state }), + focus: focus({ api, props, refs }), + handleChange: handleChange({ api, state }), + isValidValue: isValidValue({ api, state }), + emitInput: emitInput({ api, emit, props, state }), + handleKeydown: handleKeydown({ api, state }), + handleEndChange: handleEndChange({ api, state }), + handleStartChange: handleStartChange({ api, state }), + handleClickIcon: handleClickIcon({ api, props, state }), + showPicker: showPicker({ api, nextTick, updatePopper, state }), + formatToValue: formatToValue({ api, props, state }), + formatAsFormatAndType: formatAsFormatAndType({ api }), + parseString: parseString({ api, state }), + handleClose: handleClose({ api, props, state }), + displayValue: displayValue({ api, props, state }), + handlePick: handlePick({ api, state }), + watchPickerVisible: watchPickerVisible({ api, vm, dispatch, emit, props, state }), + formatToString: formatToString({ api, state }), + watchIsRange: watchIsRange({ api, props, state, TimePanel, TimeRangePanel }), + mountPicker: mountPicker({ api, vm, props, state, updatePopper }), + watchModelValue: watchModelValue({ api, props, state, dispatch }), + computedFormat: computedFormat({ props, utils }), + computedTriggerClass: computedTriggerClass({ props, state }), + computedHaveTrigger: computedHaveTrigger({ props }) + }) + + initApi2({ api, props, state, t }) +} + +const initWatch = ({ api, state, props, watch, markRaw }) => { + watch( + () => state.type, + (type) => (state.panel = markRaw(api.getPanel(type))), + { immediate: true } + ) + + watch(() => state.pickerVisible, api.watchPickerVisible) + + watch( + () => props.defaultValue, + (value) => state.picker && (state.picker.state.defaultValue = value) + ) + + watch( + () => state.parsedValue, + (value) => state.picker && (state.picker.state.value = value), + { immediate: true } + ) + + watch(() => props.isRange, api.watchIsRange) + + watch(() => props.modelValue, api.watchModelValue) + + watch(() => props.pickerOptions, api.updateOptions, { deep: true }) +} + +export const renderless = (props, hooks, vnode, others) => { + const api = {} + const { reactive, computed, watch, onBeforeUnmount, inject, markRaw } = hooks + const { refs, service, parent } = vnode + const { utils = {} } = service || {} + const state = initState({ api, reactive, refs, computed, props, utils }) + + parent.tinyForm = parent.tinyForm || inject('form', null) + + initApi({ api, props, hooks, state, vnode, others, utils }) + initWatch({ api, state, props, watch, markRaw }) + + api.initGlobalTimezone() + + onBeforeUnmount(() => { + api.destroyPopper('remove') + + state.popperElm = null + state.picker = null + }) + + return api +} diff --git a/packages/renderless/src/pop-upload/index.ts b/packages/renderless/src/pop-upload/index.ts new file mode 100644 index 000000000..37f914e00 --- /dev/null +++ b/packages/renderless/src/pop-upload/index.ts @@ -0,0 +1,189 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const computedSetDialogTitle = ({ constants, props, t }) => () => props.dialogTitle || t(constants.DIALOG_TITLE) + +export const computedUploadSuccess = ({ constants, t }) => () => t(constants.UPLOAD_SUCCESS) + +export const computedCancel = ({ constants, props, t }) => () => props.cancelButtonText || t(constants.CANCEL_BUTTTON_TEXT) + +export const computedconfirm = ({ constants, props, t }) => () => props.submitButtonText || t(constants.SAVE_BUTTON_TEXT) + +export const computedFileName = ({ constants, t }) => () => t(constants.FILE_NAME) + +export const computedUploadError = ({ constants, t }) => () => t(constants.UPLOAD_ERROR) + +export const computedFileStatus = ({ constants, t }) => () => t(constants.FILE_STATUS) + +export const computedFileSize = ({ constants, t }) => () => t(constants.FILE_SIZE) + +export const computedErrorSizeTips = ({ constants, t }) => () => t(constants.ERROR_SIZE_TIPS) + +export const computedErrorNumTips = ({ constants, t }) => () => t(constants.ERROR_NUM_TIPS) + +export const computedErrorTypeTips = ({ constants, t }) => () => t(constants.ERROR_TYPE_TIPS) + +export const computedUploadButtonText = ({ constants, props, t }) => () => props.uploadButtonText || t(constants.UPLOAD_BUTTON_TEXT) + +export const computedUploadsButtonText = ({ constants, t }) => () => t(constants.UPLOADS_BUTTON_TEXT) + +export const computedTipsTitleText = ({ constants, t }) => () => t(constants.TIPS_TITLE_TEXT) + +export const computedLimitSizeTips = ({ constants, t }) => () => t(constants.LIMIT_UPLOAD_FILE_SIZE) + +export const computedLimitTypeTips = ({ constants, t }) => () => t(constants.LIMIT_UPLOAD_FILE_TYPE) + +export const computedLimitCountTips = ({ constants, t }) => () => t(constants.LIMIT_UPLOAD_FILE_NUMBER) + +export const fileUploadChange = (state) => (file, fileList) => (state.uploadList = fileList || []) + +export const deleteFile = ({ emit, state, props }) => (file) => { + let doRemove = () => { + state.uploadList.splice(state.uploadList.indexOf(file), 1) + + emit('remove', file, state.uploadList) + } + + if (!props.beforeRemove) { + doRemove() + } else if (typeof props.beforeRemove === 'function') { + const before = props.beforeRemove(file) + + if (before && before.then) { + before.then(doRemove, (e) => e) + } else if (before !== false) { + doRemove() + } + } +} + +export const watchWithCredentials = (state) => (value) => (state.withCredentials = value) + +export const uploadSubmit = (refs) => () => refs.upload.submit() + +export const abort = (refs) => () => refs.upload.abort() + +export const watchHeaders = (state) => (value) => (state.headers = value) + +export const watchAction = (state) => (value) => (state.action = value) + +export const watchMultiple = (state) => (value) => (state.multiple = value) + +export const watchDisabled = (state) => (value) => (state.disabled = value) + +export const watchAccept = (state) => (value) => (state.accept = value) + +export const closeErrorTips = (state) => () => (state.errorTips = []) + +export const closeSuccessTips = (state) => () => (state.successTips = []) + +export const watchFilters = (state) => (value) => (state.filters = value) + +export const watchLimit = (state) => (value) => { + state.limit = value + + if (value != undefined && value > 0) { + state.tipsTitle[0] = { + count: value + } + } else { + state.tipsTitle[0] = undefined + } +} + +export const watchUploaFileType = (state) => (value) => { + if (!Array.isArray(value)) { + state.tipsTitle[1] = undefined + return + } + + state.uploadFileType = value + + state.tipsTitle[1] = { + type: value.join(',') + } +} + +export const watchMaxUploadFileSize = ({ constants, state }) => (value) => { + state.maxUploadFileSize = value + + if (value != undefined && value != 0) { + state.tipsTitle[2] = { + size: Math.floor(value / 1024) + constants.KB + } + } else { + state.tipsTitle[2] = undefined + } +} + +export const showDialog = (state) => () => { + state.isShowDialog = true + state.uploadList = [] +} + +export const closeDialog = ({ refs, state }) => () => { + state.isShowDialog = false + state.errorTips = [] + state.successTips = [] + refs.upload.clearFiles() +} + +export const progressEvent = (emit) => (file) => { + emit('progress', file) +} + +export const errorEvent = ({ emit, state }) => (file) => { + state.errorTips.push({ error: file }) + emit('error', file) +} + +export const handleExceed = ({ emit, state }) => (files, fileList) => { + state.errorTips.push({ num: files }) + emit('exceed', files, fileList) +} + +export const handleAvatarSuccess = ({ api, emit, state }) => (res, file) => { + api.deleteFile(file) + state.successTips.push(file.name) + + emit('success', res, file) +} + +export const beforeAvatarUpload = ({ props, state }) => (file) => { + if (typeof props.beforeUpload === 'function') { + return props.beforeUpload(file) + } + + let filepath = file.name + let isnext = false + let isSize = false + + if (state.uploadFileType && state.uploadFileType.length != 0) { + let arr = filepath.split('.') + let fileend = '.' + arr[arr.length - 1] + + isnext = !~state.uploadFileType.indexOf(fileend) + + if (isnext) { + state.errorTips.push({ type: file.name }) + } + } + + if (state.maxUploadFileSize && state.maxUploadFileSize != 0) { + if (file.size > state.maxUploadFileSize) { + state.errorTips.push({ size: file.name }) + isSize = true + } + } + + return !isnext && !isSize +} diff --git a/packages/renderless/src/pop-upload/vue.ts b/packages/renderless/src/pop-upload/vue.ts new file mode 100644 index 000000000..b4ac1e97e --- /dev/null +++ b/packages/renderless/src/pop-upload/vue.ts @@ -0,0 +1,186 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + showDialog, + computedUploadSuccess, + closeSuccessTips, + computedUploadError, + progressEvent, + computedErrorNumTips, + beforeAvatarUpload, + handleAvatarSuccess, + handleExceed, + errorEvent, + watchWithCredentials, + abort, + computedErrorSizeTips, + computedErrorTypeTips, + computedFileName, + computedFileStatus, + computedFileSize, + computedLimitSizeTips, + computedLimitTypeTips, + computedLimitCountTips, + computedTipsTitleText, + closeErrorTips, + watchUploaFileType, + watchMaxUploadFileSize, + watchFilters, + watchAccept, + computedUploadButtonText, + computedUploadsButtonText, + watchDisabled, + watchMultiple, + watchLimit, + watchAction, + watchHeaders, + uploadSubmit, + closeDialog, + computedSetDialogTitle, + computedCancel, + computedconfirm, + fileUploadChange, + deleteFile +} from './index' + +export const api = [ + 'state', + 'closeSuccessTips', + 'abort', + 'beforeAvatarUpload', + 'beforeRemove', + 'handleAvatarSuccess', + 'handleExceed', + 'errorEvent', + 'progressEvent', + 'closeErrorTips', + 'uploadSubmit', + 'showDialog', + 'closeDialog', + 'fileUploadChange', + 'deleteFile' +] + +const initState = ({ reactive, props, computed, api }) => + reactive({ + errorTips: [], + uploadList: [], + successTips: [], + limit: props.limit, + isShowDialog: false, + accept: props.accept, + action: props.action, + filters: props.filters, + headers: props.headers, + disabled: props.disabled, + multiple: props.multiple, + uploadFileType: props.uploadFileType, + withCredentials: props.withCredentials, + maxUploadFileSize: props.maxUploadFileSize, + tipsTitle: [undefined, undefined, undefined], + fileSize: computed(() => api.computedFileSize()), + fileName: computed(() => api.computedFileName()), + fileStatus: computed(() => api.computedFileStatus()), + cancelButtonText: computed(() => api.computedCancel()), + submitButtonText: computed(() => api.computedconfirm()), + errorNumTips: computed(() => api.computedErrorNumTips()), + dialogTitle: computed(() => api.computedSetDialogTitle()), + errorSizeTips: computed(() => api.computedErrorSizeTips()), + tipsTitleText: computed(() => api.computedTipsTitleText()), + limitTypeTips: computed(() => api.computedLimitTypeTips()), + uploadErrorTips: computed(() => api.computedUploadError()), + errorTypeTips: computed(() => api.computedErrorTypeTips()), + limitSizeTips: computed(() => api.computedLimitSizeTips()), + limitCountTips: computed(() => api.computedLimitCountTips()), + uploadSuccessTips: computed(() => api.computedUploadSuccess()), + uploadButtonText: computed(() => api.computedUploadButtonText()), + uploadsButtonText: computed(() => api.computedUploadsButtonText()) + }) + +const initApi = ({ api, state, refs, emit, props, constants, t }) => { + Object.assign(api, { + state, + abort: abort(refs), + showDialog: showDialog(state), + watchLimit: watchLimit(state), + watchAction: watchAction(state), + uploadSubmit: uploadSubmit(refs), + watchAccept: watchAccept(state), + progressEvent: progressEvent(emit), + watchHeaders: watchHeaders(state), + watchFilters: watchFilters(state), + watchMultiple: watchMultiple(state), + watchDisabled: watchDisabled(state), + closeErrorTips: closeErrorTips(state), + deleteFile: deleteFile({ emit, state, props }), + errorEvent: errorEvent({ emit, state }), + closeSuccessTips: closeSuccessTips(state), + fileUploadChange: fileUploadChange(state), + closeDialog: closeDialog({ refs, state }), + handleExceed: handleExceed({ emit, state }), + watchUploaFileType: watchUploaFileType(state), + beforeAvatarUpload: beforeAvatarUpload({ props, state }), + watchWithCredentials: watchWithCredentials(state), + computedFileName: computedFileName({ constants, t }), + computedFileSize: computedFileSize({ constants, t }), + computedCancel: computedCancel({ constants, props, t }), + computedFileStatus: computedFileStatus({ constants, t }), + computedconfirm: computedconfirm({ constants, props, t }), + computedUploadError: computedUploadError({ constants, t }), + computedErrorNumTips: computedErrorNumTips({ constants, t }), + handleAvatarSuccess: handleAvatarSuccess({ api, emit, state }), + computedErrorTypeTips: computedErrorTypeTips({ constants, t }), + computedErrorSizeTips: computedErrorSizeTips({ constants, t }), + computedLimitSizeTips: computedLimitSizeTips({ constants, t }), + computedLimitTypeTips: computedLimitTypeTips({ constants, t }), + computedTipsTitleText: computedTipsTitleText({ constants, t }), + computedUploadSuccess: computedUploadSuccess({ constants, t }), + computedLimitCountTips: computedLimitCountTips({ constants, t }), + watchMaxUploadFileSize: watchMaxUploadFileSize({ constants, state }), + computedUploadsButtonText: computedUploadsButtonText({ constants, t }), + computedSetDialogTitle: computedSetDialogTitle({ constants, props, t }), + computedUploadButtonText: computedUploadButtonText({ constants, props, t }) + }) +} + +const initWatch = ({ watch, props, api }) => { + watch(() => props.withCredentials, api.watchWithCredentials, { immediate: true }) + + watch(() => props.uploadFileType, api.watchUploaFileType, { immediate: true }) + + watch(() => props.maxUploadFileSize, api.watchMaxUploadFileSize, { immediate: true }) + + watch(() => props.accept, api.watchAccept, { immediate: true }) + + watch(() => props.disabled, api.watchDisabled, { immediate: true }) + + watch(() => props.multiple, api.watchMultiple, { immediate: true }) + + watch(() => props.action, api.watchAction, { immediate: true }) + + watch(() => props.headers, api.watchHeaders, { immediate: true }) + + watch(() => props.filters, api.watchFilters, { immediate: true }) + + watch(() => props.limit, api.watchLimit, { immediate: true }) +} + +export const renderless = (props, { computed, reactive, watch }, { t, constants, emit, refs }) => { + const api = {} + const state = initState({ reactive, props, computed, api }) + + initApi({ api, state, refs, emit, props, constants, t }) + initWatch({ watch, props, api }) + + return api +} diff --git a/packages/renderless/src/popeditor/index.ts b/packages/renderless/src/popeditor/index.ts new file mode 100644 index 000000000..15556b971 --- /dev/null +++ b/packages/renderless/src/popeditor/index.ts @@ -0,0 +1,751 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { find } from '@opentiny/vue-renderless/common/array' +import { typeOf, isNull } from '@opentiny/vue-renderless/common/type' +import { getDataset } from '@opentiny/vue-renderless/common/dataset' +import { isNullOrEmpty } from '@opentiny/vue-renderless/common/string' +import { isEqual } from '@opentiny/vue-renderless/common/object' +import { eachTree } from '@opentiny/vue-renderless/grid/static' +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' + +export const computedGetTitle = ({ constants, props, t }) => props.title || t(constants.TITLE) + +export const computedModalWidth = ({ constants, props }) => { + let modalWidth = 0 + + if (props.multi) { + modalWidth = parseInt(props.width, 10) > constants.MODAL_WIDTH.multi ? `${parseInt(props.width, 10)}px` : `${constants.MODAL_WIDTH.multi}px` + } else { + modalWidth = parseInt(props.width, 10) > constants.MODAL_WIDTH.radio ? `${parseInt(props.width, 10)}px` : `${constants.MODAL_WIDTH.radio}px` + } + + return modalWidth +} + +export const createSearchForm = (props) => (isRest) => + props.conditions.reduce((acc, item) => { + if (typeof item.field === 'string') { + if (isRest) { + acc[item.field] = '' + } else { + acc[item.field] = item.defaultValue ? item.defaultValue : '' + } + } + + return acc + }, {}) + +export const getColumns = ({ constants, props }) => { + const { columns } = props.gridOp + + const selectionCol = find(columns, (col) => col.type === constants.COLUMNS_TYPE.selection || col.type === constants.COLUMNS_TYPE.radio) + + if (selectionCol) { + selectionCol.type = props.multi ? constants.COLUMNS_TYPE.selection : constants.COLUMNS_TYPE.radio + } else { + const indexCol = find(columns, (col) => col.type === constants.COLUMNS_TYPE.index) + + const index = indexCol ? 1 : 0 + + columns.splice(index, 0, { + type: props.multi ? constants.COLUMNS_TYPE.selection : constants.COLUMNS_TYPE.radio, + width: columns.length ? constants.COLUMNS_TYPE.width : '' + }) + } + + return columns +} + +export const getDisplay = ({ constants, props, state }) => () => { + if (props.popseletor === constants.TYPE_TREE) { + return state.treeSelectList.map((node) => node.value).join(props.textSplit) + } else if (props.multi) { + const displayTxt = [] + + state.selectedValues.forEach((val) => { + const item = find(state.selectedDatas, (data) => val == data[props.valueField]) + + if (item) { + displayTxt.push(item[props.textField]) + } else { + displayTxt.push(val) + } + }) + + return displayTxt.join(props.textSplit) + } else { + if (isNull(state.selectedDatas)) { + return '' + } else { + return typeOf(state.selectedDatas) === 'object' ? state.selectedDatas[props.textField] : state.selectedDatas + } + } +} + +export const getMultiSelectedData = ({ props, state }) => () => { + const values = [] + + state.selectedDatas.forEach((item) => { + item[props.valueField] && values.push(item[props.valueField]) + }) + + state.commitValue = Array.isArray(props.modelValue) ? values : values.join(props.valueSplit) +} + +export const getRadioSelectedData = ({ constants, props, state, vm }) => () => { + const refs = vm.$refs + + const table = props.showHistory && state.activeName === 'history' ? refs[constants.GRID_REF.history] : refs[constants.GRID_REF.source] + const radioRow = table && table.getRadioRow() + + if (radioRow) { + state.selectedDatas = radioRow + } + + state.commitValue = state.selectedDatas ? state.selectedDatas[props.valueField] : '' +} + +export const handleClear = ({ constants, emit, props, state }) => () => { + if (state.disabled) { + return + } + + state.display = '' + state.commitValue = Array.isArray(props.modelValue) ? [] : '' + state.treeSelectList = [] + state.selectedDatas = [] + state.selectedValues = [] + + if (!isEqual(state.commitValue, props.modelValue)) { + emit('update:modelValue', state.commitValue) + + emit('change', state.commitValue, props.popseletor === constants.TYPE_GRID ? state.treeSelectList : state.selectedDatas) + } +} + +export const handleConfirm = ({ api, constants, emit, props, state }) => (skipBeforeClose) => { + if (skipBeforeClose !== true && typeof props.beforeClose === 'function' && props.beforeClose('confirm') === false) { + return + } + + if (props.popseletor === constants.TYPE_GRID) { + props.multi ? api.getMultiSelectedData({ props, state }) : api.getRadioSelectedData() + + if (!isNull(state.commitValue)) { + state.display = api.getDisplay({ props, state }) + + if (!isEqual(state.commitValue, props.modelValue)) { + state.display = '' + emit('update:modelValue', state.commitValue) + emit('change', state.commitValue, state.selectedDatas) + } + } + } + + if (props.popseletor === constants.TYPE_TREE) { + const commitValue = state.treeSelectList.map((item) => item.id).join(props.valueSplit) + + if (!isEqual(commitValue, props.modelValue)) { + emit('update:modelValue', commitValue) + emit('change', commitValue, state.treeSelectList) + } + } + + state.open = false +} + +export const handleReset = ({ api, state, props }) => () => { + state.search = api.createSearchForm(true) + + if (state.filterText) { + state.filterText = '' + } + + if (!props.beforeReset || (typeof props.beforeReset === 'function' && props.beforeReset(state.conditions) !== false)) { + api.handleSearch() + } +} + +export const handleOpen = ({ api, constants, props, state }) => (event) => { + if (event.target.tagName === constants.TAG_NAME && state.readonly) { + api.openDialog({ api, props, state }) + } +} + +export const handleSearch = ({ api, refs, constants }) => () => { + const sourcetable = refs[constants.GRID_REF.source] + + sourcetable && sourcetable.clearRadioRow() + + api.query() +} + +const cancelOrClose = ({ props, state, constants }) => { + state.open = false + + if (props.popseletor === constants.TYPE_TREE) { + const { treeSelectList } = state.cacheStore + + state.treeSelectList = treeSelectList.slice(0) + } else { + if (props.multi) { + const { selectedDatas, selectedValues } = state.cacheStore + + state.selectedDatas = selectedDatas.slice(0) + state.selectedValues = selectedValues.slice(0) + } + } +} + +export const handleCancel = ({ props, state, constants }) => () => { + if (typeof props.beforeClose === 'function' && props.beforeClose('cancel') === false) { + return + } + + cancelOrClose({ props, state, constants }) +} + +export const handleBeforeClose = ({ props, state, constants }) => () => { + if (typeof props.beforeClose === 'function' && props.beforeClose('close') === false) { + return false + } + + cancelOrClose({ props, state, constants }) +} + +export const handleSizeChange = ({ api, emit, state }) => (val) => { + state.pagerConfig.currentPage = val + api.handlePager() + emit('page-change', val) +} + +const renderTextHandler = ({ state, props, datas, dataset, value }) => { + const rows = [] + let arrValues + + if (Array.isArray(value)) { + arrValues = value.slice(0) + } else { + arrValues = value && ~['string', 'number'].indexOf(typeof value) ? value.toString().split(props.valueSplit) : [] + } + + arrValues.forEach((val) => { + const item = find(dataset, (data) => val == data[props.valueField]) || find(datas, (data) => val == data[props.valueField]) + item && rows.push(item) + }) + + if (props.multi) { + state.selectedValues = arrValues + state.selectedDatas = rows + + state.cacheStore = { + selectedDatas: rows.slice(0), + selectedValues: arrValues.slice(0) + } + } else { + state.selectedDatas = rows[0] + state.commitValue = state.selectedDatas ? state.selectedDatas[props.valueField] : '' + } +} + +const getTreeSelectList = ({ value, state, props }) => { + value = typeOf(value) === 'number' ? (isNaN(value) ? '' : String(value)) : value + + let treeSelectList = [] + + if (!isNullOrEmpty(value)) { + const values = value.split(props.valueSplit) + const selectdTreeNodeList = [] + const { id, label, children } = state.treeOp.props + + eachTree( + state.treeOp.data, + (node) => { + if (values.some((val) => val == node[id])) { + selectdTreeNodeList.push({ id: node[id], value: node[label] }) + } + }, + { children } + ) + + if (selectdTreeNodeList.length) { + treeSelectList = selectdTreeNodeList + } + } + + return treeSelectList +} + +export const initDisplay = ({ api, constants, props, state, nextTick }) => (value) => { + const dataset = props.remoteSearch || props.dataset ? state.sourceGridDataset.concat(state.selectedDatas || '') : (props.gridOp && props.gridOp.data) || [] + + const getRenderTextData = props.textRenderSource || (() => Promise.resolve([])) + + if (props.popseletor !== constants.TYPE_TREE && (props.multi || props.textRenderSource)) { + getRenderTextData(value).then((datas) => { + renderTextHandler({ state, props, datas, dataset, value }) + + nextTick(() => { + state.display = api.getDisplay({ props, state }) + }) + }) + } else { + const item = find(dataset, (data) => value == data[props.valueField]) + + state.selectedDatas = item || value + + if (props.popseletor === constants.TYPE_GRID) { + state.commitValue = state.selectedDatas ? state.selectedDatas[props.valueField] : '' + } else if (props.popseletor === constants.TYPE_TREE) { + const treeSelectList = getTreeSelectList({ value, state, props }) + + state.treeSelectList = treeSelectList + state.cacheStore = { + treeSelectList: treeSelectList.slice(0) + } + } + + nextTick(() => { + state.display = api.getDisplay({ props, state }) + }) + } +} + +export const openDialog = ({ api, props, state, emit }) => () => { + if (state.disabled) { + return + } + + state.closeSuggestPanelInvoker = 'openDialog' + api.closeSuggestPanel(true) + + state.open = true + emit('popup') + props.autoLookup && props.alwaysLoad && api.query() +} + +const localFilter = ({ props, state }) => { + const keys = Object.keys(state.search) + const dataset = (props.gridOp && props.gridOp.data) || [] + + return dataset.filter((item) => keys.every((key) => item[key] && item[key].toString().toLowerCase().includes(state.search[key].toLowerCase()))) +} + +export const query = ({ props, state, parent, constants }) => (page) => { + const { remoteSearch, dataset } = props + + page || (state.pagerConfig.currentPage = 1) + + return new Promise((resolve) => { + state.loading = true + + if (remoteSearch || dataset) { + const { currentPage, pageSize } = state.pagerConfig + + if (remoteSearch) { + props + .remoteSearch({ + page: { currentPage, pageSize }, + conditions: state.search + }) + .then((data) => { + state.sourceGridDataset = data.data + state.pagerConfig.total = data.total + state.loading = false + resolve() + }) + .finally(() => { + state.loading = false + }) + } else { + getDataset({ dataset, service: parent.$service, tree: props.treeOp }, { pageVO: { curPage: currentPage, pageSize } }) + .then((data) => { + const { result, pageVO = {} } = data + + if (props.popseletor === constants.TYPE_TREE) { + props.treeOp.data = result || data + } else { + state.sourceGridDataset = result || data + state.pagerConfig.total = pageVO.totalRows || 0 + } + + state.loading = false + resolve() + }) + .finally(() => { + state.loading = false + }) + } + } else { + state.fullGridData = localFilter({ state, props }) + + state.loading = false + resolve() + } + }) +} + +export const selectedGridSelectAll = ({ constants, vm, state }) => ({ checked }) => { + const refs = vm.$refs + + if (!checked) { + const sourcetable = refs[constants.GRID_REF.source] + const historytable = refs[constants.GRID_REF.history] + + sourcetable && sourcetable.clearSelection() + historytable && historytable.clearSelection() + + state.selectedValues = [] + state.selectedDatas = [] + } +} + +const copySelectDatas = (state) => { + state.selectedValues = state.selectedValues.slice(0) + state.selectedDatas = state.selectedDatas.slice(0) +} + +export const selectedGridSelectChange = ({ constants, props, vm, state }) => ({ checked, row }, event) => { + const refs = vm.$refs + + if (!checked) { + const len = state.selectedValues.length + event.target.checked = !checked + + for (let i = 0; i < len; i++) { + if (state.selectedValues[i] == row[props.valueField]) { + state.selectedValues.splice(i, 1) + state.selectedDatas.splice(i, 1) + + const sourcetable = refs[constants.GRID_REF.source] + const historytable = refs[constants.GRID_REF.history] + + sourcetable && + sourcetable.setSelection( + sourcetable.data.filter((lrow) => lrow[props.valueField] == row[props.valueField]), + false + ) + + historytable && + historytable.setSelection( + historytable.data.filter((lrow) => lrow[props.valueField] == row[props.valueField]), + false + ) + break + } + } + + copySelectDatas(state) + } +} + +export const sourceGridSelectAll = ({ props, state, api }) => ({ selection, checked }) => { + if (checked) { + selection.forEach((item) => { + if (!find(state.selectedValues, (val) => val == item[props.valueField])) { + state.selectedValues.push(item[props.valueField]) + state.selectedDatas.push(item) + } + }) + } else { + const len = state.sourceGridDataset.length + + for (let i = 0; i < len; i++) { + const sourceGridItem = state.sourceGridDataset[i][props.valueField] + + const selectedItem = find(state.selectedValues, (val) => val == sourceGridItem) + + const index = state.selectedValues.indexOf(selectedItem) + + if (index !== -1) { + state.selectedValues.splice(index, 1) + state.selectedDatas.splice(index, 1) + } + } + } + + if (state.showSuggestPanel) { + if (!checked) { + state.selectedValues = [] + state.selectedDatas = [] + } + + api.handleConfirm() + } + + copySelectDatas(state) +} + +export const sourceGridSelectChange = ({ props, state, api }) => ({ checked, row, confirm }) => { + if (checked) { + state.selectedValues.push(row[props.valueField]) + state.selectedDatas.push(row) + } else { + state.selectedValues.forEach((item, index) => { + if (row[props.valueField] == item) { + state.selectedValues.splice(index, 1) + state.selectedDatas.splice(index, 1) + } + }) + } + + if (state.showSuggestPanel && confirm !== false) { + api.handleConfirm() + } + + copySelectDatas(state) +} + +export const filterNode = () => (value, data) => { + if (!value) { + return true + } + return data.label.includes(value) +} + +export const watchFilterText = (vm) => (value) => { + const refs = vm.$refs + if (refs.tree) { + refs.tree.filter(value) + } +} + +export const computedTreeOp = ({ api, constants }) => (props, state) => { + let treeOp = props.treeOp + + if (typeof treeOp.showCheckbox === 'undefined' && typeof treeOp.showRadio === 'undefined') { + treeOp.showCheckbox = true + } + + if (typeof treeOp.defaultExpandAll === 'undefined') { + treeOp.defaultExpandAll = true + } + + treeOp.showCheckbox = treeOp.showCheckbox === true + treeOp.showRadio = treeOp.showRadio === true + treeOp.filterNodeMethod = treeOp.filterNodeMethod || api.filterNode + treeOp.defaultExpandAll = treeOp.defaultExpandAll === true + treeOp.checkStrictly = treeOp.checkStrictly !== false + treeOp.expandOnClickNode = false + treeOp.nodeKey = treeOp.nodeKey || constants.ID + treeOp.defaultCheckedKeys = state.treeSelectList.map((item) => item.id) + + treeOp.props = { + label: props.textField || constants.LABEL, + id: props.valueField || constants.ID, + children: 'children', + ...treeOp.props + } + + return treeOp +} + +export const treeCheckChange = ({ constants, state, props }) => (data, checked) => { + if (state.treeOp.showRadio) { + const valueField = props.valueField || constants.ID + const textField = props.textField || constants.LABEL + const treeSelectList = [{ id: data[valueField], value: data[textField] }] + + state.treeSelectList = treeSelectList + } else { + if (checked) { + state.treeSelectList.push({ + id: data[state.treeOp.props.id], + value: data[state.treeOp.props.label] + }) + } else { + state.treeSelectList = state.treeSelectList.filter((item) => item.id !== data[state.treeOp.props.id]) + } + } +} + +export const handleNumberPageChange = ({ api, emit, state }) => (size) => { + state.pagerConfig.currentPage = 1 + state.pagerConfig.pageSize = size + api.handlePager() + emit('size-change', size) +} + +export const doSearch = ({ api, state, props }) => (params) => { + const conditions = props.conditions + + for (let i = 0; i < conditions.length; i++) { + const condition = conditions[i] + + if (typeof params === 'object' && typeof params[condition.field] !== 'undefined') { + state.searchOp[condition.field] = params[condition.field] ? params[condition.field] : '' + + state.search[condition.field] = params[condition.field] ? params[condition.field] : '' + } else { + state.search[condition.field] = state.searchOp[condition.field] + } + } + + api.handleSearch() +} + +export const doClear = ({ api, state, props }) => (params) => { + const conditions = props.conditions + + for (let i = 0; i < conditions.length; i++) { + const condition = conditions[i] + + if (typeof params === 'object' && typeof params[condition.field] !== 'undefined') { + params[condition.field] = '' + } + + state.searchOp[condition.field] = '' + state.search[condition.field] = '' + } + + api.handleSearch() +} + +export const getSuggestParam = ({ state, props, api }) => (input) => { + if (typeof input !== 'string') { + input = state.display + } + + if (!props.bypass) { + const texts = api.getDisplay().split(props.textSplit) + const inputs = input.split(props.textSplit).filter((s) => !!s) + const removed = texts.filter((str) => !~inputs.indexOf(str)) + const addtions = inputs.filter((str) => !~texts.indexOf(str)) + + return { addtions, removed } + } + + return input +} + +export const updateSuggestWidth = ({ refs }) => () => { + let $input = refs.reference.getInput() + refs.popper.style.width = $input.clientWidth + 'px' +} + +export const doSuggesst = ({ state, props, popper, api }) => (event) => { + if (!props.suggest) { + return + } + + let query = event + + off(window, 'resize', api.updateSuggestWidth) + off(document, 'click', api.closeSuggestPanel) + on(document, 'click', api.closeSuggestPanel) + on(window, 'resize', api.updateSuggestWidth) + + api.updateSuggestWidth() + + // 点击下拉按钮直接触发场景 + if (typeof event !== 'string') { + if (props.multi && !state.suggestList.length) { + state.suggestList = [].concat(state.selectedDatas) + } + + state.showSuggestPanel = true + } + + if (props.remoteSearch) { + const doQuery = (query) => { + state.showSuggestPanel = true + + props.remoteSearch({ query }).then((data) => { + state.suggestList = data.data + popper.updatePopper() + }) + } + + if (!props.bypass && props.multi) { + const { removed, addtions } = api.getSuggestParam(event) + + query = addtions + + removed.forEach((text) => { + const row = find(state.selectedDatas, (node) => text === node[props.textField]) + + api.sourceGridSelectChange({ checked: false, row, confirm: false }) + }) + + if (addtions.length) { + doQuery(query) + } + } else { + doQuery(state.display) + } + } +} + +export const closeSuggestPanel = ({ state, api, refs }) => (event = false) => { + const { reference, popper } = refs + let keep = !event + + if (event.target) { + keep = reference.$el.contains(event.target) || popper.contains(event.target) + } + + if (!keep) { + off(document, 'click', api.closeSuggestPanel) + off(window, 'resize', api.updateSuggestWidth) + + api.handleConfirm(state.closeSuggestPanelInvoker === 'openDialog') + state.closeSuggestPanelInvoker = null + + state.showSuggestPanel = false + } +} + +export const suggestRadioChange = ({ state, api }) => ({ row }) => { + state.selectedDatas = row + state.showSuggestPanel = false + + api.handleConfirm() +} + +export const handlePager = ({ api, props, state }) => () => { + if (!props.showPager) { + state.sourceGridDataset = state.fullGridData + return + } + + const data = state.fullGridData + const { pageSize, currentPage } = state.pagerConfig + + if (!props.remoteSearch && !props.dataset) { + state.sourceGridDataset = data.slice((currentPage - 1) * pageSize, currentPage * pageSize) + + state.pagerConfig.total = data.length + } else { + api.query(true) + } +} + +export const initSearchOption = ({ api, state }) => (conditions) => { + for (let i = 0; i < conditions.length; i++) { + const condition = conditions[i] + state.searchOp[condition.field] = '' + } + + state.searchOp.doSearch = api.doSearch + state.searchOp.doClear = api.doClear +} + +export const mounted = ({ api, props }) => () => { + if (props.autoLookup) { + api.query().then(() => { + api.initDisplay(props.modelValue) + }) + } else { + api.initDisplay(props.modelValue) + } +} diff --git a/packages/renderless/src/popeditor/vue.ts b/packages/renderless/src/popeditor/vue.ts new file mode 100644 index 000000000..d11587baa --- /dev/null +++ b/packages/renderless/src/popeditor/vue.ts @@ -0,0 +1,227 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import debounce from '@opentiny/vue-renderless/common/deps/debounce' +import userPopper from '@opentiny/vue-renderless/common/deps/vue-popper' +import { + computedGetTitle, + computedTreeOp, + computedModalWidth, + createSearchForm, + filterNode, + getColumns, + getDisplay, + getMultiSelectedData, + getRadioSelectedData, + handleClear, + handleConfirm, + handleOpen, + handleReset, + handleCancel, + handleBeforeClose, + handleSearch, + handleSizeChange, + initDisplay, + openDialog, + query, + selectedGridSelectAll, + selectedGridSelectChange, + sourceGridSelectAll, + sourceGridSelectChange, + treeCheckChange, + watchFilterText, + handleNumberPageChange, + doSearch, + doClear, + doSuggesst, + closeSuggestPanel, + getSuggestParam, + suggestRadioChange, + updateSuggestWidth, + handlePager, + initSearchOption, + mounted +} from './index' + +export const api = [ + 'state', + 'handleOpen', + 'openDialog', + 'handleClear', + 'handleConfirm', + 'handleReset', + 'handleSearch', + 'handleCancel', + 'handleBeforeClose', + 'handleSizeChange', + 'selectedGridSelectAll', + 'selectedGridSelectChange', + 'sourceGridSelectAll', + 'sourceGridSelectChange', + 'treeCheckChange', + 'handleNumberPageChange', + 'doSearch', + 'doClear', + 'doSuggesst', + 'closeSuggestPanel', + 'popper', + 'doSuggesstNow', + 'suggestRadioChange' +] + +const initState = ({ reactive, computed, props, api, constants, t, parent }) => { + const state = reactive({ + open: false, + display: '', + getTitle: computed(() => api.computedGetTitle({ constants, props, t })), + readonly: computed(() => !props.suggest && props.readonly), + modalWidth: computed(() => api.computedModalWidth({ constants, props })), + conditions: props.conditions, + activeName: props.showHistory ? constants.ACTIVE_NAME.history : constants.ACTIVE_NAME.source, + commitValue: Array.isArray(props.modelValue) ? props.modelValue.slice(0) : props.modelValue, + currentPage: 1, + baseColumns: computed(() => getColumns({ constants, props })), + selectedDatas: [], + selectedValues: [], + sourceGridDataset: [], + fullGridData: [], + historyGridDataset: [], + filterText: '', + treeOp: computed(() => api.computedTreeOp(props, state)), + + pagerConfig: reactive({ + currentPage: 1, + pageSize: 10, + total: 0, + layout: 'prev,pager,next', + ...(props.gridOp.pagerOp || props.pagerOp || {}) + }), + + loading: false, + treeSelectList: [], + radioConfig: props.radioConfig, + searchOp: {}, + cacheStore: {}, + formDisabled: computed(() => (parent.tinyForm || {}).disabled), + disabled: computed(() => props.disabled || state.formDisabled), + suggestList: [], + showSuggestPanel: false, + inputHover: false, + search: null, + closeSuggestPanelInvoker: null + }) + + return state +} + +const initApi = ({ api, props, state, parent, refs, emit, popper, constants, vm, nextTick }) => { + Object.assign(api, { + state, + popper, + computedGetTitle, + computedModalWidth, + filterNode: filterNode(), + query: query({ constants, parent, props, state }), + watchFilterText: watchFilterText(vm), + treeCheckChange: treeCheckChange({ constants, state, props }), + getDisplay: getDisplay({ constants, props, state }), + createSearchForm: createSearchForm(props), + handleCancel: handleCancel({ props, state, constants }), + handleBeforeClose: handleBeforeClose({ props, state, constants }), + getMultiSelectedData: getMultiSelectedData({ props, state }), + getRadioSelectedData: getRadioSelectedData({ constants, props, state, vm }), + selectedGridSelectAll: selectedGridSelectAll({ constants, props, vm, state }), + selectedGridSelectChange: selectedGridSelectChange({ constants, props, vm, state }), + handleReset: handleReset({ api, state, props }), + openDialog: openDialog({ api, emit, props, state }), + initDisplay: initDisplay({ api, constants, props, state, nextTick }), + handleSearch: handleSearch({ api, props, state, refs, constants }), + computedTreeOp: computedTreeOp({ api, constants }), + handleSizeChange: handleSizeChange({ api, emit, state }), + handleOpen: handleOpen({ api, constants, props, state }), + handleClear: handleClear({ constants, emit, props, state }), + handleConfirm: handleConfirm({ api, constants, emit, props, state }), + handleNumberPageChange: handleNumberPageChange({ api, emit, state }), + doSearch: doSearch({ api, state, props }), + doClear: doClear({ api, state, props }), + updateSuggestWidth: updateSuggestWidth({ refs }), + doSuggesstNow: doSuggesst({ api, state, props, popper }), + doSuggesst: debounce(1000, doSuggesst({ api, state, props, popper })), + closeSuggestPanel: closeSuggestPanel({ api, state, refs }), + sourceGridSelectChange: sourceGridSelectChange({ props, state, api }), + sourceGridSelectAll: sourceGridSelectAll({ props, state, api }), + getSuggestParam: getSuggestParam({ props, state, api }), + suggestRadioChange: suggestRadioChange({ api, state }), + handlePager: handlePager({ api, props, state }), + initSearchOption: initSearchOption({ api, state }), + mounted: mounted({ api, props }) + }) + + state.search = api.createSearchForm(false) +} + +const initWatch = ({ watch, props, api, state, popper }) => { + watch( + () => props.gridOp.data, + (value) => { + state.fullGridData = value + api.initDisplay(props.modelValue) + } + ) + + watch(() => state.fullGridData, api.handlePager) + + watch(() => props.modelValue, api.initDisplay) + + watch(() => state.filterText, api.watchFilterText, { deep: true }) + + watch( + () => state.showSuggestPanel, + (value) => { + popper.showPopper.value = value + }, + { immediate: true } + ) + + watch(() => props.conditions, api.initSearchOption, { deep: true, immediate: true }) +} + +export const renderless = ( + props, + { computed, onMounted, reactive, watch, inject, toRefs, onBeforeUnmount, onDeactivated }, + { t, refs, parent, emit, constants, vm, nextTick, slots } +) => { + const api = {} + const state = initState({ reactive, computed, props, api, constants, t, parent }) + const popper = userPopper({ + emit, + refs, + watch, + onBeforeUnmount, + props, + nextTick, + toRefs, + slots, + reactive, + onDeactivated + }) + + parent.tinyForm = parent.tinyForm || inject('form', null) + + initApi({ api, props, state, parent, refs, emit, popper, constants, vm, nextTick }) + initWatch({ watch, props, api, state, popper }) + + onMounted(api.mounted) + onBeforeUnmount(api.closeSuggestPanel) + + return api +} diff --git a/packages/renderless/src/popover/index.ts b/packages/renderless/src/popover/index.ts new file mode 100644 index 000000000..abd1ea3f4 --- /dev/null +++ b/packages/renderless/src/popover/index.ts @@ -0,0 +1,215 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { on, off, addClass, removeClass } from '@opentiny/vue-renderless/common/deps/dom' +import { guid } from '@opentiny/vue-renderless/common/string' +import { KEY_CODE } from '@opentiny/vue-renderless/common' + +const processTrigger = ({ api, state, props, nextTick }) => { + const { referenceElm, popperElm } = state + + if (props.trigger === 'click') { + on(referenceElm, 'click', api.doToggle) + on(document, 'click', api.handleDocumentClick) + } else if (props.trigger === 'hover') { + on(referenceElm, 'mouseenter', api.handleMouseEnter) + on(popperElm, 'mouseenter', api.handleMouseEnter) + on(referenceElm, 'mouseleave', api.handleMouseLeave) + on(popperElm, 'mouseleave', api.handleMouseLeave) + } else if (props.trigger === 'focus') { + if (referenceElm.querySelector('input, textarea')) { + on(referenceElm, 'focusin', api.doShow) + on(referenceElm, 'focusout', api.doClose) + } else { + on(referenceElm, 'mousedown', api.doShow) + on(referenceElm, 'mouseup', api.doClose) + } + } else if (props.trigger === 'manual') { + // 手动模式,且用户初始modelValue=true,要触发show + if (props.modelValue) { + nextTick(api.doShow) + } + } +} + +/* istanbul ignore next */ +export const mounted = ({ api, state, constants, props, nextTick }) => () => { + state.mounted = true + + const { referenceElm, popperElm, tooltipId } = state + + if (referenceElm) { + addClass(referenceElm, `${constants.IDPREFIX}__reference`) + + referenceElm.setAttribute('aria-describedby', tooltipId) + referenceElm.setAttribute('tabindex', props.tabindex) + popperElm.setAttribute('tabindex', 0) + + if (props.trigger !== 'click') { + on(referenceElm, 'focusin', () => { + api.handleFocus() + + const instance = referenceElm.__vue__ + + if (instance && typeof instance.focus === 'function') { + instance.focus() + } + }) + + on(popperElm, 'focusin', api.handleFocus) + on(referenceElm, 'focusout', api.handleBlur) + on(popperElm, 'focusout', api.handleBlur) + } + + on(referenceElm, 'keydown', api.handleKeydown) + on(referenceElm, 'click', api.handleClick) + } + + processTrigger({ api, state, props, nextTick }) +} + +export const doToggle = (state) => () => { + state.showPopper = !state.showPopper +} + +export const doShow = (state) => () => { + state.showPopper = true +} + +export const doClose = (state) => () => { + state.showPopper = false +} + +export const handleFocus = ({ props, state }) => () => { + addClass(state.referenceElm, 'focusing') + + if (props.trigger === 'click' || props.trigger === 'focus') { + state.showPopper = true + } +} + +/* istanbul ignore next */ +export const handleClick = (state) => (event) => { + const popperElm = state.popperElm + // 在webcomponents环境中,在事件传播到document之前对正确的target进行缓存 + if (event?.target && popperElm) { + popperElm.webCompEventTarget = event.target + } + removeClass(state.referenceElm, 'focusing') +} + +export const handleBlur = ({ props, state }) => () => { + removeClass(state.referenceElm, 'focusing') + + if (props.trigger === 'click' || props.trigger === 'focus') { + state.showPopper = false + } +} + +export const handleMouseEnter = ({ props, state }) => () => { + clearTimeout(state.timer) + + if (props.openDelay) { + state.timer = setTimeout(() => { + state.showPopper = true + }, props.openDelay) + } else { + state.showPopper = true + } +} + +export const handleKeydown = ({ api, props }) => (event) => { + if (event.keyCode === KEY_CODE.Escape && props.trigger !== 'manual') { + api.doClose() + } +} + +export const handleMouseLeave = ({ props, state }) => () => { + clearTimeout(state.timer) + + if (props.closeDelay) { + state.timer = setTimeout(() => { + state.showPopper = false + }, props.closeDelay) + } else { + state.showPopper = false + } +} + +/* istanbul ignore next */ +export const handleDocumentClick = ({ refs, state }) => (event) => { + const reference = state.referenceElm + const popperElm = state.popperElm + const $el = refs.root + let target = event.target + + // 解决组件在webcomponents中触发document的click事件,但是e.target始终是webcomponents自定义标签,从而引起的判断失效的bug + if (target?.shadowRoot && popperElm) { + target = popperElm.webCompEventTarget + } + + if (!$el || !reference || $el.contains(target) || reference.contains(target) || !popperElm || popperElm.contains(target)) { + return + } + + state.showPopper = false +} + +export const handleAfterEnter = (emit) => () => { + emit('after-enter') +} + +export const handleAfterLeave = (emit) => () => { + emit('after-leave') +} + +export const handleItemClick = ({ emit, state }) => (item) => { + state.showPopper = false + emit('item-click', item) +} + +export const cleanup = ({ props, state }) => () => { + if (props.openDelay) { + clearTimeout(state.timer) + } +} + +/* istanbul ignore next */ +export const destroyed = ({ state, api }) => () => { + const reference = state.referenceElm + + off(reference, 'click', api.doToggle) + off(reference, 'mouseup', api.doClose) + off(reference, 'mousedown', api.doShow) + off(reference, 'focusin', api.doShow) + off(reference, 'focusout', api.doClose) + off(reference, 'mousedown', api.doShow) + off(reference, 'mouseup', api.doClose) + off(reference, 'mouseleave', api.handleMouseLeave) + off(reference, 'mouseenter', api.handleMouseEnter) + off(document, 'click', api.handleDocumentClick) +} + +export const computedTooltipId = (constants) => () => `${constants.IDPREFIX}-${guid('', 4)}` + +export const wrapMounted = ({ api, props, refs, state }) => () => { + const { reference, popper, wrapper } = refs + const referenceElm = (state.referenceElm = props.reference || reference) + + state.popperElm = state.popperEl || popper + + if (!referenceElm && wrapper.children) { + state.referenceElm = wrapper.children[0] || wrapper + } + + state.referenceElm && api.mounted() +} diff --git a/packages/renderless/src/popover/vue.ts b/packages/renderless/src/popover/vue.ts new file mode 100644 index 000000000..6b738354f --- /dev/null +++ b/packages/renderless/src/popover/vue.ts @@ -0,0 +1,115 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { + mounted, + computedTooltipId, + destroyed, + doToggle, + doShow, + doClose, + handleFocus, + handleClick, + handleBlur, + handleKeydown, + handleAfterEnter, + handleAfterLeave, + handleMouseEnter, + handleMouseLeave, + handleDocumentClick, + cleanup, + wrapMounted, + handleItemClick +} from './index' +import userPopper from '@opentiny/vue-renderless/common/deps/vue-popper' + +export const api = ['state', 'handleAfterEnter', 'handleAfterLeave', 'handleItemClick'] + +const initState = ({ reactive, computed, api, popperElm, showPopper, referenceElm }) => { + const state = reactive({ + popperElm, + showPopper, + timer: null, + mounted: false, + referenceElm, + tooltipId: computed(() => api.computedTooltipId()) + }) + return state +} + +const initApi = ({ api, props, state, refs, emit, doDestroy, constants, nextTick }) => { + Object.assign(api, { + state, + mounted: mounted({ api, state, constants, props, nextTick }), + cleanup: cleanup({ state, props }), + destroyed: destroyed({ state, api }), + doDestroy, + computedTooltipId: computedTooltipId(constants), + doShow: doShow(state), + doClose: doClose(state), + doToggle: doToggle(state), + handleClick: handleClick(state), + handleAfterEnter: handleAfterEnter(emit), + handleBlur: handleBlur({ props, state }), + handleFocus: handleFocus({ props, state }), + handleKeydown: handleKeydown({ api, props }), + handleMouseLeave: handleMouseLeave({ props, state }), + handleAfterLeave: handleAfterLeave(emit), + handleMouseEnter: handleMouseEnter({ props, state }), + handleDocumentClick: handleDocumentClick({ refs, state }), + wrapMounted: wrapMounted({ api, props, refs, state }), + handleItemClick: handleItemClick({ emit, state }), + }) +} + +const initWatch = ({ watch, props, state, emit }) => { + watch( + () => state.showPopper, + (val) => { + if (props.disabled) { + return + } + + val ? emit('show') : emit('hide') + }, + { immediate: true } + ) +} + +export const renderless = ( + props, + { reactive, computed, watch, toRefs, onBeforeUnmount, onMounted, onUnmounted, onActivated, onDeactivated }, + { $prefix, emit, refs, slots, nextTick } +) => { + const api = {} + const constants = { IDPREFIX: `${$prefix.toLowerCase()}-popover` } + const options = { emit, onBeforeUnmount, nextTick, reactive, props, watch, onDeactivated, refs, slots, toRefs } + const { showPopper, popperElm, referenceElm, doDestroy } = userPopper(options) + const state = initState({ reactive, computed, api, popperElm, showPopper, referenceElm }) + + initApi({ api, constants, props, state, refs, emit, doDestroy, nextTick }) + + onDeactivated(() => { + api.destroyed() + api.cleanup() + }) + + // 注册生命周期函数必须要在(watch)异步函数/组件之前,否则会 Vue3 警告 + onMounted(api.wrapMounted) + onActivated(api.mounted) + onUnmounted(api.destroyed) + onBeforeUnmount(api.cleanup) + + initWatch({ watch, props, state, emit }) + + return api +} diff --git a/packages/renderless/src/popup/index.ts b/packages/renderless/src/popup/index.ts new file mode 100644 index 000000000..cd7825fdd --- /dev/null +++ b/packages/renderless/src/popup/index.ts @@ -0,0 +1,128 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' +import { touchStart, touchMove } from '@opentiny/vue-renderless/common/deps/touch' +import { getScroller } from '@opentiny/vue-renderless/dropdown-menu' +import { isNull } from '@opentiny/vue-renderless/common/type' + +export const getStyle = (props) => () => { + const style = { ...props.popupStyle } + + if (!isNull(props.duration)) { + const key = props.position === 'center' ? 'animationDuration' : 'transitionDuration' + + style[key] = `${props.duration}s` + } + + return style +} + +export const watchValue = (api) => (value) => { + const type = value ? 'open' : 'close' + api[type]() +} + +export const open = ({ api, constants, emit, props, state }) => () => { + if (state.opened) { + return + } + + if (props.zIndex !== undefined) { + state.context.zIndex = props.zIndex + } + + api.renderOverlay() + + state.opened = true + + emit('open') + + if (props.lockScroll) { + on(document, 'touchstart', touchStart) + on(document, 'touchmove', api.onTouchMove) + + if (!state.context.lockCount) { + document.body.classList.add(constants.OVERFLOWHIDDEN) + } + + state.context.lockCount++ + } +} + +export const close = ({ api, constants, emit, props, state }) => () => { + if (!state.opened) { + return + } + + if (props.lockScroll) { + state.context.lockCount-- + + off(document, 'touchstart', touchStart) + off(document, 'touchmove', api.onTouchMove) + + if (!state.context.lockCount) { + document.body.classList.remove(constants.OVERFLOWHIDDEN) + } + } + + state.opened = false + + emit('update:modelValue', false) + emit('close') +} + +export const onTouchMove = ({ refs, state }) => (event) => { + touchMove(event) + + const direction = state.deltaY > 0 ? '10' : '01' + const el = getScroller()(event.target, refs.$el) + const { scrollHeight, offsetHeight, scrollTop } = el + let status = '11' + + if (scrollTop === 0) { + status = offsetHeight >= scrollHeight ? '00' : '01' + } else if (scrollTop + offsetHeight >= scrollHeight) { + status = '10' + } + + if (status !== '11' && state.direction === 'vertical' && !(parseInt(status, 2) & parseInt(direction, 2))) { + event.preventDefault() + } +} + +export const renderOverlay = ({ api, nextTick, props, state }) => () => { + if (!props.modelValue) { + return + } + + nextTick(() => { + api.updateZIndex(props.overlay ? 1 : 0) + + if (props.overlay) { + state.zIndex = state.context.zIndex++ + } + }) +} + +export const updateZIndex = ({ refs, state }) => (value = 0) => (refs.popup.style.zIndex = ++state.context.zIndex + value) + +export const clickOverlay = ({ api, props, emit }) => () => { + if (props.closeOnClickOverlay) { + api.close() + emit('click-overlay') + } +} + +export const closed = (emit) => () => emit('closed') + +export const opened = (emit) => () => emit('opened') diff --git a/packages/renderless/src/popup/vue.ts b/packages/renderless/src/popup/vue.ts new file mode 100644 index 000000000..03ce1146d --- /dev/null +++ b/packages/renderless/src/popup/vue.ts @@ -0,0 +1,71 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getStyle, watchValue, open, opened, closed, onTouchMove, close, renderOverlay, clickOverlay, updateZIndex } from './index' + +export const api = ['state', 'open', 'close', 'clickOverlay', 'onTouchMove', 'opened', 'closed'] + +const initState = ({ reactive, computed, props, api }) => { + const state = reactive({ + transitionName: computed(() => (props.transition || props.position === 'center' ? 'tiny-fade' : `tiny-popup-slide-${props.position}`)), + style: computed(() => api.getStyle()), + inited: computed(() => state.inited || props.modelValue), + opened: false, + startX: 0, + startY: 0, + deltaX: 0, + deltaY: 0, + offsetX: 0, + offsetY: 0, + direction: '', + shouldRender: computed(() => state.inited || props.lazyRender), + context: { zIndex: 2000, lockCount: 0, stack: [] }, + zIndex: props.zIndex, + overlayStyle: computed(() => ({ + zIndex: state.zIndex, + ...props.overlayStyle + })) + }) + + return state +} + +const initApi = ({ api, props, state, refs, emit, nextTick, constants }) => { + Object.assign(api, { + state, + opened: opened(emit), + closed: closed(emit), + getStyle: getStyle(props), + watchValue: watchValue(api), + updateZIndex: updateZIndex({ refs, state }), + clickOverlay: clickOverlay({ api, emit, props }), + renderOverlay: renderOverlay({ api, nextTick, props, state }), + onTouchMove: onTouchMove({ refs, state }), + open: open({ api, constants, emit, props, state }), + close: close({ api, constants, emit, props, state }) + }) +} + +export const renderless = (props, { computed, onMounted, reactive, watch, nextTick }, { constants, refs, emit }) => { + const api = {} + const state = initState({ reactive, computed, props, api }) + + initApi({ api, props, state, refs, emit, nextTick, constants }) + + watch(() => props.modelValue, api.watchValue, { immediate: true }) + + onMounted(() => { + props.modelValue && api.open() + }) + + return api +} diff --git a/packages/renderless/src/progress/index.ts b/packages/renderless/src/progress/index.ts new file mode 100644 index 000000000..9c0e74934 --- /dev/null +++ b/packages/renderless/src/progress/index.ts @@ -0,0 +1,129 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const computedBarStyle = ({ api, props }) => () => ({ + width: props.percentage + '%', + backgroundColor: api.getCurrentColor(props.percentage) +}) + +export const computedRelativeStrokeWidth = ({ props }) => () => ((props.strokeWidth / props.width) * 100).toFixed(1) + +export const computedRadius = ({ constants, props, state }) => () => + props.type === constants.PROGRESS_TYPE.CIRCLE || props.type === constants.PROGRESS_TYPE.DASHBOARD + ? parseInt(50 - parseFloat(state.relativeStrokeWidth) / 2, 10) + : 0 + +export const computedTrackPath = ({ constants, props, state }) => () => { + const radiusValue = state.radius + const isDashboardType = props.type === constants.PROGRESS_TYPE.DASHBOARD + + return ` + M 50 50 + m 0 ${isDashboardType ? '' : '-'}${radiusValue} + a ${radiusValue} ${radiusValue} 0 1 1 0 ${isDashboardType ? '-' : ''}${radiusValue * 2} + a ${radiusValue} ${radiusValue} 0 1 1 0 ${isDashboardType ? '' : '-'}${radiusValue * 2} + ` +} + +export const computedPerimeter = ({ state }) => () => 2 * Math.PI * state.radius + +export const computedRate = ({ constants, props }) => () => (props.type === constants.PROGRESS_TYPE.DASHBOARD ? 0.75 : 1) + +export const computedStrokeDashoffset = ({ state }) => () => `${(-1 * state.perimeter * (1 - state.rate)) / 2}px` + +export const computedTrailPathStyle = ({ state }) => () => ({ + strokeDasharray: `${state.perimeter * state.rate}px, ${state.perimeter}px`, + strokeDashoffset: state.strokeDashoffset +}) + +export const computedCirclePathStyle = ({ props, state }) => () => ({ + strokeDasharray: `${state.perimeter * state.rate * (props.percentage / 100)}px, ${state.perimeter}px`, + strokeDashoffset: state.strokeDashoffset, + transition: 'stroke-dasharray 0.6s ease 0s, stroke 0.6s ease' +}) + +export const computedStroke = ({ api, constants, props }) => () => + (props.color && api.getCurrentColor(props.percentage)) || constants.STATUS_TO_COLOR[props.status] || constants.STATUS_DEFAULT_COLOR + +export const computedIconClass = ({ constants, props }) => () => { + if (props.status === constants.PROGRESS_STATUS.SUCCESS) { + return props.type === constants.PROGRESS_TYPE.LINE ? constants.ICON_SUCCESS : constants.ICON_CIRCLE_SUCCESS + } else if (props.status === constants.PROGRESS_STATUS.WARNING) { + return props.type === constants.PROGRESS_TYPE.LINE ? constants.ICON_WARNING : constants.ICON_CIRCLE_WARNING + } else if (props.status === constants.PROGRESS_STATUS.EXCEPTION) { + return props.type === constants.PROGRESS_TYPE.LINE ? constants.ICON_EXCEPTION : constants.ICON_CIRCLE_EXCEPTION + } +} + +export const computedProgressTextSize = ({ constants, props }) => () => + props.type === constants.PROGRESS_TYPE.LINE ? 12 + props.strokeWidth * 0.4 : props.width * 0.111111 + 2 + +export const computedContent = ({ props }) => () => (typeof props.format === 'function' ? props.format(props.percentage) || '' : `${props.percentage}%`) + +export const getCurrentColor = ({ api, props }) => (percentage) => { + if (typeof props.color === 'function') { + return props.color(percentage) + } else if (typeof props.color === 'string') { + return props.color + } else { + return api.getLevelColor(percentage) + } +} + +export const getLevelColor = (api) => (percentage) => { + const colorArray = api.getColorArray().sort((a, b) => a.percentage - b.percentage) + + for (let i = 0; i < colorArray.length; i++) { + if (colorArray[i].percentage > percentage) { + return colorArray[i].color + } + } + + return colorArray[colorArray.length - 1].color +} + +export const getColorArray = (props) => () => { + const color = props.color + const span = 100 / color.length + + return color.map((seriesColor, index) => { + if (typeof seriesColor === 'string') { + return { + color: seriesColor, + progress: (index + 1) * span + } + } + + return seriesColor + }) +} + +export const customBeforeAppearHook = ({ props, state }) => (el) => { + if (props.type === 'line') { + el.style.width = 0 + } else if (props.type === 'circle') { + el.style.strokeDasharray = state.perimeter * state.content + el.style.strokeDashoffset = state.perimeter + } +} + +export const customAppearHook = (el) => { + el.style.transition = 'all 0.5s' +} + +export const customAfterAppearHook = ({ state, props }) => (el) => { + if (props.type === 'line') { + el.style.width = state.barStyle.width + } else if (props.type === 'circle') { + el.style.strokeDashoffset = 0 + } +} diff --git a/packages/renderless/src/progress/vue.ts b/packages/renderless/src/progress/vue.ts new file mode 100644 index 000000000..d7eed6525 --- /dev/null +++ b/packages/renderless/src/progress/vue.ts @@ -0,0 +1,79 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + computedBarStyle, + computedRelativeStrokeWidth, + computedRadius, + computedTrackPath, + computedPerimeter, + computedRate, + computedStrokeDashoffset, + computedTrailPathStyle, + computedCirclePathStyle, + computedStroke, + computedIconClass, + computedProgressTextSize, + computedContent, + getCurrentColor, + getLevelColor, + getColorArray, + customBeforeAppearHook, + customAppearHook, + customAfterAppearHook +} from './index' + +export const api = ['state', 'getCurrentColor', 'getLevelColor', 'getColorArray', 'customBeforeAppearHook', 'customAppearHook', 'customAfterAppearHook'] + +export const renderless = (props, { computed, reactive }, { constants }) => { + const api = {} + const state = reactive({ + rate: computed(() => api.computedRate()), + radius: computed(() => api.computedRadius()), + stroke: computed(() => api.computedStroke()), + content: computed(() => api.computedContent()), + barStyle: computed(() => api.computedBarStyle()), + trackPath: computed(() => api.computedTrackPath()), + perimeter: computed(() => api.computedPerimeter()), + iconClass: computed(() => api.computedIconClass()), + trailPathStyle: computed(() => api.computedTrailPathStyle()), + circlePathStyle: computed(() => api.computedCirclePathStyle()), + progressTextSize: computed(() => api.computedProgressTextSize()), + strokeDashoffset: computed(() => api.computedStrokeDashoffset()), + relativeStrokeWidth: computed(() => api.computedRelativeStrokeWidth()) + }) + + Object.assign(api, { + state, + customAppearHook, + computedContent: computedContent({ props }), + getColorArray: getColorArray(props), + computedRate: computedRate({ constants, props }), + computedPerimeter: computedPerimeter({ state }), + computedRadius: computedRadius({ constants, props, state }), + computedTrackPath: computedTrackPath({ constants, props, state }), + computedIconClass: computedIconClass({ constants, props }), + computedCirclePathStyle: computedCirclePathStyle({ props, state }), + computedStrokeDashoffset: computedStrokeDashoffset({ state }), + computedTrailPathStyle: computedTrailPathStyle({ state }), + computedRelativeStrokeWidth: computedRelativeStrokeWidth({ props }), + computedProgressTextSize: computedProgressTextSize({ constants, props }), + customAfterAppearHook: customAfterAppearHook({ state, props }), + customBeforeAppearHook: customBeforeAppearHook({ props, state }), + getLevelColor: getLevelColor(api), + computedBarStyle: computedBarStyle({ api, props }), + getCurrentColor: getCurrentColor({ api, props }), + computedStroke: computedStroke({ api, constants, props }) + }) + + return api +} diff --git a/packages/renderless/src/pull-refresh/index.ts b/packages/renderless/src/pull-refresh/index.ts new file mode 100644 index 000000000..bb35738ab --- /dev/null +++ b/packages/renderless/src/pull-refresh/index.ts @@ -0,0 +1,153 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' + +export const initPullRefresh = ({ t, props, state }) => () => { + const defaultOption = { + pullingUpText: t('ui.pullRefresh.pullingUp'), + pullingDownText: t('ui.pullRefresh.pullingDown'), + pullUpDisabled: false, + pullDownDisabled: false, + headHeight: 50, + footHeight: 50 + } + + state.pullUp = { ...defaultOption, ...props.pullUp } + state.pullDown = { ...defaultOption, ...props.pullDown } + state.refreshStyle = { + paddingTop: state.pullDown.headHeight + 'px', + paddingBottom: state.pullUp.footHeight + 'px' + } + state.loosingText = props.loosingText ?? t('ui.pullRefresh.loosing') + state.successText = props.successText ?? t('ui.pullRefresh.success') + state.failedText = props.failedText ?? t('ui.pullRefresh.failed') +} + +export const onTouchstart = (state) => (event) => { + state.draggposition = event.touches[0].clientY +} + +export const onTouchmove = ({ props, state }) => (event) => { + if (event.touches[0].clientY < state.draggposition) { + // 上拉刷新 + if (!state.pullUp.pullUpDisabled) { + // 没有更多了 + if (props.hasMore) { + state.translate3d = (event.touches[0].clientY - state.draggposition) / 2 + state.pullUpReplaces = Math.abs(state.translate3d) > state.pullUp.footHeight ? state.loosingText : state.pullUp.pullingUpText + state.pullDownReplaces = '' + } + } + } else { + // 下拉刷新 + if (!state.pullDown.pullDownDisabled) { + state.translate3d = (event.touches[0].clientY - state.draggposition) / 2 + state.pullDownReplaces = Math.abs(state.translate3d) > state.pullDown.headHeight ? state.loosingText : state.pullDown.pullingDownText + state.pullUpReplaces = '' + } + } + + state.animationDuration = 0 + state.pullUpLoading = false + state.pullDownLoading = false +} + +export const onTouchend = ({ api, props, state }) => () => { + state.animationDuration = props.animationDuration + + // 上拉/下拉超过指定的高度触发刷新 + if (Math.abs(state.translate3d) >= state.pullDown.headHeight || Math.abs(state.translate3d) >= state.pullUp.footHeight) { + if (state.translate3d >= 0) { + // 下拉刷新 + state.translate3d = state.pullDown.headHeight + const { handler } = state.pullDown + const pullDownPromise = handler && handler() + state.pullDownLoading = true + if (pullDownPromise?.then) { + pullDownPromise.then( + () => { + api.handlerModelValue('down', 'success') + }, + (e) => { + console.log(e) + api.handlerModelValue('down', 'failed') + } + ) + return + } + console.error(new Error('handler down is not promise')) + } else { + // 上拉刷新 + state.translate3d = -state.pullUp.footHeight + const { handler } = state.pullUp + const pullUpPromise = handler && handler() + state.pullUpLoading = true + + if (pullUpPromise?.then) { + pullUpPromise.then( + () => { + api.handlerModelValue('up', 'success') + }, + (e) => { + console.log(e) + api.handlerModelValue('up', 'failed') + } + ) + return + } + console.error(new Error('handler up is not promise')) + } + api.clearPullRefresh() + } else { + // 上拉/下拉未超过指定的高度,不触发刷新,回弹 + state.pullUpLoading = false + state.pullDownLoading = false + api.clearPullRefresh() + } +} + +export const mountedHandler = ({ api, refs }) => () => { + const track = refs.track + + on(track, 'touchstart', api.onTouchstart) + on(track, 'touchmove', api.onTouchmove) + on(track, 'touchend', api.onTouchend) +} + +export const beforeUnmountHandler = ({ api, refs }) => () => { + const track = refs.track + + off(track, 'touchstart', api.onTouchstart) + off(track, 'touchmove', api.onTouchmove) + off(track, 'touchend', api.onTouchend) +} + +export const handlerModelValue = ({ api, state }) => (value, result) => { + state.pullUpLoading = false + state.pullDownLoading = false + + if (value === 'down') { + state.pullDownReplaces = state[`${result}Text`] + } else { + state.pullUpReplaces = state[`${result}Text`] + } + setTimeout(() => { + api.clearPullRefresh() + }, state.successDuration) +} + +export const clearPullRefresh = (state) => () => { + state.translate3d = 0 + state.pullUpReplaces = '' + state.pullDownReplaces = '' +} diff --git a/packages/renderless/src/pull-refresh/vue.ts b/packages/renderless/src/pull-refresh/vue.ts new file mode 100644 index 000000000..638bb3b67 --- /dev/null +++ b/packages/renderless/src/pull-refresh/vue.ts @@ -0,0 +1,67 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { mountedHandler, beforeUnmountHandler, handlerModelValue, onTouchstart, onTouchmove, onTouchend, initPullRefresh, clearPullRefresh } from './index' + +export const api = ['state'] + +export const renderless = (props, { watch, onMounted, reactive, onBeforeUnmount }, { t, refs }) => { + const api = {} + const state = reactive({ + pullUpReplaces: '', + pullDownReplaces: '', + refreshStyle: {}, + translate3d: 0, + draggposition: 0, + pullUpLoading: false, + pullDownLoading: false, + loosingText: '', + successText: '', + failedText: '', + noMoreText: '', + pullUp: null, + pullDown: null, + successDuration: props.successDuration, + animationDuration: props.animationDuration + }) + + Object.assign(api, { + state, + onTouchstart: onTouchstart(state), + onTouchmove: onTouchmove({ props, state }), + onTouchend: onTouchend({ api, props, state }), + mountedHandler: mountedHandler({ api, refs }), + beforeUnmountHandler: beforeUnmountHandler({ api, refs }), + handlerModelValue: handlerModelValue({ api, state }), + initPullRefresh: initPullRefresh({ t, props, state }), + clearPullRefresh: clearPullRefresh(state), + }) + + watch( + () => props.hasMore, + (value) => { + if (!value) { + // 没有更多了 + state.noMoreText = t('ui.pullRefresh.noMore') + api.clearPullRefresh() + } + }, + ) + + onMounted(() => { + api.mountedHandler({ api, refs, state }) + api.initPullRefresh({ t, props, state }) + }) + onBeforeUnmount(api.beforeUnmountHandler) + + return api +} diff --git a/packages/renderless/src/radio-button/index.ts b/packages/renderless/src/radio-button/index.ts new file mode 100644 index 000000000..12e6dd339 --- /dev/null +++ b/packages/renderless/src/radio-button/index.ts @@ -0,0 +1,50 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const handleChange = ({ constants, nextTick, dispatch, state }) => () => { + nextTick(() => { + dispatch(constants.RADIO_GROUP, 'handleChange', [state.value]) + }) +} + +export const getValue = (state) => () => state.radioGroup.modelValue + +export const setValue = ({ state }) => (val) => state.radioGroup.$emit('update:modelValue', val) + +export const getGroup = ({ constants, parent: $parent }) => () => { + let parent = $parent.$parent + + while (parent) { + if (parent.$options.componentName !== constants.RADIO_GROUP) { + parent = parent.$parent + } else { + return parent + } + } + + return false +} + +export const getStyle = (state) => () => ({ + backgroundColor: state.radioGroup.fill || '', + borderColor: state.radioGroup.fill || '', + boxShadow: state.radioGroup.fill ? `-1px 0 0 0 ${state.radioGroup.fill}` : '', + color: state.radioGroup.textColor || '' +}) + +export const toggleEvents = ({ refs, props }) => (isUnBind = false) => { + const radioEl = refs.radio + + Object.keys(props.events).forEach((ev) => { + radioEl[(isUnBind ? 'remove' : 'add') + 'EventListener'](ev, props.events[ev]) + }) +} diff --git a/packages/renderless/src/radio-button/vue.ts b/packages/renderless/src/radio-button/vue.ts new file mode 100644 index 000000000..c55480cfa --- /dev/null +++ b/packages/renderless/src/radio-button/vue.ts @@ -0,0 +1,50 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { handleChange, getValue, setValue, getGroup, getStyle, toggleEvents } from './index' + +export const api = ['state', 'handleChange'] + +export const renderless = (props, { computed, reactive, onMounted, onBeforeUnmount }, { emit, parent, dispatch, constants, nextTick, refs }) => { + const api = { + getGroup: getGroup({ constants, parent }), + toggleEvents: toggleEvents({ refs, props }) + } + + const state = reactive({ + focus: false, + value: computed({ + get: () => api.getValue(), + set: (val) => api.setValue(val) + }), + radioGroup: computed(() => api.getGroup()), + activeStyle: computed(() => api.getStyle()), + size: computed(() => state.radioGroup.state.radioGroupSize), + isDisabled: computed(() => props.disabled || state.radioGroup.disabled), + tabIndex: computed(() => (state.isDisabled || (state.radioGroup && state.value !== props.label) ? -1 : 0)) + }) + Object.assign(api, { + state, + getValue: getValue(state), + getStyle: getStyle(state), + setValue: setValue({ emit, state }), + handleChange: handleChange({ constants, dispatch, nextTick, state }) + }) + + onMounted(api.toggleEvents) + + onBeforeUnmount(() => { + api.toggleEvents(true) + }) + + return api +} diff --git a/packages/renderless/src/radio-group/index.ts b/packages/renderless/src/radio-group/index.ts new file mode 100644 index 000000000..dd5b22321 --- /dev/null +++ b/packages/renderless/src/radio-group/index.ts @@ -0,0 +1,62 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { KEY_CODE } from '@opentiny/vue-renderless/common' + +export const handleKeydown = ({ parent }) => (event) => { + const target = event.target + const className = target.nodeName === 'INPUT' ? '[type=radio]' : '[role=radio]' + const radios = parent.$el.querySelectorAll(className) + const length = radios.length + const index = [].indexOf.call(radios, target) + const roleRadiosNodes = parent.$el.querySelectorAll('[role=radio]') + + switch (event.keyCode) { + case KEY_CODE.ArrowDown: + case KEY_CODE.ArrowRight: + if (index === length - 1) { + event.stopPropagation() + event.preventDefault() + + roleRadiosNodes[0].click() + roleRadiosNodes[0].focus() + } else { + roleRadiosNodes[index + 1].click() + roleRadiosNodes[index + 1].focus() + } + break + case KEY_CODE.ArrowUp: + case KEY_CODE.ArrowLeft: + event.stopPropagation() + event.preventDefault() + + if (index === 0) { + roleRadiosNodes[length - 1].click() + roleRadiosNodes[length - 1].focus() + } else { + roleRadiosNodes[index - 1].click() + roleRadiosNodes[index - 1].focus() + } + break + default: + break + } +} + +export const mounted = (parent) => () => { + const radios = parent.$el.querySelectorAll('[type=radio]') + const firstLabel = parent.$el.querySelectorAll('[role=radio]')[0] + + if (![].some.call(radios, (radio) => radio.checked) && firstLabel) { + firstLabel.tabIndex = 0 + } +} diff --git a/packages/renderless/src/radio-group/vue.ts b/packages/renderless/src/radio-group/vue.ts new file mode 100644 index 000000000..2714b84ab --- /dev/null +++ b/packages/renderless/src/radio-group/vue.ts @@ -0,0 +1,44 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { handleKeydown, mounted } from './index' + +export const api = ['state', 'handleKeydown'] + +export const renderless = (props, { computed, onMounted, reactive, watch }, { parent, dispatch }) => { + const state = reactive({ + radioGroupSize: computed(() => props.size), + tag: 'div' + }) + + parent.$on('handleChange', (value) => { + parent.$emit('change', value) + }) + + const api = { + state, + dispatch, + onMounted: mounted(parent), + handleKeydown: handleKeydown({ parent }) + } + + watch( + () => props.modelValue, + (value) => { + api.dispatch('FormItem', 'form.change', [value]) + } + ) + + onMounted(api.onMounted) + + return api +} diff --git a/packages/renderless/src/radio/index.ts b/packages/renderless/src/radio/index.ts new file mode 100644 index 000000000..22a6dcdfd --- /dev/null +++ b/packages/renderless/src/radio/index.ts @@ -0,0 +1,61 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const handleChange = ({ constants, dispatch, emit, state, nextTick }) => () => { + nextTick(() => { + emit('change', state.model) + + state.isGroup && dispatch(constants.RADIO_GROUP, 'handleChange', [state.model]) + }) +} + +export const isGroup = ({ constants, parent: $parent, state }) => () => { + let parent = $parent.$parent.$parent + + while (parent) { + if (parent.$options.componentName !== constants.RADIO_GROUP) { + parent = parent.$parent + } else { + state.radioGroup = parent + + return true + } + } + + return false +} + +export const radioSize = ({ props, state }) => () => (state.isGroup ? state.radioGroup.state.radioGroupSize || props.size : props.size) + +export const isDisabled = ({ props, state }) => () => props.disabled || state.radioGroup.disabled || state.formDisabled + +export const tabIndex = ({ props, state }) => () => (state.isDisabled || (state.isGroup && state.model !== props.label) ? -1 : 0) + +export const getModel = ({ props, state }) => () => (state.isGroup ? state.radioGroup.modelValue : props.modelValue) + +export const setModel = ({ constants, dispatch, emit, props, refs, state }) => (val) => { + if (state.isGroup) { + dispatch(constants.RADIO_GROUP, 'update:modelValue', [val]) + } else { + emit('update:modelValue', val) + } + + refs.radio && (refs.radio.checked = state.model === props.label) +} + +export const toggleEvent = ({ props, refs, type }) => { + const radioEl = refs.radio + + Object.keys(props.events).forEach((ev) => { + radioEl[type + 'EventListener'](ev, props.events[ev]) + }) +} diff --git a/packages/renderless/src/radio/vue.ts b/packages/renderless/src/radio/vue.ts new file mode 100644 index 000000000..63866561c --- /dev/null +++ b/packages/renderless/src/radio/vue.ts @@ -0,0 +1,57 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { handleChange, isGroup, radioSize, isDisabled, tabIndex, getModel, setModel, toggleEvent } from './index' + +export const api = ['state', 'handleChange'] + +export const renderless = (props, { onMounted, onBeforeUnmount, computed, reactive, inject }, { refs, parent, emit, constants, nextTick, dispatch }) => { + parent.tinyForm = parent.tinyForm || inject('form', null) + + const api = {} + + const state = reactive({ + focus: false, + radioGroup: '', + isGroup: computed(() => api.isGroup()), + radioSize: computed(() => api.radioSize()), + isDisabled: computed(() => api.isDisabled()), + tabIndex: computed(() => api.tabIndex()), + formDisabled: computed(() => (parent.tinyForm || {}).disabled), + model: computed({ + get: () => api.getModel(), + set: (val) => api.setModel(val) + }) + }) + + Object.assign(api, { + state, + radioSize: radioSize({ props, state }), + getModel: getModel({ props, state }), + isGroup: isGroup({ constants, parent, state }), + tabIndex: tabIndex({ props, state }), + isDisabled: isDisabled({ props, state }), + setModel: setModel({ constants, dispatch, emit, props, refs, state }), + handleChange: handleChange({ constants, dispatch, emit, state, nextTick }) + }) + + onMounted(() => { + dispatch('Tooltip', 'tooltip-update') + toggleEvent({ props, refs, type: 'add' }) + }) + + onBeforeUnmount(() => { + toggleEvent({ props, refs, type: 'remove' }) + }) + + return api +} diff --git a/packages/renderless/src/rate/index.ts b/packages/renderless/src/rate/index.ts new file mode 100644 index 000000000..9a59a914e --- /dev/null +++ b/packages/renderless/src/rate/index.ts @@ -0,0 +1,263 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { KEY_CODE } from '@opentiny/vue-renderless/common' + +export const computedActiveColor = (props) => (state) => { + let result = '' + + if (state.currentValue <= props.lowThreshold) { + result = state.colorMap.lowColor + } else if (state.currentValue >= props.highThreshold) { + result = state.colorMap.highColor + } else { + result = state.colorMap.mediumColor + } + + return result +} + +export const computedActiveClass = (props) => (state) => { + let result = '' + + if (state.currentValue <= props.lowThreshold) { + result = state.classMap.lowClass + } else if (state.currentValue >= props.highThreshold) { + result = state.classMap.highClass + } else { + result = state.classMap.mediumClass + } + + return result +} + +export const getTextStyle = ({ props, state }) => () => { + const color = props.radio && state.currentValue ? props.textColor : state.activeColor + + return { + color + } +} + +export const handelKey = ({ emit, props, state }) => (event) => { + let current = state.currentValue + const keyCode = event.keyCode + + if (props.disabled) { + return + } + + if (keyCode === KEY_CODE.ArrowUp || keyCode === KEY_CODE.ArrowRight) { + current += props.allowHalf ? 0.5 : 1 + event.stopPropagation() + event.preventDefault() + } else if (keyCode === KEY_CODE.ArrowLeft || keyCode === KEY_CODE.ArrowDown) { + current -= props.allowHalf ? 0.5 : 1 + event.stopPropagation() + event.preventDefault() + } + + current = current < 0 ? 0 : current + current = current > props.max ? props.max : current + + emit('update:modelValue', current) + emit('change', current) +} + +export const selectValue = ({ emit, props, state }) => (value) => { + if (props.disabled) { + return + } + + if (props.allowHalf && state.pointerAtLeftHalf) { + value = state.currentValue + } + + emit('update:modelValue', value) + emit('change', value) +} + +export const setCurrentValue = ({ constants: { RATENODECLS, DECIMALCLS, ICON_PREFIXCLS }, props, state, parent, api }) => ({ event, item }) => { + if (props.disabled) { + return + } + + if (!parent.$el.contains(state.mouseTarget)) { + api.resetCurrentValue() + } + + if (props.allowHalf) { + let target = event.target + let className = target.className + let key = target.parentElement ? 'parentElement' : 'parentNode' + + if (target.nodeName === 'svg') { + className = target[key].className + target = target[key] + } + + if (target.nodeName === 'path') { + className = target[key][key].className + target = target[key][key] + } + + if (className.includes(RATENODECLS)) { + target = target.querySelector(ICON_PREFIXCLS) + } + + if (className.includes(DECIMALCLS)) { + target = target.parentNode + } + + state.pointerAtLeftHalf = event.offsetX * 2 <= target.clientWidth + state.currentValue = state.pointerAtLeftHalf ? item - 0.5 : item + } else { + state.currentValue = item + } + + state.hoverIndex = item +} + +export const resetCurrentValue = ({ props, state }) => () => { + if (props.disabled) { + return + } + + if (props.allowHalf) { + state.pointerAtLeftHalf = props.modelValue !== Math.floor(props.modelValue) + } + + state.currentValue = props.modelValue + state.hoverIndex = -1 +} + +export const showDecimalIcon = ({ props, state }) => (item) => { + const decimal = props.modelValue * 100 - Math.floor(props.modelValue) * 100 + + const showWhenDisabled = props.disabled && decimal > 0 && item - 1 < props.modelValue && item > props.modelValue + + /* istanbul ignore next */ + const showWhenAllowHalf = props.allowHalf && state.pointerAtLeftHalf && item - 0.5 <= state.currentValue && item > state.currentValue + + return showWhenDisabled || showWhenAllowHalf +} + +export const getIconStyle = ({ api, props, state }) => (item) => { + const isHalf = api.showDecimalIcon(item) + const voidColor = props.disabled ? props.disabledVoidColor : props.voidColor + + if (props.radio) { + return { + fill: item === state.currentValue ? state.activeColor : voidColor, + 'font-size': props.size || '18px' + } + } + + return { + fill: isHalf ? 'transparent' : item <= state.currentValue ? state.activeColor : voidColor, + 'font-size': props.size || '18px' + } +} + +export const computedText = ({ props, state }) => { + let result = '' + let currentValue = 0 + + if (!isNaN(Number(state.currentValue))) { + currentValue = Number(state.currentValue) > 0 ? Number(state.currentValue) : 0 + } + + if (currentValue > props.texts.length) { + currentValue = props.texts.length + } + + if (props.showScore) { + result = props.scoreTemplate.replace(/\{\s*value\s*\}/, currentValue) + return result + } + + if (props.showText && currentValue > 0) { + currentValue = Math.ceil(currentValue) - 1 + result = props.texts[currentValue] + } + + return result +} + +export const computedDecimalStyle = ({ props, state }) => { + let width = '' + let clip = '' + let clipPath = '' + let fontSize = '' + + if (props.disabled) { + width = `${props.modelValue * 100 - Math.floor(props.modelValue) * 100 < 50 ? 0 : 100}%` + } else if (props.allowHalf) { + const reactSize = props.size ? Math.ceil(parseInt(props.size) / 2) + 'px' : '6px' + + clip = `rect(0px, ${reactSize}, ${props.size || '14px'}, 0px)` + clipPath = 'inset(0 50% 0 0)' + fontSize = props.size || '18px' + } + + return { + fill: state.activeColor, + width, + clip, + clipPath, + fontSize + } +} + +export const computedClasses = ({ props, state }) => { + let i = 0 + let result = [] + let threshold = state.currentValue + + if (props.radio) { + result = props.iconClasses + } else { + if (props.allowHalf && state.currentValue !== Math.floor(state.currentValue)) { + threshold-- + } + + while (i < threshold) { + result.push(state.activeClass) + i++ + } + + while (i < props.max) { + result.push(state.voidClass) + i++ + } + } + + return result +} + +export const computedClassMap = (props) => ({ + lowClass: props.iconClasses[0], + mediumClass: props.iconClasses[1], + highClass: props.iconClasses[2], + voidClass: props.voidIconClass, + disabledVoidClass: props.disabledVoidIconClass +}) + +export const computedColorMap = (props) => ({ + lowColor: props.colors[0], + mediumColor: props.colors[1], + highColor: props.colors[2], + voidColor: props.voidColor, + disabledVoidColor: props.disabledVoidColor +}) + +export const computedVoidClass = ({ props, state }) => (props.disabled ? state.classMap.disabledVoidClass : state.classMap.voidClass) diff --git a/packages/renderless/src/rate/vue.ts b/packages/renderless/src/rate/vue.ts new file mode 100644 index 000000000..ecf6e70f2 --- /dev/null +++ b/packages/renderless/src/rate/vue.ts @@ -0,0 +1,129 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + getTextStyle, + handelKey, + resetCurrentValue, + setCurrentValue, + selectValue, + showDecimalIcon, + getIconStyle, + computedText, + computedDecimalStyle, + computedClasses, + computedColorMap, + computedClassMap, + computedVoidClass, + computedActiveColor, + computedActiveClass +} from './index' +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' + +export const api = ['state', 'showDecimalIcon', 'getIconStyle', 'getTextStyle', 'selectValue', 'handelKey', 'setCurrentValue', 'resetCurrentValue'] + +export const useChangeValue = ({ constants, emit, props, reactive, toRefs, watch, onMounted, onUnmounted, parent }) => { + const state = reactive({ + hoverIndex: -1, + currentValue: props.modelValue + }) + + const api = { + selectValue: selectValue({ emit, props, state }), + resetCurrentValue: resetCurrentValue({ props, state }) + } + + api.setCurrentValue = setCurrentValue({ + constants, + props, + state, + parent, + api + }) + + watch( + () => props.modelValue, + (value) => { + state.currentValue = value + }, + { immediate: true } + ) + + const updateMousePostion = (event) => { + state.mouseTarget = event.target + } + + onMounted(() => { + on(document, 'mousemove', updateMousePostion) + on(document, 'mouseleave', api.resetCurrentValue) + }) + + onUnmounted(() => { + off(document, 'mousemove', updateMousePostion) + off(document, 'mouseleave', api.resetCurrentValue) + state.mouseTarget = null + }) + + return { + api, + state: toRefs(state) + } +} + +export const renderless = (props, { computed, reactive, toRefs, watch, onMounted, onUnmounted }, { constants, emit, parent }) => { + const api = {} + const changeValue = useChangeValue({ + computed, + constants, + emit, + props, + reactive, + toRefs, + watch, + onMounted, + onUnmounted, + parent + }) + + const state = reactive({ + pointerAtLeftHalf: true, + colorMap: computed(() => api.computedColorMap(props)), + classMap: computed(() => api.computedClassMap(props)), + text: computed(() => api.computedText({ props, state })), + activeClass: computed(() => api.computedActiveClass(state)), + activeColor: computed(() => api.computedActiveColor(state)), + classes: computed(() => api.computedClasses({ props, state })), + decimalIconClass: computed(() => api.computedActiveClass(state)), + voidClass: computed(() => api.computedVoidClass({ props, state })), + decimalStyle: computed(() => api.computedDecimalStyle({ props, state })), + ...changeValue.state + }) + + Object.assign(api, { + state, + computedText, + computedClasses, + computedClassMap, + computedColorMap, + computedVoidClass, + computedDecimalStyle, + getTextStyle: getTextStyle({ props, state }), + handelKey: handelKey({ emit, props, state }), + computedActiveColor: computedActiveColor(props), + computedActiveClass: computedActiveClass(props), + showDecimalIcon: showDecimalIcon({ props, state }), + getIconStyle: getIconStyle({ api, props, state }), + ...changeValue.api + }) + + return api +} diff --git a/packages/renderless/src/roles/index.ts b/packages/renderless/src/roles/index.ts new file mode 100644 index 000000000..4278dbcd0 --- /dev/null +++ b/packages/renderless/src/roles/index.ts @@ -0,0 +1,78 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { xss } from '@opentiny/vue-renderless/common' + +export const showList = (state) => () => (state.showPopover = true) + +export const show = (state) => () => (state.showIcon = false) + +export const hide = (state) => () => (state.showIcon = true) + +export const getRoleList = ({ constants, service, state }) => () => { + const envInfo = service.getEnvInfoSync() || {} + const userInfo = envInfo.user || {} + const validRols = userInfo.validRoles || [] + const currentRole = userInfo.currentRole || {} + + state.currentRole = currentRole.roleName + state.currentId = currentRole.roleId + + if (validRols.length > 2) { + validRols.filter((item) => item.roleName !== constants.AUTH || item.roleName !== constants.ANONYMOUS) + } + + return validRols +} + +export const changeRole = ({ constants, emit, props, service, state }) => ({ roleId }) => { + if (state.currentId === roleId) { + return + } + + emit('change', roleId) + + service.getCustomized().then((data) => { + data = data || [] + + const setting = data.filter((item) => item.settingKey === constants.GLOBAL)[0] || {} + const getRole = props.fetchRole ? props.fetchRole() : service.getChangeRoleUrl(roleId) + + getRole.then((url) => { + const keys = Object.keys(setting) + + if (!keys.includes(constants.ROLE)) { + setting.lastRole = roleId + service.pushCustomized(setting).then(() => { + window.location.href = xss.filterUrl(url) + }) + } else { + window.location.href = xss.filterUrl(url) + } + }) + }) +} + +export const initService = (service) => { + const { base = {}, common = {}, pushCustomized } = service || {} + + const noopFn = () => Promise.resolve(null) + + const commonNoopFn = () => Promise.reject(new Error('[Tiny Error][Roles] This component depends on @opentiny/vue-service')) + + return { + getEnvInfoSync: base.getEnvInfoSync || commonNoopFn, + getChangeRoleUrl: common.getChangeRoleUrl || commonNoopFn, + getCustomized: common.getCustomized || noopFn, + pushCustomized: pushCustomized || noopFn + } +} diff --git a/packages/renderless/src/roles/vue.ts b/packages/renderless/src/roles/vue.ts new file mode 100644 index 000000000..d7fe187d7 --- /dev/null +++ b/packages/renderless/src/roles/vue.ts @@ -0,0 +1,39 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { showList, show, hide, getRoleList, changeRole, initService } from './index' + +export const api = ['state', 'showList', 'show', 'hide', 'changeRole'] + +export const renderless = (props, { computed, reactive }, { emit, service, constants }) => { + const $service = initService(service) + let api = {} + + const state = reactive({ + currentRole: '', + currentId: '', + showPopover: true, + showIcon: true, + roleList: computed(() => api.getRoleList()) + }) + + api = { + state, + show: show(state), + hide: hide(state), + showList: showList(state), + getRoleList: getRoleList({ constants, service: $service, state }), + changeRole: changeRole({ constants, emit, props, service: $service, state }) + } + + return api +} diff --git a/packages/renderless/src/row/index.ts b/packages/renderless/src/row/index.ts new file mode 100644 index 000000000..ebfa6ff66 --- /dev/null +++ b/packages/renderless/src/row/index.ts @@ -0,0 +1,29 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const computedClassName = ({ flex, justify, align }) => { + const className = [] + + if (flex) { + className.push('row-flex') + className.push(`row-justify-${justify}`) + className.push(`row-align-${align}`) + } + + return className.join(' ') +} + +export const computedStyle = (gutter) => { + const value = gutter ? -(gutter / 2) : 0 + + return value ? { marginLeft: value + 'px', marginRight: value + 'px' } : {} +} diff --git a/packages/renderless/src/row/vue.ts b/packages/renderless/src/row/vue.ts new file mode 100644 index 000000000..96d725d9b --- /dev/null +++ b/packages/renderless/src/row/vue.ts @@ -0,0 +1,37 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { computedClassName, computedStyle } from './index' + +export const api = ['state'] + +export const renderless = (props, { computed, reactive }) => { + const api = { + computedStyle, + computedClassName + } + + const state = reactive({ + style: computed(() => api.computedStyle(props.gutter)), + className: computed(() => + api.computedClassName({ + flex: props.flex, + justify: props.justify, + align: props.align + }) + ) + }) + + api.state = state + + return api +} diff --git a/packages/renderless/src/scroll-text/index.ts b/packages/renderless/src/scroll-text/index.ts new file mode 100644 index 000000000..7a7a0080e --- /dev/null +++ b/packages/renderless/src/scroll-text/index.ts @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const computedBindStyle = ({ constants, time }) => ({ + [constants.ANIMATION_DURATION]: parseInt(time, 10) + 's' +}) + +export const stopAnimation = ({ props, state }) => () => { + if (props.hoverStop) { + state.isStop = true + } +} + +export const startAnimation = ({ props, state }) => () => { + if (props.hoverStop) { + state.isStop = false + } +} diff --git a/packages/renderless/src/scroll-text/vue.ts b/packages/renderless/src/scroll-text/vue.ts new file mode 100644 index 000000000..09f777e59 --- /dev/null +++ b/packages/renderless/src/scroll-text/vue.ts @@ -0,0 +1,34 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { computedBindStyle, stopAnimation, startAnimation } from './index' + +export const api = ['state', 'startAnimation', 'stopAnimation'] + +export const renderless = (props, { computed, reactive }, { constants }) => { + const api = { + computedBindStyle + } + + const state = reactive({ + isStop: false, + bindStyle: computed(() => api.computedBindStyle({ constants, time: props.time })) + }) + + Object.assign(api, { + state, + startAnimation: startAnimation({ props, state }), + stopAnimation: stopAnimation({ props, state }) + }) + + return api +} diff --git a/packages/renderless/src/scrollbar/index.ts b/packages/renderless/src/scrollbar/index.ts new file mode 100644 index 000000000..e8db3272a --- /dev/null +++ b/packages/renderless/src/scrollbar/index.ts @@ -0,0 +1,129 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +const horizontal = { + key: 'horizontal', + offset: 'offsetWidth', + scroll: 'scrollLeft', + scrollSize: 'scrollWidth', + size: 'width', + axis: 'X', + client: 'clientX', + direction: 'left' +} + +const vertical = { + key: 'vertical', + offset: 'offsetHeight', + scroll: 'scrollTop', + scrollSize: 'scrollHeight', + size: 'height', + axis: 'Y', + client: 'clientY', + direction: 'top' +} + +export const BAR_MAP = { + horizontal, + vertical +} + +export const renderThumbStyle = ({ bar, move, size }) => { + const style = {} + const translate = `translate${bar.axis}(${move}%)` + + style[bar.size] = size + + Object.assign(style, { transform: translate, msTransform: translate, webkitTransform: translate }) + + return style +} + +export const clickThumbHandler = ({ api, state }) => (event) => { + if (event.ctrlKey || event.button === 2) { + return + } + + api.startDrag(event) + + state[state.bar.axis] = event.currentTarget[state.bar.offset] - (event[state.bar.client] - event.currentTarget.getBoundingClientRect()[state.bar.direction]) +} + +export const clickTrackHandler = ({ refs, state }) => (event) => { + const offset = Math.abs(event.target.getBoundingClientRect()[state.bar.direction] - event[state.bar.client]) + + const thumbHalf = refs.thumb[state.bar.offset] / 2 + const thumbPositionPercentage = ((offset - thumbHalf) * 100) / refs.bar[state.bar.offset] + + state.wrap[state.bar.scroll] = (thumbPositionPercentage * state.wrap[state.bar.scrollSize]) / 100 +} + +export const startDrag = ({ api, on, state }) => (event) => { + event.stopImmediatePropagation() + + state.cursorDown = true + + on(document, 'mousemove', api.mouseMoveDocumentHandler) + on(document, 'mouseup', api.mouseUpDocumentHandler) + + document.onselectstart = () => false +} + +export const mouseMoveDocumentHandler = ({ refs, state }) => (event) => { + if (state.cursorDown === false) { + return + } + + const prevPage = state[state.bar.axis] + + if (!prevPage) { + return + } + + const offset = (refs.bar.getBoundingClientRect()[state.bar.direction] - event[state.bar.client]) * -1 + + const thumbClickPosition = refs.thumb[state.bar.offset] - prevPage + const thumbPositionPercentage = ((offset - thumbClickPosition) * 100) / refs.bar[state.bar.offset] + + state.wrap[state.bar.scroll] = (thumbPositionPercentage * state.wrap[state.bar.scrollSize]) / 100 +} + +export const mouseUpDocumentHandler = ({ api, off, state }) => () => { + state.cursorDown = false + state[state.bar.axis] = 0 + off(document, 'mousemove', api.mouseMoveDocumentHandler) + document.onselectstart = null +} + +export const handleScroll = ({ refs, state, emit }) => (event) => { + const wrap = refs.wrap + + state.moveY = (wrap.scrollTop * 100) / wrap.clientHeight + state.moveX = (wrap.scrollLeft * 100) / wrap.clientWidth + + emit('scroll', event) +} + +export const update = ({ refs, state }) => () => { + let heightPercentage, widthPercentage + const wrap = refs.wrap + + if (!wrap) { + return + } + + heightPercentage = (wrap.clientHeight * 100) / wrap.scrollHeight + widthPercentage = (wrap.clientWidth * 100) / wrap.scrollWidth + + state.sizeHeight = heightPercentage < 100 ? heightPercentage + '%' : '' + state.sizeWidth = widthPercentage < 100 ? widthPercentage + '%' : '' +} diff --git a/packages/renderless/src/scrollbar/vue-bar.ts b/packages/renderless/src/scrollbar/vue-bar.ts new file mode 100644 index 000000000..059718743 --- /dev/null +++ b/packages/renderless/src/scrollbar/vue-bar.ts @@ -0,0 +1,38 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { BAR_MAP, renderThumbStyle, clickThumbHandler, clickTrackHandler, startDrag, mouseMoveDocumentHandler, mouseUpDocumentHandler } from './index' +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' + +export const api = ['state', 'startDrag', 'renderThumbStyle', 'clickTrackHandler', 'clickThumbHandler', 'mouseUpDocumentHandler', 'mouseMoveDocumentHandler'] + +export const renderless = (props, { computed, onUnmounted, reactive }, { refs, parent }) => { + const state = reactive({ + bar: computed(() => BAR_MAP[props.vertical ? 'vertical' : 'horizontal']), + wrap: computed(() => parent.$refs.wrap) + }) + + const api = { + state, + renderThumbStyle, + clickTrackHandler: clickTrackHandler({ refs, state }), + mouseMoveDocumentHandler: mouseMoveDocumentHandler({ refs, state }) + } + + onUnmounted(() => off(document, 'mouseup', api.mouseUpDocumentHandler)) + + return Object.assign(api, { + startDrag: startDrag({ api, on, state }), + clickThumbHandler: clickThumbHandler({ api, state }), + mouseUpDocumentHandler: mouseUpDocumentHandler({ api, off, state }) + }) +} diff --git a/packages/renderless/src/scrollbar/vue.ts b/packages/renderless/src/scrollbar/vue.ts new file mode 100644 index 000000000..a896a864b --- /dev/null +++ b/packages/renderless/src/scrollbar/vue.ts @@ -0,0 +1,51 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { handleScroll, update } from './index' +import { addResizeListener, removeResizeListener } from '@opentiny/vue-renderless/common/deps/resize-event' + +export const api = ['state', 'update', 'handleScroll'] + +export const renderless = (props, { onBeforeUnmount, onMounted, reactive }, { refs, nextTick, emit }) => { + const state = reactive({ + sizeWidth: '0', + sizeHeight: '0', + moveX: 0, + moveY: 0 + }) + + const api = { + state, + update: update({ refs, state }), + handleScroll: handleScroll({ refs, state, emit }) + } + + onMounted(() => { + if (props.native) { + return + } + + nextTick(api.update) + + !props.noresize && addResizeListener(refs.resize, api.update) + }) + + onBeforeUnmount(() => { + if (props.native) { + return + } + + !props.noresize && removeResizeListener(refs.resize, api.update) + }) + + return api +} diff --git a/packages/renderless/src/search/index.ts b/packages/renderless/src/search/index.ts new file mode 100644 index 000000000..20078a41d --- /dev/null +++ b/packages/renderless/src/search/index.ts @@ -0,0 +1,104 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' +import PopupManager from '@opentiny/vue-renderless/common/deps/popup-manager' +import { isObject, typeOf } from '@opentiny/vue-renderless/common/type' + +export const handleChange = ({ emit, state }) => (event) => { + const value = event.target.value + emit('change', state.searchValue, value) +} + +export const handleInput = ({ emit, state }) => (event) => { + const value = event.target.value + emit('update:modelValue', value, state.searchValue) +} + +export const showSelector = ({ refs, state }) => () => { + refs.selector.style.zIndex = PopupManager.nextZIndex() + state.show = true +} + +export const changeKey = ({ emit, state }) => (key) => { + state.searchValue = key + state.show = false + + emit('select', key) +} + +export const searchClick = ({ emit, props, state }) => () => { + if (props.mini && state.collapse) { + state.collapse = false + } else { + emit('search', state.searchValue, state.currentValue) + } +} + +export const searchEnterKey = ({ api, props, refs, nextTick }) => () => { + if (props.isEnterSearch) { + api.searchClick() + nextTick(() => refs.input.blur()) + } +} + +export const clickOutside = ({ parent, props, state }) => (event) => { + if (!parent.$el.contains(event.target)) { + state.show = false + props.mini && !state.currentValue && (state.collapse = true) + } +} + +export const setDefaultType = (searchTypes) => { + let type = {} + + for (let i = 0, len = searchTypes.length; i < len; i++) { + if (isObject(searchTypes[i]) && typeOf(searchTypes[i].value) !== 'undefined' && typeOf(searchTypes[i].text) !== 'undefined') { + type = searchTypes[i] + break + } + } + + return type +} + +export const formatSearchTypes = (searchTypes) => { + const types = [] + + for (let i = 0, len = searchTypes.length; i < len; i++) { + if (isObject(searchTypes[i]) && typeOf(searchTypes[i].value) !== 'undefined' && typeOf(searchTypes[i].text) !== 'undefined') { + types.push(searchTypes[i]) + } + } + + return types +} + +/* istanbul ignore next */ +export const mounted = (api) => () => { + on(document.body, 'click', api.clickOutside) +} + +/* istanbul ignore next */ +export const beforeDestroy = (api) => () => { + off(document.body, 'click', api.clickOutside) +} + +export const clear = ({ emit, refs, state }) => () => { + state.currentValue = '' + refs.input.focus() + state.focus = true + + emit('change', [], '') + emit('update:modelValue', '', state.searchValue) + emit('clear') +} diff --git a/packages/renderless/src/search/vue.ts b/packages/renderless/src/search/vue.ts new file mode 100644 index 000000000..5230d4162 --- /dev/null +++ b/packages/renderless/src/search/vue.ts @@ -0,0 +1,111 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { + clear, + handleChange, + handleInput, + showSelector, + changeKey, + searchClick, + clickOutside, + beforeDestroy, + mounted, + formatSearchTypes, + setDefaultType, + searchEnterKey +} from './index' + +export const api = [ + 'state', + 'handleChange', + 'handleInput', + 'showSelector', + 'changeKey', + 'searchClick', + 'searchEnterKey', + 'inputStyle', + 'formatSearchTypes', + 'setDefaultType', + 'clear' +] + +export const useFormatSearchTypes = ({ computed, props, reactive, toRefs, watch }) => { + const api = { + setDefaultType, + formatSearchTypes + } + + const state = reactive({ + searchValue: {}, + types: computed(() => api.formatSearchTypes(props.searchTypes)) + }) + + watch( + () => props.searchTypes, + () => { + state.searchValue = api.setDefaultType(props.searchTypes) + }, + { immediate: true } + ) + + return { + api, + state: toRefs(state) + } +} + +export const renderless = (props, { computed, onBeforeUnmount, onMounted, reactive, toRefs, watch }, { refs, parent, emit, nextTick }) => { + const formatSearchTypes = useFormatSearchTypes({ + computed, + props, + reactive, + toRefs, + watch + }) + + const state = reactive({ + show: false, + focus: false, + hovering: false, + collapse: props.mini, + currentValue: props.modelValue, + ...formatSearchTypes.state, + showClear: computed(() => props.clearable && (state.focus || state.hovering) && state.currentValue) + }) + + const api = { + state, + clear: clear({ emit, refs, state }), + changeKey: changeKey({ state, emit }), + handleChange: handleChange({ emit, state, props }), + handleInput: handleInput({ emit, state, props }), + showSelector: showSelector({ refs, state }), + searchClick: searchClick({ emit, props, state }), + clickOutside: clickOutside({ parent, props, state }), + ...formatSearchTypes.api + } + + Object.assign(api, { + searchEnterKey: searchEnterKey({ api, props, refs, nextTick }) + }) + + onMounted(mounted(api)) + onBeforeUnmount(beforeDestroy(api)) + + watch( + () => props.modelValue, + (value) => (state.currentValue = value) + ) + + return api +} diff --git a/packages/renderless/src/select-dropdown/index.ts b/packages/renderless/src/select-dropdown/index.ts new file mode 100644 index 000000000..0a845bb20 --- /dev/null +++ b/packages/renderless/src/select-dropdown/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +export const mounted = ({ selectEmitter, constants, state, selectVm, updatePopper, destroyPopper, parent }) => () => { + selectEmitter.on(constants.EVENT_NAME.updatePopper, (keepZIndex) => { + let hideDrop = false + + if (!state.referenceElm || state.referenceElm.nodeType !== 1) { + // 触发源如果是用户传递的插槽,则赋值为外侧div + state.referenceElm = selectVm.$refs.reference ? selectVm.$refs.reference.$el : selectVm.$refs.select + selectVm.popperElm = selectVm.state.popperElm = state.popperElm = parent.$el + } + + if (parent.select.state.visible && !hideDrop) { + updatePopper(keepZIndex) + hideDrop = true + } + }) + + selectEmitter.on(constants.EVENT_NAME.destroyPopper, destroyPopper) +} diff --git a/packages/renderless/src/select-dropdown/vue.ts b/packages/renderless/src/select-dropdown/vue.ts new file mode 100644 index 000000000..71973afd0 --- /dev/null +++ b/packages/renderless/src/select-dropdown/vue.ts @@ -0,0 +1,92 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { mounted } from './index' +import userPopper from '@opentiny/vue-renderless/common/deps/vue-popper' + +export const api = ['state', 'doDestroy'] + +const initState = ({ reactive, computed, popper, selectVm }) => { + const { showPopper, currentPlacement, popperElm, referenceElm } = popper + + const state = reactive({ + showPopper, + currentPlacement, + popperElm, + referenceElm, + minWidth: '', + multiple: computed(() => selectVm.multiple), + popperClass: computed(() => selectVm.popperClass) + }) + + return state +} + +const initApi = ({ api, popper, state, selectEmitter, constants, selectVm, parent }) => { + const { destroyPopper, doDestroy, updatePopper } = popper + + Object.assign(api, { + state, + doDestroy, + mounted: mounted({ selectEmitter, constants, state, selectVm, updatePopper, destroyPopper, parent }) + }) +} + +const initWatch = ({ watch, selectVm, state }) => { + watch( + () => selectVm.state.inputWidth, + () => { + state.minWidth = (selectVm && selectVm.$el && selectVm.$el.getBoundingClientRect().width) + 'px' + }, + { immediate: true } + ) +} + +export const renderless = ( + props, + { computed, onBeforeUnmount, onDeactivated, onMounted, reactive, toRefs, watch, inject }, + { refs, slots, parent, emit, nextTick } +) => { + const api = {} + const constants = parent.select._constants + const selectEmitter = inject('selectEmitter') + const selectVm = inject('selectVm') + + const popper = userPopper({ + emit, + nextTick, + onBeforeUnmount, + onDeactivated, + props, + reactive, + refs, + slots, + toRefs, + watch + }) + + const state = initState({ reactive, computed, popper, selectVm }) + + initApi({ api, popper, state, selectEmitter, constants, selectVm, parent }) + initWatch({ watch, selectVm, state }) + + onBeforeUnmount(() => { + popper.destroyPopper('remove') + + state.popperElm = null + state.referenceElm = null + }) + + onMounted(api.mounted) + + return api +} diff --git a/packages/renderless/src/select/index.ts b/packages/renderless/src/select/index.ts new file mode 100644 index 000000000..dbe7d60c6 --- /dev/null +++ b/packages/renderless/src/select/index.ts @@ -0,0 +1,1563 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { find } from '@opentiny/vue-renderless/common/array' +import { getObj, isEqual } from '@opentiny/vue-renderless/common/object' +import { isKorean } from '@opentiny/vue-renderless/common/string' +import scrollIntoView from '@opentiny/vue-renderless/common/deps/scroll-into-view' +import PopupManager from '@opentiny/vue-renderless/common/deps/popup-manager' +import debounce from '@opentiny/vue-renderless/common/deps/debounce' +import { getDataset } from '@opentiny/vue-renderless/common/dataset' +import Memorize from '@opentiny/vue-renderless/common/deps/memorize' +import { isEmptyObject } from '@opentiny/vue-renderless/common/type' +import { addResizeListener, removeResizeListener } from '@opentiny/vue-renderless/common/deps/resize-event' +import { extend } from '@opentiny/vue-renderless/common/object' + +export const handleComposition = ({ api, nextTick, state }) => (event) => { + const text = event.target.value + + if (event.type === 'compositionend') { + state.isOnComposition = false + + nextTick(() => api.handleQueryChange(text)) + } else { + const lastCharacter = text[text.length - 1] || '' + + state.isOnComposition = !isKorean(lastCharacter) + } +} + +export const showTip = ({ props, state, refs }) => (show) => { + if (!props.showOverflowTooltip) { + return + } + + let overflow + + if (!show) { + clearTimeout(state.tipTimer) + + state.tipTimer = setTimeout(() => { + state.showTip = state.tipHover + }, refs.popover.closeDelay) + } else { + if (!props.multiple) { + const reference = refs.reference.$el + overflow = reference.querySelector('input').scrollWidth > reference.scrollWidth + } else { + overflow = refs.tags.scrollHeight > refs.tags.getBoundingClientRect().height + } + + state.showTip = show && overflow && !!state.tips && !state.visible + } +} + +export const gridOnQueryChange = ({ props, refs, constants, state }) => (value) => { + const { multiple, valueField, filterMethod, filterable, remote, remoteMethod } = props + + if (filterable && typeof filterMethod === 'function') { + const table = refs.selectGrid.$refs.tinyTable + const fullData = table.afterFullData + + refs.selectGrid.scrollTo(null, 0) + + table.afterFullData = filterMethod(value, fullData) || [] + + refs.selectGrid.handleTableData(!value).then(() => state.selectEmitter.emit(constants.EVENT_NAME.updatePopper)) + + state.previousQuery = value + } else if (remote && typeof remoteMethod === 'function') { + state.previousQuery = value + remoteMethod(value).then((data) => { + // 多选时取远端数据与当前已选数据的并集 + if (multiple) { + const selectedIds = state.selected.map((sel) => sel[valueField]) + refs.selectGrid.clearSelection() + refs.selectGrid.setSelection( + data.filter((row) => ~selectedIds.indexOf(row[valueField])), + true + ) + state.remoteData = data.filter((row) => !~selectedIds.indexOf(row[valueField])).concat(state.selected) + } else { + refs.selectGrid.clearRadioRow() + refs.selectGrid.setRadioRow(find(data, (item) => props.modelValue == item[props.valueField])) + state.remoteData = data + } + + refs.selectGrid.$refs.tinyTable.lastScrollTop = 0 + refs.selectGrid.loadData(data) + refs.selectGrid.handleTableData(!value).then(() => state.selectEmitter.emit(constants.EVENT_NAME.updatePopper)) + }) + } +} + +export const defaultOnQueryChange = ({ props, state, constants, api }) => (value) => { + if (props.remote && typeof props.remoteMethod === 'function') { + state.hoverIndex = -1 + props.remoteMethod(value) + } else if (typeof props.filterMethod === 'function') { + props.filterMethod(value) + state.selectEmitter.emit(constants.COMPONENT_NAME.OptionGroup, constants.EVENT_NAME.queryChange) + } else { + state.filteredOptionsCount = state.optionsCount + state.selectEmitter.emit(constants.EVENT_NAME.queryChange, value) + } + + if (props.defaultFirstOption && (props.filterable || props.remote) && state.filteredOptionsCount) { + api.checkDefaultFirstOption() + } +} + +export const handleQueryChange = ({ api, constants, nextTick, props, vm, state }) => (value) => { + const refs = vm.$refs + + if (state.previousQuery === value || state.isOnComposition) { + return + } + + if (state.previousQuery === null && (typeof props.filterMethod === 'function' || typeof props.remoteMethod === 'function')) { + state.previousQuery = value + return + } + + if (props.renderType === constants.TYPE.Grid) { + api.gridOnQueryChange(value) + return + } + + if (props.renderType === constants.TYPE.Tree) { + state.previousQuery = value + + if (state.filterOrSearch && typeof props.filterMethod === 'function') { + refs.selectTree && refs.selectTree.filter(value) + } + } + + state.previousQuery = value + + nextTick(() => { + if (state.visible) { + state.selectEmitter.emit(constants.EVENT_NAME.updatePopper) + state.showWarper = true + } + }) + state.hoverIndex = -1 + + if (props.multiple && props.filterable) { + nextTick(() => { + if (refs.input) { + const length = refs.input.value.length * 15 + 20 + state.inputLength = state.collapseTags ? Math.min(50, length) : length + api.managePlaceholder() + api.resetInputHeight() + } + }) + } + + if (props.renderType === constants.TYPE.Tree) { + return + } + + api.defaultOnQueryChange(value) +} + +export const scrollToOption = ({ refs, constants }) => (option) => { + const target = Array.isArray(option) && option[0] ? option[0].el : option.el + + if (refs.popper && target) { + const menu = refs.popper.$el.querySelector(constants.CLASS.SelectDropdownWrap) + + scrollIntoView(menu, target) + } + + refs.scrollbar && refs.scrollbar.handleScroll() +} + +export const handleMenuEnter = ({ api, nextTick, state }) => () => { + nextTick(() => api.scrollToOption(state.selected)) +} + +export const emitChange = ({ emit, props, state, constants }) => (value) => { + const seekItem = (val, arr, items, flag) => { + if (constants.TYPE.Tree === flag) { + const recurNode = (node) => { + val === node[props.valueField] && items.push(node) + val !== node[props.valueField] && Array.isArray(node.children) && node.children.forEach(recurNode) + } + + arr.forEach(recurNode) + } else if (constants.TYPE.Grid === flag) { + for (let i = 0; i < arr.length; i++) { + if (val === arr[i][props.valueField]) { + items.push(arr[i]) + break + } + } + } + } + + if (!isEqual(props.modelValue, value)) { + if (props.renderType === constants.TYPE.Grid && props.multiple) { + value = value || [] + + const gridData = state.gridData || [] + const items = [] + + value.forEach((valueItem) => { + seekItem(valueItem, gridData, items, constants.TYPE.Grid) + }) + + emit('change', value, items) + } else if (props.renderType === constants.TYPE.Tree && props.multiple) { + value = value || [] + + const treeData = state.treeData || [] + const items = [] + + value.forEach((valueItem) => { + seekItem(valueItem, treeData, items, constants.TYPE.Tree) + }) + + emit('change', value, items) + } else { + emit('change', value) + } + } +} + +export const getOption = ({ props, state }) => (value) => { + let option + const isObject = Object.prototype.toString.call(value).toLowerCase() === '[object object]' + const isNull = Object.prototype.toString.call(value).toLowerCase() === '[object null]' + const isUndefined = Object.prototype.toString.call(value).toLowerCase() === '[object undefined]' + + for (let i = state.cachedOptions.length - 1; i >= 0; i--) { + const cachedOption = state.cachedOptions[i] + const isEqual = isObject ? getObj(cachedOption.value, props.valueKey) === getObj(value, props.valueKey) : cachedOption.value === value + + if (isEqual) { + option = cachedOption + break + } + } + + if (option) { + return option + } + + const label = !isObject && !isNull && !isUndefined ? value : '' + let newOption = { value, currentLabel: label } + + if (props.multiple) { + newOption.hitState = false + } + + return newOption +} + +const getOptionOfSetSelected = ({ api, props }) => { + const option = api.getOption(props.modelValue) || {} + + if (!option.state) { + option.state = {} + } + + if (option.created) { + option.createdLabel = option.state.currentLabel + option.createdSelected = true + } else { + option.createdSelected = false + } + + return option +} + +const getResultOfSetSelected = ({ props, isGrid, isTree, api }) => { + let result = [] + + if (Array.isArray(props.modelValue)) { + props.modelValue.forEach((value) => { + if (isGrid || isTree) { + const option = api.getPluginOption(value, isTree) + + result = result.concat(option) + } else { + result.push(api.getOption(value)) + } + }) + } + + return result +} + +export const setSelected = ({ api, constants, nextTick, props, refs, state }) => () => { + const isTree = props.renderType === constants.TYPE.Tree + const isGrid = props.renderType === constants.TYPE.Grid + + if (!props.multiple) { + if (isGrid || isTree) { + if (!props.modelValue) { + state.selectedLabel = '' + state.selected = {} + state.currentKey = '' + refs.selectGrid && refs.selectGrid.clearRadioRow() + refs.selectTree && refs.selectTree.setCurrentKey && refs.selectTree.setCurrentKey(null) + return + } + + const isRemote = state.filterOrSearch && props.remote && typeof props.remoteMethod === 'function' + const nestdata = isRemote ? state.remoteData : isTree ? api.getTreeData(state.treeData) : state.gridData + const data = find(nestdata, (item) => props.modelValue == item[props.valueField]) + + if (isEmptyObject(data)) { + return + } + + const obj = { ...data } + const label = data[props.textField] + obj.currentLabel = label + state.selectedLabel = label + state.selected = obj + state.currentKey = data[props.valueField] + } else { + const option = getOptionOfSetSelected({ api, props }) + nextTick(() => { + state.selected = option + state.selectedLabel = option.state.currentLabel || option.currentLabel + props.filterable && (state.query = state.selectedLabel) + }) + } + + return + } + + const result = getResultOfSetSelected({ props, isGrid, isTree, api }) + + state.selectCls = result.length ? (result.length === state.options.length ? 'checked-sur' : 'halfselect') : 'check' + state.selected = result + refs.selectTree && refs.selectTree.setCheckedNodes && refs.selectTree.setCheckedNodes(state.selected) + state.tips = state.selected.map((item) => (item.state ? item.state.currentLabel : item.currentLabel)).join(',') + + nextTick(api.resetInputHeight) +} + +export const getPluginOption = ({ api, props, state }) => (value, isTree) => { + const isRemote = state.filterOrSearch && props.remote && typeof props.remoteMethod === 'function' + const { textField, valueField } = props + const sourceData = isRemote ? state.remoteData : isTree ? api.getTreeData(state.treeData) : state.gridData + const selNode = find(sourceData, (item) => item[valueField] == value) + const items = [] + + if (selNode) { + selNode.currentLabel = selNode[textField] + items.push(selNode) + } + + return items +} + +export const toggleCheckAll = ({ api, emit, state }) => () => { + const getEnabledValues = (options) => { + let values = [] + + for (let i = 0; i < options.length; i++) { + if (!options[i].state.disabled && !options[i].state.groupDisabled) { + values.push(options[i].value) + } + } + + return values + } + + let value + + if (state.selectCls === 'check') { + value = getEnabledValues(state.options) + } else if (state.selectCls === 'halfselect') { + const unchecked = state.options.filter((item) => !item.disabled && item.state.selectCls === 'check') + + unchecked.length ? (value = getEnabledValues(state.options)) : (value = []) + } else if (state.selectCls === 'checked-sur') { + value = [] + } + + api.setSoftFocus() + + emit('update:modelValue', value) + emit('change', value) +} + +export const resetFilter = ({ state, api }) => () => { + state.query = '' + state.previousQuery = undefined + api.handleQueryChange(state.query) +} + +export const handleFocus = ({ emit, props, state, api }) => (event) => { + if (!state.softFocus) { + if (props.automaticDropdown || props.filterable) { + state.visible = true + state.softFocus = true + } + + emit('focus', event) + } else { + state.softFocus = false + } + + if (props.remote && state.filterOrSearch && state.firstAutoSeach) { + state.firstAutoSeach = false + api.resetFilter() + } +} + +export const focus = ({ refs, state }) => () => { + if (!state.softFocus) { + refs.reference?.focus() + } +} + +export const blur = ({ refs, state }) => () => { + state.visible = false + refs.reference?.blur() +} + +export const handleBlur = ({ constants, dispatch, emit, state }) => (event) => { + setTimeout(() => { + if (state.isSilentBlur) { + state.isSilentBlur = false + } else { + emit('blur', event) + } + + dispatch(constants.COMPONENT_NAME.FormItem, constants.EVENT_NAME.formBlur, event?.target?.value) + }, 100) + + state.softFocus = false +} + +export const handleClearClick = (api) => (event) => { + api.deleteSelected(event) +} + +export const doDestroy = (refs) => () => { + refs.popper && refs.popper.doDestroy() +} + +export const handleClose = (state) => () => { + state.visible = false +} + +export const toggleLastOptionHitState = ({ state }) => (hit) => { + if (!Array.isArray(state.selected)) { + return + } + + const option = state.selected[state.selected.length - 1] + + if (!option) { + return + } + + const hitTarget = option.state || option + + if (hit === true || hit === false) { + hitTarget.hitState = hit + + return hit + } + + hitTarget.hitState = !hitTarget.hitState + + return hitTarget.hitState +} + +export const deletePrevTag = ({ api, constants, emit, props, state, vm }) => (event) => { + const refs = vm.$refs + + if (event.target.value.length <= 0 && !api.toggleLastOptionHitState()) { + const value = props.modelValue.slice() + + value.pop() + + emit('update:modelValue', value) + + api.emitChange(value) + + if (props.renderType === constants.TYPE.Grid) { + const rows = state.selected.slice().filter((item) => value.includes(item[props.valueField])) + + refs.selectGrid.clearSelection() + refs.selectGrid.setSelection(rows, true) + } + } +} + +export const managePlaceholder = ({ refs, state }) => () => { + if (state.currentPlaceholder !== '') { + state.currentPlaceholder = refs.input.value ? '' : state.cachedPlaceHolder + } +} + +export const resetInputState = ({ api, refs, state }) => (event) => { + if (event.keyCode !== 8) { + api.toggleLastOptionHitState(false) + } + + state.inputLength = refs.input.value.length * 15 + 20 + api.resetInputHeight() +} + +export const resetInputHeight = ({ constants, nextTick, props, refs, state }) => () => { + if (state.collapseTags && (!props.filterable || !props.searchable)) { + return + } + + nextTick(() => { + if (!refs.reference) { + return + } + + let inputChildNodes = refs.reference.$el.childNodes + let input = [].filter.call(inputChildNodes, (item) => item.tagName === 'INPUT')[0] + const tags = refs.tags + + if (!input) { + return + } + + const sizeInMap = state.initialInputHeight || 30 + const noSelected = state.selected.length === 0 + + input.style.height = noSelected ? sizeInMap + 'px' : Math.max(tags ? tags.clientHeight + (tags.clientHeight > sizeInMap ? 6 : 0) : 0, sizeInMap) + 'px' + + if (state.visible && state.emptyText !== false) { + state.selectEmitter.emit(constants.EVENT_NAME.updatePopper, true) + } + }) +} + +export const resetHoverIndex = ({ props, state }) => () => { + if (!props.showOverflowTooltip) { + state.hoverIndex = -1 + } else if (!props.multiple) { + state.hoverIndex = state.options.indexOf(state.selected) + } else { + if (state.selected.length > 0) { + state.hoverIndex = Math.min.apply( + null, + state.selected.map((item) => state.options.indexOf(item)) + ) + } else { + state.hoverIndex = -1 + } + } +} + +export const handleOptionSelect = ({ api, emit, nextTick, props, refs, state }) => (option, byClick) => { + state.memorize && state.memorize.updateByKey(option[state.memorize._dataKey] || option.value) + + if (props.multiple) { + const value = (props.modelValue || []).slice() + const optionIndex = api.getValueIndex(value, option.value) + + if (optionIndex > -1) { + value.splice(optionIndex, 1) + } else if (state.multipleLimit <= 0 || value.length < state.multipleLimit) { + value.push(option.value) + } + + emit('update:modelValue', value) + api.emitChange(value) + + if (option.created) { + state.query = '' + api.handleQueryChange('') + state.inputLength = 20 + } + if (props.filterable) { + refs.input?.focus() + } + if (props.searchable) { + refs.reference?.focus() + } + if (props.autoClose) { + state.visible = false + } + } else { + emit('update:modelValue', option.value) + api.emitChange(option.value) + if (option.created) { + state.createdSelected = true + state.createdLabel = option.value + } + state.visible = false + } + + state.isSilentBlur = byClick + api.setSoftFocus() + if (state.visible) { + return + } + + nextTick(() => { + api.scrollToOption(option) + }) +} + +export const setSoftFocus = ({ refs, state }) => () => { + state.softFocus = true + + const input = refs.input || refs.reference + + input?.focus() +} + +export const getValueIndex = (props) => (arr = [], value = null) => { + const isObject = Object.prototype.toString.call(value).toLowerCase() === '[object object]' + + if (!isObject) { + return arr.indexOf(value) + } else { + const valueKey = props.valueKey + let index = -1 + + arr.some((item, i) => { + if (getObj(item, valueKey) === getObj(value, valueKey)) { + index = i + return true + } + return false + }) + + return index + } +} + +export const toggleMenu = ({ refs, state, props }) => () => { + if (!state.selectDisabled) { + !props.ignoreEnter && (state.visible = !state.visible) + + // 如果用户自定义触发源插槽则不需要执行以下代码 + if (state.softFocus && refs.reference) { + !props.ignoreEnter && (state.visible = !state.visible) + state.softFocus = false + } + + if (state.visible) { + const dom = refs.input || refs.reference + dom?.focus() + } + } +} + +export const selectOption = ({ api, state, props }) => () => { + if (!state.visible || props.hideDrop) { + api.toggleMenu() + } else { + if (state.options[state.hoverIndex]) { + api.handleOptionSelect(state.options[state.hoverIndex]) + } + } +} + +export const deleteSelected = ({ api, constants, emit, props, vm, state }) => (event) => { + event.stopPropagation() + + const value = props.multiple ? [] : '' + const refs = vm.$refs + + if (props.renderType === constants.TYPE.Tree) { + state.selected = {} + state.selectedLabel = '' + refs.selectTree.setCurrentKey(null) + } else if (props.renderType === constants.TYPE.Grid) { + state.selected = {} + state.selectedLabel = '' + refs.selectGrid.clearRadioRow() + } + + state.showTip = false + + emit('update:modelValue', value) + + api.emitChange(value) + + state.visible = false + + emit('clear') +} + +export const deleteTag = ({ api, constants, emit, props, state, vm }) => (event, tag) => { + const refs = vm.$refs + const isTree = props.renderType === constants.TYPE.Tree + const index = state.selected.indexOf(tag) + const treeValue = [] + const treeIds = [tag[props.valueField]] + + if (isTree && !props.treeOp.checkStrictly) { + let node = refs.selectTree.getNode(tag[props.valueField]) + + if (!node.isLeaf) { + treeIds.push(...api.getChildValue(node.childNodes, props.valueField)) + } + + while (node.parent && !Array.isArray(node.parent.data)) { + treeIds.push(node.parent.data[props.valueField]) + node = node.parent + } + + state.selected.slice().map((node) => !treeIds.includes(node[props.valueField]) && treeValue.push(node[props.valueField])) + } + + if (index > -1 && !state.selectDisabled) { + const value = props.modelValue.slice() + value.splice(index, 1) + + if (props.renderType === constants.TYPE.Tree) { + props.treeOp.checkStrictly && treeValue.push(...value) + refs.selectTree.setCheckedKeys(treeValue) + } else if (props.renderType === constants.TYPE.Grid) { + const rows = state.selected.slice().filter((item) => value.includes(item[props.valueField])) + + refs.selectGrid.clearSelection() + refs.selectGrid.setSelection(rows, true) + } + + emit('update:modelValue', isTree ? treeValue : value) + + api.emitChange(value) + + emit(constants.EVENT_NAME.removeTag, tag[props.valueField]) + } + + event.stopPropagation() +} + +export const onInputChange = ({ api, props, state, constants, nextTick }) => () => { + if (!props.delay) { + if (props.filterable && state.query !== state.selectedLabel) { + state.query = state.selectedLabel + + api.handleQueryChange(state.query) + + nextTick(() => { + state.selectEmitter.emit(constants.EVENT_NAME.updatePopper) + }) + } + } else { + api.debouncRquest() + } + + nextTick(() => { + state.selectEmitter.emit(constants.EVENT_NAME.updatePopper) + }) +} + +export const onOptionDestroy = (state) => (index) => { + if (index > -1) { + state.optionsCount-- + state.filteredOptionsCount-- + state.options.splice(index, 1) + } +} + +export const resetInputWidth = ({ refs, state }) => () => { + state.inputWidth = refs.reference?.$el?.getBoundingClientRect()?.width || 0 +} + +export const handleResize = ({ api, props }) => () => { + api.resetInputWidth() + + if (props.multiple) { + api.resetInputHeight() + } +} + +export const checkDefaultFirstOption = (state) => () => { + state.hoverIndex = -1 + + let hasCreated = false + + for (let i = state.options.length - 1; i >= 0; i--) { + if (state.options[i].created) { + hasCreated = true + state.hoverIndex = i + break + } + } + + if (hasCreated) { + return + } + + for (let i = 0; i !== state.options.length; ++i) { + const option = state.options[i] + + if (state.query) { + if (!option.disabled && !option.groupDisabled && option.visible) { + state.hoverIndex = i + break + } + } else { + if (option.itemSelected) { + state.hoverIndex = i + break + } + } + } +} + +export const getValueKey = (props) => (item) => { + if (Object.prototype.toString.call(item.value).toLowerCase() !== '[object object]') { + return item.value + } + + return getObj(item.value, props.valueKey) +} + +export const navigateOptions = ({ api, nextTick, state }) => (direction) => { + const len = state.options.length + + if (!state.visible) { + state.visible = true + return + } + + if (len === 0 || state.filteredOptionsCount === 0) { + return + } + + if (!state.optionsAllDisabled) { + if (direction === 'next') { + state.hoverIndex++ + + if (state.hoverIndex === len) { + state.hoverIndex = 0 + } + } else if (direction === 'prev') { + state.hoverIndex-- + + if (state.hoverIndex < 0) { + state.hoverIndex = len - 1 + } + } + + const option = state.options[state.hoverIndex] + + if (option.disabled === true || option.groupDisabled === true || !option.visible) { + api.navigateOptions(direction) + } + + nextTick(() => api.scrollToOption(state.hoverOption)) + } +} + +export const emptyText = ({ I18N, props, state, t }) => () => { + if (props.loading) { + return props.loadingText || t(I18N.loading) + } else { + if (props.remote && state.query === '' && props.renderType) { + if (props.multiple) { + return state.selected.length > 0 || state.remoteData.length > 0 + } + + return state.selected[props.valueField] || state.remoteData.length > 0 + } + + if (props.remote && state.query === '' && state.options.length === 0) { + return false + } + + if (state.filterOrSearch && state.query && state.options.length > 0 && state.filteredOptionsCount === 0) { + return props.noMatchText || t(I18N.noMatch) + } + + if (!state.options.some((option) => option.visible)) { + return props.noDataText || t(I18N.noData) + } + } + + return null +} + +const optmzApis = { + exist: (val, multiple) => (multiple ? Array.isArray(val) && val.length : val), + getValueIndex: (props) => { + const { options, valueField, modelValue, multiple } = props + const contain = (val, arr) => Array.isArray(arr) && ~arr.indexOf(val) + const equal = (val, opt) => (multiple ? contain(opt[valueField], [val]) : opt[valueField] === val) + let start = 0 + + if (optmzApis.exist(modelValue, multiple)) { + const lastVal = multiple ? modelValue[modelValue.length - 1] : modelValue + + for (let i = 0; i < options.length; i++) { + if (!equal(lastVal, options[i])) { + continue + } + + return i + } + } + + return start + }, + getStartIndex: ({ props, state }) => { + const { options } = props + const { optimizeOpts, optimizeStore } = state + const { rSize } = optimizeOpts + const { valueIndex } = optimizeStore + + return valueIndex + rSize > options.length ? options.length - rSize : valueIndex + }, + getViewStyle: ({ props, state }) => { + const { options } = props + const { optimizeOpts } = state + const { optionHeight } = optimizeOpts + + return `height:${optionHeight * options.length}px` + }, + getStoreDatas: ({ props, state }) => { + const { options, valueField, modelValue, multiple } = props + const { datas, optimizeOpts, optimizeStore } = state + const { startIndex } = optimizeStore + const { rSize } = optimizeOpts + const sliced = datas.slice(startIndex, startIndex + rSize) + const hiddenOptions = (optimizeStore.hiddenOptions = []) + const findPush = (val) => { + const opt = options.find((option) => option[valueField] === val) + + if (opt && !~sliced.indexOf(opt)) { + sliced.push(opt) + hiddenOptions.push(opt) + } + } + + if (optmzApis.exist(modelValue, multiple)) { + if (multiple) { + modelValue.forEach(findPush) + } else { + findPush(modelValue) + } + } + + return sliced + }, + queryWrap: (refs) => refs.scrollbar.$el.querySelector('.tiny-scrollbar__wrap.virtual'), + queryItems: (refs) => refs.scrollbar.$el.querySelectorAll('.tiny-select-dropdown__item.virtual'), + createMacro: (cb) => setTimeout(cb), + setScrollTop: ({ refs, state }) => { + const { optimizeOpts, optimizeStore } = state + const { optionHeight } = optimizeOpts + const wrap = optmzApis.queryWrap(refs) + + wrap.scrollTop = optionHeight * optimizeStore.valueIndex + }, + setValueIndex: ({ props, state }) => (state.optimizeStore.valueIndex = optmzApis.getValueIndex(props)), + addScrollListener: ({ api, refs, state }) => { + const { optimizeStore } = state + const wrap = optmzApis.queryWrap(refs) + + !optimizeStore.bind && wrap.addEventListener('scroll', api.getScrollListener) && (optimizeStore.bind = true) + }, + removeScrollListener: ({ api, refs, state }) => { + const { optimizeStore } = state + const wrap = optmzApis.queryWrap(refs) + + optimizeStore.bind && wrap.removeEventListener('scroll', api.getScrollListener) && (optimizeStore.bind = false) + }, + isFirstPage: ({ props, state }) => { + const { optimizeStore } = state + const { datas } = optimizeStore + const { options } = props + + return Array.isArray(datas) && Array.isArray(options) && datas[0] === options[0] + }, + natural: (val) => (val < 0 ? 0 : val), + updateItems: ({ refs, state, itemFn }) => { + const { optimizeOpts } = state + const { optionHeight } = optimizeOpts + const items = optmzApis.queryItems(refs) + + for (let i = 0; i < items.length; i++) { + const item = items[i] + const flag = item.classList.contains('virtual-hidden') + + item.style.top = flag ? `-${optionHeight}px` : `${itemFn(i)}px` + } + }, + process: ({ props, start, state }) => { + const { optimizeStore } = state + + optimizeStore.startIndex = typeof start !== 'undefined' ? start : optmzApis.getStartIndex({ props, state }) + optimizeStore.datas = optmzApis.getStoreDatas({ props, state }) + optimizeStore.firstPage = optmzApis.isFirstPage({ props, state }) + } +} + +export const watchValue = ({ api, constants, dispatch, props, refs, state }) => (value, oldValue) => { + if (props.multiple) { + api.resetInputHeight() + + if ((value && value.length > 0) || (refs.input && state.query !== '')) { + state.currentPlaceholder = '' + } else { + state.currentPlaceholder = state.cachedPlaceHolder + } + + if (state.filterOrSearch && !props.reserveKeyword) { + props.renderType !== constants.TYPE.Grid && (state.query = '') + api.handleQueryChange(state.query) + } + } + + api.setSelected() + + if (props.filterable && !props.multiple) { + state.inputLength = 20 + } + + if (state.completed && !isEqual(value, oldValue)) { + dispatch(constants.COMPONENT_NAME.FormItem, constants.EVENT_NAME.formChange, value) + } + + state.optimizeStore.flag && optmzApis.setValueIndex({ props, state }) +} + +export const calcOverFlow = ({ refs, props, state }) => (height) => { + if (!props.multiple || !props.showOverflowTooltip) { + return + } + state.overflow = false + + const tagDom = refs.tags + const tags = tagDom.querySelectorAll('.tiny-tag') + + if (tags.length) { + tagDom.scrollTo && tagDom.scrollTo({ top: 0 }) + let { x, width } = tags[0].getBoundingClientRect() + + if (width >= tagDom.getBoundingClientRect().width) { + state.overflow = 0 + } else { + for (let i = 1; i < tags.length; i++) { + let tx = tags[i].getBoundingClientRect().x + + if (tx == x) { + state.overflow = i - 1 + break + } + } + } + } + + refs.select.style.height = refs.select.style.height || height + refs.reference.$el.style.position = 'absolute' + + const inputWidth = refs.select.getBoundingClientRect().width + const position = state.visible ? 'absolute' : '' + + state.selectFiexd = { + height, + position, + width: inputWidth + 'px', + zIndex: PopupManager.nextZIndex() + } + + state.inputWidth = inputWidth +} + +const postOperOfToVisible = ({ props, state, constants }) => { + if (props.multiple) { + return + } + + if (state.selected) { + if (props.renderType === constants.TYPE.Grid || props.renderType === constants.TYPE.Tree) { + state.selectedLabel = state.selected.currentLabel + } else { + if (props.filterable && props.allowCreate && state.createdSelected && state.createdLabel) { + state.selectedLabel = state.createdLabel + } else { + state.selectedLabel = state.selected.state.currentLabel || state.selected.currentLabel + } + + if (props.filterable) { + state.query = state.selectedLabel + } + } + + if (state.filterOrSearch) { + state.currentPlaceholder = state.cachedPlaceHolder + } + } +} + +export const toVisible = ({ constants, state, props, vm, api, nextTick }) => () => { + const refs = vm.$refs + + state.selectEmitter.emit(constants.EVENT_NAME.destroyPopper) + props.remote && props.dropOnlySearch && (state.showWarper = false) + + refs.input?.blur() + state.query = '' + state.selectedLabel = '' + state.inputLength = 20 + + if (props.renderType !== constants.TYPE.Tree) { + state.previousQuery = props.remoteConfig.clearData && state.previousQuery !== state.query ? undefined : null + } + + api.resetHoverIndex() + + nextTick(() => { + if (refs.input && refs.input.value === '' && state.selected.length === 0) { + state.currentPlaceholder = state.cachedPlaceHolder + } + + if (refs.selectGrid) { + refs.selectGrid.clearScroll() + } + }) + + postOperOfToVisible({ props, state, constants }) +} + +export const toHide = ({ constants, state, props, vm, api }) => () => { + const refs = vm.$refs + + state.selectEmitter.emit(constants.COMPONENT_NAME.SelectDropdown, constants.EVENT_NAME.updatePopper) + + if (state.filterOrSearch) { + state.query = props.remote || props.searchable ? '' : props.renderType !== constants.TYPE.Tree ? state.selectedLabel : '' + + state.previousQuery !== state.query && api.handleQueryChange(state.query) + + if (props.multiple) { + props.filterable ? refs.input?.focus() : refs.reference?.focus() + } else { + if (!props.remote) { + state.selectEmitter.emit(constants.EVENT_NAME.queryChange, '') + + state.selectEmitter.emit(constants.COMPONENT_NAME.OptionGroup, constants.EVENT_NAME.queryChange) + } + + if (state.selectedLabel) { + state.currentPlaceholder = state.selectedLabel + state.selectedLabel = '' + } + } + } + + if (refs.selectGrid) { + refs.selectGrid.clearSelection() + refs.selectGrid.setSelection(state.selected, true) + + if (state.filterOrSearch && typeof props.filterMethod === 'function') { + refs.selectGrid.handleTableData(true) + } else if (state.filterOrSearch && props.remote && typeof props.remoteMethod === 'function') { + refs.selectGrid.handleTableData() + } + } +} + +export const watchVisible = ({ api, constants, emit, state, refs }) => (value) => { + if (api.onCopying()) { + return + } + + value ? api.toHide() : api.toVisible() + + emit(constants.EVENT_NAME.visibleChange, value) + + setTimeout(() => { + state.selectEmitter.emit(constants.EVENT_NAME.updatePopper) + }) + + if (value && state.optimizeStore.flag) { + optmzApis.createMacro(() => { + optmzApis.setScrollTop({ refs, state }) + api.getScrollListener() + }) + } +} + +export const watchOptions = ({ api, constants, nextTick, parent, props, state }) => () => { + if (typeof window === 'undefined') { + return + } + + nextTick(() => { + state.selectEmitter.emit(constants.EVENT_NAME.updatePopper) + }) + + if (props.multiple) { + api.resetInputHeight() + } + + nextTick(() => { + if (parent.$el.querySelector('input') !== document.activeElement) { + api.setSelected() + } + }) + + if (props.defaultFirstOption && (props.filterabl || props.searchable || props.remote) && state.filteredOptionsCount) { + api.checkDefaultFirstOption() + } +} + +export const handleCopyClick = ({ parent, props, state }) => () => { + const input = document.createElement('input') + + input.style.height = 0 + input.style.border = 'none' + input.style.position = 'absolute' + + parent.$el.appendChild(input) + + input.value = state.selected.map((item) => (item.state ? item.state.currentLabel : item.currentLabel)).join(props.textSplit) + + input.select() + document.execCommand('copy') + parent.$el.removeChild(input) +} + +export const selectChange = ({ emit, props, state }) => ({ $table, selection, checked, row }) => { + const { textField, valueField } = props + const remoteItem = (row) => { + const removeItem = find(state.selected, (item) => item[valueField] === row[valueField]) + + removeItem && state.selected.splice(state.selected.indexOf(removeItem), 1) + } + + if (row) { + checked ? state.selected.push({ ...row, value: row[valueField], currentLabel: row[textField] }) : remoteItem(row) + } else { + checked + ? (state.selected = state.selected.concat(selection.filter((row) => !~props.modelValue.indexOf(row[valueField])))) + : $table.tableData.forEach((row) => remoteItem(row)) + } + + const keys = state.selected.map((item) => item[valueField]) + + emit('update:modelValue', keys) + emit('change', keys, state.selected) +} + +export const getcheckedData = ({ props, state }) => () => { + const checkedKey = [] + + if (!Array.isArray(state.selected)) { + return props.modelValue ? [props.modelValue] : [state.selected[props.valueField]] + } else { + state.selected.length > 0 && + state.selected.forEach((item) => { + checkedKey.push(item[props.valueField]) + }) + + return checkedKey + } +} + +export const radioChange = ({ emit, props, state }) => ({ row }) => { + row.value = row[props.valueField] + row.currentLabel = row[props.textField] + state.selected = row + state.visible = false + state.currentKey = row[props.valueField] + + emit('update:modelValue', row.value) + emit('change', row) +} + +export const getTreeData = (props) => (data) => { + const nodes = [] + const getChild = (data, pId) => { + data.forEach((node) => { + node.pId = pId + nodes.push(node) + + if (node.children && node.children.length > 0) { + getChild(node.children, node[props.valueField]) + } + }) + } + + getChild(data, null) + + return nodes +} + +export const treeNodeClick = ({ emit, props, state }) => (data) => { + if (!props.multiple) { + data.currentLabel = data[props.textField] + data.value = data[props.valueField] + state.selected = data + state.visible = false + + emit('update:modelValue', data.value) + emit('change', data) + } +} + +export const nodeCheckClick = ({ emit, props }) => (data, { checkedKeys, checkedNodes }) => { + checkedNodes.forEach((node) => { + node.currentLabel = node[props.textField] + node.value = node[props.valueField] + }) + + emit('update:modelValue', checkedKeys) + emit('change', checkedKeys, checkedNodes) +} + +export const nodeCollapse = ({ state, constants }) => () => { + setTimeout(() => { + state.selectEmitter.emit(constants.EVENT_NAME.updatePopper) + }, 310) +} + +export const nodeExpand = ({ state, constants }) => () => { + setTimeout(() => { + state.selectEmitter.emit(constants.EVENT_NAME.updatePopper) + }, 310) +} + +export const debouncRquest = ({ api, state, props }) => + debounce(props.delay, () => { + if (state.filterOrSearch && state.query !== state.selectedLabel) { + state.query = state.selectedLabel + api.handleQueryChange(state.query) + } + }) + +export const getChildValue = () => (data, key) => { + const ids = [] + + const getChild = (nodes) => { + nodes.forEach((node) => { + ids.push(node.data[key]) + + if (node.childNodes.length > 0) { + getChild(node.childNodes) + } + }) + } + + getChild(data) + + return ids +} + +export const watchPropsOption = ({ constants, parent, props, state }) => () => { + const renderType = props.renderType + const { key, parentKey } = props.treeOp + + const dataset = { + dataset: props.options || props.dataset, + service: parent.$service, + tree: { key, parentKey } + } + + getDataset(dataset).then((data) => { + if (renderType === constants.TYPE.Tree) { + state.treeData = data + } else if (renderType === constants.TYPE.Grid) { + state.gridData = data + } else { + if (props.cacheOp && props.cacheOp.key) { + state.memorize = new Memorize(props.cacheOp) + state.datas = state.memorize.assemble(data.slice()) + } else { + state.datas = data + } + } + }) +} + +export const buildSelectConfig = ({ props, state }) => () => { + const checkRowKeys = state.gridCheckedData + const selectConfig = props.selectConfig + + return { ...selectConfig, checkRowKeys } +} + +export const buildRadioConfig = ({ props, state }) => () => { + const checkRowKey = state.currentKey + const highlight = true + const radioConfig = props.radioConfig + + return { ...radioConfig, ...{ checkRowKey, highlight } } +} + +export const onMouseenterNative = ({ state }) => () => { + state.inputHovering = true + + if (state.searchSingleCopy && state.selectedLabel) { + state.softFocus = true + } +} + +export const onMouseleaveNative = ({ state }) => () => { + state.inputHovering = false + + if (state.searchSingleCopy && state.selectedLabel) { + state.softFocus = false + } +} + +export const onCopying = ({ state, refs }) => () => + state.searchSingleCopy && state.selectedLabel && refs.reference && refs.reference.hasSelection && refs.reference.hasSelection() + +export const watchHoverIndex = ({ state }) => (value) => { + if (typeof value === 'number' && value > -1) { + state.hoverOption = state.options[value] || {} + } else if (value === -9) { + state.hoverOption = {} + } + + state.options.forEach((option) => { + option.hover = state.hoverOption === option + }) +} + +export const mounted = ({ api, parent, state, props, refs }) => () => { + const parentEl = parent.$el + const inputEl = parentEl.querySelector('input.tiny-input__inner') || parentEl.querySelector('input.tiny-mobile-input__inner') + const inputClientRect = inputEl?.getBoundingClientRect() + + if (inputEl === document.activeElement) { + document.activeElement?.blur() + } + + state.completed = true + + const sizeMap = { mini: 28, small: 32, medium: 36 } + + if (props.multiple && Array.isArray(props.modelValue) && props.modelValue.length > 0) { + state.currentPlaceholder = '' + } + + if (inputClientRect) { + state.initialInputHeight = inputClientRect.height || sizeMap[state.selectSize] + + addResizeListener(parentEl, api.handleResize) + + if (refs.tags) { + addResizeListener(refs.tags, api.resetInputHeight) + } + + if (props.remote && props.multiple) { + api.resetInputHeight() + } + + state.inputWidth = inputClientRect.width + } + + api.setSelected() + + if (props.dataset) { + api.watchPropsOption() + } +} + +export const unMount = ({ api, parent, refs, state }) => () => { + if (parent.$el && api.handleResize) { + removeResizeListener(parent.$el, api.handleResize) + } + + if (refs.tags) { + removeResizeListener(refs.tags, api.resetInputHeight) + } + + state.popperElm = null + + state.optimizeStore.flag && optmzApis.removeScrollListener({ api, refs, state }) +} + +export const computeOptimizeOpts = ({ props, state }) => () => { + const { optimization } = props + const baseOpts = { gt: 20, rSize: 10, optionHeight: 30, limit: 20 } + + let optOpts + + if (optimization) { + if (typeof optimization === 'boolean') { + optOpts = extend(true, {}, baseOpts) + } else { + optOpts = extend(true, {}, baseOpts, optimization) + } + + optOpts.virtualScroll = optOpts.gt > 0 && optOpts.gt <= state.datas.length + + return optOpts + } +} + +export const watchOptimizeOpts = ({ api, props, refs, state }) => () => { + const { optimizeOpts, optimizeStore } = state + + if (optimizeOpts) { + const { virtualScroll, optionHeight } = optimizeOpts + + optimizeStore.flag = virtualScroll + + if (virtualScroll) { + optimizeStore.viewStyle = optmzApis.getViewStyle({ props, state }) + optimizeStore.valueIndex = optmzApis.getValueIndex(props) + optmzApis.process({ props, state }) + + optmzApis.createMacro(() => { + const itemFn = (i) => optionHeight * (optimizeStore.startIndex + i) + + optmzApis.addScrollListener({ api, refs, state }) + optmzApis.updateItems({ refs, state, itemFn }) + }) + } + } +} + +export const getScrollListener = ({ props, refs, state }) => { + const listener = () => { + const { options } = props + const { optimizeOpts } = state + const { optionHeight } = optimizeOpts + const viewHeight = optionHeight * options.length + const { clientHeight, scrollTop } = optmzApis.queryWrap(refs) + const maxScrollTop = viewHeight - clientHeight + const start = Math.floor(scrollTop / optionHeight) + + if (scrollTop <= maxScrollTop) { + optmzApis.process({ props, start, state }) + + optmzApis.createMacro(() => { + const itemFn = (i) => scrollTop + optionHeight * i - (scrollTop % optionHeight) + + optmzApis.updateItems({ refs, state, itemFn }) + }) + } + } + + const { optimization } = props + const delay = optmzApis.natural((optimization && typeof optimization === 'object' ? optimization.delay : null) || 10) + + return debounce(delay, listener) +} + +export const computeCollapseTags = (props) => () => props.collapseTags + +export const computeMultipleLimit = ({ props, state }) => () => { + const { multipleLimit, multiple } = props + const { optimizeOpts, optimizeStore } = state + + return optmzApis.natural(multiple && optimizeStore.flag ? multipleLimit || optimizeOpts.limit : multipleLimit) +} diff --git a/packages/renderless/src/select/vue.ts b/packages/renderless/src/select/vue.ts new file mode 100644 index 000000000..b1830a02f --- /dev/null +++ b/packages/renderless/src/select/vue.ts @@ -0,0 +1,427 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { + debouncRquest, + nodeCollapse, + nodeExpand, + getChildValue, + nodeCheckClick, + treeNodeClick, + getTreeData, + radioChange, + getcheckedData, + selectChange, + calcOverFlow, + toggleCheckAll, + handleCopyClick, + showTip, + handleComposition, + handleQueryChange, + scrollToOption, + handleMenuEnter, + emitChange, + getOption, + setSelected, + handleFocus, + focus, + blur, + handleBlur, + handleClearClick, + doDestroy, + handleClose, + toggleLastOptionHitState, + deletePrevTag, + managePlaceholder, + resetInputState, + resetInputHeight, + resetHoverIndex, + handleOptionSelect, + setSoftFocus, + getValueIndex, + toggleMenu, + selectOption, + deleteSelected, + deleteTag, + onInputChange, + onOptionDestroy, + resetInputWidth, + handleResize, + checkDefaultFirstOption, + getValueKey, + emptyText, + watchValue, + watchVisible, + watchOptions, + navigateOptions, + getPluginOption, + watchPropsOption, + buildSelectConfig, + buildRadioConfig, + onMouseenterNative, + onMouseleaveNative, + onCopying, + gridOnQueryChange, + defaultOnQueryChange, + toVisible, + toHide, + mounted, + unMount, + watchHoverIndex, + computeOptimizeOpts, + watchOptimizeOpts, + getScrollListener, + computeCollapseTags, + computeMultipleLimit, + resetFilter +} from './index' +import { BROWSER_NAME } from '@opentiny/vue-renderless/common' +import browserInfo from '@opentiny/vue-renderless/common/browser' +import debounce from '@opentiny/vue-renderless/common/deps/debounce' +import { isNumber, isNull } from '@opentiny/vue-renderless/common/type' + +export const api = [ + 'state', + 'nodeCollapse', + 'nodeExpand', + 'toggleCheckAll', + 'handleCopyClick', + 'focus', + 'blur', + 'showTip', + 'doDestroy', + 'getOption', + 'emitChange', + 'handleBlur', + 'toggleMenu', + 'getValueKey', + 'handleFocus', + 'handleClose', + 'setSoftFocus', + 'getValueIndex', + 'scrollToOption', + 'resetHoverIndex', + 'onOptionDestroy', + 'resetInputWidth', + 'resetInputHeight', + 'managePlaceholder', + 'checkDefaultFirstOption', + 'toggleLastOptionHitState', + 'deleteTag', + 'setSelected', + 'selectOption', + 'handleResize', + 'deletePrevTag', + 'onInputChange', + 'deleteSelected', + 'handleMenuEnter', + 'resetInputState', + 'handleClearClick', + 'handleComposition', + 'handleQueryChange', + 'handleOptionSelect', + 'debouncedOnInputChange', + 'debouncedQueryChange', + 'navigateOptions', + 'selectChange', + 'radioChange', + 'treeNodeClick', + 'nodeCheckClick', + 'buildSelectConfig', + 'buildRadioConfig', + 'onMouseenterNative', + 'onMouseleaveNative', + 'onCopying', + 'resetFilter' +] + +const initStateAdd = ({ computed, props, api, parent, emitter }) => ({ + selectedTags: [], + tips: '', + showTip: false, + tipHover: false, + selectHover: false, + tipTimer: null, + selectCls: 'checked-sur', + overflow: null, + completed: false, + inputWidth: 0, + hoverIndex: -1, + hoverOption: -1, + inputLength: 20, + optionsCount: 0, + selectFiexd: {}, + isSilentBlur: false, + cachedOptions: [], + selectedLabel: '', + previousQuery: null, + inputHovering: false, + createdLabel: null, + createdSelected: false, + isOnComposition: false, + cachedPlaceHolder: props.placeholder, + initialInputHeight: 0, + currentPlaceholder: props.placeholder, + filteredOptionsCount: 0, + gridData: [], + treeData: [], + remoteData: [], + currentKey: props.modelValue, + updateId: '', + popperElm: null, + selectEmitter: emitter(), + debounce: computed(() => (isNumber(props.queryDebounce) ? props.queryDebounce : props.remote ? 300 : 0)), + emptyText: computed(() => api.emptyText()), + formItemSize: computed(() => (parent.formItem || {}).formItemSize), + selectDisabled: computed(() => props.disabled || (parent.form || {}).disabled), + gridCheckedData: computed(() => api.getcheckedData()), + isExpandAll: computed(() => (props.treeOp && props.treeOp.defaultExpandAll !== undefined ? props.treeOp.defaultExpandAll : true)), + searchSingleCopy: computed(() => props.allowCopy && !props.multiple && props.filterable), + filterOrSearch: computed(() => props.filterable || props.searchable) +}) + +const initState = ({ reactive, computed, props, api, emitter, parent, constants }) => { + const stateAdd = initStateAdd({ computed, props, api, parent, emitter }) + const state = reactive({ + ...stateAdd, + datas: [], + query: '', + options: [], + visible: false, + showCopy: computed(() => props.multiple && props.copyable && state.inputHovering && state.selected.length), + showWarper: true, // 显示下拉外层控制 + selected: props.multiple ? [] : {}, + softFocus: false, + hover: false, + firstAutoSeach: props.remoteConfig.autoSeach, + tagsStyle: computed(() => ({ 'max-width': state.inputWidth - 32 + 'px', width: '100%' })), + + readonly: computed( + () => + props.readonly || + !props.filterable || + props.searchable || + props.multiple || + (browserInfo.name !== BROWSER_NAME.IE && browserInfo.name !== BROWSER_NAME.Edge && !state.visible) + ), + iconClass: computed(() => (state.visible ? '' : constants.CLASS.IsReverse)), + showClose: computed( + () => + props.clearable && + !state.selectDisabled && + state.inputHovering && + (props.multiple ? Array.isArray(props.modelValue) && props.modelValue.length > 0 : !isNull(props.modelValue) && props.modelValue !== '') + ), + optionsAllDisabled: computed(() => state.options.filter((option) => option.visible).every((option) => option.disabled)), + collapseTagSize: computed(() => (~['small', 'mini'].indexOf(state.selectSize) ? 'mini' : 'small')), + showNewOption: computed( + () => + props.filterable && + props.allowCreate && + state.query !== '' && + !state.options.filter((option) => !option.created).some((option) => option.state.currentLabel === state.query) + ), + selectSize: computed(() => props.size || state.formItemSize), + optimizeOpts: computed(() => api.computeOptimizeOpts()), + optimizeStore: { flag: false, valueIndex: 0, startIndex: 0, viewStyle: '', datas: [] }, + collapseTags: computed(() => api.computeCollapseTags()), + multipleLimit: computed(() => api.computeMultipleLimit()) + }) + + return state +} + +const addApi = ({ api, props, state, refs, emit, constants, parent, nextTick, dispatch, vm }) => { + Object.assign(api, { + resetInputHeight: resetInputHeight({ api, constants, nextTick, props, refs, state }), + calcOverFlow: calcOverFlow({ refs, props, state }), + handleFocus: handleFocus({ api, emit, props, state }), + deleteTag: deleteTag({ api, constants, emit, props, vm, state }), + watchValue: watchValue({ api, constants, dispatch, props, refs, state }), + toHide: toHide({ constants, state, props, vm, api }), + toVisible: toVisible({ constants, state, props, vm, api, nextTick }), + setSelected: setSelected({ api, constants, nextTick, props, refs, state }), + selectOption: selectOption({ api, state, props }), + handleResize: handleResize({ api, props }), + watchOptions: watchOptions({ api, constants, nextTick, parent, props, state }), + watchVisible: watchVisible({ api, constants, emit, state, refs }), + deletePrevTag: deletePrevTag({ api, constants, emit, props, state, vm }), + onInputChange: onInputChange({ api, props, state, constants, nextTick }), + deleteSelected: deleteSelected({ api, constants, emit, props, vm, state }), + handleMenuEnter: handleMenuEnter({ api, nextTick, state }), + resetInputState: resetInputState({ api, refs, state }), + navigateOptions: navigateOptions({ api, nextTick, state }), + handleClearClick: handleClearClick(api), + handleComposition: handleComposition({ api, nextTick, state }), + handleQueryChange: handleQueryChange({ api, constants, nextTick, props, vm, state }), + handleOptionSelect: handleOptionSelect({ api, emit, nextTick, props, refs, state }), + getPluginOption: getPluginOption({ api, props, state }), + toggleCheckAll: toggleCheckAll({ api, emit, state }), + debouncedQueryChange: debounce(state.debounce, (event) => { + api.handleQueryChange(event.target.value) + }), + debouncedOnInputChange: debounce(state.debounce, () => { + api.onInputChange() + }), + debouncRquest: debouncRquest({ api, state, props }), + defaultOnQueryChange: defaultOnQueryChange({ props, state, constants, api }), + mounted: mounted({ api, parent, state, props, refs }), + unMount: unMount({ api, parent, refs, state }), + watchOptimizeOpts: watchOptimizeOpts({ api, props, refs, state }), + resetFilter: resetFilter({ state, api }) + }) +} + +const initApi = ({ api, props, state, refs, emit, maskState, constants, parent, nextTick, dispatch, t, vm }) => { + Object.assign(api, { + state, + maskState, + doDestroy: doDestroy(refs), + getTreeData: getTreeData(props), + blur: blur({ refs, state }), + focus: focus({ refs, state }), + getValueKey: getValueKey(props), + handleClose: handleClose(state), + getValueIndex: getValueIndex(props), + getChildValue: getChildValue(), + getOption: getOption({ props, state }), + emitChange: emitChange({ emit, props, state, constants }), + toggleMenu: toggleMenu({ refs, state, props }), + showTip: showTip({ props, state, refs }), + onOptionDestroy: onOptionDestroy(state), + setSoftFocus: setSoftFocus({ refs, state }), + getcheckedData: getcheckedData({ props, state }), + resetInputWidth: resetInputWidth({ refs, state }), + resetHoverIndex: resetHoverIndex({ props, state }), + scrollToOption: scrollToOption({ refs, constants }), + selectChange: selectChange({ emit, props, refs, state }), + radioChange: radioChange({ emit, props, state }), + handleCopyClick: handleCopyClick({ parent, props, state }), + treeNodeClick: treeNodeClick({ emit, props, state }), + managePlaceholder: managePlaceholder({ refs, state }), + nodeCheckClick: nodeCheckClick({ emit, props, state }), + checkDefaultFirstOption: checkDefaultFirstOption(state), + nodeExpand: nodeExpand({ state, constants, nextTick }), + nodeCollapse: nodeCollapse({ state, constants, nextTick }), + handleBlur: handleBlur({ constants, dispatch, emit, state }), + toggleLastOptionHitState: toggleLastOptionHitState({ state }), + emptyText: emptyText({ I18N: constants.I18N, props, state, t }), + watchPropsOption: watchPropsOption({ constants, parent, props, state }), + buildSelectConfig: buildSelectConfig({ props, state }), + buildRadioConfig: buildRadioConfig({ props, state }), + onMouseenterNative: onMouseenterNative({ state }), + onMouseleaveNative: onMouseleaveNative({ state }), + onCopying: onCopying({ state, refs }), + gridOnQueryChange: gridOnQueryChange({ props, refs, constants, state }), + watchHoverIndex: watchHoverIndex({ state }), + computeOptimizeOpts: computeOptimizeOpts({ props, state }), + getScrollListener: getScrollListener({ props, refs, state }), + computeCollapseTags: computeCollapseTags(props), + computeMultipleLimit: computeMultipleLimit({ props, state }) + }) + + addApi({ api, props, state, refs, emit, constants, parent, nextTick, dispatch, vm }) +} + +const addWatch = ({ watch, props, api, state }) => { + watch(() => [...state.options], api.watchOptions) + + watch(() => state.gridData, api.setSelected, { immediate: true }) + + watch(() => state.treeData, api.setSelected, { immediate: true }) + + watch(() => state.hoverIndex, api.watchHoverIndex) + + props.options && watch(() => props.options, api.watchPropsOption, { immediate: true, deep: true }) + + watch(() => state.optimizeOpts, api.watchOptimizeOpts) +} + +const initWatch = ({ watch, props, api, state, nextTick, refs }) => { + props.treeOp.data && + watch( + () => props.treeOp.data, + (data) => { + state.treeData = data + }, + { immediate: true, deep: true } + ) + + props.gridOp.data && + watch( + () => props.gridOp.data, + (data) => { + state.gridData = data + }, + { immediate: true, deep: true } + ) + + watch( + () => state.selectDisabled, + () => nextTick(api.resetInputHeight) + ) + + watch( + () => props.placeholder, + (value) => { + state.cachedPlaceHolder = state.currentPlaceholder = value + } + ) + + watch(() => props.modelValue, api.watchValue) + + watch( + () => state.visible, + (value) => { + if ((state.filterOrSearch || props.remote) && !value) { + refs.reference?.blur() + } + + api.watchVisible(value) + } + ) + + addWatch({ watch, props, api, state }) +} + +export const renderless = ( + props, + { computed, onBeforeUnmount, onMounted, reactive, watch, provide }, + { vm, refs, parent, emit, constants, nextTick, dispatch, t, emitter } +) => { + const api = {} + const state = initState({ reactive, computed, props, api, emitter, parent, constants }) + + provide('selectEmitter', state.selectEmitter) + provide('selectVm', vm) + + const maskState = reactive({ width: '', height: '', top: '' }) + + initApi({ api, props, state, refs, emit, maskState, constants, parent, nextTick, dispatch, t, vm }) + initWatch({ watch, props, api, state, nextTick, refs }) + + onMounted(api.mounted) + onBeforeUnmount(api.unMount) + + if (props.multiple && !Array.isArray(props.modelValue)) { + emit('update:modelValue', []) + } + + if (!props.multiple && Array.isArray(props.modelValue)) { + emit('update:modelValue', '') + } + + state.selectEmitter.on(constants.EVENT_NAME.handleOptionClick, api.handleOptionSelect) + state.selectEmitter.on(constants.EVENT_NAME.setSelected, api.setSelected) + + return api +} diff --git a/packages/renderless/src/slide-bar/index.ts b/packages/renderless/src/slide-bar/index.ts new file mode 100644 index 000000000..d94d77580 --- /dev/null +++ b/packages/renderless/src/slide-bar/index.ts @@ -0,0 +1,83 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { emitEvent } from '@opentiny/vue-renderless/common/event' + +export const leftClick = ({ api, props, refs, state }) => () => { + if (state.leftLength >= 0) { + return + } + + state.leftLength = state.leftLength + (state.blockWidth + state.blockMargin) * props.wheelBlocks + refs.insider.style.left = state.leftLength + 'px' + + api.changeState() +} + +export const rightClick = ({ api, props, refs, state }) => () => { + if (state.blockWrapper < Math.abs(state.leftLength) + state.wrapperWidth) { + return + } + + state.leftLength = state.leftLength - (state.blockWidth + state.blockMargin) * props.wheelBlocks + refs.insider.style.left = state.leftLength + 'px' + + api.changeState() +} + +export const blockClick = ({ emit, state }) => ({ item, index }) => { + if (!emitEvent(emit, 'before-click')) { + return + } + + state.currentIndex = index + + emit('click', item, index) +} + +export const changeState = ({ state }) => () => { + const contentWidth = state.blockWrapper + + state.showLeft = !(parseInt(state.leftLength, 10) >= 0) + state.showRight = contentWidth <= Math.abs(state.leftLength) + state.wrapperWidth +} + +export const mouseEvent = ({ api, state }) => (e) => { + if (e.wheelDelta >= 0) { + if (state.leftLength < 0) { + api.leftClick() + } + } else { + if (state.blockWrapper > Math.abs(state.leftLength) + state.wrapperWidth) { + api.rightClick() + } + } +} + +export const changeSize = ({ props, state, refs }) => () => { + state.wrapperWidth = refs.wrapper.offsetWidth + state.blockWidth = parseInt(((1 - (props.initBlocks - 1) * 0.02) / props.initBlocks) * state.wrapperWidth, 10) + state.blockMargin = parseInt(state.wrapperWidth * 0.02, 10) + state.blockWrapper = props.modelValue.length * state.blockWidth + (props.modelValue.length - 1) * state.blockMargin +} + +export const swipeleft = ({ api, state }) => () => { + if (state.blockWrapper > Math.abs(state.leftLength) + state.wrapperWidth) { + api.rightClick() + } +} + +export const swiperight = ({ api, state }) => () => { + if (state.leftLength < 0) { + api.leftClick() + } +} diff --git a/packages/renderless/src/slide-bar/vue.ts b/packages/renderless/src/slide-bar/vue.ts new file mode 100644 index 000000000..3d1a7402a --- /dev/null +++ b/packages/renderless/src/slide-bar/vue.ts @@ -0,0 +1,44 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { leftClick, rightClick, blockClick, changeState, changeSize, mouseEvent } from './index' + +export const api = ['state', 'mouseEvent', 'rightClick', 'leftClick', 'blockClick'] + +export const renderless = (props, { onMounted, reactive }, { refs, parent, emit }) => { + const api = {} + const state = reactive({ + leftLength: 0, + blockWidth: 0, + blockMargin: 0, + showLeft: false, + showRight: false, + blockWrapper: 0, + wrapperWidth: 0, + currentIndex: -1, + offsetWidth: 0 + }) + + Object.assign(api, { + state, + blockClick: blockClick({ emit, state }), + changeState: changeState({ props, state }), + changeSize: changeSize({ props, refs, state }), + leftClick: leftClick({ api, props, refs, state }), + mouseEvent: mouseEvent({ api, props, refs, state }), + rightClick: rightClick({ api, parent, props, refs, state }) + }) + + onMounted(api.changeSize) + + return api +} diff --git a/packages/renderless/src/slider/index.ts b/packages/renderless/src/slider/index.ts new file mode 100644 index 000000000..8cb9b405d --- /dev/null +++ b/packages/renderless/src/slider/index.ts @@ -0,0 +1,388 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { KEY_CODE } from '@opentiny/vue-renderless/common' +import { emitEvent } from '@opentiny/vue-renderless/common/event' +import { on, off, hasClass } from '@opentiny/vue-renderless/common/deps/dom' +import { toNumber } from '@opentiny/vue-renderless/common/string' + +export const bindEvent = (api) => () => { + on(window, 'resize', api.bindResize) + api.bindResize() +} + +export const unBindEvent = (api) => () => off(window, 'resize', api.bindResize) + +export const bindResize = ({ parent, props, state }) => () => { + const handleEl = parent.$el.firstElementChild + + state.sliderSize = handleEl['client' + (props.vertical ? 'Height' : 'Width')] + state.sliderOffset = handleEl.getBoundingClientRect() +} + +export const bindKeyDown = ({ api, props, state }) => (event) => { + if (state.disabled || state.activeIndex < 0) { + return + } + + let currentValue = 0 + + switch (event.keyCode) { + case KEY_CODE.Home: + currentValue = props.min + break + case KEY_CODE.End: + currentValue = props.max + break + case KEY_CODE.PageUp: + currentValue = state.activeValue + Math.ceil(state.rangeDiff / props.numPages) + break + case KEY_CODE.PageDown: + currentValue = state.activeValue - Math.ceil(state.rangeDiff / props.numPages) + break + case KEY_CODE.ArrowUp: + case KEY_CODE.ArrowRight: + currentValue = state.activeValue + props.step + break + case KEY_CODE.ArrowDown: + case KEY_CODE.ArrowLeft: + currentValue = state.activeValue - props.step + break + default: + currentValue = state.activeValue + break + } + + api.setActiveButtonValue(currentValue) + api.setButtonStyle() + api.setBarStyle() +} + +export const bindMouseDown = ({ api, constants, mode, emit, state }) => (event) => { + if (event.button !== 0 && event.detail !== 0) { + state.activeIndex = -1 + return + } + + if (!emitEvent(emit, 'start', api.getActiveButtonValue())) { + state.activeIndex = -1 + return + } + + const handleEl = event.target + const isClickBar = hasClass(handleEl, constants.sliderCls(mode)) || hasClass(handleEl, constants.rangeCls(mode)) + const isClickBtn = + hasClass(handleEl, constants.buttonCls(mode)) || hasClass(handleEl, constants.leftSvgCls(mode)) || hasClass(handleEl, constants.rightSvgCls(mode)) + if (state.disabled || (!isClickBtn && !isClickBar)) { + state.activeIndex = -1 + return + } + + on(window, 'mouseup', api.bindMouseUp) + on(window, 'mousemove', api.bindMouseMove) + on(window, 'touchend', api.bindMouseUp) + on(window, 'touchmove', api.bindMouseMove) + + state.isDrag = isClickBtn + isClickBtn && (state.activeIndex = api.getActiveButtonIndex(event)) + + if (isClickBar) { + const currentValue = api.calculateValue(event) + if (state.isDouble) { + if (Math.abs(currentValue - state.leftBtnValue) > Math.abs(state.rightBtnValue - currentValue)) { + api.changeActiveValue(state.rightBtnValue < state.leftBtnValue) + } else { + api.changeActiveValue(state.rightBtnValue > state.leftBtnValue) + } + } + api.setActiveButtonValue(currentValue) + api.setButtonStyle() + api.setBarStyle() + + emit('stop', api.getActiveButtonValue()) + } +} + +export const bindMouseMove = ({ api, nextTick, state }) => (event) => { + if (state.disabled || !state.isDrag) { + return + } + + api.setActiveButtonValue(api.calculateValue(event)) + api.setButtonStyle() + api.setBarStyle() + + nextTick(() => { + api.setTipStyle() + }) +} + +export const bindMouseUp = ({ api, emit, state }) => () => { + if (state.disabled || !state.isDrag) { + return + } + + state.showTip = false + state.isDrag = false + + off(window, 'mouseup', api.bindMouseUp) + off(window, 'mousemove', api.bindMouseMove) + off(window, 'touchend', api.bindMouseUp) + off(window, 'touchmove', api.bindMouseMove) + + emit('stop', api.getActiveButtonValue()) +} + +export const displayTip = ({ api, nextTick, state }) => (event) => { + if (!state.showTip) { + state.showTip = true + api.changeActiveValue(api.getActiveButtonIndex(event) === 0) + + nextTick(() => { + api.setTipStyle() + }) + } +} + +export const hideTip = (state) => () => !state.isDrag && (state.showTip = false) + +export const setTipStyle = ({ constants, mode, parent, props, state }) => () => { + if (!props.showTip) { + return + } + + const tipStyle = { top: 0, left: 0 } + const tipEl = parent.$el.querySelector('.' + constants.tipCls(mode)) + const moveSize = ((state.activeValue - props.min) / state.rangeDiff) * state.sliderSize + + if (props.vertical) { + tipStyle.top = state.sliderSize - moveSize - constants.BUTTON_SIZE - constants.TIP_HEIGHT / 2 + constants.HALF_BAR_HEIGHT + tipStyle.left = -tipEl.clientWidth / 2 + constants.HALF_BAR_HEIGHT + } else { + tipStyle.top = -constants.TIP_HEIGHT - constants.BUTTON_SIZE / 2 + constants.HALF_BAR_HEIGHT + tipStyle.left = moveSize - constants.HALF_BAR_HEIGHT - tipEl.clientWidth / 2 + } + + state.tipStyle = { + top: tipStyle.top + 'px', + left: tipStyle.left + 'px' + } +} + +const getActiveButtonIndexFlag = ({ state, event, constants, mode }) => { + const cls = constants.buttonCls(mode) + const { previousElementSibling } = event.target + + return state.isDouble && (hasClass(previousElementSibling, cls) || event.target.className.baseVal === 'tiny-slider-right-svg') +} + +export const getActiveButtonIndex = ({ constants, mode, state }) => (event) => { + const flag = getActiveButtonIndexFlag({ state, event, constants, mode }) + return flag ? 1 : 0 +} + +const calcCurrentValue = ({ currentValue, props, state }) => { + if (currentValue <= props.min) { + currentValue = props.min + } else if (currentValue >= props.max) { + currentValue = props.max + } else { + const step = props.step > 0 ? props.step : 1 + const stepValue = (currentValue - props.min) % step + + // step为小数时,由于精度问题会有误差。此处避免误差引起循环 + if (stepValue > props.step / 10) { + currentValue -= stepValue + currentValue += stepValue * 2 > step ? Number(step) : 0 + } + + if (state.isDouble) { + if (state.activeIndex === 0 && currentValue >= state.rightBtnValue) { + currentValue = state.rightBtnValue + } else if (state.activeIndex === 1 && currentValue <= state.leftBtnValue) { + currentValue = state.leftBtnValue + } + } + } + + return currentValue +} + +export const setActiveButtonValue = ({ api, emit, props, state }) => (value) => { + let currentValue = value + currentValue = calcCurrentValue({ currentValue, props, state }) + if (!state.isDouble) { + state.leftBtnValue = currentValue + } else { + if (state.activeIndex === 0) { + state.leftBtnValue = currentValue + } else { + state.rightBtnValue = currentValue + } + } + + state.activeValue = currentValue + state.innerTrigger = true // 防止触发 watch + + emit('update:modelValue', api.getActiveButtonValue()) // 添加了一个emit触发input事件,实现双向绑定 +} + +export const setButtonStyle = ({ props, state }) => () => { + const percent = ((state.activeValue - props.min) / state.rangeDiff) * 100 + const style = (props.vertical ? 'bottom' : 'left') + ':' + percent + '%' + + if (!state.isDouble || state.activeIndex === 0) { + state.leftBtnPercent = percent + state.leftBtnStyle = style + } else { + state.rightBtnPercent = percent + state.rightBtnStyle = style + } +} + +export const setBarStyle = ({ props, state }) => () => { + const minSize = Math.abs(state.leftBtnPercent - state.rightBtnPercent) + const maxSize = Math.max(state.leftBtnPercent, state.rightBtnPercent) + + if (props.vertical) { + state.barStyle = { + bottom: maxSize - minSize + '%', + height: minSize + '%' + } + } else { + state.barStyle = { + left: maxSize - minSize + '%', + width: minSize + '%' + } + } +} + +export const initSlider = ({ api, props, state }) => (value) => { + state.isDouble = Array.isArray(value) + + const sliders = state.isDouble ? value : [value] + + sliders.length > 2 && (sliders.length = 2) + sliders.forEach((item, index) => { + if (index === 0) { + state.leftBtnValue = Math.max(Number(item), props.min) + } else { + state.rightBtnValue = Math.min(Number(item), props.max) + state.rightBtnShow = true + } + + if (state.isInit) { + api.changeActiveValue(index === 0) + } + + api.setButtonStyle() + }) + state.isInit = false + api.setBarStyle() +} + +export const calculateValue = ({ props, state }) => (event) => { + let currentValue = 0 + const offset = state.sliderOffset + + if (event.type === 'touchmove' || event.type === 'touchstart' || event.type === 'touchend') { + if (props.vertical) { + currentValue = props.max - ((event.touches[0].pageY - offset.top) / state.sliderSize) * state.rangeDiff + } else { + currentValue = props.min + ((event.touches[0].pageX - offset.left) / state.sliderSize) * state.rangeDiff + } + } else { + if (props.vertical) { + currentValue = props.max - ((event.pageY - offset.top) / state.sliderSize) * state.rangeDiff + } else { + currentValue = props.min + ((event.pageX - offset.left) / state.sliderSize) * state.rangeDiff + } + } + + return currentValue +} + +export const changeActiveValue = (state) => (isLeft) => { + state.activeIndex = isLeft ? 0 : 1 + state.activeValue = isLeft ? state.leftBtnValue : state.rightBtnValue +} + +export const formatTipValue = (props) => (value) => (props.formatTooltip instanceof Function ? props.formatTooltip(value) : value) + +export const getActiveButtonValue = (state) => () => (state.isDouble ? [state.leftBtnValue, state.rightBtnValue] : state.leftBtnValue) + +export const autoSlider = (api) => (value) => { + api.setActiveButtonValue(value) + api.setButtonStyle() + api.setBarStyle() +} + +export const customBeforeAppearHook = (props) => (el) => { + if (props.vertical) { + el.style.bottom = 0 + '%' + el.style.height = 0 + '%' + } else { + el.style.left = 0 + '%' + el.style.width = 0 + '%' + } +} + +export const customAfterAppearHook = ({ state, props }) => (el) => { + const minSize = Math.abs(state.leftBtnPercent - state.rightBtnPercent) + const maxSize = Math.max(state.leftBtnPercent, state.rightBtnPercent) + + if (props.vertical) { + el.style.bottom = maxSize - minSize + '%' + el.style.height = minSize + '%' + } else { + if (state.isDouble) { + el.style.left = maxSize - minSize + '%' + el.style.width = minSize + '%' + } else { + el.style.width = minSize + '%' + } + } +} + +export const watchActiveValue = ({ api, emit, props, state }) => (newValue, oldValue) => { + const nNewValue = toNumber(newValue) || 0 + const nOldValue = toNumber(oldValue) || 0 + + if (nNewValue !== nOldValue) { + api.autoSlider(nNewValue) + + if (nNewValue <= props.max && nNewValue >= props.min) { + const value = api.getActiveButtonValue() + + if (state.lastValue && state.lastValue.toString() !== value.toString()) { + emit('change', value) + } + + state.lastValue = value + } + } else { + state.activeValue = nNewValue || 0 + } +} + +export const watchModelValue = ({ api, state }) => (value) => { + // 防止多触点下,触发双向绑定导致渲染异常 + if (!state.innerTrigger) { + api.initSlider(value) + } else { + state.innerTrigger = false + + if (!state.isDouble) { + api.initSlider(value) + } + } +} diff --git a/packages/renderless/src/slider/vue.ts b/packages/renderless/src/slider/vue.ts new file mode 100644 index 000000000..3942a2802 --- /dev/null +++ b/packages/renderless/src/slider/vue.ts @@ -0,0 +1,138 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + bindKeyDown, + bindMouseDown, + bindMouseMove, + bindMouseUp, + bindEvent, + unBindEvent, + bindResize, + setTipStyle, + getActiveButtonIndex, + setActiveButtonValue, + setBarStyle, + setButtonStyle, + initSlider, + calculateValue, + changeActiveValue, + formatTipValue, + getActiveButtonValue, + displayTip, + hideTip, + autoSlider, + customBeforeAppearHook, + customAfterAppearHook, + watchActiveValue, + watchModelValue +} from './index' + +export const api = [ + 'state', + 'bindKeyDown', + 'bindMouseDown', + 'bindMouseMove', + 'bindMouseUp', + 'bindEvent', + 'unBindEvent', + 'bindResize', + 'setTipStyle', + 'getActiveButtonIndex', + 'setActiveButtonValue', + 'setBarStyle', + 'setButtonStyle', + 'initSlider', + 'calculateValue', + 'changeActiveValue', + 'formatTipValue', + 'getActiveButtonValue', + 'displayTip', + 'hideTip', + 'autoSlider', + 'customBeforeAppearHook', + 'customAfterAppearHook' +] + +const initState = ({ reactive, computed, props, api, parent }) => { + const state = reactive({ + tipStyle: {}, + barStyle: {}, + moveStyle: [], + isInit: true, + isDrag: false, + sliderSize: 0, + showTip: false, + activeValue: 0, + activeIndex: 0, + isDouble: false, + leftBtnValue: 0, + sliderOffset: {}, + rightBtnValue: 0, + leftBtnStyle: {}, + leftBtnPercent: 0, + leftBtnShow: true, + rightBtnStyle: '', + rightBtnPercent: 0, + rightBtnShow: false, + innerTrigger: false, + rangeDiff: computed(() => props.max - props.min), + tipValue: computed(() => api.formatTipValue(state.activeValue)), + formDisabled: computed(() => (parent.tinyForm || {}).disabled), + disabled: computed(() => props.disabled || state.formDisabled) + }) + + return state +} + +export const renderless = (props, { computed, onBeforeUnmount, onMounted, reactive, watch, inject }, { parent, constants, nextTick, emit, mode }) => { + const api = {} + const state = initState({ reactive, computed, props, api, parent }) + + parent.tinyForm = parent.tinyForm || inject('form', null) + + Object.assign(api, { + state, + hideTip: hideTip(state), + formatTipValue: formatTipValue(props), + setBarStyle: setBarStyle({ props, state }), + changeActiveValue: changeActiveValue(state), + bindResize: bindResize({ parent, props, state }), + setButtonStyle: setButtonStyle({ props, state }), + calculateValue: calculateValue({ props, state }), + getActiveButtonValue: getActiveButtonValue(state), + getActiveButtonIndex: getActiveButtonIndex({ constants, mode, state }), + setTipStyle: setTipStyle({ constants, mode, emit, parent, props, state }), + customAfterAppearHook: customAfterAppearHook({ state, props }), + customBeforeAppearHook: customBeforeAppearHook(props), + bindEvent: bindEvent(api), + autoSlider: autoSlider(api), + unBindEvent: unBindEvent(api), + displayTip: displayTip({ api, nextTick, state }), + bindKeyDown: bindKeyDown({ api, props, state }), + bindMouseUp: bindMouseUp({ api, emit, state }), + bindMouseMove: bindMouseMove({ api, nextTick, state }), + bindMouseDown: bindMouseDown({ api, constants, mode, emit, state }), + setActiveButtonValue: setActiveButtonValue({ api, emit, props, state }), + initSlider: initSlider({ api, props, state }), + watchModelValue: watchModelValue({ api, state }), + watchActiveValue: watchActiveValue({ api, emit, props, state }) + }) + + watch(() => props.modelValue, api.watchModelValue, { immediate: true }) + watch(() => state.activeValue, api.watchActiveValue, { immediate: true }) + + onMounted(api.bindEvent) + onBeforeUnmount(api.unBindEvent) + + return api +} diff --git a/packages/renderless/src/split/index.ts b/packages/renderless/src/split/index.ts new file mode 100644 index 000000000..76bb07d42 --- /dev/null +++ b/packages/renderless/src/split/index.ts @@ -0,0 +1,110 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const px2percent = ({ numerator, denominator }) => parseFloat(numerator) / parseFloat(denominator) + +export const getComputedThresholdValue = ({ api, props, refs, state }) => (type) => { + const size = refs.outerWrapper[state.offsetSize] + + if (state.valueIsPx) { + return typeof props[type] === 'string' ? props[type] : size * props[type] + } else { + return typeof props[type] === 'string' ? api.px2percent({ numerator: props[type], denominator: size }) : props[type] + } +} + +export const getleftTopMin = (state) => ({ oldvalue, newvalue }) => + state.valueIsPx ? `${Math.min(parseFloat(oldvalue), parseFloat(newvalue))}px` : Math.min(oldvalue, newvalue) + +export const getrightBottomMin = (state) => ({ oldvalue, newvalue }) => + state.valueIsPx ? `${Math.max(parseFloat(oldvalue), parseFloat(newvalue))}px` : Math.max(oldvalue, newvalue) + +export const getAnotherOffset = ({ refs, state }) => (value) => (state.valueIsPx ? `${refs.outerWrapper[state.offsetSize] - parseFloat(value)}px` : 1 - value) + +export const handleMove = ({ api, emit, props, refs, state }) => (event) => { + const pageOffset = state.isHorizontal ? event.pageX : event.pageY + const offset = pageOffset - state.initOffset + const outerWidth = refs.outerWrapper[state.offsetSize] + + let value = state.valueIsPx + ? `${parseFloat(state.oldOffset) + offset}px` + : api.px2percent({ numerator: outerWidth * state.oldOffset + offset, denominator: outerWidth }) + + const anotherValue = api.getAnotherOffset(value) + + if (parseFloat(value) <= parseFloat(state.computedleftTopMin)) { + value = api.getrightBottomMin({ + oldvalue: value, + newvalue: state.computedleftTopMin + }) + } + + if (parseFloat(anotherValue) <= parseFloat(state.computedrightBottomMin)) { + value = api.getAnotherOffset( + api.getrightBottomMin({ + oldvalue: anotherValue, + newvalue: state.computedrightBottomMin + }) + ) + } + + event.atMin = props.modelValue === state.computedleftTopMin + event.atMax = state.valueIsPx + ? api.getAnotherOffset(props.modelValue) === state.computedrightBottomMin + : api.getAnotherOffset(props.modelValue).toFixed(5) === state.computedrightBottomMin.toFixed(5) + + emit('update:modelValue', value) + emit('moving', event) +} + +export const handleUp = ({ api, emit, off, state }) => () => { + state.isMoving = false + + off(document, 'mousemove', api.handleMove) + off(document, 'mouseup', api.handleUp) + + emit('moveend') +} + +export const handleMousedown = ({ api, emit, on, props, state }) => (event) => { + if (state.collapsed) return + + state.initOffset = state.isHorizontal ? event.pageX : event.pageY + state.oldOffset = props.modelValue + state.isMoving = true + + on(document, 'mousemove', api.handleMove) + on(document, 'mouseup', api.handleUp) + + emit('movestart') +} + +export const computeOffset = ({ api, nextTick, props, refs, state }) => () => { + if (state.valueIsPx) { + nextTick(() => { + state.offset = + (api.px2percent({ + numerator: props.modelValue, + denominator: refs.outerWrapper && refs.outerWrapper[state.offsetSize] + }) * + 10000) / + 100 + }) + } else { + state.offset = (props.modelValue * 10000) / 100 + } +} + +export const handleCollapse = ({ emit, state }) => () => { + state.collapsed = !state.collapsed + emit('collapsedChange', state.collapsed) +} diff --git a/packages/renderless/src/split/vue.ts b/packages/renderless/src/split/vue.ts new file mode 100644 index 000000000..5ad1159f9 --- /dev/null +++ b/packages/renderless/src/split/vue.ts @@ -0,0 +1,98 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + px2percent, + getComputedThresholdValue, + getleftTopMin, + getrightBottomMin, + getAnotherOffset, + handleMove, + handleUp, + handleMousedown, + computeOffset, + handleCollapse +} from './index' +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' + +export const api = ['state', 'handleMousedown', 'handleCollapse'] + +export const useOffset = ({ nextTick, props, refs, constants, hooks }) => { + const api = {} + const { computed, onMounted, onUnmounted, reactive, toRefs, watch } = hooks + const state = reactive({ + offset: 0, + anotherOffset: computed(() => 100 - state.offset), + valueIsPx: computed(() => typeof props.modelValue === 'string'), + isHorizontal: computed(() => props.mode === constants.HORIZONTAL), + offsetSize: computed(() => (state.isHorizontal ? 'offsetWidth' : 'offsetHeight')) + }) + + Object.assign(api, { + px2percent, + computeOffset: computeOffset({ api, nextTick, props, refs, state }) + }) + + watch(() => props.modelValue, api.computeOffset, { immediate: true }) + + onMounted(() => { + on(window, 'resize', api.computeOffset) + }) + + onUnmounted(() => { + off(window, 'resize', api.computeOffset) + }) + + return { + api, + state: toRefs(state) + } +} + +export const renderless = (props, hooks, { refs, nextTick, emit, constants }) => { + const api = {} + const { computed, reactive } = hooks + const getUseOffset = useOffset({ nextTick, props, refs, constants, hooks }) + + const state = reactive({ + oldOffset: 0, + initOffset: 0, + isMoving: false, + prefix: constants.PREFIX, + computedleftTopMin: computed(() => api.getComputedThresholdValue('leftTopMin')), + computedrightBottomMin: computed(() => api.getComputedThresholdValue('rightBottomMin')), + wrapperClasses: computed(() => [state.prefix, `${state.prefix}-wrapper`, state.isMoving ? 'no-select' : '']), + paneClasses: computed(() => [`${state.prefix}-pane`, { [`${state.prefix}-pane-moving`]: state.isMoving }]), + collapsed: false, + ...getUseOffset.state + }) + + Object.assign(api, { + state, + getleftTopMin: getleftTopMin(state), + getrightBottomMin: getrightBottomMin(state), + ...getUseOffset.api, + handleUp: handleUp({ api, emit, off, state }), + getAnotherOffset: getAnotherOffset({ refs, state }), + handleMove: handleMove({ api, emit, props, refs, state }), + handleMousedown: handleMousedown({ api, emit, on, props, state }), + handleCollapse: handleCollapse({ emit, state }), + getComputedThresholdValue: getComputedThresholdValue({ + api, + props, + refs, + state + }) + }) + + return api +} diff --git a/packages/renderless/src/steps/vue.ts b/packages/renderless/src/steps/vue.ts new file mode 100644 index 000000000..f168cc292 --- /dev/null +++ b/packages/renderless/src/steps/vue.ts @@ -0,0 +1,17 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const api = [] + +export const renderless = function () { + return {} +} diff --git a/packages/renderless/src/switch/index.ts b/packages/renderless/src/switch/index.ts new file mode 100644 index 000000000..cc7d4c7db --- /dev/null +++ b/packages/renderless/src/switch/index.ts @@ -0,0 +1,55 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { isNull } from '@opentiny/vue-renderless/common/type' + +export const toggle = ({ emit, props, state }) => (event) => { + event.preventDefault() + + if (state.disabled) { + return false + } + + const change = () => { + state.currentValue = state.currentValue === props.trueValue ? props.falseValue : props.trueValue + + emit('update:modelValue', state.currentValue) + emit('change', state.currentValue) + } + + props.beforeChange ? props.beforeChange(change) : change() +} + +export const computedWarpClasses = ({ prefixCls, props, state }) => () => [ + `${prefixCls}`, + { + [`${prefixCls}-checked`]: state.currentValue === props.trueValue, + [`${prefixCls}-disabled`]: state.disabled, + mini: props.mini, + disabled: state.disabled + } +] + +export const computedInnerClasses = ({ prefixCls }) => () => `${prefixCls}-inner` + +export const computedStyle = ({ props, state }) => () => { + let size = '' + + if (!isNull(props.modelValue)) { + size = typeof props.modelValue === 'number' ? `${props.modelValue}px` : props.modelValue + } + + return { + fontSize: size, + backgroundColor: props.trueValue === state.currentValue ? props.activeColor : props.inactiveColor + } +} diff --git a/packages/renderless/src/switch/vue.ts b/packages/renderless/src/switch/vue.ts new file mode 100644 index 000000000..f3dabb48a --- /dev/null +++ b/packages/renderless/src/switch/vue.ts @@ -0,0 +1,51 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { toggle, computedWarpClasses, computedInnerClasses, computedStyle } from './index' + +export const api = ['toggle', 'state'] + +export const renderless = (props, { computed, watch, reactive, inject }, { parent, constants, mode, emit }) => { + const prefixCls = constants.prefixcls(mode) + + parent.tinyForm = parent.tinyForm || inject('form', null) + + const api = { + computedInnerClasses: computedInnerClasses({ prefixCls }) + } + + const state = reactive({ + currentValue: props.modelValue, + innerClasses: computed(() => api.computedInnerClasses()), + wrapClasses: computed(() => api.computedWarpClasses()), + style: computed(() => api.computedStyle()), + formDisabled: computed(() => (parent.tinyForm || {}).disabled), + disabled: computed(() => props.disabled || state.formDisabled) + }) + + Object.assign(api, { + state, + computedStyle: computedStyle({ props, state }), + computedWarpClasses: computedWarpClasses({ prefixCls, props, state }), + toggle: toggle({ emit, props, state }) + }) + + watch( + () => props.modelValue, + (value) => { + state.currentValue = (typeof props.falseValue !== 'boolean' || typeof props.trueValue !== 'boolean') ? value : Boolean(value) + }, + { immediate: true } + ) + + return api +} diff --git a/packages/renderless/src/tab-bar/index.ts b/packages/renderless/src/tab-bar/index.ts new file mode 100644 index 000000000..253dda14d --- /dev/null +++ b/packages/renderless/src/tab-bar/index.ts @@ -0,0 +1,63 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { POSITION } from '@opentiny/vue-renderless/common' +import { capitalize } from '@opentiny/vue-renderless/common/string' + +export const computedBarStyle = (parent) => (props, state) => { + const style = {} + let offset = 0 + let tabSize = 0 + const sizeName = ~[POSITION.Top, POSITION.Bottom].indexOf(state.rootTabs.position) ? 'width' : 'height' + const sizeDir = sizeName === 'width' ? 'x' : 'y' + props.tabs.every(({ state }) => { + const $el = parent.$refs[`tabs-${state.paneName}`] + if (!$el) return false + if (!state.active) { + if ($el[`client${capitalize(sizeName)}`] === 0) { + const unactive = $el.cloneNode(true) + document.body.appendChild(unactive) + const unactiveSty = window.getComputedStyle(unactive) + offset += parseFloat(unactiveSty.width) - parseFloat(unactiveSty.paddingRight) + document.body.removeChild(unactive) + } else { + offset += $el[`client${capitalize(sizeName)}`] + } + return true + } else { + const copyEl = $el.cloneNode(true) + const eleStyle = window.getComputedStyle(copyEl) + tabSize = $el[`client${capitalize(sizeName)}`] + if (tabSize === 0) { + document.body.appendChild(copyEl) + tabSize = parseFloat(eleStyle.width) - parseFloat(eleStyle.paddingLeft) - parseFloat(eleStyle.paddingRight) + document.body.removeChild(copyEl) + } else { + if (sizeName === 'width') { + document.body.appendChild(copyEl) + tabSize -= parseFloat(eleStyle.paddingRight) + document.body.removeChild(copyEl) + return false + } + } + } + + return false + }) + + const transform = `translate${capitalize(sizeDir)}(${offset}px)` + style[sizeName] = tabSize + 'px' + style.transform = transform + style.msTransform = transform + style.webkitTransform = transform + + return style +} diff --git a/packages/renderless/src/tab-bar/vue.ts b/packages/renderless/src/tab-bar/vue.ts new file mode 100644 index 000000000..57c01d108 --- /dev/null +++ b/packages/renderless/src/tab-bar/vue.ts @@ -0,0 +1,28 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { computedBarStyle } from './index' + +export const api = ['state', 'computedBarStyle'] + +export const renderless = (props, { inject, reactive }, { parent }) => { + const state = reactive({ + rootTabs: inject('rootTabs'), + barStyle: {} + }) + + const api = { + state, + computedBarStyle: computedBarStyle(parent) + } + + return api +} diff --git a/packages/renderless/src/tab-dropdown/index.ts b/packages/renderless/src/tab-dropdown/index.ts new file mode 100644 index 000000000..86018f437 --- /dev/null +++ b/packages/renderless/src/tab-dropdown/index.ts @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const handleClick = (state) => (name) => { + state.rootTabs.setCurrentName(name) + state.hide = true +} + +export const setDropdownTabs = (state) => (data) => { + state.dropdownTabs = data +} diff --git a/packages/renderless/src/tab-dropdown/vue.ts b/packages/renderless/src/tab-dropdown/vue.ts new file mode 100644 index 000000000..bf8f24c35 --- /dev/null +++ b/packages/renderless/src/tab-dropdown/vue.ts @@ -0,0 +1,31 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { handleClick, setDropdownTabs } from './index' + +export const api = ['state', 'handleClick', ' setDropdownTabs'] + +export const renderless = (props, { inject, reactive }) => { + const state = reactive({ + hide: true, + dropdownTabs: props.tabs || [], + rootTabs: inject('rootTabs') + }) + + const api = { + state, + handleClick: handleClick(state), + setDropdownTabs: setDropdownTabs(state) + } + + return api +} diff --git a/packages/renderless/src/tab-item/index.ts b/packages/renderless/src/tab-item/index.ts new file mode 100644 index 000000000..6b7bb4b9c --- /dev/null +++ b/packages/renderless/src/tab-item/index.ts @@ -0,0 +1,33 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const computedIsClosable = ({ parent, props }) => () => props.withClose || parent.withClose + +export const computedActive = ({ parent, nextTick, props, state }) => () => { + const active = parent.state.currentName === (props.name || state.index) + + if (active) { + state.loaded = true + + nextTick(() => { + state.animateShow = true + }) + } else { + state.animateShow = false + } + + return active +} + +export const computedPaneName = ({ props, state }) => () => props.name || state.index + +export const watchTitle = (parent) => () => parent.$emit('tab-nav-update') diff --git a/packages/renderless/src/tab-item/vue.ts b/packages/renderless/src/tab-item/vue.ts new file mode 100644 index 000000000..c3b8e227b --- /dev/null +++ b/packages/renderless/src/tab-item/vue.ts @@ -0,0 +1,42 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { computedIsClosable, computedActive, computedPaneName, watchTitle } from './index' + +export const api = ['state'] + +export const renderless = (props, { computed, inject, reactive, watch }, { parent, nextTick }) => { + const api = { + watchTitle: watchTitle(parent), + computedIsClosable: computedIsClosable({ parent, props }) + } + + const state = reactive({ + index: null, + loaded: false, + animateShow: true, + rootTabs: inject('rootTabs'), + active: computed(() => api.computedActive()), + paneName: computed(() => api.computedPaneName()), + isClosable: computed(() => api.computedIsClosable()) + }) + + Object.assign(api, { + state, + computedActive: computedActive({ parent, nextTick, props, state }), + computedPaneName: computedPaneName({ props, state }) + }) + + watch(() => props.title, api.watchTitle) + + return api +} diff --git a/packages/renderless/src/tab-nav/index.ts b/packages/renderless/src/tab-nav/index.ts new file mode 100644 index 000000000..7229886ad --- /dev/null +++ b/packages/renderless/src/tab-nav/index.ts @@ -0,0 +1,286 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { KEY_CODE, POSITION } from '@opentiny/vue-renderless/common' +import { capitalize } from '@opentiny/vue-renderless/common/string' +import { addResizeListener, removeResizeListener } from '@opentiny/vue-renderless/common/deps/resize-event' +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' + +export const computedNavStyle = (state) => { + const dir = ~[POSITION.Top, POSITION.Bottom].indexOf(state.rootTabs.position) ? 'X' : 'Y' + + if (state.mode === 'mobile') { + return { + transform: `translate${dir}(${state.lineOffset}px) translate${dir}(-50%)`, + } + } else { + return { + transform: `translate${dir}(-${state.navOffset}px)` + } + } +} + +export const scrollIntoView = ({ parent, refs, state }) => () => { + if (!state.scrollable) { + return + } + + const nav = refs.nav + const activeTab = parent.$el.querySelector('.is-active') + + if (!activeTab) { + return + } + + const to = activeTab.offsetLeft - (nav.offsetWidth - activeTab.offsetWidth) / 2 + const from = nav.scrollLeft + + if (state.mode === 'mobile') { + nav.scrollLeft += to - from + state.lineOffset = activeTab.offsetLeft + activeTab.offsetWidth / 2 + } +} + +export const computedSizeName = (state) => (~[POSITION.Top, POSITION.Bottom].indexOf(state.rootTabs.position) ? 'width' : 'height') + +/* istanbul ignore next */ +export const updated = ({ api, refs, state }) => () => { + if (!refs.nav) { + return + } + + let navSize = refs.nav[`offset${capitalize(state.sizeName)}`] // taList 列表容器 + + if (state.mode === 'mobile') { + Array.prototype.forEach.call(refs.nav.children, (item) => { + if (item.classList && item.classList.contains('tiny-mobile-tabs__item')) { + navSize += item.offsetWidth + } + + if (item.classList && item.classList.contains('is-active')) { + const line = item.querySelector('.tiny-mobile-tabs__name') + + state.isActive = true + state.lineOffset = item.offsetLeft + item.offsetWidth / 2 + } + }) + } + + const containerSize = refs.navScroll[`offset${capitalize(state.sizeName)}`] // 父容器宽度 + const currentOffset = state.navOffset + + if (containerSize < navSize) { + const currentOffset = state.navOffset + + state.scrollable = state.scrollable || {} + state.scrollable.prev = currentOffset + state.scrollable.next = currentOffset + containerSize < navSize + + if (navSize - currentOffset < containerSize) { + state.navOffset = navSize - containerSize + } + } else { + state.scrollable = false + + if (currentOffset > 0) { + state.navOffset = 0 + } + } + + state.isActive && api.scrollIntoView() +} + +export const mounted = ({ api, parent }) => { + const el = parent.$refs.nav.$el + + /* istanbul ignore next */ + addResizeListener(el, api.updated) + on(document, 'visibilitychange', api.visibilityChangeHandler) + on(window, 'blur', api.windowBlurHandler) + on(window, 'focus', api.windowFocusHandler) + + api.scrollToActiveTab() + api.scrollIntoView() +} + +export const beforeUnmount = ({ api, parent }) => { + const el = parent.$refs.nav && parent.$refs.nav.$el + + /* istanbul ignore next */ + if (el && api.updated) { + removeResizeListener(el, api.updated) + } + + off(document, 'visibilitychange', api.visibilityChangeHandler) + off(window, 'blur', api.windowBlurHandler) + off(window, 'focus', api.windowFocusHandler) +} + +export const visibilityChangeHandler = (state) => () => { + const visibility = document.visibilityState + + /* istanbul ignore next */ + if (visibility === 'hidden') { + state.focusable = false + } else if (visibility === 'visible') { + setTimeout(() => { + state.focusable = true + }, 50) + } +} + +export const windowBlurHandler = (state) => () => { + state.focusable = false +} + +export const windowFocusHandler = (state) => () => { + setTimeout(() => { + state.focusable = true + }, 50) +} + +/* istanbul ignore next */ +export const scrollToActiveTab = ({ parent, refs, state }) => () => { + if (!state.scrollable) { + return + } + + const nav = refs.nav + const activeTab = parent.$el.querySelector('.is-active') + + if (!activeTab) { + return + } + + const navScroll = refs.navScroll + const activeTabBounding = activeTab.getBoundingClientRect() + const navScrollBounding = navScroll.getBoundingClientRect() + let maxOffset = nav.offsetWidth - navScrollBounding.width + + if (state.mode === 'mobile') { + if (activeTabBounding.left > navScrollBounding.width) { + maxOffset = activeTabBounding.left - navScrollBounding.width + activeTabBounding.width + } else { + maxOffset = activeTabBounding.width + } + } + + const currentOffset = state.navOffset + let newOffset = currentOffset + + if (activeTabBounding.left < navScrollBounding.left) { + newOffset = currentOffset - (navScrollBounding.left - activeTabBounding.left) + } + + if (activeTabBounding.right > navScrollBounding.right) { + newOffset = currentOffset + activeTabBounding.right - navScrollBounding.right + } + + newOffset = Math.max(newOffset, 0) + state.navOffset = Math.min(newOffset, maxOffset) +} + +export const scrollPrev = ({ refs, state }) => () => { + const containerSize = refs.navScroll[`offset${capitalize(state.sizeName)}`] + const currentOffset = state.navOffset + + if (!currentOffset) { + return + } + + const newOffset = currentOffset > containerSize ? currentOffset - containerSize : 0 + + state.navOffset = newOffset +} + +export const scrollNext = ({ refs, state }) => () => { + const navSize = refs.nav[`offset${capitalize(state.sizeName)}`] + const containerSize = refs.navScroll[`offset${capitalize(state.sizeName)}`] + const currentOffset = state.navOffset + + if (navSize - currentOffset <= containerSize) { + return + } + + const newOffset = navSize - currentOffset > containerSize * 2 ? currentOffset + containerSize : navSize - containerSize + + state.navOffset = newOffset +} + +/* istanbul ignore next */ +export const changeTab = (api) => (event) => { + const keyCode = event.keyCode + let nextIndex + let currentIndex, tabList + + if (~[KEY_CODE.ArrowLeft, KEY_CODE.ArrowRight, KEY_CODE.ArrowUp, KEY_CODE.ArrowDown].indexOf(keyCode)) { + tabList = event.currentTarget.querySelectorAll('[role=tab]') + currentIndex = Array.prototype.indexOf.call(tabList, event.target) + } else { + return + } + + if (keyCode === KEY_CODE.ArrowLeft || keyCode === KEY_CODE.ArrowUp) { + if (currentIndex === 0) { + nextIndex = tabList.length - 1 + } else { + nextIndex = currentIndex - 1 + } + } else { + if (currentIndex < tabList.length - 1) { + nextIndex = currentIndex + 1 + } else { + nextIndex = 0 + } + } + + tabList[nextIndex].focus() // 改变焦点元素 + tabList[nextIndex].click() // 选中下一个tab + api.setFocus() +} + +export const setFocus = (state) => () => { + if (state.focusable) { + state.isFocus = true + } +} + +export const removeFocus = (state) => () => { + state.isFocus = true +} + +// pc-展示更多的功能 +export const moreTabShow = (state) => () => { + if (state.showMoreItem) { + state.showMoreItem = false + } else { + state.showMoreItem = true + } +} + +// mobile-展示展开选项的功能 +export const expandTabShow = ({ api, state }) => () => { + state.showExpandItem = !state.showExpandItem + if (state.showExpandItem) { + api.computedHeaderStyle() + } +} + +export const expandTabHide = (state) => () => state.showExpandItem = false + +export const computedHeaderStyle = ({ refs, state }) => () => { + if (refs.nav) { + state.expandHeaderStyle[state.sizeName] = refs.nav[`offset${capitalize(state.sizeName)}`] + 'px' + } + + return state.expandHeaderStyle +} diff --git a/packages/renderless/src/tab-nav/vue.ts b/packages/renderless/src/tab-nav/vue.ts new file mode 100644 index 000000000..326c91803 --- /dev/null +++ b/packages/renderless/src/tab-nav/vue.ts @@ -0,0 +1,93 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + computedNavStyle, + computedSizeName, + updated, + visibilityChangeHandler, + windowBlurHandler, + windowFocusHandler, + scrollToActiveTab, + scrollIntoView, + mounted, + moreTabShow, + expandTabShow, + expandTabHide, + computedHeaderStyle, + beforeUnmount, + scrollPrev, + scrollNext, + changeTab, + setFocus, + removeFocus +} from './index' + +export const api = [ + 'state', + 'setFocus', + 'removeFocus', + 'scrollPrev', + 'scrollNext', + 'changeTab', + 'scrollToActiveTab', + 'scrollIntoView', + 'moreTabShow', + 'expandTabShow', + 'expandTabHide', + 'computedHeaderStyle', + 'swiperHandle' +] + +export const renderless = (props, { computed, inject, onBeforeUnmount, onMounted, onUpdated, reactive }, { parent, refs, mode: tinyMode }) => { + const api = { mounted, beforeUnmount, computedNavStyle, computedSizeName } + const state = reactive({ + navOffset: 0, + lineOffset: 0, + scrollable: false, + isFocus: false, + focusable: false, + showMoreItem: false, + isActive: false, + showMoreTabs: props.showMoreTabs, + showExpandItem: false, + showExpandTabs: props.showExpandTabs, + expandHeaderStyle: {}, + mode: props._mode || parent.$mode || (tinyMode || 'pc'), + rootTabs: inject('rootTabs'), + sizeName: computed(() => api.computedSizeName(state)), + navStyle: computed(() => api.computedNavStyle(state)) + }) + Object.assign(api, { + state, + setFocus: setFocus(state), + removeFocus: removeFocus(state), + moreTabShow: moreTabShow(state), + expandTabShow: expandTabShow({ api, state }), + expandTabHide: expandTabHide(state), + scrollPrev: scrollPrev({ refs, state }), + scrollNext: scrollNext({ refs, state }), + windowBlurHandler: windowBlurHandler(state), + windowFocusHandler: windowFocusHandler(state), + visibilityChangeHandler: visibilityChangeHandler(state), + scrollToActiveTab: scrollToActiveTab({ props, parent, refs, state }), + scrollIntoView: scrollIntoView({ props, parent, refs, state }), + computedHeaderStyle: computedHeaderStyle({ refs, state }) + }) + + Object.assign(api, { updated: updated({ api, props, refs, state }), changeTab: changeTab(api) }) + onUpdated(() => api.updated()) + onMounted(() => api.mounted({ api, parent })) + onBeforeUnmount(() => api.beforeUnmount({ api, parent })) + + return api +} diff --git a/packages/renderless/src/tabbar-item/index.ts b/packages/renderless/src/tabbar-item/index.ts new file mode 100644 index 000000000..1c38cf2a9 --- /dev/null +++ b/packages/renderless/src/tabbar-item/index.ts @@ -0,0 +1,58 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { isObject, isNull } from '@opentiny/vue-renderless/common/type' + +export const getRouteActive = ({ props, route }) => () => { + if (props.to && route) { + const config = isObject(props.to) ? props.to : { path: props.to } + const pathMatched = config.path === route.path + const nameMatched = !isNull(config.name) && config.name === route.name + + return pathMatched || nameMatched + } +} + +export const onClick = ({ api, emit, parent, props, router, state }) => () => { + parent.$parent.onChange(props.name || parent.index || state.index) + + emit('click', event) + + api.routeTab(router) +} + +export const bindChildren = (parent) => () => { + if (!parent.$parent) { + return + } + + parent.$parent.state.children = parent.$parent.getChildrens() +} + +export const routeTab = (props, state) => (router) => { + const { to, replace } = props + const { url } = state + + if (to && router) { + const promise = router[replace ? 'replace' : 'push'](to) + + if (promise && promise.catch) { + promise.catch((err) => { + if (err && err.name !== 'NavigationDuplicated') { + throw err + } + }) + } + } else if (url) { + replace ? location.replace(url) : (location.href = url) + } +} diff --git a/packages/renderless/src/tabbar-item/vue.ts b/packages/renderless/src/tabbar-item/vue.ts new file mode 100644 index 000000000..c07264607 --- /dev/null +++ b/packages/renderless/src/tabbar-item/vue.ts @@ -0,0 +1,40 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getRouteActive, onClick, bindChildren, routeTab } from './index' +import { xss } from '@opentiny/vue-renderless/common/xss.js' + +export const api = ['state', 'onClick'] + +export const renderless = (props, { computed, onMounted, reactive }, { parent, emit, nextTick, route, router }) => { + const api = {} + const state = reactive({ + active: false, + info: computed(() => (props.dot ? '' : !props.dot && props.badge)), + url: computed(() => xss.filterUrl(props.url)), + routeActive: computed(() => api.getRouteActive()), + renderActive: computed(() => (parent.$parent.route ? state.routeActive : state.active)), + renderColor: computed(() => parent.$parent[state.active ? 'activeColor' : 'inactiveColor']) + }) + + Object.assign(api, { + state, + bindChildren: bindChildren(parent), + routeTab: routeTab(props, state), + getRouteActive: getRouteActive({ props, route }), + onClick: onClick({ api, emit, parent, props, router, state }) + }) + + onMounted(() => nextTick(api.bindChildren)) + + return api +} diff --git a/packages/renderless/src/tabbar/index.ts b/packages/renderless/src/tabbar/index.ts new file mode 100644 index 000000000..49d521f4f --- /dev/null +++ b/packages/renderless/src/tabbar/index.ts @@ -0,0 +1,35 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const setActiveItem = ({ props, state }) => () => { + state.children.forEach((item, index) => { + item.state ? (item.state.index = index) : (item.index = index) + item.state && (item.state.active = (item.name || index) === props.modelValue) + }) +} + +export const onChange = ({ emit, props }) => (active) => { + if (active !== props.modelValue) { + emit('update:modelValue', active) + emit('change', active) + } +} + +export const getChildrens = ({ childrenHandler }) => () => { + const $children = [] + + childrenHandler(({ options, vm }) => { + options.componentName === 'TinyTabbarItem' && $children.push(vm) + }) + + return $children +} diff --git a/packages/renderless/src/tabbar/vue.ts b/packages/renderless/src/tabbar/vue.ts new file mode 100644 index 000000000..758820837 --- /dev/null +++ b/packages/renderless/src/tabbar/vue.ts @@ -0,0 +1,45 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { setActiveItem, onChange, getChildrens } from './index' + +export const api = ['state', 'onChange', 'getChildrens'] + +export const renderless = (props, { computed, onMounted, reactive, watch }, { refs, emit, nextTick, childrenHandler }) => { + const state = reactive({ + height: null, + children: [], + fit: computed(() => (props.safeAreaInsetBottom !== null ? props.safeAreaInsetBottom : props.fixed)) + }) + + const api = { + state, + onChange: onChange({ emit, props }), + parent: computed(() => api.getParent()), + setActiveItem: setActiveItem({ props, state }), + getChildrens: getChildrens({ childrenHandler }) + } + + onMounted(() => { + if (props.placeholder && props.fixed) { + nextTick(() => { + state.height = refs.tabbar.getBoundingClientRect().height + }) + } + }) + + watch(() => props.modelValue, api.setActiveItem, { immediate: true }) + + watch(() => state.children, api.setActiveItem, { immediate: true }) + + return api +} diff --git a/packages/renderless/src/table/index.ts b/packages/renderless/src/table/index.ts new file mode 100644 index 000000000..a561bd4ca --- /dev/null +++ b/packages/renderless/src/table/index.ts @@ -0,0 +1,101 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const computedCheckableData = ({ props }) => () => props.data.filter((item) => !item.disabled) + +export const computedSelectedKeys = ({ props, state }) => () => { + const keys = [] + + state.checkableData.forEach((item) => keys.push(item[props.keys])) + + return keys +} + +export const computedSelectCls = ({ state }) => () => { + if (state.selected.length > 0 && state.selected.length >= state.checkableData.length) { + return 'checked-sur' + } else if (state.selected.length > 0 && state.selected.length < state.checkableData.length) { + return 'halfselect' + } + + return 'check' +} + +export const watchDefaultChecked = ({ props, state }) => (value, oldvalue) => { + if (oldvalue && value.length === oldvalue.length && value.every((item) => oldvalue.includes(item))) { + return + } + + const checked = [] + + state.checkableData.forEach((item) => { + const index = value.indexOf(item[props.keys]) + + if (~index) { + checked.push(item) + } + }) + + state.selected = checked + state.checkedChangeByUser = false +} + +export const watchSelected = ({ emit, props, state }) => (value, oldvalue) => { + const keys = [] + + value.forEach((item) => keys.push(item[props.keys])) + + if (state.checkedChangeByUser) { + const movedKeys = value.concat(oldvalue).filter((item) => !value.includes(item) || !oldvalue.includes(item)) + + emit('checked-change', keys, false, movedKeys) + } else { + emit('checked-change', keys, false) + + state.checkedChangeByUser = true + } +} + +export const selectRow = ({ emit, state }) => (row) => { + state.selectedRow = row + emit('radio-change', row) +} + +export const togeSelected = ({ state }) => (row) => { + if (row.disabled) { + return + } + + const index = state.selected.indexOf(row) + + if (index !== -1) { + state.selected.splice(index, 1) + } else { + state.selected.push(row) + } + + state.selected = state.selected.slice() +} + +export const togeSelectAll = ({ emit, props, state }) => () => { + let data = [] + + if (state.selectCls === 'checked-sur') { + state.selected = [] + data = [] + } else { + data = state.checkableData.map((item) => item[props.keys]) + state.selected = state.checkableData + } + + emit('checked-change', data, true) +} diff --git a/packages/renderless/src/table/vue.ts b/packages/renderless/src/table/vue.ts new file mode 100644 index 000000000..c47099906 --- /dev/null +++ b/packages/renderless/src/table/vue.ts @@ -0,0 +1,55 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + computedCheckableData, + computedSelectedKeys, + computedSelectCls, + watchDefaultChecked, + watchSelected, + selectRow, + togeSelected, + togeSelectAll +} from './index' + +export const api = ['state', 'selectRow', 'togeSelected', 'togeSelectAll'] + +export const renderless = (props, { computed, reactive, watch }, { t, emit }) => { + const api = {} + const state = reactive({ + selectedRow: null, + checkChangeByUser: false, + selected: [], + checkableData: computed(() => api.computedCheckableData()), + selectedKeys: computed(() => api.computedSelectedKeys()), + selectCls: computed(() => api.computedSelectCls()) + }) + + Object.assign(api, { + t, + state, + computedSelectCls: computedSelectCls({ state }), + computedSelectedKeys: computedSelectedKeys({ props, state }), + computedCheckableData: computedCheckableData({ props }), + selectRow: selectRow({ emit, state }), + togeSelected: togeSelected({ state }), + togeSelectAll: togeSelectAll({ emit, props, state }), + watchSelected: watchSelected({ emit, props, state }), + watchDefaultChecked: watchDefaultChecked({ props, state }) + }) + + watch(() => props.defaultChecked, api.watchDefaultChecked) + + watch(() => state.selected, api.watchSelected) + + return api +} diff --git a/packages/renderless/src/tabs/index.ts b/packages/renderless/src/tabs/index.ts new file mode 100644 index 000000000..10d483ad4 --- /dev/null +++ b/packages/renderless/src/tabs/index.ts @@ -0,0 +1,181 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const calcPaneInstances = ({ constants, parent, state, childrenHandler }) => (isForceUpdate = false) => { + const tabItemVNodes = parent.$slots.default + + /* istanbul ignore if */ + if (tabItemVNodes) { + const currentPanes = [] + + childrenHandler(({ vm, isLevel1 }) => { + isLevel1 && vm.$options.componentName === constants.TAB_ITEM && currentPanes.push(vm) + }) + + const currentPaneStates = currentPanes.map((pane) => pane.state) + const paneStates = state.panes.map((pane) => pane.state) + + let newPanes = [] + for (let i = 0; i < paneStates.length; i++) { + const paneState = paneStates[i] + const index = currentPaneStates.indexOf(paneState) + + if (index > -1) { + newPanes.push(state.panes[i]) + currentPanes.splice(index, 1) + + currentPaneStates.splice(index, 1) + } + } + + newPanes = newPanes.concat(currentPanes) + + const panesChanged = !(newPanes.length === state.panes.length && newPanes.every((pane, index) => pane.state === state.panes[index].state)) + + if (isForceUpdate || panesChanged) { + state.panes = newPanes + } + } else if (state.panes.length !== 0) { + state.panes = [] + } +} + +/* istanbul ignore */ +export const calcMorePanes = ({ parent, props, state }) => () => { + if (!props.showMoreTabs) { + return + } + + const el = parent.$el + const tabs = el.querySelectorAll('.tiny-tabs__item') + + if (tabs && tabs.length) { + const tabsHeaderWidth = el.querySelector('.tiny-tabs__nav-scroll').clientWidth + 15 + let tabsAllWidth = 0 + + for (let i = 0, length = tabs.length; i < length; i++) { + const width = tabs[i].offsetWidth + + tabsAllWidth += width + + if (tabsAllWidth > tabsHeaderWidth) { + state.showPanesCount = i + break + } + } + } +} + +export const calcExpandPanes = ({ parent, props, state }) => () => { + if (!props.showExpandTabs) { + return + } + const el = parent.$el + const tabsHeader = el.querySelector('.tiny-mobile-tabs__header') + + if (tabsHeader) { + state.expandPanesWidth = tabsHeader.clientWidth + } +} + +export const handleTabClick = ({ api, emit, props, refs }) => (pane, tabName, event) => { + if (pane.disabled) { + return + } + + api.setCurrentName(tabName) + + emit('click', pane, event) + + if (props.showExpandTabs) { + refs.nav && refs.nav.expandTabHide() + } +} + +export const handleTabRemove = (emit) => (pane, event) => { + if (pane.disabled) { + return + } + + event.stopPropagation() + + emit('edit', pane.name, 'remove') + emit('close', pane.name) +} + +export const handleTabAdd = (emit) => () => { + emit('edit', null, 'add') + emit('add') +} + +export const setCurrentName = ({ api, props, refs, state }) => (value) => { + api.changeDirection(state.currentName) + + if (state.currentName !== value && props.beforeLeave) { + const before = props.beforeLeave(value, state.currentName) + + if (before && before.then) { + before.then(() => { + api.changeCurrentName(value) + refs.nav && refs.nav.removeFocus(value) + }) + } else if (before !== false) { + api.changeCurrentName(value) + } + } else { + api.changeCurrentName(value) + } +} + +export const changeCurrentName = ({ emit, state }) => (value) => { + state.currentName = value + emit('update:modelValue', value) +} + +export const created = ({ api, parent, state }) => () => { + if (!state.currentName) { + state.currentIndex = 0 + api.setCurrentName('0') + } + + api.changeDirection(state.currentName || '0') + + parent.$on('tab-nav-update', api.calcPaneInstances.bind(null, true)) +} + +export const changeDirection = ({ props, state }) => (currentName) => { + state.panes.forEach((item, index) => { + if (item.state.paneName === currentName && state.currentIndex !== index) { + const isTopOrBottom = ~['top', 'bottom'].indexOf(props.position) + const isPrev = state.currentIndex < index + + state.direction = isTopOrBottom ? (isPrev ? 'right' : 'left') : isPrev ? 'bottom' : 'top' + state.currentIndex = index + } + }) +} + +export const handleTabDragStart = ({ emit }) => (event) => { + emit('tab-drag-start', event) +} + +export const handleTabDragOver = ({ emit }) => (event) => { + emit('tab-drag-over', event) +} + +export const handleTabDragEnd = ({ state, emit }) => (event) => { + const { oldDraggableIndex, newDraggableIndex } = event + const panel = state.panes.splice(oldDraggableIndex, 1)[0] + state.panes.splice(newDraggableIndex, 0, panel) + + emit('tab-drag-end', event) +} diff --git a/packages/renderless/src/tabs/vue.ts b/packages/renderless/src/tabs/vue.ts new file mode 100644 index 000000000..e6f15c99c --- /dev/null +++ b/packages/renderless/src/tabs/vue.ts @@ -0,0 +1,129 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + calcMorePanes, + calcExpandPanes, + calcPaneInstances, + handleTabClick, + handleTabAdd, + handleTabRemove, + setCurrentName, + changeCurrentName, + created, + changeDirection, + handleTabDragStart, + handleTabDragOver, + handleTabDragEnd +} from './index' + +export const api = [ + 'state', + 'handleTabAdd', + 'calcPaneInstances', + 'handleTabRemove', + 'handleTabClick', + 'handleTabDragStart', + 'handleTabDragOver', + 'handleTabDragEnd', + 'setCurrentName', + 'getNavRefs' +] + +const initState = ({ reactive, props }) => + reactive({ + panes: [], + currentName: props.modelValue || props.activeName, + currentIndex: -1, + showPanesCount: -1, + startX: 0, + startY: 0, + deltaX: 0, + deltaY: 0, + offsetX: 0, + offsetY: 0, + direction: '', + expandPanesWidth: '' + }) + +const initWatcher = ({ watch, props, api, state, nextTick, refs }) => { + watch(() => props.modelValue, api.setCurrentName) + + watch(() => props.activeName, api.setCurrentName) + + watch( + () => state.currentName, + () => { + nextTick(() => { + refs.nav.scrollToActiveTab() + }) + }, + { deep: true } + ) + + watch( + () => props.showMoreTabs, + (value) => { + if (!value) { + state.morePanes = [] + state.showPanesCount = -1 + } + }, + { immediate: true } + ) +} + +export const renderless = (props, { onMounted, onUpdated, provide, reactive, watch }, { refs, parent, emit, constants, nextTick, childrenHandler }) => { + const api = {} + const state = initState({ reactive, props }) + + Object.assign(api, { + state, + handleTabAdd: handleTabAdd(emit), + handleTabRemove: handleTabRemove(emit), + changeDirection: changeDirection({ props, state }), + changeCurrentName: changeCurrentName({ emit, state }), + calcMorePanes: calcMorePanes({ parent, props, state }), + calcExpandPanes: calcExpandPanes({ parent, props, state }), + calcPaneInstances: calcPaneInstances({ constants, parent, state, childrenHandler }), + handleTabDragStart: handleTabDragStart({ emit }), + handleTabDragOver: handleTabDragOver({ emit }), + handleTabDragEnd: handleTabDragEnd({ state, emit }), + handleTabClick: handleTabClick({ api, emit, props, refs }), + setCurrentName: setCurrentName({ api, props, refs, state }), + created: created({ api, parent, state }) + }) + + api.created() + + provide('rootTabs', parent) + + initWatcher({ watch, props, api, state, nextTick, refs }) + + if (!state.currentName) { + api.setCurrentName('0') + } + + onMounted(() => { + api.calcPaneInstances() + api.calcMorePanes() + api.calcExpandPanes() + }) + + onUpdated(() => { + api.calcPaneInstances() + api.calcMorePanes() + api.calcExpandPanes() + }) + + return api +} diff --git a/packages/renderless/src/tag/index.ts b/packages/renderless/src/tag/index.ts new file mode 100644 index 000000000..9bc04e00c --- /dev/null +++ b/packages/renderless/src/tag/index.ts @@ -0,0 +1,23 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const handleClose = ({ emit, props }) => (event) => { + event.stopPropagation() + + const close = () => emit('close', event) + props.beforeDelete ? props.beforeDelete(close) : close() +} + +export const handleClick = ({ emit, parent }) => (event) => { + parent.$parent && parent.$parent.tagSelectable && event.stopPropagation() + emit('click', event) +} diff --git a/packages/renderless/src/tag/vue.ts b/packages/renderless/src/tag/vue.ts new file mode 100644 index 000000000..187c64d55 --- /dev/null +++ b/packages/renderless/src/tag/vue.ts @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { handleClose, handleClick } from './index' + +export const api = ['handleClose', 'handleClick'] + +export const renderless = (props, hooks, { emit, parent }) => ({ + handleClose: handleClose({ emit, props }), + handleClick: handleClick({ emit, parent }) +}) diff --git a/packages/renderless/src/tall-storage/index.ts b/packages/renderless/src/tall-storage/index.ts new file mode 100644 index 000000000..b01fc3164 --- /dev/null +++ b/packages/renderless/src/tall-storage/index.ts @@ -0,0 +1,172 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { KEY_CODE } from '@opentiny/vue-renderless/common' + +export const mousedown = (event) => { + if (event && event.preventDefault) { + event.preventDefault() + } else { + window.event.returnValue = false + } + + return false +} + +export const selectItem = ({ emit, state }) => (value) => { + state.hoverValue = '' + emit('selected', value) +} + +export const keydown = ({ emit, props, state }) => () => { + const key = window.event.keyCode + const index = props.localstorageData.indexOf(state.hoverValue) + const endIndex = props.localstorageData.length - 1 + + if (key === KEY_CODE.ArrowUp && props.isMemoryStorage) { + if (index > 0 && index <= endIndex) { + state.hoverValue = props.localstorageData[index - 1] + } else { + state.hoverValue = props.localstorageData[endIndex] + } + + return false + } + + if (key === KEY_CODE.ArrowDown && props.isMemoryStorage) { + if (index >= 0 && index < endIndex) { + state.hoverValue = props.localstorageData[index + 1] + } else { + state.hoverValue = props.localstorageData[0] + } + + return false + } + + if (key === KEY_CODE.NumpadEnter) { + if (props.isMemoryStorage && state.hoverValue && state.hoverValue.length > 0) { + emit('selected', state.hoverValue) + } + } +} + +const sortDeduplication = (array) => { + const memorySpace = 5 // 一个name的记忆量 + const length = array.length + let newArray = [] + let fillterObj = {} + + for (let i = 0, j = 1; j <= memorySpace; j++) { + if (i < 0 || i >= length) { + break + } + + if (fillterObj[array[i]]) { + j = j - 1 + } else { + fillterObj[array[i]] = true + newArray.push(array[i]) + } + + if (j === length) { + break + } + + i++ + } + + return newArray +} + +const isJSONobject = (string, type) => { + if (typeof string === 'string') { + try { + const obj = JSON.parse(string) + if (typeof obj === 'object' && obj && (type ? obj.constructor === type : true)) { + return true + } else { + return false + } + } catch (error) { + return false + } + } +} + +const setLocalStorageage = (name, value) => { + if (typeof value === 'string') { + const oldValue = localStorage.getItem(name) + const isArray = isJSONobject(oldValue, Array) + let newValue = '' + + if (oldValue && isArray) { + let oldArray = JSON.parse(localStorage.getItem(name)) + + oldArray.unshift(value) + oldArray = sortDeduplication(oldArray) + newValue = JSON.stringify(oldArray) + } else if (oldValue === null || oldValue === value) { + newValue = value + } else { + newValue = JSON.stringify([value, oldValue]) + } + + localStorage.setItem(name, newValue) + } +} + +export const addMemory = (props) => (value) => { + if (props.name && value) { + setLocalStorageage(props.name, value) + } +} + +export const searchMemory = ({ props, state }) => (inputVal) => { + if (!props.name) { + return + } + const memoryBox = localStorage.getItem(props.name) + let storageData = [] + let isMemoryStorage = true + + if (isJSONobject(memoryBox)) { + const memoryArry = JSON.parse(memoryBox) + + if (!inputVal) { + storageData = JSON.parse(memoryBox) + } else { + for (let i = 0, len = memoryArry.length; i < len; i++) { + memoryArry[i].includes(inputVal) && storageData.push(memoryArry[i]) + } + } + + if (storageData.length === 0) { + isMemoryStorage = false + } + } else { + if (memoryBox === null) { + isMemoryStorage = false + } else { + storageData.push(memoryBox) + } + } + + state.storageData = storageData + state.isMemoryStorage = isMemoryStorage +} + +export const selectedMemory = ({ api, state }) => (value) => { + api.getInput().value = value + api.handleInput({ target: { value } }) + api.handleChange({ target: { value } }) + state.isMemoryStorage = false +} diff --git a/packages/renderless/src/tall-storage/vue-storage-box.ts b/packages/renderless/src/tall-storage/vue-storage-box.ts new file mode 100644 index 000000000..c26e09def --- /dev/null +++ b/packages/renderless/src/tall-storage/vue-storage-box.ts @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { addMemory, searchMemory, selectedMemory } from './index' + +export default ({ api, props, reactive, toRefs }) => { + const state = reactive({ + storageData: [], + isMemoryStorage: false + }) + + return { + ...toRefs(state), + addMemory: addMemory(props), + searchMemory: searchMemory({ props, state }), + selectedMemory: selectedMemory({ api, state }) + } +} diff --git a/packages/renderless/src/tall-storage/vue.ts b/packages/renderless/src/tall-storage/vue.ts new file mode 100644 index 000000000..5ca95db57 --- /dev/null +++ b/packages/renderless/src/tall-storage/vue.ts @@ -0,0 +1,44 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { mousedown, selectItem, keydown } from './index' +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' + +export const api = ['state', 'mousedown', 'selectItem'] + +export const renderless = (props, { onUnmounted, reactive, watch }, { emit }) => { + const state = reactive({ + hoverValue: '' + }) + + const api = { + state, + mousedown, + selectItem: selectItem({ emit, state }), + keydown: keydown({ emit, props, state }) + } + + watch( + () => props.isMemoryStorage, + (value) => !value && (state.hoverValue = ''), + { immediate: true } + ) + + onUnmounted(() => { + state.hoverValue = '' + off(document, 'keydown', api.keydown) + }) + + on(document, 'keydown', api.keydown) + + return api +} diff --git a/packages/renderless/src/text-popup/index.ts b/packages/renderless/src/text-popup/index.ts new file mode 100644 index 000000000..d35f2d3b0 --- /dev/null +++ b/packages/renderless/src/text-popup/index.ts @@ -0,0 +1,68 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const computedWidth = ({ props }) => () => { + if (typeof props.width === 'number' || !Number.isNaN(Number(props.width))) { + return props.width + 'px' + } + + return props.width +} + +export const watchValue = ({ api, props, state }) => (newValue) => { + newValue = newValue.toString() + + if (state.type === 'textarea') { + state.textAreaValue = api.jointText(newValue, props.separtor) + } else { + state.text && (state.text.value = newValue) + } +} + +export const mounted = ({ props, refs, state }) => () => { + state.text = refs.text + state.popup = refs.popup + state.text.value = props.modelValue.toString() +} + +export const onFocus = ({ api, emit, props, nextTick, state }) => () => { + state.type = 'textarea' + + nextTick(() => { + state.popup.focus() + state.text.placeholder && (state.popup.placeholder = state.text.placeholder) + state.textAreaValue = api.jointText(state.text.value, props.separtor) + + emit('popup', true) + }) +} + +export const onBlur = ({ api, emit, props, state }) => () => { + state.type = 'input' + state.text.value = api.separteText(state.textAreaValue, props.separtor) + + emit('popup', false) +} + +export const onInput = ({ api, emit, props }) => (event) => { + const value = api.separteText(event.target.value, props.separtor) + emit('update:modelValue', value) +} + +export const separteText = (str, separtor) => str.replace(/\n/g, separtor) + +export const jointText = (str, separtor) => { + if (separtor === ']') { + separtor = '\\' + separtor + } + return str.replace(new RegExp(`[${separtor}]`, 'g'), '\n') +} diff --git a/packages/renderless/src/text-popup/vue.ts b/packages/renderless/src/text-popup/vue.ts new file mode 100644 index 000000000..971633a72 --- /dev/null +++ b/packages/renderless/src/text-popup/vue.ts @@ -0,0 +1,44 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { computedWidth, watchValue, mounted, onFocus, onBlur, onInput, separteText, jointText } from './index' + +export const api = ['state', 'onFocus', 'onBlur', 'onInput'] + +export const renderless = (props, { computed, onMounted, reactive, watch }, { emit, nextTick, refs }) => { + const api = {} + const state = reactive({ + type: 'input', + textAreaValue: '', + text: null, + popup: null, + width: computed(() => api.computedWidth()) + }) + + Object.assign(api, { + state, + jointText, + separteText, + computedWidth: computedWidth({ props }), + mounted: mounted({ props, refs, state }), + onInput: onInput({ api, emit, props }), + watchValue: watchValue({ api, props, state }), + onBlur: onBlur({ api, emit, props, state }), + onFocus: onFocus({ api, emit, props, nextTick, state }) + }) + + watch(() => props.modelValue, api.watchValue, { immediate: true }) + + onMounted(api.mounted) + + return api +} diff --git a/packages/renderless/src/time-line/index.ts b/packages/renderless/src/time-line/index.ts new file mode 100644 index 000000000..924d3af9c --- /dev/null +++ b/packages/renderless/src/time-line/index.ts @@ -0,0 +1,46 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { format } from '@opentiny/vue-renderless/common/date' + +export const getDate = (dateTime) => ({ + date: format(dateTime, 'yyyy-MM-dd'), + time: format(dateTime, 'hh:mm') +}) + +export const getStatus = ({ state, t }) => (value) => { + const status = state.current - value + + return status > 0 ? t('ui.steps.done') : status === 0 ? t('ui.steps.doing') : t('ui.steps.wait') +} + +export const handleClick = ({ emit, state }) => ({ index, node }) => { + emit('click', state.isReverse ? state.nodes.length - index - 1 : index, node) +} + +export const getStatusCls = ({ constants, state }) => (index) => { + const { PROCESS_DONE_CLS, PROCESS_CUR_CLS, PROCESS_WAIT_CLS } = constants + const cls = {} + const reverse = state.isReverse + + cls[PROCESS_DONE_CLS] = reverse ? index > state.current : index < state.current + cls[PROCESS_CUR_CLS] = index === state.current + cls[PROCESS_WAIT_CLS] = reverse ? index < state.current : index > state.current + + return cls +} + +export const computedData = ({ props, state }) => () => (state.isReverse ? props.data.map((item, i) => props.data[props.data.length - 1 - i]) : props.data) + +export const computedCurrent = ({ props, state }) => () => (state.isReverse ? state.nodes.length - props.active - 1 : props.active) + +export const computedIsReverse = (props) => () => props.reverse && props.vertical diff --git a/packages/renderless/src/time-line/vue.ts b/packages/renderless/src/time-line/vue.ts new file mode 100644 index 000000000..2124ff910 --- /dev/null +++ b/packages/renderless/src/time-line/vue.ts @@ -0,0 +1,37 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { handleClick, getStatusCls, getStatus, computedData, getDate, computedCurrent, computedIsReverse } from './index' + +export const api = ['state', 'handleClick', 'getStatusCls', 'getStatus', 'getDate'] + +export const renderless = (props, { computed, reactive }, { t, emit, constants }) => { + const api = {} + const state = reactive({ + nodes: computed(() => api.computedData()), + current: computed(() => api.computedCurrent()), + isReverse: computed(() => api.computedIsReverse()) + }) + + Object.assign(api, { + state, + getDate, + computedData: computedData({ props, state }), + computedCurrent: computedCurrent({ props, state }), + computedIsReverse: computedIsReverse(props), + getStatus: getStatus({ state, t }), + handleClick: handleClick({ emit, state, api }), + getStatusCls: getStatusCls({ constants, props, state }) + }) + + return api +} diff --git a/packages/renderless/src/time-panel/index.ts b/packages/renderless/src/time-panel/index.ts new file mode 100644 index 000000000..3e1648e65 --- /dev/null +++ b/packages/renderless/src/time-panel/index.ts @@ -0,0 +1,158 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import scrollIntoView from '@opentiny/vue-renderless/common/deps/scroll-into-view' +import { DATEPICKER } from '@opentiny/vue-renderless/common' + +export const parseTime = () => (time) => { + const values = (time || '').split(':') + + if (values.length >= 2) { + const hours = parseInt(values[0], 10) + const minutes = parseInt(values[1], 10) + + return { + hours, + minutes + } + } + /* istanbul ignore next */ + return null +} + +export const compareTime = (api) => (time1, time2) => { + const value1 = api.parseTime(time1) + const value2 = api.parseTime(time2) + const minutes1 = value1.minutes + value1.hours * 60 + const minutes2 = value2.minutes + value2.hours * 60 + + if (minutes1 === minutes2) { + return 0 + } + + return minutes1 > minutes2 ? 1 : -1 +} + +export const formatTime = () => (time) => (time.hours < 10 ? '0' + time.hours : time.hours) + ':' + (time.minutes < 10 ? '0' + time.minutes : time.minutes) + +export const nextTime = (api) => (time, step) => { + const timeValue = api.parseTime(time) + const stepValue = api.parseTime(step) + const next = { + hours: timeValue.hours, + minutes: timeValue.minutes + } + + next.minutes += stepValue.minutes + next.hours += stepValue.hours + next.hours += Math.floor(next.minutes / 60) + next.minutes = next.minutes % 60 + + return api.formatTime(next) +} + +export const emitDestroy = (emit) => () => emit('dodestroy') + +export const emitPick = ({ emit, state }) => ({ value = null, visible = false } = {}) => { + const lastEmitValue = JSON.stringify({ value, visible }) + + if (!state.lastEmitValue || state.lastEmitValue !== lastEmitValue) { + state.lastEmitValue = lastEmitValue + emit('pick', value, visible) + } +} + +export const watchValue = ({ api, nextTick }) => (value) => { + if (!value) { + return + } + + nextTick(() => api.scrollToOption()) +} + +export const computItems = ({ api, state }) => () => { + const start = state.start + const end = state.end + const step = state.step + const result = [] + + if (start && end && step) { + let current = start + + while (api.compareTime(current, end) <= 0) { + result.push({ + value: current, + disabled: + api.compareTime(current, state.minTime || DATEPICKER.CompareOne) <= 0 || api.compareTime(current, state.maxTime || DATEPICKER.CompareHundred) >= 0 + }) + + current = api.nextTime(current, step) + } + } + + return result +} + +export const handleClick = (api) => (item) => !item.disabled && api.emitPick({ value: item.value }) + +export const handleClear = ({ api, state }) => () => { + state.defaultValue = '' + state.defaultTime = '' + + api.emitPick() +} + +export const scrollToOption = ({ refs }) => (selector = DATEPICKER.selClass) => { + const menu = refs.popper.querySelector(DATEPICKER.queryClass) + scrollIntoView(menu, menu.querySelector(selector)) +} + +export const handleMenuEnter = ({ api, nextTick, state }) => () => { + const selected = state.items.map((item) => item.value).includes(state.value) + const hasDefault = state.items.map((item) => item.value).includes(state.default) + const option = (selected && DATEPICKER.selClass) || (hasDefault && DATEPICKER.defaultClass) || DATEPICKER.disableClass + + nextTick(() => api.scrollToOption(option)) +} + +export const scrollDown = ({ api, state }) => (step) => { + const items = state.items + const length = items.length + let total = items.length + let index = items.map((item) => item.value).indexOf(state.value) + + while (total--) { + index = (index + step + length) % length + if (!items[index].disabled) { + api.emitPick({ value: items[index].value, visible: true }) + return + } + } +} + +export const isValidValue = (state) => (date) => + state.items + .filter((item) => !item.disabled) + .map((item) => item.value) + .includes(date) + +export const handleKeydown = ({ api }) => (event) => { + const keyCode = event.keyCode + + if (keyCode === 38 || keyCode === 40) { + const mapping = DATEPICKER.MappingKeyCode + const offset = mapping[keyCode.toString()] + + api.scrollDown(offset) + event.stopPropagation() + } +} diff --git a/packages/renderless/src/time-panel/scrollIntoView.ts b/packages/renderless/src/time-panel/scrollIntoView.ts new file mode 100644 index 000000000..fecced108 --- /dev/null +++ b/packages/renderless/src/time-panel/scrollIntoView.ts @@ -0,0 +1,37 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default (container, selected) => { + if (!selected) { + container.scrollTop = 0 + return + } + + const offsetParents = [] + let pointer = selected.offsetParent + + while (pointer && container !== pointer && container.contains(pointer)) { + offsetParents.push(pointer) + pointer = pointer.offsetParent + } + + const top = selected.offsetTop + offsetParents.reduce((prev, curr) => prev + curr.offsetTop, 0) + const bottom = top + selected.offsetHeight + const viewRectTop = container.scrollTop + const viewRectBottom = viewRectTop + container.clientHeight + + if (top < viewRectTop) { + container.scrollTop = top + } else if (bottom > viewRectBottom) { + container.scrollTop = bottom - container.clientHeight + } +} diff --git a/packages/renderless/src/time-panel/vue.ts b/packages/renderless/src/time-panel/vue.ts new file mode 100644 index 000000000..21f92e4bc --- /dev/null +++ b/packages/renderless/src/time-panel/vue.ts @@ -0,0 +1,97 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + handleKeydown, + isValidValue, + scrollDown, + handleMenuEnter, + scrollToOption, + handleClear, + handleClick, + parseTime, + formatTime, + nextTime, + compareTime, + watchValue, + computItems, + emitPick, + emitDestroy +} from './index' +import { DATEPICKER } from '@opentiny/vue-renderless/common' + +export const api = ['state', 'handleMenuEnter', 'handleClick', 'handleClear', 'emitDestroy'] + +const initState = ({ reactive, computed, api }) => { + const { Start, End, Step } = DATEPICKER + + const state = reactive({ + popperClass: '', + start: Start, + end: End, + step: Step, + realValue: '', + defaultValue: '', + defaultTime: '', + visible: false, + minTime: '', + maxTime: '', + width: 0, + lastEmitValue: '', + items: computed(() => api.computItems()), + default: computed(() => state.defaultValue || state.defaultTime || ''), + value: computed({ + get: () => state.realValue || state.default, + set: (value) => { + const valid = state.items.some((item) => item.value === value) + + state.realValue = valid ? value : '' + } + }) + }) + + return state +} + +export const renderless = (props, { computed, reactive, watch, nextTick }, { refs, emit: $emit }) => { + const api = {} + const emit = props.emitter ? props.emitter.emit : $emit + const state = initState({ reactive, computed, api }) + + Object.assign(api, { + state, + parseTime: parseTime(), + formatTime: formatTime(), + isValidValue: isValidValue(state), + scrollToOption: scrollToOption({ refs }), + emitPick: emitPick({ emit, state }), + emitDestroy: emitDestroy(emit), + nextTime: nextTime(api), + compareTime: compareTime(api), + handleClick: handleClick(api), + scrollDown: scrollDown({ api, state }), + handleClear: handleClear({ api, state }), + watchValue: watchValue({ api, nextTick }), + handleKeydown: handleKeydown({ api }), + computItems: computItems({ api, state }), + handleMenuEnter: handleMenuEnter({ api, nextTick, state }) + }) + + watch(() => state.value, api.watchValue) + + watch( + () => state.visible, + () => setTimeout(() => state.fnUpdatePopper && state.fnUpdatePopper()) + ) + + return api +} diff --git a/packages/renderless/src/time-range/index.ts b/packages/renderless/src/time-range/index.ts new file mode 100644 index 000000000..acb11a10b --- /dev/null +++ b/packages/renderless/src/time-range/index.ts @@ -0,0 +1,170 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { clearMilliseconds, timeWithinRange, limitTimeRange, modifyDate } from '@opentiny/vue-renderless/common/deps/date-util' + +export const minTimeOfDay = ({ MIN_TIME }) => (date) => modifyDate(MIN_TIME, date.getFullYear(), date.getMonth(), date.getDate()) + +export const maxTimeOfDay = ({ MAX_TIME }) => (date) => modifyDate(MAX_TIME, date.getFullYear(), date.getMonth(), date.getDate()) + +export const advanceTime = (api) => (date, amount) => new Date(Math.min(date.getTime() + amount, api.maxTimeOfDay(date).getTime())) + +export const compuAmPmMode = (state) => () => { + if ((state.format || '').includes('A')) { + return 'A' + } + if ((state.format || '').includes('a')) { + return 'a' + } + return '' +} + +export const watchValue = ({ api, state }) => (value) => { + if (Array.isArray(value)) { + if (value[0]) { + state.minDate = new Date(value[0]) + } else { + state.minDate = value[1] ? new Date(api.minTimeOfDay(new Date(value[1])).getTime()) : new Date() + } + + if (value[1]) { + state.maxDate = new Date(value[1]) + } else { + state.maxDate = value[0] ? api.advanceTime(new Date(value[0]), 60 * 60 * 1000) : api.advanceTime(new Date(), 60 * 60 * 1000) + } + } else { + if (Array.isArray(state.defaultValue)) { + state.minDate = new Date(state.defaultValue[0]) + state.maxDate = new Date(state.defaultValue[1]) + } else if (state.defaultValue) { + state.minDate = new Date(state.defaultValue) + state.maxDate = api.advanceTime(new Date(state.defaultValue), 60 * 60 * 1000) + } else { + state.minDate = new Date() + state.maxDate = api.advanceTime(new Date(), 60 * 60 * 1000) + } + } +} + +const adjustSpinners = (refs) => { + refs.minSpinner.adjustSpinners() + refs.maxSpinner.adjustSpinners() +} + +const setMaxMinData = (state) => { + if (Array.isArray(state.oldValue)) { + state.oldValue[0] && (state.minDate = clearMilliseconds(state.oldValue[0])) + state.oldValue[1] && (state.maxDate = clearMilliseconds(state.oldValue[1])) + } +} + +export const watchVisible = ({ nextTick, refs, state }) => (value) => { + if (value) { + state.oldValue = state.value + + nextTick(() => { + setMaxMinData(state) + adjustSpinners(refs) + }) + } +} + +export const handleClear = (emit) => () => emit('pick', null) + +export const handleCancel = ({ emit, refs, state }) => () => { + state.visible = false + + emit('pick', state.oldValue) + + setMaxMinData(state) + adjustSpinners(refs) +} + +export const handleMinChange = ({ api, state }) => (date) => { + state.minDate = clearMilliseconds(date) + api.handleChange() +} + +export const handleMaxChange = ({ api, state }) => (date) => { + state.maxDate = clearMilliseconds(date) + api.handleChange() +} + +export const handleChange = ({ api, emit, refs, state }) => () => { + if (api.isValidValue([state.minDate, state.maxDate])) { + refs.minSpinner.state.selectableRange = [[api.minTimeOfDay(state.minDate), state.maxDate]] + refs.maxSpinner.state.selectableRange = [[state.minDate, api.maxTimeOfDay(state.maxDate)]] + + emit('pick', [state.minDate, state.maxDate], state.visible) + } +} + +export const setMinSelectionRange = ({ emit, state }) => (start, end) => { + emit('select-range', start, end, 'min') + state.selectionRange = [start, end] +} + +export const setMaxSelectionRange = ({ emit, state }) => (start, end) => { + emit('select-range', start, end, 'max') + state.selectionRange = [start + state.offset, end + state.offset] +} + +export const handleConfirm = ({ emit, refs, state }) => (visible = false) => { + const minSelectableRange = refs.minSpinner.state.selectableRange + const maxSelectableRange = refs.maxSpinner.state.selectableRange + + state.minDate = limitTimeRange(state.minDate, minSelectableRange, state.format) + state.maxDate = limitTimeRange(state.maxDate, maxSelectableRange, state.format) + + emit('pick', [state.minDate, state.maxDate], visible) +} + +export const changeSelectionRange = ({ refs, state }) => (step) => { + const list = state.showSeconds ? [0, 3, 6, 11, 14, 17] : [0, 3, 8, 11] + const mapping = ['hours', 'minutes'].concat(state.showSeconds ? ['seconds'] : []) + const index = list.indexOf(state.selectionRange[0]) + const next = (index + step + list.length) % list.length + const half = list.length / 2 + + if (next < half) { + refs.minSpinner.emitSelectRange(mapping[next]) + } else { + refs.maxSpinner.emitSelectRange(mapping[next - half]) + } +} + +export const isValidValue = ({ refs, state }) => (date) => + Array.isArray(date) && + timeWithinRange(state.minDate, refs.minSpinner.state.selectableRange) && + timeWithinRange(state.maxDate, refs.maxSpinner.state.selectableRange) + +export const handleKeydown = ({ api, state }) => (event) => { + const keyCode = event.keyCode + const mapping = { 38: -1, 40: 1, 37: -1, 39: 1 } + + // Left or Right + if (keyCode === 37 || keyCode === 39) { + const step = mapping[keyCode] + + api.changeSelectionRange(step) + event.preventDefault() + return + } + + // Up or Down + if (keyCode === 38 || keyCode === 40) { + const step = mapping[keyCode] + + state.spinner.scrollDown(step) + event.preventDefault() + } +} diff --git a/packages/renderless/src/time-range/vue.ts b/packages/renderless/src/time-range/vue.ts new file mode 100644 index 000000000..4a090e1ef --- /dev/null +++ b/packages/renderless/src/time-range/vue.ts @@ -0,0 +1,91 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + handleKeydown, + isValidValue, + changeSelectionRange, + handleConfirm, + setMaxSelectionRange, + setMinSelectionRange, + handleChange, + handleMaxChange, + handleMinChange, + handleCancel, + handleClear, + watchVisible, + watchValue, + minTimeOfDay, + maxTimeOfDay, + advanceTime, + compuAmPmMode +} from './index' +import { parseDate } from '@opentiny/vue-renderless/common/deps/date-util' + +export const api = ['state', 'handleMinChange', 'handleConfirm', 'setMinSelectionRange', 'handleCancel', 'setMaxSelectionRange', 'handleMaxChange'] + +const initState = ({ reactive, computed, refs, api }) => { + const state = reactive({ + popperClass: '', + defaultValue: null, + format: 'HH:mm:ss', + visible: false, + value: [], + oldValue: [new Date(), new Date()], + selectionRange: [0, 2], + arrowControl: false, + maxDate: new Date(), + minDate: new Date(), + showSeconds: computed(() => (state.format || '').includes('ss')), + offset: computed(() => (state.showSeconds ? 11 : 8)), + spinner: computed(() => (state.selectionRange[0] < state.offset ? refs.minSpinner : refs.maxSpinner)), + btnDisabled: computed(() => state.minDate.getTime() > state.maxDate.getTime()), + amPmMode: computed(() => api.compuAmPmMode()) + }) + + return state +} + +export const renderless = (props, { computed, reactive, watch, nextTick }, { t, refs, emit: $emit }) => { + const api = {} + const emit = props.emitter ? props.emitter.emit : $emit + const MIN_TIME = parseDate('00:00:00', 'HH:mm:ss', t) + const MAX_TIME = parseDate('23:59:59', 'HH:mm:ss', t) + const state = initState({ reactive, computed, refs, api }) + + Object.assign(api, { + t, + state, + handleClear: handleClear(emit), + compuAmPmMode: compuAmPmMode(state), + maxTimeOfDay: maxTimeOfDay({ MAX_TIME }), + minTimeOfDay: minTimeOfDay({ MIN_TIME }), + changeSelectionRange: changeSelectionRange({ refs, state }), + setMaxSelectionRange: setMaxSelectionRange({ emit, state }), + setMinSelectionRange: setMinSelectionRange({ emit, state }), + isValidValue: isValidValue({ refs, state }), + handleConfirm: handleConfirm({ emit, refs, state }), + handleCancel: handleCancel({ emit, refs, state }), + watchVisible: watchVisible({ nextTick, refs, state }), + advanceTime: advanceTime(api), + watchValue: watchValue({ api, state }), + handleKeydown: handleKeydown({ api, state }), + handleChange: handleChange({ api, emit, refs, state }), + handleMinChange: handleMinChange({ api, state }), + handleMaxChange: handleMaxChange({ api, state }) + }) + + watch(() => state.value, api.watchValue) + watch(() => state.visible, api.watchVisible) + + return api +} diff --git a/packages/renderless/src/time-spinner/index.ts b/packages/renderless/src/time-spinner/index.ts new file mode 100644 index 000000000..198db09e1 --- /dev/null +++ b/packages/renderless/src/time-spinner/index.ts @@ -0,0 +1,175 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { modifyTime } from '@opentiny/vue-renderless/common/deps/date-util' +import { DATEPICKER } from '@opentiny/vue-renderless/common' + +export const getArrowHourList = (state) => () => { + const hours = state.hours + + return [hours > 0 ? hours - 1 : undefined, hours, hours < 23 ? hours + 1 : undefined] +} + +export const getArrowMinuteList = (state) => () => { + const minutes = state.minutes + + return [minutes > 0 ? minutes - 1 : undefined, minutes, minutes < 59 ? minutes + 1 : undefined] +} + +export const getArrowSecondList = (state) => () => { + const seconds = state.seconds + + return [seconds > 0 ? seconds - 1 : undefined, seconds, seconds < 59 ? seconds + 1 : undefined] +} + +export const increase = (api) => () => api.scrollDown(1) + +export const decrease = (api) => () => api.scrollDown(-1) + +export const modifyDateField = ({ emit, props, state }) => (type, value) => { + if (state[type] === value) { + return + } + + switch (type) { + case 'hours': + emit('change', modifyTime(props.date, value, state.minutes, state.seconds)) + break + case 'minutes': + emit('change', modifyTime(props.date, state.hours, value, state.seconds)) + break + case 'seconds': + emit('change', modifyTime(props.date, state.hours, state.minutes, value)) + break + default: + break + } +} + +export const handleClick = (api) => (type, { value, disabled }) => { + if (!disabled) { + api.modifyDateField(type, value) + api.emitSelectRange(type) + api.adjustSpinner(type, value) + } +} + +export const emitSelectRange = ({ emit, state }) => (type) => { + if (type === 'hours') { + emit('select-range', 0, 2) + } else if (type === 'minutes') { + emit('select-range', 3, 5) + } else if (type === 'seconds') { + emit('select-range', 6, 8) + } + + state.currentScrollbar = type +} + +export const bindScrollEvent = ({ api, refs }) => () => { + const bindFuntion = (type) => { + refs[type].$refs.wrap.onscroll = (e) => { + api.handleScroll(type, e) + } + } + + bindFuntion('hours') + bindFuntion('minutes') + bindFuntion('seconds') +} + +export const handleScroll = ({ api, refs }) => (type) => { + const value = Math.min( + Math.round((refs[type].$refs.wrap.scrollTop - (api.scrollBarHeight(type) * 0.5 - 10) / api.typeItemHeight(type) + 3) / api.typeItemHeight(type)), + type === 'hours' ? 23 : 59 + ) + + api.modifyDateField(type, value) +} + +export const adjustSpinners = ({ api, state }) => () => { + api.adjustSpinner('hours', state.hours) + api.adjustSpinner('minutes', state.minutes) + api.adjustSpinner('seconds', state.seconds) +} + +export const adjustCurrentSpinner = ({ api, state }) => (type) => { + api.adjustSpinner(type, state[type]) +} + +export const adjustSpinner = ({ api, props, refs }) => (type, value) => { + if (props.arrowControl) { + return + } + + const el = refs[type].$refs.wrap + + if (el) { + el.scrollTop = Math.max(0, value * api.typeItemHeight(type)) + } +} + +export const scrollDown = ({ api, state }) => (step) => { + if (!state.currentScrollbar) { + api.emitSelectRange('hours') + } + + const label = state.currentScrollbar + const hoursArr = state.hoursList + let now = state[label] + + if (state.currentScrollbar === 'hours') { + let total = Math.abs(step) + + step = step > 0 ? 1 : -1 + + let length = hoursArr.length + + while (length-- && total) { + now = (now + step + hoursArr.length) % hoursArr.length + + if (!hoursArr[now]) { + total-- + } + } + + if (hoursArr[now]) { + return + } + } else { + now = (now + step + 60) % 60 + } + + api.modifyDateField(label, now) + api.adjustSpinner(label, now) +} + +export const amPm = (props) => (hour) => { + let shouldShowAmPm = props.amPmMode.toLowerCase() === 'a' + + if (!shouldShowAmPm) { + return '' + } + + let isCapital = props.amPmMode === 'A' + let content = hour < 12 ? ' am' : ' pm' + + if (isCapital) { + content = content.toUpperCase() + } + + return content +} + +export const typeItemHeight = ({ refs }) => (type) => refs[type].$el.querySelector(DATEPICKER.Qurtyli).offsetHeight + +export const scrollBarHeight = (refs) => (type) => refs[type].$el.offsetHeight diff --git a/packages/renderless/src/time-spinner/vue.ts b/packages/renderless/src/time-spinner/vue.ts new file mode 100644 index 000000000..7fa205296 --- /dev/null +++ b/packages/renderless/src/time-spinner/vue.ts @@ -0,0 +1,100 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + getArrowHourList, + getArrowMinuteList, + bindScrollEvent, + typeItemHeight, + scrollBarHeight, + amPm, + scrollDown, + adjustSpinners, + adjustSpinner, + adjustCurrentSpinner, + handleScroll, + getArrowSecondList, + increase, + decrease, + modifyDateField, + handleClick, + emitSelectRange +} from './index' +import { getRangeHours, getRangeMinutes } from '@opentiny/vue-renderless/common/deps/date-util' + +export const api = ['state', 'emitSelectRange', 'adjustCurrentSpinner', 'handleClick', 'decrease', 'increase', 'amPm', 'adjustSpinners'] + +const initState = ({ reactive, computed, props, api }) => { + const state = reactive({ + selectableRange: [], + currentScrollbar: null, + hours: computed(() => props.date.getHours()), + minutes: computed(() => props.date.getMinutes()), + seconds: computed(() => props.date.getSeconds()), + hoursList: computed(() => getRangeHours(state.selectableRange)), + minutesList: computed(() => getRangeMinutes(state.selectableRange, state.hours)), + arrowHourList: computed(() => api.getArrowHourList()), + arrowMinuteList: computed(() => api.getArrowMinuteList()), + arrowSecondList: computed(() => api.getArrowSecondList()), + animationName: '' + }) + + return state +} + +export const renderless = (props, { computed, onMounted, reactive, watch, nextTick }, { emit, refs, constants }) => { + const api = {} + const state = initState({ reactive, computed, props, api }) + + onMounted(() => { + !props.arrowControl && api.bindScrollEvent() + }) + + Object.assign(api, { + state, + amPm: amPm(props), + typeItemHeight: typeItemHeight({ refs }), + scrollBarHeight: scrollBarHeight(refs), + getArrowHourList: getArrowHourList(state), + getArrowSecondList: getArrowSecondList(state), + getArrowMinuteList: getArrowMinuteList(state), + emitSelectRange: emitSelectRange({ emit, state }), + modifyDateField: modifyDateField({ emit, props, state }), + bindScrollEvent: bindScrollEvent({ api, refs }), + adjustSpinners: adjustSpinners({ api, state }), + adjustSpinner: adjustSpinner({ api, props, refs }), + increase: increase(api), + decrease: decrease(api), + handleClick: handleClick(api), + scrollDown: scrollDown({ api, state }), + handleScroll: handleScroll({ api, refs }), + adjustCurrentSpinner: adjustCurrentSpinner({ api, state }) + }) + + watch( + () => props.date, + () => { + nextTick(api.adjustSpinners) + }, + { immediate: true } + ) + + watch( + () => state.hoursList, + () => { + state.animationName = constants.ANIMATIONNAME + }, + { immediate: true } + ) + + return api +} diff --git a/packages/renderless/src/time/index.ts b/packages/renderless/src/time/index.ts new file mode 100644 index 000000000..f830b675f --- /dev/null +++ b/packages/renderless/src/time/index.ts @@ -0,0 +1,106 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { limitTimeRange, clearMilliseconds, timeWithinRange } from '@opentiny/vue-renderless/common/deps/date-util' + +export const watchValue = ({ api, nextTick, state }) => (value) => { + let date + + if (value instanceof Date) { + date = limitTimeRange(value, state.selectableRange, state.format) + } else if (!value) { + date = state.defaultValue ? new Date(state.defaultValue) : new Date() + } + + state.date = date + + if (state.visible && state.needInitAdjust) { + nextTick(() => api.adjustSpinners()) + + state.needInitAdjust = false + } +} + +export const watchVisible = ({ nextTick, refs, state }) => (value) => { + if (value) { + state.oldValue = state.value + + nextTick(() => refs.spinner.emitSelectRange('hours')) + } else { + state.needInitAdjust = true + } +} + +export const handleCancel = ({ state, emit }) => () => { + emit('pick', state.oldValue, false) +} + +export const handleChange = ({ api, state, emit }) => (date) => { + if (state.visible) { + state.date = clearMilliseconds(date) + + if (api.isValidValue(state.date)) { + emit('pick', state.date, true) + } + } +} + +export const setSelectionRange = ({ state, emit }) => (start, end) => { + emit('select-range', start, end) + state.selectionRange = [start, end] +} + +export const handleConfirm = ({ state, emit }) => (visible = false, first = null) => { + if (first) { + return + } + + const date = clearMilliseconds(limitTimeRange(state.date, state.selectableRange, state.format)) + + emit('pick', date, visible, first) +} + +export const handleKeydown = ({ api, refs }) => (event) => { + const mapping = { 38: -1, 40: 1, 37: -1, 39: 1 } + const keyCode = event.keyCode + + if (keyCode === 37 || keyCode === 39) { + const key = mapping[keyCode] + + api.changeSelectionRange(key) + + event.preventDefault() + return + } + + // Up or Down + if (keyCode === 38 || keyCode === 40) { + const key = mapping[keyCode] + + refs.spinner.scrollDown(key) + + event.preventDefault() + } +} + +export const isValidValue = ({ state }) => (date) => timeWithinRange(date, state.selectableRange, state.format) + +export const adjustSpinners = (refs) => () => refs.spinner.adjustSpinners() + +export const changeSelectionRange = ({ refs, state }) => (step) => { + const list = [0, 3].concat(state.showSeconds ? [6] : []) + const mapping = ['hours', 'minutes'].concat(state.showSeconds ? ['seconds'] : []) + const index = list.indexOf(state.selectionRange[0]) + const next = (index + step + list.length) % list.length + + refs.spinner.emitSelectRange(mapping[next]) +} diff --git a/packages/renderless/src/time/vue.ts b/packages/renderless/src/time/vue.ts new file mode 100644 index 000000000..a430713af --- /dev/null +++ b/packages/renderless/src/time/vue.ts @@ -0,0 +1,100 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + changeSelectionRange, + adjustSpinners, + isValidValue, + handleKeydown, + watchValue, + watchVisible, + handleCancel, + handleChange, + setSelectionRange, + handleConfirm +} from './index' +import { compuAmPmMode } from '@opentiny/vue-renderless/time-range' +import { isDate } from '@opentiny/vue-renderless/common/deps/date-util' + +export const api = ['state', 'handleChange', 'setSelectionRange', 'handleCancel', 'handleConfirm', 'adjustSpinners'] + +const initState = ({ reactive, props, computed, api }) => { + const state = reactive({ + popperClass: '', + format: 'HH:mm:ss', + value: '', + defaultValue: null, + date: props.value || new Date(), + oldValue: new Date(), + selectableRange: [], + selectionRange: [0, 2], + disabled: false, + arrowControl: false, + visible: false, + needInitAdjust: true, + showSeconds: computed(() => (state.format || '').includes('ss')), + useArrow: computed(() => state.arrowControl || props.timeArrowControl || false), + amPmMode: computed(() => api.compuAmPmMode()) + }) + + return state +} + +export const renderless = (props, { computed, onMounted, reactive, watch, nextTick }, { t, emit: $emit, refs }) => { + const api = {} + const emit = props.emitter ? props.emitter.emit : $emit + const state = initState({ reactive, props, computed, api }) + + Object.assign(api, { + t, + state, + compuAmPmMode: compuAmPmMode(state), + adjustSpinners: adjustSpinners(refs), + handleCancel: handleCancel({ state, emit }), + setSelectionRange: setSelectionRange({ state, emit }), + watchVisible: watchVisible({ nextTick, refs, state }), + isValidValue: isValidValue({ state }), + changeSelectionRange: changeSelectionRange({ refs, state }), + handleConfirm: handleConfirm({ state, emit }), + handleKeydown: handleKeydown({ api, refs }), + handleChange: handleChange({ api, emit, state }), + watchValue: watchValue({ api, emit, nextTick, state }) + }) + + watch(() => state.value, api.watchValue) + + watch( + () => props.show, + (value) => { + state.visible = value + }, + { immediate: true } + ) + + watch( + () => state.selectableRange, + (value) => (refs.spinner.state.selectableRange = value) + ) + + watch( + () => state.defaultValue, + (value) => !isDate(state.value) && (state.date = value ? new Date(value) : new Date()) + ) + + onMounted(() => { + api.handleConfirm(true, true) + }) + + watch(() => state.visible, api.watchVisible) + + return api +} diff --git a/packages/renderless/src/toggle-menu/index.ts b/packages/renderless/src/toggle-menu/index.ts new file mode 100644 index 000000000..14db69620 --- /dev/null +++ b/packages/renderless/src/toggle-menu/index.ts @@ -0,0 +1,97 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { xss } from '@opentiny/vue-renderless/common/xss.js' +import { isObject } from '@opentiny/vue-renderless/common/type' + +export const filterNode = (props) => (value, data) => { + const node = data[props.props.label || 'label'] || '' + + return node.includes(value) +} + +export const searchNodeText = ({ state, refs, nextTick }) => () => { + nextTick(() => refs.tree.filter(state.filterText)) +} + +export const hideNodeText = (state) => () => { + if (state.toggleIcon && state.showNode) { + state.toggleIcon = false + state.showNode = false + } else { + state.toggleIcon = true + state.showNode = true + } +} + +export const initData = ({ state, props, service, api }) => () => { + if (props.data) { + state.datas = props.data + return + } + + // deprecated v3.4.0废弃, v3.16.0移除;移除原因:如果是同步数据则和:data功能重复 + if (typeof service.getMenuDataSync === 'function') { + const menuData = service.getMenuDataSync() + state.datas = api.setMenuKey({ newData: [], menuData }) + } else if (typeof service.getMenuDataAsync === 'function') { + const asyncMenuData = service.getMenuDataAsync() + if (isObject(asyncMenuData) && asyncMenuData.then) { + asyncMenuData.then((data) => { + state.datas = api.setMenuKey({ newData: [], menuData: data }) + }) + } + } +} + +export const computedPlaceholder = ({ constants, props, t }) => () => props.placeholder || t(constants.LOCALE_PLACEHOLDER) + +export const nodeClick = (emit) => (nodeData, node) => { + emit('node-click', nodeData, node) +} + +export const nodeExpand = (emit) => (nodeData, node, instance) => { + emit('node-expand', nodeData, node, instance) +} + +export const nodeDragStart = (emit) => (node, event) => { + emit('node-drag-start', node, event) +} + +export const nodeCollapse = (emit) => (nodeData, node) => { + emit('node-collapse', nodeData, node) +} + +export const nodeDragEnter = (emit) => (dragNode, dropNode, event) => { + emit('node-drag-enter', dragNode, dropNode, event) +} + +export const nodeDragOver = (emit) => (dragNode, dropNode, event) => { + emit('node-drag-over', dragNode, dropNode, event) +} + +export const nodeDragLeave = (emit) => (dragNode, dropNode, event) => { + emit('node-drag-leave', dragNode, dropNode, event) +} + +export const nodeDragEnd = (emit) => (dragNode, dropNode, dropType, event) => { + emit('node-drag-end', dragNode, dropNode, dropType, event) +} + +export const nodeDrop = (emit) => (dragNode, dropNode, dropType, event) => { + emit('node-drop', dragNode, dropNode, dropType, event) +} + +export const clickA = (href) => { + href = xss.filterUrl(href) + return href && (location.href = href) +} diff --git a/packages/renderless/src/toggle-menu/vue.ts b/packages/renderless/src/toggle-menu/vue.ts new file mode 100644 index 000000000..b90596501 --- /dev/null +++ b/packages/renderless/src/toggle-menu/vue.ts @@ -0,0 +1,100 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { + initData, + computedPlaceholder, + hideNodeText, + filterNode, + searchNodeText, + nodeClick, + nodeExpand, + nodeCollapse, + nodeDragEnd, + nodeDragEnter, + nodeDragLeave, + nodeDragOver, + nodeDragStart, + nodeDrop, + clickA +} from './index' +import { setMenuKey } from '@opentiny/vue-renderless/tree-menu' + +export const api = [ + 'state', + 'setMenuKey', + 'initData', + 'hideNodeText', + 'filterNode', + 'searchNodeText', + 'nodeClick', + 'nodeExpand', + 'nodeCollapse', + 'nodeDragEnd', + 'nodeDragEnter', + 'nodeDragLeave', + 'nodeDragOver', + 'nodeDragStart', + 'nodeDrop', + 'clickA' +] + +export const renderless = (props, { reactive, watch, computed, onMounted }, { t, service, nextTick, constants, emit, refs }) => { + const api = {} + + const state = reactive({ + datas: [], + toggleIcon: true, + showNode: true, + filterText: '', + placeholder: computed(() => api.computedPlaceholder()) + }) + + service = service || { base: {} } + service = { + getMenuDataSync: props.getMenuDataSync || service.base.getMenuDataSync, // deprecated v3.4.0废弃, v3.16.0移除;移除原因:如果是同步数据则和:data功能重复 + getMenuDataAsync: props.getMenuDataAsync + } + + Object.assign(api, { + state, + clickA, + nodeDrop: nodeDrop(emit), + filterNode: filterNode(props), + nodeClick: nodeClick(emit), + nodeExpand: nodeExpand(emit), + nodeDragEnd: nodeDragEnd(emit), + hideNodeText: hideNodeText(state), + nodeDragOver: nodeDragOver(emit), + nodeCollapse: nodeCollapse(emit), + nodeDragStart: nodeDragStart(emit), + nodeDragLeave: nodeDragLeave(emit), + nodeDragEnter: nodeDragEnter(emit), + searchNodeText: searchNodeText({ state, refs, nextTick }), + computedPlaceholder: computedPlaceholder({ constants, props, t }), + setMenuKey: setMenuKey(api), + initData: initData({ state, props, service, api }) + }) + + watch( + () => state.filterText, + (value) => { + if (props.automaticFiltering) { + nextTick(() => refs.tree.filter(value)) + } + } + ) + + onMounted(api.initData) + + return api +} diff --git a/packages/renderless/src/tooltip/index.ts b/packages/renderless/src/tooltip/index.ts new file mode 100644 index 000000000..994ddf4b5 --- /dev/null +++ b/packages/renderless/src/tooltip/index.ts @@ -0,0 +1,173 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import debounce from '@opentiny/vue-renderless/common/deps/debounce' +import { on, off, addClass, removeClass } from '@opentiny/vue-renderless/common/deps/dom' + +export const show = ({ api, state, props }) => () => { + // 如果指定autoMode='auto', 则只有超长时,才显示tip。 + if (props.visible === 'auto') { + const { clientWidth, scrollWidth } = state.referenceElm + if (scrollWidth <= clientWidth) { + return + } + } + api.setExpectedState(true) + api.handleShowPopper() +} + +export const hide = (api) => () => { + api.setExpectedState(false) + api.debounceClose() +} + +export const handleFocus = ({ api, state }) => () => { + state.focusing = true + api.show() +} +export const handleBlur = ({ api, state }) => () => { + state.focusing = false + api.hide() +} + +export const removeFocusing = (state) => () => { + state.focusing = false +} + +export const handleShowPopper = ({ props, state }) => () => { + if (!state.expectedState || props.manual) { + return + } + + clearTimeout(state.timeout) + + state.timeout = setTimeout(() => { + state.showPopper = true + }, props.openDelay) + + if (props.hideAfter > 0) { + state.timeoutPending = setTimeout(() => { + state.showPopper = false + }, props.hideAfter) + } +} + +export const handleClosePopper = ({ api, props, state }) => () => { + if ((props.enterable && state.expectedState) || props.manual) { + return + } + + clearTimeout(state.timeout) + + if (state.timeoutPending) { + clearTimeout(state.timeoutPending) + } + + state.showPopper = false + + if (props.disabled) { + api.doDestroy() + } +} + +export const setExpectedState = ({ api, state }) => (value) => { + if (state.expectedState === false) { + clearTimeout(api.timeoutPending) + } + + state.expectedState = value +} + +/* istanbul ignore next */ +export const destroyed = ({ state, api }) => () => { + const reference = state.referenceElm + + state.showPopper = false + + if (reference && reference.nodeType === 1) { + off(reference, 'mouseenter', api.show) + off(reference, 'mouseleave', api.hide) + off(reference, 'focus', api.focusHandler) + off(reference, 'blur', api.handleBlur) + off(reference, 'click', api.removeFocusing) + } +} + +export const debounceClose = ({ api, props }) => + debounce(props.closeDelay, () => { + api.handleClosePopper() + }) + +/* istanbul ignore next */ +export const watchFocusing = (state) => (value) => { + if (value) { + addClass(state.referenceElm, 'focusing') + } else { + removeClass(state.referenceElm, 'focusing') + } +} + +export const focusHandler = ({ slots, api }) => () => { + if (!slots.default || !slots.default().length) { + api.handleFocus() + return + } + + let instance = slots.default()[0] + + // vue2 vnode.elm ,vue3 vnode.el + instance = instance.elm || instance.el + + if (instance && instance.focus) { + instance.focus() + } else { + api.handleFocus() + } +} + +export const bindEvent = ({ api, state, vm }) => (reference) => { + let referenceElm = null + + if (vm.$el.nodeType === 8) { + referenceElm = reference + } else if (vm.$el.nodeType === 1) { + referenceElm = vm.$el + } + + if (!referenceElm || referenceElm.nodeType === 8 || state.referenceElm) { + return + } + + state.referenceElm = referenceElm + referenceElm.setAttribute('aria-describedby', state.tooltipId) + referenceElm.setAttribute('tabindex', state.tabindex) + + on(referenceElm, 'mouseenter', api.show) + on(referenceElm, 'mouseleave', api.hide) + on(referenceElm, 'focus', api.focusHandler) + on(referenceElm, 'blur', api.handleBlur) + on(referenceElm, 'click', api.removeFocusing) +} + +export const bindPopper = ({ vm, refs, nextTick }) => (el) => { + nextTick(() => vm.bindEvent(el)) + + if (vm.popperVM) { + refs.popper || (refs.popper = vm.popperVM.$el) + + nextTick(() => { + if (vm.modelValue) { + vm.updatePopper() + } + }) + } +} diff --git a/packages/renderless/src/tooltip/vue.ts b/packages/renderless/src/tooltip/vue.ts new file mode 100644 index 000000000..ea6a8c848 --- /dev/null +++ b/packages/renderless/src/tooltip/vue.ts @@ -0,0 +1,108 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + bindEvent, + show, + hide, + handleFocus, + handleBlur, + removeFocusing, + handleShowPopper, + handleClosePopper, + setExpectedState, + destroyed, + debounceClose, + watchFocusing, + bindPopper, + focusHandler +} from './index' +import userPopper from '@opentiny/vue-renderless/common/deps/vue-popper' +import { guid } from '@opentiny/vue-renderless/common/string' + +export const api = [ + 'state', + 'bindEvent', + 'hide', + 'show', + 'doDestroy', + 'handleFocus', + 'setExpectedState', + 'debounceClose', + 'handleShowPopper', + 'handleClosePopper', + 'setExpectedState', + 'updatePopper', + 'focusHandler' +] + +const initState = ({ reactive, showPopper, popperElm, referenceElm, props }) => + reactive({ + showPopper, + popperElm, + referenceElm, + timeout: null, + focusing: false, + expectedState: undefined, + mounted: false, + tooltipId: guid('tiny-tooltip-', 4), + tabindex: props.tabindex + }) + +export const renderless = ( + props, + { watch, toRefs, reactive, onBeforeUnmount, onDeactivated, onMounted, onUnmounted }, + { vm, emit, refs, slots, nextTick, parent } +) => { + const api = {} + const popperParam = { emit, props, nextTick, toRefs, reactive, parent, refs } + + Object.assign(popperParam, { slots, onBeforeUnmount, onDeactivated, watch }) + + const { showPopper, updatePopper, popperElm, referenceElm, doDestroy } = userPopper(popperParam) + const state = initState({ reactive, showPopper, popperElm, referenceElm, props }) + + Object.assign(api, { + state, + doDestroy, + updatePopper, + show: show({ api, state, props }), + hide: hide(api), + destroyed: destroyed({ state, api }), + bindPopper: bindPopper({ vm, refs, state, nextTick }), + watchFocusing: watchFocusing(state), + removeFocusing: removeFocusing(state), + handleBlur: handleBlur({ api, state }), + handleFocus: handleFocus({ api, state }), + debounceClose: debounceClose({ api, props }), + setExpectedState: setExpectedState({ api, state }), + handleShowPopper: handleShowPopper({ props, state }), + handleClosePopper: handleClosePopper({ api, props, state }), + bindEvent: bindEvent({ api, state, vm }), + focusHandler: focusHandler({ slots, api }) + }) + + watch(() => state.focusing, api.watchFocusing) + + watch( + () => props.modelValue, + (val) => nextTick(() => props.manual && (state.showPopper = val)) + ) + + onMounted(api.bindPopper) + + vm.$on('tooltip-update', api.bindPopper) + + onUnmounted(api.destroyed) + + return api +} diff --git a/packages/renderless/src/top-box/index.ts b/packages/renderless/src/top-box/index.ts new file mode 100644 index 000000000..6fcac897a --- /dev/null +++ b/packages/renderless/src/top-box/index.ts @@ -0,0 +1,57 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { KEY_CODE } from '@opentiny/vue-renderless/common' +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' +import PopupManager from '@opentiny/vue-renderless/common/deps/popup-manager' + +export const handleAfterLeave = (api) => () => api.destroy() + +export const destroy = (parent) => () => { + parent.$el.parentNode.removeChild(parent.$el) +} + +export const bindKeyDown = ({ api, state }) => (event) => { + if (event.keyCode === KEY_CODE.Escape) { + !state.closed && api.close() + } +} + +export const bindEvent = ({ api }) => () => on(document, 'keydown', api.bindKeyDown) + +export const unBindEvent = ({ api }) => () => off(document, 'keydown', api.bindKeyDown) + +export const startTimer = ({ api, state }) => () => { + if (state.duration > 0) { + state.timer = setTimeout(() => { + !state.closed && api.close() + }, state.duration) + } +} + +export const clearTimer = (state) => () => clearTimeout(state.timer) + +export const close = (state) => () => { + state.closed = true + typeof state.onClose === 'function' && state.onClose(state) +} + +export const watchClosed = ({ state }) => (value) => value && (state.visible = false) + +export const getZindex = () => PopupManager.nextZIndex() + +export const getTypeClass = ({ constants, state }) => () => { + const typeClass = constants[(state.type || '').toUpperCase()] + return state.type && !state.iconClass && typeClass ? `${typeClass}` : '' +} + +export const getOffsetStyle = ({ state }) => () => ({ top: `${state.verticalOffset}px` }) diff --git a/packages/renderless/src/top-box/vue.ts b/packages/renderless/src/top-box/vue.ts new file mode 100644 index 000000000..fc28c9691 --- /dev/null +++ b/packages/renderless/src/top-box/vue.ts @@ -0,0 +1,63 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { clearTimer, startTimer, close, handleAfterLeave, bindEvent, unBindEvent, destroy, watchClosed, getTypeClass, getOffsetStyle, getZindex } from './index' + +export const api = ['state', 'handleAfterLeave', 'clearTimer', 'startTimer', 'close', 'getZindex'] + +export const renderless = (props, { computed, onBeforeUnmount, onMounted, reactive, watch }, { vm, parent, constants }) => { + const api = {} + const state = reactive({ + timer: null, + message: '', + type: 'info', + iconClass: '', + onClose: null, + closed: false, + center: false, + buttons: null, + duration: 3000, + visible: false, + customClass: '', + showClose: false, + verticalOffset: 20, + dangerouslyUseHTMLString: false, + typeClass: computed(() => api.getTypeClass()), + positionStyle: computed(() => api.getOffsetStyle()) + }) + + Object.assign(api, { + state, + getZindex, + close: close(state), + destroy: destroy(parent), + clearTimer: clearTimer(state), + getOffsetStyle: getOffsetStyle({ state }), + getTypeClass: getTypeClass({ constants, state }), + bindEvent: bindEvent({ api, state }), + startTimer: startTimer({ api, state }), + unBindEvent: unBindEvent({ api, state }), + handleAfterLeave: handleAfterLeave(api), + watchClosed: watchClosed({ api, state }) + }) + + watch(() => state.closed, api.watchClosed, { immediate: true }) + + onMounted(() => { + props.emitter.emit('TopBoxMounted', vm) + api.bindEvent() + }) + + onBeforeUnmount(api.unBindEvent) + + return api +} diff --git a/packages/renderless/src/transfer-panel/index.ts b/packages/renderless/src/transfer-panel/index.ts new file mode 100644 index 000000000..abab71eae --- /dev/null +++ b/packages/renderless/src/transfer-panel/index.ts @@ -0,0 +1,337 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { copyArray } from '@opentiny/vue-renderless/common/object' +import { getFlatData } from '@opentiny/vue-renderless/transfer' + +export const showFilterData = (data, sign) => { + const getChild = (data, sign) => + data.filter((node) => { + if (node.children && node.children.length > 0) { + node.children = getChild(node.children, sign) + } + + return node[sign] + }) + + return getChild(data, sign) +} + +export const getFilterData = ({ api, props, state, Table, Tree }) => () => { + if (state.renderType === Table) { + let tableData = [] + + if (props.filterMethod) { + tableData = props.data.filter((item) => props.filterMethod(state.query, item)) + } else { + tableData = props.data + } + + state.pagerTotal = tableData + + if (props.showPager) { + const pageSize = state.sizes || 10 + const totalPageCount = Math.ceil(tableData.length / pageSize) + + if (state.internalPage > totalPageCount) { + api.handlePageChange(totalPageCount) + } + + if (totalPageCount > 0 && state.internalPage === 0) { + state.internalPage = 1 + } + + if (totalPageCount > 0 && state.currentPage === 0) { + state.currentPage = 1 + } + + return tableData.slice((state.internalPage - 1) * pageSize, pageSize * state.internalPage) + } else { + return tableData + } + } else if (state.renderType === Tree) { + return showFilterData(api.getFilterTreeData(copyArray(props.data)), 'visible') + } else { + return props.data.filter((item) => { + if (typeof props.filterMethod === 'function') { + return props.filterMethod(state.query, item) + } else { + const label = item[state.labelProp] || item[state.keyProp].toString() + + return label.toLowerCase().includes(state.query.toLowerCase()) + } + }) + } +} + +export const getCheckableData = ({ api, state, Tree }) => () => { + if (state.renderType === Tree) { + return api.getTreeCheckableData(state.filteredData) + } else { + return state.filteredData.filter((item) => !item[state.disabledProp]) + } +} + +export const getCheckedSummary = ({ props, state, Tree }) => () => { + const checkedLength = state.checked.length + let dataLength = 0 + + if (state.renderType === Tree) { + dataLength = getFlatData(copyArray(props.data)).length + } else { + dataLength = props.data.length + } + + const { noChecked, hasChecked } = props.format + + if (noChecked && hasChecked) { + return checkedLength > 0 + ? hasChecked.replace(/\${checked}/g, checkedLength).replace(/\${total}/g, dataLength) + : noChecked.replace(/\${checked}/g, checkedLength).replace(/\${total}/g, dataLength) + } else { + return `${checkedLength} / ${dataLength}` + } +} + +export const getDeteminate = (state) => () => state.checked.length > 0 && state.checked.length < state.checkableData.length + +export const watchChecked = ({ api, emit, state }) => ({ value, oldvalue }) => { + api.updateAllChecked() + + if (state.checkChangeByUser) { + const movedKeys = value.concat(oldvalue).filter((v) => !value.includes(v) || !oldvalue.includes(v)) + + emit('checked-change', value, movedKeys) + } else { + emit('checked-change', value) + + state.checkChangeByUser = true + } +} + +export const watchData = ({ api, props, state, Tree }) => (value) => { + state.pagerTotal = value + + const checked = [] + + if (state.renderType === Tree && !props.treeOp.checkStrictly) { + state.checked = api.getStrictData(state.filteredData).keys + } else { + const filteredDataKeys = state.filteredData.map((item) => item[state.keyProp]) + + state.checked.forEach((item) => { + if (filteredDataKeys.includes(item)) { + checked.push(item) + } + }) + + state.checkChangeByUser = false + state.checked = checked + } +} + +export const watchDefaultCheckded = ({ api, props, state, Tree }) => ({ value, oldvalue }) => { + if (oldvalue && value.length === oldvalue.length && value.every((item) => oldvalue.includes(item))) { + return + } + + if (state.renderType === Tree && !props.treeOp.checkStrictly) { + if (!state.render) { + return + } + + state.render.defaultCheckedKeys = state.checked = api.getStrictData(state.filteredData).keys + } else { + const checked = [] + const checkableDataKeys = state.checkableData.map((item) => item[state.keyProp]) + + value.forEach((item) => { + if (checkableDataKeys.includes(item)) { + checked.push(item) + } + }) + + state.checkChangeByUser = false + state.checked = checked + } +} + +export const updateAllChecked = ({ state, Table, Tree }) => () => { + const checkableDataKeys = state.checkableData.map((item) => item[state.keyProp]) + + state.allChecked = checkableDataKeys && checkableDataKeys.length > 0 && checkableDataKeys.every((item) => state.checked.includes(item)) + + if (state.renderType === Table || state.renderType === Tree) { + state.render.data = state.filteredData + + if (state.renderType === Tree) { + state.render.defaultCheckedKeys = state.checked + } else { + const pageCheckedKeys = [] + + state.filteredData.forEach((data) => { + state.checked.includes(data[state.keyProp]) && pageCheckedKeys.push(data[state.keyProp]) + }) + + state.render.defaultChecked = pageCheckedKeys + } + } +} + +export const handleAllCheckedChange = ({ state, Table, Tree, vm }) => (value) => { + state.checked = value ? state.checkableData.map((item) => item[state.keyProp]) : [] + + if (state.renderType === Table) { + state.render.defaultChecked = state.checked + } else if (state.renderType === Tree) { + state.checked.length !== 0 ? (state.render.defaultCheckedKeys = state.checked) : vm.$refs.plugin.setCheckedKeys(state.checked) + } +} + +export const clearQuery = (state) => () => { + if (state.inputIcon === 'circle-close') { + state.query = '' + } +} + +export const checkedEvent = (state) => (value, disabled) => { + if (disabled) { + return + } + + const index = state.checked.indexOf(value) + let tmpArray = [...state.checked] + + if (~index) { + tmpArray.splice(index, 1) + state.checked = tmpArray + } else { + tmpArray.push(value) + state.checked = tmpArray + } +} + +export const setPosition = ({ parent, state }) => (trend, event) => { + event.stopPropagation() + event.preventDefault() + + const checkedKey = [] + const uncheckedKey = [] + + state.filteredData.forEach((item) => { + if (~state.checked.indexOf(item[state.keyProp])) { + checkedKey.push(item[state.keyProp]) + } else { + uncheckedKey.push(item[state.keyProp]) + } + }) + + const result = trend === 'up' ? [...checkedKey, ...uncheckedKey] : [...uncheckedKey, ...checkedKey] + parent.$parent.$emit('update:modelValue', result) +} + +export const selectChange = (state) => (keys) => (state.checked = keys) + +export const handlePageChange = (state) => (currentPage) => { + state.pageChangeData = true + state.internalPage = currentPage + state.currentPage = currentPage +} + +export const getFilterTreeData = ({ props, state }) => (data) => { + const getChild = (data, query) => { + data.forEach((node) => { + const label = node[state.labelProp] + + if (typeof props.treeOp.filterNodeMethod === 'function') { + const result = props.treeOp.filterNodeMethod(state.query, node) + + if (typeof result !== 'boolean') { + node.visible = true + } else { + node.visible = result + } + } else { + node.visible = label.toLowerCase().includes(query.toLowerCase()) + } + + if (node.children && node.children.length > 0) { + getChild(node.children, query) + } + + if (!node.visible && node.children && node.children.length) { + let allHidden = true + + allHidden = !node.children.some((child) => child.visible) + node.visible = allHidden === false + } + }) + } + + getChild(data, state.query) + + return data +} + +export const getTreeCheckableData = (state) => (data) => { + const nodes = [] + + const getChild = (data) => { + data.forEach((node) => { + !node[state.disabledProp] && nodes.push(node) + if (node.children && node.children.length > 0) { + getChild(node.children) + } + }) + } + + getChild(data) + + return nodes +} + +export const getStrictData = ({ props, state }) => (data) => { + const keys = [] + + const strictData = (data, isStrict) => { + data.forEach((node) => { + if (props.defaultChecked.includes(node[state.keyProp])) { + node.isCheckable = true + keys.push(node[state.keyProp]) + } else { + node.isCheckable = isStrict + isStrict && keys.push(node[state.keyProp]) + } + + if (node.children && node.children.length > 0) { + strictData(node.children, node.isCheckable) + } + }) + } + + strictData(data, false) + + return { data, keys } +} + +export const sizesChange = (state) => (sizes) => (state.sizes = sizes) + +export const setExpandCache = (state) => (node, expand) => { + const { expanded, keyProp } = state + const index = state.expanded.indexOf(node[keyProp]) + + if (expand) { + index === -1 && expanded.push(node[keyProp]) + } else { + index !== -1 && expanded.splice(index, 1) + } +} diff --git a/packages/renderless/src/transfer-panel/vue.ts b/packages/renderless/src/transfer-panel/vue.ts new file mode 100644 index 000000000..379d7e370 --- /dev/null +++ b/packages/renderless/src/transfer-panel/vue.ts @@ -0,0 +1,173 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + getStrictData, + sizesChange, + getTreeCheckableData, + getFilterTreeData, + getFilterData, + getCheckableData, + checkedEvent, + watchData, + getCheckedSummary, + getDeteminate, + watchChecked, + watchDefaultCheckded, + updateAllChecked, + handleAllCheckedChange, + clearQuery, + setPosition, + selectChange, + handlePageChange, + setExpandCache +} from './index' + +export const api = [ + 'markRaw', + 'toRaw', + 'state', + 'check', + 'sizesChange', + 'clearQuery', + 'handleAllCheckedChange', + 'checkedEvent', + 'setPosition', + 'selectChange', + 'handlePageChange' +] + +const initState = ({ reactive, props, parent, computed, api, slots }) => { + const state = reactive({ + query: '', + checked: [], + allChecked: false, + inputHover: false, + internalPage: props.pagerOp.pageVO.currentPage || 1, + pagerTotal: 0, + pageChangeData: parent.state.isToLeft, + currentPage: props.pagerOp.pageVO.currentPage || 1, + sizes: props.pagerOp && props.pagerOp.pageVO.pageSize, + render: {}, + checkChangeByUser: true, + filteredData: computed(() => api.getFilterData()), + checkableData: computed(() => api.getCheckableData()), + checkedSummary: computed(() => api.getCheckedSummary()), + isIndeterminate: computed(() => api.getDeteminate()), + hasNoMatch: computed(() => state.query.length > 0 && state.filteredData.length === 0), + inputIcon: computed(() => (state.query.length > 0 && state.inputHover ? 'circle-close' : 'search')), + labelProp: computed(() => props.props.label || 'label'), + keyProp: computed(() => props.props.key || 'key'), + disabledProp: computed(() => props.props.disabled || 'disabled'), + childrenProp: computed(() => (props.treeOp && props.treeOp.props && props.treeOp.props.childern) || 'children'), + hasFooter: computed(() => (!!parent.slots['left-footer'] || !!parent.slots['right-footer']) && !!slots.default), + renderType: computed(() => props.render && props.render.plugin.name), + expanded: [] + }) + + return state +} + +const initStateRender = ({ reactive, state, props, api }) => + reactive({ + keys: state.keyProp, + data: [], + defaultChecked: state.checked, + defaultExpandedKeys: state.expanded, + columns: props.columns, + ...props.treeOp, + on: { + 'checked-change': (selected, isAll) => { + api.selectChange(selected, isAll) + }, + check: (data, { checkedKeys }) => { + state.checked = checkedKeys + }, + 'node-expand': (node) => api.setExpandCache(node, true), + 'node-collapse': (node) => api.setExpandCache(node, false) + } + }) + +const initWatcher = ({ watch, state, api, props, Table }) => { + watch( + () => state.checked, + (value, oldvalue) => api.watchChecked({ value, oldvalue }) + ) + + watch( + () => props.pagerOp.pageVO.currentPage, + (value) => { + state.currentPage = value + }, + { deep: true, immediate: true } + ) + + watch(() => props.data, api.watchData, { immediate: true }) + + watch(() => state.checkableData, api.updateAllChecked) + + watch( + () => props.defaultChecked, + (value, oldvalue) => api.watchDefaultCheckded({ value, oldvalue }), + { immediate: true } + ) + + watch( + () => props.isToLeft, + () => { + if (state.renderType === Table) { + state.internalPage = 1 + state.currentPage = 1 + state.render.data = state.filteredData + } + } + ) +} + +export const renderless = (props, { computed, reactive, watch, toRaw, markRaw }, { $prefix, t, emit, parent, nextTick, refs, vm, slots }) => { + const api = {} + const Table = $prefix + 'Table' + const Tree = $prefix + 'Tree' + const state = initState({ reactive, props, parent, computed, api, slots }) + + Object.assign(api, { + t, + state, + toRaw, + markRaw, + sizesChange: sizesChange(state), + setPosition: setPosition({ parent, state }), + selectChange: selectChange(state), + handlePageChange: handlePageChange(state), + clearQuery: clearQuery(state), + checkedEvent: checkedEvent(state), + getDeteminate: getDeteminate(state), + updateAllChecked: updateAllChecked({ state, Table, Tree }), + handleAllCheckedChange: handleAllCheckedChange({ nextTick, props, state, Table, Tree, vm }), + getCheckedSummary: getCheckedSummary({ props, state, Tree }), + getFilterTreeData: getFilterTreeData({ props, state }), + getTreeCheckableData: getTreeCheckableData(state), + getStrictData: getStrictData({ props, state }), + setExpandCache: setExpandCache(state), + getCheckableData: getCheckableData({ api, state, Tree }), + getFilterData: getFilterData({ api, parent, props, refs, state, Table, Tree }), + watchData: watchData({ api, props, state, Tree }), + watchDefaultCheckded: watchDefaultCheckded({ api, props, state, Tree }), + watchChecked: watchChecked({ api, emit, state }) + }) + + state.render = initStateRender({ reactive, state, props, api }) + + initWatcher({ watch, state, api, props, Table }) + + return api +} diff --git a/packages/renderless/src/transfer/index.ts b/packages/renderless/src/transfer/index.ts new file mode 100644 index 000000000..97d86367b --- /dev/null +++ b/packages/renderless/src/transfer/index.ts @@ -0,0 +1,280 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { copyArray } from '@opentiny/vue-renderless/common/object' + +export const getObj = (props) => () => props.data.reduce((o, cur) => (o[cur[props.props.key]] = cur) && o, {}) + +export const getSourceData = ({ props, Tree }) => () => { + if (props.render && props.render.plugin.name === Tree) { + return props.data + } + + return props.data.filter((item) => !props.modelValue.includes(item[props.props.key])) +} + +export const getFlatData = (data, hasChildren) => { + const nodes = [] + + const getChild = (data) => { + data.forEach((node) => { + nodes.push(node) + if (node.children && node.children.length > 0) { + getChild(node.children) + } + }) + } + + getChild(data) + + if (hasChildren) { + nodes.forEach((item) => { + if (item.children) { + delete item.children + } + }) + } + + return nodes +} + +export const getTargetData = ({ order, props, state, Tree, Table }) => () => { + if (props.render && props.render.plugin.name === Tree) { + const nodes = getFlatData(copyArray(props.data), true) + + const rightData = nodes.filter((item) => props.modelValue.includes(item[props.props.key])) + + const sortAry = [] + + props.modelValue.forEach((value) => { + sortAry.push(rightData.filter((item) => item[props.props.key] === value)[0]) + }) + + sortAry.flag = 'sort' + + return sortAry + } + + if (props.targetOrder === order) { + return props.data.filter((item) => props.modelValue.includes(item[props.props.key])) + } else { + const data = props.modelValue.reduce((arr, cur) => { + const val = state.dataObj[cur] + + if (val) { + arr.push(val) + } + + return arr + }, []) + + if (props.render && props.render.plugin.name === Table) { + data.flag = 'table' + } + + return data + } +} + +export const onSourceCheckedChange = ({ emit, state }) => (val, movedKeys) => { + state.leftChecked = val + + if (movedKeys === undefined) { + return + } + + emit('left-check-change', val, movedKeys) +} + +export const onTargetCheckedChange = ({ emit, state }) => (val, movedKeys) => { + state.rightChecked = val + + if (movedKeys === undefined) { + return + } + + emit('right-check-change', val, movedKeys) +} + +export const addToLeft = ({ emit, props, state }) => (value) => { + const change = () => { + state.isToLeft = true + + let currentValue = props.modelValue.slice() + + if (value === 'all') { + state.rightChecked = state.rightData.map((item) => item[props.props.key]) + } + + state.rightChecked.forEach((item) => { + const index = currentValue.indexOf(item) + + if (index > -1) { + currentValue.splice(index, 1) + } + }) + + state.rightChecked = state.rightChecked.slice(0) + + emit('update:modelValue', currentValue) + emit('change', currentValue, 'left', state.rightChecked) + } + + props.beforeTransfer ? props.beforeTransfer(change) : change() +} + +export const addToRight = ({ emit, refs, props, state, Tree }) => (value) => { + const change = () => { + state.isToLeft = false + + let currentValue = props.modelValue.slice() + const itemsToBeMoved = [] + const key = props.props.key + + if (props.render && props.render.plugin.name === Tree) { + if (!props.treeOp.checkStrictly) { + currentValue = refs.leftPanel.$refs.plugin.getCheckedKeys() + } else { + state.leftChecked.forEach((item) => !currentValue.includes(item) && currentValue.push(item)) + } + } else { + if (value === 'all') { + state.leftData.forEach((item) => { + const itemKey = item[key] + + if (!props.modelValue.includes(itemKey)) { + itemsToBeMoved.push(itemKey) + } + }) + + state.leftChecked = itemsToBeMoved.slice() + } else { + props.data.forEach((item) => { + const itemKey = item[key] + + if (state.leftChecked.includes(itemKey) && !props.modelValue.includes(itemKey)) { + itemsToBeMoved.push(itemKey) + } + }) + } + + currentValue = props.targetOrder === 'unshift' ? itemsToBeMoved.concat(currentValue) : currentValue.concat(itemsToBeMoved) + } + + state.rightDisabled = false + + emit('update:modelValue', currentValue) + emit('change', currentValue, 'right', state.leftChecked) + } + + props.beforeTransfer ? props.beforeTransfer(change) : change() +} + +export const clearQuery = (refs) => (which) => { + if (which === 'left') { + refs.leftPanel.state.query = '' + } else if (which === 'right') { + refs.rightPanel.state.query = '' + } +} + +export const logicFun = ({ props, emit, state }) => ({ event, isAdd, pullMode }) => { + let currentValue = props.modelValue.slice() + let movedKeys = [] + + if (pullMode) { + currentValue.splice(event.newIndex, 0, currentValue.splice(event.oldIndex, 1)[0]) + } else { + const key = isAdd ? state.targetData[event.oldIndex][props.props.key] : state.sourceData[event.oldIndex][props.props.key] + const index = isAdd ? state.rightChecked.indexOf(key) : state.leftChecked.indexOf(key) + const valueIndex = currentValue.indexOf(key) + + if (isAdd) { + ~valueIndex && currentValue.splice(valueIndex, 1) + } else { + !~valueIndex && currentValue.splice(event.newIndex, 0, key) + } + + if (~index) { + isAdd ? state.rightChecked.splice(index, 1) : state.leftChecked.splice(index, 1) + } + + movedKeys = [key] + } + + state.rightChecked = state.rightChecked.slice(0) + + emit('update:modelValue', currentValue) + emit('change', currentValue, 'left', movedKeys) +} + +export const sortableEvent = ({ api, droppanel, props, queryDom, refs }) => () => { + if (props.dropConfig) { + const leftPanel = refs.leftPanel.$el.querySelector(droppanel) + const Sortable = props.dropConfig.plugin + + new Sortable(leftPanel, { + group: 'sorting', + handle: queryDom, + sort: false, + filter: '.is-disabled', + onAdd(event) { + api.logicFun({ event, isAdd: true }) + }, + onRemove(event) { + api.logicFun({ event, isAdd: false }) + } + }) + + const rightPanle = refs.rightPanel.$el.querySelector(droppanel) + + new Sortable(rightPanle, { + group: 'sorting', + handle: queryDom, + sort: true, + filter: '.is-disabled', + onUpdate(event) { + if (event.pullMode) { + return + } + + api.logicFun({ event, pullMode: 'sort' }) + } + }) + } +} + +export const getLeftCheckedData = ({ props, state }) => () => state.sourceData.filter((item) => !item[props.props.disabled]) + +export const getRightCheckedData = ({ props, state }) => () => state.targetData.filter((item) => !item[props.props.disabled]) + +export const recursiveData = ({ api, props, state }) => (data, isCasader, sign) => { + const propChildren = (props.treeOp && props.treeOp.props && props.treeOp.props.children) || 'children' + const values = props.modelValue.slice() + const key = props.props.key + + data.forEach((obj) => { + const isChecked = ~values.indexOf(obj[key]) + + if (sign && !isCasader) { + state.treeData.push(obj) + } else { + if (isChecked) { + state.treeData.push(obj) + } + } + + if (obj[propChildren] && obj[propChildren].length > 0) { + api.recursiveData(obj[propChildren], isCasader, !!isChecked) + } + }) +} diff --git a/packages/renderless/src/transfer/vue.ts b/packages/renderless/src/transfer/vue.ts new file mode 100644 index 000000000..004beda13 --- /dev/null +++ b/packages/renderless/src/transfer/vue.ts @@ -0,0 +1,85 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + getObj, + getSourceData, + recursiveData, + getLeftCheckedData, + getRightCheckedData, + getTargetData, + logicFun, + onSourceCheckedChange, + onTargetCheckedChange, + addToLeft, + addToRight, + clearQuery, + sortableEvent +} from './index' + +export const api = ['state', 'onSourceCheckedChange', 'onTargetCheckedChange', 'addToLeft', 'addToRight', 'clearQuery'] + +const initState = ({ reactive, computed, api, props, h, slots }) => + reactive({ + leftChecked: [], + rightChecked: [], + rightData: computed(() => api.getRightCheckedData()), + leftData: computed(() => api.getLeftCheckedData()), + dataObj: computed(() => api.getObj()), + sourceData: computed(() => api.getSourceData()), + targetData: computed(() => api.getTargetData()), + hasButtonTexts: computed(() => props.buttonTexts.length === 2), + treeData: [], + sourceTreeData: [], + isToLeft: false, + optionRender: computed(() => (option) => { + if (props.renderContent) { + return props.renderContent(h, option) + } + + if (slots.default) { + return slots.default({ option }) + } + + return h('span', option[props.props.label] || option[props.props.key]) + }) + }) + +export const renderless = (props, { computed, onMounted, reactive, h }, { $prefix, emit, refs, parent, slots }) => { + const api = {} + const Tree = $prefix + 'Tree' + const Table = $prefix + 'Table' + const state = initState({ reactive, computed, api, props, h, slots }) + const { DROPPANEL, TRANSFERPANEL } = parent.$constants + + Object.assign(api, { + state, + $slots: parent.$slots, + getObj: getObj(props), + clearQuery: clearQuery(refs), + getSourceData: getSourceData({ props, Tree }), + addToLeft: addToLeft({ emit, props, state }), + getLeftCheckedData: getLeftCheckedData({ props, state }), + getRightCheckedData: getRightCheckedData({ props, state }), + addToRight: addToRight({ emit, refs, props, state, Tree }), + onTargetCheckedChange: onTargetCheckedChange({ emit, state }), + onSourceCheckedChange: onSourceCheckedChange({ emit, state }), + logicFun: logicFun({ props, emit, state }), + getTargetData: getTargetData({ props, state, order: parent.TARGETORDER, Tree, Table }), + recursiveData: recursiveData({ api, props, state }), + sortableEvent: sortableEvent({ api, droppanel: DROPPANEL, props, queryDom: TRANSFERPANEL, refs, state }) + }) + + onMounted(api.sortableEvent) + + return api +} diff --git a/packages/renderless/src/tree-menu/index.ts b/packages/renderless/src/tree-menu/index.ts new file mode 100644 index 000000000..f2b69c8af --- /dev/null +++ b/packages/renderless/src/tree-menu/index.ts @@ -0,0 +1,113 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const initData = ({ state, props, service, api }) => () => { + if (props.data) { + state.data = props.data + return + } + + if (typeof service.getMenuDataSync === 'function') { + const menuData = service.getMenuDataSync() + + state.data = api.setMenuKey({ newData: [], menuData }) + } +} + +export const setMenuKey = (api) => ({ newData, menuData }) => { + Array.isArray(menuData) && + menuData.forEach((data) => { + const item = {} + + Object.keys(data).forEach((key) => { + if (key === 'name') { + item.label = data[key] + } else if (key === 'siteNodeId') { + item.id = data[key] + } else if (key === 'url' && data[key]) { + if (!data[key].includes('#')) { + item[key] = '#/' + data[key] + } else { + item[key] = data[key] + } + } else if (key === 'children' && data[key]) { + item.children = api.setMenuKey({ + newData: [], + menuData: data.children + }) + } else { + item[key] = data[key] + } + }) + + newData.push({ ...data, ...item }) + }) + + return newData +} + +export const filterNode = () => (value, data) => { + if (!value) { + return true + } + return data.label.includes(value) +} + +export const watchFilterText = (refs) => (value) => { + refs.tree.filter(value) +} + +export const nodeDragStart = (emit) => (node, event) => { + emit('node-drag-start', node, event) +} + +export const nodeDragEnter = (emit) => (dragNode, dropNode, event) => { + emit('node-drag-enter', dragNode, dropNode, event) +} + +export const nodeDragOver = (emit) => (dragNode, dropNode, event) => { + emit('node-drag-over', dragNode, dropNode, event) +} + +export const nodeDragEnd = (emit) => (dragNode, dropNode, dropType, event) => { + emit('node-drag-end', dragNode, dropNode, dropType, event) +} + +export const nodeDrop = (emit) => (dragNode, dropNode, dropType, event) => { + emit('node-drop', dragNode, dropNode, dropType, event) +} + +export const nodeExpand = (emit) => (nodeData, node) => { + emit('node-expand', nodeData, node) +} + +export const nodeCollapse = (emit) => (nodeData, node) => { + emit('node-collapse', nodeData, node) +} + +export const nodeClick = (emit) => (nodeData, node) => { + emit('node-click', nodeData, node) +} + +export const checkChange = (emit) => (data, checked, indeterminate) => { + emit('check-change', data, checked, indeterminate) +} + +export const check = (emit) => (data, checkedStatus) => { + emit('check', data, checkedStatus) +} + +export const currentChange = (emit) => (data, node) => { + emit('current-change', data, node) +} + +export const getTitle = (props) => (label) => (props.showTitle ? label : '') diff --git a/packages/renderless/src/tree-menu/vue.ts b/packages/renderless/src/tree-menu/vue.ts new file mode 100644 index 000000000..735eb98cd --- /dev/null +++ b/packages/renderless/src/tree-menu/vue.ts @@ -0,0 +1,93 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + initData, + setMenuKey, + filterNode, + watchFilterText, + nodeDragStart, + nodeDragEnter, + nodeDragOver, + nodeDragEnd, + nodeDrop, + nodeExpand, + nodeCollapse, + nodeClick, + checkChange, + check, + currentChange, + getTitle +} from './index' + +export const api = [ + 'state', + 't', + 'initData', + 'setMenuKey', + 'filterNode', + 'nodeDragStart', + 'nodeDragEnter', + 'nodeDragOver', + 'nodeDragEnd', + 'nodeDrop', + 'nodeExpand', + 'nodeCollapse', + 'nodeClick', + 'checkChange', + 'check', + 'currentChange', + 'getTitle' +] + +export const renderless = (props, { watch, reactive, onMounted }, { t, service, refs, emit }) => { + service = service || { base: {} } + service = { getMenuDataSync: props.getMenuDataSync || service.base.getMenuDataSync } + + const state = reactive({ + data: [], + filterText: '' + }) + + Object.assign(api, { + t, + state, + check: check(emit), + filterNode: filterNode(), + nodeDrop: nodeDrop(emit), + nodeClick: nodeClick(emit), + nodeExpand: nodeExpand(emit), + nodeDragEnd: nodeDragEnd(emit), + checkChange: checkChange(emit), + nodeCollapse: nodeCollapse(emit), + nodeDragOver: nodeDragOver(emit), + nodeDragStart: nodeDragStart(emit), + nodeDragEnter: nodeDragEnter(emit), + currentChange: currentChange(emit), + watchFilterText: watchFilterText(refs), + getTitle: getTitle(props), + setMenuKey: setMenuKey(api), + initData: initData({ state, props, service, api }) + }) + + watch( + () => props.data, + (value) => (state.data = value), + { immediate: true } + ) + + watch(() => state.filterText, api.watchFilterText, { deep: true }) + + onMounted(api.initData) + + return api +} diff --git a/packages/renderless/src/tree-node/index.ts b/packages/renderless/src/tree-node/index.ts new file mode 100644 index 000000000..4bc217e82 --- /dev/null +++ b/packages/renderless/src/tree-node/index.ts @@ -0,0 +1,250 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getNodeKey as getTreeNodeKey } from '@opentiny/vue-renderless/common/deps/tree-model/util' + +export const watchIndeterminate = ({ api, props }) => (value) => api.handleSelectChange(props.node.checked, value) + +export const watchChecked = ({ api, props }) => (value) => api.handleSelectChange(value, props.node.indeterminate) + +export const watchExpanded = ({ state }) => (value) => { + state.expanded = value + + if (value) { + state.childNodeRendered = true + } +} + +export const getNodeKey = (state) => (node) => getTreeNodeKey(state.tree.nodeKey, node.data) + +const getVisibleNodes = (treeNode, tree) => { + if (treeNode.visible) { + const childNodes = treeNode.childNodes + + Object.assign( + tree, + { + checked: treeNode.checked, + expanded: treeNode.expanded, + level: treeNode.level, + isLeaf: treeNode.isLeaf + }, + treeNode.data, + { children: [] } + ) + + childNodes.forEach((node) => { + if (node.visible) { + const child = {} + + getVisibleNodes(node, child) + + tree.children.push(child) + } + }) + + if (!tree.children.length) { + delete tree.children + } + } +} + +export const handleSelectChange = ({ props, state }) => (checked, indeterminate) => { + state.tree.state.store.setCurrentNode(props.node) + + if (state.oldChecked !== checked && state.oldIndeterminate !== indeterminate) { + const treeNodes = {} + + getVisibleNodes(props.node, treeNodes) + + state.tree.$emit('check-change', treeNodes, checked, indeterminate) + } + + state.oldChecked = checked + state.indeterminate = indeterminate +} + +export const handleClick = ({ api, vm, props, state, refs }) => (e) => { + const store = state.tree.state.store + + state.tree.clearCurrentStore(props.node) + store.setCurrentNode(props.node) + + !props.node.disabled && state.tree.$emit('current-change', store.currentNode ? store.currentNode.data : null, store.currentNode) + + state.tree.currentNode = vm + + if (state.tree.checkOnClickNode && !props.node.disabled) { + e.target.checked = !props.node.checked + + api.handleCheckChange(null, e) + } + + const isCheck = props.showCheckbox ? refs.checkbox && !refs.checkbox.$el.contains(e.target) : true + + state.tree.expandOnClickNode + ? isCheck && api.handleExpandClick(isCheck) + : !props.node.disabled && state.tree.$emit('node-click', props.node.data, props.node, vm) +} + +export const closeMenu = (state) => () => { + state.showMenu = false +} + +export const handleContextMenu = ({ treeRoot, vm, props, state, nextTick }) => (event) => { + const listeners = treeRoot.vm.$listeners + const refs = vm.$refs + + if (treeRoot.showContextmenu || listeners['node-contextmenu']) { + event.stopPropagation() + event.preventDefault() + } + + state.tree.$parent.$emit('node-contextmenu', event, props.node.data, props.node, vm) + + if (!treeRoot.showContextmenu) { + return + } + + state.showMenu = true + state.tree.$parent.menuInstance = vm + + nextTick(() => { + const menuWidth = refs.menuContext.offsetWidth + const treeWidth = state.tree.$parent.$el.offsetWidth + + if (event.clientY > -10) { + state.menuposition.top = `${refs.node.offsetTop + refs.node.childNodes[0].offsetHeight / 2}px` + } + + if (event.clientX > -10) { + if (menuWidth > treeWidth) { + state.menuposition.left = 0 + } else { + state.menuposition.left = event.offsetX + menuWidth > treeWidth ? `${treeWidth - menuWidth}px` : `${event.offsetX}px` + } + } + }) +} + +export const handleExpandIconClick = ({ api, state }) => (event, node) => { + if (!node.isLeaf) { + state.tree.iconTriggerClickNode ? api.handleExpandClick(true) : api.handleExpandClick(false) + event.stopPropagation() + } +} + +export const handleExpandClick = ({ emit, vm, props, state }) => (nodeClickFlag) => { + if (nodeClickFlag) { + state.tree.$parent.$emit('node-click', props.node.data, props.node, vm) + } + + if (props.node.isLeaf) { + return + } + + if (state.expanded) { + state.tree.$parent.$emit('node-collapse', props.node.data, props.node, vm) + props.node.collapse() + } else { + props.node.expand() + emit('node-expand', props.node.data, props.node, vm) + } +} + +export const handleCheckChange = ({ nextTick, props, state }) => (value, event = {}) => { + if (event.type === 'click' || event.type === 'mousedown') { + props.node.setChecked(event.target.checked, !state.tree.checkStrictly) + return + } + + !state.tree.checkOnClickNode && props.node.setChecked(event.target.checked, !state.tree.checkStrictly) + + nextTick(() => { + const store = state.tree.state.store + + state.tree.$emit('check', props.node.data, { + checkedNodes: store.getCheckedNodes(), + checkedKeys: store.getCheckedKeys(), + halfCheckedNodes: store.getHalfCheckedNodes(), + halfCheckedKeys: store.getHalfCheckedKeys() + }) + }) +} + +export const handleContentClick = ({ nextTick, props, state, emit }) => (currentNode, currentRadio) => { + if (props.showRadio) { + if (!currentNode.disabled && currentRadio.value !== currentNode.id) { + emit('radio-change', currentNode.id) + + nextTick(() => { + const param = { ...currentNode.data } + state.tree.$emit('check-change', param) + }) + } + } +} + +export const handleChildNodeExpand = (state) => (nodeData, node, instance) => { + state.tree.$emit('node-expand', nodeData, node, instance) +} + +export const handleDragStart = ({ state, vm }) => (event) => { + if (!state.tree.draggable) { + return + } + state.tree.state.emitter.emit('tree-node-drag-start', event, vm) +} + +export const handleDragOver = ({ state, vm }) => (event) => { + if (!state.tree.draggable) { + return + } + state.tree.state.emitter.emit('tree-node-drag-over', event, vm) + event.preventDefault() +} + +export const handleDrop = () => (event) => event.preventDefault() + +export const handleDragEnd = ({ state, vm }) => (event) => { + if (!state.tree.draggable) { + return + } + + state.tree.state.emitter.emit('tree-node-drag-end', event, vm) +} + +export const created = ({ props, state }) => (fn) => { + const tree = state.tree + const property = tree.props || {} + const childrenKey = property.children || 'children' + + fn(childrenKey) + + if (props.node.expanded) { + state.expanded = true + state.childNodeRendered = true + } +} + +export const onSiblingToggleExpand = ({ state, props }) => ({ isExpand, sibling }) => { + if (state.tree.accordion && isExpand && props.node && sibling && props.node.id !== sibling.id) { + props.node.collapse() + } +} + +export const watchExpandedChange = ({ state, props }) => (value) => { + state.parentEmitter.emit('sibling-node-toggle-expand', { + isExpand: value, + sibling: props.node + }) +} diff --git a/packages/renderless/src/tree-node/vue.ts b/packages/renderless/src/tree-node/vue.ts new file mode 100644 index 000000000..46dd1e60d --- /dev/null +++ b/packages/renderless/src/tree-node/vue.ts @@ -0,0 +1,138 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + created, + handleDragEnd, + handleDrop, + handleDragOver, + handleDragStart, + handleContentClick, + handleChildNodeExpand, + handleCheckChange, + handleExpandIconClick, + handleExpandClick, + handleContextMenu, + handleClick, + handleSelectChange, + getNodeKey, + watchIndeterminate, + watchChecked, + watchExpanded, + closeMenu, + onSiblingToggleExpand, + watchExpandedChange +} from './index' + +export const api = [ + 'state', + 'getNodeKey', + 'handleClick', + 'handleContentClick', + 'closeMenu', + 'handleDragEnd', + 'handleDrop', + 'handleDragOver', + 'handleDragStart', + 'handleChildNodeExpand', + 'handleSelectChange', + 'handleContextMenu', + 'handleExpandIconClick', + 'handleCheckChange' +] + +const initState = ({ reactive, treeRoot, props, emitter, $parentEmitter }) => + reactive({ + tree: treeRoot, + expanded: false, + oldChecked: null, + indeterminate: null, + oldIndeterminate: null, + expandIcon: props.expandIcon, + childNodeRendered: false, + showMenu: false, + menuposition: { position: 'absolute', top: 0, left: 0 }, + shrinkIcon: props.shrinkIcon, + expandIconColor: props.expandIconColor, + shrinkIconColor: props.shrinkIconColor, + emitter: emitter(), + parentEmitter: $parentEmitter + }) + +const initApi = ({ api, state, dispatch, broadcast, vm, props, parent, treeRoot, nextTick, emit, refs }) => { + Object.assign(api, { + state, + dispatch, + broadcast, + watchExpanded: watchExpanded({ state }), + created: created({ vm, props, state, parent }), + getNodeKey: getNodeKey(state), + closeMenu: closeMenu(state), + handleSelectChange: handleSelectChange({ props, state }), + handleContextMenu: handleContextMenu({ vm, treeRoot, props, state, nextTick }), + handleExpandClick: handleExpandClick({ emit, vm, props, state }), + handleCheckChange: handleCheckChange({ nextTick, props, state }), + handleDragStart: handleDragStart({ state, vm }), + handleDragOver: handleDragOver({ state, vm }), + handleDrop: handleDrop(), + handleDragEnd: handleDragEnd({ state, vm }), + handleContentClick: handleContentClick({ nextTick, props, state, emit }), + onSiblingToggleExpand: onSiblingToggleExpand({ state, props }), + watchExpandedChange: watchExpandedChange({ state, props }), + handleClick: handleClick({ api, vm, props, state, refs }), + watchIndeterminate: watchIndeterminate({ api, props }), + watchChecked: watchChecked({ api, props }), + handleChildNodeExpand: handleChildNodeExpand(state), + handleExpandIconClick: handleExpandIconClick({ api, state }) + }) +} + +const initWatcher = ({ watch, state, api, props }) => { + watch(() => state.expanded, api.watchExpandedChange) + + watch(() => props.node.indeterminate, api.watchIndeterminate, { deep: true }) + + watch(() => props.node.checked, api.watchChecked, { deep: true }) + + watch(() => props.node.expanded, api.watchExpanded, { deep: true }) +} + +export const renderless = (props, { reactive, watch, inject, provide }, { parent: parentVm, vm, nextTick, emit, broadcast, dispatch, refs, emitter }) => { + const api = {} + const parent = inject('parentTree') || parentVm + const treeRoot = inject('TreeRoot') + const $parentEmitter = inject('parentEmitter') + const state = initState({ reactive, treeRoot, props, emitter, $parentEmitter }) + + state.parentEmitter.on('sibling-node-toggle-expand', (event) => api.onSiblingToggleExpand(event)) + + provide('parentEmitter', state.emitter) + + initApi({ api, state, dispatch, broadcast, vm, props, parent, treeRoot, nextTick, emit, refs }) + initWatcher({ watch, state, api, props }) + + api.created((childrenKey) => { + watch( + () => props.node.data[childrenKey], + () => { + props.node.updateChildren() + } + ) + }) + + state.parentEmitter.on('closeMenu', () => { + api.closeMenu() + state.emitter.emit('closeMenu') + }) + + return api +} diff --git a/packages/renderless/src/tree/index.ts b/packages/renderless/src/tree/index.ts new file mode 100644 index 000000000..eca76d065 --- /dev/null +++ b/packages/renderless/src/tree/index.ts @@ -0,0 +1,630 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { getNodeKey as innerGetNodekey } from '@opentiny/vue-renderless/common/deps/tree-model/util' +import { KEY_CODE } from '@opentiny/vue-renderless/common' +import TreeStore from '@opentiny/vue-renderless/common/deps/tree-model/tree-store' +import { addClass, removeClass } from '@opentiny/vue-renderless/common/deps/dom' +import { on, off } from '@opentiny/vue-renderless/common/deps/dom' +import { getDataset } from '@opentiny/vue-renderless/common/dataset' + +export const setChildren = (props) => (data) => (props.data = data) + +export const getChildren = () => (props) => props.data + +export const computedTreeItemArray = () => (props, state) => Array.prototype.slice.call(state.treeItems) + +export const computedShowEmptyText = ({ constants, t }) => (props) => props.emptyText || t(constants.EMPTY_TEXT_LOCAL) + +export const computedIsEmpty = () => (props, state) => { + const { childNodes } = state.root + + return !childNodes || childNodes.length === 0 || childNodes.every(({ visible }) => !visible) +} + +export const watchDefaultCheckedKeys = (state) => (value) => { + state.store.setDefaultCheckedKey(value) +} + +export const watchDefaultExpandedKeys = ({ state, api, nextTick }) => (value) => { + api.expandAllNodes(false) + + nextTick(() => { + state.store.defaultExpandedKeys = value + state.store.setDefaultExpandedKeys(value) + + api.initIsCurrent() + }) +} + +export const watchData = (state) => (value) => { + state.store.setData(value) +} + +export const watchCheckboxItems = () => (value) => { + Array.prototype.forEach.call(value, (checkbox) => { + checkbox.setAttribute('tabindex', -1) + }) +} + +export const watchCheckStrictly = (state) => (value) => { + state.store.checkStrictly = value +} + +export const dragStart = ({ props, state, emit }) => (event, treeNode) => { + if (typeof props.allowDrag === 'function' && !props.allowDrag(treeNode.node)) { + event.preventDefault() + return false + } + + if (!event.dataTransfer) { + return false + } + + event.dataTransfer.effectAllowed = 'copy' + + try { + event.dataTransfer.setData('text/plain', '') + } catch (e) { + // do nothing + } + + state.dragState.draggingNode = treeNode + + emit('node-drag-start', treeNode.node, event) +} + +// 移动时,判断释放在目标元素的前,后,或inner。 刚移动未离开拖动元素时,为none。 +const getDropType = (dropPrev, dropInner, dropNext, dropNode) => { + let dropType + const targetPosition = dropNode.$el.getBoundingClientRect() + const prevPercent = dropPrev ? (dropInner ? 0.25 : dropNext ? 0.45 : 1) : -1 + const nextPercent = dropNext ? (dropInner ? 0.75 : dropPrev ? 0.55 : 0) : 1 + const distance = event.clientY - targetPosition.top + + if (distance < targetPosition.height * prevPercent) { + dropType = 'before' + } else if (distance > targetPosition.height * nextPercent) { + dropType = 'after' + } else if (dropInner) { + dropType = 'inner' + } else { + dropType = 'none' + } + + return dropType +} + +const setDropIndicatorTop = (dropNode, dropIndicator, parent, dropType) => { + const iconElement = dropNode.$el.querySelector('.tiny-tree-node') + + if (iconElement) { + const treePosition = parent.$el.getBoundingClientRect() + const iconPosition = iconElement.getBoundingClientRect() + let indicatorTop = -9999 + + if (dropType === 'before') { + indicatorTop = iconPosition.top - treePosition.top + } else if (dropType === 'after') { + indicatorTop = iconPosition.bottom - treePosition.top + } + + dropIndicator.style.top = indicatorTop + 'px' + } + + dropType === 'inner' ? addClass(dropNode.$el, 'is-drop-inner') : removeClass(dropNode.$el, 'is-drop-inner') +} + +const getDragDir = ({ draggingNode, dropNode, allowDrop, emit, dragState }) => { + let dropPrev = true + let dropInner = true + let dropNext = true + let userAllowDropInner = true + const oldDropNode = dragState.dropNode + + if (typeof allowDrop === 'function') { + dropPrev = allowDrop(draggingNode.node, dropNode.node, 'prev') + userAllowDropInner = dropInner = allowDrop(draggingNode.node, dropNode.node, 'inner') + dropNext = allowDrop(draggingNode.node, dropNode.node, 'next') + } + // 这里访问window.event + event.dataTransfer.dropEffect = dropInner ? 'copy' : 'none' + + if ((dropPrev || dropInner || dropNext) && oldDropNode !== dropNode) { + oldDropNode && emit('node-drag-leave', draggingNode.node, oldDropNode.node, event) + + emit('node-drag-enter', draggingNode.node, dropNode.node, event) + } + + if (dropPrev || dropInner || dropNext) { + dragState.dropNode = dropNode + } + + if (dropNode.node.previousSibling === draggingNode.node) { + dropPrev = false + } + + if (dropNode.node.nextSibling === draggingNode.node) { + dropNext = false + } + + if (dropNode.node.contains(draggingNode.node, false)) { + dropInner = false + } + + if (draggingNode.node === dropNode.node || draggingNode.node.contains(dropNode.node)) { + dropPrev = false + dropInner = false + dropNext = false + } + + return { dropPrev, dropInner, dropNext, userAllowDropInner } +} + +export const dragOver = ({ state, emit, props, refs, vm }) => (event, dropNode) => { + const dragState = state.dragState + const oldDropNode = dragState.dropNode + + if (oldDropNode && oldDropNode !== dropNode) { + removeClass(oldDropNode.$el, 'is-drop-inner') + } + + const draggingNode = dragState.draggingNode + + if (!draggingNode || !dropNode) { + return + } + + const { dropPrev, dropInner, dropNext, userAllowDropInner } = getDragDir({ + draggingNode, + dropNode, + allowDrop: props.allowDrop, + emit, + dragState + }) + + const dropType = getDropType(dropPrev, dropInner, dropNext, dropNode) + + setDropIndicatorTop(dropNode, refs.dropIndicator, vm, dropType) + + dragState.showDropIndicator = dropType === 'before' || dropType === 'after' + dragState.allowDrop = dragState.showDropIndicator || userAllowDropInner + dragState.dropType = dropType + + emit('node-drag-over', draggingNode.node, dropNode.node, event) +} + +export const dragEnd = ({ state, emit }) => (event) => { + const dragState = state.dragState + const { draggingNode, dropType, dropNode } = dragState + + event.preventDefault() + + if (!event.dataTransfer) { + return + } + + event.dataTransfer.dropEffect = 'copy' + + if (draggingNode && dropNode) { + const draggingNodeCopy = { data: draggingNode.node.data } + const normalType = dropType !== 'none' + + normalType && draggingNode.node.remove() + + if (dropType === 'before') { + dropNode.node.parent.insertBefore(draggingNodeCopy, dropNode.node) + } else if (dropType === 'after') { + dropNode.node.parent.insertAfter(draggingNodeCopy, dropNode.node) + } else if (dropType === 'inner') { + dropNode.node.insertChild(draggingNodeCopy) + } + + normalType && state.store.registerNode(draggingNodeCopy) + + removeClass(dropNode.$el, 'is-drop-inner') + + emit('node-drag-end', draggingNode.node, dropNode.node, dropType, event) + + normalType && emit('node-drop', draggingNode.node, dropNode.node, dropType, event) + } + + if (draggingNode && !dropNode) { + emit('node-drag-end', draggingNode.node, null, dropType, event) + } + + dragState.draggingNode = null + dragState.dropNode = null + dragState.allowDrop = true + dragState.showDropIndicator = false +} + +export const created = ({ api, props, state }) => () => { + state.isTree = true + + const { nodeKey, data, lazy, load, currentNodeKey, checkStrictly, checkDescendants } = props + const { defaultCheckedKeys, defaultExpandedKeys, autoExpandParent, defaultExpandAll, filterNodeMethod } = props + + state.store = new TreeStore({ + key: nodeKey, + data, + lazy, + props: props.props, + load, + currentNodeKey, + checkStrictly, + checkDescendants, + defaultCheckedKeys, + defaultExpandedKeys, + autoExpandParent, + defaultExpandAll, + filterNodeMethod + }) + + state.root = state.store.root + + api.initIsCurrent() + + state.emitter.on('tree-node-drag-start', api.dragStart) + state.emitter.on('tree-node-drag-over', api.dragOver) + state.emitter.on('tree-node-drag-end', api.dragEnd) +} + +const doClearCurrentStore = (state) => { + if (state.currentStore.node) { + state.currentStore.node.isCurrent = false + } + + state.currentStore.node = null + state.currentStore.flag = false +} + +const setIsCurrent = (root, defaultExpandedKeys, defaultExpandedKeysHighlight, currentStore, nodeKey = 'id') => { + if (currentStore.flag || !Array.isArray(root.childNodes)) { + return + } + + for (let i = 0; i < root.childNodes.length; i++) { + const child = root.childNodes[i] + + if (child.data && child.data[nodeKey] && child.data[nodeKey] === defaultExpandedKeysHighlight) { + child.isCurrent = true + currentStore.flag = true + currentStore.node = child + + break + } + + setIsCurrent(child, defaultExpandedKeys, defaultExpandedKeysHighlight, currentStore, nodeKey) + } +} + +export const initIsCurrent = ({ props, state }) => () => { + if (state.currentStore.flag) { + doClearCurrentStore(state) + } + + if (state.store.getCurrentNode() && props.defaultExpandedKeysHighlight) { + state.store.setCurrentNode(null) + } + + if ( + props.defaultExpandedKeysHighlight && + Array.isArray(props.defaultExpandedKeys) && + ~props.defaultExpandedKeys.indexOf(props.defaultExpandedKeysHighlight) + ) { + setIsCurrent(state.root, props.defaultExpandedKeys, props.defaultExpandedKeysHighlight, state.currentStore, props.nodeKey) + } +} + +export const mounted = ({ api, vm }) => () => { + api.initTabIndex() + on(vm.$el, 'keydown', api.handleKeydown) +} + +export const beforeUnmount = ({ api, vm }) => () => { + off(vm.$el, 'keydown', api.handleKeydown) +} + +export const wrapMounted = ({ api, props, service }) => () => { + const { data, nodeKey: key, parentKey } = props + + if (!data && props.dataset) { + const dataset = { + service, + dataset: props.dataset, + tree: { key, parentKey } + } + + getDataset(dataset).then(api.watchData) + } + + api.mounted() +} + +export const updated = ({ vm, state }) => () => { + state.treeItems = vm.$el.querySelectorAll('[role=treeitem]') + state.checkboxItems = vm.$el.querySelectorAll('input[type=checkbox]') +} + +export const filter = ({ props, state }) => (value) => { + if (!props.filterNodeMethod) { + throw new Error('[Tree] filterNodeMethod is required when filter') + } + + state.store.filter(value) +} + +export const getNodeKey = (props) => (node) => innerGetNodekey(props.nodekey, node.data) + +export const getNodePath = ({ props, state }) => (data) => { + if (!props.nodeKey) { + throw new Error('[Tree] nodeKey is required in getNodePath') + } + + const node = state.store.getNode(data) + + if (!node) { + return [] + } + + const path = [node.data] + let parent = node.parent + + while (parent && parent !== state.root) { + path.push(parent.data) + parent = parent.parent + } + + return path.reverse() +} + +export const getCheckedNodes = (state) => (leafOnly, includeHalfChecked) => state.store.getCheckedNodes(leafOnly, includeHalfChecked) + +export const getCheckedKeys = (state) => (leafOnly) => state.store.getCheckedKeys(leafOnly) + +export const getCurrentNode = (state) => () => { + const currentNode = state.store.getCurrentNode() + + return currentNode ? currentNode.data : null +} + +export const getCurrentKey = ({ api, props }) => () => { + if (!props.nodeKey) { + throw new Error('[Tree] nodeKey is required in getCurrentKey') + } + + const currentNode = api.getCurrentNode() + + return currentNode ? currentNode[props.nodeKey] : null +} + +export const setCheckedNodes = ({ props, state }) => (nodes, leafOnly) => { + if (!props.nodeKey) { + throw new Error('[Tree] nodeKey is required in setCheckedNodes') + } + + state.store.setCheckedNodes(nodes, leafOnly) +} + +export const setCheckedKeys = ({ props, state }) => (keys, leafOnly) => { + if (!props.nodeKey) { + throw new Error('[Tree] nodeKey is required in setCheckedKeys') + } + + state.store.setCheckedKeys(keys, leafOnly) +} + +export const setChecked = (state) => (data, checked, deep) => { + state.store.setChecked(data, checked, deep) +} + +export const getHalfCheckedNodes = (state) => () => state.store.getHalfCheckedNodes() + +export const getHalfCheckedKeys = (state) => () => state.store.getHalfCheckedKeys() + +export const setCurrentNode = ({ props, state }) => (node) => { + if (!props.nodeKey) { + throw new Error('[Tree] nodeKey is required in setCurrentNode') + } + + state.store.setUserCurrentNode(node) +} + +export const setCurrentKey = ({ props, state }) => (key) => { + if (!props.nodeKey) { + throw new Error('[Tree] nodeKey is required in setCurrentKey') + } + + state.store.setCurrentNodeKey(key) +} + +export const getNode = (state) => (data) => state.store.getNode(data) + +export const remove = (state) => (data) => { + state.store.remove(data) +} + +export const append = (state) => (data, parentNode) => { + state.store.append(data, parentNode) +} + +export const insertBefore = (state) => (data, refNode) => { + state.store.insertBefore(data, refNode) +} + +export const insertAfter = (state) => (data, refNode) => { + state.store.insertAfter(data, refNode) +} + +export const handleNodeExpand = (emit) => (nodeData, node, instance) => { + emit('node-expand', nodeData, node, instance) +} + +export const updateKeyChildren = ({ props, state }) => (key, data) => { + if (!props.nodeKey) { + throw new Error('[Tree] nodeKey is required in updateKeyChild') + } + + state.store.updateChildren(key, data) +} + +export const initTabIndex = ({ vm, state }) => () => { + state.treeItems = vm.$el.querySelectorAll('.is-focusable[role=treeitem]') + state.checkboxItems = vm.$el.querySelectorAll('input[type=checkbox]') + + const checkedItem = vm.$el.querySelectorAll('.is-checked[role=treeitem]') + + if (checkedItem.length) { + checkedItem[0].setAttribute('tabindex', 0) + return + } + + state.treeItems[0] && state.treeItems[0].setAttribute('tabindex', 0) +} + +export const handleKeydown = ({ vm, state }) => (event) => { + const currentItem = event.target + + if (!currentItem.className.includes('tiny-tree-node')) { + return + } + + const keyCode = event.keyCode + + state.treeItems = vm.$el.querySelectorAll('.is-focusable[role=treeitem]') + + if ([KEY_CODE.ArrowUp, KEY_CODE.ArrowDown].includes(keyCode)) { + let nextIndex + const currentIndex = state.treeItemArray.indexOf(currentItem) + + event.preventDefault() + + if (keyCode === KEY_CODE.ArrowUp) { + nextIndex = currentIndex !== 0 ? currentIndex - 1 : 0 + } else { + nextIndex = currentIndex < state.treeItemArray.length - 1 ? currentIndex + 1 : 0 + } + + state.treeItemArray[nextIndex].focus() + } else if ([KEY_CODE.ArrowLeft, KEY_CODE.ArrowRight].includes(keyCode)) { + event.preventDefault() + currentItem.click() + } else if ([KEY_CODE.NumpadEnter, KEY_CODE.Space].includes(keyCode)) { + const hasInput = currentItem.querySelector('[type="checkbox"]') + + if (hasInput) { + // space enter选中checkbox + event.preventDefault() + hasInput.click() + } + } +} + +const initRadio = ({ node, nodeKey, checkedKey, state }) => { + let isFound = false + + if (node.data[nodeKey] === checkedKey) { + state.currentRadio.value = node.id + isFound = true + return isFound + } + + if (node.childNodes && node.childNodes.length) { + const childNodes = node.childNodes + + for (let i = 0; i < childNodes.length; i++) { + isFound = initRadio({ node: childNodes[i], nodeKey, checkedKey, state }) + if (isFound) { + break + } + } + } + + return isFound +} + +const init = ({ state, nodeKey, checkedKey }) => { + let isFound = false + + if (state.root && state.root.childNodes && state.root.childNodes.length) { + const rootChildNodes = state.root.childNodes + + for (let i = 0; i < rootChildNodes.length; i++) { + isFound = initRadio({ + node: rootChildNodes[i], + nodeKey, + checkedKey, + state + }) + if (isFound) { + break + } + } + } +} + +export const setCurrentRadio = ({ props, state }) => () => { + if (!props.showRadio) { + return + } + + if (!props.nodeKey) { + throw new Error('[Tree] nodeKey is required in setCurrentRadio') + } + + const nodeKey = props.nodeKey + const defaultCheckedKeys = props.defaultCheckedKeys || [] + const checkedKey = defaultCheckedKeys.length ? defaultCheckedKeys[0] : null + + if (!checkedKey) { + return + } + + init({ state, nodeKey, checkedKey }) +} + +export const closeMenu = (state) => () => state.emitter.emit('closeMenu') + +export const clearCurrentStore = (state) => (node) => { + if (state.currentStore.flag && state.currentStore.node && state.currentStore.node.id !== node.id) { + doClearCurrentStore(state) + } +} + +const innerExpandAllNodes = (nodes, expandFlag) => { + nodes.forEach((node) => { + if (expandFlag) { + if (node.childNodes.length && node.level > 1) { + node.expand() + } + } else { + node.collapse() + } + + innerExpandAllNodes(node.childNodes, expandFlag) + }) +} + +export const expandAllNodes = ({ state }) => (expandFlag) => { + const nodes = state.root.childNodes + + if (Array.isArray(nodes) && nodes.length) { + innerExpandAllNodes(nodes, expandFlag) + + nodes.forEach((node) => { + if (expandFlag && node.childNodes.length) { + node.expand() + } + }) + } +} diff --git a/packages/renderless/src/tree/vue.ts b/packages/renderless/src/tree/vue.ts new file mode 100644 index 000000000..13f68d5e1 --- /dev/null +++ b/packages/renderless/src/tree/vue.ts @@ -0,0 +1,213 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import debounce from '@opentiny/vue-renderless/common/deps/debounce' +import { + computedShowEmptyText, + closeMenu, + setChildren, + getChildren, + computedTreeItemArray, + computedIsEmpty, + watchDefaultCheckedKeys, + watchDefaultExpandedKeys, + watchData, + watchCheckboxItems, + watchCheckStrictly, + created, + mounted, + updated, + filter, + getNode, + remove, + append, + getNodeKey, + getNodePath, + getHalfCheckedNodes, + getHalfCheckedKeys, + getCheckedNodes, + getCheckedKeys, + getCurrentNode, + getCurrentKey, + setCheckedNodes, + setCheckedKeys, + setChecked, + setCurrentNode, + setCurrentKey, + insertBefore, + insertAfter, + handleNodeExpand, + updateKeyChildren, + initTabIndex, + handleKeydown, + setCurrentRadio, + expandAllNodes, + dragStart, + dragOver, + dragEnd, + clearCurrentStore, + initIsCurrent, + beforeUnmount, + wrapMounted +} from './index' + +export const api = [ + 'state', + 'closeMenu', + 'filter', + 'getNodeKey', + 'getNodePath', + 'getCheckedNodes', + 'getCheckedKeys', + 'getCurrentNode', + 'getCurrentKey', + 'setCheckedNodes', + 'setCheckedKeys', + 'setChecked', + 'getHalfCheckedNodes', + 'getHalfCheckedKeys', + 'setCurrentNode', + 'setCurrentKey', + 'getNode', + 'remove', + 'append', + 'insertBefore', + 'insertAfter', + 'handleNodeExpand', + 'updateKeyChildren', + 'initTabIndex', + 'handleKeydown', + 'setCurrentRadio', + 'expandAllNodes', + 'clearCurrentStore' +] + +const initState = ({ reactive, emitter, props, computed, api }) => { + const state = reactive({ + root: null, + store: null, + treeItems: null, + currentNode: null, + checkboxItems: [], + emitter: emitter(), + expandIcon: props.expandIcon, + shrinkIcon: props.shrinkIcon, + expandIconColor: props.expandIconColor, + shrinkIconColor: props.shrinkIconColor, + dragState: { showDropIndicator: false, draggingNode: null, dropNode: null, allowDrop: true }, + currentRadio: { value: null }, + children: computed({ + get: () => api.getChildren(props, state), + set: (data) => api.setChildren(data) + }), + treeItemArray: computed(() => api.computedTreeItemArray(props, state)), + isEmpty: computed(() => api.computedIsEmpty(props, state)), + showEmptyText: computed(() => api.computedShowEmptyText(props, state)), + currentStore: { flag: false, node: null } + }) + + return state +} + +const initApi = ({ state, dispatch, broadcast, props, vm, constants, t, emit, refs }) => ({ + state, + dispatch, + broadcast, + setChildren: setChildren(props), + getChildren: getChildren(), + computedTreeItemArray: computedTreeItemArray(), + computedIsEmpty: computedIsEmpty(), + watchDefaultCheckedKeys: watchDefaultCheckedKeys(state), + watchData: watchData(state), + watchCheckboxItems: watchCheckboxItems(state), + watchCheckStrictly: watchCheckStrictly(state), + updated: updated({ vm, state }), + filter: filter({ props, state }), + getNodeKey: getNodeKey(props), + getNodePath: getNodePath({ props, state }), + getCheckedNodes: getCheckedNodes(state), + getCheckedKeys: getCheckedKeys(state), + getCurrentNode: getCurrentNode(state), + setCheckedNodes: setCheckedNodes({ props, state }), + setCheckedKeys: setCheckedKeys({ props, state }), + setChecked: setChecked(state), + getHalfCheckedNodes: getHalfCheckedNodes(state), + getHalfCheckedKeys: getHalfCheckedKeys(state), + setCurrentNode: setCurrentNode({ props, state }), + setCurrentKey: setCurrentKey({ props, state }), + getNode: getNode(state), + remove: remove(state), + append: append(state), + insertBefore: insertBefore(state), + insertAfter: insertAfter(state), + updateKeyChildren: updateKeyChildren({ props, state }), + initTabIndex: initTabIndex({ vm, state }), + handleKeydown: handleKeydown({ vm, state }), + computedShowEmptyText: computedShowEmptyText({ constants, t }), + setCurrentRadio: setCurrentRadio({ props, state }), + expandAllNodes: expandAllNodes({ state }), + dragStart: dragStart({ props, state, emit }), + dragOver: dragOver({ props, state, emit, refs, vm }), + dragEnd: dragEnd({ state, emit }), + clearCurrentStore: clearCurrentStore(state), + initIsCurrent: debounce(20, initIsCurrent({ props, state })) +}) + +const initWatcher = ({ watch, props, api }) => { + watch(() => props.defaultCheckedKeys, api.watchDefaultCheckedKeys) + + watch(() => props.defaultExpandedKeys, api.watchDefaultExpandedKeys) + + watch(() => props.defaultExpandedKeysHighlight, api.initIsCurrent) + + watch(() => props.data, api.watchData) + + watch(() => props.checkboxItems, api.watchCheckboxItems) + + watch(() => props.checkStrictly, api.watchCheckStrictly) + + watch(() => props.defaultCheckedKeys, api.setCurrentRadio, { immediate: true }) +} + +export const renderless = ( + props, + { computed, onMounted, onUpdated, reactive, watch, provide, onBeforeUnmount }, + { vm, t, refs, emit, constants, broadcast, dispatch, service, emitter, nextTick } +) => { + const api = {} + const state = initState({ reactive, emitter, props, computed, api }) + + provide('parentEmitter', state.emitter) + + Object.assign(api, initApi({ state, dispatch, broadcast, props, vm, constants, t, emit, refs }), { + closeMenu: closeMenu(state), + mounted: mounted({ api, vm }), + created: created({ api, props, state }), + getCurrentKey: getCurrentKey({ api, props }), + handleNodeExpand: handleNodeExpand(emit), + beforeUnmount: beforeUnmount({ api, vm }), + wrapMounted: wrapMounted({ api, props, service }), + watchDefaultExpandedKeys: watchDefaultExpandedKeys({ state, api, nextTick }) + }) + + api.created() + + initWatcher({ watch, props, api }) + + onMounted(api.wrapMounted) + + onUpdated(api.updated) + + onBeforeUnmount(api.beforeUnmount) + + return api +} diff --git a/packages/renderless/src/upload-dragger/index.ts b/packages/renderless/src/upload-dragger/index.ts new file mode 100644 index 000000000..2e78fb458 --- /dev/null +++ b/packages/renderless/src/upload-dragger/index.ts @@ -0,0 +1,64 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const onDragOver = ({ props, state }) => () => !props.disabled && (state.dragover = true) + +export const onDrop = ({ emit, props, state }) => (event) => { + if (props.disabled || !state.uploader) { + return + } + + const accept = state.uploader.accept + + state.dragover = false + + if (!accept) { + emit('file', event.dataTransfer.files) + return + } + + const notAcceptedFiles = [] + + const filteredFile = [].slice.call(event.dataTransfer.files).filter((file) => { + const { type, name } = file + const extension = name.includes('.') ? `.${name.split('.').pop()}` : '' + const baseType = type.replace(/\/.*$/, '') + + let isValid = accept + .split(',') + .map((type) => type.trim()) + .filter((type) => type) + .some((type) => { + if (/\..+$/.test(type)) { + return extension === type + } + + if (/\/\*$/.test(type)) { + return baseType === type.replace(/\/\*$/, '') + } + + if (/^[^/]+\/[^/]+$/.test(type)) { + return true + } + + return false + }) + + !isValid && notAcceptedFiles.push(file) + + return isValid + }) + + notAcceptedFiles.length && state.uploader.$emit('drop-error', notAcceptedFiles) + + emit('file', filteredFile) +} diff --git a/packages/renderless/src/upload-dragger/vue.ts b/packages/renderless/src/upload-dragger/vue.ts new file mode 100644 index 000000000..87ba742fa --- /dev/null +++ b/packages/renderless/src/upload-dragger/vue.ts @@ -0,0 +1,30 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { onDragOver, onDrop } from './index' + +export const api = ['state', 'onDragOver', 'onDrop'] + +export const renderless = (props, { inject, reactive, ref }, { emit }) => { + const state = reactive({ + dragover: false, + uploader: inject('uploader') || ref({ default: '' }) + }) + + const api = { + state, + onDragOver: onDragOver({ props, state }), + onDrop: onDrop({ emit, props, state }) + } + + return api +} diff --git a/packages/renderless/src/upload-list/index.ts b/packages/renderless/src/upload-list/index.ts new file mode 100644 index 000000000..57800e845 --- /dev/null +++ b/packages/renderless/src/upload-list/index.ts @@ -0,0 +1,59 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const parsePercentage = () => (val) => parseInt(val, 10) + +export const handleClick = ({ props, api, parent }) => (file) => { + if (parent.state.isEdm) { + props.openDownloadFile && api.edmDownloadFile(file) + } else { + props.openDownloadFile && api.downloadFile(file) + } + + return props.handlePreview && props.handlePreview(file) +} + +export const downloadFile = (service) => (file) => { + const data = file && file.response && file.response.data + + let responseFile + if (Array.isArray(data)) { + responseFile = data[0] + } else if (data && typeof data === 'object') { + for (let key of Object.keys(data)) { + responseFile = data[key] + break + } + } + + if (responseFile) { + const getFileDownloadUrl = service && service.common && service.common.getFileDownloadUrl + + getFileDownloadUrl && + getFileDownloadUrl().then((url) => { + window.open(url + '&id=' + responseFile.attachmentId + '&type=AttachmentDemo').opener = null + }) + } else if (file.url) { + window.open(file.url).opener = null + } else { + throw new Error('[tiny Error][FileUpload]file.url must not be empty') + } +} + +export const picturefilePreview = (state) => (index) => { + state.startPostion = index + state.shows = true +} + +export const getDeleteData = (emit) => (data) => { + emit('remove', data) +} diff --git a/packages/renderless/src/upload-list/vue.ts b/packages/renderless/src/upload-list/vue.ts new file mode 100644 index 000000000..995a48610 --- /dev/null +++ b/packages/renderless/src/upload-list/vue.ts @@ -0,0 +1,56 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { parsePercentage, handleClick, picturefilePreview, getDeleteData, downloadFile } from './index' +import { downloadFile as edmDownloadFile, getToken } from '@opentiny/vue-renderless/file-upload' + +export const api = ['t', 'state', 'parsePercentage', 'handleClick', 'handlePreview', 'picturefilePreview', 'getDeleteData', 'downloadFile'] + +export const renderless = (props, { reactive }, { t, parent, mode: tinyMode, emit, service }, { Modal }) => { + const mode = props._mode || parent.$mode || (tinyMode ? (tinyMode.value ? tinyMode.value : 'pc') : 'pc') + + const state = reactive({ + focusing: false, + shows: false, + startPostion: 0, + screenType: mode !== 'pc' + }) + + parent.getToken = getToken({ + constants: parent.$constants, + props: parent, + state: parent.state, + t, + Modal + }) + + const api = { + state, + getDeleteData: getDeleteData(emit), + parsePercentage: parsePercentage(), + downloadFile: downloadFile(service), + picturefilePreview: picturefilePreview(state), + edmDownloadFile: edmDownloadFile({ + api: parent, + constants: parent.$constants, + props: parent, + service, + state: parent.state + }) + } + + Object.assign(api, { + handleClick: handleClick({ props, api, parent }) + }) + + return api +} diff --git a/packages/renderless/src/upload/index.ts b/packages/renderless/src/upload/index.ts new file mode 100644 index 000000000..f53cfd885 --- /dev/null +++ b/packages/renderless/src/upload/index.ts @@ -0,0 +1,308 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { KEY_CODE } from '@opentiny/vue-renderless/common' + +export const isImage = (str) => str.includes('image') + +export const handleChange = (api) => (event) => { + const files = event.target.files + + if (!files) { + return + } + + api.uploadFiles(files) +} + +export const getFormData = ({ constants, state, parent, props }) => ({ formData, file, type }) => { + formData.append(constants.EDM.FILENAME, file.name) + + if (parent.edm.isCheckCode === true) { + formData.append(constants.EDM.ISCHECKCODE, 'Y') + formData.append(constants.EDM.CHECKCODE, file.hash) + } else { + formData.append(constants.EDM.ISCHECKCODE, 'N') + } + + if (props.isFolder) { + formData.append('filePath', file.path) + } + + const updateId = state.updateId || parent.edm.updateId + if (type === constants.EDM.SINGLEUPLOAD) { + formData.append(constants.EDM.MULTIPART, file, props.isFolder ? file.path + file.name : file.name) + updateId && formData.append(constants.EDM.DOCID, updateId) + } else { + const docId = updateId || file.docId + formData.append(constants.EDM.DOCID, docId) + formData.append(constants.EDM.FILESIZE, file.size) + } + + if (updateId) { + formData.append('updateFile', true) + state.updateId = '' + } +} + +export const uploadFiles = ({ state, constants, Modal, props, t }) => (files) => { + const { limit, fileList } = props + if (limit) { + const fileCount = fileList.length + files.length + if (fileCount > limit) { + props.onExceed && props.onExceed(files, fileList) + return + } else if (fileCount === limit) { + Modal.message({ + message: `${t('ui.upload.limitUploadFileNumber')}:${limit}`, + status: 'info' + }) + } + } + + let postFiles = Array.prototype.slice.call(files) + + if (props.isFolder) { + postFiles = postFiles.filter((item) => { + const folderAry = item.webkitRelativePath.split('/') + item.path = folderAry.slice(0, folderAry.length - 1).join('/') + '/' + if (folderAry.length >= 7) { + Modal.message({ + message: `${item.name}${t(constants.EDM.FOLDERKEY)}`, + status: 'warning' + }) + } + + return folderAry.length < 7 + }) + } + + if (!props.isFolder) { + if (!props.multiple) { + postFiles = postFiles.slice(0, 1) + } + } + + if (postFiles.length === 0) { + return + } + + props.onStart(postFiles, state.updateId) +} + +export const upload = ({ api, props, refs }) => (rawFile) => { + refs.input.value = null + + if (!props.beforeUpload) { + return api.post(rawFile) + } + + const previous = props.beforeUpload(rawFile) + + if (previous && previous.then) { + previous.then( + (fileProcessed) => { + const typeOfFile = Object.prototype.toString.call(fileProcessed) + + if (typeOfFile === '[object File]' || typeOfFile === '[object Blob]') { + if (typeOfFile === '[object Blob]') { + fileProcessed = new File([fileProcessed], rawFile.name, { + type: rawFile.type + }) + } + + Object.keys(rawFile).forEach((p) => { + fileProcessed[p] = rawFile[p] + }) + + api.post(fileProcessed) + } else { + api.post(rawFile) + } + }, + () => { + props.onRemove(null, rawFile) + } + ) + } else if (previous !== false) { + api.post(rawFile) + } else { + props.onRemove(null, rawFile) + } +} + +export const abort = ({ state, props }) => (file) => { + const { reqs } = state + const cancel = function (uid) { + const fn = (reqs[uid] && reqs[uid].abort) || state.cancelToken[uid] + fn && fn() + delete reqs[uid] + delete state.cancelToken[uid] + } + + if (file && file.isLargeFile && file.cancelToken) { + file.cancelToken && file.cancelToken.forEach((cancel) => cancel()) + + delete file.cancelToken + } else if (file) { + let uid = file + + if (file.uid) { + uid = file.uid + } + + cancel(uid) + } else { + Object.keys(reqs).forEach((uid) => cancel(uid)) + + props.fileList.forEach((file) => { + file.cancelToken && file.cancelToken.forEach((cancel) => cancel()) + file.status = 'fail' + }) + } +} + +const getOptionsOfPost = ({ props, state, rawFile, parent, uid }) => ({ + headers: Object.assign(props.headers, state.headers), + withCredentials: props.withCredentials, + file: rawFile, + data: props.data, + filename: props.name, + action: parent.action || props.action, + onProgress: (event) => { + props.onProgress(event, rawFile) + }, + onSuccess: (res) => { + props.onSuccess(res, rawFile) + delete state.reqs[uid] + }, + onError: (error) => { + props.onError(error, rawFile) + delete state.reqs[uid] + } +}) + +const modifyOptionsOfPost = ({ service, props, options, rawFile, state, uid, parent, api, constants }) => { + if (service && service.network && props.httpRequest === service.network.request) { + options.method = 'post' + options.url = options.action + options.onUploadProgress = (event) => { + props.onProgress(event, rawFile) + } + delete options.action + delete options.onProgress + const formData = new FormData() + const source = service.network.CancelToken.source() + options.cancelToken = source.token + state.cancelToken[uid] = source.cancel + if (parent.edm.upload) { + !rawFile.isLargeFile && (options.method = 'put') + options.data = options.data || {} + } + if (options.data) { + Object.keys(options.data).forEach((key) => { + formData.append(key, options.data[key]) + }) + } + if (Array.isArray(rawFile)) { + rawFile.forEach((file) => formData.append(file.name, file.raw || file)) + } else { + if (state.isEdm) { + api.getFormData({ + formData, + file: rawFile, + type: !rawFile.isLargeFile ? constants.EDM.SINGLEUPLOAD : '' + }) + } else { + formData.append(options.filename, rawFile, rawFile.name) + } + } + options.data = formData + } +} + +export const post = ({ api, constants, parent, props, state, service }) => (rawFile) => { + const { uid } = rawFile + + let options = getOptionsOfPost({ props, state, rawFile, parent, uid }) + + modifyOptionsOfPost({ + service, + props, + options, + rawFile, + state, + uid, + parent, + api, + constants + }) + + const excuteReq = (options) => { + const req = props.httpRequest(options) + + state.reqs[uid] = req + + if (req && req.then) { + req.then(options.onSuccess, options.onError) + } + } + + if (rawFile.isLargeFile) { + service.common.getChunkMergeUrl().then((url) => { + options.url = url + excuteReq(options) + }) + } else { + excuteReq(options) + } +} + +export const handleClick = ({ props, refs }) => () => { + if (!props.disabled) { + refs.input.value = null + refs.input.click() + } +} + +export const handleKeydown = (api) => (event) => { + if (event.target !== event.currentTarget) { + return + } + + if (event.keyCode === KEY_CODE.Enter || event.keyCode === KEY_CODE.Space) { + api.handleClick() + } +} + +export const handleUpdate = ({ props, state }) => (file) => { + if (!props.disabled) { + state.updateInput.value = null + state.updateId = file.docId + state.updateInput.click() + } +} + +export const mounted = ({ state, props, api }) => () => { + let updateInput = document.createElement('input') + updateInput.type = 'file' + updateInput.name = props.name + updateInput.accept = props.accept + updateInput.onchange = api.handleChange + + state.updateInput = Object.freeze(updateInput) +} + +export const onBeforeDestroy = (state) => () => { + state.updateInput.onchange = null + state.updateInput = null +} diff --git a/packages/renderless/src/upload/vue.ts b/packages/renderless/src/upload/vue.ts new file mode 100644 index 000000000..bccc085fc --- /dev/null +++ b/packages/renderless/src/upload/vue.ts @@ -0,0 +1,76 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + getFormData, + isImage, + handleChange, + uploadFiles, + upload, + abort, + post, + handleClick, + handleKeydown, + handleUpdate, + mounted, + onBeforeDestroy +} from './index' + +export const api = ['state', 'isImage', 'handleChange', 'uploadFiles', 'upload', 'abort', 'post', 'handleClick', 'handleKeydown', 'handleUpdate'] + +export const renderless = (props, { computed, inject, reactive, onMounted, onBeforeUnmount }, { refs, service, parent, t }, { Modal }) => { + const api = {} + const constants = parent.$parent.$constants + const state = reactive({ + mouseover: false, + reqs: {}, + uploader: inject('uploader'), + accecpt: '', + isEdm: computed(() => parent.state.isEdm), + openEdmDownload: computed(() => parent.edm.download), + + headers: computed(() => { + if (state.isEdm) { + return { + [constants.EDM.EDMTOKEN]: props.edmToken.edmToken || '', + [constants.EDM.TRACEID]: props.edmToken.traceId || '' + } + } + }), + + formData: {}, + cancelToken: {}, + updateId: '', + updateInput: null + }) + + Object.assign(api, { + state, + isImage, + abort: abort({ state, props }), + getFormData: getFormData({ state, constants, parent, props }), + handleClick: handleClick({ props, refs }), + onBeforeDestroy: onBeforeDestroy(state), + handleUpdate: handleUpdate({ state, props }), + uploadFiles: uploadFiles({ api, constants, Modal, props, state, t }), + post: post({ api, constants, parent, props, state, service }), + handleChange: handleChange(api), + handleKeydown: handleKeydown(api), + upload: upload({ api, props, refs }), + mounted: mounted({ state, props, api }) + }) + + onMounted(api.mounted) + onBeforeUnmount(api.onBeforeDestroy) + + return api +} diff --git a/packages/renderless/src/user-account/index.ts b/packages/renderless/src/user-account/index.ts new file mode 100644 index 000000000..448124aa8 --- /dev/null +++ b/packages/renderless/src/user-account/index.ts @@ -0,0 +1,28 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const init = ({ service, state }) => () => { + const { getUserInfo, getUserImageUrl, getLangData } = service + + getLangData().then((langData) => { + getUserInfo().then((user) => { + getUserImageUrl(user.employeeNumber).then((url) => { + const { locale = 'zhCN' } = langData + const { displayNameCn, displayNameEn, userCN } = user + const displayName = locale === 'zhCN' ? displayNameCn || userCN : displayNameEn || userCN + + state.imgUrl = url + state.userName = displayName + }) + }) + }) +} diff --git a/packages/renderless/src/user-account/vue.ts b/packages/renderless/src/user-account/vue.ts new file mode 100644 index 000000000..07d72a7f3 --- /dev/null +++ b/packages/renderless/src/user-account/vue.ts @@ -0,0 +1,35 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { initService } from '@opentiny/vue-renderless/user' +import { init } from './index' + +export const api = ['state'] + +export const renderless = (props, { reactive }, { service }) => { + const $service = initService({ props, service }) + + const state = reactive({ + imgUrl: '', + userName: '', + roleNumber: '' + }) + + const api = { + state, + init: init({ service: $service, state }) + } + + api.init() + + return api +} diff --git a/packages/renderless/src/user-contact/index.ts b/packages/renderless/src/user-contact/index.ts new file mode 100644 index 000000000..32e75cd06 --- /dev/null +++ b/packages/renderless/src/user-contact/index.ts @@ -0,0 +1,21 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const getUserHref = ({ props }) => () => { + let href = 'javascript:;' + + if (!props.isNewImMode) { + href = 'javascript:;' + } + + return href +} diff --git a/packages/renderless/src/user-contact/vue.ts b/packages/renderless/src/user-contact/vue.ts new file mode 100644 index 000000000..218e1005b --- /dev/null +++ b/packages/renderless/src/user-contact/vue.ts @@ -0,0 +1,32 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getUserHref } from './index' + +export const api = ['show', 'getUserHref'] + +export const renderless = (props, { reactive, ref }) => { + const state = reactive({ + initialized: false + }) + + const api = { + state, + show: ref(false) + } + + Object.assign(api, { + getUserHref: getUserHref({ api, props }) + }) + + return api +} diff --git a/packages/renderless/src/user-head/index.ts b/packages/renderless/src/user-head/index.ts new file mode 100644 index 000000000..0c1032884 --- /dev/null +++ b/packages/renderless/src/user-head/index.ts @@ -0,0 +1,104 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +export const computedStyle = + ({ state, props }) => + () => { + return { + fill: props.color, + color: props.color, + backgroundColor: props.backgroundColor, + backgroundImage: /^(image)$/.test(props.type) && state.internalValue ? `url(${state.internalValue})` : 'none' + } + } + +export const computedMessage = (props) => () => { + let result = '' + const total = Math.floor(props.messageTotal) + + if (props.messageType === 'details' && !isNaN(total) && total > 0) { + result = total + + if (props.messageUpperLimit && total > props.messageUpperLimit) { + result = `${props.messageUpperLimit}+` + } + } + + return result +} + +export const computedFontSize = + ({ props, state }) => + () => { + let fontSize = '' + + if (props.type === 'label' && state.label && !props.min) { + const length = state.label.length + const sizeMap = { + 1: '40px', + 2: '30px', + 3: '22px', + 4: '20px', + 5: '18px', + 6: '16px' + } + + fontSize = sizeMap[length] + } + + return { fontSize } + } + +export const computedLabel = + ({ state, props }) => + () => + props.min ? state.internalValue.substr(0, 2) : state.internalValue.substr(0, 6) + +export const getInternalValue = (props) => () => { + if (!props.modelValue) { + let result = '' + + if (props.type === 'icon') { + result = 'icon-user' + } else if (props.type === 'label') { + result = 'U' + } + + return result + } else { + return props.modelValue + } +} + +export const computedSize = + ({ props, state }) => + () => { + let size = props.size + + if (typeof size === 'string') { + switch (size) { + case 'large': + size = 64 + break + case 'medium': + size = 40 + break + case 'small': + size = 22 + break + default: + size = 40 + break + } + } + return size + } diff --git a/packages/renderless/src/user-head/vue.ts b/packages/renderless/src/user-head/vue.ts new file mode 100644 index 000000000..8c85464fa --- /dev/null +++ b/packages/renderless/src/user-head/vue.ts @@ -0,0 +1,40 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { computedMessage, computedStyle, computedFontSize, computedLabel, getInternalValue, computedSize } from './index' + +export const api = ['state'] + +export const renderless = (props, { reactive, computed }) => { + const api = { + computedMessage: computedMessage(props), + getInternalValue: getInternalValue(props) + } + const state = reactive({ + internalValue: computed(() => api.getInternalValue()), + label: computed(() => api.computedLabel()), + style: computed(() => api.computedStyle()), + message: computed(() => api.computedMessage()), + fontSize: computed(() => api.computedFontSize()), + size: computed(() => api.computedSize()) + }) + + Object.assign(api, { + state, + computedLabel: computedLabel({ state, props }), + computedStyle: computedStyle({ state, props }), + computedFontSize: computedFontSize({ props, state }), + computedSize: computedSize({ props, state }) + }) + + return api +} diff --git a/packages/renderless/src/user-link/index.ts b/packages/renderless/src/user-link/index.ts new file mode 100644 index 000000000..5d63b105c --- /dev/null +++ b/packages/renderless/src/user-link/index.ts @@ -0,0 +1,47 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const initUser = ({ api, props, state }) => (value) => { + if (!value) { + state.user = value + return + } + + api.getUsers(value).then((info) => { + // 按value排序 + info.sort((a, b) => (value.indexOf(String(a[props.valueField])) > value.indexOf(String(b[props.valueField])) ? 1 : -1)) + + const list = info.map((user) => user[props.valueField]) + + state.options = info + state.user = props.multiple ? list : list[0] + props.cache && api.cacheUser(info) + }) +} + +export const showCard = ({ api, service, state }) => (user) => { + state.spinner = true + state.expand = false + + service.fetchUser(user.employeeNumber).then((data) => { + state.data = data + state.spinner = false + }) + + api.getUserImageUrl(user.employeeNumber).then((url) => { + state.imgUrl = url + }) +} + +export const showDetail = (state) => () => { + state.expand = !state.expand +} diff --git a/packages/renderless/src/user-link/vue.ts b/packages/renderless/src/user-link/vue.ts new file mode 100644 index 000000000..f71629e02 --- /dev/null +++ b/packages/renderless/src/user-link/vue.ts @@ -0,0 +1,51 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getUsers, cacheUser, saveCache, initService } from '@opentiny/vue-renderless/user' +import { initUser, showCard, showDetail } from './index' + +export const api = ['state', 'showCard', 'showDetail'] + +export const renderless = (props, { reactive, watch }, { service }) => { + service = initService({ props, service }) + + const api = {} + + const state = reactive({ + options: [], + user: [], + selected: [], + type: props.valueField, + expand: false, + data: {}, + spinner: true, + imgUrl: '', + batch: props.batch === false ? false : props.batch || service.batch + }) + + Object.assign(api, { + state, + showDetail: showDetail(state), + saveCache: saveCache({ props }), + cacheUser: cacheUser({ api, props, service }), + initUser: initUser({ api, props, state }), + getUsers: getUsers({ api, props, state }), + showCard: showCard({ api, service, state }), + getUserImageUrl: service.getUserImageUrl, + fetchW3Accounts: service.fetchW3Accounts, + fetchUserByUserId: service.fetchUserByUserId + }) + + watch(() => props.modelValue, api.initUser, { immediate: true }) + + return api +} diff --git a/packages/renderless/src/user/index.ts b/packages/renderless/src/user/index.ts new file mode 100644 index 000000000..39ae04c44 --- /dev/null +++ b/packages/renderless/src/user/index.ts @@ -0,0 +1,591 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import debounce from '@opentiny/vue-renderless/common/deps/debounce' +import { toDateStr } from '@opentiny/vue-renderless/common/date' +import { toJsonStr } from '@opentiny/vue-renderless/common/object' +import { toJson } from '@opentiny/vue-renderless/common/string' +import { log } from '@opentiny/vue-renderless/common' + +const request = { + timmer: null, + group: {}, + requests: [], + cache: {}, + batch: 0, + addRequest({ param, cb }) { + this.requests.push({ param, cb, result: [] }) + const { valueField, queryIds } = param + + if (!this.group[valueField]) { + this.group[valueField] = [] + } + + queryIds.forEach((id) => { + if (!~this.group[valueField].indexOf(id)) { + !this.group[valueField].push(id) + } + }) + }, + removeRequest(item) { + const idx = this.requests.indexOf(item) + this.requests.splice(idx, 1) + }, + clearRequest() { + this.timmer = null + this.group = {} + this.requests = [] + this.cache = {} + this.batch = 0 + }, + getParams() { + const args = [] + + for (let key in this.group) { + if (Object.prototype.hasOwnProperty.call(this.group, key)) { + const all = this.group[key] + const items = this.splitArr(all, this.batch) + + if (key === 'userId') { + args.push(...items.map((item) => item.join(','))) + } else { + args.push( + ...items.map((item) => ({ + valueField: key, + valueSplit: item.valueSplit, + [key]: item.join(',') + })) + ) + } + } + } + + return args + }, + setCache(data, valueField) { + const me = this + + if (valueField && !this.group[valueField]) { + this.group[valueField] = [] + } + + data.forEach((item) => { + for (let key in this.group) { + if (Object.prototype.hasOwnProperty.call(this.group, key)) { + if (!me.cache[key]) { + me.cache[key] = {} + } + me.cache[key][item[key]] = item + } + } + }) + }, + singleRequest(param, api, cb) { + const { queryIds, valueField, valueSplit } = param + const queryStr = queryIds.join(',') + const params = valueField === 'userId' ? queryStr : { valueField, valueSplit, [valueField]: queryStr } + + api + .fetchW3Accounts(params) + .then((data) => { + cb(data) + }) + .catch((e) => { + cb({ error: e }) + }) + }, + batchRequest(api) { + const me = this + const reqParamsSeq = me.getParams() + let reqLen = reqParamsSeq.length + + reqParamsSeq.forEach((params) => { + api + .fetchW3Accounts(params) + .then((data) => { + me.setCache(data) // 将所有数据入库 + me.requests.slice().forEach((reqItem) => { + // 每批次查询后遍历一次所有的request + const { param, cb } = reqItem + const { queryIds, valueField } = param + + queryIds.forEach((id) => { + const user = me.cache[valueField] && me.cache[valueField][id] + user && !reqItem.result.includes(user) && reqItem.result.push(user) + }) + + if (reqItem.result.length === queryIds.length) { + me.removeRequest(reqItem) + cb(reqItem.result) + } + }) + }) + .finally(() => { + reqLen-- + + const errors = [] + + if (!reqLen) { + // 所有批次查询完成后触发未完成的回调并检查失败项 + this.requests.forEach(({ cb, result, param }) => { + const { queryIds, valueField } = param + + cb(result) + queryIds.forEach((id) => { + if (!this.cache[valueField] || !this.cache[valueField][id]) { + errors.push(id) + } + }) + }) + errors.length && log(`user [${errors.join(',')}] not found`, 'warn') + this.clearRequest() + } + }) + }) + }, + setBatch(batch) { + if (typeof batch !== 'number' || batch <= 0) { + batch = 50 + } + + if (batch <= 500 && this.batch < batch) { + this.batch = batch + } + }, + getusers({ param, api, batch, cb }) { + if (batch !== false) { + this.setBatch(batch) + clearTimeout(this.timmer) + this.addRequest({ param, cb }) + this.timmer = setTimeout(() => this.batchRequest(api), 100) + } else { + this.singleRequest(param, api, cb) + } + }, + splitArr(arr, num) { + let result = [] + + if (arr.length && num > 0) { + const just = arr.length % num === 0 + const part = Math.floor(arr.length / num) + const len = just ? part : part + 1 + + for (let i = 0; i < len; i++) { + result.push(arr.slice(i * num, (i + 1) * num)) + } + } + + return result + } +} + +export const suggestUser = (api) => (query) => + new Promise((resolve, reject) => { + api + .fetchSuggestUser(query) + .then((users) => { + if (users.length) { + resolve(users) + } else { + resolve({ invalid: query }) + } + }) + .catch(reject) + }) + +export const updateOptions = ({ props, state, nextTick }) => (usersList) => { + const { valueField, textField, noDataText } = props + const values = [].concat(state.user || []) + const options = [].concat(state.selected) + const hides = [] + let count = 0 + + usersList.forEach((users) => { + users.forEach((user) => { + const u = user[valueField] + + user._show = true + count++ + + if (!~values.indexOf(u)) { + values.push(u) + options.push(user) + } else { + hides.push(u) + } + }) + }) + + state.selected.forEach((us) => { + us._show = !!~hides.indexOf(us[valueField]) + }) + + !count && !noDataText && (state.visible = false) + + if (!props.sortByFetchData) { + options.sort((a, b) => (a[textField] > b[textField] ? 1 : -1)) + } + + state.options = options + + return nextTick() +} + +export const autoSelect = ({ props, state, nextTick }) => (usersList) => { + if (!usersList.length) { + return nextTick() + } + + const values = props.multiple ? [].concat(state.user) : [] + + usersList.forEach((list) => { + if (list.length === 1) { + const value = list[0][props.valueField] + + !~values.indexOf(value) && values.push(value) + + if (props.autoClose) { + state.visible = false + } + } + }) + + if (!values.length) { + return nextTick() + } + + if (props.multiple) { + state.user.length !== values.length && (state.user = values) + } else { + state.user = values[0] + } + + return nextTick() +} + +export const searchMethod = ({ api, props, state, emit }) => + debounce(props.delay, (query) => { + if (query && query.length >= props.suggestLength) { + state.loading = true + state.visible = true + + const { multiple } = props + let suggests + + if (multiple) { + suggests = query + .split(new RegExp(`[${props.textSplit.split('').join('\\')}]`)) + .filter((q) => q && q.length >= props.suggestLength) + .map((q) => api.suggestUser(q.trim())) + } else { + suggests = [api.suggestUser(query.trim())] + } + + Promise.all(suggests).then((users) => { + const failList = [] + const usersList = [] + + users.forEach((item) => { + if (item.invalid) { + failList.push(item.invalid) + } else { + usersList.push(item) + } + }) + + if (failList.length) { + emit('error', failList) + } + + api.updateOptions(usersList).then(() => { + api.autoSelect(usersList).then(() => { + api.userChange(state.user) + state.loading = false + }) + }) + }) + } + }) + +export const setSelected = ({ api, props, state }) => (value) => { + const values = Array.isArray(value) ? value.map((v) => String(v).toLocaleLowerCase()) : String(value).toLocaleLowerCase().split(props.valueSplit) + + state.selected = state.options.filter((user) => ~values.indexOf(String(user[props.valueField]).toLocaleLowerCase())) + + props.cache && api.cacheUser(state.selected) +} + +export const userChange = ({ api, emit, props, state }) => (value) => { + const { multiple } = props + + let newVal = multiple && Array.isArray(value) ? value.join(props.valueSplit) : String(value || '') + + api.setSelected(newVal) + + if (typeof state.lastValue === 'string' && state.lastValue !== null && state.lastValue.toLocaleLowerCase() !== newVal.toLocaleLowerCase()) { + emit('update:modelValue', newVal) + emit('change', newVal, state.selected) + } + + state.lastValue = newVal +} + +const syncCacheIds = (ids, props, queryIds, cacheData) => { + const { valueField, cacheFields, cacheKey } = props + const cacheUsers = toJson(window.localStorage.getItem(cacheKey)) || {} + ids.forEach((id) => { + // 如果存在cache 但是cache中不存在自定义cacheFields的字段需要优化 TODO + if (cacheUsers[id]) { + const cacheUser = cacheUsers[id] + + const textField = props.textField === 'userCN' || props.textField === 'userId' || props.textField === 'dept' ? '' : props.textField + + if (textField !== '' && !cacheUser.a) { + window.localStorage.removeItem(cacheKey) + queryIds.push(id) + } + + const user = { + userId: cacheUser.i, + userCN: cacheUser.u, + dept: cacheUser.d, + employeeNumber: cacheUser.e, + [textField]: cacheUser.a + } + + cacheFields.forEach((field) => { + user[field] = cacheUser[field] + }) + + cacheData.push( + Object.assign(user, { + [valueField]: cacheUsers[id].p || cacheUsers[id].i + }) + ) + } else { + queryIds.push(id) + } + }) +} + +export const getUsers = ({ api, props, state }) => (value) => { + const { valueField, cache } = props + const ids = Array.isArray(value) ? value : value.split(props.valueSplit) + const cacheData = [] + const queryIds = cache ? [] : ids + + if (cache) { + syncCacheIds(ids, props, queryIds, cacheData) + request.setCache(cacheData, valueField) + + if (!queryIds.length) { + return Promise.resolve(cacheData) + } + } + + const param = { valueSplit: props.valueSplit, valueField, queryIds } + + return new Promise((resolve, reject) => { + const cb = (data) => { + if (data.error) { + reject(data.error) + } else { + resolve(data.concat(cacheData)) + } + } + + request.getusers({ param, api, batch: state.batch, cb }) + }) +} + +export const updateCache = ({ props, state }) => () => { + const users = toJson(window.localStorage.getItem(props.cacheKey)) || {} + const currDate = toDateStr(new Date(), 'yyyyMMdd') + + if (currDate !== users.t) { + users.t = currDate + + for (let u in users) { + if (u !== 't') { + let user = users[u] + + if (user.r > 0) { + user.r = 0 + } else { + user.r-- + } + } + } + } + + state.cache = users +} + +export const saveCache = ({ props }) => (cache) => { + window.localStorage.setItem(props.cacheKey, toJsonStr(cache)) +} + +export const cacheUser = ({ api, props, service }) => (users) => { + const { valueField, cacheKey } = props + const cacheUser = toJson(window.localStorage.getItem(cacheKey)) || {} + const cacheFields = service.userCache + let user + + for (let i = 0; i < users.length; i++) { + const u = users[i] + const key = u[valueField] + + user = cacheUser[key] + + if (user) { + user.r++ + } else { + const us = { + p: u[valueField], // 增加一个主键 + i: u[cacheFields.userId], + u: u[cacheFields.userCN], + d: u[cacheFields.dept], + e: u[cacheFields.eno], + a: ~['userCN', 'userId', 'dept'].indexOf(props.textField) ? null : u[props.textField], + r: 0 + } + + props.cacheFields.forEach((field) => { + us[field] = u[field] + }) + + cacheUser[key] = us + } + } + try { + api.saveCache(cacheUser) + } catch (e) { + const sortUsers = Object.keys(cacheUser).sort((a, b) => (cacheUser[a].r < cacheUser[b].r ? 1 : -1)) + + const cutUser = sortUsers.splice(0, sortUsers.length / 2) + const newCache = {} + + for (let i in cutUser) { + if (Object.prototype.hasOwnProperty.call(cutUser, i)) { + newCache[cutUser[i]] = cacheUser[cutUser[i]] + } + } + + api.saveCache(newCache) + } +} + +export const useSortable = ({ api, props, state, refs }) => () => { + const selectDom = refs.select.$el + + if (props.sortable && props.multiple && !state.sortable) { + const tagsDom = selectDom.querySelector('.tiny-select__tags>span') + + state.sortable = props.sortable.create(tagsDom, { + handle: '.tiny-tag', + ghostClass: 'tiny-user__ghost', + onEnd: ({ newIndex, oldIndex }) => { + let currUser = state.user.splice(oldIndex, 1)[0] + state.user.splice(newIndex, 0, currUser) + api.userChange(state.user) + } + }) + } +} + +export const visibleChange = ({ state, emit }) => (show) => { + if (!show) { + state.visible = show + state.options = state.selected.map((user) => Object.assign(user, { _show: true })) + } + + emit('visible-change', show) +} + +export const initUser = ({ api, props, state }) => (value) => { + if (value === state.lastValue) { + return + } + + state.user = !props.multiple ? '' : [] + + if (typeof value === 'number') { + value = String(value) + } + + if (!value) { + state.options = [] + state.selected = [] + api.userChange(value) + return + } + + value && + api.getUsers(value).then((info) => { + // 按value排序 + info.sort((a, b) => (value.indexOf(String(a[props.valueField])) > value.indexOf(String(b[props.valueField])) ? 1 : -1)) + + const list = info.map((user) => { + user._show = true + return user[props.valueField] + }) + + state.options = info + state.user = props.multiple ? list : list[0] + + api.userChange(value) + }) +} +export const handleBlur = ({ constants, dispatch, state }) => () => { + dispatch(constants.COMPONENT_NAME.FormItem, constants.EVENT_NAME.FormBlur, state.user) +} + +export const initService = ({ props, service }) => { + const noopFnCreator = (propName) => () => { + if (propName) { + return Promise.reject(new Error(`[TINY Error][User]] Prop ${propName} is not configured`)) + } else { + return Promise.reject(new Error('[TINY Error][User]] This component depends on @opentiny/vue-service')) + } + } + + const $service = service || {} + const { common = {}, setting = {}, base = {} } = $service + const { fetchUser, fetchW3Accounts, fetchSuggestUser, fetchUserByUserId } = $service + + const { options = {} } = setting + const { UserCache = { uuid: 'uuid', userId: 'userId', userCN: 'userCN', dept: 'dept', eno: 'employeeNumber' }, User = { batch: 50 } } = options + + return { + fetchUser: props.fetchUser || fetchUser || noopFnCreator('fetchUser'), + fetchW3Accounts: props.fetchW3Accounts || fetchW3Accounts || noopFnCreator('fetchW3Accounts'), + fetchSuggestUser: props.fetchSuggestUser || fetchSuggestUser || noopFnCreator('fetchSuggestUser'), + fetchUserByUserId: props.fetchUserByUserId || fetchUserByUserId || noopFnCreator('fetchUserByUserId'), + getUserImageUrl: props.getUserImageUrl || common.getUserImageUrl || noopFnCreator('getUserImageUrl'), + getLangData: props.getLangData || base.getLangData || noopFnCreator('getLangData'), + getUserInfo: props.getUserInfo || base.getUserInfo || noopFnCreator('getUserInfo'), + userCache: props.UserCache || UserCache, + batch: User.batch + } +} + +export const filter = ({ props, state }) => () => { + if (props.multiple && props.hideSelected) { + const selectedUsers = state.user.map((value) => (typeof value === 'string' ? value.toLocaleLowerCase() : value)) + + return state.options.filter( + (user) => !~selectedUsers.indexOf(typeof user[props.valueField] === 'string' ? user[props.valueField].toLocaleLowerCase() : user[props.valueField]) + ) + } + + return state.options +} diff --git a/packages/renderless/src/user/vue.ts b/packages/renderless/src/user/vue.ts new file mode 100644 index 000000000..936cb6e21 --- /dev/null +++ b/packages/renderless/src/user/vue.ts @@ -0,0 +1,80 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + initUser, + handleBlur, + updateOptions, + useSortable, + userChange, + suggestUser, + autoSelect, + searchMethod, + setSelected, + getUsers, + updateCache, + saveCache, + cacheUser, + visibleChange, + initService, + filter +} from './index' + +export const api = ['state', 'handleBlur', 'searchMethod', 'userChange', 'visibleChange', 'useSortable', 'filter'] + +export const renderless = (props, { reactive, watch }, { emit, nextTick, refs, service, constants, dispatch }) => { + const api = {} + const $service = initService({ props, service }) + + const state = reactive({ + loading: false, + options: [], + hisOptions: [], + user: props.multiple ? [] : '', + selected: [], + visible: false, + lastValue: null, + type: props.valueField, + sortable: null, + overflow: false, + addevnet: false, + batch: props.batch === false ? false : props.batch || $service.batch + }) + + Object.assign(api, { + state, + fetchW3Accounts: $service.fetchW3Accounts, + fetchSuggestUser: $service.fetchSuggestUser, + fetchUserByUserId: $service.fetchUserByUserId, + visibleChange: visibleChange({ state, emit }), + saveCache: saveCache({ props }), + updateCache: updateCache({ props, state }), + autoSelect: autoSelect({ props, state, nextTick }), + updateOptions: updateOptions({ props, state, nextTick }), + handleBlur: handleBlur({ constants, dispatch, state }), + filter: filter({ props, state }), + suggestUser: suggestUser(api), + cacheUser: cacheUser({ api, props, service: $service }), + initUser: initUser({ api, props, state }), + getUsers: getUsers({ api, props, state }), + setSelected: setSelected({ api, props, state }), + searchMethod: searchMethod({ api, props, state, emit }), + userChange: userChange({ api, emit, props, state }), + useSortable: useSortable({ api, props, state, refs }) + }) + + props.cache && api.updateCache() + + watch(() => props.modelValue, api.initUser, { immediate: true }) + + return api +} diff --git a/packages/renderless/src/wheel/index.ts b/packages/renderless/src/wheel/index.ts new file mode 100644 index 000000000..0596618da --- /dev/null +++ b/packages/renderless/src/wheel/index.ts @@ -0,0 +1,203 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { cloneDeep } from '@opentiny/vue-renderless/chart-core/deps/utils' + +export const created = (api) => () => { + api.loadPickerData() + api.loadWheels() +} + +/** + * @description 初始化组装数据 + */ + +export const loadPickerData = ({ props, state }) => () => { + state.dataSource = cloneDeep(props.dataSource) + state.defaultSelectedIndexs = cloneDeep(props.defaultSelectedIndexs) + const level_1 = state.dataSource + const level_n = getNextLevel([], state.dataSource, state.defaultSelectedIndexs, 0) + if (level_n.length === 0) { + // 单列 + state.pickerData = [level_1] + } else { + // 多列 + state.pickerData = [level_1, ...level_n] + } +} + +/** + * @description 获取第二列至最后一列的滚动数据 + * @param {*} levelItems 多列滚动数据集合,初始为空 + * @param {*} children 当前迭代的元素 + * @param {*} nextIndexs 当前迭代元素的下标 + * @param {*} start 起始迭代的下标 + * @returns 多列滚动数据集合 + */ + +export const getNextLevel = (levelItems, children, nextIndexs, start) => { + let levelItem = children[nextIndexs[start]]?.children ?? [] + if (start !== nextIndexs.length - 1) { + levelItems.push(levelItem) + return getNextLevel(levelItems, levelItem, nextIndexs, ++start) + } else { + return levelItems + } +} + +/** + * @description 滚动后重新组装数据 + * @param {*} newIndexs 当前迭代元素的下标集合 + * @param {*} oldIndexs 上次迭代元素的下标集合 + * @returns 组装后的数据 + */ + +export const wheelChanged = ({ api, state }) => (newIndexs, oldIndexs) => { + if (newIndexs.length > 1) { + // 多列 + newIndexs.forEach((ii, ri) => { + if (newIndexs[ri] !== oldIndexs[ri] && ri !== newIndexs.length - 1) { + const children = getChildren(state.dataSource, newIndexs, 0, ri) + state.pickerData.splice(ri + 1, 1, children) + } + }) + } + api.wheelsTo(newIndexs) + api.changeWheelItemStyle(state.pickerData, newIndexs) +} +/** + * @description 获取当前滚动元素的子元素 + * @param {*} levelItems 当前元素的集合 + * @param {*} newIndexs 当前迭代元素的下标集合 + * @param {*} start 起始迭代的下标,默认为0,后续每次增加1 + * @param {*} maxLoop 最大迭代深度(为滚动列的下标) + * @returns 当前滚动元素的子元素 + */ + +export const getChildren = (levelItems, newIndexs, start, maxLoop) => { + let levelItem = levelItems[newIndexs[start]]?.children ?? [] + if (start !== maxLoop) { + return getChildren(levelItem, newIndexs, ++start, maxLoop) + } else { + return levelItem + } +} + +export const wheelsTo = ({ api, state, nextTick }) => (indexs) => { + nextTick(() => { + state.wheels.forEach((wheel, i) => { + wheel.wheelTo(indexs[i], 0) + api.refreshWheel(wheel) + }) + }) +} + +export const refreshWheel = (nextTick) => (wheel) => { + nextTick(() => { + wheel.refresh() + }) +} + +export const loadWheels = ({ api, props, state, nextTick, refs }) => () => { + if (state.wheels.length === 0) { + nextTick(() => { + state.wheels = [] + const { wheelWrapper } = refs + if (props.hasFooter) { + for (let i = 0; i < state.pickerData.length; i++) { + api.createWheelHasFooter(wheelWrapper, i) + } + } else { + api.createWheelNoFooter(wheelWrapper) + } + }) + } +} + +export const createWheelHasFooter = ({ api, state, emit, BScroll }) => (wheelWrapper, i) => { + const wheels = state.wheels + if (!wheels[i]) { + wheels[i] = state.wheels[i] = new BScroll(wheelWrapper.children[i], { + wheel: { + selectedIndex: state.defaultSelectedIndexs[i], + wheelWrapperClass: 'wheel-scroll', + wheelItemClass: 'wheel-item' + }, + probeType: 3 + }) + state.prevSelectedIndexs = state.defaultSelectedIndexs + wheels[i].on('wheelIndexChanged', () => { + const currentSelectedIndex = wheels[i].getSelectedIndex() + + // 从滚动的当前列往后,默认都滚动到每列的首个元素 + let currentSelectedIndexs = [ + ...state.prevSelectedIndexs.slice(0, i), + currentSelectedIndex, + ...new Array(state.defaultSelectedIndexs.length - i - 1).fill(0) + ] + api.wheelChanged(currentSelectedIndexs, state.prevSelectedIndexs) + state.prevSelectedIndexs = currentSelectedIndexs + emit('change', currentSelectedIndexs) + }) + api.wheelsTo(state.defaultSelectedIndexs) + api.changeWheelItemStyle(state.pickerData, state.defaultSelectedIndexs) + } else { + wheels[i].refresh() + } + return wheels[i] +} + +export const createWheelNoFooter = ({ api, state, BScroll }) => (wheelWrapper) => { + const wheels = state.wheels + if (!wheels[0]) { + wheels[0] = state.wheels[0] = new BScroll(wheelWrapper.children[0], { + probeType: 3, + click: true + }) + api.changeWheelItemStyle(state.pickerData, state.defaultSelectedIndexs) + api.refreshWheel(wheels[0]) + } else { + wheels[0].refresh() + } + return wheels[0] +} + +export const changeWheelItemStyle = (state) => (pickerData, currentSelectedIndexs) => { + pickerData.forEach((item, index) => { + state.pickerData[index] = item.map((rItem, i) => { + rItem.selected = i === currentSelectedIndexs[index] + return rItem + }) + }) +} + +export const dealWheels = (state) => () => { + state.wheels.forEach(wheel => { + wheel.destroy() + }) + state.wheels = [] + state.pickerData = [] + state.prevSelectedIndexs = [] + state.defaultSelectedIndexs = [] +} + +export const clickWheelItem = ({ api, state, emit }) => (index) => { + api.changeWheelItemStyle(state.pickerData, [index]) + const rItem = state.pickerData[0][index] + if (state.defaultSelectedIndexs[0] !== index) { + const selectedLabel = rItem?.label + emit('clickWheelItem', [index], selectedLabel, rItem) + } else { + // 反选 + emit('clickWheelItem', [], '', []) + } +} diff --git a/packages/renderless/src/wheel/vue.ts b/packages/renderless/src/wheel/vue.ts new file mode 100644 index 000000000..db21ff19f --- /dev/null +++ b/packages/renderless/src/wheel/vue.ts @@ -0,0 +1,96 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { + created, + loadPickerData, + wheelChanged, + changeWheelItemStyle, + loadWheels, + createWheelHasFooter, + createWheelNoFooter, + wheelsTo, + refreshWheel, + dealWheels, + clickWheelItem, +} from './index' + +export const api = [ + 'state', + 'created', + 'loadPickerData', + 'wheelChanged', + 'changeWheelItemStyle', + 'loadWheels', + 'createWheelHasFooter', + 'createWheelNoFooter', + 'wheelsTo', + 'refreshWheel', + 'dealWheels', + 'clickWheelItem', +] + +const initState = (reactive) => { + const state = reactive({ + dataSource: [], + defaultSelectedIndexs: [], + pickerData: [], + wheels: [], + prevSelectedIndexs: [], + }) + + return state +} + +const initApi = ({ api, props, state, emit, nextTick, refs, BScroll }) => { + Object.assign(api, { + state, + created: created(api), + loadPickerData: loadPickerData({ props, state }), + wheelChanged: wheelChanged({ api, state }), + changeWheelItemStyle: changeWheelItemStyle(state), + loadWheels: loadWheels({ api, props, state, nextTick, refs }), + createWheelHasFooter: createWheelHasFooter({ api, state, emit, BScroll }), + createWheelNoFooter: createWheelNoFooter({ api, state, BScroll }), + wheelsTo: wheelsTo({ api, state, nextTick }), + refreshWheel: refreshWheel(nextTick), + dealWheels: dealWheels(state), + clickWheelItem: clickWheelItem({ api, state, emit }), + }) +} + +const initWatch = ({ watch, api, props, state, nextTick }) => { + watch( + () => props.defaultSelectedIndexs, + () => { + api.dealWheels(state) + nextTick(() => { + api.created(api) + }) + } + ) +} + +export const renderless = (props, { onMounted, reactive, watch }, { emit, nextTick, refs }, { BScroll }) => { + const api = {} + const state = initState(reactive) + + initApi({ api, props, state, emit, nextTick, refs, BScroll }) + + initWatch({ watch, api, props, state, nextTick }) + + onMounted(() => { + api.created(api) + }) + + return api +} diff --git a/packages/renderless/src/wizard/index.ts b/packages/renderless/src/wizard/index.ts new file mode 100644 index 000000000..f56148957 --- /dev/null +++ b/packages/renderless/src/wizard/index.ts @@ -0,0 +1,127 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { format } from '@opentiny/vue-renderless/common/date' +import { copyArray, extend } from '@opentiny/vue-renderless/common/object' +import { isObject } from '@opentiny/vue-renderless/common/type' + +export const lastStepHandle = ({ state, emit }) => () => { + for (let i = 0; i < state.datas.length; i++) { + if (state.datas[0].status === state.doing) { + return + } + + if (state.datas[i].status === state.doing) { + state.datas[i].status = state.wait + state.datas[i - 1].status = state.doing + state.submitShow = false + } + } + + emit('btnPrev', state.datas) +} + +export const nextStepHandle = ({ state, emit }) => () => { + for (let i = 0; i < state.datas.length; i++) { + if (state.datas[state.datas.length - 1].status === state.doing) { + return + } + + if (state.datas[i].status === state.doing) { + state.datas[i].status = state.ready + state.datas[i + 1].status = state.doing + state.submitShow = i + 2 === state.datas.length + return + } + + emit('btnNext', state.datas) + } +} + +export const btnSaveHandle = ({ state, emit }) => () => { + emit('btnSave', state.datas) +} + +export const submitHandle = ({ state, emit }) => () => { + emit('btnSubmit', state.datas) +} + +export const showNode = (emit) => (node, index, event) => { + node.showNode = !node.showNode + emit('node-click', node, index, event) +} + +export const nodeClick = (emit) => (node, index, event) => { + emit('node-click', node, index, event) +} + +export const cloneDeep = (data) => { + if (isObject(data)) { + return extend(true, data) + } else if (Array.isArray(data)) { + return copyArray(data) + } else { + return data + } +} + +export const timelineflowData = ({ state, props, api }) => () => { + if (!props.timeLineFlow) { + return + } + + let timelineData = cloneDeep(state.datas) + .map((item) => { + item._dateTime = new Date(typeof item.date === 'string' ? item.date.replace(/-/g, '/') : item.date) + return item + }) + .sort((a, b) => a._dateTime.getTime() - b._dateTime.getTime()) + .map((item) => { + item.date = format(item._dateTime, typeof state.datas[0].date === 'string' && ~state.datas[0].date.indexOf('/') ? 'yyyy/MM/dd' : 'yyyy-MM-dd') + item.time = format(item._dateTime, 'hh:mm') + delete item._dateTime + + return item + }) + + let newArr = [] + + timelineData.forEach((item, i) => { + if (i > 0 && item.date === timelineData[i - 1].date) { + newArr[newArr.length - 1].value.push(item) + } else { + newArr.push({ + showNode: true, + value: [item], + date: item.date + }) + } + }) + + api.setTimelineflowNodeStatus(newArr) + + state.datas = newArr +} + +export const setTimelineflowNodeStatus = (state) => (nodes) => { + const isNormalArray = (arr) => Array.isArray(arr) && arr.length + + if (isNormalArray(nodes)) { + nodes.forEach((node) => { + if (isNormalArray(node.value)) { + node.nodeStatus = node.value[0].status + } else { + node.nodeStatus = state.wait + } + }) + } +} diff --git a/packages/renderless/src/wizard/vue.ts b/packages/renderless/src/wizard/vue.ts new file mode 100644 index 000000000..3294d3f6d --- /dev/null +++ b/packages/renderless/src/wizard/vue.ts @@ -0,0 +1,43 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { btnSaveHandle, nodeClick, submitHandle, lastStepHandle, nextStepHandle, showNode, timelineflowData, setTimelineflowNodeStatus } from './index' + +export const api = ['state', 'btnSaveHandle', 'nodeClick', 'submitHandle', 'lastStepHandle', 'nextStepHandle', 'showNode'] + +export const renderless = (props, { onMounted, reactive }, { emit, constants }) => { + const state = reactive({ + datas: props.data, + submitShow: false, + showIndex: null, + doing: constants.DOING_STATUS, + ready: constants.READY_STATUS, + wait: constants.WAIT_STATUS + }) + + const api = { + state, + nodeClick: nodeClick(emit), + showNode: showNode(emit), + nextStepHandle: nextStepHandle({ state, emit }), + lastStepHandle: lastStepHandle({ state, emit }), + submitHandle: submitHandle({ state, emit }), + btnSaveHandle: btnSaveHandle({ state, emit }), + setTimelineflowNodeStatus: setTimelineflowNodeStatus(state) + } + + api.timelineflowData = timelineflowData({ state, props, api }) + + onMounted(api.timelineflowData) + + return api +} diff --git a/packages/renderless/src/year-table/index.ts b/packages/renderless/src/year-table/index.ts new file mode 100644 index 000000000..eef714c35 --- /dev/null +++ b/packages/renderless/src/year-table/index.ts @@ -0,0 +1,52 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { toDate } from '@opentiny/vue-renderless/common/date' +import { hasClass } from '@opentiny/vue-renderless/common/deps/dom' +import { range, nextDate, getDayCountOfYear } from '@opentiny/vue-renderless/common/deps/date-util' +import { arrayFindIndex, coerceTruthyValueToArray } from '@opentiny/vue-renderless/date-table' + +const datesInYear = (year) => { + const numOfDays = getDayCountOfYear(year) + const firstDay = new Date(year, 0, 1) + + return range(numOfDays).map((n) => nextDate(firstDay, n)) +} + +export const getCellStyle = ({ props }) => (year) => { + const style = {} + const today = new Date() + + style.disabled = typeof props.disabledDate === 'function' ? datesInYear(year).every(props.disabledDate) : false + + const execDate = typeof props.value === 'object' ? props.value : toDate(props.value) + + style.current = arrayFindIndex(coerceTruthyValueToArray(execDate), (date) => date.getFullYear() === year) >= 0 + style.today = today.getFullYear() === year + style.default = props.defaultValue && props.defaultValue.getFullYear() === year + + return style +} + +export const handleYearTableClick = ({ emit }) => (event) => { + const target = event.target + + if (target.tagName === 'A') { + if (hasClass(target.parentNode, 'disabled')) { + return + } + + const year = target.textContent || target.innerText + + emit('pick', Number(year)) + } +} diff --git a/packages/renderless/src/year-table/vue.ts b/packages/renderless/src/year-table/vue.ts new file mode 100644 index 000000000..6c4bfb05b --- /dev/null +++ b/packages/renderless/src/year-table/vue.ts @@ -0,0 +1,30 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { getCellStyle, handleYearTableClick } from './index' + +export const api = ['state', 'handleYearTableClick', 'getCellStyle'] + +export const renderless = (props, { computed, reactive }, { emit }) => { + const api = {} + const state = reactive({ + startYear: computed(() => Math.floor(props.date.getFullYear() / 10) * 10) + }) + + Object.assign(api, { + state, + getCellStyle: getCellStyle({ props }), + handleYearTableClick: handleYearTableClick({ emit }) + }) + + return api +} diff --git a/packages/renderless/tsconfig.json b/packages/renderless/tsconfig.json new file mode 100644 index 000000000..445b0dc39 --- /dev/null +++ b/packages/renderless/tsconfig.json @@ -0,0 +1,17 @@ +{ + "compilerOptions": { + "forceConsistentCasingInFileNames": true, + "target": "es2017", + "module": "esnext", + "lib": ["esnext", "DOM"], + "moduleResolution": "node", + "esModuleInterop": true, + "strict": true, + "strictNullChecks": true, + "resolveJsonModule": true, + "noImplicitAny": false + }, + "include": [ + "src/**/*.ts" + ] +} diff --git a/packages/renderless/tsup.config.ts b/packages/renderless/tsup.config.ts new file mode 100644 index 000000000..448c50534 --- /dev/null +++ b/packages/renderless/tsup.config.ts @@ -0,0 +1,17 @@ +import { defineConfig } from 'tsup' +import { version } from './package.json' + +export default defineConfig({ + entry: [ + 'src/**/*.ts', + ], + bundle: false, + clean: true, + format: ['esm'], + dts: false, + outExtension: () => ({ js: '.js', }), + esbuildOptions(options) { + if (options.define) options.define['process.env.RUNTIME_VERSION'] = JSON.stringify(version) + }, + // onSuccess: 'esno scripts/postbuild.ts', +}) diff --git a/packages/roles/index.js b/packages/roles/index.js deleted file mode 100644 index 0b006d56e..000000000 --- a/packages/roles/index.js +++ /dev/null @@ -1,18 +0,0 @@ -import Roles from './src/index' -import '@opentiny/vue-theme/roles/index.css' - -/* istanbul ignore next */ -Roles.install = function (Vue) { - Vue.component(Roles.name, Roles) -} - -Roles.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Roles.install(window.Vue) - } -} - -export default Roles diff --git a/packages/roles/package.json b/packages/roles/package.json deleted file mode 100644 index 0150826e1..000000000 --- a/packages/roles/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-roles", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-popover": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/roles/src/index.js b/packages/roles/src/index.js deleted file mode 100644 index af7169d31..000000000 --- a/packages/roles/src/index.js +++ /dev/null @@ -1,26 +0,0 @@ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc.vue' - -const $constants = { - AUTH: 'authenticated', - ANONYMOUS: 'anonymous', - GLOBAL: 'global', - ROLE: 'role' -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'Roles', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - fetchRole: Function - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/roles/src/pc.vue b/packages/roles/src/pc.vue deleted file mode 100644 index 2f0c13778..000000000 --- a/packages/roles/src/pc.vue +++ /dev/null @@ -1,51 +0,0 @@ - - - diff --git a/packages/row/index.js b/packages/row/index.js deleted file mode 100644 index 19827c691..000000000 --- a/packages/row/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Row from './src/index' -import '@opentiny/vue-theme/row/index.css' - -/* istanbul ignore next */ -Row.install = function (Vue) { - Vue.component(Row.name, Row) -} - -Row.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Row.install(window.Vue) - } -} - -export default Row diff --git a/packages/row/package.json b/packages/row/package.json deleted file mode 100644 index 9dab2ae37..000000000 --- a/packages/row/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-row", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/row/src/index.js b/packages/row/src/index.js deleted file mode 100644 index 3a2b97fce..000000000 --- a/packages/row/src/index.js +++ /dev/null @@ -1,56 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'Row', - componentName: 'Row', - props: { - ...$props, - flex: Boolean, - gutter: { - type: Number, - default: 0, - validator(value) { - return value >= 0 - } - }, - justify: { - type: String, - default: 'start', - validator: (value) => ~['start', 'center', 'end', 'space-between', 'space-around'].indexOf(value) - }, - align: { - type: String, - default: 'top', - validator: (value) => ~['top', 'middle', 'bottom'].indexOf(value) - }, - order: { - type: String, - validator: (value) => ~['asc', 'des'].indexOf(value) - }, - tag: { - type: String, - default: 'div' - }, - noSpace: { - type: Boolean, - default: false - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/row/src/pc.vue b/packages/row/src/pc.vue deleted file mode 100644 index f79c7f04c..000000000 --- a/packages/row/src/pc.vue +++ /dev/null @@ -1,28 +0,0 @@ - - - - diff --git a/packages/scroll-text/index.js b/packages/scroll-text/index.js deleted file mode 100644 index 87e5ec54a..000000000 --- a/packages/scroll-text/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import ScrollText from './src/index' -import '@opentiny/vue-theme/scroll-text/index.css' - -/* istanbul ignore next */ -ScrollText.install = function (Vue) { - Vue.component(ScrollText.name, ScrollText) -} - -ScrollText.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - ScrollText.install(window.Vue) - } -} - -export default ScrollText diff --git a/packages/scroll-text/package.json b/packages/scroll-text/package.json deleted file mode 100644 index 21345d83c..000000000 --- a/packages/scroll-text/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-scroll-text", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/scroll-text/src/index.js b/packages/scroll-text/src/index.js deleted file mode 100644 index 51b42c6a8..000000000 --- a/packages/scroll-text/src/index.js +++ /dev/null @@ -1,54 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - ANIMATION_DURATION: 'animation-duration' -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'ScrollText', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - text: { - type: String, - default: 'ScrollText' - }, - time: { - type: Number, - default: 5 - }, - styles: { - type: String, - default: '' - }, - direction: { - type: String, - default: 'left', - validator: (value) => ~['up', 'left', 'down', 'right'].indexOf(value) - }, - hoverStop: { - type: Boolean, - default: true - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/scroll-text/src/pc.vue b/packages/scroll-text/src/pc.vue deleted file mode 100644 index 3262c13ab..000000000 --- a/packages/scroll-text/src/pc.vue +++ /dev/null @@ -1,34 +0,0 @@ - - - - diff --git a/packages/scrollbar/index.js b/packages/scrollbar/index.js deleted file mode 100644 index b78616d89..000000000 --- a/packages/scrollbar/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Scrollbar from './src/index.vue' -import '@opentiny/vue-theme/scrollbar/index.css' - -/* istanbul ignore next */ -Scrollbar.install = function (Vue) { - Vue.component(Scrollbar.name, Scrollbar) -} - -Scrollbar.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Scrollbar.install(window.Vue) - } -} - -export default Scrollbar diff --git a/packages/scrollbar/package.json b/packages/scrollbar/package.json deleted file mode 100644 index e10e330ff..000000000 --- a/packages/scrollbar/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-scrollbar", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/scrollbar/src/index.vue b/packages/scrollbar/src/index.vue deleted file mode 100644 index 657944e1a..000000000 --- a/packages/scrollbar/src/index.vue +++ /dev/null @@ -1,120 +0,0 @@ - - diff --git a/packages/search/index.js b/packages/search/index.js deleted file mode 100644 index 5ba17bee0..000000000 --- a/packages/search/index.js +++ /dev/null @@ -1,33 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Search from './src/index' - -Search.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Search.install = function (Vue) { - Vue.component(Search.name, Search) -} - -Search.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Search.install(window.Vue) - } -} - -export default Search diff --git a/packages/search/package.json b/packages/search/package.json deleted file mode 100644 index 278ada1f4..000000000 --- a/packages/search/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-search", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/search/src/index.js b/packages/search/src/index.js deleted file mode 100644 index 825784ff4..000000000 --- a/packages/search/src/index.js +++ /dev/null @@ -1,88 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $prefix, $props, $setup } from '@opentiny/vue-common' -import { t } from '@opentiny/vue-locale' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'Search', - props: { - ...$props, - mini: { - type: Boolean, - default: false - }, - buttonText: { - type: String, - default: () => t('ui.search.placeholder') - }, - - /** - * 设置为透明模式,配置为true时,边框变为透明且收缩后半透明显示,一般用在带有背景的场景 - */ - transparent: { - type: Boolean, - default: false - }, - - /** - * 搜索的类型选项,格式为[{text:'文档',value:1},...],不配置时类型选择固定显示为All - */ - searchTypes: { - type: Array, - default: () => [] - }, - - /** - * 设置搜索输入框内的提示占位文本 - */ - placeholder: { - type: String, - default: '' - }, - modelValue: String, - clearable: { - type: Boolean, - default: false - }, - tabindex: { - type: String, - default: '1' - }, - - /** - * 配置搜索输入框enter键,enter按下触发搜索 - */ - isEnterSearch: { - type: Boolean, - default: false - }, - /** - * 配置主题色,primary:蓝 gray:灰 - */ - themeType: { - type: String, - default: 'primary', - validator: (value) => ['primary', 'gray'].includes(value) - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/search/src/mobile.vue b/packages/search/src/mobile.vue deleted file mode 100644 index 091541239..000000000 --- a/packages/search/src/mobile.vue +++ /dev/null @@ -1,84 +0,0 @@ - - - - diff --git a/packages/search/src/pc.vue b/packages/search/src/pc.vue deleted file mode 100644 index 70c35df63..000000000 --- a/packages/search/src/pc.vue +++ /dev/null @@ -1,94 +0,0 @@ - - - - diff --git a/packages/select-dropdown/index.js b/packages/select-dropdown/index.js deleted file mode 100644 index e685609f3..000000000 --- a/packages/select-dropdown/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import SelectDropdown from './src/index' -import '@opentiny/vue-theme/select-dropdown/index.css' - -SelectDropdown.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -SelectDropdown.install = function (Vue) { - Vue.component(SelectDropdown.name, SelectDropdown) -} - -SelectDropdown.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - SelectDropdown.install(window.Vue) - } -} - -export default SelectDropdown diff --git a/packages/select-dropdown/package.json b/packages/select-dropdown/package.json deleted file mode 100644 index 63b1a272d..000000000 --- a/packages/select-dropdown/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-select-dropdown", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/select-dropdown/src/index.js b/packages/select-dropdown/src/index.js deleted file mode 100644 index 4a8d70b8b..000000000 --- a/packages/select-dropdown/src/index.js +++ /dev/null @@ -1,58 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'SelectDropdown', - componentName: 'SelectDropdown', - inject: ['select'], - props: { - ...$props, - appendToBody: { - type: Boolean, - default: () => true - }, - arrowOffset: { - type: Number, - default: () => 35 - }, - boundariesPadding: { - default: () => 0 - }, - isDropInheritWidth: Boolean, - modelValue: Boolean, - offset: { - default: () => 0 - }, - placement: { - default: () => 'bottom-start' - }, - popper: {}, - popperOptions: { - default: () => ({ gpuAcceleration: false }) - }, - reference: {}, - transformOrigin: { - type: [Boolean, String], - default: () => true - }, - visibleArrow: { - default: () => false - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/select-dropdown/src/pc.vue b/packages/select-dropdown/src/pc.vue deleted file mode 100644 index a4361662f..000000000 --- a/packages/select-dropdown/src/pc.vue +++ /dev/null @@ -1,50 +0,0 @@ - - - - diff --git a/packages/select/index.js b/packages/select/index.js deleted file mode 100644 index 82fcd6e05..000000000 --- a/packages/select/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Select from './src/index' -import '@opentiny/vue-theme/select/index.css' - -Select.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Select.install = function (Vue) { - Vue.component(Select.name, Select) -} - -Select.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Select.install(window.Vue) - } -} - -export default Select diff --git a/packages/select/package.json b/packages/select/package.json deleted file mode 100644 index c1beeea0f..000000000 --- a/packages/select/package.json +++ /dev/null @@ -1,26 +0,0 @@ -{ - "name": "@opentiny/vue-select", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0", - "@opentiny/vue-tag": "~0.1.0", - "@opentiny/vue-input": "~0.1.0", - "@opentiny/vue-option": "~0.1.0", - "@opentiny/vue-scrollbar": "~0.1.0", - "@opentiny/vue-popover": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-select-dropdown": "~0.1.0", - "@opentiny/vue-grid": "~0.1.0", - "@opentiny/vue-tree": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/select/src/index.js b/packages/select/src/index.js deleted file mode 100644 index 0332a65f5..000000000 --- a/packages/select/src/index.js +++ /dev/null @@ -1,232 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import { t } from '@opentiny/vue-locale' -import PCTemplate from './pc' - -const $constants = { - CLASS: { - SelectDropdownWrap: '.tiny-select-dropdown__wrap', - IsReverse: 'is-reverse' - }, - I18N: { - noData: 'ui.select.noData', - noMatch: 'ui.select.noMatch', - loading: 'ui.select.loading' - }, - COMPONENT_NAME: { - Form: 'Form', - Select: 'Select', - Option: 'Option', - FormItem: 'FormItem', - OptionGroup: 'OptionGroup', - SelectDropdown: 'SelectDropdown' - }, - EVENT_NAME: { - removeTag: 'remove-tag', - formChange: 'form.change', - formBlur: 'form.blur', - queryChange: 'queryChange', - setSelected: 'setSelected', - updatePopper: 'updatePopper', - destroyPopper: 'destroyPopper', - visibleChange: 'visible-change', - handleOptionClick: 'handleOptionClick', - handleGroupDisabled: 'handleGroupDisabled' - }, - TYPE: { - Grid: 'grid', - Tree: 'tree' - } -} - -const template = () => { - if (PCTemplate) { - return PCTemplate - } -} - -export default { - name: $prefix + 'Select', - componentName: 'Select', - inject: { - form: { - default: '' - }, - formItem: { - default: '' - } - }, - provide() { - return { - select: this - } - }, - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - id: [Number, String], - name: String, - size: String, - remote: Boolean, - remoteConfig: { - type: Object, - default() { - return { - showIcon: false, - clearData: false, - autoSearch: false - } - } - }, - loading: Boolean, - disabled: Boolean, - options: Array, - dataset: Object, - textField: { - type: String, - default: 'label' - }, - tabindex: { - type: String, - default: '1' - }, - valueField: { - type: String, - default: 'value' - }, - placement: { - type: String, - default: 'bottom-start' - }, - showCheck: { - type: Boolean, - default: true - }, - showAlloption: { - type: Boolean, - default: true - }, - multiple: Boolean, - clearable: Boolean, - noDataText: String, - filterable: Boolean, - loadingText: String, - noMatchText: String, - popperClass: String, - allowCreate: Boolean, - collapseTags: Boolean, - remoteMethod: Function, - filterMethod: Function, - reserveKeyword: Boolean, - automaticDropdown: Boolean, - defaultFirstOption: Boolean, - modelValue: {}, - valueKey: { - type: String, - default: 'value' - }, - placeholder: { - type: String, - default: () => t('ui.select.placeholder') - }, - autocomplete: { - type: String, - default: 'off' - }, - multipleLimit: { - type: Number, - default: 0 - }, - popperAppendToBody: { - type: Boolean, - default: true - }, - hideDrop: { - type: Boolean, - default: false - }, - copyable: { - type: Boolean, - default: false - }, - renderType: String, - gridOp: { - type: Object, - default: () => ({}) - }, - treeOp: { - type: Object, - default: () => ({}) - }, - delay: { - type: Number, - default: 0 - }, - readonly: Boolean, - dropStyle: { - type: Object, - default: () => ({}) - }, - cacheOp: Object, - isDropInheritWidth: Boolean, - tagSelectable: { - type: Boolean, - default: false - }, - selectConfig: { - type: Object, - default() { - return { - checkMethod() { - return true - } - } - } - }, - radioConfig: { - type: Object, - default() { - return { - checkMethod() { - return true - } - } - } - }, - allowCopy: { - type: Boolean, - default: false - }, - textSplit: { - type: String, - default: ',' - }, - autoClose: Boolean, - queryDebounce: Number, - ignoreEnter: { - type: Boolean, - default: false - }, - optimization: [Boolean, Object], - searchable: { - type: Boolean, - default: false - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/select/src/pc.vue b/packages/select/src/pc.vue deleted file mode 100644 index 8354570e0..000000000 --- a/packages/select/src/pc.vue +++ /dev/null @@ -1,397 +0,0 @@ - - - - diff --git a/packages/slide-bar/index.js b/packages/slide-bar/index.js deleted file mode 100644 index 3957cd34a..000000000 --- a/packages/slide-bar/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import SlideBar from './src/index' -import '@opentiny/vue-theme/slide-bar/index.css' - -SlideBar.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -SlideBar.install = function (Vue) { - Vue.component(SlideBar.name, SlideBar) -} - -SlideBar.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - SlideBar.install(window.Vue) - } -} - -export default SlideBar diff --git a/packages/slide-bar/package.json b/packages/slide-bar/package.json deleted file mode 100644 index fc663d6e5..000000000 --- a/packages/slide-bar/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-slide-bar", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/slide-bar/src/index.js b/packages/slide-bar/src/index.js deleted file mode 100644 index 62086c850..000000000 --- a/packages/slide-bar/src/index.js +++ /dev/null @@ -1,39 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'SlideBar', - props: { - ...$props, - initBlocks: Number, - wheelBlocks: { - type: Number, - default: 1 - }, - modelValue: Array, - tag: { - type: String, - default: 'ul' - }, - subTag: { - type: String, - default: 'li' - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/slide-bar/src/pc.vue b/packages/slide-bar/src/pc.vue deleted file mode 100644 index abd1edd9a..000000000 --- a/packages/slide-bar/src/pc.vue +++ /dev/null @@ -1,66 +0,0 @@ - - - - diff --git a/packages/slider/index.js b/packages/slider/index.js deleted file mode 100644 index c10b45ab8..000000000 --- a/packages/slider/index.js +++ /dev/null @@ -1,33 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Slider from './src/index' - -/* istanbul ignore next */ -Slider.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -Slider.install = function (Vue) { - Vue.component(Slider.name, Slider) -} - -Slider.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Slider.install(window.Vue) - } -} - -export default Slider diff --git a/packages/slider/package.json b/packages/slider/package.json deleted file mode 100644 index e0acb22d3..000000000 --- a/packages/slider/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-slider", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/slider/src/index.js b/packages/slider/src/index.js deleted file mode 100644 index dd4f57a83..000000000 --- a/packages/slider/src/index.js +++ /dev/null @@ -1,116 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const $constants = { - TIP_HEIGHT: 22, - BUTTON_SIZE: 28, - HALF_BAR_HEIGHT: 2, - PC_TIP_CLS: 'tiny-slider__tips', - PC_SLIDER_CLS: 'tiny-slider', - PC_RANGE_CLS: 'tiny-slider__range', - PC_BUTTON_CLS: 'tiny-slider__handle', - PC_LEFT_SVG_CLS: 'tiny-slider-left-svg', - PC_RIGHT_SVG_CLS: 'tiny-slider-right-svg', - MOBILE_TIP_CLS: 'tiny-mobile-slider__tips', - MOBILE_SLIDER_CLS: 'tiny-mobile-slider', - MOBILE_RANGE_CLS: 'tiny-mobile-slider__range', - MOBILE_BUTTON_CLS: 'tiny-mobile-slider__handle', - MOBILE_LEFT_SVG_CLS: 'tiny-mobile-slider-left-svg', - MOBILE_RIGHT_SVG_CLS: 'tiny-mobile-slider-right-svg', - Mode: 'pc', - tipCls(mode) { - return mode === this.Mode ? this.PC_TIP_CLS : this.MOBILE_TIP_CLS - }, - sliderCls(mode) { - return mode === this.Mode ? this.PC_SLIDER_CLS : this.MOBILE_SLIDER_CLS - }, - rangeCls(mode) { - return mode === this.Mode ? this.PC_RANGE_CLS : this.MOBILE_RANGE_CLS - }, - buttonCls(mode) { - return mode === this.Mode ? this.PC_BUTTON_CLS : this.MOBILE_BUTTON_CLS - }, - leftSvgCls(mode) { - return mode === this.Mode ? this.PC_LEFT_SVG_CLS : this.MOBILE_LEFT_SVG_CLS - }, - rightSvgCls(mode) { - return mode === this.Mode ? this.PC_RIGHT_SVG_CLS : this.MOBILE_RIGHT_SVG_CLS - } -} - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'Slider', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - formatTooltip: Function, - disabled: { - type: Boolean, - default: false - }, - height: { - type: String, - default: '300px' - }, - max: { - type: Number, - default: 100 - }, - min: { - type: Number, - default: 0 - }, - modelValue: { - type: [Number, Array], - default: 0 - }, - numPages: { - type: Number, - default: 1 - }, - range: { - type: Boolean, - default: false - }, - showInput: { - type: Boolean, - default: false - }, - showTip: { - type: Boolean, - default: true - }, - step: { - type: Number, - default: 1 - }, - vertical: { - type: Boolean, - default: false - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/slider/src/mobile.vue b/packages/slider/src/mobile.vue deleted file mode 100644 index 094727757..000000000 --- a/packages/slider/src/mobile.vue +++ /dev/null @@ -1,67 +0,0 @@ - - - - diff --git a/packages/slider/src/pc.vue b/packages/slider/src/pc.vue deleted file mode 100644 index 67dd5ee71..000000000 --- a/packages/slider/src/pc.vue +++ /dev/null @@ -1,80 +0,0 @@ - - - - diff --git a/packages/split/index.js b/packages/split/index.js deleted file mode 100644 index 0836307d6..000000000 --- a/packages/split/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Split from './src/index.js' -import '@opentiny/vue-theme/split/index.css' - -Split.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Split.install = function (Vue) { - Vue.component(Split.name, Split) -} - -Split.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Split.install(window.Vue) - } -} - -export default Split diff --git a/packages/split/package.json b/packages/split/package.json deleted file mode 100644 index e4d41e945..000000000 --- a/packages/split/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-split", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/split/src/index.js b/packages/split/src/index.js deleted file mode 100644 index be2f3ad01..000000000 --- a/packages/split/src/index.js +++ /dev/null @@ -1,62 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - PREFIX: 'tiny-split', - HORIZONTAL: 'horizontal', - VERTICAL: 'vertical' -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'Split', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - modelValue: { - type: [Number, String], - default: 0.5 - }, - mode: { - validator(value) { - const arr = [$constants.HORIZONTAL, $constants.VERTICAL] - - for (let i = 0; i < arr.length; i++) { - if (value === arr[i]) { - return true - } - } - - return false - }, - default: $constants.HORIZONTAL - }, - leftTopMin: { - type: [Number, String], - default: '40px' - }, - rightBottomMin: { - type: [Number, String], - default: '40px' - }, - collapsible: Boolean - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/split/src/pc.vue b/packages/split/src/pc.vue deleted file mode 100644 index acd6dbafd..000000000 --- a/packages/split/src/pc.vue +++ /dev/null @@ -1,86 +0,0 @@ - - - - diff --git a/packages/steps/index.js b/packages/steps/index.js deleted file mode 100644 index 4d622e0fc..000000000 --- a/packages/steps/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Steps from './src/index' -import '@opentiny/vue-theme/steps/index.css' - -/* istanbul ignore next */ -Steps.install = function (Vue) { - Vue.component(Steps.name, Steps) -} - -Steps.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Steps.install(window.Vue) - } -} - -export default Steps diff --git a/packages/steps/package.json b/packages/steps/package.json deleted file mode 100644 index 408c7b817..000000000 --- a/packages/steps/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-steps", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/steps/src/index.js b/packages/steps/src/index.js deleted file mode 100644 index 2e967ffbe..000000000 --- a/packages/steps/src/index.js +++ /dev/null @@ -1,43 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'Steps', - props: { - ...$props, - nameField: { - type: String, - default: 'name' - }, - countField: { - type: String, - default: 'count' - }, - statusField: { - type: String, - default: 'status' - }, - data: [Object, Array], - space: Number, - active: { - type: Number, - default: -1 - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/steps/src/pc.vue b/packages/steps/src/pc.vue deleted file mode 100644 index a091cd332..000000000 --- a/packages/steps/src/pc.vue +++ /dev/null @@ -1,58 +0,0 @@ - - - - diff --git a/packages/svg-icon/index.js b/packages/svg-icon/index.js deleted file mode 100644 index 77d36ed5a..000000000 --- a/packages/svg-icon/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import SvgIcon from './src/index.vue' -import '@opentiny/vue-theme/svg/index.css' - -/* istanbul ignore next */ -SvgIcon.install = function (Vue) { - Vue.component(SvgIcon.name, SvgIcon) -} - -SvgIcon.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - SvgIcon.install(window.Vue) - } -} - -export default SvgIcon diff --git a/packages/svg-icon/package.json b/packages/svg-icon/package.json deleted file mode 100644 index d4c2cc770..000000000 --- a/packages/svg-icon/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-svg-icon", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/svg-icon/src/index.vue b/packages/svg-icon/src/index.vue deleted file mode 100644 index 4a8473b26..000000000 --- a/packages/svg-icon/src/index.vue +++ /dev/null @@ -1,45 +0,0 @@ - - - - diff --git a/packages/switch/index.js b/packages/switch/index.js deleted file mode 100644 index de0fa0648..000000000 --- a/packages/switch/index.js +++ /dev/null @@ -1,33 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Switch from './src/index' - -Switch.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Switch.install = function (Vue) { - Vue.component(Switch.name, Switch) -} - -Switch.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Switch.install(window.Vue) - } -} - -export default Switch diff --git a/packages/switch/package.json b/packages/switch/package.json deleted file mode 100644 index a8fc528d9..000000000 --- a/packages/switch/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-switch", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/switch/src/index.js b/packages/switch/src/index.js deleted file mode 100644 index 2a85f891e..000000000 --- a/packages/switch/src/index.js +++ /dev/null @@ -1,75 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const $constants = { - PC_PREFIXCLS: 'tiny-switch', - MOBILE_PREFIXCLS: 'tiny-mobile-switch', - Mode: 'pc', - prefixcls(mode) { - return mode === this.Mode ? this.PC_PREFIXCLS : this.MOBILE_PREFIXCLS - } -} - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'Switch', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - disabled: { - type: Boolean, - default: false - }, - showText: { - type: Boolean, - default: false - }, - falseColor: String, - falseValue: { - type: [String, Number, Boolean], - default: false - }, - mini: { - type: Boolean, - default: false - }, - modelValue: { - type: [String, Number, Boolean], - default: false - }, - size: [Number, String], - tabindex: { - type: String, - default: '1' - }, - trueColor: String, - trueValue: { - type: [String, Number, Boolean], - default: true - }, - beforeChange: Function - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/switch/src/mobile.vue b/packages/switch/src/mobile.vue deleted file mode 100644 index 34785045f..000000000 --- a/packages/switch/src/mobile.vue +++ /dev/null @@ -1,27 +0,0 @@ - - - - diff --git a/packages/switch/src/pc.vue b/packages/switch/src/pc.vue deleted file mode 100644 index 879dbffd8..000000000 --- a/packages/switch/src/pc.vue +++ /dev/null @@ -1,35 +0,0 @@ - - - - diff --git a/packages/tab-item/index.js b/packages/tab-item/index.js deleted file mode 100644 index e9d8af830..000000000 --- a/packages/tab-item/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import TabItem from './src/index.vue' - -/* istanbul ignore next */ -TabItem.install = function (Vue) { - Vue.component(TabItem.name, TabItem) -} - -TabItem.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - TabItem.install(window.Vue) - } -} - -export default TabItem diff --git a/packages/tab-item/package.json b/packages/tab-item/package.json deleted file mode 100644 index 3b72fbc0e..000000000 --- a/packages/tab-item/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-tab-item", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/tab-item/src/index.vue b/packages/tab-item/src/index.vue deleted file mode 100644 index 1c88169b1..000000000 --- a/packages/tab-item/src/index.vue +++ /dev/null @@ -1,45 +0,0 @@ - - - - diff --git a/packages/tabbar-item/index.js b/packages/tabbar-item/index.js deleted file mode 100644 index 45dd6c8a7..000000000 --- a/packages/tabbar-item/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import TabbarItem from './src/index.vue' -import '@opentiny/vue-theme-mobile/tabbar-item/index.css' - -/* istanbul ignore next */ -TabbarItem.install = function (Vue) { - Vue.component(TabbarItem.name, TabbarItem) -} - -TabbarItem.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - TabbarItem.install(window.Vue) - } -} - -export default TabbarItem diff --git a/packages/tabbar-item/package.json b/packages/tabbar-item/package.json deleted file mode 100644 index 7c9f48931..000000000 --- a/packages/tabbar-item/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-tabbar-item", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/tabbar-item/src/index.vue b/packages/tabbar-item/src/index.vue deleted file mode 100644 index 12d22c370..000000000 --- a/packages/tabbar-item/src/index.vue +++ /dev/null @@ -1,47 +0,0 @@ - - - - diff --git a/packages/tabbar-item/src/mobile.vue b/packages/tabbar-item/src/mobile.vue deleted file mode 100644 index 13db5cfc5..000000000 --- a/packages/tabbar-item/src/mobile.vue +++ /dev/null @@ -1,38 +0,0 @@ - - - - diff --git a/packages/tabbar/index.js b/packages/tabbar/index.js deleted file mode 100644 index 585c89b0e..000000000 --- a/packages/tabbar/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Tabbar from './src/index.vue' -import '@opentiny/vue-theme-mobile/tabbar/index.css' - -Tabbar.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Tabbar.install = function (Vue) { - Vue.component(Tabbar.name, Tabbar) -} - -Tabbar.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Tabbar.install(window.Vue) - } -} - -export default Tabbar diff --git a/packages/tabbar/package.json b/packages/tabbar/package.json deleted file mode 100644 index b92f12fd1..000000000 --- a/packages/tabbar/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-tabbar", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-tabbar-item": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/tabbar/src/index.vue b/packages/tabbar/src/index.vue deleted file mode 100644 index 8f1dc4eee..000000000 --- a/packages/tabbar/src/index.vue +++ /dev/null @@ -1,53 +0,0 @@ - - - - diff --git a/packages/table/index.js b/packages/table/index.js deleted file mode 100644 index 81a6bcbdd..000000000 --- a/packages/table/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Table from './src/index' - -/* istanbul ignore next */ -Table.install = function (Vue) { - Vue.component(Table.name, Table) -} - -Table.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Table.install(window.Vue) - } -} - -export default Table diff --git a/packages/table/package.json b/packages/table/package.json deleted file mode 100644 index f2ac192e3..000000000 --- a/packages/table/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-table", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/table/src/mobile.vue b/packages/table/src/mobile.vue deleted file mode 100644 index a1ebe421b..000000000 --- a/packages/table/src/mobile.vue +++ /dev/null @@ -1,103 +0,0 @@ - - - - diff --git a/packages/table/src/pc.vue b/packages/table/src/pc.vue deleted file mode 100644 index f40989d10..000000000 --- a/packages/table/src/pc.vue +++ /dev/null @@ -1,88 +0,0 @@ - - - - diff --git a/packages/tabs/index.js b/packages/tabs/index.js deleted file mode 100644 index 2b3e8d2f2..000000000 --- a/packages/tabs/index.js +++ /dev/null @@ -1,33 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Tabs from './src/index' - -Tabs.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Tabs.install = function (Vue) { - Vue.component(Tabs.name, Tabs) -} - -Tabs.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Tabs.install(window.Vue) - } -} - -export default Tabs diff --git a/packages/tabs/package.json b/packages/tabs/package.json deleted file mode 100644 index c7c4e62ab..000000000 --- a/packages/tabs/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-tabs", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-popover": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/tabs/src/index.js b/packages/tabs/src/index.js deleted file mode 100644 index 3eaae2083..000000000 --- a/packages/tabs/src/index.js +++ /dev/null @@ -1,72 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const $constants = { - TAB_ITEM: 'TabItem' -} - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'Tabs', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - tabStyle: String, - activeName: String, - withClose: Boolean, - withAdd: Boolean, - size: String, - activeColor: { - type: String, - default: '' - }, - modelValue: {}, - editable: Boolean, - position: { - type: String, - default: 'top' - }, - beforeLeave: Function, - stretch: Boolean, - showMoreTabs: Boolean, - showExpandTabs: Boolean, - expandTabsTitle: String, - expandTabsMode: String, - swipeable: { - type: Boolean, - default: true - }, - popperClass: String, - popperAppendToBody: { - type: Boolean, - default: true - }, - dropConfig: { - type: Object, - default: () => null - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/tabs/src/mobile.vue b/packages/tabs/src/mobile.vue deleted file mode 100644 index a43f4b61e..000000000 --- a/packages/tabs/src/mobile.vue +++ /dev/null @@ -1,160 +0,0 @@ - - diff --git a/packages/tabs/src/pc.vue b/packages/tabs/src/pc.vue deleted file mode 100644 index e5f577e3b..000000000 --- a/packages/tabs/src/pc.vue +++ /dev/null @@ -1,139 +0,0 @@ - - diff --git a/packages/tabs/src/tab-nav/index.vue b/packages/tabs/src/tab-nav/index.vue deleted file mode 100644 index cf8682905..000000000 --- a/packages/tabs/src/tab-nav/index.vue +++ /dev/null @@ -1,282 +0,0 @@ - - diff --git a/packages/tag/index.js b/packages/tag/index.js deleted file mode 100644 index 2da0b3c3b..000000000 --- a/packages/tag/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Tag from './src/index' -import '@opentiny/vue-theme/tag/index.css' - -/* istanbul ignore next */ -Tag.install = function (Vue) { - Vue.component(Tag.name, Tag) -} - -Tag.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Tag.install(window.Vue) - } -} - -export default Tag diff --git a/packages/tag/package.json b/packages/tag/package.json deleted file mode 100644 index 72a1ad3c2..000000000 --- a/packages/tag/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-tag", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/tag/src/index.js b/packages/tag/src/index.js deleted file mode 100644 index 11ca2b584..000000000 --- a/packages/tag/src/index.js +++ /dev/null @@ -1,37 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'Tag', - props: { - ...$props, - hit: Boolean, - text: String, - type: String, - size: String, - color: String, - closable: Boolean, - effect: { - type: String, - default: 'light', - validator: (value) => ~['dark', 'light', 'plain'].indexOf(value) - }, - beforeDelete: Function - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/tag/src/pc.vue b/packages/tag/src/pc.vue deleted file mode 100644 index ddd04bee3..000000000 --- a/packages/tag/src/pc.vue +++ /dev/null @@ -1,41 +0,0 @@ - - diff --git a/packages/text-popup/index.js b/packages/text-popup/index.js deleted file mode 100644 index a8567dae8..000000000 --- a/packages/text-popup/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import TextPopup from './src/index' -import '@opentiny/vue-theme/text-popup/index.css' - -TextPopup.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -TextPopup.install = function (Vue) { - Vue.component(TextPopup.name, TextPopup) -} - -TextPopup.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - TextPopup.install(window.Vue) - } -} - -export default TextPopup diff --git a/packages/text-popup/package.json b/packages/text-popup/package.json deleted file mode 100644 index b7feea0eb..000000000 --- a/packages/text-popup/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-text-popup", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/text-popup/src/index.js b/packages/text-popup/src/index.js deleted file mode 100644 index 9ae5641bd..000000000 --- a/packages/text-popup/src/index.js +++ /dev/null @@ -1,47 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const template = () => PCTemplate - -export default { - name: $prefix + 'TextPopup', - props: { - ...$props, - modelValue: { - default: '' - }, - placeholder: { - type: String, - required: false - }, - readonly: { - type: Boolean, - default: false - }, - width: { - type: [Number, String], - default: 150, - validator(value) { - return parseInt(value) >= 0 - } - }, - separtor: { - type: String, - default: ',' - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/text-popup/src/pc.vue b/packages/text-popup/src/pc.vue deleted file mode 100644 index e51e1fe92..000000000 --- a/packages/text-popup/src/pc.vue +++ /dev/null @@ -1,39 +0,0 @@ - - - - diff --git a/packages/theme-mobile/.postcssrc.js b/packages/theme-mobile/.postcssrc.js new file mode 100644 index 000000000..5e2725d56 --- /dev/null +++ b/packages/theme-mobile/.postcssrc.js @@ -0,0 +1,7 @@ +module.exports = { + "plugins": { + // to edit target browsers: use "browserslist" field in package.json + "postcss-import": {}, + "autoprefixer": {} + } +} diff --git a/packages/theme-mobile/CHANGELOG.md b/packages/theme-mobile/CHANGELOG.md new file mode 100644 index 000000000..e69de29bb diff --git a/packages/theme-mobile/README.md b/packages/theme-mobile/README.md new file mode 100644 index 000000000..1daf6fcb2 --- /dev/null +++ b/packages/theme-mobile/README.md @@ -0,0 +1,2 @@ +# @opentiny/vue-theme-mobile + diff --git a/packages/theme-mobile/build/gulp-dist.js b/packages/theme-mobile/build/gulp-dist.js new file mode 100644 index 000000000..b5b42237a --- /dev/null +++ b/packages/theme-mobile/build/gulp-dist.js @@ -0,0 +1,42 @@ +/** + * 打包 src 目录到 dist 目录 + */ + +const gulp = require('gulp') +const less = require('gulp-less') +const cssmin = require('gulp-clean-css') +const prefixer = require('gulp-autoprefixer') + +const source = '../src' +const dist = '../dist' + +gulp.task('compile', () => { + return gulp + .src([`${source}/**/index.less`, `${source}/index.less`]) + .pipe(less()) + .pipe( + prefixer({ + borwsers: ['last 1 version', '> 1%', 'not ie <= 8'], + cascade: true, + remove: true + }) + ) + .pipe(cssmin()) + .pipe(gulp.dest(dist)) +}) + +gulp.task('copycssvar', () => { + return gulp + .src([`${source}/**/*.js`, `${source}/index.js`], { allowEmpty: true }) + .pipe(gulp.dest(`${dist}`)) +}) + +gulp.task('copysvgs', () => { + return gulp.src([`${source}/svgs/**`]).pipe(gulp.dest(`${dist}/svgs`)) +}) + +gulp.task('copyimage', () => { + return gulp.src([`${source}/images/**`]).pipe(gulp.dest(`${dist}/images`)) +}) + +gulp.task('build', gulp.series('compile', 'copycssvar', 'copysvgs', 'copyimage')) diff --git a/packages/theme-mobile/build/release.js b/packages/theme-mobile/build/release.js new file mode 100644 index 000000000..362a9dd3e --- /dev/null +++ b/packages/theme-mobile/build/release.js @@ -0,0 +1,22 @@ +/** + * 将 dist 目录生成 TGZ 的压缩包 + */ + +const fs = require('fs') +const path = require('path') +const { execSync } = require('child_process') + +const source = 'dist' + +fs.copyFileSync('package.json', path.join(source, 'package.json')) + +execSync('npm pack', { cwd: source }) + +fs.readdirSync(source).forEach((item) => { + if (item.endsWith('.tgz')) { + const tgzPath = path.join(source, item) + + fs.copyFileSync(tgzPath, path.join(item)) + fs.unlinkSync(tgzPath) + } +}) diff --git a/packages/theme-mobile/package.json b/packages/theme-mobile/package.json new file mode 100644 index 000000000..b0e0954d3 --- /dev/null +++ b/packages/theme-mobile/package.json @@ -0,0 +1,43 @@ +{ + "name": "@opentiny/vue-theme-mobile", + "private": true, + "version": "3.7.0", + "description": "An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.", + "homepage": "https://opentiny.design/tiny-vue", + "main": "index.css", + "keywords": [ + "vue", + "vue3", + "frontend", + "component-library", + "components", + "vue-components", + "opentiny", + "renderless-components", + "headless-components" + ], + "author": "OpenTiny Team", + "license": "MIT", + "exports": { + "./*": "./src/*" + }, + "scripts": { + "clean": "rimraf dist", + "build:theme": "gulp build --gulpfile build/gulp-dist.js", + "build": "npm run clean && npm run build:theme", + "build:fast": "npm run build && npm run release", + "publishTgz": "node .cloudbuild/publish-tgzs.js", + "release": "node build/release.js", + "postversion": "pnpm build" + }, + "devDependencies": { + "@babel/cli": "^7.5.5", + "@babel/core": "^7.5.5", + "@babel/preset-env": "^7.5.5", + "gulp": "^4.0.2", + "gulp-autoprefixer": "^7.0.1", + "gulp-clean-css": "^4.2.0", + "gulp-less": "^4.0.1", + "rimraf": "^2.6.2" + } +} diff --git a/packages/theme-mobile/src/action-sheet/index.js b/packages/theme-mobile/src/action-sheet/index.js new file mode 100644 index 000000000..f0465af8c --- /dev/null +++ b/packages/theme-mobile/src/action-sheet/index.js @@ -0,0 +1,11 @@ +export default { + 'tiny-mobile-action-sheet-content-bg-color': '#fff', + 'tiny-mobile-action-sheet-menu-bg-color': '#fff', + 'tiny-mobile-action-sheet-item-text-color': '#333', + 'tiny-mobile-action-sheet-item-warn-text-color': '#f36f64', + 'tiny-mobile-action-sheet-item-font-size': '12px', + 'tiny-mobile-action-sheet-item-border-color': '#ddd', + 'tiny-mobile-action-sheet-item-active-bg-color': '#ececec', + 'tiny-mobile-action-sheet-item-active-text-color': '#039be5', + 'tiny-mobile-action-sheet-action-bg-color': '#fff', +} diff --git a/packages/theme-mobile/src/action-sheet/index.less b/packages/theme-mobile/src/action-sheet/index.less new file mode 100644 index 000000000..c0f36d97a --- /dev/null +++ b/packages/theme-mobile/src/action-sheet/index.less @@ -0,0 +1,105 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/hairline.less'; +@import '../custom.less'; +@import './vars.less'; + +@action-sheet-prefix-cls: ~'@{css-prefix}mobile-action-sheet'; + +.@{action-sheet-prefix-cls} { + position: relative; + height: 100%; + &__mask { + top: 0; + right: 0; + bottom: 0; + left: 0; + background: rgba(0, 0, 0, 0.6); + z-index: 1000; + } + + &__content { + bottom: 0; + left: 0; + width: 100%; + background-color: var(--ti-mobile-action-sheet-content-bg-color, #fff); + transform: translate(0, 100%); + backface-visibility: hidden; + transition: transform 0.3s; + z-index: 500; + overflow: hidden; + &.is-toggle { + transform: translate(0, 0); + } + &.is-not-content{ + z-index: 2000; + } + } + + &__menu { + background-color: var(--ti-mobile-action-sheet-menu-bg-color, #fff); + } + + &__menu.is-ellipsis &__item { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + display: block; + padding-right: 0; + } + + &__item, + &__cancel { + position: relative; + height: 40px; + line-height: 40px; + padding: 0px 16px; + color: var(--ti-mobile-action-sheet-item-text-color, #333); + font-size: var(--ti-mobile-action-sheet-item-font-size, 16px); + text-align: center; + } + + &__item { + &:active { + background-color: var(--ti-mobile-action-sheet-item-active-bg-color, #ececec); + } + + &.is-active { + color: var(--ti-mobile-action-sheet-item-active-text-color, #039be5); + } + } + + &__item:not(:first-child) { + .hairline('top', var(--ti-mobile-action-sheet-item-border-color, #ddd)); + + &.is-warn { + color: var(--ti-mobile-action-sheet-item-warn-text-color, #f36f64); + } + } + + &__action { + width: 100%; + position: absolute; + background-color: var(--ti-mobile-action-sheet-action-bg-color, #fff); + } +} + +.fade-enter-active, +.fade-leave-active { + transition: opacity 0.6s; +} + +.fade-enter, +.fade-leave-to { + opacity: 0; +} diff --git a/packages/theme-mobile/src/action-sheet/vars.less b/packages/theme-mobile/src/action-sheet/vars.less new file mode 100644 index 000000000..c4ad2c554 --- /dev/null +++ b/packages/theme-mobile/src/action-sheet/vars.less @@ -0,0 +1,11 @@ +:root { + --ti-mobile-action-sheet-content-bg-color: #fff; + --ti-mobile-action-sheet-menu-bg-color: var(--ti-mobile-base-color-light, #fff); + --ti-mobile-action-sheet-item-text-color: var(--ti-mobile-base-color-info-normal, #333); + --ti-mobile-action-sheet-item-warn-text-color: #f36f64; + --ti-mobile-action-sheet-item-font-size: 12px; + --ti-mobile-action-sheet-item-border-color: #ddd; + --ti-mobile-action-sheet-item-active-bg-color: #ececec; + --ti-mobile-action-sheet-item-active-text-color: #039be5; + --ti-mobile-action-sheet-action-bg-color: var(--ti-mobile-base-color-light, #fff); +} diff --git a/packages/theme-mobile/src/alert/index.js b/packages/theme-mobile/src/alert/index.js new file mode 100644 index 000000000..66fc0c44f --- /dev/null +++ b/packages/theme-mobile/src/alert/index.js @@ -0,0 +1,21 @@ +export default { + 'tiny-mobile-alert-warning-icon-color': '#faad14', + 'tiny-mobile-alert-warning-link-color': '#ffc833', + 'tiny-mobile-alert-warning-bg-color': '#fef6e5', + 'tiny-mobile-alert-error-icon-color': '#f5222d', + 'tiny-mobile-alert-error-link-color': '#ff4642', + 'tiny-mobile-alert-error-bg-color': '#fff1f0', + 'tiny-mobile-alert-success-icon-color': '#52c41a', + 'tiny-mobile-alert-success-link-color': '#78d53a', + 'tiny-mobile-alert-success-bg-color': '#f6ffed', + 'tiny-mobile-alert-info-icon-color': '#1890ff', + 'tiny-mobile-alert-info-link-color': '#5ec2ff', + 'tiny-mobile-alert-info-bg-color': '#e6f7ff', + 'tiny-mobile-alert-nomal-height': '30px', + 'tiny-mobile-alert-icon-size': '16px', + 'tiny-mobile-alert-content-font-size': '12px', + 'tiny-mobile-alert-content-color': '#999', + 'tiny-mobile-alert-large-color': '#fff', + 'tiny-mobile-alert-large-bgcolor': '#039be5', + 'tiny-mobile-alert-large-border-radius': '4px' +} diff --git a/packages/theme-mobile/src/alert/index.less b/packages/theme-mobile/src/alert/index.less new file mode 100644 index 000000000..df60b618a --- /dev/null +++ b/packages/theme-mobile/src/alert/index.less @@ -0,0 +1,150 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/alert.less'; +@import '../custom.less'; +@import './vars.less'; + +@alert-prefix-cls: ~'@{css-prefix}mobile-alert'; + +.@{alert-prefix-cls} { + clear: both; + position: relative; + + &--normal { + height: var(--ti-mobile-alert-nomal-height, 30px); + line-height: var(--ti-mobile-alert-nomal-height, 30px); + padding: 0px 16px; + + .@{alert-prefix-cls}__content { + padding-left: 8px; + font-size: var(--ti-mobile-alert-content-font-size, 12px); + color: var(--ti-mobile-alert-content-color, #999); + display: inline-block; + vertical-align: middle; + + &.is-hideicon { + padding: 0; + } + } + } + + &&--large { + padding: 10px; + border-radius: var(--ti-mobile-alert-large-border-radius, 4px); + background: var(--ti-mobile-alert-large-bgcolor, #039be5); + + &::before { + content: ''; + width: 8px; + height: 8px; + border-radius: 50%; + background: var(--ti-mobile-alert-large-bgcolor, #039be5); + display: block; + position: absolute; + top: -24px; + left: 24px; + } + + &::after { + content: ''; + width: 3px; + height: 24px; + background: var(--ti-mobile-alert-large-bgcolor, #039be5); + display: block; + position: absolute; + top: -24px; + left: 24px; + transform: translateX(2px); + } + + .@{alert-prefix-cls}__content { + font-size: 15px; + color: var(--ti-mobile-alert-large-color, #fff); + padding-left: 8px; + display: inline-block; + vertical-align: middle; + + &.is-hideicon { + padding: 0; + } + } + + .@{alert-prefix-cls}__icon { + fill: var(--ti-mobile-alert-large-color, #fff); + } + + .is-custom { + font-size: 15px; + color: #fff; + } + } + + &--success { + .alert-variant( + var(--ti-mobile-alert-success-icon-color, #52c41a) ; + var(--ti-mobile-alert-success-link-color, #78d53a) ; + var(--ti-mobile-alert-success-bg-color, #f6ffed) + ); + } + + &--info { + .alert-variant( + var(--ti-mobile-alert-info-icon-color, #1890ff) ; + var(--ti-mobile-alert-info-link-color, #5ec2ff) ; + var(--ti-mobile-alert-info-bg-color, #e6f7ff) + ); + } + + &--warning { + .alert-variant( + var(--ti-mobile-alert-warning-icon-color, #faad14) ; + var(--ti-mobile-alert-warning-link-color, #ffc833) ; + var(--ti-mobile-alert-warning-bg-color, #fef6e5) + ); + } + + &--error { + .alert-variant( + var(--ti-mobile-alert-error-icon-color, #f5222d) ; + var(--ti-mobile-alert-error-link-color, #ff4642) ; + var(--ti-mobile-alert-error-bg-color, #fff1f0) + ); + } + + &__icon { + font-size: var(--ti-mobile-alert-icon-size, 16px); + } + + &.is-center { + text-align: center; + } + + .is-custom { + position: absolute; + top: 50%; + right: 12px; + transform: translateY(-50%); + cursor: pointer; + font-size: 12px; + color: #999; + } + + & &__close { + font-size: var(--ti-mobile-alert-content-font-size, 12px); + position: absolute; + top: 50%; + right: 12px; + transform: translateY(-50%); + cursor: pointer; + } +} diff --git a/packages/theme-mobile/src/alert/vars.less b/packages/theme-mobile/src/alert/vars.less new file mode 100644 index 000000000..de801c6c6 --- /dev/null +++ b/packages/theme-mobile/src/alert/vars.less @@ -0,0 +1,26 @@ +:root { + --ti-mobile-alert-warning-icon-color: var(--ti-mobile-base-color-warning-normal, #faad14); + --ti-mobile-alert-warning-link-color: #ffc833; + --ti-mobile-alert-warning-bg-color: #fef6e5; + + --ti-mobile-alert-error-icon-color: var(--ti-mobile-base-color-danger-normal, #f5222d); + --ti-mobile-alert-error-link-color: #ff4642; + --ti-mobile-alert-error-bg-color: #fff1f0; + + --ti-mobile-alert-success-icon-color: var(--ti-mobile-base-color-success-normal, #52c41a); + --ti-mobile-alert-success-link-color: #78d53a; + --ti-mobile-alert-success-bg-color: #f6ffed; + + --ti-mobile-alert-info-icon-color: var(--ti-mobile-base-color-primary-normal, #1890ff); + --ti-mobile-alert-info-link-color: #5ec2ff; + --ti-mobile-alert-info-bg-color: var(--ti-mobile-base-color-hover-background, #e6f7ff); + + --ti-mobile-alert-nomal-height: var(--ti-mobile-base-size-height-minor, 30px); + --ti-mobile-alert-icon-size: 16px; + --ti-mobile-alert-content-font-size: var(--ti-mobile-base-font-size-base, 12px); + --ti-mobile-alert-content-color: var(--ti-mobile-base-color-placeholder, #999); + + --ti-mobile-alert-large-color: var(--ti-mobile-base-color-light, #fff); + --ti-mobile-alert-large-bgcolor: #039be5; + --ti-mobile-alert-large-border-radius: 4px; +} diff --git a/packages/theme-mobile/src/avatar/index.js b/packages/theme-mobile/src/avatar/index.js new file mode 100644 index 000000000..ed9da6dec --- /dev/null +++ b/packages/theme-mobile/src/avatar/index.js @@ -0,0 +1,11 @@ +export default { + 'tiny-mobile-avatar-color': '#fff', + 'tiny-mobile-avatar-bgcolor': '#c0c4cc', + 'tiny-mobile-avatar-size': '40px', + 'tiny-mobile-avatar-font-size': '14px', + 'tiny-mobile-avatar-icon-font-size': '18px', + 'tiny-mobile-avatar-square-border-radius': '4px', + 'tiny-mobile-avatar-large-size': '80px', + 'tiny-mobile-avatar-medium-size': '56px', + 'tiny-mobile-avatar-small-size': '48px' +} diff --git a/packages/theme-mobile/src/avatar/index.less b/packages/theme-mobile/src/avatar/index.less new file mode 100644 index 000000000..564f3aa7b --- /dev/null +++ b/packages/theme-mobile/src/avatar/index.less @@ -0,0 +1,66 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import '../base/index.less'; +@import './vars.less'; + +@avatar-prefix-cls: ~'@{css-prefix}mobile-avatar'; + +.@{avatar-prefix-cls} { + display: inline-block; + box-sizing: border-box; + text-align: center; + overflow: hidden; + border-style: solid; + border-width: 0; + color: var(--ti-mobile-avatar-color, #fff); + background: var(--ti-mobile-avatar-bgcolor, #c0c4cc); + width: var(--ti-mobile-avatar-size, 40px); + height: var(--ti-mobile-avatar-size, 40px); + line-height: var(--ti-mobile-avatar-size, 40px); + font-size: var(--ti-mobile-avatar-font-size, 14px); + + & > img { + height: 100%; + } + + &--square { + border-radius: var(--ti-mobile-avatar-square-border-radius, 4px); + } + + &--icon { + font-size: var(--ti-mobile-avatar-icon-font-size, 18px); + } + + &--large { + width: var(--ti-mobile-avatar-large-size, 80px); + height: var(--ti-mobile-avatar-large-size, 80px); + line-height: var(--ti-mobile-avatar-large-size, 80px); + } + + &--medium { + width: var(--ti-mobile-avatar-medium-size, 56px); + height: var(--ti-mobile-avatar-medium-size, 56px); + line-height: var(--ti-mobile-avatar-medium-size, 56px); + } + + &--small { + width: var(--ti-mobile-avatar-small-size, 48px); + height: var(--ti-mobile-avatar-small-size, 48px); + line-height: var(--ti-mobile-avatar-small-size, 48px); + } + + &--bg-color { + background-color: var(--ti-mobile-base-color-brand-1); + } +} diff --git a/packages/theme-mobile/src/avatar/vars.less b/packages/theme-mobile/src/avatar/vars.less new file mode 100644 index 000000000..70cccede8 --- /dev/null +++ b/packages/theme-mobile/src/avatar/vars.less @@ -0,0 +1,11 @@ +:root { + --ti-mobile-avatar-color: var(--ti-mobile-base-color-light, #fff); + --ti-mobile-avatar-bgcolor: #c0c4cc; + --ti-mobile-avatar-size: 40px; + --ti-mobile-avatar-font-size: 14px; + --ti-mobile-avatar-icon-font-size: 18px; + --ti-mobile-avatar-square-border-radius: 4px; + --ti-mobile-avatar-large-size: 80px; + --ti-mobile-avatar-medium-size: 56px; + --ti-mobile-avatar-small-size: 48px; +} diff --git a/packages/theme-mobile/src/badge/index.js b/packages/theme-mobile/src/badge/index.js new file mode 100644 index 000000000..d939de260 --- /dev/null +++ b/packages/theme-mobile/src/badge/index.js @@ -0,0 +1,10 @@ +export default { + 'tiny-mobile-badge-size': '18px', + 'tiny-mobile-badge-font-size': '13px', + 'tiny-mobile-badge-color': '#fff', + 'tiny-mobile-badge-primary-bgcolor': '#1890ff', + 'tiny-mobile-badge-success-bgcolor': '#52c41a', + 'tiny-mobile-badge-warning-bgcolor': '#faad14', + 'tiny-mobile-badge-danger-bgcolor': '#f36f64', + 'tiny-mobile-badge-info-bgcolor': '#333333' +} diff --git a/packages/theme-mobile/src/badge/index.less b/packages/theme-mobile/src/badge/index.less new file mode 100644 index 000000000..59d28e1c1 --- /dev/null +++ b/packages/theme-mobile/src/badge/index.less @@ -0,0 +1,97 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@badge-prefix-cls: ~'@{css-prefix}mobile-badge'; + +.@{badge-prefix-cls} { + position: relative; + vertical-align: middle; + display: inline-block; + + &__content { + height: var(--ti-mobile-badge-size, 18px); + line-height: var(--ti-mobile-badge-size, 18px); + padding: 0 6px; + font-size: var(--ti-mobile-badge-font-size, 13px); + color: var(--ti-mobile-badge-color, #fff); + background-color: var(--ti-mobile-badge-danger-bgcolor, #f36f64); + border-radius: 10px; + font-family: 'Microsoft YaHei', Arial; + display: inline-block; + white-space: nowrap; + text-align: center; + + &.is-fixed { + position: absolute; + top: 0; + right: 0; + transform: translate(100%, -50%); + } + + &.is-dot { + height: 8px; + width: 8px; + padding: 0; + border-radius: 50%; + vertical-align: super; + } + + &.is-mini { + height: 14px; + line-height: 14px; + + &, + &.is-circle { + padding: 0 4px; + } + } + + &.is-circle { + padding: 0 5px; + + &.is-dot { + padding: 0; + } + } + } + + &__content&--primary { + background-color: var(--ti-mobile-badge-primary-bgcolor, #1890ff); + } + + &__content&--success { + background-color: var(--ti-mobile-badge-success-bgcolor, #52c41a); + } + + &__content&--warning { + background-color: var(--ti-mobile-badge-warning-bgcolor, #faad14); + } + + &__content&--danger { + background-color: var(--ti-mobile-badge-danger-bgcolor, #f36f64); + } + + &__content&--info { + background-color: var(--ti-mobile-badge-info-bgcolor, #333); + } + + & &__link { + color: var(--ti-mobile-badge-color, #fff); + &:hover { + color: var(--ti-mobile-badge-color, #fff); + text-decoration: none; + } + } +} diff --git a/packages/theme-mobile/src/badge/vars.less b/packages/theme-mobile/src/badge/vars.less new file mode 100644 index 000000000..af21c7518 --- /dev/null +++ b/packages/theme-mobile/src/badge/vars.less @@ -0,0 +1,10 @@ +:root { + --ti-mobile-badge-size: 18px; + --ti-mobile-badge-font-size: 13px; + --ti-mobile-badge-color: var(--ti-mobile-base-color-light, #fff); + --ti-mobile-badge-primary-bgcolor: var(--ti-mobile-base-color-primary-normal, #1890ff); + --ti-mobile-badge-success-bgcolor: var(--ti-mobile-base-color-success-normal, #52c41a); + --ti-mobile-badge-warning-bgcolor: var(--ti-mobile-base-color-warning-normal, #faad14); + --ti-mobile-badge-danger-bgcolor: #f36f64; + --ti-mobile-badge-info-bgcolor: var(--ti-mobile-base-color-info-normal, #333333); +} diff --git a/packages/theme-mobile/src/base/basic-var.less b/packages/theme-mobile/src/base/basic-var.less new file mode 100644 index 000000000..0f26d3331 --- /dev/null +++ b/packages/theme-mobile/src/base/basic-var.less @@ -0,0 +1,107 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +/*基础变量定义*/ +:root { + /* 品牌色*/ + --ti-mobile-base-color-brand-1: #4a79fe; /* 蓝_品牌色*/ + --ti-mobile-base-color-brand-2: #3168f1; + --ti-mobile-base-color-brand-3: #6e94fe; + --ti-mobile-base-color-brand-4: #92affe; + --ti-mobile-base-color-brand-5: #b7c9ff; + --ti-mobile-base-color-brand-6: #95a2f8; + --ti-mobile-base-color-brand-6: #ffffff; + + /* 1.2背景色*/ + --ti-mobile-base-color-bg-1: #f5f5f5; /* 深灰_背景色*/ + --ti-mobile-base-color-bg-2: #fafafa; /* 浅灰_背景色*/ + --ti-mobile-base-color-bg-3: #ffffff; /* 白色_背景色*/ + + /* 文本、线、面等常用灰色可用颜色参考:*/ + --ti-mobile-base-color-common-1: #000000; + --ti-mobile-base-color-common-2: #191919; + --ti-mobile-base-color-common-3: #262626; + --ti-mobile-base-color-common-4: #333333; + --ti-mobile-base-color-common-5: #595959; + --ti-mobile-base-color-common-6: #999999; + --ti-mobile-base-color-common-7: #c2c2c2; + --ti-mobile-base-color-common-8: #dbdbdb; + --ti-mobile-base-color-common-9: #ededed; + --ti-mobile-base-color-common-10: #f5f5f5; + --ti-mobile-base-color-common-11: #fafafa; + --ti-mobile-base-color-common-12: #ffffff; + --ti-mobile-base-color-common-13: #627199; + + /* 功能色*/ + --ti-mobile-common-color-warning-figure-1: #eb4096; /* 致命警告图形色*/ + --ti-mobile-common-color-warning-text-1: #e61c81; /* 致命警告文字色*/ + --ti-mobile-common-color-warning-figure-2: #ff9c32; /* 一般告警/中性1图形色*/ + --ti-mobile-common-color-warning-text-2: #ff8800; /* 一般告警/中性1文字色*/ + --ti-mobile-common-color-warning-figure-3: #1ebe40; /* 一般告警/中性1图形色*/ + --ti-mobile-common-color-warning-text-3: #00b336; /* 一般告警/中性1文字色*/ + + --ti-mobile-common-color-error-figure-1: #eb5454; /* 异常/下降/告警/驳回/退订/失败图形色*/ + --ti-mobile-common-color-error-text-1: #e62222; /* 异常/下降/告警/驳回/退订/失败文字色*/ + --ti-mobile-common-color-error-figure-2: #fccd32; /* 异常/下降/告警/驳回/退订/失败图形色*/ + --ti-mobile-common-color-error-text-2: #fcbe1e; /* 异常/下降/告警/驳回/退订/失败文字色*/ + --ti-mobile-common-color-error-figure-3: #1e8aff; /* 异常/下降/告警/驳回/退订/失败图形色*/ + --ti-mobile-common-color-error-text-3: #1476ff; /* 异常/下降/告警/驳回/退订/失败文字色*/ + --ti-mobile-common-color-error-figure-4: #c2c2c2; /* 异常/下降/告警/驳回/退订/失败图形色*/ + --ti-mobile-common-color-error-text-4: #999999; /* 异常/下降/告警/驳回/退订/失败文字色*/ + + /* 图表推荐配色*/ + --ti-mobile-common-color-chart-1: #1476ff; + --ti-mobile-common-color-chart-2: #10c7c1; + --ti-mobile-common-color-chart-3: #b878f0; + --ti-mobile-common-color-chart-4: #d6a981; + --ti-mobile-common-color-chart-5: #c1cc7a; + + /* 文本色*/ + --ti-mobile-common-color-text-primary: var(--ti-mobile-base-color-common-2); /* 一级文本色-重要信息/标题颜色/输入类文本颜色*/ + --ti-mobile-common-color-text-secondary: var(--ti-mobile-base-color-common-5); /* 二级文本色-次要信息*/ + --ti-mobile-common-color-text-weaken-dark: var(--ti-mobile-base-color-common-6); /* 三级文本色-弱化信息/说明文字*/ + --ti-mobile-common-color-text-weaken-ligtht: var(--ti-mobile-base-color-common-7); /* 文本_弱化色_浅色/提示*/ + --ti-mobile-common-color-text-weaken-disabled: var(--ti-mobile-base-color-common-8); /* 文本_弱化色_浅色/禁用*/ + --ti-mobile-common-color-text-white: var(--ti-mobile-base-color-common-12); /* 文本_白色*/ + --ti-mobile-common-color-text-placeholder-primary: #dbe5fc; /* placeholder_主要*/ + --ti-mobile-common-color-text-placeholder-gray: #acacac; /* placeholder_灰*/ + --ti-mobile-common-color-text-high-light: var(--ti-mobile-base-color-brand-1); /* 文本_高亮*/ + + /* 文本链接色*/ + --ti-mobile-common-color-link-dark: var(--ti-mobile-base-color-common-2); /* 文本_链接__深色*/ + --ti-mobile-common-color-link-highlight: var(--ti-mobile-base-color-brand-1); /* 文本_链接_高亮色*/ + --ti-mobile-common-color-link-gray: var(--ti-mobile-base-color-common-13); /* 文本_链接_灰色加强*/ + --ti-mobile-common-color-link-white: var(--ti-mobile-base-color-common-12); /* 文本_链接_白色*/ + + /* 线颜色*/ + --ti-mobile-common-color-line-hightlight: var(--ti-mobile-base-color-brand-1); /* 高亮_描边色*/ + --ti-mobile-common-color-line-dark: var(--ti-mobile-base-color-common-9); /* 深_描边色*/ + --ti-mobile-common-color-line-light: var(--ti-mobile-base-color-common-10); /* 浅_描边色*/ + --ti-mobile-common-color-line-white: var(--ti-mobile-base-color-common-12); /* 白色*/ + + /* 蒙层色*/ + --ti-mobile-common-color-mask-light: rgba(0, 0, 0, 0.5); /* 蒙层_相对浅*/ + --ti-mobile-common-color-mask-dark: rgba(0, 0, 0, 0.75); /* 蒙层_相对深*/ + + /* 背景色*/ + --ti-mobile-common-bg-color-white: var(--ti-mobile-base-color-bg-3); /* 背景_白*/ + --ti-mobile-common-bg-color-main: var(--ti-mobile-base-color-brand-1); /* 背景_蓝*/ + --ti-mobile-common-bg-color-light: var(--ti-mobile-base-color-bg-2); /* 背景_浅灰*/ + --ti-mobile-common-bg-color-blue-1: var(--ti-mobile-base-color-brand-2); /* 背景_蓝*/ + --ti-mobile-common-bg-color-disabled: #e8e8e8; /* 背景_禁用*/ + --ti-mobile-common-bg-color-dark-gray: var(--ti-mobile-base-color-bg-1); /* 背景_深灰*/ + --ti-mobile-common-bg-color-weaken: var(--ti-mobile-base-color-common-8); /* 背景_弱化色*/ + --ti-mobile-common-status-bg-color-success: #5bd475; /* 背景_成功/通过*/ + --ti-mobile-common-status-bg-color-error: #eb5454; /* 背景_失败/驳回*/ + --ti-mobile-common-status-bg-color-normal: #fff; /* 背景_默认*/ + --ti-mobile-common-status-bg-color-handing: var(--ti-mobile-base-color-brand-1); /* 背景_进行中*/ +} diff --git a/packages/theme-mobile/src/base/index-global.less b/packages/theme-mobile/src/base/index-global.less new file mode 100644 index 000000000..20e7ada8b --- /dev/null +++ b/packages/theme-mobile/src/base/index-global.less @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import './reset.less'; +@import '../error-page/index-global.less'; +@import '../svg/index.less'; diff --git a/packages/theme-mobile/src/base/index.js b/packages/theme-mobile/src/base/index.js new file mode 100644 index 000000000..e9ec5fcb1 --- /dev/null +++ b/packages/theme-mobile/src/base/index.js @@ -0,0 +1,61 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-base-color-primary-disabled': '#bfbfbf', + 'tiny-base-color-primary-normal': '#1890ff', + 'tiny-base-color-primary-active': '#096dd9', + 'tiny-base-color-primary-hover': '#40a9ff', + 'tiny-base-color-success-normal': '#52c41a', + 'tiny-base-color-success-disabled': '#a6c3b9', + 'tiny-base-color-success-active': '#389e0d', + 'tiny-base-color-success-hover': '#73d13d', + 'tiny-base-color-warning-normal': '#faad14', + 'tiny-base-color-warning-hover': '#ffc53d', + 'tiny-base-color-warning-disabled': '#d3c6a2', + 'tiny-base-color-warning-active': '#ffc53d', + 'tiny-base-color-danger-disabled': '#d8bab5', + 'tiny-base-color-danger-normal': '#f5222d', + 'tiny-base-color-danger-hover': '#ff4d4f', + 'tiny-base-color-danger-active': '#cf1322', + 'tiny-base-color-info-disabled': '#bfbfbf', + 'tiny-base-color-info-hover': '#54657e', + 'tiny-base-color-info-normal': '#333333', + 'tiny-base-color-info-active': '#54657e', + 'tiny-base-color-light': '#fff', + 'tiny-base-color-dark': '#000', + 'tiny-base-color-border': '#d9d9d9', + 'tiny-base-color-secondary': '#666', + 'tiny-base-color-placeholder': '#999', + 'tiny-base-color-hover-background': '#e6f7ff', + 'tiny-base-color-selected-background': '#f5f5f5', + 'tiny-base-color-navigation-background': '#2e3243', + 'tiny-base-radius-large': '3px', + 'tiny-base-radius-medium': '2px', + 'tiny-base-radius-small': '1px', + 'tiny-base-font-family-normal': 'Helvetica, Arial, "microsoft yahei"', + 'tiny-base-font-size': '12px', + 'tiny-base-font-size-normal': '1em', + 'tiny-base-font-size-large': '1.125em', + 'tiny-base-font-weight-bold': '700', + 'tiny-base-size-width-large': '130px', + 'tiny-base-size-width-medium': '120px', + 'tiny-base-size-width-normal': '80px', + 'tiny-base-size-width-small': '36px', + 'tiny-base-size-width-minor': '30px', + 'tiny-base-size-width-mini': '24px', + 'tiny-base-size-height-large': '48px', + 'tiny-base-size-height-medium': '42px', + 'tiny-base-size-height-small': '36px', + 'tiny-base-size-height-minor': '30px', + 'tiny-base-size-height-mini': '24px' +} diff --git a/packages/theme-mobile/src/base/index.less b/packages/theme-mobile/src/base/index.less new file mode 100644 index 000000000..f8095b848 --- /dev/null +++ b/packages/theme-mobile/src/base/index.less @@ -0,0 +1,17 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import './reset.less'; +@import '../error-page/index.less'; +@import '../svg/index.less'; +@import './basic-var.less'; +@import './vars.less'; diff --git a/packages/theme-mobile/src/base/reset.less b/packages/theme-mobile/src/base/reset.less new file mode 100644 index 000000000..7a9fb1708 --- /dev/null +++ b/packages/theme-mobile/src/base/reset.less @@ -0,0 +1,210 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +[class*=~'@{css-prefix}'] { + -webkit-box-sizing: border-box; + box-sizing: border-box; + + *:after, + *:before { + -webkit-box-sizing: border-box; + box-sizing: border-box; + } + + a { + cursor: pointer; + background-image: none; + text-decoration: none; + outline: none; + + &:focus, + &:active, + &:hover { + outline: none; + text-decoration: none; + } + } + + dl, + dt, + dd, + ul, + ol, + li, + th, + td { + margin: 0; + padding: 0; + } + + ol, + ul { + list-style: none; + } + + audio, + canvas, + video { + display: inline-block; + } + + audio:not([controls]) { + display: none; + height: 0; + } + + mark { + background: #ff0; + color: #000; + } + + pre { + white-space: pre-wrap; + } + + sub, + sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; + } + + sup { + top: -0.5em; + } + + sub { + bottom: -0.25em; + } + + fieldset { + border: 1px solid #c0c0c0; + margin: 0 2px; + padding: 0.35em 0.625em 0.75em; + } + + legend { + border: 0; + padding: 0; + } + + // 清除IE + input::-ms-clear, + input::-ms-reveal { + display: none; + } + + button::-moz-focus-inner, + input::-moz-focus-inner { + border: 0; + padding: 0; + } + + textarea { + overflow: auto; + vertical-align: top; + } + + table { + border-collapse: collapse; + border-spacing: 0; + } + + .@{css-prefix}hide { + display: none; + } + + .popper__arrow { + &, + &:after { + position: absolute; + display: block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + } + } + + @media (min-width: 768px) { + ::-webkit-scrollbar { + width: 8px; + height: 8px; + } + + ::-webkit-scrollbar-track-piece { + background: #fafafa; + } + + ::-webkit-scrollbar-thumb { + background: #5c6173; + border-radius: 6px; + } + + ::-webkit-scrollbar-thumb:hover { + background: #999999; + } + + ::-webkit-scrollbar-thumb:active { + background: #999999; + } + + .@{css-prefix}scrollbar::-webkit-scrollbar { + width: 8px; + height: 8px; + } + + .@{css-prefix}scrollbar::-webkit-scrollbar-track-piece { + background: transparent; + border: 0; + } + + .@{css-prefix}scrollbar::-webkit-scrollbar-thumb { + background: #5c6173; + border-radius: 4px; + } + + .@{css-prefix}scrollbar::-webkit-scrollbar-thumb:hover { + background: #999999; + } + + .@{css-prefix}scrollbar::-webkit-scrollbar-thumb:active { + background: #999999; + } + + .@{css-prefix}min-scrollbar::-webkit-scrollbar { + width: 4px; + height: 4px; + } + + .@{css-prefix}min-scrollbar::-webkit-scrollbar-track-piece { + background: transparent; + border: 0; + } + + .@{css-prefix}min-scrollbar::-webkit-scrollbar-thumb { + background: #bfbfbf; + border-radius: 2px; + } + + .@{css-prefix}min-scrollbar::-webkit-scrollbar-thumb:hover { + background: #999999; + } + + .@{css-prefix}min-scrollbar::-webkit-scrollbar-thumb:active { + background: #999999; + } + } +} diff --git a/packages/theme-mobile/src/base/vars.less b/packages/theme-mobile/src/base/vars.less new file mode 100644 index 000000000..7a3ab5a4e --- /dev/null +++ b/packages/theme-mobile/src/base/vars.less @@ -0,0 +1,49 @@ +:root { + --ti-mobile-base-color-primary-normal: #1890ff; + --ti-mobile-base-color-primary-disabled: #bfbfbf; + --ti-mobile-base-color-primary-hover: #40a9ff; + --ti-mobile-base-color-primary-active: #096dd9; + --ti-mobile-base-color-success-normal: #52c41a; + --ti-mobile-base-color-success-disabled: #a6c3b9; + --ti-mobile-base-color-success-hover: #73d13d; + --ti-mobile-base-color-success-active: #389e0d; + --ti-mobile-base-color-warning-normal: #faad14; + --ti-mobile-base-color-warning-disabled: #d3c6a2; + --ti-mobile-base-color-warning-hover: #ffc53d; + --ti-mobile-base-color-warning-active: #ffc53d; + --ti-mobile-base-color-danger-normal: #f5222d; + --ti-mobile-base-color-danger-disabled: #d8bab5; + --ti-mobile-base-color-danger-hover: #ff4d4f; + --ti-mobile-base-color-danger-active: #cf1322; + --ti-mobile-base-color-info-normal: #333333; + --ti-mobile-base-color-info-disabled: #bfbfbf; + --ti-mobile-base-color-info-hover: #54657e; + --ti-mobile-base-color-info-active: #54657e; + --ti-mobile-base-color-light: #fff; + --ti-mobile-base-color-dark: #000; + --ti-mobile-base-color-border: #d9d9d9; + --ti-mobile-base-color-secondary: #666; + --ti-mobile-base-color-placeholder: #999; + --ti-mobile-base-color-hover-background: #e6f7ff; + --ti-mobile-base-color-selected-background: #f5f5f5; + --ti-mobile-base-color-navigation-background: #2e3243; + --ti-mobile-base-radius-large: 3px; + --ti-mobile-base-radius-medium: 2px; + --ti-mobile-base-radius-small: 1px; + --ti-mobile-base-font-family-normal: Helvetica, Arial, 'microsoft yahei'; + --ti-mobile-base-font-size: 12px; + --ti-mobile-base-font-size-normal: 1em; + --ti-mobile-base-font-size-large: 1.125em; + --ti-mobile-base-font-weight-bold: 700; + --ti-mobile-base-size-width-large: 130px; + --ti-mobile-base-size-width-medium: 120px; + --ti-mobile-base-size-width-normal: 80px; + --ti-mobile-base-size-width-small: 36px; + --ti-mobile-base-size-width-minor: 30px; + --ti-mobile-base-size-width-mini: 24px; + --ti-mobile-base-size-height-large: 48px; + --ti-mobile-base-size-height-medium: 42px; + --ti-mobile-base-size-height-small: 36px; + --ti-mobile-base-size-height-minor: 30px; + --ti-mobile-base-size-height-mini: 24px; +} diff --git a/packages/theme-mobile/src/button/index.js b/packages/theme-mobile/src/button/index.js new file mode 100644 index 000000000..83c5babd7 --- /dev/null +++ b/packages/theme-mobile/src/button/index.js @@ -0,0 +1,24 @@ +export default { + 'tiny-mobile-button-height': '42px', + 'tiny-mobile-button-font-size-default': '16px', + 'tiny-mobile-button-text-color-white': '#fff', + 'tiny-mobile-button-text-color-disabled': '#dbdbdb', + 'tiny-mobile-button-text-color-default': '#191919', + 'tiny-mobile-button-border-color': '#dbdbdb', + 'tiny-mobile-button-bg-color-default': '#fff', + 'tiny-mobile-button-bg-color-primary': '#1e8aff', + 'tiny-mobile-button-bg-color-success': '#1ebe40', + 'tiny-mobile-button-bg-color-warning': '#fccd32', + 'tiny-mobile-button-bg-color-danger': '#eb5454', + 'tiny-mobile-button-bg-color-disabled': '#e8e8e8', + 'tiny-mobile-button-bg-color-info': '#333', + 'tiny-mobile-button-height-medium': '36px', + 'tiny-mobile-button-font-size-medium': '14px', + 'tiny-mobile-button-height-small': '28px', + 'tiny-mobile-button-font-size-small': '12px', + 'tiny-mobile-button-height-mini': '22px', + 'tiny-mobile-button-font-size-mini': '10px', + 'tiny-mobile-button-text-color': '#4a79fe', + 'tiny-mobile-button-text-color-hover': '#6e94fe', + 'tiny-mobile-button-text-color-active': '#4a79fe', +} diff --git a/packages/theme-mobile/src/button/index.less b/packages/theme-mobile/src/button/index.less new file mode 100644 index 000000000..8abd513f6 --- /dev/null +++ b/packages/theme-mobile/src/button/index.less @@ -0,0 +1,236 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/button.less'; +@import '../custom.less'; +@import './vars.less'; + +@button-prefix-cls: ~'@{css-prefix}mobile-button'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{button-prefix-cls} { + position: relative; + margin: 0; + padding: 0; + height: var(--ti-mobile-button-height); + line-height: var(--ti-mobile-button-height); + font-size: var(--ti-mobile-button-font-size-default); + -webkit-text-size-adjust: 100%; + border-width: 1px; + border-style: solid; + border-image: initial; + border-radius: 2px; + padding: 0 16px; + transition: border 0.3s ease 0s, color 0.3s ease 0s, background 0.3s ease 0s; + cursor: pointer; + outline: 0; + display: inline-block; + user-select: none; + -webkit-appearance: none; + text-align: center; + box-sizing: border-box; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + + &::before { + position: absolute; + top: 50%; + left: 50%; + width: 100%; + height: 100%; + background-color: #000; + border: inherit; + border-color: #000; + border-radius: inherit; + transform: translate(-50%, -50%); + opacity: 0; + content: ' '; + } + + &::-moz-focus-inner { + border: 0; + } + + &:active, + &.is-active { + &::before { + opacity: 0.1; + } + } + + &.is-disabled, + &.is-disabled:active, + &.is-disabled.is-active { + cursor: not-allowed; + .button-color(var(--ti-mobile-button-text-color-disabled), + var(--ti-mobile-button-bg-color-disabled), + var(--ti-mobile-button-bg-color-disabled)); + } + + .is-icon { + fill: var(--ti-mobile-button-text-color-white); + font-size: var(--ti-mobile-button-font-size-default); + } + + &--default { + .button-color(var(--ti-mobile-button-text-color-default), + var(--ti-mobile-button-border-color), + var(--ti-mobile-button-bg-color-default)); + + .is-icon { + fill: var(--ti-mobile-button-text-color-default); + } + + &.is-disabled .is-icon { + fill: var(--ti-mobile-button-text-color-white); + } + } + + &&--default { + &.is-loading svg { + fill: #666; + } + } + + &--primary { + .button-type(var(--ti-mobile-button-text-color-white), + var(--ti-mobile-button-bg-color-primary)); + + &.is-plain { + .button-plain(var(--ti-mobile-button-bg-color-primary)); + } + } + + &--success { + .button-type(var(--ti-mobile-button-text-color-white), + var(--ti-mobile-button-bg-color-success)); + + &.is-plain { + .button-plain(var(--ti-mobile-button-bg-color-success)); + } + } + + &--warning { + .button-type(var(--ti-mobile-button-text-color-white), + var(--ti-mobile-button-bg-color-warning)); + + &.is-plain { + .button-plain(var(--ti-mobile-button-bg-color-warning)); + } + } + + &--danger { + .button-type(var(--ti-mobile-button-text-color-white), + var(--ti-mobile-button-bg-color-danger)); + + &.is-plain { + .button-plain(var(--ti-mobile-button-bg-color-danger)); + } + } + + &--info { + .button-type(var(--ti-mobile-button-text-color-white), + var(--ti-mobile-button-bg-color-info)); + + &.is-plain { + .button-plain(var(--ti-mobile-button-bg-color-info)); + } + } + + &--text { + .button-text(var(--ti-mobile-button-text-color), + var(--ti-mobile-button-text-color-hover), + var(--ti-mobile-button-text-color-active), + var(--ti-mobile-button-text-color-disabled)); + } + + &--secondary { + .button-type(var(--ti-mobile-button-text-color-default), + var(--ti-mobile-button-bg-color-secondary)); + + &.is-plain { + .button-plain(var(--ti-mobile-button-bg-color-secondary)); + } + } + + &--default { + .button-color(var(--ti-mobile-button-text-color-default), + var(--ti-mobile-button-text-color-disabled), + var(--ti-mobile-button-text-color-white)); + + &.is-disabled { + .button-color(var(--ti-mobile-button-text-color-disabled), + var(--ti-mobile-button-text-color-disabled), + var(--ti-mobile-button-bg-color-white)); + } + } + + &--large { + padding: 0 20px; + } + + &--medium { + padding: 0 16px; + line-height: 36px; + + .button-size(var(--ti-mobile-button-height-medium), + var(--ti-mobile-button-font-size-medium,)); + } + + &--small { + padding: 0 12px; + line-height: 28px; + + .button-size(var(--ti-mobile-button-height-small), + var(--ti-mobile-button-font-size-small)); + } + + &--mini { + padding: 0 8px; + line-height: 22px; + + .button-size(var(--ti-mobile-button-height-mini), + var(--ti-mobile-button-font-size-mini)); + } + + &.is-loading { + position: relative; + pointer-events: none; + + svg { + fill: var(--ti-mobile-button-text-color-white); + font-size: var(--ti-mobile-button-font-size-default); + } + } + + &.is-round { + border-radius: 999px; + } +} + +.@{css-prefix-iconfont}-loading { + margin-right: 4px; + font-size: 16px; + line-height: 1; + animation: rotating 2s linear infinite; +} + +@keyframes rotating { + 0% { + transform: rotateZ(0deg); + } + + 100% { + transform: rotateZ(360deg); + } +} diff --git a/packages/theme-mobile/src/button/vars.less b/packages/theme-mobile/src/button/vars.less new file mode 100644 index 000000000..724060bb8 --- /dev/null +++ b/packages/theme-mobile/src/button/vars.less @@ -0,0 +1,24 @@ +:root { + --ti-mobile-button-height: 42px; + --ti-mobile-button-font-size-default: 16px; + --ti-mobile-button-text-color-white: var(--ti-mobile-common-color-text-white, #fff); + --ti-mobile-button-text-color-disabled: var(--ti-mobile-common-color-text-weaken-disabled, #dbdbdb); + --ti-mobile-button-text-color-default: var(--ti-mobile-common-color-text-primary, #191919); + --ti-mobile-button-border-color: var(--ti-mobile-common-color-text-weaken-disabled, #dbdbdb); + --ti-mobile-button-bg-color-default: var(--ti-mobile-common-bg-color-white, #fff); + --ti-mobile-button-bg-color-primary: var(--ti-mobile-common-color-error-figure-3, #1e8aff); + --ti-mobile-button-bg-color-success: var(--ti-mobile-common-color-warning-figure-3, #1ebe40); + --ti-mobile-button-bg-color-warning: var(--ti-mobile-common-color-error-figure-2, #fccd32); + --ti-mobile-button-bg-color-danger: var(--ti-mobile-common-color-error-figure-1, #eb5454); + --ti-mobile-button-bg-color-disabled: var(--ti-mobile-common-bg-color-disabled, #e8e8e8); + --ti-mobile-button-bg-color-info: #333; + --ti-mobile-button-height-medium: 36px; + --ti-mobile-button-font-size-medium: 14px; + --ti-mobile-button-height-small: 28px; + --ti-mobile-button-font-size-small: 12px; + --ti-mobile-button-height-mini: 22px; + --ti-mobile-button-font-size-mini: 10px; + --ti-mobile-button-text-color: var(--ti-mobile-common-color-link-highlight, #4a79fe); + --ti-mobile-button-text-color-hover: #6e94fe; + --ti-mobile-button-text-color-active: var(--ti-mobile-common-color-link-highlight, #4a79fe); +} diff --git a/packages/theme-mobile/src/checkbox-group/index.js b/packages/theme-mobile/src/checkbox-group/index.js new file mode 100644 index 000000000..3722f49c2 --- /dev/null +++ b/packages/theme-mobile/src/checkbox-group/index.js @@ -0,0 +1,3 @@ +export default { + // mobile/checkbox-group +} diff --git a/packages/theme-mobile/src/checkbox-group/index.less b/packages/theme-mobile/src/checkbox-group/index.less new file mode 100644 index 000000000..dbbb355b1 --- /dev/null +++ b/packages/theme-mobile/src/checkbox-group/index.less @@ -0,0 +1,29 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@checkbox-group-prefix-cls: ~'@{css-prefix}mobile-checkbox-group'; +@checkbox-prefix-cls: ~'@{css-prefix}mobile-checkbox'; + +.@{checkbox-group-prefix-cls} { + display: flex; + flex-wrap: wrap; + + &.is-vertical { + flex-direction: column; + + .@{checkbox-prefix-cls}:last-of-type { + margin-right: 30px; + } + } +} diff --git a/packages/theme-mobile/src/checkbox/index.js b/packages/theme-mobile/src/checkbox/index.js new file mode 100644 index 000000000..a2721cf6d --- /dev/null +++ b/packages/theme-mobile/src/checkbox/index.js @@ -0,0 +1,12 @@ +export default { + 'tiny-mobile-checkbox-margin-right': '30px', + 'tiny-mobile-checkbox-border-radius': '2px', + 'tiny-mobile-checkbox-border-color': '#ccc', + 'tiny-mobile-checkbox-size': '24px', + 'tiny-mobile-checkbox-checked-color': '#f36f64', + 'tiny-mobile-checkbox-color': '#333', + 'tiny-mobile-checkbox-font-size': '16px', + 'tiny-mobile-checkbox-disabled-color': '#999', + 'tiny-mobile-checkbox-disabled-bgcolor': '#f5f5f5', + 'tiny-mobile-checkbox-disabled-border-color': '#d9d9d9' +} diff --git a/packages/theme-mobile/src/checkbox/index.less b/packages/theme-mobile/src/checkbox/index.less new file mode 100644 index 000000000..98252949c --- /dev/null +++ b/packages/theme-mobile/src/checkbox/index.less @@ -0,0 +1,143 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../mixins/checkbox.less'; +@import '../custom.less'; +@import './vars.less'; + +@checkbox-prefix-cls: ~'@{css-prefix}mobile-checkbox'; + +.@{checkbox-prefix-cls} { + position: relative; + display: inline-block; + white-space: nowrap; + margin-right: var(--ti-mobile-checkbox-margin-right, 30px); + cursor: pointer; + .user-select(none); + + &:last-of-type { + margin-right: 0; + } + + &__input { + position: relative; + display: inline-block; + white-space: nowrap; + vertical-align: middle; + outline: 0; + cursor: pointer; + width: var(--ti-mobile-checkbox-size, 20px); + height: var(--ti-mobile-checkbox-size, 20px); + line-height: var(--ti-mobile-checkbox-size, 20px); + } + + &__inner { + display: inline-block; + position: relative; + background-color: var(--ti-mobile-checkbox-bg-color, #ffffff); + border: 1px solid var(--ti-mobile-checkbox-border-color, #dbdbdb); + border-radius: var(--ti-mobile-checkbox-border-radius, 3px); + box-sizing: border-box; + width: 100%; + height: 100%; + z-index: 1; + transition: border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46), background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46); + + &:hover { + border-color: var(--ti-mobile-checkbox-checked-border-color, #4a79fe); + } + + &::after { + box-sizing: content-box; + content: ''; + border-width: 2px; + border-style: solid; + border-color: var(--ti-mobile-checkbox-selected-border-color, #ffffff); + border-left: 0; + border-top: 0; + height: 8px; + width: 5px; + position: absolute; + left: 50%; + top: 42%; + transform: translate(-50%, -50%) rotate(45deg) scaleY(0); + transition: all 0.15s ease-in 0.05s; + transform-origin: center; + opacity: 0; + } + } + + &__original { + opacity: 0; + outline: 0; + position: absolute; + margin: 0; + width: 0; + height: 0; + z-index: -1; + } + + &__label { + display: inline-block; + padding-left: 16px; + line-height: 24px; + color: var(--ti-mobile-checkbox-color, #595959); + font-size: var(--ti-mobile-checkbox-font-size, 16px); + vertical-align: middle; + } + + &.is-checked &__inner{ + background-color: var(--ti-mobile-checkbox-checked-bg-color, #4a79fe); + } + + &.is-checked &__inner::after { + border-color: var(--ti-mobile-checkbox-selected-border-color, #ffffff); + transform: translate(-50%, -50%) rotate(45deg) scaleY(1); + opacity: 1; + } + + &.is-indeterminate &__inner { + &::before { + content: ''; + position: absolute; + display: block; + border-radius: 2px; + background-color: var(--ti-mobile-checkbox-indeterminate-bg-color, #ffffff); + height: 10px; + width: 10px; + left: 0; + right: 0; + top: 0; + bottom: 0; + margin: auto; + } + + &::after { + display: none; + } + } + + &.is-checked &__inner, + &.is-indeterminate &__inner { + background-color: var(--ti-mobile-checkbox-checked-bg-color, #4a79fe); + border-color: var(--ti-mobile-checkbox-checked-border-color, #4a79fe); + } + + &.is-disabled { + .checkbox-input-disabled( + var(--ti-mobile-checkbox-disabled-color, #dbdbdb), + var(--ti-mobile-checkbox-disabled-bg-color, #f5f5f5), + var(--ti-mobile-checkbox-disabled-border-color, #dbdbdb) + ); + } +} diff --git a/packages/theme-mobile/src/checkbox/vars.less b/packages/theme-mobile/src/checkbox/vars.less new file mode 100644 index 000000000..832073e0f --- /dev/null +++ b/packages/theme-mobile/src/checkbox/vars.less @@ -0,0 +1,17 @@ +:root { + --ti-mobile-checkbox-margin-right: 30px; + --ti-mobile-checkbox-bg-color: var(--ti-mobile-base-color-bg-3, #ffffff); + --ti-mobile-checkbox-border-radius: var(--ti-mobile-base-radius-large, 3px); + --ti-mobile-checkbox-border-color: var(--ti-mobile-base-color-common-8, #dbdbdb); + --ti-mobile-checkbox-size: 20px; + --ti-mobile-checkbox-checked-color: var(--ti-mobile-base-color-brand-1, #4a79fe); + --ti-mobile-checkbox-checked-border-color: var(--ti-mobile-base-color-brand-1, #4a79fe); + --ti-mobile-checkbox-checked-bg-color: var(--ti-mobile-base-color-brand-1, #4a79fe); + --ti-mobile-checkbox-selected-border-color: var(--ti-mobile-base-color-brand-6, #ffffff); + --ti-mobile-checkbox-indeterminate-bg-color: var(--ti-mobile-base-color-brand-6, #ffffff); + --ti-mobile-checkbox-color: var(--ti-mobile-base-color-common-5, #595959); + --ti-mobile-checkbox-font-size: 16px; + --ti-mobile-checkbox-disabled-color: var(--ti-mobile-base-color-common-8, #dbdbdb); + --ti-mobile-checkbox-disabled-bg-color: var(--ti-mobile-base-color-bg-1, #f5f5f5); + --ti-mobile-checkbox-disabled-border-color: var(--ti-mobile-base-color-common-8, #dbdbdb); +} diff --git a/packages/theme-mobile/src/custom.less b/packages/theme-mobile/src/custom.less new file mode 100644 index 000000000..fe5bd23ae --- /dev/null +++ b/packages/theme-mobile/src/custom.less @@ -0,0 +1,14 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@css-prefix: tiny-; +@css-prefix-iconfont: tiny-icon; diff --git a/packages/theme-mobile/src/dialog-box/index.js b/packages/theme-mobile/src/dialog-box/index.js new file mode 100644 index 000000000..01d2a6f16 --- /dev/null +++ b/packages/theme-mobile/src/dialog-box/index.js @@ -0,0 +1,11 @@ +export default { + 'tiny-mobile-dialogbox-background': '#fff', + 'tiny-mobile-dialogbox-width': '270px', + 'tiny-mobile-dialogbox-border-color': '#ccc', + 'tiny-mobile-dialogbox-title-font-size': '17px', + 'tiny-mobile-dialogbox-title-color': '#000', + 'tiny-mobile-dialogbox-body-font-size': '16px', + 'tiny-mobile-dialogbox-body-color': '#333', + 'tiny-mobile-dialogbox-cancel-button-color': '#999', + 'tiny-mobile-dialogbox-confirm-button-color': '#333' +} diff --git a/packages/theme-mobile/src/dialog-box/index.less b/packages/theme-mobile/src/dialog-box/index.less new file mode 100644 index 000000000..e03669a2f --- /dev/null +++ b/packages/theme-mobile/src/dialog-box/index.less @@ -0,0 +1,201 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import '../mixins/hairline.less'; +@import './vars.less'; + +@dialog-box-prefix-cls: ~'@{css-prefix}mobile-dialog-box'; + +.@{dialog-box-prefix-cls} { + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + width: var(--ti-mobile-dialogbox-width, 270px); + background: var(--ti-mobile-dialogbox-background, #fff); + + &__wrapper { + margin: 0; + overflow: auto; + position: fixed; + right: 0; + top: 0; + left: 0; + bottom: 0; + } + + &.is-hide-header &__body { + padding: 24px 16px; + max-height: 490px; + } + + & &__header { + padding: 16px 16px 8px; + text-align: center; + } + + & &__title { + font-size: var(--ti-mobile-dialogbox-title-font-size, 17px); + color: var(--ti-mobile-dialogbox-title-color, #000); + font-weight: bold; + } + + & &__body { + font-size: var(--ti-mobile-dialogbox-body-font-size, 16px); + color: var(--ti-mobile-dialogbox-body-color, #333); + padding: 0px 16px 16px; + max-height: 482px; + overflow-y: auto; + } + + & &__footer { + height: 44px; + padding: 0 16px; + text-align: center; + box-sizing: border-box; + display: flex; + justify-content: center; + align-items: center; + .hairline('top', var(--ti-mobile-dialogbox-border-color, #ccc)); + } + + & &__button { + width: 50%; + font-size: 16px; + line-height: 42px; + border: 0; + background: 0; + cursor: pointer; + + &:focus { + outline: 0; + } + + &.cancel-button { + color: var(--ti-mobile-dialogbox-cancel-button-color, #999); + .hairline('right', var(--ti-mobile-dialogbox-border-color, #ccc)); + } + + &.confirm-button { + color: var(--ti-mobile-dialogbox-confirm-button-color, #333); + } + } + + &__scroll-lock { + overflow: hidden; + } +} + +.v-modal { + position: fixed; + left: 0; + top: 0; + width: 100%; + height: 100%; + opacity: 0.3; + background: #000; +} + +.v-modal-enter { + animation: v-modal-in 0.2s ease; +} + +.v-modal-leave { + animation: v-modal-out 0.2s ease forwards; +} + +@keyframes v-modal-in { + 0% { + opacity: 0; + } +} + +@keyframes v-modal-out { + 100% { + opacity: 0; + } +} + +.dialog-slideRight-enter-active { + animation: slideRight 0.5s ease-in forwards; +} + +.dialog-slideRight-leave-active { + animation: slideRightout 0.5s ease-in forwards; +} + +@keyframes slideRight { + 0% { + opacity: 0; + transform: translateX(100%); + } + + 50% { + opacity: 0.6; + transform: translateX(50%); + } + + 100% { + opacity: 1; + transform: translateX(0%); + } +} + +@keyframes slideRightout { + 0% { + opacity: 1; + transform: translateX(0%); + } + + 50% { + opacity: 0.6; + transform: translateX(50%); + } + + 100% { + opacity: 0; + transform: translateX(100%); + } +} + +.dialog-fade-leave-active { + animation: dialog-fade-out 0.3s; +} + +.dialog-fade-enter-active { + animation: dialog-fade-in 0.3s; +} + +@keyframes dialog-fade-out { + 0% { + opacity: 1; + transform: translate3d(0, 0, 0); + } + + 100% { + opacity: 0; + transform: translate3d(0, -20px, 0); + } +} + +@keyframes dialog-fade-in { + 0% { + opacity: 0; + transform: translate3d(0, -20px, 0); + } + + 100% { + opacity: 1; + transform: translate3d(0, 0, 0); + } +} diff --git a/packages/theme-mobile/src/dialog-box/vars.less b/packages/theme-mobile/src/dialog-box/vars.less new file mode 100644 index 000000000..9ed5d6a8d --- /dev/null +++ b/packages/theme-mobile/src/dialog-box/vars.less @@ -0,0 +1,11 @@ +:root { + --ti-mobile-dialogbox-background: var(--ti-mobile-base-color-light, #fff); + --ti-mobile-dialogbox-width: 270px; + --ti-mobile-dialogbox-border-color: #ccc; + --ti-mobile-dialogbox-title-font-size: 17px; + --ti-mobile-dialogbox-title-color: var(--ti-mobile-base-color-dark, #000); + --ti-mobile-dialogbox-body-font-size: 16px; + --ti-mobile-dialogbox-body-color: var(--ti-mobile-base-color-info-normal, #333); + --ti-mobile-dialogbox-cancel-button-color: var(--ti-mobile-base-color-placeholder, #999); + --ti-mobile-dialogbox-confirm-button-color: var(--ti-mobile-base-color-info-normal, #333); +} diff --git a/packages/theme-mobile/src/dropdown-item/index.js b/packages/theme-mobile/src/dropdown-item/index.js new file mode 100644 index 000000000..4abd80e40 --- /dev/null +++ b/packages/theme-mobile/src/dropdown-item/index.js @@ -0,0 +1,3 @@ +export default { + // mobile/dropdown-item +} diff --git a/packages/theme-mobile/src/dropdown-item/index.less b/packages/theme-mobile/src/dropdown-item/index.less new file mode 100644 index 000000000..a9f59495f --- /dev/null +++ b/packages/theme-mobile/src/dropdown-item/index.less @@ -0,0 +1,148 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import '../mixins/hairline.less'; +@import './vars.less'; + +@dropdown-item-prefix-cls: ~'@{css-prefix}mobile-dropdown-item'; + +.@{dropdown-item-prefix-cls} { + position: fixed; + right: 0; + left: 0; + z-index: 10; + overflow: hidden; + + &--up { + top: 0; + } + + &--down { + bottom: 0; + } + + &__content { + position: absolute; + } + + &__cell { + position: relative; + display: flex; + box-sizing: border-box; + width: 100%; + overflow: hidden; + font-size: 14px; + background-color: #fff; + } + + &__option { + height: 48px; + line-height: 48px; + padding: 0 16px; + text-align: left; + outline: 0; + cursor: pointer; + + &:after { + content: ' '; + display: block; + height: 1px; + width: 100%; + margin-left: 16px; + border-top: 1px solid #ddd; + color: #ddd; + transform: scaleY(0.5); + transform-origin: 0 0; + position: absolute; + top: auto; + right: auto; + bottom: 0; + left: 0; + } + + &-title { + position: relative; + overflow: hidden; + color: #333; + flex: 1; + } + + &-value { + padding-left: 8px; + font-size: 16px; + } + + &.is-active &-title { + color: #f36f64; + } + } + + &__filter { + max-height: 408px; + overflow: hidden; + + &-wrap { + width: 100%; + height: calc(100% - 76px); + padding: 16px 12px 0 16px; + overflow: hidden; + overflow-y: auto; + } + + &-item { + flex-flow: column; + + &:not(:first-child) { + margin-top: 22px; + } + } + + &-title { + display: block; + color: #666; + } + + & &-li { + display: inline-flex; + align-items: center; + box-sizing: border-box; + height: 32px; + padding: 0 16px; + border-radius: 2px; + margin: 8px 8px 8px 0; + color: #333; + background: #f5f5f5; + + &.checked { + padding: 0 15px; + background: #fff; + } + } + + &-operate { + display: flex; + flex-grow: column; + padding: 16px; + .hairline('top', #ddd); + + button { + width: 50%; + flex: 1; + + &:first-child { + margin-right: 16px; + } + } + } + } +} diff --git a/packages/theme-mobile/src/dropdown-item/vars.less b/packages/theme-mobile/src/dropdown-item/vars.less new file mode 100644 index 000000000..e69de29bb diff --git a/packages/theme-mobile/src/dropdown-menu/index.js b/packages/theme-mobile/src/dropdown-menu/index.js new file mode 100644 index 000000000..91751dbf5 --- /dev/null +++ b/packages/theme-mobile/src/dropdown-menu/index.js @@ -0,0 +1,3 @@ +export default { + // mobile/dropdown-menu +} diff --git a/packages/theme-mobile/src/dropdown-menu/index.less b/packages/theme-mobile/src/dropdown-menu/index.less new file mode 100644 index 000000000..5fa6d619f --- /dev/null +++ b/packages/theme-mobile/src/dropdown-menu/index.less @@ -0,0 +1,115 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import '../mixins/hairline.less'; +@import './vars.less'; + +@dropdown-menu-prefix-cls: ~'@{css-prefix}mobile-dropdown-menu'; + +.@{dropdown-menu-prefix-cls} { + user-select: none; + + &__item { + display: flex; + flex: 1; + align-items: center; + justify-content: center; + height: 40px; + outline: 0; + cursor: pointer; + + &:active { + opacity: 0.7; + } + + &.is-disabled { + &:active { + opacity: 1; + } + + .@{dropdown-menu-prefix-cls}__title { + color: #969799; + } + } + } + + &__title { + position: relative; + box-sizing: border-box; + max-width: 100%; + padding-left: 16px; + color: #666; + font-size: 14px; + line-height: 1; + + &-wrap { + .@{css-prefix}svg { + font-size: 10px; + + &.filter-icon { + font-size: 16px; + } + } + } + + &-icon { + position: relative; + height: 18px; + display: inline-block; + vertical-align: text-bottom; + + .up { + position: absolute; + top: 0; + } + + .down { + position: absolute; + bottom: 0; + } + } + + &-text { + position: relative; + width: auto; + max-width: calc(100% - 16px); + margin-right: 4px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + -webkit-box-flex: 1; + } + + &.is-active { + color: #f36f64; + } + + &.is-down { + &::after { + margin-top: -1px; + transform: rotate(135deg); + } + } + } + + &__bar { + position: relative; + display: flex; + background-color: #fff; + .hairline('bottom', #ccc); + } + + &__bar--opened { + z-index: 11; + } +} diff --git a/packages/theme-mobile/src/dropdown-menu/vars.less b/packages/theme-mobile/src/dropdown-menu/vars.less new file mode 100644 index 000000000..e69de29bb diff --git a/packages/theme-mobile/src/error-page/index-global.less b/packages/theme-mobile/src/error-page/index-global.less new file mode 100644 index 000000000..73d08a571 --- /dev/null +++ b/packages/theme-mobile/src/error-page/index-global.less @@ -0,0 +1,234 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.aurora-popup__wrapper { + z-index: 2147483647 !important; + background: rgba(0, 0, 0, 0.5); + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + overflow: auto; + margin: 0; + + // 错误提示页 + .aurora-errortips__box { + position: absolute; + width: 800px; + min-height: 450px; + max-height: 600px; + top: 0; + left: 0; + right: 0; + bottom: 0; + margin: auto; + overflow: hidden; + background: #fff; + border: 1px solid transparent; + box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.2); + text-align: center; + overflow-y: auto; + + .aurora-errortips__body { + height: 100%; + text-align: initial; + padding: 20px; + color: #5a5e66; + font-size: 14px; + display: table; + margin: auto; + + .errortips { + text-align: center; + display: table-cell; + vertical-align: middle; + + .error-code { + font-size: 100px; + color: #9ac7ef; + margin: 0 auto -45px; + text-shadow: 0px 2px 0 #fff, -2px 0px 0 #fff, 2px 0px 0 #fff; + } + + .error-img { + width: 260px; + height: 180px; + margin: 0 auto; + background: url(./images/errortips-bg.png) no-repeat; + } + + .error-content { + font-size: 16px; + margin: 24px 0; + font-weight: bold; + } + + .error-bottom { + a { + font-weight: 800; + cursor: pointer; + } + + span { + padding-right: 15px; + } + } + } + } + } + + // sso 登录 + .aurora-sso__box { + position: absolute; + background: #fff; + border: 1px solid transparent; + box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.2); + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + + .aurora-sso__body { + text-align: initial; + padding: 20px; + color: #5a5e66; + line-height: 32px; + font-size: 14px; + + .aurora-sso__body-iframe { + width: 350px; + height: 350px; + height: 460px\9; // 兼容ie9-ie10 + overflow: hidden; + + // 兼容ie10-ie11 + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + height: 460px; + } + + // 兼容edge + @supports (-ms-ime-align: auto) { + height: 460px; + } + } + } + } + + // 非 sso 登录 + &.login-not-sso { + background: #dcdfe4; + background-size: cover; + + .aurora-not-sso__box { + width: 100%; + height: 100%; + overflow: hidden; + + .aurora-not-sso__body { + width: 650px; + height: 400px; + background: #f4f5f9; + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + text-align: center; + border: 1px solid #d4d5d7; + box-shadow: 0px 2px 4px #989a9e; + + .title { + background: #ecedf1; + background: linear-gradient(to bottom, #ecedf1, #dadde2); + border-bottom: 1px solid #b6babf; + padding: 16px 20px; + font-size: 20px; + } + + .tbl-login { + width: 100%; + border-collapse: collapse; + border-spacing: 0; + font-size: 16px; + margin-top: 28px; + + .form-item { + height: 60px; + line-height: 60px; + + td.label { + width: 30%; + text-align: right; + color: #5a5e66; + } + + td.cell { + width: 70%; + text-align: left; + padding-left: 12px; + + input { + border: 1px solid #bfbfbf; + border-radius: 2px; + outline: none; + width: 75%; + height: 40px; + line-height: 40px; + padding: 0 8px; + background: transparent; + color: #5a5e66; + + &::-webkit-input-placeholder { + color: #999; + } + + &:hover { + border-color: #999; + } + + &:focus::-webkit-input-placeholder { + color: #d9d9d9; + } + + &.text-danger { + border-color: #f5222d; + } + } + + button { + width: 75%; + height: 40px; + line-height: 40px; + padding: 0 24px; + text-align: center; + color: #fff; + background-color: #1890ff; + border: none; + border-radius: 2px; + transition: 0.3s; + outline: 0; + + &:hover { + background-color: #40a9ff; + } + } + + .errmessage { + color: #f00; + line-height: 20px; + } + } + } + } + } + } + } +} diff --git a/packages/theme-mobile/src/error-page/index.js b/packages/theme-mobile/src/error-page/index.js new file mode 100644 index 000000000..b668e2b0c --- /dev/null +++ b/packages/theme-mobile/src/error-page/index.js @@ -0,0 +1,3 @@ +export default { + // mobile/error-page +} diff --git a/packages/theme-mobile/src/error-page/index.less b/packages/theme-mobile/src/error-page/index.less new file mode 100644 index 000000000..caff0aab5 --- /dev/null +++ b/packages/theme-mobile/src/error-page/index.less @@ -0,0 +1,234 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.aurora-popup__wrapper { + z-index: 2147483647 !important; + background: rgba(0, 0, 0, 0.5); + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + overflow: auto; + margin: 0; + + // 错误提示页 + .aurora-errortips__box { + position: absolute; + width: 800px; + min-height: 450px; + max-height: 600px; + top: 0; + left: 0; + right: 0; + bottom: 0; + margin: auto; + overflow: hidden; + background: #fff; + border: 1px solid transparent; + box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.2); + text-align: center; + overflow-y: auto; + + .aurora-errortips__body { + height: 100%; + text-align: initial; + padding: 20px; + color: #5a5e66; + font-size: 14px; + display: table; + margin: auto; + + .errortips { + text-align: center; + display: table-cell; + vertical-align: middle; + + .error-code { + font-size: 100px; + color: #9ac7ef; + margin: 0 auto -45px; + text-shadow: 0px 2px 0 #fff, -2px 0px 0 #fff, 2px 0px 0 #fff; + } + + .error-img { + width: 260px; + height: 180px; + margin: 0 auto; + background: url(../images/errortips-bg.png) no-repeat; + } + + .error-content { + font-size: 16px; + margin: 24px 0; + font-weight: bold; + } + + .error-bottom { + a { + font-weight: 800; + cursor: pointer; + } + + span { + padding-right: 15px; + } + } + } + } + } + + // sso 登录 + .aurora-sso__box { + position: absolute; + background: #fff; + border: 1px solid transparent; + box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.2); + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + + .aurora-sso__body { + text-align: initial; + padding: 20px; + color: #5a5e66; + line-height: 32px; + font-size: 14px; + + .aurora-sso__body-iframe { + width: 350px; + height: 350px; + height: 460px\9; // 兼容ie9-ie10 + overflow: hidden; + + // 兼容ie10-ie11 + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + height: 460px; + } + + // 兼容edge + @supports (-ms-ime-align: auto) { + height: 460px; + } + } + } + } + + // 非 sso 登录 + &.login-not-sso { + background: #dcdfe4; + background-size: cover; + + .aurora-not-sso__box { + width: 100%; + height: 100%; + overflow: hidden; + + .aurora-not-sso__body { + width: 650px; + height: 400px; + background: #f4f5f9; + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + text-align: center; + border: 1px solid #d4d5d7; + box-shadow: 0px 2px 4px #989a9e; + + .title { + background: #ecedf1; + background: linear-gradient(to bottom, #ecedf1, #dadde2); + border-bottom: 1px solid #b6babf; + padding: 16px 20px; + font-size: 20px; + } + + .tbl-login { + width: 100%; + border-collapse: collapse; + border-spacing: 0; + font-size: 16px; + margin-top: 28px; + + .form-item { + height: 60px; + line-height: 60px; + + td.label { + width: 30%; + text-align: right; + color: #5a5e66; + } + + td.cell { + width: 70%; + text-align: left; + padding-left: 12px; + + input { + border: 1px solid #bfbfbf; + border-radius: 2px; + outline: none; + width: 75%; + height: 40px; + line-height: 40px; + padding: 0 8px; + background: transparent; + color: #5a5e66; + + &::-webkit-input-placeholder { + color: #999; + } + + &:hover { + border-color: #999; + } + + &:focus::-webkit-input-placeholder { + color: #d9d9d9; + } + + &.text-danger { + border-color: #f5222d; + } + } + + button { + width: 75%; + height: 40px; + line-height: 40px; + padding: 0 24px; + text-align: center; + color: #fff; + background-color: #1890ff; + border: none; + border-radius: 2px; + transition: 0.3s; + outline: 0; + + &:hover { + background-color: #40a9ff; + } + } + + .errmessage { + color: #f00; + line-height: 20px; + } + } + } + } + } + } + } +} diff --git a/packages/theme-mobile/src/error-page/vars.less b/packages/theme-mobile/src/error-page/vars.less new file mode 100644 index 000000000..17e980e80 --- /dev/null +++ b/packages/theme-mobile/src/error-page/vars.less @@ -0,0 +1,30 @@ +:root { + --ti-errortips-box-background: var(--ti-mobile-base-color-light, #fff); + --ti-errortips-body-color: #5a5e66; + --ti-errortips-body-font-size: 14px; + --ti-errortips-body-code-font-size: 100px; + --ti-errortips-body-code-color: #9ac7ef; + --ti-errortips-body-content-font-size: 16px; + --ti-errortips-body-bottom-font-weight: 800; + --ti-errortips-sso-box-background: var(--ti-mobile-base-color-light, #fff); + --ti-errortips-sso-body-color: #5a5e66; + --ti-errortips-sso-body-font-size: 14px; + --ti-errortips-not-sso-background: #dcdfe4; + --ti-errortips-not-sso-body-background: #f4f5f9; + --ti-errortips-not-sso-body-border-color: #d4d5d7; + --ti-errortips-not-sso-body-title-border-color: #b6babf; + --ti-errortips-not-sso-body-title-font-size: 20px; + --ti-errortips-not-sso-body-login-font-size: 16px; + --ti-errortips-not-sso-body-color: #5a5e66; + --ti-errortips-not-sso-body-input-border-color: var(--ti-mobile-base-color-primary-disabled, #bfbfbf); + --ti-errortips-not-sso-body-input-border-radius: var(--ti-mobile-base-radius-medium, 2px); + --ti-errortips-not-sso-body-input-placeholder: var(--ti-mobile-base-color-placeholder, #999); + --ti-errortips-not-sso-body-input-hover: var(--ti-mobile-base-color-placeholder, #999); + --ti-errortips-not-sso-body-input-focus: var(--ti-mobile-base-color-border, #d9d9d9); + --ti-errortips-not-sso-body-input-danger: var(--ti-mobile-base-color-danger-normal, #f5222d); + --ti-errortips-not-sso-body-button-color: var(--ti-mobile-base-color-light, #fff); + --ti-errortips-not-sso-body-button-background: var(--ti-mobile-base-color-primary-normal, #1890ff); + --ti-errortips-not-sso-body-button-border-radius: var(--ti-mobile-base-radius-medium, 2px); + --ti-errortips-not-sso-body-button-hover: var(--ti-mobile-base-color-primary-hover, #40a9ff); + --ti-errortips-not-sso-body-errmessage-color: #f00; +} diff --git a/packages/theme-mobile/src/exception/index-global.less b/packages/theme-mobile/src/exception/index-global.less new file mode 100644 index 000000000..d995ec813 --- /dev/null +++ b/packages/theme-mobile/src/exception/index-global.less @@ -0,0 +1,92 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@exception-prefix-cls: ~'@{css-prefix}mobile-exception'; + +.@{exception-prefix-cls} { + position: fixed; + top: 0; + display: flex; + justify-content: center; + align-items: center; + width: 100%; + height: 100%; + background-color: var(--ti-mobile-exception-bgcolor, #fff); + text-align: center; + z-index: 9999; + + &__content-view { + width: var(--ti-mobile-exception-view-size, 200px); + height: var(--ti-mobile-exception-view-size, 200px); + background-size: 100%; + } + + &__content-nodata { + background-image: url(./images/nodata.png); + } + + &__content-build { + background-image: url(./images/build.png); + } + + &__content-busy { + background-image: url(./images/busy.png); + } + + &__content-noperm { + background-image: url(./images/404.png); + } + + &__content-pcview { + background-image: url(./images/pcview.png); + } + + &__content-weaknet { + background-image: url(./images/netcut.png); + } + + &__content-message { + button { + width: 160px; + margin-top: 32px; + } + + .main-message { + color: var(--ti-mobile-exception-main-message-color, #666); + font-size: var(--ti-mobile-exception-main-message-font-size, 14px); + line-height: 1.5; + } + + .sub-message { + margin-top: 4px; + color: var(--ti-mobile-exception-sub-message-color, #999); + font-size: var(--ti-mobile-exception-sub-message-font-size, 12px); + } + } + + &__footer { + position: fixed; + right: 16px; + bottom: 40px; + left: 16px; + color: var(--ti-mobile-exception-footer-color, #999); + overflow: hidden; + font-size: var(--ti-mobile-exception-footer-font-size, 12px); + text-align: center; + z-index: 10000; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; + } +} diff --git a/packages/theme-mobile/src/exception/index.js b/packages/theme-mobile/src/exception/index.js new file mode 100644 index 000000000..d8234bf84 --- /dev/null +++ b/packages/theme-mobile/src/exception/index.js @@ -0,0 +1,14 @@ +export default { + 'tiny-mobile-exception-bg-color': '#fff', + 'tiny-mobile-exception-main-message-color': '#999', + 'tiny-mobile-exception-main-message-font-size': '13px', + 'tiny-mobile-exception-sub-message-color': '#999', + 'tiny-mobile-exception-sub-message-font-size': '12px', + 'tiny-mobile-exception-footer-color': '#999', + 'tiny-mobile-exception-footer-font-size': '12px', + 'tiny-mobile-exception-image-width': '200px', + 'tiny-mobile-exception-image-height': '100px', + 'tiny-mobile-exception-content-width': '234px', + 'tiny-mobile-exception-button-width': '136px', + 'tiny-mobile-exception-button-height': '42px', +} diff --git a/packages/theme-mobile/src/exception/index.less b/packages/theme-mobile/src/exception/index.less new file mode 100644 index 000000000..a24d84b8e --- /dev/null +++ b/packages/theme-mobile/src/exception/index.less @@ -0,0 +1,106 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@exception-prefix-cls: ~'@{css-prefix}mobile-exception'; + +.@{exception-prefix-cls} { + position: fixed; + top: 0; + display: flex; + justify-content: center; + align-items: center; + width: 100%; + height: 100%; + background-color: var(--ti-mobile-exception-bg-color, #fff); + text-align: center; + z-index: 9999; + + &__content-view { + width: var(--ti-mobile-exception-view-size, 200px); + height: var(--ti-mobile-exception-view-size, 200px); + background-size: 100%; + } + + &__content { + display: flex; + flex-direction: column; + align-items: center; + width: var(--ti-mobile-exception-content-width, 234px); + } + + &__image { + width: var(--ti-mobile-exception-image-width, 200px); + } + + &__content-nodata { + background-image: url(../images/nodata.png); + } + + &__content-build { + background-image: url(../images/build.png); + } + + &__content-busy { + background-image: url(../images/busy.png); + } + + &__content-noperm { + background-image: url(../images/404.png); + } + + &__content-pcview { + background-image: url(../images/pcview.png); + } + + &__content-weaknet { + background-image: url(../images/netcut.png); + } + + &__content-message { + margin-top: 12px; + + button { + min-width: var(--ti-mobile-exception-button-width, 136px); + height: var(--ti-mobile-exception-button-height, 42px); + margin-top: 24px; + } + + .main-message { + color: var(--ti-mobile-exception-main-message-color, #999); + font-size: var(--ti-mobile-exception-main-message-font-size, 13px); + line-height: 1.5; + } + + .sub-message { + margin-top: 4px; + color: var(--ti-mobile-exception-sub-message-color, #999); + font-size: var(--ti-mobile-exception-sub-message-font-size, 12px); + } + } + + &__footer { + position: fixed; + right: 16px; + bottom: 40px; + left: 16px; + color: var(--ti-mobile-exception-footer-color, #999); + overflow: hidden; + font-size: var(--ti-mobile-exception-footer-font-size, 12px); + text-align: center; + z-index: 10000; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; + } +} diff --git a/packages/theme-mobile/src/exception/vars.less b/packages/theme-mobile/src/exception/vars.less new file mode 100644 index 000000000..e01c75ba4 --- /dev/null +++ b/packages/theme-mobile/src/exception/vars.less @@ -0,0 +1,14 @@ +:root { + --ti-mobile-exception-bg-color: var(--ti-mobile-common-bg-color-white, #fff); + --ti-mobile-exception-main-message-color: var(--ti-mobile-common-color-text-weaken-dark, #999); + --ti-mobile-exception-main-message-font-size: 13px; + --ti-mobile-exception-sub-message-color: var(--ti-mobile-common-color-text-weaken-dark, #999); + --ti-mobile-exception-sub-message-font-size: 12px; + --ti-mobile-exception-footer-color: var(--ti-mobile-common-color-text-weaken-dark, #999); + --ti-mobile-exception-footer-font-size: 12px; + --ti-mobile-exception-image-width: 200px; + --ti-mobile-exception-image-height: 100px; + --ti-mobile-exception-content-width: 234px; + --ti-mobile-exception-button-width: 136px; + --ti-mobile-exception-button-height: 42px; +} diff --git a/packages/theme-mobile/src/file-upload/index.js b/packages/theme-mobile/src/file-upload/index.js new file mode 100644 index 000000000..035b5bb23 --- /dev/null +++ b/packages/theme-mobile/src/file-upload/index.js @@ -0,0 +1,12 @@ +export default { + 'tiny-mobile-file-upload-hairline-color': '#ddd', + 'tiny-mobile-file-upload-title-color': '#333', + 'tiny-mobile-file-upload-font-size': '16px', + 'tiny-mobile-file-upload-icon-size': '24px', + 'tiny-mobile-file-upload-icon-color': '#999', + 'tiny-mobile-file-upload-status-color': '#999', + 'tiny-mobile-file-upload-status-font-size': '12px', + 'tiny-mobile-file-upload-picture-card-size': '64px', + 'tiny-mobile-file-upload-picture-card-border-color': '#ccc', + 'tiny-mobile-file-upload-picture-card-bgcolor': '#fff' +} diff --git a/packages/theme-mobile/src/file-upload/index.less b/packages/theme-mobile/src/file-upload/index.less new file mode 100644 index 000000000..e5e578b3e --- /dev/null +++ b/packages/theme-mobile/src/file-upload/index.less @@ -0,0 +1,100 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/hairline.less'; +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +@file-upload-prefix-cls: ~'@{css-prefix}mobile-file-upload'; +@upload-prefix-cls: ~'@{css-prefix}upload'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{file-upload-prefix-cls} { + &__header { + display: flex; + align-items: center; + padding: 12px 16px; + margin-bottom: 12px; + .hairline('bottom', var(--ti-mobile-file-upload-hairline-color, #ddd)); + + &-title { + flex: 1; + color: var(--ti-mobile-file-upload-title-color, #333); + font-size: var(--ti-mobile-file-upload-font-size, 16px); + } + + &-upload { + display: flex; + align-items: center; + } + + .upload-icon { + .@{svg-prefix-cls} { + font-size: var(--ti-mobile-file-upload-icon-size, 24px); + fill: var(--ti-mobile-file-upload-icon-color, #999); + } + } + } + + &__wrap.is-card { + padding-left: 16px; + .clearfix(); + } + + .upload-status { + color: var(--ti-mobile-file-upload-status-color, #999); + font-size: var(--ti-mobile-file-upload-status-font-size, 12px); + margin-right: 10px; + + .@{svg-prefix-cls} { + font-size: var(--ti-mobile-file-upload-icon-size, 24px); + fill: var(--ti-mobile-file-upload-icon-color, #999); + } + } + + .@{upload-prefix-cls} { + display: inline-block; + text-align: center; + cursor: pointer; + outline: 0; + } + + .@{upload-prefix-cls}--picture-card { + width: var(--ti-mobile-file-upload-picture-card-size, 64px); + height: var(--ti-mobile-file-upload-picture-card-size, 64px); + line-height: var(--ti-mobile-file-upload-picture-card-size, 64px); + border: 1px solid var(--ti-mobile-file-upload-picture-card-border-color, #ccc); + background-color: var(--ti-mobile-file-upload-picture-card-bgcolor, #fff); + border-radius: 0; + display: inline-block; + text-align: center; + cursor: pointer; + outline: 0; + + svg { + font-size: 28px; + fill: #8c939d; + } + + &:hover, + &:focus { + border-color: var(--ti-mobile-file-upload-picture-card-border-color, #ccc); + } + } +} + +[class*=~'@{css-prefix}'] { + input[type='file'] { + display: none; + } +} diff --git a/packages/theme-mobile/src/file-upload/vars.less b/packages/theme-mobile/src/file-upload/vars.less new file mode 100644 index 000000000..3263ed5a0 --- /dev/null +++ b/packages/theme-mobile/src/file-upload/vars.less @@ -0,0 +1,12 @@ +:root { + --ti-mobile-file-upload-hairline-color: #ddd; + --ti-mobile-file-upload-title-color: var(--ti-mobile-base-color-info-normal, #333333); + --ti-mobile-file-upload-font-size: 16px; + --ti-mobile-file-upload-icon-size: 24px; + --ti-mobile-file-upload-icon-color: var(--ti-mobile-base-color-placeholder, #999); + --ti-mobile-file-upload-status-color: var(--ti-mobile-base-color-placeholder, #999); + --ti-mobile-file-upload-status-font-size: var(--ti-mobile-base-font-size, 12px); + --ti-mobile-file-upload-picture-card-size: 64px; + --ti-mobile-file-upload-picture-card-border-color: #ccc; + --ti-mobile-file-upload-picture-card-bgcolor: var(--ti-mobile-base-color-light, #fff); +} diff --git a/packages/theme-mobile/src/form-item/index.js b/packages/theme-mobile/src/form-item/index.js new file mode 100644 index 000000000..eded17601 --- /dev/null +++ b/packages/theme-mobile/src/form-item/index.js @@ -0,0 +1,10 @@ +export default { + 'tiny-form-item-small-line-height': '28px', + 'tiny-form-item-medium-line-height': '36px', + 'tiny-form-item-mini-line-height': '24px', + 'tiny-form-item-label-line-height': '30px', + 'tiny-form-item-label-font-size': '14px', + 'tiny-form-item-label-color': '#333', + 'tiny-form-item-error-color': '#f5222d', + 'tiny-form-item-error-font-size': '12px' +} diff --git a/packages/theme-mobile/src/form-item/index.less b/packages/theme-mobile/src/form-item/index.less new file mode 100644 index 000000000..9e55c33cf --- /dev/null +++ b/packages/theme-mobile/src/form-item/index.less @@ -0,0 +1,195 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import '../mixins/common.less'; +@import './vars.less'; + +@form-item-prefix-cls: ~'@{css-prefix}mobile-form-item'; +@input-prefix-cls: ~'@{css-prefix}mobile-input'; +@input-group-prefix-cls: ~'@{css-prefix}mobile-input-group'; +@textarea-prefix-cls: ~'@{css-prefix}mobile-textarea'; +@button-prefix-cls: ~'@{css-prefix}mobile-button'; +@numeric-prefix-cls: ~'@{css-prefix}mobile-numeric'; + +.@{form-item-prefix-cls} { + margin-bottom: 12px; + .clearfix(); + + & & { + margin-bottom: 0; + } + + &&--mini, + &&--small { + margin-bottom: 8px; + } + + &--medium &__content, + &--medium &__label { + line-height: var(--ti-form-item-medium-line-height, 36px); + } + + &--small &__content, + &--small &__label { + line-height: var(--ti-form-item-small-line-height, 28px); + } + + &--small &__error { + padding-top: 2px; + } + + &--mini &__content, + &--mini &__label { + line-height: var(--ti-form-item-mini-line-height, 24px); + } + + &--mini &__error { + padding-top: 1px; + } + + &__label-wrap { + float: left; + + .@{form-item-prefix-cls}__label { + display: inline-block; + float: none; + } + } + + &__label { + text-align: right; + vertical-align: middle; + float: left; + font-size: 16px; + color: var(--ti-form-item-label-color, #333); + line-height: 48px; + padding-right: 8px; + box-sizing: border-box; + } + + &__value { + float: right; + + .tiny-mobile-input-form__input{ + text-align: left; + } + } + + &__content { + line-height: 48px; + position: relative; + font-size: var(--ti-form-item-label-font-size, 14px); + .clearfix(); + + .@{input-group-prefix-cls} { + vertical-align: top; + } + + .@{button-prefix-cls} + .@{button-prefix-cls} { + margin-left: 8px; + } + } + + &__label.is-ellipsis{ + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + display: initial; + } + + &.is-error .is-vertical{ + margin-bottom: 36px; + } + + .is-vertical { + border-bottom: 1px solid #ddd; + } + + &__error { + color: var(--ti-form-item-error-color, #f5222d); + font-size: var(--ti-form-item-error-font-size, 12px); + line-height: 1; + padding-top: 4px; + position: absolute; + top: 100%; + left: 0; + } + + &__error--inline { + position: relative; + top: auto; + left: auto; + display: inline-block; + margin-left: 10px; + } + + &.is-required:not(.is-no-asterisk) { + .@{form-item-prefix-cls}__label-wrap > .@{form-item-prefix-cls}__label:before, + .@{form-item-prefix-cls}__label:before { + content: '*'; + color: var(--ti-form-item-error-color, #f5222d); + margin-right: 4px; + } + } + + &.is-error { + .@{input-prefix-cls}__inner, + .@{input-prefix-cls}__inner:focus, + .@{textarea-prefix-cls}__inner, + .@{textarea-prefix-cls}__inner:focus { + border-color: var(--ti-form-item-error-color, #f5222d); + } + + .@{input-group-prefix-cls}__append, + .@{input-group-prefix-cls}__prepend { + .@{input-prefix-cls}__inner { + border-color: transparent; + } + } + + .@{input-prefix-cls}__validateIcon { + color: var(--ti-form-item-error-color, #f5222d); + } + + .@{numeric-prefix-cls}__input-inner { + &, + &:focus { + border-color: var(--ti-form-item-error-color, #f5222d); + } + } + } + + &--feedback .@{input-prefix-cls}__validateIcon { + display: inline-block; + } + + .@{input-prefix-cls}__validateIcon { + display: none; + } +} + +.@{css-prefix} { + &mobile-zoom-in-top-enter-active, + &mobile-zoom-in-top-leave-active { + opacity: 1; + transform: scaleY(1); + transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1); + transform-origin: center top; + } + + &mobile-zoom-in-top-enter, + &mobile-zoom-in-top-leave-active { + opacity: 0; + transform: scaleY(0); + } +} diff --git a/packages/theme-mobile/src/form-item/vars.less b/packages/theme-mobile/src/form-item/vars.less new file mode 100644 index 000000000..3ac7b1d3e --- /dev/null +++ b/packages/theme-mobile/src/form-item/vars.less @@ -0,0 +1,10 @@ +:root { + --ti-form-item-small-line-height: 28px; + --ti-form-item-medium-line-height: 36px; + --ti-form-item-mini-line-height: 24px; + --ti-form-item-label-line-height: var(--ti-mobile-base-size-height-minor, 30px); + --ti-form-item-label-font-size: 14px; + --ti-form-item-label-color: var(--ti-mobile-base-color-info-normal, #333); + --ti-form-item-error-color: var(--ti-mobile-base-color-danger-normal, #f5222d); + --ti-form-item-error-font-size: var(--ti-mobile-base-font-size, 12px); +} diff --git a/packages/theme-mobile/src/form/index.js b/packages/theme-mobile/src/form/index.js new file mode 100644 index 000000000..fb0d9ac1e --- /dev/null +++ b/packages/theme-mobile/src/form/index.js @@ -0,0 +1,3 @@ +export default { + // mobile/form +} diff --git a/packages/theme-mobile/src/form/index.less b/packages/theme-mobile/src/form/index.less new file mode 100644 index 000000000..54ddef67c --- /dev/null +++ b/packages/theme-mobile/src/form/index.less @@ -0,0 +1,116 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@form-prefix-cls: ~'@{css-prefix}mobile-form'; +@form-item-prefix-cls: ~'@{css-prefix}mobile-form-item'; +@input-form-prefix-cls: ~'@{css-prefix}mobile-input-form'; + +.@{form-prefix-cls} { + width: 100%; + overflow: hidden; + + div { + outline: none; + } + + .@{form-item-prefix-cls} { + position: relative; + margin-bottom: 0; + } + + .@{form-item-prefix-cls}__label { + width: 35%; + min-height: 48px; + line-height: 1.4; + font-size: 16px; + display: flex; + z-index: 1; + padding: 13px 0px; + } + + .@{form-item-prefix-cls}__value { + width: 65%; + } + + &--inline { + .@{form-item-prefix-cls}, + .@{form-item-prefix-cls}__content { + display: inline-block; + vertical-align: top; + } + + .@{form-item-prefix-cls} { + margin-right: var(--ti-form-item-margin-right, 10px); + } + + .@{form-item-prefix-cls}__label { + float: none; + display: inline-block; + } + + .@{form-prefix-cls}--label-top .@{form-item-prefix-cls}__content { + display: block; + } + } + + &--label-left { + .@{form-item-prefix-cls}__label { + text-align: left; + } + } + + &--label-top { + .@{form-item-prefix-cls}__label { + width: 100%; + float: none; + position: initial; + text-align: left; + line-height: 1; + } + + .@{form-item-prefix-cls}__value { + width: 100%; + } + + .@{form-item-prefix-cls} { + margin-bottom: 16px; + } + + .@{input-form-prefix-cls}__input { + width: 100%; + } + + .@{form-item-prefix-cls}__content { + flex-wrap: wrap; + } + + } + + &--label-top & { + margin-bottom: 16px; + } + + &--inline&--label-top { + .@{form-item-prefix-cls} { + margin-bottom: 16px; + margin-right: 64px; + } + + .@{form-item-prefix-cls}__label { + display: block; + text-align: left; + } + } +} diff --git a/packages/theme-mobile/src/form/vars.less b/packages/theme-mobile/src/form/vars.less new file mode 100644 index 000000000..e69de29bb diff --git a/packages/theme-mobile/src/image-viewer/index.js b/packages/theme-mobile/src/image-viewer/index.js new file mode 100644 index 000000000..77a3ca78b --- /dev/null +++ b/packages/theme-mobile/src/image-viewer/index.js @@ -0,0 +1,7 @@ +export default { + 'tiny-mobile-image-viewer-color': '#fff', + 'tiny-mobile-image-viewer-close-bgcolor': '#606266', + 'tiny-mobile-image-viewer-arrow-disabled-bgcolor': '#bfbfbf', + 'tiny-mobile-image-viewer-arrow-disabled-color': '#999', + 'tiny-mobile-image-viewer-mask-background': '#000' +} diff --git a/packages/theme-mobile/src/image-viewer/index.less b/packages/theme-mobile/src/image-viewer/index.less new file mode 100644 index 000000000..e780a7cc2 --- /dev/null +++ b/packages/theme-mobile/src/image-viewer/index.less @@ -0,0 +1,168 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +@image-viewer-prefix-cls: ~'@{css-prefix}mobile-image-viewer'; + +.@{image-viewer-prefix-cls} { + &__wrapper { + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + overflow: hidden; + } + + &__mask { + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + opacity: 0.9; + background: var(--ti-mobile-image-viewer-mask-background, #000); + } + + &__btn { + position: absolute; + z-index: 1; + display: flex; + align-items: center; + justify-content: center; + border-radius: 50%; + opacity: 0.8; + box-sizing: border-box; + .user-select(none); + + svg { + fill: var(--ti-mobile-image-viewer-color, #fff); + } + } + + &__close { + top: 40px; + right: 40px; + width: 22px; + height: 22px; + font-size: 20px; + background-color: var(--ti-mobile-image-viewer-close-bgcolor, #606266); + } + + &__next, + &__prev { + top: 50%; + width: 44px; + height: 44px; + font-size: 24px; + background-color: var(--ti-mobile-image-viewer-close-bgcolor, #606266); + + &.is-arrow-disabled { + background-color: var(--ti-mobile-image-viewer-arrow-disabled-bgcolor, #bfbfbf); + + svg { + fill: var(--ti-mobile-image-viewer-arrow-disabled-color, #999); + } + } + } + + &__prev { + transform: translateY(-50%); + left: 40px; + } + + &__next { + transform: translateY(-50%); + right: 40px; + text-indent: 2px; + } + + &__actions { + left: 50%; + bottom: 30px; + transform: translateX(-50%); + width: 282px; + height: 44px; + padding: 0 23px; + background-color: var(--ti-mobile-image-viewer-close-bgcolor, #606266); + border-radius: 22px; + } + + &__actions-inner { + width: 100%; + height: 100%; + text-align: justify; + cursor: default; + font-size: 23px; + display: flex; + align-items: center; + justify-content: space-around; + } + + &__canvas { + width: 100%; + height: 100%; + } + + &__wrap { + display: flex; + height: 100%; + width: 1080px; + } + + &__item { + position: relative; + -webkit-flex-shrink: 0; + flex-shrink: 1; + width: 100%; + height: 100%; + } + + &__detail { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + transition-property: transform; + display: inline-block; + } + + &__img { + display: block; + width: 100%; + height: 100%; + object-fit: contain; + + &.is-full-screen { + object-fit: fill; + } + } + + &__index { + left: 50%; + top: 30px; + transform: translateX(-50%); + width: auto; + height: 44px; + padding: 0 23px; + border-radius: 0px; + + span { + color: var(--ti-mobile-image-viewer-color, #fff); + margin-right: 5px; + } + } +} diff --git a/packages/theme-mobile/src/image-viewer/vars.less b/packages/theme-mobile/src/image-viewer/vars.less new file mode 100644 index 000000000..395caa86a --- /dev/null +++ b/packages/theme-mobile/src/image-viewer/vars.less @@ -0,0 +1,7 @@ +:root { + --ti-mobile-image-viewer-color: var(--ti-mobile-base-color-light, #fff); + --ti-mobile-image-viewer-close-bgcolor: #606266; + --ti-mobile-image-viewer-arrow-disabled-bgcolor: var(--ti-mobile-base-color-info-disabled, #bfbfbf); + --ti-mobile-image-viewer-arrow-disabled-color: var(--ti-mobile-base-color-placeholder, #999); + --ti-mobile-image-viewer-mask-background: var(--ti-mobile-base-color-dark, #000); +} diff --git a/packages/theme-mobile/src/images/404.png b/packages/theme-mobile/src/images/404.png new file mode 100644 index 000000000..96004e2bc Binary files /dev/null and b/packages/theme-mobile/src/images/404.png differ diff --git a/packages/theme-mobile/src/images/build.png b/packages/theme-mobile/src/images/build.png new file mode 100644 index 000000000..0a4713392 Binary files /dev/null and b/packages/theme-mobile/src/images/build.png differ diff --git a/packages/theme-mobile/src/images/busy.png b/packages/theme-mobile/src/images/busy.png new file mode 100644 index 000000000..5ca944446 Binary files /dev/null and b/packages/theme-mobile/src/images/busy.png differ diff --git a/packages/theme-mobile/src/images/errortips-bg.png b/packages/theme-mobile/src/images/errortips-bg.png new file mode 100644 index 000000000..b56856227 Binary files /dev/null and b/packages/theme-mobile/src/images/errortips-bg.png differ diff --git a/packages/theme-mobile/src/images/netcut.png b/packages/theme-mobile/src/images/netcut.png new file mode 100644 index 000000000..b7599fef2 Binary files /dev/null and b/packages/theme-mobile/src/images/netcut.png differ diff --git a/packages/theme-mobile/src/images/nodata.png b/packages/theme-mobile/src/images/nodata.png new file mode 100644 index 000000000..6f2ea2b86 Binary files /dev/null and b/packages/theme-mobile/src/images/nodata.png differ diff --git a/packages/theme-mobile/src/images/pcview.png b/packages/theme-mobile/src/images/pcview.png new file mode 100644 index 000000000..9050dc521 Binary files /dev/null and b/packages/theme-mobile/src/images/pcview.png differ diff --git a/packages/theme-mobile/src/index-bar-anchor/index.js b/packages/theme-mobile/src/index-bar-anchor/index.js new file mode 100644 index 000000000..4bebb7a67 --- /dev/null +++ b/packages/theme-mobile/src/index-bar-anchor/index.js @@ -0,0 +1,4 @@ +export default { + 'tiny-mobile-index-bar-anchor-bg-color': '#f5f5f5', + 'tiny-mobile-index-bar-anchor-text-color': '#999', +} diff --git a/packages/theme-mobile/src/index-bar-anchor/index.less b/packages/theme-mobile/src/index-bar-anchor/index.less new file mode 100644 index 000000000..6f99b4f62 --- /dev/null +++ b/packages/theme-mobile/src/index-bar-anchor/index.less @@ -0,0 +1,26 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@index-bar-prefix-cls: ~'@{css-prefix}mobile-index-bar-anchor'; + +.@{index-bar-prefix-cls} { + background: var(--ti-mobile-index-bar-anchor-bg-color); + &__label { + margin-left: 16px; + line-height: 32px; + font-size: 12px; + color: var(--ti-mobile-index-bar-anchor-text-color); + } +} diff --git a/packages/theme-mobile/src/index-bar-anchor/vars.less b/packages/theme-mobile/src/index-bar-anchor/vars.less new file mode 100644 index 000000000..39881c055 --- /dev/null +++ b/packages/theme-mobile/src/index-bar-anchor/vars.less @@ -0,0 +1,4 @@ +:root { + --ti-mobile-index-bar-anchor-bg-color: var(--ti-mobile-common-bg-color-dark-gray, #f5f5f5); + --ti-mobile-index-bar-anchor-text-color: var(--ti-mobile-common-color-text-weaken-dark, #999); +} diff --git a/packages/theme-mobile/src/index-bar/index.js b/packages/theme-mobile/src/index-bar/index.js new file mode 100644 index 000000000..2510bdedc --- /dev/null +++ b/packages/theme-mobile/src/index-bar/index.js @@ -0,0 +1,6 @@ +export default { + 'tiny-mobile-index-bar-bg-color-active': '#4a79fe', + 'tiny-mobile-index-bar-text-color': '#595959', + 'tiny-mobile-index-bar-text-color-active': '#fff', + 'tiny-mobile-index-bar-side-bg-color': 'rgba(80, 227, 194, 0.12)', +} diff --git a/packages/theme-mobile/src/index-bar/index.less b/packages/theme-mobile/src/index-bar/index.less new file mode 100644 index 000000000..031386697 --- /dev/null +++ b/packages/theme-mobile/src/index-bar/index.less @@ -0,0 +1,52 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/button.less'; +@import '../custom.less'; +@import './vars.less'; + +@index-bar-prefix-cls: ~'@{css-prefix}mobile-index-bar'; + +.@{index-bar-prefix-cls} { + &__side { + position: fixed; + right: 0; + top: 50%; + width: 22px; + padding: 4px 0; + display: flex; + flex-direction: column; + align-items: center; + text-align: center; + cursor: pointer; + user-select: none; + transform: translateY(-50%); + z-index: 2; + background: var(--ti-mobile-index-bar-side-bg-color); + } + + &__label { + width: 100%; + font-size: 10px; + line-height: 16px; + font-weight: 500; + color: var(--ti-mobile-index-bar-text-color); + } + + &__label--active { + width: 16px; + height: 16px; + border-radius: 50%; + color: var(--ti-mobile-index-bar-text-color-active); + background: var(--ti-mobile-index-bar-bg-color-active); + } +} diff --git a/packages/theme-mobile/src/index-bar/vars.less b/packages/theme-mobile/src/index-bar/vars.less new file mode 100644 index 000000000..7b5a1b375 --- /dev/null +++ b/packages/theme-mobile/src/index-bar/vars.less @@ -0,0 +1,6 @@ +:root { + --ti-mobile-index-bar-bg-color-active: var(--ti-mobile-common-bg-color-main, #4a79fe); + --ti-mobile-index-bar-text-color: var(--ti-mobile-common-color-text-secondary, #595959); + --ti-mobile-index-bar-text-color-active: var(--ti-mobile-common-color-text-white, #fff); + --ti-mobile-index-bar-side-bg-color: rgba(80, 227, 194, 0.12); +} diff --git a/packages/theme-mobile/src/index.js b/packages/theme-mobile/src/index.js new file mode 100644 index 000000000..e611441df --- /dev/null +++ b/packages/theme-mobile/src/index.js @@ -0,0 +1,43 @@ +import Alert from './alert' +import Avatar from './avatar' +import Badge from './badge' +import Base from './base' +import Button from './button' +import Checkbox from './checkbox' +import CheckboxGroup from './checkbox-group' +import DialogBox from './dialog-box' +import ImageViewer from './image-viewer' +import Input from './input' +import List from './list' +import Loading from './loading' +import NavBar from './nav-bar' +import Numeric from './numeric' +import Radio from './radio' +import Search from './search' +import Switch from './switch' +import Tabbar from './tabbar' +import TabbarItem from './tabbar-item' +import Tabs from './tabs' + +export default { + ...Alert, + ...Avatar, + ...Badge, + ...Base, + ...Button, + ...Checkbox, + ...CheckboxGroup, + ...DialogBox, + ...ImageViewer, + ...Input, + ...List, + ...Loading, + ...NavBar, + ...Numeric, + ...Radio, + ...Search, + ...Switch, + ...Tabbar, + ...TabbarItem, + ...Tabs +} diff --git a/packages/theme-mobile/src/index.less b/packages/theme-mobile/src/index.less new file mode 100644 index 000000000..39ffb4f2e --- /dev/null +++ b/packages/theme-mobile/src/index.less @@ -0,0 +1,50 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import './base/index-global.less'; +@import './action-sheet/index.less'; +@import './alert/index.less'; +@import './avatar/index.less'; +@import './badge/index.less'; +@import './button/index.less'; +@import './checkbox/index.less'; +@import './checkbox-group/index.less'; +@import './dialog-box/index.less'; +@import './dropdown-item/index.less'; +@import './dropdown-menu/index.less'; +@import './exception/index-global.less'; +@import './file-upload/index.less'; +@import './form/index.less'; +@import './form-item/index.less'; +@import './image-viewer/index.less'; +@import './input/index.less'; +@import './list/index.less'; +@import './loading/index.less'; +@import './mini-picker/index.less'; +@import './nav-bar/index.less'; +@import './numeric/index.less'; +@import './picker-column/index.less'; +@import './popup/index.less'; +@import './progress/index.less'; +@import './pull-refresh/index.less'; +@import './radio/index.less'; +@import './search/index.less'; +@import './slider/index.less'; +@import './switch/index.less'; +@import './tabbar/index.less'; +@import './tabbar-item/index.less'; +@import './tabs/index.less'; +@import './tall-storage/index.less'; +@import './time-line/index.less'; +@import './upload-list/index.less'; +@import './multi-select/index.less'; +@import './wheel/index.less'; diff --git a/packages/theme-mobile/src/input/index.js b/packages/theme-mobile/src/input/index.js new file mode 100644 index 000000000..b3d38a226 --- /dev/null +++ b/packages/theme-mobile/src/input/index.js @@ -0,0 +1,23 @@ +export default { + 'tiny-mobile-input-bg-color': '#fff', + 'tiny-mobile-input-line-height': '30px', + 'tiny-mobile-input-medium-height': '42px', + 'tiny-mobile-input-small-height': '36px', + 'tiny-mobile-input-mini-height': '24px', + 'tiny-mobile-input-color-disabled': '#999', + 'tiny-mobile-input-bg-color-disabled': '#f5f5f5', + 'tiny-mobile-input-exceed-text-color': '#f5222d', + 'tiny-mobile-input-icon-font-size': '16px', + 'tiny-mobile-input-icon-close-color': '#bfbfbf', + 'tiny-mobile-textarea-count-text-color': '#999', + 'tiny-mobile-textarea-count-font-size': '12px', + 'tiny-mobile-textarea-inner-height': '96px', + 'tiny-mobile-textarea-inner-font-size': '16px', + 'tiny-mobile-textarea-inner-text-color': '#666', + 'tiny-mobile-textarea-inner-placeholder-color': '#ccc', + 'tiny-mobile-textarea-title-font-size': '16px', + 'tiny-mobile-textarea-title-text-color': '#333', + 'tiny-mobile-textarea-showlimit-inner-height': '70px', + 'tiny-mobile-textarea-showcontent-inner-height': '66px', + 'tiny-mobile-input-form-bg-color-error': 'rgba(230, 34, 34, 0.04)', +} diff --git a/packages/theme-mobile/src/input/index.less b/packages/theme-mobile/src/input/index.less new file mode 100644 index 000000000..d0ad70586 --- /dev/null +++ b/packages/theme-mobile/src/input/index.less @@ -0,0 +1,437 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/input.less'; +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +@textarea-prefix-cls: ~'@{css-prefix}mobile-textarea'; +@input-prefix-cls: ~'@{css-prefix}mobile-input'; +@input-group-prefix-cls: ~'@{css-prefix}mobile-input-group'; +@input-form-prefix-cls: ~'@{css-prefix}mobile-input-form'; + +.@{textarea-prefix-cls} { + position: relative; + display: inline-block; + width: 100%; + background-color: var(--ti-mobile-input-bg-color, #fff); + padding: 12px 16px; + + &__count { + color: var(--ti-mobile-textarea-count-text-color, #999); + font-size: var(--ti-mobile-textarea-count-font-size, 12px); + margin-top: 4px; + text-align: right; + display: block; + } + + &__inner { + width: 100%; + height: var(--ti-mobile-textarea-inner-height, 96px); + font-size: var(--ti-mobile-textarea-inner-font-size, 16px); + color: var(--ti-mobile-textarea-inner-text-color, #666); + padding: 0; + border: 0; + display: block; + resize: none; + box-sizing: border-box; + transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); + .placeholder( + @color: var(--ti-mobile-textarea-inner-placeholder-color, #ccc) + ); + + &:hover, + &:focus { + outline: 0; + } + } + + &__title { + font-size: var(--ti-mobile-textarea-title-font-size, 16px); + color: var(--ti-mobile-textarea-title-text-color, #333); + margin-bottom: 8px; + } + + &__content { + margin-bottom: 8px; + } + + &.is-showlimit { + padding-bottom: 8px; + } + + &.is-showtitle &__inner { + height: var(--ti-mobile-textarea-showlimit-inner-height, 70px); + } + + &.is-showcontent &__inner { + height: var(--ti-mobile-textarea-showcontent-inner-height, 66px); + } + + &.is-disabled &__inner { + background-color: var(--ti-mobile-input-bg-color-disabled, #f5f5f5); + color: var(--ti-mobile-input-color-disabled, #999); + cursor: not-allowed; + } + + &.is-exceed &__count { + color: var(--ti-mobile-input-exceed-text-color, #f5222d); + } +} + +.@{input-prefix-cls} { + position: relative; + width: 100%; + + &::-webkit-scrollbar { + z-index: 11; + width: 6px; + + &:horizontal { + height: 6px; + } + } + + &::-webkit-scrollbar-thumb { + border-radius: 5px; + width: 6px; + background: #b4bccc; + } + + &::-webkit-scrollbar-corner { + background: #fff; + } + + &::-webkit-scrollbar-track { + background: #fff; + } + + &::-webkit-scrollbar-track-piece { + background: #fff; + width: 6px; + } + + &.is-exceed &__suffix &__count { + color: var(--ti-mobile-input-exceed-text-color, #f5222d); + } + + &.is-disabled &__inner { + cursor: not-allowed; + color: var(--ti-mobile-input-color-disabled, #999); + background: var(--ti-mobile-input-bg-color-disabled, #f5f5f5); + } + + &.is-disabled &__icon { + cursor: not-allowed; + + &.@{css-prefix}svg { + &, + &:hover { + fill: var(--ti-mobile-input-color-disabled, #999); + } + } + } + + &.is-disabled &__prefix, + &.is-disabled &__suffix { + .@{css-prefix}svg { + &, + &:hover { + fill: var(--ti-mobile-input-color-disabled, #999); + } + } + } + + & &__clear { + font-size: var(--ti-mobile-input-icon-font-size, 16px); + cursor: pointer; + transition: color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); + + &, + &:hover { + fill: var(--ti-mobile-input-color-disabled, #999); + } + } + + & &__count { + height: 100%; + display: inline-flex; + align-items: center; + color: #909399; + font-size: 12px; + + .@{input-prefix-cls}__count-inner { + background: var(--ti-mobile-input-bg-color, #fff); + line-height: initial; + display: inline-block; + } + } + + &__inner { + width: 100%; + height: 48px; + line-height: 48px; + font-size: 16px; + color: #666; + background: var(--ti-mobile-input-bg-color, #fff); + padding: 0 16px; + border: 0; + outline: 0; + display: inline-block; + box-sizing: border-box; + -webkit-appearance: none; + transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); + .placeholder(@color: #ccc); + + &:hover, + &:focus, + &:active { + outline: 0; + } + + &::-ms-clear { + display: none; + width: 0; + height: 0; + } + } + + &__prefix, + &__suffix { + position: absolute; + top: 50%; + transform: translateY(-50%); + transition: all 0.3s; + text-align: center; + color: #d9d9d9; + line-height: calc(var(--ti-mobile-input-line-height, 30px) - 2px); + } + + &.is-active &__inner, + &__inner:focus { + outline: 0; + } + + &__suffix { + right: 16px; + transition: all 0.3s; + pointer-events: none; + + &:hover { + cursor: pointer; + } + } + + &__suffix-inner { + pointer-events: all; + } + + &__prefix { + left: 8px; + transition: all 0.3s; + font-size: var(--ti-mobile-input-icon-font-size, 16px); + } + + &__icon { + height: 100%; + line-height: var(--ti-mobile-input-line-height, 30px); + text-align: center; + transition: all 0.3s; + font-size: var(--ti-mobile-input-icon-font-size, 16px); + + &, + &:hover { + fill: var(--ti-mobile-input-color-disabled, #999); + } + + &:after { + content: ''; + height: 100%; + width: 0; + display: inline-block; + vertical-align: middle; + } + + .svg-operationfaild { + &, + &:hover { + fill: var(--ti-mobile-input-icon-close-color, #bfbfbf); + } + } + } + + &__validateIcon { + pointer-events: none; + } + + &-suffix &__inner { + padding-right: 48px; + } + + &-prefix &__inner { + padding-left: 30px; + padding-right: 28px; + } + + &-medium { + .input-size(var(--ti-mobile-input-medium-height, 42px)); + } + + &-small { + .input-size(var(--ti-mobile-input-small-height, 36px)); + } + + &-mini { + .input-size(var(--ti-mobile-input-mini-height, 24px)); + } +} + +.@{input-group-prefix-cls} { + line-height: normal; + display: inline-table; + width: 100%; + border-collapse: separate; + border-spacing: 0; + + > .@{input-prefix-cls}__inner { + vertical-align: middle; + display: table-cell; + } + + &__append, + &__prepend { + background-color: #f5f5f5; + color: #999; + padding: 0 20px; + width: 1px; + vertical-align: middle; + display: table-cell; + position: relative; + white-space: nowrap; + + &:focus { + outline: 0; + } + + .@{css-prefix}button, + .@{css-prefix}select { + display: inline-block; + margin: -10px -20px; + } + + .@{css-prefix}button, + .@{css-prefix}input { + font-size: inherit; + } + + button.@{css-prefix}button, + div.@{css-prefix}select .@{input-prefix-cls}__inner, + div.@{css-prefix}select:hover .@{input-prefix-cls}__inner { + background-color: transparent; + color: inherit; + } + } +} + +.@{input-form-prefix-cls} { + height: 48px; + line-height: 48px; + position: relative; + + &__select { + display: flex; + justify-content: flex-end; + align-items: center; + width: 100%; + height: 100%; + background: var(--ti-mobile-input-bg-color, #fff); + } + + &__icon { + height: 20px; + line-height: 20px; + width: 20px; + margin-right: 16px; + font-size: 0; + transform-origin: center center; + transition: all linear 0.3s; + + svg { + fill: #999; + font-size: 20px; + vertical-align: text-bottom; + } + } + + &__label { + box-sizing: border-box; + width: 35%; + padding: 0 12px 0 16px; + line-height: 1.376; + color: #333; + font-size: 22px; + display: -webkit-box; + overflow: hidden; + text-overflow: ellipsis; + } + + &__input { + float: right; + } + + &__tips { + width: 100%; + color: var(--ti-mobile-textarea-count-text-color, #999); + padding-top: 6px; + line-height: 20px; + } + + &__error { + width: 100%; + height: 36px; + position: absolute; + overflow: hidden; + font-size: 13px; + line-height: 36px; + color: var(--ti-mobile-common-color-error-text-1, #e62222); + text-overflow: ellipsis; + bottom: -36px; + background: var(--ti-mobile-input-form-bg-color-error, rgba(230, 34, 34, 0.04)); + border-radius: 4px; + padding: 0px 12px; + &.align-right { + text-align: right; + } + + &.align-left { + text-align: left; + } + } +} + +.@{css-prefix-iconfont}-loading { + font-size: 14px; + line-height: 1; + vertical-align: text-top; + animation: rotating 2s linear infinite; +} + +@keyframes rotating { + 0% { + transform: rotateZ(0deg); + } + + 100% { + transform: rotateZ(360deg); + } +} diff --git a/packages/theme-mobile/src/input/vars.less b/packages/theme-mobile/src/input/vars.less new file mode 100644 index 000000000..4da41f2c7 --- /dev/null +++ b/packages/theme-mobile/src/input/vars.less @@ -0,0 +1,23 @@ +:root { + --ti-mobile-input-bg-color: var(--ti-mobile-base-color-light, #fff); + --ti-mobile-input-line-height: var(--ti-mobile-base-size-height-minor, 30px); + --ti-mobile-input-medium-height: var(--ti-mobile-base-size-height-medium, 42px); + --ti-mobile-input-small-height: var(--ti-mobile-base-size-height-small, 36px); + --ti-mobile-input-mini-height: var(--ti-mobile-base-size-height-mini, 24px); + --ti-mobile-input-color-disabled: var(--ti-mobile-base-color-placeholder, #999); + --ti-mobile-input-bg-color-disabled: var(--ti-mobile-base-color-selected-background, #f5f5f5); + --ti-mobile-input-exceed-text-color: var(--ti-mobile-base-color-danger-normal, #f5222d); + --ti-mobile-input-icon-font-size: 16px; + --ti-mobile-input-icon-close-color: var(--ti-mobile-base-color-primary-disabled, #bfbfbf); + --ti-mobile-textarea-count-text-color: var(--ti-mobile-base-color-placeholder, #999); + --ti-mobile-textarea-count-font-size: var(--ti-mobile-base-font-size, 12px); + --ti-mobile-textarea-inner-height: 96px; + --ti-mobile-textarea-inner-font-size: 16px; + --ti-mobile-textarea-inner-text-color: var(--ti-mobile-base-color-secondary, #666); + --ti-mobile-textarea-inner-placeholder-color: #ccc; + --ti-mobile-textarea-title-font-size: 16px; + --ti-mobile-textarea-title-text-color: var(--ti-mobile-base-color-info-normal, #333); + --ti-mobile-textarea-showlimit-inner-height: 70px; + --ti-mobile-textarea-showcontent-inner-height: 66px; + --ti-mobile-input-form-bg-color-error: rgba(230, 34, 34, 0.04); +} diff --git a/packages/theme-mobile/src/list/index.js b/packages/theme-mobile/src/list/index.js new file mode 100644 index 000000000..c8dddb32e --- /dev/null +++ b/packages/theme-mobile/src/list/index.js @@ -0,0 +1,14 @@ +export default { + 'tiny-mobile-list-bgcolor': '#fff', + 'tiny-mobile-list-active-bgcolor': '#ddd', + 'tiny-mobile-list-border-color': '#ddd', + 'tiny-mobile-list-main-text-color': '#333', + 'tiny-mobile-list-main-text-font-size': '16px', + 'tiny-mobile-list-sub-text-color': '#999', + 'tiny-mobile-list-sub-text-font-size': '14px', + 'tiny-mobile-list-content-des-color': '#999', + 'tiny-mobile-list-content-des-font-size': '12px', + 'tiny-mobile-list-prefix-size': '24px', + 'tiny-mobile-list-suffix-size': '16px', + 'tiny-mobile-list-suffix-color': '#999' +} diff --git a/packages/theme-mobile/src/list/index.less b/packages/theme-mobile/src/list/index.less new file mode 100644 index 000000000..76c005af7 --- /dev/null +++ b/packages/theme-mobile/src/list/index.less @@ -0,0 +1,98 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@list-prefix-cls: ~'@{css-prefix}mobile-list'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{list-prefix-cls} { + width: 100%; + min-height: 48px; + display: flex; + justify-content: space-between; + align-items: center; + padding: 8px 16px; + background-color: var(--ti-mobile-list-bgcolor, #fff); + box-sizing: border-box; + position: relative; + + &:active { + background-color: var(--ti-mobile-list-active-bgcolor, #ddd); + } + + &:not(:last-child)::after { + position: absolute; + box-sizing: border-box; + content: ' '; + pointer-events: none; + right: 0; + bottom: 0; + left: 16px; + border-bottom: 1px solid var(--ti-mobile-list-border-color, #ddd); + transform: scaleY(0.5); + } + + &.is-padding { + padding: 12px 16px; + } + + &__content { + display: flex; + flex-direction: column; + width: 100%; + } + + &__content-text { + display: flex; + justify-content: space-between; + align-items: center; + } + + &__main-text { + color: var(--ti-mobile-list-main-text-color, #333); + font-size: var(--ti-mobile-list-main-text-font-size, 16px); + } + + &__sub-text { + color: var(--ti-mobile-list-sub-text-color, #999); + font-size: var(--ti-mobile-list-sub-text-font-size, 14px); + } + + &__content-des { + color: var(--ti-mobile-list-content-des-color, #999); + font-size: var(--ti-mobile-list-content-des-font-size, 12px); + margin: 4px 0 0; + } + + &__prefix { + margin-right: 16px; + + .@{svg-prefix-cls} { + font-size: var(--ti-mobile-list-prefix-size, 24px); + } + } + + &__suffix { + margin-left: 16px; + + .@{svg-prefix-cls} { + fill: var(--ti-mobile-list-suffix-color, #999); + font-size: var(--ti-mobile-list-suffix-size, 16px); + } + } + + &.is-show-prefix:not(:last-child)::after { + left: 56px; + } +} diff --git a/packages/theme-mobile/src/list/vars.less b/packages/theme-mobile/src/list/vars.less new file mode 100644 index 000000000..6359a0ee1 --- /dev/null +++ b/packages/theme-mobile/src/list/vars.less @@ -0,0 +1,14 @@ +:root { + --ti-mobile-list-bgcolor: var(--ti-mobile-base-color-light, #fff); + --ti-mobile-list-active-bgcolor: #ddd; + --ti-mobile-list-border-color: #ddd; + --ti-mobile-list-main-text-color: var(--ti-mobile-base-color-info-normal, #333); + --ti-mobile-list-main-text-font-size: 16px; + --ti-mobile-list-sub-text-color: var(--ti-mobile-base-color-placeholder, #999); + --ti-mobile-list-sub-text-font-size: 14px; + --ti-mobile-list-content-des-color: var(--ti-mobile-base-color-placeholder, #999); + --ti-mobile-list-content-des-font-size: var(--ti-mobile-base-font-size, 12px); + --ti-mobile-list-prefix-size: 24px; + --ti-mobile-list-suffix-size: 16px; + --ti-mobile-list-suffix-color: var(--ti-mobile-base-color-placeholder, #999); +} diff --git a/packages/theme-mobile/src/loading/index.js b/packages/theme-mobile/src/loading/index.js new file mode 100644 index 000000000..2b505eef3 --- /dev/null +++ b/packages/theme-mobile/src/loading/index.js @@ -0,0 +1,24 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-mobile-loading-bg-color-primary': 'rgba(0, 0, 0, 0.9)', + 'tiny-mobile-loading-text-color-primary': '#fff', + 'tiny-mobile-loading-height-primary': '140px', + 'tiny-mobile-loading-width-primary': '140px', + 'tiny-mobile-loading-line-height-primary': '55px', + 'tiny-mobile-loading-border-radius-primary': '16px', + 'tiny-mobile-loading-dot-height-primary': '40px', + 'tiny-mobile-loading-dot-width-primary': '3px', + 'tiny-mobile-loading-dot-width-simple': '2px', + 'tiny-mobile-loading-text-color-simple': '#999', +} diff --git a/packages/theme-mobile/src/loading/index.less b/packages/theme-mobile/src/loading/index.less new file mode 100644 index 000000000..9b2272b42 --- /dev/null +++ b/packages/theme-mobile/src/loading/index.less @@ -0,0 +1,56 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import "../custom.less"; +@import "./vars.less"; + +@loading-prefix-cls: ~"@{css-prefix}mobile-loading"; + +.@{loading-prefix-cls} { + .component-css-vars-loading(); + + &-primary { + top: 50%; + text-align: center; + margin: 0 auto; + background-color: var( + --ti-mobile-loading-bg-color-primary, + rgba(0, 0, 0, 0.75) + ); + color: var(--ti-mobile-loading-text-color-primary, #fff); + width: var(--ti-mobile-loading-width-primary, 140px); + height: var(--ti-mobile-loading-height-primary, 140px); + line-height: var(--ti-mobile-loading-line-height-primary, 55px); + border-radius: var(--ti-mobile-loading-border-radius, 16px); + + svg { + width: var(--ti-mobile-loading-dot-width-primary, 3rem); + margin-top: var(--ti-mobile-loading-dot-height, 40px); + } + } + + &-simple { + text-align: center; + color: var(--ti-mobile-loading-text-color-simple, #999); + svg { + width: var(--ti-mobile-loading-dot-width-simple, 2rem); + } + } + + &-parent-relative { + position: relative; + } + + &-parent-hidden { + overflow: hidden; + } +} diff --git a/packages/theme-mobile/src/loading/vars.less b/packages/theme-mobile/src/loading/vars.less new file mode 100644 index 000000000..af212f05c --- /dev/null +++ b/packages/theme-mobile/src/loading/vars.less @@ -0,0 +1,24 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-loading() { + --ti-mobile-loading-bg-color-primary: rgba(0, 0, 0, 0.9); + --ti-mobile-loading-text-color-primary: #fff; + --ti-mobile-loading-height-primary: 140px; + --ti-mobile-loading-width-primary: 140px; + --ti-mobile-loading-line-height-primary: 55px; + --ti-mobile-loading-dot-height-primary: 40px; + --ti-mobile-loading-border-radius-primary: 16px; + --ti-mobile-loading-dot-width-primary: 3px; + --ti-mobile-loading-dot-width-simple: 2px; + --ti-mobile-loading-text-color-simple: #999; +} diff --git a/packages/theme-mobile/src/mini-picker/index.js b/packages/theme-mobile/src/mini-picker/index.js new file mode 100644 index 000000000..b9ee77c7f --- /dev/null +++ b/packages/theme-mobile/src/mini-picker/index.js @@ -0,0 +1,13 @@ +export default { + 'tiny-mobile-mini-picker-mask-background': 'rgba(0, 0, 0, 0.6)', + 'tiny-mobile-mini-picker-content-bgcolor': '#ddd', + 'tiny-mobile-mini-picker-toolbar-height': '44px', + 'tiny-mobile-mini-picker-toolbar-bgcolor': '#fff', + 'tiny-mobile-mini-picker-toolbar-font-size': '14px', + 'tiny-mobile-mini-picker-toolbar-border-color': '#ddd', + 'tiny-mobile-mini-picker-toolbar-action-color': '#039be5', + 'tiny-mobile-mini-picker-toolbar-cancel-color': '#666', + 'tiny-mobile-mini-picker-toolbar-title-color': '#333', + 'tiny-mobile-mini-picker-toolbar-title-font-size': '17px', + 'tiny-mobile-mini-picker-columns-bgcolor': '#fff' +} diff --git a/packages/theme-mobile/src/mini-picker/index.less b/packages/theme-mobile/src/mini-picker/index.less new file mode 100644 index 000000000..1e3945577 --- /dev/null +++ b/packages/theme-mobile/src/mini-picker/index.less @@ -0,0 +1,89 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import '../mixins/hairline.less'; +@import './vars.less'; + +@mini-picker-prefix-cls: ~'@{css-prefix}mobile-mini-picker'; + +.@{mini-picker-prefix-cls} { + &__mask { + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + background: var(--ti-mobile-mini-picker-mask-background, rgba(0, 0, 0, 0.6)); + z-index: 1000; + } + + &__content { + position: fixed; + bottom: 0; + left: 0; + width: 100%; + background-color: var(--ti-mobile-mini-picker-content-bgcolor, #ddd); + transform: translate(0, 100%); + backface-visibility: hidden; + transition: transform 0.3s; + z-index: 5000; + + &.is-toggle { + transform: translate(0, 0); + } + } + + &__toolbar { + position: relative; + display: flex; + height: var(--ti-mobile-mini-picker-toolbar-height, 44px); + line-height: var(--ti-mobile-mini-picker-toolbar-height, 44px); + padding: 0 17px; + background-color: var(--ti-mobile-mini-picker-toolbar-bgcolor, #fff); + font-size: var(--ti-mobile-mini-picker-toolbar-font-size, 14px); + text-align: center; + .hairline( + 'bottom', + var(--ti-mobile-mini-picker-toolbar-border-color, #ddd) + ); + + .picker_action { + display: block; + flex: 1; + color: var(--ti-mobile-mini-picker-toolbar-action-color, #039be5); + } + + .picker_cancel { + color: var(--ti-mobile-mini-picker-toolbar-cancel-color, #666); + text-align: left; + } + + .picker_title { + color: var(--ti-mobile-mini-picker-toolbar-title-color, #333); + font-size: var(--ti-mobile-mini-picker-toolbar-title-font-size, 17px); + font-family: 'PingFangSC-Regular'; + } + + .picker_confirm { + text-align: right; + } + } + + &__columns { + position: relative; + display: flex; + height: 238px; + background-color: var(--ti-mobile-mini-picker-columns-bgcolor, #fff); + overflow: hidden; + } +} diff --git a/packages/theme-mobile/src/mini-picker/vars.less b/packages/theme-mobile/src/mini-picker/vars.less new file mode 100644 index 000000000..3e2e781eb --- /dev/null +++ b/packages/theme-mobile/src/mini-picker/vars.less @@ -0,0 +1,13 @@ +:root { + --ti-mobile-mini-picker-mask-background: rgba(0, 0, 0, 0.6); + --ti-mobile-mini-picker-content-bgcolor: #ddd; + --ti-mobile-mini-picker-toolbar-height: 44px; + --ti-mobile-mini-picker-toolbar-bgcolor: #fff; + --ti-mobile-mini-picker-toolbar-font-size: 14px; + --ti-mobile-mini-picker-toolbar-border-color: #ddd; + --ti-mobile-mini-picker-toolbar-action-color: #039be5; + --ti-mobile-mini-picker-toolbar-cancel-color: #666; + --ti-mobile-mini-picker-toolbar-title-color: #333; + --ti-mobile-mini-picker-toolbar-title-font-size: 17px; + --ti-mobile-mini-picker-columns-bgcolor: #fff; +} diff --git a/packages/theme-mobile/src/mixins/alert.less b/packages/theme-mobile/src/mixins/alert.less new file mode 100644 index 000000000..f87c7b2b6 --- /dev/null +++ b/packages/theme-mobile/src/mixins/alert.less @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@mobile-prefix-cls: ~'@{css-prefix}mobile'; + +.alert-variant(@icon-color; @link-color; @bgcolor) { + background: @bgcolor; + + hr { + border-top-color: @link-color; + } + + .@{mobile-prefix-cls}-alert__icon { + fill: @icon-color; + } +} diff --git a/packages/theme-mobile/src/mixins/button-group.less b/packages/theme-mobile/src/mixins/button-group.less new file mode 100644 index 000000000..72e194ec1 --- /dev/null +++ b/packages/theme-mobile/src/mixins/button-group.less @@ -0,0 +1,26 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.button-group-type(@color) { + &:first-child { + border-right-color: @color; + } + + &:last-child { + border-left-color: @color; + } + + &:not(:first-child):not(:last-child) { + border-left-color: @color; + border-right-color: @color; + } +} diff --git a/packages/theme-mobile/src/mixins/button.less b/packages/theme-mobile/src/mixins/button.less new file mode 100644 index 000000000..5fc2850ac --- /dev/null +++ b/packages/theme-mobile/src/mixins/button.less @@ -0,0 +1,97 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.button-color(@color, @border-color, @background-color) { + color: @color; + border-color: @border-color; + background-color: @background-color; +} + +.button-text(@color, @hover-color, @active-color, @disabled-color) { + color: @color; + border-color: transparent; + background-color: transparent; + + &:hover { + color: @hover-color; + border-color: transparent; + background-color: transparent; + } + + &:focus, + &:active, + &.is-active { + color: @active-color; + border-color: transparent; + background-color: transparent; + + &::before { + opacity: 0; + } + } + + &.is-disabled, + &.is-disabled:active, + &.is-disabled:focus, + &.is-disabled:hover { + color: @disabled-color; + border-color: transparent; + background-color: transparent; + } +} + +.button-type(@color, @normal-color) { + color: @color; + border-color: @normal-color; + background-color: @normal-color; + + .is-icon { + fill: @color; + } +} + +.button-size(@height, @font-size) { + height: @height; + line-height: @height; + font-size: @font-size; + + .is-icon, + &.is-loading svg { + font-size: @font-size; + } +} + +.button-plain(@color) { + color: @color; + border-color: @color; + background-color: transparent; + + .is-icon, + &.is-loading svg { + fill: @color; + } + + &.is-disabled { + &, + &:active, + &.is-active { + color: #ccc; + border-color: #ddd; + background-color: transparent; + } + + .is-icon, + &.is-loading svg { + fill: #ccc; + } + } +} diff --git a/packages/theme-mobile/src/mixins/calendar.less b/packages/theme-mobile/src/mixins/calendar.less new file mode 100644 index 000000000..6caa797c8 --- /dev/null +++ b/packages/theme-mobile/src/mixins/calendar.less @@ -0,0 +1,24 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.calendar-header(@color, @background) { + position: relative; + background: @background; + color: @color; + text-align: center; + font-weight: 400; + line-height: 190%; + + a { + color: @color; + } +} diff --git a/packages/theme-mobile/src/mixins/checkbox.less b/packages/theme-mobile/src/mixins/checkbox.less new file mode 100644 index 000000000..711e3214c --- /dev/null +++ b/packages/theme-mobile/src/mixins/checkbox.less @@ -0,0 +1,46 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@checkbox-prefix-cls: ~'@{css-prefix}mobile-checkbox'; + +.checkbox-input-disabled(@color, @bgcolor, @border-color) { + .@{checkbox-prefix-cls}__inner { + background-color: @bgcolor; + border-color: @border-color; + cursor: not-allowed; + } + + &.is-checked { + .@{checkbox-prefix-cls}__inner, + .@{checkbox-prefix-cls}__inner:hover { + background-color: @border-color; + } + } + + &.is-indeterminate { + .@{checkbox-prefix-cls}__inner, + .@{checkbox-prefix-cls}__inner:hover { + background-color: @bgcolor; + + &::before { + background-color: @border-color; + } + } + } + + .@{checkbox-prefix-cls}__label { + color: @color; + cursor: not-allowed; + } +} diff --git a/packages/theme-mobile/src/mixins/common.less b/packages/theme-mobile/src/mixins/common.less new file mode 100644 index 000000000..eb2e7a8d6 --- /dev/null +++ b/packages/theme-mobile/src/mixins/common.less @@ -0,0 +1,847 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.clearfix() { + &:after { + clear: both; + } + + + &:after, + &:before{ + content: ''; + display: table; + } + + +} + +.center-block() { + margin-left: auto; + margin-right: auto; + display: block; +} + +.tab-focus() { + outline-offset: -2px; + outline: thin dotted; + outline: 5px auto -webkit-focus-ring-color; +} + +.square(@size) { + .size(@size; @size); +} + +.size(@width; @height) { + width: @width; + height: @height; +} + + +.placeholder(@color: #999) { + &:-moz-placeholder { + color: @color; + } + + &::-moz-placeholder { + color: @color; + opacity: 1; + } + + &:-ms-input-placeholder { + color: @color; + } + + &::-webkit-input-placeholder { + color: @color; + } + + &::-ms-input-placeholder { + color: @color; + } + + &::placeholder { + color: @color; + } +} + +.text-overflow() { + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; +} + +.hide-text() { + font: ~'0/0' a; + border: 0; + background-color: transparent; + text-shadow: none; + color: transparent; +} + +.text-hide() { + .hide-text(); +} + +.border-top-radius(@radius) { + border-top-left-radius: @radius; + border-top-right-radius: @radius; +} + +.border-right-radius(@radius) { + border-top-right-radius: @radius; + border-bottom-right-radius: @radius; +} + +.border-bottom-radius(@radius) { + border-bottom-left-radius: @radius; + border-bottom-right-radius: @radius; +} + +.border-left-radius(@radius) { + border-top-left-radius: @radius; + border-bottom-left-radius: @radius; +} + +.box-shadow(@shadow) { + -webkit-box-shadow: @shadow; + box-shadow: @shadow; +} + +.transition(@transition) { + transition: @transition; + -webkit-transition: @transition; + +} + +.transition-property(@transition-property) { + transition-property: @transition-property; + -webkit-transition-property: @transition-property; + +} + +.transition-delay(@transition-delay) { + transition-delay: @transition-delay; + -webkit-transition-delay: @transition-delay; +} + +.transition-duration(@transition-duration) { + transition-duration: @transition-duration; + -webkit-transition-duration: @transition-duration; + +} + +.transition-transform(@transition) { + transition: transform @transition; + -o-transition: -o-transform @transition; + -moz-transition: -moz-transform @transition; + -webkit-transition: -webkit-transform @transition; +} + + +.rotate(@degrees) { + transform: rotate(@degrees); + -ms-transform: rotate(@degrees); + -webkit-transform: rotate(@degrees); +} + +.scale(@ratio) { + transform: scale(@ratio); + -ms-transform: scale(@ratio); + -webkit-transform: scale(@ratio); +} + +.translate(@x; @y) { + transform: translate(@x, @y); + -ms-transform: translate(@x, @y); + -webkit-transform: translate(@x, @y); +} + +.skew(@x; @y) { + -webkit-transform: skew(@x, @y); + -ms-transform: skewX(@x) skewY(@y); + transform: skew(@x, @y); +} + +.translate3d(@x; @y; @z) { + transform: translate3d(@x, @y, @z); + -webkit-transform: translate3d(@x, @y, @z); +} + +.rotateX(@degrees) { + transform: rotateX(@degrees); + -ms-transform: rotateX(@degrees); + -webkit-transform: rotateX(@degrees); +} + +.rotateY(@degrees) { + transform: rotateY(@degrees); + -ms-transform: rotateY(@degrees); + -webkit-transform: rotateY(@degrees); +} + +.perspective(@perspective) { + perspective: @perspective; + -moz-perspective: @perspective; + -webkit-perspective: @perspective; +} + +.perspective-origin(@perspective) { + perspective-origin: @perspective; + -moz-perspective-origin: @perspective; + -webkit-perspective-origin: @perspective; +} + +.transform-origin(@origin) { + -webkit-transform-origin: @origin; + -moz-transform-origin: @origin; + transform-origin: @origin; +} + +.animation(@animation) { + -webkit-animation: @animation; + animation: @animation; +} + +.backface-visibility(@visibility) { + -webkit-backface-visibility: @visibility; + -moz-backface-visibility: @visibility; + backface-visibility: @visibility; +} + +.box-sizing(@boxmodel) { + -webkit-box-sizing: @boxmodel; + -moz-box-sizing: @boxmodel; + box-sizing: @boxmodel; +} + +.user-select(@select) { + user-select: @select; + -moz-user-select: @select; + -webkit-user-select: @select; + -o-user-select: @select; + -ms-user-select: @select; +} + +.resizable(@direction) { + resize: @direction; + overflow: auto; +} + + +.content-columns(@column-count; @column-gap: @grid-gutter-width) { + column-gap: @column-gap; + column-count: @column-count; + -webkit-column-count: @column-count; + -moz-column-count: @column-count; + -moz-column-gap: @column-gap; + -webkit-column-gap: @column-gap; + +} + +.hyphens(@mode: auto) { + hyphens: @mode; + -o-hyphens: @mode; + -ms-hyphens: @mode; + -moz-hyphens: @mode; + -webkit-hyphens: @mode; + word-wrap: break-word; +} + + +.opacity(@opacity) { + @opacity-ie: (@opacity * 100); + opacity: @opacity; + filter: ~'alpha(opacity=@{opacity-ie})'; +} + + +#gradient { + + .horizontal(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) { + background-image: -webkit-linear-gradient( + left, + color-stop(@start-color @start-percent), + color-stop(@end-color @end-percent) + ); + background-image: linear-gradient( + to right, + @start-color @start-percent, + @end-color @end-percent + ); + background-repeat: repeat-x; + filter: e( + %( + "progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)", + argb(@start-color), + argb(@end-color) + ) + ); + } + + .vertical(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) { + background-image: -webkit-linear-gradient( + top, + @start-color @start-percent, + @end-color @end-percent + ); + background-image: linear-gradient( + to bottom, + @start-color @start-percent, + @end-color @end-percent + ); + background-repeat: repeat-x; + filter: e( + %( + "progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)", + argb(@start-color), + argb(@end-color) + ) + ); + } + + .directional(@start-color: #555; @end-color: #333; @deg: 45deg) { + background-repeat: repeat-x; + background-image: -webkit-linear-gradient( + @deg, + @start-color, + @end-color + ); + background-image: linear-gradient( + @deg, + @start-color, + @end-color + ); + } + + .horizontal-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) { + background-image: -webkit-linear-gradient( + left, + @start-color, + @mid-color @color-stop, + @end-color + ); + background-image: linear-gradient( + to right, + @start-color, + @mid-color @color-stop, + @end-color + ); + background-repeat: no-repeat; + filter: e( + %( + "progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)", + argb(@start-color), + argb(@end-color) + ) + ); + } + + .vertical-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) { + background-image: -webkit-linear-gradient( + @start-color, + @mid-color @color-stop, + @end-color + ); + background-image: linear-gradient( + @start-color, + @mid-color @color-stop, + @end-color + ); + background-repeat: no-repeat; + filter: e( + %( + "progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)", + argb(@start-color), + argb(@end-color) + ) + ); + } + + .radial(@inner-color: #555; @outer-color: #333) { + background-image: -webkit-radial-gradient( + circle, + @inner-color, + @outer-color + ); + background-image: radial-gradient(circle, @inner-color, @outer-color); + background-repeat: no-repeat; + } + + .striped(@color: rgba(255, 255, 255, 0.15); @angle: 45deg) { + background-image: -webkit-linear-gradient( + @angle, + @color 25%, + transparent 25%, + transparent 50%, + @color 50%, + @color 75%, + transparent 75%, + transparent + ); + background-image: linear-gradient( + @angle, + @color 25%, + transparent 25%, + transparent 50%, + @color 50%, + @color 75%, + transparent 75%, + transparent + ); + } +} + +.reset-filter() { + filter: e(%('progid:DXImageTransform.Microsoft.gradient(enabled = false)')); +} + + +.img-retina(@file-1x; @file-2x; @width-1x; @height-1x) { + background-image: url('@{file-1x}'); + + @media only screen and (-webkit-min-device-pixel-ratio: 2), + only screen and (min--moz-device-pixel-ratio: 2), + only screen and (-o-min-device-pixel-ratio: 2/1), + only screen and (min-device-pixel-ratio: 2), + only screen and (min-resolution: 192dpi), + only screen and (min-resolution: 2dppx) { + background-image: url('@{file-2x}'); + background-size: @width-1x @height-1x; + } +} + +.img-responsive(@display: block; ) { + display: @display; + max-width: 100%; + height: auto; +} + +.nav-divider(@color: #e5e5e5) { + height: 1px; + margin: ((@line-height-computed / 2) - 1) 0; + overflow: hidden; + background-color: @color; +} + + +.panel-variant( @heading-text-color; @heading-bg-color; @heading-border;@border;) { + border-color: @border; + + & > .panel-heading { + border-color: @heading-border; + background-color: @heading-bg-color; + color: @heading-text-color; + + + .panel-collapse .panel-body { + border-top-color: @border; + } + } + + & > .panel-footer { + + .panel-collapse .panel-body { + border-bottom-color: @border; + } + } +} + +.table-row-variant(@state; @background) { + + .table { + > tfoot, + > tbody, + > thead { + > .@{state} > th, + > .@{state} > td, + > tr > .@{state} { + background-color: @background; + } + } + } + + .table-hover > tbody { + > .@{state}:hover > th , + > .@{state}:hover > td, + > tr > .@{state}:hover { + background-color: darken(@background, 5%); + } + } +} + + +.pagination-size(@padding-vertical; @padding-horizontal; @font-size; @border-radius) { + > li { + > span, + > a { + font-size: @font-size; + padding: @padding-vertical @padding-horizontal; + } + + &:first-child { + > span, + > a { + .border-left-radius(@border-radius); + } + } + + &:last-child { + > span, + > a { + .border-right-radius(@border-radius); + } + } + } +} + + +.label-variant(@color) { + background-color: @color; + + &[href] { + &:focus, + &:hover { + background-color: darken(@color, 10%); + } + } +} + + +.navbar-vertical-align(@element-height) { + margin-top: ((@navbar-height - @element-height) / 2); + margin-bottom: ((@navbar-height - @element-height) / 2); +} + +// Progress bars +.progress-bar-variant(@color) { + background-color: @color; + + .progress-striped & { + #gradient>.striped(); + } +} + +.responsive-visibility() { + display: block !important; + + table& { + display: table; + } + + tr& { + display: table-row !important; + } + + th&, + td& { + display: table-cell !important; + } +} + +.responsive-invisibility() { + &, + tr&, + th&, + td& { + display: none !important; + } +} + +.container-fixed() { + margin-left: auto; + margin-right: auto; + padding-right: (@grid-gutter-width / 2); + padding-left: (@grid-gutter-width / 2); + .clearfix(); +} + +.make-row(@gutter: @grid-gutter-width) { + margin-left: (@gutter / -2); + margin-right: (@gutter / -2); + .clearfix(); +} + +.make-xs-column(@columns; @gutter: @grid-gutter-width) { + float: left; + position: relative; + min-height: 1px; + width: percentage((@columns / @grid-columns)); + padding-right: (@gutter / 2); + padding-left: (@gutter / 2); + box-sizing: border-box; +} + +.make-sm-column(@columns; @gutter: @grid-gutter-width) { + position: relative; + min-height: 1px; + padding-left: (@gutter / 2); + padding-right: (@gutter / 2); + box-sizing: border-box; + + @media (min-width: @screen-sm-min) { + float: left; + width: percentage((@columns / @grid-columns)); + } +} + +.make-sm-column-push(@columns) { + @media (min-width: @screen-sm-min) { + left: percentage((@columns / @grid-columns)); + } +} + +.make-sm-column-offset(@columns) { + @media (min-width: @screen-sm-min) { + margin-left: percentage((@columns / @grid-columns)); + } +} + +.make-sm-column-pull(@columns) { + @media (min-width: @screen-sm-min) { + right: percentage((@columns / @grid-columns)); + } +} + + +.make-md-column(@columns; @gutter: @grid-gutter-width) { + position: relative; + min-height: 1px; + padding-left: (@gutter / 2); + padding-right: (@gutter / 2); + box-sizing: border-box; + + @media (min-width: @screen-md-min) { + width: percentage((@columns / @grid-columns)); + float: left; + } +} + +.make-md-column-push(@columns) { + @media (min-width: @screen-md) { + left: percentage((@columns / @grid-columns)); + } +} + +.make-md-column-offset(@columns) { + @media (min-width: @screen-md-min) { + margin-left: percentage((@columns / @grid-columns)); + } +} + +.make-md-column-pull(@columns) { + @media (min-width: @screen-md-min) { + right: percentage((@columns / @grid-columns)); + } +} + +.make-lg-column(@columns; @gutter: @grid-gutter-width) { + position: relative; + min-height: 1px; + padding-left: (@gutter / 2); + padding-right: (@gutter / 2); + box-sizing: border-box; + + @media (min-width: @screen-lg-min) { + width: percentage((@columns / @grid-columns)); + float: left; + } +} + +.make-lg-column-pull(@columns) { + @media (min-width: @screen-lg-min) { + right: percentage((@columns / @grid-columns)); + } +} + +.make-lg-column-push(@columns) { + @media (min-width: @screen-lg-min) { + left: percentage((@columns / @grid-columns)); + } +} + +.make-lg-column-offset(@columns) { + @media (min-width: @screen-lg-min) { + margin-left: percentage((@columns / @grid-columns)); + } +} + +.make-xl-column(@columns; @gutter: @grid-gutter-width) { + position: relative; + min-height: 1px; + padding-left: (@gutter / 2); + padding-right: (@gutter / 2); + box-sizing: border-box; + + @media (min-width: @screen-xl-min) { + float: left; + width: percentage((@columns / @grid-columns)); + } +} + +.make-xl-column-offset(@columns) { + @media (min-width: @screen-xl-min) { + margin-left: percentage((@columns / @grid-columns)); + } +} + +.make-xl-column-push(@columns) { + @media (min-width: @screen-xl-min) { + left: percentage((@columns / @grid-columns)); + } +} + +.make-xl-column-pull(@columns) { + @media (min-width: @screen-xl-min) { + right: percentage((@columns / @grid-columns)); + } +} + +.make-grid-columns() { + + .col(@index) when (@index =1) { + + @item: ~'.col-xs-@{index}, .col-sm-@{index}, .col-md-@{index}, .col-lg-@{index}, .col-xl-@{index}'; + .col(@index + 1, @item); + } + + .col(@index, @list) when (@index =< @grid-columns) { + + @item: ~'.col-xs-@{index}, .col-sm-@{index}, .col-md-@{index}, .col-lg-@{index}, .col-xl-@{index}'; + .col(@index + 1, ~'@{list}, @{item}'); + } + + .col(@index, @list) when (@index > @grid-columns) { + + @{list} { + position: relative; + min-height: 1px; + padding-left: (@grid-gutter-width / 2); + padding-right: (@grid-gutter-width / 2); + box-sizing: border-box; + } + } + + .col(1); +} + +.make-grid-columns-float(@class) { + .col(@index) when (@index =1) { + + @item: ~'.col-@{class}-@{index}'; + .col(@index + 1, @item); + } + + .col(@index, @list) when (@index =< @grid-columns) { + @item: ~'.col-@{class}-@{index}'; + .col(@index + 1, ~'@{list}, @{item}'); + } + + .col(@index, @list) when (@index > @grid-columns) { + @{list} { + float: left; + } + } + + .col(1); +} + +.calc-grid(@index, @class, @type) when (@type =width) and (@index > 0) { + .calc-grid(@index, @class, @type) when (@type =push) { + .col-@{class}-push-@{index} { + left: percentage((@index / @grid-columns)); + } + } + + .col-@{class}-@{index} { + width: percentage((@index / @grid-columns)); + } +} + +.calc-grid(@index, @class, @type) when (@type =offset) { + .col-@{class}-offset-@{index} { + margin-left: percentage((@index / @grid-columns)); + } +} + +.calc-grid(@index, @class, @type) when (@type =pull) { + .col-@{class}-pull-@{index} { + right: percentage((@index / @grid-columns)); + } +} + +.make-grid(@index, @class, @type) when (@index >=0) { + .make-grid(@index - 1, @class, @type); + .calc-grid(@index, @class, @type); +} + + +.form-control-validation(@text-color: #555; @border-color: #ccc; @background-color: #f5f5f5) { + + .radio-inline, + .checkbox, + .radio, + .control-label, + .checkbox-inline, + .help-block { + color: @text-color; + } + + + .form-control { + border-color: @border-color; + .box-shadow( + inset 0 1px 1px rgba(0, 0, 0, 0.075) + ); + + &:focus { + border-color: darken(@border-color, 10%); + @shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), + 0 0 6px lighten(@border-color, 20%); + .box-shadow(@shadow); + } + } + + + .input-group-addon { + color: @text-color; + border-color: @border-color; + background-color: @background-color; + } +} + + +.form-control-focus(@color: @input-border-focus) { + @color-rgba: rgba(red(@color), green(@color), blue(@color), 0.6); + + &:focus { + border-color: @color; + outline: 0; + .box-shadow(~'inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px @{color-rgba}'); + } +} + + +.input-size(@input-height; @padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) { + border-radius: @border-radius; + line-height: @line-height; + font-size: @font-size; + padding: @padding-vertical @padding-horizontal; + height: @input-height; + + textarea& { + height: auto; + } + + select& { + line-height: @input-height; + height: @input-height; + } +} diff --git a/packages/theme-mobile/src/mixins/grid.less b/packages/theme-mobile/src/mixins/grid.less new file mode 100644 index 000000000..924ac50ba --- /dev/null +++ b/packages/theme-mobile/src/mixins/grid.less @@ -0,0 +1,96 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import './variable.less'; +@import './common.less'; +@import '../custom.less'; + + +.container { + .container-fixed(); + @media (min-width: @screen-md) { + width: @container-md; + } + + @media (min-width: @screen-sm) { + width: @container-sm; + } + + + @media (min-width: @screen-xl-min) { + width: @container-xl; + } + + @media (min-width: @screen-lg-min) { + width: @container-lg; + } +} + +// mobile first defaults +.row { + .make-row(); + + h3 { + margin-left: (@grid-gutter-width / 2); + } +} + +.@{css-prefix}-filter .row { + overflow: hidden; + + .title { + margin-left: 10px; + } +} + + +.make-grid-columns-float(xs); +.make-grid-columns(); +.make-grid(@grid-columns, xs, pull); +.make-grid(@grid-columns, xs, width); +.make-grid(@grid-columns, xs, offset); +.make-grid(@grid-columns, xs, push); + +@media (min-width: @screen-sm-min) { + .make-grid(@grid-columns, sm, pull); + .make-grid-columns-float(sm); + .make-grid(@grid-columns, sm, width); + .make-grid(@grid-columns, sm, offset); + .make-grid(@grid-columns, sm, push); +} + + +@media (min-width: @screen-md-min) { + .make-grid(@grid-columns, md, width); + .make-grid-columns-float(md); + .make-grid(@grid-columns, md, push); + .make-grid(@grid-columns, md, offset); + .make-grid(@grid-columns, md, pull); +} + + +@media (min-width: @screen-lg-min) { + .make-grid-columns-float(lg); + .make-grid(@grid-columns, lg, pull); + .make-grid(@grid-columns, lg, width); + .make-grid(@grid-columns, lg, offset); + .make-grid(@grid-columns, lg, push); +} + + +@media (min-width: @screen-xl-min) { + .make-grid(@grid-columns, xl, push); + .make-grid(@grid-columns, xl, pull); + .make-grid-columns-float(xl); + .make-grid(@grid-columns, xl, offset); + .make-grid(@grid-columns, xl, width); +} diff --git a/packages/theme-mobile/src/mixins/hairline.less b/packages/theme-mobile/src/mixins/hairline.less new file mode 100644 index 000000000..b158e5f4a --- /dev/null +++ b/packages/theme-mobile/src/mixins/hairline.less @@ -0,0 +1,188 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.hairline-common(@color, @top, @right, @bottom, @left) { + content: ''; + z-index: 1; + display: block; + background-color: @color; + position: absolute; + right: @right; + left: @left; + bottom: @bottom; + top: @top; +} + +.hairline(@direction, @color: @border-color-base, @position: relative) + when + (@direction ='top') { + border-top: 1px solid @color; + + html:not([data-scale]) & { + @media (min-resolution: 2dppx) { + border-top: none; + position: @position; + + &::before { + .hairline-common(@color, 0, auto, auto, 0); + height: 1px; + width: 100%; + transform: scaleY(0.5); + transform-origin: 50% 50%; + + @media (min-resolution: 3dppx) { + transform: scaleY(0.33); + } + } + } + } +} + +.hairline(@direction, @color: @border-color-base) when (@direction ='right') { + border-right: 1px solid @color; + position: relative; + + html:not([data-scale]) & { + @media (min-resolution: 2dppx) { + border-right: none; + position: relative; + + &::after { + .hairline-common(@color, 0, 0, auto, auto); + height: 100%; + width: 1px; + background: @color; + transform: scaleX(0.5); + transform-origin: 100% 50%; + + @media (min-resolution: 3dppx) { + transform: scaleX(0.33); + } + } + } + } +} + +.hairline(@direction, @color: @border-color-base) when (@direction ='bottom') { + border-bottom: 1px solid @color; + + html:not([data-scale]) & { + @media (min-resolution: 2dppx) { + border-bottom: none; + position: relative; + + &::after { + .hairline-common(@color, auto, auto, 0, 0); + height: 1px; + width: 100%; + transform: scaleY(0.5); + transform-origin: 50% 100%; + + @media (min-resolution: 3dppx) { + transform: scaleY(0.33); + } + } + } + } +} + +.hairline(@direction, @color: @border-color-base) when (@direction ='left') { + border-left: 1px solid @color; + + html:not([data-scale]) & { + @media (min-resolution: 2dppx) { + border-left: none; + position: relative; + + &::before { + .hairline-common(@color, 0, auto, auto, 0); + height: 100%; + width: 1px; + transform: scaleX(0.5); + transform-origin: 100% 50%; + + @media (min-resolution: 3dppx) { + transform: scaleX(0.33); + } + } + } + } +} + +.hairline(@direction, @color: @border-color-base, @radius: 0) + when + (@direction ='all') { + border-radius: @radius; + border: 1px solid @color; + + html:not([data-scale]) & { + @media (min-resolution: 2dppx) { + border: none; + position: relative; + + &::before { + position: absolute; + top: 0; + left: 0; + content: ''; + height: 200%; + width: 200%; + border-radius: @radius * 2; + border: 1px solid @color; + transform: scale(0.5); + transform-origin: 0 0; + pointer-events: none; + box-sizing: border-box; + } + } + } +} + +.hairline-remove(@position) when (@position ='left') { + border-left: 0; + + &:before { + display: none !important; + } +} + +.hairline-remove(@position) when (@position ='top') { + border-top: 0; + + &:before { + display: none !important; + } +} + +.hairline-remove(@position) when (@position ='all') { + border: 0; + + &:before { + display: none !important; + } +} + +.hairline-remove(@position) when (@position ='bottom') { + &:after { + display: none !important; + } + + border-bottom: 0; +} + +.hairline-remove(@position) when (@position ='right') { + border-right: 0; + + &:after { + display: none !important; + } +} diff --git a/packages/theme-mobile/src/mixins/input.less b/packages/theme-mobile/src/mixins/input.less new file mode 100644 index 000000000..ebbdf8d60 --- /dev/null +++ b/packages/theme-mobile/src/mixins/input.less @@ -0,0 +1,71 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@mobile-prefix-cls: ~'@{css-prefix}mobile'; + +.input-readonly(@color) { + &.readonly, + &[readonly] { + cursor: not-allowed; + box-shadow: none; + + &:focus, + &:active, + &.active, + &[active], + &:hover { + border-color: @color; + } + } +} + +.input-variant(@color-normal; @color-hover; @color-active; @color-disabled; @color-hover-shadow; @color-active-shadow) { + border-color: @color-normal; + .input-readonly(@color-normal); + + &:hover, + &:focus, + &:active, + &.active { + border-color: @color-active; + box-shadow: var(--ti-input-normal-active-shadow-size, 0 0 0) @color-active-shadow; + } + + &:hover { + border-color: @color-hover; + box-shadow: var(--ti-input-normal-active-shadow-size, 0 0 0) @color-hover-shadow; + } + + &.disabled, + &[disabled] { + &, + &:hover, + &:focus, + &:active, + &.active { + border-color: @color-disabled; + } + } +} + +.input-size(@height) { + .@{mobile-prefix-cls}-input__inner { + height: @height; + line-height: @height; + } + + .@{mobile-prefix-cls}-input__suffix { + line-height: calc(@height - 2px); + } +} diff --git a/packages/theme-mobile/src/mixins/link.less b/packages/theme-mobile/src/mixins/link.less new file mode 100644 index 000000000..9a7d2787a --- /dev/null +++ b/packages/theme-mobile/src/mixins/link.less @@ -0,0 +1,32 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.link-type(@color, @border-color, @hover-color, @disabled-color) { + color: @color; + fill: @color; + + &.is-underline:hover:after, + &:after { + border-color: @border-color; + } + + &:hover { + color: @hover-color; + fill: @hover-color; + text-decoration: none; + } + + &.is-disabled { + color: @disabled-color; + fill: @disabled-color; + } +} diff --git a/packages/theme-mobile/src/mixins/mixin.less b/packages/theme-mobile/src/mixins/mixin.less new file mode 100644 index 000000000..8139b21a0 --- /dev/null +++ b/packages/theme-mobile/src/mixins/mixin.less @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import 'common'; +@import 'button'; +@import 'input'; +@import 'calendar'; +@import 'tip'; +@import 'table'; +@import 'alert'; +@import 'tag'; diff --git a/packages/theme-mobile/src/mixins/progress.less b/packages/theme-mobile/src/mixins/progress.less new file mode 100644 index 000000000..11c8d8c27 --- /dev/null +++ b/packages/theme-mobile/src/mixins/progress.less @@ -0,0 +1,25 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@progress-prefix-cls: ~'@{css-prefix}progress'; + +.progress-status(@color) { + .@{progress-prefix-cls}-bar__inner { + background-color: @color; + } + + .@{progress-prefix-cls}__text svg { + fill: @color; + } +} diff --git a/packages/theme-mobile/src/mixins/tip.less b/packages/theme-mobile/src/mixins/tip.less new file mode 100644 index 000000000..46ae4e64f --- /dev/null +++ b/packages/theme-mobile/src/mixins/tip.less @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.tip-arrow (@tips-arrow-left; @tips-arrow-top; @tips-arrow-margin-top) { + content: ''; + left: @tips-arrow-left; + top: @tips-arrow-top; + margin-top: @tips-arrow-margin-top; +} + +.tip-make-arrow (@border-width; @arrow-color) { + position: absolute; + width: 0; + height: 0; + border-style: solid; + border-width: @border-width; + border-color: @arrow-color; +} diff --git a/packages/theme-mobile/src/mixins/tooltip.less b/packages/theme-mobile/src/mixins/tooltip.less new file mode 100644 index 000000000..da5386546 --- /dev/null +++ b/packages/theme-mobile/src/mixins/tooltip.less @@ -0,0 +1,86 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.tooltip-type (@color, @bgcolor, @border-color) { + background: @bgcolor; + color: @color; + + &[x-placement^='top'] .popper__arrow { + border-top-color: @border-color; + + &::after { + border-top-color: @border-color; + } + } + + &[x-placement^='bottom'] .popper__arrow { + border-bottom-color: @border-color; + + &::after { + border-bottom-color: @border-color; + } + } + + &[x-placement^='left'] .popper__arrow { + border-left-color: @border-color; + + &::after { + border-left-color: @border-color; + } + } + + &[x-placement^='right'] .popper__arrow { + border-right-color: @border-color; + + &::after { + border-right-color: @border-color; + } + } +} + +.tooltip-light (@color, @bgcolor, @border-color) { + background: @bgcolor; + color: @color; + border: 1px solid @border-color; + + &[x-placement^='top'] .popper__arrow { + border-top-color: @border-color; + + &::after { + border-top-color: @bgcolor; + } + } + + &[x-placement^='bottom'] .popper__arrow { + border-bottom-color: @border-color; + + &::after { + border-bottom-color: @bgcolor; + } + } + + &[x-placement^='left'] .popper__arrow { + border-left-color: @border-color; + + &::after { + border-left-color: @bgcolor; + } + } + + &[x-placement^='right'] .popper__arrow { + border-right-color: @border-color; + + &::after { + border-right-color: @bgcolor; + } + } +} diff --git a/packages/theme-mobile/src/mixins/transfer.less b/packages/theme-mobile/src/mixins/transfer.less new file mode 100644 index 000000000..721005b3d --- /dev/null +++ b/packages/theme-mobile/src/mixins/transfer.less @@ -0,0 +1,35 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.transfer-scrollbar(@size) { + &::-webkit-scrollbar { + width: @size; + height: @size; + } + + &::-webkit-scrollbar-track-piece { + background: #fafafa; + } + + &::-webkit-scrollbar-thumb { + background: #bfbfbf; + border-radius: calc(@size / 2); + } + + &::-webkit-scrollbar-thumb:hover { + background: #999999; + } + + &::-webkit-scrollbar-thumb:active { + background: #999999; + } +} diff --git a/packages/theme-mobile/src/mixins/variable.less b/packages/theme-mobile/src/mixins/variable.less new file mode 100644 index 000000000..c17b3c6b1 --- /dev/null +++ b/packages/theme-mobile/src/mixins/variable.less @@ -0,0 +1,42 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@screen-xs: 480px; +@screen-xs-min: @screen-xs; +@screen-xs-max: (@screen-xs-min - 1); +@screen-phone: @screen-xs; +@screen-sm: 768px; +@screen-sm-min: @screen-sm; +@screen-sm-max: (@screen-sm-min - 1); +@screen-tablet: @screen-sm; +@screen-md: 992px; +@screen-md-min: @screen-md; +@screen-md-max: (@screen-md-min - 1); +@screen-desktop: @screen-md; +@screen-lg: 1200px; +@screen-lg-min: @screen-lg; +@screen-lg-max: (@screen-lg-min - 1); +@screen-lg-desktop: @screen-lg; +@screen-xl: 1920px; +@screen-xl-min: @screen-xl; +@screen-xl-max: (@screen-xl-min - 1); +@screen-wide-desktop: @screen-xl; +@container-tablet: ((@screen-sm + @grid-gutter-width)); +@container-sm: @container-tablet; +@container-desktop: ((@screen-md + @grid-gutter-width)); +@container-md: @container-desktop; +@container-large-desktop: ((@screen-lg + @grid-gutter-width)); +@container-lg: @container-large-desktop; +@container-wide-desktop: ((@screen-xl + @grid-gutter-width)); +@container-xl: @container-wide-desktop; +@grid-columns: 12; +@grid-gutter-width: 20px; diff --git a/packages/theme-mobile/src/mixins/wizard.less b/packages/theme-mobile/src/mixins/wizard.less new file mode 100644 index 000000000..df9cb5f75 --- /dev/null +++ b/packages/theme-mobile/src/mixins/wizard.less @@ -0,0 +1,22 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.wizard-icon-color(@color, @bgcolor) { + color: @color; + background: @bgcolor; + border-color: @bgcolor; +} + +.wizard-line-color(@color) { + background: @color; + border-color: @color; +} diff --git a/packages/theme-mobile/src/modal/index.js b/packages/theme-mobile/src/modal/index.js new file mode 100644 index 000000000..14b515138 --- /dev/null +++ b/packages/theme-mobile/src/modal/index.js @@ -0,0 +1,27 @@ +/** + * Copyright (c 2022 - present TinyVue Authors. + * Copyright (c 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +export default { + 'tiny--mobile-modal-text-font-size': '14px', + 'tiny--mobile-modal-header-font-size': '16px', + 'tiny--mobile-modal-text-color': '#191919', + 'tiny--mobile-modal-alert-font-size': '22px', + 'tiny--mobile-modal-box-bg-color': '#fff', + 'tiny--mobile-modal-box-shadow': '0 8px 40px 0 rgba(0, 0, 0, 0.2)', + 'tiny--mobile-modal-close-btn-top': '13px', + 'tiny--mobile-modal-close-btn-scale': 'scale(1, 1)', + 'tiny--mobile-modal-close-btn-bg-color-hover': '#fff', + 'tiny--mobile-modal-btn-width': '112px', + 'tiny--mobile-modal-single-btn-width': '144px', + 'tiny--mobile-modal-btn-height': '36px', + 'tiny--mobile-modal-cancel-btn-bg-color': '#f5f5f5', +} diff --git a/packages/theme-mobile/src/modal/index.less b/packages/theme-mobile/src/modal/index.less new file mode 100644 index 000000000..39c48c7c7 --- /dev/null +++ b/packages/theme-mobile/src/modal/index.less @@ -0,0 +1,516 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + + +@modal-prefix-cls: ~'@{css-prefix}mobile-modal'; + +@button-default-prefix-cls: ~'@{css-prefix}mobile-button--default'; +@button-prefix-cls: ~'@{css-prefix}mobile-button'; +@button-default-prefix-cls: ~'@{css-prefix}mobile-button--default'; +@button-prefix-cls: ~'@{css-prefix}mobile-button'; + +.@{modal-prefix-cls}{ + .component-css-vars-modal(); +} + +.@{modal-prefix-cls} { + &__wrapper { + display: none; + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + font-size: var(--ti-mobile-modal-text-font-size); + color: var(--ti-mobile-modal-text-color); + transition: top 0.4s; + + &.active { + display: block; + } + + &.is__visible { + &.is__mask { + &:before { + background-color: rgba(0, 0, 0, 0.3); + } + } + + &.type__message { + .@{modal-prefix-cls}__box { + transform: translateY(0); + } + } + + &:not(.type__message) { + .@{modal-prefix-cls}__box:not(.is__drag) { + top: 15vh; + transition: top 0s ease-in, opacity 0.4s ease-in; + } + } + + .@{modal-prefix-cls}__box { + opacity: 1; + visibility: visible; + } + } + + &:not(.lock__view) { + pointer-events: none; + } + + &.lock__scroll { + overflow: hidden; + } + + &:not(.lock__scroll) { + overflow: auto; + } + + &:not(.type__message) { + .@{modal-prefix-cls}__text { + font-size: var(--ti-mobile-modal-text-font-size); + color: var(--ti-mobile-common-color-text-secondary); + line-height: 1.5; + } + } + + &.lock__view, + &.is__mask { + &:before { + content: ''; + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: -1; + pointer-events: auto; + } + } + + &.is__animat { + &.is__mask { + &:before { + transition: background-color, 0.2s, ease-in-out; + } + } + + &.type__message { + .@{modal-prefix-cls}__box { + &:not(.is__drag) { + transition: all, 0.2s, ease-out; + } + } + } + } + + &.size__small, + &.size__mini { + font-size: var(--ti-mobile-modal-text-font-size); + + .@{modal-prefix-cls}__box { + padding: 6px 0; + } + + .@{modal-prefix-cls}__body { + padding: 4px 14px 10px 14px; + } + + .@{modal-prefix-cls}__footer { + padding: 4px 14px 8px 14px; + } + + .@{modal-prefix-cls}__header { + font-size: var(--ti-mobile-modal-header-font-size); + padding: 6px 30px 8px 14px; + } + + .@{modal-prefix-cls}__zoom-btn, + .@{modal-prefix-cls}__close-btn { + font-size: var(--ti-mobile-modal-header-font-size); + top: 10px; + } + } + + &.type__message, + &.type__alert, + &.type__confirm { + .@{modal-prefix-cls}__body { + white-space: normal; + word-break: break-word; + } + } + + &.type__message { + text-align: center; + + .@{modal-prefix-cls}__box { + display: inline-block; + padding: 24px; + margin-top: 0; + width: auto; + box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1); + transform: translateY(-10%); + + .@{modal-prefix-cls}__body { + &:after { + content: ''; + display: block; + clear: both; + height: 0; + overflow: hidden; + visibility: hidden; + } + } + + .@{modal-prefix-cls}__content { + max-width: 800px; + float: left; + } + } + + .@{modal-prefix-cls}__status-wrapper { + font-size: var(--ti-mobile-modal-small-btn-font-size); + padding-right: 10px; + } + } + + &.type__modal, + &.type__alert, + &.type__confirm { + .@{modal-prefix-cls}__box { + display: flex; + flex-direction: column; + position: absolute; + left: 50%; + top: 0; + box-shadow: var(--ti-mobile-modal-box-shadow); + border: 1px solid var(--ti-mobile-modal-border-color); + + .@{modal-prefix-cls}__header { + cursor: move; + } + } + } + + &.type__modal { + .@{modal-prefix-cls}__body { + overflow: auto; + + .@{modal-prefix-cls}__content { + overflow: auto; + } + } + } + + &.type__alert, + &.type__confirm { + .@{modal-prefix-cls}__status-wrapper { + font-size: var(--ti-mobile-modal-alert-font-size); + padding: 0 10px 0 2px; + } + } + + &.is__maximize { + .@{modal-prefix-cls}__box { + .@{modal-prefix-cls}__header { + cursor: default; + } + } + + .@{modal-prefix-cls}__resize { + .wl-resize, + .wr-resize, + .swst-resize, + .sest-resize, + .st-resize, + .swlb-resize, + .selb-resize, + .sb-resize { + display: none; + } + } + } + } + + &__box { + width: 90%; + background-color: var(--ti-mobile-modal-box-bg-color); + border-radius: 16px; + font-size: var(--ti-mobile-modal-header-font-size); + box-shadow: var(--ti-mobile-modal-box-shadow); + text-align: left; + pointer-events: auto; + visibility: hidden; + opacity: 0; + padding-top: 12px; + + + &.is__drag { + cursor: move; + + .@{modal-prefix-cls}__body, + .@{modal-prefix-cls}__footer { + &:after { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + } + } + + .@{modal-prefix-cls}__body { + overflow: hidden; + + .@{modal-prefix-cls}__content { + overflow: hidden; + } + } + } + } + + &__status-wrapper { + flex-shrink: 0; + display: flex; + align-items: center; + } + + &__status-icon { + font-style: normal; + } + + &__content { + display: flex; + align-items: center; + justify-content: center; + width: 100%; + flex-grow: 1; + } + + &__header, + &__body, + &__footer { + position: relative; + } + + &__body { + display: flex; + flex-grow: 1; + padding: 20px 44px 28px 44px; + } + + &__header { + flex-shrink: 0; + color: var(--ti-mobile-modal-text-color); + font-size: var(--ti-mobile-modal-header-font-size); + display: flex; + align-items: center; + justify-content: center; + font-weight: 500; + border-bottom: none; + padding: 20px 44px 0px 44px; + user-select: none; + } + + &__zoom-btn, + &__close-btn { + font-size: var(--ti-mobile-modal-header-font-size); + position: absolute; + right: 24px; + top: var(--ti-mobile-modal-close-btn-top); + z-index: 1; + fill: var(--ti-mobile-modal-text-color); + transform: var(--ti-mobile-modal-close-btn-scale); + cursor: pointer; + padding: 0; + border-radius: 4px; + + &:hover { + fill: var(--ti-mobile-modal-text-color); + background-color:var(--ti-mobile-modal-close-btn-bg-color-hover) + } + } + + &__zoom-btn { + right: 44px; + border-color: #c0c4cc; + + &:hover { + border-color: #606266; + } + } + + &__footer { + flex-shrink: 0; + text-align: center; + padding-bottom: 32px; + + .@{button-prefix-cls}{ + border-radius: 18px; + width: var(--ti-mobile-modal-btn-width); + height: var(--ti-mobile-modal-btn-height); + line-height: var(--ti-mobile-modal-btn-height); + + &__single { + width: var(--ti-mobile-modal-single-btn-width); + } + } + .@{button-default-prefix-cls}{ + display: inline-block; + margin-right: 16px; + background-color: var(--ti-mobile-modal-cancel-btn-bg-color, #f5f5f5); + border: none; + color: var(--ti-mobile-modal-text-color); + } + } + + &__resize { + @SpaceSize: 8px; + + .wl-resize, + .wr-resize, + .swst-resize, + .sest-resize, + .st-resize, + .swlb-resize, + .selb-resize, + .sb-resize { + position: absolute; + z-index: 100; + } + + .wl-resize, + .wr-resize { + width: @SpaceSize; + height: 100%; + top: 0; + cursor: w-resize; + } + + .wl-resize { + left: -@SpaceSize / 2 + 1; + } + + .wr-resize { + right: -@SpaceSize / 2 + 1; + } + + .swst-resize, + .sest-resize, + .swlb-resize, + .selb-resize { + width: @SpaceSize + 2; + height: @SpaceSize + 2; + z-index: 101; + } + + .swst-resize, + .sest-resize { + top: -@SpaceSize; + } + + .swlb-resize, + .selb-resize { + bottom: -@SpaceSize; + } + + .sest-resize, + .swlb-resize { + cursor: sw-resize; + } + + .swst-resize, + .selb-resize { + cursor: se-resize; + } + + .swst-resize, + .swlb-resize { + left: -@SpaceSize; + } + + .sest-resize, + .selb-resize { + right: -@SpaceSize; + } + + .st-resize, + .sb-resize { + width: 100%; + height: @SpaceSize; + left: 0; + cursor: s-resize; + } + + .st-resize { + top: -@SpaceSize / 2 + 1; + } + + .sb-resize { + bottom: -@SpaceSize / 2 + 1; + } + } +} + +@keyframes modal-fade-in { + 0% { + transform: translate3d(0, -20px, 0); + opacity: 0; + } + + 100% { + transform: translate3d(0, 0, 0); + opacity: 1; + } +} + +@keyframes modal-fade-out { + 0% { + transform: translate3d(0, 0, 0); + opacity: 1; + } + + 100% { + transform: translate3d(0, -20px, 0); + opacity: 0; + } +} + +@keyframes modal-fade-in { + 0% { + transform: translate3d(0, -20px, 0); + opacity: 0; + } + + 100% { + transform: translate3d(0, 0, 0); + opacity: 1; + } +} + +@keyframes modal-fade-out { + 0% { + transform: translate3d(0, 0, 0); + opacity: 1; + } + + 100% { + transform: translate3d(0, -20px, 0); + opacity: 0; + } +} \ No newline at end of file diff --git a/packages/theme-mobile/src/modal/vars.less b/packages/theme-mobile/src/modal/vars.less new file mode 100644 index 000000000..e5fdb5e8e --- /dev/null +++ b/packages/theme-mobile/src/modal/vars.less @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-modal() { + --ti-mobile-modal-text-font-size: 14px; + --ti-mobile-modal-header-font-size: 16px; + --ti-mobile-modal-text-color: var(--ti-mobile-common-color-text-primary, #191919); + --ti-mobile-modal-alert-font-size: 22px; + --ti-mobile-modal-box-bg-color: var(--ti-mobile-common-bg-color-white, #fff); + --ti-mobile-modal-box-shadow: 0 8px 40px 0 rgba(0, 0, 0, 0.2); + --ti-mobile-modal-close-btn-top: 13px; + --ti-mobile-modal-close-btn-scale: scale(1, 1); + --ti-mobile-modal-close-btn-bg-color-hover: var(--ti-mobile-common-bg-color-white, #fff); + --ti-mobile-modal-btn-width: 112px; + --ti-mobile-modal-single-btn-width: 144px; + --ti-mobile-modal-btn-height: 36px; + --ti-mobile-modal-cancel-btn-bg-color: var(--ti-mobile-common-bg-color-dark-gray, #f5f5f5); +} diff --git a/packages/theme-mobile/src/multi-select/index.js b/packages/theme-mobile/src/multi-select/index.js new file mode 100644 index 000000000..9309d124a --- /dev/null +++ b/packages/theme-mobile/src/multi-select/index.js @@ -0,0 +1,12 @@ +export default { + 'tiny-mobile-multi-select-bg': '#fff', + 'tiny-mobile-multi-select-header-bg': '#fff', + 'tiny-mobile-multi-select-header-item-height': '28px', + 'tiny-mobile-multi-select-header-item-bg': 'rgba(0, 0, 0, 0.03)', + 'tiny-mobile-multi-select-header-item-margin-top': '10px', + 'tiny-mobile-multi-select-header-label-text-color': '#595959', + 'tiny-mobile-multi-select-header-label-font-size': '12px', + 'tiny-mobile-multi-select-svg-fill-color': '#c2c2c2', + 'tiny-mobile-multi-select-content-height': '226px', + 'tiny-mobile-multi-select-footer-width': '164px', +} diff --git a/packages/theme-mobile/src/multi-select/index.less b/packages/theme-mobile/src/multi-select/index.less new file mode 100644 index 000000000..bafccd1f0 --- /dev/null +++ b/packages/theme-mobile/src/multi-select/index.less @@ -0,0 +1,147 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import '../mixins/hairline.less'; +@import './vars.less'; + +@multi-select-prefix-cls: ~'@{css-prefix}mobile-multi-select'; + +.@{multi-select-prefix-cls} { + background: var(--ti-mobile-multi-select-bg, #fff); + width: 100%; + border-radius: 0px 0px 16px 16px; + + &__header { + display: flex; + padding: 0 16px; + flex-direction: row; + justify-content: center; + + &__flexCenter { + height: 48px; + width: 100%; + display: flex; + flex: 1; + flex-direction: row; + justify-content: space-between; + background: var(--ti-mobile-multi-select-header-bg, #fff); + box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.06) inset; + } + + &__calc { + position: absolute; + opacity: 0; + z-index: -999; + display: flex; + -webkit-box-orient: horizontal; + -webkit-box-direction: normal; + -ms-flex-direction: row; + flex-direction: row; + pointer-events: none; + } + + &__item { + display: flex; + align-items: center; + justify-content: center; + height: var(--ti-mobile-multi-select-header-item-height, 28px); + background: var(--ti-mobile-multi-select-header-item-bg, rgba(0, 0, 0, 0.03)); + border-radius: 4px; + margin-top: var(--ti-mobile-multi-select-header-item-margin-top, 10px); + padding: 5px 8px; + + &:hover { + svg { + fill: var(--ti-mobile-base-color-brand-1, #4a79fe); + } + } + } + + &__item:hover &__label { + color: var(--ti-mobile-base-color-brand-1, #4a79fe); + } + + &__label { + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + word-break: break-all; + font-size: var(--ti-mobile-multi-select-header-label-font-size, 12px); + color: var(--ti-mobile-multi-select-header-label-text-color, #595959); + line-height: 18px; + } + + &__icon { + height: 12px; + line-height: 12px; + width: 12px; + margin-top: 2px; + margin-left: 4px; + font-size: 0px; + transform-origin: center center; + transition: all linear 0.3s; + + svg { + fill: var(--ti-mobile-multi-select-svg-fill-color, #c2c2c2); + font-size: 12px; + vertical-align: text-bottom; + } + } + + &__active { + svg { + fill: var(--ti-mobile-base-color-brand-1, #4a79fe); + } + + color: var(--ti-mobile-base-color-brand-1, #4a79fe); + } + } + + &__content { + height: var(--ti-mobile-multi-select-content-height, 226px); + } + + .noFooter { + border-radius: 0px 0px 16px 16px; + } + + &__footer { + height: 74px; + padding: 16px; + text-align: center; + box-sizing: border-box; + display: flex; + justify-content: center; + align-items: center; + border-radius: 0px 0px 16px 16px; + box-shadow: 0px -1px 3px 0px #f8f8f8; + + button { + width: var(--ti-mobile-multi-select-footer-width, 164px); + } + + :first-child { + margin-right: 15px; + } + + .tiny-mobile-button--primary { + color: var(--ti-mobile-button-color, #fff); + border-color: var(--ti-mobile-base-color-brand-1, #4a79fe); + background-color: var(--ti-mobile-base-color-brand-1, #4a79fe); + } + + .tiny-mobile-button--default { + color: #191919; + } + } +} \ No newline at end of file diff --git a/packages/theme-mobile/src/multi-select/vars.less b/packages/theme-mobile/src/multi-select/vars.less new file mode 100644 index 000000000..a6dfcf0dc --- /dev/null +++ b/packages/theme-mobile/src/multi-select/vars.less @@ -0,0 +1,12 @@ +:root { + --ti-mobile-multi-select-bg: #fff; + --ti-mobile-multi-select-header-bg: #fff; + --ti-mobile-multi-select-header-item-height: 28px; + --ti-mobile-multi-select-header-item-bg: rgba(0, 0, 0, 0.03); + --ti-mobile-multi-select-header-item-margin-top: 10px; + --ti-mobile-multi-select-header-label-text-color: #595959; + --ti-mobile-multi-select-header-label-font-size: 12px; + --ti-mobile-multi-select-svg-fill-color: #c2c2c2; + --ti-mobile-multi-select-content-height: 226px; + --ti-mobile-multi-select-footer-width: 164px; +} diff --git a/packages/theme-mobile/src/nav-bar/index.js b/packages/theme-mobile/src/nav-bar/index.js new file mode 100644 index 000000000..ad6c4a7c2 --- /dev/null +++ b/packages/theme-mobile/src/nav-bar/index.js @@ -0,0 +1,8 @@ +export default { + 'tiny-mobile-nav-bar-height': '44px', + 'tiny-mobile-nav-bar-bgcolor': '#343745', + 'tiny-mobile-nav-bar-icon-color': '#fff', + 'tiny-mobile-nav-bar-arrow-font-size': '17px', + 'tiny-mobile-nav-bar-title-color': '#f0f0f0', + 'tiny-mobile-nav-bar-left-font-size': '16px' +} diff --git a/packages/theme-mobile/src/nav-bar/index.less b/packages/theme-mobile/src/nav-bar/index.less new file mode 100644 index 000000000..18399679f --- /dev/null +++ b/packages/theme-mobile/src/nav-bar/index.less @@ -0,0 +1,89 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +@mobile-nav-bar-prefix-cls: ~'@{css-prefix}mobile-nav-bar'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{mobile-nav-bar-prefix-cls} { + position: relative; + z-index: 1; + height: var(--ti-mobile-nav-bar-height, 44px); + line-height: var(--ti-mobile-nav-bar-height, 44px); + padding: 0 10px; + text-align: center; + background-color: var(--ti-mobile-nav-bar-bgcolor, #343745); + user-select: none; + display: flex; + justify-content: space-between; + align-items: center; + + .@{svg-prefix-cls} { + fill: var(--ti-mobile-nav-bar-icon-color, #fff); + font-size: 24px; + position: relative; + text-rendering: auto; + vertical-align: middle; + } + + &__fixed { + position: fixed; + top: 0; + left: 0; + width: 100%; + } + + &__title { + max-width: 60%; + color: var(--ti-mobile-nav-bar-title-color, #f0f0f0); + font-size: var(--ti-mobile-nav-bar-arrow-font-size, 17px); + + .main-title, + .sub-title { + margin: 0; + line-height: 1; + .text-overflow(); + } + + .sub-title { + display: none; + font-size: 12px; + margin-top: 4px; + + &.is-show-subtitle { + display: block; + } + } + + p.main-title { + color: #f0f0f0; + font-size: 17px; + } + } + + &__left, + &__right { + font-size: var(--ti-mobile-nav-bar-left-font-size, 16px); + cursor: pointer; + + &:active { + opacity: 0.7; + } + } + + &__text { + color: var(--ti-mobile-nav-bar-title-color, #f0f0f0); + } +} diff --git a/packages/theme-mobile/src/nav-bar/vars.less b/packages/theme-mobile/src/nav-bar/vars.less new file mode 100644 index 000000000..286d81b88 --- /dev/null +++ b/packages/theme-mobile/src/nav-bar/vars.less @@ -0,0 +1,8 @@ +:root { + --ti-mobile-nav-bar-height: 44px; + --ti-mobile-nav-bar-bgcolor: #343745; + --ti-mobile-nav-bar-icon-color: var(--ti-mobile-base-color-light, #fff); + --ti-mobile-nav-bar-arrow-font-size: 17px; + --ti-mobile-nav-bar-title-color: #f0f0f0; + --ti-mobile-nav-bar-left-font-size: 16px; +} diff --git a/packages/theme-mobile/src/numeric/index.js b/packages/theme-mobile/src/numeric/index.js new file mode 100644 index 000000000..4cb904a27 --- /dev/null +++ b/packages/theme-mobile/src/numeric/index.js @@ -0,0 +1,12 @@ +export default { + 'tiny-mobile-numeric-input-radius': '3px', + 'tiny-mobile-numeric-input-normal-border-color': '#ddd', + 'tiny-mobile-numeric-input-normal-color': '#333', + 'tiny-mobile-numeric-input-normal-background': '#fff', + 'tiny-mobile-numeric-input-normal-height': '24px', + 'tiny-mobile-numeric-input-placeholder-color': '#999', + 'tiny-mobile-numeric-input-disabled-bgcolor': '#f5f5f5', + 'tiny-mobile-numeric-input-icon-disabled-color': '#ccc', + 'tiny-mobile-numeric-input-font-size': '14px', + 'tiny-mobile-numeric-input-caret-color': '#039be5' +} diff --git a/packages/theme-mobile/src/numeric/index.less b/packages/theme-mobile/src/numeric/index.less new file mode 100644 index 000000000..de646d46b --- /dev/null +++ b/packages/theme-mobile/src/numeric/index.less @@ -0,0 +1,282 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/input.less'; +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +@numeric-prefix-cls: ~'@{css-prefix}mobile-numeric'; +@input-prefix-cls: ~'@{css-prefix}mobile-input'; + +.@{numeric-prefix-cls} { + position: relative; + display: inline-block; + width: 100px; + outline: none; + + &__input { + display: flex; + + &.is-disabled &-inner { + cursor: not-allowed; + pointer-events: none; + border: 1px solid var(--ti-mobile-numeric-input-normal-border-color, #ddd); + color: var(--ti-mobile-numeric-input-placeholder-color, #999); + background: var(--ti-mobile-numeric-input-disabled-bgcolor, #f5f5f5); + .placeholder(@color: #bfbfbf); + } + + &.is-disabled .@{input-prefix-cls}__icon { + cursor: not-allowed; + } + } + + &__input-inner { + width: 100%; + height: var(--ti-mobile-numeric-input-normal-height, 24px); + line-height: var(--ti-mobile-numeric-input-normal-height, 24px); + font-size: var(--ti-mobile-numeric-input-font-size, 14px); + color: var(--ti-mobile-numeric-input-normal-color, #333); + caret-color: var(--ti-mobile-numeric-input-caret-color, #039be5); + background: var(--ti-mobile-numeric-input-normal-background, #fff); + border: 1px solid var(--ti-mobile-numeric-input-normal-border-color, #ddd); + border-radius: var(--ti-mobile-numeric-input-radius, 3px); + padding: 0 24px; + outline: 0; + display: inline-block; + box-sizing: border-box; + -webkit-appearance: none; + text-align: center; + transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); + .placeholder( + @color: var(--ti-mobile-numeric-input-placeholder-color, #999999) + ); + + &:focus { + outline: 0; + .placeholder( + @color: var(--ti-mobile-numeric-input-placeholder-color, #999999) + ); + } + + &::-ms-clear { + display: none; + width: 0; + height: 0; + } + } + + &__decrease, + &__increase { + position: absolute; + z-index: 1; + top: 0px; + width: var(--ti-mobile-numeric-input-normal-height, 24px); + height: var(--ti-mobile-numeric-input-normal-height, 24px); + line-height: var(--ti-mobile-numeric-input-normal-height, 24px); + font-size: 14px; + text-align: center; + cursor: pointer; + + svg { + fill: var(--ti-mobile-numeric-input-normal-color, #333); + } + + &.is-disabled { + cursor: not-allowed; + + svg { + fill: var(--ti-mobile-numeric-input-icon-disabled-color, #ccc); + } + } + } + + &__increase { + right: 1px; + border-radius: 0 3px 3px 0; + border-left: 1px solid var(--ti-mobile-numeric-input-normal-border-color, #ddd); + } + + &__decrease { + left: 0px; + border-radius: 3px 0 0 3px; + border-right: 1px solid var(--ti-mobile-numeric-input-normal-border-color, #ddd); + } + + &.is-disabled &__decrease, + &.is-disabled &__increase { + svg { + fill: var(--ti-mobile-numeric-input-icon-disabled-color, #ccc); + } + + &:hover { + cursor: not-allowed; + + svg { + fill: var(--ti-mobile-numeric-input-icon-disabled-color, #ccc); + } + } + } + + &--large { + width: 180px; + line-height: 30px; + } + + &--large &__decrease, + &--large &__increase { + width: 30px; + height: 30px; + line-height: 30px; + } + + &--large &__input-inner { + height: 30px; + line-height: 30px; + padding: 0px 30px; + } + + &--medium { + width: 270px; + line-height: 42px; + } + + &--medium &__decrease, + &--medium &__increase { + width: 42px; + height: 42px; + line-height: 42px; + font-size: 16px; + } + + &--medium &__input-inner { + height: 42px; + line-height: 42px; + padding-left: 43px; + padding-right: 43px; + } + + &--small { + width: 200px; + line-height: 36px; + } + + &--small &__decrease, + &--small &__increase { + width: 36px; + height: 36px; + line-height: 36px; + font-size: 14px; + } + + &--small &__input-inner { + height: 36px; + line-height: 36px; + padding-left: 37px; + padding-right: 37px; + } + + &--mini { + width: 130px; + line-height: 24px; + } + + &--mini &__decrease, + &--mini &__increase { + width: 24px; + font-size: 12px; + } + + &--mini &__input-inner { + height: 24px; + line-height: 24px; + padding-left: 35px; + padding-right: 35px; + } + + &.is-without-controls &__input-inner { + padding-left: 15px; + padding-right: 15px; + } + + &.is-controls-right { + .@{numeric-prefix-cls}__input { + display: flex; + } + + .@{numeric-prefix-cls}__input-inner { + padding-left: 8px; + padding-right: 38px; + } + + .@{numeric-prefix-cls}__decrease, + .@{numeric-prefix-cls}__increase { + height: 50%; + line-height: 0; + display: flex; + justify-content: center; + align-items: center; + + svg { + transform: scale(0.8); + } + } + + .@{numeric-prefix-cls}__increase { + right: 0; + border-radius: 0 3px 0 0; + border-bottom: 1px solid var(--ti-mobile-numeric-input-normal-border-color, #ddd); + } + + .@{numeric-prefix-cls}__decrease { + right: 0; + bottom: 0; + top: auto; + left: auto; + border-right: none; + border-left: 1px solid var(--ti-mobile-numeric-input-normal-border-color, #ddd); + border-radius: 0 0 3px; + } + + &[class*='medium'] { + [class*='decrease'], + [class*='increase'] { + line-height: 20px; + } + } + + &[class*='small'] { + [class*='decrease'], + [class*='increase'] { + line-height: 17px; + } + } + + &[class*='mini'] { + [class*='decrease'], + [class*='increase'] { + line-height: 8px; + } + } + } + + &.is-round &__input-inner { + border: none; + } + + &.is-round &__decrease, + &.is-round &__increase { + border: 1px solid var(--ti-mobile-numeric-input-normal-border-color, #ddd); + border-radius: 24px; + } +} diff --git a/packages/theme-mobile/src/numeric/vars.less b/packages/theme-mobile/src/numeric/vars.less new file mode 100644 index 000000000..4599ab477 --- /dev/null +++ b/packages/theme-mobile/src/numeric/vars.less @@ -0,0 +1,12 @@ +:root { + --ti-mobile-numeric-input-radius: var(--ti-mobile-base-radius-large, 3px); + --ti-mobile-numeric-input-normal-border-color: #ddd; + --ti-mobile-numeric-input-normal-color: var(--ti-mobile-base-color-info-normal, #333); + --ti-mobile-numeric-input-normal-background: var(--ti-mobile-base-color-light, #fff); + --ti-mobile-numeric-input-normal-height: var(--ti-mobile-base-size-height-mini, 24px); + --ti-mobile-numeric-input-placeholder-color: var(--ti-mobile-base-color-placeholder, #999); + --ti-mobile-numeric-input-disabled-bgcolor: var(--ti-mobile-base-color-selected-background, #f5f5f5); + --ti-mobile-numeric-input-icon-disabled-color: #ccc; + --ti-mobile-numeric-input-font-size: 14px; + --ti-mobile-numeric-input-caret-color: #039be5; +} diff --git a/packages/theme-mobile/src/picker-column/index.js b/packages/theme-mobile/src/picker-column/index.js new file mode 100644 index 000000000..d7bc5bf1b --- /dev/null +++ b/packages/theme-mobile/src/picker-column/index.js @@ -0,0 +1,9 @@ +export default { + 'tiny-mobile-picker-column-item-height': '34px', + 'tiny-mobile-picker-column-item-color': '#333', + 'tiny-mobile-picker-column-item-font-size': '17px', + 'tiny-mobile-picker-column-item-select-color': '#039be5', + 'tiny-mobile-picker-column-indicator-border-color': '#e5e5e5', + 'tiny-mobile-picker-column-mask-background': + 'linear-gradient(#fff, #ddd, #fff)' +} diff --git a/packages/theme-mobile/src/picker-column/index.less b/packages/theme-mobile/src/picker-column/index.less new file mode 100644 index 000000000..490d93976 --- /dev/null +++ b/packages/theme-mobile/src/picker-column/index.less @@ -0,0 +1,92 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import '../mixins/hairline.less'; +@import './vars.less'; + +@picker-column-prefix-cls: ~'@{css-prefix}mobile-picker-column'; + +.@{picker-column-prefix-cls} { + position: relative; + flex: 1; + height: 100%; + + &__wrapper { + position: absolute; + top: 0; + left: 0; + width: 100%; + transition-timing-function: cubic-bezier(0.23, 1, 0.68, 1); + } + + &__item { + height: var(--ti-mobile-picker-column-item-height, 34px); + line-height: var(--ti-mobile-picker-column-item-height, 34px); + color: var(--ti-mobile-picker-column-item-color, #333); + font-size: var(--ti-mobile-picker-column-item-font-size, 17px); + padding: 0; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + text-align: center; + + &.is-select { + color: var(--ti-mobile-picker-column-item-select-color, #039be5); + } + } + + &__mask { + position: absolute; + top: 0; + left: 0; + z-index: 2; + width: 100%; + height: 100%; + background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0.9), hsla(0, 0%, 100%, 0.4)), + linear-gradient(0deg, hsla(0, 0%, 100%, 0.9), hsla(0, 0%, 100%, 0.4)); + background-repeat: no-repeat; + background-position: top, bottom; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; + pointer-events: none; + } + + &__indicator { + position: absolute; + top: 50%; + right: 0px; + left: 0px; + z-index: 3; + transform: translateY(-50%); + .hairline( + 'top', + var(--ti-mobile-picker-column-indicator-border-color, #e5e5e5) + ); + .hairline( + 'bottom', + var(--ti-mobile-picker-column-indicator-border-color, #e5e5e5) + ); + } + + &:not(:first-child) &__mask::before { + position: absolute; + top: 0; + bottom: 0; + left: 0; + width: 1px; + transform: scaleX(0.5); + transform-origin: 0 0; + content: ' '; + background: var(--ti-mobile-picker-column-mask-background, linear-gradient(#fff, #ddd, #fff)); + } +} diff --git a/packages/theme-mobile/src/picker-column/vars.less b/packages/theme-mobile/src/picker-column/vars.less new file mode 100644 index 000000000..de53d8e0f --- /dev/null +++ b/packages/theme-mobile/src/picker-column/vars.less @@ -0,0 +1,8 @@ +:root { + --ti-mobile-picker-column-item-height: 34px; + --ti-mobile-picker-column-item-color: #333; + --ti-mobile-picker-column-item-font-size: 17px; + --ti-mobile-picker-column-item-select-color: #039be5; + --ti-mobile-picker-column-indicator-border-color: #e5e5e5; + --ti-mobile-picker-column-mask-background: linear-gradient(#fff, #ddd, #fff); +} diff --git a/packages/theme-mobile/src/popover/index.js b/packages/theme-mobile/src/popover/index.js new file mode 100644 index 000000000..6758db347 --- /dev/null +++ b/packages/theme-mobile/src/popover/index.js @@ -0,0 +1,35 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-mobile-popover-bg-color': '#ffffff', + 'tiny-mobile-popover-text-color': '#606266', + 'tiny-mobile-popover-border-color': '#d9d9d9', + 'tiny-mobile-popover-border-radius': '4%', + 'tiny-mobile-popover-font-size': '14px', + 'tiny-mobile-popover-font-size-weaken': '10px', + 'tiny-mobile-popover-title-text-color': '#303133', + 'tiny-mobile-popover-title-font-size': '16px', + 'tiny-mobile-popover-arrow-border-weight': '6px', + 'tiny-mobile-popover-placement-margin-vertical': '12px', + 'tiny-mobile-popover-placement-margin-horizontal': '12px', + 'tiny-mobile-popover-arrow-after-border-color': '#ffffff', + 'tiny-mobile-popover-box-shadow': '0px 1px 12px 0px rgba(37,43,58,0.08)', + 'tiny-mobile-popover-arrow-border-color': '#d9d9d9', + 'tiny-mobile-popover-padding-vertical': '4px', + 'tiny-mobile-popover-icon-size': '24px', + 'tiny-mobile-popover-icon-margin-right': '12px', + 'tiny-mobile-popover-label-text-color-weaken': '#999999', + 'tiny-mobile-popover-line-bg-color': '#eeeeee', + 'tiny-mobile-popover-list-padding-left': '20px', + 'tiny-mobile-popover-list-bg-color-active': '#f5f5f5' +} diff --git a/packages/theme-mobile/src/popover/index.less b/packages/theme-mobile/src/popover/index.less new file mode 100644 index 000000000..6baa059cb --- /dev/null +++ b/packages/theme-mobile/src/popover/index.less @@ -0,0 +1,208 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@popover-prefix-cls: ~'@{css-prefix}mobile-popover'; +@popper-prefix-cls: ~'@{css-prefix}mobile-popper'; + +.@{popover-prefix-cls}.@{popper-prefix-cls} { + .component-css-vars-popover(); + + position: absolute; + background: var(--ti-mobile-popover-bg-color); + color: var(--ti-mobile-popover-text-color); + border-radius: var(--ti-mobile-popover-border-radius); + padding: var(--ti-mobile-popover-padding-vertical) 0; + z-index: 2000; + line-height: 1.4; + text-align: justify; + font-size: var(--ti-mobile-popover-font-size); + box-shadow: var(--ti-mobile-popover-box-shadow); + word-break: break-all; + user-select: none; + + .popper__arrow, + .popper__arrow::after { + position: absolute; + display: block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + } + + .popper__arrow, + .@{popper-prefix-cls} .popper__arrow { + border-width: var(--ti-mobile-popover-arrow-border-weight); + -webkit-filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03)); + filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03)); + } + + .popper__arrow::after { + content: ' '; + border-width: var(--ti-mobile-popover-arrow-border-weight); + } + + &[x-placement^='top'] { + margin-bottom: var(--ti-mobile-popover-placement-margin-vertical); + + .popper__arrow { + bottom: -6px; + left: 50%; + margin-right: 3px; + border-top-color: var(--ti-mobile-popover-arrow-border-color); + border-bottom-width: 0; + + &::after { + bottom: 1px; + margin-left: -6px; + border-top-color: var(--ti-mobile-popover-arrow-after-border-color); + border-bottom-width: 0; + } + } + } + + &[x-placement^='bottom'] { + margin-top: var(--ti-mobile-popover-placement-margin-vertical); + + .popper__arrow { + top: -6px; + left: 50%; + margin-right: 3px; + border-top-width: 0; + border-bottom-color: var(--ti-mobile-popover-arrow-border-color); + + &::after { + top: 1px; + margin-left: -6px; + border-top-width: 0; + border-bottom-color: var(--ti-mobile-popover-arrow-after-border-color); + } + } + } + + &[x-placement^='right'] { + margin-left: var(--ti-mobile-popover-placement-margin-horizontal); + + .popper__arrow { + top: 50%; + left: -6px; + margin-bottom: 3px; + border-right-color: var(--ti-mobile-popover-arrow-border-color); + border-left-width: 0; + + &::after { + bottom: -6px; + left: 1px; + border-right-color: var(--ti-mobile-popover-arrow-after-border-color); + border-left-width: 0; + } + } + } + + &[x-placement^='left'] { + margin-right: var(--ti-mobile-popover-placement-margin-horizontal); + + .popper__arrow { + top: 50%; + right: -6px; + margin-bottom: 3px; + border-right-width: 0; + border-left-color: var(--ti-mobile-popover-arrow-border-color); + + &::after { + right: 1px; + bottom: -6px; + margin-left: -6px; + border-right-width: 0; + border-left-color: var(--ti-mobile-popover-arrow-after-border-color); + } + } + } + + .@{popover-prefix-cls}__plain { + padding: 18px 20px; + } + + .@{popover-prefix-cls}__title { + color: var(--ti-mobile-popover-title-text-color); + font-size: var(--ti-mobile-popover-title-font-size); + line-height: 1; + margin-bottom: 12px; + } + + &:focus, + &:focus:active, + .@{popover-prefix-cls}__reference:focus:hover, + .@{popover-prefix-cls}__reference:focus:not(.focusing) { + outline-width: 0; + } + + .list-content { + overflow-y: auto; + + .list-view { + display: flex; + align-items: center; + position: relative; + padding-left: var(--ti-mobile-popover-list-padding-left); + height: 48px; + + &:active { + background: var(--ti-mobile-popover-list-bg-color-active); + } + + .icon { + margin-right: var(--ti-mobile-popover-icon-margin-right); + width: var(--ti-mobile-popover-icon-size); + height: var(--ti-mobile-popover-icon-size); + } + + .label-view { + display: flex; + flex-direction: column; + + .main { + color: var(--ti-mobile-common-color-text-primary, #191919); + font-size: var(--ti-mobile-popover-font-size, 14px); + margin-right: 30px; + } + .sub { + color: var(--ti-mobile-popover-label-text-color-weaken, #999999); + font-size: var(--ti-mobile-popover-font-size-weaken, 10px); + margin-top: 4px; + margin-right: 30px; + } + } + .line { + position: absolute; + height: 1px; + bottom: 0; + right: 0; + width: calc(100% - var(--ti-mobile-popover-icon-size) - var(--ti-mobile-popover-icon-margin-right) - var(--ti-mobile-popover-list-padding-left)); + background: var(--ti-mobile-popover-line-bg-color, #eeeeee); + } + } + + .list-view-height { + height: 68px; + } + } +} + +.@{popover-prefix-cls} { + &__reference { + display: inline-block; + } +} diff --git a/packages/theme-mobile/src/popover/vars.less b/packages/theme-mobile/src/popover/vars.less new file mode 100644 index 000000000..71a91f50b --- /dev/null +++ b/packages/theme-mobile/src/popover/vars.less @@ -0,0 +1,35 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-popover() { + --ti-mobile-popover-bg-color: var(--ti-mobile-base-color-light, #ffffff); + --ti-mobile-popover-text-color: #606266; + --ti-mobile-popover-border-color: #d9d9d9; + --ti-mobile-popover-border-radius: 4%; + --ti-mobile-popover-font-size: var(--ti-mobile-common-font-size-1, 14px); + --ti-mobile-popover-font-size-weaken: 10px; + --ti-mobile-popover-title-text-color: #303133; + --ti-mobile-popover-title-font-size: var(--ti-mobile-common-font-size-2, 16px); + --ti-mobile-popover-arrow-border-weight: 6px; + --ti-mobile-popover-placement-margin-vertical: var(--ti-mobile-common-space-3x, 12px); + --ti-mobile-popover-placement-margin-horizontal: var(--ti-mobile-common-space-3x, 12px); + --ti-mobile-popover-arrow-after-border-color: var(--ti-mobile-base-color-light, #ffffff); + --ti-mobile-popover-box-shadow: 0px 1px 12px 0px rgba(37,43,58,0.08); ; + --ti-mobile-popover-arrow-border-color: var(--ti-mobile-popover-border-color, #d9d9d9); + --ti-mobile-popover-padding-vertical: 4px; + --ti-mobile-popover-icon-size: 24px; + --ti-mobile-popover-icon-margin-right: 12px; + --ti-mobile-popover-label-text-color-weaken: var(--ti-mobile-common-color-text-weaken-dark, #999999); + --ti-mobile-popover-line-bg-color: #eeeeee; + --ti-mobile-popover-list-padding-left: 20px; + --ti-mobile-popover-list-bg-color-active: #f5f5f5; +} diff --git a/packages/theme-mobile/src/popup/index.js b/packages/theme-mobile/src/popup/index.js new file mode 100644 index 000000000..de94ce8c1 --- /dev/null +++ b/packages/theme-mobile/src/popup/index.js @@ -0,0 +1,3 @@ +export default { + // mobile/popup +} diff --git a/packages/theme-mobile/src/popup/index.less b/packages/theme-mobile/src/popup/index.less new file mode 100644 index 000000000..380ee8796 --- /dev/null +++ b/packages/theme-mobile/src/popup/index.less @@ -0,0 +1,180 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@fade-prefix-cls: ~'@{css-prefix}fade'; +@popup-prefix-cls: ~'@{css-prefix}popup'; +@overlay-prefix-cls: ~'@{css-prefix}overlay'; + +.@{fade-prefix-cls} { + &-enter-active { + animation: 0.3s mobile-fade-in both ease-out; + } + + &-leave-active { + animation: 0.3s mobile-fade-out both ease-in; + } +} + +.@{overlay-prefix-cls} { + position: fixed; + top: 0; + left: 0; + z-index: 1; + width: 100%; + height: 100%; + background-color: rgba(0, 0, 0, 0.7); +} + +.@{css-prefix} { + &overflow-hidden { + overflow: hidden !important; + } + + &popup { + position: fixed; + max-height: 100%; + overflow-y: auto; + background-color: #fff; + -webkit-overflow-scrolling: touch; + transition: transform 0.3s; + + &--center { + transform: translate3d(-50%, -50%, 0); + left: 50%; + top: 50%; + + &.@{popup-prefix-cls}--round { + border-radius: 20px; + } + } + + &--top { + top: 0; + left: 0; + width: 100%; + + &.@{popup-prefix-cls}--round { + border-radius: 0 0 20px 20px; + } + } + + &--right { + top: 50%; + right: 0; + transform: translate3d(0, -50%, 0); + + &.@{popup-prefix-cls}--round { + border-radius: 20px 0 0 20px; + } + } + + &--bottom { + bottom: 0; + left: 0; + width: 100%; + + &.@{popup-prefix-cls}--round { + border-radius: 20px 20px 0 0; + } + } + + &--left { + top: 50%; + left: 0; + transform: translate3d(0, -50%, 0); + + &.@{popup-prefix-cls}--round { + border-radius: 0 20px 20px 0; + } + } + + &--safe-area-inset-bottom { + padding-bottom: constant(safe-area-inset-bottom); + padding-bottom: env(safe-area-inset-bottom); + } + + &-slide-top-enter, + &-slide-top-leave-active { + transform: translate3d(0, -100%, 0); + } + + &-slide-right-enter, + &-slide-right-leave-active { + transform: translate3d(100%, -50%, 0); + } + + &-slide-bottom-enter, + &-slide-bottom-leave-active { + transform: translate3d(0, 100%, 0); + } + + &-slide-left-enter, + &-slide-left-leave-active { + transform: translate3d(-100%, -50%, 0); + } + + &__close-icon { + position: absolute; + z-index: 1; + color: #c8c9cc; + font-size: 22px; + cursor: pointer; + + &:active { + color: #969799; + } + + &--top-left { + top: 16px; + left: 16px; + } + + &--top-right { + top: 16px; + right: 16px; + } + + &--bottom-left { + bottom: 16px; + left: 16px; + } + + &--bottom-right { + right: 16px; + bottom: 16px; + } + } + } +} + +@keyframes mobile-fade-in { + from { + opacity: 0; + } + + to { + opacity: 1; + } +} + +@keyframes mobile-fade-out { + from { + opacity: 1; + } + + to { + opacity: 0; + } +} diff --git a/packages/theme-mobile/src/popup/vars.less b/packages/theme-mobile/src/popup/vars.less new file mode 100644 index 000000000..e69de29bb diff --git a/packages/theme-mobile/src/progress/index.js b/packages/theme-mobile/src/progress/index.js new file mode 100644 index 000000000..85a1471a7 --- /dev/null +++ b/packages/theme-mobile/src/progress/index.js @@ -0,0 +1,3 @@ +export default { + // mobile/progress +} diff --git a/packages/theme-mobile/src/progress/index.less b/packages/theme-mobile/src/progress/index.less new file mode 100644 index 000000000..c14b7a5d0 --- /dev/null +++ b/packages/theme-mobile/src/progress/index.less @@ -0,0 +1,151 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/progress.less'; +@import '../custom.less'; +@import './vars.less'; + +@progress-prefix-cls: ~'@{css-prefix}mobile-progress'; + +.@{progress-prefix-cls} { + position: relative; + line-height: 1; + + &.is-success { + .progress-status(var(--ti-progress-success-color, #52c41a)); + } + + &.is-warning { + .progress-status(var(--ti-progress-warning-color, #faad14)); + } + + &.is-exception { + .progress-status(var(--ti-progress-exception-color, #f5222d)); + } + + &--circle, + &--dashboard { + display: inline-block; + + .@{progress-prefix-cls}-text { + position: absolute; + top: 50%; + left: 0; + width: 100%; + text-align: center; + margin: 0; + transform: translate(0, -50%); + + i { + vertical-align: middle; + display: inline-block; + } + } + } + + &__without-text &-text { + display: none; + } + + &__without-text &-bar { + padding-right: 0; + margin-right: 0; + display: block; + } + + &__inside-text &-bar { + padding-right: 0; + margin-right: 0; + } + + &-bar { + padding-right: 50px; + width: 100%; + margin-right: -55px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + + &__outer { + height: 2px; + border-radius: var(--ti-progress-bar-border-radius, 100px); + background-color: var(--ti-progress-bar-outer-bgcolor, #f5f5f5); + overflow: hidden; + position: relative; + vertical-align: middle; + } + + &__inner { + position: absolute; + left: 0; + top: 0; + height: 100%; + background-color: #00c696; + text-align: right; + border-radius: var(--ti-progress-bar-border-radius, 100px); + line-height: 1; + white-space: nowrap; + transition: width 0.6s ease; + + &::after { + content: ''; + height: 100%; + } + } + + &__innerText { + color: var(--ti-progress-bar-inner-text-color, #fff); + font-size: var(--ti-progress-text-font-size, 12px); + margin: 0 5px; + } + + &, + &__inner::after, + &__innerText { + display: inline-block; + vertical-align: middle; + } + } + + &-text { + font-size: var(--ti-progress-text-font-size, 12px); + color: var(--ti-progress-text-color, #333); + display: inline-block; + vertical-align: middle; + margin-left: 12px; + line-height: 1; + + i { + vertical-align: middle; + display: inline-block; + } + } +} + +@-webkit-keyframes progress { + 0% { + background-position: 0 0; + } + + 100% { + background-position: 32px 0; + } +} + +@keyframes progress { + 0% { + background-position: 0 0; + } + + 100% { + background-position: 32px 0; + } +} diff --git a/packages/theme-mobile/src/progress/vars.less b/packages/theme-mobile/src/progress/vars.less new file mode 100644 index 000000000..e69de29bb diff --git a/packages/theme-mobile/src/pull-refresh/index.js b/packages/theme-mobile/src/pull-refresh/index.js new file mode 100644 index 000000000..c4a774edd --- /dev/null +++ b/packages/theme-mobile/src/pull-refresh/index.js @@ -0,0 +1,4 @@ +export default { + 'tiny-mobile-pull-refresh-head-text-color': '#969799', + 'tiny-mobile-pull-refresh-head-font-size': '14px', +} diff --git a/packages/theme-mobile/src/pull-refresh/index.less b/packages/theme-mobile/src/pull-refresh/index.less new file mode 100644 index 000000000..d82af64fb --- /dev/null +++ b/packages/theme-mobile/src/pull-refresh/index.less @@ -0,0 +1,112 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@pull-refresh-prefix-cls: ~'@{css-prefix}mobile-pull-refresh'; + +.@{pull-refresh-prefix-cls} { + height: 100%; + user-select: none; + &__track { + position: relative; + height: 100%; + transition-property: transform; + } + + &__tips { + position: absolute; + left: 0; + width: 100%; + overflow: hidden; + color: var(--ti-mobile-pull-refresh-head-text-color, #969799); + font-size: var(--ti-mobile-pull-refresh-head-font-size, 14px); + line-height: 50px; + text-align: center; + } + + &__head { + transform: translateY(-100%); + } + + &__content { + overflow-y: auto; + height: 100%; + } + + &__loading { + position: relative; + display: inline-block; + width: 60px; + height: 12px; + + i { + position: absolute; + top: 0; + display: inline-block; + width: 12px; + height: 12px; + border-radius: 50%; + z-index: 1; + } + + i:nth-child(3) { + left: 48px; + background: #1ea5e8; + animation: three 300ms infinite; + } + + i:nth-child(2) { + left: 24px; + background: #f6af39; + animation: two 300ms infinite; + } + + i:nth-child(1) { + left: 0; + display: block; + background: #f25e51; + animation: one 300ms infinite; + } + } +} + +@keyframes three { + from { + left: 48px; + } + + to { + left: 0px; + } +} + +@keyframes two { + from { + left: 24px; + } + + to { + left: 48px; + } +} + +@keyframes one { + from { + left: 0px; + } + + to { + left: 24px; + } +} diff --git a/packages/theme-mobile/src/pull-refresh/vars.less b/packages/theme-mobile/src/pull-refresh/vars.less new file mode 100644 index 000000000..4c4fc08b1 --- /dev/null +++ b/packages/theme-mobile/src/pull-refresh/vars.less @@ -0,0 +1,4 @@ +:root { + --ti-mobile-pull-refresh-head-text-color: #969799; + --ti-mobile-pull-refresh-head-font-size: 14px; +} diff --git a/packages/theme-mobile/src/radio/index.js b/packages/theme-mobile/src/radio/index.js new file mode 100644 index 000000000..1debf1c12 --- /dev/null +++ b/packages/theme-mobile/src/radio/index.js @@ -0,0 +1,7 @@ +export default { + 'tiny-mobile-radio-size': '24px', + 'tiny-mobile-radio-checked-color': '#f36f64', + 'tiny-mobile-radio-disabled-color': '#ddd', + 'tiny-mobile-radio-inner-border-color': '#fff', + 'tiny-mobile-radio-label-font-size': '16px' +} diff --git a/packages/theme-mobile/src/radio/index.less b/packages/theme-mobile/src/radio/index.less new file mode 100644 index 000000000..6cbc99ca7 --- /dev/null +++ b/packages/theme-mobile/src/radio/index.less @@ -0,0 +1,138 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +@radio-prefix-cls: ~'@{css-prefix}mobile-radio'; + +.@{radio-prefix-cls} { + margin-right: 30px; + outline: 0; + white-space: nowrap; + cursor: pointer; + .user-select(none); + + &:last-child { + margin-right: 0; + } + + &, + &__inner, + &__input { + position: relative; + display: inline-block; + } + + &__input { + width: var(--ti-mobile-radio-size, 24px); + height: var(--ti-mobile-radio-size, 24px); + line-height: var(--ti-mobile-radio-size, 24px); + outline: 0; + cursor: pointer; + vertical-align: middle; + } + + &__inner { + border: 1px solid transparent; + border-radius: 50%; + width: var(--ti-mobile-radio-size, 24px); + height: var(--ti-mobile-radio-size, 24px); + background-color: transparent; + cursor: pointer; + box-sizing: border-box; + transition-duration: 0.2s; + transition-property: color, border-color, background-color; + + &::after { + content: ''; + width: 8px; + height: 12px; + border-width: 0.1em; + border-style: solid; + border-color: var(--ti-mobile-radio-checked-color, #f36f64); + border-left: 0; + border-top: 0; + position: absolute; + left: 50%; + top: 45%; + transform: translate(-50%, -50%) rotate(45deg) scale(0); + transform-origin: center; + transition: all 0.15s ease-in; + opacity: 0; + } + } + + &:hover:not(.is-disabled) &__inner, + &.is-checked &__inner { + &::after { + transform: translate(-50%, -50%) rotate(45deg) scale(1); + opacity: 1; + } + } + + &.is-disabled &__inner, + &.is-disabled &__label { + cursor: not-allowed; + } + + &.is-disabled.is-checked &__inner { + &:after { + border-color: var(--ti-mobile-radio-disabled-color, #ddd); + } + } + + &.is-bordered &__inner { + border-color: var(--ti-mobile-radio-disabled-color, #ddd); + + &::after { + border-color: var(--ti-mobile-radio-inner-border-color, #fff); + } + } + + &.is-bordered:not(.is-disabled):hover &__inner { + border-color: var(--ti-mobile-radio-checked-color, #f36f64); + } + + &.is-bordered.is-checked &__inner { + border-color: var(--ti-mobile-radio-checked-color, #f36f64); + background-color: var(--ti-mobile-radio-checked-color, #f36f64); + } + + &.is-bordered.is-disabled.is-checked &__inner { + background-color: var(--ti-mobile-radio-disabled-color, #ddd); + border-color: var(--ti-mobile-radio-disabled-color, #ddd); + + &::after { + border-color: var(--ti-mobile-radio-inner-border-color, #fff); + } + } + + &__original { + opacity: 0; + outline: 0; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + margin: 0; + } + + &__label { + font-size: var(--ti-mobile-radio-label-font-size, 16px); + padding-left: 8px; + vertical-align: middle; + } +} diff --git a/packages/theme-mobile/src/radio/vars.less b/packages/theme-mobile/src/radio/vars.less new file mode 100644 index 000000000..5cddf7e70 --- /dev/null +++ b/packages/theme-mobile/src/radio/vars.less @@ -0,0 +1,7 @@ +:root { + --ti-mobile-radio-size: 24px; + --ti-mobile-radio-checked-color: #f36f64; + --ti-mobile-radio-disabled-color: #ddd; + --ti-mobile-radio-inner-border-color: var(--ti-mobile-base-color-light, #fff); + --ti-mobile-radio-label-font-size: 16px; +} diff --git a/packages/theme-mobile/src/search/index.js b/packages/theme-mobile/src/search/index.js new file mode 100644 index 000000000..0388c98ff --- /dev/null +++ b/packages/theme-mobile/src/search/index.js @@ -0,0 +1,18 @@ +export default { + 'tiny-mobile-search-height': '44px', + 'tiny-mobile-search-input-height': '32px', + 'tiny-mobile-search-input-border-radius': '32px', + 'tiny-mobile-search-input-bg-color-gray': '#f5f5f5', + 'tiny-mobile-search-input-bg-color-primary': 'rgba(255, 255, 255, 0.15)', + 'tiny-mobile-search-font-size': '14px', + 'tiny-mobile-search-text-color-gray': '#191919', + 'tiny-mobile-search-text-color-primary': '#fff', + 'tiny-mobile-search-icon-fill-color-gray': '#dbdbdb', + 'tiny-mobile-search-icon-fill-color-primary': '#fff', + 'tiny-mobile-search-caret-color-primary': '#fff', + 'tiny-mobile-search-caret-color-gray': '#4a79fe', + 'tiny-mobile-search-bg-color-primary': '#3168f1', + 'tiny-mobile-search-bg-color-gray': '#fff', + 'tiny-mobile-search-placeholder-text-color-primary': '#dbe5fc', + 'tiny-mobile-search-placeholder-text-color-gray': '#acacac', +} diff --git a/packages/theme-mobile/src/search/index.less b/packages/theme-mobile/src/search/index.less new file mode 100644 index 000000000..33cb4e9b3 --- /dev/null +++ b/packages/theme-mobile/src/search/index.less @@ -0,0 +1,196 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/input.less'; +@import '../mixins/common.less'; +@import '../mixins/hairline.less'; +@import '../custom.less'; +@import './vars.less'; + +@search-prefix-cls: ~'@{css-prefix}mobile-search'; + +.@{search-prefix-cls} { + display: flex; + align-items: center; + box-sizing: border-box; + height: var(--ti-mobile-search-height); + outline: none; + + & &__line { + position: relative; + flex: auto; + height: var(--ti-mobile-search-input-height); + margin-left: 16px; + border-radius: var(--ti-mobile-search-input-border-radius); + overflow: hidden; + box-sizing: border-box; + background: transparent; + + &::after { + content: ''; + width: 200%; + height: 200%; + box-sizing: border-box; + position: absolute; + top: 0; + left: 0; + transform: scale(0.5); + transform-origin: 0 0; + } + } + + & &__box { + display: flex; + align-items: center; + position: relative; + height: 100%; + padding-left: 16px; + padding-right: 16px; + z-index: 2; + backdrop-filter: blur(5px); + } + + &-gray &__box { + background: var(--ti-mobile-search-input-bg-color-gray); + } + + &-primary &__box { + background: var(--ti-mobile-search-input-bg-color-primary); + } + + & &__input { + box-sizing: content-box; + width: 100%; + height: 100%; + border: 0; + margin-left: 8px; + padding-right: 15px; + color: var(--ti-mobile-search-text-color-primary); + background: transparent; + font-size: var(--ti-mobile-search-font-size); + outline: none; + + &-primary { + color: var(--ti-mobile-search-text-color-primary); + caret-color: var(--ti-mobile-search-caret-color-primary); + .placeholder(@color: var(--ti-mobile-search-placeholder-text-color-primary)); + &:focus { + .placeholder(@color: var(--ti-mobile-search-placeholder-text-color-primary)); + } + } + + &-gray { + color: var(--ti-mobile-search-text-color-gray); + caret-color: var(--ti-mobile-search-caret-color-gray); + .placeholder(@color: var(--ti-mobile-search-placeholder-text-color-gray)); + &:focus { + .placeholder(@color: var(--ti-mobile-search-placeholder-text-color-gray)); + } + } + } + + &-primary { + background-color: var(--ti-mobile-search-bg-color-primary); + } + + &-gray { + background-color: var(--ti-mobile-search-bg-color-gray); + } + + & &__icon { + text-decoration: none; + display: flex; + + .@{css-prefix}svg { + fill: var(--ti-mobile-search-placeholder-text-color-primary); + } + } + + &-gray &__icon { + .@{css-prefix}svg { + fill: var(--ti-mobile-search-placeholder-text-color-gray); + } + } + + & &__close-icon { + position: absolute; + top: 0; + right: 0; + padding: 0 8px; + cursor: pointer; + } + + &-primary { + .@{css-prefix}svg { + fill: var(--ti-mobile-search-icon-fill-color-primary); + } + } + + &-gray { + .@{css-prefix}svg { + fill: var(--ti-mobile-search-icon-fill-color-gray); + } + } + + &__right { + display: flex; + align-items: center; + justify-content: center; + width: 46px; + height: 100%; + color: var(--ti-mobile-search-text-color-primary); + } + + &-gray { + color: var(--ti-mobile-search-text-color-gray); + } + + & &__present { + color: var(--ti-mobile-search-text-color-primary); + font-size: var(--ti-mobile-search-font-size); + line-height: 1; + white-space: nowrap; + cursor: pointer; + outline: none; + } + + &-gray &__present { + color: var(--ti-mobile-search-text-color-gray); + } + + &.focus &__present { + display: block; + } + + &.focus &__label { + display: none; + } + + &.focus &__box { + opacity: 1; + } + + &.collapse &__input { + padding: 0; + width: 30px; + float: right; + } + + .fade-enter-to { + opacity: 0; + } + + .fade-enter, + .fade-leave-to { + opacity: 0; + } +} diff --git a/packages/theme-mobile/src/search/vars.less b/packages/theme-mobile/src/search/vars.less new file mode 100644 index 000000000..e9f12c838 --- /dev/null +++ b/packages/theme-mobile/src/search/vars.less @@ -0,0 +1,18 @@ +:root { + --ti-mobile-search-height: 44px; + --ti-mobile-search-input-height: 32px; + --ti-mobile-search-input-border-radius: 32px; + --ti-mobile-search-input-bg-color-gray: var(--ti-mobile-common-bg-color-dark-gray, #f5f5f5); + --ti-mobile-search-input-bg-color-primary: rgba(255, 255, 255, 0.15); + --ti-mobile-search-font-size: 14px; + --ti-mobile-search-text-color-gray: var(--ti-mobile-common-color-text-primary, #191919); + --ti-mobile-search-text-color-primary: var(--ti-mobile-common-color-text-white, #fff); + --ti-mobile-search-icon-fill-color-gray: #dbdbdb; + --ti-mobile-search-icon-fill-color-primary: #fff; + --ti-mobile-search-caret-color-primary: var(--ti-mobile-common-color-line-white, #fff); + --ti-mobile-search-caret-color-gray: var(--ti-mobile-common-color-line-hightlight, #4a79fe); + --ti-mobile-search-bg-color-primary: var(--ti-mobile-common-bg-color-blue-1, #3168f1); + --ti-mobile-search-bg-color-gray: var(--ti-mobile-common-bg-color-white, #fff); + --ti-mobile-search-placeholder-text-color-primary: var(--ti-mobile-common-color-text-placeholder-primary, #dbe5fc); + --ti-mobile-search-placeholder-text-color-gray: var(--ti-mobile-common-color-text-placeholder-gray, #acacac); +} diff --git a/packages/theme-mobile/src/slider/index.js b/packages/theme-mobile/src/slider/index.js new file mode 100644 index 000000000..21efe5d2d --- /dev/null +++ b/packages/theme-mobile/src/slider/index.js @@ -0,0 +1,15 @@ +export default { + 'tiny-mobile-slider-track-size': '2px', + 'tiny-mobile-slider-track-bgcolor': '#ccc', + 'tiny-mobile-slider-range-bgcolor': '#00c696', + 'tiny-mobile-slider-handle-bgcolor': '#fff', + 'tiny-mobile-slider-handle-size': '24px', + 'tiny-mobile-slider-tips-color': '#1890ff', + 'tiny-mobile-slider-tips-border-radius': '2px', + 'tiny-mobile-slider-tips-text-color': '#fff', + 'tiny-mobile-slider-input-font-size': '14px', + 'tiny-mobile-slider-input-color': '#888', + 'tiny-mobile-slider-input-border-color': '#d9d9d9', + 'tiny-mobile-slider-input-border-radius': '2px', + 'tiny-mobile-slider-input-bgcolor': '#fff' +} diff --git a/packages/theme-mobile/src/slider/index.less b/packages/theme-mobile/src/slider/index.less new file mode 100644 index 000000000..ae384829c --- /dev/null +++ b/packages/theme-mobile/src/slider/index.less @@ -0,0 +1,168 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/tip.less'; +@import '../custom.less'; +@import './vars.less'; + +@slider-prefix-cls: ~'@{css-prefix}mobile-slider'; + +.@{slider-prefix-cls} { + position: relative; + height: var(--ti-mobile-slider-track-size, 2px); + margin: 15px 0; + background: var(--ti-mobile-slider-track-bgcolor, #ccc); + width: ~'calc(100% - 89px)'; + display: inline-block; + cursor: pointer; + + &.disabled { + cursor: default; + } + + &.disabled &__handle { + cursor: not-allowed; + } + + &&__vertical { + width: var(--ti-mobile-slider-track-size, 2px); + height: 300px; + display: block; + margin: 0 15px; + + & + .@{slider-prefix-cls}__input { + margin-top: 16px; + line-height: 1; + transform: translateX(-50%); + } + + .@{slider-prefix-cls}__range { + border-radius: 10px; + position: absolute; + z-index: 1; + width: var(--ti-mobile-slider-track-size, 2px); + } + + .@{slider-prefix-cls}__up { + top: 0; + } + + .@{slider-prefix-cls}__down { + bottom: 0; + } + + .@{slider-prefix-cls}__handle { + left: 50%; + transform: translate(-50%, 50%); + margin-left: 0; + } + } + + &__range { + position: absolute; + height: var(--ti-mobile-slider-track-size, 2px); + background: var(--ti-mobile-slider-range-bgcolor, #00c696); + z-index: 1; + } + + &__left { + left: 0; + } + + &__right { + right: 0; + } + + &__handle { + position: absolute; + left: 0; + bottom: 50%; + transform: translateY(50%); + width: var(--ti-mobile-slider-handle-size, 24px); + height: var(--ti-mobile-slider-handle-size, 24px); + border-radius: 50%; + margin-left: -13px; + margin-top: -13px; + outline: none; + background: var(--ti-mobile-slider-handle-bgcolor, #fff); + box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.05), 0 3px 8px 0 rgba(0, 0, 0, 0.2); + user-select: none; + z-index: 2; + cursor: grab; + } + + &__tips { + text-align: center; + font-size: 12px; + margin-top: -3px; + min-width: 30px; + position: absolute; + padding: 0 3px; + height: 22px; + line-height: 183%; + z-index: 1010; + left: -2px; + word-break: normal; // popup-body里面加了默认折行影响到此处需要重置 + white-space: nowrap; // 强制不换行-to liyingfu 纵向进度条上的tips如果内容过多并有空格就会掉下去,此处设置强制显示一行 + background: var(--ti-mobile-slider-tips-color, #1890ff); + border: 1px solid var(--ti-mobile-slider-tips-color, #1890ff); + border-radius: var(--ti-mobile-slider-tips-border-radius, 2px); + color: var(--ti-mobile-slider-tips-text-color, #fff); + + &:before { + margin-left: -6px; + bottom: -6px; + .tip-arrow(50%; auto; 0;); + .tip-make-arrow( + 6px 6px 0 6px; var(--ti-mobile-slider-tips-color, #1890ff) transparent + ); + } + + &:after { + margin-left: -4px; + bottom: -4px; + .tip-arrow(50%; auto; 0;); + .tip-make-arrow( + 4px 4px 0 4px; var(--ti-mobile-slider-tips-color, #1890ff) transparent + ); + } + } + + &__input { + display: inline-block; + line-height: 30px; + vertical-align: top; + margin-left: 16px; + font-size: var(--ti-mobile-slider-input-font-size, 14px); + color: var(--ti-mobile-slider-input-color, #888); + + input { + width: 42px; + height: 30px; + line-height: 30px; + border: 1px solid var(--ti-mobile-slider-input-border-color, #d9d9d9); + border-radius: var(--ti-mobile-slider-input-border-radius, 2px); + color: var(--ti-mobile-slider-input-color, #888); + background: var(--ti-mobile-slider-input-bgcolor, #fff); + font-size: inherit; + padding: 0 8px; + outline: 0; + display: inline-block; + box-sizing: border-box; + text-align: center; + } + } + + &__per { + padding-left: 8px; + } +} diff --git a/packages/theme-mobile/src/slider/vars.less b/packages/theme-mobile/src/slider/vars.less new file mode 100644 index 000000000..d6739a0f5 --- /dev/null +++ b/packages/theme-mobile/src/slider/vars.less @@ -0,0 +1,15 @@ +:root { + --ti-mobile-slider-track-size: 2px; + --ti-mobile-slider-track-bgcolor: #ccc; + --ti-mobile-slider-range-bgcolor: #00c696; + --ti-mobile-slider-handle-bgcolor: #fff; + --ti-mobile-slider-handle-size: 24px; + --ti-mobile-slider-tips-color: #1890ff; + --ti-mobile-slider-tips-border-radius: 2px; + --ti-mobile-slider-tips-text-color: #fff; + --ti-mobile-slider-input-font-size: 14px; + --ti-mobile-slider-input-color: #888; + --ti-mobile-slider-input-border-color: #d9d9d9; + --ti-mobile-slider-input-border-radius: 2px; + --ti-mobile-slider-input-bgcolor: #fff; +} diff --git a/packages/theme-mobile/src/steps/index.js b/packages/theme-mobile/src/steps/index.js new file mode 100644 index 000000000..22120004c --- /dev/null +++ b/packages/theme-mobile/src/steps/index.js @@ -0,0 +1,36 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +export default { + 'tiny-mobile-steps-timeline-date-time-text-color': '#191919', + 'tiny-mobile-steps-advanced-line-height': '28px', + 'tiny-mobile-steps-advanced-li-bg-color': '#fff', + 'tiny-mobile-steps-advanced-active-bg-color': '#4a79fe', + 'tiny-mobile-steps-advanced-li-text-color': '#fff', + 'tiny-mobile-steps-line-bg-color': '#dbdbdb', + 'tiny-mobile-steps-icon-size': '20px', + 'tiny-mobile-steps-icon-bg-color': '#fff', + 'tiny-mobile-steps-unselected-text-color': '#c2c2c2', + 'tiny-mobile-steps-font-size-base': '12px', + 'tiny-mobile-steps-done-text-color': ' #4a79fe', + 'tiny-mobile-steps-done-icon-bg-color': '#fff', + 'tiny-mobile-steps-done-icon-fill-color': '#4a79fe', + 'tiny-mobile-steps-done-active-border-color': '#4a79fe', + 'tiny-mobile-steps-line-active-bg-color': '#4a79fe', + 'tiny-mobile-steps-line-height': '1px', + 'tiny-mobile-steps-timeline-name-font-size': '14px', + 'tiny-mobile-steps-timeline-bg-color-normal': '#fff', + 'tiny-mobile-steps-timeline-bg-color-success': '#5bd475', + 'tiny-mobile-steps-timeline-bg-color-error': '#eb5454', + 'tiny-mobile-steps-timeline-bg-color-handing': '#4a79fe', + 'tiny-mobile-steps-arrow-btn-border-color': '#999', +} diff --git a/packages/theme-mobile/src/steps/index.less b/packages/theme-mobile/src/steps/index.less new file mode 100644 index 000000000..edb6dd558 --- /dev/null +++ b/packages/theme-mobile/src/steps/index.less @@ -0,0 +1,346 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@steps-prefix-cls: ~'@{css-prefix}mobile-steps'; + +.@{steps-prefix-cls} { + .component-css-vars-steps(); + + color: var(--ti-mobile-steps-timeline-date-time-text-color); + + .line { + background: var(--ti-mobile-steps-line-bg-color); + } + + .icon { + width: var(--ti-mobile-steps-icon-size); + height: var(--ti-mobile-steps-icon-size); + line-height: var(--ti-mobile-steps-icon-size); + position: relative; + text-align: center; + left: ~'calc(50% - 10px)'; + top: 4px; + border-radius: 50%; + background: var(--ti-mobile-steps-icon-bg-color); + color: var(--ti-mobile-steps-unselected-text-color); + cursor: pointer; + z-index: 15; + } + + .date-time { + text-align: center; + } + + .node-description { + position: relative; + margin-top: 4px; + overflow: hidden; + text-align: center; + + .name { + font-size: var(--ti-mobile-steps-font-size-base); + float: left; + width: 100%; + } + + .status { + font-size: var(--ti-mobile-steps-font-size-base); + float: left; + width: 100%; + } + } + + .process-done { + .node-description { + color: var(--ti-mobile-steps-done-text-color); + } + + .icon { + background: var(--ti-mobile-steps-done-icon-bg-color); + color: var(--ti-mobile-steps-done-icon-fill-color); + width: var(--ti-mobile-steps-icon-size); + height: var(--ti-mobile-steps-icon-size); + line-height: var(--ti-mobile-steps-icon-size); + font-size: var(--ti-mobile-steps-icon-size); + + .@{css-prefix}svg { + fill: var(--ti-mobile-steps-done-icon-fill-color); + vertical-align: baseline; + border: 1px solid var(--ti-mobile-steps-done-active-border-color); + border-radius: 50%; + padding: 2px; + } + } + + .line { + background: var(--ti-mobile-steps-line-active-bg-color); + } + } + + .process-current { + .node-description { + color: var(--ti-mobile-steps-done-text-color); + } + + .icon { + border: none; + background: var(--ti-mobile-steps-advanced-active-bg-color); + color: var(--ti-mobile-steps-advanced-li-text-color); + font-size: var(--ti-mobile-steps-font-size-base); + } + } + + .process-wait { + .icon { + border: 1px solid var(--ti-mobile-steps-unselected-text-color); + box-sizing: border-box; + font-size: var(--ti-mobile-steps-font-size-base); + } + } + + .reverse { + .process-current { + .line { + background: var(--ti-mobile-steps-line-active-bg-color); + } + } + } + + & &-normal { + overflow: hidden; + + .normal { + display: block; + float: left; + } + + .line { + height: var(--ti-mobile-steps-line-height); + left: 50%; + top: -6px; + position: relative; + } + + .line-end { + width: 0; + } + + .process-done { + .line { + background: var(--ti-mobile-steps-line-active-bg-color); + } + } + + .process-current { + .name { + color: var(--ti-mobile-steps-advanced-active-bg-color); + font-weight: bold; + } + } + + .icon { + font-weight: 600; + span { + display: inline-block; + } + } + } + + & &-timeline { + overflow: hidden; + font-size: var(--ti-mobile-steps-timeline-name-font-size); + color: var(--ti-mobile-steps-timeline-date-time-text-color); + + .timeline { + li { + position: relative; + } + + .header { + display: flex; + align-items: center; + font-weight: 500; + + .date-time-vertical { + width: 100px; + font-size: 10px; + line-height: 1.2; + text-align: right; + padding-right: 10px; + box-sizing: border-box; + } + + .round { + position: relative; + height: 100%; + width: 7px; + height: 7px; + border-radius: 50%; + z-index: 10; + + &-normal { + border: 1px solid var(--ti-mobile-steps-unselected-text-color); + box-sizing: border-box; + background: var(--ti-mobile-steps-timeline-bg-color-normal); + } + + &-success { + background: var(--ti-mobile-steps-timeline-bg-color-success); + } + + &-error { + background: var(--ti-mobile-steps-timeline-bg-color-error); + } + + &-handing { + background: var(--ti-mobile-steps-timeline-bg-color-handing); + } + } + + .name { + margin-left: 12px; + height: 36px; + line-height: 36px; + } + + .arrow-btn { + position: absolute; + cursor: pointer; + right: 16px; + width: 20px; + height: 20px; + display: flex; + justify-content: center; + align-items: center; + + &-arrow { + width: 8px; + height: 8px; + border-color: var(--ti-mobile-steps-arrow-btn-border-color); + border-style: solid; + border-width: 2px 2px 0 0; + transform: rotate(-45deg); + &-fold { + transform: rotate(135deg); + } + } + } + } + + .content { + margin-left: 19px; + margin-right: 10px; + &-left-margin { + margin-left: 119px; + } + } + + .line { + width: var(--ti-mobile-steps-line-height); + position: absolute; + left: 3px; + top: 0; + bottom: 0; + z-index: 1; + + .@{css-prefix}svg { + vertical-align: baseline; + } + } + + .line-left-margin { + left: 103px; + } + + &:first-child .line { + top: 18px; + } + + &:last-child .line { + height: 18px; + } + + .date-time { + width: 100px; + float: left; + padding-right: 20px; + text-align: right; + + .time { + display: block; + line-height: 1; + } + + .date { + display: block; + line-height: 1; + margin-bottom: 4px; + } + } + + &.process-done { + color: var(--ti-mobile-steps-done-text-color); + } + + &.process-current { + color: var(--ti-mobile-steps-advanced-active-bg-color); + } + + .name { + float: left; + margin-left: 20px; + line-height: 1.45em; + } + + .icon { + top: 0px; + } + } + } + + &.mobile { + padding-left: 10%; + + .@{steps-prefix-cls}-timeline { + overflow: inherit; + + .@{css-prefix-iconfont} { + font-size: 45px; + } + + .timeline { + .line { + .icon { + width: 45px; + line-height: 45px; + height: 45px; + font-size: var(--ti-mobile-steps-font-size-7); + position: relative; + left: -20px; + } + } + + .name { + margin-left: 30px; + font-size: 26px; + } + + & > div { + margin-left: 20px; + } + } + } + } +} \ No newline at end of file diff --git a/packages/theme-mobile/src/steps/vars.less b/packages/theme-mobile/src/steps/vars.less new file mode 100644 index 000000000..f0cd39c38 --- /dev/null +++ b/packages/theme-mobile/src/steps/vars.less @@ -0,0 +1,36 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-steps() { + --ti-mobile-steps-timeline-date-time-text-color: var(--ti-mobile-common-color-text-primary, #191919); + --ti-mobile-steps-advanced-line-height: 28px; + --ti-mobile-steps-advanced-li-bg-color: var(--ti-mobile-common-bg-color-white, #fff); + --ti-mobile-steps-advanced-active-bg-color: var(--ti-mobile-common-bg-color-main, #4a79fe); + --ti-mobile-steps-advanced-li-text-color: var(--ti-mobile-common-color-text-white, #fff); + --ti-mobile-steps-line-bg-color: var(--ti-mobile-common-bg-color-weaken, #dbdbdb); + --ti-mobile-steps-icon-size: 20px; + --ti-mobile-steps-icon-bg-color: var(--ti-mobile-common-bg-color-white, #fff); + --ti-mobile-steps-unselected-text-color: var(--ti-mobile-common-color-text-weaken-ligtht, #c2c2c2); + --ti-mobile-steps-font-size-base: 12px; + --ti-mobile-steps-done-text-color: var(--ti-mobile-common-color-text-high-light, #4a79fe); + --ti-mobile-steps-done-icon-bg-color: var(--ti-mobile-common-bg-color-white, #fff); + --ti-mobile-steps-done-icon-fill-color: var(--ti-mobile-common-bg-color-main, #4a79fe); + --ti-mobile-steps-done-active-border-color: var(--ti-mobile-common-bg-color-main, #4a79fe); + --ti-mobile-steps-line-active-bg-color: var(--ti-mobile-common-bg-color-main, #4a79fe); + --ti-mobile-steps-line-height: 1px; + --ti-mobile-steps-timeline-name-font-size: 14px; + --ti-mobile-steps-timeline-bg-color-normal: var(--ti-mobile-common-status-bg-color-normal, #fff); + --ti-mobile-steps-timeline-bg-color-success: var(--ti-mobile-common-status-bg-color-success, #5bd475); + --ti-mobile-steps-timeline-bg-color-error: var(--ti-mobile-common-status-bg-color-error, #eb5454); + --ti-mobile-steps-timeline-bg-color-handing: var(--ti-mobile-common-status-bg-color-handing, #4a79fe); + --ti-mobile-steps-arrow-btn-border-color: var(--ti-mobile-common-color-text-weaken-dark, #999); +} diff --git a/packages/theme-mobile/src/svg/index.js b/packages/theme-mobile/src/svg/index.js new file mode 100644 index 000000000..58a773beb --- /dev/null +++ b/packages/theme-mobile/src/svg/index.js @@ -0,0 +1,3 @@ +export default { + // mobile/svg +} diff --git a/packages/theme-mobile/src/svg/index.less b/packages/theme-mobile/src/svg/index.less new file mode 100644 index 000000000..20def8877 --- /dev/null +++ b/packages/theme-mobile/src/svg/index.less @@ -0,0 +1,23 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{svg-prefix-cls} { + width: 1em; + height: 1em; + vertical-align: middle; + overflow: hidden; + display: inline-block; +} diff --git a/packages/theme-mobile/src/svgs/administrator.svg b/packages/theme-mobile/src/svgs/administrator.svg new file mode 100644 index 000000000..3f6bdb863 --- /dev/null +++ b/packages/theme-mobile/src/svgs/administrator.svg @@ -0,0 +1 @@ + diff --git a/packages/theme-mobile/src/svgs/area-chart.svg b/packages/theme-mobile/src/svgs/area-chart.svg new file mode 100644 index 000000000..8ab6f17e5 --- /dev/null +++ b/packages/theme-mobile/src/svgs/area-chart.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/arrow-down.svg b/packages/theme-mobile/src/svgs/arrow-down.svg new file mode 100644 index 000000000..cf8e2b0b7 --- /dev/null +++ b/packages/theme-mobile/src/svgs/arrow-down.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/arrow-left.svg b/packages/theme-mobile/src/svgs/arrow-left.svg new file mode 100644 index 000000000..fe7c6bb7c --- /dev/null +++ b/packages/theme-mobile/src/svgs/arrow-left.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/arrow-right.svg b/packages/theme-mobile/src/svgs/arrow-right.svg new file mode 100644 index 000000000..4b27a91cb --- /dev/null +++ b/packages/theme-mobile/src/svgs/arrow-right.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/arrow-up.svg b/packages/theme-mobile/src/svgs/arrow-up.svg new file mode 100644 index 000000000..1a26f2a0e --- /dev/null +++ b/packages/theme-mobile/src/svgs/arrow-up.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/ascending.svg b/packages/theme-mobile/src/svgs/ascending.svg new file mode 100644 index 000000000..9d52dbbfa --- /dev/null +++ b/packages/theme-mobile/src/svgs/ascending.svg @@ -0,0 +1,10 @@ + + + + + + diff --git a/packages/theme-mobile/src/svgs/association.svg b/packages/theme-mobile/src/svgs/association.svg new file mode 100644 index 000000000..a37f9822e --- /dev/null +++ b/packages/theme-mobile/src/svgs/association.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/attachment.svg b/packages/theme-mobile/src/svgs/attachment.svg new file mode 100644 index 000000000..9c149da2b --- /dev/null +++ b/packages/theme-mobile/src/svgs/attachment.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/bar-chart.svg b/packages/theme-mobile/src/svgs/bar-chart.svg new file mode 100644 index 000000000..4bab1508d --- /dev/null +++ b/packages/theme-mobile/src/svgs/bar-chart.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/befilter.svg b/packages/theme-mobile/src/svgs/befilter.svg new file mode 100644 index 000000000..21dd255ad --- /dev/null +++ b/packages/theme-mobile/src/svgs/befilter.svg @@ -0,0 +1,11 @@ + + + + + + + diff --git a/packages/theme-mobile/src/svgs/boat.svg b/packages/theme-mobile/src/svgs/boat.svg new file mode 100644 index 000000000..8ee8ea446 --- /dev/null +++ b/packages/theme-mobile/src/svgs/boat.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/busy.svg b/packages/theme-mobile/src/svgs/busy.svg new file mode 100644 index 000000000..285ea1788 --- /dev/null +++ b/packages/theme-mobile/src/svgs/busy.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/calculator.svg b/packages/theme-mobile/src/svgs/calculator.svg new file mode 100644 index 000000000..c55b68319 --- /dev/null +++ b/packages/theme-mobile/src/svgs/calculator.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/calendar.svg b/packages/theme-mobile/src/svgs/calendar.svg new file mode 100644 index 000000000..ab63e558d --- /dev/null +++ b/packages/theme-mobile/src/svgs/calendar.svg @@ -0,0 +1,26 @@ + + + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/check-out.svg b/packages/theme-mobile/src/svgs/check-out.svg new file mode 100644 index 000000000..6febeb22f --- /dev/null +++ b/packages/theme-mobile/src/svgs/check-out.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/check.svg b/packages/theme-mobile/src/svgs/check.svg new file mode 100644 index 000000000..120ccd9e3 --- /dev/null +++ b/packages/theme-mobile/src/svgs/check.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/checked-linear.svg b/packages/theme-mobile/src/svgs/checked-linear.svg new file mode 100644 index 000000000..16abe1722 --- /dev/null +++ b/packages/theme-mobile/src/svgs/checked-linear.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/checked-sur.svg b/packages/theme-mobile/src/svgs/checked-sur.svg new file mode 100644 index 000000000..42cdf7687 --- /dev/null +++ b/packages/theme-mobile/src/svgs/checked-sur.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/checked-true.svg b/packages/theme-mobile/src/svgs/checked-true.svg new file mode 100644 index 000000000..ce30dfa7c --- /dev/null +++ b/packages/theme-mobile/src/svgs/checked-true.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/chevron-down.svg b/packages/theme-mobile/src/svgs/chevron-down.svg new file mode 100644 index 000000000..341cc9b8e --- /dev/null +++ b/packages/theme-mobile/src/svgs/chevron-down.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/chevron-left.svg b/packages/theme-mobile/src/svgs/chevron-left.svg new file mode 100644 index 000000000..c5c6500e7 --- /dev/null +++ b/packages/theme-mobile/src/svgs/chevron-left.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/chevron-right.svg b/packages/theme-mobile/src/svgs/chevron-right.svg new file mode 100644 index 000000000..28e1f7e12 --- /dev/null +++ b/packages/theme-mobile/src/svgs/chevron-right.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/chevron-up.svg b/packages/theme-mobile/src/svgs/chevron-up.svg new file mode 100644 index 000000000..ff2dd28a3 --- /dev/null +++ b/packages/theme-mobile/src/svgs/chevron-up.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/clear-filter.svg b/packages/theme-mobile/src/svgs/clear-filter.svg new file mode 100644 index 000000000..2f3ddcb0a --- /dev/null +++ b/packages/theme-mobile/src/svgs/clear-filter.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/clock-work.svg b/packages/theme-mobile/src/svgs/clock-work.svg new file mode 100644 index 000000000..71fd1da98 --- /dev/null +++ b/packages/theme-mobile/src/svgs/clock-work.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/close-circle.svg b/packages/theme-mobile/src/svgs/close-circle.svg new file mode 100644 index 000000000..3d5fd97fa --- /dev/null +++ b/packages/theme-mobile/src/svgs/close-circle.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/close-square.svg b/packages/theme-mobile/src/svgs/close-square.svg new file mode 100644 index 000000000..45cc399be --- /dev/null +++ b/packages/theme-mobile/src/svgs/close-square.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/close.svg b/packages/theme-mobile/src/svgs/close.svg new file mode 100644 index 000000000..3d2a6bb5b --- /dev/null +++ b/packages/theme-mobile/src/svgs/close.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/cloud-download.svg b/packages/theme-mobile/src/svgs/cloud-download.svg new file mode 100644 index 000000000..a3e1e0504 --- /dev/null +++ b/packages/theme-mobile/src/svgs/cloud-download.svg @@ -0,0 +1,27 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/cloud-upload.svg b/packages/theme-mobile/src/svgs/cloud-upload.svg new file mode 100644 index 000000000..48f7430cd --- /dev/null +++ b/packages/theme-mobile/src/svgs/cloud-upload.svg @@ -0,0 +1,27 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/coin.svg b/packages/theme-mobile/src/svgs/coin.svg new file mode 100644 index 000000000..e4005126b --- /dev/null +++ b/packages/theme-mobile/src/svgs/coin.svg @@ -0,0 +1 @@ +> \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/commission.svg b/packages/theme-mobile/src/svgs/commission.svg new file mode 100644 index 000000000..fea73918e --- /dev/null +++ b/packages/theme-mobile/src/svgs/commission.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/conment-refresh.svg b/packages/theme-mobile/src/svgs/conment-refresh.svg new file mode 100644 index 000000000..7a9728345 --- /dev/null +++ b/packages/theme-mobile/src/svgs/conment-refresh.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/copy.svg b/packages/theme-mobile/src/svgs/copy.svg new file mode 100644 index 000000000..6cc0c5577 --- /dev/null +++ b/packages/theme-mobile/src/svgs/copy.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/course.svg b/packages/theme-mobile/src/svgs/course.svg new file mode 100644 index 000000000..f3a6a83c0 --- /dev/null +++ b/packages/theme-mobile/src/svgs/course.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/cue-l.svg b/packages/theme-mobile/src/svgs/cue-l.svg new file mode 100644 index 000000000..0cbaed27b --- /dev/null +++ b/packages/theme-mobile/src/svgs/cue-l.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/custom.svg b/packages/theme-mobile/src/svgs/custom.svg new file mode 100644 index 000000000..b2f28fec2 --- /dev/null +++ b/packages/theme-mobile/src/svgs/custom.svg @@ -0,0 +1,11 @@ + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/customer-service.svg b/packages/theme-mobile/src/svgs/customer-service.svg new file mode 100644 index 000000000..b1ead8e6d --- /dev/null +++ b/packages/theme-mobile/src/svgs/customer-service.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/default.svg b/packages/theme-mobile/src/svgs/default.svg new file mode 100644 index 000000000..a349dd45b --- /dev/null +++ b/packages/theme-mobile/src/svgs/default.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/defined-filtration.svg b/packages/theme-mobile/src/svgs/defined-filtration.svg new file mode 100644 index 000000000..f32d39123 --- /dev/null +++ b/packages/theme-mobile/src/svgs/defined-filtration.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/del.svg b/packages/theme-mobile/src/svgs/del.svg new file mode 100644 index 000000000..f9697a9f5 --- /dev/null +++ b/packages/theme-mobile/src/svgs/del.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/delete-page.svg b/packages/theme-mobile/src/svgs/delete-page.svg new file mode 100644 index 000000000..91c7af5d5 --- /dev/null +++ b/packages/theme-mobile/src/svgs/delete-page.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/deleted.svg b/packages/theme-mobile/src/svgs/deleted.svg new file mode 100644 index 000000000..cf62ef36d --- /dev/null +++ b/packages/theme-mobile/src/svgs/deleted.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/delta-down-o.svg b/packages/theme-mobile/src/svgs/delta-down-o.svg new file mode 100644 index 000000000..f7cc74089 --- /dev/null +++ b/packages/theme-mobile/src/svgs/delta-down-o.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/delta-down.svg b/packages/theme-mobile/src/svgs/delta-down.svg new file mode 100644 index 000000000..38df8b779 --- /dev/null +++ b/packages/theme-mobile/src/svgs/delta-down.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/delta-left-o.svg b/packages/theme-mobile/src/svgs/delta-left-o.svg new file mode 100644 index 000000000..7c5f5d2c5 --- /dev/null +++ b/packages/theme-mobile/src/svgs/delta-left-o.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/delta-left.svg b/packages/theme-mobile/src/svgs/delta-left.svg new file mode 100644 index 000000000..c372778fb --- /dev/null +++ b/packages/theme-mobile/src/svgs/delta-left.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/delta-right-o.svg b/packages/theme-mobile/src/svgs/delta-right-o.svg new file mode 100644 index 000000000..7443f76af --- /dev/null +++ b/packages/theme-mobile/src/svgs/delta-right-o.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/delta-right.svg b/packages/theme-mobile/src/svgs/delta-right.svg new file mode 100644 index 000000000..403b335b0 --- /dev/null +++ b/packages/theme-mobile/src/svgs/delta-right.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/delta-up-o.svg b/packages/theme-mobile/src/svgs/delta-up-o.svg new file mode 100644 index 000000000..8ba5932fb --- /dev/null +++ b/packages/theme-mobile/src/svgs/delta-up-o.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/delta-up.svg b/packages/theme-mobile/src/svgs/delta-up.svg new file mode 100644 index 000000000..0878141a9 --- /dev/null +++ b/packages/theme-mobile/src/svgs/delta-up.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/derive.svg b/packages/theme-mobile/src/svgs/derive.svg new file mode 100644 index 000000000..88cdd1c15 --- /dev/null +++ b/packages/theme-mobile/src/svgs/derive.svg @@ -0,0 +1,17 @@ + + + + Icon/导出 + Created with Sketch. + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/descending.svg b/packages/theme-mobile/src/svgs/descending.svg new file mode 100644 index 000000000..856275b6e --- /dev/null +++ b/packages/theme-mobile/src/svgs/descending.svg @@ -0,0 +1,10 @@ + + + + + + diff --git a/packages/theme-mobile/src/svgs/dialog.svg b/packages/theme-mobile/src/svgs/dialog.svg new file mode 100644 index 000000000..9d2ca13c4 --- /dev/null +++ b/packages/theme-mobile/src/svgs/dialog.svg @@ -0,0 +1,23 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/dialog2.svg b/packages/theme-mobile/src/svgs/dialog2.svg new file mode 100644 index 000000000..fd1215d4b --- /dev/null +++ b/packages/theme-mobile/src/svgs/dialog2.svg @@ -0,0 +1,19 @@ + + + + Icon/对话2 + Created with Sketch. + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/dot-chart.svg b/packages/theme-mobile/src/svgs/dot-chart.svg new file mode 100644 index 000000000..89361f39c --- /dev/null +++ b/packages/theme-mobile/src/svgs/dot-chart.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/dot-ipv4.svg b/packages/theme-mobile/src/svgs/dot-ipv4.svg new file mode 100644 index 000000000..6ccdd99b4 --- /dev/null +++ b/packages/theme-mobile/src/svgs/dot-ipv4.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/double-left.svg b/packages/theme-mobile/src/svgs/double-left.svg new file mode 100644 index 000000000..dbaf2f3f1 --- /dev/null +++ b/packages/theme-mobile/src/svgs/double-left.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/double-right.svg b/packages/theme-mobile/src/svgs/double-right.svg new file mode 100644 index 000000000..948e407a4 --- /dev/null +++ b/packages/theme-mobile/src/svgs/double-right.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/down-o.svg b/packages/theme-mobile/src/svgs/down-o.svg new file mode 100644 index 000000000..f7cc74089 --- /dev/null +++ b/packages/theme-mobile/src/svgs/down-o.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/down.svg b/packages/theme-mobile/src/svgs/down.svg new file mode 100644 index 000000000..1ab365f65 --- /dev/null +++ b/packages/theme-mobile/src/svgs/down.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/download-cloud.svg b/packages/theme-mobile/src/svgs/download-cloud.svg new file mode 100644 index 000000000..31a932bec --- /dev/null +++ b/packages/theme-mobile/src/svgs/download-cloud.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/download-link.svg b/packages/theme-mobile/src/svgs/download-link.svg new file mode 100644 index 000000000..da11ddae9 --- /dev/null +++ b/packages/theme-mobile/src/svgs/download-link.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/download.svg b/packages/theme-mobile/src/svgs/download.svg new file mode 100644 index 000000000..48ee88680 --- /dev/null +++ b/packages/theme-mobile/src/svgs/download.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/edit.svg b/packages/theme-mobile/src/svgs/edit.svg new file mode 100644 index 000000000..74b391420 --- /dev/null +++ b/packages/theme-mobile/src/svgs/edit.svg @@ -0,0 +1,12 @@ + + + + Icon/笔 + Created with Sketch. + + + + + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/editor-tab.svg b/packages/theme-mobile/src/svgs/editor-tab.svg new file mode 100644 index 000000000..34ec5f324 --- /dev/null +++ b/packages/theme-mobile/src/svgs/editor-tab.svg @@ -0,0 +1,11 @@ + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/ellipsis.svg b/packages/theme-mobile/src/svgs/ellipsis.svg new file mode 100644 index 000000000..113f37c42 --- /dev/null +++ b/packages/theme-mobile/src/svgs/ellipsis.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/email-add.svg b/packages/theme-mobile/src/svgs/email-add.svg new file mode 100644 index 000000000..acb2ca4d7 --- /dev/null +++ b/packages/theme-mobile/src/svgs/email-add.svg @@ -0,0 +1,18 @@ + + + + Icon/邮件 + Created with Sketch. + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/email-circle.svg b/packages/theme-mobile/src/svgs/email-circle.svg new file mode 100644 index 000000000..92a57df27 --- /dev/null +++ b/packages/theme-mobile/src/svgs/email-circle.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/end.svg b/packages/theme-mobile/src/svgs/end.svg new file mode 100644 index 000000000..95db4e419 --- /dev/null +++ b/packages/theme-mobile/src/svgs/end.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/error.svg b/packages/theme-mobile/src/svgs/error.svg new file mode 100644 index 000000000..78defc29f --- /dev/null +++ b/packages/theme-mobile/src/svgs/error.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/espace-auto.svg b/packages/theme-mobile/src/svgs/espace-auto.svg new file mode 100644 index 000000000..ddb0b1c7b --- /dev/null +++ b/packages/theme-mobile/src/svgs/espace-auto.svg @@ -0,0 +1,24 @@ + + + + +Icon/espace +Created with Sketch. +Icon/espace +Created with Sketch. + + diff --git a/packages/theme-mobile/src/svgs/espace.svg b/packages/theme-mobile/src/svgs/espace.svg new file mode 100644 index 000000000..7bacc16e0 --- /dev/null +++ b/packages/theme-mobile/src/svgs/espace.svg @@ -0,0 +1,16 @@ + + + + Icon/espace + Created with Sketch. + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/excel.svg b/packages/theme-mobile/src/svgs/excel.svg new file mode 100644 index 000000000..c9f5527b5 --- /dev/null +++ b/packages/theme-mobile/src/svgs/excel.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/exception.svg b/packages/theme-mobile/src/svgs/exception.svg new file mode 100644 index 000000000..cf74518a5 --- /dev/null +++ b/packages/theme-mobile/src/svgs/exception.svg @@ -0,0 +1,25 @@ + + + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/exclamation.svg b/packages/theme-mobile/src/svgs/exclamation.svg new file mode 100644 index 000000000..5e43e72bc --- /dev/null +++ b/packages/theme-mobile/src/svgs/exclamation.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/export.svg b/packages/theme-mobile/src/svgs/export.svg new file mode 100644 index 000000000..de3855105 --- /dev/null +++ b/packages/theme-mobile/src/svgs/export.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/express-search.svg b/packages/theme-mobile/src/svgs/express-search.svg new file mode 100644 index 000000000..f70c15707 --- /dev/null +++ b/packages/theme-mobile/src/svgs/express-search.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/eyeclose.svg b/packages/theme-mobile/src/svgs/eyeclose.svg new file mode 100644 index 000000000..a3a05ddf9 --- /dev/null +++ b/packages/theme-mobile/src/svgs/eyeclose.svg @@ -0,0 +1,18 @@ + + + + + + diff --git a/packages/theme-mobile/src/svgs/eyeopen.svg b/packages/theme-mobile/src/svgs/eyeopen.svg new file mode 100644 index 000000000..7df74e32a --- /dev/null +++ b/packages/theme-mobile/src/svgs/eyeopen.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/file-cloudupload.svg b/packages/theme-mobile/src/svgs/file-cloudupload.svg new file mode 100644 index 000000000..0a3a3cf98 --- /dev/null +++ b/packages/theme-mobile/src/svgs/file-cloudupload.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/file-excel.svg b/packages/theme-mobile/src/svgs/file-excel.svg new file mode 100644 index 000000000..63d2d3907 --- /dev/null +++ b/packages/theme-mobile/src/svgs/file-excel.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/file.svg b/packages/theme-mobile/src/svgs/file.svg new file mode 100644 index 000000000..45403a269 --- /dev/null +++ b/packages/theme-mobile/src/svgs/file.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/files-circle.svg b/packages/theme-mobile/src/svgs/files-circle.svg new file mode 100644 index 000000000..d4b3eca5f --- /dev/null +++ b/packages/theme-mobile/src/svgs/files-circle.svg @@ -0,0 +1,30 @@ + + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/files.svg b/packages/theme-mobile/src/svgs/files.svg new file mode 100644 index 000000000..7e0fa644a --- /dev/null +++ b/packages/theme-mobile/src/svgs/files.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/filetext.svg b/packages/theme-mobile/src/svgs/filetext.svg new file mode 100644 index 000000000..c0e67f0f4 --- /dev/null +++ b/packages/theme-mobile/src/svgs/filetext.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/fileupload.svg b/packages/theme-mobile/src/svgs/fileupload.svg new file mode 100644 index 000000000..268b3aef6 --- /dev/null +++ b/packages/theme-mobile/src/svgs/fileupload.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/filtered.svg b/packages/theme-mobile/src/svgs/filtered.svg new file mode 100644 index 000000000..17631ec10 --- /dev/null +++ b/packages/theme-mobile/src/svgs/filtered.svg @@ -0,0 +1,12 @@ + + + + Icon/筛选5 + Created with Sketch. + + + + + diff --git a/packages/theme-mobile/src/svgs/flag.svg b/packages/theme-mobile/src/svgs/flag.svg new file mode 100644 index 000000000..23ffbe405 --- /dev/null +++ b/packages/theme-mobile/src/svgs/flag.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/folder-closed.svg b/packages/theme-mobile/src/svgs/folder-closed.svg new file mode 100644 index 000000000..31169739e --- /dev/null +++ b/packages/theme-mobile/src/svgs/folder-closed.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/folder-opened.svg b/packages/theme-mobile/src/svgs/folder-opened.svg new file mode 100644 index 000000000..c23d9825e --- /dev/null +++ b/packages/theme-mobile/src/svgs/folder-opened.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/freeze-left.svg b/packages/theme-mobile/src/svgs/freeze-left.svg new file mode 100644 index 000000000..5e731f8d1 --- /dev/null +++ b/packages/theme-mobile/src/svgs/freeze-left.svg @@ -0,0 +1,40 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/freeze-right.svg b/packages/theme-mobile/src/svgs/freeze-right.svg new file mode 100644 index 000000000..87072717f --- /dev/null +++ b/packages/theme-mobile/src/svgs/freeze-right.svg @@ -0,0 +1,41 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/frown-o.svg b/packages/theme-mobile/src/svgs/frown-o.svg new file mode 100644 index 000000000..5960bac0b --- /dev/null +++ b/packages/theme-mobile/src/svgs/frown-o.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/frown.svg b/packages/theme-mobile/src/svgs/frown.svg new file mode 100644 index 000000000..33fcbdef0 --- /dev/null +++ b/packages/theme-mobile/src/svgs/frown.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/fullscreen.svg b/packages/theme-mobile/src/svgs/fullscreen.svg new file mode 100644 index 000000000..95eaa0f82 --- /dev/null +++ b/packages/theme-mobile/src/svgs/fullscreen.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/grade.svg b/packages/theme-mobile/src/svgs/grade.svg new file mode 100644 index 000000000..3060f7a23 --- /dev/null +++ b/packages/theme-mobile/src/svgs/grade.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/group-transfer.svg b/packages/theme-mobile/src/svgs/group-transfer.svg new file mode 100644 index 000000000..9345e13d1 --- /dev/null +++ b/packages/theme-mobile/src/svgs/group-transfer.svg @@ -0,0 +1,21 @@ + + + + Group 36 + Created with Sketch. + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/group.svg b/packages/theme-mobile/src/svgs/group.svg new file mode 100644 index 000000000..6d0beeb8b --- /dev/null +++ b/packages/theme-mobile/src/svgs/group.svg @@ -0,0 +1,24 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/halfchecked.svg b/packages/theme-mobile/src/svgs/halfchecked.svg new file mode 100644 index 000000000..9225076e5 --- /dev/null +++ b/packages/theme-mobile/src/svgs/halfchecked.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/halfselect.svg b/packages/theme-mobile/src/svgs/halfselect.svg new file mode 100644 index 000000000..20cf60ae3 --- /dev/null +++ b/packages/theme-mobile/src/svgs/halfselect.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/heartempty.svg b/packages/theme-mobile/src/svgs/heartempty.svg new file mode 100644 index 000000000..ef739a47b --- /dev/null +++ b/packages/theme-mobile/src/svgs/heartempty.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/help-circle.svg b/packages/theme-mobile/src/svgs/help-circle.svg new file mode 100644 index 000000000..db4cad0d2 --- /dev/null +++ b/packages/theme-mobile/src/svgs/help-circle.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/help-query.svg b/packages/theme-mobile/src/svgs/help-query.svg new file mode 100644 index 000000000..aaefaf323 --- /dev/null +++ b/packages/theme-mobile/src/svgs/help-query.svg @@ -0,0 +1,18 @@ + + + + Icon/帮助 + Created with Sketch. + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/help-solid.svg b/packages/theme-mobile/src/svgs/help-solid.svg new file mode 100644 index 000000000..1a4b97b44 --- /dev/null +++ b/packages/theme-mobile/src/svgs/help-solid.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/help.svg b/packages/theme-mobile/src/svgs/help.svg new file mode 100644 index 000000000..c13fe956b --- /dev/null +++ b/packages/theme-mobile/src/svgs/help.svg @@ -0,0 +1,15 @@ + + + + Icon/Error Copy 3 + Created with Sketch. + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/helpful.svg b/packages/theme-mobile/src/svgs/helpful.svg new file mode 100644 index 000000000..e7882b826 --- /dev/null +++ b/packages/theme-mobile/src/svgs/helpful.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/import.svg b/packages/theme-mobile/src/svgs/import.svg new file mode 100644 index 000000000..fc53d87fb --- /dev/null +++ b/packages/theme-mobile/src/svgs/import.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/index.js b/packages/theme-mobile/src/svgs/index.js new file mode 100644 index 000000000..b36fa9aa1 --- /dev/null +++ b/packages/theme-mobile/src/svgs/index.js @@ -0,0 +1,448 @@ +import IconAdministrator from './administrator.svg' +import IconAreaChart from './area-chart.svg' +import IconArrowDown from './arrow-down.svg' +import IconArrowLeft from './arrow-left.svg' +import IconArrowRight from './arrow-right.svg' +import IconArrowUp from './arrow-up.svg' +import IconAscending from './ascending.svg' +import IconAssociation from './association.svg' +import IconAttachment from './attachment.svg' +import IconBarChart from './bar-chart.svg' +import IconBefilter from './befilter.svg' +import IconBoat from './boat.svg' +import IconBusy from './busy.svg' +import IconCalculator from './calculator.svg' +import IconCalendar from './calendar.svg' +import IconCheckOut from './check-out.svg' +import IconCheck from './check.svg' +import IconCheckedLinear from './checked-linear.svg' +import IconCheckedSur from './checked-sur.svg' +import IconCheckedTrue from './checked-true.svg' +import IconChevronDown from './chevron-down.svg' +import IconChevronLeft from './chevron-left.svg' +import IconChevronRight from './chevron-right.svg' +import IconChevronUp from './chevron-up.svg' +import IconClearFilter from './clear-filter.svg' +import IconClockWork from './clock-work.svg' +import IconCloseCircle from './close-circle.svg' +import IconCloseSquare from './close-square.svg' +import IconClose from './close.svg' +import IconCloudDownload from './cloud-download.svg' +import IconCloudUpload from './cloud-upload.svg' +import IconCoin from './coin.svg' +import IconCommission from './commission.svg' +import IconConmentRefresh from './conment-refresh.svg' +import IconCopy from './copy.svg' +import IconCourse from './course.svg' +import IconCueL from './cue-l.svg' +import IconCustom from './custom.svg' +import IconCustomerService from './customer-service.svg' +import IconDefault from './default.svg' +import IconDefinedFiltration from './defined-filtration.svg' +import IconDel from './del.svg' +import IconDeletePage from './delete-page.svg' +import IconDeleted from './deleted.svg' +import IconDeltaDownO from './delta-down-o.svg' +import IconDeltaDown from './delta-down.svg' +import IconDeltaLeftO from './delta-left-o.svg' +import IconDeltaLeft from './delta-left.svg' +import IconDeltaRightO from './delta-right-o.svg' +import IconDeltaRight from './delta-right.svg' +import IconDeltaUpO from './delta-up-o.svg' +import IconDeltaUp from './delta-up.svg' +import IconDerive from './derive.svg' +import IconDescending from './descending.svg' +import IconDialog from './dialog.svg' +import IconDialog2 from './dialog2.svg' +import IconDotChart from './dot-chart.svg' +import IconDotIpv4 from './dot-ipv4.svg' +import IconDoubleLeft from './double-left.svg' +import IconDoubleRight from './double-right.svg' +import IconDownO from './down-o.svg' +import IconDown from './down.svg' +import IconDownloadCloud from './download-cloud.svg' +import IconDownloadLink from './download-link.svg' +import IconDownload from './download.svg' +import IconEdit from './edit.svg' +import IconEditorTab from './editor-tab.svg' +import IconEllipsis from './ellipsis.svg' +import IconEmailAdd from './email-add.svg' +import IconEmailCircle from './email-circle.svg' +import IconEnd from './end.svg' +import IconError from './error.svg' +import IconEspaceAuto from './espace-auto.svg' +import IconEspace from './espace.svg' +import IconExcel from './excel.svg' +import IconException from './exception.svg' +import IconExclamation from './exclamation.svg' +import IconExport from './export.svg' +import IconExpressSearch from './express-search.svg' +import IconEyeclose from './eyeclose.svg' +import IconEyeopen from './eyeopen.svg' +import IconFileCloudupload from './file-cloudupload.svg' +import IconFileExcel from './file-excel.svg' +import IconFile from './file.svg' +import IconFilesCircle from './files-circle.svg' +import IconFiles from './files.svg' +import IconFiletext from './filetext.svg' +import IconFileupload from './fileupload.svg' +import IconFiltered from './filtered.svg' +import IconFlag from './flag.svg' +import IconFolderClosed from './folder-closed.svg' +import IconFolderOpened from './folder-opened.svg' +import IconFreezeLeft from './freeze-left.svg' +import IconFreezeRight from './freeze-right.svg' +import IconFrownO from './frown-o.svg' +import IconFrown from './frown.svg' +import IconFullscreen from './fullscreen.svg' +import IconGrade from './grade.svg' +import IconGroupTransfer from './group-transfer.svg' +import IconGroup from './group.svg' +import IconHalfchecked from './halfchecked.svg' +import IconHalfselect from './halfselect.svg' +import IconHeartempty from './heartempty.svg' +import IconHelpCircle from './help-circle.svg' +import IconHelpQuery from './help-query.svg' +import IconHelpSolid from './help-solid.svg' +import IconHelp from './help.svg' +import IconHelpful from './helpful.svg' +import IconImport from './import.svg' +import IconInfoCircle from './info-circle.svg' +import IconInfoSolid from './info-solid.svg' +import IconInfo from './info.svg' +import IconInformation from './information.svg' +import IconLeave from './leave.svg' +import IconLeftFrozen from './left-frozen.svg' +import IconLeftO from './left-o.svg' +import IconLeftWard from './left-ward.svg' +import IconLeft from './left.svg' +import IconLineChart from './line-chart.svg' +import IconLink from './link.svg' +import IconLoading from './loading.svg' +import IconLock from './lock.svg' +import IconMailContent from './mail-content.svg' +import IconMail from './mail.svg' +import IconMale from './male.svg' +import IconMarkOn from './mark-on.svg' +import IconMeh from './meh.svg' +import IconMessageCircle from './message-circle.svg' +import IconMinscreen from './minscreen.svg' +import IconMinusCircle from './minus-circle.svg' +import IconMinusSquare from './minus-square.svg' +import IconMinus from './minus.svg' +import IconMobile from './mobile.svg' +import IconMore from './more.svg' +import IconNew from './new.svg' +import IconNoPremission from './no-premission.svg' +import IconNodeOpen from './node-open.svg' +import IconNode from './node.svg' +import IconOffLine from './off-line.svg' +import IconOnLine from './on-line.svg' +import IconOperationfaildL from './operationfaild-l.svg' +import IconOperationfaild from './operationfaild.svg' +import IconOuterLink from './outer-link.svg' +import IconPagelink from './pagelink.svg' +import IconPagerFirst from './pager-first.svg' +import IconPagerLast from './pager-last.svg' +import IconPagerNext from './pager-next.svg' +import IconPagerPrev from './pager-prev.svg' +import IconPanelMax from './panel-max.svg' +import IconPanelMini from './panel-mini.svg' +import IconPanelNormal from './panel-normal.svg' +import IconPauseCircle from './pause-circle.svg' +import IconPause from './pause.svg' +import IconPicture from './picture.svg' +import IconPieChart from './pie-chart.svg' +import IconPlusCircle from './plus-circle.svg' +import IconPlusSquare from './plus-square.svg' +import IconPlus from './plus.svg' +import IconPopup from './popup.svg' +import IconPreChecked from './pre-checked.svg' +import IconPrintPreview from './print-preview.svg' +import IconPushpin from './pushpin.svg' +import IconRadio from './radio.svg' +import IconRadioselected from './radioselected.svg' +import IconRefres from './refres.svg' +import IconRenew from './renew.svg' +import IconRepeat from './repeat.svg' +import IconReplace from './replace.svg' +import IconReplies from './replies.svg' +import IconRightFrozen from './right-frozen.svg' +import IconRightO from './right-o.svg' +import IconRight from './right.svg' +import IconRightward from './rightward.svg' +import IconSandwichCollapse from './sandwich-collapse.svg' +import IconSandwichExpand from './sandwich-expand.svg' +import IconSave from './save.svg' +import IconScissor from './scissor.svg' +import IconSearch from './search.svg' +import IconSelect from './select.svg' +import IconSent from './sent.svg' +import IconSeparate from './separate.svg' +import IconSetting from './setting.svg' +import IconShare from './share.svg' +import IconShoppingCard from './shopping-card.svg' +import IconSmileO from './smile-o.svg' +import IconSmile from './smile.svg' +import IconSort from './sort.svg' +import IconStarActive from './star-active.svg' +import IconStarDisable from './star-disable.svg' +import IconStarO from './star-o.svg' +import IconStartCircle from './start-circle.svg' +import IconStart from './start.svg' +import IconStatistics from './statistics.svg' +import IconStop from './stop.svg' +import IconSuccess from './success.svg' +import IconSuccessful from './successful.svg' +import IconTaskCooperation from './task-cooperation.svg' +import IconTelephoneCircle from './telephone-circle.svg' +import IconTelephone from './telephone.svg' +import IconTextTab from './text-tab.svg' +import IconText from './text.svg' +import IconTime from './time.svg' +import IconTotal from './total.svg' +import IconTriangleDown from './triangle-down.svg' +import IconUndelete from './undelete.svg' +import IconUnfilter from './unfilter.svg' +import IconUnfreeze from './unfreeze.svg' +import IconUnknow from './unknow.svg' +import IconUnlock from './unlock.svg' +import IconUnsent from './unsent.svg' +import IconUpO from './up-o.svg' +import IconUp from './up.svg' +import IconUpload from './upload.svg' +import IconUser from './user.svg' +import IconVersiontree from './versiontree.svg' +import IconView from './view.svg' +import IconWarningTriangle from './warning-triangle.svg' +import IconWarning from './warning.svg' +import IconWebPlus from './web-plus.svg' +import IconWriting from './writing.svg' +import IconYes from './yes.svg' +import IconZoomIn from './zoom-in.svg' +import IconZoomOut from './zoom-out.svg' +export { + IconAdministrator, + IconAreaChart, + IconArrowDown, + IconArrowLeft, + IconArrowRight, + IconArrowUp, + IconAscending, + IconAssociation, + IconAttachment, + IconBarChart, + IconBefilter, + IconBoat, + IconBusy, + IconCalculator, + IconCalendar, + IconCheckOut, + IconCheck, + IconCheckedLinear, + IconCheckedSur, + IconCheckedTrue, + IconChevronDown, + IconChevronLeft, + IconChevronRight, + IconChevronUp, + IconClearFilter, + IconClockWork, + IconCloseCircle, + IconCloseSquare, + IconClose, + IconCloudDownload, + IconCloudUpload, + IconCoin, + IconCommission, + IconConmentRefresh, + IconCopy, + IconCourse, + IconCueL, + IconCustom, + IconCustomerService, + IconDefault, + IconDefinedFiltration, + IconDel, + IconDeletePage, + IconDeleted, + IconDeltaDownO, + IconDeltaDown, + IconDeltaLeftO, + IconDeltaLeft, + IconDeltaRightO, + IconDeltaRight, + IconDeltaUpO, + IconDeltaUp, + IconDerive, + IconDescending, + IconDialog, + IconDialog2, + IconDotChart, + IconDotIpv4, + IconDoubleLeft, + IconDoubleRight, + IconDownO, + IconDown, + IconDownloadCloud, + IconDownloadLink, + IconDownload, + IconEdit, + IconEditorTab, + IconEllipsis, + IconEmailAdd, + IconEmailCircle, + IconEnd, + IconError, + IconEspaceAuto, + IconEspace, + IconExcel, + IconException, + IconExclamation, + IconExport, + IconExpressSearch, + IconEyeclose, + IconEyeopen, + IconFileCloudupload, + IconFileExcel, + IconFile, + IconFilesCircle, + IconFiles, + IconFiletext, + IconFileupload, + IconFiltered, + IconFlag, + IconFolderClosed, + IconFolderOpened, + IconFreezeLeft, + IconFreezeRight, + IconFrownO, + IconFrown, + IconFullscreen, + IconGrade, + IconGroupTransfer, + IconGroup, + IconHalfchecked, + IconHalfselect, + IconHeartempty, + IconHelpCircle, + IconHelpQuery, + IconHelpSolid, + IconHelp, + IconHelpful, + IconImport, + IconInfoCircle, + IconInfoSolid, + IconInfo, + IconInformation, + IconLeave, + IconLeftFrozen, + IconLeftO, + IconLeftWard, + IconLeft, + IconLineChart, + IconLink, + IconLoading, + IconLock, + IconMailContent, + IconMail, + IconMale, + IconMarkOn, + IconMeh, + IconMessageCircle, + IconMinscreen, + IconMinusCircle, + IconMinusSquare, + IconMinus, + IconMobile, + IconMore, + IconNew, + IconNoPremission, + IconNodeOpen, + IconNode, + IconOffLine, + IconOnLine, + IconOperationfaildL, + IconOperationfaild, + IconOuterLink, + IconPagelink, + IconPagerFirst, + IconPagerLast, + IconPagerNext, + IconPagerPrev, + IconPanelMax, + IconPanelMini, + IconPanelNormal, + IconPauseCircle, + IconPause, + IconPicture, + IconPieChart, + IconPlusCircle, + IconPlusSquare, + IconPlus, + IconPopup, + IconPreChecked, + IconPrintPreview, + IconPushpin, + IconRadio, + IconRadioselected, + IconRefres, + IconRenew, + IconRepeat, + IconReplace, + IconReplies, + IconRightFrozen, + IconRightO, + IconRight, + IconRightward, + IconSandwichCollapse, + IconSandwichExpand, + IconSave, + IconScissor, + IconSearch, + IconSelect, + IconSent, + IconSeparate, + IconSetting, + IconShare, + IconShoppingCard, + IconSmileO, + IconSmile, + IconSort, + IconStarActive, + IconStarDisable, + IconStarO, + IconStartCircle, + IconStart, + IconStatistics, + IconStop, + IconSuccess, + IconSuccessful, + IconTaskCooperation, + IconTelephoneCircle, + IconTelephone, + IconTextTab, + IconText, + IconTime, + IconTotal, + IconTriangleDown, + IconUndelete, + IconUnfilter, + IconUnfreeze, + IconUnknow, + IconUnlock, + IconUnsent, + IconUpO, + IconUp, + IconUpload, + IconUser, + IconVersiontree, + IconView, + IconWarningTriangle, + IconWarning, + IconWebPlus, + IconWriting, + IconYes, + IconZoomIn, + IconZoomOut +} diff --git a/packages/theme-mobile/src/svgs/info-circle.svg b/packages/theme-mobile/src/svgs/info-circle.svg new file mode 100644 index 000000000..54164e7d9 --- /dev/null +++ b/packages/theme-mobile/src/svgs/info-circle.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/info-solid.svg b/packages/theme-mobile/src/svgs/info-solid.svg new file mode 100644 index 000000000..067b8b324 --- /dev/null +++ b/packages/theme-mobile/src/svgs/info-solid.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/info.svg b/packages/theme-mobile/src/svgs/info.svg new file mode 100644 index 000000000..afe72b05c --- /dev/null +++ b/packages/theme-mobile/src/svgs/info.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/information.svg b/packages/theme-mobile/src/svgs/information.svg new file mode 100644 index 000000000..daba831c5 --- /dev/null +++ b/packages/theme-mobile/src/svgs/information.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/leave.svg b/packages/theme-mobile/src/svgs/leave.svg new file mode 100644 index 000000000..1747357bd --- /dev/null +++ b/packages/theme-mobile/src/svgs/leave.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/left-frozen.svg b/packages/theme-mobile/src/svgs/left-frozen.svg new file mode 100644 index 000000000..792bf51ae --- /dev/null +++ b/packages/theme-mobile/src/svgs/left-frozen.svg @@ -0,0 +1,26 @@ + + + + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/left-o.svg b/packages/theme-mobile/src/svgs/left-o.svg new file mode 100644 index 000000000..7c5f5d2c5 --- /dev/null +++ b/packages/theme-mobile/src/svgs/left-o.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/left-ward.svg b/packages/theme-mobile/src/svgs/left-ward.svg new file mode 100644 index 000000000..3e3dd9b4b --- /dev/null +++ b/packages/theme-mobile/src/svgs/left-ward.svg @@ -0,0 +1,8 @@ + + + + + + diff --git a/packages/theme-mobile/src/svgs/left.svg b/packages/theme-mobile/src/svgs/left.svg new file mode 100644 index 000000000..c372778fb --- /dev/null +++ b/packages/theme-mobile/src/svgs/left.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/line-chart.svg b/packages/theme-mobile/src/svgs/line-chart.svg new file mode 100644 index 000000000..8e7877f80 --- /dev/null +++ b/packages/theme-mobile/src/svgs/line-chart.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/link.svg b/packages/theme-mobile/src/svgs/link.svg new file mode 100644 index 000000000..f4d5e8acd --- /dev/null +++ b/packages/theme-mobile/src/svgs/link.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/loading.svg b/packages/theme-mobile/src/svgs/loading.svg new file mode 100644 index 000000000..886feb573 --- /dev/null +++ b/packages/theme-mobile/src/svgs/loading.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/lock.svg b/packages/theme-mobile/src/svgs/lock.svg new file mode 100644 index 000000000..9e8a58c22 --- /dev/null +++ b/packages/theme-mobile/src/svgs/lock.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/mail-content.svg b/packages/theme-mobile/src/svgs/mail-content.svg new file mode 100644 index 000000000..52bc6db69 --- /dev/null +++ b/packages/theme-mobile/src/svgs/mail-content.svg @@ -0,0 +1,14 @@ + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/mail.svg b/packages/theme-mobile/src/svgs/mail.svg new file mode 100644 index 000000000..1d29e0dd3 --- /dev/null +++ b/packages/theme-mobile/src/svgs/mail.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/male.svg b/packages/theme-mobile/src/svgs/male.svg new file mode 100644 index 000000000..fe875c04b --- /dev/null +++ b/packages/theme-mobile/src/svgs/male.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/mark-on.svg b/packages/theme-mobile/src/svgs/mark-on.svg new file mode 100644 index 000000000..94f7dfeb2 --- /dev/null +++ b/packages/theme-mobile/src/svgs/mark-on.svg @@ -0,0 +1 @@ + diff --git a/packages/theme-mobile/src/svgs/meh.svg b/packages/theme-mobile/src/svgs/meh.svg new file mode 100644 index 000000000..9d134085d --- /dev/null +++ b/packages/theme-mobile/src/svgs/meh.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/message-circle.svg b/packages/theme-mobile/src/svgs/message-circle.svg new file mode 100644 index 000000000..c0d6eaf55 --- /dev/null +++ b/packages/theme-mobile/src/svgs/message-circle.svg @@ -0,0 +1,28 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/minscreen.svg b/packages/theme-mobile/src/svgs/minscreen.svg new file mode 100644 index 000000000..5582771c8 --- /dev/null +++ b/packages/theme-mobile/src/svgs/minscreen.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/minus-circle.svg b/packages/theme-mobile/src/svgs/minus-circle.svg new file mode 100644 index 000000000..44c6520a4 --- /dev/null +++ b/packages/theme-mobile/src/svgs/minus-circle.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/minus-square.svg b/packages/theme-mobile/src/svgs/minus-square.svg new file mode 100644 index 000000000..0c1dbc264 --- /dev/null +++ b/packages/theme-mobile/src/svgs/minus-square.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/minus.svg b/packages/theme-mobile/src/svgs/minus.svg new file mode 100644 index 000000000..3f2afdbd2 --- /dev/null +++ b/packages/theme-mobile/src/svgs/minus.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/mobile.svg b/packages/theme-mobile/src/svgs/mobile.svg new file mode 100644 index 000000000..1d48b18fa --- /dev/null +++ b/packages/theme-mobile/src/svgs/mobile.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/more.svg b/packages/theme-mobile/src/svgs/more.svg new file mode 100644 index 000000000..dd93dfc0c --- /dev/null +++ b/packages/theme-mobile/src/svgs/more.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/new.svg b/packages/theme-mobile/src/svgs/new.svg new file mode 100644 index 000000000..ced3b8d2a --- /dev/null +++ b/packages/theme-mobile/src/svgs/new.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/no-premission.svg b/packages/theme-mobile/src/svgs/no-premission.svg new file mode 100644 index 000000000..1b5b07620 --- /dev/null +++ b/packages/theme-mobile/src/svgs/no-premission.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/node-open.svg b/packages/theme-mobile/src/svgs/node-open.svg new file mode 100644 index 000000000..cbffa4239 --- /dev/null +++ b/packages/theme-mobile/src/svgs/node-open.svg @@ -0,0 +1,10 @@ + + + + + + diff --git a/packages/theme-mobile/src/svgs/node.svg b/packages/theme-mobile/src/svgs/node.svg new file mode 100644 index 000000000..6d6f5e9d4 --- /dev/null +++ b/packages/theme-mobile/src/svgs/node.svg @@ -0,0 +1 @@ + diff --git a/packages/theme-mobile/src/svgs/off-line.svg b/packages/theme-mobile/src/svgs/off-line.svg new file mode 100644 index 000000000..3185836ee --- /dev/null +++ b/packages/theme-mobile/src/svgs/off-line.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/on-line.svg b/packages/theme-mobile/src/svgs/on-line.svg new file mode 100644 index 000000000..b5d1a6c6b --- /dev/null +++ b/packages/theme-mobile/src/svgs/on-line.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/operationfaild-l.svg b/packages/theme-mobile/src/svgs/operationfaild-l.svg new file mode 100644 index 000000000..fb3c12be8 --- /dev/null +++ b/packages/theme-mobile/src/svgs/operationfaild-l.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/operationfaild.svg b/packages/theme-mobile/src/svgs/operationfaild.svg new file mode 100644 index 000000000..f8be1347f --- /dev/null +++ b/packages/theme-mobile/src/svgs/operationfaild.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/outer-link.svg b/packages/theme-mobile/src/svgs/outer-link.svg new file mode 100644 index 000000000..18a6b81c9 --- /dev/null +++ b/packages/theme-mobile/src/svgs/outer-link.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/pagelink.svg b/packages/theme-mobile/src/svgs/pagelink.svg new file mode 100644 index 000000000..07c6b03f2 --- /dev/null +++ b/packages/theme-mobile/src/svgs/pagelink.svg @@ -0,0 +1,28 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/pager-first.svg b/packages/theme-mobile/src/svgs/pager-first.svg new file mode 100644 index 000000000..ccfa6ecb9 --- /dev/null +++ b/packages/theme-mobile/src/svgs/pager-first.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/pager-last.svg b/packages/theme-mobile/src/svgs/pager-last.svg new file mode 100644 index 000000000..202546dae --- /dev/null +++ b/packages/theme-mobile/src/svgs/pager-last.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/pager-next.svg b/packages/theme-mobile/src/svgs/pager-next.svg new file mode 100644 index 000000000..142956e20 --- /dev/null +++ b/packages/theme-mobile/src/svgs/pager-next.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/pager-prev.svg b/packages/theme-mobile/src/svgs/pager-prev.svg new file mode 100644 index 000000000..fc13e5c27 --- /dev/null +++ b/packages/theme-mobile/src/svgs/pager-prev.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/panel-max.svg b/packages/theme-mobile/src/svgs/panel-max.svg new file mode 100644 index 000000000..ee9c75b59 --- /dev/null +++ b/packages/theme-mobile/src/svgs/panel-max.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/panel-mini.svg b/packages/theme-mobile/src/svgs/panel-mini.svg new file mode 100644 index 000000000..0f052f592 --- /dev/null +++ b/packages/theme-mobile/src/svgs/panel-mini.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/panel-normal.svg b/packages/theme-mobile/src/svgs/panel-normal.svg new file mode 100644 index 000000000..1d6ecb9fb --- /dev/null +++ b/packages/theme-mobile/src/svgs/panel-normal.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/pause-circle.svg b/packages/theme-mobile/src/svgs/pause-circle.svg new file mode 100644 index 000000000..0f90dc61f --- /dev/null +++ b/packages/theme-mobile/src/svgs/pause-circle.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/pause.svg b/packages/theme-mobile/src/svgs/pause.svg new file mode 100644 index 000000000..282e840ba --- /dev/null +++ b/packages/theme-mobile/src/svgs/pause.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/picture.svg b/packages/theme-mobile/src/svgs/picture.svg new file mode 100644 index 000000000..2cafb79f2 --- /dev/null +++ b/packages/theme-mobile/src/svgs/picture.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/pie-chart.svg b/packages/theme-mobile/src/svgs/pie-chart.svg new file mode 100644 index 000000000..5c87dd3bc --- /dev/null +++ b/packages/theme-mobile/src/svgs/pie-chart.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/plus-circle.svg b/packages/theme-mobile/src/svgs/plus-circle.svg new file mode 100644 index 000000000..8bbf9d39c --- /dev/null +++ b/packages/theme-mobile/src/svgs/plus-circle.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/plus-square.svg b/packages/theme-mobile/src/svgs/plus-square.svg new file mode 100644 index 000000000..bea01a4ef --- /dev/null +++ b/packages/theme-mobile/src/svgs/plus-square.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/plus.svg b/packages/theme-mobile/src/svgs/plus.svg new file mode 100644 index 000000000..8fccd5842 --- /dev/null +++ b/packages/theme-mobile/src/svgs/plus.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/popup.svg b/packages/theme-mobile/src/svgs/popup.svg new file mode 100644 index 000000000..2045fd6c4 --- /dev/null +++ b/packages/theme-mobile/src/svgs/popup.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/pre-checked.svg b/packages/theme-mobile/src/svgs/pre-checked.svg new file mode 100644 index 000000000..f00d7d46b --- /dev/null +++ b/packages/theme-mobile/src/svgs/pre-checked.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/print-preview.svg b/packages/theme-mobile/src/svgs/print-preview.svg new file mode 100644 index 000000000..308fa4c94 --- /dev/null +++ b/packages/theme-mobile/src/svgs/print-preview.svg @@ -0,0 +1,15 @@ + + + + +打印 +Created with Sketch. + + + + + + diff --git a/packages/theme-mobile/src/svgs/pushpin.svg b/packages/theme-mobile/src/svgs/pushpin.svg new file mode 100644 index 000000000..e1ece10cf --- /dev/null +++ b/packages/theme-mobile/src/svgs/pushpin.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/radio.svg b/packages/theme-mobile/src/svgs/radio.svg new file mode 100644 index 000000000..27ee770b7 --- /dev/null +++ b/packages/theme-mobile/src/svgs/radio.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/radioselected.svg b/packages/theme-mobile/src/svgs/radioselected.svg new file mode 100644 index 000000000..b389c13ba --- /dev/null +++ b/packages/theme-mobile/src/svgs/radioselected.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/refres.svg b/packages/theme-mobile/src/svgs/refres.svg new file mode 100644 index 000000000..e6273142a --- /dev/null +++ b/packages/theme-mobile/src/svgs/refres.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/renew.svg b/packages/theme-mobile/src/svgs/renew.svg new file mode 100644 index 000000000..b4469cce7 --- /dev/null +++ b/packages/theme-mobile/src/svgs/renew.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/repeat.svg b/packages/theme-mobile/src/svgs/repeat.svg new file mode 100644 index 000000000..dea26cc02 --- /dev/null +++ b/packages/theme-mobile/src/svgs/repeat.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/replace.svg b/packages/theme-mobile/src/svgs/replace.svg new file mode 100644 index 000000000..163ffcec1 --- /dev/null +++ b/packages/theme-mobile/src/svgs/replace.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/replies.svg b/packages/theme-mobile/src/svgs/replies.svg new file mode 100644 index 000000000..80c4e7cb4 --- /dev/null +++ b/packages/theme-mobile/src/svgs/replies.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/right-frozen.svg b/packages/theme-mobile/src/svgs/right-frozen.svg new file mode 100644 index 000000000..7ddde49fb --- /dev/null +++ b/packages/theme-mobile/src/svgs/right-frozen.svg @@ -0,0 +1,28 @@ + + + + + + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/right-o.svg b/packages/theme-mobile/src/svgs/right-o.svg new file mode 100644 index 000000000..7443f76af --- /dev/null +++ b/packages/theme-mobile/src/svgs/right-o.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/right.svg b/packages/theme-mobile/src/svgs/right.svg new file mode 100644 index 000000000..403b335b0 --- /dev/null +++ b/packages/theme-mobile/src/svgs/right.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/rightward.svg b/packages/theme-mobile/src/svgs/rightward.svg new file mode 100644 index 000000000..67c2982dc --- /dev/null +++ b/packages/theme-mobile/src/svgs/rightward.svg @@ -0,0 +1,8 @@ + + + + + + diff --git a/packages/theme-mobile/src/svgs/sandwich-collapse.svg b/packages/theme-mobile/src/svgs/sandwich-collapse.svg new file mode 100644 index 000000000..2dde86cc0 --- /dev/null +++ b/packages/theme-mobile/src/svgs/sandwich-collapse.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/sandwich-expand.svg b/packages/theme-mobile/src/svgs/sandwich-expand.svg new file mode 100644 index 000000000..e406f97df --- /dev/null +++ b/packages/theme-mobile/src/svgs/sandwich-expand.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/save.svg b/packages/theme-mobile/src/svgs/save.svg new file mode 100644 index 000000000..552157664 --- /dev/null +++ b/packages/theme-mobile/src/svgs/save.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/scissor.svg b/packages/theme-mobile/src/svgs/scissor.svg new file mode 100644 index 000000000..6475fa982 --- /dev/null +++ b/packages/theme-mobile/src/svgs/scissor.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/search.svg b/packages/theme-mobile/src/svgs/search.svg new file mode 100644 index 000000000..83e0af179 --- /dev/null +++ b/packages/theme-mobile/src/svgs/search.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/select.svg b/packages/theme-mobile/src/svgs/select.svg new file mode 100644 index 000000000..60d55d829 --- /dev/null +++ b/packages/theme-mobile/src/svgs/select.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/sent.svg b/packages/theme-mobile/src/svgs/sent.svg new file mode 100644 index 000000000..1544d8883 --- /dev/null +++ b/packages/theme-mobile/src/svgs/sent.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/separate.svg b/packages/theme-mobile/src/svgs/separate.svg new file mode 100644 index 000000000..e4d192078 --- /dev/null +++ b/packages/theme-mobile/src/svgs/separate.svg @@ -0,0 +1,10 @@ + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/setting.svg b/packages/theme-mobile/src/svgs/setting.svg new file mode 100644 index 000000000..16747aabd --- /dev/null +++ b/packages/theme-mobile/src/svgs/setting.svg @@ -0,0 +1,30 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/share.svg b/packages/theme-mobile/src/svgs/share.svg new file mode 100644 index 000000000..b5e2ab497 --- /dev/null +++ b/packages/theme-mobile/src/svgs/share.svg @@ -0,0 +1,16 @@ + + + + share + Created with Sketch. + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/shopping-card.svg b/packages/theme-mobile/src/svgs/shopping-card.svg new file mode 100644 index 000000000..b18f85989 --- /dev/null +++ b/packages/theme-mobile/src/svgs/shopping-card.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/smile-o.svg b/packages/theme-mobile/src/svgs/smile-o.svg new file mode 100644 index 000000000..c35452600 --- /dev/null +++ b/packages/theme-mobile/src/svgs/smile-o.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/smile.svg b/packages/theme-mobile/src/svgs/smile.svg new file mode 100644 index 000000000..f1e474dad --- /dev/null +++ b/packages/theme-mobile/src/svgs/smile.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/sort.svg b/packages/theme-mobile/src/svgs/sort.svg new file mode 100644 index 000000000..9234afd2f --- /dev/null +++ b/packages/theme-mobile/src/svgs/sort.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/star-active.svg b/packages/theme-mobile/src/svgs/star-active.svg new file mode 100644 index 000000000..0c8a2d1e9 --- /dev/null +++ b/packages/theme-mobile/src/svgs/star-active.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/star-disable.svg b/packages/theme-mobile/src/svgs/star-disable.svg new file mode 100644 index 000000000..66e2a88bb --- /dev/null +++ b/packages/theme-mobile/src/svgs/star-disable.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/star-o.svg b/packages/theme-mobile/src/svgs/star-o.svg new file mode 100644 index 000000000..da81600be --- /dev/null +++ b/packages/theme-mobile/src/svgs/star-o.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/start-circle.svg b/packages/theme-mobile/src/svgs/start-circle.svg new file mode 100644 index 000000000..1fae70058 --- /dev/null +++ b/packages/theme-mobile/src/svgs/start-circle.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/start.svg b/packages/theme-mobile/src/svgs/start.svg new file mode 100644 index 000000000..9742569d6 --- /dev/null +++ b/packages/theme-mobile/src/svgs/start.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/statistics.svg b/packages/theme-mobile/src/svgs/statistics.svg new file mode 100644 index 000000000..d753ae36c --- /dev/null +++ b/packages/theme-mobile/src/svgs/statistics.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/stop.svg b/packages/theme-mobile/src/svgs/stop.svg new file mode 100644 index 000000000..82e7e9a05 --- /dev/null +++ b/packages/theme-mobile/src/svgs/stop.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/success.svg b/packages/theme-mobile/src/svgs/success.svg new file mode 100644 index 000000000..fdb516515 --- /dev/null +++ b/packages/theme-mobile/src/svgs/success.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/successful.svg b/packages/theme-mobile/src/svgs/successful.svg new file mode 100644 index 000000000..ff04da21b --- /dev/null +++ b/packages/theme-mobile/src/svgs/successful.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/task-cooperation.svg b/packages/theme-mobile/src/svgs/task-cooperation.svg new file mode 100644 index 000000000..ce8de227c --- /dev/null +++ b/packages/theme-mobile/src/svgs/task-cooperation.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/telephone-circle.svg b/packages/theme-mobile/src/svgs/telephone-circle.svg new file mode 100644 index 000000000..b6e443645 --- /dev/null +++ b/packages/theme-mobile/src/svgs/telephone-circle.svg @@ -0,0 +1,28 @@ + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/telephone.svg b/packages/theme-mobile/src/svgs/telephone.svg new file mode 100644 index 000000000..33cf346f0 --- /dev/null +++ b/packages/theme-mobile/src/svgs/telephone.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/text-tab.svg b/packages/theme-mobile/src/svgs/text-tab.svg new file mode 100644 index 000000000..b4be9b857 --- /dev/null +++ b/packages/theme-mobile/src/svgs/text-tab.svg @@ -0,0 +1,10 @@ + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/text.svg b/packages/theme-mobile/src/svgs/text.svg new file mode 100644 index 000000000..e67d6d320 --- /dev/null +++ b/packages/theme-mobile/src/svgs/text.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/time.svg b/packages/theme-mobile/src/svgs/time.svg new file mode 100644 index 000000000..a1f40fb51 --- /dev/null +++ b/packages/theme-mobile/src/svgs/time.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/total.svg b/packages/theme-mobile/src/svgs/total.svg new file mode 100644 index 000000000..87c809954 --- /dev/null +++ b/packages/theme-mobile/src/svgs/total.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/triangle-down.svg b/packages/theme-mobile/src/svgs/triangle-down.svg new file mode 100644 index 000000000..341cc9b8e --- /dev/null +++ b/packages/theme-mobile/src/svgs/triangle-down.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/undelete.svg b/packages/theme-mobile/src/svgs/undelete.svg new file mode 100644 index 000000000..56e4f12a0 --- /dev/null +++ b/packages/theme-mobile/src/svgs/undelete.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/unfilter.svg b/packages/theme-mobile/src/svgs/unfilter.svg new file mode 100644 index 000000000..ca7a78722 --- /dev/null +++ b/packages/theme-mobile/src/svgs/unfilter.svg @@ -0,0 +1,15 @@ + + + + +Path +Created with Sketch. + + + + + + diff --git a/packages/theme-mobile/src/svgs/unfreeze.svg b/packages/theme-mobile/src/svgs/unfreeze.svg new file mode 100644 index 000000000..ae91546ce --- /dev/null +++ b/packages/theme-mobile/src/svgs/unfreeze.svg @@ -0,0 +1,39 @@ + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/unknow.svg b/packages/theme-mobile/src/svgs/unknow.svg new file mode 100644 index 000000000..1a4b97b44 --- /dev/null +++ b/packages/theme-mobile/src/svgs/unknow.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/unlock.svg b/packages/theme-mobile/src/svgs/unlock.svg new file mode 100644 index 000000000..3da63889c --- /dev/null +++ b/packages/theme-mobile/src/svgs/unlock.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/unsent.svg b/packages/theme-mobile/src/svgs/unsent.svg new file mode 100644 index 000000000..cd19bdfa7 --- /dev/null +++ b/packages/theme-mobile/src/svgs/unsent.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/up-o.svg b/packages/theme-mobile/src/svgs/up-o.svg new file mode 100644 index 000000000..8ba5932fb --- /dev/null +++ b/packages/theme-mobile/src/svgs/up-o.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/up.svg b/packages/theme-mobile/src/svgs/up.svg new file mode 100644 index 000000000..0878141a9 --- /dev/null +++ b/packages/theme-mobile/src/svgs/up.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/upload.svg b/packages/theme-mobile/src/svgs/upload.svg new file mode 100644 index 000000000..beb941b6d --- /dev/null +++ b/packages/theme-mobile/src/svgs/upload.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/user.svg b/packages/theme-mobile/src/svgs/user.svg new file mode 100644 index 000000000..c89d255ab --- /dev/null +++ b/packages/theme-mobile/src/svgs/user.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/versiontree.svg b/packages/theme-mobile/src/svgs/versiontree.svg new file mode 100644 index 000000000..71c9c766a --- /dev/null +++ b/packages/theme-mobile/src/svgs/versiontree.svg @@ -0,0 +1 @@ +defs> \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/view.svg b/packages/theme-mobile/src/svgs/view.svg new file mode 100644 index 000000000..80ec6bb2c --- /dev/null +++ b/packages/theme-mobile/src/svgs/view.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/warning-triangle.svg b/packages/theme-mobile/src/svgs/warning-triangle.svg new file mode 100644 index 000000000..2b258ae7e --- /dev/null +++ b/packages/theme-mobile/src/svgs/warning-triangle.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/warning.svg b/packages/theme-mobile/src/svgs/warning.svg new file mode 100644 index 000000000..9f977d88f --- /dev/null +++ b/packages/theme-mobile/src/svgs/warning.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/web-plus.svg b/packages/theme-mobile/src/svgs/web-plus.svg new file mode 100644 index 000000000..b8172cf59 --- /dev/null +++ b/packages/theme-mobile/src/svgs/web-plus.svg @@ -0,0 +1,9 @@ + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/writing.svg b/packages/theme-mobile/src/svgs/writing.svg new file mode 100644 index 000000000..cf3523bd0 --- /dev/null +++ b/packages/theme-mobile/src/svgs/writing.svg @@ -0,0 +1,24 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme-mobile/src/svgs/yes.svg b/packages/theme-mobile/src/svgs/yes.svg new file mode 100644 index 000000000..167e28b00 --- /dev/null +++ b/packages/theme-mobile/src/svgs/yes.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/zoom-in.svg b/packages/theme-mobile/src/svgs/zoom-in.svg new file mode 100644 index 000000000..92c5e5b5f --- /dev/null +++ b/packages/theme-mobile/src/svgs/zoom-in.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme-mobile/src/svgs/zoom-out.svg b/packages/theme-mobile/src/svgs/zoom-out.svg new file mode 100644 index 000000000..fa1be860e --- /dev/null +++ b/packages/theme-mobile/src/svgs/zoom-out.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme-mobile/src/switch/index.js b/packages/theme-mobile/src/switch/index.js new file mode 100644 index 000000000..56db2b6fc --- /dev/null +++ b/packages/theme-mobile/src/switch/index.js @@ -0,0 +1,12 @@ +export default { + 'tiny-mobile-switch-width': '50px', + 'tiny-mobile-switch-height': '30px', + 'tiny-mobile-switch-border-radius': '40px', + 'tiny-mobile-switch-border-color': '#e5e5e5', + 'tiny-mobile-switch-bgcolor': '#fff', + 'tiny-mobile-switch-disabled-bgcolor': '#f5f5f5', + 'tiny-mobile-switch-disabled-after-border-color': '#ccc', + 'tiny-mobile-switch-disabled-checked-bgcolor': '#b3eee0', + 'tiny-mobile-switch-after-border-color': '#ccc', + 'tiny-mobile-switch-checked-color': '#00c696' +} diff --git a/packages/theme-mobile/src/switch/index.less b/packages/theme-mobile/src/switch/index.less new file mode 100644 index 000000000..92dbf4739 --- /dev/null +++ b/packages/theme-mobile/src/switch/index.less @@ -0,0 +1,75 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@switch-prefix-cls: ~'@{css-prefix}mobile-switch'; + +.@{switch-prefix-cls} { + width: var(--ti-mobile-switch-width, 50px); + height: var(--ti-mobile-switch-height, 30px); + border: 1px solid var(--ti-mobile-switch-border-color, #e5e5e5); + border-radius: var(--ti-mobile-switch-border-radius, 40px); + background-color: var(--ti-mobile-switch-bgcolor, #fff); + position: relative; + cursor: pointer; + display: inline-block; + vertical-align: middle; + outline: none; + transition: all 0.2s ease-in-out; + + &.disabled { + background-color: var(--ti-mobile-switch-disabled-bgcolor, #f5f5f5); + cursor: not-allowed; + + &::after { + border-color: var(--ti-mobile-switch-after-border-color, #ccc); + cursor: not-allowed; + } + + &.@{switch-prefix-cls}-checked { + background-color: var(--ti-mobile-switch-disabled-checked-bgcolor, #b3eee0); + border-color: var(--ti-mobile-switch-disabled-checked-bgcolor, #b3eee0); + + &::after { + border-color: rgba(0, 0, 0, 0.1); + } + } + } + + &::after { + content: ''; + width: 28px; + height: 28px; + border-radius: 50%; + background-color: var(--ti-mobile-switch-font-color, #fff); + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.1); + border: 1px solid var(--ti-mobile-switch-after-border-color, #ccc); + position: absolute; + left: -1px; + top: 0; + cursor: pointer; + transition: left 0.2s ease-in-out, width 0.2s ease-in-out; + box-sizing: border-box; + } + + &&-checked { + border-color: var(--ti-mobile-switch-checked-color, #00c696); + background-color: var(--ti-mobile-switch-checked-color, #00c696); + + &:after { + left: calc(~'100% - 28px'); + border-color: var(--ti-mobile-switch-bgcolor, #fff); + } + } +} diff --git a/packages/theme-mobile/src/switch/vars.less b/packages/theme-mobile/src/switch/vars.less new file mode 100644 index 000000000..a9a660b5d --- /dev/null +++ b/packages/theme-mobile/src/switch/vars.less @@ -0,0 +1,12 @@ +:root { + --ti-mobile-switch-width: 50px; + --ti-mobile-switch-height: 30px; + --ti-mobile-switch-border-radius: 40px; + --ti-mobile-switch-border-color: #e5e5e5; + --ti-mobile-switch-bgcolor: var(--ti-mobile-base-color-light, #fff); + --ti-mobile-switch-disabled-bgcolor: var(--ti-mobile-base-color-selected-background, #f5f5f5); + --ti-mobile-switch-disabled-after-border-color: #ccc; + --ti-mobile-switch-disabled-checked-bgcolor: #b3eee0; + --ti-mobile-switch-after-border-color: #ccc; + --ti-mobile-switch-checked-color: #00c696; +} diff --git a/packages/theme-mobile/src/tabbar-item/index.js b/packages/theme-mobile/src/tabbar-item/index.js new file mode 100644 index 000000000..e5509e69f --- /dev/null +++ b/packages/theme-mobile/src/tabbar-item/index.js @@ -0,0 +1,9 @@ +export default { + 'tiny-mobile-tabbar-item-color': '#666', + 'tiny-mobile-tabbar-item-active-color': '#f04b3d', + 'tiny-mobile-tabbar-item-icon-size': '18px', + 'tiny-mobile-tabbar-item-text-font-size': '10px', + 'tiny-mobile-tabbar-item-info-font-size': '12px', + 'tiny-mobile-tabbar-item-info-border-radius': '16px', + 'tiny-mobile-tabbar-item-info-bgcolor': '#ee0a24' +} diff --git a/packages/theme-mobile/src/tabbar-item/index.less b/packages/theme-mobile/src/tabbar-item/index.less new file mode 100644 index 000000000..b91f3e169 --- /dev/null +++ b/packages/theme-mobile/src/tabbar-item/index.less @@ -0,0 +1,89 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@tabbar-item-prefix-cls: ~'@{css-prefix}mobile-tabbar-item'; +@info-prefix-cls: ~'@{css-prefix}mobile-info'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{tabbar-item-prefix-cls} { + display: flex; + flex: 1; + flex-direction: column; + align-items: center; + justify-content: center; + line-height: 1; + cursor: pointer; + + &__icon { + position: relative; + margin-bottom: 2px; + + .@{svg-prefix-cls} { + display: block; + min-width: 1em; + font-size: var(--ti-mobile-tabbar-item-icon-size, 18px); + fill: var(--ti-mobile-tabbar-item-color, #666); + } + + img { + display: block; + height: var(--ti-mobile-tabbar-item-icon-size, 18px); + } + } + + &__text { + font-size: var(--ti-mobile-tabbar-item-text-font-size, 10px); + color: var(--ti-mobile-tabbar-item-color, #666); + } + + &.is-active &__icon { + .@{svg-prefix-cls} { + fill: var(--ti-mobile-tabbar-item-active-color, #f04b3d); + } + } + + &.is-active &__text { + color: var(--ti-mobile-tabbar-item-active-color, #f04b3d); + } + + .@{info-prefix-cls} { + margin-top: 2px; + position: absolute; + top: 0; + right: 0; + box-sizing: border-box; + min-width: 16px; + padding: 0 3px; + color: #fff; + font-weight: 500; + font-size: var(--ti-mobile-tabbar-item-info-font-size, 12px); + font-family: 'PingFang SC', 'Helvetica Neue', Arial, sans-serif; + line-height: 14px; + text-align: center; + background-color: var(--ti-mobile-tabbar-item-info-bgcolor, #ee0a24); + border: 1px solid #fff; + border-radius: var(--ti-mobile-tabbar-item-info-border-radius, 16px); + transform: translate(50%, -50%); + transform-origin: 100%; + } + + .@{info-prefix-cls}--dot { + width: 8px; + min-width: 0; + height: 8px; + background-color: var(--ti-mobile-tabbar-item-info-bgcolor, #ee0a24); + border-radius: 100%; + } +} diff --git a/packages/theme-mobile/src/tabbar-item/vars.less b/packages/theme-mobile/src/tabbar-item/vars.less new file mode 100644 index 000000000..0fe4c31a9 --- /dev/null +++ b/packages/theme-mobile/src/tabbar-item/vars.less @@ -0,0 +1,9 @@ +:root { + --ti-mobile-tabbar-item-color: var(--ti-mobile-base-color-secondary, #666); + --ti-mobile-tabbar-item-active-color: #f04b3d; + --ti-mobile-tabbar-item-icon-size: 18px; + --ti-mobile-tabbar-item-text-font-size: 10px; + --ti-mobile-tabbar-item-info-font-size: var(--ti-mobile-base-font-size, 12px); + --ti-mobile-tabbar-item-info-border-radius: 16px; + --ti-mobile-tabbar-item-info-bgcolor: #ee0a24; +} diff --git a/packages/theme-mobile/src/tabbar/index.js b/packages/theme-mobile/src/tabbar/index.js new file mode 100644 index 000000000..a7fb3903e --- /dev/null +++ b/packages/theme-mobile/src/tabbar/index.js @@ -0,0 +1,5 @@ +export default { + 'tiny-mobile-tabbar-height': '48px', + 'tiny-mobile-tabbar-bgcolor': '#f0f0f0', + 'tiny-mobile-tabbar-border-color': '#ccc' +} diff --git a/packages/theme-mobile/src/tabbar/index.less b/packages/theme-mobile/src/tabbar/index.less new file mode 100644 index 000000000..4a287a7b8 --- /dev/null +++ b/packages/theme-mobile/src/tabbar/index.less @@ -0,0 +1,42 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/hairline.less'; +@import '../custom.less'; +@import './vars.less'; + +@tabbar-prefix-cls: ~'@{css-prefix}mobile-tabbar'; + +.@{tabbar-prefix-cls} { + z-index: 1; + display: flex; + box-sizing: content-box; + width: 100%; + height: var(--ti-mobile-tabbar-height, 48px); + background-color: var(--ti-mobile-tabbar-bgcolor, #f0f0f0); + padding-bottom: constant(safe-area-inset-bottom); + padding-bottom: env(safe-area-inset-bottom); + + &--fixed { + position: fixed; + bottom: 0; + left: 0; + } + + &--unfit { + padding-bottom: 0; + } + + &.is-border { + .hairline('top', var(--ti-mobile-tabbar-border-color, #ccc), absolute); + } +} diff --git a/packages/theme-mobile/src/tabbar/vars.less b/packages/theme-mobile/src/tabbar/vars.less new file mode 100644 index 000000000..4e5059233 --- /dev/null +++ b/packages/theme-mobile/src/tabbar/vars.less @@ -0,0 +1,5 @@ +:root { + --ti-mobile-tabbar-height: 48px; + --ti-mobile-tabbar-bgcolor: #f0f0f0; + --ti-mobile-tabbar-border-color: #ccc; +} diff --git a/packages/theme-mobile/src/table/index.js b/packages/theme-mobile/src/table/index.js new file mode 100644 index 000000000..2309171f7 --- /dev/null +++ b/packages/theme-mobile/src/table/index.js @@ -0,0 +1,26 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +export default { + 'tiny-mobile-table-text-color': '#191919', + 'tiny-mobile-table-head-text-color': '#999999', + 'tiny-mobile-table-bg-color': '#fafafa', + 'tiny-mobile-table-odd-bg-color': '#ffffff', + 'tiny-mobile-table-disabled-text-color': '#dbdbdb', + 'tiny-mobile-table-disabled-bg-color': '#f1f1f1', + 'tiny-mobile-table-nodata-text-color': '#909399', + 'tiny-mobile-table-td-height': '44px', + 'tiny-mobile-table-td-font-size': '12px', + 'tiny-mobile-table-thead-bg-color': '#fafafa', + 'tiny-mobile-table-icon-font-size': '16px', + 'tiny-mobile-table-check-icon-color': '#4a79fe', +} diff --git a/packages/theme-mobile/src/table/index.less b/packages/theme-mobile/src/table/index.less new file mode 100644 index 000000000..669e7dcd0 --- /dev/null +++ b/packages/theme-mobile/src/table/index.less @@ -0,0 +1,140 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@table-prefix-cls: ~'@{css-prefix}mobile-table'; +@table-header-prefix-cls: ~'@{css-prefix}mobile-table-header'; +@table-cell-prefix-cls: ~'@{css-prefix}mobile-table-cell'; +@svg-prefix-cls: ~'@{css-prefix}mobile-svg'; + +.@{table-prefix-cls} { + .component-css-vars-table(); + + &.simple { + overflow: auto; + + table { + table-layout: fixed; + + tr { + display: table-row; + vertical-align: inherit; + border-color: inherit; + } + + tbody { + + tr { + color: var(--ti-mobile-table-text-color); + font-weight: 400; + + td { + background: var(--ti-mobile-table-bg-color); + } + + &:nth-child(odd), td { + background: var(--ti-mobile-table-odd-bg-color); + } + + &.is-disabled { + background: var(--ti-mobile-table-disabled-bg-color); + color: var(--ti-mobile-table-disabled-text-color); + } + } + + .noData { + width: 100%; + height: 100%; + text-align: center; + color: var(--ti-mobile-table-nodata-text-color); + display: flex; + justify-content: center; + align-items: center; + } + } + + th { + padding-left: 20px; + height: var(--ti-mobile-table-td-height); + border-left: none; + } + + td { + padding-left: 20px; + height: var(--ti-mobile-table-td-height); + font-size: var(--ti-mobile-table-td-font-size); + + .overflow { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + } + + thead { + text-align: left; + color: var(--ti-mobile-table-head-text-color); + + th { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + text-align: left; + font-size: var(--ti-mobile-table-td-font-size); + color: var(--ti-mobile-table-head-text-color); + font-weight: 500; + line-height: 1.7em; + background: var(--ti-mobile-table-thead-bg-color); + + .overflow { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + } + } + + .fixed { + position: sticky; + z-index: 1; + } + } + + .@{table-cell-prefix-cls} { + display: flex; + align-items: center; + height: 100%; + position: relative; + + .@{svg-prefix-cls} { + font-size: var(--ti-mobile-table-icon-font-size); + fill: var(--ti-mobile-table-border-color); + + &.is-check { + fill: var(--ti-mobile-table-check-icon-color); + } + } + + .shadow { + position: absolute; + right: 0; + top: 0; + height: 100%; + width: 8px; + opacity: 0.05; + background: linear-gradient(270deg, rgba(0,0,0,0), #000); + } + } + } +} diff --git a/packages/theme-mobile/src/table/vars.less b/packages/theme-mobile/src/table/vars.less new file mode 100644 index 000000000..b80e8c6fd --- /dev/null +++ b/packages/theme-mobile/src/table/vars.less @@ -0,0 +1,26 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-table() { + --ti-mobile-table-text-color: var(--ti-mobile-common-color-text-primary, #191919); + --ti-mobile-table-head-text-color: var(--ti-mobile-common-color-text-weaken-dark, #999999); + --ti-mobile-table-bg-color: #fafafa; + --ti-mobile-table-odd-bg-color: #fff; + --ti-mobile-table-disabled-text-color: var(--ti-mobile-common-color-text-weaken-disabled, #dbdbdb); + --ti-mobile-table-disabled-bg-color: #f1f1f1; + --ti-mobile-table-nodata-text-color: #909399; + --ti-mobile-table-td-height: 44px; + --ti-mobile-table-td-font-size: 12px; + --ti-mobile-table-thead-bg-color: var(--ti-mobile-common-bg-color-light, #fafafa); + --ti-mobile-table-icon-font-size: 16px; + --ti-mobile-table-check-icon-color: var(--ti-mobile-common-bg-color-main, #4a79fe); +} diff --git a/packages/theme-mobile/src/tabs/index.js b/packages/theme-mobile/src/tabs/index.js new file mode 100644 index 000000000..7e30c2cf3 --- /dev/null +++ b/packages/theme-mobile/src/tabs/index.js @@ -0,0 +1,16 @@ +export default { + 'tiny-mobile-tabs-text-color': '#333', + 'tiny-mobile-tabs-bg-color': '#fff', + 'tiny-mobile-tabs-font-size': '14px', + 'tiny-mobile-tabs-header-height': '48px', + 'tiny-mobile-tabs-border-color': '#ccc', + 'tiny-mobile-tabs-color-active': '#4a79fe', + 'tiny-mobile-tabs-children-text-color': '#000', + 'tiny-mobile-tabs-children-border-color': '#eee', + 'tiny-mobile-tabs-new-tab-width': '44px', + 'tiny-mobile-tabs-icon-font-size': '24px', + 'tiny-mobile-tabs-icon-color': '#bbb', + 'tiny-mobile-tabs-item-text-color': '#595959', + 'tiny-mobile-tabs-item-text-color-active': '#191919', + 'tiny-mobile-tabs-line-bg-color-active': '#4a79fe', +} diff --git a/packages/theme-mobile/src/tabs/index.less b/packages/theme-mobile/src/tabs/index.less new file mode 100644 index 000000000..389d4a87c --- /dev/null +++ b/packages/theme-mobile/src/tabs/index.less @@ -0,0 +1,282 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/hairline.less'; +@import '../custom.less'; +@import './vars.less'; + +@tabs-prefix-cls: ~'@{css-prefix}mobile-tabs'; + +.@{tabs-prefix-cls} { + position: relative; + + &__header { + background: var(--ti-mobile-tabs-bg-color, #fff); + position: relative; + border-radius: 16px 16px 0px 0px; + box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.06) inset; + } + + &__content { + overflow: hidden; + font-size: var(--ti-mobile-tabs-font-size, 14px); + color: var(--ti-mobile-tabs-text-color, #333); + background: var(--ti-mobile-tabs-bg-color, #fff); + padding: 15px 24px; + } + + &__new-tab { + position: absolute; + right: 0; + top: 0; + bottom: 0; + width: var(--ti-mobile-tabs-new-tab-width, 44px); + display: flex; + justify-content: center; + align-items: center; + + &:focus { + outline: 0; + } + + svg { + font-size: var(--ti-mobile-tabs-icon-font-size, 24px); + fill: var(--ti-mobile-tabs-icon-color, #bbb); + } + } + + &__new-tab + &__nav-wrap { + width: calc(100% - var(--ti-mobile-tabs-new-tab-width, 44px)); + } + + &__nav-wrap { + position: relative; + } + + &__nav-wrap&__wrap-scrollable { + .@{tabs-prefix-cls}__item { + flex: 0 0 22%; + } + + .@{tabs-prefix-cls}__nav { + overflow: hidden; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + -webkit-tap-highlight-color: transparent; + &::-webkit-scrollbar { + display: none; + } + } + } + + &__nav-wrap&__wrap-scrollable &__nav-scroll{ + &:before{ + position: absolute; + content: ""; + top: 0; + bottom: 0; + left: 0; + width: 11%; + background: -webkit-gradient(linear, left top, right top, from(#fff), to(hsla(0, 0%, 100%, 0))); + background: linear-gradient(90deg, #fff, hsla(0, 0%, 100%, 0)); + border-radius: 16px 0px 0px 0px; + z-index: 2; + } + &:after{ + position: absolute; + content: ""; + top: 0; + bottom: 0; + right: 0; + width: 11%; + background: -webkit-gradient(linear, left top, right top, from(hsla(0, 0%, 100%, 0)), to(#fff)); + background: linear-gradient(90deg, hsla(0, 0%, 100%, 0), #fff); + border-radius: 0px 16px 0px 0px; + z-index: 2; + } + } + + &__nav { + white-space: nowrap; + position: relative; + transition: transform 0.3s; + display: flex; + } + + &__item { + position: relative; + flex: 1; + box-sizing: border-box; + text-align: center; + height: var(--ti-mobile-tabs-header-height, 48px); + line-height: var(--ti-mobile-tabs-header-height, 48px); + font-size: var(--ti-mobile-tabs-font-size, 14px); + color: var(--ti-mobile-tabs-item-text-color, #595959); + cursor: pointer; + transition: all 0.3s ease-in-out 0s; + font-weight: 400; + } + + &__name { + display: inline-block; + padding: 0px 10px; + } + + &__item.is-active &__name { + color: var(--ti-mobile-tabs-item-text-color-active, #191919); + font-weight: 500; + font-size: 15px; + position: relative; + } + + &__line { + position: absolute; + bottom: 0; + left: 0; + z-index: 1; + width: 20px; + height: 3px; + background-color: var(--ti-mobile-tabs-line-bg-color-active, #4a79fe); + border-radius: 3px; + transition-duration: 0.3s; + } + + &__expand-icon { + position: absolute; + top: 0; + right: 0; + z-index: 3; + } + + &__expand { + display: inline-block; + font-size: 14px; + height: 48px; + line-height: 48px; + width: 48px; + text-align: center; + z-index: 9999; + + svg { + fill: #595959; + } + } + + &__expand-content{ + position: absolute; + background: #f5f5f5; + z-index: 500; + } + + &__expand-mask{ + height: 22px; + } + + &__expand-header{ + height: 48px; + border-radius: 16px 16px 0px 0px; + box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.06) inset; + background: #fff; + color: #595959; + font-size: 14px; + display: flex; + align-items: center; + } + + &__expand-header-title{ + display: inline-block; + padding-left: 16px; + } + + &__expand-list { + width: 100%; + max-height: 160px; + overflow-y: auto; + border-radius: 0px 0px 16px 16px; + box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.06) inset; + background: #fff; + padding: 16px; + } + + &__expand-item { + margin-bottom: 10px; + padding-left: 10px; + padding-right: 10px; + &:focus { + outline: 0; + } + + } + + &__expand-item&__expand-mode-columns{ + width: 33.33%; + display: inline-block; + } + + &__expand-item &__expand-item-title{ + height: 36px; + line-height: 36px; + text-align: center; + font-size: 13px; + color: #191919; + font-weight: 400; + border-radius: 6px; + background: rgba(0, 0, 0, 0.04); + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + padding: 0 5px; + &:hover { + color: #4a79fe; + } + } + + &__expand-item-title.is-current{ + background: rgba(74, 121, 254, 0.08); + color: #4a79fe; + font-weight: 500; + } + + &__icon-close { + margin-left: 5px; + } + + &__nav-wrap-children &__name { + height: 20px; + line-height: 20px; + min-width: 60px; + border-radius: 20px; + padding: 0px 12px; + font-size: 14px; + color: var(--ti-mobile-tabs-children-text-color, #000); + border: 1px solid var(--ti-mobile-tabs-children-border-color, #eee); + } + + &__nav-wrap-children &__item.is-active &__name { + border: 1px solid var(--ti-mobile-tabs-color-active, #4a79fe); + color: var(--ti-mobile-tabs-color-active, #4a79fe); + + &:after { + border-bottom: 0; + } + } + + &__nav-wrap-children &__nav &__item { + width: auto; + margin-left: 10px; + + &:first-child { + margin-left: 0px; + } + } + +} \ No newline at end of file diff --git a/packages/theme-mobile/src/tabs/vars.less b/packages/theme-mobile/src/tabs/vars.less new file mode 100644 index 000000000..3f84db556 --- /dev/null +++ b/packages/theme-mobile/src/tabs/vars.less @@ -0,0 +1,16 @@ +:root { + --ti-mobile-tabs-text-color: var(--ti-mobile-base-color-info-normal, #333); + --ti-mobile-tabs-bg-color: var(--ti-mobile-base-color-light, #fff); + --ti-mobile-tabs-font-size: 14px; + --ti-mobile-tabs-header-height: 48px; + --ti-mobile-tabs-border-color: #ccc; + --ti-mobile-tabs-color-active: #4a79fe; + --ti-mobile-tabs-children-text-color: var(--ti-mobile-base-color-dark, #000); + --ti-mobile-tabs-children-border-color: #eee; + --ti-mobile-tabs-new-tab-width: 44px; + --ti-mobile-tabs-icon-font-size: 24px; + --ti-mobile-tabs-icon-color: #bbb; + --ti-mobile-tabs-item-text-color: #595959; + --ti-mobile-tabs-item-text-color-active: #191919; + --ti-mobile-tabs-line-bg-color-active: #4a79fe; +} diff --git a/packages/theme-mobile/src/tall-storage/index.js b/packages/theme-mobile/src/tall-storage/index.js new file mode 100644 index 000000000..2f417ba08 --- /dev/null +++ b/packages/theme-mobile/src/tall-storage/index.js @@ -0,0 +1,3 @@ +export default { + // mobile/tall-storage +} diff --git a/packages/theme-mobile/src/tall-storage/index.less b/packages/theme-mobile/src/tall-storage/index.less new file mode 100644 index 000000000..4dc83d2ab --- /dev/null +++ b/packages/theme-mobile/src/tall-storage/index.less @@ -0,0 +1,52 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@tall-storage-prefix-cls: ~'@{css-prefix}tall-storage'; +@storage-list-style-prefix-cls: ~'@{css-prefix}storage-list-style'; +@storage-list-prefix-cls: ~'@{css-prefix}storage-list'; +@storage-item-prefix-cls: ~'@{css-prefix}storage-item'; + +.@{tall-storage-prefix-cls} { + position: relative; + margin-top: var(--ti-tall-storage-margin-top, 2px); + + .@{storage-list-style-prefix-cls} { + position: absolute; + background-color: var(--ti-tall-storage-bgcolor, #fff); + box-shadow: 0 0 4px rgba(0, 0, 0, 0.3); + border-radius: var(--ti-tall-storage-border-radius, 2px); + width: 100%; + box-sizing: border-box; + z-index: 10; + + .@{storage-list-prefix-cls} { + padding: 0; + list-style: none; + + .@{storage-item-prefix-cls} { + height: var(--ti-tall-storage-item-height, 30px); + line-height: var(--ti-tall-storage-item-height, 30px); + padding: var(--ti-tall-storage-item-padding, 0 8px); + white-space: nowrap; + + &:hover, + &.item-hover { + cursor: pointer; + background-color: var(--ti-tall-storage-item-bgcolor, #e6f7ff); + } + } + } + } +} diff --git a/packages/theme-mobile/src/tall-storage/vars.less b/packages/theme-mobile/src/tall-storage/vars.less new file mode 100644 index 000000000..8f4243424 --- /dev/null +++ b/packages/theme-mobile/src/tall-storage/vars.less @@ -0,0 +1,8 @@ +:root { + --ti-tall-storage-margin-top: 2px; + --ti-tall-storage-bgcolor: #fff; + --ti-tall-storage-border-radius: 2px; + --ti-tall-storage-item-height: 30px; + --ti-tall-storage-item-padding: 0 8px; + --ti-tall-storage-item-bgcolor: #e6f7ff; +} diff --git a/packages/theme-mobile/src/theme.config.json b/packages/theme-mobile/src/theme.config.json new file mode 100644 index 000000000..de72d9284 --- /dev/null +++ b/packages/theme-mobile/src/theme.config.json @@ -0,0 +1,24 @@ +{ + "components": [ + "alert", + "avatar", + "badge", + "base", + "button", + "checkbox", + "checkbox-group", + "dialog-box", + "image-viewer", + "input", + "list", + "loading", + "nav-bar", + "numeric", + "radio", + "search", + "switch", + "tabbar", + "tabbar-item", + "tabs" + ] +} \ No newline at end of file diff --git a/packages/theme-mobile/src/time-line/index.js b/packages/theme-mobile/src/time-line/index.js new file mode 100644 index 000000000..f8bfeb962 --- /dev/null +++ b/packages/theme-mobile/src/time-line/index.js @@ -0,0 +1,16 @@ +export default { + 'tiny-mobile-timeline-font-size': '14px', + 'tiny-mobile-timeline-color': '#333', + 'tiny-mobile-timeline-hairline-color': '#ddd', + 'tiny-mobile-timeline-user-color': '#039be5', + 'tiny-mobile-timeline-cycle-color': '#666', + 'tiny-mobile-timeline-tip-color': '#ef4f4f', + 'tiny-mobile-timeline-icon-size': '20px', + 'tiny-mobile-timeline-complete-color': '#ccc', + 'tiny-mobile-timeline-complete-icon-border-color': '#ccc', + 'tiny-mobile-timeline-complete-icon-bgcolor': '#f8f8f8', + 'tiny-mobile-timeline-fail-icon-color': '#f36f64', + 'tiny-mobile-timeline-success-icon-color': '#50e3c2', + 'tiny-mobile-timeline-current-icon-color': + 'radial-gradient(#fff, #fff 15%, #36b2ef, #90d3f3, #cdebfa, #fff)' +} diff --git a/packages/theme-mobile/src/time-line/index.less b/packages/theme-mobile/src/time-line/index.less new file mode 100644 index 000000000..360dc0563 --- /dev/null +++ b/packages/theme-mobile/src/time-line/index.less @@ -0,0 +1,168 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/hairline.less'; +@import '../custom.less'; +@import './vars.less'; + +@timeline-prefix-cls: ~'@{css-prefix}mobile-timeline'; + +.@{timeline-prefix-cls} { + overflow: hidden; + font-size: var(--ti-mobile-timeline-font-size, 14px); + + &__item { + .hairline('bottom', var(--ti-mobile-timeline-hairline-color, #ddd)); + + &.complete { + .@{timeline-prefix-cls}__date, + .@{timeline-prefix-cls}__time { + color: var(--ti-mobile-timeline-complete-color, #ccc); + } + + .@{timeline-prefix-cls}__icon { + background: var(--ti-mobile-timeline-complete-icon-bgcolor, #f8f8f8); + border: 1px solid var(--ti-mobile-timeline-complete-icon-border-color, #ccc); + } + + .@{timeline-prefix-cls}__title, + .@{timeline-prefix-cls}__cycle, + .@{timeline-prefix-cls}__user, + .@{timeline-prefix-cls}__tip { + color: var(--ti-mobile-timeline-complete-color, #ccc); + } + } + + &.fail { + .@{timeline-prefix-cls}__icon { + background: var(--ti-mobile-timeline-fail-icon-color, #f36f64); + border: 1px solid var(--ti-mobile-timeline-fail-icon-color, #f36f64); + } + } + + &.success { + .@{timeline-prefix-cls}__icon { + background: var(--ti-mobile-timeline-success-icon-color, #50e3c2); + border: 1px solid var(--ti-mobile-timeline-success-icon-color, #50e3c2); + } + } + + &.current { + .@{timeline-prefix-cls}__icon { + background: var(--ti-mobile-timeline-current-icon-color, radial-gradient(#fff, #fff 15%, #36b2ef, #90d3f3, #cdebfa, #fff)); + } + } + + &:first-child .@{timeline-prefix-cls}__line:before { + height: 60%; + bottom: 0; + } + + &:last-child .@{timeline-prefix-cls}__line:before { + height: 30%; + } + } + + & &__list { + display: flex; + } + + & &__line { + width: 1px; + position: relative; + + &:before { + content: ''; + width: 1px; + height: 100%; + display: block; + position: absolute; + background-color: var(--ti-mobile-timeline-hairline-color, #ddd); + left: 0; + transform-origin: 100% 50%; + + html:not([data-scale]) & { + @media (min-resolution: 2dppx) { + transform: scaleX(0.5); + } + + @media (min-resolution: 3dppx) { + transform: scaleX(0.33); + } + } + } + } + + & &__date-time { + text-align: right; + color: var(--ti-mobile-timeline-color, #333); + padding: 15px 22px 15px 4px; + min-width: 100px; + } + + & &__time { + display: block; + color: var(--ti-mobile-timeline-color, #333); + font-size: var(--ti-mobile-timeline-font-size, 14px); + } + + & &__date { + font-size: var(--ti-mobile-timeline-font-size, 14px); + } + + & &__content { + display: flex; + flex-direction: column; + padding: 15px 16px 14px 22px; + flex: 1; + } + + &__title { + display: inline-block; + width: 60%; + margin-bottom: 2px; + line-height: 1.6; + } + + &__user { + width: 60%; + color: var(--ti-mobile-timeline-user-color, #039be5); + display: inline-block; + } + + &__cycle { + color: var(--ti-mobile-timeline-cycle-color, #666); + } + + &__tip { + color: var(--ti-mobile-timeline-tip-color, #ef4f4f); + } + + .name { + float: left; + margin-left: 15px; + font-size: var(--ti-mobile-timeline-font-size, 14px); + } + + &__icon { + width: var(--ti-mobile-timeline-icon-size, 20px); + height: var(--ti-mobile-timeline-icon-size, 20px); + line-height: var(--ti-mobile-timeline-icon-size, 20px); + position: relative; + text-align: center; + left: ~'calc(50% - 10px)'; + top: 17px; + border-radius: 50%; + cursor: pointer; + z-index: 15; + } +} diff --git a/packages/theme-mobile/src/time-line/vars.less b/packages/theme-mobile/src/time-line/vars.less new file mode 100644 index 000000000..e6aa22dd9 --- /dev/null +++ b/packages/theme-mobile/src/time-line/vars.less @@ -0,0 +1,15 @@ +:root { + --ti-mobile-timeline-font-size: 14px; + --ti-mobile-timeline-color: #333; + --ti-mobile-timeline-hairline-color: #ddd; + --ti-mobile-timeline-user-color: #039be5; + --ti-mobile-timeline-cycle-color: #666; + --ti-mobile-timeline-tip-color: #ef4f4f; + --ti-mobile-timeline-icon-size: 20px; + --ti-mobile-timeline-complete-color: #ccc; + --ti-mobile-timeline-complete-icon-border-color: #ccc; + --ti-mobile-timeline-complete-icon-bgcolor: #f8f8f8; + --ti-mobile-timeline-fail-icon-color: #f36f64; + --ti-mobile-timeline-success-icon-color: #50e3c2; + --ti-mobile-timeline-current-icon-color: radial-gradient(#fff, #fff 15%, #36b2ef, #90d3f3, #cdebfa, #fff); +} diff --git a/packages/theme-mobile/src/upload-dragger/index.js b/packages/theme-mobile/src/upload-dragger/index.js new file mode 100644 index 000000000..4bf4ebb6c --- /dev/null +++ b/packages/theme-mobile/src/upload-dragger/index.js @@ -0,0 +1,3 @@ +export default { + // mobile/upload-dragger +} diff --git a/packages/theme-mobile/src/upload-dragger/index.less b/packages/theme-mobile/src/upload-dragger/index.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme-mobile/src/upload-dragger/index.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme-mobile/src/upload-dragger/vars.less b/packages/theme-mobile/src/upload-dragger/vars.less new file mode 100644 index 000000000..e69de29bb diff --git a/packages/theme-mobile/src/upload-list/index.js b/packages/theme-mobile/src/upload-list/index.js new file mode 100644 index 000000000..dda8848ad --- /dev/null +++ b/packages/theme-mobile/src/upload-list/index.js @@ -0,0 +1,15 @@ +export default { + 'tiny-mobile-upload-list-item-border-radius': '2px', + 'tiny-mobile-upload-list-item-bgcolor': '#f9f9f9', + 'tiny-mobile-upload-list-icon-close-color': '#606266', + 'tiny-mobile-upload-list-icon-size': '24px', + 'tiny-mobile-upload-list-picture-card-close-size': '16px', + 'tiny-mobile-upload-list-picture-card-close-color': '#f36f64', + 'tiny-mobile-upload-list-file-type-icon-size': '40px', + 'tiny-mobile-upload-list-file-type-icon-color': '#606266', + 'tiny-mobile-upload-list-file-name-color': '#333', + 'tiny-mobile-upload-list-file-name-font-size': '14px', + 'tiny-mobile-upload-list-file-size-color': '#999', + 'tiny-mobile-upload-list-file-size-font-size': '12px', + 'tiny-mobile-upload-list-progress-outer-bgcolor': '#e6e6e6' +} diff --git a/packages/theme-mobile/src/upload-list/index.less b/packages/theme-mobile/src/upload-list/index.less new file mode 100644 index 000000000..eaffc02e1 --- /dev/null +++ b/packages/theme-mobile/src/upload-list/index.less @@ -0,0 +1,169 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@upload-list-prefix-cls: ~'@{css-prefix}mobile-upload-list'; +@image-viewer-prefix-cls: ~'@{css-prefix}mobile-image-viewer'; +@progress-prefix-cls: ~'@{css-prefix}progress'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{upload-list-prefix-cls} { + & &__item { + position: relative; + display: flex; + border-radius: var(--ti-mobile-upload-list-item-border-radius, 2px); + margin: 0 10px 8px 10px; + background-color: var(--ti-mobile-upload-list-item-bgcolor, #f9f9f9); + line-height: 48px; + + &:focus { + outline: 0; + } + + .icon-close { + fill: var(--ti-mobile-upload-list-icon-close-color, #606266); + font-size: var(--ti-mobile-upload-list-icon-size, 24px); + opacity: 0.75; + cursor: pointer; + } + + .@{progress-prefix-cls} { + position: absolute; + top: unset; + bottom: 0; + } + } + + // 图片墙样式 + &--picture-card &__item { + width: var(--ti-mobile-file-upload-picture-card-size, 64px); + height: var(--ti-mobile-file-upload-picture-card-size, 64px); + margin: 0 12px 12px 0; + box-sizing: border-box; + float: left; + + .card-close { + font-size: var(--ti-mobile-upload-list-picture-card-close-size, 16px); + fill: var(--ti-mobile-upload-list-picture-card-close-color, #f36f64); + position: absolute; + top: 0; + right: 0; + transform: translate(50%, -50%); + z-index: 999; + } + + .@{progress-prefix-cls} { + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + bottom: auto; + } + } + + &--picture-card &__item-thumbnail { + width: 100%; + height: 100%; + } + + &__card { + height: 100%; + width: 100%; + } + + &--picture-card { + .@{progress-prefix-cls}-circle { + width: 100%; + height: 100%; + background-color: rgba(0, 0, 0, 0.4); + } + + .@{progress-prefix-cls}__text { + color: #fff; + } + } + + // 列表 + &__list { + width: 100%; + display: flex; + justify-content: flex-start; + align-items: center; + + .file-type { + font-size: 0; + + .@{svg-prefix-cls} { + font-size: var(--ti-mobile-upload-list-file-type-icon-size, 40px); + fill: var(--ti-mobile-upload-list-file-type-icon-color, #606266); + line-height: 1; + margin: 4px 8px 4px 4px; + } + + .file-type-icon { + width: var(--ti-mobile-upload-list-file-type-icon-size, 40px); + height: var(--ti-mobile-upload-list-file-type-icon-size, 40px); + margin: 4px 8px 4px 4px; + } + } + + .file-delete { + margin: 0 8px 0 12px; + } + } + + &__text { + position: relative; + flex: 1; + max-width: calc(100% - 96px); + + &-details { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + + &:focus { + outline: 0; + } + } + + .file-name { + margin-top: 4px; + color: var(--ti-mobile-upload-list-file-name-color, #333); + font-size: var(--ti-mobile-upload-list-file-name-font-size, 14px); + line-height: 1.42857143; + } + + .file-size { + color: var(--ti-mobile-upload-list-file-size-color, #999); + font-size: var(--ti-mobile-upload-list-file-size-font-size, 12px); + line-height: 1.41666667; + } + } + + .@{progress-prefix-cls}-bar__outer { + background-color: var(--ti-mobile-upload-list-progress-outer-bgcolor, #e6e6e6); + } + + .@{image-viewer-prefix-cls}__btn { + .@{image-viewer-prefix-cls}__actions { + background-color: none; + } + + .@{image-viewer-prefix-cls}__actions-inner { + .@{svg-prefix-cls}:not(:last-child) { + display: none; + } + } + } +} diff --git a/packages/theme-mobile/src/upload-list/vars.less b/packages/theme-mobile/src/upload-list/vars.less new file mode 100644 index 000000000..da5a25361 --- /dev/null +++ b/packages/theme-mobile/src/upload-list/vars.less @@ -0,0 +1,15 @@ +:root { + --ti-mobile-upload-list-item-border-radius: 2px; + --ti-mobile-upload-list-item-bgcolor: #f9f9f9; + --ti-mobile-upload-list-icon-close-color: #606266; + --ti-mobile-upload-list-icon-size: 24px; + --ti-mobile-upload-list-picture-card-close-size: 16px; + --ti-mobile-upload-list-picture-card-close-color: #f36f64; + --ti-mobile-upload-list-file-type-icon-size: 40px; + --ti-mobile-upload-list-file-type-icon-color: #606266; + --ti-mobile-upload-list-file-name-color: #333; + --ti-mobile-upload-list-file-name-font-size: 14px; + --ti-mobile-upload-list-file-size-color: #999; + --ti-mobile-upload-list-file-size-font-size: 12px; + --ti-mobile-upload-list-progress-outer-bgcolor: #e6e6e6; +} diff --git a/packages/theme-mobile/src/upload/index.js b/packages/theme-mobile/src/upload/index.js new file mode 100644 index 000000000..130ff66f6 --- /dev/null +++ b/packages/theme-mobile/src/upload/index.js @@ -0,0 +1,3 @@ +export default { + // mobile/upload +} diff --git a/packages/theme-mobile/src/upload/index.less b/packages/theme-mobile/src/upload/index.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme-mobile/src/upload/index.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme-mobile/src/upload/vars.less b/packages/theme-mobile/src/upload/vars.less new file mode 100644 index 000000000..e69de29bb diff --git a/packages/theme-mobile/src/user-head/index.js b/packages/theme-mobile/src/user-head/index.js new file mode 100644 index 000000000..11796afd3 --- /dev/null +++ b/packages/theme-mobile/src/user-head/index.js @@ -0,0 +1,18 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +export default { + 'tiny-mobile-userhead-head-icon-size-normal': '20px', + 'tiny-mobile-userhead-head-icon-size-small': '16px', + 'tiny-mobile-userhead-head-border-radius': '15%', + 'tiny-mobile-userhead-head-bg-color': '#4a79fe', +} diff --git a/packages/theme-mobile/src/user-head/index.less b/packages/theme-mobile/src/user-head/index.less new file mode 100644 index 000000000..d7c8c3fa0 --- /dev/null +++ b/packages/theme-mobile/src/user-head/index.less @@ -0,0 +1,124 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@user-head-prefix-cls: ~'@{css-prefix}mobile-user-head'; + +.@{user-head-prefix-cls} { + .component-css-vars-user-head(); + + display: inline-block; + position: relative; + + &__portrait { + overflow: hidden; + text-align: center; + border-radius: var(--ti-mobile-userhead-head-border-radius); + background-position: center center; + background-repeat: no-repeat; + background-size: cover; + background-color: var(--ti-mobile-userhead-head-bg-color); + + &.round { + border-radius: 50%; + } + + &.min { + width: var(--ti-mobile-userhead-head-size-small); + height: var(--ti-mobile-userhead-head-size-small); + line-height: var(--ti-mobile-userhead-head-size-small); + } + + &.icon { + font-size: var(--ti-mobile-userhead-head-icon-size-normal); + + &.min { + font-size: var(--ti-mobile-userhead-head-icon-size-small); + } + + svg { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + } + } + + &.label { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + + > span { + overflow: hidden; + width: calc(~'100% - 6px'); + display: block; + margin: 0 3px; + font-size: 20px; + } + } + } + + &__message { + position: absolute; + top: -9px; + height: 18px; + line-height: 16px; + min-width: 18px; + width: auto; + border-radius: 9px; + background: red; + color: #fff; + text-align: center; + padding: 0 2px; + border: 2px solid #fff; + font-size: 12px; + word-break: initial; + + &.round { + top: 0; + left: 54px; + } + + &.min { + top: -9px; + left: 21px; + } + + &.basic { + top: -4px; + left: 68px; + height: 8px; + width: 8px; + min-width: 8px; + line-height: 0; + border-radius: 4px; + + &.round { + top: 10px; + left: 64px; + } + + &.min { + top: -4px; + left: 26px; + + &.round { + top: 0; + } + } + } + } +} diff --git a/packages/theme-mobile/src/user-head/vars.less b/packages/theme-mobile/src/user-head/vars.less new file mode 100644 index 000000000..a5abfefbe --- /dev/null +++ b/packages/theme-mobile/src/user-head/vars.less @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-user-head() { + --ti-mobile-userhead-head-icon-size-normal: 20px; + --ti-mobile-userhead-head-icon-size-small: 16px; + --ti-mobile-userhead-head-border-radius: 15%; + --ti-mobile-userhead-head-bg-color: var(--ti-mobile-common-bg-color-main, #4a79fe); +} diff --git a/packages/theme-mobile/src/vars.less b/packages/theme-mobile/src/vars.less new file mode 100644 index 000000000..9337fe9b8 --- /dev/null +++ b/packages/theme-mobile/src/vars.less @@ -0,0 +1,20 @@ +@import './base/vars.less'; +@import './alert/vars.less'; +@import './avatar/vars.less'; +@import './badge/vars.less'; +@import './button/vars.less'; +@import './checkbox/vars.less'; +@import './checkbox-group/vars.less'; +@import './dialog-box/vars.less'; +@import './image-viewer/vars.less'; +@import './input/vars.less'; +@import './list/vars.less'; +@import './loading/vars.less'; +@import './nav-bar/vars.less'; +@import './numeric/vars.less'; +@import './radio/vars.less'; +@import './search/vars.less'; +@import './switch/vars.less'; +@import './tabbar/vars.less'; +@import './tabbar-item/vars.less'; +@import './tabs/vars.less'; diff --git a/packages/theme-mobile/src/vars/index.js b/packages/theme-mobile/src/vars/index.js new file mode 100644 index 000000000..3539dc357 --- /dev/null +++ b/packages/theme-mobile/src/vars/index.js @@ -0,0 +1,85 @@ +import ActionSheet from '../action-sheet' +import Alert from '../alert' +import Avatar from '../avatar' +import Badge from '../badge' +import Base from '../base' +import Button from '../button' +import Checkbox from '../checkbox' +import CheckboxGroup from '../checkbox-group' +import DialogBox from '../dialog-box' +import DropdownItem from '../dropdown-item' +import DropdownMenu from '../dropdown-menu' +import Exception from '../exception' +import FileUpload from '../file-upload' +import Form from '../form' +import FormItem from '../form-item' +import ImageViewer from '../image-viewer' +import Input from '../input' +import List from '../list' +import Loading from '../loading' +import MiniPicker from '../mini-picker' +import NavBar from '../nav-bar' +import Numeric from '../numeric' +import PickerColumn from '../picker-column' +import Popup from '../popup' +import Progress from '../progress' +import PullRefresh from '../pull-refresh' +import Radio from '../radio' +import Search from '../search' +import Slider from '../slider' +import Svg from '../svg' +import Switch from '../switch' +import Tabbar from '../tabbar' +import TabbarItem from '../tabbar-item' +import Tabs from '../tabs' +import TallStorage from '../tall-storage' +import TimeLine from '../time-line' +import Upload from '../upload' +import UploadDragger from '../upload-dragger' +import UploadList from '../upload-list' +import MultiSelect from '../multi-select' +import Wheel from '../wheel' + +export default { + ...ActionSheet, + ...Alert, + ...Avatar, + ...Badge, + ...Base, + ...Button, + ...Checkbox, + ...CheckboxGroup, + ...DialogBox, + ...DropdownItem, + ...DropdownMenu, + ...Exception, + ...FileUpload, + ...Form, + ...FormItem, + ...ImageViewer, + ...Input, + ...List, + ...Loading, + ...MiniPicker, + ...NavBar, + ...Numeric, + ...PickerColumn, + ...Popup, + ...Progress, + ...PullRefresh, + ...Radio, + ...Search, + ...Slider, + ...Svg, + ...Switch, + ...Tabbar, + ...TabbarItem, + ...Tabs, + ...TallStorage, + ...TimeLine, + ...Upload, + ...UploadDragger, + ...UploadList, + ...MultiSelect, + ...Wheel, +} diff --git a/packages/theme-mobile/src/wheel/index.js b/packages/theme-mobile/src/wheel/index.js new file mode 100644 index 000000000..c9079fe86 --- /dev/null +++ b/packages/theme-mobile/src/wheel/index.js @@ -0,0 +1,13 @@ +export default { + 'tiny-mobile-wheel-content-font-size': '14px', + 'tiny-mobile-wheel-wrapper-height': '224px', + 'tiny-mobile-wheel-wrapper-font-size': '14px', + 'tiny-mobile-wheel-wrapper-scroll-margin-top': '38px', + 'tiny-mobile-wheel-scroll-hasfooter-line-height': '36px', + 'tiny-mobile-wheel-scroll-hasfooter-height': '36px', + 'tiny-mobile-wheel-scroll-hasfooter-text-color': '#595959', + 'tiny-mobile-wheel-scroll-nofooter-line-height': '44px', + 'tiny-mobile-wheel-scroll-nofooter-height': '44px', + 'tiny-mobile-wheel-scroll-nofooter-text-color': '#191919', + 'tiny-mobile-wheel-scroll-icon-font-size': '20px', +} diff --git a/packages/theme-mobile/src/wheel/index.less b/packages/theme-mobile/src/wheel/index.less new file mode 100644 index 000000000..9f7d8fb0e --- /dev/null +++ b/packages/theme-mobile/src/wheel/index.less @@ -0,0 +1,105 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import '../mixins/hairline.less'; +@import './vars.less'; + +@wheel-prefix-cls: ~'@{css-prefix}mobile-wheel'; + +.@{wheel-prefix-cls} { + width: 100%; + + ul { + list-style: none; + padding: 0; + } + + &__container { + width: 100%; + z-index: 100; + overflow: hidden; + text-align: center; + font-size: var(--ti-mobile-wheel-content-font-size, 14px); + } + + &__picker__panel { + z-index: 600; + } + + &__picker__content { + position: relative; + top: 0px; + } + + &__wheel__wrapper { + display: flex; + padding: 0 16px; + + .wheel { + flex: 1; + width: 1%; + height: var(--ti-mobile-wheel-wrapper-height, 224px); + overflow: hidden; + font-size: var(--ti-mobile-wheel-wrapper-font-size, 14px); + + .wheel__scroll_hasFooter { + padding: 0px; + margin-top: var(--ti-mobile-wheel-wrapper-scroll-margin-top, 38px); + line-height: var(--ti-mobile-wheel-scroll-hasfooter-line-height, 36px); + list-style: none; + + .wheel__item { + list-style: none; + height: var(--ti-mobile-wheel-scroll-hasfooter-height, 36px); + overflow: hidden; + white-space: nowrap; + color: var(--ti-mobile-wheel-scroll-hasfooter-text-color, #595959); + font-weight: 500; + } + + .wheel__item__selected { + color: var(--ti-mobile-base-color-brand-1, #4a79fe); + } + } + + .wheel__scroll_noFooter { + padding: 0px; + margin-top: 0px; + line-height: var(--ti-mobile-wheel-scroll-nofooter-line-height, 44px); + list-style: none; + + .wheel__item { + list-style: none; + height: var(--ti-mobile-wheel-scroll-nofooter-height, 44px); + overflow: hidden; + white-space: nowrap; + color: var(--ti-mobile-wheel-scroll-nofooter-text-color, #191919); + font-weight: 500; + display: flex; + justify-content: space-between; + align-items: center; + } + + .wheel__item__selected { + color: var(--ti-mobile-base-color-brand-1, #4a79fe); + fill: var(--ti-mobile-base-color-brand-1, #4a79fe); + } + + .size20 { + font-size: var(--ti-mobile-wheel-scroll-icon-font-size, 20px); + } + } + } + } + +} \ No newline at end of file diff --git a/packages/theme-mobile/src/wheel/vars.less b/packages/theme-mobile/src/wheel/vars.less new file mode 100644 index 000000000..16741464f --- /dev/null +++ b/packages/theme-mobile/src/wheel/vars.less @@ -0,0 +1,13 @@ +:root { + --ti-mobile-wheel-content-font-size: 14px; + --ti-mobile-wheel-wrapper-height: 224px; + --ti-mobile-wheel-wrapper-font-size: 14px; + --ti-mobile-wheel-wrapper-scroll-margin-top: 38px; + --ti-mobile-wheel-scroll-hasfooter-line-height: 36px; + --ti-mobile-wheel-scroll-hasfooter-height: 36px; + --ti-mobile-wheel-scroll-hasfooter-text-color: #595959; + --ti-mobile-wheel-scroll-nofooter-line-height: 44px; + --ti-mobile-wheel-scroll-nofooter-height: 44px; + --ti-mobile-wheel-scroll-nofooter-text-color: #191919; + --ti-mobile-wheel-scroll-icon-font-size: 20px; +} diff --git a/packages/theme/.postcssrc.js b/packages/theme/.postcssrc.js new file mode 100644 index 000000000..5e2725d56 --- /dev/null +++ b/packages/theme/.postcssrc.js @@ -0,0 +1,7 @@ +module.exports = { + "plugins": { + // to edit target browsers: use "browserslist" field in package.json + "postcss-import": {}, + "autoprefixer": {} + } +} diff --git a/packages/theme/CHANGELOG.md b/packages/theme/CHANGELOG.md new file mode 100644 index 000000000..e69de29bb diff --git a/packages/theme/README.md b/packages/theme/README.md new file mode 100644 index 000000000..d69f30914 --- /dev/null +++ b/packages/theme/README.md @@ -0,0 +1,11 @@ +# @opentiny/vue-theme + +### 调试技巧: +- 1、安装 `onchange` 依赖: +```bash +npm i onchange -g +``` +- 2、执行如下命令,实现保存文件自动编译后更新到 `opentiny-vue` 工程 `node_modules/@opentiny/vue-theme` 依赖 +```bash +onchange -k '**/*.less' -- npm run build:copy-remote +``` \ No newline at end of file diff --git a/packages/theme/build/gulp-dist.js b/packages/theme/build/gulp-dist.js new file mode 100644 index 000000000..a5f210466 --- /dev/null +++ b/packages/theme/build/gulp-dist.js @@ -0,0 +1,49 @@ +/** + * 打包 theme 目录到 dist 目录 + */ + +const gulp = require('gulp') +const less = require('gulp-less') +const cssmin = require('gulp-clean-css') +const svgInline = require('gulp-svg-inline') +const prefixer = require('gulp-autoprefixer') + +const source = '../src' +const dist = '../dist' +const svgInlineOption = { + maxImageSize: 1 * 1024 * 1024, + extensions: [/\.svg/gi] +} + +gulp.task('compile', () => { + return gulp + .src([`${source}/**/index.less`, `${source}/index.less`]) + .pipe(svgInline(svgInlineOption)) + .pipe(less()) + .pipe( + prefixer({ + borwsers: ['last 1 version', '> 1%', 'not ie <= 8'], + cascade: true, + remove: true + }) + ) + .pipe(svgInline(svgInlineOption)) + .pipe(cssmin()) + .pipe(gulp.dest(dist)) +}) + +gulp.task('copycssvar', () => { + return gulp + .src([`${source}/**/*.js`, `${source}/index.js`], { allowEmpty: true }) + .pipe(gulp.dest(`${dist}`)) +}) + +gulp.task('copysvgs', () => { + return gulp.src([`${source}/svgs/**`]).pipe(gulp.dest(`${dist}/svgs`)) +}) + +gulp.task('copyimage', () => { + return gulp.src([`${source}/images/**`]).pipe(gulp.dest(`${dist}/images`)) +}) + +gulp.task('build', gulp.series('compile', 'copycssvar', 'copysvgs', 'copyimage')) diff --git a/packages/theme/build/release.js b/packages/theme/build/release.js new file mode 100644 index 000000000..41f8fd6f2 --- /dev/null +++ b/packages/theme/build/release.js @@ -0,0 +1,27 @@ +/** + * 将 dist 目录生成 TGZ 的压缩包 + */ + +const fs = require('fs') +const path = require('path') +const { execSync } = require('child_process') +const source = 'dist' +const content = fs.readFileSync(path.join(source, 'index.css')).toString('UTF-8') +// 提供特殊的前缀名称 +const result = content.replace(/--ti-/g, '--ti-vue-') +const packagesPath = path.join(source, 'lowcode.css') + +fs.writeFileSync(packagesPath, result) + +fs.copyFileSync('package.json', path.join(source, 'package.json')) + +// execSync('npm pack', { cwd: source }) + +fs.readdirSync(source).forEach((item) => { + if (item.endsWith('.tgz')) { + const tgzPath = path.join(source, item) + + fs.copyFileSync(tgzPath, path.join(item)) + fs.unlinkSync(tgzPath) + } +}) diff --git a/packages/theme/build/replace-img.js b/packages/theme/build/replace-img.js new file mode 100644 index 000000000..935b3539f --- /dev/null +++ b/packages/theme/build/replace-img.js @@ -0,0 +1,13 @@ +/** + * 将 dist 目录 index.css 图片资源路径 ../images/ 改为 images + */ + +const fs = require('fs') +const path = require('path') + +const source = 'dist' + +const entryFile = path.join(source, 'index.css') +let file = fs.readFileSync(entryFile, 'utf8') +file = file.replace(/url\(\.\.\/images\//g, 'url(images/') +fs.writeFileSync(entryFile, file, 'utf8') diff --git a/packages/theme/package.json b/packages/theme/package.json new file mode 100644 index 000000000..3e846bec8 --- /dev/null +++ b/packages/theme/package.json @@ -0,0 +1,44 @@ +{ + "name": "@opentiny/vue-theme", + "version": "3.7.0", + "description": "An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.", + "main": "index.css", + "homepage": "https://opentiny.design/tiny-vue", + "keywords": [ + "vue", + "vue3", + "frontend", + "component-library", + "components", + "vue-components", + "opentiny", + "renderless-components", + "headless-components" + ], + "author": "OpenTiny Team", + "license": "MIT", + "exports": { + "./*": "./src/*" + }, + "scripts": { + "clean": "rimraf dist", + "build:theme": "gulp build --gulpfile build/gulp-dist.js", + "build": "npm run clean && npm run build:theme && node build/replace-img.js", + "build:fast": "npm run build && npm run release", + "release": "node build/release.js", + "build:copy-remote": "npm run build:theme && cp-cli dist ../aurora-vue/node_modules/@aurora/theme", + "publishTgz": "node .cloudbuild/publish-tgzs.js", + "postversion": "pnpm build" + }, + "devDependencies": { + "@babel/cli": "^7.5.5", + "@babel/core": "^7.5.5", + "@babel/preset-env": "^7.5.5", + "gulp": "^4.0.2", + "gulp-autoprefixer": "^7.0.1", + "gulp-clean-css": "^4.2.0", + "gulp-less": "^5.0.0", + "gulp-svg-inline": "^1.0.1", + "rimraf": "^2.6.2" + } +} diff --git a/packages/theme/src/action-menu/index.js b/packages/theme/src/action-menu/index.js new file mode 100644 index 000000000..48c3213fd --- /dev/null +++ b/packages/theme/src/action-menu/index.js @@ -0,0 +1,13 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +export default {} diff --git a/packages/theme/src/action-menu/index.less b/packages/theme/src/action-menu/index.less new file mode 100644 index 000000000..0f048553d --- /dev/null +++ b/packages/theme/src/action-menu/index.less @@ -0,0 +1,86 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@action-menu-prefix-cls: ~'@{css-prefix}action-menu'; +@dropdown-item-prefix-cls: ~'@{css-prefix}dropdown-menu__item'; + +.@{action-menu-prefix-cls} { + .component-css-vars-action-menu(); + + font-size: var(--ti-action-menu-font-size); + color: var(--ti-action-menu-text-color); + + &__wrap { + display: flex; + + .@{action-menu-prefix-cls}__item { + display: flex; + justify-content: space-between; + align-items: center; + + .tiny-svg { + fill: var(--ti-action-menu-text-color); + margin: var(--ti-action-menu-item-svg-margin-top) var(--ti-action-menu-item-svg-margin-right) var(--ti-action-menu-item-svg-margin-bottom) var(--ti-action-menu-item-svg-margin-left); + } + + &:hover:not(.is-disabled) { + color: var(--ti-action-menu-item-hover-text-color); + + &.@{action-menu-prefix-cls}__item-visable { + .@{dropdown-item-prefix-cls} { + color: var(--ti-action-menu-item-hover-text-color); + } + + } + + .tiny-svg { + fill: var(--ti-action-menu-item-hover-text-color); + } + } + + &.is-disabled:hover{ + .@{dropdown-item-prefix-cls} { + color: var(--ti-action-menu-item-disabled-text-color); + } + } + + &.@{action-menu-prefix-cls}__item-visable { + .@{dropdown-item-prefix-cls} { + color: var(--ti-action-menu-text-color); + padding: var(--ti-action-menu-item-padding-top) var(--ti-action-menu-item-padding-right) var(--ti-action-menu-item-padding-bottom) var(--ti-action-menu-item-padding-left); + + &:hover { + background-color: var(--ti-action-menu-item-hover-bg-color); + } + } + } + + &.is-disabled { + .@{dropdown-item-prefix-cls} { + cursor: not-allowed; + color: var(--ti-action-menu-item-disabled-text-color); + } + } + + .@{action-menu-prefix-cls}__item-line { + position: relative; + width: 1px; + height: 12px; + background: var(--ti-action-menu-item-line-bg-color); + display: inline-block; + } + } + } +} \ No newline at end of file diff --git a/packages/theme/src/action-menu/vars.less b/packages/theme/src/action-menu/vars.less new file mode 100644 index 000000000..e6822dbf0 --- /dev/null +++ b/packages/theme/src/action-menu/vars.less @@ -0,0 +1,28 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-action-menu() { + --ti-action-menu-text-color: var(--ti-common-color-text-link); + --ti-action-menu-font-size: var(--ti-common-font-size-base); + --ti-action-menu-item-line-bg-color: var(--ti-common-color-line-dividing); + --ti-action-menu-item-disabled-text-color: var(--ti-common-color-text-disabled); + --ti-action-menu-item-hover-bg-color: var(--ti-common-color-transparent); + --ti-action-menu-item-hover-text-color:var(--ti-common-color-text-link-hover); + --ti-action-menu-item-padding-top: 0; + --ti-action-menu-item-padding-right: 0; + --ti-action-menu-item-padding-bottom: 0; + --ti-action-menu-item-padding-left: 0; + --ti-action-menu-item-svg-margin-top: -2px; + --ti-action-menu-item-svg-margin-right: 5px; + --ti-action-menu-item-svg-margin-bottom: 0; + --ti-action-menu-item-svg-margin-left: 0; +} diff --git a/packages/theme/src/alert/index.js b/packages/theme/src/alert/index.js new file mode 100644 index 000000000..077c8b360 --- /dev/null +++ b/packages/theme/src/alert/index.js @@ -0,0 +1,40 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-alert-description-font-size': '12px', + 'tiny-alert-title-font-size': '16px', + 'tiny-alert-close-font-size': '12px', + 'tiny-alert-nomal-content-line-height': '1.5', + 'tiny-alert-border-radius': '2px', + 'tiny-alert-title-text-color': '#333', + 'tiny-alert-nomal-height': '36px', + 'tiny-alert-description-text-color': '#333', + 'tiny-alert-opration-text-color': '#1890ff', + 'tiny-alert-opration-font-size': '12px', + 'tiny-alert-warning-border-color': '#ffd666', + 'tiny-alert-warning-icon-color': '#faad14', + 'tiny-alert-warning-link-text-color': '#ffc833', + 'tiny-alert-warning-bg-color': '#fffbe6', + 'tiny-alert-error-border-color': '#ff7875', + 'tiny-alert-error-icon-color': '#f5222d', + 'tiny-alert-error-link-text-color': '#ff4642', + 'tiny-alert-error-bg-color': '#fff1f0', + 'tiny-alert-success-border-color': '#95de64', + 'tiny-alert-success-icon-color': '#52c41a', + 'tiny-alert-success-link-text-color': '#78d53a', + 'tiny-alert-success-bg-color': '#f6ffed', + 'tiny-alert-info-border-color': '#91d5ff', + 'tiny-alert-info-icon-color': '#1890ff', + 'tiny-alert-info-link-text-color': '#5ec2ff', + 'tiny-alert-info-bg-color': '#e6f7ff' +} diff --git a/packages/theme/src/alert/index.less b/packages/theme/src/alert/index.less new file mode 100644 index 000000000..4bdd9d120 --- /dev/null +++ b/packages/theme/src/alert/index.less @@ -0,0 +1,180 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/alert.less'; +@import '../custom.less'; +@import './vars.less'; +@import '../transition/alert-fade.less'; + +@alert-prefix-cls: ~'@{css-prefix}alert'; + +.@{alert-prefix-cls} { + .component-css-vars-alert(); + + position: relative; + border: 1px solid; + border-radius: var(--ti-alert-border-radius); + + &&--normal { + padding: 11px 16px; + margin: 8px 0; + display: flex; + justify-content: flex-start; + align-items: center; + + .@{alert-prefix-cls}__content { + padding: 0 8px; + display: table-cell; + line-height: var(--ti-alert-nomal-content-line-height); + max-width: calc(100% - 30px); + } + } + + &&--large { + padding: 18px 24px 14px; + display: flex; + + .@{alert-prefix-cls}__content { + padding-left: 16px; + display: flex; + flex-direction: column; + justify-content: flex-start; + align-items: flex-start; + } + + .@{alert-prefix-cls}__description { + margin-bottom: 6px; + margin-top: 12px; + line-height: 1; + + &.is-hide { + margin: 0; + } + } + + .@{alert-prefix-cls}__icon { + font-size: 24px; + vertical-align: top; + flex-shrink: 0; + + &.@{alert-prefix-cls}__close { + font-size: 12px; + } + } + + .@{alert-prefix-cls}__close { + top: 12px; + right: 12px; + transform: none; + } + } + + &&--success { + .alert-variant( + var(--ti-alert-title-text-color); + var(--ti-alert-success-border-color); + var(--ti-alert-success-icon-color); + var(--ti-alert-success-link-text-color); + var(--ti-alert-success-bg-color) + ); + } + + &&--info { + .alert-variant( + var(--ti-alert-title-text-color); + var(--ti-alert-info-border-color) ; + var(--ti-alert-info-icon-color) ; + var(--ti-alert-info-link-text-color) ; + var(--ti-alert-info-bg-color) + ); + } + + &&--warning { + .alert-variant( + var(--ti-alert-title-text-color) ; + var(--ti-alert-warning-border-color) ; + var(--ti-alert-warning-icon-color) ; + var(--ti-alert-warning-link-text-color) ; + var(--ti-alert-warning-bg-color) + ); + } + + &&--error { + .alert-variant( + var(--ti-alert-title-text-color) ; + var(--ti-alert-error-border-color) ; + var(--ti-alert-error-icon-color) ; + var(--ti-alert-error-link-text-color) ; + var(--ti-alert-error-bg-color) + ); + } + + &__icon { + font-size: 16px; + } + + &.is-center { + justify-content: center; + text-align: center; + } + + .is-custom { + position: absolute; + top: 50%; + right: 12px; + transform: translateY(-50%); + cursor: pointer; + } + + & &__close { + font-size: var(--ti-alert-close-font-size); + position: absolute; + top: 50%; + right: 12px; + transform: translateY(-50%); + cursor: pointer; + } + + & &__content { + .@{alert-prefix-cls}__opration { + font-size: 12px; + color: var(--ti-alert-opration-text-color); + line-height: 1; + + a { + font-size: 12px; + color: var(--ti-alert-opration-text-color); + } + + a:not(:last-child) { + margin-right: 16px; + } + } + } + + & &__title { + font-size: 16px; + color: var(--ti-alert-title-text-color); + font-weight: bold; + } + + & &__description { + font-size: var(--ti-alert-description-font-size); + color: var(--ti-alert-description-text-color); + } + + p { + display: inline-block; + line-height: 16px; + padding-left: 8px; + } +} diff --git a/packages/theme/src/alert/vars.less b/packages/theme/src/alert/vars.less new file mode 100644 index 000000000..c2dad6aa1 --- /dev/null +++ b/packages/theme/src/alert/vars.less @@ -0,0 +1,41 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-alert() { + --ti-alert-description-font-size: var(--ti-common-font-size-base); + --ti-alert-close-font-size: var(--ti-common-font-size-base); + --ti-alert-border-radius: var(--ti-common-border-radius-normal); + --ti-alert-title-text-color: var(--ti-base-color-info-normal); + --ti-alert-nomal-content-line-height: var(--ti-common-line-height-number); + --ti-alert-description-text-color: var(--ti-base-color-info-normal); + --ti-alert-opration-text-color: var(--ti-base-color-brand-7); + + --ti-alert-warning-border-color: var(--ti-common-color-warn-border); + --ti-alert-warning-icon-color: var(--ti-common-color-warn); + --ti-alert-warning-link-text-color: var(--ti-common-color-warn-text); + --ti-alert-warning-bg-color: var(--ti-common-color-warn-bg); + + --ti-alert-error-border-color: var(--ti-common-color-error-border-secondary); + --ti-alert-error-icon-color: var(--ti-common-color-error); + --ti-alert-error-link-text-color: var(--ti-common-color-error-text); + --ti-alert-error-bg-color: var(--ti-common-color-error-bg); + + --ti-alert-success-border-color: var(--ti-common-color-success-border); + --ti-alert-success-icon-color: var(--ti-common-color-success); + --ti-alert-success-link-text-color: var(--ti-common-color-text-success); + --ti-alert-success-bg-color: var(--ti-common-color-success-bg); + + --ti-alert-info-border-color: var(--ti-common-color-prompt-border); + --ti-alert-info-icon-color: var(--ti-common-color-prompt); + --ti-alert-info-link-text-color: var(--ti-common-color-prompt-text); + --ti-alert-info-bg-color: var(--ti-common-color-prompt-bg); +} diff --git a/packages/theme/src/amount/index.js b/packages/theme/src/amount/index.js new file mode 100644 index 000000000..eb9ff8359 --- /dev/null +++ b/packages/theme/src/amount/index.js @@ -0,0 +1,16 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-amount-icon-color': '#1890ff', + 'tiny-amount-icon-font-size': '14px' +} diff --git a/packages/theme/src/amount/index.less b/packages/theme/src/amount/index.less new file mode 100644 index 000000000..59dee6d22 --- /dev/null +++ b/packages/theme/src/amount/index.less @@ -0,0 +1,73 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@amount-prefix-cls: ~'@{css-prefix}amount'; +@svg-prefix-cls: ~'@{css-prefix}svg'; +@input-prefix-cls: ~'@{css-prefix}input'; +@popover-prefix-cls: ~'@{css-prefix}popover'; + +.@{amount-prefix-cls} { + .component-css-vars-amount(); + + width: 270px; + + & &-input-icon { + .@{svg-prefix-cls} { + fill: var(--ti-amount-icon-color); + font-size: var(--ti-amount-icon-font-size); + } + } + + &-popper { + width: 270px; + + .popover-con { + .module:not(:last-child) { + margin-bottom: 12px; + } + + .module { + display: flex; + justify-content: center; + align-items: center; + + .popover-left { + flex: 0 0 auto; + margin-right: 8px; + width: 30%; + text-align: right; + } + + .popover-right:not(.@{input-prefix-cls}-prefix):not(.@{input-prefix-cls}-suffiX) { + .@{input-prefix-cls}__inner { + padding: 0 8px; + } + } + + .popover-right.@{input-prefix-cls} { + display: inline-block; + } + } + } + } + + .@{input-prefix-cls} { + outline: none; + } + + span.@{popover-prefix-cls}__reference { + width: 100%; + } +} diff --git a/packages/theme/src/amount/vars.less b/packages/theme/src/amount/vars.less new file mode 100644 index 000000000..5effc53c5 --- /dev/null +++ b/packages/theme/src/amount/vars.less @@ -0,0 +1,16 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-amount() { + --ti-amount-icon-color: var(--ti-base-color-brand-6); + --ti-amount-icon-font-size: var(--ti-common-font-size-1); +} diff --git a/packages/theme/src/anchor/index.js b/packages/theme/src/anchor/index.js new file mode 100644 index 000000000..1d405c0ed --- /dev/null +++ b/packages/theme/src/anchor/index.js @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-anchor-text-color': '#252b3a', + 'tiny-anchor-font-size': '14px', + 'tiny-anchor-link-active-bg-color': '#5e7ce0', + 'tiny-anchor-link-active-text-color': '#5e7ce0', + 'tiny-anchor-orbit-width': '4px', + 'tiny-anchor-orbit-bg-color': '#dfe1e6' +} diff --git a/packages/theme/src/anchor/index.less b/packages/theme/src/anchor/index.less new file mode 100644 index 000000000..168e9e9c1 --- /dev/null +++ b/packages/theme/src/anchor/index.less @@ -0,0 +1,78 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@anchor-prefix-cls: ~'@{css-prefix}anchor'; + +.@{anchor-prefix-cls} { + &__wrapper { + .component-css-vars-anchor(); + } + &__affix { + position: fixed; + z-index: 1; + } + position: relative; + color: var(--ti-anchor-text-color); + font-size: var(--ti-anchor-font-size); + + &-link-mask { + position: absolute; + max-width: 0; + border-top-right-radius: 10px; + border-bottom-right-radius: 10px; + left: var(--ti-anchor-orbit-width / 2); + width: 100%; + background-color: rgba(80, 115, 229, 0.15); + } + + &-orbit { + position: absolute; + left: 0; + top: 0; + bottom: 0; + width: var(--ti-anchor-orbit-width); + border-radius: calc(var(--ti-anchor-orbit-width / 2)); + background-color: var(--ti-anchor-orbit-bg-color); + &-skid { + position: absolute; + left: 0; + width: var(--ti-anchor-orbit-width); + background-color: var(--ti-anchor-orbit-bg-color); + &--active { + background-color: var(--ti-anchor-link-active-bg-color); + } + } + } + + &-link { + margin: 0 0 0 9px; + cursor: pointer; + &-title { + display: block; + max-width: 100%; + padding: 1px 8px 1px 10px; + white-space: nowrap; + text-overflow: ellipsis; + color: var(--ti-anchor-text-color); + &--active { + color: var(--ti-anchor-link-active-text-color); + } + } + } +} + +.tiny-anchor-scroll-container { + scroll-behavior: smooth; +} diff --git a/packages/theme/src/anchor/vars.less b/packages/theme/src/anchor/vars.less new file mode 100644 index 000000000..883fe03db --- /dev/null +++ b/packages/theme/src/anchor/vars.less @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-anchor() { + --ti-anchor-text-color: var(--ti-common-color-info); + --ti-anchor-font-size: var(--ti-common-font-size-1); + --ti-anchor-link-active-bg-color: var(--ti-common-color-bg-emphasize); + --ti-anchor-link-active-text-color: var(--ti-common-color-bg-emphasize); + --ti-anchor-orbit-width: var(--ti-common-size-base); + --ti-anchor-orbit-bg-color: var(--ti-common-color-line-dividing); +} diff --git a/packages/theme/src/area/index.js b/packages/theme/src/area/index.js new file mode 100644 index 000000000..6afdad96f --- /dev/null +++ b/packages/theme/src/area/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // area +} diff --git a/packages/theme/src/area/index.less b/packages/theme/src/area/index.less new file mode 100644 index 000000000..c3dcbffdd --- /dev/null +++ b/packages/theme/src/area/index.less @@ -0,0 +1,23 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@area-prefix-cls: ~'@{css-prefix}area'; +@select-prefix-cls: ~'@{css-prefix}select'; + +.@{area-prefix-cls} { + .@{select-prefix-cls} { + width: 270px; + margin-right: 10px; + } +} diff --git a/packages/theme/src/autocomplete/index.js b/packages/theme/src/autocomplete/index.js new file mode 100644 index 000000000..539451d5d --- /dev/null +++ b/packages/theme/src/autocomplete/index.js @@ -0,0 +1,25 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-autocomplete-suggestion-border-radius': '2px', + 'tiny-autocomplete-suggestion-border-color': '#d9d9d9', + 'tiny-autocomplete-suggestion-bg-color': '#fff', + 'tiny-autocomplete-li-text-color': '#333', + 'tiny-autocomplete-li-font-size': '12px', + 'tiny-autocomplete-li-hover-bg-color': '#e6f7ff', + 'tiny-autocomplete-li-select-bg-color': '#f5f5f5', + 'tiny-autocomplete-li-selected-text-color': '#fff', + 'tiny-autocomplete-li-divider-border-color': '#000', + 'tiny-autocomplete-li-height': '30px', + 'tiny-autocomplete-loading-text-color': '#999' +} diff --git a/packages/theme/src/autocomplete/index.less b/packages/theme/src/autocomplete/index.less new file mode 100644 index 000000000..9f0dc9783 --- /dev/null +++ b/packages/theme/src/autocomplete/index.less @@ -0,0 +1,115 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@autocomplete-prefix-cls: ~'@{css-prefix}autocomplete'; +@icon-loading-prefix-cls: ~'@{css-prefix}icon-loading'; +@popper-prefix-cls: ~'@{css-prefix}popper'; + +.@{autocomplete-prefix-cls} { + .component-css-vars-autocomplete(); + + position: relative; + display: inline-block; + + &-suggestion { + border: 1px solid var(--ti-autocomplete-suggestion-border-color); + border-radius: var(--ti-autocomplete-suggestion-border-radius); + background-color: var(--ti-autocomplete-suggestion-bg-color); + box-sizing: border-box; + box-shadow: var(--ti-base-box-shadow); + + &__wrap { + max-height: 280px; + box-sizing: border-box; + } + + // 兼容ie10-ie11 + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + &__wrap { + margin-bottom: -17px !important; + padding-bottom: 6px; + } + } + + &__list { + margin: 0; + padding: 0; + } + + & &__list-item { + padding: 0 8px; + margin: 0; + line-height: var(--ti-autocomplete-li-height); + color: var(--ti-autocomplete-li-text-color); + font-size: var(--ti-autocomplete-li-font-size); + list-style: none; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + cursor: pointer; + + &.highlighted, + &:hover { + background-color: var(--ti-autocomplete-li-hover-bg-color); + } + + &.divider { + margin-top: 6px; + border-top: 1px solid var(--ti-autocomplete-li-divider-border-color); + + &:last-child { + margin-bottom: -6px; + } + } + + &:only-of-type { + &, + &:hover { + background-color: var(--ti-autocomplete-li-select-bg-color); + color: var(--ti-autocomplete-li-selected-text-color); + } + } + } + + &.is-loading &__list-loading { + text-align: center; + height: 100px; + line-height: 100px; + font-size: var(--ti-common-font-size-4); + color: var(--ti-autocomplete-loading-text-color); + + &::after { + display: inline-block; + content: ''; + height: 100%; + vertical-align: middle; + } + + &:hover { + background-color: #fff; + } + } + + &.is-loading { + .@{icon-loading-prefix-cls} { + vertical-align: middle; + } + } + + &.@{popper-prefix-cls}[x-placement^='bottom'] { + margin-top: var(--ti-base-dropdown-gap); + } + } +} diff --git a/packages/theme/src/autocomplete/vars.less b/packages/theme/src/autocomplete/vars.less new file mode 100644 index 000000000..ae26bea3f --- /dev/null +++ b/packages/theme/src/autocomplete/vars.less @@ -0,0 +1,25 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-autocomplete() { + --ti-autocomplete-suggestion-border-radius: var(--ti-common-border-radius-normal); + --ti-autocomplete-suggestion-border-color: var(--ti-base-color-white); + --ti-autocomplete-suggestion-bg-color: var(--ti-base-color-light); + --ti-autocomplete-li-text-color: var(--ti-base-color-info-normal); + --ti-autocomplete-li-font-size: var(--ti-common-font-size-base); + --ti-autocomplete-li-hover-bg-color: var(--ti-base-color-hover-background); + --ti-autocomplete-li-select-bg-color: var(--ti-base-color-selected-background); + --ti-autocomplete-li-selected-text-color: var(--ti-base-color-selected-text-color); + --ti-autocomplete-li-divider-border-color: var(--ti-base-color-dark); + --ti-autocomplete-li-height: 30px; + --ti-autocomplete-loading-text-color: var(--ti-base-color-placeholder); +} diff --git a/packages/theme/src/badge/index.js b/packages/theme/src/badge/index.js new file mode 100644 index 000000000..15f2a9401 --- /dev/null +++ b/packages/theme/src/badge/index.js @@ -0,0 +1,28 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-badge-size': '20px', + 'tiny-badge-font-size': '12px', + 'tiny-badge-font-weight': '700', + 'tiny-badge-border-radius': '12px', + 'tiny-badge-text-color': '#fff', + 'tiny-badge-bg-color': '#f5222d', + 'tiny-badge-link-hover-text-color': '#fff', + 'tiny-badge-active-text-color': '#1890ff', + 'tiny-badge-active-bg-color': '#fff', + 'tiny-badge-primary-bg-color': '#1890ff', + 'tiny-badge-success-bg-color': '#52c41a', + 'tiny-badge-warning-bg-color': '#faad14', + 'tiny-badge-danger-bg-color': '#f5222d', + 'tiny-badge-info-bg-color': '#333333' +} diff --git a/packages/theme/src/badge/index.less b/packages/theme/src/badge/index.less new file mode 100644 index 000000000..fc7a46e59 --- /dev/null +++ b/packages/theme/src/badge/index.less @@ -0,0 +1,106 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@badge-prefix-cls: ~'@{css-prefix}badge'; + +.@{badge-prefix-cls} { + &__wrapper { + .component-css-vars-badge(); + } + + display: inline-block; + min-width: var(--ti-badge-size); + height: var(--ti-badge-size); + line-height: var(--ti-badge-size); + border-radius: var(--ti-badge-border-radius); + padding: 0 4px; + font-size: var(--ti-badge-font-size); + font-weight: var(--ti-badge-font-weight); + color: var(--ti-badge-text-color); + background-color: var(--ti-badge-bg-color); + vertical-align: baseline; + white-space: nowrap; + text-align: center; + + &:empty { + display: none; + } + + .btn & { + position: relative; + top: -1px; + } + + a, + a:hover { + color: var(--ti-badge-text-color); + text-decoration: none; + } + + a.badge { + &:hover, + &:focus { + color: var(--ti-badge-link-hover-text-color); + text-decoration: none; + cursor: pointer; + } + } + + a.list-group-item.active > .badge, + .nav-pills > .active > a > .badge { + color: var(--ti-badge-active-text-color); + background-color: var(--ti-badge-active-bg-color); + } + + .nav-pills > li > a > .badge { + margin-left: 3px; + } + + &--max { + padding: 0 6px; + border-radius: 10px; + } + + &--default { + width: 6px; + height: 6px; + min-width: auto; + background-color: var(--ti-badge-bg-color); + display: inline-block; + vertical-align: top; + padding: 0; + border-radius: 50%; + } + + &--primary { + background-color: var(--ti-badge-primary-bg-color); + } + + &--success { + background-color: var(--ti-badge-success-bg-color); + } + + &--warning { + background-color: var(--ti-badge-warning-bg-color); + } + + &--danger { + background-color: var(--ti-badge-danger-bg-color); + } + + &--info { + background-color: var(--ti-badge-info-bg-color); + } +} diff --git a/packages/theme/src/badge/vars.less b/packages/theme/src/badge/vars.less new file mode 100644 index 000000000..6f2466cab --- /dev/null +++ b/packages/theme/src/badge/vars.less @@ -0,0 +1,28 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-badge() { + --ti-badge-size: var(--ti-common-size-5x); + --ti-badge-font-size: 12px; + --ti-badge-font-weight: var(--ti-common-font-weight-7); + --ti-badge-border-radius: 12px; + --ti-badge-text-color: var(--ti-base-color-light); + --ti-badge-bg-color: var(--ti-base-color-error-3); + --ti-badge-link-hover-text-color: var(--ti-base-color-light); + --ti-badge-active-text-color: var(--ti-base-color-brand-6); + --ti-badge-active-bg-color: var(--ti-base-color-light); + --ti-badge-primary-bg-color: var(--ti-base-color-brand-6); + --ti-badge-success-bg-color: var(--ti-base-color-success-normal); + --ti-badge-warning-bg-color: var(--ti-base-color-warning-normal); + --ti-badge-danger-bg-color: var(--ti-base-color-error-3); + --ti-badge-info-bg-color: var(--ti-base-color-info-normal); +} diff --git a/packages/theme/src/base/basic-var.less b/packages/theme/src/base/basic-var.less new file mode 100644 index 000000000..2e85c2fe3 --- /dev/null +++ b/packages/theme/src/base/basic-var.less @@ -0,0 +1,431 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +/*基础变量定义*/ +:root { + --ti-base-color-white: #fff; /* 纯白*/ + + /* 1.1品牌色*/ + /* 品牌主色*/ + --ti-base-color-brand-6: #5e7ce0; /* 主色蓝*/ + /* 主色衍生色*/ + --ti-base-color-brand-8: #344899; /* 品牌色-8*/ + --ti-base-color-brand-7: #526ecc; /* 品牌色-7*/ + --ti-base-color-brand-5: #7693f5; /* 品牌色-5*/ + --ti-base-color-brand-4: #96adfa; /* 品牌色-4*/ + --ti-base-color-brand-3: #beccfa; /* 品牌色-3*/ + --ti-base-color-brand-2: #e9edfa; /* 品牌色-2*/ + --ti-base-color-brand-1: #f2f5fc; /* 品牌色-1*/ + + /* 1.2中立色*/ + /* 公用灰色系,用于文本、图标、线条、背景色*/ + --ti-base-color-common-9: #181818; /* 中立色-9*/ + --ti-base-color-common-8: #282b33; /* 中立色-8*/ + --ti-base-color-common-7: #252b3a; /* 中立色-7*/ + --ti-base-color-common-6: #464c59; /* 中立色-6*/ + --ti-base-color-common-5: #575d6c; /* 中立色-5*/ + --ti-base-color-common-4: #5c6173; /* 中立色-4*/ + --ti-base-color-common-3: #8a8e99; /* 中立色-3*/ + --ti-base-color-common-2: #adb0b8; /* 中立色-2*/ + --ti-base-color-common-1: #dfe1e6; /* 中立色-1*/ + + /* 1.3背景色*/ + --ti-base-color-bg-9: #b12220; /* 背景-9*/ + --ti-base-color-bg-8: #c7000b; /* 背景-8*/ + --ti-base-color-bg-7: #d64a52; /* 背景-7*/ + --ti-base-color-bg-6: #eef0f5; /* 背景-6*/ + --ti-base-color-bg-5: #f5f5f6; /* 背景-5*/ + --ti-base-color-bg-4: #fafafa; /* 背景-4*/ + --ti-base-color-bg-3: #ffffff; /* 背景-3*/ + --ti-base-color-bg-2: #ffffff; /* 背景-2*/ + --ti-base-color-bg-1: #ffffff; /* 背景-1*/ + + /* 1.4功能色*/ + --ti-base-color-error-4: #de504e; /* 错误-4*/ + --ti-base-color-error-3: #f66f6a; /* 错误-3*/ + --ti-base-color-error-2: #ffbcba; /* 错误-2*/ + --ti-base-color-error-1: #ffeeed; /* 错误-1*/ + + --ti-base-color-success-4: #3ac295; /* 成功-4*/ + --ti-base-color-success-3: #50d4ab; /* 成功-3*/ + --ti-base-color-success-2: #acf2dc; /* 成功-2*/ + --ti-base-color-success-1: #edfff9; /* 成功-1*/ + + --ti-base-color-warn-5: #e37d29; /* 告警-5*/ + --ti-base-color-warn-4: #fa9841; /* 告警-4*/ + --ti-base-color-warn-3: #fac20a; /* 告警-3*/ + --ti-base-color-warn-2: #ffd0a6; /* 告警-2*/ + --ti-base-color-warn-1: #fff3e8; /* 告警-1*/ + + --ti-base-color-prompt-4: var(--ti-base-color-brand-7); /* 提示-4*/ + --ti-base-color-prompt-3: var(--ti-base-color-brand-6); /* 提示-3*/ + --ti-base-color-prompt-2: var(--ti-base-color-brand-3); /* 提示-2*/ + --ti-base-color-prompt-1: #ebf6ff; /* 提示-1*/ + + --ti-base-color-prompt-icon-from: #7769e8; /* 渐变图标-提示-起始色*/ + --ti-base-color-prompt-icon-to: #58bbff; /* 渐变图标-提示-终止色*/ + + /* 状态图标色*/ + --ti-base-color-icon-info: #6cbfff; /* 状态图标-常规*/ + + /* 图表色*/ + --ti-base-color-data-3: #a6dd82; /* 图表数据色-3*/ + --ti-base-color-data-4: #f3689a; /* 图表数据色-4*/ + --ti-base-color-data-5: #a97af8; /* 图表数据色-5*/ + + /* 透明色*/ + --ti-base-color-transparent: transparent; + + /* 2.公共色:此处颜色为组件场景色,根据使用场景分为以下几大类,具体组件引用以下颜色,如在使用过程中有问题,请自行按类别添加*/ + /* 2.1提示类型颜色,用于alert组件、涉及功能提示的背景、文字、图标等的颜色使用*/ + --ti-common-color-success: var(--ti-base-color-success-3); /* 成功-图标色/状态图标-成功*/ + --ti-common-color-text-success: var(--ti-base-color-success-4); /* 成功-文字色*/ + --ti-common-color-success-bg: var(--ti-base-color-success-1); /* 成功-背景色*/ + --ti-common-color-success-border: var(--ti-base-color-success-2); /* 成功-边框色*/ + + --ti-common-color-error: var(--ti-base-color-error-3); /* 错误-图标色/状态图标-危险、错误、失败/深色Tip中的价格文本*/ + --ti-common-color-error-text: var(--ti-base-color-error-4); /* 错误-文字色*/ + --ti-common-color-error-bg: var(--ti-base-color-error-1); /* 错误-背景色/校验背景色*/ + --ti-common-color-error-border: var(--ti-base-color-error-3); /* 错误-校验边框色*/ + --ti-common-color-error-border-secondary: var(--ti-base-color-error-2); /* 错误-alert边框色*/ + + --ti-common-color-info: var(--ti-base-color-info-normal); /* 信息-图标色/状态图标-信息*/ + --ti-common-color-info-text: var(--ti-base-color-common-7); /* 信息-文字色*/ + --ti-common-color-info-bg: rgba(51, 51, 51, 0.06); /* 信息-背景色*/ + --ti-common-color-info-border: #d3d4d6; /* 信息-边框色*/ + + --ti-common-color-warn: var(--ti-base-color-warn-4); /* 告警-图标色/状态图标-警告*/ + --ti-common-color-warn-text: var(--ti-base-color-warn-5); /* 告警-文字色*/ + --ti-common-color-warn-bg: var(--ti-base-color-warn-1); /* 告警-背景色*/ + --ti-common-color-warn-border: var(--ti-base-color-warn-2); /* 告警-边框色*/ + --ti-common-color-warn-secondary: var(--ti-base-color-warn-3); /* 次要告警-图标色/状态图标-异常*/ + + --ti-common-color-prompt: var(--ti-base-color-prompt-3); /* 提示-图标色*/ + --ti-common-color-prompt-text: var(--ti-base-color-prompt-4); /* 提示-图标色*/ + --ti-common-color-prompt-bg: var(--ti-base-color-prompt-1); /* 提示-背景色*/ + --ti-common-color-prompt-border: var(--ti-base-color-prompt-2); /* 提示-边框色*/ + --ti-common-color-prompt-icon-from: var(--ti-base-color-prompt-icon-from); /* 渐变图标-提示-起始色*/ + --ti-common-color-prompt-icon-to: var(--ti-base-color-prompt-icon-to); /* 渐变图标-提示-终止色*/ + + /* 2.2文本色*/ + --ti-common-color-text-primary: var(--ti-base-color-common-7); /* 一级文本色-重要信息/标题颜色/输入类文本颜色*/ + --ti-common-color-text-secondary: var(--ti-base-color-common-5); /* 二级文本色-次要信息*/ + --ti-common-color-text-weaken: var(--ti-base-color-common-3); /* 三级文本色-弱化信息/说明文字*/ + --ti-common-color-text-disabled: var(--ti-base-color-common-2); /* 文本禁用信息*/ + --ti-common-color-text-darkbg: var(--ti-base-color-common-2); /* 深色背景下文本信息*/ + --ti-common-color-text-darkbg-disabled: var(--ti-base-color-common-5); /* 深色背景下文本信息禁用色*/ + --ti-common-color-text-link: var(--ti-base-color-brand-7); /* 链接色*/ + --ti-common-color-text-link-hover: var(--ti-base-color-brand-8); /* 链接悬浮色*/ + --ti-common-color-text-link-darkbg: var(--ti-base-color-brand-4); /* 深色背景链接色*/ + --ti-common-color-text-link-darkbg-hover: var(--ti-base-color-brand-3); /* 深色背景链接悬浮色*/ + --ti-common-color-text-highlight: var(--ti-base-color-brand-7); /* 文本高亮色*/ + --ti-common-color-text-white: var(--ti-base-color-white); /* 深色背景或图标上文字色*/ + --ti-common-color-text-gray: var(--ti-base-color-white); /* 深色背景下的文本色,用于tip*/ + --ti-common-color-text-gray-disabled: var(--ti-base-color-common-4); /* 深色背景下的灰色文本禁用色,用于tab页签中*/ + --ti-common-color-text-important: var(--ti-base-color-error-4); /* 文本_金额*/ + + /* 2.3图标色*/ + /* 浅底背景图标色*/ + --ti-common-color-icon-normal: var(--ti-base-color-common-5); + --ti-common-color-icon-hover: var(--ti-base-color-brand-6); + --ti-common-color-icon-active: var(--ti-base-color-brand-6); + --ti-common-color-icon-disabled: var(--ti-base-color-common-2); /* 图标禁用色/状态图标-禁用、停止*/ + --ti-common-color-icon-white: var(--ti-base-color-white); + + /* 灰色背景下图标色*/ + --ti-common-color-icon-graybg-normal: var(--ti-base-color-common-2); + --ti-common-color-icon-graybg-hover: var(--ti-base-color-brand-6); + --ti-common-color-icon-graybg-active: var(--ti-base-color-brand-6); + --ti-common-color-icon-graybg-disabled: var(--ti-base-color-common-1); + + /* 深底背景图标色*/ + --ti-common-color-icon-darkbg-normal: var(--ti-base-color-common-2); + --ti-common-color-icon-darkbg-hover: var(--ti-base-color-brand-5); + --ti-common-color-icon-darkbg-active: var(--ti-base-color-brand-5); + --ti-common-color-icon-darkbg-disabled: var(--ti-base-color-common-5); + + /* 状态图标背景色*/ + --ti-common-color-icon-info: var(--ti-base-color-icon-info); /* 状态图标-常规、信息提示*/ + + /* 2.4线颜色,用于边框,线条等的颜色使用*/ + --ti-common-color-line-normal: var(--ti-base-color-common-2); + --ti-common-color-line-hover: var(--ti-base-color-common-5); + --ti-common-color-line-active: var(--ti-base-color-brand-6); + --ti-common-color-line-disabled: var(--ti-base-color-common-1); + + /* 分割线颜色*/ + --ti-common-color-line-dividing: var(--ti-base-color-common-1); + + /* 虚线*/ + --ti-common-color-dash-line-normal: var(--ti-base-color-common-5); + --ti-common-color-dash-line-hover: var(--ti-base-color-brand-7); + + /* 2.5背景色*/ + /* 背景基础色各状态色*/ + --ti-common-color-bg-normal: var(--ti-base-color-bg-6); /* 通用背景-页面背景色/下拉搜索框背景色/标签背景色*/ + --ti-common-color-bg-emphasize: var(--ti-base-color-brand-6); /* 背景高亮色*/ + --ti-common-color-bg-disabled: var(--ti-base-color-bg-5); /* 禁用背景色*/ + --ti-common-color-bg-hover: var(--ti-base-color-brand-8); /* 主色背景悬浮色*/ + --ti-common-color-bg-gray: var(--ti-base-color-bg-4); /* 新区域组件-悬浮背景色*/ + --ti-common-color-bg-secondary: var(--ti-base-color-common-2); /* 开关组件-关闭状态-背景色*/ + + /* 重要背景色,主要用于重要按钮场景*/ + --ti-common-bg-primary: var(--ti-base-color-bg-8); /* 重要按钮背景色*/ + --ti-common-bg-primary-hover: var(--ti-base-color-bg-7); /* 重要按钮背景悬浮、focus色*/ + --ti-common-bg-primary-active: var(--ti-base-color-bg-9); /* 重要按钮背景色按下色*/ + + /* 次要背景色,主要用于次要按钮场景*/ + --ti-common-bg-minor: var(--ti-base-color-bg-2); /* 次要按钮背景色*/ + --ti-common-bg-minor-hover: var(--ti-base-color-bg-1); /* 次要按钮背景悬浮、focus色*/ + --ti-common-bg-minor-active: var(--ti-base-color-bg-3); /* 次要按钮背景色按下色*/ + + /* 白底背景状态色*/ + --ti-common-color-bg-white-normal: var(--ti-base-color-white); /* 白色背景,用于输入框背景*/ + --ti-common-color-bg-white-emphasize: var(--ti-base-color-brand-1); /* 白色hover或强调色,如表头背景、表格悬浮、下拉选项悬浮背景*/ + + /* 浅底背景状态色*/ + --ti-common-color-bg-light-normal: var(--ti-base-color-brand-2); /* 滑块slider-背景色/多选快buttongroup-默认背景色/树组件选中背景色*/ + --ti-common-color-bg-light-emphasize: var(--ti-base-color-brand-3); /* 浅背景hover或强调色,开关组件“开”禁用背景色*/ + + /* 深色底背景状态色*/ + --ti-common-color-bg-dark-normal: var(--ti-base-color-common-6); /* 一级tab页签背景色*/ + --ti-common-color-bg-dark-emphasize: var(--ti-base-color-common-4); /* 一级tab页签背景-悬浮色*/ + --ti-common-color-bg-dark-active: var(--ti-common-color-bg-normal); /* 一级tab页签背景-激活/focus状态背景色*/ + --ti-common-color-bg-dark-deep: var(--ti-base-color-common-6); /* tip、alert提示背景色*/ + --ti-common-color-bg-dark-disabled: var(--ti-base-color-common-1); /* 深色背景禁用色,开关组件“关”禁用背景色*/ + + /* 顶部导航*/ + --ti-common-color-bg-navigation: var(--ti-base-color-common-8); /* 顶部导航背景色/顶部导航下拉悬浮背景色*/ + --ti-common-color-bg-dark-select: var(--ti-base-color-common-9); /* 顶部导航下拉背景色 */ + + /* 2.6 图表色*/ + --ti-common-color-data-1: var(--ti-base-color-success-3); /* 图表数据色-1*/ + --ti-common-color-data-2: var(--ti-base-color-icon-info); /* 图表数据色-2*/ + --ti-common-color-data-3: var(--ti-base-color-data-3); /* 图表数据色-3*/ + --ti-common-color-data-4: var(--ti-base-color-data-4); /* 图表数据色-4*/ + --ti-common-color-data-5: var(--ti-base-color-data-5); /* 图表数据色-5*/ + --ti-common-color-data-6: var(--ti-base-color-warn-3); /* 图表数据色-6*/ + --ti-common-color-data-7: var(--ti-base-color-warn-4); /* 图表数据色-7*/ + --ti-common-color-data-8: var(--ti-base-color-error-3); /* 图表数据色-8*/ + + /* 2.7 透明色*/ + --ti-common-color-transparent: var(--ti-base-color-transparent); + + /* 二.其他变量*/ + /* 边框圆角*/ + --ti-common-border-radius-normal: 2px; /* 常规*/ + --ti-common-border-radius-0: 0px; /* 直角*/ + --ti-common-border-radius-1: 4px; /* 圆角-1*/ + --ti-common-border-radius-2: 8px; /* 圆角-2*/ + --ti-common-border-radius-3: 50%; /* 圆形*/ + + /* 字号*/ + --ti-common-font-size-base: 12px; /* 正文-常规*/ + --ti-common-font-size-1: 14px; /* 标题-小*/ + --ti-common-font-size-2: 16px; /* 标题-中*/ + --ti-common-font-size-3: 18px; /* 标题-大*/ + --ti-common-font-size-4: 20px; /* 字号-4*/ + --ti-common-font-size-5: 24px; /* 字号-5*/ + --ti-common-font-size-6: 32px; /* 字号-6*/ + --ti-common-font-size-7: 36px; /* 字号-7*/ + + /* 行高*/ + --ti-common-line-height-number: 1.5; /* 文字行高倍数,建议组件中设置行高使用该变量,如有特殊情况,请自行定义*/ + + /* 间距:适用于组件中的margin、padding*/ + --ti-common-space-base: 4px; /* 基础间距*/ + --ti-common-space-2x: calc(var(--ti-common-space-base) * 2); /* 间距-2*/ + --ti-common-space-3x: calc(var(--ti-common-space-base) * 3); /* 间距-3*/ + --ti-common-space-4x: calc(var(--ti-common-space-base) * 4); /* 间距-4*/ + --ti-common-space-5x: calc(var(--ti-common-space-base) * 5); /* 间距-5*/ + --ti-common-space-6x: calc(var(--ti-common-space-base) * 6); /* 间距-6*/ + --ti-common-space-8x: calc(var(--ti-common-space-base) * 8); /* 间距-7*/ + --ti-common-space-10x: calc(var(--ti-common-space-base) * 10); /* 间距-8*/ + /* 其他间距*/ + --ti-common-space-0: 0px; /* 其他间距-1*/ + --ti-common-space-1: 1px; /* 其他间距-2*/ + --ti-common-space-6: 6px; /* 其他间距-3*/ + --ti-common-space-10: 10px; /* 其他间距-4*/ + + /* 阴影*/ + --ti-common-shadow-1-up: 0 -1px 4px 0 rgba(0, 0, 0, 0.1); /* 阴影-1 上*/ + --ti-common-shadow-1-down: 0 1px 4px 0 rgba(0, 0, 0, 0.1); /* 阴影-1 下*/ + --ti-common-shadow-1-left: -1px 0px 4px 0 rgba(0, 0, 0, 0.1); /* 阴影-1 左*/ + --ti-common-shadow-1-right: 1px 0px 4px 0 rgba(0, 0, 0, 0.1); /* 阴影-1 右*/ + --ti-common-shadow-2-up: 0 -2px 8px 0 rgba(0, 0, 0, 0.2); /* 阴影-2 上*/ + --ti-common-shadow-2-down: 0 2px 8px 0 rgba(0, 0, 0, 0.2); /* 阴影-2 下*/ + --ti-common-shadow-2-left: -2px 0 8px 0 rgba(238, 10, 10, 0.2); /* 阴影-2 左*/ + --ti-common-shadow-2-right: 2px 0 8px 0 rgba(252, 5, 5, 0.2); /* 阴影-2 右*/ + --ti-common-shadow-3-up: 0 -4px 16px 0 rgba(0, 0, 0, 0.2); /* 阴影-3 上*/ + --ti-common-shadow-3-down: 0 4px 16px 0 rgba(0, 0, 0, 0.2); /* 阴影-3 下*/ + --ti-common-shadow-3-left: -4px 0 16px 0 rgba(0, 0, 0, 0.2); /* 阴影-3 左*/ + --ti-common-shadow-3-right: 4px 0 16px 0 rgba(0, 0, 0, 0.2); /* 阴影-3 右*/ + --ti-common-shadow-4-up: 0 -8px 40px 0 rgba(0, 0, 0, 0.2); /* 阴影-4 上*/ + --ti-common-shadow-4-down: 0 8px 40px 0 rgba(0, 0, 0, 0.2); /* 阴影-4 下*/ + --ti-common-shadow-4-left: -8px 0 40px 0 rgba(0, 0, 0, 0.2); /* 阴影-4 左*/ + --ti-common-shadow-4-right: 8px 0 40px 0 rgba(0, 0, 0, 0.2); /* 阴影-4 右*/ + + /* 提示类阴影*/ + --ti-common-shadow-error: 0 1px 3px 0 rgba(199, 54, 54, 0.25); /* 错误*/ + --ti-common-shadow-warn: 0 1px 3px 0 rgba(204, 100, 20, 0.25); /* 告警*/ + --ti-common-shadow-prompt: 0 1px 3px 0 rgba(70, 94, 184, 0.25); /* 提示*/ + --ti-common-shadow-success: 0 1px 3px 0 rgba(39, 176, 128, 0.25); /* 成功*/ + + /* 字体*/ + --ti-common-font-family: 'Helvetica', 'Arial', 'PingFangSC-Regular', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', 'Microsoft JhengHei'; + + /* 字重*/ + --ti-common-font-weight-1: 100; /* 极细*/ + --ti-common-font-weight-2: 200; /* 纤细*/ + --ti-common-font-weight-3: 300; /* 细体*/ + --ti-common-font-weight-4: normal; /* 常规*/ + --ti-common-font-weight-5: 500; /* 中等*/ + --ti-common-font-weight-6: 600; /* 半粗*/ + --ti-common-font-weight-7: bold; /* 粗体*/ + --ti-common-font-weight-8: 800; /* 中黑*/ + --ti-common-font-weight-9: 900; /* 黑体*/ + + /* 边框粗细*/ + --ti-common-border-weight-normal: 1px; /* 常规*/ + --ti-common-border-weight-1: 2px; /* 较粗*/ + --ti-common-border-weight-2: 3px; /* 粗*/ + + /* 边框样式*/ + --ti-common-border-style-dashed: dashed; /* 虚线*/ + --ti-common-border-style-dotted: dotted; /* 点线*/ + --ti-common-border-style-solid: solid; /* 实线*/ + + /* 尺寸*/ + --ti-common-size-base: 4px; /* 基础尺寸*/ + --ti-common-size-2x: calc(var(--ti-common-size-base) * 2); /* 尺寸-2*/ + --ti-common-size-3x: calc(var(--ti-common-size-base) * 3); /* 尺寸-3*/ + --ti-common-size-4x: calc(var(--ti-common-size-base) * 4); /* 尺寸-4*/ + --ti-common-size-5x: calc(var(--ti-common-size-base) * 5); /* 尺寸-5*/ + --ti-common-size-6x: calc(var(--ti-common-size-base) * 6); /* 尺寸-6*/ + --ti-common-size-7x: calc(var(--ti-common-size-base) * 7); /* 尺寸-7*/ + --ti-common-size-8x: calc(var(--ti-common-size-base) * 8); /* 尺寸-8*/ + --ti-common-size-9x: calc(var(--ti-common-size-base) * 9); /* 尺寸-9*/ + --ti-common-size-10x: calc(var(--ti-common-size-base) * 10); /* 尺寸-10*/ + --ti-common-size-11x: calc(var(--ti-common-size-base) * 11); /* 尺寸-11*/ + --ti-common-size-12x: calc(var(--ti-common-size-base) * 12); /* 尺寸-12*/ + --ti-common-size-13x: calc(var(--ti-common-size-base) * 13); /* 尺寸-13*/ + --ti-common-size-14x: calc(var(--ti-common-size-base) * 14); /* 尺寸-14*/ + --ti-common-size-15x: calc(var(--ti-common-size-base) * 15); /* 尺寸-15*/ + --ti-common-size-16x: calc(var(--ti-common-size-base) * 16); /* 尺寸-16*/ + --ti-common-size-17x: calc(var(--ti-common-size-base) * 17); /* 尺寸-17*/ + --ti-common-size-18x: calc(var(--ti-common-size-base) * 18); /* 尺寸-18*/ + --ti-common-size-19x: calc(var(--ti-common-size-base) * 19); /* 尺寸-19*/ + --ti-common-size-20x: calc(var(--ti-common-size-base) * 20); /* 尺寸-20*/ + --ti-common-size-21x: calc(var(--ti-common-size-base) * 21); /* 尺寸-21*/ + --ti-common-size-22x: calc(var(--ti-common-size-base) * 22); /* 尺寸-22*/ + --ti-common-size-23x: calc(var(--ti-common-size-base) * 23); /* 尺寸-23*/ + --ti-common-size-24x: calc(var(--ti-common-size-base) * 24); /* 尺寸-24*/ + --ti-common-size-25x: calc(var(--ti-common-size-base) * 25); /* 尺寸-25*/ + --ti-common-size-26x: calc(var(--ti-common-size-base) * 26); /* 尺寸-26*/ + --ti-common-size-27x: calc(var(--ti-common-size-base) * 27); /* 尺寸-27*/ + --ti-common-size-28x: calc(var(--ti-common-size-base) * 28); /* 尺寸-28*/ + --ti-common-size-29x: calc(var(--ti-common-size-base) * 29); /* 尺寸-29*/ + --ti-common-size-30x: calc(var(--ti-common-size-base) * 30); /* 尺寸-30*/ + --ti-common-size-31x: calc(var(--ti-common-size-base) * 31); /* 尺寸-31*/ + --ti-common-size-32x: calc(var(--ti-common-size-base) * 32); /* 尺寸-32*/ + --ti-common-size-33x: calc(var(--ti-common-size-base) * 33); /* 尺寸-33*/ + --ti-common-size-34x: calc(var(--ti-common-size-base) * 34); /* 尺寸-34*/ + --ti-common-size-35x: calc(var(--ti-common-size-base) * 35); /* 尺寸-35*/ + --ti-common-size-36x: calc(var(--ti-common-size-base) * 36); /* 尺寸-36*/ + --ti-common-size-37x: calc(var(--ti-common-size-base) * 37); /* 尺寸-37*/ + --ti-common-size-38x: calc(var(--ti-common-size-base) * 38); /* 尺寸-38*/ + --ti-common-size-39x: calc(var(--ti-common-size-base) * 39); /* 尺寸-39*/ + --ti-common-size-40x: calc(var(--ti-common-size-base) * 40); /* 尺寸-40*/ + --ti-common-size-41x: calc(var(--ti-common-size-base) * 41); /* 尺寸-41*/ + --ti-common-size-42x: calc(var(--ti-common-size-base) * 42); /* 尺寸-42*/ + --ti-common-size-43x: calc(var(--ti-common-size-base) * 43); /* 尺寸-43*/ + --ti-common-size-44x: calc(var(--ti-common-size-base) * 44); /* 尺寸-44*/ + --ti-common-size-45x: calc(var(--ti-common-size-base) * 45); /* 尺寸-45*/ + --ti-common-size-46x: calc(var(--ti-common-size-base) * 46); /* 尺寸-46*/ + --ti-common-size-47x: calc(var(--ti-common-size-base) * 47); /* 尺寸-47*/ + --ti-common-size-48x: calc(var(--ti-common-size-base) * 48); /* 尺寸-48*/ + --ti-common-size-49x: calc(var(--ti-common-size-base) * 49); /* 尺寸-49*/ + --ti-common-size-50x: calc(var(--ti-common-size-base) * 50); /* 尺寸-50*/ + /* 其他尺寸*/ + --ti-common-size-0: 0px; /* 其他尺寸-1*/ + --ti-common-size-auto: auto; /* 其他尺寸-2*/ + + /* 2022.9.23 补充 */ + --ti-base-color-primary-normal: var(--ti-base-color-brand-6); + --ti-base-color-primary-hover: var(--ti-base-color-brand-5); + --ti-base-color-primary-active: var(--ti-base-color-brand-5); + --ti-base-color-primary-disabled: #a0cfff; + --ti-base-color-primary-disabled-border: var(--ti-common-color-line-disabled); + --ti-base-color-primary-disabled-text: var(--ti-common-color-text-disabled); + + --ti-base-color-success-normal: var(--ti-common-color-success); + --ti-base-color-success-hover: var(--ti-common-color-success-border); + --ti-base-color-success-active: var(--ti-common-color-success-border); + --ti-base-color-success-disabled: #a6c3b9; + --ti-base-color-success-disabled-border: var(--ti-common-color-line-disabled); + --ti-base-color-success-disabled-text: var(--ti-common-color-text-disabled); + + --ti-base-color-warning-normal: var(--ti-common-color-warn); + --ti-base-color-warning-hover: var(--ti-common-color-warn-secondary); + --ti-base-color-warning-active: var(--ti-common-color-warn-secondary); + --ti-base-color-warning-disabled: #d3c6a2; + --ti-base-color-warning-disabled-border: var(--ti-common-color-line-disabled); + --ti-base-color-warning-disabled-text: var(--ti-common-color-text-disabled); + + --ti-base-color-danger-normal: var(--ti-common-bg-primary); + --ti-base-color-danger-hover: var(--ti-common-bg-primary-hover); + --ti-base-color-danger-active: var(--ti-common-bg-primary-active); + --ti-base-color-danger-disabled: #d8bab5; + --ti-base-color-danger-disabled-border: var(--ti-common-color-line-disabled); + --ti-base-color-danger-disabled-text: var(--ti-common-color-text-disabled); + + --ti-base-color-info-normal: var(--ti-base-color-common-7); + --ti-base-color-info-hover: #54657e; + --ti-base-color-info-active: #54657e; + --ti-base-color-info-disabled: #bfbfbf; + --ti-base-color-info-disabled-border: var(--ti-common-color-line-disabled); + --ti-base-color-info-disabled-text: var(--ti-common-color-text-disabled); + + --ti-base-color-border: var(--ti-base-color-common-2); + --ti-base-color-border-hover: var(--ti-base-color-common-5); + --ti-base-color-light: #fff; + --ti-base-color-hover-background: var(--ti-base-color-brand-1); + --ti-base-color-selected-background: var(--ti-base-color-brand-6); /* 下拉框选中时的背景色 */ + --ti-base-color-selected-text-color: var(--ti-base-color-light); /* 下拉框选中时文字的颜色 */ + --ti-base-size-height-normal: 30px; + --ti-base-box-shadow: 0 0 4px rgba(0, 0, 0, 0.3); + --ti-base-dropdown-gap: 2px; + + /* 2022.10.09 补充 */ + --ti-base-color-dark: #000; + --ti-base-color-secondary: #666; + --ti-base-color-placeholder: #999; + --ti-base-color-navigation-background: #2e3243; + --ti-base-radius-large: 3px; + --ti-base-radius-medium: 2px; + --ti-base-radius-small: 1px; + --ti-base-font-size: 12px; + --ti-base-font-size-normal: 1em; + --ti-base-font-size-large: 1.125em; + --ti-base-font-weight-bold: 700; + --ti-base-size-width-large: 130px; + --ti-base-size-width-medium: 120px; + --ti-base-size-width-normal: 80px; + --ti-base-size-width-small: 36px; + --ti-base-size-width-minor: 30px; + --ti-base-size-width-mini: 24px; + --ti-base-size-height-large: 48px; + --ti-base-size-height-medium: 42px; + --ti-base-size-height-small: 28px; + --ti-base-size-height-minor: 30px; + --ti-base-size-height-mini: 24px; +} diff --git a/packages/theme/src/base/comp.less b/packages/theme/src/base/comp.less new file mode 100644 index 000000000..ef60a5edf --- /dev/null +++ b/packages/theme/src/base/comp.less @@ -0,0 +1,690 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +/*注意:css var变量,以最后一次出现的生效。*/ +/*组件变量定义*/ +:root { + /* ---------------body样式设置----START----------------------------------------------*/ + --ti-default-body-bg: #fff; + --ti-default-font-color: var(--ti-common-color-text-primary); + --ti-default-font-size: 12px; + --ti-default-font-family: var(--ti-common-font-family); + --ti-default-body-margin: 0; + --ti-default-body-padding: 0; + /* ---------------body样式设置----END------------------------------------------------*/ + /* ---------------表单元素公共样式设置----START----------------------------------------------*/ + --ti-input-height: 28px; + --ti-input-font-size: var(--ti-common-font-size-base); + --ti-input-border-radius: var(--ti-common-border-radius-normal); + --ti-input-padding-horizontal: var(--ti-common-space-10); + --ti-input-placeholder-color: var(--ti-common-color-text-disabled); + --ti-input-border-color: var(--ti-common-color-line-normal); + --ti-input-text-color: var(--ti-common-color-text-primary); + --ti-input-bg-color: var(--ti-common-color-bg-white-normal); + --ti-input-clear-color: var(--ti-common-color-icon-normal); + --ti-input-border-color-disabled: var(--ti-common-color-line-disabled); + --ti-input-text-color-disabled: var(--ti-common-color-text-disabled); + --ti-input-bg-color-disabled: var(--ti-common-color-bg-disabled); + --ti-input-clear-color-disabled: var(--ti-common-color-icon-disabled); + --ti-input-border-color-hover: var(--ti-common-color-line-hover); + --ti-input-clear-color-hover: var(--ti-common-color-icon-hover); + --ti-input-border-color-focus: var(--ti-common-color-line-active); + --ti-input-border-color-error: var(--ti-common-color-error-border); + --ti-input-bg-color-error: var(--ti-common-color-error-bg); + --ti-valid-error-icon-size: 16px; + --ti-valid-error-color: var(--ti-common-color-error); + --ti-valid-error-text-color: var(--ti-common-color-error-text); + --ti-textarea-padding-vertical: var(--ti-common-space-6); + --ti-textarea-min-height: 50px; + --ti-textarea-counter-text-color: var(--ti-common-color-text-weaken); + --ti-textarea-counter-inputed-text-color: var(--ti-common-color-text-primary); + /* ---------------表单元素公共样式设置----END------------------------------------------------*/ + /* ---------------时间日期控件样式设置----START-----------------------------------------------*/ + --ti-datetime-z-index: 10002; + --ti-datetime-input-font-size: var(--ti-common-font-size-base); + --ti-datetime-picker-color: var(--ti-common-color-text-primary); + --ti-datetime-picker-color-hover: var(--ti-common-color-text-highlight); + --ti-datetime-icon-color-hover: var(--ti-common-color-icon-hover); + --ti-datetime-content-color-active: var(--ti-common-color-bg-emphasize); + --ti-datetime-content-color-hover: var(--ti-common-color-bg-light-normal); + --ti-datetime-content-text-color-hover: var(--ti-common-color-text-highlight); + --ti-datetime-time-height: calc(var(--ti-input-height) - 2px); + --ti-datetime-range-selected-day-bg-color: var( + --ti-common-color-bg-light-normal + ); + --ti-datetime-range-selected-day-bg-color-hover: var( + --ti-common-color-bg-light-emphasize + ); + --ti-datetime-current-day-color: var(--ti-common-color-text-white); + --ti-datetime-day-width: 36px; + --ti-datetime-day-height: 24px; + --ti-datetime-day-margin-top: var(--ti-common-space-10); + --ti-datetime-icon-color-normal: var(--ti-common-color-icon-normal); + --ti-datetime-icon-color-disabled: var(--ti-common-color-icon-disabled); + --ti-datetime-content-color-normal: var(--ti-common-color-text-primary); + --ti-datetime-clear-icon-border-right-color: var( + --ti-common-color-line-dividing + ); + --ti-datetime-week-bg-color: var(--ti-common-color-bg-white-normal); + --ti-datetime-beside-day-color: var(--ti-common-color-text-disabled); + --ti-datetime-beside-day-bg-color-hover: var(--ti-common-color-bg-disabled); + --ti-datetime-default-day-color: var(--ti-common-color-text-primary); + --ti-datetime-disable-day-bg-color: var(--ti-common-color-bg-disabled); + --ti-datetime-panel-border-color: var(--ti-common-color-line-active); + --ti-datetime-panel-border-radius: 0; + --ti-datetime-panel-box-shadow: var(--ti-common-shadow-2-down); + /* ---------------时间日期控件样式设置-----END------------------------------------------------*/ + /* -------------------------menu控件样式设置----START---------------------------------------------*/ + --ti-menu-item-color: var(--ti-common-color-text-link); + --ti-menu-item-color-hover: var(--ti-common-color-text-link-hover); + --ti-menu-item-color-active: var(--ti-common-color-text-link-hover); + --ti-menu-panel-item-color-hover: var(--ti-common-color-text-highlight); + --ti-menu-panel-item-color-active: var(--ti-common-color-text-white); + --ti-menu-panel-item-bg-active: var(--ti-menu-panel-item-color-hover); + --ti-menu-item-color-disabled: var(--ti-common-color-text-disabled); + --ti-menu-item-bg-hover: var(--ti-common-color-bg-white-emphasize); + --ti-menu-button-panel-border-color: var(--ti-menu-item-color); + /* -------------------------menubutton控件样式设置----END-----------------------------------------------*/ + /* ---------------checkbox config----START----------------------------------------------*/ + --ti-checkbox-size: var(--ti-common-font-size-2); + --ti-checkbox-mark-size: calc(var(--ti-checkbox-size) - 2px); + --ti-checkbox-bg-color: var(--ti-common-color-bg-white-normal); + --ti-checkbox-label-color: var(--ti-common-color-text-primary); + --ti-checkbox-border-radius: var(--ti-common-border-radius-normal); + --ti-checkbox-label-right-space: var(--ti-common-space-2x); + --ti-checkbox-mark-color: var(--ti-common-color-bg-white-normal); + --ti-checkbox-bg-color-checked: var(--ti-common-color-bg-emphasize); + --ti-checkbox-border-color: var(--ti-common-color-line-normal); + --ti-checkbox-bg-color-checked-hover: var(--ti-common-color-bg-hover); + --ti-checkbox-border-color-checked: var(--ti-common-color-line-active); + --ti-checkbox-bg-color-checked-active: var( + --ti-checkbox-bg-color-checked-hover + ); + --ti-checkbox-label-color-checked: var(--ti-common-color-text-white); + --ti-checkbox-bg-color-unchecked-active: var(--ti-checkbox-bg-color); + --ti-checkbox-border-color-unchecked-active: var( + --ti-checkbox-border-color-hover + ); + --ti-checkbox-border-color-hover: var(--ti-common-color-line-active); + --ti-checkbox-bg-color-disable: var(--ti-common-color-bg-disabled); + --ti-checkbox-mark-color-disabled: var(--ti-common-color-icon-disabled); + --ti-checkbox-label-color-disabled: var(--ti-common-color-text-disabled); + --ti-checkbox-border-color-checked-disabled: var( + --ti-common-color-line-disabled + ); + --ti-checkbox-border-color-unchecked-disabled: var( + --ti-common-color-line-disabled + ); + --ti-checkbox-partial-center-size: 6px; + --ti-checkbox-partial-color-checked: var(--ti-checkbox-border-color-checked); + --ti-checkbox-partial-color-checked-disabled: var( + --ti-checkbox-mark-color-disabled + ); + --ti-checkbox-partial-color-checked-hover: var( + --ti-checkbox-bg-color-checked-hover + ); + /* ---------------checkbox config----END----------------------------------------------*/ + /* ---------------radio config----START----------------------------------------------*/ + --ti-radio-mark-size: 8px; + --ti-radio-bg-color: var(--ti-common-color-bg-white-normal); + --ti-radio-border-color: var(--ti-common-color-line-normal); + --ti-radio-label-color: var(--ti-common-color-text-primary); + --ti-radio-border-color-checked: var(--ti-radio-bg-color-checked); + --ti-radio-bg-color-checked: var(--ti-common-color-bg-emphasize); + --ti-radio-bg-color-disabled: var(--ti-common-color-bg-disabled); + --ti-radio-mark-color-disabled: var(--ti-common-color-text-disabled); + --ti-radio-border-color-disabled: var(--ti-common-color-line-disabled); + --ti-radio-label-color-disabled: var(--ti-common-color-text-disabled); + --ti-radio-border-color-hover: var(--ti-common-color-line-active); + --ti-radio-bg-color-active: var(--ti-radio-bg-color); + --ti-radio-border-color-active: var(--ti-radio-border-color-hover); + --ti-radio-bg-color-checked-hover: var(--ti-common-color-bg-hover); + --ti-radio-bg-color-checked-active: var(--ti-common-color-bg-white-normal); + --ti-radio-border-color-checked-active: var( + --ti-radio-bg-color-checked-hover + ); + /* ---------------radio config----END----------------------------------------------*/ + /* ---------------button config----START----------------------------------------------*/ + --ti-button-large-height: 32px; + --ti-button-large-padding-horizon: var(--ti-common-space-6x); + --ti-button-middle-height: 28px; + --ti-button-middle-padding-horizon: var(--ti-common-space-5x); + --ti-button-small-height: 24px; + --ti-button-small-padding-horizon: var(--ti-common-space-4x); + --ti-button-xs-height: 20px; + --ti-button-xs-padding-horizon: var(--ti-common-space-3x); + --ti-button-onlyIcon-height: 28px; + --ti-button-onlyIcon-width: 28px; + --ti-button-onlyIcon-padding: 5px; + --ti-button-onlyIcon-fontSize: 16px; + --ti-button-icon-padding-horizon: var(--ti-common-space-5x); + --ti-button-danger-box-shadow: 0 0; + --ti-button-default-box-shadow: 0 0; + --ti-button-default-text-color: var(--ti-common-color-text-primary); + --ti-button-border-radius: 2px; + --ti-button-default-normal-color: var(--ti-button-default-text-color); + --ti-button-default-normal-bg-color: var(--ti-common-bg-minor); + --ti-button-default-normal-border-color: var(--ti-common-color-line-normal); + --ti-button-default-color-hover: var(--ti-common-color-text-highlight); + --ti-button-default-bg-color-hover: var(--ti-common-bg-minor-hover); + --ti-button-default-border-color-hover: var(--ti-common-color-line-active); + --ti-button-default-color-active: var(--ti-button-default-color-hover); + --ti-button-default-bg-color-active: var(--ti-common-bg-minor-active); + --ti-button-default-border-color-active: var( + --ti-button-default-border-color-hover + ); + --ti-button-default-color-disabled: var(--ti-common-color-text-disabled); + --ti-button-default-bg-color-disabled: var(--ti-common-color-bg-disabled); + --ti-button-default-border-color-disabled: var( + --ti-common-color-line-disabled + ); + --ti-button-primary-normal-color: var(--ti-common-color-text-white); + --ti-button-primary-normal-bg-color: var(--ti-common-color-bg-emphasize); + --ti-button-primary-normal-border-color: var(--ti-common-color-bg-emphasize); + --ti-button-primary-color-hover: var(--ti-common-color-text-white); + --ti-button-primary-bg-color-hover: var(--ti-common-color-icon-darkbg-hover); + --ti-button-primary-border-color-hover: var( + --ti-button-primary-bg-color-hover + ); + --ti-button-primary-color-active: var(--ti-button-primary-color-hover); + --ti-button-primary-bg-color-active: #526ecc; + --ti-button-primary-border-color-active: #526ecc; + --ti-button-primary-color-disabled: var(--ti-common-color-text-disabled); + --ti-button-primary-bg-color-disabled: var( + --ti-button-default-bg-color-disabled + ); + --ti-button-primary-border-color-disabled: var( + --ti-button-default-border-color-disabled + ); + --ti-button-danger-normal-color: var(--ti-common-color-text-white); + --ti-button-danger-normal-bg-color: var(--ti-common-bg-primary); + --ti-button-danger-normal-border-color: var( + --ti-button-danger-normal-bg-color + ); + --ti-button-danger-color-hover: var(--ti-common-color-text-white); + --ti-button-danger-bg-color-hover: var(--ti-common-bg-primary-hover); + --ti-button-danger-border-color-hover: var(--ti-button-danger-bg-color-hover); + --ti-button-danger-color-active: var(--ti-common-color-text-white); + --ti-button-danger-bg-color-active: var(--ti-common-bg-primary-active); + --ti-button-danger-border-color-active: var( + --ti-button-danger-bg-color-active + ); + --ti-button-danger-color-disabled: var(--ti-common-color-text-disabled); + --ti-button-danger-bg-color-disabled: var( + --ti-button-default-bg-color-disabled + ); + --ti-button-danger-border-color-disabled: var( + --ti-button-default-border-color-disabled + ); + /* ---------------button config----END----------------------------------------------*/ + /* ---------------Select config----START----------------------------------------------*/ + --ti-tag-bg-color: var(--ti-common-color-bg-normal); + /* tag的背景色*/ + --ti-tag-bg-color-disabled: var(--ti-common-color-bg-disabled); + /* tag灰化的背景色*/ + --ti-tag-text-color: var(--ti-common-color-text-secondary); + /* tag的文本, 未使用?*/ + --ti-tag-text-color-hover: var(--ti-common-color-text-highlight); + /* 文本hover颜色*/ + --ti-tag-text-color-disabled: var(--ti-common-color-text-disabled); + /* 文本灰化颜色*/ + --ti-tag-icon-color: var(--ti-common-color-icon-graybg-normal); + /* tag叉号的颜色*/ + --ti-tag-icon-color-hover: var(--ti-common-color-icon-graybg-hover); + /* tag叉号的hover颜色*/ + --ti-tag-icon-color-disabled: var(--ti-common-color-icon-graybg-disabled); + /* tag叉号的灰化颜色*/ + --ti-tag-icon-color-clear-hover: var(--ti-common-color-icon-hover); + --ti-dominator-select-arrow-color: var(--ti-common-color-icon-normal); + --ti-dominator-select-arrow-color-disabled: var( + --ti-common-color-line-disabled + ); + --ti-dominator-multiselect-box-cell-border-color-disabled: var( + --ti-common-color-line-disabled + ); + --ti-dominator-select-clear-color: var(--ti-common-color-icon-normal); + --ti-select-item-bg-color-hover: var(--ti-common-color-bg-white-emphasize); + --ti-select-item-text-color-hover: var(--ti-common-color-text-highlight); + --ti-select-item-selected-bg-color: var(--ti-common-color-bg-emphasize); + --ti-select-item-selected-text-color: var(--ti-common-color-text-white); + --ti-select-text-color-disabled: var(--ti-common-color-text-disabled); + --ti-select-group-color: var(--ti-common-color-text-weaken); + --ti-select-border-color-focus: var(--ti-common-color-line-active); + --ti-select-small-height: var(--ti-pagination-height); + --ti-select-small-dominator-text-left-padding: var(--ti-common-space-10); + --ti-select-small-triangle-position-right: 9px; + /* ---------------Select config----END----------------------------------------------*/ + /* ---------------Searchbox config----START----------------------------------------------*/ + --ti-searchbox-select-bg-color: var(--ti-common-color-bg-white-emphasize); + --ti-searchbox-select-bg-color-hover: var(--ti-common-color-bg-normal); + /* ---------------Searchbox config----END----------------------------------------------*/ + /* ---------------modal config----START----------------------------------------------*/ + --ti-modal-header-text-color: var(--ti-common-color-text-primary); + --ti-modal-close-icon-color: var(--ti-common-color-icon-normal); + --ti-modal-close-icon-color-hover: var(--ti-common-color-icon-hover); + --ti-modal-content-bg-color: var(--ti-common-color-bg-white-normal); + --ti-modal-backdrop-bg-color: #000000; + --ti-modal-header-font-weight: bold; + --ti-modal-close-icon-position-top: 8px; + --ti-modal-close-icon-position-right: 20px; + /* ---------------modal config----END----------------------------------------------*/ + /* ---------------formfield config----START----------------------------------------------*/ + --ti-formfield-item-padding-bottom: 20px; + --ti-formfield-item-required-padding-right: 0px; + --ti-formfield-item-required-font-size: 16px; + --ti-formfield-item-label-padding-right: 20px; + --ti-formfield-button-item-padding-top: 20px; + --ti-formfield-item-required-label-line-height: var(--ti-input-height); + --ti-formfield-text-from-item-line-height: 40px; + --ti-formfield-text-form-label-color: var(--ti-common-color-text-weaken); + --ti-formfield-item-content-line-height: 30px; + /* ---------------formfield config----END----------------------------------------------*/ + /* ---------------tab config----START----------------------------------------------*/ + --ti-tab-border-color: var(--ti-common-color-line-dividing); + --ti-tab-border-color-hover: var(--ti-tab-border-color); + --ti-tab-header-text-color: var(--ti-common-color-text-secondary); + --ti-tab-header-text-color-hover: var(--ti-common-color-text-highlight); + --ti-tab-header-text-color-active: var(--ti-tab-header-text-color-hover); + --ti-tab-header-text-color-active-font-weight: normal; + --ti-tab-header-font-size: var(--ti-common-font-size-1); + --ti-tab-header-border-bottom-active: 3px solid + var(--ti-common-color-bg-emphasize); + --ti-tab-second-level-header-text-color-active: var( + --ti-common-color-text-highlight + ); + --ti-tab-second-level-header-text-color-hover: var( + --ti-tab-second-level-header-text-color-active + ); + --ti-tab-dark-text-color: var(--ti-common-color-text-darkbg); + --ti-tab-dark-text-color-hover: var(--ti-common-color-text-white); + --ti-tab-dark-text-color-active: var(--ti-common-color-text-primary); + --ti-tab-dark-bg-color: var(--ti-common-color-bg-dark-normal); + --ti-tab-dark-bg-color-hover: var(--ti-common-color-bg-dark-emphasize); + --ti-tab-dark-bg-color-avtive: var(--ti-common-color-bg-normal); + --ti-tab-dark-color-disabled: var(--ti-common-color-text-gray-disabled); + --ti-tab-dark-padding-horizon: var(--ti-common-space-6x); + --ti-tab-dark-border-radius: var(--ti-common-border-radius-normal) + var(--ti-common-border-radius-normal) 0 0; + /* ---------------tab config----END----------------------------------------------*/ + /* ---------------message config----START----------------------------------------------*/ + --ti-message-prompt-icon-color: var(--ti-common-color-success); + --ti-message-error-icon-color: var(--ti-common-color-error); + --ti-message-warn-icon-color: var(--ti-common-color-warn); + --ti-message-confirm-icon-color: var(--ti-common-color-prompt); + --ti-message-default-width: 400px; + --ti-message-content-title-font-size: var(--ti-common-font-size-3); + /* ---------------message config----END----------------------------------------------*/ + /* ---------------table config----START----------------------------------------------*/ + --ti-table-th-height: 28px; + --ti-table-th-bg-color: var(--ti-common-color-bg-white-emphasize); + --ti-table-th-text-color: var(--ti-common-color-text-secondary); + --ti-table-th-spacing-line-color: var(--ti-common-color-text-white); + --ti-table-th-text-font-weight: 600; + --ti-table-border-bottom-color: var(--ti-common-color-line-dividing); + --ti-table-td-text-color: var(--ti-common-color-text-primary); + --ti-table-td-padding: var(--ti-common-space-3x) var(--ti-common-space-10); + --ti-table-td-line-height: var(--ti-common-line-height-number); + --ti-table-small-th-height: var(--ti-table-th-height); + --ti-table-small-td-horizontal-padding: 10px; + --ti-table-small-td-vertical-padding: var(--ti-common-space-2x); + --ti-table-small-td-line-height: var(--ti-common-line-height-number); + --ti-table-nest-th-height: var(--ti-table-small-th-height); + --ti-table-nest-td-line-height: var(--ti-common-line-height-number); + --ti-table-nest-td-border-bottom-color: var(--ti-table-border-bottom-color); + --ti-table-tr-bg-color: var(--ti-common-color-bg-white-normal); + --ti-table-tr-bg-color-hover: var(--ti-table-th-bg-color); + --ti-table-tr-bg-color-selected: var(--ti-table-tr-bg-color); + --ti-table-tr-text-color-disabled: var(--ti-common-color-text-disabled); + --ti-table-tr-bg-color-disabled: var(--ti-common-color-bg-disabled); + --ti-table-tr-bg-color-nodata: var(--ti-table-tr-bg-color); + --ti-table-tr-bg-color-nodata-color: var(--ti-common-color-text-link); + --ti-table-tr-bg-color-nodata-color-hover: var( + --ti-common-color-text-link-hover + ); + --ti-table-nodata-td-color: var(--ti-common-color-text-secondary); + --ti-table-nodata-height: 210px; + --ti-table-small-nodata-height: 190px; + --ti-table-nodata-td-font-size: var(--ti-common-font-size-1); + --ti-table-nodata-lead-icon-height: 90px; + --ti-table-nodata-td-bg-img-url: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFoAAABaCAYAAAFPr3GUAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAADPNJREFUeNqUULENwCAMK0wsSDmBk3oCn/UFegR7N84oH6SAoAISFdWShwQbRxaIuDFoSzE/SEaIzAycgY2quBNNiawnfYl7iOGkEAJRTDsrf/yecQwJAEAUWmvS0ltdjJEYlFL9eA4J3nticM71477llhIB17hKo9WQaVbi2dBoO6Gb3x8BhE1DAFRxA7ocI1LCwxcXjMhpiFCk/YcpdoCJvH37FkXFlStXUDSAFO8HsVavXs3w69cvFMXCwsIMu3btwkz7Hz9+xBoxjx49wlQsKSmJ4VA2NjY0lyOBZ8+egWlgssUaQyDFB3BF35s3b1D4pOQmeE5iJKQQRLCgC6DZgmIIQABhSxsw7PCfOHAAlxnYBCkBCUQn1Fu3bjF8+fKF4dy5cwwpKSkMc+bMAcf38+fPwfKurq4M8vLyOMMQa+xs3boVbIC3tzfWxIMMQBYKCQkxBAUFYY3NAHRRkMEBAQHgtI2nfAHnBRsbG4Z3795hzWkgw9djk3n9+jVm8kYDoFyJo+KB551GdEFQWMJ8QAiIiooyGBkZYU+8uHIEqJr4/v07To0wy1lZWRlERESwmo03taCnDlAEgyIblnJAAMTGlVrwlcbkAqzpHFdrgKjqGJsgQADWqxjHQRgI2lEqGn8h10F5NS3iO1F+cj0PoM0DaE6iRbwA6SQekDRUIHE3lhKZZRfMwUhuzHq9LLOzy1L5u+tOyv2yduaIqLVEQYqvjakYOfvzjtxyF2gu4qfaj5FGjLHHrHEaxeOqocDnp/UnaXWWZavEzfNc5PTJHUDdSH0APRdsreo9qFbHceydVIgYznCiNFKh6bpODcOgwjCc6TQ0/IWqqmyX6ft+1jBmPIYBDMuyXI22rmtxhDlLh2g6ED0u9AXrGJNV27YqiqKJYwpjjLXl9JkraeuUAh+I9kOMfE3T+EfMIU3TWSqSJFFFUYh98MY9wGu6QEsKgmCyJzl19fhflbdg89ZjSOWVyyt47fa7F9ALMZMIo4P2/V/YAk1ZoY9yytFNH+FU4jEMPjc4/OYCWmqmrnAbZv/jb/1Ih34FYM6KURuGoajieAwkF8jQwVlsqLdshq5eSm7Q3iBX6QmKfYIO3jKkFzD4CM0eaMGQzbR9wko/qSV9K3HaB4IEK9b395f+ey/c9t81Zq0mdcXadW1ONgRpje9iODx9jzWrUM54hUMCtVmZ6L6NQ107YNn+2rUfhiKIQ+L5ouQzz3MRRZEIgkBKQ2WVUOo3mUw6r+E76Ak+2/QsieunZFxkPZqUMlJcgd9zGuIJ4GccM12ZHnO324nNZiOWy6XwfV9SJ2aGrNjv95JroOkmSSIWi4Vp+pb6P7c28Q7+gYDH47F0KzmanAOYBwDoG3g4Ax/I9IttlpIlQNM01rtS+kepts5sUBlP05QT9BSZvu+TGbWI8a5T+ymJ8kKZqUx3upEO5/QvgDDTRUxvBoDZZHJdUGZIwuFw6FVSXst2rMDxptSAbSMi0ygLjQ10PA7n87nchFAOfTa2p+s6pwjD8OhG2zYialoNk/hFEiAoELTJC+tqLm+cifTfkjiOZaZ0sG0+XY0zceMTAm3thtgoVVXJo8/zvF7Z6SoPKFh1KjGRySS7mN1FUchxDsqy/MyyrM9PXk18ms0/6ro28g7aLOg1g6TUYUX7iY5Pxy09/A8Ycc/pqp38+MfBjlyVyzUVzIpDK/p0xBl5+rsLBZmRe444AQNfAjBvBbdtBDFwdfBPjyQNCEkFKcF2BUEaEOwKknTiVBClAcWpIPZP+jk//ewOFOunl+M5HA3qsLsc3u35NMDCEGzvDSgulxzyPJbO4X1zSZ09r9PI738/rwVLyi4JuksIX3tEvLtGghhcQhDcJKzZFefNnq7cg4UUvKeFD9+f0JoiKUH6bbPpl4Ejx7YxTO+DOMYl82hZPWfpi5FuxTdWKlFlCP8Y+fp+8rgHYu79keQdUVeJWfpYCIurXFmWpvOL5XJZT0jojgaKAqSfkoLq30nHH4AkJjMNJN4F1drVpOlIgYGV1WpVP5jR7iSHljkq/MRnp0o1iV3jT57KpS+66njSTg5BTZUxKCWJdbg5D9wjGxfxdUPa1Uh07F3Q3b35fM6UYLVvU6Rl5kl6wbon3IewSA2bzaZehCH+4uzRYo0myk4jMIopVqwZnsBHidNXngdBERobJ566TxRTxNwUINnKIARE+FRYwx6YxvDMMYiARefTophixWZENGkmymAPDCvDEPp/CFxQpGEtPQrLanKz2cz0aVgbpHHQSXyiSe92uzCdTk1RXQvqOalXIgXCHAzSHq7sXW6JpWEVWKdkjMbBhqUHIZ26FPpAvrXYuFOpwvbgQTnALazQCJL6JQCPpU+8pBn3yPVaNOkO4Q64rfr4YwrSusg1gJxi+oHu4u5uWe6hQ6PVtWJcLYJF1ehsJpDgI3pst1sz5CGXwLJCHtzDebEADyBNTbPgoMCKGIK0SiUhzbgYSHv77CD9wIY9WBpAc78EJEY7SH/TIe+n9deYDtjv97WlSwBFsLgHZkYceuILaTOnxnWLB63X62yW5ynZkDShE9x+oysV6mKF7c2ARWmJPV646svlLJDtOPigTHZ7NQ/57MjqgO85sQZF2y9mFxS7cBmv5hHLZVyaR0LLuwvGpM0r40BdSpEO4XhG3KJDhRXzdYyEy5AYCKtYPxqB8KJrajoZwcc/WLc0k+VBTf38CmQfGyOZaQWbml43G94OeOCKtuRC6wKaMLkKiXPlgjx6tJnlzeprx1X8r/26aZf1X4D2zienjRgK4yZCQmwIbFmNlAMk3USwSnKCcoPCEXqD3qDlBKQ3oCdowpJVWLPJEeACqPqN/EZmOjOZ2M+TyZ8njaBFcuxvnj8/29970brQ97XEvr0b+7MbYZ7MrHvP6obhMaxJoMc2Av7WksX2t10KZtsO9MDuM0ZmO2xud8uLbQD6xnpJ12y3vdvZ99gmoBPbob7ZTXuxDrTcFNC88QezX1YZ4msDvY8ABwO+DtBt0iW3xb7UXTzrAH1uQ6D+AddSDid0fQsBuvaR3sGqdepVQBem6AcFqvO5eX19/fR/HAzzSOq/xt+kLlLRhWGdmkkBVpqHXQb0LNZGg4SYk5OTdZNb1AwRIcXUuNwZjaIMcW4KJHedpkDGu3jILNoUyJiUD8vPLEUbFW3r86e7Uw2Q5Y6IqxWuXfLl+dpiaCJFpQGd8HtJHTcfsKfGud10qQNu+RnSusuXJGfTcWiCjEUupfv9fjqgTXq0vHjq9HCxjTaCh36L4qSkpp2PfbdrXQY02+ggSbpwH1ZU/Enqd0ZejGrNNrl5RT6BQ/CQuspPalsCvIcSvczS+5eOE2GoWJ3E9rYYgLI4I/j6+PjIKEQ8X8l+CUfjzV9DW6ODeLRIlhBH5utJhRgyEFcphLKoSl1U1U+0Bfkqv6LAk89QnHVgmxybmhLvVeYKHwAbXqbzeAp1KagGliSJV9uiWy8CDXGzL3UUpeCLoyjT2+2xWTPNoszQ70hiOAsfFOJqMEM4umxmhNIU4iscwp017ktUtHFHM2aWUEm8AuCZ3p6qxszKhOKrBORFRsQDiLwkRJDoZCXaiEAbWbjX0WxNOij6QiIaqIOBDIfDrIpeSNsuR/usAQL02dlZE/xcumFR8Wg0kTwu6M/Pz0HhHd7rnmn4giGFpzHKqLhHEFsDtNtBBsRmpajCvoZH+9BG3oibG+BnfaClk3ge+S/i4Vp5XZPJJKUh2vNt0w3v4GcoBIeI6c0C9B+NODoPtFCGRB4oi9lt+XI0bVKWCUDg516v5wWKG96xg5XjgMhAp19zMY1BHxJ5HB0dpdEHmxkG6HPABAhIygWM/L99jX7RPxdoX0dYYWleCLcC79pAC9gsNrkvMVnb8OCiSsY+cbREHbR5enraBD+D7eOxc3L3oE0fAA0YDIRpGpLpDD9rGlxPZOTyMx4e4WQxvXGROBr6eNH2ahZEMaiDg/+AXDIV47BInEBAjbTtNhbTqQu00dqK53la4uk2GvyMZ0t8HgHoDNP8nSF/+KvxCXgwZ9QSrzIozhbkUnXTRhYnjiDb7wj9+lT1quhyVg1sjPNeavkyKBbFy8vL1hz8X11dpSFnzYQ2b5DLgE53p0ZZlUQZm6enp/R3bqCvr68bv9JyZxlxPUBHsEL1UpWug73z0ihKcFmIWAwZcKieo0qzUfU3Ppsc1QgvmRU1MSWKpTqSMHUhzQ7ayi8wqCtyTOx06B4w/c+LB0Yxl2xpqeTugG1mdw69rg4lPYXot2Z/NdJeYvTQ1IqBDWO6e0ARYxOQSBR6lbWw0+fC5FL6d2iRu7BjDMrWipH+Rqd+bHGkcm/7/6bZaBMJnWPb8bbmG85t/2ZRz1U2kKJ8bhdTnqbTNeQ0bartsW0EelW8PnCe8zVmwtyCt3CeZVsG9g+URCM796dvBgAAAABJRU5ErkJggg=='); + --ti-table-col-resize-line: 1px dashed var(--ti-common-color-line-dividing); + --ti-table-cols-toggle-menu-color: var(--ti-common-color-icon-normal); + --ti-table-cols-toggle-menu-size: 28px; + --ti-table-cols-toggle-menu-font-size: var(--ti-common-font-size-2); + --ti-table-cols-toggle-menu-line-height: 26px; + --ti-table-cols-toggle-menu-color-hover: var(--ti-common-color-icon-hover); + --ti-table-cols-toggle-menu-color-disabled: var( + --ti-common-color-text-disabled + ); + --ti-table-cols-toggle-menu-border-color-disabled: var( + --ti-common-color-line-disabled + ); + --ti-table-cols-toggle-menu-border-color: var(--ti-common-color-line-normal); + --ti-table-cols-toggle-dropdown-border-radius: var( + --ti-common-border-radius-normal + ); + --ti-table-cols-toggle-dropdown-box-shadow: var(--ti-common-shadow-2-down); + --ti-table-cols-toggle-dropdown-border-color: rgba(0, 0, 0, 0.2); + --ti-table-sort-icon-color-active: var(--ti-common-color-icon-active); + --ti-table-sort-color-hover: var(--ti-common-color-icon-hover); + --ti-table-details-icon-color-hover: var(--ti-common-color-icon-hover); + --ti-table-details-icon-color: var(--ti-common-color-icon-normal); + --ti-table-details-bg-color: var(--ti-common-color-bg-white-emphasize); + --ti-table-details-padding: 0; + --ti-table-small-details-padding: var(--ti-common-space-5x); + --ti-table-tree-minus-square-color: var(--ti-common-color-icon-active); + --ti-table-tree-minus-square-color-hover: var(--ti-common-color-icon-hover); + --ti-table-tree-plus-square-color: var(--ti-common-color-icon-normal); + --ti-table-tree-square-bg: var(--ti-common-color-bg-white-normal); + --ti-table-tree-square-right-space: var(--ti-common-space-2x); + --ti-table-tree-square-icon-font-size: 16px; + --ti-table-column-icon-left-space: var(--ti-common-space-5x); + --ti-table-column-icon-right-space: var(--ti-common-space-6); + --ti-table-column-select-icon-width: 32px; + --ti-table-column-icon-width: 42px; + /* ---------------table config----END----------------------------------------------*/ + /* ---------------pagination config----START----------------------------------------------*/ + --ti-pagination-height: 24px; + --ti-pagination-margin-top-table: 10px; + --ti-pagination-bg-color: var(--ti-common-color-bg-white-normal); + --ti-pagination-border-color: var(--ti-common-color-line-normal); + --ti-pagination-border-color-hover: var(--ti-common-color-line-hover); + --ti-pagination-text-color: var(--ti-common-color-text-secondary); + --ti-pagination-text-color-hover: var(--ti-common-color-icon-hover); + --ti-pagination-bg-color-hover: var(--ti-common-color-bg-light-normal); + --ti-pagination-text-color-active-hover: var(--ti-common-color-text-white); + --ti-pagination-bg-color-active-hover: var(--ti-common-color-bg-emphasize); + --ti-pagination-total-disable: var(--ti-common-color-text-disabled); + --ti-pagination-bg-color-disabled: var(--ti-common-color-bg-white-normal); + --ti-pagination-text-color-disabled: var(--ti-pagination-total-disable); + --ti-pagination-icon-color-disabled: var(--ti-common-color-icon-disabled); + --ti-pagination-text-color-active: var(--ti-common-color-text-white); + --ti-pagination-bg-color-active: var(--ti-common-color-bg-emphasize); + --ti-pagination-text-color-active-active: var(--ti-common-color-text-white); + --ti-pagination-bg-color-press: var(--ti-common-color-bg-emphasize); + --ti-pagination-prev-next-color: var(--ti-common-color-icon-normal); + --ti-pagination-prev-next-width: 22px; + --ti-pagination-button-bg-active: var(--ti-pagination-bg-color-press); + --ti-pagination-prev-next-color-active: var( + --ti-pagination-text-color-active-active + ); + --ti-pagination-goto-icon-color: var(--ti-common-color-bg-emphasize); + --ti-pagination-goto-input-width: 45px; + --ti-pagination-goto-input-color: var(--ti-pagination-text-color); + --ti-pagination-text-min-width: 20px; + --ti-pagination-border-radius: var(--ti-common-border-radius-normal); + --ti-pagination-select-padding-left: var(--ti-common-space-10); + /* ---------------pagination config----END----------------------------------------------*/ + /* ---------------tooltip config----START----------------------------------------------*/ + --ti-tip-bg-color: var(--ti-common-color-bg-dark-deep); + --ti-tip-text-color: var(--ti-common-color-text-gray); + --ti-tip-border-radius: var(--ti-common-border-radius-1); + --ti-tip-border-color: var(--ti-common-color-bg-dark-deep); + --ti-tip-border: 1px solid var(--ti-common-color-bg-dark-deep); + --ti-tip-box-shadow-color: rgba(0, 0, 0, 0.2); + --ti-tip-box-shadow: var(--ti-common-shadow-3-down); + --ti-tip-vertical-padding: var(--ti-common-space-3x); + --ti-tip-horizon-padding: var(--ti-common-space-4x); + /* ---------------tooltip config----END----------------------------------------------*/ + /* ---------------switch config----START----------------------------------------------*/ + --ti-switch-track-on-bg-color: var(--ti-common-color-bg-emphasize); + --ti-switch-track-off-bg-color: var(--ti-common-color-bg-secondary); + --ti-switch-track-bg-color-disabled: var(--ti-common-color-bg-dark-disabled); + /* ---------------switch config----END----------------------------------------------*/ + /* ---------------progressbar config----START----------------------------------------------*/ + --ti-progressbar-progress-bg-color: var(--ti-common-color-line-dividing); + --ti-progressbar-bg-color: var(--ti-common-color-bg-emphasize); + --ti-progressbar-height: 5px; + --ti-progressbar-progress-border-radius: 999px; + --ti-progressbar-progress-label-color: var(--ti-common-color-text-white); + /* ---------------progressbar config----END----------------------------------------------*/ + /* ---------------steps config----START----------------------------------------------*/ + --ti-steps-number-font-size: var(--ti-common-font-size-1); + --ti-steps-line-color: var(--ti-common-color-line-normal); + --ti-steps-line-color-highlight: var(--ti-common-color-line-active); + --ti-steps-box-bg-color-highlight: var(--ti-common-color-bg-emphasize); + --ti-steps-box-highlight: var(--ti-common-color-icon-active); + --ti-steps-box-uncomplete: var(--ti-common-color-icon-normal); + --ti-steps-box-disabled: var(--ti-common-color-text-weaken); + --ti-steps-box-number-active: var(--ti-common-color-text-white); + --ti-steps-text-highlight: var(--ti-common-color-text-highlight); + --ti-steps-text-uncomplete: var(--ti-common-color-text-secondary); + --ti-steps-text-disabled: var(--ti-common-color-text-weaken); + --ti-steps-horizontal-process-done-color: var(--ti-base-color-brand-2); + --ti-steps-horizontal-process-wait-color: var(--ti-base-color-common-1); + /* ---------------steps config----END----------------------------------------------*/ + /* -------------------------actionMenu控件样式设置----START---------------------------------------------*/ + --ti-actionmenu-item-text-color: var(--ti-common-color-text-link); + --ti-actionmenu-item-text-color-hover: var(--ti-common-color-text-link-hover); + --ti-actionmenu-item-text-color-active: var( + --ti-common-color-text-link-hover + ); + --ti-actionmenu-item-text-color-disabled: var( + --ti-common-color-text-disabled + ); + --ti-actionmenu-divider-color: var(--ti-common-color-line-dividing); + /* -------------------------actionMenu控件样式设置----END-----------------------------------------------*/ + /* ---------------leftmenu控件样式设置----START-----------------------------------------------------*/ + --ti-leftmenu-width: 192px; + --ti-leftmenu-font-size: var(--ti-common-font-size-base); + --ti-leftmenu-head-font-size: var(--ti-common-font-size-1); + --ti-leftmenu-head-line-dividing-color: var(--ti-common-color-line-dividing); + --ti-leftmenu-container-bg-color: var(--ti-common-color-bg-white-normal); + --ti-leftmenu-toggle-icon-bg-color: #dbdbdb; + --ti-leftmenu-toggle-icon-bg-color-hover: #c9c9c9; + --ti-leftmenu-toggle-icon-color: #777777; + --ti-leftmenu-toggle-icon-color-hover: #666666; + --ti-leftmenu-head-text-color: var(--ti-common-color-text-primary); + --ti-leftmenu-first-level-font-size: 14px; + --ti-leftmenu-first-level-border-bottom: 1px #e5e5e5 solid; + --ti-leftmenu-first-level-border-top: 1px #fafafa solid; + --ti-leftmenu-first-level-border-bottom-selected: 1px #e5e5e5 solid; + --ti-leftmenu-first-level-border-top-selected: 1px #fafafa solid; + --ti-leftmenu-second-level-bg-color: #f7f8f8; + --ti-leftmenu-second-level-icon-color: #999; + --ti-leftmenu-second-level-font-size: 14px; + --ti-leftmenu-second-level-padding: 10px 36px 10px 40px; + --ti-leftmenu-second-level-border-bottom: 1px #e5e5e5 solid; + --ti-leftmenu-second-level-border-top: 1px #fafafa solid; + --ti-leftmenu-second-level-border-bottom-selected: 1px #e5e5e5 solid; + --ti-leftmenu-second-level-border-top-selected: 1px #fafafa solid; + --ti-leftmenu-item-bg-color: #f7f8f8; + --ti-leftmenu-item-text-color: var(--ti-common-color-text-secondary); + --ti-leftmenu-item-bg-color-hover: var(--ti-common-color-bg-white-emphasize); + --ti-leftmenu-item-text-color-hover: var(--ti-common-color-text-highlight); + --ti-leftmenu-border-left-width: 2px; + --ti-leftmenu-item-open-bg-color: #fff; + --ti-leftmenu-item-selected-bg-color: #fff; + --ti-leftmenu-item-selected-text-color: var(--ti-common-color-text-highlight); + --ti-leftmenu-item-selected-border-left-color: var( + --ti-common-color-line-active + ); + --ti-leftmenu-level1-label-padding: 10px 36px 10px 20px; + --ti-leftment-leftmenu-head-text-align: left; + --ti-leftmenu-angle-normal-width: 8px; + --ti-leftmenu-angle-normal-height: 5px; + --ti-leftmenu-icon-color-nomal: var(--ti-common-color-icon-normal); + --ti-leftmenu-icon-color-hover: var(--ti-common-color-icon-hover); + --ti-leftmenu-head-padding: 20px 36px 20px 20px; + --ti-leftmenu-group-padding-top: var(--ti-common-space-10); + --ti-leftmenu-group-padding-right: 36px; + --ti-leftmenu-group-padding-bottom: var(--ti-common-space-10); + --ti-leftmenu-group-padding-left: var(--ti-common-space-5x); + --ti-leftmenu-foot-padding-top: 10px; + --ti-leftmenu-foot-padding-bottom: 10px; + --ti-leftmenu-foot-padding-left: 20px; + --ti-leftmenu-foot-space-right: 36px; + --ti-leftmenu-foot-text-color: var(--ti-common-color-text-link); + --ti-leftmenu-foot-text-color-hover: var(--ti-common-color-text-link-hover); + /* ----------------leftmenu控件样式设置----END------------------------------------------------------*/ + /* ---------------fileUpload控件样式设置----START-----------------------------------------------------*/ + --ti-upload-height: var(--ti-input-height); + --ti-upload-progerss-text-color: #2095f2; + --ti-upload-progress-bg-color: #bcdffb; + --ti-upload-field-default-width: 300px; + --ti-upload-item-bg: var(--ti-common-color-bg-normal); + --ti-upload-item-name-color: var(--ti-common-color-text-secondary); + --ti-upload-item-size-color: var(--ti-common-color-text-weaken); + --ti-upload-state-general-operate-color: var(--ti-actionmenu-item-text-color); + --ti-upload-state-general-operate-color-hover: var( + --ti-actionmenu-item-text-color-hover + ); + /* ---------------fileUpload控件样式设置----END-----------------------------------------------------*/ + /* ---------------buttonGroup控件样式设置----START-----------------------------------------------------*/ + --ti-button-group-text-color: var(--ti-common-color-text-primary); + --ti-button-group-padding-horizon: var(--ti-button-middle-padding-horizon); + --ti-button-group-height: var(--ti-button-middle-height); + --ti-button-group-height-small: var(--ti-button-xs-height); + --ti-button-group-border-radius: var(--ti-common-border-radius-normal); + --ti-button-group-bg-color: var(--ti-common-color-bg-light-normal); + --ti-button-group-border-color: var(--ti-button-group-bg-color); + --ti-button-group-border-left-color: var(--ti-common-color-bg-white-normal); + --ti-button-group-bg-color-hover: var(--ti-common-color-bg-light-emphasize); + --ti-button-group-text-color-hover: var(--ti-common-color-text-primary); + --ti-button-group-border-color-hover: var(--ti-button-group-bg-color-hover); + --ti-button-group-bg-color-active: var(--ti-common-color-bg-emphasize); + --ti-button-group-bg-color-active-disabled: var( + --ti-common-color-bg-dark-disabled + ); + --ti-button-group-text-color-active: var(--ti-common-color-text-white); + --ti-button-group-border-color-active: var(--ti-button-group-bg-color-active); + --ti-button-group-bg-color-disabled: var(--ti-common-color-bg-disabled); + --ti-button-group-text-color-disabled: var(--ti-common-color-text-disabled); + --ti-button-group-border-color-disabled: var(--ti-common-color-line-disabled); + --ti-button-group-space-bottom: var(--ti-common-space-base); + /* ---------------buttonGroup控件样式设置----END-----------------------------------------------------*/ + /* ---------------collapse控件样式设置----START-----------------------------------------------------*/ + --ti-collapse-panel-border: 1px solid #e3e3e3; + --ti-collapse-panel-bg-color: #f5f5f5; + --ti-collapse-panel-border-radius: 2px; + --ti-collapse-panel-padding: 10px; + /* ---------------collapse控件样式设置----END-----------------------------------------------------*/ + /* ---------------accordion控件样式设置----START-----------------------------------------------------*/ + --ti-accordion-panel-bg-color: var(--ti-common-color-bg-white-normal); + --ti-accordion-panel-border: 1px solid var(--ti-common-color-line-dividing); + --ti-accordion-panel-border-radius: var(--ti-common-border-radius-normal); + --ti-accordion-panel-height: 34px; + --ti-accordion-panel-lineheight: 34px; + --ti-accordion-panel-head-padding: 0 var(--ti-common-space-4x); + --ti-accordion-panel-head-bg-color: var(--ti-common-color-bg-white-emphasize); + --ti-accordion-panel-head-bg-color-disabled: var( + --ti-common-color-bg-disabled + ); + --ti-accordion-panel-space-between: var(--ti-common-space-2x); + --ti-accordion-panel-collapse-border-top: 1px solid + var(--ti-common-color-line-dividing); + --ti-accordion-panel-body-padding: var(--ti-common-space-3x) + var(--ti-common-space-4x); + --ti-accordion-panel-title-color: var(--ti-common-color-text-primary); + --ti-accordion-panel-title-color-disabled: var( + --ti-common-color-text-disabled + ); + --ti-accordion-panel-body-bg: var(--ti-common-color-bg-white-normal); + --ti-accordion-panel-body-shadow: none; + --ti-accordion-panel-fs: var(--ti-common-font-size-base); + --ti-accordion-panel-title-margin-left: var(--ti-common-space-4x); + --ti-accordion-panel-icon-color: var(--ti-common-color-icon-normal); + --ti-accordion-panel-icon-color-disabled: var( + --ti-common-color-icon-disabled + ); + --ti-accordion-panel-icon-fs: var(--ti-common-font-size-2); + /* ---------------accordion控件样式设置----END-----------------------------------------------------*/ + /* ---------------autoComplete样式设置----START-----------------------------------------------------*/ + --ti-autocomplete-highlight-text-color: var(--ti-base-color-common); + --ti-autocomplete-highlight-font-weight: bold; + /* ---------------autoComplete样式设置----END-----------------------------------------------------*/ + /* ---------------alert样式设置----START-----------------------------------------------------*/ + --ti-alert-default-width: 400px; + --ti-alert-success-bg-color: var(--ti-common-color-success-bg); + --ti-alert-success-border-color: var(--ti-common-color-success-border); + --ti-alert-success-close-color: var(--ti-common-color-success); + --ti-alert-success-icon-color: var(--ti-common-color-success); + --ti-alert-success-box-shadow: var(--ti-common-shadow-success); + --ti-alert-error-bg-color: var(--ti-common-color-error-bg); + --ti-alert-error-border-color: var(--ti-common-color-error-border-secondary); + --ti-alert-error-close-color: var(--ti-common-color-error); + --ti-alert-error-icon-color: var(--ti-common-color-error); + --ti-alert-error-box-shadow: var(--ti-common-shadow-error); + --ti-alert-warn-bg-color: var(--ti-common-color-warn-bg); + --ti-alert-warn-border-color: var(--ti-common-color-warn-border); + --ti-alert-warn-close-color: var(--ti-common-color-warn); + --ti-alert-warn-icon-color: var(--ti-common-color-warn); + --ti-alert-warn-box-shadow: var(--ti-common-shadow-warn); + --ti-alert-prompt-bg-color: var(--ti-common-color-prompt-bg); + --ti-alert-prompt-border-color: var(--ti-common-color-prompt-border); + --ti-alert-prompt-close-color: var(--ti-common-color-prompt); + --ti-alert-prompt-icon-color: var(--ti-common-color-prompt); + --ti-alert-prompt-box-shadow: var(--ti-common-shadow-prompt); + --ti-alert-dark-bg-color: var(--ti-common-color-bg-dark-deep); + --ti-alert-dark-box-shadow: var(--ti-common-shadow-3-down); + --ti-alert-simple-border-color: var(--ti-common-color-line-normal); + --ti-alert-simple-close-color: var(--ti-common-color-icon-normal); + --ti-alert-label-color: var(--ti-common-color-text-secondary); + --ti-alert-type-icon-margin-right: var(--ti-common-space-2x); + --ti-alert-type-icon-width: var(--ti-common-font-size-2); + --ti-alert-close-icon-width: 12px; + --ti-alert-box-radius: var(--ti-common-border-radius-normal); + --ti-alert-close-icon-margin-left: var(--ti-alert-padding-horizon); + /* ---------------alert样式设置----END-----------------------------------------------------*/ + /* ---------------slider样式设置----START-----------------------------------------------------*/ + --ti-slider-track-bg-color: var(--ti-common-color-bg-light-normal); + --ti-slider-selection-bg-color: var(--ti-common-color-bg-emphasize); + --ti-slider-tick-color: var(--ti-common-color-text-secondary); + --ti-slider-tick-selection-color: var(--ti-common-color-bg-white-normal); + --ti-slider-tip-bg-color: var(--ti-common-color-bg-dark-deep); + --ti-slider-tip-color: var(--ti-common-color-text-gray); + --ti-slider-tip-bs: var(--ti-common-shadow-3-down); + --ti-slider-text-color: var(--ti-common-color-text-secondary); + --ti-slider-pointer-color-hover: var(--ti-common-color-bg-hover); + --ti-slider-pointer-color: var(--ti-slider-selection-bg-color); + --ti-slider-pointer-bs: var(--ti-common-shadow-1-down); + --ti-slider-pointer-bg-color: linear-gradient( + 153deg, + var(--ti-common-color-bg-white-normal), + var(--ti-common-color-bg-light-normal) 99% + ); + --ti-slider-pointer-border-disable: var(--ti-common-color-line-disabled); + --ti-slider-pointer-bg-disable: var(--ti-common-color-bg-disabled); + --ti-slider-color-disabled: var(--ti-common-color-text-disabled); + /* ---------------slider样式设置----END-----------------------------------------------------*/ + /* ---------------UnifyValid样式设置----START-----------------------------------------------------*/ + --ti-valid-pwd-level-bar-color: #8a8e99; + --ti-valid-pwd-level-bar-color-weak-active: var(--ti-common-color-error); + --ti-valid-pwd-level-bar-color-medium-active: var(--ti-common-color-warn); + --ti-valid-pwd-level-bar-color-strong-active: var(--ti-common-color-success); + /* ---------------UnifyValid样式设置----END-----------------------------------------------------*/ + --ti-tree-node-bg-color-checked: var(--ti-common-color-bg-light-normal); + --ti-tree-node-checked-icon-color: var(--ti-common-color-bg-emphasize); + --ti-tree-content-box-color-hover: var(--ti-common-color-bg-white-emphasize); + --ti-tree-minus-square-color: var(--ti-common-color-icon-active); + --ti-tree-plus-square-color: var(--ti-common-color-icon-normal); + --ti-tree-icon-color-active: var(--ti-common-color-icon-active); + --ti-tree-icon-bg-color-active: var(--ti-common-color-bg-white-normal); + --ti-tree-item-height: 30px; + --ti-tree-item-lineheight: 30px; + --ti-tree-content-box-left-space: var(--ti-common-space-2x); + --ti-tree-square-icon-font-size: 16px; + --ti-tree-icon-right-space: var(--ti-common-space-2x); + --ti-tree-item-guide-line-color: var(--ti-common-color-line-dividing); + /* ---------------headFilter组件----START----------------------------------------------*/ + --ti-head-filter-filtered-color: var(--ti-common-color-icon-active); + /* ---------------headFilter组件----END----------------------------------------------*/ + /*------------------------------------------------------------------动效相关变量-----------------------------------------------------------------------*/ + --ti-timing-function-standard: cubic-bezier(0.4, 0, 0.2, 1); + --ti-timing-function-deceleration: cubic-bezier(0, 0, 0.2, 1); + --ti-timing-function-acceleration: cubic-bezier(0.4, 0, 1, 1); + --ti-timing-function-sharp: cubic-bezier(0.4, 0, 0.6, 1); + --ti-timing-function-smoothing: cubic-bezier(0.2, 0, 0.4, 1); + --ti-timing-function-linear: cubic-bezier(0, 0, 1, 1); + --ti-timing-function-default: cubic-bezier(0.25, 0.1, 0.25, 1); + --ti-timing-function-ease-in: cubic-bezier(0.42, 0, 1, 1); + --ti-timing-function-ease-out: cubic-bezier(0, 0, 0.58, 1); +} diff --git a/packages/theme/src/base/index-global.less b/packages/theme/src/base/index-global.less new file mode 100644 index 000000000..32bb35166 --- /dev/null +++ b/packages/theme/src/base/index-global.less @@ -0,0 +1,16 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +@import './reset.less'; +@import './root.less'; +@import './comp.less'; +@import '../error-page/index.less'; +@import '../svg/index.less'; diff --git a/packages/theme/src/base/index.js b/packages/theme/src/base/index.js new file mode 100644 index 000000000..67eaf2fc1 --- /dev/null +++ b/packages/theme/src/base/index.js @@ -0,0 +1,65 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-base-color-primary-normal': '#1890ff', + 'tiny-base-color-primary-disabled': '#bfbfbf', + 'tiny-base-color-primary-hover': '#7693f5', + 'tiny-base-color-primary-active': '#096dd9', + 'tiny-base-color-success-normal': '#52c41a', + 'tiny-base-color-success-disabled': '#a6c3b9', + 'tiny-base-color-success-hover': '#73d13d', + 'tiny-base-color-success-active': '#389e0d', + 'tiny-base-color-warning-normal': '#faad14', + 'tiny-base-color-warning-disabled': '#d3c6a2', + 'tiny-base-color-warning-hover': '#ffc53d', + 'tiny-base-color-warning-active': '#ffc53d', + 'tiny-base-color-danger-normal': '#f5222d', + 'tiny-base-color-danger-disabled': '#d8bab5', + 'tiny-base-color-danger-hover': '#ff4d4f', + 'tiny-base-color-danger-active': '#cf1322', + 'tiny-base-color-info-normal': '#333333', + 'tiny-base-color-info-disabled': '#bfbfbf', + 'tiny-base-color-info-hover': '#54657e', + 'tiny-base-color-info-active': '#54657e', + 'tiny-base-color-secondary-normal': '#aec1d2', + 'tiny-base-color-secondary-disabled': '#f3f3f3', + 'tiny-base-color-secondary-active': '#94acc1', + 'tiny-base-color-light': '#fff', + 'tiny-base-color-dark': '#000', + 'tiny-base-color-gray-dark': '#666', + 'tiny-base-color-gray-normal': '#999', + 'tiny-base-color-gray-light': '#c4c4c4', + 'tiny-base-color-gray-lighter': '#d9d9d9', + 'tiny-base-color-gray-active': '#e6f7ff', + 'tiny-base-color-gray-background': '#f5f5f5', + 'tiny-base-color-navigation-normal': '#2e3243', + 'tiny-base-radius-large': '3px', + 'tiny-base-radius-medium': '2px', + 'tiny-base-radius-small': '1px', + 'tiny-base-font-family-normal': 'Helvetica, Arial, "microsoft yahei"', + 'tiny-base-font-size-base': '12px', + 'tiny-base-font-size-normal': '1em', + 'tiny-base-font-size-large': '1.125em', + 'tiny-base-font-weight-bold': '700', + 'tiny-base-size-width-large': '130px', + 'tiny-base-size-width-medium': '100px', + 'tiny-base-size-width-normal': '80px', + 'tiny-base-size-width-minor': '30px', + 'tiny-base-size-width-small': '36px', + 'tiny-base-size-width-mini': '24px', + 'tiny-base-size-height-minor': '30px', + 'tiny-base-size-height-large': '48px', + 'tiny-base-size-height-medium': '42px', + 'tiny-base-size-height-small': '36px', + 'tiny-base-size-height-mini': '24px' +} diff --git a/packages/theme/src/base/index.less b/packages/theme/src/base/index.less new file mode 100644 index 000000000..8e20491ec --- /dev/null +++ b/packages/theme/src/base/index.less @@ -0,0 +1,16 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import './reset.less'; +@import './basic-var.less'; +@import '../error-page/index.less'; +@import '../svg/index.less'; diff --git a/packages/theme/src/base/reset.less b/packages/theme/src/base/reset.less new file mode 100644 index 000000000..64c324c50 --- /dev/null +++ b/packages/theme/src/base/reset.less @@ -0,0 +1,210 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +[class*=~'@{css-prefix}'] { + -webkit-box-sizing: border-box; + box-sizing: border-box; + + *:after, + *:before { + -webkit-box-sizing: border-box; + box-sizing: border-box; + } + + a { + cursor: pointer; + background-image: none; + text-decoration: none; + outline: none; + + &:focus, + &:active, + &:hover { + outline: none; + text-decoration: none; + } + } + + dl, + dt, + dd, + ul, + ol, + li, + th, + td { + margin: 0; + padding: 0; + } + + ol, + ul { + list-style: none; + } + + audio, + canvas, + video { + display: inline-block; + } + + audio:not([controls]) { + display: none; + height: 0; + } + + mark { + background: #ff0; + color: #000; + } + + pre { + white-space: pre-wrap; + } + + sub, + sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; + } + + sup { + top: -0.5em; + } + + sub { + bottom: -0.25em; + } + + fieldset { + border: 1px solid #c0c0c0; + margin: 0 2px; + padding: 0.35em 0.625em 0.75em; + } + + legend { + border: 0; + padding: 0; + } + + // 清除IE + input::-ms-clear, + input::-ms-reveal { + display: none; + } + + button::-moz-focus-inner, + input::-moz-focus-inner { + border: 0; + padding: 0; + } + + textarea { + overflow: auto; + vertical-align: top; + } + + table { + border-collapse: collapse; + border-spacing: 0; + } + + .@{css-prefix}hide { + display: none; + } + + .popper__arrow { + &, + &:after { + position: absolute; + display: block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + } + } + + @media (min-width: 768px) { + ::-webkit-scrollbar { + width: 4px; + height: 4px; + } + + ::-webkit-scrollbar-track-piece { + background: #fafafa; + } + + ::-webkit-scrollbar-thumb { + background: #bfbfbf; + border-radius: 6px; + } + + ::-webkit-scrollbar-thumb:hover { + background: #999999; + } + + ::-webkit-scrollbar-thumb:active { + background: #999999; + } + + .@{css-prefix}scrollbar::-webkit-scrollbar { + width: 8px; + height: 8px; + } + + .@{css-prefix}scrollbar::-webkit-scrollbar-track-piece { + background: transparent; + border: 0; + } + + .@{css-prefix}scrollbar::-webkit-scrollbar-thumb { + background: #bfbfbf; + border-radius: 4px; + } + + .@{css-prefix}scrollbar::-webkit-scrollbar-thumb:hover { + background: #999999; + } + + .@{css-prefix}scrollbar::-webkit-scrollbar-thumb:active { + background: #999999; + } + + .@{css-prefix}min-scrollbar::-webkit-scrollbar { + width: 4px; + height: 4px; + } + + .@{css-prefix}min-scrollbar::-webkit-scrollbar-track-piece { + background: transparent; + border: 0; + } + + .@{css-prefix}min-scrollbar::-webkit-scrollbar-thumb { + background: #bfbfbf; + border-radius: 2px; + } + + .@{css-prefix}min-scrollbar::-webkit-scrollbar-thumb:hover { + background: #999999; + } + + .@{css-prefix}min-scrollbar::-webkit-scrollbar-thumb:active { + background: #999999; + } + } +} diff --git a/packages/theme/src/base/root.less b/packages/theme/src/base/root.less new file mode 100644 index 000000000..4a229bf32 --- /dev/null +++ b/packages/theme/src/base/root.less @@ -0,0 +1,388 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +/*注意:css var变量,以最后一次出现的生效。*/ +/*基础变量定义*/ +:root { + /* 一.颜色*/ + /* 1.基础色:此处的颜色变量为所有组件应用到的颜色,此处颜色仅在公共色中使用,具体组件不可使用*/ + --ti-base-color-white: #FFFFFF; + /* 彩色按钮或图标上文字、输入框背景色*/ + /* 1.1品牌色*/ + /* 品牌主色*/ + --ti-base-color-brand: #5E7CE0; + /* 主色蓝/下拉菜单、选块选中色*/ + /* 主色衍生色*/ + --ti-base-color-brand-1: #344899; + /* 主色悬浮色/文字按钮、链接悬浮色*/ + --ti-base-color-brand-2: #526ECC; + /* 文字按钮颜色/链接颜色*/ + --ti-base-color-brand-3: #7693F5; + /* 深色背景下图标*/ + --ti-base-color-brand-4: #96ADFA; + /* 深色背景链接色*/ + --ti-base-color-brand-5: #BECCFA; + /* 选块悬浮色/深色背景链接悬浮色/提示边框色/开关组件“开”禁用背景色*/ + --ti-base-color-brand-6: #E9EDFA; + /* 选块默认色/滑块背景色/分页悬浮色*/ + --ti-base-color-brand-7: #F2F5FC; + /* 下拉、列表、悬浮背景/表头/下拉搜索背景*/ + --ti-base-color-brand-8: #464C59; + /* 一级tab页签背景色、tips背景色、DIV提示背景色*/ + --ti-base-color-brand-9: #5C6173; + /* 一级tab页签背景-悬浮色/页签禁用文字色*/ + /* 1.2中立色*/ + /* 公用灰色系,用于文本、图标、线条色*/ + --ti-base-color-common: #252B3A; + /* 正文主色,重要信息、标题颜色、输入类文本颜色*/ + --ti-base-color-common-1: #575D6C; + /* 次要信息/图标默认*/ + --ti-base-color-common-2: #8A8E99; + /* 弱化信息、说明文字*/ + --ti-base-color-common-3: #ADB0B8; + /* 边框色(如下拉、输入框)/文字禁用/导航栏文字图标/禁用图标*/ + --ti-base-color-common-4: #DFE1E6; + /* 分割线/禁用描边/tab字体/开关组件“关”禁用背景色*/ + /* 背景色*/ + --ti-base-color-bg: #EEF0F5; + /* 通用背景-页面背景色/下拉搜索框背景色/标签背景色/multiselect输入框中背景*/ + --ti-base-color-bg-1: #F5F5F6; + /* 禁用背景/小表格中禁用背景/支付列表中禁用背景*/ + --ti-base-color-bg-2: #FAFAFA; + /* 新区域组件-悬浮背景色*/ + --ti-base-color-bg-3: #C7000B; + /* 主要按钮-背景色*/ + --ti-base-color-bg-4: #D64A52; + /* 主要按钮-hover/Focus背景色*/ + --ti-base-color-bg-5: #B12220; + /* 主要按钮-active背景色*/ + --ti-base-color-bg-6: #FFFFFF; + /* 次要按钮-背景色*/ + --ti-base-color-bg-7: #FFFFFF; + /* 次要按钮-hover/Focus背景色*/ + --ti-base-color-bg-8: #FFFFFF; + /* 次要按钮-active背景色*/ + --ti-base-color-bg-9: #282B33; + /* 顶部导航背景色/顶部导航下拉悬浮背景色*/ + --ti-base-color-bg-10: #181818; + /* 顶部导航下拉背景色*/ + /* 1.3功能色*/ + --ti-base-color-error: #F66F6A; + /* 错误-图标色/校验边框色/图表数据色-8*/ + --ti-base-color-error-text: #DE504E; + /* 错误-文本色/交易金额*/ + --ti-base-color-error-bg: #FFEEED; + /* 错误-背景色/校验背景色*/ + --ti-base-color-error-border: #FFBCBA; + /* 错误-边框色*/ + --ti-base-color-error-icon-from: #FF41A1; + /* 渐变图标-错误-起始色*/ + --ti-base-color-error-icon-to: #FF8A5B; + /* 渐变图标-错误-终止色*/ + --ti-base-color-success: #50D4AB; + /* 成功-图标色/图表数据色-1*/ + --ti-base-color-success-text: #3AC295; + /* 成功-文本色*/ + --ti-base-color-success-bg: #EDFFF9; + /* 成功-背景色*/ + --ti-base-color-success-border: #ACF2DC; + /* 成功-边框色*/ + --ti-base-color-warn: #FA9841; + /* 告警-图标色、深色背景-运营活动文本色/图表数据色-7*/ + --ti-base-color-warn-text: #E37D29; + /* 告警-文本色*/ + --ti-base-color-warn-bg: #FFF3E8; + /* 告警-背景色*/ + --ti-base-color-warn-border: #FFD0A6; + /* 告警-边框色*/ + --ti-base-color-warn-icon-from: #FF5541; + /* 渐变图标-告警-起始色*/ + --ti-base-color-warn-icon-to: #FFD347; + /* 渐变图标-告警--终止色*/ + --ti-base-color-warn-1: #FAC20A; + /* 次要告警/状态图标-异常/图表数据色-6/评分组件rate-图标色*/ + --ti-base-color-prompt: var(--ti-base-color-brand); + /* 提示-图标色*/ + --ti-base-color-prompt-text: var(--ti-base-color-brand-2); + /* 提示-文本色*/ + --ti-base-color-prompt-bg: #EBF6FF; + /* 提示-背景色*/ + --ti-base-color-prompt-border: var(--ti-base-color-brand-5); + /* 提示-边框色*/ + --ti-base-color-prompt-icon-from: #7769E8; + /* 渐变图标-提示-起始色*/ + --ti-base-color-prompt-icon-to: #58BBFF; + /* 渐变图标-提示-终止色*/ + /* 状态图标色*/ + --ti-base-color-icon-info: #6CBFFF; + /* 状态图标-常规、信息提示/图表数据色-2*/ + /* 图表色*/ + --ti-base-color-data-3: #A6DD82; + /* 图表数据色-3*/ + --ti-base-color-data-4: #F3689A; + /* 图表数据色-4*/ + --ti-base-color-data-5: #A97AF8; + /* 图表数据色-5*/ + /* 2.公共色:此处颜色为组件场景色,根据使用场景分为以下几大类,具体组件引用以下颜色,如在使用过程中有问题,请自行按类别添加*/ + /* 2.1提示类型颜色,用于alert组件、涉及功能提示的背景、文字、图标等的颜色使用*/ + --ti-common-color-success: var(--ti-base-color-success); + /* 成功-图标色/状态图标-成功*/ + --ti-common-color-text-success: var(--ti-base-color-success-text); + /* 成功-文字色*/ + --ti-common-color-success-bg: var(--ti-base-color-success-bg); + /* 成功-背景色*/ + --ti-common-color-success-border: var(--ti-base-color-success-border); + /* 成功-边框色*/ + --ti-common-color-error: var(--ti-base-color-error); + /* 错误-图标色/状态图标-危险、错误、失败/深色Tip中的价格文本*/ + --ti-common-color-error-text: var(--ti-base-color-error-text); + /* 错误-文字色*/ + --ti-common-color-error-bg: var(--ti-base-color-error-bg); + /* 错误-背景色/校验背景色*/ + --ti-common-color-error-border: var(--ti-base-color-error); + /* 错误-校验边框色*/ + --ti-common-color-error-border-secondary: var(--ti-base-color-error-border); + /* 错误-alert边框色*/ + --ti-common-color-error-icon-from: var(--ti-base-color-error-icon-from); + /* 渐变图标-错误-起始色*/ + --ti-common-color-error-icon-to: var(--ti-base-color-error-icon-to); + /* 渐变图标-错误-终止色*/ + --ti-common-color-warn: var(--ti-base-color-warn); + /* 告警-图标色/状态图标-警告*/ + --ti-common-color-warn-text: var(--ti-base-color-warn-text); + /* 告警-文字色*/ + --ti-common-color-warn-bg: var(--ti-base-color-warn-bg); + /* 告警-背景色*/ + --ti-common-color-warn-border: var(--ti-base-color-warn-border); + /* 告警-边框色*/ + --ti-common-color-warn-icon-from: var(--ti-base-color-warn-icon-from); + /* 渐变图标-告警-起始色*/ + --ti-common-color-warn-icon-to: var(--ti-base-color-warn-icon-to); + /* 渐变图标-告警--终止色*/ + --ti-common-color-warn-secondary: var(--ti-base-color-warn-1); + /* 次要告警-图标色/状态图标-异常*/ + --ti-common-color-prompt: var(--ti-base-color-prompt); + /* 提示-图标色*/ + --ti-common-color-prompt-text: var(--ti-base-color-prompt-text); + /* 提示-图标色*/ + --ti-common-color-prompt-bg: var(--ti-base-color-prompt-bg); + /* 提示-背景色*/ + --ti-common-color-prompt-border: var(--ti-base-color-prompt-border); + /* 提示-边框色*/ + --ti-common-color-prompt-icon-from: var(--ti-base-color-prompt-icon-from); + /* 渐变图标-提示-起始色*/ + --ti-common-color-prompt-icon-to: var(--ti-base-color-prompt-icon-to); + /* 渐变图标-提示-终止色*/ + /* 2.2文本色*/ + --ti-common-color-text-primary: var(--ti-base-color-common); + /* 一级文本色-重要信息/标题颜色/输入类文本颜色*/ + --ti-common-color-text-secondary: var(--ti-base-color-common-1); + /* 二级文本色-次要信息*/ + --ti-common-color-text-weaken: var(--ti-base-color-common-2); + /* 三级文本色-弱化信息/说明文字*/ + --ti-common-color-text-disabled: var(--ti-base-color-common-3); + /* 文本灰化信息*/ + --ti-common-color-text-darkbg: var(--ti-base-color-common-3); + /* 深色背景下文本信息*/ + --ti-common-color-text-link: var(--ti-base-color-brand-2); + /* 链接色*/ + --ti-common-color-text-link-hover: var(--ti-base-color-brand-1); + /* 链接悬浮色*/ + --ti-common-color-text-link-darkbg: var(--ti-base-color-brand-4); + /* 深色背景链接色*/ + --ti-common-color-text-link-darkbg-hover: var(--ti-base-color-brand-5); + /* 深色背景链接悬浮色*/ + --ti-common-color-text-highlight: var(--ti-base-color-brand-2); + /* 文本高亮色*/ + --ti-common-color-text-white: var(--ti-base-color-white); + /* 深色背景或图标上文字色*/ + --ti-common-color-text-gray: var(--ti-base-color-white); + /* 深色背景下的文本色,用于tip*/ + --ti-common-color-text-gray-disabled: var(--ti-base-color-brand-9); + /* 深色背景下的灰色文本禁用色,用于tab页签中*/ + --ti-common-color-text-important: var(--ti-base-color-error-text); + /* 文本_金额*/ + /* 2.3图标色*/ + /* 浅底背景图标色*/ + --ti-common-color-icon-normal: var(--ti-base-color-common-1); + --ti-common-color-icon-hover: var(--ti-base-color-brand); + --ti-common-color-icon-active: var(--ti-base-color-brand); + --ti-common-color-icon-disabled: var(--ti-base-color-common-3); + /* 图标禁用色/状态图标-禁用、停止*/ + --ti-common-color-icon-white: var(--ti-base-color-white); + /* 灰色背景下图标色*/ + --ti-common-color-icon-graybg-normal: var(--ti-base-color-common-3); + --ti-common-color-icon-graybg-hover: var(--ti-base-color-brand); + --ti-common-color-icon-graybg-active: var(--ti-base-color-brand); + --ti-common-color-icon-graybg-disabled: var(--ti-base-color-common-4); + /* 深底背景图标色*/ + --ti-common-color-icon-darkbg-normal: var(--ti-base-color-common-3); + --ti-common-color-icon-darkbg-hover: var(--ti-base-color-brand-3); + --ti-common-color-icon-darkbg-active: var(--ti-base-color-brand-3); + --ti-common-color-icon-darkbg-disabled: var(--ti-base-color-common-1); + /* 状态图标背景色*/ + --ti-common-color-icon-info: var(--ti-base-color-icon-info); + /* 状态图标-常规、信息提示*/ + /* 2.4线颜色,用于边框,线条等的颜色使用*/ + --ti-common-color-line-normal: var(--ti-base-color-common-3); + --ti-common-color-line-hover: var(--ti-base-color-common-1); + --ti-common-color-line-active: var(--ti-base-color-brand); + --ti-common-color-line-disabled: var(--ti-base-color-common-4); + /* 分割线颜色*/ + --ti-common-color-line-dividing: var(--ti-base-color-common-4); + /* 虚线*/ + --ti-common-color-dash-line-normal: var(--ti-base-color-common-1); + --ti-common-color-dash-line-hover: var(--ti-base-color-brand-2); + /* 2.5背景色*/ + /* 背景基础色各状态色*/ + --ti-common-color-bg-normal: var(--ti-base-color-bg); + /* 通用背景-页面背景色/下拉搜索框背景色/标签背景色*/ + --ti-common-color-bg-emphasize: var(--ti-base-color-brand); + /* 背景高亮色*/ + --ti-common-color-bg-disabled: var(--ti-base-color-bg-1); + /* 禁用背景色*/ + --ti-common-color-bg-hover: var(--ti-base-color-brand-1); + /* 主色背景悬浮色*/ + --ti-common-color-bg-gray: var(--ti-base-color-bg-2); + /* 新区域组件-悬浮背景色*/ + --ti-common-color-bg-secondary: var(--ti-base-color-common-3); + /* 开关组件-关闭状态-背景色*/ + /* 重要背景色,主要用于重要按钮场景*/ + --ti-common-bg-primary: var(--ti-base-color-bg-3); + /* 重要按钮背景色*/ + --ti-common-bg-primary-hover: var(--ti-base-color-bg-4); + /* 重要按钮背景悬浮、focus色*/ + --ti-common-bg-primary-active: var(--ti-base-color-bg-5); + /* 重要按钮背景色按下色*/ + /* 次要背景色,主要用于次要按钮场景*/ + --ti-common-bg-minor: var(--ti-base-color-bg-6); + /* 次要按钮背景色*/ + --ti-common-bg-minor-hover: var(--ti-base-color-bg-7); + /* 次要按钮背景悬浮、focus色*/ + --ti-common-bg-minor-active: var(--ti-base-color-bg-8); + /* 次要按钮背景色按下色*/ + /* 白底背景状态色*/ + --ti-common-color-bg-white-normal: var(--ti-base-color-white); + /* 白色背景,用于输入框背景*/ + --ti-common-color-bg-white-emphasize: var(--ti-base-color-brand-7); + /* 白色hover或强调色,如表头背景、表格悬浮、下拉选项悬浮背景*/ + /* 浅底背景状态色*/ + --ti-common-color-bg-light-normal: var(--ti-base-color-brand-6); + /* 滑块slider-背景色/多选快buttongroup-默认背景色/树组件选中背景色*/ + --ti-common-color-bg-light-emphasize: var(--ti-base-color-brand-5); + /* 浅背景hover或强调色,开关组件“开”禁用背景色*/ + /* 深色底背景状态色*/ + --ti-common-color-bg-dark-normal: var(--ti-base-color-brand-8); + /* 一级tab页签背景色*/ + --ti-common-color-bg-dark-emphasize: var(--ti-base-color-brand-9); + /* 一级tab页签背景-悬浮色*/ + --ti-common-color-bg-dark-active: var(--ti-common-color-bg-normal); + /* 一级tab页签背景-激活/focus状态背景色*/ + --ti-common-color-bg-dark-deep: var(--ti-base-color-brand-8); + /* tip、alert提示背景色*/ + --ti-common-color-bg-dark-disabled: var(--ti-base-color-common-4); + /* 深色背景禁用色,开关组件“关”禁用背景色*/ + /* 顶部导航*/ + --ti-common-color-bg-navigation: var(--ti-base-color-bg-9); + /* 顶部导航背景色/顶部导航下拉悬浮背景色*/ + --ti-common-color-bg-dark-select: var(--ti-base-color-bg-10); + /* 顶部导航下拉背景色 */ + /* 2.6 图表色*/ + --ti-common-color-data-1: var(--ti-base-color-success); + /* 图表数据色-1*/ + --ti-common-color-data-2: var(--ti-base-color-icon-info); + /* 图表数据色-2*/ + --ti-common-color-data-3: var(--ti-base-color-data-3); + /* 图表数据色-3*/ + --ti-common-color-data-4: var(--ti-base-color-data-4); + /* 图表数据色-4*/ + --ti-common-color-data-5: var(--ti-base-color-data-5); + /* 图表数据色-5*/ + --ti-common-color-data-6: var(--ti-base-color-warn-1); + /* 图表数据色-6*/ + --ti-common-color-data-7: var(--ti-base-color-warn); + /* 图表数据色-7*/ + --ti-common-color-data-8: var(--ti-base-color-error); + /* 图表数据色-8*/ + /* 二.其他变量*/ + /* 边框圆角*/ + --ti-common-border-radius-normal: 2px; + --ti-common-border-radius-1: 4px; + /* tip提示边框圆角*/ + /* 字号*/ + --ti-common-font-size-base: 12px; + /* 默认字号*/ + --ti-common-font-size-1: 14px; + /* 卡片标题*/ + --ti-common-font-size-2: 16px; + /* 页面标题*/ + --ti-common-font-size-3: 18px; + /* 弹窗标题、数字*/ + --ti-common-font-size-4: 20px; + /* 数字、面额*/ + --ti-common-font-size-5: 24px; + /* 数字、面额*/ + --ti-common-font-size-6: 32px; + /* 数字、面额*/ + --ti-common-font-size-7: 36px; + /* 数字、面额*/ + /* 行高*/ + --ti-common-line-height-number: 1.5; + /* 文字行高倍数,建议组件中设置行高使用该变量,如有特殊情况,请自行定义*/ + /* 间距:适用于组件中的margin、padding*/ + --ti-common-space-base: 4px; + /* 基础间距,组件中使用的主流间距都是该间距的整数倍*/ + --ti-common-space-2x: calc(var(--ti-common-space-base) * 2); + --ti-common-space-3x: calc(var(--ti-common-space-base) * 3); + --ti-common-space-4x: calc(var(--ti-common-space-base) * 4); + --ti-common-space-5x: calc(var(--ti-common-space-base) * 5); + --ti-common-space-6x: calc(var(--ti-common-space-base) * 6); + --ti-common-space-8x: calc(var(--ti-common-space-base) * 8); + --ti-common-space-10x: calc(var(--ti-common-space-base) * 10); + /* 其他间距:间距不是@space_base的整数倍*/ + --ti-common-space-6: 6px; + --ti-common-space-10: 10px; + /* 阴影*/ + --ti-common-shadow-1-up: 0 -1px 4px 0 rgba(0, 0, 0, 0.1); + /* 购买浮层*/ + --ti-common-shadow-1-down: 0 1px 4px 0 rgba(0, 0, 0, 0.1); + /* 页面卡片,滑块*/ + --ti-common-shadow-1-left: -1px 0px 4px 0 rgba(0, 0, 0, 0.1); + --ti-common-shadow-1-right: 1px 0px 4px 0 rgba(0, 0, 0, 0.1); + /* 手风琴(leftmenu)*/ + --ti-common-shadow-2-up: 0 -2px 8px 0 rgba(0, 0, 0, 0.2); + --ti-common-shadow-2-down: 0 2px 8px 0 rgba(0, 0, 0, 0.2); + /* 下拉菜单、使用指南*/ + --ti-common-shadow-2-left: -2px 0 8px 0 rgba(238, 10, 10, 0.2); + --ti-common-shadow-2-right: 2px 0 8px 0 rgba(252, 5, 5, 0.2); + --ti-common-shadow-3-up: 0 -4px 16px 0 rgba(0, 0, 0, 0.2); + --ti-common-shadow-3-down: 0 4px 16px 0 rgba(0, 0, 0, 0.2); + /* 卡片hover、tips提示*/ + --ti-common-shadow-3-left: -4px 0 16px 0 rgba(0, 0, 0, 0.2); + --ti-common-shadow-3-right: 4px 0 16px 0 rgba(0, 0, 0, 0.2); + --ti-common-shadow-4-up: 0 -8px 40px 0 rgba(0, 0, 0, 0.2); + --ti-common-shadow-4-down: 0 8px 40px 0 rgba(0, 0, 0, 0.2); + /* 弹窗、气泡确认框*/ + --ti-common-shadow-4-left: -8px 0 40px 0 rgba(0, 0, 0, 0.2); + /* 右侧抽屉*/ + --ti-common-shadow-4-right: 8px 0 40px 0 rgba(0, 0, 0, 0.2); + /* 提示类阴影*/ + --ti-common-shadow-error: 0 1px 3px 0 rgba(199, 54, 54, 0.25); + /* 错误*/ + --ti-common-shadow-warn: 0 1px 3px 0 rgba(204, 100, 20, 0.25); + /* 告警*/ + --ti-common-shadow-prompt: 0 1px 3px 0 rgba(70, 94, 184, 0.25); + /* 提示类*/ + --ti-common-shadow-success: 0 1px 3px 0 rgba(39, 176, 128, 0.25); + /* 成功*/ + /* 字体*/ + --ti-common-font-family: "HuaweiFont", "Helvetica", "Arial", "PingFangSC-Regular", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", "Microsoft JhengHei"; + } \ No newline at end of file diff --git a/packages/theme/src/breadcrumb-item/index.js b/packages/theme/src/breadcrumb-item/index.js new file mode 100644 index 000000000..5e06a5b8e --- /dev/null +++ b/packages/theme/src/breadcrumb-item/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // breadcrumb-item +} diff --git a/packages/theme/src/breadcrumb-item/index.less b/packages/theme/src/breadcrumb-item/index.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/breadcrumb-item/index.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/breadcrumb-item/vars.less b/packages/theme/src/breadcrumb-item/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/breadcrumb-item/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/breadcrumb/index.js b/packages/theme/src/breadcrumb/index.js new file mode 100644 index 000000000..88bf3f32d --- /dev/null +++ b/packages/theme/src/breadcrumb/index.js @@ -0,0 +1,24 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-breadcrumb-font-size': '12px', + 'tiny-breadcrumb-text-line-height': '1em', + 'tiny-breadcrumb-text-color': '#333', + 'tiny-breadcrumb-separator-text-color': '#999', + 'tiny-breadcrumb-hover-text-color': '#1890ff', + 'tiny-breadcrumb-text-font-weight': '700', + 'tiny-breadcrumb-separator-padding-vertical': '0', + 'tiny-breadcrumb-separator-padding-horizontal': '4px', + 'tiny-breadcrumb-separator-margin-vertical': '0', + 'tiny-breadcrumb-separator-margin-horizontal': '4px' +} diff --git a/packages/theme/src/breadcrumb/index.less b/packages/theme/src/breadcrumb/index.less new file mode 100644 index 000000000..1d7505dcc --- /dev/null +++ b/packages/theme/src/breadcrumb/index.less @@ -0,0 +1,79 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +@breadcrumb-prefix-cls: ~'@{css-prefix}breadcrumb'; + +.@{breadcrumb-prefix-cls} { + .component-css-vars-breadcrumb(); + + font-size: var(--ti-breadcrumb-font-size); + line-height: var(--ti-breadcrumb-text-line-height); + .clearfix(); + + & &__item { + cursor: pointer; + display: inline-flex; + align-items: center; + + &:last-child { + .@{breadcrumb-prefix-cls}__inner { + font-weight: var(--ti-breadcrumb-text-font-weight); + + a { + cursor: text; + } + } + + .@{breadcrumb-prefix-cls}__separator, + .@{breadcrumb-prefix-cls}__separator-cls { + display: none; + } + } + } + + & &__inner { + vertical-align: middle; + + &, + & a { + color: var(--ti-breadcrumb-text-color); + } + + &:hover { + color: var(--ti-breadcrumb-hover-text-color); + } + } + + & &__separator { + font-family: '\5B8B\4F53', sans-serif; + color: var(--ti-breadcrumb-separator-text-color); + padding: var(--ti-breadcrumb-separator-padding-vertical) var(--ti-breadcrumb-separator-padding-horizontal); + vertical-align: middle; + } + + & &__separator-cls { + font-size: var(--ti-breadcrumb-font-size); + fill: var(--ti-breadcrumb-separator-text-color); + margin: var(--ti-breadcrumb-separator-margin-vertical) var(--ti-breadcrumb-separator-margin-horizontal); + vertical-align: middle; + } + + & &__inner a:hover, + & &__item:last-child:hover { + color: var(--ti-breadcrumb-hover-text-color); + text-decoration: none; + } +} diff --git a/packages/theme/src/breadcrumb/vars.less b/packages/theme/src/breadcrumb/vars.less new file mode 100644 index 000000000..2f183ebbb --- /dev/null +++ b/packages/theme/src/breadcrumb/vars.less @@ -0,0 +1,24 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-breadcrumb() { + --ti-breadcrumb-font-size: var(--ti-common-font-size-base); + --ti-breadcrumb-text-line-height: 1em; + --ti-breadcrumb-text-color: var(--ti-base-color-info-normal); + --ti-breadcrumb-separator-text-color: var(--ti-base-color-placeholder); + --ti-breadcrumb-separator-padding-vertical: 0; + --ti-breadcrumb-separator-padding-horizontal: 4px; + --ti-breadcrumb-separator-margin-vertical: 0; + --ti-breadcrumb-separator-margin-horizontal: 4px; + --ti-breadcrumb-hover-text-color: var(--ti-base-color-brand-6); + --ti-breadcrumb-text-font-weight: var(--ti-common-font-weight-7); +} diff --git a/packages/theme/src/bulletin-board/index.js b/packages/theme/src/bulletin-board/index.js new file mode 100644 index 000000000..4885c5dae --- /dev/null +++ b/packages/theme/src/bulletin-board/index.js @@ -0,0 +1,31 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-bulletin-board-title-font-size': '18px', + 'tiny-bulletin-board-title-font-weight': 'bold', + 'tiny-bulletin-board-title-text-color': '#333', + 'tiny-bulletin-board-item-title-text-color': '#000', + 'tiny-bulletin-board-item-date-text-color': '#999', + 'tiny-bulletin-board-item-date-font-size': '12px', + 'tiny-bulletin-board-new-bg-color': '#f00', + 'tiny-bulletin-board-new-text-color': '#fff', + 'tiny-bulletin-board-new-border-radius': '2px', + 'tiny-bulletin-board-more-text-color': '#1890ff', + 'tiny-bulletin-board-more-hover-text-color': '#40a9ff', + 'tiny-bulletin-board-more-font-size': '12px', + 'tiny-bulletin-board-more-icon-font-size': '14px', + 'tiny-bulletin-board-tabs-item-text-color': '#333', + 'tiny-bulletin-board-tabs-item-hover-text-color': '#1890ff', + 'tiny-bulletin-board-tabs-item-disabled-text-color': '#999', + 'tiny-bulletin-board-tabs-header-border-color': '#d9d9d9' +} diff --git a/packages/theme/src/bulletin-board/index.less b/packages/theme/src/bulletin-board/index.less new file mode 100644 index 000000000..8ad77d495 --- /dev/null +++ b/packages/theme/src/bulletin-board/index.less @@ -0,0 +1,252 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@bulletin-board-prefix-cls: ~'@{css-prefix}bulletin-board'; +@tabs-prefix-cls: ~'@{css-prefix}tabs'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{bulletin-board-prefix-cls} { + .component-css-vars-bulletin-board(); + + &__item { + margin-bottom: 12px; + + .@{bulletin-board-prefix-cls}__textTitle { + display: block; + color: var(--ti-bulletin-board-item-title-text-color); + margin-bottom: 2px; + font-size: var(--ti-common-font-size-base); + white-space: normal; + font-family: Helvetica, Arial, 'microsoft yahei'; + line-height: initial; + + &, + &:hover { + text-decoration: none; + } + } + + .@{bulletin-board-prefix-cls}__textDate { + color: var(--ti-bulletin-board-item-date-text-color); + font-size: var(--ti-bulletin-board-item-date-font-size); + } + } + + &__title { + font-size: var(--ti-bulletin-board-title-font-size); + padding: 12px 0px 8px 24px; + color: var(--ti-bulletin-board-title-text-color); + font-weight: var(--ti-bulletin-board-title-font-weight); + } + + &__more { + text-align: right; + + & &-link { + color: var(--ti-bulletin-board-more-text-color); + font-size: var(--ti-bulletin-board-more-font-size); + line-height: normal; + display: inline-flex; + justify-content: center; + align-items: center; + + .@{svg-prefix-cls} { + fill: var(--ti-bulletin-board-more-text-color); + font-size: var(--ti-bulletin-board-more-icon-font-size); + margin-left: 4px; + } + + &:hover { + text-decoration: none; + + .@{svg-prefix-cls} { + fill: var(--ti-bulletin-board-more-hover-text-color); + } + } + } + } + + &__new { + background-color: var(--ti-bulletin-board-new-bg-color); + color: var(--ti-bulletin-board-new-text-color); + border-radius: var(--ti-bulletin-board-new-border-radius); + min-width: 30px; + min-height: 16px; + line-height: 16px; + font-size: var(--ti-common-font-size-base); + display: inline-block; + font-family: '宋体', cursive, Helvetica, Arial, 'microsoft yahei'; + box-sizing: border-box; + text-align: center; + } + + .@{css-prefix}tabs { + .@{tabs-prefix-cls}--left, + .@{tabs-prefix-cls}--right, + .@{tabs-prefix-cls}__content, + .@{tabs-prefix-cls}__nav-scroll, + .@{tabs-prefix-cls}__nav-wrap { + overflow: hidden; + } + + .@{tabs-prefix-cls}__header { + .@{tabs-prefix-cls}__nav-wrap { + margin-bottom: -1px; + position: relative; + + &:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + width: 100%; + height: 1px; + background-color: var(--ti-tabs-border-color); + z-index: 1; + } + + &.is-scrollable { + padding: 0 20px; + box-sizing: border-box; + } + } + + .@{tabs-prefix-cls}__nav { + top: 1px; + } + } + + .@{tabs-prefix-cls}__nav { + white-space: nowrap; + position: relative; + transition: transform 0.3s; + float: left; + z-index: 2; + } + + .@{tabs-prefix-cls}__item { + line-height: 36px; + height: 36px; + padding: 0 24px; + box-sizing: border-box; + display: inline-block; + list-style: none; + font-size: var(--ti-common-font-size-1); + font-weight: 500; + color: var(--ti-bulletin-board-tabs-item-text-color); + position: relative; + + &:focus, + &:active { + outline: 0; + } + + &:hover { + color: var(--ti-bulletin-board-tabs-item-hover-text-color); + cursor: pointer; + } + + &.is-active { + color: var(--ti-bulletin-board-tabs-item-hover-text-color); + } + + &.is-disabled { + color: var(--ti-bulletin-board-tabs-item-disabled-text-color); + cursor: default; + } + + &.is-closable { + // 修复自定义标签配置:with-close="true"样式错乱问题 + > div { + display: inline-block; + } + + .icon-close { + display: initial; + } + } + + .icon-close { + border-radius: 50%; + text-align: center; + transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); + margin-left: 5px; + + &:before { + transform: scale(0.9); + display: inline-block; + } + + &:hover { + background-color: #b4bccc; + color: #fff; + } + } + + &::before { + bottom: 0px; + top: auto !important; + left: auto !important; + } + } + + .@{tabs-prefix-cls}__content { + padding: 12px 24px 24px; + } + + &.@{tabs-prefix-cls}--card { + .@{tabs-prefix-cls}__header { + .@{tabs-prefix-cls}__nav { + border: none; + } + + .@{tabs-prefix-cls}__item { + border-left: none; + } + } + + > .@{tabs-prefix-cls}__header { + border-bottom: 1px solid var(--ti-bulletin-board-tabs-header-border-color); + + .@{tabs-prefix-cls}__item { + border-bottom: 1px solid transparent; + transition: color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); + + &:first-child { + border-left: none; + } + + &.is-active { + border-bottom-color: #fff; + + &.is-closable { + padding-left: 24px; + padding-right: 24px; + } + + &:before { + position: absolute; + content: ''; + width: 100%; + height: 3px; + background: var(--ti-bulletin-board-tabs-item-hover-text-color); + margin-left: -24px; + } + } + } + } + } + } +} diff --git a/packages/theme/src/bulletin-board/vars.less b/packages/theme/src/bulletin-board/vars.less new file mode 100644 index 000000000..437e0ba00 --- /dev/null +++ b/packages/theme/src/bulletin-board/vars.less @@ -0,0 +1,31 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-bulletin-board() { + --ti-bulletin-board-title-font-size: var(--ti-common-font-size-3); + --ti-bulletin-board-title-font-weight: var(--ti-common-font-weight-7); + --ti-bulletin-board-title-text-color: var(--ti-base-color-info-normal); + --ti-bulletin-board-item-title-text-color: var(--ti-base-color-dark); + --ti-bulletin-board-item-date-text-color: var(--ti-base-color-placeholder); + --ti-bulletin-board-item-date-font-size: var(--ti-common-font-size-base); + --ti-bulletin-board-new-bg-color: var(--ti-base-color-error-3); + --ti-bulletin-board-new-text-color: var(--ti-base-color-light); + --ti-bulletin-board-new-border-radius: var(--ti-common-border-radius-normal); + --ti-bulletin-board-more-text-color: var(--ti-base-color-brand-6); + --ti-bulletin-board-more-hover-text-color: var(--ti-base-color-brand-5); + --ti-bulletin-board-more-font-size: var(--ti-common-font-size-base); + --ti-bulletin-board-more-icon-font-size: var(--ti-common-font-size-1); + --ti-bulletin-board-tabs-item-text-color: var(--ti-base-color-info-normal); + --ti-bulletin-board-tabs-item-hover-text-color: var(--ti-base-color-brand-6); + --ti-bulletin-board-tabs-item-disabled-text-color: var(--ti-base-color-placeholder); + --ti-bulletin-board-tabs-header-border-color: var(--ti-base-color-border); +} diff --git a/packages/theme/src/button-group/index.js b/packages/theme/src/button-group/index.js new file mode 100644 index 000000000..e4db96cc0 --- /dev/null +++ b/packages/theme/src/button-group/index.js @@ -0,0 +1,34 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-button-group-border-color': '#d9d9d9', + 'tiny-button-group-border-radius': '2px', + 'tiny-button-group-hover-border-color': '#1890ff', + 'tiny-button-group-info-border-color': 'rgba(255, 255, 255, 0.5)', + 'tiny-button-group-disabled-text-color': '#bfbfbf', + 'tiny-button-group-item-bg-color': '#fff', + 'tiny-button-group-item-btn-text-color': '#333', + 'tiny-button-group-item-btn-width': '110px', + 'tiny-button-group-item-btn-height': '30px', + 'tiny-button-group-item-btn-font-size': '12px', + 'tiny-button-group-item-btn-disabled-bg-color': '#f5f5f5', + 'tiny-button-group-item-btn-disabled-border-color': '#d9d9d9', + 'tiny-button-group-item-btn-disabled-text-color': '#999', + 'tiny-button-group-item-btn-hover-bg-color': '#40a9ff', + 'tiny-button-group-item-btn-hover-text-color': '#fff', + 'tiny-button-group-item-btn-plain-text-color': '#1890ff', + 'tiny-button-group-item-btn-plain-bg-color': 'rgba(24, 144, 255, 0.06)', + 'tiny-button-group-item-btn-plain-border-color': '#1890ff', + 'tiny-button-group-item-active-bg-color': '#1890ff', + 'tiny-button-group-item-active-text-color': '#fff' +} diff --git a/packages/theme/src/button-group/index.less b/packages/theme/src/button-group/index.less new file mode 100644 index 000000000..2fe86a802 --- /dev/null +++ b/packages/theme/src/button-group/index.less @@ -0,0 +1,217 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../mixins/button-group.less'; +@import '../custom.less'; +@import './vars.less'; + +@button-group-prefix-cls: ~'@{css-prefix}button-group'; +@group-item-prefix-cls: ~'@{css-prefix}group-item'; +@button-prefix-cls: ~'@{css-prefix}button'; +@dropdown-prefix-cls: ~'@{css-prefix}dropdown'; + +.@{button-group-prefix-cls} { + .component-css-vars-button-group(); + + display: inline-block; + vertical-align: middle; + .clearfix(); + + .@{group-item-prefix-cls} { + display: inline-block; + vertical-align: middle; + + & li { + line-height: 28px; + background: var(--ti-button-group-item-bg-color); + float: left; + position: relative; + + button { + border: 1px solid var(--ti-button-group-border-color); + display: block; + text-align: center; + color: var(--ti-button-group-item-btn-text-color); + background: var(--ti-button-group-item-bg-color); + min-width: var(--ti-button-group-item-btn-width); + height: var(--ti-button-group-item-btn-height); + padding: 0 8px; + text-decoration: none; + font-size: var(--ti-button-group-item-btn-font-size); + outline: none; + cursor: pointer; + transition: all 0.3s; + + &.disabled, + &[disabled] { + background: var(--ti-button-group-item-btn-disabled-bg-color); + border-color: var(--ti-button-group-item-btn-disabled-border-color); + cursor: not-allowed; + color: var(--ti-button-group-item-btn-disabled-text-color); + } + + &.plain, + &[plain] { + background: none; + } + } + + &:hover { + z-index: 1; + + button:not(.disabled) { + background: var(--ti-button-group-item-btn-hover-bg-color); + color: var(--ti-button-group-item-btn-hover-text-color); + border-color: var(--ti-button-group-item-btn-hover-bg-color); + outline: none; + + &.plain, + &[plain] { + color: var(--ti-button-group-item-btn-plain-text-color); + background-color: var(--ti-button-group-item-btn-plain-bg-color); + border-color: var(--ti-button-group-item-btn-plain-border-color); + } + } + } + + &.active { + z-index: 1; + + &:hover { + button:not(.disabled) { + background: var(--ti-button-group-item-btn-hover-bg-color); + border-color: var(--ti-button-group-item-btn-hover-bg-color); + + &.plain, + &[plain] { + background-color: var(--ti-button-group-item-btn-plain-bg-color); + } + } + } + + button:not(.disabled) { + background: var(--ti-button-group-item-active-bg-color); + color: var(--ti-button-group-item-active-text-color); + border-color: var(--ti-button-group-item-active-bg-color); + outline: none; + + &.plain, + &[plain] { + color: var(--ti-button-group-item-active-bg-color); + background: none; + } + } + } + + &:first-child { + button { + border-radius: var(--ti-button-group-border-radius) 0 0 var(--ti-button-group-border-radius); + } + } + + &:last-child { + button { + border-radius: 0 var(--ti-button-group-border-radius) var(--ti-button-group-border-radius) 0; + } + } + + &:not(:last-child) { + margin-right: -1px; + } + } + } + + & > .@{button-prefix-cls} { + float: left; + position: relative; + + & + .@{button-prefix-cls} { + margin-left: 0; + } + + &:first-child { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + border-right-color: var(--ti-button-group-info-border-color); + + &.@{button-prefix-cls}--default { + border-right-color: var(--ti-button-group-border-color); + + &:hover, + &:active, + &:focus { + border-right-color: var(--ti-button-group-hover-border-color); + z-index: 1; + } + } + } + + &:last-child { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + border-left-color: var(--ti-button-group-info-border-color); + + &.@{button-prefix-cls}--default { + border-left-color: var(--ti-button-group-border-color); + + &:hover, + &:active, + &:focus { + border-left-color: var(--ti-button-group-hover-border-color); + z-index: 1; + } + } + } + + &:first-child:last-child { + border-radius: var(--ti-button-group-border-radius); + + &.is-round { + border-radius: calc(var(--ti-button-size-normal-height, 30px) / 2); + } + + &.is-circle { + border-radius: 50%; + } + } + + &:not(:first-child):not(:last-child) { + border-radius: 0; + border-left-color: var(--ti-button-group-info-border-color); + border-right-color: var(--ti-button-group-info-border-color); + + &.@{button-prefix-cls}--default { + border-left-color: var(--ti-button-group-border-color); + border-right-color: var(--ti-button-group-border-color); + + &:hover, + &:active, + &:focus { + border-left-color: var(--ti-button-group-hover-border-color); + border-right-color: var(--ti-button-group-hover-border-color); + z-index: 1; + } + } + } + + &:not(:last-child) { + margin-right: -1px; + } + + & > .@{dropdown-prefix-cls} > .@{button-prefix-cls} { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + border-left-color: var(--ti-button-group-info-border-color); + } + } +} diff --git a/packages/theme/src/button-group/vars.less b/packages/theme/src/button-group/vars.less new file mode 100644 index 000000000..46f27c50b --- /dev/null +++ b/packages/theme/src/button-group/vars.less @@ -0,0 +1,34 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-button-group() { + --ti-button-group-border-color: var(--ti-base-color-border); + --ti-button-group-border-radius: var(--ti-common-border-radius-normal); + --ti-button-group-hover-border-color: var(--ti-base-color-brand-6); + --ti-button-group-info-border-color: rgba(255, 255, 255, 0.5); + --ti-button-group-disabled-text-color: var(--ti-common-color-bg-disabled); + --ti-button-group-item-bg-color: var(--ti-base-color-light); + --ti-button-group-item-btn-text-color: var(--ti-base-color-info-normal); + --ti-button-group-item-btn-width: var(--ti-base-size-width-normal); + --ti-button-group-item-btn-height: var(--ti-base-size-height-minor); + --ti-button-group-item-btn-font-size: var(--ti-common-font-size-base); + --ti-button-group-item-btn-disabled-bg-color: var(--ti-common-color-bg-disabled); + --ti-button-group-item-btn-disabled-border-color: var(--ti-base-color-border); + --ti-button-group-item-btn-disabled-text-color: var(--ti-base-color-placeholder); + --ti-button-group-item-btn-hover-bg-color: var(--ti-base-color-brand-5); + --ti-button-group-item-btn-hover-text-color: var(--ti-base-color-light); + --ti-button-group-item-btn-plain-text-color: var(--ti-base-color-brand-6); + --ti-button-group-item-btn-plain-bg-color: rgba(24, 144, 255, 0.06); + --ti-button-group-item-btn-plain-border-color: var(--ti-base-color-brand-6); + --ti-button-group-item-active-bg-color: var(--ti-base-color-brand-6); + --ti-button-group-item-active-text-color: var(--ti-base-color-light); +} diff --git a/packages/theme/src/button/index.js b/packages/theme/src/button/index.js new file mode 100644 index 000000000..b47ae23c2 --- /dev/null +++ b/packages/theme/src/button/index.js @@ -0,0 +1,105 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-button-border-radius': '2px', + 'tiny-button-plain-disabled-text-color': '#adb0b8', + 'tiny-button-padding-vertical': '0', + 'tiny-button-padding-horizontal': '8px', + 'tiny-button-font-size': '12px', + 'tiny-button-size-normal-min-width': '80px', + 'tiny-button-size-normal-max-width': '120px', + 'tiny-button-size-normal-height': '30px', + 'tiny-button-size-normal-padding': '8px', + 'tiny-button-size-large-min-width': '80px', + 'tiny-button-size-large-max-width': '140px', + 'tiny-button-size-large-height': '48px', + 'tiny-button-size-large-font-size': '16px', + 'tiny-button-size-large-padding': '14px', + 'tiny-button-size-medium-min-width': '80px', + 'tiny-button-size-medium-max-width': '130px', + 'tiny-button-size-medium-height': '42px', + 'tiny-button-size-medium-font-size': '14px', + 'tiny-button-size-medium-padding': '12px', + 'tiny-button-size-small-min-width': '80px', + 'tiny-button-size-small-max-width': '120px', + 'tiny-button-size-small-height': '36px', + 'tiny-button-size-small-font-size': '14px', + 'tiny-button-size-small-padding': '10px', + 'tiny-button-size-mini-min-width': '80px', + 'tiny-button-size-mini-max-width': '120px', + 'tiny-button-size-mini-height': '24px', + 'tiny-button-size-mini-font-size': '12px', + 'tiny-button-size-mini-padding': '4px', + 'tiny-button-normal-text-color': '#1890ff', + 'tiny-button-normal-border-color': '#d9d9d9', + 'tiny-button-normal-background-color': '#fff', + 'tiny-button-normal-hover-text-color': '#1890ff', + 'tiny-button-normal-hover-border-color': '#1890ff', + 'tiny-button-normal-hover-background-color': '#fff', + 'tiny-button-normal-active-text-color': '#1890ff', + 'tiny-button-normal-active-border-color': '#1890ff', + 'tiny-button-normal-active-background-color': '#e6f7ff', + 'tiny-button-normal-disabled-text-color': '#bfbfbf', + 'tiny-button-normal-disabled-border-color': '#d9d9d9', + 'tiny-button-normal-disabled-background-color': '#f5f5f5', + 'tiny-button-text-color': '#1890ff', + 'tiny-button-text-color-hover': '#40a9ff', + 'tiny-button-text-color-active': '#096dd9', + 'tiny-button-text-color-disabled': '#999', + 'tiny-button-primary-bg-color': '#fff', + 'tiny-button-primary-normal-bg-color': '#1890ff', + 'tiny-button-primary-disabled-text-color': '#fff', + 'tiny-button-primary-disabled-bg-color': '#d9d9d9', + 'tiny-button-primary-disabled-border-color': '#dfe1e6', + 'tiny-button-primary-text-color': '#fff', + 'tiny-button-primary-hover-bg-color': '#40a9ff', + 'tiny-button-primary-active-bg-color': '#096dd9', + 'tiny-button-primary-plain-bg-color': 'rgba(24, 144, 255, 0.06)', + 'tiny-button-primary-plain-disabled-bg-color': 'rgba(191, 191, 191, 0.1)', + 'tiny-button-success-text-color': '#fff', + 'tiny-button-success-normal-bg-color': '#52c41a', + 'tiny-button-success-disabled-text-color': '#fff', + 'tiny-button-success-disabled-border-color': '#dfe1e6', + 'tiny-button-success-disabled-bg-color': '#a6c3b9', + 'tiny-button-success-hover-bg-color': '#73d13d', + 'tiny-button-success-active-bg-color': '#389e0d', + 'tiny-button-success-plain-bg-color': 'rgba(82, 196, 26, 0.06)', + 'tiny-button-success-plain-disabled-bg-color': 'rgba(166, 195, 185, 0.1)', + 'tiny-button-warning-text-color': '#fff', + 'tiny-button-warning-normal-bg-color': '#faad14', + 'tiny-button-warning-disabled-text-color': '#fff', + 'tiny-button-warning-disabled-border-color': '#dfe1e6', + 'tiny-button-warning-disabled-bg-color': '#d3c6a2', + 'tiny-button-warning-hover-bg-color': '#ffc53d', + 'tiny-button-warning-active-bg-color': '#ffc53d', + 'tiny-button-warning-plain-bg-color': 'rgba(250, 173, 20, 0.06)', + 'tiny-button-warning-plain-disabled-bg-color': 'rgba(211, 198, 162, 0.1)', + 'tiny-button-danger-text-color': '#fff', + 'tiny-button-danger-normal-bg-color': '#f5222d', + 'tiny-button-danger-disabled-text-color': '#fff', + 'tiny-button-danger-disabled-border-color': '#dfe1e6', + 'tiny-button-danger-disabled-bg-color': '#d8bab5', + 'tiny-button-danger-hover-bg-color': '#ff4d4f', + 'tiny-button-danger-active-bg-color': '#cf1322', + 'tiny-button-danger-plain-bg-color': 'rgba(245, 34, 45, 0.06)', + 'tiny-button-danger-plain-disabled-bg-color': 'rgba(216, 186, 181, 0.1)', + 'tiny-button-info-text-color': '#fff', + 'tiny-button-info-normal-bg-color': '#333333', + 'tiny-button-info-disabled-text-color': '#fff', + 'tiny-button-info-disabled-border-color': '#dfe1e6', + 'tiny-button-info-disabled-bg-color': '#bfbfbf', + 'tiny-button-info-hover-bg-color': '#54657e', + 'tiny-button-info-active-bg-color': '#54657e', + 'tiny-button-info-plain-bg-color': 'rgba(51, 51, 51, 0.06)', + 'tiny-button-info-plain-disabled-bg-color': 'rgba(191, 191, 191, 0.1)' +} diff --git a/packages/theme/src/button/index.less b/packages/theme/src/button/index.less new file mode 100644 index 000000000..07be54671 --- /dev/null +++ b/packages/theme/src/button/index.less @@ -0,0 +1,322 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/button.less'; +@import '../custom.less'; +@import './vars.less'; + +@button-prefix-cls: ~'@{css-prefix}button'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{button-prefix-cls} { + .component-css-vars-button(); + + display: inline-block; + appearance: none; + text-align: center; + box-sizing: border-box; + height: var(--ti-button-size-normal-height); + line-height: calc(var(--ti-button-size-normal-height) - 2px); + color: var(--ti-button-normal-text-color); + fill: var(--ti-button-normal-text-color); + font-size: var(--ti-button-font-size); + white-space: nowrap; + text-overflow: ellipsis; + cursor: pointer; + user-select: none; + border-width: 1px; + border-style: solid; + border-color: var(--ti-button-normal-border-color); + border-image: initial; + border-radius: var(--ti-button-border-radius); + background: var(--ti-button-normal-background-color); + padding: var(--ti-button-padding-vertical) var(--ti-button-padding-horizontal); + overflow: hidden; + transition: border 0.3s ease 0s, color 0.3s ease 0s, background 0.3s ease 0s; + outline: 0; + + .@{svg-prefix-cls} { + vertical-align: text-top; + } + + & > img { + margin-right: 4px; + vertical-align: middle; + } + + &::-moz-focus-inner { + border: 0; + } + + &:focus, + &:hover { + .button-color( + var(--ti-button-normal-hover-text-color), + var(--ti-button-normal-hover-border-color), + var(--ti-button-normal-hover-background-color) + ); + } + + &:active, + &.is-active, + &.is-plain:active { + .button-color( + var(--ti-button-normal-active-text-color), + var(--ti-button-normal-active-border-color), + var(--ti-button-normal-active-background-color) + ); + } + + &.is-disabled, + &.is-disabled:focus, + &.is-disabled:hover { + cursor: not-allowed; + .button-color( + var(--ti-button-normal-disabled-text-color), + var(--ti-button-normal-disabled-border-color), + var(--ti-button-normal-disabled-background-color) + ); + } + + &.is-plain:focus, + &.is-plain:hover { + .button-color( + var(--ti-button-normal-hover-text-color), + var(--ti-button-normal-hover-border-color), + var(--ti-button-normal-hover-background-color) + ); + } + + &.is-disabled.is-plain, + &.is-disabled.is-plain:focus, + &.is-disabled.is-plain:hover { + .button-color( + var(--ti-button-normal-disabled-text-color), + var(--ti-button-normal-disabled-border-color), + var(--ti-button-normal-disabled-background-color) + ); + } + + & + & { + margin-left: 8px; + } + + &.is-loading { + position: relative; + pointer-events: none; + overflow: initial; + + &:before { + pointer-events: none; + content: ''; + position: absolute; + left: -1px; + top: -1px; + right: -1px; + bottom: -1px; + border-radius: inherit; + background-color: rgba(255, 255, 255, 0.35); + } + + .@{svg-prefix-cls} { + fill: var(--ti-button-info-text-color); + } + + &.@{button-prefix-cls}--default { + .@{svg-prefix-cls} { + fill: var(--ti-button-normal-text-color); + } + } + } + + &.is-round { + border-radius: calc(var(--ti-button-size-normal-height, 30px) / 2); + } + + &.is-icon { + display: inline-flex; + justify-content: center; + align-items: center; + } + + &:not(.is-circle) { + .@{svg-prefix-cls}.is-text { + margin-right: 8px; + } + + &.is-loading { + .@{svg-prefix-cls} { + margin-right: 4px; + margin-top: 2px; + } + } + } + + &.is-circle { + border-radius: 50%; + min-width: var(--ti-button-size-normal-height); + min-height: var(--ti-button-size-normal-height); + line-height: 1; + padding: var(--ti-button-size-normal-padding); + } + + &.is-circle&--large { + .button-circle-size( + var(--ti-button-size-large-height), + var(--ti-button-size-large-padding) + ); + } + + &.is-circle&--medium { + .button-circle-size( + var(--ti-button-size-medium-height), + var(--ti-button-size-medium-padding) + ); + } + + &.is-circle&--small { + .button-circle-size( + var(--ti-button-size-small-height), + var(--ti-button-size-small-padding) + ); + } + + &.is-circle&--mini { + .button-circle-size( + var(--ti-button-size-mini-height), + var(--ti-button-size-mini-padding) + ); + } + + &&--primary { + .button-type( + var(--ti-button-primary-text-color), + var(--ti-button-primary-normal-bg-color), + var(--ti-button-primary-hover-bg-color), + var(--ti-button-primary-active-bg-color), + var(--ti-button-primary-disabled-text-color), + var(--ti-button-primary-disabled-bg-color), + var(--ti-button-primary-plain-bg-color), + var(--ti-button-primary-plain-disabled-bg-color), + var(--ti-button-primary-disabled-border-color), + ); + } + + &&--success { + .button-type( + var(--ti-button-success-text-color), + var(--ti-button-success-normal-bg-color), + var(--ti-button-success-hover-bg-color), + var(--ti-button-success-active-bg-color), + var(--ti-button-success-disabled-text-color), + var(--ti-button-success-disabled-bg-color), + var(--ti-button-success-plain-bg-color), + var(--ti-button-success-plain-disabled-bg-color), + var(--ti-button-success-disabled-border-color), + ); + } + + &&--warning { + .button-type( + var(--ti-button-warning-text-color), + var(--ti-button-warning-normal-bg-color), + var(--ti-button-warning-hover-bg-color), + var(--ti-button-warning-active-bg-color), + var(--ti-button-warning-disabled-text-color), + var(--ti-button-warning-disabled-bg-color), + var(--ti-button-warning-plain-bg-color), + var(--ti-button-warning-plain-disabled-bg-color), + var(--ti-button-warning-disabled-border-color), + ); + } + + &&--danger { + .button-type( + var(--ti-button-danger-text-color), + var(--ti-button-danger-normal-bg-color), + var(--ti-button-danger-hover-bg-color), + var(--ti-button-danger-active-bg-color), + var(--ti-button-danger-disabled-text-color), + var(--ti-button-danger-disabled-bg-color), + var(--ti-button-danger-plain-bg-color), + var(--ti-button-danger-plain-disabled-bg-color), + var(--ti-button-danger-disabled-border-color), + ); + } + + &&--info { + .button-type( + var(--ti-button-info-text-color), + var(--ti-button-info-normal-bg-color), + var(--ti-button-info-hover-bg-color), + var(--ti-button-info-active-bg-color), + var(--ti-button-info-disabled-text-color), + var(--ti-button-info-disabled-bg-color), + var(--ti-button-info-plain-bg-color), + var(--ti-button-info-plain-disabled-bg-color), + var(--ti-button-info-disabled-border-color), + ); + } + + &&--text { + .button-text( + var(--ti-button-text-color), + var(--ti-button-text-color-hover), + var(--ti-button-text-color-active), + var(--ti-button-text-color-disabled) + ); + } + + &&--large { + .button-size( + var(--ti-button-size-large-font-size), + var(--ti-button-size-large-height) + ); + } + + &&--medium { + .button-size( + var(--ti-button-size-medium-font-size), + var(--ti-button-size-medium-height) + ); + } + + &&--small { + .button-size( + var(--ti-button-size-small-font-size), + var(--ti-button-size-small-height) + ); + } + + &&--mini { + .button-size( + var(--ti-button-size-mini-font-size), + var(--ti-button-size-mini-height) + ); + } +} + +.@{css-prefix-iconfont}-loading { + font-size: var(--ti-common-font-size-1); + line-height: 1; + animation: rotating 2s linear infinite; +} + +@keyframes rotating { + 0% { + transform: rotateZ(0deg); + } + + 100% { + transform: rotateZ(360deg); + } +} diff --git a/packages/theme/src/button/vars.less b/packages/theme/src/button/vars.less new file mode 100644 index 000000000..af45998d0 --- /dev/null +++ b/packages/theme/src/button/vars.less @@ -0,0 +1,117 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-button() { + --ti-button-border-radius: var(--ti-common-border-radius-normal); + --ti-button-font-size: var(--ti-common-font-size-base); + --ti-button-plain-disabled-text-color: var(--ti-base-color-common-2); + + --ti-button-size-normal-min-width: var(--ti-base-size-width-normal); + --ti-button-size-normal-max-width: var(--ti-base-size-width-medium); + --ti-button-size-normal-height: var(--ti-common-size-7x); + --ti-button-size-normal-padding: var(--ti-common-space-2x); + + --ti-button-size-large-min-width: var(--ti-base-size-width-normal); + --ti-button-size-large-max-width: var(--ti-base-size-width-large); + --ti-button-size-large-height: var(--ti-base-size-height-large); + --ti-button-size-large-font-size: var(--ti-common-font-size-2); + --ti-button-size-large-padding: var(--ti-common-space-4x); + + --ti-button-size-medium-min-width: var(--ti-base-size-width-normal); + --ti-button-size-medium-max-width: var(--ti-base-size-width-large); + --ti-button-size-medium-height: var(--ti-base-size-height-medium); + --ti-button-size-medium-font-size: var(--ti-common-font-size-1); + --ti-button-size-medium-padding: var(--ti-common-space-3x); + + --ti-button-size-small-min-width: var(--ti-base-size-width-normal); + --ti-button-size-small-max-width: var(--ti-base-size-width-medium); + --ti-button-size-small-height: var(--ti-base-size-height-small); + --ti-button-size-small-font-size: var(--ti-common-font-size-1); + --ti-button-size-small-padding: var(--ti-common-space-10); + + --ti-button-size-mini-min-width: var(--ti-base-size-width-normal); + --ti-button-size-mini-max-width: var(--ti-base-size-width-medium); + --ti-button-size-mini-height: var(--ti-base-size-height-mini); + --ti-button-size-mini-font-size: var(--ti-common-font-size-base); + --ti-button-size-mini-padding: var(--ti-common-space-2x); + + --ti-button-normal-text-color: var(--ti-base-color-common-7); + --ti-button-normal-border-color: var(--ti-base-color-border); + --ti-button-normal-background-color: var(--ti-base-color-light); + --ti-button-normal-hover-text-color: var(--ti-base-color-brand-6); + --ti-button-normal-hover-border-color: var(--ti-base-color-brand-6); + --ti-button-normal-hover-background-color: var(--ti-base-color-light); + --ti-button-normal-active-text-color: var(--ti-base-color-brand-6); + --ti-button-normal-active-border-color: var(--ti-base-color-brand-6); + --ti-button-normal-active-background-color: var(--ti-base-color-hover-background); + --ti-button-normal-disabled-text-color: var(--ti-common-color-text-disabled); + --ti-button-normal-disabled-border-color: var(--ti-common-color-line-disabled); + --ti-button-normal-disabled-background-color: var(--ti-common-color-bg-disabled); + + --ti-button-text-color: var(--ti-base-color-brand-6); + --ti-button-text-color-hover: var(--ti-base-color-brand-5); + --ti-button-text-color-active: var(--ti-base-color-primary-active); + --ti-button-text-color-disabled: var(--ti-base-color-placeholder); + + --ti-button-primary-normal-bg-color: var(--ti-base-color-primary-normal); + --ti-button-primary-hover-bg-color: var(--ti-base-color-primary-hover); + --ti-button-primary-active-bg-color: var(--ti-base-color-primary-active); + --ti-button-primary-disabled-bg-color: var(--ti-common-color-bg-disabled); + --ti-button-primary-text-color: var(--ti-base-color-light); + --ti-button-primary-disabled-text-color: var(--ti-common-color-text-disabled); + --ti-button-primary-disabled-border-color: var(--ti-base-color-primary-disabled-border); + --ti-button-primary-plain-bg-color: rgba(24, 144, 255, 0.06); + --ti-button-primary-plain-disabled-bg-color: rgba(191, 191, 191, 0.1); + + --ti-button-success-normal-bg-color: var(--ti-base-color-success-normal); + --ti-button-success-hover-bg-color: var(--ti-base-color-success-hover); + --ti-button-success-active-bg-color: var(--ti-base-color-success-active); + --ti-button-success-disabled-bg-color: var(--ti-common-color-bg-disabled); + --ti-button-success-text-color: var(--ti-base-color-light); + --ti-button-success-disabled-text-color: var(--ti-common-color-text-disabled); + --ti-button-success-disabled-border-color: var(--ti-base-color-success-disabled-border); + --ti-button-success-plain-bg-color: rgba(82, 196, 26, 0.06); + --ti-button-success-plain-disabled-bg-color: rgba(166, 195, 185, 0.1); + + --ti-button-warning-normal-bg-color: var(--ti-base-color-warning-normal); + --ti-button-warning-hover-bg-color: var(--ti-base-color-warning-hover); + --ti-button-warning-active-bg-color: var(--ti-base-color-warning-active); + --ti-button-warning-disabled-bg-color: var(--ti-common-color-bg-disabled); + --ti-button-warning-text-color: var(--ti-base-color-light); + --ti-button-warning-disabled-text-color: var(--ti-common-color-text-disabled); + --ti-button-warning-disabled-border-color: var(--ti-base-color-warning-disabled-border); + --ti-button-warning-plain-bg-color: rgba(250, 173, 20, 0.06); + --ti-button-warning-plain-disabled-bg-color: rgba(211, 198, 162, 0.1); + + --ti-button-danger-normal-bg-color: var(--ti-base-color-danger-normal); + --ti-button-danger-hover-bg-color: var(--ti-base-color-danger-hover); + --ti-button-danger-active-bg-color: var(--ti-base-color-danger-active); + --ti-button-danger-disabled-bg-color: var(--ti-common-color-bg-disabled); + --ti-button-danger-text-color: var(--ti-base-color-light); + --ti-button-danger-disabled-text-color: var(--ti-common-color-text-disabled); + --ti-button-danger-disabled-border-color: var(--ti-base-color-danger-disabled-border); + --ti-button-danger-plain-bg-color: rgba(245, 34, 45, 0.06); + --ti-button-danger-plain-disabled-bg-color: rgba(216, 186, 181, 0.1); + + --ti-button-info-normal-bg-color: var(--ti-base-color-info-normal); + --ti-button-info-hover-bg-color: var(--ti-base-color-info-hover); + --ti-button-info-active-bg-color: var(--ti-base-color-info-active); + --ti-button-info-disabled-bg-color: var(--ti-common-color-bg-disabled); + --ti-button-info-text-color: var(--ti-base-color-light); + --ti-button-info-disabled-text-color: var(--ti-common-color-text-disabled); + --ti-button-info-disabled-border-color: var(--ti-base-color-info-disabled-border); + --ti-button-info-plain-bg-color: rgba(51, 51, 51, 0.06); + --ti-button-info-plain-disabled-bg-color: rgba(191, 191, 191, 0.1); + + --ti-button-padding-vertical: 0; + --ti-button-padding-horizontal: var(--ti-common-space-5x); +} diff --git a/packages/theme/src/calendar/index.js b/packages/theme/src/calendar/index.js new file mode 100644 index 000000000..a3df36377 --- /dev/null +++ b/packages/theme/src/calendar/index.js @@ -0,0 +1,38 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-calendar-bg-color': '#fff', + 'tiny-calendar-list-item-selected-text-color': '#fff', + 'tiny-calendar-hover-text-color': '#40a9ff', + 'tiny-calendar-border-color': '#d9d9d9', + 'tiny-calendar-text-color-primary': '#1890ff', + 'tiny-calendar-background-color-primary': 'rgba(24, 144, 255, 0.1)', + 'tiny-calendar-bg-color-success': '#52c41a', + 'tiny-calendar-bg-color-warning': '#faad14', + 'tiny-calendar-bg-color-danger': '#f5222d', + 'tiny-calendar-text-color-info': '#333333', + 'tiny-calendar-tool-width': '80px', + 'tiny-calendar-content-heard-font-size': '14px', + 'tiny-calendar-selected-border-radius': '3px', + 'tiny-calendar-input-height': '30px', + 'tiny-calendar-input-border-radius': '2px', + 'tiny-calendar-input-font-size': '12px', + 'tiny-calendar-list-item-height': '30px', + 'tiny-calendar-list-item-hover-bg-color': '#e6f7ff', + 'tiny-calendar-list-item-selected-bg-color': '#f5f5f5', + 'tiny-calendar-disabled-text-color': '#bfbfbf', + 'tiny-calendar-disabled-info-bg-color': '#bfbfbf', + 'tiny-calendar-disabled-success-bg-color': '#a6c3b9', + 'tiny-calendar-disabled-warning-bg-color': '#d3c6a2', + 'tiny-calendar-disabled-error-bg-color': '#d8bab5' +} diff --git a/packages/theme/src/calendar/index.less b/packages/theme/src/calendar/index.less new file mode 100644 index 000000000..7e1158c65 --- /dev/null +++ b/packages/theme/src/calendar/index.less @@ -0,0 +1,327 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../mixins/input.less'; +@import '../custom.less'; +@import './vars.less'; +@import '../transition/zoom-in-top.less'; + +@calendar-prefix-cls: ~'@{css-prefix}calendar'; +@popover-prefix-cls: ~'@{css-prefix}popover'; +@popper-prefix-cls: ~'@{css-prefix}popper'; + +.@{calendar-prefix-cls} { + .component-css-vars-calendar(); + + background: var(--ti-calendar-bg-color); + overflow: hidden; + margin: 10px; + + &.is-popover.@{popover-prefix-cls}.@{popper-prefix-cls} { + padding: 0; + margin: 2px 0 0; + } + + & &__header { + overflow: hidden; + margin-bottom: 12px; + } + + & &__selected { + border: 1px solid var(--ti-calendar-text-color-primary); + background: var(--ti-calendar-background-color-primary); + padding: 8px; + color: var(--ti-calendar-text-color-info); + line-height: 140%; + border-radius: var(--ti-calendar-selected-border-radius); + margin-bottom: 8px; + } + + & &__tool { + list-style: none; + overflow: hidden; + float: right; + margin-bottom: 8px; + + > li { + float: left; + margin-right: 8px; + + > span { + display: inline-block; + } + + &:last-child { + margin-left: 16px; + margin-right: 0; + } + } + } + + & &__input { + width: var(--ti-calendar-tool-width); + position: relative; + outline: 0; + + > input { + width: 100%; + height: var(--ti-calendar-input-height); + line-height: var(--ti-calendar-input-height); + border: 1px solid var(--ti-calendar-border-color); + color: var(--ti-calendar-text-color-info); + border-radius: var(--ti-calendar-input-border-radius); + background: var(--ti-calendar-bg-color); + font-size: var(--ti-calendar-input-font-size); + padding: 0 30px 0 8px; + display: block; + white-space: nowrap; + transition: border 0.3s; + outline: 0; + box-sizing: border-box; + + &:hover, + &:focus, + &:active, + &.active, + &[active] { + border: 1px solid var(--ti-calendar-text-color-primary); + } + + &[readonly] { + cursor: not-allowed; + } + } + } + + & &__input-btn { + bottom: 0; + right: 4px; + position: absolute; + top: 0; + outline: 0; + box-sizing: border-box; + text-align: center; + overflow: hidden; + font-size: var(--ti-common-font-size-base); + display: flex; + align-items: center; + cursor: pointer; + + svg { + fill: var(--ti-calendar-text-color-primary); + + &:hover { + fill: var(--ti-calendar-hover-text-color); + } + } + } + + & &__tabs { + list-style: none; + overflow: hidden; + + > li { + position: relative; + float: left; + width: calc(var(--ti-calendar-tool-width) / 2); + height: var(--ti-calendar-input-height); + line-height: var(--ti-calendar-input-height); + border: 1px solid var(--ti-calendar-border-color); + text-align: center; + font-size: var(--ti-calendar-input-font-size); + font-weight: 500; + color: var(--ti-calendar-text-color-info); + cursor: pointer; + + &:first-child { + border-radius: 3px 0 0 3px; + } + + &:last-child { + margin-left: -1px; + border-radius: 0 3px 3px 0; + } + + &:hover { + color: var(--ti-calendar-text-color-primary); + } + } + + > .active { + color: var(--ti-calendar-text-color-primary); + border: 1px solid var(--ti-calendar-text-color-primary); + z-index: 1; + } + } + + & &__main { + width: 100%; + overflow: hidden; + + table { + width: 100%; + + > tr { + > th { + line-height: 18px; + padding: 0 10px 5px 10px; + font-size: var(--ti-calendar-content-heard-font-size); + text-align: right; + width: 100% / 7; + } + + > td { + text-align: right; + padding: 0 5px 0 0; + } + } + } + + &.year table > tr > td { + width: 100% / 3; + } + } + + & &__day { + border-top: 3px solid var(--ti-calendar-border-color); + margin: 0 3px 5px 3px; + height: 100px; + padding: 5px; + + &.selected { + background: var(--ti-calendar-background-color-primary); + + .label { + color: var(--ti-calendar-text-color-primary); + } + } + + &:hover { + background: var(--ti-calendar-background-color-primary); + } + + &.disable { + color: var(--ti-calendar-disabled-text-color); + + .info:before { + background: var(--ti-calendar-disabled-info-bg-color); + } + + .success:before { + background: var(--ti-calendar-disabled-success-bg-color); + } + + .warning:before { + background: var(--ti-calendar-disabled-warning-bg-color); + } + + .error:before { + background: var(--ti-calendar-disabled-error-bg-color); + } + } + + &.this-month, + &.today { + border-color: var(--ti-calendar-text-color-primary); + } + } + + & &__events { + text-align: left; + height: calc(~'100% - 18px'); + overflow-y: auto; + + .event { + margin: 5px 10px; + cursor: pointer; + + &:before { + content: ''; + width: 6px; + height: 6px; + border-radius: 50%; + display: inline-block; + margin-right: 3px; + } + } + + .info:before { + background: var(--ti-calendar-text-color-info); + } + + .success:before { + background: var(--ti-calendar-bg-color-success); + } + + .warning:before { + background: var(--ti-calendar-bg-color-warning); + } + + .error:before { + background: var(--ti-calendar-bg-color-danger); + } + } + + &__tip { + display: block; + min-width: 160px; + + &-header { + overflow: hidden; + border-bottom: 1px solid rgba(255, 255, 255, 0.5); + padding: 5px 0; + font-size: var(--ti-calendar-content-heard-font-size); + } + + &-year { + float: left; + } + + &-hours { + float: right; + } + + &-title { + margin: 5px 0; + font-weight: bold; + } + } + + & &__selector { + width: var(--ti-calendar-tool-width); + max-height: 300px; + overflow-y: auto; + overflow-x: hidden; + } + + & &__list-item { + min-height: var(--ti-calendar-list-item-height); + line-height: var(--ti-calendar-list-item-height); + max-width: 100%; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + padding: 0 8px; + color: var(--ti-calendar-text-color-info); + + &:hover { + cursor: pointer; + background: var(--ti-calendar-list-item-hover-bg-color); + } + + &.is-selected { + background: var(--ti-calendar-list-item-selected-bg-color); + color: var(--ti-calendar-list-item-selected-text-color); + } + } +} diff --git a/packages/theme/src/calendar/vars.less b/packages/theme/src/calendar/vars.less new file mode 100644 index 000000000..a721dc867 --- /dev/null +++ b/packages/theme/src/calendar/vars.less @@ -0,0 +1,38 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-calendar() { + --ti-calendar-bg-color: var(--ti-base-color-light); + --ti-calendar-list-item-selected-text-color: var(--ti-base-color-light); + --ti-calendar-hover-text-color: var(--ti-base-color-brand-5); + --ti-calendar-border-color: var(--ti-base-color-border); + --ti-calendar-text-color-primary: var(--ti-base-color-brand-6); + --ti-calendar-background-color-primary: rgba(24, 144, 255, 0.1); + --ti-calendar-bg-color-success: var(--ti-base-color-success-normal); + --ti-calendar-bg-color-warning: var(--ti-base-color-warning-normal); + --ti-calendar-bg-color-danger: var(--ti-base-color-bg-8); + --ti-calendar-text-color-info: var(--ti-base-color-info-normal); + --ti-calendar-tool-width: var(--ti-base-size-width-normal); + --ti-calendar-content-heard-font-size: var(--ti-common-font-size-1); + --ti-calendar-selected-border-radius: var(--ti-base-radius-large); + --ti-calendar-input-height: var(--ti-base-size-height-minor); + --ti-calendar-input-border-radius: var(--ti-common-border-radius-normal); + --ti-calendar-input-font-size: var(--ti-common-font-size-base); + --ti-calendar-list-item-height: var(--ti-base-size-height-minor); + --ti-calendar-list-item-hover-bg-color: var(--ti-base-color-hover-background); + --ti-calendar-list-item-selected-bg-color: var(--ti-base-color-selected-background); + --ti-calendar-disabled-text-color: var(--ti-common-color-text-disabled); + --ti-calendar-disabled-info-bg-color: var(--ti-base-color-bg-5); + --ti-calendar-disabled-success-bg-color: var(--ti-base-color-bg-5); + --ti-calendar-disabled-warning-bg-color: var(--ti-base-color-bg-5); + --ti-calendar-disabled-error-bg-color: var(--ti-base-color-bg-5); +} diff --git a/packages/theme/src/card-container/index.js b/packages/theme/src/card-container/index.js new file mode 100644 index 000000000..824b7f82b --- /dev/null +++ b/packages/theme/src/card-container/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // card-container +} diff --git a/packages/theme/src/card-container/index.less b/packages/theme/src/card-container/index.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/card-container/index.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/card-container/vars.less b/packages/theme/src/card-container/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/card-container/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/card-item/index.js b/packages/theme/src/card-item/index.js new file mode 100644 index 000000000..feed0e67c --- /dev/null +++ b/packages/theme/src/card-item/index.js @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-card-item-bg-color': '#fff', + 'tiny-card-item-border-color': '#ccc', + 'tiny-card-item-placeholder-bg-color': 'rgba(0, 0, 0, 0.05)', + 'tiny-card-item-placeholder-border-color': 'rgba(0, 0, 0, 0.2)', + 'tiny-card-item-resize-icon-color': 'rgba(0, 0, 0, 0.5)', + 'tiny-card-item-remove-icon-bg-color': 'rgba(255, 255, 255, 0)', + 'tiny-card-item-remove-icon-color': 'rgba(0, 0, 0, 0.5)', + 'tiny-card-item-remove-icon-hover-bg-color': 'rgba(255, 255, 255, 0.8)', + 'tiny-card-item-remove-icon-hover-text-color': 'rgba(0, 0, 0, 0.7)', + 'tiny-card-item-header-font-size': '14px', + 'tiny-card-item-header-text-color': '#444', + 'tiny-card-item-header-height': '40px', + 'tiny-card-item-header-title-border-color': '#666' +} diff --git a/packages/theme/src/card-item/index.less b/packages/theme/src/card-item/index.less new file mode 100644 index 000000000..25db8ed76 --- /dev/null +++ b/packages/theme/src/card-item/index.less @@ -0,0 +1,159 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@card-item-prefix-cls: ~'@{css-prefix}card-item'; + +.@{card-item-prefix-cls} { + .component-css-vars-card-item(); + + transition: all 200ms ease; + transition-property: left, top, right, transform; + background: var(--ti-card-item-bg-color); + box-shadow: 0 0 0 transparent; + border: 1px solid var(--ti-card-item-border-color); + border-radius: 0; + right: auto; + overflow: hidden; + margin: 6px; + + &.resizing { + opacity: 0.6; + z-index: 3; + } + + &.dragging { + user-select: none; + transition: none; + z-index: 3; + } + + &.placeholder { + background: var(--ti-card-item-placeholder-bg-color); + border: 1px dashed var(--ti-card-item-placeholder-border-color); + transition-duration: 100ms; + z-index: 2; + user-select: none; + + & .resizableIcon, + .remove { + display: none; + } + } + + & > .resizableIcon { + position: absolute; + width: 6px; + height: 6px; + bottom: 2px; + right: 2px; + box-sizing: border-box; + cursor: se-resize; + + &:before { + position: absolute; + content: ''; + width: 6px; + height: 6px; + bottom: 2px; + right: 2px; + border-right: 1px solid var(--ti-card-item-resize-icon-color); + border-bottom: 1px solid var(--ti-card-item-resize-icon-color); + box-sizing: border-box; + } + } + + & .remove { + position: absolute; + width: 22px; + height: 22px; + top: 0; + right: 0; + padding: 0 3px 3px 0; + box-sizing: border-box; + cursor: pointer; + opacity: 0.5; + background: var(--ti-card-item-remove-icon-bg-color); + transition: all 0.5s; + + &:hover { + background: var(--ti-card-item-remove-icon-hover-bg-color); + + &:before, + &:after { + background: var(--ti-card-item-remove-icon-hover-text-color); + } + } + } + + &:hover .remove { + opacity: 1; + } + + & .remove:before { + position: absolute; + top: 10px; + right: 6px; + content: ''; + background: var(--ti-card-item-remove-icon-color, rgba(0, 0, 0, 0.5)); + height: 1px; + width: 10px; + transform: rotate(45deg); + transition: background 0.5s; + } + + & .remove:after { + position: absolute; + top: 10px; + left: 6px; + content: ''; + background: var(--ti-card-item-remove-icon-color, rgba(0, 0, 0, 0.5)); + height: 1px; + width: 10px; + transform: rotate(-45deg); + transition: background 0.5s; + } + + .card-header { + font-size: var(--ti-card-item-header-font-size); + color: var(--ti-card-item-header-text-color); + height: var(--ti-card-item-header-height); + line-height: var(--ti-card-item-header-height); + width: 100%; + padding: 0 30px 0 0; + box-sizing: border-box; + + & > .card-title { + height: 13px; + line-height: 13px; + border-left: 3px solid var(--ti-card-item-header-title-border-color); + margin: 0 0 0 12px; + padding: 0 0 0 5px; + width: 100%; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + display: inline-block; + } + } + + .card-body { + height: calc(100% - var(--ti-card-item-header-height)); + position: relative; + + &:nth-child(1) { + height: 100%; + } + } +} diff --git a/packages/theme/src/card-item/vars.less b/packages/theme/src/card-item/vars.less new file mode 100644 index 000000000..4c7b79783 --- /dev/null +++ b/packages/theme/src/card-item/vars.less @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-card-item() { + --ti-card-item-bg-color: var(--ti-base-color-light); + --ti-card-item-border-color: #ccc; + --ti-card-item-placeholder-bg-color: rgba(0, 0, 0, 0.05); + --ti-card-item-placeholder-border-color: rgba(0, 0, 0, 0.2); + --ti-card-item-resize-icon-color: rgba(0, 0, 0, 0.5); + --ti-card-item-remove-icon-bg-color: rgba(255, 255, 255, 0); + --ti-card-item-remove-icon-color: rgba(0, 0, 0, 0.5); + --ti-card-item-remove-icon-hover-bg-color: rgba(255, 255, 255, 0.8); + --ti-card-item-remove-icon-hover-text-color: rgba(0, 0, 0, 0.7); + --ti-card-item-header-font-size: var(--ti-common-font-size-1); + --ti-card-item-header-text-color: #444; + --ti-card-item-header-height: var(--ti-common-size-10x); + --ti-card-item-header-title-border-color: var(--ti-base-color-secondary); +} diff --git a/packages/theme/src/card-layout/index.js b/packages/theme/src/card-layout/index.js new file mode 100644 index 000000000..c4b73856b --- /dev/null +++ b/packages/theme/src/card-layout/index.js @@ -0,0 +1,16 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-card-bg-color': '#fff', + 'tiny-card-drop-border-color': '#1890ff' +} diff --git a/packages/theme/src/card-layout/index.less b/packages/theme/src/card-layout/index.less new file mode 100644 index 000000000..cb963165d --- /dev/null +++ b/packages/theme/src/card-layout/index.less @@ -0,0 +1,49 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@cards-prefix-cls: ~'@{css-prefix}cards'; + +.@{cards-prefix-cls} { + .component-css-vars-card-layout(); + + border-radius: 0; + background-color: var(--ti-card-bg-color); + overflow: hidden; + position: relative; + box-shadow: none; + border: 0; + + & &_body { + padding: 12px 24px 24px; + } + + &.card-layout { + border: none; + border-radius: 0; + overflow: hidden; + box-shadow: none; + position: relative; + transition: height 0.2s ease; + + .@{cards-prefix-cls}_body { + padding: 0; + } + + &.drop-active { + border: 1px solid var(--ti-card-drop-border-color); + background-color: var(--ti-card-bg-color); + } + } +} diff --git a/packages/theme/src/card-layout/vars.less b/packages/theme/src/card-layout/vars.less new file mode 100644 index 000000000..efe0bd504 --- /dev/null +++ b/packages/theme/src/card-layout/vars.less @@ -0,0 +1,16 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-card-layout() { + --ti-card-bg-color: var(--ti-base-color-light); + --ti-card-drop-border-color: var(--ti-base-color-brand-6); +} diff --git a/packages/theme/src/card-template/index.js b/packages/theme/src/card-template/index.js new file mode 100644 index 000000000..cafd67f4f --- /dev/null +++ b/packages/theme/src/card-template/index.js @@ -0,0 +1,30 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-card-bg-color': '#fff', + 'tiny-card-tool-icon-size': '16px', + 'tiny-card-tool-icon-color': '#1890ff', + 'tiny-card-tool-hover-icon-color': '#40a9ff', + 'tiny-card-tool-active-icon-color': '#096dd9', + 'tiny-card-tool-selector-height': '40px', + 'tiny-card-tool-selector-text-color': '#333', + 'tiny-card-tool-selector-hover-text-color': '#1890ff', + 'tiny-card-tool-selector-hover-bg-color': '#f5f5f5', + 'tiny-card-tool-selector-active-text-color': '#096dd9', + 'tiny-card-tool-selector-active-bg-color': '#f5f5f5', + 'tiny-card-header-height': '46px', + 'tiny-card-header-border-color': '#d9d9d9', + 'tiny-card-header-title-font-weight': '700', + 'tiny-card-header-title-font-size': '14px', + 'tiny-card-header-title-text-color': '#333' +} diff --git a/packages/theme/src/card-template/index.less b/packages/theme/src/card-template/index.less new file mode 100644 index 000000000..4f9298c1e --- /dev/null +++ b/packages/theme/src/card-template/index.less @@ -0,0 +1,160 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +@card-template-prefix-cls: ~'@{css-prefix}card-template'; + +.@{card-template-prefix-cls} { + .component-css-vars-card-template(); + + border-radius: 0; + background-color: var(--ti-card-bg-color); + overflow: hidden; + position: relative; + box-shadow: none; + border: 0; + + & &__header { + padding: 0 24px; + height: var(--ti-card-header-height); + line-height: var(--ti-card-header-height); + + &.is-line { + border-bottom: 1px solid var(--ti-card-header-border-color); + } + } + + & &__title { + font-weight: var(--ti-card-header-title-font-weight); + font-size: var(--ti-card-header-title-font-size); + color: #333; + color: var(--ti-card-header-title-text-color); + float: left; + } + + & &__tools { + .clearfix(); + + .@{css-prefix-iconfont} { + font-size: var(--ti-card-tool-icon-size); + cursor: pointer; + } + } + + & &__list { + overflow: hidden; + float: right; + + > li { + height: var(--ti-card-header-height); + line-height: var(--ti-card-header-height); + float: left; + font-size: var(--ti-common-font-size-2); + margin: 0 12px 0 0; + + svg { + fill: var(--ti-card-tool-icon-color); + cursor: pointer; + } + + .@{css-prefix-iconfont} { + color: var(--ti-card-tool-icon-color); + + &:hover { + color: var(--ti-card-tool-hover-icon-color); + } + + &:active { + color: var(--ti-card-tool-active-icon-color); + } + } + + &:last-child { + margin: 0; + } + } + } + + & &__more { + position: absolute; + top: calc(var(--ti-card-header-height, 45px) - 1 * 1px); + right: 5px; + border: 1px solid var(--ti-card-header-border-color); + border-radius: 2px; + box-shadow: var(--ti-base-box-shadow); + background: var(--ti-card-bg-color); + color: #333; + color: var(--ti-card-tool-selector-text-color); + margin-top: 2px; + + &:before { + content: ''; + position: absolute; + display: block; + top: -5px; + right: 21px; + width: 0; + height: 0px; + border-style: solid; + border-width: 6px; + border-color: #ffffff #fff transparent transparent; + transform: rotate(-45deg); + box-shadow: 1px -1px 1px rgba(0, 0, 0, 0.2); + } + + > ul { + > li { + height: var(--ti-card-tool-selector-height); + line-height: var(--ti-card-tool-selector-height); + padding: 0 18px; + color: var(--ti-card-tool-selector-text-color); + display: flex; + align-items: center; + + .@{css-prefix-iconfont} { + color: var(--ti-card-tool-icon-color); + margin-right: 10px; + } + + svg { + font-size: var(--ti-common-font-size-2); + } + + &:hover { + cursor: pointer; + color: var(--ti-card-tool-selector-hover-text-color); + background: var(--ti-card-tool-selector-hover-bg-color); + + .@{css-prefix-iconfont} { + color: var(--ti-card-tool-hover-icon-color); + } + } + + &:active { + color: var(--ti-card-tool-selector-active-text-color); + background: var(--ti-card-tool-selector-active-bg-color); + + .@{css-prefix-iconfont} { + color: var(--ti-card-tool-active-icon-color); + } + } + } + } + } + + & &__body { + padding: 12px 24px 24px; + } +} diff --git a/packages/theme/src/card-template/vars.less b/packages/theme/src/card-template/vars.less new file mode 100644 index 000000000..26355848c --- /dev/null +++ b/packages/theme/src/card-template/vars.less @@ -0,0 +1,30 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-card-template() { + --ti-card-bg-color: var(--ti-base-color-light); + --ti-card-tool-icon-size: 16px; + --ti-card-tool-icon-color: var(--ti-base-color-brand-6); + --ti-card-tool-hover-icon-color: var(--ti-base-color-brand-5); + --ti-card-tool-active-icon-color: var(--ti-base-color-primary-active); + --ti-card-tool-selector-height: var(--ti-common-size-10x); + --ti-card-tool-selector-text-color: var(--ti-base-color-info-normal); + --ti-card-tool-selector-hover-text-color: var(--ti-base-color-brand-6); + --ti-card-tool-selector-hover-bg-color: var(--ti-base-color-selected-background); + --ti-card-tool-selector-active-text-color: var(--ti-base-color-primary-active); + --ti-card-tool-selector-active-bg-color: var(--ti-base-color-selected-background); + --ti-card-header-height: 46px; + --ti-card-header-border-color: var(--ti-base-color-border); + --ti-card-header-title-font-weight: var(--ti-common-font-weight-7); + --ti-card-header-title-font-size: var(--ti-common-font-size-1); + --ti-card-header-title-text-color: var(--ti-base-color-info-normal); +} diff --git a/packages/theme/src/card/index.js b/packages/theme/src/card/index.js new file mode 100644 index 000000000..69f1b09bd --- /dev/null +++ b/packages/theme/src/card/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // card +} diff --git a/packages/theme/src/card/index.less b/packages/theme/src/card/index.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/card/index.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/card/vars.css b/packages/theme/src/card/vars.css new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/card/vars.css @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/carousel-item/index.js b/packages/theme/src/carousel-item/index.js new file mode 100644 index 000000000..fbbff6466 --- /dev/null +++ b/packages/theme/src/carousel-item/index.js @@ -0,0 +1,19 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-carousel-item-title-height': '24px', + 'tiny-carousel-item-title-text-color': '#fff', + 'tiny-carousel-item-title-bg-color': 'rgba(0, 0, 0, 0.3)', + 'tiny-carousel-item-title-span-font-size': '12px', + 'tiny-carousel-mask-bg-color': '#fff' +} diff --git a/packages/theme/src/carousel-item/index.less b/packages/theme/src/carousel-item/index.less new file mode 100644 index 000000000..5927d6010 --- /dev/null +++ b/packages/theme/src/carousel-item/index.less @@ -0,0 +1,92 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@carousel-prefix-cls: ~'@{css-prefix}carousel'; + +.@{carousel-prefix-cls} { + .component-css-vars-carousel-item(); + + &__item, + &__mask { + position: absolute; + height: 100%; + top: 0; + left: 0; + } + + &__item { + width: 100%; + display: inline-block; + overflow: hidden; + z-index: 0; + + .item-title { + position: absolute; + bottom: 0; + height: var(--ti-carousel-item-title-height); + width: 100%; + line-height: var(--ti-carousel-item-title-height); + color: var(--ti-carousel-item-title-text-color, #fff); + text-align: left; + background: var(--ti-carousel-item-title-bg-color); + + span { + padding: 0 12px; + font-size: var(--ti-carousel-item-title-span-font-size); + width: 80%; + display: inline-block; + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + } + } + + &.is-active { + z-index: 2; + } + + &.is-animating { + transition: transform 0.4s ease-in-out; + } + } + + &__item--card { + width: 50%; + transition: transform 0.4s ease-in-out; + + &.is-in-stage { + cursor: pointer; + z-index: 1; + + &.is-hover, + &:hover { + .@{carousel-prefix-cls}__mask { + opacity: 0.12; + } + } + } + + &.is-active { + z-index: 2; + } + } + + &__mask { + width: 100%; + background-color: var(--ti-carousel-mask-bg-color); + opacity: 0.24; + transition: 0.2s; + } +} diff --git a/packages/theme/src/carousel-item/vars.less b/packages/theme/src/carousel-item/vars.less new file mode 100644 index 000000000..c90ecc756 --- /dev/null +++ b/packages/theme/src/carousel-item/vars.less @@ -0,0 +1,19 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-carousel-item() { + --ti-carousel-item-title-height: var(--ti-base-size-height-small); + --ti-carousel-item-title-text-color: var(--ti-base-color-light); + --ti-carousel-item-title-bg-color: rgba(0, 0, 0, 0.3); + --ti-carousel-item-title-span-font-size: var(--ti-common-font-size-base); + --ti-carousel-mask-bg-color: var(--ti-base-color-light); +} diff --git a/packages/theme/src/carousel/index.js b/packages/theme/src/carousel/index.js new file mode 100644 index 000000000..dc5a538ac --- /dev/null +++ b/packages/theme/src/carousel/index.js @@ -0,0 +1,39 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-carousel-arrow-height': '30px', + 'tiny-carousel-arrow-width': '30px', + 'tiny-carousel-arrow-font-size': '12px', + 'tiny-carousel-arrow-hover-bg-color': 'rgba(0, 0, 0, 0.6)', + 'tiny-carousel-arrow-bg-color': 'rgba(0, 0, 0, 0.3)', + 'tiny-carousel-arrow-box-shadow': 'none', + 'tiny-carousel-arrow-active-text-color': '#fff', + 'tiny-carousel-indicators-bg-color': 'rgba(0, 0, 0, 0.3)', + 'tiny-carousel-indicators-border-radius': '13px', + 'tiny-carousel-indicators-height': '16px', + 'tiny-carousel-indicators-radius-bg-color': 'rgba(0, 0, 0, 0.3)', + 'tiny-carousel-indicator-active-text-color': '#fff', + 'tiny-carousel-indicator-button-width': '8px', + 'tiny-carousel-indicator-button-height': '8px', + 'tiny-carousel-indicator-button-bg-color': '#bfbfbf', + 'tiny-carousel-indicator-margin-right': '0', + 'tiny-carousel-indicator-active-width': '12px', + 'tiny-carousel-indicator-padding-vertical': '0px', + 'tiny-carousel-indicator-padding-horizontal': '2px', + 'tiny-carousel-indicator-active-background-color': 'transparent', + 'tiny-carousel-indicator-active-button-width': '8px', + 'tiny-carousel-indicator-active-border-radius': '13px', + 'tiny-carousel-outside-button-bg-color': '#000', + 'tiny-carousel-outside-button-active-bg-color': '#666', + 'tiny-carousel-labels-button-font-size': '12px' +} diff --git a/packages/theme/src/carousel/index.less b/packages/theme/src/carousel/index.less new file mode 100644 index 000000000..bf63c60f5 --- /dev/null +++ b/packages/theme/src/carousel/index.less @@ -0,0 +1,219 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; +@import '../transition/carousel-arrow.less'; + +@carousel-prefix-cls: ~'@{css-prefix}carousel'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{carousel-prefix-cls} { + .component-css-vars-carousel(); + + overflow: hidden; + position: relative; + + &&--card { + .@{carousel-prefix-cls}__indicators { + display: none; + } + } + + &__container { + position: relative; + height: 300px; + + .@{carousel-prefix-cls}__arrow { + border: none; + outline: 0; + padding: 0; + margin: 0; + height: var(--ti-carousel-arrow-height); + width: var(--ti-carousel-arrow-width); + cursor: pointer; + transition: 0.3s; + border-radius: 50%; + box-shadow: var(--ti-carousel-arrow-box-shadow); + background-color: var(--ti-carousel-arrow-bg-color); + color: var(--ti-carousel-indicator-active-text-color); + position: absolute; + top: 50%; + z-index: 3; + transform: translateY(-50%); + text-align: center; + font-size: var(--ti-carousel-arrow-font-size); + display: flex; + align-items: center; + justify-content: center; + + .@{svg-prefix-cls} { + fill: var(--ti-carousel-indicator-active-text-color); + } + + &.@{carousel-prefix-cls}__arrow-left { + left: 16px; + } + + &.@{carousel-prefix-cls}__arrow-right { + right: 16px; + } + + &:hover { + background-color: var(--ti-carousel-arrow-hover-bg-color); + } + + i { + cursor: pointer; + } + } + } + + & &__indicators { + position: absolute; + list-style: none; + bottom: 8px; + left: 50%; + transform: translateX(-50%); + margin: 0; + padding: 0 4px; + z-index: 2; + background: var(--ti-carousel-indicators-bg-color); + border-radius: var(--ti-carousel-indicators-border-radius); + height: var(--ti-carousel-indicators-height); + + .@{carousel-prefix-cls}__indicator { + display: inline-block; + background-color: transparent; + padding: var(--ti-carousel-indicator-padding-vertical) var(--ti-carousel-indicator-padding-horizontal); + margin-right: var(--ti-carousel-indicator-margin-right); + cursor: pointer; + + &:hover button { + opacity: var(--ti-carousel-hover-opacity); + } + + &.is-active { + width: var(--ti-carousel-indicator-active-width); + background-color: var(--ti-carousel-indicator-active-background-color); + border-radius: var(--ti-carousel-indicator-active-border-radius); + transition: var(--ti-carousel-indicator-active-transition); + } + + &.is-active button { + transition-property: var(--ti-carousel-indicator-active-transition-property); + transition-timing-function: cubic-bezier(0.16, 0.75, 0.5, 1); + border-radius: var(--ti-carousel-indicator-active-border-radius); + background-color: var(--ti-carousel-indicator-active-text-color); + width: var(--ti-carousel-indicator-active-button-width); + } + + .@{carousel-prefix-cls}__button { + display: block; + width: var(--ti-carousel-indicator-button-width); + height: var(--ti-carousel-indicator-button-height); + background-color: var(--ti-carousel-indicator-button-bg-color); + border: none; + outline: 0; + padding: 0; + margin: 0; + cursor: pointer; + transition: 0.3s; + border-radius: 50%; + } + } + + .@{carousel-prefix-cls}__button._radius { + height: 8px; + width: 8px; + border-radius: 50%; + background-color: var(--ti-carousel-indicators-radius-bg-color); + } + + &.@{carousel-prefix-cls}__indicators-outside { + bottom: 26px; + text-align: center; + position: static; + transform: none; + margin-top: 16px; + background: transparent; + + button { + background-color: var(--ti-carousel-outside-button-bg-color); + } + + .@{carousel-prefix-cls}__indicator { + &:hover button { + opacity: 0.6; + } + + &.is-active button { + background-color: var(--ti-carousel-outside-button-active-bg-color); + } + } + } + + &.@{carousel-prefix-cls}__indicators-labels { + left: 0; + right: 0; + transform: none; + text-align: center; + + .@{carousel-prefix-cls}__button { + padding: 2px 18px; + font-size: var(--ti-carousel-labels-button-font-size); + } + + .@{carousel-prefix-cls}__indicator { + padding: 6px 4px; + } + } + + &.@{carousel-prefix-cls}__indicators-title { + left: auto; + right: 12px; + bottom: 3px; + transform: none; + background: transparent; + } + + &.@{carousel-prefix-cls}__indicators-vertical { + left: 12px; + right: 0px; + bottom: 50%; + width: 16px; + height: 56px; + transform: translateY(50%); + padding: 2px 4px; + + .@{carousel-prefix-cls}__indicator { + display: block; + margin: 4px 0; + padding: 0; + + &:first-child { + padding-left: 0; + } + + &:last-child { + padding-right: 0; + } + } + } + + &:not(.@{carousel-prefix-cls}__indicators-vertical) { + display: flex; + justify-content: center; + align-items: center; + } + } +} diff --git a/packages/theme/src/carousel/vars.less b/packages/theme/src/carousel/vars.less new file mode 100644 index 000000000..5aeaf25bc --- /dev/null +++ b/packages/theme/src/carousel/vars.less @@ -0,0 +1,42 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-carousel() { + --ti-carousel-arrow-height: var(--ti-base-size-height-minor); + --ti-carousel-arrow-width: var(--ti-base-size-width-minor); + --ti-carousel-arrow-font-size: var(--ti-common-font-size-base); + --ti-carousel-arrow-hover-bg-color: rgba(0, 0, 0, 0.6); + --ti-carousel-arrow-bg-color: rgba(0, 0, 0, 0.3); + --ti-carousel-arrow-box-shadow: none; + --ti-carousel-arrow-active-text-color: var(--ti-base-color-light); + --ti-carousel-indicators-bg-color: rgba(3, 2, 2, 0.3); + --ti-carousel-indicators-border-radius: 13px; + --ti-carousel-indicators-height: var(--ti-common-size-4x); + --ti-carousel-indicators-radius-bg-color: rgba(0, 0, 0, 0.3); + --ti-carousel-indicator-active-text-color: var(--ti-base-color-light); + --ti-carousel-indicator-button-width: var(--ti-common-size-2x); + --ti-carousel-indicator-button-height: var(--ti-common-size-2x); + --ti-carousel-indicator-button-bg-color: #bfbfbf; + --ti-carousel-indicator-margin-right: 0; + --ti-carousel-indicator-active-width: var(--ti-common-size-3x); + --ti-carousel-indicator-padding-vertical: 0px; + --ti-carousel-indicator-padding-horizontal: 2px; + --ti-carousel-indicator-active-transition-property: none; + --ti-carousel-indicator-active-background-color: var(--ti-base-color-transparent); + --ti-carousel-indicator-active-button-width: var(--ti-carousel-indicator-button-width); + --ti-carousel-indicator-active-border-radius: var(--ti-carousel-indicators-border-radius); + --ti-carousel-indicator-active-transition: none; + --ti-carousel-outside-button-bg-color: var(--ti-base-color-dark); + --ti-carousel-outside-button-active-bg-color: var(--ti-base-color-secondary); + --ti-carousel-labels-button-font-size: var(--ti-common-font-size-base); + --ti-carousel-hover-opacity: 0.6; +} diff --git a/packages/theme/src/cascader-menu/index.js b/packages/theme/src/cascader-menu/index.js new file mode 100644 index 000000000..c8c97f708 --- /dev/null +++ b/packages/theme/src/cascader-menu/index.js @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-cascader-menu-text-color': '#333', + 'tiny-cascader-menu-border-color': '#e4e7ed', + 'tiny-cascader-menu-empty-text-color': '#c0c4cc', + 'tiny-cascader-menu-list-padding-vertical': '0', + 'tiny-cascader-menu-list-padding-horizontal': '0', + 'tiny-cascader-menu-width': '180px' +} diff --git a/packages/theme/src/cascader-menu/index.less b/packages/theme/src/cascader-menu/index.less new file mode 100644 index 000000000..d9f50a29e --- /dev/null +++ b/packages/theme/src/cascader-menu/index.less @@ -0,0 +1,65 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@cascader-menu-prefix-cls: ~'@{css-prefix}cascader-menu'; +@cascader-node-prefix-cls: ~'@{css-prefix}cascader-node'; + +.@{cascader-menu-prefix-cls} { + .component-css-vars-cascader-menu(); + + min-width: var(--ti-cascader-menu-width); + box-sizing: border-box; + color: var(--ti-cascader-menu-text-color); + border-right: solid 1px var(--ti-cascader-menu-border-color); + + &:last-child { + border-right: none; + + .@{cascader-node-prefix-cls} { + padding-right: 20px; + } + } + + & &__wrap { + height: 204px; + } + + & &__list { + position: relative; + min-height: 100%; + margin: 0; + list-style: none; + box-sizing: border-box; + padding: var(--ti-cascader-menu-list-padding-vertical) var(--ti-cascader-menu-list-padding-horizontal); + } + + &__hover-zone { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + pointer-events: none; + } + + &__empty-text { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + text-align: center; + color: var(--ti-cascader-menu-empty-text-color); + } +} diff --git a/packages/theme/src/cascader-menu/vars.less b/packages/theme/src/cascader-menu/vars.less new file mode 100644 index 000000000..d1fa793cc --- /dev/null +++ b/packages/theme/src/cascader-menu/vars.less @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-cascader-menu() { + --ti-cascader-menu-text-color: var(--ti-base-color-info-normal); + --ti-cascader-menu-border-color: #e4e7ed; + --ti-cascader-menu-empty-text-color: #c0c4cc; + --ti-cascader-menu-list-padding-vertical: 0; + --ti-cascader-menu-list-padding-horizontal: 0; + --ti-cascader-menu-width: 180px; +} diff --git a/packages/theme/src/cascader-node/index.js b/packages/theme/src/cascader-node/index.js new file mode 100644 index 000000000..fbaaec3a6 --- /dev/null +++ b/packages/theme/src/cascader-node/index.js @@ -0,0 +1,25 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-cascader-node-hover-bg-color': '#e6f7ff', + 'tiny-cascader-node-hover-text-color': '#5e7ce0', + 'tiny-cascader-node-text-color': '#fff', + 'tiny-cascader-node-selectable-text-color': '#606266', + 'tiny-cascader-node-selectable-hover-bg-color': '#f5f5f5', + 'tiny-cascader-node-disabled-text-color': '#999', + 'tiny-cascader-node-disabled-bg-color': '#999', + 'tiny-cascader-node-icon-font-size': '14px', + 'tiny-cascader-node-icon-color': '#bfbfbf', + 'tiny-cascader-node-label-padding-vertical': '0', + 'tiny-cascader-node-label-padding-horizontal': '10px' +} diff --git a/packages/theme/src/cascader-node/index.less b/packages/theme/src/cascader-node/index.less new file mode 100644 index 000000000..47819f2b2 --- /dev/null +++ b/packages/theme/src/cascader-node/index.less @@ -0,0 +1,102 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@cascader-node-prefix-cls: ~'@{css-prefix}cascader-node'; +@radio-prefix-cls: ~'@{css-prefix}radio'; +@checkbox-prefix-cls: ~'@{css-prefix}checkbox'; + +.@{cascader-node-prefix-cls} { + .component-css-vars-cascader-node(); + + &.is-selectable.in-active-path { + color: var(--ti-cascader-node-text-color); + } + + &.in-active-path, + &.is-active { + background: var(--ti-cascader-node-selectable-hover-bg-color); + color: var(--ti-cascader-node-selectable-text-color); + &, + &:hover { + background: var(--ti-cascader-node-selectable-hover-bg-color); + } + } + + &:not(.is-disabled):not(.in-active-path):not(.is-active) { + &:focus, + &:hover { + background: var(--ti-cascader-node-hover-bg-color); + color: var(--ti-cascader-node-hover-text-color); + } + } + + &:not(.is-disabled) { + cursor: pointer; + } + + &.is-disabled { + color: var(--ti-cascader-node-disabled-text-color); + fill: var(--ti-cascader-node-disabled-text-color); + background-color: var(--ti-cascader-node-disabled-bg-color); + cursor: not-allowed; + } + + &__prefix, + &__postfix { + font-size: var(--ti-cascader-node-icon-font-size); + fill: var(--ti-cascader-node-icon-color); + } + + &__prefix { + position: absolute; + left: 10px; + top: 50%; + transform: translateY(-50%); + display: var(--ti-cascader-node-prefix-display) !important; + } + + &__postfix { + position: absolute; + top: 50%; + right: 10px; + transform: translateY(-50%); + } + + &__label { + max-width: 360px; + flex: 1; + flex-basis: auto\9; + padding: var(--ti-cascader-node-label-padding-vertical) var(--ti-cascader-node-label-padding-horizontal); + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + + // 兼容ie10-ie11 + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + flex-basis: auto; + } + } + + & > .@{radio-prefix-cls} { + margin-right: var(--ti-common-space-base); + .@{radio-prefix-cls}__label { + padding-left: 0; + } + } + + & > .@{checkbox-prefix-cls} { + margin-right: var(--ti-common-space-base); + } +} diff --git a/packages/theme/src/cascader-node/vars.less b/packages/theme/src/cascader-node/vars.less new file mode 100644 index 000000000..a6ac2e485 --- /dev/null +++ b/packages/theme/src/cascader-node/vars.less @@ -0,0 +1,26 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-cascader-node() { + --ti-cascader-node-hover-bg-color: var(--ti-base-color-brand-1); + --ti-cascader-node-hover-text-color: var(--ti-base-color-brand-6); + --ti-cascader-node-text-color: var(--ti-base-color-white); + --ti-cascader-node-selectable-hover-bg-color: var(--ti-base-color-selected-background); + --ti-cascader-node-selectable-text-color: var(--ti-base-color-selected-text-color); + --ti-cascader-node-disabled-text-color: var(--ti-base-color-placeholder); + --ti-cascader-node-disabled-bg-color: var(--ti-base-color-placeholder); + --ti-cascader-node-icon-font-size: var(--ti-common-font-size-1); + --ti-cascader-node-icon-color: #bfbfbf; + --ti-cascader-node-prefix-display: 'inline-block'; + --ti-cascader-node-label-padding-vertical: 0; + --ti-cascader-node-label-padding-horizontal: 10px; +} diff --git a/packages/theme/src/cascader-panel/index.js b/packages/theme/src/cascader-panel/index.js new file mode 100644 index 000000000..c363d66aa --- /dev/null +++ b/packages/theme/src/cascader-panel/index.js @@ -0,0 +1,22 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-cascader-panel-border-radius': '2px', + 'tiny-cascader-panel-border-color': '#d9d9d9', + 'tiny-cascader-panel-font-size': '12px', + 'tiny-cascader-panel-node-height': '30px', + 'tiny-cascader-panel-node-margin-top': '0', + 'tiny-cascader-panel-node-label-padding-vertical': '0', + 'tiny-cascader-panel-node-label-padding-right': '30px', + 'tiny-cascader-panel-node-label-padding-left': '20px' +} diff --git a/packages/theme/src/cascader-panel/index.less b/packages/theme/src/cascader-panel/index.less new file mode 100644 index 000000000..a6d33f99e --- /dev/null +++ b/packages/theme/src/cascader-panel/index.less @@ -0,0 +1,43 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@cascader-panel-prefix-cls: ~'@{css-prefix}cascader-panel'; +@cascader-node-prefix-cls: ~'@{css-prefix}cascader-node'; + +.@{cascader-panel-prefix-cls} { + .component-css-vars-cascader-panel(); + + display: flex; + border-radius: var(--ti-cascader-panel-border-radius); + font-size: var(--ti-cascader-panel-font-size); + + &.is-bordered { + border: 1px solid var(--ti-cascader-panel-border-color); + border-radius: var(--ti-cascader-panel-border-radius); + } + + .@{cascader-node-prefix-cls} { + position: relative; + display: flex; + align-items: center; + padding: var(--ti-cascader-panel-node-label-padding-vertical) var(--ti-cascader-panel-node-label-padding-right) + var(--ti-cascader-panel-node-label-padding-vertical) var(--ti-cascader-panel-node-label-padding-left); + height: var(--ti-cascader-panel-node-height); + line-height: var(--ti-cascader-panel-node-height); + outline: 0; + border-radius: var(--ti-common-border-radius-normal); + margin-top: var(--ti-cascader-panel-node-margin-top); + } +} diff --git a/packages/theme/src/cascader-panel/vars.less b/packages/theme/src/cascader-panel/vars.less new file mode 100644 index 000000000..e90d1f7d0 --- /dev/null +++ b/packages/theme/src/cascader-panel/vars.less @@ -0,0 +1,22 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-cascader-panel() { + --ti-cascader-panel-border-radius: var(--ti-common-border-radius-normal); + --ti-cascader-panel-border-color: var(--ti-base-color-border); + --ti-cascader-panel-font-size: var(--ti-common-font-size-base); + --ti-cascader-panel-node-height: var(--ti-base-size-height-minor); + --ti-cascader-panel-node-margin-top: 0; + --ti-cascader-panel-node-label-padding-vertical: 0; + --ti-cascader-panel-node-label-padding-right: 30px; + --ti-cascader-panel-node-label-padding-left: 20px; +} diff --git a/packages/theme/src/cascader/index.js b/packages/theme/src/cascader/index.js new file mode 100644 index 000000000..6fc984ba0 --- /dev/null +++ b/packages/theme/src/cascader/index.js @@ -0,0 +1,41 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-cascader-font-size': '14px', + 'tiny-cascader-hover-border-color': '#c0c4cc', + 'tiny-cascader-focus-border-color': '#40a9ff', + 'tiny-cascader-border-radius': '4px', + 'tiny-cascader-icon-color': '#909399', + 'tiny-cascader-medium-font-size': '14px', + 'tiny-cascader-medium-line-height': '36px', + 'tiny-cascader-small-font-size': '13px', + 'tiny-cascader-small-line-height': '32px', + 'tiny-cascader-mini-font-size': '12px', + 'tiny-cascader-mini-line-height': '28px', + 'tiny-cascader-disabled-text-color': '#c0c4cc', + 'tiny-cascader-dropdown-bg-color': '#fff', + 'tiny-cascader-dropdown-border-color': '#e4e7ed', + 'tiny-cascader-tag-bg-color': '#f0f2f5', + 'tiny-cascader-tag-icon-bg-color': '#c0c4cc', + 'tiny-cascader-tag-icon-color': '#fff', + 'tiny-cascader-tag-icon-hover-bg-color': '#909399', + 'tiny-cascader-list-text-color': '#606266', + 'tiny-cascader-item-height': '30px', + 'tiny-cascader-item-hover-bg-color': '#f5f7fa', + 'tiny-cascader-item-checked-text-color': '#40a9ff', + 'tiny-cascader-empty-text-color': '#c0c4cc', + 'tiny-cascader-search-input-text-color': '#333', + 'tiny-cascader-search-input-placeholder-text-color': '#999', + 'tiny-cascader-dropdown-box-shadow': '0 2px 12px 0 rgba(0, 0, 0, 0.1)', + 'tiny-cascader-width': '100%' +} diff --git a/packages/theme/src/cascader/index.less b/packages/theme/src/cascader/index.less new file mode 100644 index 000000000..311a15c73 --- /dev/null +++ b/packages/theme/src/cascader/index.less @@ -0,0 +1,241 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +@cascader-prefix-cls: ~'@{css-prefix}cascader'; +@input-prefix-cls: ~'@{css-prefix}input'; +@tag-prefix-cls: ~'@{css-prefix}tag'; + +.@{cascader-prefix-cls} { + .component-css-vars-cascader(); + + display: inline-block; + position: relative; + font-size: var(--ti-cascader-font-size); + + &:not(.is-disabled):hover { + .@{input-prefix-cls}__inner { + cursor: pointer; + border-color: var(--ti-cascader-hover-border-color); + } + } + + .@{input-prefix-cls} { + cursor: pointer; + + .@{input-prefix-cls}__inner { + text-overflow: ellipsis; + + &:focus { + border-color: var(--ti-cascader-focus-border-color); + } + } + + &.is-focus .@{input-prefix-cls}__inner { + border-color: var(--ti-cascader-focus-border-color); + } + + .@{css-prefix}icon-arrow-down { + transition: transform 0.3s; + font-size: var(--ti-cascader-font-size); + + &.is-reverse { + transform: rotateZ(180deg); + } + } + + .@{css-prefix}icon-circle-close:hover { + color: var(--ti-cascader-icon-color); + } + } + + &--medium { + font-size: var(--ti-cascader-medium-font-size); + line-height: var(--ti-cascader-medium-line-height); + } + + &--small { + font-size: var(--ti-cascader-small-font-size); + line-height: var(--ti-cascader-small-line-height); + } + + &--mini { + font-size: var(--ti-cascader-mini-font-size); + line-height: var(--ti-cascader-mini-line-height); + } + + &.is-disabled { + .@{cascader-prefix-cls}__label { + z-index: 2; + color: var(--ti-cascader-disabled-text-color); + } + } + + &__dropdown { + .component-css-vars-cascader(); + + margin: 5px 0; + font-size: var(--ti-cascader-font-size); + background: var(--ti-cascader-dropdown-bg-color); + border: 1px solid var(--ti-cascader-dropdown-border-color); + border-radius: var(--ti-cascader-border-radius); + box-shadow: var(--ti-cascader-dropdown-box-shadow); + &.is-auto-size { + background: transparent; + border: none; + box-shadow: none; + .@{cascader-prefix-cls}-panel { + justify-content: flex-start; + align-items: flex-start; + } + .@{cascader-prefix-cls}-menu { + border: 1px solid #e4e7ed; + background: #fff; + &:not(:first-child) { + margin-left: -1px; + } + .@{cascader-prefix-cls}-menu__wrap { + height: auto; + padding-bottom: 6px; + max-height: 220px; + } + } + } + } + + &__tags { + position: absolute; + left: 0; + right: 30px; + top: 50%; + transform: translateY(-50%); + display: flex; + flex-wrap: wrap; + line-height: normal; + text-align: left; + box-sizing: border-box; + + .@{tag-prefix-cls} { + display: inline-flex; + align-items: center; + max-width: 100%; + margin: 2px 0 2px 6px; + text-overflow: ellipsis; + background: var(--ti-cascader-tag-bg-color); + + &:not(.is-hit) { + border-color: transparent; + } + + & > span { + flex: 1; + overflow: hidden; + text-overflow: ellipsis; + + // 兼容ie10-ie11 + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + flex-basis: auto; + } + } + + .@{tag-prefix-cls}__close { + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + flex-shrink: 0; + } + } + + .@{css-prefix}icon-close { + flex: none; + background-color: var(--ti-cascader-tag-icon-bg-color); + color: var(--ti-cascader-tag-icon-color); + + &:hover { + background-color: var(--ti-cascader-tag-icon-hover-bg-color); + } + } + } + } + + &__suggestion-panel { + border-radius: var(--ti-cascader-border-radius); + } + + &__suggestion-list { + max-height: 204px; + margin: 0; + padding: 6px 0; + font-size: var(--ti-cascader-font-size); + color: var(--ti-cascader-list-text-color); + text-align: center; + } + + &__suggestion-panel &__suggestion-item { + display: flex; + justify-content: space-between; + align-items: center; + height: var(--ti-cascader-item-height); + padding: 0 8px; + font-size: var(--ti-common-font-size-base); + color: var(--ti-cascader-search-input-text-color); + text-align: left; + outline: 0; + cursor: pointer; + + &:focus, + &:hover { + background: var(--ti-cascader-item-hover-bg-color); + } + + &.is-checked { + color: var(--ti-cascader-item-checked-text-color); + font-weight: 700; + + .icon-check { + fill: var(--ti-cascader-item-checked-text-color); + } + } + + & > span { + margin-right: 10px; + } + } + + &__empty-text { + margin: 10px 0; + color: var(--ti-cascader-empty-text-color); + } + + &__search-input { + flex: 1; + height: 24px; + min-width: 60px; + margin-left: 2px; + padding-left: 8px; + color: var(--ti-cascader-search-input-text-color); + font-size: var(--ti-common-font-size-base); + border: none; + outline: 0; + box-sizing: border-box; + } + + &__search-input { + .placeholder( + @color: var(--ti-cascader-search-input-placeholder-text-color) + ); + } +} +.@{cascader-prefix-cls}-multiple { + width: var(--ti-cascader-width); +} diff --git a/packages/theme/src/cascader/vars.less b/packages/theme/src/cascader/vars.less new file mode 100644 index 000000000..f8a5c7485 --- /dev/null +++ b/packages/theme/src/cascader/vars.less @@ -0,0 +1,41 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-cascader() { + --ti-cascader-font-size: var(--ti-common-font-size-1); + --ti-cascader-hover-border-color: var(--ti-base-color-common-5); + --ti-cascader-focus-border-color: var(--ti-base-color-brand-6); + --ti-cascader-border-radius: var(--ti-common-border-radius-1); + --ti-cascader-icon-color: #909399; + --ti-cascader-medium-font-size: var(--ti-common-font-size-1); + --ti-cascader-medium-line-height: 36px; + --ti-cascader-small-line-height: 32px; + --ti-cascader-mini-line-height: 28px; + --ti-cascader-small-font-size: 13px; + --ti-cascader-mini-font-size: var(--ti-common-font-size-base, 12px); + --ti-cascader-disabled-text-color: #c0c4cc; + --ti-cascader-dropdown-bg-color: var(--ti-base-color-light); + --ti-cascader-dropdown-border-color: #e4e7ed; + --ti-cascader-tag-bg-color: #f0f2f5; + --ti-cascader-tag-icon-bg-color: #c0c4cc; + --ti-cascader-tag-icon-color: var(--ti-base-color-light); + --ti-cascader-tag-icon-hover-bg-color: #909399; + --ti-cascader-list-text-color: #606266; + --ti-cascader-item-height: var(--ti-base-size-height-minor); + --ti-cascader-item-hover-bg-color: #f5f7fa; + --ti-cascader-item-checked-text-color: var(--ti-base-color-brand-5); + --ti-cascader-empty-text-color: #c0c4cc; + --ti-cascader-search-input-text-color: var(--ti-base-color-info-normal); + --ti-cascader-search-input-placeholder-text-color: var(--ti-base-color-placeholder); + --ti-cascader-dropdown-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); + --ti-cascader-width: '100%'; +} diff --git a/packages/theme/src/chart-core/index.js b/packages/theme/src/chart-core/index.js new file mode 100644 index 000000000..06ee9dc7f --- /dev/null +++ b/packages/theme/src/chart-core/index.js @@ -0,0 +1,17 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-chart-core-data-empty-text-color': '#888', + 'tiny-chart-core-data-empty-font-size': '14px', + 'tiny-chart-core-data-empty-bg-color': 'rgba(255, 255, 255, 0.9)' +} diff --git a/packages/theme/src/chart-core/index.less b/packages/theme/src/chart-core/index.less new file mode 100644 index 000000000..c82f1b7e7 --- /dev/null +++ b/packages/theme/src/chart-core/index.less @@ -0,0 +1,88 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@chart-prefix-cls: ~'@{css-prefix}chart'; + +.@{chart-prefix-cls} { + .component-css-vars-chart-core(); + + &-data-empty { + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; + display: flex; + justify-content: center; + align-items: center; + background-color: var(--ti-chart-core-data-empty-bg-color); + color: var(--ti-chart-core-data-empty-text-color); + font-size: var(--ti-chart-core-data-empty-font-size); + } + + &-component-loading { + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; + display: flex; + justify-content: center; + align-items: center; + background-color: var(--ti-chart-core-data-empty-bg-color); + + .circular { + width: 42px; + height: 42px; + animation: loading-rotate 2s linear infinite; + } + + .path { + animation: loading-dash 1.5s ease-in-out infinite; + stroke-dasharray: 90, 150; + stroke-dashoffset: 0; + stroke-width: 2; + stroke: #20a0ff; + stroke-linecap: round; + } + } + + &-mask-status { + filter: blur(1px); + } +} + +@keyframes loading-rotate { + 100% { + transform: rotate(360deg); + } +} + +@keyframes loading-dash { + 0% { + stroke-dasharray: 1, 200; + stroke-dashoffset: 0; + } + + 50% { + stroke-dasharray: 90, 150; + stroke-dashoffset: -40px; + } + + 100% { + stroke-dasharray: 90, 150; + stroke-dashoffset: -120px; + } +} diff --git a/packages/theme/src/chart-core/vars.less b/packages/theme/src/chart-core/vars.less new file mode 100644 index 000000000..74d80a5cb --- /dev/null +++ b/packages/theme/src/chart-core/vars.less @@ -0,0 +1,17 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-chart-core() { + --ti-chart-core-data-empty-text-color: #888; + --ti-chart-core-data-empty-font-size: var(--ti-common-font-size-1); + --ti-chart-core-data-empty-bg-color: rgba(255, 255, 255, 0.9); +} diff --git a/packages/theme/src/checkbox-button/index.js b/packages/theme/src/checkbox-button/index.js new file mode 100644 index 000000000..e54f7baf2 --- /dev/null +++ b/packages/theme/src/checkbox-button/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // checkbox-button +} diff --git a/packages/theme/src/checkbox-button/index.less b/packages/theme/src/checkbox-button/index.less new file mode 100644 index 000000000..931a8483e --- /dev/null +++ b/packages/theme/src/checkbox-button/index.less @@ -0,0 +1,131 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../custom.less'; +@import '../checkbox/vars.less'; + +@checkbox-button-prefix-cls: ~'@{css-prefix}checkbox-button'; + +.@{checkbox-button-prefix-cls} { + .component-css-vars-checkbox(); + position: relative; + display: inline-block; + + &:first-child &__inner { + border-radius: var(--ti-common-border-radius-normal) 0 0 var(--ti-common-border-radius-normal); + } + + &:last-child &__inner { + border-radius: 0 var(--ti-common-border-radius-normal) var(--ti-common-border-radius-normal) 0; + } + + &.is-checked { + .@{checkbox-button-prefix-cls}__inner { + color: var(--ti-checkbox-button-checked-text-color); + border-color: var(--ti-checkbox-button-checked-border-color); + box-shadow: -1px 0 0 0 var(--ti-checkbox-shadow-color); + } + + &:first-child .@{checkbox-button-prefix-cls}__inner { + border-left-color: var(--ti-checkbox-button-checked-border-color); + box-shadow: none; + } + } + + &.is-disabled { + .@{checkbox-button-prefix-cls}__inner { + color: var(--ti-checkbox-button-disabled-text-color); + cursor: not-allowed; + background-image: none; + background-color: var(--ti-checkbox-button-disabled-bg-color); + border-color: var(--ti-checkbox-border-color); + box-shadow: none; + } + + &:first-child .@{checkbox-button-prefix-cls}__inner { + border-left-color: var(--ti-checkbox-border-color); + } + } + + &__inner { + position: relative; + display: inline-block; + white-space: nowrap; + vertical-align: middle; + outline: 0; + line-height: 1; + font-weight: 500; + cursor: pointer; + background: var(--ti-checkbox-button-bg-color); + border-left: 0; + border: 1px solid #e9edfa; + color: var(--ti-checkbox-button-text-color); + appearance: none; + text-align: center; + box-sizing: border-box; + margin: 0 2px; + transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); + padding: 12px 20px; + font-size: var(--ti-common-font-size-2); + min-width: 80px; + border-radius: 0; + .user-select(none); + + &.is-round { + padding: 12px 20px; + } + + &:hover { + background: var(--ti-checkbox-bg-color-hover); + color: var(--ti-checkbox-button-hover-text-color); + } + } + + &__original { + opacity: 0; + outline: 0; + position: absolute; + margin: 0; + z-index: -1; + } + + &--medium &__inner { + padding: 10px 20px; + font-size: var(--ti-common-font-size-1); + border-radius: 0; + + &.is-round { + padding: 10px 20px; + } + } + + &--small &__inner { + padding: 8px 15px; + font-size: var(--ti-common-font-size-base); + border-radius: 0; + + &.is-round { + padding: 8px 15px; + } + } + + &--mini &__inner { + padding: 5px 15px; + font-size: var(--ti-common-font-size-base); + border-radius: 0; + + &.is-round { + padding: 5px 15px; + } + } +} diff --git a/packages/theme/src/checkbox-group/index.js b/packages/theme/src/checkbox-group/index.js new file mode 100644 index 000000000..59e667756 --- /dev/null +++ b/packages/theme/src/checkbox-group/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // +} diff --git a/packages/theme/src/checkbox-group/index.less b/packages/theme/src/checkbox-group/index.less new file mode 100644 index 000000000..cd836e619 --- /dev/null +++ b/packages/theme/src/checkbox-group/index.less @@ -0,0 +1,59 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import '../checkbox/vars.less'; + +@checkbox-group-prefix-cls: ~'@{css-prefix}checkbox-group'; +@checkbox-button-prefix-cls: ~'@{css-prefix}checkbox-button'; +@checkbox-prefix-cls: ~'@{css-prefix}checkbox'; + +.@{checkbox-group-prefix-cls} { + .component-css-vars-checkbox(); + display: flex; + + &.is-vertical { + display: inline-block; + + .@{checkbox-prefix-cls} { + display: flex; + margin-right: 0; + + &:not(:last-child) { + margin-bottom: 8px; + } + } + + .@{checkbox-button-prefix-cls} { + display: block; + + &:first-child .@{checkbox-button-prefix-cls}__inner { + border-radius: 2px 2px 0 0; + } + + &:last-child .@{checkbox-button-prefix-cls}__inner { + border-radius: 0 0 2px 2px; + } + + &.is-checked .@{checkbox-button-prefix-cls}__inner { + box-shadow: 0 -1px 0 0 var(--ti-checkbox-shadow-color); + border-color: var(--ti-checkbox-button-checked-border-color); + } + + &.is-checked.is-disabled .@{checkbox-button-prefix-cls}__inner { + box-shadow: 0 -1px 0 0 var(--ti-checkbox-border-color); + border-color: var(--ti-checkbox-border-color); + background: var(--ti-checkbox-disabled-bg-color); + } + } + } +} diff --git a/packages/theme/src/checkbox/index.js b/packages/theme/src/checkbox/index.js new file mode 100644 index 000000000..c9cc30405 --- /dev/null +++ b/packages/theme/src/checkbox/index.js @@ -0,0 +1,40 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-checkbox-text-color': '#333', + 'tiny-checkbox-font-size': '12px', + 'tiny-checkbox-button-bg-color': '#fff', + 'tiny-checkbox-bg-color': '#fff', + 'tiny-checkbox-shadow-color': '#8cc5ff', + 'tiny-checkbox-border-radius': '2px', + 'tiny-checkbox-button-hover-text-color': '#252b3a', + 'tiny-checkbox-hover-text-color': '#40a9ff', + 'tiny-checkbox-button-checked-border-color': '#1890ff', + 'tiny-checkbox-button-disabled-text-color': '#999', + 'tiny-checkbox-button-disabled-bg-color': '#f5f5f5', + 'tiny-checkbox-button-text-color': '#333', + 'tiny-checkbox-button-checked-text-color': '#fff', + 'tiny-checkbox-inner-border-color': '#fff', + 'tiny-checkbox-bg-color-checked': '#5e7ce0', + 'tiny-checkbox-border-color-checked': '#5e7ce0', + 'tiny-checkbox-border-color': '#d9d9d9', + 'tiny-checkbox-border-color-hover': '#5e7ce0', + 'tiny-checkbox-icon-height': '8px', + 'tiny-checkbox-icon-width': '4px', + 'tiny-checkbox-bg-color-disable': '#f5f5f5', + 'tiny-checkbox-border-color-unchecked-disabled': '#dfe1e6', + 'tiny-checkbox-label-text-color-disabled': '#adb0b8', + 'tiny-checkbox-bg-color-hover': '#beccfa', + 'tiny-checkbox-disabled-bg-color': '#f5f5f6', + 'tiny-checkbox-icon-left': '4.5px' +} diff --git a/packages/theme/src/checkbox/index.less b/packages/theme/src/checkbox/index.less new file mode 100644 index 000000000..88f5cab5b --- /dev/null +++ b/packages/theme/src/checkbox/index.less @@ -0,0 +1,243 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../mixins/checkbox.less'; +@import '../custom.less'; +@import './vars.less'; + +@checkbox-prefix-cls: ~'@{css-prefix}checkbox'; + +.@{checkbox-prefix-cls} { + .component-css-vars-checkbox(); + + position: relative; + display: inline-flex; + align-items: center; + color: var(--ti-checkbox-text-color); + font-weight: 500; + font-size: 0; //去除inline-block元素间间距 + white-space: nowrap; + margin-right: 30px; + outline: none; + cursor: pointer; + .user-select(none); + + &:last-of-type { + margin-right: 0; + } + + &.is-bordered { + padding: 9px 20px 9px 10px; + border-radius: 2px; + border: 1px solid var(--ti-checkbox-border-color); + box-sizing: border-box; + line-height: normal; + height: 40px; + + & + & { + margin-left: 10px; + } + + &.is-checked { + border-color: var(--ti-checkbox-button-checked-border-color); + } + + &.is-disabled { + .checkbox-border-disabled(var(--ti-checkbox-bg-color-disable), var(--ti-checkbox-border-color-unchecked-disabled)); + } + + &.@{checkbox-prefix-cls}--medium { + padding: 7px 20px 7px 10px; + border-radius: 4px; + height: 36px; + + .@{checkbox-prefix-cls}__label { + line-height: 17px; + font-size: var(--ti-common-font-size-1); + } + + .@{checkbox-prefix-cls}__inner { + height: 14px; + width: 14px; + } + } + + &.@{checkbox-prefix-cls}--small { + padding: 5px 15px 5px 10px; + border-radius: 3px; + height: 32px; + + .@{checkbox-prefix-cls}__label { + line-height: 15px; + font-size: var(--ti-common-font-size-base); + } + + .@{checkbox-prefix-cls}__inner { + height: 12px; + width: 12px; + + &::after { + height: 6px; + width: 2px; + } + } + } + + &.@{checkbox-prefix-cls}--mini { + padding: 3px 15px 3px 10px; + border-radius: 3px; + height: 28px; + + .@{checkbox-prefix-cls}__label { + line-height: 12px; + font-size: var(--ti-common-font-size-base); + } + + .@{checkbox-prefix-cls}__inner { + height: 12px; + width: 12px; + + &::after { + height: 6px; + width: 2px; + } + } + } + } + + &__input { + position: relative; + display: inline-block; + white-space: nowrap; + vertical-align: middle; + outline: 0; + line-height: 1; + cursor: pointer; + + // 兼容ie10-ie11 + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + display: inline-block; + } + + // 兼容edge + @supports (-ms-ime-align: auto) { + display: inline-block; + } + + .@{checkbox-prefix-cls}__inner { + svg { + fill: var(--ti-checkbox-border-color); + } + + &:hover { + svg { + fill: var(--ti-checkbox-button-hover-text-color); + } + } + } + + &.is-disabled { + .checkbox-input-disabled(var(--ti-checkbox-label-text-color-disabled), var(--ti-checkbox-bg-color-disable), var(--ti-checkbox-border-color-unchecked-disabled)); + } + + &.is-checked { + .@{checkbox-prefix-cls}__inner::after { + transform: rotate(45deg) scaleY(1); + } + } + + &.is-indeterminate { + .@{checkbox-prefix-cls}__inner::before { + content: ''; + position: absolute; + display: block; + border-radius: 1px; + background-color: #fff; + height: 6px; + width: 6px; + left: 0; + right: 0; + top: 0; + bottom: 0; + margin: auto; + } + + .@{checkbox-prefix-cls}__inner::after { + display: none; + } + } + + &.is-checked, + &.is-indeterminate { + .@{checkbox-prefix-cls}__inner { + background-color: var(--ti-checkbox-bg-color-checked); + border-color: var(--ti-checkbox-border-color-checked); + + &:hover { + background-color: var(--ti-checkbox-bg-color-checked); + border-color: var(--ti-checkbox-border-color-checked); + } + } + } + } + + &__inner { + display: inline-block; + position: relative; + border: 1px solid var(--ti-checkbox-border-color); + border-radius: var(--ti-common-border-radius-normal); + box-sizing: border-box; + width: 16px; + height: 16px; + background-color: var(--ti-checkbox-bg-color); + outline: none; + z-index: 1; + transition: border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46), background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46); + + &:hover { + border-color: var(--ti-checkbox-border-color-hover); + } + + &::after { + box-sizing: content-box; + content: ''; + border: 1px solid #fff; + border-width: 0 2px 2px 0; + border-left: 0; + border-top: 0; + height: var(--ti-checkbox-icon-height); + width: var(--ti-checkbox-icon-width); + position: absolute; + left: var(--ti-checkbox-icon-left); + top: var(--ti-checkbox-icon-top); + transform: rotate(45deg) scaleY(0); + transition: transform 0.15s ease-in 0.05s; + transform-origin: center; + } + } + + &__original { + opacity: 0; + outline: 0; + position: absolute; + margin: 0; + width: 0; + height: 0; + z-index: -1; + } + + &__label { + padding-left: 8px; + font-size: var(--ti-checkbox-font-size); + } +} diff --git a/packages/theme/src/checkbox/vars.less b/packages/theme/src/checkbox/vars.less new file mode 100644 index 000000000..918a96895 --- /dev/null +++ b/packages/theme/src/checkbox/vars.less @@ -0,0 +1,40 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-checkbox() { + --ti-checkbox-text-color: var(--ti-base-color-info-normal); + --ti-checkbox-font-size: var(--ti-common-font-size-base); + --ti-checkbox-button-bg-color: var(--ti-base-color-brand-2); + --ti-checkbox-bg-color: var(--ti-base-color-white); + --ti-checkbox-shadow-color: #dfe1e6; + --ti-checkbox-border-radius: var(--ti-common-border-radius-normal); + --ti-checkbox-button-hover-text-color: var(--ti-base-color-common-7); + --ti-checkbox-button-checked-border-color: var(--ti-base-color-brand-6); + --ti-checkbox-button-disabled-text-color: var(--ti-base-color-placeholder); + --ti-checkbox-disabled-bg-color: var(--ti-base-color-bg-5); + --ti-checkbox-button-disabled-bg-color: var(--ti-base-color-bg-5); + --ti-checkbox-button-text-color: var(--ti-base-color-info-normal); + --ti-checkbox-button-checked-text-color: var(--ti-base-color-info-normal); + --ti-checkbox-inner-border-color: var(--ti-base-color-light); + --ti-checkbox-bg-color-checked: var(--ti-base-color-brand-6); + --ti-checkbox-border-color-checked: var(--ti-base-color-brand-6); + --ti-checkbox-border-color: var(--ti-common-color-line-normal); + --ti-checkbox-border-color-hover: var(--ti-base-color-brand-6); + --ti-checkbox-icon-height: 8px; + --ti-checkbox-icon-width: 4px; + --ti-checkbox-icon-left: 4.5px; + --ti-checkbox-icon-top: 0; + --ti-checkbox-bg-color-disable: var(--ti-base-color-bg-5); + --ti-checkbox-border-color-unchecked-disabled: var(--ti-base-color-common-1); + --ti-checkbox-label-text-color-disabled: var(--ti-base-color-common-2); + --ti-checkbox-bg-color-hover: var(--ti-base-color-brand-3); +} diff --git a/packages/theme/src/col/index.js b/packages/theme/src/col/index.js new file mode 100644 index 000000000..d8ec171f0 --- /dev/null +++ b/packages/theme/src/col/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // col +} diff --git a/packages/theme/src/col/index.less b/packages/theme/src/col/index.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/col/index.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/collapse-item/index.js b/packages/theme/src/collapse-item/index.js new file mode 100644 index 000000000..a363ff31d --- /dev/null +++ b/packages/theme/src/collapse-item/index.js @@ -0,0 +1,32 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-collapse-item-text-color': '#333', + 'tiny-collapse-item-icon-color': '#575d6c', + 'tiny-collapse-item-bg-color': '#fff', + 'tiny-collapse-item-wrap-bg-color': '#fff', + 'tiny-collapse-item-border-color': '#d9d9d9', + 'tiny-collapse-item-disabled-text-color': '#bfbfbf', + 'tiny-collapse-item-header-font-size': '14px', + 'tiny-collapse-item-header-focus-text-color': '#40a9ff', + 'tiny-collapse-item-arrow-font-size': '12px', + 'tiny-collapse-item-arrow-hover-text-color': '#1890ff', + 'tiny-collapse-item-content-font-size': '12px', + 'tiny-collapse-item-header-bg-color': '#f2f5fc', + 'tiny-collapse-item-margin-top': '8px', + 'tiny-collapse-item-border-radius': '2px', + 'tiny-collapse-item-icon-font-size': '16px', + 'tiny-collapse-item-header-padding-vertical': '0', + 'tiny-collapse-item-header-padding-horizontal': '16px', + 'tiny-collapse-item-content-border-color-top': '#dfe1e6', +} diff --git a/packages/theme/src/collapse-item/index.less b/packages/theme/src/collapse-item/index.less new file mode 100644 index 000000000..f186b5503 --- /dev/null +++ b/packages/theme/src/collapse-item/index.less @@ -0,0 +1,99 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@collapse-item-prefix-cls: ~'@{css-prefix}collapse-item'; + +.@{collapse-item-prefix-cls} { + .component-css-vars-collapse-item(); + + margin-top: var(--ti-collapse-item-margin-top); + background-color: var(--ti-collapse-item-bg-color); + border: 1px solid var(--ti-collapse-item-border-color); + border-radius: var(--ti-collapse-item-border-radius); + + &:last-child { + margin-bottom: -1px; + } + + &.is-disabled &__header { + color: var(--ti-collapse-item-disabled-text-color); + cursor: not-allowed; + } + + &.is-disabled &__arrow { + fill: var(--ti-collapse-item-disabled-text-color); + } + + &__header { + display: flex; + align-items: center; + height: 34px; + line-height: 34px; + background-color: var(--ti-collapse-item-header-bg-color); + color: var(--ti-collapse-item-text-color); + font-size: var(--ti-collapse-item-header-font-size); + font-family: Helvetica, Arial, 'microsoft yahei'; + outline: 0; + cursor: pointer; + transition: border-bottom-color 0.3s; + border-radius: var(--ti-common-border-radius-normal); + padding: var(--ti-collapse-item-header-padding-vertical) var(--ti-collapse-item-header-padding-horizontal); + + &.focusing:focus:not(:hover) { + color: var(--ti-collapse-item-header-focus-text-color); + } + + &.is-active { + border-bottom-color: transparent; + } + + svg { + font-size: var(--ti-collapse-item-icon-font-size); + fill: var(--ti-collapse-item-icon-color); + } + } + + &__arrow { + font-size: var(--ti-collapse-item-arrow-font-size); + margin-right: 12px; + order: -1; + transition: transform 0.3s; + transform: rotate(90deg); + + &.is-active { + transform: rotate(-90deg); + } + + &:hover, + &.is-active { + fill: var(--ti-collapse-item-arrow-hover-text-color); + } + } + + &__wrap { + will-change: height; + background-color: var(--ti-collapse-item-wrap-bg-color); + overflow: hidden; + box-sizing: border-box; + } + + &__content { + padding: 12px 16px; + font-size: var(--ti-collapse-item-content-font-size); + color: var(--ti-collapse-item-text-color); + border-top: 1px solid var(--ti-collapse-item-content-border-color-top); + line-height: 1.769230769230769; + } +} diff --git a/packages/theme/src/collapse-item/vars.less b/packages/theme/src/collapse-item/vars.less new file mode 100644 index 000000000..741f1ba0e --- /dev/null +++ b/packages/theme/src/collapse-item/vars.less @@ -0,0 +1,32 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-collapse-item() { + --ti-collapse-item-text-color: var(--ti-base-color-info-normal); + --ti-collapse-item-icon-color: var(--ti-common-color-icon-normal); + --ti-collapse-item-wrap-bg-color: var(--ti-base-color-light); + --ti-collapse-item-disabled-text-color: var(--ti-base-color-placeholder); + --ti-collapse-item-header-font-size: var(--ti-common-font-size-base); + --ti-collapse-item-header-focus-text-color: var(--ti-base-color-brand-5); + --ti-collapse-item-arrow-font-size: var(--ti-common-font-size-base); + --ti-collapse-item-arrow-hover-text-color: var(--ti-base-color-info-normal); + --ti-collapse-item-content-font-size: var(--ti-common-font-size-base); + --ti-collapse-item-header-bg-color: var(--ti-base-color-brand-1); + --ti-collapse-item-margin-top: var(--ti-common-space-2x); + --ti-collapse-item-bg-color: var(--ti-common-color-bg-white-normal); + --ti-collapse-item-border-color: var(--ti-common-color-line-dividing); + --ti-collapse-item-border-radius: var(--ti-common-border-radius-normal); + --ti-collapse-item-icon-font-size: var(--ti-common-font-size-2); + --ti-collapse-item-header-padding-vertical: 0; + --ti-collapse-item-header-padding-horizontal: var(--ti-common-space-4x); + --ti-collapse-item-content-border-color-top: var(--ti-common-color-line-dividing); +} diff --git a/packages/theme/src/collapse/index.js b/packages/theme/src/collapse/index.js new file mode 100644 index 000000000..d8b0040fb --- /dev/null +++ b/packages/theme/src/collapse/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-collapse-border-color': '#d9d9d9' +} diff --git a/packages/theme/src/collapse/index.less b/packages/theme/src/collapse/index.less new file mode 100644 index 000000000..fc2b8a6f6 --- /dev/null +++ b/packages/theme/src/collapse/index.less @@ -0,0 +1,141 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +.@{css-prefix} { + .component-css-vars-collapse(); + + &fade-in-linear-enter-active, + &fade-in-linear-leave-active { + transition: opacity 0.2s linear; + } + + &fade-in-linear-enter, + &fade-in-linear-enter-from, + &fade-in-linear-leave, + &fade-in-linear-leave-from, + &fade-in-linear-leave-active { + opacity: 0; + } + + &fade-in-enter-active, + &fade-in-leave-active { + transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1); + } + + &fade-in-enter, + &fade-in-enter-from, + &fade-in-leave-active { + opacity: 0; + } + + &zoom-in-center-enter-active, + &zoom-in-center-leave-active { + transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1); + } + + &zoom-in-center-enter, + &zoom-in-center-enter-from, + &zoom-in-center-leave-active { + opacity: 0; + transform: scaleX(0); + } + + &zoom-in-top-enter-active, + &zoom-in-top-leave-active { + opacity: 1; + transform: scaleY(1); + transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), + opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1); + transform-origin: center top; + } + + &zoom-in-top-enter, + &zoom-in-top-enter-from, + &zoom-in-top-leave-active { + opacity: 0; + transform: scaleY(0); + } + + &zoom-in-bottom-enter-active, + &zoom-in-bottom-leave-active { + opacity: 1; + transform: scaleY(1); + transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), + opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1); + transform-origin: center bottom; + } + + &zoom-in-bottom-enter, + &zoom-in-left-enter-from, + &zoom-in-bottom-leave-active { + opacity: 0; + transform: scaleY(0); + } + + &zoom-in-left-enter-active, + &zoom-in-left-leave-active { + opacity: 1; + transform: scale(1, 1); + transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), + opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1); + transform-origin: top left; + } + + &zoom-in-left-enter, + &zoom-in-left-enter-from, + &zoom-in-left-leave-active { + opacity: 0; + transform: scale(0.45, 0.45); + } + + &list-enter-active, + &list-leave-active { + transition: all 1s; + } + + &list-enter, + &list-enter-from, + &list-leave-active { + opacity: 0; + transform: translateY(-30px); + } + + &opacity-transition { + transition: opacity 0.3s cubic-bezier(0.55, 0, 0.1, 1); + } +} + +.collapse-transition { + transition: 0.3s height ease-in-out, 0.3s padding-top ease-in-out, + 0.3s padding-bottom ease-in-out; +} + +.horizontal-collapse-transition { + transition: 0.3s width ease-in-out, 0.3s padding-left ease-in-out, + 0.3s padding-right ease-in-out; +} + +.fade-in-linear-enter, +.fade-in-linear-enter-from, +.fade-in-linear-leave, +.fade-in-linear-leave-from, +.fade-in-linear-leave-active { + opacity: 0; +} + +.fade-in-linear-enter-active, +.fade-in-linear-leave-active { + transition: opacity 0.2s linear; +} diff --git a/packages/theme/src/collapse/vars.less b/packages/theme/src/collapse/vars.less new file mode 100644 index 000000000..d65e6f2bc --- /dev/null +++ b/packages/theme/src/collapse/vars.less @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-collapse() { + --ti-collapse-border-color: var(--ti-base-color-border); +} diff --git a/packages/theme/src/company/index.js b/packages/theme/src/company/index.js new file mode 100644 index 000000000..35b67b1b4 --- /dev/null +++ b/packages/theme/src/company/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // company +} diff --git a/packages/theme/src/company/index.less b/packages/theme/src/company/index.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/company/index.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/company/vars.less b/packages/theme/src/company/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/company/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/container/index.js b/packages/theme/src/container/index.js new file mode 100644 index 000000000..418197def --- /dev/null +++ b/packages/theme/src/container/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // container +} diff --git a/packages/theme/src/container/index.less b/packages/theme/src/container/index.less new file mode 100644 index 000000000..0b7eafa03 --- /dev/null +++ b/packages/theme/src/container/index.less @@ -0,0 +1,39 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@container-prefix-cls: ~'@{css-prefix}container'; + +.@{container-prefix-cls} { + & &__header, + & &__aside, + & &__main, + & &__footer { + position: absolute; + box-sizing: border-box; + top: 0; + left: 0; + bottom: 0; + right: 0; + margin: 0; + } + + & &__main { + overflow-y: auto; + } + + & &__footer { + top: auto; + width: auto; + } +} diff --git a/packages/theme/src/country/index.js b/packages/theme/src/country/index.js new file mode 100644 index 000000000..42ea48116 --- /dev/null +++ b/packages/theme/src/country/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // country +} diff --git a/packages/theme/src/country/index.less b/packages/theme/src/country/index.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/country/index.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/country/vars.less b/packages/theme/src/country/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/country/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/credit-card-form/index.js b/packages/theme/src/credit-card-form/index.js new file mode 100644 index 000000000..fdaef75c6 --- /dev/null +++ b/packages/theme/src/credit-card-form/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // credit-card-form +} diff --git a/packages/theme/src/credit-card-form/index.less b/packages/theme/src/credit-card-form/index.less new file mode 100644 index 000000000..559deddb9 --- /dev/null +++ b/packages/theme/src/credit-card-form/index.less @@ -0,0 +1,716 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.credit-card-form { + max-width: 570px; + margin: auto; + width: 100%; + font-family: arial; + + @media screen and (max-width: 576px) { + margin: 0 auto; + } + + &__inner { + background: #fff; + box-shadow: 0 30px 60px 0 rgba(90, 116, 148, 0.4); + border-radius: 10px; + padding: 35px; + padding-top: 180px; + + @media screen and (max-width: 480px) { + padding: 25px; + padding-top: 165px; + } + + @media screen and (max-width: 360px) { + padding: 15px; + padding-top: 165px; + } + } + + &__row { + display: flex; + align-items: flex-start; + + @media screen and (max-width: 480px) { + flex-wrap: wrap; + } + } + + &__col { + flex: auto; + margin-right: 35px; + + &:last-child { + margin-right: 0; + } + + @media screen and (max-width: 480px) { + margin-right: 0; + flex: unset; + width: 100%; + margin-bottom: 20px; + + &:last-child { + margin-bottom: 0; + } + } + + &.-cvv { + max-width: 150px; + + @media screen and (max-width: 480px) { + max-width: initial; + } + } + } + + &__group { + display: flex; + align-items: flex-start; + flex-wrap: wrap; + + .credit-card-input__input { + flex: 1; + margin-right: 15px; + outline: none; + + &:last-child { + margin-right: 0; + } + } + + select::-ms-expand { + display: none; + } + } + + &__button { + width: 100%; + height: 55px; + background: #2364d2; + border: none; + border-radius: 5px; + font-size: 22px; + font-weight: 500; + box-shadow: 3px 10px 20px 0px rgba(35, 100, 210, 0.3); + color: #fff; + margin-top: 20px; + cursor: pointer; + + @media screen and (max-width: 480px) { + margin-top: 10px; + } + } +} + +.credit-card-item { + max-width: 430px; + height: 270px; + margin-left: auto; + margin-right: auto; + position: relative; + z-index: 2; + width: 100%; + + @media screen and (max-width: 480px) { + max-width: 310px; + height: 220px; + width: 90%; + } + + @media screen and (max-width: 360px) { + height: 180px; + } + + &.-active { + .card-item__side { + &.-front { + transform: perspective(1000px) rotateY(180deg) rotateX(0deg) + rotateZ(0deg); + } + + &.-back { + transform: perspective(1000px) rotateY(0) rotateX(0deg) rotateZ(0deg); + } + } + } + + &__focus { + position: absolute; + z-index: 3; + border-radius: 5px; + left: 0; + top: 0; + width: 100%; + height: 100%; + transition: all 0.35s cubic-bezier(0.71, 0.03, 0.56, 0.85); + opacity: 0; + pointer-events: none; + overflow: hidden; + border: 2px solid rgba(255, 255, 255, 0.65); + + &:after { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + background: rgb(8, 20, 47); + height: 100%; + border-radius: 5px; + filter: blur(25px); + opacity: 0.5; + } + + &.-active { + opacity: 1; + } + } + + &__side { + border-radius: 15px; + overflow: hidden; + box-shadow: 0 20px 60px 0 rgba(14, 42, 90, 0.55); + transform: perspective(2000px) rotateY(0deg) rotateX(0deg) rotate(0deg); + transform-style: preserve-3d; + transition: all 0.8s cubic-bezier(0.71, 0.03, 0.56, 0.85); + backface-visibility: hidden; + height: 100%; + + &.-back { + position: absolute; + top: 0; + left: 0; + width: 100%; + transform: perspective(2000px) rotateY(-180deg) rotateX(0deg) rotate(0deg); + z-index: 2; + padding: 0; + height: 100%; + + .card-item__cover { + transform: rotateY(-180deg); + } + } + } + + &__bg { + max-width: 100%; + display: block; + max-height: 100%; + height: 100%; + width: 100%; + object-fit: cover; + } + + &__cover { + height: 100%; + position: absolute; + height: 100%; + background-color: #1c1d27; + background-image: linear-gradient(147deg, #354fce 0%, #0c296b 74%); + left: 0; + top: 0; + width: 100%; + border-radius: 15px; + overflow: hidden; + + &:after { + content: ''; + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + background: rgba(6, 2, 29, 0.45); + } + } + + &__top { + display: flex; + align-items: flex-start; + justify-content: space-between; + margin-bottom: 40px; + padding: 0 10px; + + @media screen and (max-width: 480px) { + margin-bottom: 25px; + } + + @media screen and (max-width: 360px) { + margin-bottom: 15px; + } + } + + &__chip { + width: 60px; + + @media screen and (max-width: 480px) { + width: 50px; + } + + @media screen and (max-width: 360px) { + width: 40px; + } + } + + &__type { + height: 45px; + position: relative; + display: flex; + justify-content: flex-end; + max-width: 100px; + margin-left: auto; + width: 100%; + + @media screen and (max-width: 480px) { + height: 40px; + max-width: 90px; + } + + @media screen and (max-width: 360px) { + height: 30px; + } + } + + &__typeImg { + max-width: 100%; + object-fit: contain; + max-height: 100%; + object-position: top right; + } + + &__info { + color: #fff; + width: 100%; + max-width: calc(100% - 85px); + padding: 10px 15px; + font-weight: 500; + display: block; + + cursor: pointer; + + @media screen and (max-width: 480px) { + padding: 10px; + } + } + + &__holder { + opacity: 0.7; + font-size: 13px; + margin-bottom: 6px; + + @media screen and (max-width: 480px) { + font-size: var(--ti-common-font-size-base); + margin-bottom: 5px; + } + } + + &__wrapper { + padding: 25px 15px; + position: relative; + z-index: 4; + height: 100%; + text-shadow: 7px 6px 10px rgba(14, 42, 90, 0.8); + user-select: none; + + @media screen and (max-width: 480px) { + padding: 20px 10px; + } + } + + &__name { + font-size: var(--ti-common-font-size-3); + line-height: 1; + white-space: nowrap; + max-width: 100%; + overflow: hidden; + text-overflow: ellipsis; + text-transform: uppercase; + + @media screen and (max-width: 480px) { + font-size: var(--ti-common-font-size-2); + } + } + + &__nameItem { + display: inline-block; + min-width: 8px; + position: relative; + } + + &__number { + font-weight: 500; + line-height: 1; + color: #fff; + font-size: 27px; + margin-bottom: 25px; + display: inline-block; + padding: 10px 15px; + cursor: pointer; + + @media screen and (max-width: 480px) { + font-size: 21px; + margin-bottom: 15px; + padding: 10px 10px; + } + + @media screen and (max-width: 360px) { + font-size: 19px; + margin-bottom: 10px; + padding: 10px 10px; + } + } + + &__numberItem { + width: 16px; + display: inline-block; + + &.-active { + width: 30px; + } + + @media screen and (max-width: 480px) { + width: 13px; + + &.-active { + width: 16px; + } + } + + @media screen and (max-width: 360px) { + width: 12px; + + &.-active { + width: 8px; + } + } + } + + &__content { + color: #fff; + display: flex; + align-items: flex-start; + } + + &__date { + flex-wrap: wrap; + font-size: var(--ti-common-font-size-3); + margin-left: auto; + padding: 10px; + display: inline-flex; + width: 80px; + white-space: nowrap; + flex-shrink: 0; + cursor: pointer; + + @media screen and (max-width: 480px) { + font-size: var(--ti-common-font-size-2); + } + } + + &__dateItem { + position: relative; + + span { + width: 22px; + display: inline-block; + } + } + + &__dateTitle { + opacity: 0.7; + font-size: 13px; + padding-bottom: 6px; + width: 100%; + + @media screen and (max-width: 480px) { + font-size: var(--ti-common-font-size-base); + padding-bottom: 5px; + } + } + + &__band { + background: rgba(0, 0, 19, 0.8); + width: 100%; + height: 50px; + margin-top: 30px; + position: relative; + z-index: 2; + + @media screen and (max-width: 480px) { + margin-top: 20px; + } + + @media screen and (max-width: 360px) { + height: 40px; + margin-top: 10px; + } + } + + &__cvv { + text-align: right; + position: relative; + z-index: 2; + padding: 15px; + + .card-item__type { + opacity: 0.7; + } + + @media screen and (max-width: 360px) { + padding: 10px 15px; + } + } + + &__cvvTitle { + padding-right: 10px; + font-size: 15px; + font-weight: 500; + color: #fff; + margin-bottom: 5px; + } + + &__cvvBand { + height: 45px; + background: #fff; + margin-bottom: 30px; + text-align: right; + display: flex; + align-items: center; + justify-content: flex-end; + padding-right: 10px; + color: #1a3b5d; + font-size: var(--ti-common-font-size-3); + border-radius: 4px; + box-shadow: 0px 10px 20px -7px rgba(32, 56, 117, 0.35); + + @media screen and (max-width: 480px) { + height: 40px; + margin-bottom: 20px; + } + + @media screen and (max-width: 360px) { + margin-bottom: 15px; + } + } +} + +.credit-card-list { + margin-bottom: -130px; + + @media screen and (max-width: 480px) { + margin-bottom: -120px; + } +} + +.credit-card-input { + margin-bottom: 20px; + position: relative; + + &__label { + font-size: var(--ti-common-font-size-1); + margin-bottom: 5px; + font-weight: 500; + color: #1a3b5d; + width: 100%; + display: block; + user-select: none; + } + + &__input { + width: 100%; + height: 50px; + border-radius: 5px; + box-shadow: none; + border: 1px solid #ced6e0; + transition: all 0.3s ease-in-out; + font-size: var(--ti-common-font-size-3); + padding: 5px 15px; + background: none; + color: #1a3b5d; + outline: none; + + &:hover, + &:focus { + border-color: #3d9cff; + } + + &:focus { + box-shadow: 0px 10px 20px -13px rgba(32, 56, 117, 0.35); + } + + &.-select { + -webkit-appearance: none; + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAeCAYAAABuUU38AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAUxJREFUeNrM1sEJwkAQBdCsngXPHsQO9O5FS7AAMVYgdqAd2IGCDWgFnryLFQiCZ8EGnJUNimiyM/tnk4HNEAg/8y6ZmMRVqz9eUJvRaSbvutCZ347bXVJy/ZnvTmdJ862Me+hAbZCTs6GHpyUi1tTSvPnqTpoWZPUa7W7ncT3vK4h4zVejy8QzM3WhVUO8ykI6jOxoGA4ig3BLHcNFSCGqGAkig2yqgpEiMsjSfY9LxYQg7L6r0X6wS29YJiYQYecemY+wHrXD1+bklGhpAhBDeu/JfIVGxaAQ9sb8CI+CQSJ+QmJg0Ii/EE2MBiIXooHRQhRCkBhNhBcEhLkwf05ZCG8ICCOpk0MULmvDSY2M8UawIRExLIQIEgHDRoghihgRIgiigBEjgiFATBACAgFgghEwSAAGgoBCBBgYAg5hYKAIFYgHBo6w9RRgAFfy160QuV8NAAAAAElFTkSuQmCC'); + background-size: 12px; + background-position: 90% center; + background-repeat: no-repeat; + padding-right: 30px; + flex: 1; + cursor: pointer; + } + } + + &__eye { + display: inline-flex; + position: absolute; + width: 1em; + height: 1em; + font-size: var(--ti-common-font-size-5); + border-radius: 50%; + top: 42px; + right: 10px; + opacity: 0.75; + color: #8c9cae; + cursor: pointer; + padding: 0; + background: none; + display: inline-flex; + border: 2px solid currentColor; + box-shadow: none; + transition: all 0.3s ease-in-out; + outline: none; + + &:before { + content: ''; + position: absolute; + background: white; + width: 0.35em; + height: 0.35em; + top: 6px; + left: 6px; + z-index: 2; + border-radius: 50%; + transform: scale(0.1); + opacity: 0; + transition: all 0.3s ease-in-out; + transition-delay: 0.1s; + } + + &:after { + content: ''; + position: absolute; + top: 3px; + left: 3px; + background: currentColor; + width: 0.6em; + height: 0.6em; + border-radius: 50%; + transform: scale(0.1); + opacity: 0; + transition: all 0.3s ease-in-out; + } + + &:hover:not(:disabled), + &.-active:not(:disabled) { + color: #2364d2; + opacity: 1; + } + + &.-active { + &::before, + &::after { + transform: scale(1); + opacity: 1; + } + } + + &:disabled { + cursor: not-allowed; + opacity: 0.4; + } + } +} + +.slide-fade-up-enter-active { + transition: all 0.25s ease-in-out; + transition-delay: 0.1s; + position: relative; +} + +.slide-fade-up-leave-active { + transition: all 0.25s ease-in-out; + position: absolute; +} + +.slide-fade-up-enter { + opacity: 0; + transform: translateY(15px); + pointer-events: none; +} + +.slide-fade-up-leave-to { + opacity: 0; + transform: translateY(-15px); + pointer-events: none; +} + +.slide-fade-right-enter-active { + transition: all 0.25s ease-in-out; + transition-delay: 0.1s; + position: relative; +} + +.slide-fade-right-leave-active { + transition: all 0.25s ease-in-out; + position: absolute; +} + +.slide-fade-right-enter { + opacity: 0; + transform: translateX(10px) rotate(45deg); + pointer-events: none; +} + +.slide-fade-right-leave-to { + opacity: 0; + transform: translateX(-10px) rotate(45deg); + pointer-events: none; +} + +.github-btn { + position: absolute; + right: 40px; + bottom: 50px; + text-decoration: none; + padding: 15px 25px; + border-radius: 4px; + box-shadow: 0px 4px 30px -6px rgba(36, 52, 70, 0.65); + background: #24292e; + color: #fff; + font-weight: bold; + letter-spacing: 1px; + font-size: var(--ti-common-font-size-2); + text-align: center; + transition: all 0.3s ease-in-out; + + @media screen and (min-width: 500px) { + &:hover { + transform: scale(1.1); + box-shadow: 0px 17px 20px -6px rgba(36, 52, 70, 0.36); + } + } + + @media screen and (max-width: 700px) { + position: relative; + bottom: auto; + right: auto; + margin-top: 20px; + + &:active { + transform: scale(1.1); + box-shadow: 0px 17px 20px -6px rgba(36, 52, 70, 0.36); + } + } +} diff --git a/packages/theme/src/credit-card-form/vars.less b/packages/theme/src/credit-card-form/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/credit-card-form/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/credit-card/index.js b/packages/theme/src/credit-card/index.js new file mode 100644 index 000000000..5c25f23cc --- /dev/null +++ b/packages/theme/src/credit-card/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // credit-card +} diff --git a/packages/theme/src/credit-card/index.less b/packages/theme/src/credit-card/index.less new file mode 100644 index 000000000..50bb2741b --- /dev/null +++ b/packages/theme/src/credit-card/index.less @@ -0,0 +1,403 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.credit-card-item { + max-width: 430px; + height: 270px; + margin-left: auto; + margin-right: auto; + position: relative; + z-index: 2; + width: 100%; + + @media screen and (max-width: 480px) { + max-width: 310px; + height: 220px; + width: 90%; + } + + @media screen and (max-width: 360px) { + height: 180px; + } + + &.-active { + .credit-card-item__side { + &.-front { + transform: perspective(1000px) rotateY(180deg) rotateX(0deg) + rotateZ(0deg); + } + + &.-back { + transform: perspective(1000px) rotateY(0) rotateX(0deg) rotateZ(0deg); + } + } + } + + &__focus { + position: absolute; + z-index: 3; + border-radius: 5px; + left: 0; + top: 0; + width: 100%; + height: 100%; + transition: all 0.35s cubic-bezier(0.71, 0.03, 0.56, 0.85); + opacity: 0; + pointer-events: none; + overflow: hidden; + border: 2px solid rgba(255, 255, 255, 0.65); + + &:after { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + background: rgb(8, 20, 47); + height: 100%; + border-radius: 5px; + filter: blur(25px); + opacity: 0.5; + } + + &.-active { + opacity: 1; + } + } + + &__side { + border-radius: 15px; + overflow: hidden; + box-shadow: 0 20px 60px 0 rgba(14, 42, 90, 0.55); + transform: perspective(2000px) rotateY(0deg) rotateX(0deg) rotate(0deg); + transform-style: preserve-3d; + transition: all 0.8s cubic-bezier(0.71, 0.03, 0.56, 0.85); + backface-visibility: hidden; + height: 100%; + + &.-back { + position: absolute; + top: 0; + left: 0; + width: 100%; + transform: perspective(2000px) rotateY(-180deg) rotateX(0deg) rotate(0deg); + z-index: 2; + padding: 0; + height: 100%; + + .credit-card-item__cover { + transform: rotateY(-180deg); + } + } + } + + &__bg { + max-width: 100%; + display: block; + max-height: 100%; + height: 100%; + width: 100%; + object-fit: cover; + } + + &__cover { + height: 100%; + position: absolute; + height: 100%; + background-color: #1c1d27; + background-image: linear-gradient(147deg, #354fce 0%, #0c296b 74%); + left: 0; + top: 0; + width: 100%; + border-radius: 15px; + overflow: hidden; + + &:after { + content: ''; + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + background: rgba(6, 2, 29, 0.45); + } + } + + &__top { + display: flex; + align-items: flex-start; + justify-content: space-between; + margin-bottom: 40px; + padding: 0 10px; + + @media screen and (max-width: 480px) { + margin-bottom: 25px; + } + + @media screen and (max-width: 360px) { + margin-bottom: 15px; + } + } + + &__chip { + width: 60px; + + @media screen and (max-width: 480px) { + width: 50px; + } + + @media screen and (max-width: 360px) { + width: 40px; + } + } + + &__type { + height: 45px; + position: relative; + display: flex; + justify-content: flex-end; + max-width: 100px; + margin-left: auto; + width: 100%; + + @media screen and (max-width: 480px) { + height: 40px; + max-width: 90px; + } + + @media screen and (max-width: 360px) { + height: 30px; + } + } + + &__typeImg { + max-width: 100%; + object-fit: contain; + max-height: 100%; + object-position: top right; + } + + &__info { + color: #fff; + width: 100%; + max-width: calc(100% - 85px); + padding: 10px 15px; + font-weight: 500; + display: block; + + cursor: pointer; + + @media screen and (max-width: 480px) { + padding: 10px; + } + } + + &__holder { + opacity: 0.7; + font-size: 13px; + margin-bottom: 6px; + + @media screen and (max-width: 480px) { + font-size: var(--ti-common-font-size-base); + margin-bottom: 5px; + } + } + + &__wrapper { + padding: 25px 15px; + position: relative; + z-index: 4; + height: 100%; + text-shadow: 7px 6px 10px rgba(14, 42, 90, 0.8); + user-select: none; + + @media screen and (max-width: 480px) { + padding: 20px 10px; + } + } + + &__name { + font-size: var(--ti-common-font-size-3); + line-height: 1; + white-space: nowrap; + max-width: 100%; + overflow: hidden; + text-overflow: ellipsis; + text-transform: uppercase; + + @media screen and (max-width: 480px) { + font-size: var(--ti-common-font-size-2); + } + } + + &__nameItem { + display: inline-block; + min-width: 8px; + position: relative; + } + + &__number { + font-weight: 500; + line-height: 1; + color: #fff; + font-size: 27px; + margin-bottom: 25px; + display: inline-block; + padding: 10px 15px; + cursor: pointer; + + @media screen and (max-width: 480px) { + font-size: 21px; + margin-bottom: 15px; + padding: 10px 10px; + } + + @media screen and (max-width: 360px) { + font-size: 19px; + margin-bottom: 10px; + padding: 10px 10px; + } + } + + &__numberItem { + width: 16px; + display: inline-block; + + &.-active { + width: 30px; + } + + @media screen and (max-width: 480px) { + width: 13px; + + &.-active { + width: 16px; + } + } + + @media screen and (max-width: 360px) { + width: 12px; + + &.-active { + width: 8px; + } + } + } + + &__content { + color: #fff; + display: flex; + align-items: flex-start; + } + + &__date { + flex-wrap: wrap; + font-size: var(--ti-common-font-size-3); + margin-left: auto; + padding: 10px; + display: inline-flex; + width: 80px; + white-space: nowrap; + flex-shrink: 0; + cursor: pointer; + + @media screen and (max-width: 480px) { + font-size: var(--ti-common-font-size-2); + } + } + + &__dateItem { + position: relative; + + span { + width: 22px; + display: inline-block; + } + } + + &__dateTitle { + opacity: 0.7; + font-size: 13px; + padding-bottom: 6px; + width: 100%; + + @media screen and (max-width: 480px) { + font-size: var(--ti-common-font-size-base); + padding-bottom: 5px; + } + } + + &__band { + background: rgba(0, 0, 19, 0.8); + width: 100%; + height: 50px; + margin-top: 30px; + position: relative; + z-index: 2; + + @media screen and (max-width: 480px) { + margin-top: 20px; + } + + @media screen and (max-width: 360px) { + height: 40px; + margin-top: 10px; + } + } + + &__cvv { + text-align: right; + position: relative; + z-index: 2; + padding: 15px; + + .credit-card-item__type { + opacity: 0.7; + } + + @media screen and (max-width: 360px) { + padding: 10px 15px; + } + } + + &__cvvTitle { + padding-right: 10px; + font-size: 15px; + font-weight: 500; + color: #fff; + margin-bottom: 5px; + } + + &__cvvBand { + height: 45px; + background: #fff; + margin-bottom: 30px; + text-align: right; + display: flex; + align-items: center; + justify-content: flex-end; + padding-right: 10px; + color: #1a3b5d; + font-size: var(--ti-common-font-size-3); + border-radius: 4px; + box-shadow: 0px 10px 20px -7px rgba(32, 56, 117, 0.35); + + @media screen and (max-width: 480px) { + height: 40px; + margin-bottom: 20px; + } + + @media screen and (max-width: 360px) { + margin-bottom: 15px; + } + } +} diff --git a/packages/theme/src/credit-card/vars.less b/packages/theme/src/credit-card/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/credit-card/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/crop/index.js b/packages/theme/src/crop/index.js new file mode 100644 index 000000000..8679db4b1 --- /dev/null +++ b/packages/theme/src/crop/index.js @@ -0,0 +1,31 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-crop-drag-box-bg-color': '#fff', + 'tiny-crop-modal-bg-color': '#000', + 'tiny-crop-view-box-outline-color': '#1890ff', + 'tiny-crop-center-bg-color': '#eeeeee', + 'tiny-crop-face-bg-color': '#fff', + 'tiny-crop-line-bg-color': '#1890ff', + 'tiny-crop-point-bg-color': '#1890ff', + 'tiny-crop-opration-height': '30px', + 'tiny-crop-opration-bg-color': 'rgba(55, 55, 55, 0.3)', + 'tiny-crop-opration-span-bg-color': 'rgba(0, 0, 0, 0.5)', + 'tiny-crop-opration-span-text-color': '#fff', + 'tiny-crop-opration-span-hover-bg-color': 'rgba(0, 0, 0, 0.8)', + 'tiny-crop-modal-mask-bg-color': 'rgba(55, 55, 55, 0.5)', + 'tiny-crop-moda-close-bg-color': 'rgba(0, 0, 0, 0.5)', + 'tiny-crop-moda-close-icon-color': '#fff', + 'tiny-crop-nopic-bg-color': 'rgba(0, 0, 0, 0.3)', + 'tiny-crop-nopic-center-text-color': 'rgba(255, 255, 255, 0.6)' +} diff --git a/packages/theme/src/crop/index.less b/packages/theme/src/crop/index.less new file mode 100644 index 000000000..e7f11e8e0 --- /dev/null +++ b/packages/theme/src/crop/index.less @@ -0,0 +1,595 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +@crop-prefix-cls: ~'@{css-prefix}crop'; +@croppreview-prefix-cls: ~'@{css-prefix}croppreview'; + +.@{crop-prefix-cls} { + &__wrapper { + .component-css-vars-crop(); + } + + .cropper-container { + direction: ltr; + font-size: 0; + line-height: 0; + position: relative; + -ms-touch-action: none; + touch-action: none; + .user-select(none); + } + + .cropper-container img { + display: block; + height: 100%; + image-orientation: 0deg; + max-height: none !important; + max-width: none !important; + min-height: 0 !important; + min-width: 0 !important; + width: 100%; + } + + .cropper-wrap-box, + .cropper-canvas, + .cropper-drag-box, + .cropper-crop-box, + .cropper-modal { + bottom: 0; + left: 0; + position: absolute; + right: 0; + top: 0; + } + + .cropper-wrap-box, + .cropper-canvas { + overflow: hidden; + } + + .cropper-drag-box { + background-color: var(--ti-crop-drag-box-bg-color); + opacity: 0; + } + + .cropper-modal { + background-color: var(--ti-crop-modal-bg-color); + opacity: 0.5; + } + + .cropper-view-box { + display: block; + height: 100%; + outline-color: rgba(51, 153, 255, 0.75); + outline: 1px solid var(--ti-crop-view-box-outline-color); + overflow: hidden; + width: 100%; + } + + .cropper-dashed { + border: 0 dashed #eee; + display: block; + opacity: 0.5; + position: absolute; + } + + .cropper-dashed.dashed-h { + border-bottom-width: 1px; + border-top-width: 1px; + height: 33.33333%; + left: 0; + top: 33.33333%; + width: 100%; + } + + .cropper-dashed.dashed-v { + border-left-width: 1px; + border-right-width: 1px; + height: 100%; + left: 33.33333%; + top: 0; + width: 33.33333%; + } + + .cropper-center { + display: block; + height: 0; + left: 50%; + opacity: 0.75; + position: absolute; + top: 50%; + width: 0; + } + + .cropper-center:before, + .cropper-center:after { + background-color: var(--ti-crop-center-bg-color); + content: ' '; + display: block; + position: absolute; + } + + .cropper-center:before { + height: 1px; + left: -3px; + top: 0; + width: 7px; + } + + .cropper-center:after { + height: 7px; + left: 0; + top: -3px; + width: 1px; + } + + .cropper-face, + .cropper-line, + .cropper-point { + display: block; + height: 100%; + opacity: 0.1; + position: absolute; + width: 100%; + } + + .cropper-face { + background-color: var(--ti-crop-face-bg-color); + left: 0; + top: 0; + } + + .cropper-line { + background-color: var(--ti-crop-line-bg-color); + } + + .cropper-line.line-e { + cursor: ew-resize; + right: -3px; + top: 0; + width: 5px; + } + + .cropper-line.line-n { + cursor: ns-resize; + height: 5px; + left: 0; + top: -3px; + } + + .cropper-line.line-w { + cursor: ew-resize; + left: -3px; + top: 0; + width: 5px; + } + + .cropper-line.line-s { + bottom: -3px; + cursor: ns-resize; + height: 5px; + left: 0; + } + + .cropper-point { + background-color: var(--ti-crop-point-bg-color); + height: 5px; + opacity: 0.75; + width: 5px; + } + + .cropper-point.point-e { + cursor: ew-resize; + margin-top: -3px; + right: -3px; + top: 50%; + } + + .cropper-point.point-n { + cursor: ns-resize; + left: 50%; + margin-left: -3px; + top: -3px; + } + + .cropper-point.point-w { + cursor: ew-resize; + left: -3px; + margin-top: -3px; + top: 50%; + } + + .cropper-point.point-s { + bottom: -3px; + cursor: s-resize; + left: 50%; + margin-left: -3px; + } + + .cropper-point.point-ne { + cursor: nesw-resize; + right: -3px; + top: -3px; + } + + .cropper-point.point-nw { + cursor: nwse-resize; + left: -3px; + top: -3px; + } + + .cropper-point.point-sw { + bottom: -3px; + cursor: nesw-resize; + left: -3px; + } + + .cropper-point.point-se { + bottom: -3px; + cursor: nwse-resize; + height: 20px; + opacity: 1; + right: -3px; + width: 20px; + } + + @media (min-width: 768px) { + .cropper-point.point-se { + height: 15px; + width: 15px; + } + } + + @media (min-width: 992px) { + .cropper-point.point-se { + height: 10px; + width: 10px; + } + } + + @media (min-width: 1200px) { + .cropper-point.point-se { + height: 5px; + opacity: 0.75; + width: 5px; + } + } + + .cropper-point.point-se:before { + background-color: var(--ti-crop-point-bg-color); + bottom: -50%; + content: ' '; + display: block; + height: 200%; + opacity: 0; + position: absolute; + right: -50%; + width: 200%; + } + + .cropper-invisible { + opacity: 0; + } + + .cropper-bg { + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC'); + } + + .cropper-hide { + display: block; + height: 0; + position: absolute; + width: 0; + } + + .cropper-hidden { + display: none !important; + } + + .cropper-move { + cursor: move; + } + + .cropper-crop { + cursor: crosshair; + } + + .cropper-disabled .cropper-drag-box, + .cropper-disabled .cropper-face, + .cropper-disabled .cropper-line, + .cropper-disabled .cropper-point { + cursor: not-allowed; + } + + .img-container { + margin: auto; + overflow: hidden; + } + + .img-container > img { + max-width: 100%; + } + + .opration { + height: var(--ti-crop-opration-height); + line-height: var(--ti-crop-opration-height); + text-align: center; + background-color: var(--ti-crop-opration-bg-color); + position: relative; + } + + .opration span { + width: 26px; + height: 26px; + margin: 0 2px; + display: inline-block; + color: var(--ti-crop-opration-span-text-color); + cursor: pointer; + border-radius: 50%; + background-color: var(--ti-crop-opration-span-bg-color); + } + + .opration span:hover { + background-color: var(--ti-crop-opration-span-hover-bg-color); + width: 28px; + height: 28px; + } + + .opration span.@{css-prefix-iconfont}::before { + position: relative; + } + + .crop-modal-mask { + position: fixed; + top: 0; + bottom: 0; + left: 0; + right: 0; + background-color: var(--ti-crop-modal-mask-bg-color); + height: 100%; + z-index: 1000; + } + + .crop-modal-warp { + position: fixed; + overflow: auto; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: 1000; + -webkit-overflow-scrolling: touch; + outline: 0; + } + + .crop-modal { + position: relative; + top: 100px; + margin: 0 auto 50px; + background: #fff; + border-radius: 2px; + box-sizing: border-box; + width: 50%; + } + + .moda-close { + position: absolute; + top: -40px; + right: -40px; + width: 80px; + height: 80px; + cursor: pointer; + border-radius: 50%; + background-color: var(--ti-crop-moda-close-bg-color); + } + + .moda-close .@{css-prefix-iconfont} { + top: 45px; + left: 16px; + color: var(--ti-crop-moda-close-icon-color); + z-index: 9999999; + } + + .img-preview-box { + position: fixed; + top: 100px; + } + + .img-preview { + height: 9rem; + width: 16rem; + overflow: hidden; + } + + @media (max-width: 768px) { + .preview-lg { + display: none; + } + } + + @media (max-width: 600px) { + .preview-md { + display: none; + } + } + + .preview-lg { + height: 9rem; + width: 16rem; + margin-top: 4px; + } + + .preview-md { + height: 4.5rem; + width: 8rem; + margin-top: 4px; + } + + .preview-sm { + height: 2.25rem; + width: 4rem; + margin-top: 4px; + } + + .img-preview > img { + max-width: 100%; + } + + .nopic { + height: 200px; + text-align: center; + background: var(--ti-crop-nopic-bg-color); + } + + .nopic-center { + position: relative; + font-size: 50px; + color: var(--ti-crop-nopic-center-text-color); + cursor: pointer; + top: 50px; + } + + input[type='file'] { + display: none; + } +} + +.@{crop-prefix-cls} { + position: fixed; + height: 100%; + width: 100%; + display: flex; + align-items: center; + justify-content: center; + top: 0px; + left: 0px; + z-index: 1000; + background: rgba(97, 97, 97, 0.5); + + &__dialog-content__handle { + width: 652px; + display: flex; + justify-content: center; + height: 26px; + margin: 10px 0px 20px; + } + + &__dialog-content__handle__button { + width: 268px; + display: flex; + justify-content: space-between; + } + + &__dialog { + width: 652px; + display: flex; + flex-direction: column; + align-items: center; + box-sizing: border-box; + background: white; + z-index: 1001; + } + + &__dialog-cropper { + width: 652px; + height: 300px; + overflow: hidden; + } + + &__dialog-content { + width: 100%; + display: flex; + align-items: center; + margin-bottom: 10px; + justify-content: center; + } + + &__dialog-content__crop { + width: 314px; + height: 200px; + border: 1px solid #393939; + box-sizing: border-box; + background: gray; + overflow: hidden; + display: flex; + align-items: center; + justify-content: center; + + img { + height: 100%; + width: 100%; + } + } +} + +.@{croppreview-prefix-cls} { + position: fixed; + top: calc(100% - 50% - 150px); + left: calc(100% - 50% + 336px); + height: 300px; + width: 300px; + display: flex; + z-index: 1002; + flex-direction: column; + justify-content: space-between; +} + +.iconButton { + border-radius: 50%; + background: rgb(97, 97, 97); + height: 26px; + width: 26px; + display: flex; + justify-content: center; + align-items: center; + cursor: pointer; + + .iconButtonset { + fill: white; + height: 12px; + width: 12px; + } + + &:hover { + background: rgb(39, 39, 39); + } +} + +.croppreview { + height: 100%; + width: 100%; +} + +.croppreviewb { + width: 214px; + height: 140px; + overflow: hidden; + background: white; +} + +.croppreviewm { + width: 114px; + height: 80px; + overflow: hidden; + background: white; +} + +.croppreviews { + width: 84px; + height: 60px; + overflow: hidden; + background: white; +} diff --git a/packages/theme/src/crop/vars.less b/packages/theme/src/crop/vars.less new file mode 100644 index 000000000..7f73f0db8 --- /dev/null +++ b/packages/theme/src/crop/vars.less @@ -0,0 +1,31 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-crop() { + --ti-crop-drag-box-bg-color: var(--ti-base-color-light); + --ti-crop-modal-bg-color: var(--ti-base-color-dark); + --ti-crop-view-box-outline-color: var(--ti-base-color-brand-6); + --ti-crop-center-bg-color: #eeeeee; + --ti-crop-face-bg-color: var(--ti-base-color-light); + --ti-crop-line-bg-color: var(--ti-base-color-brand-6); + --ti-crop-point-bg-color: var(--ti-base-color-brand-6); + --ti-crop-opration-height: var(--ti-base-size-height-minor); + --ti-crop-opration-bg-color: rgba(55, 55, 55, 0.3); + --ti-crop-opration-span-bg-color: rgba(0, 0, 0, 0.5); + --ti-crop-opration-span-text-color: var(--ti-base-color-light); + --ti-crop-opration-span-hover-bg-color: rgba(0, 0, 0, 0.8); + --ti-crop-modal-mask-bg-color: rgba(55, 55, 55, 0.5); + --ti-crop-moda-close-bg-color: rgba(0, 0, 0, 0.5); + --ti-crop-moda-close-icon-color: var(--ti-base-color-light); + --ti-crop-nopic-bg-color: rgba(0, 0, 0, 0.3); + --ti-crop-nopic-center-text-color: rgba(255, 255, 255, 0.6); +} diff --git a/packages/theme/src/currency/index.js b/packages/theme/src/currency/index.js new file mode 100644 index 000000000..6770d9566 --- /dev/null +++ b/packages/theme/src/currency/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // currency +} diff --git a/packages/theme/src/currency/index.less b/packages/theme/src/currency/index.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/currency/index.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/currency/vars.less b/packages/theme/src/currency/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/currency/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/custom.less b/packages/theme/src/custom.less new file mode 100644 index 000000000..fe5bd23ae --- /dev/null +++ b/packages/theme/src/custom.less @@ -0,0 +1,14 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@css-prefix: tiny-; +@css-prefix-iconfont: tiny-icon; diff --git a/packages/theme/src/dept/index.js b/packages/theme/src/dept/index.js new file mode 100644 index 000000000..23b489a7f --- /dev/null +++ b/packages/theme/src/dept/index.js @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-dept-label-font-size': '12px', + 'tiny-dept-label-text-color': '#333', + 'tiny-dept-label-font-weight': '700', + 'tiny-dept-selected-info-text-color': '#1890ff', + 'tiny-dept-selected-info-bg-color': '#f1f1f1', + 'tiny-dept-selected-info-border-radius': '3px' +} diff --git a/packages/theme/src/dept/index.less b/packages/theme/src/dept/index.less new file mode 100644 index 000000000..48940e1e4 --- /dev/null +++ b/packages/theme/src/dept/index.less @@ -0,0 +1,80 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import '../mixins/common.less'; +@import './vars.less'; + +@dept-prefix-cls: ~'@{css-prefix}dept'; +@input-prefix-cls: ~'@{css-prefix}input'; +@col-prefix-cls: ~'@{css-prefix}col'; + +.@{dept-prefix-cls} { + .component-css-vars-dept(); + + &__search { + margin-bottom: 12px; + } + + &__text, + &__label { + font-size: var(--ti-dept-label-font-size); + color: var(--ti-dept-label-text-color); + font-weight: var(--ti-dept-label-font-weight); + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + + &__label { + text-align: right; + + &.is-selected { + text-align: left; + margin-bottom: 4px; + } + } + + &__selected-info { + color: var(--ti-dept-selected-info-text-color); + font-size: var(--ti-dept-label-font-size); + background: var(--ti-dept-selected-info-bg-color); + padding: 5px; + border-radius: var(--ti-dept-selected-info-border-radius); + } + + &__item { + margin-bottom: 12px; + } + + &__search &__label, + &__item &__label { + &.@{col-prefix-cls} { + line-height: 30px; + padding-left: 0; + padding-right: 8px; + + & + .@{col-prefix-cls} { + padding: 0; + } + } + } + + .@{input-prefix-cls}__inner { + .text-overflow(); + } + + .@{input-prefix-cls}__icon { + vertical-align: middle; + fill: var(--ti-dept-selected-info-text-color); + } +} diff --git a/packages/theme/src/dept/vars.less b/packages/theme/src/dept/vars.less new file mode 100644 index 000000000..ee85f293c --- /dev/null +++ b/packages/theme/src/dept/vars.less @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-dept() { + --ti-dept-label-font-size: var(--ti-common-font-size-base); + --ti-dept-label-text-color: var(--ti-base-color-info-normal); + --ti-dept-label-font-weight: var(--ti-common-font-weight-7); + --ti-dept-selected-info-text-color: var(--ti-base-color-brand-6); + --ti-dept-selected-info-bg-color: #f1f1f1; + --ti-dept-selected-info-border-radius: var(--ti-base-radius-large); +} diff --git a/packages/theme/src/detail-page/index.js b/packages/theme/src/detail-page/index.js new file mode 100644 index 000000000..ba9ca2f4b --- /dev/null +++ b/packages/theme/src/detail-page/index.js @@ -0,0 +1,25 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-detail-page-text-color': '#252b3a', + 'tiny-detail-page-font-size': '12px', + 'tiny-detail-page-header-font-size': '14px', + 'tiny-detail-page-header-border-color': '#d9d9d9', + 'tiny-detail-page-header-seticon-text-color': '#1890ff', + 'tiny-detail-page-header-seticon-hover-text-color': '#40a9ff', + 'tiny-detail-page-header-seticon-font-size': '16px', + 'tiny-detail-page-content-item-text-color': '#999', + 'tiny-detail-dialog-header-bg-color': '#f1f1f1', + 'tiny-detail-dialog-content-item-hover-bg-color': '#e6f7ff', + 'tiny-detail-dialog-active-bg-color': '#e9f4fd' +} diff --git a/packages/theme/src/detail-page/index.less b/packages/theme/src/detail-page/index.less new file mode 100644 index 000000000..5ba005bba --- /dev/null +++ b/packages/theme/src/detail-page/index.less @@ -0,0 +1,143 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@detail-page-prefix-cls: ~'@{css-prefix}detail-page'; +@detail-dialog-prefix-cls: ~'@{css-prefix}detail-dialog'; +@grid-modal__box-prefix-cls: ~'@{css-prefix}grid-modal__box'; + +.@{grid-modal__box-prefix-cls}{ + .component-css-vars-detail-page(); +} +.@{detail-page-prefix-cls} { + + width: 100%; + height: 700px; + font-size: var(--ti-detail-page-font-size); + display: flex; + flex-direction: column; + + & &__header { + width: 100%; + height: 40px; + color: var(--ti-detail-page-text-color); + display: flex; + border-bottom: 1px solid var(--ti-detail-page-header-border-color); + justify-content: space-between; + align-items: center; + + span { + font-size: var(--ti-detail-page-header-font-size); + font-weight: bold; + } + } + + & &__header-icon { + line-height: 1; + cursor: pointer; + + .setIconStyle { + font-size: var(--ti-detail-page-header-seticon-font-size); + fill: var(--ti-detail-page-header-seticon-text-color); + + &:hover { + fill: var(--ti-detail-page-header-seticon-hover-text-color); + } + } + } + + & &__content { + width: 100%; + display: flex; + flex-direction: column; + } + + & &__content-item { + width: 100%; + height: 40px; + line-height: 40px; + display: flex; + + .@{detail-page-prefix-cls}__content-item-span { + color: var(--ti-detail-page-content-item-text-color); + margin-right: 2px; + } + } +} + +.@{detail-dialog-prefix-cls} { + width: 100%; + display: flex; + flex-direction: column; + font-size: 12px; + + & &__header { + width: 100%; + height: 40px; + border-bottom: 1px solid var(--ti-detail-page-header-border-color); + display: flex; + align-items: center; + justify-content: space-between; + background: var(--ti-detail-dialog-header-bg-color); + padding-left: 8px; + + & > span { + width: 50%; + font-weight: bold; + border-right: 1px solid var(--ti-detail-page-header-border-color); + } + } + + & &__header-check { + width: 130px; + + span { + font-weight: bold; + } + } + + & &__content { + width: 100%; + min-height: 225px; + max-height: 400px; + display: flex; + flex-direction: column; + overflow-y: auto; + border-bottom: 1px solid var(--ti-detail-page-header-border-color); + } + + & &__content-item { + width: 100%; + height: 40px; + display: flex; + align-items: center; + justify-content: space-between; + padding-left: 8px; + + &:hover { + background: var(--ti-detail-dialog-content-item-hover-bg-color); + } + } + + & &__footer { + margin-top: 24px; + display: flex; + align-items: center; + justify-content: center; + } + + .active { + background: var(--ti-detail-dialog-active-bg-color); + } +} diff --git a/packages/theme/src/detail-page/vars.less b/packages/theme/src/detail-page/vars.less new file mode 100644 index 000000000..edcfff211 --- /dev/null +++ b/packages/theme/src/detail-page/vars.less @@ -0,0 +1,25 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-detail-page() { + --ti-detail-page-text-color: var(--ti-base-color-info-normal); + --ti-detail-page-font-size: var(--ti-common-font-size-base); + --ti-detail-page-header-font-size: var(--ti-common-font-size-1); + --ti-detail-page-header-border-color: var(--ti-base-color-border); + --ti-detail-page-header-seticon-text-color: var(--ti-base-color-brand-6); + --ti-detail-page-header-seticon-hover-text-color: var(--ti-base-color-brand-5); + --ti-detail-page-header-seticon-font-size: var(--ti-common-font-size-2); + --ti-detail-page-content-item-text-color: var(--ti-base-color-placeholder); + --ti-detail-dialog-header-bg-color: #f1f1f1; + --ti-detail-dialog-content-item-hover-bg-color: var(--ti-base-color-hover-background); + --ti-detail-dialog-active-bg-color: #e9f4fd; +} diff --git a/packages/theme/src/dialog-box/index.js b/packages/theme/src/dialog-box/index.js new file mode 100644 index 000000000..6d03acf56 --- /dev/null +++ b/packages/theme/src/dialog-box/index.js @@ -0,0 +1,38 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-dialogbox-bg-color': '#fff', + 'tiny-dialogbox-border-radius': '2px', + 'tiny-dialogbox-head-padding-top': '32px', + 'tiny-dialogbox-head-padding-horizontal': '32px', + 'tiny-dialogbox-head-padding-bottom': '28px', + 'tiny-dialogbox-head-border-color': '#d9d9d9', + 'tiny-dialogbox-head-text-color': '#999', + 'tiny-dialogbox-head-title-font-size': '14px', + 'tiny-dialogbox-head-title-font-weight': 'bold', + 'tiny-dialogbox-head-title-text-color': '#333', + 'tiny-dialogbox-head-font-icon-color': '#c4c4c4', + 'tiny-dialogbox-head-font-icon-size': '16px', + 'tiny-dialogbox-head-font-icon-color-hover': '#1890ff', + 'tiny-dialogbox-head-body-text-color': '#5a5e66', + 'tiny-dialogbox-head-body-font-size': '14px', + 'tiny-dialogbox-close-icon-color': '#575d6c', + 'tiny-dialogbox-close-icon-color-hover': '#5e7ce0', + 'tiny-dialogbox-box-body-font-size': '12px', + 'tiny-dialogbox-box-body-text-color': '#575d6c', + 'tiny-dialogbox-box-body-padding-vertical': '0', + 'tiny-dialogbox-box-body-padding-horizontal': '32px', + 'tiny-dialogbox-box-body-margin-bottom': '12px', + 'tiny-dialogbox-btn-background-color-hover': 'none', + 'tiny-dialogbox-box-shadow': '0 8px 40px 0 rgba(0, 0, 0, 0.2)' +} diff --git a/packages/theme/src/dialog-box/index.less b/packages/theme/src/dialog-box/index.less new file mode 100644 index 000000000..65c2b27af --- /dev/null +++ b/packages/theme/src/dialog-box/index.less @@ -0,0 +1,260 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; +@import '../mixins/button.less'; + +@dialog-box-prefix-cls: ~'@{css-prefix}dialog-box'; + +.@{dialog-box-prefix-cls} { + position: absolute; + background: var(--ti-dialogbox-bg-color); + border: 1px solid transparent; + border-radius: var(--ti-dialogbox-border-radius); + box-shadow: var(--ti-dialogbox-box-shadow); + overflow: hidden; + + &__wrapper { + .component-css-vars-dialog-box(); + + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + overflow: auto; + margin: 0; + } + + &.is-fullscreen { + left: 0; + top: 0; + width: 100vw; + height: 100vh; + } + + &.is-center { + .@{dialog-box-prefix-cls}__header, + .@{dialog-box-prefix-cls}__footer { + text-align: center; + } + } + + &__scroll-lock { + overflow: hidden; + } + + &.is-fullscreen &__body { + max-height: calc(100vh - 94px); + } + + & &__header { + padding: var(--ti-dialogbox-head-padding-top) var(--ti-dialogbox-head-padding-horizontal) var(--ti-dialogbox-head-padding-bottom); + background: var(--ti-dialogbox-bg-color); + font-weight: var(--ti-dialogbox-head-title-font-weight); + display: flex; + position: relative; + justify-content: space-between; + align-items: center; + + .@{dialog-box-prefix-cls}__title { + font-size: var(--ti-dialogbox-head-title-font-size); + color: var(--ti-dialogbox-head-title-text-color); + font-weight: var(--ti-dialogbox-head-title-font-weight); + flex: 1; + } + + .@{dialog-box-prefix-cls}__headerbtn { + border: none; + background: none; + padding: 0; + line-height: 1; + position: absolute; + top: var(--ti-dialogbox-btn-position-top); + right: 20px; + cursor: pointer; + height: 32px; + width: 32px; + + &:hover { + background-color: var(--ti-dialogbox-btn-background-color-hover); + border-radius: 4px; + } + + & + .@{dialog-box-prefix-cls}__headerbtn { + margin-left: 8px; + } + + &:focus { + outline: none; //解决chrome下,focus状态下蓝边问题 + } + + .@{dialog-box-prefix-cls}__close { + fill: var(--ti-dialogbox-close-icon-color); + font-size: var(--ti-dialogbox-head-font-icon-size); + + &:hover { + fill: var(--ti-dialogbox-close-icon-color-hover); + } + } + } + } + + & &__body { + text-align: left; + padding: var(--ti-dialogbox-box-body-padding-vertical) var(--ti-dialogbox-box-body-padding-horizontal); + margin-bottom: var(--ti-dialogbox-box-body-margin-bottom); + color: var(--ti-dialogbox-box-body-text-color); + font-size: var(--ti-dialogbox-box-body-font-size); + overflow: auto; + max-height: 65vh; + + .@{css-prefix}upload { + overflow: hidden; + } + + > span { + max-height: 120px; + overflow-y: auto; + } + + .@{css-prefix}dept__search { + line-height: 30px; + } + } + + & &__footer { + text-align: inherit; + padding: 28px 32px 32px; + text-align: center; + box-sizing: border-box; + + .@{css-prefix}toolbar { + .@{css-prefix}button { + margin: 0 4px; + } + } + } +} + +.v-modal { + position: fixed; + left: 0; + top: 0; + width: 100%; + height: 100%; + opacity: 0.3; + background: #000; +} + +.v-modal-enter { + animation: v-modal-in 0.2s ease; +} + +.v-modal-leave { + animation: v-modal-out 0.2s ease forwards; +} + +@keyframes v-modal-in { + 0% { + opacity: 0; + } +} + +@keyframes v-modal-out { + 100% { + opacity: 0; + } +} + +.dialog-slideRight-enter-active { + animation: slideRight 0.5s ease-in forwards; +} + +.dialog-slideRight-leave-active { + animation: slideRightout 0.5s ease-in forwards; +} + +@keyframes slideRight { + 0% { + opacity: 0; + transform: translateX(100%); + } + + 50% { + opacity: 0.6; + transform: translateX(50%); + } + + 100% { + opacity: 1; + transform: translateX(0%); + } +} + +@keyframes slideRightout { + 0% { + opacity: 1; + transform: translateX(0%); + } + + 50% { + opacity: 0.6; + transform: translateX(50%); + } + + 100% { + opacity: 0; + transform: translateX(100%); + } +} + +.dialog-fade-enter-active { + animation: dialog-fade-in 0.3s; +} + +.dialog-fade-leave-active { + animation: dialog-fade-out 0.3s; +} + +@keyframes dialog-fade-in { + 0% { + transform: translate3d(0, -20px, 0); + opacity: 0; + } + + 100% { + transform: translate3d(0, 0, 0); + opacity: 1; + } +} + +@keyframes dialog-fade-out { + 0% { + transform: translate3d(0, 0, 0); + opacity: 1; + } + + 100% { + transform: translate3d(0, -20px, 0); + opacity: 0; + } +} + +@media (max-width: 480px) { + .@{dialog-box-prefix-cls} { + width: 100% !important; + top: 0 !important; + left: 0 !important; + } +} diff --git a/packages/theme/src/dialog-box/vars.less b/packages/theme/src/dialog-box/vars.less new file mode 100644 index 000000000..78fad157f --- /dev/null +++ b/packages/theme/src/dialog-box/vars.less @@ -0,0 +1,39 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-dialog-box() { + --ti-dialogbox-bg-color: var(--ti-base-color-light); + --ti-dialogbox-border-radius: var(--ti-common-border-radius-normal); + --ti-dialogbox-head-border-color: var(--ti-base-color-border); + --ti-dialogbox-head-text-color: var(--ti-base-color-placeholder); + --ti-dialogbox-head-padding-top: 32px; + --ti-dialogbox-head-padding-horizontal: 32px; + --ti-dialogbox-head-padding-bottom: 28px; + --ti-dialogbox-head-title-font-size: var(--ti-common-font-size-3); + --ti-dialogbox-head-title-font-weight: var(--ti-common-font-weight-7); + --ti-dialogbox-head-title-text-color: var(--ti-base-color-info-normal); + --ti-dialogbox-head-font-icon-color: #c4c4c4; + --ti-dialogbox-head-font-icon-size: 14px; + --ti-dialogbox-head-font-icon-color-hover: var(--ti-base-color-brand-6); + --ti-dialogbox-head-body-text-color: #5a5e66; + --ti-dialogbox-head-body-font-size: var(--ti-common-font-size-1); + --ti-dialogbox-close-icon-color: var(--ti-base-color-common-5); + --ti-dialogbox-close-icon-color-hover: var(--ti-base-color-brand-6); + --ti-dialogbox-box-body-font-size: var(--ti-common-font-size-base); + --ti-dialogbox-box-body-text-color: var(--ti-base-color-common-5); + --ti-dialogbox-box-body-padding-vertical: 0; + --ti-dialogbox-box-body-padding-horizontal: 32px; + --ti-dialogbox-box-body-margin-bottom: 12px; + --ti-dialogbox-btn-background-color-hover: none; + --ti-dialogbox-box-shadow: var(--ti-common-shadow-4-down); + --ti-dialogbox-btn-position-top: 18px; +} diff --git a/packages/theme/src/drop-roles/index.js b/packages/theme/src/drop-roles/index.js new file mode 100644 index 000000000..2918d08c0 --- /dev/null +++ b/packages/theme/src/drop-roles/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // drop-roles +} diff --git a/packages/theme/src/drop-roles/index.less b/packages/theme/src/drop-roles/index.less new file mode 100644 index 000000000..e4b73768b --- /dev/null +++ b/packages/theme/src/drop-roles/index.less @@ -0,0 +1,25 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@drop-roles-prefix-cls: ~'@{css-prefix}drop-roles'; + +.@{drop-roles-prefix-cls} { + .user-icon { + float: right; + position: relative; + top: 50%; + transform: translateY(-50%); + margin-left: 10px; + } +} diff --git a/packages/theme/src/drop-roles/vars.less b/packages/theme/src/drop-roles/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/drop-roles/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/drop-times/index.js b/packages/theme/src/drop-times/index.js new file mode 100644 index 000000000..69d41c38e --- /dev/null +++ b/packages/theme/src/drop-times/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // drop-times +} diff --git a/packages/theme/src/drop-times/index.less b/packages/theme/src/drop-times/index.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/drop-times/index.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/drop-times/vars.less b/packages/theme/src/drop-times/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/drop-times/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/dropdown-item/index.js b/packages/theme/src/dropdown-item/index.js new file mode 100644 index 000000000..7fb4d8c41 --- /dev/null +++ b/packages/theme/src/dropdown-item/index.js @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-dropdown-menu-item-hover-bg-color': '#f2f5fc', + 'tiny-dropdown-menu-item-hover-text-color': '#5e7ce0', + 'tiny-dropdown-menu-item-active-bg-color': '#5e7ce0', + 'tiny-dropdown-menu-item-active-text-color': '#fff', + 'tiny-dropdown-menu-item-disabled-text-color': '#adb0b8', + 'tiny-dropdown-menu-item-text-color': '#333', + 'tiny-dropdown-menu-item-height': '1.5', + 'tiny-dropdown-menu-item-padding-vertical': '6px', + 'tiny-dropdown-menu-item-padding-horizontal': '20px', + 'tiny-dropdown-menu-item-border-radius': '0', + 'tiny-dropdown-menu-item-max-width': '130px', + 'tiny-dropdown-menu-item-divided-bg-color': '#fff', + 'tiny-dropdown-menu-item-divided-margin-top': '4px' +} diff --git a/packages/theme/src/dropdown-item/index.less b/packages/theme/src/dropdown-item/index.less new file mode 100644 index 000000000..a5442ef3a --- /dev/null +++ b/packages/theme/src/dropdown-item/index.less @@ -0,0 +1,106 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@dropdown-item-prefix-cls: ~'@{css-prefix}dropdown-menu__item'; + +[class*=tiny-] li.@{dropdown-item-prefix-cls} { + .component-css-vars-dropdown-item(); + + list-style: none; + line-height: var(--ti-dropdown-menu-item-height); + padding: var(--ti-dropdown-menu-item-padding-vertical) var(--ti-dropdown-menu-item-padding-horizontal); + margin: 0; + font-size: var(--ti-common-font-size-base); + color: var(--ti-dropdown-menu-item-text-color); + cursor: pointer; + outline: 0; + position: relative; + word-break: break-all; + max-width:var(--ti-dropdown-menu-item-max-width); + display: flex; + align-items: center; + + .@{dropdown-item-prefix-cls}--child { + position: absolute; + right: 100%; + top: 0; + display: none; + } + + &:focus, + &:not(.is-disabled):hover { + background-color: var(--ti-dropdown-menu-item-hover-bg-color); + color: var(--ti-dropdown-menu-item-hover-text-color); + border-radius: var(--ti-dropdown-menu-item-border-radius); + + &>.@{dropdown-item-prefix-cls}-expand, + &>.@{dropdown-item-prefix-cls}-content{ + svg { + fill: var(--ti-dropdown-menu-item-hover-text-color); + } + } + + &>.@{dropdown-item-prefix-cls}--child { + display: block; + } + } + + &:not(.is-disabled):active { + background-color: var(--ti-dropdown-menu-item-active-bg-color); + color: var(--ti-dropdown-menu-item-active-text-color); + border-radius: var(--ti-dropdown-menu-item-border-radius); + + svg { + fill: var(--ti-dropdown-menu-item-active-text-color); + } + } + + svg { + margin-right: 5px; + margin-top: -2px; + } + + &.is-disabled { + cursor: not-allowed; + color: var(--ti-dropdown-menu-item-disabled-text-color); + } + + .@{dropdown-item-prefix-cls}-expand{ + display: inline-block; + height: 100%; + margin-left: -20px; + width: 20px; + + .tiny-svg{ + width: 0.6em; + height: 0.6em; + margin-left: 5px; + } + } + +} + +.@{dropdown-item-prefix-cls}--divided { + position: relative; + margin-top: 6px; + border-top: 1px solid #e4e7ed; + + &:before { + height: 6px; + display: block; + margin: 0 -20px; + background-color: var(--ti-dropdown-menu-item-divided-bg-color); + } +} diff --git a/packages/theme/src/dropdown-item/vars.less b/packages/theme/src/dropdown-item/vars.less new file mode 100644 index 000000000..60acb233f --- /dev/null +++ b/packages/theme/src/dropdown-item/vars.less @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-dropdown-item() { + --ti-dropdown-menu-item-hover-bg-color: var(--ti-base-color-hover-background); + --ti-dropdown-menu-item-hover-text-color: var(--ti-base-color-brand-6); + --ti-dropdown-menu-item-active-bg-color: var(--ti-base-color-brand-6); + --ti-dropdown-menu-item-active-text-color: var(--ti-base-color-white); + --ti-dropdown-menu-item-disabled-text-color: var(--ti-common-color-text-disabled); + --ti-dropdown-menu-item-text-color: #333; + --ti-dropdown-menu-item-height: 1.5; + --ti-dropdown-menu-item-padding-vertical: 6px; + --ti-dropdown-menu-item-padding-horizontal: 20px; + --ti-dropdown-menu-item-border-radius: 0; + --ti-dropdown-menu-item-max-width: 130px; + --ti-dropdown-menu-item-divided-bg-color: var(--ti-base-color-white); + --ti-dropdown-menu-item-divided-margin-top: var(--ti-common-space-base); +} diff --git a/packages/theme/src/dropdown-menu/index.js b/packages/theme/src/dropdown-menu/index.js new file mode 100644 index 000000000..887f26474 --- /dev/null +++ b/packages/theme/src/dropdown-menu/index.js @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-dropdown-menu-box-shadow': '0 2px 8px 0 rgba(0, 0, 0, 0.2)', + 'tiny-dropdown-menu-margin-vertical': '0', + 'tiny-dropdown-menu-padding-vertical': '4px', + 'tiny-dropdown-menu-padding-horizontal': '0' +} diff --git a/packages/theme/src/dropdown-menu/index.less b/packages/theme/src/dropdown-menu/index.less new file mode 100644 index 000000000..0ce661c0f --- /dev/null +++ b/packages/theme/src/dropdown-menu/index.less @@ -0,0 +1,185 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@dropdown-menu-prefix-cls: ~'@{css-prefix}dropdown-menu'; + +.@{dropdown-menu-prefix-cls} { + .component-css-vars-dropdown-menu(); + + position: absolute; + padding: var(--ti-dropdown-menu-padding-vertical) var(--ti-dropdown-menu-padding-horizontal); + background-color: var(--ti-common-color-bg-white-normal); + border-radius: var(--ti-common-border-radius-normal); + box-shadow: var(--ti-dropdown-menu-box-shadow); + width: max-content; + + .@{dropdown-menu-prefix-cls}{ + padding: var(--ti-dropdown-menu-padding-vertical) var(--ti-dropdown-menu-padding-horizontal); + } + + &.@{css-prefix}popper .popper__arrow, + &.@{css-prefix}popper .popper__arrow:after { + position: absolute; + display: block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + } + + &.@{css-prefix}popper .popper__arrow { + border-width: 6px; + filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03)); + } + + &.@{css-prefix}popper .popper__arrow::after { + content: ' '; + border-width: 6px; + } + + &.@{css-prefix}popper[x-placement^='top'] { + margin-bottom: var(--ti-dropdown-menu-margin-vertical); + } + + &.@{css-prefix}popper[x-placement^='top'] .popper__arrow { + bottom: -6px; + left: 50%; + margin-right: 3px; + border-top-color: #d9d9d9; + border-bottom-width: 0; + } + + &.@{css-prefix}popper[x-placement^='top'] .popper__arrow:after { + bottom: 1px; + margin-left: -6px; + border-top-color: #fff; + border-bottom-width: 0; + } + + &.@{css-prefix}popper[x-placement^='bottom'] { + margin-top: var(--ti-dropdown-menu-margin-vertical); + } + + &.@{css-prefix}popper[x-placement^='bottom'] .popper__arrow { + top: -6px; + left: 50%; + margin-right: 3px; + border-top-width: 0; + border-bottom-color: #d9d9d9; + } + + &.@{css-prefix}popper[x-placement^='bottom'] .popper__arrow:after { + top: 1px; + margin-left: -6px; + border-top-width: 0; + border-bottom-color: #fff; + } + + &.@{css-prefix}popper[x-placement^='right'] { + margin-left: 12px; + } + + &.@{css-prefix}popper[x-placement^='right'] .popper__arrow { + top: 50%; + left: -6px; + margin-bottom: 3px; + border-right-color: #d9d9d9; + border-left-width: 0; + } + + &.@{css-prefix}popper[x-placement^='right'] .popper__arrow:after { + bottom: -6px; + left: 1px; + border-right-color: #fff; + border-left-width: 0; + } + + &.@{css-prefix}popper[x-placement^='left'] { + margin-right: 12px; + } + + &.@{css-prefix}popper[x-placement^='left'] .popper__arrow { + top: 50%; + right: -6px; + margin-bottom: 3px; + border-right-width: 0; + border-left-color: #d9d9d9; + } + + &.@{css-prefix}popper[x-placement^='left'] .popper__arrow:after { + right: 1px; + bottom: -6px; + margin-left: -6px; + border-right-width: 0; + border-left-color: #fff; + } +} + +.@{dropdown-menu-prefix-cls}--medium { + padding: 6px 0; + + .@{dropdown-menu-prefix-cls}__item { + line-height: 30px; + padding: 0 17px; + font-size: var(--ti-common-font-size-1); + + &.@{dropdown-menu-prefix-cls}__item--divided { + margin-top: 6px; + } + + &.@{dropdown-menu-prefix-cls}__item--divided:before { + height: 6px; + margin: 0 -17px; + } + } +} + +.@{dropdown-menu-prefix-cls}--small { + padding: 6px 0; + + .@{dropdown-menu-prefix-cls}__item { + line-height: 27px; + padding: 0 15px; + font-size: 13px; + + &.@{dropdown-menu-prefix-cls}__item--divided { + margin-top: var(--ti-dropdown-menu-item-divided-margin-top); + } + + &.@{dropdown-menu-prefix-cls}__item--divided:before { + height: 4px; + margin: 0 -15px; + } + } +} + +.@{dropdown-menu-prefix-cls}--mini { + padding: 3px 0; + + .@{dropdown-menu-prefix-cls}__item { + line-height: 24px; + padding: 0 10px; + font-size: var(--ti-common-font-size-base); + + &.@{dropdown-menu-prefix-cls}__item--divided { + margin-top: 3px; + } + + &.@{dropdown-menu-prefix-cls}__item--divided:before { + height: 3px; + margin: 0 -10px; + } + } +} diff --git a/packages/theme/src/dropdown-menu/vars.less b/packages/theme/src/dropdown-menu/vars.less new file mode 100644 index 000000000..dc0ab96af --- /dev/null +++ b/packages/theme/src/dropdown-menu/vars.less @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-dropdown-menu() { + --ti-dropdown-menu-box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.2); + --ti-dropdown-menu-margin-vertical: 0; + --ti-dropdown-menu-padding-vertical: 4px; + --ti-dropdown-menu-padding-horizontal: 0; +} diff --git a/packages/theme/src/dropdown/index.js b/packages/theme/src/dropdown/index.js new file mode 100644 index 000000000..03ce170af --- /dev/null +++ b/packages/theme/src/dropdown/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // dropdown +} diff --git a/packages/theme/src/dropdown/index.less b/packages/theme/src/dropdown/index.less new file mode 100644 index 000000000..f72dac204 --- /dev/null +++ b/packages/theme/src/dropdown/index.less @@ -0,0 +1,84 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@dropdown-prefix-cls: ~'@{css-prefix}dropdown'; + +.@{dropdown-prefix-cls} { + display: inline-block; + position: relative; + font-size: var(--ti-common-font-size-base); + + .@{css-prefix}button-group { + display: block; + + .@{css-prefix}button { + float: none + } + } + + .@{dropdown-prefix-cls}__caret-button { + padding-left: 5px; + padding-right: 5px; + position: relative; + border-left: none; + min-width: 24px; + + &:before { + content: ''; + position: absolute; + display: block; + width: 1px; + top: 5px; + bottom: 5px; + left: 0; + background: #fff + } + + &.@{css-prefix}button--default:before { + background: #d9d9d9; + } + + &.@{css-prefix}button--default:hover:before { + background-color: #1890ff + } + + &:hover:not(.is-disabled):before { + top: 0; + bottom: 0 + } + + svg { + padding-left: 0; + margin: 0 3px; + } + } + + .@{dropdown-prefix-cls}-selfdefine:focus:active, + .@{dropdown-prefix-cls}-selfdefine:focus:not(.focusing) { + outline-width: 0 + } + + [disabled] { + cursor: not-allowed; + color: #bbb + } + + &:hover{ + cursor: pointer; + } + + &-visible{ + transform: rotate(180deg); + } +} diff --git a/packages/theme/src/error-page/index-global.less b/packages/theme/src/error-page/index-global.less new file mode 100644 index 000000000..aee3d47f1 --- /dev/null +++ b/packages/theme/src/error-page/index-global.less @@ -0,0 +1,232 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +.tiny-popup__wrapper { + z-index: 2147483647 !important; + background: rgba(0, 0, 0, 0.5); + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + overflow: auto; + margin: 0; + + //错误提示页 + .tiny-errortips__box { + position: absolute; + width: 800px; + min-height: 450px; + max-height: 600px; + top: 0; + left: 0; + right: 0; + bottom: 0; + margin: auto; + overflow: hidden; + background: #fff; + border: 1px solid transparent; + box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.2); + text-align: center; + overflow-y: auto; + + .tiny-errortips__body { + height: 100%; + text-align: initial; + padding: 20px; + color: #5a5e66; + font-size: 14px; + display: table; + margin: auto; + + .errortips { + text-align: center; + display: table-cell; + vertical-align: middle; + + .error-code { + font-size: 100px; + color: #9ac7ef; + margin: 0 auto -45px; + text-shadow: 0px 2px 0 #fff, -2px 0px 0 #fff, 2px 0px 0 #fff; + } + + .error-img { + width: 260px; + height: 180px; + margin: 0 auto; + background: url(./images/errortips-bg.png) no-repeat; + } + + .error-content { + font-size: 16px; + margin: 24px 0; + font-weight: bold; + } + + .error-bottom { + a { + font-weight: 800; + cursor: pointer; + } + + span { + padding-right: 15px; + } + } + } + } + } + + //sso 登录 + .tiny-sso__box { + position: absolute; + background: #fff; + border: 1px solid transparent; + box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.2); + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + .tiny-sso__body { + text-align: initial; + padding: 20px; + color: #5a5e66; + line-height: 32px; + font-size: 14px; + .tiny-sso__body-iframe { + width: 350px; + height: 350px; + height: 460px\9; //兼容ie9-ie10 + overflow: hidden; + + //兼容ie10-ie11 + @media screen and (-ms-high-contrast: active), + (-ms-high-contrast: none) { + height: 460px; + } + + //兼容edge + @supports (-ms-ime-align: auto) { + height: 460px; + } + } + } + } + + //非 sso 登录 + &.login-not-sso { + background: #dcdfe4; + background-size: cover; + + .tiny-not-sso__box { + width: 100%; + height: 100%; + overflow: hidden; + + .tiny-not-sso__body { + width: 650px; + height: 400px; + background: #f4f5f9; + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + text-align: center; + border: 1px solid #d4d5d7; + box-shadow: 0px 2px 4px #989a9e; + + .title { + background: #ecedf1; + background: linear-gradient(to bottom, #ecedf1, #dadde2); + border-bottom: 1px solid #b6babf; + padding: 16px 20px; + font-size: 20px; + } + + .tbl-login { + width: 100%; + border-collapse: collapse; + border-spacing: 0; + font-size: 16px; + margin-top: 28px; + + .form-item { + height: 60px; + line-height: 60px; + + td.label { + width: 30%; + text-align: right; + color: #5a5e66; + } + + td.cell { + width: 70%; + text-align: left; + padding-left: 12px; + + input { + border: 1px solid #bfbfbf; + border-radius: 2px; + outline: none; + width: 75%; + height: 40px; + line-height: 40px; + padding: 0 8px; + background: transparent; + color: #5a5e66; + + &::-webkit-input-placeholder { + color: #999; + } + + &:hover { + border-color: #999; + } + + &:focus::-webkit-input-placeholder { + color: #d9d9d9; + } + + &.text-danger { + border-color: var(--ti-input-border-color-error); + } + } + + button { + width: 75%; + height: 40px; + line-height: 40px; + padding: 0 24px; + text-align: center; + color: #fff; + background-color: var(--ti-common-color-line-active); + border: none; + border-radius: 2px; + transition: 0.3s; + outline: 0; + + &:hover { + background-color: #40a9ff; + } + } + + .errmessage { + color: #f00; + line-height: 20px; + } + } + } + } + } + } + } +} diff --git a/packages/theme/src/error-page/index.js b/packages/theme/src/error-page/index.js new file mode 100644 index 000000000..73b7c764c --- /dev/null +++ b/packages/theme/src/error-page/index.js @@ -0,0 +1,42 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-errortips-box-bg-color': '#fff', + 'tiny-errortips-body-text-color': '#5a5e66', + 'tiny-errortips-body-font-size': '14px', + 'tiny-errortips-body-code-font-size': '100px', + 'tiny-errortips-body-code-text-color': '#9ac7ef', + 'tiny-errortips-body-content-font-size': '16px', + 'tiny-errortips-body-bottom-font-weight': '800', + 'tiny-errortips-sso-box-bg-color': '#fff', + 'tiny-errortips-sso-body-text-color': '#5a5e66', + 'tiny-errortips-sso-body-font-size': '14px', + 'tiny-errortips-not-sso-bg-color': '#dcdfe4', + 'tiny-errortips-not-sso-body-bg-color': '#f4f5f9', + 'tiny-errortips-not-sso-body-border-color': '#d4d5d7', + 'tiny-errortips-not-sso-body-title-border-color': '#b6babf', + 'tiny-errortips-not-sso-body-title-font-size': '20px', + 'tiny-errortips-not-sso-body-login-font-size': '16px', + 'tiny-errortips-not-sso-body-text-color': '#5a5e66', + 'tiny-errortips-not-sso-body-input-border-color': '#bfbfbf', + 'tiny-errortips-not-sso-body-input-border-radius': '2px', + 'tiny-errortips-not-sso-body-placeholder-text-color': '#999', + 'tiny-errortips-not-sso-body-input-hover-text-color': '#999', + 'tiny-errortips-not-sso-body-input-focus-text-color': '#d9d9d9', + 'tiny-errortips-not-sso-body-input-danger-border-color': '#f5222d', + 'tiny-errortips-not-sso-body-button-text-color': '#fff', + 'tiny-errortips-not-sso-body-button-bg-color': '#1890ff', + 'tiny-errortips-not-sso-body-button-border-radius': '2px', + 'tiny-errortips-not-sso-body-button-hover-bg-color': '#40a9ff', + 'tiny-errortips-not-sso-body-errmessage-text-color': '#f00' +} diff --git a/packages/theme/src/error-page/index.less b/packages/theme/src/error-page/index.less new file mode 100644 index 000000000..70a5f06f7 --- /dev/null +++ b/packages/theme/src/error-page/index.less @@ -0,0 +1,235 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import './vars.less'; + +.aurora-popup__wrapper { + z-index: 2147483647 !important; + background: rgba(0, 0, 0, 0.5); + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + overflow: auto; + margin: 0; + + // 错误提示页 + .aurora-errortips__box { + position: absolute; + width: var(--ti-errortips-width); + min-height: var(--ti-errortips-min-height); + max-height: var(--ti-errortips-max-height); + top: 0; + left: 0; + right: 0; + bottom: 0; + margin: auto; + overflow: hidden; + background: var(--ti-errortips-box-bg-color); + border: 1px solid transparent; + box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.2); + text-align: center; + overflow-y: auto; + + .aurora-errortips__body { + height: 100%; + text-align: initial; + padding: 20px; + color: var(--ti-errortips-body-text-color); + font-size: var(--ti-errortips-body-font-size); + display: table; + margin: auto; + + .errortips { + text-align: center; + display: table-cell; + vertical-align: middle; + + .error-code { + font-size: var(--ti-errortips-body-code-font-size); + color: var(--ti-errortips-body-code-text-color); + margin: 0 auto -45px; + text-shadow: 0px 2px 0 #fff, -2px 0px 0 #fff, 2px 0px 0 #fff; + } + + .error-img { + width: 260px; + height: 180px; + margin: 0 auto; + background: url(../images/errortips-bg.png) no-repeat; + } + + .error-content { + font-size: var(--ti-errortips-body-content-font-size); + margin: 24px 0; + font-weight: bold; + } + + .error-bottom { + a { + font-weight: var(--ti-errortips-body-bottom-font-weight); + cursor: pointer; + } + + span { + padding-right: 15px; + } + } + } + } + } + + // sso 登录 + .aurora-sso__box { + position: absolute; + background: var(--ti-errortips-sso-box-bg-color); + border: 1px solid transparent; + box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.2); + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + + .aurora-sso__body { + text-align: initial; + padding: 20px; + color: var(--ti-errortips-sso-body-text-color); + line-height: 32px; + font-size: var(--ti-errortips-sso-body-font-size); + + .aurora-sso__body-iframe { + width: 350px; + height: 350px; + height: 460px\9; // 兼容ie9-ie10 + overflow: hidden; + + // 兼容ie10-ie11 + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + height: 460px; + } + + // 兼容edge + @supports (-ms-ime-align: auto) { + height: 460px; + } + } + } + } + + // 非 sso 登录 + &.login-not-sso { + background: var(--ti-errortips-not-sso-bg-color); + background-size: cover; + + .aurora-not-sso__box { + width: 100%; + height: 100%; + overflow: hidden; + + .aurora-not-sso__body { + width: 650px; + height: 400px; + background: var(--ti-errortips-not-sso-body-bg-color); + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + text-align: center; + border: 1px solid var(--ti-errortips-not-sso-body-border-color); + box-shadow: 0px 2px 4px #989a9e; + + .title { + background: linear-gradient(to bottom, #ecedf1, #dadde2); + border-bottom: 1px solid var(--ti-errortips-not-sso-body-title-border-color); + padding: 16px 20px; + font-size: var(--ti-errortips-not-sso-body-title-font-size); + } + + .tbl-login { + width: 100%; + border-collapse: collapse; + border-spacing: 0; + font-size: var(--ti-errortips-not-sso-body-login-font-size); + margin-top: 28px; + + .form-item { + height: 60px; + line-height: 60px; + + td.label { + width: 30%; + text-align: right; + color: var(--ti-errortips-not-sso-body-text-color); + } + + td.cell { + width: 70%; + text-align: left; + padding-left: 12px; + + input { + border: 1px solid var(--ti-errortips-not-sso-body-input-border-color); + border-radius: var(--ti-errortips-not-sso-body-input-border-radius); + outline: none; + width: 75%; + height: 40px; + line-height: 40px; + padding: 0 8px; + background: transparent; + color: var(--ti-errortips-not-sso-body-text-color); + + &::-webkit-input-placeholder { + color: var(--ti-errortips-not-sso-body-placeholder-text-color); + } + + &:hover { + border-color: var(--ti-errortips-not-sso-body-placeholder-text-color); + } + + &:focus::-webkit-input-placeholder { + color: var(--ti-errortips-not-sso-body-input-focus-text-color); + } + + &.text-danger { + border-color: var(--ti-errortips-not-sso-body-input-danger-border-color); + } + } + + button { + width: 75%; + height: 40px; + line-height: 40px; + padding: 0 24px; + text-align: center; + color: var(--ti-errortips-not-sso-body-button-text-color); + background-color: var(--ti-errortips-not-sso-body-button-bg-color); + border: none; + border-radius: var(--ti-errortips-not-sso-body-button-border-radius); + transition: 0.3s; + outline: 0; + + &:hover { + background-color: var(--ti-errortips-not-sso-body-button-hover-bg-color); + } + } + + .errmessage { + color: var(--ti-errortips-not-sso-body-errmessage-text-color); + line-height: 20px; + } + } + } + } + } + } + } +} diff --git a/packages/theme/src/error-page/vars.less b/packages/theme/src/error-page/vars.less new file mode 100644 index 000000000..eb7eae77e --- /dev/null +++ b/packages/theme/src/error-page/vars.less @@ -0,0 +1,42 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +:root { + --ti-errortips-box-bg-color: var(--ti-base-color-light); + --ti-errortips-body-text-color: #5a5e66; + --ti-errortips-body-font-size: var(--ti-common-font-size-1); + --ti-errortips-body-code-font-size: 100px; + --ti-errortips-body-code-text-color: #9ac7ef; + --ti-errortips-body-content-font-size: var(--ti-common-font-size-2); + --ti-errortips-body-bottom-font-weight: var(--ti-common-font-weight-8); + --ti-errortips-sso-box-bg-color: var(--ti-base-color-light); + --ti-errortips-sso-body-text-color: #5a5e66; + --ti-errortips-sso-body-font-size: var(--ti-common-font-size-1); + --ti-errortips-not-sso-bg-color: #dcdfe4; + --ti-errortips-not-sso-body-bg-color: #f4f5f9; + --ti-errortips-not-sso-body-border-color: #d4d5d7; + --ti-errortips-not-sso-body-title-border-color: #b6babf; + --ti-errortips-not-sso-body-title-font-size: var(--ti-common-font-size-4); + --ti-errortips-not-sso-body-login-font-size: var(--ti-common-font-size-2); + --ti-errortips-not-sso-body-text-color: #5a5e66; + --ti-errortips-not-sso-body-input-border-color: var(--ti-base-color-bg-5); + --ti-errortips-not-sso-body-input-border-radius: var(--ti-common-border-radius-normal); + --ti-errortips-not-sso-body-placeholder-text-color: var(--ti-base-color-placeholder); + --ti-errortips-not-sso-body-input-hover-text-color: var(--ti-base-color-placeholder); + --ti-errortips-not-sso-body-input-focus-text-color: var(--ti-base-color-border); + --ti-errortips-not-sso-body-input-danger-border-color: var(--ti-base-color-bg-8); + --ti-errortips-not-sso-body-button-text-color: var(--ti-base-color-light); + --ti-errortips-not-sso-body-button-bg-color: var(--ti-base-color-brand-6); + --ti-errortips-not-sso-body-button-border-radius: var(--ti-common-border-radius-normal); + --ti-errortips-not-sso-body-button-hover-bg-color: var(--ti-base-color-brand-5); + --ti-errortips-not-sso-body-errmessage-text-color: #f00; +} diff --git a/packages/theme/src/espace/index.js b/packages/theme/src/espace/index.js new file mode 100644 index 000000000..3c36ced01 --- /dev/null +++ b/packages/theme/src/espace/index.js @@ -0,0 +1,17 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-espace-font-size': '26px', + 'tiny-espace-text-color': '#1890ff', + 'tiny-espace-hover-text-color': '#40a9ff' +} diff --git a/packages/theme/src/espace/index.less b/packages/theme/src/espace/index.less new file mode 100644 index 000000000..de0de1fac --- /dev/null +++ b/packages/theme/src/espace/index.less @@ -0,0 +1,39 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@espace-prefix-cls: ~'@{css-prefix}espace'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{espace-prefix-cls} { + .component-css-vars-espace(); + + .item-talk, + .item-call, + .item-email { + margin: 0 8px 0 0; + line-height: 1; + + .@{svg-prefix-cls} { + fill: var(--ti-espace-text-color); + font-size: var(--ti-espace-font-size); + } + + &:hover { + .@{svg-prefix-cls} { + fill: var(--ti-espace-hover-text-color); + } + } + } +} diff --git a/packages/theme/src/espace/vars.less b/packages/theme/src/espace/vars.less new file mode 100644 index 000000000..2597469b8 --- /dev/null +++ b/packages/theme/src/espace/vars.less @@ -0,0 +1,17 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-espace() { + --ti-espace-font-size: 26px; + --ti-espace-text-color: var(--ti-base-color-brand-6); + --ti-espace-hover-text-color: var(--ti-base-color-brand-5); +} diff --git a/packages/theme/src/fall-menu/index.js b/packages/theme/src/fall-menu/index.js new file mode 100644 index 000000000..dce074249 --- /dev/null +++ b/packages/theme/src/fall-menu/index.js @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-fallmenu-menu-height': '42px', + 'tiny-fallmenu-bg-color-normal': '#1890ff', + 'tiny-fallmenu-bg-color-hover': '#40a9ff', + 'tiny-fallmenu-icon-font-size': '12px', + 'tiny-fallmenu-slot-text-color': '#fff', + 'tiny-fallmenu-slot-bg-color': '#fff', + 'tiny-fallmenu-title-font-size': '16px', + 'tiny-fallmenu-box-title-text-color': '#999', + 'tiny-fallmenu-box-text-color': '#1890ff', + 'tiny-fallmenu-box-font-size': '14px', + 'tiny-fallmenu-box-title-height': '24px', + 'tiny-fallmenu-box-content-height': '26px', + 'tiny-fallmenu-box-hover-text-color': '#096dd9' +} diff --git a/packages/theme/src/fall-menu/index.less b/packages/theme/src/fall-menu/index.less new file mode 100644 index 000000000..0195eee5d --- /dev/null +++ b/packages/theme/src/fall-menu/index.less @@ -0,0 +1,206 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +@fall-menu-prefix-cls: ~'@{css-prefix}fall-menu'; + +.@{fall-menu-prefix-cls} { + .component-css-vars-fall-menu(); + + & &__wrap { + background: var(--ti-fallmenu-bg-color-normal); + padding: 0 24px; + } + + & &__nav { + height: var(--ti-fallmenu-menu-height); + margin: 0 auto; + position: relative; + } + + & &__subnav { + overflow: hidden; + + .icon-slot-left, + .icon-slot-right { + color: var(--ti-fallmenu-slot-text-color); + cursor: pointer; + position: absolute; + top: 50%; + transform: translateY(-50%); + font-size: var(--ti-fallmenu-icon-font-size); + line-height: 1; + + svg { + fill: #fff; + } + } + + .icon-slot-left { + left: -12px; + } + + .icon-slot-right { + right: -12px; + } + } + + & &__list { + position: relative; + min-width: 4000px; + left: 0; + transition: left 0.4s; + + .fall-hide { + .opacity(0); + } + + ul { + .clearfix(); + } + + li { + float: left; + position: relative; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + + a { + float: left; + display: block; + width: auto; + padding: 0 12px; + height: var(--ti-fallmenu-menu-height); + text-align: center; + text-decoration: none; + font-weight: 400; + line-height: var(--ti-fallmenu-menu-height); + font-size: var(--ti-fallmenu-title-font-size); + color: var(--ti-fallmenu-slot-text-color); + + &:hover, + &.now { + color: var(--ti-fallmenu-slot-text-color); + background: var(--ti-fallmenu-bg-color-hover); + text-decoration: none; + } + + &.now:before { + position: absolute; + content: ''; + width: 0; + height: 0; + border-style: solid; + border-width: 0; + border-color: #ffffff transparent; + top: 34px; + left: 42%; + } + } + } + + & &__box { + position: absolute; + left: 0px; + top: var(--ti-fallmenu-menu-height); + width: 100%; + background: var(--ti-fallmenu-slot-bg-color); + overflow: hidden; + transition: opacity 0.4s; + .opacity(0); + + .contbox { + overflow: hidden; + } + + .cont { + min-width: 120px; + padding: 18px 20px; + } + + .sublist { + li { + float: left; + width: 100%; + + h3.mcate-item-hd { + font-size: var(--ti-fallmenu-box-font-size); + border-bottom: 0px solid #ccc; + color: var(--ti-fallmenu-box-title-text-color); + font-weight: normal; + margin: 0; + } + + p.mcate-item-bd { + margin-top: 18px; + + a { + margin: 8px 0px 0 0; + font-size: var(--ti-common-font-size-base); + color: var(--ti-fallmenu-box-text-color); + text-decoration: none; + display: block; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + + &:hover { + color: var(--ti-fallmenu-box-hover-text-color); + } + } + } + } + } + + &.active, + &:hover { + border-left: 1px solid #d9d9d9; + border-right: 1px solid #d9d9d9; + border-bottom: 1px solid #d9d9d9; + box-shadow: 1px 1px 5px 1px #d9d9d9; + .opacity(1); + } + } +} + +@keyframes leftArrow { + 0% { + left: -17px; + } + + 50% { + left: -13px; + } + + 100% { + left: -17px; + } +} + +@keyframes rightArrow { + 0% { + right: -17px; + } + + 50% { + right: -13px; + } + + 100% { + right: -17px; + } +} diff --git a/packages/theme/src/fall-menu/vars.less b/packages/theme/src/fall-menu/vars.less new file mode 100644 index 000000000..f8e66ab7e --- /dev/null +++ b/packages/theme/src/fall-menu/vars.less @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-fall-menu() { + --ti-fallmenu-menu-height: var(--ti-base-size-height-large); + --ti-fallmenu-bg-color-normal: var(--ti-base-color-brand-6); + --ti-fallmenu-bg-color-hover: var(--ti-base-color-brand-5); + --ti-fallmenu-icon-font-size: var(--ti-common-font-size-base); + --ti-fallmenu-slot-text-color: var(--ti-base-color-light); + --ti-fallmenu-slot-bg-color: var(--ti-base-color-light); + --ti-fallmenu-title-font-size: var(--ti-common-font-size-2); + --ti-fallmenu-box-title-text-color: var(--ti-base-color-placeholder); + --ti-fallmenu-box-text-color: var(--ti-base-color-brand-6); + --ti-fallmenu-box-font-size: var(--ti-common-font-size-1); + --ti-fallmenu-box-title-height: var(--ti-base-size-height-small); + --ti-fallmenu-box-content-height: 26px; + --ti-fallmenu-box-hover-text-color: var(--ti-base-color-primary-active); +} diff --git a/packages/theme/src/file-upload/index.js b/packages/theme/src/file-upload/index.js new file mode 100644 index 000000000..2222e2bb0 --- /dev/null +++ b/packages/theme/src/file-upload/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // file-upload +} diff --git a/packages/theme/src/file-upload/index.less b/packages/theme/src/file-upload/index.less new file mode 100644 index 000000000..f126b5755 --- /dev/null +++ b/packages/theme/src/file-upload/index.less @@ -0,0 +1,63 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@upload-thumb-prefix-cls: ~'@{css-prefix}upload--thumb'; + +.@{upload-thumb-prefix-cls} { + &__head { + cursor: pointer; + color: #343434; + font-size: var(--ti-common-font-size-1); + .thumb-icon { + margin-right: 8px; + fill: #999; + } + span { + vertical-align: middle; + } + } + &__body { + .thumb-item { + display: flex; + justify-content: flex-start; + align-items: center; + &:not(:last-child) { + padding-bottom: 8px; + } + } + .thumb-item-name { + padding: 4px 8px; + color: #333; + flex: 1; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + + .thumb-success-icon { + fill: #52c41a; + } + + .close-icon, + .download-icon, + .refres-icon { + fill: #7c7c7c; + cursor: pointer; + } + + .thumb-icon + .thumb-icon { + margin-left: 8px; + } + } +} diff --git a/packages/theme/src/file-upload/vars.less b/packages/theme/src/file-upload/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/file-upload/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/floatbar/index.js b/packages/theme/src/floatbar/index.js new file mode 100644 index 000000000..4c66b95b1 --- /dev/null +++ b/packages/theme/src/floatbar/index.js @@ -0,0 +1,21 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-floatbar-border-color': '#d9d9d9', + 'tiny-floatbar-border-radius': '1px', + 'tiny-floatbar-font-size': '14px', + 'tiny-floatbar-list-bg-color': '#fff', + 'tiny-floatbar-list-text-color': '#333333', + 'tiny-floatbar-list-hover-bg-color': 'rgba(24, 144, 255, 0.06)', + 'tiny-floatbar-list-hover-text-color': '#1890ff' +} diff --git a/packages/theme/src/floatbar/index.less b/packages/theme/src/floatbar/index.less new file mode 100644 index 000000000..a3a73dda4 --- /dev/null +++ b/packages/theme/src/floatbar/index.less @@ -0,0 +1,61 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@float-bar-prefix-cls: ~'@{css-prefix}float-bar'; + +.@{float-bar-prefix-cls} { + .component-css-vars-floatbar(); + + position: fixed; + top: 50%; + right: 10px; + z-index: 99999; + border: 1px solid var(--ti-floatbar-border-color); + box-shadow: 2px 3px 7px rgba(0, 0, 0, 0.15); + border-radius: var(--ti-floatbar-border-radius); + overflow: hidden; + background: var(--ti-floatbar-list-bg-color); + + ul { + li { + display: block; + background: var(--ti-floatbar-list-bg-color); + color: var(--ti-floatbar-list-text-color); + font-size: var(--ti-floatbar-font-size); + min-width: 80px; + min-height: 40px; + line-height: 40px; + text-align: center; + + &:hover { + background: var(--ti-floatbar-list-hover-bg-color); + } + + a { + width: 100%; + height: 100%; + color: var(--ti-floatbar-list-text-color); + cursor: pointer; + outline: none; + + &:hover, + &:focus { + color: var(--ti-floatbar-list-hover-text-color); + text-decoration: none; + } + } + } + } +} diff --git a/packages/theme/src/floatbar/vars.less b/packages/theme/src/floatbar/vars.less new file mode 100644 index 000000000..803f9a639 --- /dev/null +++ b/packages/theme/src/floatbar/vars.less @@ -0,0 +1,21 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-floatbar() { + --ti-floatbar-border-color: var(--ti-base-color-border); + --ti-floatbar-border-radius: var(--ti-base-radius-small); + --ti-floatbar-font-size: var(--ti-common-font-size-1); + --ti-floatbar-list-bg-color: var(--ti-base-color-light); + --ti-floatbar-list-text-color: var(--ti-base-color-info-normal); + --ti-floatbar-list-hover-bg-color: rgba(24, 144, 255, 0.06); + --ti-floatbar-list-hover-text-color: var(--ti-base-color-brand-6); +} diff --git a/packages/theme/src/form-item/index.js b/packages/theme/src/form-item/index.js new file mode 100644 index 000000000..a93545e03 --- /dev/null +++ b/packages/theme/src/form-item/index.js @@ -0,0 +1,24 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-form-item-small-line-height': '28px', + 'tiny-form-item-medium-line-height': '36px', + 'tiny-form-item-mini-line-height': '24px', + 'tiny-form-item-label-font-size': '14px', + 'tiny-form-item-label-line-height': '30px', + 'tiny-form-item-label-text-color': '#333', + 'tiny-form-item-error-text-color': '#f5222d', + 'tiny-form-item-error-border-color': '#f5222d', + 'tiny-form-item-error-font-size': '12px', + 'tiny-form-item-error-bg-color': '#ffeeed' +} diff --git a/packages/theme/src/form-item/index.less b/packages/theme/src/form-item/index.less new file mode 100644 index 000000000..d008d3b33 --- /dev/null +++ b/packages/theme/src/form-item/index.less @@ -0,0 +1,247 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import '../mixins/common.less'; +@import './vars.less'; + +@form-item-prefix-cls: ~'@{css-prefix}form-item'; +@input-prefix-cls: ~'@{css-prefix}input'; +@input-group-prefix-cls: ~'@{css-prefix}input-group'; +@textarea-prefix-cls: ~'@{css-prefix}textarea'; +@button-prefix-cls: ~'@{css-prefix}button'; +@numeric-prefix-cls: ~'@{css-prefix}numeric'; +@date-editor-prefix-cls: ~'@{css-prefix}date-editor'; +@tooltip-prefix-cls: ~'@{css-prefix}tooltip'; +@switch-prefix-cls: ~'@{css-prefix}switch'; +@range-editor-prefix-cls: ~'@{css-prefix}range-editor'; +@select-prefix-cls: ~'@{css-prefix}select'; + +.@{form-item-prefix-cls} { + .component-css-vars-form-item(); + + margin-bottom: 12px; + .clearfix(); + + & & { + margin-bottom: 0; + } + + &&--mini, + &&--small { + margin-bottom: 8px; + } + + &--medium &__label { + height: var(--ti-form-item-medium-line-height); + line-height: var(--ti-form-item-medium-line-height); + } + + &--small &__label { + height: var(--ti-form-item-small-line-height); + line-height: var(--ti-form-item-small-line-height); + } + + &--small &__error { + padding-top: 2px; + } + + &--mini &__label { + height: var(--ti-form-item-mini-line-height); + line-height: var(--ti-form-item-mini-line-height); + } + + &--medium &__content { + .@{css-prefix}checkbox, + .@{css-prefix}radio { + line-height: 42px; + } + + .@{input-prefix-cls} .@{input-prefix-cls}__inner { + height: 42px; + line-height: 42px; + } + } + + &--small &__content { + .@{css-prefix}checkbox, + .@{css-prefix}radio { + line-height: 36px; + } + + .@{input-prefix-cls} .@{input-prefix-cls}__inner { + height: 36px; + line-height: 36px; + } + } + + &--mini &__content { + .@{css-prefix}checkbox, + .@{css-prefix}radio { + line-height: 24px; + } + + .@{input-prefix-cls} .@{input-prefix-cls}__inner { + height: 24px; + line-height: 24px; + } + } + + &--mini &__error { + padding-top: 1px; + } + + &__label-wrap { + float: left; + + .@{form-item-prefix-cls}__label { + display: inline-block; + float: none; + } + } + + &__label { + text-align: right; + vertical-align: middle; + float: left; + font-size: var(--ti-form-item-label-font-size); + color: var(--ti-form-item-label-text-color); + height: var(--ti-form-item-label-line-height); + line-height: var(--ti-form-item-label-line-height); + padding-right: 8px; + box-sizing: border-box; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + } + + &__content { + position: relative; + font-size: var(--ti-form-item-label-font-size); + .clearfix(); + + .@{input-prefix-cls} { + display: inline-block; + &.@{range-editor-prefix-cls}.@{input-prefix-cls}__inner { + display: inline-flex; + } + + &.@{input-group-prefix-cls} { + display: inline-table; + } + } + + .@{input-group-prefix-cls} { + vertical-align: top; + } + + .@{button-prefix-cls} + .@{button-prefix-cls} { + margin-left: 8px; + } + + .@{css-prefix}checkbox, + .@{css-prefix}radio { + line-height: 30px; + } + + .@{numeric-prefix-cls}, + .@{date-editor-prefix-cls}--daterange.@{input-prefix-cls}, + .@{date-editor-prefix-cls}--daterange.@{input-prefix-cls}__inner, + .@{date-editor-prefix-cls}--timerange.@{input-prefix-cls}, + .@{date-editor-prefix-cls}--timerange.@{input-prefix-cls}__inner { + width: 100%; + } + } + + &__error { + color: var(--ti-form-item-error-text-color); + font-size: var(--ti-form-item-error-font-size); + line-height: 1; + padding-top: 4px; + position: absolute; + top: 100%; + left: 0; + + .validate-icon { + fill: var(--ti-form-item-error-text-color); + margin-right: 8px; + } + } + + &__error--inline { + position: relative; + top: auto; + left: auto; + display: inline-block; + margin-left: 10px; + } + + &.is-required:not(.is-no-asterisk) { + .@{form-item-prefix-cls}__label-wrap > .@{form-item-prefix-cls}__label:before, + & > .@{form-item-prefix-cls}__label:before { + content: '*'; + color: var(--ti-form-item-error-text-color); + margin-right: 4px; + } + } + + &.is-error { + .@{input-prefix-cls}__inner, + .@{input-prefix-cls}__inner:focus, + .@{textarea-prefix-cls}__inner, + .@{textarea-prefix-cls}__inner:focus { + border-color: var(--ti-form-item-error-border-color); + background-color: var(--ti-form-item-error-bg-color); + } + + .@{input-group-prefix-cls}__append, + .@{input-group-prefix-cls}__prepend { + .@{input-prefix-cls}__inner { + border-color: transparent; + } + } + + .@{input-prefix-cls}__validateIcon { + color: var(--ti-form-item-error-text-color); + } + + .@{numeric-prefix-cls}__input-inner, + .@{numeric-prefix-cls}__input-inner:focus { + border-color: #f5222d; + } + } + + &--feedback .@{input-prefix-cls}__validateIcon { + display: inline-block; + } + + .@{input-prefix-cls}__validateIcon { + display: none; + } +} + +.@{css-prefix} { + &zoom-in-top-enter-active, + &zoom-in-top-leave-active { + opacity: 1; + transform: scaleY(1); + transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1); + transform-origin: center top; + } + + &zoom-in-top-enter, + &zoom-in-top-enter-from, + &zoom-in-top-leave-active { + opacity: 0; + transform: scaleY(0); + } +} diff --git a/packages/theme/src/form-item/vars.less b/packages/theme/src/form-item/vars.less new file mode 100644 index 000000000..b64d06b32 --- /dev/null +++ b/packages/theme/src/form-item/vars.less @@ -0,0 +1,24 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-form-item() { + --ti-form-item-small-line-height: 36px; + --ti-form-item-medium-line-height: 42px; + --ti-form-item-mini-line-height: 24px; + --ti-form-item-label-line-height: var(--ti-base-size-height-minor); + --ti-form-item-label-font-size: var(--ti-common-font-size-1); + --ti-form-item-label-text-color: var(--ti-base-color-info-normal); + --ti-form-item-error-font-size: var(--ti-common-font-size-base); + --ti-form-item-error-text-color: var(--ti-base-color-error-3); + --ti-form-item-error-border-color: var(--ti-base-color-error-3); + --ti-form-item-error-bg-color: var(--ti-base-color-error-1); +} diff --git a/packages/theme/src/form/index.js b/packages/theme/src/form/index.js new file mode 100644 index 000000000..bd474def8 --- /dev/null +++ b/packages/theme/src/form/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-form-item-margin-right': '10px' +} diff --git a/packages/theme/src/form/index.less b/packages/theme/src/form/index.less new file mode 100644 index 000000000..a3f44c3a7 --- /dev/null +++ b/packages/theme/src/form/index.less @@ -0,0 +1,132 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@form-prefix-cls: ~'@{css-prefix}form'; +@form-item-prefix-cls: ~'@{css-prefix}form-item'; +@tooltip-prefix-cls: ~'@{css-prefix}tooltip'; + +.@{form-prefix-cls} { + .component-css-vars-form(); + + width: 100%; + overflow: hidden; + + div { + outline: none; + } + + &--inline { + .@{form-item-prefix-cls}, + .@{form-item-prefix-cls}__content { + display: inline-block; + vertical-align: top; + } + + .@{form-item-prefix-cls} { + margin-right: var(--ti-form-item-margin-right); + } + + .@{form-item-prefix-cls}__label { + float: none; + display: inline-block; + } + + .@{form-prefix-cls}--label-top .@{form-item-prefix-cls}__content { + display: block; + } + } + + &--label-left { + &.has-required { + .@{form-item-prefix-cls}__label { + padding-left: 12px; + } + } + .@{form-item-prefix-cls}__label { + text-align: left; + } + &.label-align { + .@{form-item-prefix-cls} { + &.is-required { + .@{form-item-prefix-cls}__label { + padding-left: 12px; + position: relative; + &::before { + font-size: 20px; + line-height: 1; + position: absolute; + left: 0; + top: 60%; + transform: translateY(-50%); + } + } + & ~ .@{form-item-prefix-cls} { + .@{form-item-prefix-cls}__label { + padding-left: 12px; + } + } + } + } + } + } + + &--label-top { + .@{form-item-prefix-cls}__label { + float: none; + display: inline-block; + text-align: left; + line-height: 1; + padding: 0 0 8px; + } + + .@{form-item-prefix-cls} { + margin-bottom: 16px; + } + } + + &--label-top & { + margin-bottom: 16px; + } + + &--inline&--label-top { + .@{form-item-prefix-cls} { + margin-bottom: 16px; + margin-right: 64px; + } + + .@{form-item-prefix-cls}__label { + display: block; + text-align: left; + } + } + + &__valid { + &.@{tooltip-prefix-cls}.@{tooltip-prefix-cls}__popper { + padding: 7px 4px; + + &.is-error[x-placement^='top'] .popper__arrow { + bottom: -4px; + } + + &[x-placement^='top'] { + margin-bottom: 6px; + } + + &[x-placement^='bottom'] { + margin-top: 6px; + } + } + } +} diff --git a/packages/theme/src/form/vars.less b/packages/theme/src/form/vars.less new file mode 100644 index 000000000..0d44e88af --- /dev/null +++ b/packages/theme/src/form/vars.less @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-form() { + --ti-form-item-margin-right: 10px; +} diff --git a/packages/theme/src/fullscreen/index.js b/packages/theme/src/fullscreen/index.js new file mode 100644 index 000000000..38a6eec8b --- /dev/null +++ b/packages/theme/src/fullscreen/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // fullscreen +} diff --git a/packages/theme/src/fullscreen/index.less b/packages/theme/src/fullscreen/index.less new file mode 100644 index 000000000..eb9ba79d1 --- /dev/null +++ b/packages/theme/src/fullscreen/index.less @@ -0,0 +1,19 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@fullscreen-prefix-cls: ~'@{css-prefix}fullscreen'; + +.@{fullscreen-prefix-cls} { + overflow: auto; +} diff --git a/packages/theme/src/fullscreen/vars.less b/packages/theme/src/fullscreen/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/fullscreen/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/gantt/index.js b/packages/theme/src/gantt/index.js new file mode 100644 index 000000000..6839f050b --- /dev/null +++ b/packages/theme/src/gantt/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // gantt +} diff --git a/packages/theme/src/gantt/index.less b/packages/theme/src/gantt/index.less new file mode 100644 index 000000000..ed5cb41f2 --- /dev/null +++ b/packages/theme/src/gantt/index.less @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@gantt-prefix-cls: ~'@{css-prefix}gantt'; + +.@{gantt-prefix-cls} { + width: 100%; + height: 500px; +} diff --git a/packages/theme/src/gantt/vars.less b/packages/theme/src/gantt/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/gantt/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/grid-system/index.js b/packages/theme/src/grid-system/index.js new file mode 100644 index 000000000..831be7fb6 --- /dev/null +++ b/packages/theme/src/grid-system/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // grid-system +} diff --git a/packages/theme/src/grid-system/index.less b/packages/theme/src/grid-system/index.less new file mode 100644 index 000000000..02739c319 --- /dev/null +++ b/packages/theme/src/grid-system/index.less @@ -0,0 +1,93 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/variable.less'; +@import '../mixins/common.less'; +@import '../custom.less'; + +@filter-prefix-cls: ~'@{css-prefix}filter'; + +.container { + .container-fixed(); + + @media (min-width: @screen-sm) { + width: @container-sm; + } + + @media (min-width: @screen-md) { + width: @container-md; + } + + @media (min-width: @screen-lg-min) { + width: @container-lg; + } + + @media (min-width: @screen-xl-min) { + width: @container-xl; + } +} + +.row { + .make-row(); + + h3 { + margin-left: (@grid-gutter-width / 2); + } +} + +.@{filter-prefix-cls} .row { + overflow: hidden; + + .title { + margin-left: 10px; + } +} + +.make-grid-columns(); + +.make-grid-columns-float(xs); +.make-grid(@grid-columns, xs, width); +.make-grid(@grid-columns, xs, push); +.make-grid(@grid-columns, xs, pull); +.make-grid(@grid-columns, xs, offset); + +@media (min-width: @screen-sm-min) { + .make-grid-columns-float(sm); + .make-grid(@grid-columns, sm, width); + .make-grid(@grid-columns, sm, push); + .make-grid(@grid-columns, sm, pull); + .make-grid(@grid-columns, sm, offset); +} + +@media (min-width: @screen-md-min) { + .make-grid-columns-float(md); + .make-grid(@grid-columns, md, width); + .make-grid(@grid-columns, md, push); + .make-grid(@grid-columns, md, pull); + .make-grid(@grid-columns, md, offset); +} + +@media (min-width: @screen-lg-min) { + .make-grid-columns-float(lg); + .make-grid(@grid-columns, lg, width); + .make-grid(@grid-columns, lg, push); + .make-grid(@grid-columns, lg, pull); + .make-grid(@grid-columns, lg, offset); +} + +@media (min-width: @screen-xl-min) { + .make-grid-columns-float(xl); + .make-grid(@grid-columns, xl, width); + .make-grid(@grid-columns, xl, push); + .make-grid(@grid-columns, xl, pull); + .make-grid(@grid-columns, xl, offset); +} diff --git a/packages/theme/src/grid/base/common.less b/packages/theme/src/grid/base/common.less new file mode 100644 index 000000000..fe68fcf4c --- /dev/null +++ b/packages/theme/src/grid/base/common.less @@ -0,0 +1,53 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../../custom.less'; + +@grid-prefix-cls: ~'@{css-prefix}grid'; +@grid-input-prefix-cls: ~'@{css-prefix}grid-input'; +@grid-tree-prefix-cls: ~'@{css-prefix}grid-tree'; + +// animat +.@{grid-prefix-cls}__animat { + .@{grid-prefix-cls}-sort__asc-btn, + .@{grid-prefix-cls}-sort__desc-btn, + .@{grid-prefix-cls}-filter__btn { + &:before, + &:after { + .animatTransition(border); + } + } + + .@{grid-prefix-cls}__expand-icon { + .animatTransition(all); + } + + .@{grid-input-prefix-cls}__wrapper { + .@{grid-input-prefix-cls} { + .animatTransition(border); + } + } + + .@{grid-tree-prefix-cls}__node-btn { + .animatTransition(transform); + } + + .@{grid-prefix-cls}-checkbox, + .@{grid-prefix-cls}-radio { + > input { + &:checked + span { + .animatTransition(background-color); + } + } + } +} diff --git a/packages/theme/src/grid/body.less b/packages/theme/src/grid/body.less new file mode 100644 index 000000000..5f2be74b5 --- /dev/null +++ b/packages/theme/src/grid/body.less @@ -0,0 +1,92 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@grid-prefix-cls: ~'@{css-prefix}grid'; +@grid-body-prefix-cls: ~'@{css-prefix}grid-body'; +@numeric-prefix-cls: ~'@{css-prefix}numeric'; + +.@{grid-prefix-cls}__body-wrapper, +.@{grid-prefix-cls}__fixed-left-body-wrapper, +.@{grid-prefix-cls}__fixed-right-body-wrapper { + overflow-y: auto; + overflow-x: auto; +} + +.@{grid-prefix-cls}__borders { + .@{grid-prefix-cls}-border-top, + .@{grid-prefix-cls}-border-right, + .@{grid-prefix-cls}-border-bottom, + .@{grid-prefix-cls}-border-left { + position: absolute; + background-color: var(--ti-grid-primary-color); + } + + .@{grid-prefix-cls}-checked-borders { + .@{grid-prefix-cls}-border-top, + .@{grid-prefix-cls}-border-bottom { + height: var(--ti-grid-column-checked-border-width); + } + + .@{grid-prefix-cls}-border-right, + .@{grid-prefix-cls}-border-left { + width: var(--ti-grid-column-checked-border-width); + } + } + + .@{grid-prefix-cls}-copyed-borders { + .@{grid-prefix-cls}-border-top, + .@{grid-prefix-cls}-border-bottom { + height: calc(var(--ti-grid-column-checked-border-width) + 1px); + } + + .@{grid-prefix-cls}-border-right, + .@{grid-prefix-cls}-border-left { + width: calc(var(--ti-grid-column-checked-border-width) + 1px); + } + + & > span { + background: repeating-linear-gradient(135deg, transparent, transparent 3px, var(--ti-grid-primary-color) 3px, var(--ti-grid-primary-color) 9px); + animation: shine 1s infinite linear; + } + } +} + +.@{grid-body-prefix-cls}__row { + .@{grid-body-prefix-cls}__column { + &.col__checked { + position: relative; + background-color: var(--ti-grid-column-current-background-color); + border-right-color: var(--ti-grid-column-checked-border-color); + border-bottom-color: var(--ti-grid-column-checked-border-color); + } + + &.col__selected { + background-color: var(--ti-grid-light-color); + } + + .@{numeric-prefix-cls} { + width: 100%; + } + } +} + +@keyframes shine { + 0% { + background-position: -1px -1px; + } + + 100% { + background-position: -12px -12px; + } +} diff --git a/packages/theme/src/grid/button.less b/packages/theme/src/grid/button.less new file mode 100644 index 000000000..7442f3908 --- /dev/null +++ b/packages/theme/src/grid/button.less @@ -0,0 +1,219 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import './mixins/common.less'; +@import './mixins/button.less'; +@import '../custom.less'; + +@grid-button-prefix-cls: ~'@{css-prefix}grid-button'; +@grid-icon-prefix-cls: ~'@{css-prefix}grid-icon'; +@input-prefix-cls: ~'@{css-prefix}input'; +@button-prefix-cls: ~'@{css-prefix}button'; + +.@{grid-button-prefix-cls} { + position: relative; + text-align: center; + background-color: var(--ti-grid-light-color); + outline: 0; + font-size: var(--ti-grid-font-size); + white-space: nowrap; + user-select: none; + appearance: none; + + &.is__disabled { + color: var(--ti-grid-primary-disabled-text-color); + + &:not(.is__loading) { + cursor: no-drop; + } + } + + &:not(.is__disabled) { + color: var(--ti-grid-primary-color); + cursor: pointer; + } + + &.is__loading { + &:before { + content: ''; + position: absolute; + left: -1px; + top: -1px; + right: -1px; + bottom: -1px; + border-radius: inherit; + background-color: hsla(0, 0%, 100%, 0.35); + pointer-events: none; + } + } + + &.type__text { + text-decoration: none; + border: 0; + background-color: transparent; + + &:not(.is__disabled) { + &:hover { + color: var(--ti-grid-primary-hover-color); + } + } + } + + &.type__button { + padding: 0 12px; + line-height: 28px; + border: 1px solid var(--ti-grid-border-color); + border-radius: 2px; + + &.theme__primary { + color: var(--ti-grid-light-color); + border-color: var(--ti-grid-primary-color); + background-color: var(--ti-grid-primary-color); + + &:not(.is__disabled) { + &:hover { + .ButtonPrimaryHover(var(--ti-grid-primary-hover-color)); + } + + &:active { + color: var(--ti-grid-light-color); + background-color: var(--ti-grid-primary-active-color); + border-color: var(--ti-grid-primary-active-color); + } + } + } + + &:not(.theme__primary) { + &:not(.is__disabled) { + &:hover { + .ButtonHover(var(--ti-grid-primary-color)); + } + + &:active { + color: var(--ti-grid-primary-active-color); + border-color: var(--ti-grid-primary-active-color); + } + } + } + + &.size__medium { + padding: 0 14px; + line-height: 28px; + } + + &.size__small { + padding: 0 12px; + line-height: 26px; + } + + &.size__mini { + padding: 0 10px; + line-height: 24px; + } + } + + &.size__small, + &.size__mini { + font-size: var(--ti-common-font-size-base); + } + + & + &, + & + &__dropdown { + .ButtonInterval(); + } + + &__loading-icon { + margin-right: 5px; + } + + &__wrapper, + &__dropdown { + display: inline-block; + } + + &__dropdown { + position: relative; + + & + .@{grid-button-prefix-cls}, + & + .@{grid-button-prefix-cls}__dropdown { + .ButtonInterval(); + } + + &.is__active { + & > .@{grid-button-prefix-cls} { + &.theme__primary { + .ButtonPrimaryHover(var(--ti-grid-primary-hover-color)); + } + + &:not(.is__disabled) { + &:not(.theme__primary) { + .ButtonHover(var(--ti-grid-primary-color)); + } + } + } + + .@{grid-button-prefix-cls}__dropdown-wrapper { + display: block; + } + + .@{grid-button-prefix-cls}__dropdown-arrow { + transform: rotate(315deg); + + &.@{grid-icon-prefix-cls}__arrow-bottom { + margin-top: -2px; + } + } + } + + .@{grid-button-prefix-cls}__dropdown-arrow { + font-size: var(--ti-common-font-size-base); + margin-left: 5px; + .animatTransition(transform, 0.2s); + } + + .@{grid-button-prefix-cls}__dropdown-wrapper { + display: none; + position: absolute; + left: 50%; + transform: translateX(-50%); + margin-top: 5px; + z-index: 100; + padding: 5px; + background-color: var(--ti-grid-light-color); + border-radius: 4px; + border: 1px solid var(--ti-grid-border-color); + box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2); + + & > .@{grid-button-prefix-cls} { + margin: 0; + display: block; + width: 100%; + border: 0; + + &.type__text { + padding: 2px 8px; + } + } + } + } + + &__wrapper { + .@{input-prefix-cls} { + width: 270px; + } + + .@{input-prefix-cls}, + .@{button-prefix-cls} { + vertical-align: middle; + } + } +} diff --git a/packages/theme/src/grid/checkbox.less b/packages/theme/src/grid/checkbox.less new file mode 100644 index 000000000..e3d03f1b3 --- /dev/null +++ b/packages/theme/src/grid/checkbox.less @@ -0,0 +1,126 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@grid-checkbox-prefix-cls: ~'@{css-prefix}grid-checkbox'; + +// checkbox +.@{grid-checkbox-prefix-cls} { + display: inline-block; + user-select: none; + cursor: pointer; + + &.size__small, + &.size__mini { + font-size: var(--ti-grid-font-size); + + > input { + & + .@{grid-checkbox-prefix-cls}__icon { + font-size: var(--ti-common-font-size-1); + } + } + } + + & + & { + margin-left: 10px; + } + + > input { + display: none; + + & + .@{grid-checkbox-prefix-cls}__icon { + position: relative; + display: inline-block; + width: 1em; + height: 1em; + border: 1px solid var(--ti-grid-border-color); + background-color: #fff; + vertical-align: middle; + border-radius: var(--ti-grid-border-radius); + font-size: var(--ti-common-font-size-2); + + &:before { + content: ''; + position: absolute; + } + + &:hover { + border-color: var(--ti-grid-primary-hover-color); + } + + & + .@{grid-checkbox-prefix-cls}__label { + display: none; + } + + > svg.icon-checked-sur { + display: none; + } + } + + &:checked + .@{grid-checkbox-prefix-cls}__icon { + border: none; + + & + .@{grid-checkbox-prefix-cls}__label { + color: var(--ti-grid-primary-color); + } + + > svg { + display: block; + fill: var(--ti-grid-primary-color); + } + } + } + + &.is__indeterminate { + > input { + &:not(:checked) { + & + .@{grid-checkbox-prefix-cls}__icon { + border: none; + > svg { + fill: var(--ti-grid-primary-color); + } + } + } + } + } + + &.is__disabled { + cursor: not-allowed; + + > input { + & + .@{grid-checkbox-prefix-cls}__icon { + border-color: var(--ti-grid-border-color); + background-color: var(--ti-grid-input-disabled-bg-color); + + &:before { + border-color: var(--ti-grid-input-disabled-bg-color); + } + + & + .@{grid-checkbox-prefix-cls}__label { + color: var(--ti-grid-border-color); + } + } + + &:checked + .@{grid-checkbox-prefix-cls}__icon { + border-color: var(--ti-grid-disabled-color); + background-color: var(--ti-grid-disabled-color); + } + } + } + + & &__label { + padding-left: 5px; + vertical-align: middle; + display: inline-block; + } +} diff --git a/packages/theme/src/grid/custom-switch.less b/packages/theme/src/grid/custom-switch.less new file mode 100644 index 000000000..3880caa62 --- /dev/null +++ b/packages/theme/src/grid/custom-switch.less @@ -0,0 +1,84 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@grid-custom-switch-prefix-cls: ~'@{css-prefix}grid-custom-switch'; + +// custom-switch +.@{grid-custom-switch-prefix-cls} { + margin-top: 8px; + padding-bottom: 12px; + border-bottom: 1px solid #d9d9d9; + + .@{grid-custom-switch-prefix-cls}__title { + margin-bottom: 12px; + font-weight: 400; + + .@{css-prefix}svg { + font-size: var(--ti-common-font-size-3); + } + + .@{css-prefix}alert__description { + font-size: var(--ti-common-font-size-1); + } + } + + .@{grid-custom-switch-prefix-cls}__label { + text-align: right; + position: relative; + top: 2px; + padding-right: 3px; + } + + .@{grid-custom-switch-prefix-cls}__content { + position: relative; + top: -4px; + } + + .@{grid-custom-switch-prefix-cls}__icon-btn { + fill: #1890ff; + font-size: var(--ti-common-font-size-1); + cursor: pointer; + + &:hover { + fill: #096dd9; + } + + &--disabled, + &--disabled:hover { + fill: #bfbfbf; + cursor: not-allowed; + } + + & + .@{grid-custom-switch-prefix-cls}__icon-btn { + margin-left: 12px; + } + + &:first-child { + margin-left: 20px; + } + } +} + +// dialog box +.@{grid-custom-switch-prefix-cls}__dialog-box { + .@{grid-custom-switch-prefix-cls}__confirm-btns { + display: flex; + justify-content: flex-end; + width: 85%; + } + + .@{grid-custom-switch-prefix-cls}__del-tip { + text-align: center; + } +} diff --git a/packages/theme/src/grid/custom.less b/packages/theme/src/grid/custom.less new file mode 100644 index 000000000..fbabe5cef --- /dev/null +++ b/packages/theme/src/grid/custom.less @@ -0,0 +1,183 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@grid-custom-prefix-cls: ~'@{css-prefix}grid-custom'; +@grid-prefix-cls: ~'@{css-prefix}grid'; +@grid-radio-prefix-cls: ~'@{css-prefix}grid-radio'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{grid-custom-prefix-cls} { + width: 100%; + + & &__tabs { + .@{grid-custom-prefix-cls}__tabs-head { + white-space: nowrap; + margin: 0; + overflow: hidden; + height: var(--ti-grid-custom-head-height); + width: 100%; + position: relative; + + ul { + height: var(--ti-grid-custom-head-height); + border-bottom: 1px solid var(--ti-grid-border-color); + list-style: none; + box-sizing: border-box; + + li { + float: left; + margin-right: -1px; + cursor: pointer; + line-height: 28px; + padding: 0 20px; + color: var(--ti-grid-text-color); + min-width: 90px; + height: var(--ti-grid-custom-head-height); + line-height: var(--ti-grid-custom-head-height); + + &.@{grid-custom-prefix-cls}__tabs-selected { + color: var(--ti-grid-primary-color); + border-bottom: 3px solid var(--ti-grid-primary-color); + font-weight: 700; + } + } + } + } + + .@{grid-custom-prefix-cls}__tabs-body { + overflow-y: auto; + border: 0; + padding: 12px 0; + + .tabs-body-item { + .@{grid-custom-prefix-cls}__alert { + position: relative; + border: 1px solid; + border-radius: var(--ti-grid-border-radius); + height: var(--ti-grid-custom-body-list-height); + line-height: var(--ti-grid-custom-body-list-height); + padding-left: 8px; + overflow: hidden; + background: var(--ti-grid-row-hover-background-color); + border-color: #91d5ff; + color: var(--ti-grid-text-color); + display: flex; + align-items: center; + + .@{svg-prefix-cls} { + font-size: var(--ti-common-font-size-3); + fill: var(--ti-grid-primary-color); + } + + p { + display: inline-block; + line-height: 16px; + padding-left: 8px; + } + } + + .@{grid-custom-prefix-cls}__setting { + border-bottom: 1px solid var(--ti-grid-border-color); + padding: 12px 0 24px; + + .setting-item { + font-size: var(--ti-grid-font-size); + padding: 10px 8px; + overflow: hidden; + position: relative; + display: flex; + align-items: flex-start; + justify-content: space-between; + + .setting-icon { + font-size: 0; // 解决inline-block间隙问题 + .icon { + display: inline-block; + &:not(:last-child) { + margin-right: 12px; + } + } + + .@{svg-prefix-cls} { + font-size: var(--ti-common-font-size-1); + fill: var(--ti-grid-normal-text-color); + cursor: pointer; + + &:hover { + fill: var(--ti-grid-primary-disabled-text-color); + } + + &.open, + &.lock, + &.sort { + fill: var(--ti-grid-primary-color); + + &:hover { + fill: var(--ti-grid-primary-hover-color); + } + } + + &.is-visible { + visibility: hidden; + pointer-events: none; + } + } + } + } + + &.other-setting { + display: flex; + flex-direction: column; + + .setting-item { + span.label { + width: 26%; + display: inline-block; + text-align: right; + padding-right: 24px; + } + + span.selection { + flex: 1; + display: inline-block; + + .@{grid-radio-prefix-cls} { + margin-right: 10px; + margin-left: 0 !important; + } + + .@{grid-radio-prefix-cls}__label { + height: 16px; + line-height: 18px; + } + } + } + } + } + } + } + + .@{grid-prefix-cls}__body-wrapper { + max-height: 45vh; + border-bottom: 0; + } + } + + & &__footer { + margin: 12px; + text-align: center; + display: flex; + justify-content: center; + } +} diff --git a/packages/theme/src/grid/default.less b/packages/theme/src/grid/default.less new file mode 100644 index 000000000..646d094c5 --- /dev/null +++ b/packages/theme/src/grid/default.less @@ -0,0 +1,23 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import './vars.less'; +@import './table.less'; +@import './header.less'; +@import './body.less'; +@import './footer.less'; +@import './filter.less'; +@import './loading.less'; +@import './grid.less'; +@import './menu.less'; +@import './custom.less'; +@import './modal.less'; diff --git a/packages/theme/src/grid/excel.less b/packages/theme/src/grid/excel.less new file mode 100644 index 000000000..64864fcce --- /dev/null +++ b/packages/theme/src/grid/excel.less @@ -0,0 +1,91 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@grid-prefix-cls: ~'@{css-prefix}grid'; +@grid-cell-prefix-cls: ~'@{css-prefix}grid-cell'; +@grid-header-prefix-cls: ~'@{css-prefix}grid-header'; +@grid-body-prefix-cls: ~'@{css-prefix}grid-body'; +@grid-input-prefix-cls: ~'@{css-prefix}grid-input'; +@grid-textarea-prefix-cls: ~'@{css-prefix}grid-textarea'; + +// excel +.@{grid-prefix-cls} { + &&-excel { + &.@{grid-cell-prefix-cls}__checked { + cursor: default; + + .@{grid-header-prefix-cls}__column { + .@{grid-prefix-cls}-resizable { + cursor: default; + } + } + } + + .@{grid-header-prefix-cls}__column { + padding: 4px 0; + font-size: var(--ti-common-font-size-base); + transition: none; + cursor: default; + } + + .@{grid-body-prefix-cls}__column { + padding: 0; + transition: none; + height: inherit; + line-height: 24px; + vertical-align: top; + cursor: cell; + + &.col__actived { + .@{grid-cell-prefix-cls} { + padding: 0; + } + } + + .@{grid-cell-prefix-cls} { + padding: 0 2px; + word-break: break-all; + + .@{grid-input-prefix-cls}__wrapper { + height: inherit; + position: relative; + + .@{grid-textarea-prefix-cls} { + position: absolute; + overflow: hidden; + padding: 0 2px; + } + + .@{grid-textarea-prefix-cls}, + .@{grid-textarea-prefix-cls}:focus { + border-radius: 0; + border: 0; + + outline: 2px solid var(--ti-grid-primary-color); + } + } + } + } + } +} + +@keyframes shine { + 0% { + background-position: -1px -1px; + } + + 100% { + background-position: -12px -12px; + } +} diff --git a/packages/theme/src/grid/filter.less b/packages/theme/src/grid/filter.less new file mode 100644 index 000000000..cbf740327 --- /dev/null +++ b/packages/theme/src/grid/filter.less @@ -0,0 +1,244 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@grid-prefix-cls: ~'@{css-prefix}grid'; +@grid-filter-prefix-cls: ~'@{css-prefix}grid-filter'; +@grid-filter-wrapper-prefix-cls: ~'@{css-prefix}grid-filter-wrapper'; +@grid-radio-prefix-cls: ~'@{css-prefix}grid-radio'; + +// 筛选 +.@{grid-filter-wrapper-prefix-cls} { + padding: 0 4px; + vertical-align: middle; + display: inline-block; + line-height: 15px; + + &.is__active { + .@{grid-filter-prefix-cls}__btn { + fill: var(--ti-grid-primary-hover-color); + } + } + + .@{grid-filter-prefix-cls}__btn { + font-size: var(--ti-common-font-size-base); + fill: #999; + cursor: pointer; + vertical-align: middle; + + &:hover { + fill: var(--ti-grid-primary-hover-color); + } + } +} + +.filter__active { + .@{grid-filter-wrapper-prefix-cls} { + .@{grid-filter-prefix-cls}__btn { + fill: var(--ti-grid-primary-color); + } + } +} + +// 筛选容器 +.@{grid-prefix-cls}__filter-wrapper { + display: none; + position: absolute; + min-width: 270px; + border-radius: var(--ti-grid-border-radius); + border: 1px solid var(--ti-grid-popup-border-color); + box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.2); + font-size: var(--ti-common-font-size-base); + z-index: 4000; + + &.filter__active { + display: block; + } + + .@{grid-prefix-cls}__filter-body { + padding: 0; + list-style-type: none; + background-color: var(--ti-grid-light-color); + overflow-x: hidden; + overflow-y: auto; + + .@{grid-prefix-cls}__filter-panel { + margin: 0; + width: 100%; + padding: 12px 8px 8px; + border-bottom: solid 1px var(--ti-grid-border-color); + + &.filter-panel__default { + padding: 8px 20px 4px; + } + + &.filter-panel__default, + &.filter-panel__clear { + padding-left: 0; + padding-right: 0; + + .@{grid-prefix-cls}__filter-option { + cursor: pointer; + padding-left: 16px; + + &:hover { + background-color: var(--ti-grid-primary-hover-color); + + a { + color: var(--ti-grid-light-color); + } + } + } + } + + &.filter-panel__enum { + padding-top: 4px; + + .@{grid-prefix-cls}__filter-options { + max-height: 170px; + overflow: auto; + + .@{grid-prefix-cls}__filter-empty { + text-align: center; + line-height: 30px; + } + + .@{grid-prefix-cls}__filter-option { + height: 28px; + line-height: 28px; + padding: 0 8px; + max-width: 240px; + width: auto; + display: flex; + justify-content: center; + align-items: center; + cursor: pointer; + + &.selected { + background-color: var(--ti-grid-header-background-color); + } + + svg { + font-size: var(--ti-common-font-size-2); + fill: var(--ti-grid-normal-text-color); + margin-right: 8px; + outline: none; + vertical-align: middle; + + &:hover { + fill: var(--ti-grid-primary-hover-color); + } + + &.is-checked { + fill: var(--ti-grid-primary-color); + } + } + } + } + } + + .@{grid-prefix-cls}__filter-option { + margin: 0; + height: 24px; + line-height: 24px; + + a { + color: var(--ti-grid-text-color); + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + width: 100%; + } + + &.filter-option__radios { + margin-bottom: 12px; + display: flex; + justify-content: space-around; + + label.@{grid-radio-prefix-cls} { + width: auto; + display: inline-block; + + .@{grid-radio-prefix-cls}__label { + color: var(--ti-grid-text-color); + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + width: auto; + max-width: 80%; + } + + & + .@{grid-radio-prefix-cls} { + margin-left: 0; + } + + &:nth-child(2) { + text-align: center; + } + + &:nth-child(3) { + text-align: right; + } + } + } + + &.filter-option__btns { + margin: 8px 0 16px; + text-align: center; + } + } + } + + .filter-option__input > input { + width: 100%; + border: solid 1px #bdbdbd; + border-radius: var(--ti-grid-border-radius); + outline: none; + padding: 0 8px; + box-sizing: border-box; + line-height: inherit; + height: 30px; + + &:focus { + border: 1px solid var(--ti-grid-primary-color); + } + } + } + + .@{grid-prefix-cls}__filter-footer { + border-top: 1px solid var(--ti-grid-popup-border-color); + padding: 8px; + + button { + background-color: transparent; + padding: 0 3px; + border: 0; + font-size: 13px; + color: var(--ti-grid-text-color); + cursor: pointer; + + &:focus { + outline: none; + } + + &:hover { + color: var(--ti-grid-primary-color); + } + + &.is__disabled { + color: var(--ti-grid-column-icon-border-color); + cursor: not-allowed; + } + } + } +} diff --git a/packages/theme/src/grid/footer.less b/packages/theme/src/grid/footer.less new file mode 100644 index 000000000..f15a0479d --- /dev/null +++ b/packages/theme/src/grid/footer.less @@ -0,0 +1,24 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@grid-prefix-cls: ~'@{css-prefix}grid'; + +.@{grid-prefix-cls}__footer-wrapper { + margin-top: -1px; + background-color: var(--ti-grid-light-color); + + &.body__wrapper { + overflow-x: auto; + } +} diff --git a/packages/theme/src/grid/grid.less b/packages/theme/src/grid/grid.less new file mode 100644 index 000000000..b6c9ce244 --- /dev/null +++ b/packages/theme/src/grid/grid.less @@ -0,0 +1,46 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@grid-prefix-cls: ~'@{css-prefix}grid'; +@grid-body-prefix-cls: ~'@{css-prefix}grid-body'; + +.@{grid-prefix-cls} { + .@{grid-body-prefix-cls}__row { + &.row__pending { + color: var(--ti-grid-error-color); + text-decoration: line-through; + cursor: no-drop; + + .@{grid-body-prefix-cls}__column { + position: relative; + + &:after { + content: ''; + position: absolute; + top: 50%; + left: 0; + width: 100%; + height: 0; + border-bottom: 1px solid var(--ti-grid-error-color); + z-index: 1; + } + } + } + } + &.mark-insert { + .@{grid-body-prefix-cls}__row.row__new { + background-color: #f2f5fc; + } + } +} diff --git a/packages/theme/src/grid/header.less b/packages/theme/src/grid/header.less new file mode 100644 index 000000000..6afaaf751 --- /dev/null +++ b/packages/theme/src/grid/header.less @@ -0,0 +1,249 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@grid-prefix-cls: ~'@{css-prefix}grid'; +@grid-header-prefix-cls: ~'@{css-prefix}grid-header'; +@grid-cell-prefix-cls: ~'@{css-prefix}grid-cell'; +@grid-checkbox-prefix-cls: ~'@{css-prefix}grid-checkbox'; +@header-suffix: ~'@{grid-prefix-cls}-cell__header-suffix'; +@cell-tooltip: ~'@{grid-prefix-cls}-cell__tooltip'; + +.@{grid-prefix-cls}__header-wrapper { + background-color: var(--ti-grid-header-background-color); + + .@{grid-prefix-cls}__repair { + position: absolute; + left: 0; + bottom: 0; + height: 0; + border-bottom: 1px solid var(--ti-grid-border-color); + } +} + +.@{grid-header-prefix-cls}__column { + position: relative; + font-size: var(--ti-grid-font-size); + color: var(--ti-grid-text-color); + + &.is__sortable { + .@{grid-cell-prefix-cls} { + padding-right: 20px; + } + } + + &.is__editable { + .@{grid-cell-prefix-cls} { + padding-left: 20px; + } + } + + &.col__title-checked { + background-color: #dcdcdc; + + .@{grid-prefix-cls}-edit-icon { + &.@{grid-prefix-cls}-icon__edit-outline { + &:before { + background-color: #dcdcdc; + } + } + } + } + + &.col__ellipsis { + .@{grid-prefix-cls}-edit-icon { + position: static; + transform: translateY(0); + } + + &.is__editable { + .@{grid-prefix-cls}-required-icon { + margin-left: 20px; + + & + .@{grid-prefix-cls}-edit-icon { + position: absolute; + transform: translateY(-50%); + } + } + } + } + + .@{grid-prefix-cls}-required-icon { + display: inline-block; + color: var(--ti-grid-error-color); + line-height: 14px; + font-size: var(--ti-common-font-size-1); + + &:before { + content: '*'; + width: 10px; + height: 10px; + display: block; + } + } + + .@{grid-prefix-cls}-edit-icon { + position: absolute; + left: 8px; + top: 50%; + transform: translateY(-50%); + text-align: center; + font-size: var(--ti-common-font-size-2); + margin-right: 4px; + fill: var(--ti-grid-column-icon-border-color); + + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + top: 18px; + } + } + + .@{grid-prefix-cls}-thead-partition, + .@{grid-prefix-cls}-resizable { + position: absolute; + right: 0; + transform: translateX(50%); + bottom: 0; + top: 0; + margin: auto; + width: 14px; + height: 28px; + text-align: center; + z-index: 1; + user-select: none; + + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + margin: 0; + } + + &.is__line { + &:before, + &:after { + content: ''; + display: inline-block; + vertical-align: middle; + } + + &:before { + width: 1px; + height: 100%; + background-color: #fff; + } + + &:after { + width: 0; + height: 100%; + } + } + + &.is__line:hover { + &:before { + background-color: var(--ti-grid-icon-fill-hover-bg-color); + } + } + } + + .@{grid-prefix-cls}-resizable { + cursor: col-resize; + } + + .@{grid-checkbox-prefix-cls} { + > input { + &:not(:checked) { + & + .@{grid-checkbox-prefix-cls}__icon { + &:hover { + border-color: var(--ti-grid-border-color); + } + } + } + } + } + + .@{grid-checkbox-prefix-cls}.is__indeterminate { + > input { + & + .@{grid-checkbox-prefix-cls}__icon { + &:hover { + border-color: var(--ti-grid-primary-color); + } + } + } + } +} + +.@{grid-prefix-cls}__fixed-left-wrapper { + .@{grid-header-prefix-cls}__column { + .@{grid-prefix-cls}-resizable { + right: 1px; + } + } +} + +.@{grid-prefix-cls}__fixed-right-wrapper { + .@{grid-header-prefix-cls}__column { + .@{grid-prefix-cls}-resizable { + right: auto; + left: 0; + transform: translateX(-50%); + } + } +} + +.@{grid-prefix-cls}__header { + .@{header-suffix} { + position: relative; + min-height: 16px; + + .suffix-icon-1 { + position: absolute; + right: 12px; + } + + .suffix-icon-0 { + position: absolute; + right: 0; + } + } + + .col__ellipsis { + &.is__editable.is__sortable.is__filter { + .@{header-suffix}.@{cell-tooltip} { + padding-right: 28px; + } + } + + &.is__editable.is__sortable:not(.is__filter), + &.is__editable.is__filter:not(.is__sortable) { + .@{header-suffix}.@{cell-tooltip} { + padding-right: 14px; + } + } + + &:not(.is__sortable):not(.is__filter) { + .@{header-suffix}.@{cell-tooltip} { + padding-right: 8px; + } + } + + &.is__sortable.is__filter:not(.is__editable) { + .@{header-suffix}.@{cell-tooltip} { + padding-right: 26px; + } + } + + &.is__sortable:not(.is__filter):not(.is__editable), + &.is__filter:not(.is__sortable):not(.is__editable) { + .@{header-suffix}.@{cell-tooltip} { + padding-right: 12px; + } + } + } +} diff --git a/packages/theme/src/grid/icon.less b/packages/theme/src/grid/icon.less new file mode 100644 index 000000000..a4ea7af8b --- /dev/null +++ b/packages/theme/src/grid/icon.less @@ -0,0 +1,389 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import './mixins/common.less'; +@import './mixins/icon.less'; +@import '../custom.less'; + +@grid-icon-prefix-cls: ~'@{css-prefix}grid-icon'; + +[class*=~'@{grid-icon-prefix-cls}__'] { + display: inline-block; + vertical-align: middle; + position: relative; + direction: ltr; + font-family: var(--ti-grid-font-family); +} + +.@{grid-icon-prefix-cls} { + &__zoomin { + width: 0.8em; + height: 0.8em; + margin: 0.1em; + border-width: 0.1em; + border-style: solid; + border-color: inherit; + } + + &__zoomout { + .DefaultWidthHeight(); + position: relative; + + &:before { + content: ''; + position: absolute; + right: 0; + width: 0.7em; + border-style: solid; + top: 0; + border-width: 0.1em; + height: 0.7em; + border-color: inherit; + } + + &:after { + content: ''; + position: absolute; + bottom: 0.1em; + background-color: #fff; + left: 0.1em; + border-style: solid; + width: 0.7em; + border-width: 0.1em; + height: 0.7em; + border-color: inherit; + } + } + + &__menu { + width: 0.22em; + height: 0.22em; + box-shadow: 0 -0.4em 0, -0.4em -0.4em 0, 0.4em -0.4em 0, 0 0 0 1em inset, + -0.4em 0 0, 0.4em 0 0, 0 0.4em 0, -0.4em 0.4em 0, 0.4em 0.4em 0; + margin: 0.58em; + .animatTransition(all, 0.2s); + } + + &__caret-top, + &__caret-bottom, + &__caret-left, + &__caret-right { + .grid-icon-caret(); + } + + &__caret-bottom { + transform: rotate(180deg); + } + + &__caret-left { + transform: rotate(-90deg); + } + + &__caret-right { + transform: rotate(90deg); + } + + &__arrow-top { + .DefaultWidthHeight(); + .BeforeArrowTop(); + transform: rotate(-45deg); + } + + &__arrow-bottom { + .DefaultWidthHeight(); + .BeforeArrowTop(); + transform: rotate(135deg); + } + + &__arrow-left { + .DefaultWidthHeight(); + .BeforeArrowTop(); + transform: rotate(-135deg); + } + + &__arrow-right { + .DefaultWidthHeight(); + .BeforeArrowTop(); + transform: rotate(45deg); + } + + &__d-arrow-top { + .DefaultWidthHeight(); + .BeforeDArrowTop(); + .AfterDArrowTop(); + transform: rotate(-45deg); + } + + &__d-arrow-bottom { + .DefaultWidthHeight(); + .BeforeDArrowTop(); + .AfterDArrowTop(); + transform: rotate(135deg); + } + + &__d-arrow-left { + .DefaultWidthHeight(); + .BeforeDArrowTop(); + .AfterDArrowTop(); + transform: rotate(-135deg); + } + + &__d-arrow-right { + .DefaultWidthHeight(); + .BeforeDArrowTop(); + .AfterDArrowTop(); + transform: rotate(45deg); + } + + &__funnel { + .DefaultWidthHeight(); + + &:before { + content: ''; + border-top-color: inherit; + position: absolute; + border-bottom-color: transparent; + top: 0.1em; + border-right-color: transparent; + left: 0; + border-left-color: transparent; + border-width: 0.5em; + border-style: solid; + } + + &:after { + content: ''; + position: absolute; + left: 0.4em; + top: 0.5em; + width: 0; + height: 0.4em; + border-width: 0 0.2em 0 0; + border-style: solid; + border-right-color: inherit; + } + } + + &__edit-outline { + .DefaultWidthHeight(); + border-radius: 0.2em; + border-width: 0.1em; + border-style: solid; + border-color: inherit; + + &:before { + content: ''; + position: absolute; + top: -0.1em; + right: -0.1em; + width: 0.4em; + height: 0.4em; + background-color: #fff; + } + + &:after { + content: ''; + position: absolute; + left: 0.15em; + top: 0.12em; + width: 0.9em; + height: 0; + border-radius: 0.2em; + border-width: 0 0 0.15em 0; + border-style: solid; + border-color: inherit; + transform: rotate(-45deg); + } + } + + &__more { + .DefaultWidthHeight(); + + &:before { + content: '...'; + position: absolute; + top: 0; + left: 0.1em; + line-height: 0.5em; + font-weight: 700; + } + } + + &__close { + .DefaultWidthHeight(); + + &:before, + &:after { + content: ''; + position: absolute; + left: 0; + top: 0; + transform: rotate(45deg); + border-style: solid; + border-width: 0; + } + + &:before { + width: 1em; + border-bottom-width: 0.1em; + top: 0.45em; + } + + &:after { + height: 1em; + border-right-width: 0.1em; + left: 0.45em; + } + } + + &__refresh { + .DefaultWidthHeight(); + border-style: solid; + border-width: 0.1em; + border-right-color: transparent !important; + border-radius: 50%; + border-left-color: transparent !important; + + &:after { + right: 50%; + bottom: 0; + transform: translateX(-50%) rotate(135deg); + } + + &:before { + left: 50%; + top: 0; + transform: translateX(50%) rotate(-45deg); + } + + &:before, + &:after { + content: ''; + position: absolute; + border-left-color: transparent; + width: 0; + border-right-color: transparent; + height: 0; + border-bottom-color: transparent; + border-width: 0.25em; + border-style: solid; + } + + &.roll { + animation: rollCircle 1s infinite linear; + } + } + + &__question { + .DefaultWidthHeight(); + + &:before { + .BeforeSolidRadius(); + } + + &:after { + .AfterSolidRadius(); + content: '?'; + } + } + + &__info { + .DefaultWidthHeight(); + + &:before { + .BeforeSolidRadius(); + } + + &:after { + .AfterSolidRadius(); + content: '!'; + transform: rotate(180deg) translateY(1px); + font-size: var(--ti-common-font-size-1)\9; + + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + font-size: var(--ti-common-font-size-1); + } + + @media screen and (-ms-ime-align: auto) { + font-size: var(--ti-common-font-size-1); + } + } + } + + &__warning { + .DefaultWidthHeight(); + + &:before { + .BeforeSolidRadius(); + } + + &:after { + .AfterSolidRadius(); + content: '!'; + font-size: var(--ti-common-font-size-1)\9; + + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + font-size: var(--ti-common-font-size-1); + } + + @media screen and (-ms-ime-align: auto) { + font-size: var(--ti-common-font-size-1); + } + } + } + + &__success { + .DefaultWidthHeight(); + + &:before { + .BeforeSolidRadius(); + } + + &:after { + content: ''; + position: absolute; + height: 0.55em; + width: 0.3em; + left: 0.35em; + top: 0.15em; + border-width: 0.1em; + border-style: solid; + border-color: #fff; + border-left: 0; + border-top: 0; + transform: rotate(45deg); + } + } + + &__error { + .DefaultWidthHeight(); + + &:before { + .BeforeSolidRadius(); + } + + &:after { + .AfterSolidRadius(); + content: '\2716'; + } + } +} + +@keyframes rollCircle { + 0% { + transform: rotate(0deg); + } + + 100% { + transform: rotate(360deg); + } +} diff --git a/packages/theme/src/grid/index-global.less b/packages/theme/src/grid/index-global.less new file mode 100644 index 000000000..00b6b27d3 --- /dev/null +++ b/packages/theme/src/grid/index-global.less @@ -0,0 +1,28 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +@import './icon.less'; +@import './table-global.less'; +@import './header.less'; +@import './body.less'; +@import './footer.less'; +@import './filter.less'; +@import './loading-global.less'; +@import './grid.less'; +@import './menu.less'; +@import './custom.less'; +@import './modal.less'; +@import './toolbar.less'; +@import './checkbox.less'; +@import './radio.less'; +@import './input.less'; +@import './button.less'; +@import './tooltip.less'; diff --git a/packages/theme/src/grid/index.js b/packages/theme/src/grid/index.js new file mode 100644 index 000000000..805775784 --- /dev/null +++ b/packages/theme/src/grid/index.js @@ -0,0 +1,65 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-grid-font-family': 'Helvetica, Arial, "Microsoft YaHei", sans-serif', + 'tiny-grid-text-color': '#333', + 'tiny-grid-light-color': '#fff', + 'tiny-grid-error-color': '#f5222d', + 'tiny-grid-success-color': '#52c41a', + 'tiny-grid-warning-color': '#faad14', + 'tiny-grid-disabled-color': '#bfbfbf', + 'tiny-grid-normal-text-color': '#999', + 'tiny-grid-font-size': '12px', + 'tiny-grid-border-color': '#d9d9d9', + 'tiny-grid-border-radius': '2px', + 'tiny-grid-header-background-color': '#f1f1f1', + 'tiny-grid-header-column-height': '28px', + 'tiny-grid-medium-column-height': '52px', + 'tiny-grid-default-column-height': '42px', + 'tiny-grid-small-column-height': '40px', + 'tiny-grid-mini-column-height': '30px', + 'tiny-grid-custom-head-height': '40px', + 'tiny-grid-custom-body-list-height': '28px', + 'tiny-grid-icon-fill-hover-bg-color': '#fff', + 'tiny-grid-row-odd-background-color': '#fff', + 'tiny-table-td-padding-vertical': '2px', + 'tiny-table-td-padding-horizontal': '8px', + 'tiny-table-th-spacing-line-text-color': '#fff', + 'tiny-grid-header-icon-font-size': '16px', + 'tiny-grid-primary-color': '#1890ff', + 'tiny-grid-primary-hover-color': '#40a9ff', + 'tiny-grid-primary-active-color': '#096dd9', + 'tiny-grid-primary-disabled-text-color': '#b1b1b1', + 'tiny-grid-input-border-color': '#d9d9d9', + 'tiny-grid-input-disabled-bg-color': '#f3f3f3', + 'tiny-grid-popup-border-color': '#ebeef5', + 'tiny-grid-row-striped-background-color': '#fafafa', + 'tiny-grid-row-hover-background-color': '#f2f5fc', + 'tiny-grid-column-hover-background-color': '#d7effb', + 'tiny-grid-column-current-background-color': '#f2f5fc', + 'tiny-grid-column-icon-border-color': '#c0c4cc', + 'tiny-grid-column-checked-border-width': '2px', + 'tiny-grid-column-checked-border-color': '#d4d4d4', + 'tiny-grid-loading-background-color': 'rgba(0, 0, 0, 0.2)', + 'tiny-grid-tooltip-dark-background-color': '#303133', + 'tiny-grid-tooltip-light-background-color': '#fff', + 'tiny-grid-modal-loading-text-color': '#78b1eb', + 'tiny-grid-modal-alert-font-size': '22px', + 'tiny-grid-modal-small-btn-font-size': '16px', + 'tiny-grid-modal-header-font-size': '14px', + 'tiny-grid-modal-box-border-color': '#ebeef5', + 'tiny-grid-modal-box-background-color': '#fff', + 'tiny-grid-modal-box-shadow': '0 0 10px 0 rgba(0, 0, 0, 0.2)', + 'tiny-grid-modal-btn-text-color': '#c4c4c4', + 'tiny-grid-modal-border-color': 'rgba(0, 0, 0, 0.2)' +} diff --git a/packages/theme/src/grid/index.less b/packages/theme/src/grid/index.less new file mode 100644 index 000000000..cd3a90673 --- /dev/null +++ b/packages/theme/src/grid/index.less @@ -0,0 +1,38 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import './vars.less'; +@import './icon.less'; +@import './table.less'; +@import './header.less'; +@import './body.less'; +@import './footer.less'; +@import './filter.less'; +@import './loading.less'; +@import './grid.less'; +@import './menu.less'; +@import './custom.less'; +@import './custom-switch.less'; +@import './modal.less'; +@import './toolbar.less'; +@import './checkbox.less'; +@import './radio.less'; +@import './input.less'; +@import './button.less'; +@import './tooltip.less'; +@import '../custom.less'; + +@grid-wrapper-prefix-cls: ~'@{css-prefix}grid__wrapper'; + +.@{grid-wrapper-prefix-cls}{ + .component-css-vars-grid(); +} diff --git a/packages/theme/src/grid/input.less b/packages/theme/src/grid/input.less new file mode 100644 index 000000000..a45ef886a --- /dev/null +++ b/packages/theme/src/grid/input.less @@ -0,0 +1,73 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@grid-input-prefix-cls: ~'@{css-prefix}grid-input'; +@grid-textarea-prefix-cls: ~'@{css-prefix}grid-textarea'; + +// input +.@{grid-input-prefix-cls}__wrapper { + font-size: var(--ti-common-font-size-base); + font-size: var(--ti-grid-font-size, 12px); + display: inline-block; + + &.type__textarea { + width: 100%; + } + + .@{grid-input-prefix-cls}, + .@{grid-textarea-prefix-cls} { + border-radius: 4px; + outline: 0; + padding: 4px 8px; + width: 100%; + color: var(--ti-grid-text-color); + border: 1px solid var(--ti-grid-border-color); + background-color: #fff; + + &:focus { + border: 1px solid var(--ti-grid-primary-color); + } + + &[disabled] { + cursor: not-allowed; + background-color: var(--ti-grid-input-disabled-bg-color); + } + } + + .@{grid-input-prefix-cls} { + height: 32px; + } + + .@{grid-textarea-prefix-cls} { + height: 100%; + } + + &.size__medium { + .@{grid-input-prefix-cls} { + height: 36px; + } + } + + &.size__small { + .@{grid-input-prefix-cls} { + height: 32px; + } + } + + &.size__mini { + .@{grid-input-prefix-cls} { + height: 28px; + } + } +} diff --git a/packages/theme/src/grid/loading-global.less b/packages/theme/src/grid/loading-global.less new file mode 100644 index 000000000..6fed213c9 --- /dev/null +++ b/packages/theme/src/grid/loading-global.less @@ -0,0 +1,123 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +@import '../custom.less'; + +@grid-loading-prefix-cls: ~'@{css-prefix}grid-loading'; + +// 加载中 +.@{grid-loading-prefix-cls} { + display: none; + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + z-index: 99; + background-color: rgba(0, 0, 0, 0.2); + + & &__wrap { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + } + + & &__round { + width: 46px; + height: 46px; + position: relative; + margin: 0 auto; + // 兼容IE9 linear-gradient、animation属性不生效问题 + background: url(./images/loading-64.gif) no-repeat center; + background: linear-gradient(to top, transparent, transparent); + + span { + display: inline-block; + width: 10px; + height: 10px; + border-radius: 50%; + background: linear-gradient(#000, #000); + position: absolute; + animation: load 1.04s ease infinite; + } + + @keyframes load { + 0% { + opacity: 10; + } + + 100% { + opacity: 0.1; + } + } + + span:nth-child(1) { + top: 68%; + left: 68%; + animation-delay: 0s; + -webkit-animation-delay: 0s; + } + + span:nth-child(2) { + top: 50%; + right: 0; + transform: translateY(-50%); + animation-delay: 0.1s; + -webkit-animation-delay: 0.1s; + } + + span:nth-child(3) { + top: 10%; + left: 68%; + animation-delay: 0.2s; + -webkit-animation-delay: 0.2s; + } + + span:nth-child(5) { + top: 10%; + left: 12%; + animation-delay: 0.4s; + -webkit-animation-delay: 0.4s; + } + + span:nth-child(4) { + top: 0; + left: 50%; + transform: translateX(-50%); + animation-delay: 0.3s; + -webkit-animation-delay: 0.3s; + } + + span:nth-child(8) { + bottom: 0; + left: 50%; + transform: translateX(-50%); + animation-delay: 0.7s; + -webkit-animation-delay: 0.7s; + } + + span:nth-child(6) { + top: 50%; + left: 0; + transform: translateY(-50%); + animation-delay: 0.5s; + -webkit-animation-delay: 0.5s; + } + + span:nth-child(7) { + top: 68%; + left: 12%; + animation-delay: 0.6s; + -webkit-animation-delay: 0.6s; + } + } +} diff --git a/packages/theme/src/grid/loading.less b/packages/theme/src/grid/loading.less new file mode 100644 index 000000000..ebb749630 --- /dev/null +++ b/packages/theme/src/grid/loading.less @@ -0,0 +1,127 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@grid-loading-prefix-cls: ~'@{css-prefix}grid-loading'; +@loading-prefix-cls: ~'@{css-prefix}loading'; + +// 加载中 +.@{grid-loading-prefix-cls} { + display: none; + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + z-index: 99; + background-color: var(--ti-grid-loading-background-color); + + & &__wrap { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + + &.@{loading-prefix-cls}__spinner { + margin-top: 0; + } + } + + & &__round { + width: 46px; + height: 46px; + position: relative; + margin: 0 auto; + background: linear-gradient(to top, transparent, transparent); + + span { + display: inline-block; + width: 10px; + height: 10px; + border-radius: 50%; + background: linear-gradient(#000, #000); + position: absolute; + animation: load 1.04s ease infinite; + } + + @keyframes load { + 0% { + opacity: 10; + } + + 100% { + opacity: 0.1; + } + } + + span:nth-child(1) { + top: 68%; + left: 68%; + animation-delay: 0s; + -webkit-animation-delay: 0s; + } + + span:nth-child(2) { + top: 50%; + right: 0; + transform: translateY(-50%); + animation-delay: 0.1s; + -webkit-animation-delay: 0.1s; + } + + span:nth-child(3) { + top: 10%; + left: 68%; + animation-delay: 0.2s; + -webkit-animation-delay: 0.2s; + } + + span:nth-child(5) { + top: 10%; + left: 12%; + animation-delay: 0.4s; + -webkit-animation-delay: 0.4s; + } + + span:nth-child(4) { + top: 0; + left: 50%; + transform: translateX(-50%); + animation-delay: 0.3s; + -webkit-animation-delay: 0.3s; + } + + span:nth-child(8) { + bottom: 0; + left: 50%; + transform: translateX(-50%); + animation-delay: 0.7s; + -webkit-animation-delay: 0.7s; + } + + span:nth-child(6) { + top: 50%; + left: 0; + transform: translateY(-50%); + animation-delay: 0.5s; + -webkit-animation-delay: 0.5s; + } + + span:nth-child(7) { + top: 68%; + left: 12%; + animation-delay: 0.6s; + -webkit-animation-delay: 0.6s; + } + } +} diff --git a/packages/theme/src/grid/menu.less b/packages/theme/src/grid/menu.less new file mode 100644 index 000000000..25c24afb8 --- /dev/null +++ b/packages/theme/src/grid/menu.less @@ -0,0 +1,138 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../custom.less'; + +@grid-menu-prefix-cls: ~'@{css-prefix}grid-menu'; + +// 快捷菜单 +.@{grid-menu-prefix-cls} { + &__wrapper, + &__clild-wrapper { + display: none; + position: absolute; + top: 0; + left: 0; + z-index: 5000; + font-size: var(--ti-grid-font-size); + background-color: var(--ti-grid-light-color); + border: 1px solid var(--ti-grid-popup-border-color); + box-shadow: 2px 2px 4px -2px rgba(0, 0, 0, 0.2); + padding: 0 1px; + color: var(--ti-grid-text-color); + font-family: var(--ti-grid-font-family); + overflow: visible; + .user-select(none); + + &.show { + display: block; + } + + .@{grid-menu-prefix-cls}__option-wrapper, + .@{grid-menu-prefix-cls}__clild-wrapper { + margin: 0; + padding: 0; + list-style-type: none; + border-bottom: 1px solid var(--ti-grid-border-color); + + li { + position: relative; + margin: 1px 0; + border: 1px solid transparent; + + &:last-child { + border: 0; + } + + &.link__active { + color: #2b2b2b; + background-color: #c5c5c5; + border-color: #c5c5c5; + } + + &.link__disabled { + .@{grid-menu-prefix-cls}__link { + color: var(--ti-grid-text-color); + cursor: initial; + } + + &.link__active { + border-color: #c0c1c2; + background-color: #eeeeee; + + &:hover { + background-color: inherit; + } + } + } + } + + .@{grid-menu-prefix-cls}__link { + display: block; + padding: 0 30px; + min-width: 120px; + max-width: 180px; + line-height: 26px; + color: var(--ti-grid-text-color); + + .@{grid-menu-prefix-cls}__link-prefix, + .@{grid-menu-prefix-cls}__link-suffix { + position: absolute; + top: 5px; + margin-right: 5px; + font-size: var(--ti-common-font-size-2); + } + + .@{grid-menu-prefix-cls}__link-prefix { + left: 5px; + } + + .@{grid-menu-prefix-cls}__link-suffix { + right: 5px; + + &.suffix__haschild { + top: 8px; + + &:before { + position: absolute; + content: ''; + border: 4px solid transparent; + border-left-color: #727272; + } + } + } + + .@{grid-menu-prefix-cls}__link-content { + display: block; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + } + + .@{grid-menu-prefix-cls}__clild-wrapper { + .@{grid-menu-prefix-cls}__link { + max-width: 180px; + padding: 0 20px 0 30px; + } + } + } + } + + &__clild-wrapper { + display: none; + z-index: 5100; + top: 0; + left: 100%; + } +} diff --git a/packages/theme/src/grid/mixins/button.less b/packages/theme/src/grid/mixins/button.less new file mode 100644 index 000000000..b0a5f5b40 --- /dev/null +++ b/packages/theme/src/grid/mixins/button.less @@ -0,0 +1,35 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.ButtonHover(@color) { + color: @color; + border-color: @color; +} + +.ButtonPrimaryHover(@hovercolor) { + color: var(--ti-grid-light-color); + background-color: @hovercolor; + border-color: @hovercolor; +} + +.ButtonInterval() { + margin-left: 8px; + &.size__medium { + margin-left: 8px; + } + &.size__small { + margin-left: 6px; + } + &.size__mini { + margin-left: 4px; + } +} diff --git a/packages/theme/src/grid/mixins/common.less b/packages/theme/src/grid/mixins/common.less new file mode 100644 index 000000000..9c4fd3ddf --- /dev/null +++ b/packages/theme/src/grid/mixins/common.less @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.animatTransition (@property, @duration: 0.1s, @func: ease-in-out) { + transition: @property @duration @func; +} diff --git a/packages/theme/src/grid/mixins/icon.less b/packages/theme/src/grid/mixins/icon.less new file mode 100644 index 000000000..284ba73ab --- /dev/null +++ b/packages/theme/src/grid/mixins/icon.less @@ -0,0 +1,110 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.DefaultWidthHeight() { + width: 1em; + height: 1em; + line-height: 1em; +} + +.grid-icon-caret() { + .DefaultWidthHeight(); + &:before { + content: ''; + left: 0; + bottom: 0.25em; + border-right-color: transparent; + position: absolute; + border-width: 0.5em; + border-style: solid; + border-top-color: transparent; + border-bottom-color: inherit; + border-left-color: transparent; + transition: border 0.1s ease-in-out; + } +} + +.BeforeArrowTop() { + &:before { + content: ''; + position: absolute; + top: 0.38em; + left: 0.12em; + width: 0.5em; + height: 0.5em; + border-width: 0.1em; + border-style: solid; + border-top-color: inherit; + border-bottom-color: transparent; + border-left-color: transparent; + border-right-color: inherit; + } +} + +.BeforeDArrowTop() { + &:before { + content: ''; + position: absolute; + top: 0.24em; + left: 0.26em; + width: 0.5em; + height: 0.5em; + border-width: 0.08em; + border-style: solid; + border-right-color: inherit; + border-top-color: inherit; + border-left-color: transparent; + border-bottom-color: transparent; + } +} + +.AfterDArrowTop() { + &:after { + content: ''; + position: absolute; + top: 0.42em; + left: 0.1em; + width: 0.5em; + height: 0.5em; + border-width: 0.08em; + border-style: solid; + border-top-color: inherit; + border-bottom-color: transparent; + border-left-color: transparent; + border-right-color: inherit; + } +} + +.BeforeSolidRadius() { + content: ''; + border-radius: 50%; + border-width: 0.5em; + border-style: solid; + border-color: inherit; + position: absolute; + top: 0; + left: 0; +} + +.AfterSolidRadius() { + position: absolute; + color: #fff; + color: var(--ti-grid-light-color, #fff); + font-size: 0.7em; + display: inline-block; + top: 0; + left: 0; + width: inherit; + height: inherit; + text-align: center; + font-weight: 700; +} diff --git a/packages/theme/src/grid/mixins/table.less b/packages/theme/src/grid/mixins/table.less new file mode 100644 index 000000000..64d0b736c --- /dev/null +++ b/packages/theme/src/grid/mixins/table.less @@ -0,0 +1,56 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../../custom.less'; + +@grid-cell-prefix-cls: ~'@{css-prefix}grid-cell'; +@grid-checkbox-prefix-cls: ~'@{css-prefix}grid-checkbox'; + +.TextEllipsis() { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + padding-left: 8px; + box-sizing: border-box; +} + +.DefaultColumnHeight() { + height: var(--ti-grid-default-column-height, 42px); +} + +.MediumColumnHeight() { + height: var(--ti-grid-medium-column-height, 46px); +} + +.SmallColumnHeight() { + height: var(--ti-grid-small-column-height, 30px); +} + +.MiniColumnHeight() { + height: var(--ti-grid-mini-column-height, 26px); +} + +.DefaultTdPadding() { + padding: var(--ti-table-td-padding-vertical, 2px) var(--ti-table-td-padding-horizontal, 8px); +} + +.CellEllipsis() { + &:not(.col__actived) { + .@{grid-cell-prefix-cls} { + .TextEllipsis(); + & > .@{grid-checkbox-prefix-cls} { + .TextEllipsis(); + padding-left: 0; + } + } + } +} diff --git a/packages/theme/src/grid/modal.less b/packages/theme/src/grid/modal.less new file mode 100644 index 000000000..3986658f9 --- /dev/null +++ b/packages/theme/src/grid/modal.less @@ -0,0 +1,458 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import './mixins/common.less'; +@import '../custom.less'; + +@grid-modal-prefix-cls: ~'@{css-prefix}grid-modal'; + +.@{grid-modal-prefix-cls} { + &__wrapper { + display: none; + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + font-size: var(--ti-grid-font-size); + color: var(--ti-grid-text-color); + font-family: var(--ti-grid-font-family); + transition: top 0.4s; + + &.active { + display: block; + } + + &.is__visible { + &.is__mask { + &:before { + background-color: rgba(0, 0, 0, 0.5); + } + } + + &.type__message { + .@{grid-modal-prefix-cls}__box { + transform: translateY(0); + } + } + + &:not(.type__message) { + .@{grid-modal-prefix-cls}__box:not(.is__drag) { + top: 15vh; + transition: top 0.3s ease-in, opacity 0.4s ease-in; + } + } + + .@{grid-modal-prefix-cls}__box { + opacity: 1; + visibility: visible; + } + } + + &:not(.lock__view) { + pointer-events: none; + } + + &.lock__scroll { + overflow: hidden; + } + + &:not(.lock__scroll) { + overflow: auto; + } + + &.lock__view, + &.is__mask { + &:before { + content: ''; + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: -1; + pointer-events: auto; + } + } + + &.is__mask { + &:before { + background-color: rgba(0, 0, 0, 0); + } + } + + &.is__animat { + &.is__mask { + &:before { + .animatTransition(background-color, 0.2s); + } + } + + &.type__message { + .@{grid-modal-prefix-cls}__box { + &:not(.is__drag) { + .animatTransition(all, 0.2s, ease-out); + } + } + } + } + + &.size__small, + &.size__mini { + font-size: var(--ti-grid-font-size); + + .@{grid-modal-prefix-cls}__box { + padding: 6px 0; + } + + .@{grid-modal-prefix-cls}__body { + padding: 4px 14px 10px 14px; + } + + .@{grid-modal-prefix-cls}__footer { + padding: 4px 14px 8px 14px; + } + + .@{grid-modal-prefix-cls}__header { + font-size: var(--ti-grid-modal-header-font-size); + padding: 6px 30px 8px 14px; + } + + .@{grid-modal-prefix-cls}__zoom-btn, + .@{grid-modal-prefix-cls}__close-btn { + font-size: var(--ti-grid-modal-small-btn-font-size); + top: 10px; + } + } + + &.type__message, + &.type__alert, + &.type__confirm { + .@{grid-modal-prefix-cls}__body { + white-space: normal; + word-wrap: break-word; + word-break: break-all; + } + } + + &.type__message { + text-align: center; + + .@{grid-modal-prefix-cls}__box { + display: inline-block; + padding: 2px 0; + margin-top: 0; + width: auto; + box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1); + transform: translateY(-10%); + + .@{grid-modal-prefix-cls}__body { + &:after { + content: ''; + display: block; + clear: both; + height: 0; + overflow: hidden; + visibility: hidden; + } + } + + .@{grid-modal-prefix-cls}__content { + max-width: 800px; + float: left; + } + } + + .@{grid-modal-prefix-cls}__status-wrapper { + font-size: var(--ti-grid-modal-small-btn-font-size); + padding-right: 10px; + } + } + + &.type__modal, + &.type__alert, + &.type__confirm { + .@{grid-modal-prefix-cls}__box { + display: flex; + flex-direction: column; + position: absolute; + left: 50%; + top: 0; + box-shadow: var(--ti-grid-modal-box-shadow); + border: 1px solid var(--ti-grid-modal-border-color); + + .@{grid-modal-prefix-cls}__header { + cursor: move; + } + } + } + + &.type__modal { + .@{grid-modal-prefix-cls}__body { + overflow: auto; + + .@{grid-modal-prefix-cls}__content { + overflow: auto; + } + } + } + + &.type__alert, + &.type__confirm { + .@{grid-modal-prefix-cls}__status-wrapper { + font-size: var(--ti-grid-modal-alert-font-size); + padding: 0 10px 0 2px; + } + } + + &.status__info { + .@{grid-modal-prefix-cls}__status-wrapper { + color: var(--ti-grid-primary-color); + } + } + + &.status__warning, + &.status__question { + .@{grid-modal-prefix-cls}__status-wrapper { + color: var(--ti-grid-warning-color); + } + } + + &.status__success { + .@{grid-modal-prefix-cls}__status-wrapper { + color: var(--ti-grid-success-color); + } + } + + &.status__error { + .@{grid-modal-prefix-cls}__status-wrapper { + color: var(--ti-grid-error-color); + } + } + + &.status__loading { + .@{grid-modal-prefix-cls}__status-wrapper { + color: var(--ti-grid-modal-loading-text-color); + } + } + + &.is__maximize { + .@{grid-modal-prefix-cls}__box { + .@{grid-modal-prefix-cls}__header { + cursor: default; + } + } + + .@{grid-modal-prefix-cls}__resize { + .wl-resize, + .wr-resize, + .swst-resize, + .sest-resize, + .st-resize, + .swlb-resize, + .selb-resize, + .sb-resize { + display: none; + } + } + } + } + + &__box { + width: 420px; + background-color: var(--ti-grid-modal-box-background-color); + border: 1px solid var(--ti-grid-modal-box-border-color); + font-size: var(--ti-grid-modal-header-font-size); + text-align: left; + pointer-events: auto; + visibility: hidden; + opacity: 0; + + &.is__drag { + cursor: move; + + .@{grid-modal-prefix-cls}__body, + .@{grid-modal-prefix-cls}__footer { + &:after { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + } + } + + .@{grid-modal-prefix-cls}__body { + overflow: hidden; + + .@{grid-modal-prefix-cls}__content { + overflow: hidden; + } + } + } + } + + &__status-wrapper { + flex-shrink: 0; + display: flex; + align-items: center; + } + + &__status-icon { + font-style: normal; + } + + &__content { + flex-grow: 1; + } + + &__header, + &__body, + &__footer { + position: relative; + } + + &__body { + display: flex; + flex-grow: 1; + padding: 24px; + } + + &__header { + flex-shrink: 0; + font-size: var(--ti-grid-modal-header-font-size); + font-weight: 700; + padding: 9px 40px 10px 24px; + border-bottom: 1px solid var(--ti-grid-border-color); + user-select: none; + } + + &__zoom-btn, + &__close-btn { + font-size: var(--ti-grid-modal-header-font-size); + position: absolute; + right: 24px; + top: 13px; + z-index: 1; + color: var(--ti-grid-modal-btn-text-color); + fill: var(--ti-grid-modal-btn-text-color); + cursor: pointer; + + &:hover { + color: var(--ti-grid-primary-color); + fill: var(--ti-grid-primary-color); + } + } + + &__zoom-btn { + right: 44px; + border-color: #c0c4cc; + + &:hover { + border-color: #606266; + } + } + + &__footer { + flex-shrink: 0; + text-align: center; + padding: 0 24px 24px; + } + + &__resize { + @SpaceSize: 8px; + + .wl-resize, + .wr-resize, + .swst-resize, + .sest-resize, + .st-resize, + .swlb-resize, + .selb-resize, + .sb-resize { + position: absolute; + z-index: 100; + } + + .wl-resize, + .wr-resize { + width: @SpaceSize; + height: 100%; + top: 0; + cursor: w-resize; + } + + .wl-resize { + left: -@SpaceSize / 2 + 1; + } + + .wr-resize { + right: -@SpaceSize / 2 + 1; + } + + .swst-resize, + .sest-resize, + .swlb-resize, + .selb-resize { + width: @SpaceSize + 2; + height: @SpaceSize + 2; + z-index: 101; + } + + .swst-resize, + .sest-resize { + top: -@SpaceSize; + } + + .swlb-resize, + .selb-resize { + bottom: -@SpaceSize; + } + + .sest-resize, + .swlb-resize { + cursor: sw-resize; + } + + .swst-resize, + .selb-resize { + cursor: se-resize; + } + + .swst-resize, + .swlb-resize { + left: -@SpaceSize; + } + + .sest-resize, + .selb-resize { + right: -@SpaceSize; + } + + .st-resize, + .sb-resize { + width: 100%; + height: @SpaceSize; + left: 0; + cursor: s-resize; + } + + .st-resize { + top: -@SpaceSize / 2 + 1; + } + + .sb-resize { + bottom: -@SpaceSize / 2 + 1; + } + } +} diff --git a/packages/theme/src/grid/pager.less b/packages/theme/src/grid/pager.less new file mode 100644 index 000000000..c06b595ee --- /dev/null +++ b/packages/theme/src/grid/pager.less @@ -0,0 +1,406 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import './mixins/common.less'; +@import '../custom.less'; + +@grid-pager-prefix-cls: ~'@{css-prefix}grid-pager'; +@grid-icon-prefix-cls: ~'@{css-prefix}grid-icon'; +@grid-pager-size-prefix-cls: ~'@{css-prefix}grid-pager-size'; + +// pager +.@{grid-pager-prefix-cls} { + padding: 10px 0; + font-size: var(--ti-grid-font-size); + color: var(--ti-grid-text-color); + font-family: var(--ti-grid-font-family); + text-align: right; + user-select: none; + + &.align__left { + text-align: left; + } + + &.align__center { + text-align: center; + } + + &.is__loading { + position: relative; + + &:before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: 1; + background-color: var(--ti-grid-loading-background-color); + } + } + + &.p__background { + .@{grid-pager-prefix-cls}__prev-btn, + .@{grid-pager-prefix-cls}__next-btn { + background-color: #f4f4f5; + border-radius: 4px; + } + + .@{grid-pager-prefix-cls}__jump-prev, + .@{grid-pager-prefix-cls}__num-btn, + .@{grid-pager-prefix-cls}__jump-next { + background-color: #f4f4f5; + border-radius: 4px; + + &:hover { + color: var(--ti-grid-primary-color); + } + + &.is__active { + color: #fff; + background-color: var(--ti-grid-primary-color); + } + } + } + + &.size__medium { + padding: 8px 0; + + .@{grid-pager-prefix-cls}__total, + .@{grid-pager-prefix-cls}__prev-btn, + .@{grid-pager-prefix-cls}__btn-wrapper, + .@{grid-pager-prefix-cls}__next-btn, + .@{grid-pager-prefix-cls}__sizes, + .@{grid-pager-prefix-cls}__jump { + margin: 0 4px; + } + + .@{grid-pager-prefix-cls}__count, + .size__content, + .@{grid-pager-prefix-cls}__prev-btn, + .@{grid-pager-prefix-cls}__next-btn, + .@{grid-pager-prefix-cls}__jump-prev, + .@{grid-pager-prefix-cls}__num-btn, + .@{grid-pager-prefix-cls}__jump-next { + height: 28px; + line-height: 28px; + } + + .@{grid-pager-prefix-cls}__sizes { + .@{grid-pager-prefix-cls}__sizes-arrow { + top: 8px; + } + } + + .@{grid-pager-prefix-cls}__jump .@{grid-pager-prefix-cls}__goto { + height: 28px; + } + + .@{grid-pager-prefix-cls}__jump-prev, + .@{grid-pager-prefix-cls}__prev-btn, + .@{grid-pager-prefix-cls}__next-btn, + .@{grid-pager-prefix-cls}__jump-next { + font-size: 19px; + } + } + + &.size__small { + font-size: var(--ti-common-font-size-base); + padding: 8px 0; + + .@{grid-pager-prefix-cls}__total, + .@{grid-pager-prefix-cls}__prev-btn, + .@{grid-pager-prefix-cls}__btn-wrapper, + .@{grid-pager-prefix-cls}__next-btn, + .@{grid-pager-prefix-cls}__sizes, + .@{grid-pager-prefix-cls}__jump { + margin: 0 4px; + } + + .@{grid-pager-prefix-cls}__count, + .size__content, + .@{grid-pager-prefix-cls}__prev-btn, + .@{grid-pager-prefix-cls}__next-btn, + .@{grid-pager-prefix-cls}__jump-prev, + .@{grid-pager-prefix-cls}__num-btn, + .@{grid-pager-prefix-cls}__jump-next { + height: 26px; + line-height: 26px; + } + + .@{grid-pager-prefix-cls}__sizes { + .@{grid-pager-prefix-cls}__sizes-arrow { + top: 7px; + } + } + + .@{grid-pager-prefix-cls}__jump .@{grid-pager-prefix-cls}__goto { + height: 26px; + } + + .@{grid-pager-prefix-cls}__jump-prev, + .@{grid-pager-prefix-cls}__prev-btn, + .@{grid-pager-prefix-cls}__next-btn, + .@{grid-pager-prefix-cls}__jump-next { + font-size: 17px; + } + } + + &.size__mini { + font-size: var(--ti-common-font-size-base); + padding: 8px 0; + + .@{grid-pager-prefix-cls}__total, + .@{grid-pager-prefix-cls}__prev-btn, + .@{grid-pager-prefix-cls}__btn-wrapper, + .@{grid-pager-prefix-cls}__next-btn, + .@{grid-pager-prefix-cls}__sizes, + .@{grid-pager-prefix-cls}__jump { + margin: 0 4px; + } + + .@{grid-pager-prefix-cls}__count, + .size__content, + .@{grid-pager-prefix-cls}__prev-btn, + .@{grid-pager-prefix-cls}__next-btn, + .@{grid-pager-prefix-cls}__jump-prev, + .@{grid-pager-prefix-cls}__num-btn, + .@{grid-pager-prefix-cls}__jump-next { + height: 24px; + line-height: 24px; + } + + .@{grid-pager-prefix-cls}__sizes { + .@{grid-pager-prefix-cls}__sizes-arrow { + top: 6px; + } + } + + .@{grid-pager-prefix-cls}__jump .@{grid-pager-prefix-cls}__goto { + height: 24px; + } + + .@{grid-pager-prefix-cls}__jump-prev, + .@{grid-pager-prefix-cls}__prev-btn, + .@{grid-pager-prefix-cls}__next-btn, + .@{grid-pager-prefix-cls}__jump-next { + font-size: var(--ti-common-font-size-1); + } + } + + & &__total, + & &__prev-btn, + & &__btn-wrapper, + & &__next-btn, + & &__sizes, + & &__jump, + & &__jump-prev, + & &__jump-next, + & &__count { + margin: 0 6px; + vertical-align: middle; + display: inline-block; + } + + & &__prev-btn, + & &__jump-prev, + & &__num-btn, + & &__jump-next, + & &__next-btn, + & &__sizes { + cursor: pointer; + } + + & &__count, + .size__content, + & &__prev-btn, + & &__next-btn, + & &__jump-prev, + & &__num-btn, + & &__jump-next { + height: 30px; + line-height: 30px; + display: inline-block; + } + + & &__btn-wrapper { + list-style-type: none; + padding: 0; + display: inline-block; + text-align: center; + + .@{grid-pager-prefix-cls}__jump-prev, + .@{grid-pager-prefix-cls}__jump-next { + &:hover { + .@{grid-pager-prefix-cls}__jump-more { + display: none; + } + + .@{grid-pager-prefix-cls}__jump-icon { + display: inline-block; + } + } + } + + .@{grid-pager-prefix-cls}__jump-icon { + display: none; + } + } + + & &__jump-prev, + & &__prev-btn, + & &__num-btn, + & &__next-btn, + & &__jump-next { + margin: 0 2px; + + &:hover, + &.is__active { + color: var(--ti-grid-primary-color); + } + + &.is__disabled { + cursor: no-drop; + color: var(--ti-grid-primary-disabled-text-color); + + &:hover { + color: var(--ti-grid-primary-disabled-text-color); + } + } + } + + & &__jump-prev, + & &__prev-btn, + & &__next-btn, + & &__jump-next { + font-size: var(--ti-common-font-size-4); + } + + & &__num-btn { + min-width: 30px; + font-weight: 700; + vertical-align: middle; + } + + .@{grid-icon-prefix-cls}__page-icon, + & &__jump-icon { + margin-top: -2px; + } + + & &__sizes { + position: relative; + border-radius: 4px; + padding: 0; + border: 1px solid var(--ti-grid-border-color); + color: var(--ti-grid-text-color); + text-align: center; + display: inline-block; + .animatTransition(border); + + &.is__active { + border: 1px solid var(--ti-grid-primary-color); + + .@{grid-pager-prefix-cls}__sizes-arrow { + transform: rotate(360deg); + } + + .@{grid-pager-prefix-cls}-size__select-wrapper { + display: block; + } + } + + .@{grid-pager-prefix-cls}__sizes-arrow { + position: absolute; + right: 5px; + top: 9px; + font-size: var(--ti-common-font-size-base); + .animatTransition(transform, 0.2s); + } + + .size__content { + padding: 0 22px 0 10px; + display: block; + } + } + + & &__count &__separator { + margin-right: 6px; + } + + & &__jump &__goto { + border-radius: 4px; + border: 1px solid var(--ti-grid-border-color); + color: var(--ti-grid-text-color); + height: 30px; + transition: border 0.2s ease-in-out; + + &:focus { + border: 1px solid var(--ti-grid-primary-color); + outline: 0; + } + } + + & &__jump { + .@{grid-pager-prefix-cls}__goto-text { + margin-right: 4px; + } + + .@{grid-pager-prefix-cls}__classifier-text { + margin-left: 4px; + } + + .@{grid-pager-prefix-cls}__goto { + width: 42px; + text-align: center; + } + } +} + +.@{grid-pager-size-prefix-cls}__select-wrapper { + display: none; + position: absolute; + bottom: 0; + left: 0; + width: 200px; + text-align: center; + z-index: 4000; + pointer-events: none; + + .@{grid-pager-size-prefix-cls}__select { + margin: 0; + padding: 4px 0; + min-width: 50px; + list-style-type: none; + display: inline-block; + border-radius: 4px; + background-color: var(--ti-grid-light-color); + border: 1px solid var(--ti-grid-primary-color); + pointer-events: auto; + box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1); + + .size__option { + padding: 0 15px; + white-space: nowrap; + cursor: pointer; + + &:hover { + color: var(--ti-grid-primary-color); + } + + &.is__active { + font-weight: 700; + color: var(--ti-grid-primary-color); + } + } + } +} diff --git a/packages/theme/src/grid/radio.less b/packages/theme/src/grid/radio.less new file mode 100644 index 000000000..93f9291a1 --- /dev/null +++ b/packages/theme/src/grid/radio.less @@ -0,0 +1,116 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@grid-radio-prefix-cls: ~'@{css-prefix}grid-radio'; + +// radio +.@{grid-radio-prefix-cls} { + display: inline-block; + user-select: none; + cursor: pointer; + + &.size__small, + &.size__mini { + font-size: var(--ti-grid-font-size); + + > input { + & + .@{grid-radio-prefix-cls}__icon { + font-size: var(--ti-common-font-size-1); + } + } + } + + &.is__disabled { + cursor: not-allowed; + + > input { + & + .@{grid-radio-prefix-cls}__icon { + border-color: var(--ti-grid-border-color); + background-color: var(--ti-grid-input-disabled-bg-color); + + &:before { + border-color: var(--ti-grid-input-disabled-bg-color); + background-color: var(--ti-grid-input-disabled-bg-color); + } + + & + .@{grid-radio-prefix-cls}__label { + color: var(--ti-grid-border-color); + } + + &:hover { + border-color: var(--ti-grid-border-color); + } + } + + &:checked + .@{grid-radio-prefix-cls}__icon { + border-color: var(--ti-grid-disabled-color); + background-color: var(--ti-grid-disabled-color); + } + } + } + + > input { + display: none; + + & + .@{grid-radio-prefix-cls}__icon { + position: relative; + display: inline-block; + width: 1em; + height: 1em; + border: 1px solid var(--ti-grid-border-color); + background-color: #fff; + vertical-align: middle; + border-radius: 50%; + font-size: var(--ti-common-font-size-2); + + &:hover { + border-color: var(--ti-grid-primary-hover-color); + } + } + + &:checked + .@{grid-radio-prefix-cls}__icon { + background-color: var(--ti-grid-primary-color); + border-color: var(--ti-grid-primary-color); + + &:before { + content: ''; + position: absolute; + border-width: 0.15em; + border-style: solid; + border-color: #fff; + background-color: #fff; + border-radius: 50%; + height: 0.4em; + width: 0.4em; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + } + + & + .@{grid-radio-prefix-cls}__label { + color: var(--ti-grid-primary-color); + } + } + } + + & &__label { + padding-left: 5px; + vertical-align: middle; + display: inline-block; + } + + & + & { + margin-left: 10px; + } +} diff --git a/packages/theme/src/grid/table-global.less b/packages/theme/src/grid/table-global.less new file mode 100644 index 000000000..3f3d7ce64 --- /dev/null +++ b/packages/theme/src/grid/table-global.less @@ -0,0 +1,1049 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +@import './base/common.less'; +@import './mixins/table.less'; +@import '../custom.less'; + +@grid-prefix-cls: ~'@{css-prefix}grid'; +@grid-cell-prefix-cls: ~'@{css-prefix}grid-cell'; +@input-prefix-cls: ~'@{css-prefix}input'; + +// table +.@{grid-prefix-cls} { + position: relative; + overflow: hidden; + font-size: 12px; + color: var(--ti-base-color-common); + font-family: Helvetica, Arial, 'Microsoft YaHei', sans-serif; + background-color: #fff; + + &.show__head { + .@{grid-prefix-cls}__fixed-left-wrapper, + .@{grid-prefix-cls}__fixed-right-wrapper { + .@{grid-prefix-cls}__body-wrapper { + &:before { + display: none; + } + } + } + } + + &.show__foot { + &.scroll__x { + .@{grid-prefix-cls}__body-wrapper { + overflow-x: auto; + } + &.scroll__y { + .@{grid-prefix-cls}__body-wrapper { + &.fixed-left__wrapper, + &.fixed-right__wrapper { + padding-bottom: 12px; + + .@{grid-prefix-cls}__body { + padding-bottom: 17px\9; //兼容ie9 + } + + //兼容ie10-ie11 + @media screen and (-ms-high-contrast: active), + (-ms-high-contrast: none) { + .@{grid-prefix-cls}__body { + padding-bottom: 17px; + } + } + } + } + } + } + } + + &.column__highlight { + .@{grid-prefix-cls}-header__column { + &:not(.col__index) { + &:hover { + background-color: #d7effb; + } + } + } + } + + &.size__medium { + .@{grid-prefix-cls}-body__column, + .@{grid-prefix-cls}-footer__column { + .MediumColumnHeight(); + + &:not(.col__ellipsis) { + padding: 2px 8px; + } + } + + .@{grid-prefix-cls}-header__column { + &, + .@{grid-prefix-cls}-resizable { + .MediumColumnHeight(28px); + } + + &:not(.col__ellipsis) { + padding: 2px 8px; + } + } + + .@{grid-prefix-cls}-loading { + .@{grid-prefix-cls}__spinner { + width: 50px; + height: 50px; + } + } + + .@{grid-prefix-cls}-default-input, + .@{grid-prefix-cls}-default-textarea, + .@{grid-prefix-cls}-default-select, + .@{grid-prefix-cls}-input__wrapper { + .MediumColumnHeight(47px); + } + } + + &.size__small { + font-size: 12px; + + .@{grid-prefix-cls}-body__column, + .@{grid-prefix-cls}-footer__column { + .SmallColumnHeight(); + + &:not(.col__ellipsis) { + padding: 2px 8px; + } + } + + .@{grid-prefix-cls}-header__column { + &, + .@{grid-prefix-cls}-resizable { + .SmallColumnHeight(28px); + } + + &:not(.col__ellipsis) { + padding: 2px 8px; + } + } + + .@{grid-prefix-cls}-loading { + .@{grid-prefix-cls}__spinner { + width: 44px; + height: 44px; + } + } + + .@{grid-prefix-cls}-default-input, + .@{grid-prefix-cls}-default-textarea, + .@{grid-prefix-cls}-default-select, + .@{grid-prefix-cls}-input__wrapper { + .SmallColumnHeight(30px); + } + } + + &.size__mini { + font-size: 12px; + + .@{grid-prefix-cls}-header__column, + .@{grid-prefix-cls}-body__column, + .@{grid-prefix-cls}-footer__column { + .MiniColumnHeight(); + + &:not(.col__ellipsis) { + padding: 2px 8px; + } + } + + .@{grid-prefix-cls}-loading { + .@{grid-prefix-cls}__spinner { + width: 38px; + height: 38px; + } + } + + .@{grid-prefix-cls}-default-input, + .@{grid-prefix-cls}-default-textarea, + .@{grid-prefix-cls}-default-select, + .@{grid-prefix-cls}-input__wrapper { + .MiniColumnHeight(21px); + } + + .@{grid-header-prefix-cls}__column { + .@{grid-prefix-cls}-resizable { + .MiniColumnHeight(); + } + } + } + + .fixed__hidden { + visibility: hidden; + } + + table { + border-spacing: 0; + border-collapse: separate; + table-layout: fixed; + } + + &&__stripe { + .@{grid-prefix-cls}-body__row { + // 支持所有行 hover 背景颜色 + &:not(.row__hover) { + &:nth-child(2n) { + background-color: #fafafa; + } + } + + &.row__selected { + &:not(.row__hover) { + &:nth-child(2n) { + background-color: #fff; + } + + &:nth-child(2n + 1) { + background-color: #fff; + } + } + } + } + &.mark-insert { + .@{grid-prefix-cls}-body__row.row__new { + background-color: var(--ti-table-tr-bg-color-hover); + } + } + } + + &&__border { + // 启用 border 只有表头生效,默认不建议启用 border 属性,另外如果内嵌列,则表头会自动启用 border 属性 + &:before, + &:after { + content: ''; + position: absolute; + left: 0; + width: 100%; + height: 0px; + z-index: 1; + } + + &:before { + top: 0; + border-top: 1px solid #d9d9d9; + } + + &:after { + bottom: 0; + border-bottom: 1px solid #d9d9d9; + } + + .@{grid-prefix-cls}__header { + border: 0; + border-spacing: 0; + border-collapse: separate; + } + + .@{grid-prefix-cls}-header__column, + .@{grid-prefix-cls}-body__column, + .@{grid-prefix-cls}-footer__column { + background-image: linear-gradient(-90deg, #d9d9d9, #d9d9d9), + linear-gradient(-180deg, #d9d9d9, #d9d9d9); + background-repeat: no-repeat; + background-size: 1px 100%, 100% 1px; + border: none; + background-position: 100% 0, 100% 100%; + } + + .@{grid-prefix-cls}__fixed-left-wrapper { + .@{grid-prefix-cls}-body__column { + border-right-color: #d9d9d9; + } + } + + .@{grid-prefix-cls}__body-wrapper, + .@{grid-prefix-cls}__fixed-left-body-wrapper, + .@{grid-prefix-cls}__fixed-right-body-wrapper { + border-bottom: none; + } + + .@{grid-prefix-cls}__fixed-left-wrapper, + .@{grid-prefix-cls}__fixed-right-wrapper { + &::before { + border-top-width: 1px; + } + } + + .@{grid-prefix-cls}__border-line { + &:before, + &:after { + content: ''; + position: absolute; + top: 0; + width: 0; + height: 100%; + z-index: 1; + } + + &:before { + left: 0; + border-left: 1px solid #d9d9d9; + } + + &:after { + right: 0; + border-right: 1px solid #d9d9d9; + } + } + } + + &&__checked { + user-select: none; + + .@{grid-prefix-cls}-header__column, + .@{grid-prefix-cls}-body__column { + &.col__index { + text-align: center; + cursor: default; + } + } + + .@{grid-prefix-cls}-header__column { + &.col__index { + .@{grid-prefix-cls}-cell { + visibility: hidden; + } + } + } + + .@{grid-prefix-cls}-body__column { + &.col__index { + background-color: #f1f1f1; + + &.col__index-checked { + background-color: #dcdcdc; + } + } + } + } + + & &__header-wrapper, + & &__footer-wrapper { + overflow-x: hidden; + overflow-y: hidden; + } + + & &__footer-wrapper { + border: 1px solid #d9d9d9; + border-bottom: none; + overflow: hidden !important; + + .@{grid-prefix-cls}-footer__row { + .@{grid-prefix-cls}-cell.cell__summary { + font-weight: 700; + text-align: right; + } + } + } + + & &__fixed-left-wrapper, + & &__fixed-right-wrapper { + width: 100%; + position: absolute; + top: 0; + z-index: 1; + overflow: hidden; + background-color: #fff; + + &:before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 0; + border-top: 0px solid #d9d9d9; + z-index: 1; + } + + .@{grid-prefix-cls}__body-wrapper { + overflow-x: hidden; + border-bottom: none; + } + } + + & &__fixed-left-wrapper { + left: 0; + width: 200px; + border-right: 0px solid #d9d9d9; + + &.scrolling__middle { + box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.12); + } + } + + & &__fixed-right-wrapper { + right: 0; + + &.scrolling__middle { + box-shadow: -2px 2px 6px rgba(0, 0, 0, 0.12); + } + } + + & &__header-wrapper, + & &__body-wrapper, + & &__footer-wrapper { + position: relative; + + &.fixed-left__wrapper, + &.fixed-right__wrapper { + position: absolute; + top: 0; + } + + &.fixed-left__wrapper { + left: 0; + } + + &.fixed-right__wrapper { + right: 0; + overflow-y: auto; + } + } + + &&-cell__resize { + * { + cursor: col-resize; + } + } + + & &-body__row { + background-color: #fff; + + &.row__hover { + background-color: var(--ti-table-tr-bg-color-hover); + } + + &.row__current { + background-color: var(--ti-table-tr-bg-color-hover); + } + } + + & &-header__column, + & &-body__column, + & &-footer__column { + .DefaultColumnHeight(); + text-align: left; + + &:not(.col__ellipsis) { + padding: 2px 8px; + } + + &.col__current { + background-color: var(--ti-table-tr-bg-color-hover); + } + + &.col__center { + text-align: center; + } + + &.col__right { + text-align: right; + } + + &.col__ellipsis { + .CellEllipsis(); + } + } + + & &-header__column { + .DefaultColumnHeight(28px); + } + + & &-body__row &-body__column, + & &-header__row &-header__column { + &.hideTypeClass .@{grid-prefix-cls}-cell { + padding: 0; + } + } + + & &-cell { + line-height: 120%; + white-space: normal; + -ms-word-break: break-all; + word-break: break-word; + + .@{grid-prefix-cls}-checkbox { + vertical-align: bottom; + } + + .@{grid-prefix-cls}__data-boole, + .@{grid-prefix-cls}__data-rate { + width: 100%; + position: relative; + } + + .@{grid-prefix-cls}__data-boole { + .icon-yes { + fill: #52c41a; + } + + .icon-close { + fill: var(--ti-input-border-color-error); + } + } + + .@{grid-prefix-cls}__data-rate { + .@{grid-prefix-cls}__rate-chart { + opacity: 0.6; + background-color: #52c41a; + height: 30px; + line-height: 30px; + + &.@{grid-prefix-cls}__chart-completed { + background-color: #52c41a; + } + + &.@{grid-prefix-cls}__chart-danger { + background-color: var(--ti-input-border-color-error); + } + + &.@{grid-prefix-cls}__chart-warning { + background-color: #faad14; + } + + &.@{grid-prefix-cls}__chart-normal { + background-color: var(--ti-common-color-line-active); + } + } + + .@{grid-prefix-cls}__rate-text { + position: absolute; + left: 8px; + top: 50%; + transform: translateY(-50%); + } + } + } + + & &-body__x-space { + width: 100%; + height: 1px; + margin-bottom: -1px; + } + + & &-body__y-space { + width: 0; + float: left; + } + + & &__body { + transform: translate3d(0, 0, 0); + } + + & &-body__y-space.visual { + z-index: 1; + } + + // 排序 + & &-sort-wrapper { + position: absolute; + right: 4px; + top: 0; + bottom: 0; + margin: auto; + text-align: center; + width: 20px; + height: 28px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + top: 4px; + margin: 0; + } + + .@{grid-prefix-cls}-icon__caret-top { + &:before { + bottom: 0.1em; + } + } + + .@{grid-prefix-cls}-sort__asc-btn, + .@{grid-prefix-cls}-sort__desc-btn { + height: 16px; + line-height: 16px; + display: block; + font-size: 16px; + color: var(--ti-base-color-common-1); + cursor: pointer; + + &:hover { + color: var(--ti-base-color-brand); + } + + &.sort__active { + fill: var(--ti-common-color-line-active); + } + } + } + + // 列宽线 + & &__resizable-bar { + display: none; + position: absolute; + top: 0; + left: 0; + width: 1px; + height: 100%; + z-index: 4; + + &:before { + content: ''; + display: block; + height: 100%; + background-color: #d9dddf; + } + } + + // 树形节点 + & &-tree__indent { + display: inline-block; + } + + & &-tree-wrapper { + display: inline-block; + vertical-align: bottom; + width: 18px; + cursor: pointer; + + &.is__active { + .@{grid-prefix-cls}-tree__node-btn { + transform: rotate(180deg); + } + } + + .@{grid-prefix-cls}-tree__node-btn { + font-size: 12px; + color: #939599; + + &:hover { + color: var(--ti-base-color-common); + } + } + } + + // 展开行 + & &__expanded { + display: block; + text-align: center; + cursor: pointer; + + .@{grid-prefix-cls}__expand-icon { + display: inline-block; + width: 6px; + height: 6px; + border: 1px solid #666; + vertical-align: middle; + border-width: 1px 1px 0 0; + transform: rotate(45deg); + background-color: transparent; + } + + &.expand__active { + .@{grid-prefix-cls}__expand-icon { + transform: rotate(135deg); + } + } + } + + & &-body__expanded-column { + border-bottom: 1px solid #d9d9d9; + } + + & &-body__expanded-cell { + padding: 20px; + } + + // 固定列 + &&-editable { + .@{grid-prefix-cls}-body__column { + .DefaultColumnHeight(); + line-height: inherit; + } + + &.size__medium { + .@{grid-prefix-cls}-body__column { + .MediumColumnHeight(); + } + } + + &.size__small { + .@{grid-prefix-cls}-body__column { + .SmallColumnHeight(); + } + } + + &.size__mini { + .@{grid-prefix-cls}-body__column { + .MiniColumnHeight(); + } + } + } + + // 溢出列 + & &-header__column, + & &-body__column, + & &-footer__column { + &.col__ellipsis { + .DefaultColumnHeight(); + line-height: inherit; + + .@{grid-cell-prefix-cls}__ellipsis, + .@{grid-cell-prefix-cls}__tooltip, + .@{grid-cell-prefix-cls}__title { + padding: 0 8px; + } + } + } + + & &-header__column { + .DefaultColumnHeight(28px); + } + + &.size__medium { + .@{grid-prefix-cls}-body__column, + .@{grid-prefix-cls}-footer__column { + &.col__ellipsis { + .MediumColumnHeight(); + padding: 2px 8px; + } + } + + .@{grid-prefix-cls}-header__column { + &.col__ellipsis { + .MediumColumnHeight(28px); + padding: 2px 8px; + } + } + } + + &.size__small { + .@{grid-prefix-cls}-body__column, + .@{grid-prefix-cls}-footer__column { + &.col__ellipsis { + .SmallColumnHeight(); + padding: 2px 8px; + } + } + + .@{grid-prefix-cls}-header__column { + &.col__ellipsis { + .SmallColumnHeight(28px); + padding: 2px 8px; + } + } + } + + &.size__mini { + .@{grid-prefix-cls}-header__column, + .@{grid-prefix-cls}-body__column, + .@{grid-prefix-cls}-footer__column { + &.col__ellipsis { + .MiniColumnHeight(); + padding: 2px 8px; + } + } + } + + // 暂无数据 + &.is__loading { + .@{grid-prefix-cls}__empty-block { + visibility: hidden; + } + } + + & &__empty-block { + display: none; + opacity: 0; + height: 100%; + min-height: 60px; + padding: 60px 0; + justify-content: center; + align-items: center; + text-align: center; + + &.is__visible { + display: flex; + flex-flow: row wrap; + opacity: 1; + &.is__center { + opacity: 0; + } + } + } + + .empty-center-block { + z-index: 1; + display: flex; + flex-direction: column; + justify-content: center; + text-align: center; + position: absolute; + width: 100%; + height: calc(100% - 60px); + + .@{grid-prefix-cls}__empty-text { + width: 100%; + } + } + + & &__empty-img { + width: 100%; + height: 100px; + margin: 0; + background: var(--ti-table-nodata-td-bg-img-url) 50% var(--ti-table-nodata-lead-icon-padding) no-repeat; + } + + & &__empty-text { + display: block; + margin-top: 8px; + width: 50%; + } + + & &-body__column { + &.col__selected { + &:not(.col__checked) { + box-shadow: inset 0px 0px 0px 2px var(--ti-common-color-line-active); + } + } + } + + // 校验不通过 + & &-body__column { + &.col__actived, + &.col__selected, + &.col__dirty { + position: relative; + } + + &.col__valid-error { + .@{grid-prefix-cls}-cell__valid { + width: 320px; + position: absolute; + bottom: calc(100% + 4px); + left: 50%; + transform: translateX(-50%); + text-align: center; + pointer-events: none; + z-index: 9; + + .@{grid-prefix-cls}-cell__valid-msg { + display: inline-block; + border-radius: 4px; + padding: 8px 12px; + color: #fff; + background-color: var(--ti-input-border-color-error); + pointer-events: auto; + } + } + + .@{grid-prefix-cls}-default-input, + .@{grid-prefix-cls}-default-textarea, + .@{grid-prefix-cls}-default-select { + border-color: var(--ti-input-border-color-error); + background-color: var(--ti-input-bg-color-error); + } + + .@{grid-prefix-cls}-input__wrapper { + > .@{grid-prefix-cls}-input { + border-color: var(--ti-input-border-color-error); + background-color: var(--ti-input-bg-color-error); + } + } + } + } + + & &-body__row { + &:first-child { + .@{grid-prefix-cls}-cell__valid { + bottom: auto; + top: calc(100% + 4px); + } + } + } + + // 可编辑 + &&-editable { + &.@{grid-prefix-cls}-cell__highlight { + .@{grid-prefix-cls}-body__column { + &.col__actived { + box-shadow: inset 0px 0px 0px 2px var(--ti-common-color-line-active); + + &.col__valid-error { + box-shadow: inset 0px 0px 0px 2px var(--ti-input-border-color-error); + } + + .@{grid-prefix-cls}-cell { + .@{grid-prefix-cls}-default-input, + .@{grid-prefix-cls}-default-textarea { + border: 0; + padding: 0; + } + + .@{grid-prefix-cls}-input__wrapper { + .@{grid-prefix-cls}-input, + .@{grid-prefix-cls}-textarea { + border: 0; + padding: 0; + } + } + } + } + } + } + + .@{grid-prefix-cls}-body__column { + padding: 2px 8px; + + &.col__actived { + padding: 2px 8px; + } + + &.col__ellipsis { + padding: 0; + + &.col__actived { + padding: 0; + } + } + + &.col__dirty { + &:before { + content: ''; + top: -5px; + left: -5px; + position: absolute; + border-width: 5px; + border-style: solid; + border-color: transparent var(--ti-input-border-color-error) + transparent transparent; + transform: rotate(45deg); + } + + &.col__valid-success:before { + border-color: transparent #52c41a transparent transparent; + } + } + } + + .@{grid-prefix-cls}__body-wrapper { + .@{grid-prefix-cls}-editor { + .@{css-prefix}select-dropdown { + left: 0 !important; + } + } + } + } + + &.@{css-prefix}fullscreen-full { + z-index: 1000; + position: fixed; + overflow: auto; + background: #fff; + width: 100%; + height: 100%; + top: 0; + left: 0; + margin: 0; + padding: 8px; + } + + // 默认的渲染 + &, + &__filter-wrapper { + .@{grid-prefix-cls}-default-input, + .@{grid-prefix-cls}-default-textarea, + .@{grid-prefix-cls}-default-select { + outline: 0; + padding: 0 8px; + height: 30px; + width: 100%; + color: var(--ti-base-color-common); + border-radius: 2px; + border: 1px solid #d9d9d9; + + &:focus { + border: 1px solid var(--ti-common-color-line-active); + } + } + + .@{grid-prefix-cls}-editor { + width: 100%; + height: 30px; + line-height: 30px; + color: var(--ti-base-color-common); + + .@{input-prefix-cls} { + width: 100%; + } + } + + .@{grid-prefix-cls}-default-textarea { + resize: none; + vertical-align: middle; + } + + .@{grid-prefix-cls}-input__wrapper { + width: 100%; + display: block; + + .@{grid-prefix-cls}-input, + .@{grid-prefix-cls}-textarea { + padding: 0 2px; + } + + .@{grid-prefix-cls}-textarea { + resize: none; + } + } + } + + &__filter-wrapper { + .@{grid-prefix-cls}-default-input, + .@{grid-prefix-cls}-default-textarea { + padding: 0 10px; + } + } + + &-hidden-column { + display: none; + } + + // 表格与分页上下间距 + .@{pager-prefix-cls}, + & + .@{pager-prefix-cls} { + padding-top: 24px; + } + + & &__header { + // 部分场景下浏览器缩放比例导致表头和表体错位问题 + th.col__gutter { + width: 0; + } + + // 配置表头排序且文本超出省略号显示,排序图标遮挡文字问题 + .@{grid-prefix-cls}-header__column.col__ellipsis.is__sortable { + .@{grid-cell-prefix-cls} { + padding-right: 28px; + } + } + } +} diff --git a/packages/theme/src/grid/table.less b/packages/theme/src/grid/table.less new file mode 100644 index 000000000..35bce9bd8 --- /dev/null +++ b/packages/theme/src/grid/table.less @@ -0,0 +1,1075 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import './base/common.less'; +@import './mixins/table.less'; +@import '../custom.less'; + +@grid-prefix-cls: ~'@{css-prefix}grid'; +@grid-cell-prefix-cls: ~'@{css-prefix}grid-cell'; +@input-prefix-cls: ~'@{css-prefix}input'; +@select-prefix-cls: ~'@{css-prefix}select'; +@pager-prefix-cls: ~'@{css-prefix}pager'; + +// table +.@{grid-prefix-cls} { + position: relative; + overflow: hidden; + font-size: var(--ti-grid-font-size); + color: var(--ti-grid-text-color); + font-family: var(--ti-grid-font-family); + background-color: var(--ti-grid-light-color); + + &.show__head { + .@{grid-prefix-cls}__fixed-left-wrapper, + .@{grid-prefix-cls}__fixed-right-wrapper { + .@{grid-prefix-cls}__body-wrapper { + &:before { + display: none; + } + } + } + } + + &.show__foot { + &.scroll__x { + .@{grid-prefix-cls}__body-wrapper { + overflow-x: auto; + } + } + &.scroll__y { + .@{grid-prefix-cls}__body-wrapper { + &.fixed-left__wrapper, + &.fixed-right__wrapper { + padding-bottom: 12px; + + //兼容ie10-ie11 + @media screen and (-ms-high-contrast: active), + (-ms-high-contrast: none) { + .@{grid-prefix-cls}__body { + padding-bottom: 17px; + } + } + } + } + } + } + + &.column__highlight { + .@{grid-prefix-cls}-header__column { + &:not(.col__index) { + &:hover { + background-color: var(--ti-grid-column-hover-background-color); + } + } + } + } + + &.size__medium { + .@{grid-prefix-cls}-header__column, + .@{grid-prefix-cls}-body__column, + .@{grid-prefix-cls}-footer__column { + + &:not(.col__ellipsis) { + .DefaultTdPadding(); + } + } + + .@{grid-prefix-cls}-body__column, + .@{grid-prefix-cls}-footer__column{ + .MediumColumnHeight(); + } + + .@{grid-prefix-cls}-loading { + .@{grid-prefix-cls}__spinner { + width: 50px; + height: 50px; + } + } + + .@{grid-prefix-cls}-default-input, + .@{grid-prefix-cls}-default-textarea, + .@{grid-prefix-cls}-default-select, + .@{grid-prefix-cls}-input__wrapper { + .MediumColumnHeight(); + } + + .@{grid-header-prefix-cls}__column { + .@{grid-prefix-cls}-resizable { + .MediumColumnHeight(); + } + } + } + + &.size__small { + font-size: var(--ti-grid-font-size); + + .@{grid-prefix-cls}-header__column, + .@{grid-prefix-cls}-body__column, + .@{grid-prefix-cls}-footer__column { + + &:not(.col__ellipsis) { + .DefaultTdPadding(); + } + } + + .@{grid-prefix-cls}-body__column, + .@{grid-prefix-cls}-footer__column { + .SmallColumnHeight(); + } + + .@{grid-prefix-cls}-loading { + .@{grid-prefix-cls}__spinner { + width: 44px; + height: 44px; + } + } + + .@{grid-prefix-cls}-default-input, + .@{grid-prefix-cls}-default-textarea, + .@{grid-prefix-cls}-default-select, + .@{grid-prefix-cls}-input__wrapper { + .SmallColumnHeight(); + } + + .@{grid-header-prefix-cls}__column { + .@{grid-prefix-cls}-resizable { + .SmallColumnHeight(); + } + } + } + + &.size__mini { + font-size: var(--ti-grid-font-size); + + .@{grid-prefix-cls}-header__column, + .@{grid-prefix-cls}-body__column, + .@{grid-prefix-cls}-footer__column { + + &:not(.col__ellipsis) { + .DefaultTdPadding(); + } + } + + .@{grid-prefix-cls}-body__column, + .@{grid-prefix-cls}-footer__column { + .MiniColumnHeight(); + } + + .@{grid-prefix-cls}-loading { + .@{grid-prefix-cls}__spinner { + width: 38px; + height: 38px; + } + } + + .@{grid-prefix-cls}-default-input, + .@{grid-prefix-cls}-default-textarea, + .@{grid-prefix-cls}-default-select, + .@{grid-prefix-cls}-input__wrapper { + .MiniColumnHeight(); + } + + .@{grid-header-prefix-cls}__column { + .@{grid-prefix-cls}-resizable { + .MiniColumnHeight(); + } + } + } + + .fixed__hidden { + visibility: hidden; + } + + table { + border-spacing: 0; + border-collapse: separate; + table-layout: fixed; + } + + &&__stripe { + .@{grid-prefix-cls}-body__row { + // 支持所有行 hover 背景颜色 + &:not(.row__hover) { + &:nth-child(2n) { + background-color: var(--ti-grid-row-striped-background-color); + } + } + + &.row__selected { + &:not(.row__hover) { + &:nth-child(2n) { + background-color: rgba(47, 143, 232, 0.1); + } + + &:nth-child(2n + 1) { + background-color: rgba(47, 143, 232, 0.15); + } + } + } + } + &.mark-insert { + .@{grid-prefix-cls}-body__row.row__new { + background-color: #f2f5fc; + } + } + } + + &&__border { + // 启用 border 只有表头生效,默认不建议启用 border 属性,另外如果内嵌列,则表头会自动启用 border 属性 + &:before, + &:after { + content: ''; + position: absolute; + left: 0; + width: 100%; + height: 0px; + z-index: 1; + } + + &:before { + top: 0; + border-top: 1px solid var(--ti-grid-border-color); + } + + &:after { + bottom: 0; + border-bottom: 1px solid var(--ti-grid-border-color); + } + + .@{grid-prefix-cls}__header { + border: 0; + border-spacing: 0; + border-collapse: separate; + } + + .@{grid-prefix-cls}-header__column, + .@{grid-prefix-cls}-body__column, + .@{grid-prefix-cls}-footer__column { + background-image: linear-gradient( + -90deg, + var(--ti-grid-border-color), + var(--ti-grid-border-color) + ), + linear-gradient( + -180deg, + var(--ti-grid-border-color), + var(--ti-grid-border-color) + ); + background-repeat: no-repeat; + background-size: 1px 100%, 100% 1px; + background-position: 100% 0, 100% 100%; + border: none; + } + + .@{grid-prefix-cls}__fixed-left-wrapper { + .@{grid-prefix-cls}-body__column { + border-right-color: var(--ti-grid-border-color); + } + } + + .@{grid-prefix-cls}__body-wrapper, + .@{grid-prefix-cls}__fixed-left-body-wrapper, + .@{grid-prefix-cls}__fixed-right-body-wrapper { + border-bottom: none; + } + + .@{grid-prefix-cls}__fixed-left-wrapper, + .@{grid-prefix-cls}__fixed-right-wrapper { + &::before { + border-top-width: 1px; + } + } + + .@{grid-prefix-cls}__border-line { + &:before, + &:after { + content: ''; + position: absolute; + top: 0; + width: 0; + height: 100%; + z-index: 1; + } + + &:before { + left: 0; + border-left: 1px solid var(--ti-grid-border-color); + } + + &:after { + right: 0; + border-right: 1px solid var(--ti-grid-border-color); + } + } + } + + &&__checked { + user-select: none; + + .@{grid-prefix-cls}-header__column, + .@{grid-prefix-cls}-body__column { + &.col__index { + text-align: center; + cursor: default; + } + } + + .@{grid-prefix-cls}-header__column { + &.col__index { + .@{grid-prefix-cls}-cell { + visibility: hidden; + } + } + } + + .@{grid-prefix-cls}-body__column { + &.col__index { + background-color: var(--ti-grid-header-background-color); + + &.col__index-checked { + background-color: #dcdcdc; + } + } + } + } + + & &__header-wrapper, + & &__footer-wrapper { + overflow-x: hidden; + overflow-y: hidden; + } + + & &__footer-wrapper { + border: 1px solid var(--ti-grid-border-color); + border-bottom: none; + overflow: hidden !important; + + .@{grid-prefix-cls}-footer__row { + .@{grid-prefix-cls}-cell.cell__summary { + font-weight: 700; + text-align: right; + } + } + } + + & &__fixed-left-wrapper, + & &__fixed-right-wrapper { + width: 100%; + position: absolute; + top: 0; + z-index: 1; + overflow: hidden; + background-color: var(--ti-grid-light-color); + + &:before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 0; + border-top: 0px solid var(--ti-grid-border-color); + z-index: 1; + } + + .@{grid-prefix-cls}__body-wrapper { + overflow-x: hidden; + border-bottom: none; + } + } + + & &__fixed-left-wrapper { + left: 0; + width: 200px; + border-right: 0px solid var(--ti-grid-border-color); + + &.scrolling__middle { + box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.12); + } + } + + & &__fixed-right-wrapper { + right: 0; + + &.scrolling__middle { + box-shadow: -2px 2px 6px rgba(0, 0, 0, 0.12); + } + } + + & &__header-wrapper, + & &__body-wrapper, + & &__footer-wrapper { + position: relative; + + &.fixed-left__wrapper, + &.fixed-right__wrapper { + position: absolute; + top: 0; + } + + &.fixed-left__wrapper { + left: 0; + } + + &.fixed-right__wrapper { + right: 0; + overflow-y: auto; + } + } + + & &__header-wrapper { + &.fixed-right__wrapper { + -ms-overflow-style: none; + } + } + + &&-cell__resize { + * { + cursor: col-resize; + } + } + + & &-body__row { + background-color: var(--ti-grid-row-odd-background-color); + + &.row__hover { + background-color: var(--ti-grid-row-hover-background-color); + } + + &.row__current { + background-color: var(--ti-grid-row-hover-background-color); + } + } + + & &-header__column, + & &-body__column, + & &-footer__column { + text-align: left; + + &:not(.col__ellipsis) { + .DefaultTdPadding(); + } + + + &.col__current { + background-color: var(--ti-grid-column-current-background-color); + } + + &.col__center { + text-align: center; + } + + &.col__right { + text-align: right; + } + + &.col__ellipsis { + .CellEllipsis(); + } + } + + & &-header__column{ + height: var(--ti-grid-header-column-height); + } + + & &-body__column, + & &-footer__column{ + .DefaultColumnHeight(); + border-bottom: 1px solid var(--ti-grid-border-color); + } + + & &-body__row &-body__column, + & &-header__row &-header__column { + &.hideTypeClass .@{grid-prefix-cls}-cell { + padding: 0; + } + } + + & &-cell { + line-height: 120%; + white-space: normal; + -ms-word-break: break-all; + word-break: break-word; + + .@{grid-prefix-cls}-checkbox { + vertical-align: bottom; + } + + .@{grid-prefix-cls}__data-boole, + .@{grid-prefix-cls}__data-rate { + width: 100%; + position: relative; + } + + .@{grid-prefix-cls}__data-boole { + .icon-yes { + fill: var(--ti-grid-success-color); + } + + .icon-close { + fill: var(--ti-grid-error-color); + } + } + + .@{grid-prefix-cls}__data-rate { + .@{grid-prefix-cls}__rate-chart { + opacity: 0.6; + background-color: var(--ti-grid-success-color); + height: 30px; + line-height: 30px; + + &.@{grid-prefix-cls}__chart-completed { + background-color: var(--ti-grid-success-color); + } + + &.@{grid-prefix-cls}__chart-danger { + background-color: var(--ti-grid-error-color); + } + + &.@{grid-prefix-cls}__chart-warning { + background-color: var(--ti-grid-warning-color); + } + + &.@{grid-prefix-cls}__chart-normal { + background-color: var(--ti-grid-primary-color); + } + } + + .@{grid-prefix-cls}__rate-text { + position: absolute; + left: 8px; + top: 50%; + transform: translateY(-50%); + } + } + } + + & &-body__x-space { + width: 100%; + height: 1px; + margin-bottom: -1px; + } + + & &-body__y-space { + width: 0; + float: left; + } + + // 排序 + & &-sort-wrapper { + position: absolute; + right: 4px; + top: 0; + bottom: 0; + margin: auto; + text-align: center; + width: 20px; + height: 28px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + top: 4px; + margin: 0; + } + + .@{grid-prefix-cls}-icon__caret-top { + &:before { + bottom: 0.1em; + } + } + + .@{grid-prefix-cls}-sort__asc-btn, + .@{grid-prefix-cls}-sort__desc-btn { + height: 16px; + line-height: 16px; + display: block; + font-size: var(--ti-grid-header-icon-font-size); + fill: var(--ti-grid-column-icon-border-color); + cursor: pointer; + + &:hover { + fill: var(--ti-grid-text-color); + } + + &.sort__active { + fill: var(--ti-grid-primary-color); + } + } + + .@{grid-prefix-cls}-sort__desc-btn { + margin-top: -2px; + } + } + + // 列宽线 + & &__resizable-bar { + display: none; + position: absolute; + top: 0; + left: 0; + width: 1px; + height: 100%; + z-index: 4; + + &:before { + content: ''; + display: block; + height: 100%; + background-color: #d9dddf; + } + } + + // 树形节点 + & &-tree__indent { + display: inline-block; + } + + & &-tree-wrapper { + display: inline-block; + vertical-align: bottom; + width: 18px; + cursor: pointer; + + &.is__active { + .@{grid-prefix-cls}-tree__node-btn { + transform: rotate(180deg); + } + } + + .@{grid-prefix-cls}-tree__node-btn { + font-size: var(--ti-grid-font-size); + color: #939599; + + &:hover { + color: var(--ti-grid-text-color); + } + } + } + + // 展开行 + & &__expanded { + display: inline-block; + text-align: center; + cursor: pointer; + + .@{grid-prefix-cls}__expand-icon { + display: inline-block; + width: 8px; + height: 8px; + border: 1px solid #666; + vertical-align: middle; + border-width: 1px 1px 0 0; + transform: rotate(45deg); + background-color: transparent; + } + + &.expand__active { + .@{grid-prefix-cls}__expand-icon { + transform: rotate(135deg); + } + } + } + + & &-body__expanded-column { + border-bottom: 1px solid var(--ti-grid-border-color); + } + + & &-body__expanded-cell { + padding: 20px; + } + + // 固定列 + &&-editable { + .@{grid-prefix-cls}-body__column { + height: 43px; + line-height: inherit; + line-height: inherit; + } + + &.size__medium { + .@{grid-prefix-cls}-body__column { + .MediumColumnHeight(); + } + } + + &.size__small { + .@{grid-prefix-cls}-body__column { + .SmallColumnHeight(); + } + } + + &.size__mini { + .@{grid-prefix-cls}-body__column { + .MiniColumnHeight(); + } + } + } + + // 溢出列 + & &-header__column, + & &-body__column, + & &-footer__column { + &.col__ellipsis { + line-height: inherit; + + .@{grid-cell-prefix-cls}__ellipsis, + .@{grid-cell-prefix-cls}__tooltip, + .@{grid-cell-prefix-cls}__title { + padding: 0 8px; + } + } + } + + &.size__medium { + .@{grid-prefix-cls}-header__column, + .@{grid-prefix-cls}-body__column, + .@{grid-prefix-cls}-footer__column { + &.col__ellipsis { + .MediumColumnHeight(); + } + } + } + + &.size__small { + .@{grid-prefix-cls}-header__column, + .@{grid-prefix-cls}-body__column, + .@{grid-prefix-cls}-footer__column { + &.col__ellipsis { + .SmallColumnHeight(); + } + } + } + + &.size__mini { + .@{grid-prefix-cls}-header__column, + .@{grid-prefix-cls}-body__column, + .@{grid-prefix-cls}-footer__column { + &.col__ellipsis { + .MiniColumnHeight(); + } + } + } + + // 暂无数据 + &.is__loading { + .@{grid-prefix-cls}__empty-block { + visibility: hidden; + } + } + + & &__empty-block { + display: none; + opacity: 0; + height: 100%; + min-height: 60px; + padding: 60px 0; + justify-content: center; + align-items: center; + text-align: center; + + &.is__visible { + display: flex; + flex-flow: row wrap; + opacity: 1; + &.is__center { + opacity: 0; + } + } + } + + .empty-center-block { + z-index: 1; + display: flex; + flex-direction: column; + justify-content: center; + text-align: center; + position: absolute; + width: 100%; + height: calc(100% - 60px); + + .@{grid-prefix-cls}__empty-text { + width: 100%; + } + } + + & &__empty-img { + width: 100%; + height: 100px; + margin: 0; + background: var(--ti-table-nodata-td-bg-img-url) 50% no-repeat; + } + + & &__empty-text { + display: block; + margin-top: 8px; + width: 50%; + } + + & &-body__column { + &.col__selected { + &:not(.col__checked) { + box-shadow: inset 0px 0px 0px 2px var(--ti-grid-primary-color); + } + } + } + + // 校验不通过 + & &-body__column { + &.col__actived, + &.col__selected, + &.col__dirty { + position: relative; + } + + &.col__valid-error { + .@{grid-prefix-cls}-cell__valid { + width: 320px; + position: absolute; + bottom: calc(100% + 4px); + left: 50%; + transform: translateX(-50%); + text-align: center; + pointer-events: none; + z-index: 9; + + .@{grid-prefix-cls}-cell__valid-msg { + display: inline-block; + border-radius: 4px; + padding: 8px 12px; + color: var(--ti-grid-light-color); + background-color: var(--ti-grid-error-color); + pointer-events: auto; + } + } + + .@{grid-prefix-cls}-default-input, + .@{grid-prefix-cls}-default-textarea, + .@{grid-prefix-cls}-default-select { + border-color: var(--ti-grid-error-color); + background-color: var(--ti-grid-error-bg-color); + } + + .@{grid-prefix-cls}-input__wrapper { + > .@{grid-prefix-cls}-input { + border-color: var(--ti-grid-error-color); + background-color: var(--ti-grid-error-bg-color); + } + } + + .@{input-prefix-cls}__inner { + border-color: var(--ti-grid-error-color); + background-color: var(--ti-grid-error-bg-color); + } + } + } + + & &-body__row { + &:first-child { + .@{grid-prefix-cls}-cell__valid { + bottom: auto; + top: calc(100% + 4px); + } + } + } + + // 滚动加载 + & &__body-wrapper { + &.body__wrapper.is__scrollload { + overflow-y: hidden; + position: static; + } + } + & .is__scrollload &-body__y-space { + position: absolute; + right: 0; + width: 12px; + overflow-y: scroll; + } + + // 可编辑 + &&-editable { + &.@{grid-prefix-cls}-cell__highlight { + .@{grid-prefix-cls}-body__column { + &.col__actived { + box-shadow: inset 0px 0px 0px 2px + var(--ti-grid-primary-color); + + &.col__valid-error { + box-shadow: inset 0px 0px 0px 2px + var(--ti-grid-error-color); + } + + .@{grid-prefix-cls}-cell { + .@{grid-prefix-cls}-default-input, + .@{grid-prefix-cls}-default-textarea { + border: 0; + padding: 0; + } + + .@{grid-prefix-cls}-input__wrapper { + .@{grid-prefix-cls}-input, + .@{grid-prefix-cls}-textarea { + border: 0; + padding: 0; + } + } + } + } + } + } + + .@{grid-prefix-cls}-body__column { + .DefaultTdPadding(); + + &.col__actived { + .DefaultTdPadding(); + } + + &.col__ellipsis { + padding: 0; + + &.col__actived { + padding: 0; + } + } + + &.col__dirty { + &:before { + content: ''; + top: -5px; + left: -5px; + position: absolute; + border-width: 5px; + border-style: solid; + border-color: transparent var(--ti-grid-error-color) + transparent transparent; + transform: rotate(45deg); + } + + &.col__valid-success:before { + border-color: transparent var(--ti-grid-success-color) + transparent transparent; + } + } + } + + .@{grid-prefix-cls}__body-wrapper { + .@{grid-prefix-cls}-editor { + .@{css-prefix}select-dropdown { + left: 0 !important; + } + } + } + } + + &.@{css-prefix}fullscreen-full { + z-index: 1000; + position: fixed; + overflow: auto; + background: var(--ti-grid-light-color); + width: 100%; + height: 100%; + top: 0; + left: 0; + margin: 0; + padding: 8px; + } + + // 默认的渲染 + &, + &__filter-wrapper { + .@{grid-prefix-cls}-default-input, + .@{grid-prefix-cls}-default-textarea, + .@{grid-prefix-cls}-default-select { + outline: 0; + padding: 0 8px; + height: 30px; + width: 100%; + color: var(--ti-grid-text-color); + border-radius: 2px; + border: 1px solid var(--ti-grid-border-color); + + &:focus { + border: 1px solid var(--ti-grid-primary-color); + } + } + + .@{grid-prefix-cls}-editor { + width: 100%; + height: 30px; + line-height: 30px; + color: var(--ti-grid-text-color); + + .@{input-prefix-cls} { + width: 100%; + } + + .@{select-prefix-cls} { + z-index: 1; + } + } + + .@{grid-prefix-cls}-default-textarea { + resize: none; + vertical-align: middle; + } + + .@{grid-prefix-cls}-input__wrapper { + width: 100%; + display: block; + + .@{grid-prefix-cls}-input, + .@{grid-prefix-cls}-textarea { + padding: 0 2px; + } + + .@{grid-prefix-cls}-textarea { + resize: none; + } + } + } + + &__filter-wrapper { + .@{grid-prefix-cls}-default-input, + .@{grid-prefix-cls}-default-textarea { + padding: 0 10px; + } + } + + &-hidden-column { + display: none; + } + + // 表格与分页上下间距 + .@{pager-prefix-cls}, + & + .@{pager-prefix-cls} { + padding-top: 24px; + } + + & &__header { + // 部分场景下浏览器缩放比例导致表头和表体错位问题 + th.col__gutter { + width: 0; + } + + // 配置表头排序且文本超出省略号显示,排序图标遮挡文字问题 + .@{grid-prefix-cls}-header__column.col__ellipsis.is__sortable { + .@{grid-cell-prefix-cls} { + padding-right: 28px; + } + } + } +} diff --git a/packages/theme/src/grid/toolbar.less b/packages/theme/src/grid/toolbar.less new file mode 100644 index 000000000..a451656e0 --- /dev/null +++ b/packages/theme/src/grid/toolbar.less @@ -0,0 +1,171 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@grid-toolbar-prefix-cls: ~'@{css-prefix}grid-toolbar'; +@grid-tools-prefix-cls: ~'@{css-prefix}grid-tools'; +@grid-fullscreen-prefix-cls: ~'@{css-prefix}grid-fullscreen'; +@grid-refresh-prefix-cls: ~'@{css-prefix}grid-refresh'; +@grid-custom-prefix-cls: ~'@{css-prefix}grid-custom'; +@grid-checkbox-prefix-cls: ~'@{css-prefix}grid-checkbox'; +@grid-select-toolbar-prefix-cls: ~'@{css-prefix}grid__select-toolbar'; + +// toolbar +.@{grid-toolbar-prefix-cls} { + padding: 12px 0; + + &:after { + content: ''; + display: block; + clear: both; + height: 0; + overflow: hidden; + visibility: hidden; + } + + svg { + fill: var(--ti-grid-primary-color); + font-size: var(--ti-common-font-size-1); + } + + &.is__loading { + position: relative; + + &:before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: 1; + background-color: var(--ti-grid-loading-background-color); + } + } + + &.size__small, + &.size__mini { + padding: 8px 0; + } + + &.size__medium { + .@{grid-refresh-prefix-cls}__btn, + .@{grid-custom-prefix-cls}__setting-btn { + font-size: 17px; + } + } + + &.size__small { + .@{grid-refresh-prefix-cls}__btn, + .@{grid-custom-prefix-cls}__setting-btn { + font-size: 15px; + } + } + + &.size__mini { + .@{grid-refresh-prefix-cls}__btn, + .@{grid-custom-prefix-cls}__setting-btn { + font-size: var(--ti-common-font-size-1); + } + } + + .@{grid-tools-prefix-cls}__wrapper, + .@{grid-fullscreen-prefix-cls}__wrapper, + .@{grid-refresh-prefix-cls}__wrapper, + .@{grid-custom-prefix-cls}__wrapper { + float: right; + width: 30px; + height: 30px; + line-height: 30px; + border: solid 1px var(--ti-grid-border-color); + border-radius: 3px; + text-align: center; + margin: 0 4px; + display: flex; + align-items: center; + justify-content: center; + + &:hover { + border-color: var(--ti-grid-primary-color); + } + } + + .@{grid-custom-prefix-cls}__wrapper { + position: relative; + + &.is__active { + .@{grid-custom-prefix-cls}__setting-btn { + border-color: var(--ti-grid-primary-color); + } + + .@{grid-custom-prefix-cls}__option-wrapper { + display: block; + } + } + } + + .@{grid-refresh-prefix-cls}__btn, + .@{grid-fullscreen-prefix-cls}__btn, + .@{grid-custom-prefix-cls}__setting-btn { + font-size: var(--ti-common-font-size-2); + vertical-align: middle; + width: 100%; + cursor: pointer; + user-select: none; + + & > i { + display: block; + color: var(--ti-grid-primary-color); + line-height: 28px; + } + } + + .@{grid-custom-prefix-cls}__option-wrapper { + display: none; + position: absolute; + right: 0; + text-align: left; + background-color: var(--ti-grid-light-color); + z-index: 19; + max-height: 210px; + overflow: auto; + box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); + + .@{grid-custom-prefix-cls}__option { + padding: 5px 5px; + border: 1px solid var(--ti-grid-border-color); + border-radius: 2px; + font-weight: 700; + font-size: var(--ti-common-font-size-1); + + > .@{grid-checkbox-prefix-cls} { + display: block; + padding: 5px; + margin: 0; + max-width: 180px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + } + } +} + +.@{grid-select-toolbar-prefix-cls} { + position: absolute; + background-color: var(--ti-base-color-light); + + .@{grid-toolbar-prefix-cls} { + padding: 2px 0px 2px 6px; + } +} diff --git a/packages/theme/src/grid/tooltip.less b/packages/theme/src/grid/tooltip.less new file mode 100644 index 000000000..2de27380d --- /dev/null +++ b/packages/theme/src/grid/tooltip.less @@ -0,0 +1,137 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@grid-prefix-cls: ~'@{css-prefix}grid'; + +// tooltip +.@{grid-prefix-cls}__tooltip-wrapper { + display: none; + position: absolute; + top: -100%; + left: -100%; + font-size: var(--ti-grid-font-size); + max-width: 400px; + border-radius: 4px; + padding: 8px 12px; + white-space: normal; + word-break: break-word; + box-shadow: 2px 2px 4px -2px rgba(0, 0, 0, 0.2); + color: var(--ti-grid-text-color); + font-family: var(--ti-grid-font-family); + pointer-events: none; + z-index: 4000; + + &.is__visible { + display: block; + } + + &.is__arrow { + .@{grid-prefix-cls}__tooltip-arrow { + display: block; + } + } + + &.placement__top { + .@{grid-prefix-cls}__tooltip-arrow { + bottom: -12px; + + &:before { + top: -7px; + } + } + } + + &.placement__bottom { + .@{grid-prefix-cls}__tooltip-arrow { + top: -12px; + + &:before { + top: -4px; + } + } + } + + &.theme__light { + background-color: var(--ti-grid-tooltip-light-background-color); + border: 1px solid var(--ti-grid-border-color); + + &.placement__top { + .@{grid-prefix-cls}__tooltip-arrow { + border-top-color: var(--ti-grid-border-color); + + &:before { + border-top-color: var(--ti-grid-tooltip-light-background-color); + } + } + } + + &.placement__bottom { + .@{grid-prefix-cls}__tooltip-arrow { + border-bottom-color: var(--ti-grid-border-color); + + &:before { + border-bottom-color: var(--ti-grid-tooltip-light-background-color); + } + } + } + } + + &.theme__dark { + background: var(--ti-grid-tooltip-dark-background-color); + color: var(--ti-grid-light-color); + + &.placement__top { + .@{grid-prefix-cls}__tooltip-arrow { + border-top-color: var(--ti-grid-tooltip-dark-background-color); + + &:before { + border-top-color: var(--ti-grid-tooltip-dark-background-color); + } + } + } + + &.placement__bottom { + .@{grid-prefix-cls}__tooltip-arrow { + border-bottom-color: var(--ti-grid-tooltip-dark-background-color); + + &:before { + border-bottom-color: var(--ti-grid-tooltip-dark-background-color); + } + } + } + } + + .@{grid-prefix-cls}__tooltip-arrow { + display: none; + position: absolute; + border-color: transparent; + border-width: 6px; + border-style: solid; + left: 50%; + + &:before { + content: ''; + position: absolute; + border-color: transparent; + border-width: 5px; + border-style: solid; + left: -5px; + } + } + + &.@{grid-prefix-cls}__valid-error { + background-color: var(--ti-grid-error-color); + color: var(--ti-grid-light-color); + } +} diff --git a/packages/theme/src/grid/vars.less b/packages/theme/src/grid/vars.less new file mode 100644 index 000000000..852aafdb6 --- /dev/null +++ b/packages/theme/src/grid/vars.less @@ -0,0 +1,88 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-grid() { + /*font-family/table color*/ + --ti-grid-font-family: Helvetica, Arial, 'Microsoft YaHei', sans-serif; + --ti-grid-text-color: var(--ti-base-color-info-normal); + --ti-grid-light-color: var(--ti-base-color-light); + --ti-grid-error-color: var(--ti-base-color-bg-8); + --ti-grid-error-bg-color: var(--ti-base-color-error-1); + --ti-grid-success-color: var(--ti-base-color-success-normal); + --ti-grid-warning-color: var(--ti-base-color-warning-normal); + --ti-grid-disabled-color: var(--ti-base-color-bg-5); + --ti-grid-normal-text-color: var(--ti-base-color-placeholder); + --ti-grid-font-size: var(--ti-common-font-size-base); + --ti-grid-border-color: var(--ti-common-color-line-dividing); + --ti-grid-border-radius: var(--ti-common-border-radius-normal); + --ti-grid-header-background-color: var(--ti-common-color-bg-white-emphasize); + + /*primary color*/ + --ti-grid-primary-color: var(--ti-base-color-brand-6); + --ti-grid-primary-hover-color: var(--ti-base-color-brand-5); + --ti-grid-primary-active-color: var(--ti-base-color-primary-active); + --ti-grid-primary-disabled-text-color: #b1b1b1; + + /* height */ + --ti-grid-header-column-height: var(--ti-base-size-height-small); + --ti-grid-medium-column-height: 52px; + --ti-grid-default-column-height: 42px; + --ti-grid-small-column-height: 40px; + --ti-grid-mini-column-height: 30px; + --ti-grid-custom-head-height: 40px; + --ti-grid-custom-body-list-height: var(--ti-base-size-height-small); + --ti-grid-icon-fill-hover-bg-color: #fff; + + /*input/radio/checkbox color*/ + --ti-grid-input-disabled-bg-color: #f5f5f5; + + /*popup*/ + --ti-grid-popup-border-color: #ebeef5; + + /*table row*/ + --ti-grid-row-odd-background-color: #fff; + --ti-grid-row-striped-background-color: #fafafa; + --ti-grid-row-hover-background-color: var(--ti-base-color-hover-background); + + /*table column*/ + --ti-grid-column-hover-background-color: #d7effb; + --ti-grid-column-current-background-color: var(--ti-base-color-hover-background); + --ti-grid-column-icon-border-color: var(--ti-base-color-common-1); + + /*table checked*/ + --ti-grid-column-checked-border-width: 2px; + --ti-grid-column-checked-border-color: #d4d4d4; + + /*loading*/ + --ti-grid-loading-background-color: rgba(0, 0, 0, 0.2); + + /*tooltip*/ + --ti-grid-tooltip-dark-background-color: #303133; + --ti-grid-tooltip-light-background-color: var(--ti-base-color-light); + + /*modal*/ + --ti-grid-modal-loading-text-color: #78b1eb; + --ti-grid-modal-alert-font-size: 22px; + --ti-grid-modal-header-font-size: var(--ti-common-font-size-1); + --ti-grid-modal-small-btn-font-size: var(--ti-common-font-size-2); + --ti-grid-modal-box-background-color: var(--ti-base-color-light); + --ti-grid-modal-box-border-color: #ebeef5; + --ti-grid-modal-btn-text-color: #c4c4c4; + --ti-grid-modal-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); + --ti-grid-modal-border-color: rgba(0, 0, 0, 0.2); + + --ti-table-td-padding-vertical: 2px; + --ti-table-td-padding-horizontal: 8px; + --ti-table-th-spacing-line-text-color: var(--ti-common-color-text-white); + --ti-grid-header-icon-font-size: var(--ti-common-font-size-2); + --ti-table-nodata-td-bg-img-url: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFoAAABaCAYAAAFPr3GUAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAADPNJREFUeNqUULENwCAMK0wsSDmBk3oCn/UFegR7N84oH6SAoAISFdWShwQbRxaIuDFoSzE/SEaIzAycgY2quBNNiawnfYl7iOGkEAJRTDsrf/yecQwJAEAUWmvS0ltdjJEYlFL9eA4J3nticM71477llhIB17hKo9WQaVbi2dBoO6Gb3x8BhE1DAFRxA7ocI1LCwxcXjMhpiFCk/YcpdoCJvH37FkXFlStXUDSAFO8HsVavXs3w69cvFMXCwsIMu3btwkz7Hz9+xBoxjx49wlQsKSmJ4VA2NjY0lyOBZ8+egWlgssUaQyDFB3BF35s3b1D4pOQmeE5iJKQQRLCgC6DZgmIIQABhSxsw7PCfOHAAlxnYBCkBCUQn1Fu3bjF8+fKF4dy5cwwpKSkMc+bMAcf38+fPwfKurq4M8vLyOMMQa+xs3boVbIC3tzfWxIMMQBYKCQkxBAUFYY3NAHRRkMEBAQHgtI2nfAHnBRsbG4Z3795hzWkgw9djk3n9+jVm8kYDoFyJo+KB551GdEFQWMJ8QAiIiooyGBkZYU+8uHIEqJr4/v07To0wy1lZWRlERESwmo03taCnDlAEgyIblnJAAMTGlVrwlcbkAqzpHFdrgKjqGJsgQADWqxjHQRgI2lEqGn8h10F5NS3iO1F+cj0PoM0DaE6iRbwA6SQekDRUIHE3lhKZZRfMwUhuzHq9LLOzy1L5u+tOyv2yduaIqLVEQYqvjakYOfvzjtxyF2gu4qfaj5FGjLHHrHEaxeOqocDnp/UnaXWWZavEzfNc5PTJHUDdSH0APRdsreo9qFbHceydVIgYznCiNFKh6bpODcOgwjCc6TQ0/IWqqmyX6ft+1jBmPIYBDMuyXI22rmtxhDlLh2g6ED0u9AXrGJNV27YqiqKJYwpjjLXl9JkraeuUAh+I9kOMfE3T+EfMIU3TWSqSJFFFUYh98MY9wGu6QEsKgmCyJzl19fhflbdg89ZjSOWVyyt47fa7F9ALMZMIo4P2/V/YAk1ZoY9yytFNH+FU4jEMPjc4/OYCWmqmrnAbZv/jb/1Ih34FYM6KURuGoajieAwkF8jQwVlsqLdshq5eSm7Q3iBX6QmKfYIO3jKkFzD4CM0eaMGQzbR9wko/qSV9K3HaB4IEK9b395f+ey/c9t81Zq0mdcXadW1ONgRpje9iODx9jzWrUM54hUMCtVmZ6L6NQ107YNn+2rUfhiKIQ+L5ouQzz3MRRZEIgkBKQ2WVUOo3mUw6r+E76Ak+2/QsieunZFxkPZqUMlJcgd9zGuIJ4GccM12ZHnO324nNZiOWy6XwfV9SJ2aGrNjv95JroOkmSSIWi4Vp+pb6P7c28Q7+gYDH47F0KzmanAOYBwDoG3g4Ax/I9IttlpIlQNM01rtS+kepts5sUBlP05QT9BSZvu+TGbWI8a5T+ymJ8kKZqUx3upEO5/QvgDDTRUxvBoDZZHJdUGZIwuFw6FVSXst2rMDxptSAbSMi0ygLjQ10PA7n87nchFAOfTa2p+s6pwjD8OhG2zYialoNk/hFEiAoELTJC+tqLm+cifTfkjiOZaZ0sG0+XY0zceMTAm3thtgoVVXJo8/zvF7Z6SoPKFh1KjGRySS7mN1FUchxDsqy/MyyrM9PXk18ms0/6ro28g7aLOg1g6TUYUX7iY5Pxy09/A8Ycc/pqp38+MfBjlyVyzUVzIpDK/p0xBl5+rsLBZmRe444AQNfAjBvBbdtBDFwdfBPjyQNCEkFKcF2BUEaEOwKknTiVBClAcWpIPZP+jk//ewOFOunl+M5HA3qsLsc3u35NMDCEGzvDSgulxzyPJbO4X1zSZ09r9PI738/rwVLyi4JuksIX3tEvLtGghhcQhDcJKzZFefNnq7cg4UUvKeFD9+f0JoiKUH6bbPpl4Ejx7YxTO+DOMYl82hZPWfpi5FuxTdWKlFlCP8Y+fp+8rgHYu79keQdUVeJWfpYCIurXFmWpvOL5XJZT0jojgaKAqSfkoLq30nHH4AkJjMNJN4F1drVpOlIgYGV1WpVP5jR7iSHljkq/MRnp0o1iV3jT57KpS+66njSTg5BTZUxKCWJdbg5D9wjGxfxdUPa1Uh07F3Q3b35fM6UYLVvU6Rl5kl6wbon3IewSA2bzaZehCH+4uzRYo0myk4jMIopVqwZnsBHidNXngdBERobJ566TxRTxNwUINnKIARE+FRYwx6YxvDMMYiARefTophixWZENGkmymAPDCvDEPp/CFxQpGEtPQrLanKz2cz0aVgbpHHQSXyiSe92uzCdTk1RXQvqOalXIgXCHAzSHq7sXW6JpWEVWKdkjMbBhqUHIZ26FPpAvrXYuFOpwvbgQTnALazQCJL6JQCPpU+8pBn3yPVaNOkO4Q64rfr4YwrSusg1gJxi+oHu4u5uWe6hQ6PVtWJcLYJF1ehsJpDgI3pst1sz5CGXwLJCHtzDebEADyBNTbPgoMCKGIK0SiUhzbgYSHv77CD9wIY9WBpAc78EJEY7SH/TIe+n9deYDtjv97WlSwBFsLgHZkYceuILaTOnxnWLB63X62yW5ynZkDShE9x+oysV6mKF7c2ARWmJPV646svlLJDtOPigTHZ7NQ/57MjqgO85sQZF2y9mFxS7cBmv5hHLZVyaR0LLuwvGpM0r40BdSpEO4XhG3KJDhRXzdYyEy5AYCKtYPxqB8KJrajoZwcc/WLc0k+VBTf38CmQfGyOZaQWbml43G94OeOCKtuRC6wKaMLkKiXPlgjx6tJnlzeprx1X8r/26aZf1X4D2zienjRgK4yZCQmwIbFmNlAMk3USwSnKCcoPCEXqD3qDlBKQ3oCdowpJVWLPJEeACqPqN/EZmOjOZ2M+TyZ8njaBFcuxvnj8/29970brQ97XEvr0b+7MbYZ7MrHvP6obhMaxJoMc2Av7WksX2t10KZtsO9MDuM0ZmO2xud8uLbQD6xnpJ12y3vdvZ99gmoBPbob7ZTXuxDrTcFNC88QezX1YZ4msDvY8ABwO+DtBt0iW3xb7UXTzrAH1uQ6D+AddSDid0fQsBuvaR3sGqdepVQBem6AcFqvO5eX19/fR/HAzzSOq/xt+kLlLRhWGdmkkBVpqHXQb0LNZGg4SYk5OTdZNb1AwRIcXUuNwZjaIMcW4KJHedpkDGu3jILNoUyJiUD8vPLEUbFW3r86e7Uw2Q5Y6IqxWuXfLl+dpiaCJFpQGd8HtJHTcfsKfGud10qQNu+RnSusuXJGfTcWiCjEUupfv9fjqgTXq0vHjq9HCxjTaCh36L4qSkpp2PfbdrXQY02+ggSbpwH1ZU/Enqd0ZejGrNNrl5RT6BQ/CQuspPalsCvIcSvczS+5eOE2GoWJ3E9rYYgLI4I/j6+PjIKEQ8X8l+CUfjzV9DW6ODeLRIlhBH5utJhRgyEFcphLKoSl1U1U+0Bfkqv6LAk89QnHVgmxybmhLvVeYKHwAbXqbzeAp1KagGliSJV9uiWy8CDXGzL3UUpeCLoyjT2+2xWTPNoszQ70hiOAsfFOJqMEM4umxmhNIU4iscwp017ktUtHFHM2aWUEm8AuCZ3p6qxszKhOKrBORFRsQDiLwkRJDoZCXaiEAbWbjX0WxNOij6QiIaqIOBDIfDrIpeSNsuR/usAQL02dlZE/xcumFR8Wg0kTwu6M/Pz0HhHd7rnmn4giGFpzHKqLhHEFsDtNtBBsRmpajCvoZH+9BG3oibG+BnfaClk3ge+S/i4Vp5XZPJJKUh2vNt0w3v4GcoBIeI6c0C9B+NODoPtFCGRB4oi9lt+XI0bVKWCUDg516v5wWKG96xg5XjgMhAp19zMY1BHxJ5HB0dpdEHmxkG6HPABAhIygWM/L99jX7RPxdoX0dYYWleCLcC79pAC9gsNrkvMVnb8OCiSsY+cbREHbR5enraBD+D7eOxc3L3oE0fAA0YDIRpGpLpDD9rGlxPZOTyMx4e4WQxvXGROBr6eNH2ahZEMaiDg/+AXDIV47BInEBAjbTtNhbTqQu00dqK53la4uk2GvyMZ0t8HgHoDNP8nSF/+KvxCXgwZ9QSrzIozhbkUnXTRhYnjiDb7wj9+lT1quhyVg1sjPNeavkyKBbFy8vL1hz8X11dpSFnzYQ2b5DLgE53p0ZZlUQZm6enp/R3bqCvr68bv9JyZxlxPUBHsEL1UpWug73z0ihKcFmIWAwZcKieo0qzUfU3Ppsc1QgvmRU1MSWKpTqSMHUhzQ7ayi8wqCtyTOx06B4w/c+LB0Yxl2xpqeTugG1mdw69rg4lPYXot2Z/NdJeYvTQ1IqBDWO6e0ARYxOQSBR6lbWw0+fC5FL6d2iRu7BjDMrWipH+Rqd+bHGkcm/7/6bZaBMJnWPb8bbmG85t/2ZRz1U2kKJ8bhdTnqbTNeQ0bartsW0EelW8PnCe8zVmwtyCt3CeZVsG9g+URCM796dvBgAAAABJRU5ErkJggg=='); +} diff --git a/packages/theme/src/hrapprover/index.js b/packages/theme/src/hrapprover/index.js new file mode 100644 index 000000000..74b764a29 --- /dev/null +++ b/packages/theme/src/hrapprover/index.js @@ -0,0 +1,23 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-hrapprover-error-border-color': '#f5222d', + 'tiny-hrapprover-table-text-color': '#333', + 'tiny-hrapprover-table-font-size': '12px', + 'tiny-hrapprover-tr-bg-color': '#fafafa', + 'tiny-hrapprover-tr-hover-bg-color': '#e6f7ff', + 'tiny-hrapprover-tr-odd-bg-color': '#fff', + 'tiny-hrapprover-th-height': '36px', + 'tiny-hrapprover-thead-border-color': '#d9d9d9', + 'tiny-hrapprover-thead-bg-color': '#f1f1f1' +} diff --git a/packages/theme/src/hrapprover/index.less b/packages/theme/src/hrapprover/index.less new file mode 100644 index 000000000..670df39a9 --- /dev/null +++ b/packages/theme/src/hrapprover/index.less @@ -0,0 +1,85 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@hrapprover-prefix-cls: ~'@{css-prefix}hrapprover'; +@input-prefix-cls: ~'@{css-prefix}input'; + +.@{hrapprover-prefix-cls} { + .component-css-vars-hrapprover(); + + & &__list { + height: 180px; + margin-top: 10px; + overflow: auto; + } + + & &__error { + border: solid 1px var(--ti-hrapprover-error-border-color); + } + + table { + tbody { + tr { + color: var(--ti-hrapprover-table-text-color); + background: var(--ti-hrapprover-tr-bg-color); + + &:hover { + background: var(--ti-hrapprover-tr-hover-bg-color); + } + + &:nth-child(odd) { + background: var(--ti-hrapprover-tr-odd-bg-color); + } + } + } + + tr { + display: table-row; + vertical-align: inherit; + border-color: inherit; + } + + th { + border-left: none; + padding: 2px 0 2px 8px; + height: var(--ti-hrapprover-th-height); + } + + td { + padding: 2px 0 2px 8px; + height: var(--ti-hrapprover-th-height); + font-size: var(--ti-hrapprover-table-font-size); + } + + thead { + border-bottom: 1px solid var(--ti-hrapprover-thead-border-color); + text-align: left; + background: var(--ti-hrapprover-thead-bg-color); + color: var(--ti-hrapprover-table-text-color); + + th { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + font-size: var(--ti-hrapprover-table-font-size); + color: var(--ti-hrapprover-table-text-color); + } + } + } + + .@{input-prefix-cls}__suffix .@{input-prefix-cls}__icon { + vertical-align: middle; + } +} diff --git a/packages/theme/src/hrapprover/vars.less b/packages/theme/src/hrapprover/vars.less new file mode 100644 index 000000000..b261aeb74 --- /dev/null +++ b/packages/theme/src/hrapprover/vars.less @@ -0,0 +1,23 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-hrapprover() { + --ti-hrapprover-error-border-color: var(--ti-base-color-bg-8); + --ti-hrapprover-table-text-color: var(--ti-base-color-info-normal); + --ti-hrapprover-table-font-size: var(--ti-common-font-size-base); + --ti-hrapprover-tr-bg-color: #fafafa; + --ti-hrapprover-tr-hover-bg-color: var(--ti-base-color-hover-background); + --ti-hrapprover-tr-odd-bg-color: var(--ti-base-color-light); + --ti-hrapprover-th-height: var(--ti-base-size-height-small); + --ti-hrapprover-thead-border-color: var(--ti-base-color-border); + --ti-hrapprover-thead-bg-color: #f1f1f1; +} diff --git a/packages/theme/src/image-viewer/index.js b/packages/theme/src/image-viewer/index.js new file mode 100644 index 000000000..07eb46d34 --- /dev/null +++ b/packages/theme/src/image-viewer/index.js @@ -0,0 +1,30 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-image-viewer-text-color': '#fff', + 'tiny-image-viewer-close-font-size': '20px', + 'tiny-image-viewer-close-bg-color': '#606266', + 'tiny-image-viewer-actions-border-radius': '22px', + 'tiny-image-viewer-actions-inner-font-size': '23px', + 'tiny-image-viewer-next-font-size': '24px', + 'tiny-image-viewer-mask-wrap-bg-color': '#000', + 'tiny-image-viewer-actions-inner-text-color': '#fff', + 'tiny-image-viewer-close-width': '40px', + 'tiny-image-viewer-close-height': '40px', + 'tiny-image-viewer-close-bg-color-hover': '#606266', + 'tiny-image-viewer-actions-width': '282px', + 'tiny-image-viewer-actions-height': '44px', + 'tiny-image-viewer-next-width': '44px', + 'tiny-image-viewer-next-height': '44px', + 'tiny-image-viewer-mask-bg-color': '#000', +} diff --git a/packages/theme/src/image-viewer/index.less b/packages/theme/src/image-viewer/index.less new file mode 100644 index 000000000..78c84986d --- /dev/null +++ b/packages/theme/src/image-viewer/index.less @@ -0,0 +1,140 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +@image-viewer-prefix-cls: ~'@{css-prefix}image-viewer'; +@image-prefix-cls: ~'@{css-prefix}image'; + +.@{image-prefix-cls}{ + .component-css-vars-image-viewer(); + .@{image-viewer-prefix-cls} { + + &__wrapper { + background: var(--ti-image-viewer-mask-wrap-bg-color); + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + } + + &__btn { + position: absolute; + z-index: 1; + display: flex; + align-items: center; + justify-content: center; + border-radius: 50%; + opacity: var(--ti-image-viewer-btn-opacity); + box-sizing: border-box; + .user-select(none); + + svg { + fill: var(--ti-image-viewer-text-color); + } + } + + &__close { + top: var(--ti-image-viewer-close-top); + right: var(--ti-image-viewer-close-right); + width: var(--ti-image-viewer-close-width); + height: var(--ti-image-viewer-close-height); + font-size: var(--ti-image-viewer-close-font-size); + background-color: var(--ti-image-viewer-close-bg-color); + + &:hover { + cursor: pointer; + background-color: var(--ti-image-viewer-close-bg-color-hover); + } + } + + &__canvas { + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; + } + + &__actions { + left: 50%; + bottom: var(--ti-image-viewer-actions-bottom); + transform: translateX(-50%); + width: var(--ti-image-viewer-actions-width); + height: var(--ti-image-viewer-actions-height); + padding: 0 23px; + background-color: var(--ti-image-viewer-close-bg-color); + border-radius: var(--ti-image-viewer-actions-border-radius); + } + + &__actions-inner { + width: 100%; + height: 100%; + text-align: justify; + cursor: default; + font-size: var(--ti-image-viewer-actions-inner-font-size); + display: flex; + align-items: center; + justify-content: var(--ti-image-viewer-actions-inner-justify-content); + + + svg { + fill: var(--ti-image-viewer-actions-inner-text-color); + margin-right: 20px; + + &:hover { + cursor: pointer; + } + } + } + + &__next, + &__prev { + top: 50%; + width: var(--ti-image-viewer-next-width); + height: var(--ti-image-viewer-next-height); + font-size: var(--ti-image-viewer-next-font-size); + background-color: var(--ti-image-viewer-close-bg-color); + + &:hover { + cursor: pointer; + background-color: var(--ti-image-viewer-close-bg-color-hover); + } + } + + &__prev { + transform: translateY(-50%); + left: 40px; + } + + &__next { + transform: translateY(-50%); + right: 40px; + text-indent: 2px; + } + + &__mask { + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + opacity: 0.5; + background: var(--ti-image-viewer-mask-bg-color); + } + } +} + + diff --git a/packages/theme/src/image-viewer/vars.less b/packages/theme/src/image-viewer/vars.less new file mode 100644 index 000000000..294d54de3 --- /dev/null +++ b/packages/theme/src/image-viewer/vars.less @@ -0,0 +1,35 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-image-viewer() { + --ti-image-viewer-text-color: var(--ti-base-color-light); + --ti-image-viewer-actions-inner-text-color: var(--ti-base-color-light); + --ti-image-viewer-close-font-size: var(--ti-common-font-size-4); + --ti-image-viewer-close-bg-color: #606266; + --ti-image-viewer-close-top: 40px; + --ti-image-viewer-close-right: 40px; + --ti-image-viewer-close-width: 40px; + --ti-image-viewer-close-height: 40px; + --ti-image-viewer-close-bg-color-hover: #606266; + --ti-image-viewer-actions-border-radius: 22px; + --ti-image-viewer-actions-inner-font-size: 23px; + --ti-image-viewer-actions-width: 282px; + --ti-image-viewer-actions-height: 44px; + --ti-image-viewer-actions-bottom: 30px; + --ti-image-viewer-actions-inner-justify-content: space-around; + --ti-image-viewer-next-font-size: var(--ti-common-font-size-5); + --ti-image-viewer-next-width: 44px; + --ti-image-viewer-next-height: 44px; + --ti-image-viewer-mask-wrap-bg-color: none; + --ti-image-viewer-btn-opacity: 0.8; + --ti-image-viewer-mask-bg-color: #000; +} diff --git a/packages/theme/src/image/index.js b/packages/theme/src/image/index.js new file mode 100644 index 000000000..004dfed34 --- /dev/null +++ b/packages/theme/src/image/index.js @@ -0,0 +1,17 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-image-error-font-size': '14px', + 'tiny-image-error-text-color': '#c0c4cc', + 'tiny-image-error-bg-color': '#f5f7fa' +} diff --git a/packages/theme/src/image/index.less b/packages/theme/src/image/index.less new file mode 100644 index 000000000..d9cf5fa56 --- /dev/null +++ b/packages/theme/src/image/index.less @@ -0,0 +1,98 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@image-prefix-cls: ~'@{css-prefix}image'; + +.@{image-prefix-cls} { + .component-css-vars-image(); + + position: relative; + display: inline-block; + overflow: hidden; + + &__inner { + vertical-align: top; + + &-center { + position: relative; + top: 50%; + left: 50%; + -webkit-transform: translate(-50%, -50%); + transform: translate(-50%, -50%); + display: block; + } + } + + &__error { + display: flex; + justify-content: center; + align-items: center; + font-size: var(--ti-image-error-font-size); + color: var(--ti-image-error-text-color); + vertical-align: middle; + } + + &__preview { + cursor: pointer; + } + + &__error, + &__placeholder { + background: var(--ti-image-error-bg-color); + } + + &__error, + &__inner, + &__placeholder { + width: 100%; + height: 100%; + } +} + +.viewer-fade-enter-active { + animation: viewer-fade-in 0.3s; +} + +.viewer-fade-leave-active { + animation: viewer-fade-out 0.3s; +} + +@keyframes viewer-fade-in { + 0% { + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + opacity: 0; + } + + 100% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + opacity: 1; + } +} + +@keyframes viewer-fade-out { + 0% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + opacity: 1; + } + + 100% { + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + opacity: 0; + } +} diff --git a/packages/theme/src/image/vars.less b/packages/theme/src/image/vars.less new file mode 100644 index 000000000..208a09045 --- /dev/null +++ b/packages/theme/src/image/vars.less @@ -0,0 +1,17 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-image() { + --ti-image-error-font-size: var(--ti-common-font-size-1); + --ti-image-error-text-color: #c0c4cc; + --ti-image-error-bg-color: #f5f7fa; +} diff --git a/packages/theme/src/images/credit-amex.png b/packages/theme/src/images/credit-amex.png new file mode 100644 index 000000000..af3277e07 Binary files /dev/null and b/packages/theme/src/images/credit-amex.png differ diff --git a/packages/theme/src/images/credit-background.jpeg b/packages/theme/src/images/credit-background.jpeg new file mode 100644 index 000000000..a2975cd08 Binary files /dev/null and b/packages/theme/src/images/credit-background.jpeg differ diff --git a/packages/theme/src/images/credit-chip.png b/packages/theme/src/images/credit-chip.png new file mode 100644 index 000000000..4f36e9a0e Binary files /dev/null and b/packages/theme/src/images/credit-chip.png differ diff --git a/packages/theme/src/images/credit-dinersclub.png b/packages/theme/src/images/credit-dinersclub.png new file mode 100644 index 000000000..fc2362d68 Binary files /dev/null and b/packages/theme/src/images/credit-dinersclub.png differ diff --git a/packages/theme/src/images/credit-discover.png b/packages/theme/src/images/credit-discover.png new file mode 100644 index 000000000..56413f6ee Binary files /dev/null and b/packages/theme/src/images/credit-discover.png differ diff --git a/packages/theme/src/images/credit-jcb.png b/packages/theme/src/images/credit-jcb.png new file mode 100644 index 000000000..a56c2bb4a Binary files /dev/null and b/packages/theme/src/images/credit-jcb.png differ diff --git a/packages/theme/src/images/credit-mastercard.png b/packages/theme/src/images/credit-mastercard.png new file mode 100644 index 000000000..08391bb76 Binary files /dev/null and b/packages/theme/src/images/credit-mastercard.png differ diff --git a/packages/theme/src/images/credit-troy.png b/packages/theme/src/images/credit-troy.png new file mode 100644 index 000000000..68fe3fb78 Binary files /dev/null and b/packages/theme/src/images/credit-troy.png differ diff --git a/packages/theme/src/images/credit-unionpay.png b/packages/theme/src/images/credit-unionpay.png new file mode 100644 index 000000000..5c13a96fb Binary files /dev/null and b/packages/theme/src/images/credit-unionpay.png differ diff --git a/packages/theme/src/images/credit-visa.png b/packages/theme/src/images/credit-visa.png new file mode 100644 index 000000000..912b8139e Binary files /dev/null and b/packages/theme/src/images/credit-visa.png differ diff --git a/packages/theme/src/images/errortips-bg.png b/packages/theme/src/images/errortips-bg.png new file mode 100644 index 000000000..b56856227 Binary files /dev/null and b/packages/theme/src/images/errortips-bg.png differ diff --git a/packages/theme/src/images/grid-nodata.png b/packages/theme/src/images/grid-nodata.png new file mode 100644 index 000000000..ecbd95291 Binary files /dev/null and b/packages/theme/src/images/grid-nodata.png differ diff --git a/packages/theme/src/images/grid-nodata.svg b/packages/theme/src/images/grid-nodata.svg new file mode 100644 index 000000000..d0131bddf --- /dev/null +++ b/packages/theme/src/images/grid-nodata.svg @@ -0,0 +1,23 @@ + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/images/icon_operation.svg b/packages/theme/src/images/icon_operation.svg new file mode 100644 index 000000000..dcb19cd34 --- /dev/null +++ b/packages/theme/src/images/icon_operation.svg @@ -0,0 +1,12 @@ + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/images/icon_operation_1.svg b/packages/theme/src/images/icon_operation_1.svg new file mode 100644 index 000000000..f08d61967 --- /dev/null +++ b/packages/theme/src/images/icon_operation_1.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/images/icon_operation_2.svg b/packages/theme/src/images/icon_operation_2.svg new file mode 100644 index 000000000..7a4ed29cb --- /dev/null +++ b/packages/theme/src/images/icon_operation_2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/images/icon_operation_3.svg b/packages/theme/src/images/icon_operation_3.svg new file mode 100644 index 000000000..689dffcdf --- /dev/null +++ b/packages/theme/src/images/icon_operation_3.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/images/icon_operation_4.svg b/packages/theme/src/images/icon_operation_4.svg new file mode 100644 index 000000000..106237693 --- /dev/null +++ b/packages/theme/src/images/icon_operation_4.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/images/icon_operation_5.svg b/packages/theme/src/images/icon_operation_5.svg new file mode 100644 index 000000000..07c5cc926 --- /dev/null +++ b/packages/theme/src/images/icon_operation_5.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/images/icon_operation_6.svg b/packages/theme/src/images/icon_operation_6.svg new file mode 100644 index 000000000..ba5bae50b --- /dev/null +++ b/packages/theme/src/images/icon_operation_6.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/images/icon_operation_7.svg b/packages/theme/src/images/icon_operation_7.svg new file mode 100644 index 000000000..624d68614 --- /dev/null +++ b/packages/theme/src/images/icon_operation_7.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/images/icon_operation_8.svg b/packages/theme/src/images/icon_operation_8.svg new file mode 100644 index 000000000..b313fb045 --- /dev/null +++ b/packages/theme/src/images/icon_operation_8.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/images/icon_operation_9.svg b/packages/theme/src/images/icon_operation_9.svg new file mode 100644 index 000000000..2d648e060 --- /dev/null +++ b/packages/theme/src/images/icon_operation_9.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/images/icon_operation_bubble.svg b/packages/theme/src/images/icon_operation_bubble.svg new file mode 100644 index 000000000..a72c97ef4 --- /dev/null +++ b/packages/theme/src/images/icon_operation_bubble.svg @@ -0,0 +1,12 @@ + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/images/loading-64.gif b/packages/theme/src/images/loading-64.gif new file mode 100644 index 000000000..178023b2d Binary files /dev/null and b/packages/theme/src/images/loading-64.gif differ diff --git a/packages/theme/src/index.js b/packages/theme/src/index.js new file mode 100644 index 000000000..44c0c8c55 --- /dev/null +++ b/packages/theme/src/index.js @@ -0,0 +1,16 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import ALL from './vars' +export default { + ...ALL +} diff --git a/packages/theme/src/index.less b/packages/theme/src/index.less new file mode 100644 index 000000000..a6a5ebdd0 --- /dev/null +++ b/packages/theme/src/index.less @@ -0,0 +1,123 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import './base/index.less'; +@import './alert/index.less'; +@import './amount/index.less'; +@import './area/index.less'; +@import './autocomplete/index.less'; +@import './badge/index.less'; +@import './breadcrumb/index.less'; +@import './bulletin-board/index.less'; +@import './button/index.less'; +@import './button-group/index.less'; +@import './calendar/index.less'; +@import './card-layout/index.less'; +@import './card-container/index.less'; +@import './card-template/index.less'; +@import './carousel/index.less'; +@import './carousel-item/index.less'; +@import './cascader/index.less'; +@import './cascader-menu/index.less'; +@import './cascader-node/index.less'; +@import './cascader-panel/index.less'; +@import './chart-core/index.less'; +@import './checkbox/index.less'; +@import './checkbox-button/index.less'; +@import './checkbox-group/index.less'; +@import './collapse/index.less'; +@import './collapse-item/index.less'; +@import './container/index.less'; +@import './credit-card/index.less'; +@import './credit-card-form/index.less'; +@import './crop/index.less'; +@import './dept/index.less'; +@import './detail-page/index.less'; +@import './dialog-box/index.less'; +@import './drop-roles/index.less'; +@import './dropdown/index.less'; +@import './dropdown-item/index.less'; +@import './dropdown-menu/index.less'; +@import './espace/index.less'; +@import './fall-menu/index.less'; +@import './file-upload/index.less'; +@import './floatbar/index.less'; +@import './form/index.less'; +@import './form-item/index.less'; +@import './gantt/index.less'; +@import './grid-system/index.less'; +@import './grid/index.less'; +@import './hrapprover/index.less'; +@import './image/index.less'; +@import './image-viewer/index.less'; +@import './input/index.less'; +@import './ip-address/index.less'; +@import './link/index.less'; +@import './link-menu/index.less'; +@import './loading/index.less'; +@import './logout/index.less'; +@import './menubar/index.less'; +@import './milestone/index.less'; +@import './modal/index.less'; +@import './nav-menu/index.less'; +@import './notify/index.less'; +@import './numeric/index.less'; +@import './option/index.less'; +@import './option-group/index.less'; +@import './pager/index.less'; +@import './pbi/index.less'; +@import './picker/index.less'; +@import './pop-upload/index.less'; +@import './popeditor/index.less'; +@import './poplist/index.less'; +@import './popover/index.less'; +@import './progress/index.less'; +@import './slider/index.less'; +@import './radio/index.less'; +@import './radio-button/index.less'; +@import './radio-group/index.less'; +@import './rate/index.less'; +@import './roles/index.less'; +@import './row/index.less'; +@import './scroll-text/index.less'; +@import './scrollbar/index.less'; +@import './search/index.less'; +@import './select/index.less'; +@import './select-dropdown/index.less'; +@import './slide-bar/index.less'; +@import './slider/index.less'; +@import './split/index.less'; +@import './steps/index.less'; +@import './switch/index.less'; +@import './table/index.less'; +@import './tabs/index.less'; +@import './tag/index.less'; +@import './tall-storage/index.less'; +@import './text-popup/index.less'; +@import './time/index.less'; +@import './tip/index.less'; +@import './toggle-menu/index.less'; +@import './tooltip/index.less'; +@import './top-box/index.less'; +@import './transfer/index.less'; +@import './tree/index.less'; +@import './tree-menu/index.less'; +@import './upload/index.less'; +@import './upload-dragger/index.less'; +@import './upload-list/index.less'; +@import './user/index.less'; +@import './user-account/index.less'; +@import './user-card/index.less'; +@import './user-contact/index.less'; +@import './user-head/index.less'; +@import './user-link/index.less'; +@import './wizard/index.less'; diff --git a/packages/theme/src/input/index.js b/packages/theme/src/input/index.js new file mode 100644 index 000000000..2101c9855 --- /dev/null +++ b/packages/theme/src/input/index.js @@ -0,0 +1,34 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-input-text-color': '#333', + 'tiny-input-bg-color': '#fff', + 'tiny-input-font-size': '12px', + 'tiny-input-height': '30px', + 'tiny-input-border-radius': '2px', + 'tiny-input-border-color': '#d9d9d9', + 'tiny-input-hover-border-color': '#1890ff', + 'tiny-input-active-border-color': '#40a9ff', + 'tiny-input-placeholder-text-color': '#999', + 'tiny-input-disabled-text-color': '#999', + 'tiny-input-disabled-border-color': '#dfe1e6', + 'tiny-input-clear-text-color-hover': '#5e7ce0', + 'tiny-input-medium-height': '42px', + 'tiny-input-small-height': '36px', + 'tiny-input-mini-height': '24px', + 'tiny-input-disabled-bg-color': '#f5f5f5', + 'tiny-input-exceed-text-color': '#f5222d', + 'tiny-input-clear-text-color': '#c0c4cc', + 'tiny-input-icon-font-size': '14px', + 'tiny-input-icon-close-text-color': '#bfbfbf' +} diff --git a/packages/theme/src/input/index.less b/packages/theme/src/input/index.less new file mode 100644 index 000000000..b93ac33d9 --- /dev/null +++ b/packages/theme/src/input/index.less @@ -0,0 +1,416 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/input.less'; +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; +@import '../transition/icon.less'; + +@textarea-prefix-cls: ~'@{css-prefix}textarea'; +@input-prefix-cls: ~'@{css-prefix}input'; +@input-group-prefix-cls: ~'@{css-prefix}input-group'; + +.@{textarea-prefix-cls} { + .component-css-vars-input(); + + position: relative; + display: inline-block; + width: 100%; + vertical-align: bottom; + font-size: var(--ti-input-font-size); + + &.is-disabled &__inner { + background-color: var(--ti-input-disabled-bg-color); + border-color: var(--ti-input-border-color); + color: var(--ti-input-disabled-text-color); + cursor: not-allowed; + .placeholder(@color: var(--ti-input-placeholder-text-color)); + } + + &.is-exceed { + .@{textarea-prefix-cls}__inner { + border-color: var(--ti-input-exceed-text-color); + } + + .@{input-prefix-cls}__count { + color: var(--ti-input-exceed-text-color); + } + } + + .@{input-prefix-cls}__count { + color: #909399; + background: var(--ti-input-bg-color); + font-size: var(--ti-input-font-size); + position: absolute; + bottom: 5px; + right: 16px; + } + + &__inner { + display: block; + width: 100%; + min-height: 60px; + min-height: calc(var(--ti-input-height, 30px) * 2); + color: var(--ti-input-text-color); + border: 1px solid var(--ti-input-border-color); + border-radius: var(--ti-input-border-radius); + background: var(--ti-input-bg-color); + padding: 8px; + line-height: 1.5; + font-size: inherit; + resize: vertical; + box-sizing: border-box; + transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); + .placeholder(@color: var(--ti-input-placeholder-text-color)); + + &:hover { + border-color: var(--ti-input-hover-border-color); + } + &:focus { + border-color: var(--ti-input-active-border-color); + } + + &:hover, + &:focus { + outline: 0; + } + } +} + +.@{input-prefix-cls} { + .component-css-vars-input(); + + position: relative; + font-size: var(--ti-input-font-size); + display: inline-table; + width: 100%; + + &::-webkit-scrollbar { + z-index: 11; + width: 6px; + + &:horizontal { + height: 6px; + } + } + + &::-webkit-scrollbar-thumb { + border-radius: 5px; + width: 6px; + background: #b4bccc; + } + + &::-webkit-scrollbar-corner { + background: #fff; + } + + &::-webkit-scrollbar-track { + background: #fff; + } + + &::-webkit-scrollbar-track-piece { + background: #fff; + width: 6px; + } + + &.is-exceed &__suffix &__count { + color: var(--ti-input-exceed-text-color); + } + + &.is-disabled &__inner { + cursor: not-allowed; + border: 1px solid var(--ti-input-disabled-border-color); + color: var(--ti-input-disabled-text-color); + background: var(--ti-input-disabled-bg-color); + .placeholder(@color: #999); + } + + &.is-disabled &__icon { + cursor: not-allowed; + + &.@{css-prefix}svg { + &, + &:hover { + fill: var(--ti-input-disabled-text-color); + } + } + } + + &.is-disabled &__prefix, + &.is-disabled &__suffix { + .@{css-prefix}svg { + &, + &:hover { + fill: var(--ti-input-disabled-text-color); + } + } + } + + &.is-exceed &__inner { + border-color: var(--ti-input-exceed-text-color); + } + + & &__clear { + font-size: var(--ti-input-icon-font-size); + cursor: pointer; + transition: color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); + + &, + &:hover { + fill: var(--ti-input-icon-close-text-color); + } + } + + & &__count { + height: 100%; + display: inline-flex; + align-items: center; + color: #909399; + font-size: var(--ti-input-font-size); + + .@{input-prefix-cls}__count-inner { + background: var(--ti-input-bg-color); + line-height: initial; + display: inline-block; + } + } + + &__inner { + width: 100%; + border: 1px solid var(--ti-input-border-color); + border-radius: var(--ti-input-border-radius); + color: var(--ti-input-text-color); + background: var(--ti-input-bg-color); + font-size: inherit; + height: var(--ti-input-height); + line-height: var(--ti-input-height); + padding: 0 8px; + outline: 0; + display: inline-block; + box-sizing: border-box; + appearance: none; + transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); + .placeholder(@color: var(--ti-input-placeholder-text-color)); + + &:hover, + &:focus, + &:active { + outline: 0; + border-color: var(--ti-input-hover-border-color); + } + + &::-ms-clear { + display: none; + width: 0; + height: 0; + } + } + + &__prefix, + &__suffix { + position: absolute; + top: 50%; + transform: translateY(-50%); + transition: all 0.3s; + text-align: center; + color: var(--ti-input-border-color); + display: flex; + align-items: center; + } + + &.is-active &__inner, + &__inner:focus { + border-color: var(--ti-input-active-border-color); + outline: 0; + } + + &__suffix { + right: 8px; + transition: all 0.3s; + pointer-events: none; + + &:hover { + cursor: pointer; + } + } + + &__suffix-inner { + pointer-events: all; + font-size: var(--ti-common-font-size-1); + display: flex; + justify-content: flex-start; + align-items: center; + } + + &__prefix { + left: 8px; + transition: all 0.3s; + font-size: var(--ti-input-icon-font-size); + & > div { + display: flex; + } + } + + &__icon { + height: 100%; + line-height: var(--ti-input-height); + text-align: center; + transition: all 0.3s; + font-size: var(--ti-input-icon-font-size); + fill: var(--ti-input-hover-border-color); + + &:hover { + fill: var(--ti-input-active-border-color); + } + + &:after { + content: ''; + height: 100%; + width: 0; + display: inline-block; + vertical-align: middle; + } + + .svg-operationfaild { + &, + &:hover { + fill: var(--ti-input-icon-close-text-color); + } + } + } + + &__validateIcon { + pointer-events: none; + } + + &-suffix &__inner { + padding-right: 30px; + padding-left: 8px; + } + + &-prefix &__inner { + padding-left: 30px; + padding-right: 28px; + } + + &-medium { + .input-size(var(--ti-input-medium-height)); + } + + &-small { + .input-size(var(--ti-input-small-height)); + } + + &-mini { + .input-size(var(--ti-input-mini-height)); + } +} + +.@{input-group-prefix-cls} { + .component-css-vars-input(); + + line-height: normal; + display: inline-table; + width: 100%; + border-collapse: separate; + border-spacing: 0; + + > .@{input-prefix-cls}__inner { + vertical-align: middle; + display: table-cell; + } + + &__append, + &__prepend { + background-color: var(--ti-input-disabled-bg-color); + color: var(--ti-input-placeholder-text-color); + border: 1px solid var(--ti-input-border-color); + border-radius: var(--ti-input-border-radius); + padding: 0 20px; + width: 1px; + vertical-align: middle; + display: table-cell; + position: relative; + white-space: nowrap; + + &:focus { + outline: 0; + } + + .@{css-prefix}button, + .@{css-prefix}select { + display: inline-block; + margin: -10px -20px; + } + + .@{css-prefix}button, + .@{css-prefix}input { + font-size: inherit; + } + + button.@{css-prefix}button, + div.@{css-prefix}select .@{input-prefix-cls}__inner, + div.@{css-prefix}select:hover .@{input-prefix-cls}__inner { + border-color: transparent; + background-color: transparent; + color: inherit; + border-top: 0; + border-bottom: 0; + } + + .@{css-prefix}select .@{css-prefix}input.is-focus .@{input-prefix-cls}__inner { + border-color: transparent; + } + } + + &-prepend .@{input-prefix-cls}__inner, + &__append { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + } + + &-append .@{input-prefix-cls}__suffix { + top: calc(50% - 7px); + } + + &-append .@{input-prefix-cls}__inner, + &__prepend { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } + + &__prepend { + border-right: 0; + } + + &__append { + border-left: 0; + } +} + +.@{css-prefix-iconfont}-loading { + font-size: var(--ti-common-font-size-1); + line-height: 1; + vertical-align: text-top; + animation: rotating 2s linear infinite; +} + +@keyframes rotating { + 0% { + transform: rotateZ(0deg); + } + + 100% { + transform: rotateZ(360deg); + } +} diff --git a/packages/theme/src/input/vars.less b/packages/theme/src/input/vars.less new file mode 100644 index 000000000..77858ac76 --- /dev/null +++ b/packages/theme/src/input/vars.less @@ -0,0 +1,34 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-input() { + --ti-input-text-color: var(--ti-base-color-info-normal); + --ti-input-bg-color: var(--ti-base-color-light); + --ti-input-font-size: var(--ti-common-font-size-base); + --ti-input-height: var(--ti-base-size-height-normal); + --ti-input-border-radius: var(--ti-common-border-radius-normal); + --ti-input-border-color: var(--ti-base-color-border); + --ti-input-hover-border-color: var(--ti-base-color-border-hover); + --ti-input-active-border-color: var(--ti-base-color-brand-5); + --ti-input-placeholder-text-color: var(--ti-base-color-placeholder); + --ti-input-disabled-text-color: var(--ti-base-color-placeholder); + --ti-input-medium-height: var(--ti-base-size-height-medium); + --ti-input-small-height: var(--ti-base-size-height-small); + --ti-input-mini-height: var(--ti-base-size-height-mini); + --ti-input-disabled-bg-color: var(--ti-common-color-bg-disabled); + --ti-input-disabled-border-color: var(--ti-common-color-line-disabled); + --ti-input-exceed-text-color: var(--ti-base-color-bg-8); + --ti-input-clear-text-color: #c0c4cc; + --ti-input-icon-font-size: var(--ti-common-font-size-1); + --ti-input-icon-close-text-color: #bfbfbf; + --ti-input-clear-text-color-hover: var(--ti-base-color-brand-6); +} diff --git a/packages/theme/src/ip-address/index.js b/packages/theme/src/ip-address/index.js new file mode 100644 index 000000000..82a8e5bce --- /dev/null +++ b/packages/theme/src/ip-address/index.js @@ -0,0 +1,25 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-ip-address-normal-height': '30px', + 'tiny-ip-address-normal-text-color': '#333', + 'tiny-ip-address-icon-color': '#333', + 'tiny-ip-address-normal-disabled-text-color': '#999', + 'tiny-ip-address-normal-border-color': '#d9d9d9', + 'tiny-ip-address-normal-bg-color': '#fff', + 'tiny-ip-address-border-radius': '2px', + 'tiny-ip-address-font-size': '12px', + 'tiny-ip-address-border-color-hover': '#1890ff', + 'tiny-ip-address-disabled-bg-color': '#f5f5f5', + 'tiny-ip-address-disabled-border-color': '#dfe1e6' +} diff --git a/packages/theme/src/ip-address/index.less b/packages/theme/src/ip-address/index.less new file mode 100644 index 000000000..23cab6ee7 --- /dev/null +++ b/packages/theme/src/ip-address/index.less @@ -0,0 +1,135 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/input.less'; +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +@ip-address-prefix-cls: ~'@{css-prefix}ip-address'; + +.@{ip-address-prefix-cls} { + .component-css-vars-ip-address(); + + width: 270px; + max-width: 100%; + outline: 0; + display: inline-table; + text-align: left; + box-sizing: border-box; + + &__input { + position: relative; + padding: 0; + width: 100%; + height: var(--ti-ip-address-normal-height); + border: 1px solid var(--ti-ip-address-normal-border-color); + color: var(--ti-ip-address-normal-text-color); + border-radius: var(--ti-ip-address-border-radius); + background: var(--ti-ip-address-normal-bg-color); + font-size: var(--ti-ip-address-font-size); + padding: 0 8px; + display: block; + white-space: nowrap; + background-image: none; + .user-select(auto); + transition: border 0.3s; + outline: 0; + box-sizing: border-box; + .input-readonly(@color: var(--ti-ip-address-border-color-hover)); + .placeholder( + @color: var(--ti-ip-address-normal-disabled-text-color) + ); //placeholder属性兼容处理 + &:hover { + border: 1px solid var(--ti-ip-address-border-color-hover); + color: var(--ti-ip-address-normal-text-color); + .placeholder( + @color: var(--ti-ip-address-normal-disabled-text-color) + ); + } + &:focus, + &:active, + &.active, + &[active] { + border: 1px solid var(--ti-ip-address-border-color-hover); + color: var(--ti-ip-address-normal-text-color); + } + &:focus { + .placeholder(@color: #d9d9d9); + } + &.disabled, + &[disabled] { + cursor: not-allowed; + pointer-events: none; + border: 1px solid var(--ti-ip-address-disabled-border-color); + color: var(--ti-ip-address-normal-disabled-text-color); + background: var(--ti-ip-address-disabled-bg-color); + box-shadow: none; + .@{css-prefix}svg { + fill: var(--ti-ip-address-normal-disabled-text-color); + } + } + + li { + float: left; + overflow: hidden; + width: 25%; + display: inline-flex; + align-items: center; + > input { + border: none; + text-align: center; + outline: none; + background: none; + color: var(--ti-ip-address-normal-text-color); + width: ~'calc(100% - 12px)'; + float: left; + height: calc(var(--ti-ip-address-normal-height) - 2px); + line-height: calc(var(--ti-ip-address-normal-height) - 2px); + padding: 0; + &:focus, + &:active, + &.active, + &[active] { + color: var(--ti-ip-address-normal-text-color); + } + &:hover { + color: var(--ti-ip-address-normal-text-color); + } + &.disabled, + &[disabled] { + color: var(--ti-ip-address-normal-disabled-text-color); + } + } + svg { + vertical-align: middle; + fill: var(--ti-ip-address-icon-color); + } + &:last-child { + > svg { + display: none; + } + > input { + width: 100%; + } + } + &:only-child { + width: 100%; + > input { + width: 100%; + text-align: left; + padding: 0 8px; + } + } + } + } +} diff --git a/packages/theme/src/ip-address/vars.less b/packages/theme/src/ip-address/vars.less new file mode 100644 index 000000000..15dbef053 --- /dev/null +++ b/packages/theme/src/ip-address/vars.less @@ -0,0 +1,25 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-ip-address() { + --ti-ip-address-normal-height: var(--ti-base-size-height-normal); + --ti-ip-address-normal-text-color: var(--ti-base-color-info-normal); + --ti-ip-address-icon-color: var(--ti-base-color-info-normal); + --ti-ip-address-normal-disabled-text-color: var(--ti-base-color-placeholder); + --ti-ip-address-normal-border-color: var(--ti-base-color-border); + --ti-ip-address-normal-bg-color: var(--ti-base-color-light); + --ti-ip-address-border-radius: var(--ti-common-border-radius-normal); + --ti-ip-address-font-size: var(--ti-common-font-size-base); + --ti-ip-address-border-color-hover: var(--ti-base-color-brand-6); + --ti-ip-address-disabled-bg-color: var(--ti-common-color-bg-disabled); + --ti-ip-address-disabled-border-color: var(--ti-common-color-line-disabled); +} diff --git a/packages/theme/src/layout/index.js b/packages/theme/src/layout/index.js new file mode 100644 index 000000000..9402e56d3 --- /dev/null +++ b/packages/theme/src/layout/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // layout +} diff --git a/packages/theme/src/layout/index.less b/packages/theme/src/layout/index.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/layout/index.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/link-menu/index.js b/packages/theme/src/link-menu/index.js new file mode 100644 index 000000000..cfc691176 --- /dev/null +++ b/packages/theme/src/link-menu/index.js @@ -0,0 +1,24 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-link-menu-nav-item-text-color': '#1890ff', + 'tiny-link-menu-nav-item-border-color': '#c4c4c4', + 'tiny-link-menu-btn-text-color': 'rgba(24, 144, 255, 0.8)', + 'tiny-link-menu-btn-bg-color': '#fff', + 'tiny-link-menu-input-height': '30px', + 'tiny-link-menu-input-font-size': '12px', + 'tiny-link-menu-input-text-color': '#333', + 'tiny-link-menu-input-border-color': '#d9d9d9', + 'tiny-link-menu-input-border-radius': '2px', + 'tiny-link-menu-tree-node-text-color': '#bfbfbf' +} diff --git a/packages/theme/src/link-menu/index.less b/packages/theme/src/link-menu/index.less new file mode 100644 index 000000000..a190a67bd --- /dev/null +++ b/packages/theme/src/link-menu/index.less @@ -0,0 +1,188 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +@link-menu-prefix-cls: ~'@{css-prefix}link-menu'; +@input-prefix-cls: ~'@{css-prefix}input'; +@button-prefix-cls: ~'@{css-prefix}button'; +@tree-prefix-cls: ~'@{css-prefix}tree'; +@tree-node-prefix-cls: ~'@{css-prefix}tree-node'; +@checkbox-prefix-cls: ~'@{css-prefix}checkbox'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{link-menu-prefix-cls} { + .component-css-vars-link-menu(); + + &__nav &__nav-item { + color: var(--ti-link-menu-nav-item-text-color); + font-size: var(--ti-common-font-size-1); + border-right: 1px solid var(--ti-link-menu-nav-item-border-color); + padding: 0 8px; + line-height: 1; + display: inline-block; + background: 0; + white-space: nowrap; + text-decoration: none; + outline: 0; + text-align: center; + cursor: pointer; + + .@{svg-prefix-cls} { + fill: var(--ti-link-menu-nav-item-text-color); + margin-right: 4px; + } + + span { + line-height: 1; + vertical-align: middle; + } + } + + &__nav &__btn { + color: var(--ti-link-menu-btn-text-color); + background: var(--ti-link-menu-btn-bg-color); + padding: 0 8px; + line-height: 1; + outline: 0; + text-align: center; + border: none; + cursor: pointer; + + .@{svg-prefix-cls} { + fill: var(--ti-link-menu-nav-item-text-color); + font-size: var(--ti-common-font-size-3); + } + } + + &__dialog-btn { + text-align: center; + } + + .@{input-prefix-cls} { + width: 270px; + margin-bottom: 5px; + + .@{input-prefix-cls}__inner { + height: var(--ti-link-menu-input-height); + line-height: var(--ti-link-menu-input-height); + font-size: var(--ti-link-menu-input-font-size); + color: var(--ti-link-menu-input-text-color); + background: var(--ti-link-menu-btn-bg-color); + border: 1px solid var(--ti-link-menu-input-border-color); + border-radius: var(--ti-link-menu-input-border-radius); + padding: 0 8px; + display: block; + white-space: nowrap; + user-select: auto; + transition: border 0.3s; + outline: 0; + box-sizing: border-box; + } + } + + .@{button-prefix-cls} { + &:last-child { + color: var(--ti-link-menu-nav-item-text-color); + background-color: var(--ti-link-menu-btn-bg-color); + border-color: var(--ti-link-menu-input-border-color); + } + } + + .@{tree-prefix-cls} { + .@{tree-node-prefix-cls} { + .@{checkbox-prefix-cls} { + transform: translateY(1px); + } + + .tree-node-body { + display: block; + text-decoration: none; + + & > .@{svg-prefix-cls} { + margin-left: 4px; + } + } + + .tree-node-name { + color: var(--ti-link-menu-tree-node-text-color); + font-size: var(--ti-link-menu-input-font-size); + border-radius: var(--ti-link-menu-input-border-radius); + padding-left: 4px; + font-weight: 700; + vertical-align: middle; + } + + &.is-focusable { + .tree-node-name { + color: var(--ti-link-menu-input-text-color); + } + } + } + + &.@{link-menu-prefix-cls}__overflow { + .tree-node { + width: calc(100% - 36px); + } + + .tree-node-name { + width: 100%; + display: inline-block; + .text-overflow(); + } + } + + &.@{link-menu-prefix-cls}__wrap { + .@{tree-node-prefix-cls}__content { + height: auto; + padding: 2px 0; + display: flex; + justify-content: flex-start; + align-items: center; + + .@{tree-node-prefix-cls}__expand-icon { + transform: translateY(-3px); + + &.expanded { + transform: translateY(-3px) rotate(90deg); + } + } + + .tree-node { + width: 100%; + } + } + + .tree-node-body { + display: flex; + justify-content: flex-start; + align-items: flex-start; + text-decoration: none; + + .@{svg-prefix-cls} { + flex-shrink: 0; + transform: translateY(2px); + } + } + + .tree-node-name { + display: inline-block; + white-space: normal; + line-height: normal; + word-break: break-word; + transform: translateY(-2px); + } + } + } +} diff --git a/packages/theme/src/link-menu/vars.less b/packages/theme/src/link-menu/vars.less new file mode 100644 index 000000000..c670d6da8 --- /dev/null +++ b/packages/theme/src/link-menu/vars.less @@ -0,0 +1,24 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-link-menu() { + --ti-link-menu-nav-item-text-color: var(--ti-base-color-brand-6); + --ti-link-menu-nav-item-border-color: #c4c4c4; + --ti-link-menu-btn-text-color: rgba(24, 144, 255, 0.8); + --ti-link-menu-btn-bg-color: var(--ti-base-color-light); + --ti-link-menu-input-height: var(--ti-base-size-height-normal); + --ti-link-menu-input-font-size: var(--ti-common-font-size-base); + --ti-link-menu-input-text-color: var(--ti-base-color-info-normal); + --ti-link-menu-input-border-color: var(--ti-base-color-border); + --ti-link-menu-input-border-radius: var(--ti-common-border-radius-normal); + --ti-link-menu-tree-node-text-color: var(--ti-common-color-text-disabled); +} diff --git a/packages/theme/src/link/index.js b/packages/theme/src/link/index.js new file mode 100644 index 000000000..9cce020ed --- /dev/null +++ b/packages/theme/src/link/index.js @@ -0,0 +1,41 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-link-font-size': '14px', + 'tiny-link-font-weight': '500', + 'tiny-link-border-color': '#1890ff', + 'tiny-link-default-text-color': '#606266', + 'tiny-link-default-border-color': '#1890ff', + 'tiny-link-default-hover-text-color': '#40a9ff', + 'tiny-link-default-disabled-text-color': '#c0c4cc', + 'tiny-link-primary-text-color': '#1890ff', + 'tiny-link-primary-border-color': '#1890ff', + 'tiny-link-primary-hover-text-color': '#40a9ff', + 'tiny-link-primary-disabled-text-color': '#a0cfff', + 'tiny-link-danger-text-color': '#f5222d', + 'tiny-link-danger-border-color': '#f5222d', + 'tiny-link-danger-hover-text-color': '#ff4d4f', + 'tiny-link-danger-disabled-text-color': '#d8bab5', + 'tiny-link-success-text-color': '#52c41a', + 'tiny-link-success-border-color': '#52c41a', + 'tiny-link-success-hover-text-color': '#73d13d', + 'tiny-link-success-disabled-text-color': '#a6c3b9', + 'tiny-link-warning-text-color': '#faad14', + 'tiny-link-warning-border-color': '#faad14', + 'tiny-link-warning-hover-text-color': '#ffc53d', + 'tiny-link-warning-disabled-text-color': '#d3c6a2', + 'tiny-link-info-text-color': '#333333', + 'tiny-link-info-border-color': '#333333', + 'tiny-link-info-hover-text-color': '#54657e', + 'tiny-link-info-disabled-text-color': '#bfbfbf' +} diff --git a/packages/theme/src/link/index.less b/packages/theme/src/link/index.less new file mode 100644 index 000000000..0c990a6c5 --- /dev/null +++ b/packages/theme/src/link/index.less @@ -0,0 +1,102 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/link.less'; +@import '../custom.less'; +@import './vars.less'; + +@link-prefix-cls: ~'@{css-prefix}link'; + +.@{link-prefix-cls} { + .component-css-vars-link(); + + display: inline-flex; + flex-direction: row; + align-items: center; + justify-content: center; + vertical-align: middle; + position: relative; + text-decoration: none; + outline: 0; + cursor: pointer; + padding: 0; + font-size: var(--ti-link-font-size); + font-weight: var(--ti-link-font-weight); + + &.is-underline:hover:after { + content: ''; + position: absolute; + left: 0; + right: 0; + height: 0; + bottom: 0; + border-bottom: 1px solid var(--ti-link-border-color); + } + + &.is-disabled { + cursor: not-allowed; + } + + &&--default { + .link-type( + var(--ti-link-default-text-color), + var(--ti-link-default-border-color), + var(--ti-link-default-hover-text-color), + var(--ti-link-default-disabled-text-color) + ); + } + + &&--primary { + .link-type( + var(--ti-link-primary-text-color), + var(--ti-link-primary-border-color), + var(--ti-link-primary-hover-text-color), + var(--ti-link-primary-disabled-text-color) + ); + } + + &&--danger { + .link-type( + var(--ti-link-danger-text-color), + var(--ti-link-danger-border-color), + var(--ti-link-danger-hover-text-color), + var(--ti-link-danger-disabled-text-color) + ); + } + + &&--success { + .link-type( + var(--ti-link-success-text-color), + var(--ti-link-success-border-color), + var(--ti-link-success-hover-text-color), + var(--ti-link-success-disabled-text-color) + ); + } + + &&--warning { + .link-type( + var(--ti-link-warning-text-color), + var(--ti-link-warning-border-color), + var(--ti-link-warning-hover-text-color), + var(--ti-link-warning-disabled-text-color) + ); + } + + &&--info { + .link-type( + var(--ti-link-info-text-color), + var(--ti-link-info-border-color), + var(--ti-link-info-hover-text-color), + var(--ti-link-info-disabled-text-color) + ); + } +} diff --git a/packages/theme/src/link/vars.less b/packages/theme/src/link/vars.less new file mode 100644 index 000000000..3a4473ecc --- /dev/null +++ b/packages/theme/src/link/vars.less @@ -0,0 +1,47 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-link() { + --ti-link-font-size: var(--ti-common-font-size-1); + --ti-link-font-weight: var(--ti-common-font-weight-5); + --ti-link-border-color: var(--ti-base-color-brand-6); + + --ti-link-default-text-color: #606266; + --ti-link-default-border-color: var(--ti-base-color-brand-6); + --ti-link-default-hover-text-color: var(--ti-base-color-brand-7); + --ti-link-default-disabled-text-color: #c0c4cc; + + --ti-link-primary-text-color: var(--ti-base-color-brand-6); + --ti-link-primary-border-color: var(--ti-base-color-brand-6); + --ti-link-primary-hover-text-color: var(--ti-base-color-brand-5); + --ti-link-primary-disabled-text-color: var(--ti-base-color-primary-disabled, #a0cfff); + + --ti-link-danger-text-color: var(--ti-base-color-bg-8); + --ti-link-danger-border-color: var(--ti-base-color-bg-8); + --ti-link-danger-hover-text-color: var(--ti-base-color-bg-7); + --ti-link-danger-disabled-text-color: var(--ti-base-color-danger-disabled, #d8bab5); + + --ti-link-success-text-color: var(--ti-base-color-success-normal); + --ti-link-success-border-color: var(--ti-base-color-success-normal); + --ti-link-success-hover-text-color: var(--ti-base-color-success-hover); + --ti-link-success-disabled-text-color: var(--ti-base-color-success-disabled, #a6c3b9); + + --ti-link-warning-text-color: var(--ti-base-color-warning-normal); + --ti-link-warning-border-color: var(--ti-base-color-warning-normal); + --ti-link-warning-hover-text-color: var(--ti-base-color-warning-hover); + --ti-link-warning-disabled-text-color: var(--ti-base-color-warning-disabled, #d3c6a2); + + --ti-link-info-text-color: var(--ti-base-color-info-normal); + --ti-link-info-border-color: var(--ti-base-color-info-normal); + --ti-link-info-hover-text-color: var(--ti-base-color-info-hover); + --ti-link-info-disabled-text-color: var(--ti-base-color-info-disabled, #bfbfbf); +} diff --git a/packages/theme/src/loading/index.js b/packages/theme/src/loading/index.js new file mode 100644 index 000000000..ef4ffe5fc --- /dev/null +++ b/packages/theme/src/loading/index.js @@ -0,0 +1,21 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-loading-text-color': '#1890ff', + 'tiny-loading-mask-bg-color': 'rgba(255, 255, 255, 0.9)', + 'tiny-loading-text-font-size': '14px', + 'tiny-loading-spinner-height': '42px', + 'tiny-loading-spinner-width': '42px', + 'tiny-loading-fullscreen-height': '50px', + 'tiny-loading-fullscreen-width': '50px' +} diff --git a/packages/theme/src/loading/index.less b/packages/theme/src/loading/index.less new file mode 100644 index 000000000..d0c2a6164 --- /dev/null +++ b/packages/theme/src/loading/index.less @@ -0,0 +1,131 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@loading-prefix-cls: ~'@{css-prefix}loading'; + +.@{loading-prefix-cls} { + .component-css-vars-loading(); + + &__mask { + position: absolute; + z-index: 2000; + background-color: var(--ti-loading-mask-bg-color); + margin: 0; + top: 0; + right: 0; + bottom: 0; + left: 0; + transition: opacity 0.3s; + + &.is-fullscreen { + position: fixed; + + .@{loading-prefix-cls}__spinner { + margin-top: -25px; + + .circular { + height: var(--ti-loading-fullscreen-height); + width: var(--ti-loading-fullscreen-width); + } + } + } + } + + &__spinner { + top: 50%; + margin-top: -21px; + width: 100%; + text-align: center; + position: absolute; + + .@{loading-prefix-cls}__text { + color: var(--ti-loading-text-color); + margin: 3px 0; + font-size: var(--ti-loading-text-font-size); + } + + .circular { + height: var(--ti-loading-spinner-height); + width: var(--ti-loading-spinner-width); + animation: loading-rotate 2s linear infinite; + } + + .path { + animation: loading-dash 1.5s ease-in-out infinite; + stroke-dasharray: 90, 150; + stroke-dashoffset: 0; + stroke-width: 2; + stroke: var(--ti-loading-text-color); + stroke-linecap: round; + } + + svg { + fill: var(--ti-loading-text-color); + } + } + + &__parent-relative { + position: relative !important; + } + + &__parent-hidden { + overflow: hidden !important; + } + + &-fade-enter, + &-fade-leave-active { + opacity: 0; + } +} + +@keyframes loading-rotate { + 100% { + transform: rotate(360deg); + } +} + +@keyframes loading-dash { + 0% { + stroke-dasharray: 1, 200; + stroke-dashoffset: 0; + } + + 50% { + stroke-dasharray: 90, 150; + stroke-dashoffset: -40px; + } + + 100% { + stroke-dasharray: 90, 150; + stroke-dashoffset: -120px; + } +} + +.@{css-prefix-iconfont}-loading { + font-size: var(--ti-common-font-size-1); + line-height: 1; + vertical-align: text-top; + animation: rotating 2s linear infinite; +} + +@keyframes rotating { + 0% { + transform: rotateZ(0deg); + } + + 100% { + transform: rotateZ(360deg); + } +} diff --git a/packages/theme/src/loading/vars.less b/packages/theme/src/loading/vars.less new file mode 100644 index 000000000..be2b6270e --- /dev/null +++ b/packages/theme/src/loading/vars.less @@ -0,0 +1,21 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-loading() { + --ti-loading-text-color: var(--ti-base-color-brand-6); + --ti-loading-mask-bg-color: rgba(255, 255, 255, 0.9); + --ti-loading-text-font-size: var(--ti-common-font-size-1); + --ti-loading-spinner-height: 42px; + --ti-loading-spinner-width: 42px; + --ti-loading-fullscreen-height: 50px; + --ti-loading-fullscreen-width: 50px; +} diff --git a/packages/theme/src/locales/index.js b/packages/theme/src/locales/index.js new file mode 100644 index 000000000..2e6fc9f92 --- /dev/null +++ b/packages/theme/src/locales/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // locales +} diff --git a/packages/theme/src/locales/index.less b/packages/theme/src/locales/index.less new file mode 100644 index 000000000..30d9ecd2f --- /dev/null +++ b/packages/theme/src/locales/index.less @@ -0,0 +1,46 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@locales-prefix-cls: ~'@{css-prefix}locales'; +@popover-prefix-cls: ~'@{css-prefix}popover'; +@popper-prefix-cls: ~'@{css-prefix}popper'; + +.@{locales-prefix-cls} { + cursor: pointer; + + svg { + margin-left: 2px; + } + + &__popper { + &.@{popover-prefix-cls}.@{popper-prefix-cls} { + padding: 0; + } + + .poplist { + width: 100px; + + li { + list-style: none; + cursor: pointer; + padding: 0 8px; + line-height: 30px; + + &.selected { + background: #f5f5f5; + } + } + } + } +} diff --git a/packages/theme/src/logon-user/index.js b/packages/theme/src/logon-user/index.js new file mode 100644 index 000000000..920b26fab --- /dev/null +++ b/packages/theme/src/logon-user/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // logon-user +} diff --git a/packages/theme/src/logon-user/index.less b/packages/theme/src/logon-user/index.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/logon-user/index.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/logout/index.js b/packages/theme/src/logout/index.js new file mode 100644 index 000000000..f8e6d2234 --- /dev/null +++ b/packages/theme/src/logout/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // logout +} diff --git a/packages/theme/src/logout/index.less b/packages/theme/src/logout/index.less new file mode 100644 index 000000000..d32ff0d6d --- /dev/null +++ b/packages/theme/src/logout/index.less @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@logout-prefix-cls: ~'@{css-prefix}logout'; + +.@{logout-prefix-cls} { + cursor: pointer; + display: inline; +} diff --git a/packages/theme/src/logout/vars.less b/packages/theme/src/logout/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/logout/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/menubar/index.js b/packages/theme/src/menubar/index.js new file mode 100644 index 000000000..47fccbea4 --- /dev/null +++ b/packages/theme/src/menubar/index.js @@ -0,0 +1,28 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-menubar-title-font-size': '1em', + 'tiny-menubar-title-text-color': '#fff', + 'tiny-menubar-li-height': '48px', + 'tiny-menubar-menu-height': '42px', + 'tiny-menubar-menu-font-size': '14px', + 'tiny-menubar-submenu-normal-text-color': '#333', + 'tiny-menubar-submenu-hover-bg-color': '#e6f7ff', + 'tiny-menubar-submenu-active-bg-color': '#f5f5f5', + 'tiny-menubar-submenu-li-height': '40px', + 'tiny-menubar-bg-color-normal': '#2e3243', + 'tiny-menubar-bg-color-active': '#474c5e', + 'tiny-menubar-dropdown-border-color': '#c9ccda', + 'tiny-menubar-dropdown-hover-border-color': '#585f7f', + 'tiny-menubar-dropdown-hover-bg-color': '#191b25' +} diff --git a/packages/theme/src/menubar/index.less b/packages/theme/src/menubar/index.less new file mode 100644 index 000000000..39964bc57 --- /dev/null +++ b/packages/theme/src/menubar/index.less @@ -0,0 +1,490 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +.@{css-prefix}menu.menu-hor { + .component-css-vars-menubar(); + + margin-bottom: 0; + min-height: 30px; // 无数据时也显示蓝条 + min-width: 300px; // 给菜单定义最小宽度,使之缩放有下拉箭头时候不会掉下来 + font-size: var(--ti-menubar-menu-font-size, 14px); + + > ul { + > li { + display: inline-block; + margin-left: -4px; + position: relative; + text-align: center; + padding: 0; + margin: 0; + + > a { + display: block; + padding: 0 10px; + min-width: 120px; + margin-right: -1px; + color: var(--ti-menubar-title-text-color); + font-size: var(--ti-common-font-size-2); + + span.menu-icon { + margin-right: 8px; + top: -2px; + } + } + + .submenu { + > li { + > a { + color: var(--ti-menubar-submenu-normal-text-color); + + &:hover, + &:focus { + background: var(--ti-menubar-submenu-hover-bg-color); + } + + &.active, + &:active { + background: var(--ti-menubar-submenu-active-bg-color); + } + } + + > span { + &.icon-starActive { + left: 8px; + } + + &.icon-transpond { + right: 8px; + } + } + } + } + + &.node-selected, + &:hover { + > a { + border-right: 0; + } + } + + &:last-child { + > a { + border-right: 0; + } + } + } + + li { + padding: 0; + height: var(--ti-menubar-li-height); + line-height: var(--ti-menubar-li-height); + position: relative; + + > a { + min-width: 60px; + width: 100%; + height: 100%; + color: var(--ti-menubar-title-text-color); + + &:hover, + &:focus, + &:active { + color: var(--ti-menubar-title-text-color); + text-decoration: none; + background: var(--ti-menubar-bg-color-active); + } + } + } + } + + ul { + padding: 0; + margin: 0; + background: var(--ti-menubar-bg-color-normal); + } + + // 设置此样式可使子菜单向左飘 + .menus-left, + .menus-left .submenu { + left: auto; + right: 100%; + } + + // 居顶导航菜单--垂直下拉 + .node-selected { + > .submenu { + left: auto; + margin-top: 2px; + + > li { + &.node-selected { + background: var(--ti-menubar-bg-color-active); + + a { + color: var(--ti-menubar-submenu-normal-text-color); + + &:hover { + color: #1890ff; + background: #fff; + } + } + } + + .submenu { + margin-top: -40px; + margin-left: 2px; + } + } + + .node-selected > .submenu { + left: 100%; + } + } + + .submenu { + background: #fff; + border: 1px solid #d9d9d9; + box-shadow: 0 0 4px rgba(0, 0, 0, 0.15); + } + } + + // 居顶导航菜单--多种类下拉 + .menu-dropdown { + margin-top: 0; + + .menu-group { + padding: 0 0 0 15px; + display: table-cell; + text-align: left; + word-break: break-all; + min-width: 330px; + max-width: 350px; + font-weight: normal; + vertical-align: top; + + li { + line-height: 30px; + display: inline-block; + margin-right: 8px; + + &.menu-row { + display: block; + .clearfix(); + } + + a { + padding-right: 8px; + } + } + + &:last-child { + border-right: 0; + } + } + + .memu-group-sub { + font-weight: normal; + border: none; + line-height: 25px; + .clearfix(); + display: block; + + li { + border: 0; + } + } + } + + .submenu { + margin-top: 0; + + li { + padding: 0; + height: var(--ti-menubar-submenu-li-height); + line-height: var(--ti-menubar-submenu-li-height); + + .starActive-favorite { + color: #e1860a; + } + + a { + padding: 0 35px 0 12px; + white-space: nowrap; + text-align: left; + } + + span { + position: absolute; + color: var(--ti-menubar-submenu-normal-text-color); + } + } + } + + .submenu, + .menu-dropdown { + position: absolute; + z-index: 10; + border-top: 0; + margin-top: 0; + } + + span.icon-starActive, + span.icon-transpond { + position: absolute; + } + + span.icon-transpond { + right: 5px; + margin-right: 0; + } + + span.icon-starActive { + left: 0; + + & + a { + padding-left: 35px; + } + } +} + +.menu-roll { + > ul { + .clearfix(); + + > li { + .clearfix(); + display: none; + margin-left: 0; + + a { + height: 45px; + font-weight: bold; + min-width: 30px; + margin: 0; + padding: 0 6px; + text-align: left; + } + + &.node-selected > a { + float: left; + width: 100%; + } + } + } + + .submenu { + text-align: left; + line-height: 30px; + left: 100%; + margin-top: 45px; + min-width: 180px; + + .submenu { + margin-top: -31px; + top: inherit; // 菜单归popup管之后,位置重置 + } + + li { + padding: 0 10px; + height: 45px; + line-height: 45px; + + a { + padding: 0 6px; + display: block; + padding-right: 27px; + } + + span { + float: right; + margin: 5px 0 0 10px; + } + + span.@{css-prefix}icon { + float: none !important; + } + + span.icon-starActive, + span.icon-transpond { + position: initial; + } + } + } + + // 居顶导航菜单--水平二级菜单 + .node-selected { + display: block; + + > .submenu { + display: block; + left: 100%; + margin: 0; + min-width: 720px; + + li { + float: left; + } + } + } +} + +.roll-popup { + > ul { + > li { + display: block; + + > .submenu { + display: none; + } + } + } +} + +// 居顶菜单出现下拉小三角时叠加的样式-与menu-hor同级 +.hor-dropdown { + position: relative; + z-index: 100; // 由1改为100,使菜单在grid(z-inde:99)拖拽线上方显示 + + > ul, + .hor-dropdown-content { + float: left; + } +} + +.hor-dropdown-content { + position: relative; + color: #fff; + + > span { + width: 80px; + text-align: center; + display: inline-block; + line-height: 31px; + position: relative; + z-index: 1; + background: var(--ti-menubar-bg-color-normal); + line-height: 46px; + + i { + width: 15px; + height: 16px; + padding-top: 1px; + border-radius: 2px; + cursor: pointer; + border: 1px solid var(--ti-menubar-dropdown-border-color); + } + } + + .dropdown-menu { + position: absolute; + min-width: 140px; + padding: 5px; + right: 0; + margin-top: -1px; + background: var(--ti-menubar-bg-color-normal); + padding: 5px 0; + + li { + line-height: 24px; + padding: 2px 10px; + border: 1px solid var(--ti-menubar-bg-color-normal); + + a { + color: #fff; + } + + &:hover { + .box-shadow(inset 0 0 4px rgba(255, 255, 255, 0.6)); + border-radius: 3px; + border: 1px solid var(--ti-menubar-dropdown-hover-border-color); + background: var(--ti-menubar-dropdown-hover-bg-color); + } + } + } +} + +.menu-horline { + > ul { + > li { + a { + font-weight: normal; + + span.@{css-prefix}icon { + margin-right: 5px; + } + } + + position: inherit; + + &.node-more { + position: relative; + + > .submenu { + left: 0; + + > li { + float: none; + + > a { + text-align: left; + } + } + + span.@{css-prefix}icon { + margin-left: 5px; + } + } + } + + &.node-selected { + position: inherit; + } + } + } + + .submenu { + min-width: 100%; + + li { + float: left; + + a { + padding: 0 8px; + margin: 5px 0; + line-height: 35px; + text-align: center; + } + + span.@{css-prefix}icon { + float: none !important; + } + + span.icon-starActive, + span.icon-transpond { + position: initial; + } + } + } + + .node-selected > .submenu { + height: 45px; + left: 0; + + li { + line-height: 45px; + } + } +} diff --git a/packages/theme/src/menubar/vars.less b/packages/theme/src/menubar/vars.less new file mode 100644 index 000000000..7d510d129 --- /dev/null +++ b/packages/theme/src/menubar/vars.less @@ -0,0 +1,28 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-menubar() { + --ti-menubar-title-font-size: var(--ti-common-font-size-base-normal); + --ti-menubar-title-text-color: var(--ti-base-color-light); + --ti-menubar-li-height: var(--ti-common-size-12x); + --ti-menubar-menu-height: var(--ti-base-size-height-large); + --ti-menubar-menu-font-size: var(--ti-common-font-size-1); + --ti-menubar-submenu-normal-text-color: var(--ti-base-color-info-normal); + --ti-menubar-submenu-hover-bg-color: var(--ti-base-color-hover-background); + --ti-menubar-submenu-active-bg-color: var(--ti-base-color-selected-background); + --ti-menubar-submenu-li-height: var(--ti-common-size-10x); + --ti-menubar-bg-color-normal: var(--ti-base-color-navigation-background); + --ti-menubar-bg-color-active: #474c5e; + --ti-menubar-dropdown-border-color: #c9ccda; + --ti-menubar-dropdown-hover-border-color: #585f7f; + --ti-menubar-dropdown-hover-bg-color: #191b25; +} diff --git a/packages/theme/src/milestone/index.js b/packages/theme/src/milestone/index.js new file mode 100644 index 000000000..871d193fe --- /dev/null +++ b/packages/theme/src/milestone/index.js @@ -0,0 +1,26 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-milestone-text-color': '#fff', + 'tiny-milestone-bg-color': '#fff', + 'tiny-milestone-font-size': '12px', + 'tiny-milestone-icon-width': '20px', + 'tiny-milestone-icon-height': '20px', + 'tiny-milestone-line-bg-color': '#dbdbdb', + 'tiny-milestone-status-text-color': '#999999', + 'tiny-milestone-flag-tip-line-height': '20px', + 'tiny-milestone-flag-tip-bg-color': '#d9d9d9', + 'tiny-milestone-flag-tip-border-radius': '2px', + 'tiny-milestone-flag-content-border-radius': '4px', + 'tiny-milestone-flag-content-font-size': '14px' +} diff --git a/packages/theme/src/milestone/index.less b/packages/theme/src/milestone/index.less new file mode 100644 index 000000000..5b355d006 --- /dev/null +++ b/packages/theme/src/milestone/index.less @@ -0,0 +1,195 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@milestone-prefix-cls: ~'@{css-prefix}milestone'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{milestone-prefix-cls} { + .component-css-vars-milestone(); + + overflow: hidden; + padding-top: 38px; + + & &__node { + display: block; + float: left; + + &::before { + content: ''; + width: 28px; + height: 28px; + display: block; + position: relative; + left: ~'calc(50% - 14px)'; + top: 28px; + z-index: 15; + } + + &.is-solid { + &::before { + background: var(--ti-milestone-bg-color); + } + + .@{svg-prefix-cls} { + fill: var(--ti-milestone-bg-color); + } + } + + .iconfix { + font-size: var(--ti-common-font-size-4); + } + } + + & &__icon { + background: var(--ti-milestone-bg-color); + width: var(--ti-milestone-icon-width, 20px); + height: var(--ti-milestone-icon-height, 20px); + line-height: var(--ti-milestone-icon-height, 20px); + position: relative; + font-size: var(--ti-milestone-font-size, 12px); + text-align: center; + left: ~'calc(50% - 10px)'; + top: 4px; + border-radius: 50%; + color: var(--ti-milestone-text-color); + cursor: pointer; + z-index: 15; + + &.is-completed { + border: solid 2px; + + .@{svg-prefix-cls} { + fill: #1890ff; + vertical-align: baseline; + } + } + } + + & &__line { + height: 4px; + left: 50%; + top: -8px; + position: relative; // 里程碑线条不区分状态 + background: var(--ti-milestone-line-bg-color); + } + + & &__line-end { + width: 0; + } + + & &__description { + line-height: 14px; + margin-top: 8px; + position: relative; + overflow: hidden; + text-align: center; + } + + & &__description-name { + width: 100%; + color: #333; + font-size: var(--ti-milestone-font-size); + float: left; + } + + & &__description-status { + color: var(--ti-milestone-status-text-color); + font-size: var(--ti-milestone-font-size); + float: left; + width: 100%; + } + + & &__flag-tip { + position: fixed; + padding: 2px 4px; + line-height: var(--ti-milestone-flag-tip-line-height); + background: var(--ti-milestone-flag-tip-bg-color); + border-radius: var(--ti-milestone-flag-tip-border-radius); + border: solid 1px var(--ti-milestone-flag-tip-bg-color); + text-align: center; + word-wrap: break-word; + + &::before { + position: absolute; + width: 0; + height: 0; + border-style: solid; + border: 1px solid; + border-width: 8px 8px 0px 8px; + border-color: #d9d9d9 transparent; + content: ''; + left: ~'calc(50% - 4px)'; + bottom: -6px; + } + } + + & &__flag { + position: absolute; + left: ~'calc(50% - 29px)'; + bottom: 5px; + width: 58px; + text-align: center; + z-index: 1; + + &:hover { + z-index: 2; + } + } + + & &__flag-content { + width: 58px; + height: 34px; + padding: 0px; + line-height: 15px; + font-size: var(--ti-milestone-flag-content-font-size); + border-radius: var(--ti-milestone-flag-content-border-radius); + color: var(--ti-milestone-text-color); + background: #333; + cursor: pointer; + vertical-align: middle; + display: table-cell; + + p { + color: var(--ti-milestone-text-color); + width: 58px; + font-size: var(--ti-common-font-size-base); + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + padding: 0 4px; + margin: 0; + box-sizing: border-box; + } + } + + & &__flag-line { + height: 30px; + width: 1px; + margin-left: 50%; + background: #333; + } + + & &__dot { + display: block; + background: var(--ti-milestone-flag-line-color); + border: solid 1px; + border-radius: 50%; + width: 5px; + height: 5px; + position: relative; + bottom: -29px; + right: 2px; + } +} diff --git a/packages/theme/src/milestone/vars.less b/packages/theme/src/milestone/vars.less new file mode 100644 index 000000000..a464e81f3 --- /dev/null +++ b/packages/theme/src/milestone/vars.less @@ -0,0 +1,26 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-milestone() { + --ti-milestone-text-color: var(--ti-base-color-light); + --ti-milestone-bg-color: var(--ti-base-color-light); + --ti-milestone-font-size: var(--ti-common-font-size-base); + --ti-milestone-icon-width: var(--ti-common-size-5x); + --ti-milestone-icon-height: var(--ti-common-size-5x); + --ti-milestone-line-bg-color: #dbdbdb; + --ti-milestone-status-text-color: var(--ti-base-color-placeholder); + --ti-milestone-flag-tip-line-height: 20px; + --ti-milestone-flag-tip-bg-color: var(--ti-base-color-border); + --ti-milestone-flag-tip-border-radius: var(--ti-common-border-radius-normal); + --ti-milestone-flag-content-border-radius: var(--ti-common-border-radius-1); + --ti-milestone-flag-content-font-size: var(--ti-common-font-size-1); +} diff --git a/packages/theme/src/mixins/alert.less b/packages/theme/src/mixins/alert.less new file mode 100644 index 000000000..f4badb5a3 --- /dev/null +++ b/packages/theme/src/mixins/alert.less @@ -0,0 +1,28 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +.alert-variant(@color; @border-color; @icon-color; @link-color; @bgcolor) { + background: @bgcolor; + border-color: @border-color; + color: @color; + hr { + border-top-color: @link-color; + } + .alert-link { + color: @link-color; + } + .@{css-prefix}alert__icon { + fill: @icon-color; + } +} diff --git a/packages/theme/src/mixins/button-group.less b/packages/theme/src/mixins/button-group.less new file mode 100644 index 000000000..c9b750560 --- /dev/null +++ b/packages/theme/src/mixins/button-group.less @@ -0,0 +1,24 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.button-group-type(@color) { + &:first-child { + border-right-color: @color; + } + &:last-child { + border-left-color: @color; + } + &:not(:first-child):not(:last-child) { + border-left-color: @color; + border-right-color: @color; + } +} diff --git a/packages/theme/src/mixins/button.less b/packages/theme/src/mixins/button.less new file mode 100644 index 000000000..5ce249539 --- /dev/null +++ b/packages/theme/src/mixins/button.less @@ -0,0 +1,138 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.button-size(@font-size, @height) { + height: @height; + line-height: @height; + font-size: @font-size; + + &.is-round { + border-radius: calc(@height / 2); + } + + &.is-circle { + border-radius: 50%; + } +} + +.button-circle-size(@size, @padding) { + min-width: @size; + min-height: @size; + height: auto; + line-height: 1; + padding: @padding; +} + +.button-color(@color, @border-color, @background-color) { + color: @color; + fill: @color; + border-color: @border-color; + background-color: @background-color; +} + +.button-type(@color, @normal-color, @hover-color, @active-color, @disabled-color, @disabled-bg-color, @plain-bg-color, @plain-dis-bg-color, @disabled-border-color: @disabled-bg-color) { + color: @color; + fill: @color; + border-color: @normal-color; + background-color: @normal-color; + + &:hover { + color: @color; + fill: @color; + border-color: @hover-color; + background-color: @hover-color; + } + + &:focus, + &:active, + &.is-active { + color: @color; + fill: @color; + border-color: @active-color; + background-color: @active-color; + outline: 0; + } + + &.is-disabled, + &.is-disabled:active, + &.is-disabled:focus, + &.is-disabled:hover { + color: @disabled-color; + fill: @disabled-color; + border-color: @disabled-border-color; + background-color: @disabled-bg-color; + } + + &.is-plain { + color: @normal-color; + fill: @normal-color; + border-color: @normal-color; + background-color: @plain-bg-color; + + &:hover { + color: @color; + fill: @color; + border-color: @normal-color; + background-color: @normal-color; + } + + &:focus, + &:active, + &.is-active { + color: @color; + fill: @color; + border-color: @active-color; + background-color: @active-color; + outline: 0; + } + + &.is-disabled, + &.is-disabled:active, + &.is-disabled:focus, + &.is-disabled:hover { + color: var(--ti-button-plain-disabled-text-color); + fill: @disabled-bg-color; + border-color: @disabled-bg-color; + background-color: @plain-dis-bg-color; + } + } +} + +.button-text(@color, @hover-color, @active-color, @disabled-color) { + color: @color; + font-size: var(--ti-common-font-size-1); + border-color: transparent; + background-color: transparent; + + &:hover { + color: @hover-color; + border-color: transparent; + background-color: transparent; + } + + &:focus, + &:active, + &.is-active { + color: @active-color; + border-color: transparent; + background-color: transparent; + } + + &.is-disabled, + &.is-disabled:active, + &.is-disabled:focus, + &.is-disabled:hover { + color: @disabled-color; + border-color: transparent; + background-color: transparent; + } +} diff --git a/packages/theme/src/mixins/calendar.less b/packages/theme/src/mixins/calendar.less new file mode 100644 index 000000000..12bb3a79c --- /dev/null +++ b/packages/theme/src/mixins/calendar.less @@ -0,0 +1,23 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.calendar-header(@color,@background) { + position: relative; + background: @background; + color: @color; + text-align: center; + font-weight: 400; + line-height: 190%; + a { + color: @color; + } +} diff --git a/packages/theme/src/mixins/checkbox.less b/packages/theme/src/mixins/checkbox.less new file mode 100644 index 000000000..f16ec9666 --- /dev/null +++ b/packages/theme/src/mixins/checkbox.less @@ -0,0 +1,83 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@checkbox-prefix-cls: ~'@{css-prefix}checkbox'; + +.checkbox-border-disabled(@color, @border-color) { + border-color: @border-color; + color: @color; + pointer-events: none; + cursor: not-allowed; + + .@{checkbox-prefix-cls}__inner, + .@{checkbox-prefix-cls}__inner:hover { + border-color: @border-color; + cursor: not-allowed; + } + + &.is-checked { + border-color: @color; + .@{checkbox-prefix-cls}__inner, + .@{checkbox-prefix-cls}__inner:hover { + background-color: @color; + border-color: @color; + &::after { + border-color: @border-color; + } + } + } +} + +.checkbox-input-disabled(@color, @bgcolor, @border-color) { + .@{checkbox-prefix-cls}__inner { + background-color: @bgcolor; + border-color: @border-color; + cursor: not-allowed; + + svg { + fill: @border-color; + } + + & + .@{checkbox-prefix-cls}__label { + cursor: not-allowed; + } + } + &.is-checked { + .@{checkbox-prefix-cls}__inner, + .@{checkbox-prefix-cls}__inner:hover { + background-color: @color; + border-color: @color; + + &::after { + border-color: @bgcolor; + } + } + } + &.is-indeterminate { + .@{checkbox-prefix-cls}__inner, + .@{checkbox-prefix-cls}__inner:hover { + background-color: @color; + border-color: @color; + + &::before { + background-color: @bgcolor; + border-color: @bgcolor; + } + } + } + & + span.@{checkbox-prefix-cls}__label { + color: @color; + cursor: not-allowed; + } +} diff --git a/packages/theme/src/mixins/common.less b/packages/theme/src/mixins/common.less new file mode 100644 index 000000000..47c294ae1 --- /dev/null +++ b/packages/theme/src/mixins/common.less @@ -0,0 +1,676 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.clearfix() { + &:after, + &:before { + content: ''; + display: table; + } + &:after { + clear: both; + } +} + +.tab-focus() { + outline: thin dotted; + outline: 5px auto -webkit-focus-ring-color; + outline-offset: -2px; +} + +.center-block() { + display: block; + margin-left: auto; + margin-right: auto; +} + +.size(@width; @height) { + width: @width; + height: @height; +} +.square(@size) { + .size(@size; @size); +} + +.placeholder(@color: #999) { + &:-moz-placeholder { + color: @color; + } + + &::-moz-placeholder { + color: @color; + opacity: 1; + } + + &:-ms-input-placeholder { + color: @color; + } + + &::-webkit-input-placeholder { + color: @color; + } + &::-ms-input-placeholder { + color: @color; + } + &::placeholder { + color: @color; + } +} + +.text-overflow() { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.hide-text() { + font: ~'0/0' a; + color: transparent; + text-shadow: none; + background-color: transparent; + border: 0; +} + +.text-hide() { + .hide-text(); +} + +.border-top-radius(@radius) { + border-top-left-radius: @radius; + border-top-right-radius: @radius; +} +.border-right-radius(@radius) { + border-top-right-radius: @radius; + border-bottom-right-radius: @radius; +} +.border-left-radius(@radius) { + border-top-left-radius: @radius; + border-bottom-left-radius: @radius; +} +.border-bottom-radius(@radius) { + border-bottom-left-radius: @radius; + border-bottom-right-radius: @radius; +} + +.box-shadow(@shadow) { + -webkit-box-shadow: @shadow; + box-shadow: @shadow; +} + +.transition(@transition) { + -webkit-transition: @transition; + transition: @transition; +} +.transition-property(@transition-property) { + transition-property: @transition-property; + -webkit-transition-property: @transition-property; +} +.transition-transform(@transition) { + -moz-transition: -moz-transform @transition; + -o-transition: -o-transform @transition; + -webkit-transition: -webkit-transform @transition; + transition: transform @transition; +} +.transition-delay(@transition-delay) { + transition-delay: @transition-delay; + -webkit-transition-delay: @transition-delay; +} +.transition-duration(@transition-duration) { + transition-duration: @transition-duration; + -webkit-transition-duration: @transition-duration; +} + +.rotate(@degrees) { + -webkit-transform: rotate(@degrees); + -ms-transform: rotate(@degrees); + transform: rotate(@degrees); +} +.scale(@ratio) { + -webkit-transform: scale(@ratio); + -ms-transform: scale(@ratio); + transform: scale(@ratio); +} +.translate(@x; @y) { + -webkit-transform: translate(@x, @y); + -ms-transform: translate(@x, @y); + transform: translate(@x, @y); +} +.skew(@x; @y) { + -webkit-transform: skew(@x, @y); + -ms-transform: skewX(@x) skewY(@y); + transform: skew(@x, @y); +} +.rotateX(@degrees) { + -webkit-transform: rotateX(@degrees); + -ms-transform: rotateX(@degrees); + transform: rotateX(@degrees); +} +.translate3d(@x; @y; @z) { + transform: translate3d(@x, @y, @z); + -webkit-transform: translate3d(@x, @y, @z); +} +.rotateY(@degrees) { + -webkit-transform: rotateY(@degrees); + -ms-transform: rotateY(@degrees); + transform: rotateY(@degrees); +} +.perspective(@perspective) { + -moz-perspective: @perspective; + -webkit-perspective: @perspective; + perspective: @perspective; +} +.transform-origin(@origin) { + -webkit-transform-origin: @origin; + -moz-transform-origin: @origin; + transform-origin: @origin; +} +.perspective-origin(@perspective) { + -webkit-perspective-origin: @perspective; + -moz-perspective-origin: @perspective; + perspective-origin: @perspective; +} + +.animation(@animation) { + -webkit-animation: @animation; + animation: @animation; +} + +.backface-visibility(@visibility) { + -webkit-backface-visibility: @visibility; + -moz-backface-visibility: @visibility; + backface-visibility: @visibility; +} + +.box-sizing(@boxmodel) { + -webkit-box-sizing: @boxmodel; + -moz-box-sizing: @boxmodel; + box-sizing: @boxmodel; +} + +.user-select(@select) { + -ms-user-select: @select; + -webkit-user-select: @select; + -o-user-select: @select; + -moz-user-select: @select; + user-select: @select; +} + +.resizable(@direction) { + resize: @direction; + overflow: auto; +} + +.content-columns(@column-count; @column-gap: @grid-gutter-width) { + -moz-column-gap: @column-gap; + -webkit-column-count: @column-count; + column-count: @column-count; + -moz-column-count: @column-count; + -webkit-column-gap: @column-gap; + column-gap: @column-gap; +} + +.hyphens(@mode: auto) { + -o-hyphens: @mode; + word-wrap: break-word; + -webkit-hyphens: @mode; + -ms-hyphens: @mode; + -moz-hyphens: @mode; + hyphens: @mode; +} + +.opacity(@opacity) { + opacity: @opacity; + @opacity-ie: (@opacity * 100); + filter: ~'alpha(opacity=@{opacity-ie})'; +} + +#gradient { + .horizontal(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) { + background-image: -webkit-linear-gradient(left, color-stop(@start-color @start-percent), color-stop(@end-color @end-percent)); + background-image: linear-gradient(to right, @start-color @start-percent, @end-color @end-percent); + background-repeat: repeat-x; + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)", argb(@start-color), argb(@end-color))); + } + .vertical(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) { + background-image: -webkit-linear-gradient(top, @start-color @start-percent, @end-color @end-percent); + background-image: linear-gradient(to bottom, @start-color @start-percent, @end-color @end-percent); + background-repeat: repeat-x; + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)", argb(@start-color), argb(@end-color))); + } + + .directional(@start-color: #555; @end-color: #333; @deg: 45deg) { + background-repeat: repeat-x; + background-image: -webkit-linear-gradient(@deg, @start-color, @end-color); + background-image: linear-gradient(@deg, @start-color, @end-color); + } + .horizontal-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) { + background-image: -webkit-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color); + background-image: linear-gradient(to right, @start-color, @mid-color @color-stop, @end-color); + background-repeat: no-repeat; + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)", argb(@start-color), argb(@end-color))); + } + .vertical-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) { + background-image: -webkit-linear-gradient(@start-color, @mid-color @color-stop, @end-color); + background-image: linear-gradient(@start-color, @mid-color @color-stop, @end-color); + background-repeat: no-repeat; + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)", argb(@start-color), argb(@end-color))); + } + .radial(@inner-color: #555; @outer-color: #333) { + background-image: -webkit-radial-gradient(circle, @inner-color, @outer-color); + background-image: radial-gradient(circle, @inner-color, @outer-color); + background-repeat: no-repeat; + } + .striped(@color: rgba(255,255,255,0.15); @angle: 45deg) { + background-image: -webkit-linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent); + background-image: linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent); + } +} +.reset-filter() { + filter: e(%('progid:DXImageTransform.Microsoft.gradient(enabled = false)')); +} + +.img-retina(@file-1x; @file-2x; @width-1x; @height-1x) { + background-image: url('@{file-1x}'); + + @media only screen and (-webkit-min-device-pixel-ratio: 2), + only screen and (min--moz-device-pixel-ratio: 2), + only screen and (-o-min-device-pixel-ratio: 2/1), + only screen and (min-device-pixel-ratio: 2), + only screen and (min-resolution: 192dpi), + only screen and (min-resolution: 2dppx) { + background-image: url('@{file-2x}'); + background-size: @width-1x @height-1x; + } +} + +.img-responsive(@display: block;) { + display: @display; + max-width: 100%; + height: auto; +} + +.nav-divider(@color: #e5e5e5) { + height: 1px; + margin: ((@line-height-computed / 2) - 1) 0; + overflow: hidden; + background-color: @color; +} + +.panel-variant(@border; @heading-text-color; @heading-bg-color; @heading-border) { + border-color: @border; + + & > .panel-footer { + + .panel-collapse .panel-body { + border-bottom-color: @border; + } + } + + & > .panel-heading { + background-color: @heading-bg-color; + border-color: @heading-border; + color: @heading-text-color; + + + .panel-collapse .panel-body { + border-top-color: @border; + } + } +} + +.table-row-variant(@state; @background) { + .table { + > thead, + > tbody, + > tfoot { + > tr > .@{state}, + > .@{state} > td, + > .@{state} > th { + background-color: @background; + } + } + } + + .table-hover > tbody { + > tr > .@{state}:hover, + > .@{state}:hover > td, + > .@{state}:hover > th { + background-color: darken(@background, 5%); + } + } +} + +.pagination-size(@padding-vertical; @padding-horizontal; @font-size; @border-radius) { + > li { + > a, + > span { + font-size: @font-size; + padding: @padding-vertical @padding-horizontal; + } + &:last-child { + > a, + > span { + .border-right-radius(@border-radius); + } + } + &:first-child { + > a, + > span { + .border-left-radius(@border-radius); + } + } + } +} + +.label-variant(@color) { + background-color: @color; + &[href] { + &:focus, + &:hover { + background-color: darken(@color, 10%); + } + } +} + +.navbar-vertical-align(@element-height) { + margin-top: ((@navbar-height - @element-height) / 2); + margin-bottom: ((@navbar-height - @element-height) / 2); +} + +.progress-bar-variant(@color) { + background-color: @color; + .progress-striped & { + #gradient > .striped(); + } +} + +.responsive-visibility() { + display: block !important; + table& { + display: table; + } + tr& { + display: table-row !important; + } + th&, + td& { + display: table-cell !important; + } +} + +.responsive-invisibility() { + &, + tr&, + th&, + td& { + display: none !important; + } +} + +.container-fixed() { + padding-right: (@grid-gutter-width / 2); + margin-right: auto; + padding-left: (@grid-gutter-width / 2); + margin-left: auto; + .clearfix(); +} + +.make-row(@gutter: @grid-gutter-width) { + margin-left: (@gutter / -2); + margin-right: (@gutter / -2); + .clearfix(); +} + +.make-xs-column(@columns; @gutter: @grid-gutter-width) { + position: relative; + float: left; + width: percentage((@columns / @grid-columns)); + min-height: 1px; + padding-left: (@gutter / 2); + padding-right: (@gutter / 2); + box-sizing: border-box; +} + +.make-sm-column(@columns; @gutter: @grid-gutter-width) { + position: relative; + min-height: 1px; + padding-left: (@gutter / 2); + padding-right: (@gutter / 2); + box-sizing: border-box; + + @media (min-width: @screen-sm-min) { + float: left; + width: percentage((@columns / @grid-columns)); + } +} + +.make-sm-column-push(@columns) { + @media (min-width: @screen-sm-min) { + left: percentage((@columns / @grid-columns)); + } +} + +.make-sm-column-offset(@columns) { + @media (min-width: @screen-sm-min) { + margin-left: percentage((@columns / @grid-columns)); + } +} + +.make-sm-column-pull(@columns) { + @media (min-width: @screen-sm-min) { + right: percentage((@columns / @grid-columns)); + } +} + +.make-md-column(@columns; @gutter: @grid-gutter-width) { + position: relative; + min-height: 1px; + padding-left: (@gutter / 2); + padding-right: (@gutter / 2); + box-sizing: border-box; + + @media (min-width: @screen-md-min) { + float: left; + width: percentage((@columns / @grid-columns)); + } +} + +.make-md-column-offset(@columns) { + @media (min-width: @screen-md-min) { + margin-left: percentage((@columns / @grid-columns)); + } +} +.make-md-column-push(@columns) { + @media (min-width: @screen-md) { + left: percentage((@columns / @grid-columns)); + } +} +.make-md-column-pull(@columns) { + @media (min-width: @screen-md-min) { + right: percentage((@columns / @grid-columns)); + } +} + +.make-lg-column(@columns; @gutter: @grid-gutter-width) { + position: relative; + min-height: 1px; + padding-left: (@gutter / 2); + padding-right: (@gutter / 2); + box-sizing: border-box; + + @media (min-width: @screen-lg-min) { + float: left; + width: percentage((@columns / @grid-columns)); + } +} + +.make-lg-column-offset(@columns) { + @media (min-width: @screen-lg-min) { + margin-left: percentage((@columns / @grid-columns)); + } +} + +.make-lg-column-pull(@columns) { + @media (min-width: @screen-lg-min) { + right: percentage((@columns / @grid-columns)); + } +} + +.make-lg-column-push(@columns) { + @media (min-width: @screen-lg-min) { + left: percentage((@columns / @grid-columns)); + } +} + +.make-xl-column(@columns; @gutter: @grid-gutter-width) { + position: relative; + min-height: 1px; + padding-left: (@gutter / 2); + padding-right: (@gutter / 2); + box-sizing: border-box; + + @media (min-width: @screen-xl-min) { + float: left; + width: percentage((@columns / @grid-columns)); + } +} + +.make-xl-column-offset(@columns) { + @media (min-width: @screen-xl-min) { + margin-left: percentage((@columns / @grid-columns)); + } +} +.make-xl-column-pull(@columns) { + @media (min-width: @screen-xl-min) { + right: percentage((@columns / @grid-columns)); + } +} +.make-xl-column-push(@columns) { + @media (min-width: @screen-xl-min) { + left: percentage((@columns / @grid-columns)); + } +} + +.make-grid-columns() { + .col(@index) when (@index = 1) { + @item: ~'.col-xs-@{index}, .col-sm-@{index}, .col-md-@{index}, .col-lg-@{index}, .col-xl-@{index}'; + .col(@index + 1, @item); + } + .col(@index, @list) when (@index =< @grid-columns) { + @item: ~'.col-xs-@{index}, .col-sm-@{index}, .col-md-@{index}, .col-lg-@{index}, .col-xl-@{index}'; + .col(@index + 1, ~'@{list}, @{item}'); + } + .col(@index, @list) when (@index > @grid-columns) { + @{list} { + position: relative; + min-height: 1px; + padding-left: (@grid-gutter-width / 2); + padding-right: (@grid-gutter-width / 2); + box-sizing: border-box; + } + } + .col(1); +} + +.make-grid-columns-float(@class) { + .col(@index) when (@index = 1) { + @item: ~'.col-@{class}-@{index}'; + .col(@index + 1, @item); + } + .col(@index, @list) when (@index =< @grid-columns) { + @item: ~'.col-@{class}-@{index}'; + .col(@index + 1, ~'@{list}, @{item}'); + } + .col(@index, @list) when (@index > @grid-columns) { + @{list} { + float: left; + } + } + .col(1); +} + +.calc-grid(@index, @class, @type) when (@type = width) and (@index > 0) { + .col-@{class}-@{index} { + width: percentage((@index / @grid-columns)); + } +} +.calc-grid(@index, @class, @type) when (@type = pull) { + .col-@{class}-pull-@{index} { + right: percentage((@index / @grid-columns)); + } +} +.calc-grid(@index, @class, @type) when (@type = push) { + .col-@{class}-push-@{index} { + left: percentage((@index / @grid-columns)); + } +} + +.calc-grid(@index, @class, @type) when (@type = offset) { + .col-@{class}-offset-@{index} { + margin-left: percentage((@index / @grid-columns)); + } +} +.make-grid(@index, @class, @type) when (@index >= 0) { + .calc-grid(@index, @class, @type); + .make-grid(@index - 1, @class, @type); +} + +.form-control-validation(@text-color: #555; @border-color: #ccc; @background-color: #f5f5f5) { + .control-label, + .checkbox, + .radio-inline, + .radio, + .checkbox-inline, + .help-block { + color: @text-color; + } + .form-control { + border-color: @border-color; + .box-shadow( + inset 0 1px 1px rgba(0, 0, 0, 0.075) + ); + &:focus { + border-color: darken(@border-color, 10%); + @shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px lighten(@border-color, 20%); + .box-shadow(@shadow); + } + } + .input-group-addon { + color: @text-color; + border-color: @border-color; + background-color: @background-color; + } +} + +.form-control-focus(@color: @input-border-focus) { + @color-rgba: rgba(red(@color), green(@color), blue(@color), 0.6); + &:focus { + border-color: @color; + outline: 0; + .box-shadow(~'inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px @{color-rgba}'); + } +} + +.input-size(@input-height; @padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) { + font-size: @font-size; + padding: @padding-vertical @padding-horizontal; + border-radius: @border-radius; + line-height: @line-height; + height: @input-height; + + textarea& { + height: auto; + } + + select& { + line-height: @input-height; + height: @input-height; + } +} diff --git a/packages/theme/src/mixins/grid.less b/packages/theme/src/mixins/grid.less new file mode 100644 index 000000000..1a3e1a81b --- /dev/null +++ b/packages/theme/src/mixins/grid.less @@ -0,0 +1,85 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import './variable.less'; +@import './common.less'; +@import '../custom.less'; + +.container { + .container-fixed(); + + @media (min-width: @screen-sm) { + width: @container-sm; + } + @media (min-width: @screen-md) { + width: @container-md; + } + @media (min-width: @screen-lg-min) { + width: @container-lg; + } + @media (min-width: @screen-xl-min) { + width: @container-xl; + } +} + +.row { + .make-row(); + h3 { + margin-left: (@grid-gutter-width / 2); + } +} + +.@{css-prefix}filter .row { + overflow: hidden; + .title { + margin-left: 10px; + } +} + +.make-grid-columns(); +.make-grid-columns-float(xs); +.make-grid(@grid-columns, xs, width); +.make-grid(@grid-columns, xs, push); +.make-grid(@grid-columns, xs, pull); +.make-grid(@grid-columns, xs, offset); + +@media (min-width: @screen-sm-min) { + .make-grid-columns-float(sm); + .make-grid(@grid-columns, sm, width); + .make-grid(@grid-columns, sm, push); + .make-grid(@grid-columns, sm, pull); + .make-grid(@grid-columns, sm, offset); +} + +@media (min-width: @screen-md-min) { + .make-grid-columns-float(md); + .make-grid(@grid-columns, md, width); + .make-grid(@grid-columns, md, push); + .make-grid(@grid-columns, md, pull); + .make-grid(@grid-columns, md, offset); +} + +@media (min-width: @screen-lg-min) { + .make-grid-columns-float(lg); + .make-grid(@grid-columns, lg, width); + .make-grid(@grid-columns, lg, push); + .make-grid(@grid-columns, lg, pull); + .make-grid(@grid-columns, lg, offset); +} + +@media (min-width: @screen-xl-min) { + .make-grid-columns-float(xl); + .make-grid(@grid-columns, xl, width); + .make-grid(@grid-columns, xl, push); + .make-grid(@grid-columns, xl, pull); + .make-grid(@grid-columns, xl, offset); +} diff --git a/packages/theme/src/mixins/input.less b/packages/theme/src/mixins/input.less new file mode 100644 index 000000000..6b9cae82d --- /dev/null +++ b/packages/theme/src/mixins/input.less @@ -0,0 +1,71 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +.input-readonly(@color) { + &.readonly, + &[readonly] { + cursor: not-allowed; + box-shadow: none; + + &:focus, + &:active, + &.active, + &[active], + &:hover { + border-color: @color; + } + } +} + +.input-variant(@color-normal; @color-hover; @color-active; @color-disabled; @color-hover-shadow; @color-active-shadow) { + border-color: @color-normal; + .input-readonly(@color-normal); + + &:hover, + &:focus, + &:active, + &.active { + border-color: @color-active; + box-shadow: var(--ti-input-normal-active-shadow-size, 0 0 0) + @color-active-shadow; + } + + &:hover { + border-color: @color-hover; + box-shadow: var(--ti-input-normal-active-shadow-size, 0 0 0) + @color-hover-shadow; + } + + &.disabled, + &[disabled] { + &, + &:hover, + &:focus, + &:active, + &.active { + border-color: @color-disabled; + } + } +} + +.input-size(@height) { + .@{css-prefix}input__inner { + height: @height; + line-height: @height; + } + + .@{css-prefix}input__suffix { + line-height: calc(@height - 2px); + } +} diff --git a/packages/theme/src/mixins/link.less b/packages/theme/src/mixins/link.less new file mode 100644 index 000000000..9a7d2787a --- /dev/null +++ b/packages/theme/src/mixins/link.less @@ -0,0 +1,32 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.link-type(@color, @border-color, @hover-color, @disabled-color) { + color: @color; + fill: @color; + + &.is-underline:hover:after, + &:after { + border-color: @border-color; + } + + &:hover { + color: @hover-color; + fill: @hover-color; + text-decoration: none; + } + + &.is-disabled { + color: @disabled-color; + fill: @disabled-color; + } +} diff --git a/packages/theme/src/mixins/mixin.less b/packages/theme/src/mixins/mixin.less new file mode 100644 index 000000000..8139b21a0 --- /dev/null +++ b/packages/theme/src/mixins/mixin.less @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import 'common'; +@import 'button'; +@import 'input'; +@import 'calendar'; +@import 'tip'; +@import 'table'; +@import 'alert'; +@import 'tag'; diff --git a/packages/theme/src/mixins/progress.less b/packages/theme/src/mixins/progress.less new file mode 100644 index 000000000..11c8d8c27 --- /dev/null +++ b/packages/theme/src/mixins/progress.less @@ -0,0 +1,25 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@progress-prefix-cls: ~'@{css-prefix}progress'; + +.progress-status(@color) { + .@{progress-prefix-cls}-bar__inner { + background-color: @color; + } + + .@{progress-prefix-cls}__text svg { + fill: @color; + } +} diff --git a/packages/theme/src/mixins/tag.less b/packages/theme/src/mixins/tag.less new file mode 100644 index 000000000..bf093d261 --- /dev/null +++ b/packages/theme/src/mixins/tag.less @@ -0,0 +1,51 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +.tag-variant(@color, @border-color, @background-color) { + color: @color; + border-color: @border-color; + background-color: @background-color; + + &.is-hit { + border-color: @color; + } + + .@{css-prefix}tag__close { + fill: @color; + opacity: 0.5; + + &:hover { + opacity: 1; + } + } +} + +.tag-dark-variant(@color, @bgcolor) { + color: @color; + border-color: @bgcolor; + background-color: @bgcolor; + + &.is-hit { + border-color: @bgcolor; + } + + .@{css-prefix}tag__close { + fill: @color; + opacity: 0.5; + + &:hover { + opacity: 1; + } + } +} diff --git a/packages/theme/src/mixins/tip.less b/packages/theme/src/mixins/tip.less new file mode 100644 index 000000000..a8508c23d --- /dev/null +++ b/packages/theme/src/mixins/tip.less @@ -0,0 +1,81 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.tip-variant(@color; @fontColor; @shadow; @top) { + background: @color; + color: @fontColor; + border-radius: var(--ti-tips-border-radius-large, 3px); + box-shadow: @shadow; + margin-top: @top; + + &:before { + .tip-make-arrow(4px 4px 4px 0; transparent @color); + } + + &.tips-bottom { + &:before { + .tip-make-arrow(0 4px 4px 4px; @color transparent); + } + } + + &.tips-left { + &:before { + .tip-make-arrow(4px 0 4px 4px; transparent @color); + } + } + + &.tips-top { + &:before { + .tip-make-arrow(4px 4px 0 4px; @color transparent); + } + } + + &.tips-bottom-left { + &:before { + .tip-make-arrow(0 4px 4px 4px; @color transparent); + } + } + + &.tips-bottom-right { + &:before { + .tip-make-arrow(0 4px 4px 4px; @color transparent); + } + } + + &.tips-top-left { + &:before { + .tip-make-arrow(4px 4px 0 4px; @color transparent); + } + } + + &.tips-top-right { + &:before { + .tip-make-arrow(4px 4px 0 4px; @color transparent); + } + } +} + +.tip-arrow (@tips-arrow-left; @tips-arrow-top; @tips-arrow-margin-top) { + content: ''; + left: @tips-arrow-left; + top: @tips-arrow-top; + margin-top: @tips-arrow-margin-top; +} + +.tip-make-arrow (@border-width; @arrow-color) { + position: absolute; + width: 0; + height: 0; + border-style: solid; + border-width: @border-width; + border-color: @arrow-color; +} diff --git a/packages/theme/src/mixins/tooltip.less b/packages/theme/src/mixins/tooltip.less new file mode 100644 index 000000000..da5386546 --- /dev/null +++ b/packages/theme/src/mixins/tooltip.less @@ -0,0 +1,86 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.tooltip-type (@color, @bgcolor, @border-color) { + background: @bgcolor; + color: @color; + + &[x-placement^='top'] .popper__arrow { + border-top-color: @border-color; + + &::after { + border-top-color: @border-color; + } + } + + &[x-placement^='bottom'] .popper__arrow { + border-bottom-color: @border-color; + + &::after { + border-bottom-color: @border-color; + } + } + + &[x-placement^='left'] .popper__arrow { + border-left-color: @border-color; + + &::after { + border-left-color: @border-color; + } + } + + &[x-placement^='right'] .popper__arrow { + border-right-color: @border-color; + + &::after { + border-right-color: @border-color; + } + } +} + +.tooltip-light (@color, @bgcolor, @border-color) { + background: @bgcolor; + color: @color; + border: 1px solid @border-color; + + &[x-placement^='top'] .popper__arrow { + border-top-color: @border-color; + + &::after { + border-top-color: @bgcolor; + } + } + + &[x-placement^='bottom'] .popper__arrow { + border-bottom-color: @border-color; + + &::after { + border-bottom-color: @bgcolor; + } + } + + &[x-placement^='left'] .popper__arrow { + border-left-color: @border-color; + + &::after { + border-left-color: @bgcolor; + } + } + + &[x-placement^='right'] .popper__arrow { + border-right-color: @border-color; + + &::after { + border-right-color: @bgcolor; + } + } +} diff --git a/packages/theme/src/mixins/transfer.less b/packages/theme/src/mixins/transfer.less new file mode 100644 index 000000000..721005b3d --- /dev/null +++ b/packages/theme/src/mixins/transfer.less @@ -0,0 +1,35 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.transfer-scrollbar(@size) { + &::-webkit-scrollbar { + width: @size; + height: @size; + } + + &::-webkit-scrollbar-track-piece { + background: #fafafa; + } + + &::-webkit-scrollbar-thumb { + background: #bfbfbf; + border-radius: calc(@size / 2); + } + + &::-webkit-scrollbar-thumb:hover { + background: #999999; + } + + &::-webkit-scrollbar-thumb:active { + background: #999999; + } +} diff --git a/packages/theme/src/mixins/variable.less b/packages/theme/src/mixins/variable.less new file mode 100644 index 000000000..c17b3c6b1 --- /dev/null +++ b/packages/theme/src/mixins/variable.less @@ -0,0 +1,42 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@screen-xs: 480px; +@screen-xs-min: @screen-xs; +@screen-xs-max: (@screen-xs-min - 1); +@screen-phone: @screen-xs; +@screen-sm: 768px; +@screen-sm-min: @screen-sm; +@screen-sm-max: (@screen-sm-min - 1); +@screen-tablet: @screen-sm; +@screen-md: 992px; +@screen-md-min: @screen-md; +@screen-md-max: (@screen-md-min - 1); +@screen-desktop: @screen-md; +@screen-lg: 1200px; +@screen-lg-min: @screen-lg; +@screen-lg-max: (@screen-lg-min - 1); +@screen-lg-desktop: @screen-lg; +@screen-xl: 1920px; +@screen-xl-min: @screen-xl; +@screen-xl-max: (@screen-xl-min - 1); +@screen-wide-desktop: @screen-xl; +@container-tablet: ((@screen-sm + @grid-gutter-width)); +@container-sm: @container-tablet; +@container-desktop: ((@screen-md + @grid-gutter-width)); +@container-md: @container-desktop; +@container-large-desktop: ((@screen-lg + @grid-gutter-width)); +@container-lg: @container-large-desktop; +@container-wide-desktop: ((@screen-xl + @grid-gutter-width)); +@container-xl: @container-wide-desktop; +@grid-columns: 12; +@grid-gutter-width: 20px; diff --git a/packages/theme/src/mixins/wizard.less b/packages/theme/src/mixins/wizard.less new file mode 100644 index 000000000..df9cb5f75 --- /dev/null +++ b/packages/theme/src/mixins/wizard.less @@ -0,0 +1,22 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.wizard-icon-color(@color, @bgcolor) { + color: @color; + background: @bgcolor; + border-color: @bgcolor; +} + +.wizard-line-color(@color) { + background: @color; + border-color: @color; +} diff --git a/packages/theme/src/modal/index.js b/packages/theme/src/modal/index.js new file mode 100644 index 000000000..86da96753 --- /dev/null +++ b/packages/theme/src/modal/index.js @@ -0,0 +1,47 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-modal-font-size': '12px', + 'tiny-modal-text-color': '#333', + 'tiny-modal-border-color': '#d9d9d9', + 'tiny-modal-font-family': 'Helvetica, Arial, "Microsoft YaHei", sans-serif', + 'tiny-modal-primary-icon-color': '#1890ff', + 'tiny-modal-warning-icon-color': '#faad14', + 'tiny-modal-success-icon-color': '#52c41a', + 'tiny-modal-error-icon-color': '#f5222d', + 'tiny-modal-loading-icon-color': '#78b1eb', + 'tiny-modal-alert-font-size': '22px', + 'tiny-modal-header-font-size': '14px', + 'tiny-modal-header-text-color': '#252b3a', + 'tiny-modal-header-font-weight': '700', + 'tiny-modal-header-padding-top': '32px', + 'tiny-modal-header-padding-horizontal': '32px', + 'tiny-modal-header-padding-bottom': '12px', + 'tiny-modal-body-padding-top': '0', + 'tiny-modal-body-padding-horizontal': '32px', + 'tiny-modal-body-padding-bottom': '0', + 'tiny-modal-footer-padding-top': '28px', + 'tiny-modal-footer-padding-horizontal': '32px', + 'tiny-modal-footer-padding-bottom': '32px', + 'tiny-modal-footer-btn-border-radius': '2px', + 'tiny-modal-close-btn-font-size': '14px', + 'tiny-modal-close-btn-padding-horizontal-vertical': '0', + 'tiny-modal-box-border-radius': '2px', + 'tiny-modal-close-btn-background-color-hover': '#fff', + 'tiny-modal-box-width': '400px', + 'tiny-modal-small-btn-font-size': '16px', + 'tiny-modal-box-background-color': '#fff', + 'tiny-modal-box-border-color': '#ebeef5', + 'tiny-modal-btn-text-color': '#c4c4c4', + 'tiny-modal-box-shadow': '0 0 10px 0 rgba(0, 0, 0, 0.2)' +} diff --git a/packages/theme/src/modal/index.less b/packages/theme/src/modal/index.less new file mode 100644 index 000000000..4ecb792a6 --- /dev/null +++ b/packages/theme/src/modal/index.less @@ -0,0 +1,534 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + + +@modal-prefix-cls: ~'@{css-prefix}modal'; + +@button-default-prefix-cls: ~'@{css-prefix}button--default'; +@button-prefix-cls: ~'@{css-prefix}button'; + +.@{modal-prefix-cls}{ + .component-css-vars-modal(); +} + +.@{modal-prefix-cls} { + &__wrapper { + display: none; + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + font-size: var(--ti-modal-font-size); + color: var(--ti-modal-text-color); + font-family:var( + --ti-modal-font-family, + Helvetica, + Arial, + 'Microsoft YaHei', + sans-serif + ); + transition: top 0.4s; + + &.active { + display: block; + } + + &.is__visible { + &.is__mask { + &:before { + background-color: rgba(0, 0, 0, 0.3); + } + } + + &.type__message { + .@{modal-prefix-cls}__box { + transform: translateY(0); + } + } + + &:not(.type__message) { + .@{modal-prefix-cls}__box:not(.is__drag) { + top: 15vh; + transition: top 0s ease-in, opacity 0.4s ease-in; + } + } + + .@{modal-prefix-cls}__box { + opacity: 1; + visibility: visible; + } + } + + &:not(.lock__view) { + pointer-events: none; + } + + &.lock__scroll { + overflow: hidden; + } + + &:not(.lock__scroll) { + overflow: auto; + } + + &:not(.type__message) { + .@{modal-prefix-cls}__text { + font-size: var(--ti-common-font-size-base); + color: var(--ti-common-color-text-secondary); + line-height: var(--ti-common-line-height-number); + } + } + + &.lock__view, + &.is__mask { + &:before { + content: ''; + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: -1; + pointer-events: auto; + } + } + + &.is__animat { + &.is__mask { + &:before { + transition: background-color, 0.2s, ease-in-out; + } + } + + &.type__message { + .@{modal-prefix-cls}__box { + &:not(.is__drag) { + transition: all, 0.2s, ease-out; + } + } + } + } + + &.size__small, + &.size__mini { + font-size: var(--ti-modal-font-size); + + .@{modal-prefix-cls}__box { + padding: 6px 0; + } + + .@{modal-prefix-cls}__body { + padding: 4px 14px 10px 14px; + } + + .@{modal-prefix-cls}__footer { + padding: 4px 14px 8px 14px; + } + + .@{modal-prefix-cls}__header { + font-size: var(--ti-modal-header-font-size); + padding: 6px 30px 8px 14px; + } + + .@{modal-prefix-cls}__zoom-btn, + .@{modal-prefix-cls}__close-btn { + font-size: var(--ti-modal-small-btn-font-size); + top: 10px; + } + } + + &.type__message, + &.type__alert, + &.type__confirm { + .@{modal-prefix-cls}__body { + white-space: normal; + word-break: break-word; + } + } + + &.type__message { + text-align: center; + + .@{modal-prefix-cls}__box { + display: inline-block; + padding: 24px; + margin-top: 0; + width: auto; + box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1); + transform: translateY(-10%); + + .@{modal-prefix-cls}__body { + &:after { + content: ''; + display: block; + clear: both; + height: 0; + overflow: hidden; + visibility: hidden; + } + } + + .@{modal-prefix-cls}__content { + max-width: 800px; + float: left; + } + } + + .@{modal-prefix-cls}__status-wrapper { + font-size: var(--ti-modal-small-btn-font-size); + padding-right: 10px; + } + } + + &.type__modal, + &.type__alert, + &.type__confirm { + .@{modal-prefix-cls}__box { + display: flex; + flex-direction: column; + position: absolute; + left: 50%; + top: 0; + box-shadow: var(--ti-modal-box-shadow); + border: 1px solid var(--ti-modal-border-color); + + .@{modal-prefix-cls}__header { + cursor: move; + } + } + } + + &.type__modal { + .@{modal-prefix-cls}__body { + overflow: auto; + + .@{modal-prefix-cls}__content { + overflow: auto; + } + } + } + + &.type__alert, + &.type__confirm { + .@{modal-prefix-cls}__status-wrapper { + font-size: var(--ti-modal-alert-font-size); + padding: 0 10px 0 2px; + } + } + + &.status__info { + .@{modal-prefix-cls}__status-wrapper { + fill: var(--ti-modal-primary-icon-color); + } + } + + &.status__warning, + &.status__question { + .@{modal-prefix-cls}__status-wrapper { + fill: var(--ti-modal-warning-icon-color); + } + } + + &.status__success { + .@{modal-prefix-cls}__status-wrapper { + fill: var(--ti-modal-success-icon-color); + } + } + + &.status__error { + .@{modal-prefix-cls}__status-wrapper { + fill: var(--ti-modal-error-icon-color); + } + } + + &.status__loading { + .@{modal-prefix-cls}__status-wrapper { + fill: var(--ti-modal-loading-icon-color); + } + } + + &.is__maximize { + .@{modal-prefix-cls}__box { + .@{modal-prefix-cls}__header { + cursor: default; + } + } + + .@{modal-prefix-cls}__resize { + .wl-resize, + .wr-resize, + .swst-resize, + .sest-resize, + .st-resize, + .swlb-resize, + .selb-resize, + .sb-resize { + display: none; + } + } + } + } + + &__box { + width: var(--ti-modal-box-width); + background-color: var(--ti-modal-box-background-color); + border-radius: var(--ti-modal-box-border-radius); + font-size: var(--ti-modal-header-font-size); + box-shadow: var(--ti-common-shadow-4-down); + text-align: left; + pointer-events: auto; + visibility: hidden; + opacity: 0; + + &.is__drag { + cursor: move; + + .@{modal-prefix-cls}__body, + .@{modal-prefix-cls}__footer { + &:after { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + } + } + + .@{modal-prefix-cls}__body { + overflow: hidden; + + .@{modal-prefix-cls}__content { + overflow: hidden; + } + } + } + } + + &__status-wrapper { + flex-shrink: 0; + display: flex; + align-items: center; + } + + &__status-icon { + font-style: normal; + } + + &__content { + width: 100%; + flex-grow: 1; + } + + &__header, + &__body, + &__footer { + position: relative; + } + + &__body { + display: flex; + flex-grow: 1; + padding: var(--ti-modal-body-padding-top) var(--ti-modal-body-padding-horizontal) var(--ti-modal-body-padding-bottom); + } + + &__header { + flex-shrink: 0; + color: var(--ti-modal-header-text-color); + font-size: var(--ti-modal-header-font-size); + display: flex; + align-items: center; + font-weight: var(--ti-modal-header-font-weight); + border-bottom: none; + padding: var(--ti-modal-header-padding-top) var(--ti-modal-header-padding-horizontal) var(--ti-modal-header-padding-bottom); + user-select: none; + } + + &__zoom-btn, + &__close-btn { + font-size: var(--ti-modal-close-btn-font-size); + position: absolute; + right: 24px; + top: var(--ti-modal-close-btn-top); + z-index: 1; + fill: var(--ti-modal-btn-text-color); + transform: var(--ti-modal-close-btn-scale); + cursor: pointer; + padding: var(--ti-modal-close-btn-padding-horizontal-vertical); + border-radius: 4px; + + &:hover { + fill: var(--ti-modal-btn-text-color); + background-color:var(--ti-modal-close-btn-background-color-hover) + } + } + + &__zoom-btn { + right: 44px; + border-color: #c0c4cc; + + &:hover { + border-color: #606266; + } + } + + &__footer { + flex-shrink: 0; + text-align: center; + padding: var(--ti-modal-footer-padding-top) var(--ti-modal-footer-padding-horizontal) var(--ti-modal-footer-padding-bottom); + .@{button-prefix-cls}{ + border-radius: var(--ti-modal-footer-btn-border-radius); + } + .@{button-default-prefix-cls}{ + display: var(--ti-modal-footer-default-display-button); + } + } + + &__resize { + @SpaceSize: 8px; + + .wl-resize, + .wr-resize, + .swst-resize, + .sest-resize, + .st-resize, + .swlb-resize, + .selb-resize, + .sb-resize { + position: absolute; + z-index: 100; + } + + .wl-resize, + .wr-resize { + width: @SpaceSize; + height: 100%; + top: 0; + cursor: w-resize; + } + + .wl-resize { + left: -@SpaceSize / 2 + 1; + } + + .wr-resize { + right: -@SpaceSize / 2 + 1; + } + + .swst-resize, + .sest-resize, + .swlb-resize, + .selb-resize { + width: @SpaceSize + 2; + height: @SpaceSize + 2; + z-index: 101; + } + + .swst-resize, + .sest-resize { + top: -@SpaceSize; + } + + .swlb-resize, + .selb-resize { + bottom: -@SpaceSize; + } + + .sest-resize, + .swlb-resize { + cursor: sw-resize; + } + + .swst-resize, + .selb-resize { + cursor: se-resize; + } + + .swst-resize, + .swlb-resize { + left: -@SpaceSize; + } + + .sest-resize, + .selb-resize { + right: -@SpaceSize; + } + + .st-resize, + .sb-resize { + width: 100%; + height: @SpaceSize; + left: 0; + cursor: s-resize; + } + + .st-resize { + top: -@SpaceSize / 2 + 1; + } + + .sb-resize { + bottom: -@SpaceSize / 2 + 1; + } + } +} + +@keyframes modal-fade-in { + 0% { + transform: translate3d(0, -20px, 0); + opacity: 0; + } + + 100% { + transform: translate3d(0, 0, 0); + opacity: 1; + } +} + +@keyframes modal-fade-out { + 0% { + transform: translate3d(0, 0, 0); + opacity: 1; + } + + 100% { + transform: translate3d(0, -20px, 0); + opacity: 0; + } +} + +@keyframes modal-fade-in { + 0% { + transform: translate3d(0, -20px, 0); + opacity: 0; + } + + 100% { + transform: translate3d(0, 0, 0); + opacity: 1; + } +} + +@keyframes modal-fade-out { + 0% { + transform: translate3d(0, 0, 0); + opacity: 1; + } + + 100% { + transform: translate3d(0, -20px, 0); + opacity: 0; + } +} \ No newline at end of file diff --git a/packages/theme/src/modal/vars.less b/packages/theme/src/modal/vars.less new file mode 100644 index 000000000..f4c14756e --- /dev/null +++ b/packages/theme/src/modal/vars.less @@ -0,0 +1,53 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-modal() { + --ti-modal-font-size: var(--ti-common-font-size-base); + --ti-modal-text-color: var(--ti-base-color-info-normal); + --ti-modal-font-family: Helvetica, Arial, 'Microsoft YaHei', sans-serif; + + --ti-modal-primary-icon-color: var(--ti-common-color-prompt); + --ti-modal-success-icon-color: var(--ti-common-color-success); + --ti-modal-error-icon-color: var(--ti-common-color-error); + --ti-modal-warning-icon-color: var(--ti-common-color-warn); + + --ti-modal-loading-icon-color: var(--ti-common-color-prompt); + --ti-modal-alert-font-size: 22px; + + --ti-modal-header-font-size: var(--ti-common-font-size-3); + --ti-modal-header-text-color: var(--ti-common-color-text-primary); + --ti-modal-header-font-weight: var(--ti-base-font-weight-bold); + --ti-modal-header-padding-top: 32px; + --ti-modal-header-padding-horizontal: 32px; + --ti-modal-header-padding-bottom: 12px; + + --ti-modal-body-padding-top: 0; + --ti-modal-body-padding-horizontal: 32px; + --ti-modal-body-padding-bottom: 0; + --ti-modal-footer-padding-top: 28px; + --ti-modal-footer-padding-horizontal: 32px; + --ti-modal-footer-padding-bottom: 32px; + --ti-modal-footer-btn-border-radius: var(--ti-common-border-radius-normal); + --ti-modal-close-btn-font-size: var(--ti-common-font-size-1); + --ti-modal-close-btn-top: 13px; + --ti-modal-close-btn-scale: scale(1, 1); + --ti-modal-close-btn-padding-horizontal-vertical: 0; + --ti-modal-small-btn-font-size: var(--ti-common-font-size-2); + --ti-modal-box-background-color: var(--ti-base-color-light); + --ti-modal-btn-text-color: var(--ti-base-color-common-5); + --ti-modal-box-shadow: var(--ti-common-shadow-4-down); + --ti-modal-box-border-radius: var(--ti-common-border-radius-normal); + --ti-modal-border-color: rgba(0, 0, 0, 0.2); + --ti-modal-close-btn-background-color-hover: var(--ti-base-color-light); + --ti-modal-footer-default-display-button: inline-block; + --ti-modal-box-width: 400px; +} diff --git a/packages/theme/src/nav-menu/index.js b/packages/theme/src/nav-menu/index.js new file mode 100644 index 000000000..ae4c8fc9e --- /dev/null +++ b/packages/theme/src/nav-menu/index.js @@ -0,0 +1,28 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-nav-menu-height': '48px', + 'tiny-nav-menu-bg-color': '#2e3243', + 'tiny-nav-menu-item-font-size': '16px', + 'tiny-nav-menu-item-text-color': '#fff', + 'tiny-nav-menu-item-hover-bg-color': '#474c5e', + 'tiny-nav-menu-setting-font-size': '22px', + 'tiny-nav-menu-popmenu-text-color': '#333', + 'tiny-nav-menu-popmenu-border-color': '#d9d9d9', + 'tiny-nav-menu-popmenu-more-item-height': '40px', + 'tiny-nav-menu-popmenu-more-item-hover-text-color': '#1890ff', + 'tiny-nav-menu-popmenu-more-item-hover-bg-color': '#e6f7ff', + 'tiny-nav-menu-popmenu-more-item-active-bg-color': '#f5f5f5', + 'tiny-nav-menu-popmenu-node-title-font-size': '14px', + 'tiny-nav-menu-popmenu-node-item-font-size': '12px' +} diff --git a/packages/theme/src/nav-menu/index.less b/packages/theme/src/nav-menu/index.less new file mode 100644 index 000000000..f61940a7d --- /dev/null +++ b/packages/theme/src/nav-menu/index.less @@ -0,0 +1,355 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; +@import '../transition/zoom-in-top.less'; + +@nav-menu-prefix-cls: ~'@{css-prefix}nav-menu'; + +.@{nav-menu-prefix-cls} { + .component-css-vars-nav-menu(); + + background: var(--ti-nav-menu-bg-color); + height: var(--ti-nav-menu-height); + position: relative; + padding: 0 24px; + + > .slot-logo { + float: left; + overflow: hidden; + margin: 0 100px 0 0; + line-height: var(--ti-nav-menu-height); + } + + > .slot-toolbar { + float: right; + + > .setting { + position: relative; + float: right; + margin: 0 0 0 24px; + + > .@{css-prefix}icon { + font-size: var(--ti-nav-menu-setting-font-size); + line-height: var(--ti-nav-menu-height); + cursor: pointer; + color: #fff; + } + + > .more-setting { + position: absolute; + right: 0; + min-width: 120px; + background-color: var(--ti-nav-menu-item-text-color); + border: 1px solid #d9d9d9; + box-shadow: 0px 0 4px rgba(0, 0, 0, 0.15); + + > .setting-item { + padding: 6px 10px; + color: #333; + + &:hover { + background: var(--ti-nav-menu-popmenu-more-item-hover-bg-color); + } + + &:active { + background: var(--ti-nav-menu-popmenu-more-item-active-bg-color); + } + } + } + } + + > .template-toolbar { + .@{css-prefix}selector { + margin-top: 0; + } + } + } + + > .menu { + float: left; + height: var(--ti-nav-menu-height); + line-height: var(--ti-nav-menu-height); + overflow: hidden; + + > li { + float: left; + + > span, + > a { + padding: 0 12px; + font-size: var(--ti-nav-menu-item-font-size); + text-align: center; + color: var(--ti-nav-menu-item-text-color); + cursor: pointer; + display: block; + height: var(--ti-nav-menu-height); + line-height: var(--ti-nav-menu-height); + box-sizing: border-box; + + &.active, + &:hover { + // 规范选中后,背景色修改 + color: var(--ti-nav-menu-item-text-color); + background: var(--ti-nav-menu-item-hover-bg-color); + text-decoration: none; + } + + &.selected { + border-bottom: 3px solid #fff; + } + } + } + } + + > .more { + padding: 0 12px; + font-size: var(--ti-nav-menu-item-font-size); + text-align: center; + color: var(--ti-nav-menu-item-text-color); + cursor: pointer; + display: inline-block; + height: var(--ti-nav-menu-height); + line-height: var(--ti-nav-menu-height); + + &.active, + &:hover, + &.selected { + color: var(--ti-nav-menu-item-text-color); + background: var(--ti-nav-menu-item-hover-bg-color); + } + + &.selected { + border-bottom: 3px solid #fff; + } + } + + > .popmenu { + position: absolute; + background: #fff; + width: 100%; + border: 1px solid var(--ti-nav-menu-popmenu-border-color); + box-shadow: 0 0 4px var(--ti-nav-menu-popmenu-border-color); + max-height: calc(100vh - var(--ti-nav-menu-height)); + overflow-y: auto; + left: 0; + + > .more-menu { + float: left; + width: 160px; + height: 100%; + border-right: 1px solid var(--ti-nav-menu-popmenu-border-color); + box-sizing: border-box; + + > ul { + list-style: none; + + > li { + height: var(--ti-nav-menu-popmenu-more-item-height); + line-height: var(--ti-nav-menu-popmenu-more-item-height); + padding: 0 12px 0 24px; + display: flex; + justify-content: space-between; + align-items: center; + + &.active, + &:hover { + color: var(--ti-nav-menu-popmenu-more-item-hover-text-color); + background: var(--ti-nav-menu-popmenu-more-item-hover-bg-color); + + .more-icon { + fill: var(--ti-nav-menu-popmenu-more-item-hover-text-color); + } + } + + > a { + color: var(--ti-nav-menu-popmenu-text-color); + } + + > span, + > a { + display: block; + height: var(--ti-nav-menu-popmenu-more-item-height); + line-height: var(--ti-nav-menu-popmenu-more-item-height); + font-size: var(--ti-common-font-size-base); + width: 100%; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + + &.showicon { + width: calc(~'100% - 12px'); + } + } + + > .more-icon { + font-size: var(--ti-common-font-size-base); + } + } + } + } + + > .sub-menu { + float: left; + width: ~'calc(100% - 160px)'; + padding-left: 14px; + box-sizing: border-box; + + &.full-width { + width: 100%; + padding: 0 86px; + } + + > ul { + list-style: none; + overflow: hidden; + + .group { + list-style: none; + margin-bottom: 24px; + + &:first-child { + margin-top: 18px; + } + + > .@{nav-menu-prefix-cls}__sub-menu-title { + color: var(--ti-nav-menu-popmenu-text-color); + font-size: var(--ti-nav-menu-popmenu-node-title-font-size); + font-weight: bold; + margin: 0 0 12px 0; + word-break: break-all; + + &:only-child { + border-bottom: none; + } + } + + > .sub-item { + font-size: var(--ti-nav-menu-popmenu-node-item-font-size); + padding: 4px 0; + + &:hover { + background: var(--ti-nav-menu-popmenu-more-item-hover-bg-color); + } + + &.active, + &:active { + background: var(--ti-nav-menu-popmenu-more-item-active-bg-color); + } + + > a { + color: var(--ti-nav-menu-popmenu-text-color); + white-space: normal; + word-break: break-all; + text-decoration: none; + } + + > span { + color: var(--ti-nav-menu-popmenu-text-color); + white-space: normal; + word-break: break-all; + } + } + } + } + } + } + + > .single { + width: auto; + height: auto; + padding: 0; + + > .sub-menu.full-width { + padding: 0; + + > ul .group { + margin: 0; + + .@{nav-menu-prefix-cls}__sub-menu-title { + padding: 18px 35px 0 12px; + + &.@{nav-menu-prefix-cls}__sub-menu-title-blank { + padding: 0 35px 0 12px; + } + } + + > .title { + margin: 0; + line-height: 40px; + padding: 0 35px 0 12px; + } + + > .sub-item { + height: 40px; + line-height: 40px; + padding: 0 35px 0 12px; + margin: 0; + + &:hover { + background: var(--ti-nav-menu-popmenu-more-item-hover-bg-color); + } + + &:active, + &.active { + background: var(--ti-nav-menu-popmenu-more-item-active-bg-color); + } + } + } + } + } + + > .more-button { + float: left; + text-align: center; + padding: 0 12px; + height: var(--ti-nav-menu-height); + line-height: var(--ti-nav-menu-height); + overflow: hidden; + fill: #fff; + font-size: var(--ti-nav-menu-item-font-size); + + &:hover { + background: var(--ti-nav-menu-item-hover-bg-color); + } + + &.float-right { + float: right; + margin-left: 10px; + } + } + + > .slot-mobile-menu { + display: none; + } + + @media (max-width: 768px) { + > .more-button.mobile { + display: none; + } + + > .slot-mobile-menu { + display: block; + } + + > .menu { + display: none; + } + + > .popmenu { + .sub-menu .full-width { + padding: 0; + } + } + } +} diff --git a/packages/theme/src/nav-menu/vars.less b/packages/theme/src/nav-menu/vars.less new file mode 100644 index 000000000..6914f5f73 --- /dev/null +++ b/packages/theme/src/nav-menu/vars.less @@ -0,0 +1,28 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-nav-menu() { + --ti-nav-menu-height: var(--ti-base-size-height-large); + --ti-nav-menu-bg-color: var(--ti-base-color-navigation-background); + --ti-nav-menu-item-font-size: var(--ti-common-font-size-2); + --ti-nav-menu-item-text-color: var(--ti-base-color-light); + --ti-nav-menu-item-hover-bg-color: #474c5e; + --ti-nav-menu-setting-font-size: 22px; + --ti-nav-menu-popmenu-text-color: var(--ti-base-color-info-normal); + --ti-nav-menu-popmenu-border-color: var(--ti-base-color-border); + --ti-nav-menu-popmenu-more-item-height: 40px; + --ti-nav-menu-popmenu-more-item-hover-text-color: var(--ti-base-color-brand-6); + --ti-nav-menu-popmenu-more-item-hover-bg-color: var(--ti-base-color-hover-background); + --ti-nav-menu-popmenu-more-item-active-bg-color: var(--ti-base-color-selected-background); + --ti-nav-menu-popmenu-node-title-font-size: var(--ti-common-font-size-1); + --ti-nav-menu-popmenu-node-item-font-size: var(--ti-common-font-size-base, 12px); +} diff --git a/packages/theme/src/notify/index.js b/packages/theme/src/notify/index.js new file mode 100644 index 000000000..5f97733fa --- /dev/null +++ b/packages/theme/src/notify/index.js @@ -0,0 +1,41 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-notify-bg-color': '#ffffff', + 'tiny-notify-text-color': '#1890ff', + 'tiny-notify-border-radius': '2px', + 'tiny-notify-title-text-color': '#333', + 'tiny-notify-title-font-size': '14px', + 'tiny-notify-title-font-weight': '700', + 'tiny-notify-title-height': '30px', + 'tiny-notify-title-line-height': '30px', + 'tiny-notify-title-margin-top': '0', + 'tiny-notify-title-margin-horizontal': '0', + 'tiny-notify-title-margin-bottom': '0', + 'tiny-notify-content-font-size': '14px', + 'tiny-notify-message-margin-vertical': '0', + 'tiny-notify-message-margin-right': '0', + 'tiny-notify-message-margin-left': '10px', + 'tiny-notify-info-bg-color': '#ebf6ff', + 'tiny-notify-info-icon-color': '#5e7ce0', + 'tiny-notify-warning-bg-color': '#fff3e8', + 'tiny-notify-warning-icon-color': '#fa9841', + 'tiny-notify-error-bg-color': '#ffeeed', + 'tiny-notify-error-icon-color': '#f66f6a', + 'tiny-notify-success-bg-color': '#edfff9', + 'tiny-notify-success-icon-color': '#50d4ab', + 'tiny-notify-icon-size': '24px', + 'tiny-notify-close-icon-color': '#252b3a', + 'tiny-notify-max-width': '400px', + 'tiny-notify-box-shadow': '0 8px 40px 0 rgba(0, 0, 0, 0.2)' +} diff --git a/packages/theme/src/notify/index.less b/packages/theme/src/notify/index.less new file mode 100644 index 000000000..01394f39b --- /dev/null +++ b/packages/theme/src/notify/index.less @@ -0,0 +1,188 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@notify-prefix-cls: ~'@{css-prefix}notify'; + +.@{notify-prefix-cls} { + .component-css-vars-notify(); + + position: fixed; + z-index: 1101; + max-width: var(--ti-notify-max-width); + width: 100%; + box-sizing: border-box; + transition: all 0.3s; + overflow: hidden; + white-space: nowrap; + padding: 16px; + background: var(--ti-notify-bg-color); + border-radius: 2px; + border-radius: var(--ti-notify-border-radius); + font-size: var(--ti-common-font-size-base); + display: flex; + flex-direction: row; + align-items: flex-start; + box-shadow: var(--ti-notify-box-shadow); + + &--info { + background: var(--ti-notify-info-bg-color); + } + + &--warning { + background: var(--ti-notify-warning-bg-color); + } + + &--error { + background: var(--ti-notify-error-bg-color); + } + + &--success { + background: var(--ti-notify-success-bg-color); + } + + &.top-left { + left: 10px; + top: 25px; + } + + &.bottom-left { + left: 10px; + bottom: 25px; + } + + &.top-right { + right: 10px; + top: 25px; + } + + &.bottom-right { + right: 10px; + bottom: 25px; + } + + & &__title { + font-weight: var(--ti-notify-title-font-weight); + font-size: var(--ti-notify-title-font-size); + color: var(--ti-notify-title-text-color); + line-height: 1.74; + } + + & &__icon { + color: var(--ti-notify-text-color); + } + + & &__content { + color: var(--ti-notify-title-text-color); + font-size: var(--ti-common-font-size-base); + margin: 0; + padding: 0; + font-size: var(--ti-common-font-size-1); + word-break: break-all; + white-space: pre-wrap; + } + + & &__closebtn { + cursor: pointer; + color: var(--ti-notify-text-color); + position: absolute; + top: 50%; + right: 10px; + transform: translateY(-50%); + } + + & &__icon-zone { + width: 24px; + height: 24px; + font-size: var(--ti-notify-icon-size); + } + + & &__message-zone { + width: calc(100% - 40px); + margin: var(--ti-notify-message-margin-vertical) var(--ti-notify-message-margin-right) var(--ti-notify-message-margin-vertical) + var(--ti-notify-message-margin-left); + } + + & &__close-zone { + width: 16px; + height: 16px; + font-size: var(--ti-common-font-size-2); + cursor: pointer; + } + + &--info &__icon-zone { + fill: var(--ti-notify-info-icon-color); + } + + &--info &__close-zone { + fill: var(--ti-notify-close-icon-color); + } + + &--warning &__icon-zone { + fill: var(--ti-notify-warning-icon-color); + } + + &--warning &__close-zone { + fill: var(--ti-notify-close-icon-color); + } + + &--error &__icon-zone { + fill: var(--ti-notify-error-icon-color); + } + + &--error &__close-zone { + fill: var(--ti-notify-close-icon-color); + } + + &--success &__icon-zone { + fill: var(--ti-notify-success-icon-color); + } + + &--error &__close-zone { + fill: var(--ti-notify-close-icon-color); + } + + &__icon-zone &__icon-status { + position: relative; + } + + &--no-close &__message-zone { + width: calc(100% - 24px); + } + + &__message-zone &__title-wrapper { + color: var(--ti-notify-title-text-color); + font-size: var(--ti-notify-title-font-size); + margin: var(--ti-notify-title-margin-top) var(--ti-notify-title-margin-horizontal) var(--ti-notify-title-margin-bottom); + height: var(--ti-notify-title-height); + line-height: var(--ti-notify-title-line-height); + } + + &__message-zone &__content-wrapper { + height: auto; + line-height: 24px; + max-height: 96px; + overflow-y: auto; + font-size: var(--ti-notify-content-font-size); + } + + &__close-zone &__icon-close { + position: relative; + top: 6px; + } + + &--no-icon &__message-zone { + width: 100%; + } +} diff --git a/packages/theme/src/notify/vars.less b/packages/theme/src/notify/vars.less new file mode 100644 index 000000000..122f073c7 --- /dev/null +++ b/packages/theme/src/notify/vars.less @@ -0,0 +1,47 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-notify() { + --ti-notify-bg-color: var(--ti-common-color-prompt-bg); + --ti-notify-info-bg-color: var(--ti-common-color-prompt-bg); + --ti-notify-info-icon-color: var(--ti-common-color-prompt); + + --ti-notify-warning-bg-color: var(--ti-common-color-warn-bg); + --ti-notify-warning-icon-color: var(--ti-common-color-warn); + + --ti-notify-error-bg-color: var(--ti-common-color-error-bg); + --ti-notify-error-icon-color: var(--ti-common-color-error); + + --ti-notify-success-bg-color: var(--ti-common-color-success-bg); + --ti-notify-success-icon-color: var(--ti-common-color-success); + + --ti-notify-text-color: var(--ti-base-color-brand-6); + --ti-notify-border-radius: var(--ti-common-border-radius-normal); + + --ti-notify-title-text-color: var(--ti-base-color-info-normal); + --ti-notify-title-font-size: var(--ti-common-font-size-1); + --ti-notify-title-font-weight: var(--ti-common-font-weight-7); + --ti-notify-title-height: 30px; + --ti-notify-title-line-height: 30px; + --ti-notify-title-margin-top: 0; + --ti-notify-title-margin-horizontal: 0; + --ti-notify-title-margin-bottom: 0; + + --ti-notify-content-font-size: var(--ti-common-font-size-1); + --ti-notify-message-margin-vertical: 6px; + --ti-notify-message-margin-right: 0; + --ti-notify-message-margin-left: 10px; + --ti-notify-icon-size: var(--ti-common-font-size-5); + --ti-notify-close-icon-color: var(--ti-base-color-common-7); + --ti-notify-max-width: 400px; + --ti-notify-box-shadow: var(--ti-common-shadow-4-down); +} diff --git a/packages/theme/src/numeric/index.js b/packages/theme/src/numeric/index.js new file mode 100644 index 000000000..f48b059c6 --- /dev/null +++ b/packages/theme/src/numeric/index.js @@ -0,0 +1,26 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-numeric-input-width': '180px', + 'tiny-numeric-input-border-radius': '2px', + 'tiny-numeric-input-normal-border-color': '#d9d9d9', + 'tiny-numeric-input-normal-text-color': '#333', + 'tiny-numeric-input-normal-bg-color': '#fff', + 'tiny-numeric-input-normal-height': '30px', + 'tiny-numeric-input-normal-active-border-color': '#1890ff', + 'tiny-numeric-input-placeholder-text-color': '#999', + 'tiny-numeric-input-disabled-bg-color': '#f5f5f5', + 'tiny-numeric-input-icon-color-hover': '#40a9ff', + 'tiny-numeric-input-icon-color-disabled': '#bfbfbf', + 'tiny-numeric-input-border-color-disabled': '#d9d9d9' +} diff --git a/packages/theme/src/numeric/index.less b/packages/theme/src/numeric/index.less new file mode 100644 index 000000000..f6e9d9062 --- /dev/null +++ b/packages/theme/src/numeric/index.less @@ -0,0 +1,313 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/input.less'; +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +@numeric-prefix-cls: ~'@{css-prefix}numeric'; +@input-prefix-cls: ~'@{css-prefix}input'; + +.@{numeric-prefix-cls} { + .component-css-vars-numeric(); + + position: relative; + display: inline-block; + width: var(--ti-numeric-input-width); + + &__input { + display: block; + line-height: normal; + + &.is-disabled &-inner { + cursor: not-allowed; + pointer-events: none; + border: 1px solid var(--ti-numeric-input-border-color-disabled); + color: var(--ti-numeric-input-placeholder-text-color); + background: var(--ti-numeric-input-disabled-bg-color); + .placeholder(@color: #bfbfbf); + } + + &.is-disabled .@{input-prefix-cls}__icon { + cursor: not-allowed; + } + &.has-unit { + .@{numeric-prefix-cls}__input-inner { + padding: 0 50px 0 8px; + } + } + &.text-align-left { + .@{numeric-prefix-cls}__input-inner { + text-align: left; + } + } + } + + &__input-inner { + width: 100%; + height: var(--ti-numeric-input-normal-height); + line-height: var(--ti-numeric-input-normal-height); + border: 1px solid var(--ti-numeric-input-normal-border-color); + border-radius: var(--ti-numeric-input-border-radius); + color: var(--ti-numeric-input-normal-text-color); + background: var(--ti-numeric-input-normal-bg-color); + font-size: var(--ti-common-font-size-base); + padding: 0 calc(var(--ti-numeric-input-normal-height) + 8px); + outline: 0; + display: inline-block; + box-sizing: border-box; + appearance: none; + text-align: center; + transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); + .placeholder(@color: var(--ti-numeric-input-placeholder-text-color)); + + &:hover { + border: 1px solid var(--ti-numeric-input-normal-active-border-color); + } + + &:focus, + &:active { + border: 1px solid var(--ti-base-color-brand-6); + } + + &:focus { + outline: 0; + .placeholder(@color: var(--ti-numeric-input-placeholder-text-color)); + } + + &::-ms-clear { + display: none; + width: 0; + height: 0; + } + } + + &__decrease, + &__increase { + position: absolute; + z-index: 1; + top: 1px; + width: 30px; + height: calc(100% - 2px); + line-height: calc(var(--ti-numeric-input-normal-height) - 2px); + display: flex; + align-items: center; + justify-content: center; + font-size: var(--ti-common-font-size-1); + text-align: center; + cursor: pointer; + + svg { + fill: var(--ti-numeric-input-normal-active-border-color); + } + + &:hover { + &:not(.is-disabled) { + & ~ .@{numeric-prefix-cls}__input .@{numeric-prefix-cls}__input-inner:not(.is-disabled) { + border-color: var(--ti-numeric-input-icon-color-hover); + } + + & ~ .@{numeric-prefix-cls}__input.is-disabled .@{numeric-prefix-cls}__input-inner:not(.is-disabled) { + border-color: var(--ti-numeric-input-normal-border-color); + } + } + + svg { + fill: var(--ti-numeric-input-icon-color-hover); + } + } + + &.is-disabled { + cursor: not-allowed; + + svg { + fill: var(--ti-numeric-input-icon-color-disabled); + } + } + } + + &__increase { + right: 1px; + border-radius: 0 4px 4px 0; + border-left: 1px solid var(--ti-numeric-input-normal-border-color); + } + + &__decrease { + left: 1px; + border-radius: 4px 0 0 4px; + border-right: 1px solid var(--ti-numeric-input-normal-border-color); + } + + &__unit { + right: 0; + position: absolute; + z-index: 1; + top: 1px; + width: 50px; + height: calc(100% - 2px); + color: #666666; + font-size: var(--ti-common-font-size-base); + display: flex; + justify-content: center; + align-items: center; + border-left: 1px solid #d9d9d9; + margin: 0 1px 0 0; + background: #f1f1f1; + } + &.is-disabled &__decrease, + &.is-disabled &__increase { + border-color: var(--ti-numeric-input-border-color-disabled); + + svg { + fill: var(--ti-numeric-input-icon-color-disabled); + } + + &:hover { + cursor: not-allowed; + + svg { + fill: var(--ti-numeric-input-icon-color-disabled); + } + } + } + + &--medium { + width: 270px; + + .@{numeric-prefix-cls}__decrease, + .@{numeric-prefix-cls}__increase { + width: 42px; + line-height: 40px; + font-size: var(--ti-common-font-size-2); + } + + .@{numeric-prefix-cls}__input-inner { + height: 42px; + line-height: 42px; + padding-left: 43px; + padding-right: 43px; + } + } + + &--small { + width: 200px; + + .@{numeric-prefix-cls}__decrease, + .@{numeric-prefix-cls}__increase { + width: 36px; + line-height: 34px; + font-size: var(--ti-common-font-size-1); + } + + .@{numeric-prefix-cls}__input-inner { + height: 36px; + line-height: 36px; + padding-left: 37px; + padding-right: 37px; + } + } + + &--mini { + width: 130px; + + .@{numeric-prefix-cls}__decrease, + .@{numeric-prefix-cls}__increase { + width: 24px; + line-height: 20px; + font-size: var(--ti-common-font-size-base); + } + + .@{numeric-prefix-cls}__input-inner { + height: 24px; + line-height: 24px; + padding-left: 35px; + padding-right: 35px; + } + } + + &.is-without-controls { + .@{numeric-prefix-cls}__input-inner { + padding-left: 8px; + padding-right: 8px; + } + .@{numeric-prefix-cls}__input { + &.has-unit { + .@{numeric-prefix-cls}__input-inner { + padding: 0 50px 0 8px; + } + } + &.text-align-left { + .@{numeric-prefix-cls}__input-inner { + text-align: left; + } + } + } + } + + &.is-controls-right { + .@{numeric-prefix-cls}__input-inner { + padding-left: 8px; + padding-right: 38px; + } + + .@{numeric-prefix-cls}__decrease, + .@{numeric-prefix-cls}__increase { + height: auto; + line-height: 14px; + + svg { + transform: scale(0.8); + } + } + + .@{numeric-prefix-cls}__increase { + border-radius: 0 4px 0 0; + border-bottom: 1px solid var(--ti-numeric-input-normal-border-color); + } + + .@{numeric-prefix-cls}__decrease { + right: 1px; + bottom: 1px; + top: auto; + left: auto; + border-right: none; + border-left: 1px solid var(--ti-numeric-input-normal-border-color); + border-radius: 0 0 4px; + + svg { + transform: scale(0.8) translateY(3px); + } + } + + &[class*='medium'] { + [class*='decrease'], + [class*='increase'] { + line-height: 20px; + } + } + + &[class*='small'] { + [class*='decrease'], + [class*='increase'] { + line-height: 17px; + } + } + + &[class*='mini'] { + [class*='decrease'], + [class*='increase'] { + line-height: 8px; + } + } + } +} diff --git a/packages/theme/src/numeric/vars.less b/packages/theme/src/numeric/vars.less new file mode 100644 index 000000000..b03518693 --- /dev/null +++ b/packages/theme/src/numeric/vars.less @@ -0,0 +1,26 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-numeric() { + --ti-numeric-input-width: 180px; + --ti-numeric-input-border-radius: var(--ti-common-border-radius-normal); + --ti-numeric-input-normal-border-color: var(--ti-base-color-border); + --ti-numeric-input-normal-text-color: var(--ti-base-color-info-normal); + --ti-numeric-input-normal-bg-color: var(--ti-base-color-light); + --ti-numeric-input-normal-height: 28px; + --ti-numeric-input-normal-active-border-color: var(--ti-base-color-border-hover); + --ti-numeric-input-placeholder-text-color: var(--ti-base-color-placeholder); + --ti-numeric-input-disabled-bg-color: var(--ti-common-color-bg-disabled); + --ti-numeric-input-icon-color-hover: var(--ti-base-color-border-hover); + --ti-numeric-input-icon-color-disabled: var(--ti-common-color-icon-disabled); + --ti-numeric-input-border-color-disabled: var(--ti-common-color-line-disabled); +} diff --git a/packages/theme/src/option-group/index.js b/packages/theme/src/option-group/index.js new file mode 100644 index 000000000..6fec5d8f1 --- /dev/null +++ b/packages/theme/src/option-group/index.js @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-select-group-wrap-bg-color': '#e4e7ed', + 'tiny-select-group-title-font-size': '12px', + 'tiny-select-group-title-text-color': '#909399', + 'tiny-select-group-title-line-height': '30px' +} diff --git a/packages/theme/src/option-group/index.less b/packages/theme/src/option-group/index.less new file mode 100644 index 000000000..2e4022159 --- /dev/null +++ b/packages/theme/src/option-group/index.less @@ -0,0 +1,52 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@select-group-prefix-cls: ~'@{css-prefix}select-group'; + +.@{select-group-prefix-cls} { + .component-css-vars-option-group(); + + margin: 0; + padding: 0; + + &__wrap { + position: relative; + list-style: none; + margin: 0; + padding: 0; + + &:not(:last-of-type) { + padding-bottom: 24px; + } + + &:not(:last-of-type)::after { + content: ''; + position: absolute; + display: block; + left: 8px; + right: 8px; + bottom: 12px; + height: 1px; + background: var(--ti-select-group-wrap-bg-color); + } + + .@{select-group-prefix-cls}__title { + padding-left: 8px; + font-size: var(--ti-select-group-title-font-size); + color: var(--ti-select-group-title-text-color); + line-height: var(--ti-select-group-title-line-height); + } + } +} diff --git a/packages/theme/src/option-group/vars.less b/packages/theme/src/option-group/vars.less new file mode 100644 index 000000000..a3a9d03b9 --- /dev/null +++ b/packages/theme/src/option-group/vars.less @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-option-group() { + --ti-select-group-wrap-bg-color: #e4e7ed; + --ti-select-group-title-font-size: var(--ti-common-font-size-base); + --ti-select-group-title-text-color: #909399; + --ti-select-group-title-line-height: var(--ti-base-size-height-minor); +} diff --git a/packages/theme/src/option/index.js b/packages/theme/src/option/index.js new file mode 100644 index 000000000..0e6224998 --- /dev/null +++ b/packages/theme/src/option/index.js @@ -0,0 +1,26 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-select-dropdown-item-text-color': '#333', + 'tiny-select-dropdown-item-font-size': '12px', + 'tiny-select-dropdown-item-height': '30px', + 'tiny-select-dropdown-item-disabled-text-color': '#999', + 'tiny-select-dropdown-item-disabled-bg-color': '#fff', + 'tiny-select-dropdown-item-hover-bg-color': '#e6f7ff', + 'tiny-select-dropdown-item-selected-bg-color': '#f5f5f5', + 'tiny-select-dropdown-item-bg-color': '#fff', + 'tiny-select-dropdown-item-selected-text-color': '#fff', + 'tiny-select-dropdown-item-icon-color': '#bfbfbf', + 'tiny-select-dropdown-item-icon-font-size': '16px', + 'tiny-select-dropdown-item-icon-color-selected': '#1890ff' +} diff --git a/packages/theme/src/option/index.less b/packages/theme/src/option/index.less new file mode 100644 index 000000000..fafc016b8 --- /dev/null +++ b/packages/theme/src/option/index.less @@ -0,0 +1,90 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@select-dropdown-item-prefix-cls: ~'@{css-prefix}select-dropdown__item'; +@svg-prefix-cls: ~'@{css-prefix}svg'; +@select-dropdown-prefix-cls: ~'@{css-prefix}select-dropdown'; + +.@{select-dropdown-prefix-cls} { + .component-css-vars-option(); + &.is-multiple{ + .@{select-dropdown-item-prefix-cls} { + &.selected { + color: var(--ti-select-dropdown-item-text-color); + background-color: var(--ti-select-dropdown-item-bg-color); + + &.is-disabled { + color: var(--ti-select-dropdown-item-disabled-text-color); + + &:hover { + background-color: var(--ti-select-dropdown-item-disabled-bg-color); + } + } + } + } + } +} + +.@{select-dropdown-item-prefix-cls} { + position: relative; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + color: var(--ti-select-dropdown-item-text-color); + font-size: var(--ti-select-dropdown-item-font-size); + height: var(--ti-select-dropdown-item-height); + line-height: var(--ti-select-dropdown-item-height); + cursor: pointer; + + &.is-disabled { + color: var(--ti-select-dropdown-item-disabled-text-color); + cursor: not-allowed; + + &:hover { + background-color: var(--ti-select-dropdown-item-disabled-bg-color); + } + } + + &.hover, + &:hover { + background-color: var(--ti-select-dropdown-item-hover-bg-color); + } + + &.selected { + color: var(--ti-select-dropdown-item-selected-text-color); + background-color: var(--ti-select-dropdown-item-selected-bg-color); + } + + .@{svg-prefix-cls} { + fill: var(--ti-select-dropdown-item-icon-color); + font-size: var(--ti-select-dropdown-item-icon-font-size); + margin-right: 8px; + } + + &.selected .@{svg-prefix-cls}, + &.hover .@{svg-prefix-cls}, + .checked-sur.@{svg-prefix-cls}, + .halfselect.@{svg-prefix-cls} { + fill: var(--ti-select-dropdown-item-icon-color-selected); + } + + &.selected .@{svg-prefix-cls} { + fill: var(--ti-select-dropdown-item-icon-color-selected); + } + + &.memorize-highlight { + color: var(--ti-select-dropdown-item-icon-color-selected); + } +} diff --git a/packages/theme/src/option/vars.less b/packages/theme/src/option/vars.less new file mode 100644 index 000000000..a47235a43 --- /dev/null +++ b/packages/theme/src/option/vars.less @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-option() { + --ti-select-dropdown-item-text-color: var(--ti-base-color-info-normal); + --ti-select-dropdown-item-font-size: var(--ti-common-font-size-base); + --ti-select-dropdown-item-height: var(--ti-base-size-height-minor); + --ti-select-dropdown-item-disabled-text-color: var(--ti-base-color-placeholder); + --ti-select-dropdown-item-disabled-bg-color: var(--ti-base-color-light); + --ti-select-dropdown-item-bg-color: var(--ti-base-color-light); + --ti-select-dropdown-item-hover-bg-color: var(--ti-base-color-hover-background); + --ti-select-dropdown-item-selected-bg-color: var(--ti-base-color-selected-background); + --ti-select-dropdown-item-selected-text-color: var(--ti-base-color-selected-text-color); + --ti-select-dropdown-item-icon-color: var(--ti-common-color-line-normal); + --ti-select-dropdown-item-icon-font-size: var(--ti-common-font-size-2); + --ti-select-dropdown-item-icon-color-selected: var(--ti-base-color-brand-6); + --ti-select-dropdown-item-disabled-icon-color: var(--ti-common-color-icon-disabled); +} diff --git a/packages/theme/src/pager/index.js b/packages/theme/src/pager/index.js new file mode 100644 index 000000000..e345f3b53 --- /dev/null +++ b/packages/theme/src/pager/index.js @@ -0,0 +1,40 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-pager-normal-text-color': '#333333', + 'tiny-pager-primary-bg-color': '#1890ff', + 'tiny-pager-primary-text-color': '#1890ff', + 'tiny-pager-primary-border-color': '#1890ff', + 'tiny-pager-primary-hover-text-color': '#40a9ff', + 'tiny-pager-input-border-color': '#d9d9d9', + 'tiny-pager-input-hover-border-color': '#bfbfbf', + 'tiny-pager-input-stop-color': '#adb0b8', + 'tiny-pager-input-lighting-color': '#5e7ce0', + 'tiny-pager-poplist-item-padding-vertical': '0', + 'tiny-pager-poplist-item-padding-horizontal': '6px', + 'tiny-pager-poplist-item-unchecked-box-shadow': 'none', + 'tiny-pager-input-height': '24px', + 'tiny-pager-poplist-item-hover-text-color': '#526ecc', + 'tiny-pager-poplist-item-hover-border-color': 'transparent', + 'tiny-pager-font-size': '12px', + 'tiny-pager-text-color': '#6a788d', + 'tiny-pager-font-normal-text-color': '#666', + 'tiny-pager-height': '30px', + 'tiny-pager-input-width': '50px', + 'tiny-pager-input-border-radius': '2px', + 'tiny-pager-poplist-item-hover-bg-color': '#e6f7ff', + 'tiny-pager-poplist-item-selected-bg-color': '#f5f5f5', + 'tiny-pager-prev-next-text-color-disabled': '#dfe1e6', + 'tiny-pager-goto-btn-border-color': '#7693f5', + 'tiny-pager-goto-btn-text-color': '#7693f5' +} diff --git a/packages/theme/src/pager/index.less b/packages/theme/src/pager/index.less new file mode 100644 index 000000000..236cdf188 --- /dev/null +++ b/packages/theme/src/pager/index.less @@ -0,0 +1,366 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/tip.less'; +@import '../mixins/input.less'; +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; +@pager-prefix-cls: ~'@{css-prefix}pager'; +@popover-prefix-cls: ~'@{css-prefix}popover'; +@popper-prefix-cls: ~'@{css-prefix}popper'; + +.@{pager-prefix-cls} { + .component-css-vars-pager(); + + text-align: left; + padding: 12px 0; + color: var(--ti-pager-text-color); + + & &__group { + display: inline-flex; + align-items: center; + vertical-align: middle; + font-size: var(--ti-pager-font-size); + + > span { + display: inline-block; + vertical-align: middle; + } + } + + & &__total { + height: 24px; + line-height: 24px; + font-size: 12px; + color: var(--ti-pager-normal-text-color); + } + + & &__pages { + display: inline-flex; + font-size: var(--ti-pager-font-size); + + li { + background: transparent; + display: inline-block; + font-size: var(--ti-pager-font-size); + cursor: pointer; + margin-right: 4px; + text-align: center; + line-height: var(--ti-pager-height); + border-radius: var(--ti-pager-input-border-radius); + height: var(--ti-pager-height); + color: var(--ti-pager-text-color); + padding: var(--ti-pager-poplist-item-padding-vertical) var(--ti-pager-poplist-item-padding-horizontal); + box-sizing: border-box; + border: 1px solid transparent; + transition: all 0.5s ease; + + a { + color: var(--ti-pager-text-color); + } + + svg { + fill: var(--ti-pager-text-color); + vertical-align: middle; + } + + &:not(.dot):not(.is-active):hover { + color: var(--ti-pager-poplist-item-hover-text-color); + background-color: var(--ti-pager-poplist-item-hover-bg-color); + box-shadow: var(--ti-pager-poplist-item-unchecked-box-shadow); + border: 1px solid var(--ti-pager-poplist-item-hover-border-color); + svg { + fill: var(--ti-pager-poplist-item-hover-text-color); + } + } + + &.dot { + .icon { + font-size: 14px; + } + } + + &.is-active { + color: #fff; + background-color: var(--ti-pager-primary-bg-color); + } + } + li:last-child { + margin-right: 0; + } + } + + &__goto { + font-size: 0; + + input[type='text'] { + width: var(--ti-pager-input-width); + text-align: center; + vertical-align: middle; + border-radius: var(--ti-pager-input-border-radius); + display: inline-block; + position: inherit; + height: var(--ti-pager-input-height); + line-height: var(--ti-pager-input-height); + border: 1px solid var(--ti-pager-input-border-color); + color: var(--ti-pager-normal-text-color); + font-size: var(--ti-pager-font-size); + transition: border 0.3s; + outline: 0; + box-sizing: border-box; + margin-left: 14px; + margin-right: 4px; + + &:hover { + border: 1px solid var(--ti-pager-input-hover-border-color); + color: var(--ti-pager-normal-text-color); + } + + &:focus, + &:active, + &.active, + &[active] { + border: 1px solid var(--ti-pager-primary-border-color); + box-shadow: 0 0 0 rgba(0, 0, 0, 0); + } + } + + button { + height: var(--ti-pager-input-height); + line-height: var(--ti-pager-input-height); + border: 1px solid #d9d9d9; + color: var(--ti-pager-text-color); + vertical-align: middle; + border-radius: var(--ti-pager-input-border-radius); + background: #fff; + font-size: var(--ti-pager-font-size); + padding: 0 8px; + text-align: center; + display: inline-block; + box-sizing: border-box; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + cursor: pointer; + transition: border 0.3s, color 0.3s, background 0.3s; + outline: 0; + .user-select(none); + &:hover { + border: 1px solid var(--ti-pager-goto-btn-border-color); + color: var(--ti-pager-goto-btn-text-color); + } + } + } + + &__btn-prev, + &__btn-next { + height: var(--ti-pager-height); + line-height: var(--ti-pager-height); + display: inline-flex; + justify-content: center; + align-items: center; + font-size: var(--ti-pager-font-size); + font-weight: bolder; + color: var(--ti-pagination-prev-next-color); + outline: none; + border: none; + background: transparent; + margin: 0 4px; + padding: 0 6px; + vertical-align: middle; + cursor: pointer; + + span { + color: var(--ti-pager-primary-text-color); + } + + svg { + fill: var(--ti-pager-normal-text-color); + font-size: var(--ti-pager-font-size); + vertical-align: middle; + } + + &:hover { + background-color: var(--ti-pager-poplist-item-hover-bg-color); + svg { + fill: var(--ti-pager-poplist-item-hover-text-color); + } + } + + &[disabled] { + &, + &:hover { + background-color: transparent; + cursor: not-allowed; + } + + span { + color: var(--ti-pager-prev-next-text-color-disabled); + } + + svg { + fill: var(--ti-pager-prev-next-text-color-disabled); + } + } + } + + &__selector { + &.@{popover-prefix-cls}.@{popper-prefix-cls} { + width: 60px; + padding: 0; + + &[x-placement^='bottom'] { + margin-top: 2px; + } + + &[x-placement^='top'] { + margin-bottom: 0; + } + } + + &-body { + max-height: 300px; + overflow-y: auto; + overflow-x: hidden; + } + + &-poplist { + .list-item { + min-height: 30px; + padding: 0 8px; + line-height: 30px; + max-width: 100%; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + + &:hover { + cursor: pointer; + background: var(--ti-pager-poplist-item-hover-bg-color); + color: var(--ti-pager-poplist-item-hover-text-color); + } + + &.is-selected { + background: var(--ti-pager-poplist-item-selected-bg-color); + color: var(--ti-pager-normal-text-color); + + &:hover { + background: var(--ti-pager-poplist-item-selected-bg-color); + } + } + + &.select-pre { + background: var(--ti-pager-poplist-item-hover-bg-color); + color: var(--ti-pager-poplist-item-hover-text-color); + + &.is-selected { + color: #fff; + background: var(--ti-pager-poplist-item-selected-bg-color); + } + } + } + } + } + + & &__popover { + margin: 0 4px 0 14px; + } + + & &__sizes { + .@{pager-prefix-cls}__popover { + margin: 0; + } + & + .@{pager-prefix-cls}__group { + margin: 0 16px; + } + } + + & &__group { + & + .@{pager-prefix-cls}__sizes { + margin: 0 16px; + } + } + + &__input { + width: 60px; + vertical-align: middle; + position: relative; + + input { + width: 100%; + height: var(--ti-pager-input-height); + line-height: var(--ti-pager-input-height); + border: 1px solid var(--ti-pager-input-border-color); + color: var(--ti-pager-normal-text-color); + border-radius: var(--ti-pager-input-border-radius); + background: #fff; + font-size: var(--ti-pager-font-size, 12px); + padding: 0 8px; + display: block; + stop-color: var(--ti-pager-input-stop-color); + lighting-color: var(--ti-pager-input-lighting-color); + padding: 6px 10px; + white-space: nowrap; + transition: border 0.3s; + outline: 0; + box-sizing: border-box; + .user-select(none); + + &:hover { + outline: 0; + border-color: var(--ti-pager-input-hover-border-color); + } + + &:active, + &:focus { + outline: 0; + border-color: var(--ti-pager-input-hover-border-color); + } + } + + &-btn { + width: 24px; + height: var(--ti-pager-height); + line-height: var(--ti-pager-height); + position: absolute; + right: 2px; + bottom: 0; + top: 0; + outline: 0; + box-sizing: border-box; + text-align: center; + overflow: hidden; + cursor: pointer; + + svg { + font-size: var(--ti-pager-font-size); + fill: var(--ti-pager-font-normal-text-color); + vertical-align: middle; + } + } + } + + .@{popover-prefix-cls}__reference { + outline: 0; + } +} + +@media (max-width: 768px) { + .@{pager-prefix-cls} { + text-align: left; + + & &__pull-left { + float: none !important; + } + } +} diff --git a/packages/theme/src/pager/vars.less b/packages/theme/src/pager/vars.less new file mode 100644 index 000000000..5352e4ebd --- /dev/null +++ b/packages/theme/src/pager/vars.less @@ -0,0 +1,40 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-pager() { + --ti-pager-normal-text-color: var(--ti-base-color-info-normal); + --ti-pager-primary-bg-color: var(--ti-base-color-brand-6); + --ti-pager-primary-text-color: var(--ti-base-color-brand-6); + --ti-pager-primary-border-color: var(--ti-base-color-brand-6); + --ti-pager-primary-hover-text-color: var(--ti-base-color-brand-5); + --ti-pager-input-border-color: var(--ti-base-color-border); + --ti-pager-input-hover-border-color: var(--ti-common-color-line-hover); + --ti-pager-input-stop-color: var(--ti-base-color-common-2); + --ti-pager-input-lighting-color: var(--ti-base-color-brand-6); + --ti-pager-font-size: var(--ti-common-font-size-base); + --ti-pager-text-color: var(--ti-common-color-text-secondary); + --ti-pager-font-normal-text-color: var(--ti-base-color-secondary); + --ti-pager-height: var(--ti-base-size-height-mini); + --ti-pager-input-width: var(--ti-common-space-10x); + --ti-pager-poplist-item-padding-vertical: var(--ti-common-space-0); + --ti-pager-poplist-item-padding-horizontal: var(--ti-common-space-6); + --ti-pager-poplist-item-unchecked-box-shadow: none; + --ti-pager-input-height: var(--ti-base-size-height-mini); + --ti-pager-input-border-radius: var(--ti-common-border-radius-normal); + --ti-pager-poplist-item-hover-bg-color: var(--ti-base-color-hover-background); + --ti-pager-poplist-item-hover-text-color: var(--ti-common-color-text-highlight); + --ti-pager-poplist-item-selected-bg-color: var(--ti-common-color-bg-emphasize); + --ti-pager-poplist-item-hover-border-color: var(--ti-base-color-transparent); + --ti-pager-prev-next-text-color-disabled: var(--ti-common-color-line-disabled); + --ti-pager-goto-btn-border-color: var(--ti-base-color-brand-5); + --ti-pager-goto-btn-text-color: var(--ti-base-color-brand-5); +} diff --git a/packages/theme/src/pbi/index.js b/packages/theme/src/pbi/index.js new file mode 100644 index 000000000..c88e55bbe --- /dev/null +++ b/packages/theme/src/pbi/index.js @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-pbi-font-size-base': '12px', + 'tiny-pbi-selected-text-color': 'rgb(19, 143, 199)', + 'tiny-pbi-selected-bg-color': 'rgba(31, 158, 216, 0.12)', + 'tiny-pbi-list-border-color': '#ccc' +} diff --git a/packages/theme/src/pbi/index.less b/packages/theme/src/pbi/index.less new file mode 100644 index 000000000..c3ff522b5 --- /dev/null +++ b/packages/theme/src/pbi/index.less @@ -0,0 +1,106 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/button.less'; +@import '../custom.less'; +@import './vars.less'; + +.dialog-pbi { + .component-css-vars-pbi(); + + &.@{css-prefix}dialog { + .dialog-body { + font-size: var(--ti-pbi-font-size-base); + font-weight: normal; + } + } + + .@{css-prefix}selected { + color: var(--ti-pbi-selected-text-color); + background: var(--ti-pbi-selected-bg-color); + } + + .pbi_col { + width: 200px; + float: left; + } + + .pbi_list { + height: 460px; + overflow-y: auto; + border: 1px solid var(--ti-pbi-list-border-color); + padding: 4px; + } +} + +// dialog 基础样式 +.@{css-prefix}dialog { + background: var(--ti-dialog-background); + padding: 0; + box-shadow: var(--ti-dialog-shadow); + animation: dialog-fade-in 0.3s; + animation: dialog-fade-in 0.3s; + + .dialog-head { + background: var(--ti-dialog-head-background); + font-size: var(--ti-dialog-head-font-size); + + .dialog-title { + color: var(--ti-dialog-title-color); + display: inline-block; + font-size: var(--ti-dialog-title-font-size); + font-weight: var(--ti-dialog-title-font-weight); + margin: 0; + } + + .dialog-operation { + float: right; + + > a { + color: var(--ti-dialog-operation-color); + + &:hover { + color: var(--ti-dialog-operation-hover-color); + } + + .@{css-prefix}small-close { + font-size: var(--ti-dialog-head-font-size); + } + } + } + } + + .dialog-body { + width: 100%; + padding: var(--ti-dialog-body-padding); + min-height: var(--ti-dialog-body-min-height); + font-size: var(--ti-dialog-body-font-size); + font-weight: bold; + overflow: auto; + overflow-x: hidden; + color: var(--ti-dialog-body-color); + max-height: 55vh !important; // erralert警告弹窗设置最高高度 + } + + .dialog-head-alert-confirm { + padding: 0 24px; + height: 40px; + line-height: 40px; + border-bottom: 1px solid #d9d9d9; + } +} + +// button 基础样式 +.@{css-prefix}toolbar { + clear: both; + text-align: center; +} diff --git a/packages/theme/src/pbi/vars.less b/packages/theme/src/pbi/vars.less new file mode 100644 index 000000000..714880a5f --- /dev/null +++ b/packages/theme/src/pbi/vars.less @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-pbi() { + --ti-pbi-font-size-base: var(--ti-common-font-size-base); + --ti-pbi-selected-text-color: rgb(19, 143, 199); + --ti-pbi-selected-bg-color: rgba(31, 158, 216, 0.12); + --ti-pbi-list-border-color: #ccc; +} diff --git a/packages/theme/src/picker/index.js b/packages/theme/src/picker/index.js new file mode 100644 index 000000000..ff55e4312 --- /dev/null +++ b/packages/theme/src/picker/index.js @@ -0,0 +1,84 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-date-picker-width': '280px', + 'tiny-date-picker-font-size': '12px', + 'tiny-date-picker-text-color': '#333', + 'tiny-date-picker-bg-color': '#fff', + 'tiny-date-picker-border-radius': '2px', + 'tiny-date-picker-border-color': '#d9d9d9', + 'tiny-date-picker-hover-bg-color': '#e6f7ff', + 'tiny-date-picker-disabled-text-color': '#999', + 'tiny-date-picker-disabled-bg-color': '#f5f5f5', + 'tiny-date-picker-selected-bg-color': '#f5f5f5', + 'tiny-date-picker-icon-font-size': '14px', + 'tiny-date-picker-current-select-bg-color': '#1890ff', + 'tiny-date-picker-current-border-color': '#1890ff', + 'tiny-date-table-td-border-radius': '15px', + 'tiny-date-table-td-pre-month-text-color': '#999', + 'tiny-date-table-td-nomal-text-color': '#fff', + 'tiny-date-table-td-range-bg-color': '#f2f6fc', + 'tiny-month-table-td-text-bg-color': '#40a9ff', + 'tiny-month-table-td-range-bg-color': '#f2f6fc', + 'tiny-month-table-td-date-text-color': '#fff', + 'tiny-month-table-td-date-border-radius': '24px', + 'tiny-year-table-td-text-color': '#40a9ff', + 'tiny-year-table-td-icon-color': '#303133', + 'tiny-time-spinner-arrow-text-color': '#909399', + 'tiny-time-spinner-arrow-hover-text-color': '#40a9ff', + 'tiny-time-spinner-item-active-text-color': '#303133', + 'tiny-picker-panel-line-height': '30px', + 'tiny-picker-panel-shortcut-font-size': '14px', + 'tiny-picker-panel-icon-color-btn': '#999', + 'tiny-picker-panel-icon-color-btn-hover': '#40a9ff', + 'tiny-picker-panel-icon-color-btn-disabled': '#bfbfbf', + 'tiny-date-picker-header-label-hover-text-color': '#40a9ff', + 'tiny-date-range-picker-header-font-size': '16px', + 'tiny-date-range-picker-time-header-icon-color': '#303133', + 'tiny-time-range-picker-header-font-size': '14px', + 'tiny-time-panel-footer-height': '36px', + 'tiny-time-panel-btn-text-color': '#303133', + 'tiny-time-panel-btn-confirm-text-color': '#40a9ff', + 'tiny-range-separator-text-color': '#303133', + + 'tiny-date-picker-current-border-radius': '0', + 'tiny-date-picker-range-bg-color': '#e9edfa', + 'tiny-date-picker-range-hover-bg-color': '#e9edfa', + 'tiny-date-table-td-width': '36px', + 'tiny-date-table-td-height': '34px', + 'tiny-date-table-td-padding-vertical': '4px', + 'tiny-date-table-td-padding-horizontal': '0', + 'tiny-date-table-td-span-width': '36px', + 'tiny-date-table-td-span-height': '24px', + 'tiny-date-table-th-text-color': '#adb0b8', + 'tiny-date-table-td-today-border-color': '#5e7ce0', + 'tiny-date-table-td-today-text-color': '#333', + 'tiny-date-table-week-current-bg-color': '#e9edfa', + 'tiny-date-table-week-current-hover-bg-color': '#beccfa', + 'tiny-time-spinner-item-font-weight': '700', + 'tiny-time-spinner-item-bg-color': 'transparent', + 'tiny-time-spinner-list-border-color': 'transparent', + 'tiny-picker-panel-border-color': 'rgba(0, 0, 0, 0.15)', + 'tiny-picker-panel-box-shadow': '2px 3px 7px rgba(0, 0, 0, 0.15)', + 'tiny-time-panel-border-color': '#d9d9d9', + 'tiny-time-panel-box-shadow': '0 2px 12px 0 rgba(0, 0, 0, 0.1)', + 'tiny-time-panel-btn-bg-color': 'transparent', + 'tiny-time-panel-btn-padding-vertical': '0', + 'tiny-time-panel-btn-padding-horizontal': '5px', + 'tiny-time-panel-btn-border-radius': '2px', + 'tiny-time-panel-btn-height': '28px', + 'tiny-time-panel-btn-min-width': 'inherit', + 'tiny-time-panel-btn-font-weight': '800', + 'tiny-time-panel-btn-confirm-hover-bg-color': 'transparent', + 'tiny-date-editor-input-icon-color-fill': '#575d6c' +} diff --git a/packages/theme/src/picker/index.less b/packages/theme/src/picker/index.less new file mode 100644 index 000000000..6cb4dd5ab --- /dev/null +++ b/packages/theme/src/picker/index.less @@ -0,0 +1,1425 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; +@import '../transition/timepicker.less'; + +@date-table-prefix-cls: ~'@{css-prefix}date-table'; +@month-table-prefix-cls: ~'@{css-prefix}month-table'; +@year-table-prefix-cls: ~'@{css-prefix}year-table'; +@time-spinner-prefix-cls: ~'@{css-prefix}time-spinner'; +@date-editor-prefix-cls: ~'@{css-prefix}date-editor'; +@range-editor-prefix-cls: ~'@{css-prefix}range-editor'; +@picker-panel-prefix-cls: ~'@{css-prefix}picker-panel'; +@date-picker-prefix-cls: ~'@{css-prefix}date-picker'; +@date-range-picker-prefix-cls: ~'@{css-prefix}date-range-picker'; +@time-range-picker-prefix-cls: ~'@{css-prefix}time-range-picker'; +@time-panel-prefix-cls: ~'@{css-prefix}time-panel'; +@time-select-prefix-cls: ~'@{css-prefix}time-select'; +@scrollbar-prefix-cls: ~'@{css-prefix}scrollbar'; +@input-prefix-cls: ~'@{css-prefix}input'; +@range-prefix-cls: ~'@{css-prefix}range'; +@button-prefix-cls: ~'@{css-prefix}button'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{date-table-prefix-cls} { + font-size: var(--ti-date-picker-font-size); + .user-select(none); + + &.is-week-mode &__row:hover { + td { + &.available:hover { + color: var(--ti-date-picker-text-color); + } + + &:first-child div { + margin-left: 5px; + border-top-left-radius: var(--ti-date-table-td-border-radius); + border-bottom-left-radius: var(--ti-date-table-td-border-radius); + } + + &:last-child div { + margin-right: 5px; + border-top-right-radius: var(--ti-date-table-td-border-radius); + border-bottom-right-radius: var(--ti-date-table-td-border-radius); + } + } + + div { + background-color: var(--ti-date-picker-hover-bg-color); + } + } + + &.is-week-mode &__row.current { + div { + background-color: var(--ti-date-table-week-current-bg-color); + + &:hover { + background-color: var(--ti-date-table-week-current-hover-bg-color); + } + } + + td.available { + &:hover span { + background-color: transparent; + } + + &.start-date span, + &.end-date span { + background-color: var(--ti-date-picker-current-select-bg-color); + } + } + } + + td { + width: var(--ti-date-table-td-width); + height: var(--ti-date-table-td-height); + padding: var(--ti-date-table-td-padding-vertical) var(--ti-date-table-td-padding-horizontal); + box-sizing: border-box; + text-align: center; + cursor: pointer; + position: relative; + + div { + height: 24px; + min-width: 36px; + padding: 3px 0; + box-sizing: border-box; + } + + span { + min-width: var(--ti-date-table-td-span-width); + height: var(--ti-date-table-td-span-height); + line-height: var(--ti-date-table-td-span-height); + display: block; + margin: 0 auto; + position: absolute; + left: 50%; + top: 5px; + transform: translateX(-50%); + } + + &.next-month, + &.pre-month { + color: var(--ti-date-table-td-pre-month-text-color); + cursor: pointer; + + & span:hover { + background: var(--ti-datetime-beside-day-bg-color-hover); + } + } + + &.today { + position: relative; + color: var(--ti-date-table-td-today-text-color); + + &:after { + content: ''; + width: 12px; + height: 1px; + background: var(--ti-date-table-td-today-border-color); + position: absolute; + left: 0; + right: 0; + margin: auto; + bottom: 5px; + } + + &.end-date, + &.start-date { + span { + color: var(--ti-date-table-td-nomal-text-color); + } + } + } + + &.available:hover span { + background-color: var(--ti-date-picker-hover-bg-color); + border-radius: var(--ti-date-picker-current-border-radius); + } + + &.current:not(.disabled) span { + color: var(--ti-date-table-td-nomal-text-color); + background-color: var(--ti-date-picker-current-select-bg-color); + border-radius: var(--ti-date-picker-current-border-radius); + } + + &.end-date, + &.start-date { + div { + color: var(--ti-date-table-td-nomal-text-color); + } + + span { + background-color: var(--ti-date-picker-current-select-bg-color); + } + } + + &.start-date { + div { + margin-left: 5px; + border-top-left-radius: var(--ti-date-table-td-border-radius); + border-bottom-left-radius: var(--ti-date-table-td-border-radius); + } + } + + &.end-date { + div { + margin-right: 5px; + border-top-right-radius: var(--ti-date-table-td-border-radius); + border-bottom-right-radius: var(--ti-date-table-td-border-radius); + } + } + + &.disabled { + div { + background-color: var(--ti-date-picker-disabled-bg-color); + opacity: 1; + cursor: not-allowed; + color: var(--ti-date-picker-disabled-text-color); + } + } + + &.in-range { + div { + background-color: var(--ti-date-picker-range-bg-color); + + &:hover { + background-color: var(--ti-date-picker-range-hover-bg-color); + } + } + + &.end-date:hover, + &.start-date:hover { + span { + background-color: var(--ti-date-picker-current-select-bg-color); + } + } + } + + &.available { + padding: 0; + } + + &.selected { + div { + margin-left: 5px; + margin-right: 5px; + background-color: var(--ti-date-table-td-range-bg-color); + + &:hover { + background-color: var(--ti-date-table-td-range-bg-color); + } + } + + span { + background-color: var(--ti-date-picker-current-select-bg-color); + color: var(--ti-date-table-td-nomal-text-color); + border: none; + } + + &.available:hover span { + background-color: var(--ti-date-picker-current-select-bg-color); + } + } + + &.week { + font-size: 80%; + color: var(--ti-date-picker-text-color); + } + } + + th { + color: var(--ti-date-table-th-text-color); + font-weight: 400; + } +} + +.@{month-table-prefix-cls} { + font-size: var(--ti-date-picker-font-size); + margin: -1px; + border-collapse: collapse; + + td { + text-align: center; + padding: 16px 0; + cursor: pointer; + + div { + height: 32px; + box-sizing: border-box; + } + + &.today { + .cell { + color: var(--ti-month-table-td-text-bg-color); + font-weight: 700; + } + + &.end-date, + &.start-date { + .cell { + color: var(--ti-month-table-td-date-text-color); + } + } + } + + &.disabled { + .cell { + background-color: var(--ti-date-picker-disabled-bg-color); + cursor: not-allowed; + color: var(--ti-date-picker-disabled-text-color); + + &:hover { + color: var(--ti-date-picker-disabled-text-color); + } + } + } + + .cell { + width: 100%; + height: 32px; + line-height: 32px; + display: block; + color: var(--ti-date-picker-text-color); + + &:hover { + background: var(--ti-date-picker-hover-bg-color); + } + } + + &.in-range { + div, + div:hover { + background-color: var(--ti-month-table-td-range-bg-color); + } + } + + &.end-date, + &.start-date { + div { + color: var(--ti-month-table-td-date-text-color); + } + + .cell { + color: var(--ti-month-table-td-date-text-color); + background-color: var(--ti-month-table-td-text-bg-color); + } + } + + &:not(.in-range) { + padding: 16px 4px; + + div { + height: auto; + padding: 0; + } + + .cell { + width: auto; + height: 32px; + line-height: 32px; + border-radius: 2px; + } + } + + &.current:not(.disabled) .cell { + &, + &:hover { + color: var(--ti-date-table-td-nomal-text-color); + background: var(--ti-month-table-td-text-bg-color); + } + } + } +} + +.@{year-table-prefix-cls} { + font-size: var(--ti-date-picker-font-size); + margin: -1px; + border-collapse: collapse; + + td { + text-align: center; + cursor: pointer; + + &.today { + .cell { + color: var(--ti-year-table-td-text-color); + font-weight: 700; + } + } + + &.disabled { + .cell { + background-color: var(--ti-date-picker-disabled-bg-color); + cursor: not-allowed; + color: var(--ti-date-picker-disabled-text-color); + + &:hover { + color: var(--ti-date-picker-disabled-text-color); + } + } + } + + .cell { + width: 48px; + height: 24px; + line-height: 24px; + display: block; + color: var(--ti-date-picker-text-color); + margin: 0 auto; + border-radius: 2px; + &:hover { + background: var(--ti-date-picker-hover-bg-color); + } + } + + &.current:not(.disabled) .cell { + color: var(--ti-date-table-td-nomal-text-color); + background: var(--ti-date-picker-current-select-bg-color); + } + } + + td.available { + padding: 16px 3px; + } + + .@{css-prefix}icon { + color: var(--ti-year-table-td-icon-color); + } +} + +.@{time-spinner-prefix-cls} { + &__wrapper { + max-height: 190px; + overflow: auto; + display: inline-block; + width: 50%; + vertical-align: top; + position: relative; + + .@{scrollbar-prefix-cls}__wrap:not(.@{scrollbar-prefix-cls}__wrap--hidden-default) { + padding-bottom: 15px; + } + + &.is-arrow { + box-sizing: border-box; + text-align: center; + overflow: hidden; + + .@{time-spinner-prefix-cls}__list { + transform: translateY(-32px); + } + + .@{time-spinner-prefix-cls}__item:hover:not(.disabled):not(.active) { + background: var(--ti-date-picker-bg-color); + cursor: default; + } + } + + .@{time-spinner-prefix-cls}__list { + transform: translateY(-6px); + } + + &:last-child { + .@{time-spinner-prefix-cls}__list { + border-right: 0; + } + } + } + + &__arrow { + font-size: var(--ti-date-picker-font-size); + color: var(--ti-time-spinner-arrow-text-color); + height: 30px; + line-height: 30px; + position: absolute; + left: 0; + width: 100%; + z-index: 1; + text-align: center; + cursor: pointer; + + .@{svg-prefix-cls} { + fill: var(--ti-time-spinner-arrow-text-color); + } + + &:hover .@{svg-prefix-cls} { + fill: var(--ti-time-spinner-arrow-hover-text-color); + } + + &.@{css-prefix}icon-arrow-up { + top: 10px; + } + + &.@{css-prefix}icon-arrow-down { + bottom: 10px; + } + + &.@{input-prefix-cls} { + width: 70%; + + .@{input-prefix-cls}__inner { + padding: 0; + text-align: center; + } + } + } + + &__list { + padding: 0; + margin: 0; + list-style: none; + text-align: center; + border-right: 1px solid var(--ti-time-spinner-list-border-color); + + &::after, + &::before { + content: ''; + display: block; + width: 100%; + height: 80px; + } + } + + &__item { + font-size: var(--ti-date-picker-font-size); + color: var(--ti-date-picker-text-color); + height: 32px; + line-height: 32px; + + &:hover:not(.disabled):not(.active) { + background: var(--ti-date-picker-selected-bg-color); + cursor: pointer; + } + + &.active:not(.disabled) { + color: var(--ti-time-spinner-item-active-text-color); + font-weight: var(--ti-time-spinner-item-font-weight); + background-color: var(--ti-time-spinner-item-bg-color); + } + + &.disabled { + color: var(--ti-date-picker-disabled-text-color); + cursor: not-allowed; + } + } + + &.has-seconds .@{time-spinner-prefix-cls}__wrapper { + width: 33.3%; + } +} + +.@{date-editor-prefix-cls} { + .component-css-vars-picker(); + + position: relative; + display: inline-block; + text-align: left; + + &.@{input-prefix-cls}, + &.@{input-prefix-cls}__inner { + width: 100%; + } + + &--monthrange { + &.@{input-prefix-cls}, + &.@{input-prefix-cls}__inner { + width: 300px; + } + } + + &--daterange, + &--timerange { + &.@{input-prefix-cls}, + &.@{input-prefix-cls}__inner { + width: 350px; + } + } + + &--datetimerange { + &.@{input-prefix-cls}, + &.@{input-prefix-cls}__inner { + width: 400px; + } + } + + &--dates { + .@{input-prefix-cls}__inner { + .text-overflow(); + } + } + + .@{input-prefix-cls}__icon { + cursor: pointer; + fill: var(--ti-date-editor-input-icon-color-fill); + + .baseClearicon { + margin-right: 8px; + fill: #252b3a; + + &:hover { + fill: var(--ti-input-clear-text-color-hover); + } + } + + &:not(.@{range-prefix-cls}__icon) { + display: flex; + } + } + + .@{range-prefix-cls}__icon { + font-size: var(--ti-date-picker-icon-font-size); + color: #c0c4cc; + margin-left: -5px; + float: left; + line-height: 1; + } + + .@{range-prefix-cls}-input, + .@{range-prefix-cls}-separator { + font-size: var(--ti-date-picker-font-size); + height: 100%; + margin: 0; + text-align: center; + display: inline-block; + } + + .@{range-prefix-cls}-input { + appearance: none; + border: none; + outline: 0; + padding: 0; + width: 39%; + color: var(--ti-date-picker-text-color); + .text-overflow(); + .placeholder(); + } + + .@{range-prefix-cls}-separator { + padding: 0 5px; + line-height: 22px; + width: 12%; + color: var(--ti-range-separator-text-color); + } + + .@{range-prefix-cls}__close-icon { + font-size: var(--ti-date-picker-icon-font-size); + width: 25px; + float: right; + line-height: 32px; + margin-right: 14px; + display: flex; + justify-content: center; + align-items: center; + + &, + &:hover { + fill: var(--ti-input-icon-close-text-color); + } + } +} + +.@{range-editor-prefix-cls} { + &.@{input-prefix-cls}__inner { + display: inline-flex; + align-items: center; + padding: 3px 10px; + } + + .@{range-prefix-cls}-input { + line-height: 1; + } + + &.is-active, + &.is-active:hover { + border-color: var(--ti-date-picker-current-border-color); + } + + &--medium { + &.@{input-prefix-cls}__inner { + height: 42px; + } + + .@{range-prefix-cls}-separator { + line-height: 34px; + font-size: var(--ti-common-font-size-2); + } + + .@{range-prefix-cls}-input { + font-size: var(--ti-common-font-size-2); + } + + .@{range-prefix-cls}__close-icon, + .@{range-prefix-cls}__icon { + line-height: 34px; + } + } + + &--small { + &.@{input-prefix-cls}__inner { + height: 36px; + } + + .@{range-prefix-cls}-separator { + line-height: 28px; + font-size: var(--ti-common-font-size-1); + } + + .@{range-prefix-cls}-input { + font-size: var(--ti-common-font-size-1); + } + + .@{range-prefix-cls}__close-icon, + .@{range-prefix-cls}__icon { + line-height: 28px; + } + } + + &--mini { + &.@{input-prefix-cls}__inner { + height: 24px; + } + + .@{range-prefix-cls}-separator { + line-height: 16px; + font-size: var(--ti-common-font-size-base); + } + + .@{range-prefix-cls}-input { + font-size: var(--ti-common-font-size-base); + } + + .@{range-prefix-cls}__close-icon, + .@{range-prefix-cls}__icon { + line-height: 16px; + } + } + + &.is-disabled { + background-color: var(--ti-date-picker-disabled-bg-color); + border-color: var(--ti-date-picker-border-color); + color: var(--ti-date-picker-disabled-text-color); + cursor: not-allowed; + + &:focus, + &:hover { + border-color: var(--ti-date-picker-border-color); + } + + input { + color: var(--ti-date-picker-disabled-text-color); + background-color: var(--ti-date-picker-disabled-bg-color); + cursor: not-allowed; + .placeholder(); + } + + .@{range-prefix-cls}-separator { + color: var(--ti-date-picker-disabled-text-color); + } + } +} + +.@{picker-panel-prefix-cls} { + .component-css-vars-picker(); + + color: var(--ti-date-picker-text-color); + font-size: var(--ti-date-picker-font-size); + border: 1px solid var(--ti-picker-panel-border-color); + box-shadow: var(--ti-picker-panel-box-shadow); + background: var(--ti-date-picker-bg-color); + border-radius: var(--ti-common-border-radius-normal); + line-height: var(--ti-picker-panel-line-height); + margin: var(--ti-base-dropdown-gap) 0; + + &__body-wrapper::after, + &__body::after { + content: ''; + display: table; + clear: both; + } + + &__body { + padding-bottom: 8px; + } + + &__content { + position: relative; + } + + &__footer { + border-top: 1px solid var(--ti-date-picker-border-color); + padding: 6px 16px; + background-color: var(--ti-date-picker-bg-color); + display: flex; + justify-content: space-between; + align-items: center; + + .@{button-prefix-cls} { + min-width: 60px; + + &:only-child { + float: right; + } + } + + .@{button-prefix-cls}--text { + text-align: left; + } + } + + &__shortcut { + display: block; + width: 100%; + border: 0; + background-color: transparent; + line-height: 28px; + font-size: var(--ti-picker-panel-shortcut-font-size); + color: var(--ti-date-picker-text-color); + padding-left: 12px; + text-align: left; + outline: 0; + cursor: pointer; + + &:hover { + background-color: var(--ti-date-picker-hover-bg-color); + } + + &.active { + background-color: var(--ti-date-picker-selected-bg-color); + } + } + + &__btn { + color: var(--ti-date-picker-text-color); + border: 1px solid var(--ti-date-picker-border-color); + font-size: var(--ti-date-picker-font-size); + line-height: 24px; + border-radius: var(--ti-date-picker-border-radius); + padding: 0 20px; + cursor: pointer; + outline: 0; + background-color: transparent; + + [disabled] { + color: var(--ti-date-picker-disabled-text-color); + cursor: not-allowed; + } + } + + &__icon-btn { + font-size: var(--ti-date-picker-font-size); + line-height: 30px; + fill: var(--ti-picker-panel-icon-color-btn); + border: 0; + background: 0 0; + cursor: pointer; + outline: 0; + + &:hover { + fill: var(--ti-picker-panel-icon-color-btn-hover); + } + + &.is-disabled { + color: var(--ti-picker-panel-icon-color-btn-disabled); + + &:hover { + cursor: not-allowed; + } + } + } + + &__link-btn { + vertical-align: middle; + } + + [slot='sidebar'], + &__sidebar { + position: absolute; + top: 0; + bottom: 0; + width: 110px; + border-right: 1px solid var(--ti-date-picker-border-color); + box-sizing: border-box; + padding-top: 6px; + background-color: var(--ti-date-picker-bg-color); + overflow: auto; + + & + .@{picker-panel-prefix-cls}__body { + margin-left: 110px; + } + } + + &__timezone { + margin-bottom: 10px; + + .@{picker-panel-prefix-cls}__tzlist { + z-index: 10; + overflow-y: hidden; + + &-li { + height: 30px; + line-height: 30px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + padding: 0 10px; + border: 1px solid #f4f0f0; + cursor: pointer; + } + + .@{css-prefix}popup { + position: absolute; + width: 238px; + bottom: 77px; + max-height: 260px; + box-shadow: 0 -1px 2px 0 rgba(53, 29, 29, 0.5); + } + } + + .@{input-prefix-cls} { + position: relative; + } + } +} + +.@{date-picker-prefix-cls} { + .component-css-vars-picker(); + + width: var(--ti-date-picker-width); + + &.has-sidebar.has-time { + width: 434px; + } + + &.has-sidebar { + width: 398px; + } + + &.has-time { + .@{picker-panel-prefix-cls}__body-wrapper { + position: relative; + } + } + + table { + table-layout: fixed; + width: 100%; + } + + &__editor-wrap { + position: relative; + display: table-cell; + padding: 0 5px; + } + + &__time-header { + position: relative; + border-bottom: 1px solid var(--ti-date-picker-border-color); + font-size: var(--ti-date-picker-font-size); + padding: 8px 5px 5px; + display: table; + width: 100%; + box-sizing: border-box; + } + + &__header { + margin: 12px; + text-align: center; + } + + &__header--bordered { + margin-bottom: 0; + padding-bottom: 12px; + border-bottom: 1px solid var(--ti-date-picker-border-color); + + & + .@{picker-panel-prefix-cls}__content { + margin-top: 0; + } + } + + &__header-label { + font-size: var(--ti-date-picker-font-size); + font-weight: 700; + padding: 0 4px; + text-align: center; + cursor: pointer; + color: var(--ti-date-picker-text-color); + vertical-align: middle; + + &.active, + &:hover { + color: var(--ti-date-picker-header-label-hover-text-color); + } + } + + &__prev-btn { + float: left; + } + + &__next-btn { + float: right; + } + + &__time-wrap { + padding: 10px; + text-align: center; + } + + &__time-label { + float: left; + cursor: pointer; + line-height: 30px; + margin-left: 10px; + } +} + +.@{date-range-picker-prefix-cls} { + width: 558px; + + &.has-sidebar { + width: 668px; + } + + table { + table-layout: fixed; + width: 100%; + } + + .@{picker-panel-prefix-cls}__body { + min-width: var(--ti-date-range-picker-body-min-width); + } + + .@{picker-panel-prefix-cls}__content { + margin: 0; + } + + &__header { + position: relative; + text-align: center; + height: 28px; + + [class*='arrow-left'] { + float: left; + } + + [class*='arrow-right'] { + float: right; + } + + div { + font-size: var(--ti-date-range-picker-header-font-size); + font-weight: 500; + margin-right: 50px; + } + } + + &__content { + float: left; + width: 50%; + box-sizing: border-box; + margin: 0; + padding: 16px; + + &.is-left { + border-right: 1px solid var(--ti-date-picker-border-color); + } + + .@{date-range-picker-prefix-cls}__header div { + margin-left: 50px; + margin-right: 50px; + } + } + + &__editors-wrap { + box-sizing: border-box; + display: table-cell; + + &.is-right { + text-align: right; + } + } + + &__time-header { + position: relative; + border-bottom: 1px solid var(--ti-date-picker-border-color); + font-size: var(--ti-date-picker-font-size); + padding: 8px 5px 5px; + display: table; + width: 100%; + box-sizing: border-box; + + & > .@{css-prefix}icon-arrow-right { + font-size: var(--ti-common-font-size-4); + vertical-align: middle; + display: table-cell; + color: var(--ti-date-range-picker-time-header-icon-color); + } + } + + &__time-picker-wrap { + position: relative; + display: table-cell; + padding: 0 5px; + + .@{picker-panel-prefix-cls} { + position: absolute; + top: 13px; + right: 0; + z-index: 1; + background: var(--ti-date-picker-bg-color); + } + } +} + +.@{time-range-picker-prefix-cls} { + width: 354px; + overflow: visible; + + &__content { + position: relative; + text-align: center; + padding: 10px; + display: flex; + justify-content: flex-start; + align-items: flex-start; + } + + &__cell { + box-sizing: border-box; + margin: 0; + padding: 4px 7px 7px; + width: 50%; + } + + &__header { + margin-bottom: 5px; + text-align: center; + font-size: var(--ti-time-range-picker-header-font-size); + } + + &__body { + border-radius: var(--ti-date-picker-border-radius); + border: 1px solid var(--ti-date-picker-border-color); + } +} + +.@{time-panel-prefix-cls} { + .component-css-vars-picker(); + + margin: 5px 0; + border: 1px solid var(--ti-time-panel-border-color); + background-color: var(--ti-date-picker-bg-color); + box-shadow: var(--ti-time-panel-box-shadow); + border-radius: var(--ti-date-picker-border-radius); + position: absolute; + width: 180px; + left: 0; + z-index: 1000; + box-sizing: content-box; + .user-select(none); + + &__content { + font-size: 0; + position: relative; + overflow: hidden; + + &:after, + &:before { + display: var(--ti-time-panel-content-split-line-display); + content: ''; + top: 50%; + position: absolute; + margin-top: -19px; + height: 32px; + z-index: -1; + left: 0; + right: 0; + box-sizing: border-box; + padding-top: 6px; + text-align: left; + border-top: 1px solid var(--ti-date-picker-border-color); + border-bottom: 1px solid var(--ti-date-picker-border-color); + } + + &:after { + left: 50%; + margin-left: 12%; + margin-right: 12%; + } + + &:before { + padding-left: 50%; + margin-right: 12%; + margin-left: 12%; + } + + &.has-seconds { + &:after { + left: calc(100% / 3 * 2); + } + + &:before { + padding-left: calc(100% / 3); + } + } + } + + &__footer { + border-top: 1px solid var(--ti-date-picker-border-color); + padding: 4px; + height: 36px; + height: var(--ti-time-panel-footer-height, 36px); + line-height: 25px; + text-align: right; + box-sizing: border-box; + } + + &__btn { + min-width: var(--ti-time-panel-btn-min-width); + border: none; + line-height: var(--ti-time-panel-btn-height); + padding: var(--ti-time-panel-btn-padding-vertical) var(--ti-time-panel-btn-padding-horizontal); + margin: 0 5px; + cursor: pointer; + background-color: var(--ti-time-panel-btn-bg-color); + outline: 0; + font-size: 12px; + color: var(--ti-time-panel-btn-text-color); + border-radius: var(--ti-time-panel-btn-border-radius); + transition: background-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); + + &.cancel { + display: var(--ti-time-panel-btn-cancel-display); + } + + &.confirm { + font-weight: var(--ti-time-panel-btn-font-weight); + color: var(--ti-time-panel-btn-confirm-text-color); + + &:hover { + background-color: var(--ti-time-panel-btn-confirm-hover-bg-color); + } + } + } +} + +.@{time-select-prefix-cls} { + & &__item { + color: var(--ti-date-picker-text-color); + font-size: var(--ti-common-font-size-base); + padding: 0 8px; + line-height: var(--ti-base-size-height-normal); + height: var(--ti-base-size-height-normal); + + &:not(.disabled):hover { + background-color: var(--ti-date-picker-hover-bg-color); + cursor: pointer; + } + + &.selected:not(.disabled) { + background-color: var(--ti-date-picker-selected-bg-color); + } + + &.disabled { + color: var(--ti-date-picker-disabled-text-color); + cursor: not-allowed; + } + } +} + +.@{scrollbar-prefix-cls} { + overflow: hidden; + position: relative; + + &:active > &__bar, + &:focus > &__bar, + &:hover > &__bar { + opacity: 1; + transition: opacity 340ms ease-out; + } + + &__wrap { + overflow: scroll; + height: 100%; + } + + &__wrap--hidden-default::-webkit-scrollbar { + width: 0; + height: 0; + } + + &__thumb { + position: relative; + display: block; + width: 0; + height: 0; + cursor: pointer; + border-radius: inherit; + background-color: rgba(144, 147, 153, 0.3); + transition: 0.3s background-color; + + &:hover { + background-color: rgba(144, 147, 153, 0.5); + } + } + + &__bar { + position: absolute; + right: 2px; + bottom: 2px; + z-index: 1; + border-radius: 4px; + opacity: 0; + transition: opacity 120ms ease-out; + + &.is-vertical { + width: 6px; + top: 2px; + + & > div { + width: 100%; + } + } + + &.is-horizontal { + height: 6px; + left: 2px; + + & > div { + height: 100%; + } + } + } +} + +.@{css-prefix} { + &fade-in-linear-enter-active, + &fade-in-linear-leave-active { + transition: opacity 0.2s linear; + } + + &fade-in-linear-enter, + &fade-in-linear-enter-from, + &fade-in-linear-leave, + &fade-in-linear-leave-from, + &fade-in-linear-leave-active { + opacity: 0; + } + + &fade-in-enter-active, + &fade-in-leave-active { + transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1); + } + + &fade-in-enter, + &fade-in-enter-from, + &fade-in-leave-active { + opacity: 0; + } + + &zoom-in-center-enter-active, + &zoom-in-center-leave-active { + transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1); + } + + &zoom-in-center-enter, + &zoom-in-center-enter-from, + &zoom-in-center-leave-active { + opacity: 0; + transform: scaleX(0); + } + + &zoom-in-top-enter-active, + &zoom-in-top-leave-active { + opacity: 1; + transform: scaleY(1); + transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1); + transform-origin: center top; + } + + &zoom-in-top-enter, + &zoom-in-top-enter-from, + &zoom-in-top-leave-active { + opacity: 0; + transform: scaleY(0); + } + + &zoom-in-bottom-enter-active, + &zoom-in-bottom-leave-active { + opacity: 1; + transform: scaleY(1); + transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1); + transform-origin: center bottom; + } + + &zoom-in-bottom-enter, + &zoom-in-bottom-enter-from, + &zoom-in-bottom-leave-active { + opacity: 0; + transform: scaleY(0); + } + + &zoom-in-left-enter-active, + &zoom-in-left-leave-active { + opacity: 1; + transform: scale(1, 1); + transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1); + transform-origin: top left; + } + + &zoom-in-left-enter, + &zoom-in-left-enter-from, + &zoom-in-left-leave-active { + opacity: 0; + transform: scale(0.45, 0.45); + } + + &list-enter-active, + &list-leave-active { + transition: all 1s; + } + + &list-enter, + &list-enter-from, + &list-leave-active { + opacity: 0; + transform: translateY(-30px); + } + + &opacity-transition { + transition: opacity 0.3s cubic-bezier(0.55, 0, 0.1, 1); + } +} + +.collapse-transition { + transition: 0.3s height ease-in-out, 0.3s padding-top ease-in-out, 0.3s padding-bottom ease-in-out; +} + +.horizontal-collapse-transition { + transition: 0.3s width ease-in-out, 0.3s padding-left ease-in-out, 0.3s padding-right ease-in-out; +} + +.fade-in-linear-enter, +.fade-in-linear-enter-from, +.fade-in-linear-leave, +.fade-in-linear-leave-from, +.fade-in-linear-leave-active { + opacity: 0; +} + +.fade-in-linear-enter-active, +.fade-in-linear-leave-active { + transition: opacity 0.2s linear; +} diff --git a/packages/theme/src/picker/vars.less b/packages/theme/src/picker/vars.less new file mode 100644 index 000000000..702b9815e --- /dev/null +++ b/packages/theme/src/picker/vars.less @@ -0,0 +1,95 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-picker() { + --ti-date-picker-width: 280px; + --ti-date-picker-font-size: var(--ti-common-font-size-base); + --ti-date-picker-text-color: var(--ti-base-color-info-normal); + --ti-date-picker-bg-color: var(--ti-base-color-light); + --ti-date-picker-border-radius: var(--ti-common-border-radius-normal); + --ti-date-picker-border-color: var(--ti-common-color-line-dividing); + --ti-date-picker-hover-bg-color: var(--ti-base-color-brand-2); + --ti-date-picker-disabled-text-color: var(--ti-common-color-text-disabled); + --ti-date-picker-disabled-bg-color: var(--ti-common-color-bg-disabled); + --ti-date-picker-selected-bg-color: #f2f2f3; + --ti-date-picker-icon-font-size: var(--ti-common-font-size-1); + --ti-date-picker-current-select-bg-color: var(--ti-base-color-brand-6); + --ti-date-picker-current-border-color: var(--ti-base-color-brand-6); + --ti-date-picker-current-border-radius: 0; + --ti-date-picker-range-bg-color: var(--ti-base-color-brand-2); + --ti-date-picker-range-hover-bg-color: var(--ti-base-color-brand-2); + + --ti-date-table-td-width: 36px; + --ti-date-table-td-height: 34px; + --ti-date-table-td-padding-vertical: 4px; + --ti-date-table-td-padding-horizontal: 0; + --ti-date-table-td-span-width: 36px; + --ti-date-table-td-span-height: 24px; + --ti-date-table-th-text-color: var(--ti-base-color-common-2); + --ti-date-table-td-border-radius: 0; + --ti-date-table-td-pre-month-text-color: var(--ti-base-color-common-2); + --ti-date-table-td-nomal-text-color: var(--ti-base-color-light); + --ti-date-table-td-range-bg-color: #f2f6fc; + --ti-date-table-td-today-border-color: var(--ti-base-color-brand-6); + --ti-date-table-td-today-text-color: var(--ti-date-picker-text-color); + --ti-date-table-week-current-bg-color: var(--ti-base-color-brand-2); + --ti-date-table-week-current-hover-bg-color: var(--ti-base-color-brand-3); + + --ti-month-table-td-text-bg-color: var(--ti-base-color-brand-7); + --ti-month-table-td-range-bg-color: #f2f6fc; + --ti-month-table-td-date-text-color: var(--ti-base-color-light); + --ti-month-table-td-date-border-radius: 24px; + + --ti-year-table-td-text-color: var(--ti-base-color-brand-7); + --ti-year-table-td-icon-color: #303133; + + --ti-time-spinner-arrow-text-color: #909399; + --ti-time-spinner-arrow-hover-text-color: var(--ti-base-color-brand-7); + --ti-time-spinner-item-active-text-color: #303133; + --ti-time-spinner-item-font-weight: 700; + --ti-time-spinner-item-bg-color: transparent; + --ti-time-spinner-list-border-color: transparent; + + --ti-picker-panel-line-height: var(--ti-base-size-height-minor); + --ti-picker-panel-shortcut-font-size: var(--ti-common-font-size-1); + --ti-picker-panel-icon-color-btn: var(--ti-base-color-common-2); + --ti-picker-panel-icon-color-btn-hover: var(--ti-base-color-brand-7); + --ti-picker-panel-icon-color-btn-disabled: var(--ti-base-color-bg-5); + --ti-picker-panel-border-color: rgba(0, 0, 0, 0.15); + --ti-picker-panel-box-shadow: 2px 3px 7px rgba(0, 0, 0, 0.15); + + --ti-date-picker-header-label-hover-text-color: var(--ti-base-color-brand-7); + + --ti-date-range-picker-header-font-size: var(--ti-common-font-size-2); + --ti-date-range-picker-time-header-icon-color: #303133; + + --ti-time-range-picker-header-font-size: var(--ti-common-font-size-1); + --ti-time-panel-footer-height: 36px; + --ti-time-panel-btn-text-color: #303133; + --ti-time-panel-btn-confirm-text-color: var(--ti-base-color-brand-7); + --ti-range-separator-text-color: #303133; + + --ti-time-panel-border-color: var(--ti-date-picker-border-color); + --ti-time-panel-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); + --ti-time-panel-content-split-line-display: block; + --ti-time-panel-btn-cancel-display: inline-block; + --ti-time-panel-btn-bg-color: transparent; + --ti-time-panel-btn-padding-vertical: 0; + --ti-time-panel-btn-padding-horizontal: 5px; + --ti-time-panel-btn-border-radius: var(--ti-common-border-radius-normal); + --ti-time-panel-btn-height: 28px; + --ti-time-panel-btn-min-width: inherit; + --ti-time-panel-btn-font-weight: 800; + --ti-time-panel-btn-confirm-hover-bg-color: transparent; + + --ti-date-editor-input-icon-color-fill: #575d6c; +} diff --git a/packages/theme/src/pop-upload/index.js b/packages/theme/src/pop-upload/index.js new file mode 100644 index 000000000..50ad3b1ce --- /dev/null +++ b/packages/theme/src/pop-upload/index.js @@ -0,0 +1,21 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-popupload-font-size': '12px', + 'tiny-popupload-dialog-table-border-color': '#d9d9d9', + 'tiny-popupload-dialog-table-header-height': '36px', + 'tiny-popupload-dialog-table-header-text-color': '#333', + 'tiny-popupload-dialog-table-header-bg-color': '#f1f1f1', + 'tiny-popupload-dialog-table-icon-color': '#1890ff', + 'tiny-popupload-dialog-table-icon-color-hover': '#f5222d' +} diff --git a/packages/theme/src/pop-upload/index.less b/packages/theme/src/pop-upload/index.less new file mode 100644 index 000000000..c7b2f3cd6 --- /dev/null +++ b/packages/theme/src/pop-upload/index.less @@ -0,0 +1,145 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@popupload-prefix-cls: ~'@{css-prefix}popupload'; +@upload-list-prefix-cls: ~'@{css-prefix}upload-list'; +@grid-modal-prefix-cls: ~'@{css-prefix}grid-modal'; +@alert-prefix-cls: ~'@{css-prefix}alert'; + +.@{popupload-prefix-cls} { + .component-css-vars-pop-upload(); + + font-size: var(--ti-popupload-font-size); + display: flex; + align-items: center; + + &__dialog { + max-height: 512px; + width: 100%; + display: flex; + flex-direction: column; + } + + &__dialog-header { + .@{alert-prefix-cls} { + margin-bottom: 10px; + } + } + + &__dialog-body { + padding-bottom: 24px; + + .@{upload-list-prefix-cls} { + display: none; + } + } + + &__dialog-footer { + width: 100%; + display: flex; + align-items: center; + justify-content: center; + padding-bottom: 24px; + } + + &__dialog-tips { + display: flex; + flex-direction: column; + } + + &__dialog-table { + height: 280px; + width: 100%; + margin-top: 10px; + + .header-col { + border-right: 1px solid var(--ti-popupload-dialog-table-border-color); + padding: 0 12px; + + &:last-child { + border-right: none; + } + } + + .body-col { + padding: 8px 12px; + margin: 0; + line-height: 20px; + } + + .col1 { + width: 60%; + } + + .col2 { + width: 20%; + } + + .col3 { + width: 20%; + } + } + + &__dialog-table-header { + height: var(--ti-popupload-dialog-table-header-height); + width: 100%; + color: var(--ti-popupload-dialog-table-header-text-color); + font-weight: 700; + display: flex; + align-items: center; + justify-content: space-between; + background: var(--ti-popupload-dialog-table-header-bg-color); + border-bottom: 1px solid var(--ti-popupload-dialog-table-border-color); + } + + &__dialog-table-body { + width: 100%; + height: calc(100% - var(--ti-popupload-dialog-table-header-height)); + overflow-y: auto; + border-bottom: 1px solid var(--ti-popupload-dialog-table-border-color); + } + + &__dialog-table-list { + list-style: none; + } + + &__dialog-table-item { + width: 100%; + display: flex; + align-items: center; + justify-content: space-between; + + &:nth-child(even) { + background: rgba(51, 51, 51, 0.06); + } + + .delIcon { + height: 17px; + width: 17px; + fill: var(--ti-popupload-dialog-table-icon-color); + cursor: pointer; + + &:hover { + height: 17px; + width: 17px; + fill: var(--ti-popupload-dialog-table-icon-color-hover); + } + } + } + + &__modal .@{grid-modal-prefix-cls}__body { + overflow-y: auto; + } +} diff --git a/packages/theme/src/pop-upload/vars.less b/packages/theme/src/pop-upload/vars.less new file mode 100644 index 000000000..0ca097201 --- /dev/null +++ b/packages/theme/src/pop-upload/vars.less @@ -0,0 +1,21 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-pop-upload() { + --ti-popupload-font-size: var(--ti-common-font-size-base); + --ti-popupload-dialog-table-border-color: var(--ti-base-color-border); + --ti-popupload-dialog-table-header-height: var(--ti-base-size-height-small); + --ti-popupload-dialog-table-header-text-color: var(--ti-base-color-info-normal); + --ti-popupload-dialog-table-header-bg-color: #f1f1f1; + --ti-popupload-dialog-table-icon-color: var(--ti-base-color-brand-6); + --ti-popupload-dialog-table-icon-color-hover: var(--ti-base-color-bg-8); +} diff --git a/packages/theme/src/popeditor/index.js b/packages/theme/src/popeditor/index.js new file mode 100644 index 000000000..106c81ce2 --- /dev/null +++ b/packages/theme/src/popeditor/index.js @@ -0,0 +1,21 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-popeditor-border-color': '#d9d9d9', + 'tiny-popeditor-icon-color': '#1890ff', + 'tiny-popeditor-icon-color-disabled': '#999', + 'tiny-popeditor-icon-color-hover': '#40a9ff', + 'tiny-popeditor-tabs-text-color': '#333', + 'tiny-popeditor-tabs-selected-text-color': '#1890ff', + 'tiny-popeditor-tabs-li-height': '40px' +} diff --git a/packages/theme/src/popeditor/index.less b/packages/theme/src/popeditor/index.less new file mode 100644 index 000000000..da125309d --- /dev/null +++ b/packages/theme/src/popeditor/index.less @@ -0,0 +1,215 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@popeditor-prefix-cls: ~'@{css-prefix}popeditor'; +@input-prefix-cls: ~'@{css-prefix}input'; +@pager-prefix-cls: ~'@{css-prefix}pager'; +@dialog-box-prefix-cls: ~'@{css-prefix}dialog-box'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{popeditor-prefix-cls} { + .component-css-vars-popeditor(); + + .@{input-prefix-cls} { + &.@{popeditor-prefix-cls}-readonly .@{input-prefix-cls}__inner { + &:hover, + &:focus, + &:active { + cursor: pointer; + border-color: var(--ti-popeditor-border-color); + } + } + + &.is-disabled { + .@{input-prefix-cls}__inner { + &:hover, + &:focus, + &:active { + cursor: not-allowed; + + & + .@{input-prefix-cls}__suffix { + .@{svg-prefix-cls}__popeditor { + fill: var(--ti-popeditor-icon-color-disabled); + } + } + } + } + + .@{input-prefix-cls}__suffix { + cursor: not-allowed; + + .@{svg-prefix-cls}__popeditor, + .@{svg-prefix-cls}__popeditor:hover { + fill: var(--ti-popeditor-icon-color-disabled); + cursor: not-allowed; + } + } + } + + &.suggest { + .@{input-prefix-cls}__inner { + padding-right: 50px; + } + .@{svg-prefix-cls}__popeditor { + &.@{css-prefix}chevron { + margin-right: 8px; + } + } + } + + .@{input-prefix-cls}__inner { + &:hover, + &:focus, + &:active { + & + .@{input-prefix-cls}__suffix { + cursor: not-allowed; + + .@{svg-prefix-cls}__popeditor { + fill: var(--ti-popeditor-icon-color-hover); + } + } + } + } + + .@{input-prefix-cls}__suffix { + cursor: pointer; + + .@{svg-prefix-cls}__popeditor { + height: 30px; + line-height: 30px; + font-size: var(--ti-common-font-size-1); + fill: var(--ti-popeditor-icon-color); + cursor: pointer; + + &:hover { + fill: var(--ti-popeditor-icon-color-hover); + } + } + } + } + + .@{dialog-box-prefix-cls} { + .@{dialog-box-prefix-cls}__body { + padding: 8px 8px 0; + } + } + + &-top { + .@{popeditor-prefix-cls}__search-lists { + width: 100%; + display: flex; + justify-content: space-between; + align-items: center; + flex-wrap: wrap; + + .@{input-prefix-cls} { + position: relative; + font-size: var(--ti-common-font-size-base); + display: inline-block; + width: 100%; + } + + .@{popeditor-prefix-cls}__search-item { + display: flex; + justify-content: flex-end; + align-items: center; + margin-bottom: 12px; + + .@{popeditor-prefix-cls}__search-label { + text-align: right; + padding-right: 8px; + font-size: var(--ti-common-font-size-base); + } + } + + .@{popeditor-prefix-cls}__search-input { + flex: 1; + } + } + + .@{popeditor-prefix-cls}__search-footer { + width: 100%; + text-align: center; + margin: 12px auto; + } + } + + &-body { + width: 100%; + display: flex; + justify-content: space-between; + align-items: flex-start; + + &__left, + &__right { + width: 50%; + padding: 0 4px; + vertical-align: top; + + &.@{popeditor-prefix-cls}-body__radio { + width: 100%; + } + } + + .@{popeditor-prefix-cls}__tabs { + .@{popeditor-prefix-cls}__tabs-head { + white-space: nowrap; + margin: 0; + padding: 0 10px; + overflow: hidden; + height: 40px; + width: 100%; + position: relative; + + ul { + height: 40px; + border-bottom: 1px solid var(--ti-popeditor-border-color); + box-sizing: border-box; + + li { + float: left; + margin-right: -1px; + cursor: pointer; + padding: 0 20px; + color: var(--ti-popeditor-tabs-text-color); + min-width: 90px; + height: var(--ti-popeditor-tabs-li-height); + line-height: var(--ti-popeditor-tabs-li-height); + + &.@{popeditor-prefix-cls}__tabs-selected { + color: var(--ti-popeditor-tabs-selected-text-color); + border-bottom: 3px solid var(--ti-popeditor-tabs-selected-text-color); + font-weight: 700; + } + } + } + } + + .@{popeditor-prefix-cls}__tabs-body { + .tabs-body-item { + padding: 12px 12px 0px; + + .@{pager-prefix-cls} { + padding-bottom: 0; + } + } + } + } + } + + &_filter-input { + margin-bottom: 20px; + } +} diff --git a/packages/theme/src/popeditor/vars.less b/packages/theme/src/popeditor/vars.less new file mode 100644 index 000000000..5d1597145 --- /dev/null +++ b/packages/theme/src/popeditor/vars.less @@ -0,0 +1,21 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-popeditor() { + --ti-popeditor-border-color: var(--ti-base-color-border); + --ti-popeditor-icon-color: var(--ti-base-color-brand-6); + --ti-popeditor-icon-color-disabled: var(--ti-base-color-placeholder); + --ti-popeditor-icon-color-hover: var(--ti-base-color-brand-5); + --ti-popeditor-tabs-text-color: var(--ti-base-color-info-normal); + --ti-popeditor-tabs-selected-text-color: var(--ti-base-color-brand-6); + --ti-popeditor-tabs-li-height: var(--ti-common-size-10x); +} diff --git a/packages/theme/src/poplist/index.js b/packages/theme/src/poplist/index.js new file mode 100644 index 000000000..76ba6a028 --- /dev/null +++ b/packages/theme/src/poplist/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // poplist +} diff --git a/packages/theme/src/poplist/index.less b/packages/theme/src/poplist/index.less new file mode 100644 index 000000000..e54cb9098 --- /dev/null +++ b/packages/theme/src/poplist/index.less @@ -0,0 +1,26 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@poplist-prefix-cls: ~'@{css-prefix}poplist'; + +.@{poplist-prefix-cls} { + &.poplist-user { + min-width: 180px; + + .@{css-prefix-iconfont} { + float: right; + margin-left: 5px; + } + } +} diff --git a/packages/theme/src/poplist/vars.less b/packages/theme/src/poplist/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/poplist/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/popover/index.js b/packages/theme/src/popover/index.js new file mode 100644 index 000000000..1556c901f --- /dev/null +++ b/packages/theme/src/popover/index.js @@ -0,0 +1,30 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-popover-bg-color': '#fff', + 'tiny-popover-text-color': '#606266', + 'tiny-popover-border-color': '#d9d9d9', + 'tiny-popover-border-radius': '4px', + 'tiny-popover-font-size': '14px', + 'tiny-popover-title-text-color': '#303133', + 'tiny-popover-title-font-size': '16px', + 'tiny-popover-arrow-border-width': '6px', + 'tiny-popover-placement-margin-vertical': '12px', + 'tiny-popover-placement-margin-horizontal': '12px', + 'tiny-popover-placement-arrow-border-color': '#d9d9d9', + 'tiny-popover-placement-arrow-after-border-color': '#fff', + 'tiny-popover-box-shadow': '0 2px 12px 0 rgba(0, 0, 0, 0.1)', + 'tiny-popover-arrow-border-color': '#d9d9d9', + 'tiny-popover-padding-vertical': '11px', + 'tiny-popover-padding-horizontal': '15px' +} diff --git a/packages/theme/src/popover/index.less b/packages/theme/src/popover/index.less new file mode 100644 index 000000000..46ebd8c07 --- /dev/null +++ b/packages/theme/src/popover/index.less @@ -0,0 +1,157 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@popover-prefix-cls: ~'@{css-prefix}popover'; +@popper-prefix-cls: ~'@{css-prefix}popper'; + +.@{popover-prefix-cls}.@{popper-prefix-cls} { + .component-css-vars-popover(); + + position: absolute; + background: var(--ti-popover-bg-color); + color: var(--ti-popover-text-color); + border-radius: var(--ti-popover-border-radius); + border: 1px solid var(--ti-popover-border-color); + padding: var(--ti-popover-padding-vertical) var(--ti-popover-padding-horizontal); + z-index: 2000; + line-height: 1.4; + text-align: justify; + font-size: var(--ti-popover-font-size); + box-shadow: var(--ti-popover-box-shadow); + word-break: break-all; + + .popper__arrow, + .popper__arrow::after { + position: absolute; + display: block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + } + + .popper__arrow, + .@{popper-prefix-cls} .popper__arrow { + border-width: var(--ti-popover-arrow-border-width); + -webkit-filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03)); + filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03)); + } + + .popper__arrow::after { + content: ' '; + border-width: var(--ti-popover-arrow-border-width); + } + + &[x-placement^='top'] { + margin-bottom: var(--ti-popover-placement-margin-vertical); + + .popper__arrow { + bottom: -6px; + left: 50%; + margin-right: 3px; + border-top-color: var(--ti-popover-arrow-border-color); + border-bottom-width: 0; + + &::after { + bottom: 1px; + margin-left: -6px; + border-top-color: var(--ti-popover-placement-arrow-after-border-color); + border-bottom-width: 0; + } + } + } + + &[x-placement^='bottom'] { + margin-top: var(--ti-popover-placement-margin-vertical); + + .popper__arrow { + top: -6px; + left: 50%; + margin-right: 3px; + border-top-width: 0; + border-bottom-color: var(--ti-popover-arrow-border-color); + + &::after { + top: 1px; + margin-left: -6px; + border-top-width: 0; + border-bottom-color: var(--ti-popover-placement-arrow-after-border-color); + } + } + } + + &[x-placement^='right'] { + margin-left: var(--ti-popover-placement-margin-horizontal); + + .popper__arrow { + top: 50%; + left: -6px; + margin-bottom: 3px; + border-right-color: var(--ti-popover-arrow-border-color); + border-left-width: 0; + + &::after { + bottom: -6px; + left: 1px; + border-right-color: var(--ti-popover-placement-arrow-after-border-color); + border-left-width: 0; + } + } + } + + &[x-placement^='left'] { + margin-right: var(--ti-popover-placement-margin-horizontal); + + .popper__arrow { + top: 50%; + right: -6px; + margin-bottom: 3px; + border-right-width: 0; + border-left-color: var(--ti-popover-arrow-border-color); + + &::after { + right: 1px; + bottom: -6px; + margin-left: -6px; + border-right-width: 0; + border-left-color: var(--ti-popover-placement-arrow-after-border-color); + } + } + } + + .@{popover-prefix-cls}__plain { + padding: 18px 20px; + } + + .@{popover-prefix-cls}__title { + color: var(--ti-popover-title-text-color); + font-size: var(--ti-popover-title-font-size); + line-height: 1; + margin-bottom: 12px; + } + + &:focus, + &:focus:active, + .@{popover-prefix-cls}__reference:focus:hover, + .@{popover-prefix-cls}__reference:focus:not(.focusing) { + outline-width: 0; + } +} + +.@{popover-prefix-cls} { + &__reference { + display: inline-block; + } +} diff --git a/packages/theme/src/popover/vars.less b/packages/theme/src/popover/vars.less new file mode 100644 index 000000000..27e2d2928 --- /dev/null +++ b/packages/theme/src/popover/vars.less @@ -0,0 +1,29 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-popover() { + --ti-popover-bg-color: var(--ti-base-color-light); + --ti-popover-text-color: #606266; + --ti-popover-border-color: #d9d9d9; + --ti-popover-border-radius: var(--ti-common-border-radius-1); + --ti-popover-font-size: var(--ti-common-font-size-1); + --ti-popover-title-text-color: #303133; + --ti-popover-title-font-size: var(--ti-common-font-size-2); + --ti-popover-arrow-border-width: 6px; + --ti-popover-placement-margin-vertical: var(--ti-common-space-3x); + --ti-popover-placement-margin-horizontal: var(--ti-common-space-3x); + --ti-popover-placement-arrow-after-border-color: var(--ti-base-color-light); + --ti-popover-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); + --ti-popover-arrow-border-color: var(--ti-popover-border-color); + --ti-popover-padding-vertical: 11px; + --ti-popover-padding-horizontal: 15px; +} diff --git a/packages/theme/src/progress/index.js b/packages/theme/src/progress/index.js new file mode 100644 index 000000000..4a2eaf6f9 --- /dev/null +++ b/packages/theme/src/progress/index.js @@ -0,0 +1,23 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-progress-text-color': '#333', + 'tiny-progress-text-font-size': '12px', + 'tiny-progress-bar-border-radius': '100px', + 'tiny-progress-bar-outer-bg-color': '#f5f5f5', + 'tiny-progress-bar-inner-bg-color': '#1890ff', + 'tiny-progress-bar-inner-text-color': '#fff', + 'tiny-progress-success-bg-color': '#52c41a', + 'tiny-progress-warning-bg-color': '#fa8c16', + 'tiny-progress-exception-bg-color': '#f5222d' +} diff --git a/packages/theme/src/progress/index.less b/packages/theme/src/progress/index.less new file mode 100644 index 000000000..99735f552 --- /dev/null +++ b/packages/theme/src/progress/index.less @@ -0,0 +1,153 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/progress.less'; +@import '../custom.less'; +@import './vars.less'; + +@progress-prefix-cls: ~'@{css-prefix}progress'; + +.@{progress-prefix-cls} { + .component-css-vars-progress(); + + position: relative; + line-height: 1; + + &.is-success { + .progress-status(var(--ti-progress-success-bg-color)); + } + + &.is-warning { + .progress-status(var(--ti-progress-warning-bg-color)); + } + + &.is-exception { + .progress-status(var(--ti-progress-exception-bg-color)); + } + + &__text { + font-size: var(--ti-progress-text-font-size); + color: var(--ti-progress-text-color); + display: inline-block; + vertical-align: middle; + margin-left: 12px; + line-height: 1; + + i { + vertical-align: middle; + display: inline-block; + } + } + + &--circle, + &--dashboard { + display: inline-block; + + .@{progress-prefix-cls}__text { + top: 50%; + position: absolute; + width: 100%; + text-align: center; + margin: 0; + transform: translate(0, -50%); + left: 0; + + i { + display: inline-block; + vertical-align: middle; + } + } + } + + &--without-text &__text { + display: none; + } + + &--without-text &-bar { + padding-right: 0; + margin-right: 0; + display: block; + } + + &--text-inside &-bar { + padding-right: 0; + margin-right: 0; + } + + &-bar { + padding-right: 50px; + width: 100%; + margin-right: -55px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + + &__outer { + height: 6px; + border-radius: var(--ti-progress-bar-border-radius); + background-color: var(--ti-progress-bar-outer-bg-color); + overflow: hidden; + position: relative; + vertical-align: middle; + } + + &__inner { + background-color: var(--ti-progress-bar-inner-bg-color); + text-align: right; + left: 0; + position: absolute; + top: 0; + height: 100%; + border-radius: var(--ti-progress-bar-border-radius); + line-height: 1; + white-space: nowrap; + transition: width 0.6s ease; + + &::after { + content: ''; + height: 100%; + } + } + + &__innerText { + color: var(--ti-progress-bar-inner-text-color); + font-size: var(--ti-progress-text-font-size); + margin: 0 5px; + } + + &, + &__inner::after, + &__innerText { + display: inline-block; + vertical-align: middle; + } + } +} + +@-webkit-keyframes progress { + 0% { + background-position: 0 0; + } + + 100% { + background-position: 32px 0; + } +} + +@keyframes progress { + 0% { + background-position: 0 0; + } + + 100% { + background-position: 32px 0; + } +} diff --git a/packages/theme/src/progress/vars.less b/packages/theme/src/progress/vars.less new file mode 100644 index 000000000..a463e7fb1 --- /dev/null +++ b/packages/theme/src/progress/vars.less @@ -0,0 +1,23 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-progress() { + --ti-progress-text-color: var(--ti-base-color-info-normal); + --ti-progress-text-font-size: var(--ti-common-font-size-base); + --ti-progress-bar-border-radius: 100px; + --ti-progress-bar-outer-bg-color: var(--ti-base-color-bg-5); + --ti-progress-bar-inner-bg-color: var(--ti-base-color-brand-6); + --ti-progress-bar-inner-text-color: var(--ti-base-color-light); + --ti-progress-success-bg-color: var(--ti-base-color-success-normal); + --ti-progress-warning-bg-color: var(--ti-base-color-warning-normal); + --ti-progress-exception-bg-color: var(--ti-base-color-bg-8); +} diff --git a/packages/theme/src/radio-button/index.js b/packages/theme/src/radio-button/index.js new file mode 100644 index 000000000..9101aae2a --- /dev/null +++ b/packages/theme/src/radio-button/index.js @@ -0,0 +1,29 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-radio-button-text-color': '#333', + 'tiny-radio-button-hover-text-color': '#fff', + 'tiny-radio-button-border-color': '#d9d9d9', + 'tiny-radio-button-border-radius': '2px', + 'tiny-radio-button-font-size': '12px', + 'tiny-radio-button-bg-color': '#fff', + 'tiny-radio-button-checked-normal-bg-color': '#1890ff', + 'tiny-radio-button-checked-normal-border-color': '#1890ff', + 'tiny-radio-button-checked-normal-box-shadow': '-1px 0 0 0 #1890ff', + 'tiny-radio-button-checked-hover-bg-color': '#40a9ff', + 'tiny-radio-button-checked-hover-border-color': '#40a9ff', + 'tiny-radio-button-checked-hover-box-shadow': '-1px 0 0 0 #40a9ff', + 'tiny-radio-button-disabled-text-color': '#999', + 'tiny-radio-button-disabled-bg-color': '#f5f5f5', + 'tiny-radio-button-medium-font-size': '14px' +} diff --git a/packages/theme/src/radio-button/index.less b/packages/theme/src/radio-button/index.less new file mode 100644 index 000000000..d2a69b069 --- /dev/null +++ b/packages/theme/src/radio-button/index.less @@ -0,0 +1,161 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@radio-button-prefix-cls: ~'@{css-prefix}radio-button'; + +.@{radio-button-prefix-cls} { + .component-css-vars-radio-button(); + + &:first-child &__inner { + border-left: 1px solid var(--ti-radio-button-border-color); + border-radius: var(--ti-radio-button-border-radius) 0 0 var(--ti-radio-button-border-radius); + } + + &:first-child &__orig-radio:checked + &__inner { + box-shadow: none; + } + + &:last-child &__inner { + border-radius: 0 var(--ti-radio-button-border-radius) var(--ti-radio-button-border-radius) 0; + } + + &:first-child:last-child &__inner { + border-radius: var(--ti-radio-button-border-radius); + } + + &, + &__inner { + display: inline-block; + position: relative; + outline: 0; + } + + &__inner { + color: var(--ti-radio-button-text-color); + font-size: var(--ti-radio-button-font-size); + background: var(--ti-radio-button-bg-color); + border: 1px solid var(--ti-radio-button-border-color); + padding: 12px 20px; + font-weight: 500; + border-radius: 0; + border-left: 0; + line-height: 1; + white-space: nowrap; + vertical-align: middle; + appearance: none; + text-align: center; + box-sizing: border-box; + margin: 0; + cursor: pointer; + transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); + + &.is-round { + padding: 12px 20px; + } + + &:hover { + color: var(--ti-radio-button-hover-text-color); + background-color: var(--ti-radio-button-checked-hover-bg-color); + border-color: var(--ti-radio-button-checked-hover-border-color); + outline: 0; + } + + [class*='tiny-icon'] { + line-height: 0.9; + + & + span { + margin-left: 5px; + } + } + } + + &__orig-radio { + opacity: 0; + outline: 0; + position: absolute; + z-index: -1; + + &:checked { + & + .@{radio-button-prefix-cls}__inner { + color: #fff; + background-color: var(--ti-radio-button-checked-normal-bg-color); + border-color: var(--ti-radio-button-checked-normal-border-color); + box-shadow: var(--ti-radio-button-checked-normal-box-shadow); + + &:hover { + background-color: var(--ti-radio-button-checked-hover-bg-color); + border-color: var(--ti-radio-button-checked-hover-border-color); + box-shadow: var(--ti-radio-button-checked-hover-box-shadow); + } + } + } + + &:disabled { + & + .@{radio-button-prefix-cls}__inner { + color: var(--ti-radio-button-disabled-text-color); + border-color: var(--ti-radio-button-border-color); + background-color: var(--ti-radio-button-disabled-bg-color); + background-image: none; + box-shadow: none; + cursor: not-allowed; + } + } + + &:disabled:checked { + & + .@{radio-button-prefix-cls}__inner { + background-color: var(--ti-radio-input-checked-disabled-bg-color); + + &, + &:hover { + border-color: var(--ti-radio-input-checked-disabled-border-color); + } + } + } + } + + &--medium &__inner { + font-size: var(--ti-radio-button-medium-font-size); + padding: 10px 20px; + border-radius: 0; + + &.is-round { + padding: 10px 20px; + } + } + + &--small &__inner { + font-size: var(--ti-radio-button-font-size); + padding: 9px 15px; + border-radius: 0; + + &.is-round { + padding: 9px 15px; + } + } + + &--mini &__inner { + font-size: var(--ti-radio-button-font-size); + padding: 7px 15px; + border-radius: 0; + + &.is-round { + padding: 7px 15px; + } + } + + &:focus:not(.is-focus):not(:active):not(.is-disabled) { + box-shadow: 0 0 2px 2px var(--ti-radio-bordered-hover-border-color); + } +} diff --git a/packages/theme/src/radio-button/vars.less b/packages/theme/src/radio-button/vars.less new file mode 100644 index 000000000..c5aa7b69b --- /dev/null +++ b/packages/theme/src/radio-button/vars.less @@ -0,0 +1,29 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-radio-button() { + --ti-radio-button-text-color: var(--ti-base-color-info-normal); + --ti-radio-button-hover-text-color: var(--ti-base-color-light); + --ti-radio-button-border-color: var(--ti-base-color-border); + --ti-radio-button-border-radius: var(--ti-common-border-radius-normal); + --ti-radio-button-font-size: var(--ti-common-font-size-base); + --ti-radio-button-bg-color: var(--ti-base-color-light); + --ti-radio-button-checked-normal-bg-color: var(--ti-base-color-brand-6); + --ti-radio-button-checked-normal-border-color: var(--ti-base-color-brand-6); + --ti-radio-button-checked-normal-box-shadow: -1px 0 0 0 var(--ti-base-color-brand-6); + --ti-radio-button-checked-hover-bg-color: var(--ti-base-color-brand-5); + --ti-radio-button-checked-hover-border-color: var(--ti-base-color-brand-5); + --ti-radio-button-checked-hover-box-shadow: -1px 0 0 0 var(--ti-base-color-brand-5); + --ti-radio-button-disabled-text-color: var(--ti-base-color-placeholder); + --ti-radio-button-disabled-bg-color: var(--ti-base-color-bg-5); + --ti-radio-button-medium-font-size: var(--ti-common-font-size-1); +} diff --git a/packages/theme/src/radio-group/index.js b/packages/theme/src/radio-group/index.js new file mode 100644 index 000000000..7fb098c4b --- /dev/null +++ b/packages/theme/src/radio-group/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // radio-group +} diff --git a/packages/theme/src/radio-group/index.less b/packages/theme/src/radio-group/index.less new file mode 100644 index 000000000..14d8d3642 --- /dev/null +++ b/packages/theme/src/radio-group/index.less @@ -0,0 +1,62 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@radio-group-prefix-cls: ~'@{css-prefix}radio-group'; +@radio-button-prefix-cls: ~'@{css-prefix}radio-button'; +@radio-prefix-cls: ~'@{css-prefix}radio'; + +.@{radio-group-prefix-cls} { + display: inline-flex; + + &.list-inline { + flex-direction: column; + + .@{radio-prefix-cls} { + display: flex; + margin-right: 0; + + &:not(:last-child) { + margin-bottom: 8px; + } + } + + .@{radio-button-prefix-cls} { + display: block; + + &:first-child .@{radio-button-prefix-cls}__inner { + border-radius: var(--ti-radio-button-border-radius) var(--ti-radio-button-border-radius) 0 0; + border-top: 1px solid var(--ti-radio-button-border-color); + } + + &:last-child .@{radio-button-prefix-cls}__inner { + border-radius: 0 0 var(--ti-radio-button-border-radius) var(--ti-radio-button-border-radius); + } + + &.is-active .@{radio-button-prefix-cls}__inner { + box-shadow: none; + border-color: var(--ti-radio-button-checked-normal-border-color); + } + + &.is-active.is-disabled .@{radio-button-prefix-cls}__inner { + border-color: var(--ti-radio-input-checked-disabled-border-color); + } + } + + .@{radio-button-prefix-cls}__inner { + border-top: 0; + border-left: 1px solid var(--ti-radio-button-border-color); + } + } +} diff --git a/packages/theme/src/radio-group/vars.less b/packages/theme/src/radio-group/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/radio-group/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/radio/index.js b/packages/theme/src/radio/index.js new file mode 100644 index 000000000..8d41f6935 --- /dev/null +++ b/packages/theme/src/radio/index.js @@ -0,0 +1,42 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-radio-text-color': '#333333', + 'tiny-radio-font-size': '12px', + 'tiny-radio-bordered-height': '40px', + 'tiny-radio-bordered-border-radius': '2px', + 'tiny-radio-bordered-border-color': '#d9d9d9', + 'tiny-radio-input-disabled-border-color': '#dfe1e6', + 'tiny-radio-bordered-checked-background-color': '#fff', + 'tiny-radio-bordered-active-border-color': '#7693f5', + 'tiny-radio-bordered-checked-border-color': '#1890ff', + 'tiny-radio-bordered-hover-border-color': '#40a9ff', + 'tiny-radio-bordered-checked-hover-border-color': '#5e7ce0', + 'tiny-radio-input-disabled-bg-color': '#f5f5f5', + 'tiny-radio-input-checked-disabled-bg-color': '#bfbfbf', + 'tiny-radio-input-checked-disabled-border-color': '#bfbfbf', + 'tiny-radio-input-disabled-text-color': '#999', + 'tiny-radio-inner-bg-color': '#fff', + 'tiny-radio-inner-checked-bg-color': '#5e7ce0', + 'tiny-radio-inner-size': '8px', + 'tiny-radio-inner-checked-disabled-bg-color': '#d9d9d9', + 'tiny-radio-medium-height': '36px', + 'tiny-radio-medium-inner-height': '14px', + 'tiny-radio-medium-inner-width': '14px', + 'tiny-radio-small-height': '32px', + 'tiny-radio-small-inner-height': '12px', + 'tiny-radio-small-inner-width': '12px', + 'tiny-radio-mini-height': '28px', + 'tiny-radio-mini-inner-height': '12px', + 'tiny-radio-mini-inner-width': '12px' +} diff --git a/packages/theme/src/radio/index.less b/packages/theme/src/radio/index.less new file mode 100644 index 000000000..ca2a60a3a --- /dev/null +++ b/packages/theme/src/radio/index.less @@ -0,0 +1,238 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +@radio-prefix-cls: ~'@{css-prefix}radio'; + +.@{radio-prefix-cls} { + .component-css-vars-radio(); + + color: var(--ti-radio-text-color); + font-weight: 500; + margin-right: 30px; + display: inline-flex; + align-items: center; + position: relative; + cursor: pointer; + .user-select(none); + + &:last-child { + margin-right: 0; + } + + &.is-bordered { + padding: 4px 12px; + border-radius: var(--ti-radio-bordered-border-radius); + border: 1px solid var(--ti-radio-bordered-border-color); + box-sizing: border-box; + height: var(--ti-radio-bordered-height); + + & + & { + margin-left: 10px; + } + + &.is-checked { + border-color: var(--ti-radio-bordered-checked-border-color); + } + + &.is-disabled { + cursor: not-allowed; + border-color: var(--ti-radio-bordered-border-color); + } + } + + &, + &__input { + white-space: nowrap; + line-height: 1; + outline: 0; + } + + &__input { + cursor: pointer; + line-height: 1; + display: inline-flex; + display: inline-block\9; + + // 兼容ie10-ie11 + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + display: inline-block; + } + + // 兼容edge + @supports (-ms-ime-align: auto) { + display: inline-block; + } + + &.is-disabled { + .@{radio-prefix-cls}__inner { + border-color: var(--ti-radio-input-disabled-border-color); + + &, + &::after { + cursor: not-allowed; + background-color: var(--ti-radio-input-disabled-bg-color); + } + + & + .@{radio-prefix-cls}__label { + cursor: not-allowed; + } + } + + &.is-checked .@{radio-prefix-cls}__inner { + background-color: var(--ti-radio-input-checked-disabled-bg-color); + border-color: var(--ti-base-color-common-1); + + &::after { + background-color: var(--ti-radio-inner-checked-disabled-bg-color); + } + } + + & + span.@{radio-prefix-cls}__label { + color: var(--ti-radio-input-disabled-text-color); + cursor: not-allowed; + } + } + + &.is-checked { + .@{radio-prefix-cls}__inner { + border-color: var(--ti-radio-bordered-checked-border-color); + background: var(--ti-radio-bordered-checked-background-color); + + &::after { + transform: translate(-50%, -50%) scale(1); + background-color: var(--ti-radio-inner-checked-bg-color); + } + } + + &:not(.is-disabled) { + .@{radio-prefix-cls}__inner { + &:hover { + border-color: var(--ti-radio-bordered-checked-hover-border-color); + } + } + } + } + } + + &__inner { + border: 1px solid var(--ti-radio-bordered-border-color); + border-radius: 100%; + width: 16px; + height: 16px; + background-color: var(--ti-radio-inner-bg-color); + position: relative; + display: inline-block; + cursor: pointer; + box-sizing: border-box; + outline: none; + + &:hover { + border-color: var(--ti-radio-bordered-hover-border-color); + } + + &:active { + border-color: var(--ti-radio-bordered-active-border-color); + } + + &::after { + width: var(--ti-radio-inner-size); + height: var(--ti-radio-inner-size); + border-radius: 100%; + background-color: var(--ti-radio-inner-bg-color); + content: ''; + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%) scale(0); + transition: transform 0.15s ease-in; + } + } + + &__original { + opacity: 0; + outline: 0; + position: absolute; + z-index: -1; + margin: 0; + width: 0; + height: 0; + } + + &__label { + font-size: var(--ti-radio-font-size); + padding-left: 8px; + vertical-align: middle; + } + + &--medium { + &.is-bordered { + border-radius: var(--ti-radio-bordered-border-radius); + height: var(--ti-radio-medium-height); + + .@{radio-prefix-cls}__inner { + height: var(--ti-radio-medium-inner-height); + width: var(--ti-radio-medium-inner-width); + } + + .@{radio-prefix-cls}__label { + font-size: var(--ti-radio-font-size); + } + } + } + + &--small { + &.is-bordered { + border-radius: var(--ti-radio-bordered-border-radius); + height: var(--ti-radio-small-height); + + .@{radio-prefix-cls}__inner { + height: var(--ti-radio-small-inner-height); + width: var(--ti-radio-small-inner-width); + } + + .@{radio-prefix-cls}__label { + font-size: var(--ti-radio-font-size); + } + } + } + + &--mini { + &.is-bordered { + padding: 0 8px; + border-radius: var(--ti-radio-bordered-border-radius, 2px); + height: var(--ti-radio-mini-height); + line-height: calc(var(--ti-radio-mini-height) - 2px); + + .@{radio-prefix-cls}__inner { + height: var(--ti-radio-mini-inner-height); + width: var(--ti-radio-mini-inner-width); + + &::after { + width: 4px; + height: 4px; + } + } + + .@{radio-prefix-cls}__label { + font-size: var(--ti-radio-font-size); + } + } + } + + &:focus:not(.is-focus):not(:active):not(.is-disabled) &__inner { + box-shadow: 0 0 2px 2px var(--ti-radio-bordered-hover-border-color); + } +} diff --git a/packages/theme/src/radio/vars.less b/packages/theme/src/radio/vars.less new file mode 100644 index 000000000..eee4fcaeb --- /dev/null +++ b/packages/theme/src/radio/vars.less @@ -0,0 +1,42 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-radio() { + --ti-radio-text-color: var(--ti-base-color-info-normal); + --ti-radio-font-size: var(--ti-common-font-size-base); + --ti-radio-bordered-height: var(--ti-common-size-10x); + --ti-radio-bordered-border-radius: var(--ti-common-border-radius-normal); + --ti-radio-bordered-border-color: var(--ti-base-color-common-2); + --ti-radio-input-disabled-border-color: var(--ti-base-color-common-1); + --ti-radio-bordered-checked-border-color: var(--ti-base-color-brand-6); + --ti-radio-bordered-checked-background-color: var(--ti-base-color-light); + --ti-radio-bordered-hover-border-color: var(--ti-base-color-brand-6); + --ti-radio-bordered-checked-hover-border-color: var(--ti-base-color-brand-6); + --ti-radio-bordered-active-border-color: var(--ti-base-color-primary-active); + --ti-radio-input-disabled-bg-color: var(--ti-base-color-bg-5); + --ti-radio-input-checked-disabled-bg-color: var(--ti-base-color-bg-5); + --ti-radio-input-checked-disabled-border-color: var(--ti-base-color-bg-5); + --ti-radio-input-disabled-text-color: var(--ti-base-color-placeholder); + --ti-radio-inner-bg-color: var(--ti-base-color-light); + --ti-radio-inner-checked-bg-color: var(--ti-base-color-brand-6); + --ti-radio-inner-size: 8px; + --ti-radio-inner-checked-disabled-bg-color: var(--ti-base-color-common-2); + --ti-radio-medium-height: var(--ti-base-size-height-small); + --ti-radio-medium-inner-height: 14px; + --ti-radio-medium-inner-width: 14px; + --ti-radio-small-height: var(--ti-common-size-8x); + --ti-radio-small-inner-height: var(--ti-common-size-3x); + --ti-radio-small-inner-width: var(--ti-common-size-3x); + --ti-radio-mini-height: var(--ti-common-size-7x); + --ti-radio-mini-inner-height: var(--ti-common-size-3x); + --ti-radio-mini-inner-width: var(--ti-common-size-3x); +} diff --git a/packages/theme/src/rate/index.js b/packages/theme/src/rate/index.js new file mode 100644 index 000000000..3e8d40fbf --- /dev/null +++ b/packages/theme/src/rate/index.js @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-rate-text-margin-left': '8px', + 'tiny-rate-text-font-size': '16px', + 'tiny-rate-bottom-font-size': '12px', + 'tiny-rate-bottom-margin-top': '8px' +} diff --git a/packages/theme/src/rate/index.less b/packages/theme/src/rate/index.less new file mode 100644 index 000000000..a83cfd0ef --- /dev/null +++ b/packages/theme/src/rate/index.less @@ -0,0 +1,70 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@rate-prefix-cls: ~'@{css-prefix}rate'; + +.@{rate-prefix-cls} { + .component-css-vars-rate(); + + display: inline-flex; + outline: none; + + &:active, + &:focus { + outline-width: 0; + } + + & &__star { + position: relative; + display: inline-block; + font-size: 0px; + vertical-align: middle; + text-align: center; + line-height: 1; + } + + svg { + transition: 0.3s; + } + + svg.hover { + transform: scale(1.15); + } + + & &__decimal { + display: inline-block; + overflow: hidden; + font-size: var(--ti-common-font-size-2); + position: absolute; + top: 0px; + left: 50%; + transform: translateX(-50%); + } + + & &__text { + vertical-align: middle; + margin-left: var(--ti-rate-text-margin-left); + font-size: var(--ti-rate-text-font-size); + } + + & &__bottom-text { + position: relative; + font-size: var(--ti-rate-bottom-font-size); + text-align: center; + text-overflow: clip; + overflow: hidden; + margin-top: var(--ti-rate-bottom-margin-top); + } +} diff --git a/packages/theme/src/rate/vars.less b/packages/theme/src/rate/vars.less new file mode 100644 index 000000000..62b63c6e8 --- /dev/null +++ b/packages/theme/src/rate/vars.less @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-rate() { + --ti-rate-text-margin-left: 8px; + --ti-rate-text-font-size: 16px; + --ti-rate-bottom-font-size: var(--ti-common-font-size-base); + --ti-rate-bottom-margin-top: 8px; +} diff --git a/packages/theme/src/roles/index.js b/packages/theme/src/roles/index.js new file mode 100644 index 000000000..57769e39c --- /dev/null +++ b/packages/theme/src/roles/index.js @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-roles-poplist-item-height': '30px', + 'tiny-roles-poplist-item-text-color': '#333', + 'tiny-roles-poplist-item-font-size': '12px', + 'tiny-roles-poplist-item-hover-bg-color': '#e6f7ff', + 'tiny-roles-poplist-item-selected-bg-color': '#f5f5f5', + 'tiny-roles-poplist-item-selected-text-color': '#fff' +} diff --git a/packages/theme/src/roles/index.less b/packages/theme/src/roles/index.less new file mode 100644 index 000000000..02a340957 --- /dev/null +++ b/packages/theme/src/roles/index.less @@ -0,0 +1,68 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@roles-prefix-cls: ~'@{css-prefix}roles'; + +.@{roles-prefix-cls} { + .component-css-vars-roles(); + + svg { + margin-left: 2px; + } + + &__selector { + &.@{css-prefix}popover.@{css-prefix}popper { + padding: 0; + } + } + + &__selector &__poplist-item { + padding: 0 8px; + } + + &__selector-body { + max-height: 300px; + overflow-y: auto; + overflow-x: hidden; + } + + &__poplist { + min-width: 180px; + } + + &__poplist-item { + min-height: var(--ti-roles-poplist-item-height); + line-height: var(--ti-roles-poplist-item-height); + max-width: 100%; + color: var(--ti-roles-poplist-item-text-color); + font-size: var(--ti-roles-poplist-item-font-size); + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + cursor: pointer; + + &:hover { + background: var(--ti-roles-poplist-item-hover-bg-color); + } + + &.is-selected { + &, + &:hover { + background: var(--ti-roles-poplist-item-selected-bg-color); + color: var(--ti-roles-poplist-item-selected-text-color); + } + } + } +} diff --git a/packages/theme/src/roles/vars.less b/packages/theme/src/roles/vars.less new file mode 100644 index 000000000..dabad3185 --- /dev/null +++ b/packages/theme/src/roles/vars.less @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-roles() { + --ti-roles-poplist-item-height: var(--ti-base-size-height-minor); + --ti-roles-poplist-item-text-color: var(--ti-base-color-info-normal); + --ti-roles-poplist-item-font-size: var(--ti-common-font-size-base); + --ti-roles-poplist-item-hover-bg-color: var(--ti-base-color-hover-background); + --ti-roles-poplist-item-selected-bg-color: var(--ti-base-color-selected-background); + --ti-roles-poplist-item-selected-text-color: var(--ti-base-color-selected-text-color); +} diff --git a/packages/theme/src/row/index.js b/packages/theme/src/row/index.js new file mode 100644 index 000000000..4ac0d4975 --- /dev/null +++ b/packages/theme/src/row/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // row +} diff --git a/packages/theme/src/row/index.less b/packages/theme/src/row/index.less new file mode 100644 index 000000000..f943cab1d --- /dev/null +++ b/packages/theme/src/row/index.less @@ -0,0 +1,58 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../custom.less'; +@import '../grid-system/index.less'; + +@row-prefix-cls: ~'@{css-prefix}row'; + +.@{row-prefix-cls} { + width: 100%; + .clearfix(); + + &.row-flex { + display: flex; + } + + &.row-justify-start { + justify-content: flex-start; + } + + &.row-justify-end { + justify-content: flex-end; + } + + &.row-justify-center { + justify-content: center; + } + + &.row-justify-space-around { + justify-content: space-around; + } + + &.row-justify-space-between { + justify-content: space-between; + } + + &.row-align-top { + align-items: flex-start; + } + + &.row-align-middle { + align-items: center; + } + + &.row-align-bottom { + align-items: flex-end; + } +} diff --git a/packages/theme/src/scroll-text/index.js b/packages/theme/src/scroll-text/index.js new file mode 100644 index 000000000..9bb97c381 --- /dev/null +++ b/packages/theme/src/scroll-text/index.js @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-scroll-text-height': '36px', + 'tiny-scroll-text-bg-color': '#f1f1f1', + 'tiny-scroll-text-margin-vertical': '0', + 'tiny-scroll-text-margin-horizontal': 'auto' +} diff --git a/packages/theme/src/scroll-text/index.less b/packages/theme/src/scroll-text/index.less new file mode 100644 index 000000000..7d0d23ebd --- /dev/null +++ b/packages/theme/src/scroll-text/index.less @@ -0,0 +1,130 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@scroll-text-prefix-cls: ~'@{css-prefix}scroll-text'; + +.@{scroll-text-prefix-cls} { + &__wrapper { + .component-css-vars-scroll-text(); + } + + width: 300px; + height: var(--ti-scroll-text-height); + line-height: var(--ti-scroll-text-height); + background: var(--ti-scroll-text-bg-color); + margin: var(--ti-scroll-text-margin-vertical) var(--ti-scroll-text-margin-horizontal); + overflow: hidden; + + & &__content { + width: max-content; + height: 100%; + padding: 0 8px; + display: flex; + display: inline-block\9; + align-items: center; + white-space: nowrap; + position: relative; + animation: infinite linear; + animation-duration: 7s; + animation-iteration-count: infinite; + animation-timing-function: linear; + + // 兼容ie10-ie11 + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + display: inline-block; + } + + // 兼容edge + @supports (-ms-ime-align: auto) { + display: inline-block; + } + + &.left { + animation-name: moveLeft; + } + + &.right { + animation-name: moveRight; + } + + &.up { + animation-name: moveUp; + } + + &.down { + animation-name: moveDown; + } + + &.singleUp { + animation-name: singleUp; + } + + &.stop { + animation-play-state: paused; + } + + &.up, + &.down { + width: 100%; + white-space: normal; + } + + p { + width: auto; + line-height: 1; + margin: 0; + } + } +} + +@keyframes moveLeft { + 0% { + transform: translateX(300px); + } + + 100% { + transform: translateX(-100%); + } +} + +@keyframes moveRight { + 0% { + transform: translateX(-100%); + } + + 100% { + transform: translateX(300px); + } +} + +@keyframes moveUp { + 0% { + transform: translateY(100%); + } + + 100% { + transform: translateY(-100%); + } +} + +@keyframes moveDown { + 0% { + transform: translateY(-100%); + } + + 100% { + transform: translateY(100%); + } +} diff --git a/packages/theme/src/scroll-text/vars.less b/packages/theme/src/scroll-text/vars.less new file mode 100644 index 000000000..0d76e26f0 --- /dev/null +++ b/packages/theme/src/scroll-text/vars.less @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-scroll-text() { + --ti-scroll-text-height: var(--ti-base-size-height-small); + --ti-scroll-text-bg-color: #f1f1f1; + --ti-scroll-text-margin-vertical: 0; + --ti-scroll-text-margin-horizontal: auto; +} diff --git a/packages/theme/src/scrollbar/index.js b/packages/theme/src/scrollbar/index.js new file mode 100644 index 000000000..721234f38 --- /dev/null +++ b/packages/theme/src/scrollbar/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // scrollbar +} diff --git a/packages/theme/src/scrollbar/index.less b/packages/theme/src/scrollbar/index.less new file mode 100644 index 000000000..65b28dce5 --- /dev/null +++ b/packages/theme/src/scrollbar/index.less @@ -0,0 +1,82 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@scrollbar-prefix-cls: ~'@{css-prefix}scrollbar'; + +.@{scrollbar-prefix-cls} { + overflow: hidden; + position: relative; + + &:active > &__bar, + &:focus > &__bar, + &:hover > &__bar { + opacity: 1; + transition: opacity 340ms ease-out; + } + + &__wrap { + overflow: scroll; + height: 100%; + max-height: 200px; + } + + &__wrap--hidden-default::-webkit-scrollbar { + width: 0; + height: 0; + } + + &__thumb { + position: relative; + display: block; + width: 0; + height: 0; + cursor: pointer; + border-radius: inherit; + background-color: rgba(144, 147, 153, 0.3); + transition: 0.3s background-color; + + &:hover { + background-color: rgba(144, 147, 153, 0.5); + } + } + + &__bar { + position: absolute; + right: 2px; + bottom: 2px; + z-index: 1; + border-radius: 4px; + opacity: 0; + transition: opacity 120ms ease-out; + + &.is-vertical { + width: 6px; + top: 2px; + + & > div { + width: 100%; + } + } + + &.is-horizontal { + height: 6px; + left: 2px; + + & > div { + height: 100%; + } + } + } +} diff --git a/packages/theme/src/scrollbar/vars.less b/packages/theme/src/scrollbar/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/scrollbar/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/search/index.js b/packages/theme/src/search/index.js new file mode 100644 index 000000000..655a3e6a8 --- /dev/null +++ b/packages/theme/src/search/index.js @@ -0,0 +1,34 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-search-font-size': '12px', + 'tiny-search-input-height': '30px', + 'tiny-search-input-btn-width': '28px', + 'tiny-search-input-btn-line-height': '28px', + 'tiny-search-input-text-color': '#333333', + 'tiny-search-input-bg-color': '#fff', + 'tiny-search-input-btn-text-color': '#1890ff', + 'tiny-search-input-btn-hover-border-color': '#40a9ff', + 'tiny-search-input-btn-font-size': '14px', + 'tiny-search-input-border-color': '#d9d9d9', + 'tiny-search-icon-border-color': '#dbdbdb', + 'tiny-search-icon-color': '#c4c4c4', + 'tiny-search-size-height-normal': '30px', + 'tiny-search-size-height-small': '24px', + 'tiny-search-selector-text-color': '#333333', + 'tiny-search-line-hover-border-color': '#bfbfbf', + 'tiny-search-list-hover-bg-color': '#f5f5f5', + 'tiny-search-selector-border-radius': '2px', + 'tiny-search-selector-bg-color': '#fff', + 'tiny-search-selector-list-height': '30px' +} diff --git a/packages/theme/src/search/index.less b/packages/theme/src/search/index.less new file mode 100644 index 000000000..a1fcbe6aa --- /dev/null +++ b/packages/theme/src/search/index.less @@ -0,0 +1,203 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/input.less'; +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; +@import '../transition/zoom-in-top.less'; +@import '../transition/search-line.less'; +@import '../transition/icon.less'; + +@search-prefix-cls: ~'@{css-prefix}search'; + +.@{search-prefix-cls} { + .component-css-vars-search(); + + position: relative; + display: inline-block; + font-size: var(--ti-search-font-size); + width: 100%; + + & &__line { + display: flex; + align-items: center; + width: 100%; + height: var(--ti-search-input-height); + border: 1px solid var(--ti-search-input-border-color); + border-radius: var(--ti-common-border-radius-normal); + background-color: var(--ti-search-input-bg-color); + transition: 0.4s; + border-collapse: separate; + + &:hover { + border-color: var(--ti-search-line-hover-border-color); + } + + &.focus, + &:focus { + border-color: var(--ti-search-input-btn-hover-border-color); + } + } + + & &__input { + width: 100%; + height: 100%; + line-height: 1; + + color: var(--ti-search-input-text-color); + padding: 0 0 0 8px; + border: 0; + outline: none; + background: transparent; + .placeholder(@color: #999999); + + &:focus { + .placeholder(@color: #d9d9d9); + } + } + + & &__input-btn { + text-align: center; + + a { + text-decoration: none; + display: block; + width: var(--ti-search-input-btn-width); + height: 100%; + line-height: var(--ti-search-input-btn-line-height); + } + + svg { + fill: var(--ti-search-input-btn-text-color); + font-size: var(--ti-search-input-btn-font-size); + } + + &:hover svg { + fill: var(--ti-search-input-btn-hover-border-color); + } + } + + & &__present { + color: var(--ti-search-selector-text-color); + line-height: var(--ti-search-size-height-normal); + padding-left: 8px; + white-space: nowrap; + + .icon-outer { + height: calc(var(--ti-search-size-height-normal) - 12px); + line-height: calc(var(--ti-search-size-height-normal) - 12px); + display: inline-block; + padding: 0 8px 0 4px; + border-right: 1px solid var(--ti-search-input-border-color); + cursor: pointer; + + svg { + font-size: var(--ti-search-input-btn-font-size); + fill: var(--ti-search-icon-color); + } + } + } + + & &__selector { + position: absolute; + top: 32px; + left: 0; + overflow: hidden; + min-width: 68px; + border: 1px solid var(--ti-search-input-border-color); + border-radius: var(--ti-search-selector-border-radius); + font-size: var(--ti-search-font-size); + box-shadow: var(--ti-base-box-shadow); + background: var(--ti-search-selector-bg-color); + color: var(--ti-search-selector-text-color); + margin-top: 2px; + } + + & &__selector-body { + max-height: 300px; + overflow-y: auto; + overflow-x: hidden; + } + + & &__poplist-item { + min-height: var(--ti-search-selector-list-height); + padding: 0 8px; + line-height: var(--ti-search-selector-list-height); + max-width: 100%; + font-size: var(--ti-search-font-size); + overflow: hidden; + text-align: left; + text-overflow: ellipsis; + white-space: nowrap; + + &:hover { + background: var(--ti-search-list-hover-bg-color); + cursor: pointer; + } + + span { + font-size: var(--ti-search-font-size); + } + + .icon-check { + font-size: var(--ti-common-font-size-2); + + &:hover { + color: var(--ti-search-input-btn-hover-border-color); + } + } + } + + &.mini &__line { + border-radius: var(--ti-search-input-height); + width: 100%; + float: right; + } + + &.mini.collapse &__input-btn { + svg { + fill: var(--ti-search-icon-color); + } + } + + &.mini &__input { + border-radius: var(--ti-search-input-height); + } + + &.collapse &__input { + padding: 0; + width: var(--ti-search-size-height-normal); + float: right; + } + + &.mini.collapse &__line { + width: 30px; + float: right; + background-color: transparent; + border-collapse: separate; + } + + &.mini.collapse &__present, + &.mini.collapse &__input { + display: none; + } + + .fade-enter-to { + opacity: 0; + } + + .fade-enter, + .fade-leave-to { + opacity: 0; + } +} diff --git a/packages/theme/src/search/vars.less b/packages/theme/src/search/vars.less new file mode 100644 index 000000000..86249743b --- /dev/null +++ b/packages/theme/src/search/vars.less @@ -0,0 +1,34 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-search() { + --ti-search-font-size: var(--ti-common-font-size-base); + --ti-search-input-height: var(--ti-base-size-height-normal); + --ti-search-input-btn-width: var(--ti-base-size-height-small); + --ti-search-input-btn-line-height: var(--ti-base-size-height-small); + --ti-search-input-text-color: var(--ti-base-color-info-normal); + --ti-search-input-bg-color: var(--ti-base-color-light); + --ti-search-input-btn-text-color: var(--ti-base-color-common-5); + --ti-search-input-btn-hover-border-color: var(--ti-base-color-brand-5); + --ti-search-input-btn-font-size: var(--ti-common-font-size-1); + --ti-search-input-border-color: var(--ti-base-color-border); + --ti-search-icon-border-color: #dbdbdb; + --ti-search-icon-color: #c4c4c4; + --ti-search-size-height-normal: var(--ti-base-size-height-normal); + --ti-search-size-height-small: var(--ti-base-size-height-small); + --ti-search-selector-text-color: var(--ti-base-color-info-normal); + --ti-search-line-hover-border-color: var(--ti-base-color-border-hover); + --ti-search-list-hover-bg-color: var(--ti-base-color-selected-background); + --ti-search-selector-border-radius: var(--ti-common-border-radius-normal); + --ti-search-selector-bg-color: var(--ti-base-color-light); + --ti-search-selector-list-height: var(--ti-base-size-height-normal); +} diff --git a/packages/theme/src/select-dropdown/index.js b/packages/theme/src/select-dropdown/index.js new file mode 100644 index 000000000..fe2e864ec --- /dev/null +++ b/packages/theme/src/select-dropdown/index.js @@ -0,0 +1,33 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-select-dropdown-border-color': '#d9d9d9', + 'tiny-select-dropdown-border-radius': '2px', + 'tiny-select-dropdown-bg-color': '#fff', + 'tiny-select-dropdown-empty-text-color': '#999', + 'tiny-select-dropdown-empty-font-size': '14px', + 'tiny-select-dropdown-list-padding-top': '0', + 'tiny-select-dropdown-list-padding-horizontal': '0', + 'tiny-select-dropdown-list-padding-bottom': '6px', + 'tiny-select-dropdown-item-padding-vertical': '0', + 'tiny-select-dropdown-item-padding-horizontal': '8px', + 'tiny-select-dropdown-item-margin-top': '0', + 'tiny-select-dropdown-search-bg-color': '#f2f5fc', + 'tiny-select-dropdown-search-margin-bottom': '4px', + 'tiny-select-dropdown-line-bg-color': '4px', + 'tiny-select-dropdown-line-margin-vertical': '0', + 'tiny-select-dropdown-line-margin-horizontal': '8px', + 'tiny-select-dropdown-line-height': '14px', + 'tiny-select-dropdown-line-width': '1px', + 'tiny-select-dropdown-active-text-color': '#5e7ce0', +} diff --git a/packages/theme/src/select-dropdown/index.less b/packages/theme/src/select-dropdown/index.less new file mode 100644 index 000000000..79eb39102 --- /dev/null +++ b/packages/theme/src/select-dropdown/index.less @@ -0,0 +1,110 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@select-dropdown-prefix-cls: ~'@{css-prefix}select-dropdown'; +@tree-prefix-cls: ~'@{css-prefix}tree'; +@popper-prefix-cls: ~'@{css-prefix}popper'; +@scrollbar-prefix-cls: ~'@{css-prefix}scrollbar'; + +.@{select-dropdown-prefix-cls} { + .component-css-vars-select-dropdown(); + + position: absolute; + z-index: 1001; + border: 1px solid var(--ti-select-dropdown-border-color); + border-radius: var(--ti-select-dropdown-border-radius); + background-color: var(--ti-select-dropdown-bg-color); + box-shadow: var(--ti-base-box-shadow); + margin-top: var(--ti-base-dropdown-gap); + box-sizing: border-box; + + .@{tree-prefix-cls} { + max-height: 300px; + overflow-y: auto; + } + + &.@{popper-prefix-cls} { + margin-top: var(--ti-base-dropdown-gap); + } + + & .@{scrollbar-prefix-cls}.is-empty &__list { + padding: 0; + } + + & &__search { + margin-bottom: var(--ti-select-dropdown-search-margin-bottom); + + .tiny-input__inner { + box-sizing: border-box; + border-width: 0; + background-color: var(--ti-select-dropdown-search-bg-color); + padding-right: 54px; + } + + .tiny-icon-close { + &::after { + content: ''; + display: inline-block; + height: var(--ti-select-dropdown-line-height); + width: var(--ti-select-dropdown-line-width); + background-color: var(--ti-select-dropdown-line-bg-color); + line-height: 100%; + vertical-align: middle; + margin: var(--ti-select-dropdown-line-margin-vertical) var(--ti-select-dropdown-line-margin-horizontal); + } + } + .tiny-svg:hover { + fill: var(--ti-select-dropdown-active-text-color); + } + } + + &__empty { + padding: 10px 0; + margin: 0; + text-align: center; + color: var(--ti-select-dropdown-empty-text-color); + font-size: var(--ti-select-dropdown-empty-font-size); + } + + & &__wrap { + max-height: 197px; + margin-right: -4px; + } + + & &__list { + list-style: none; + margin: 0; + box-sizing: border-box; + padding: var(--ti-select-dropdown-list-padding-top) var(--ti-select-dropdown-list-padding-horizontal) var(--ti-select-dropdown-list-padding-bottom); + text-align: left; + } + + & &__item { + white-space: nowrap; + box-sizing: border-box; + padding: var(--ti-select-dropdown-item-padding-vertical) var(--ti-select-dropdown-item-padding-horizontal); + margin-top: var(--ti-select-dropdown-item-margin-top); + border-radius: var(--ti-common-border-radius-normal); + } + + & &__wrap.virtual { + position: relative; + margin-right: 0 !important; + & .@{select-dropdown-prefix-cls}__item { + position: absolute; + width: 100%; + } + } +} diff --git a/packages/theme/src/select-dropdown/vars.less b/packages/theme/src/select-dropdown/vars.less new file mode 100644 index 000000000..0d2e2c3e0 --- /dev/null +++ b/packages/theme/src/select-dropdown/vars.less @@ -0,0 +1,34 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-select-dropdown() { + --ti-select-dropdown-border-color: transparent; + --ti-select-dropdown-border-radius: var(--ti-common-border-radius-normal); + --ti-select-dropdown-bg-color: var(--ti-base-color-light); + --ti-select-dropdown-empty-text-color: var(--ti-base-color-placeholder); + --ti-select-dropdown-empty-font-size: var(--ti-common-font-size-1); + --ti-select-dropdown-list-padding-top: 0; + --ti-select-dropdown-list-padding-horizontal: 0; + --ti-select-dropdown-list-padding-bottom: 6px; + --ti-select-dropdown-item-padding-vertical: 0; + --ti-select-dropdown-item-padding-horizontal: 8px; + --ti-select-dropdown-item-margin-top: 0; + + --ti-select-dropdown-search-bg-color: var(--ti-base-color-brand-1); + --ti-select-dropdown-search-margin-bottom: var(--ti-common-space-base); + --ti-select-dropdown-line-bg-color: var(--ti-base-color-common-1); + --ti-select-dropdown-line-margin-vertical: 0; + --ti-select-dropdown-line-margin-horizontal: var(--ti-common-space-2x); + --ti-select-dropdown-line-height: var(--ti-common-font-size-1); + --ti-select-dropdown-line-width: 1px; + --ti-select-dropdown-active-text-color: var(--ti-base-color-brand-6); +} diff --git a/packages/theme/src/select/index.js b/packages/theme/src/select/index.js new file mode 100644 index 000000000..9b71c13f4 --- /dev/null +++ b/packages/theme/src/select/index.js @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-select-inner-hover-border-color': '#40a9ff', + 'tiny-select-input-text-color': '#666', + 'tiny-select-input-font-size': '12px', + 'tiny-select-input-caret-text-color': '#1890ff', + 'tiny-select-input-caret-hover-text-color': '#40a9ff', + 'tiny-select-input-caret-font-size': '14px', + 'tiny-select-input-caret-close-text-color': '#bfbfbf', + 'tiny-select-input-caret-close-hover-text-color': '#999', + 'tiny-select-input-disabled-caret-text-color': '#d9d9d9', + 'tiny-select-input-disabled-inner-hover-border-color': '#e4e7ed', + 'tiny-select-input-mini-height': '24px', + 'tiny-select-input-small-height': '36px', + 'tiny-select-input-medium-height': '42px' +} diff --git a/packages/theme/src/select/index.less b/packages/theme/src/select/index.less new file mode 100644 index 000000000..1a0cd61b3 --- /dev/null +++ b/packages/theme/src/select/index.less @@ -0,0 +1,241 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@select-prefix-cls: ~'@{css-prefix}select'; +@input-prefix-cls: ~'@{css-prefix}input'; +@tag-prefix-cls: ~'@{css-prefix}tag'; + +.@{select-prefix-cls} { + .component-css-vars-select(); + + display: inline-block; + position: relative; + width: 100%; + outline: 0; + + + &&__multiple:not(&__collapse-tags):not(&__filterable) &__tags > span { + // 兼容ie10-ie11 + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + display: flex; + flex-wrap: wrap; + justify-content: flex-start; + align-content: flex-start; + } + + // 兼容edge + @supports (-ms-ime-align: auto) { + width: 100%; + display: flex; + flex-wrap: wrap; + justify-content: flex-start; + align-content: flex-start; + } + } + + &&__collapse-tags { + .@{select-prefix-cls}__tags { + & > span { + display: flex; + width: 100%; + + & > span:not(:only-child):first-child { + max-width: 70%; + } + } + } + + .@{select-prefix-cls}__filterable { + .@{select-prefix-cls}__tags { + & > span { + width: auto; + max-width: 76%; + + & > span:first-child { + flex: 1; + + // 兼容ie10-ie11 + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + flex-basis: auto; + } + } + + & > span:only-child, + & > span:not(:only-child):first-child { + max-width: 100%; + } + + & > span:not(:only-child):not(:first-child) { + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + // 兼容ie10-ie11 + flex-shrink: 0; + flex-basis: auto; + } + } + } + } + } + } + + + &&__filterable{ + .@{select-prefix-cls}__tags{ + .@{select-prefix-cls}__input{ + cursor: text; + } + } + } + + &__tags { + position: absolute; + line-height: normal; + white-space: normal; + padding-left: 4px; + z-index: 1; + top: 50%; + transform: translateY(-50%); + display: flex; + align-items: center; + flex-wrap: wrap; + cursor: pointer; + + & > span { + display: contents; + } + + .@{select-prefix-cls}__input { + cursor: pointer; + border: none; + outline: 0; + padding: 0; + margin-left: 8px; + color: var(--ti-select-input-text-color); + font-size: var(--ti-select-input-font-size); + height: 28px; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background-color: transparent; + + &.is-mini { + height: var(--ti-select-input-mini-height); + } + + &.is-small { + height: var(--ti-select-input-small-height); + } + + &.is-medium { + height: var(--ti-select-input-medium-height); + } + } + + &.is-showicon { + padding-left: 24px; + } + + .@{tag-prefix-cls} { + white-space: nowrap; + box-sizing: border-box; + border-color: transparent; + margin: 2px 0 2px 4px; + background-color: #f0f2f5; + + &.@{tag-prefix-cls}--info { + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + display: inline-flex; + justify-content: flex-start; + align-items: center; + } + } + + .@{select-prefix-cls}__tags-text { + width: 100%; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + + & + .@{tag-prefix-cls}__close { + flex-shrink: 0; + } + } + } + + &-tip &-tipcontent { + max-width: 300px; + } + + & .@{input-prefix-cls} { + display: block; + + .@{input-prefix-cls}__inner[readonly] { + cursor: pointer; + } + + .@{select-prefix-cls}__caret { + fill: var(--ti-select-input-caret-text-color); + font-size: var(--ti-select-input-caret-font-size); + transition: transform 0.3s; + transform: rotateZ(180deg); + cursor: pointer; + + &:hover { + fill: var(--ti-select-input-caret-hover-text-color); + } + + &.is-reverse { + transform: rotateZ(0); + } + + &.is-show-close { + font-size: var(--ti-select-input-font-size); + text-align: center; + transform: rotateZ(180deg); + border-radius: 100%; + fill: var(--ti-select-input-caret-close-text-color); + transition: fill 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); + + &:hover { + color: var(--ti-select-input-caret-close-hover-text-color); + } + } + } + + .@{select-prefix-cls}__copy { + cursor: pointer; + } + + &.is-disabled { + .@{select-prefix-cls}__caret { + fill: var(--ti-select-input-disabled-caret-text-color); + cursor: not-allowed; + } + + .@{input-prefix-cls}__inner { + cursor: not-allowed; + + &:hover { + border-color: var(--ti-select-input-disabled-hover-border-color); + } + } + } + + &.is-focus .@{input-prefix-cls}__inner { + border-color: var(--ti-select-inner-hover-border-color); + } + } +} diff --git a/packages/theme/src/select/vars.less b/packages/theme/src/select/vars.less new file mode 100644 index 000000000..75de5c1b0 --- /dev/null +++ b/packages/theme/src/select/vars.less @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-select() { + --ti-select-inner-hover-border-color: var(--ti-base-color-brand-5); + --ti-select-input-text-color: #666; + --ti-select-input-font-size: var(--ti-common-font-size-base); + --ti-select-input-caret-text-color: var(--ti-base-color-common-5); + --ti-select-input-caret-hover-text-color: var(--ti-base-color-brand-7); + --ti-select-input-caret-font-size: var(--ti-common-font-size-1); + --ti-select-input-caret-close-text-color: var(--ti-base-color-bg-5); + --ti-select-input-caret-close-hover-text-color: var(--ti-base-color-placeholder); + --ti-select-input-disabled-caret-text-color: var(--ti-base-color-border); + --ti-select-input-disabled-hover-border-color: #e4e7ed; + --ti-select-input-mini-height: var(--ti-base-size-height-mini); + --ti-select-input-small-height: var(--ti-base-size-height-small); + --ti-select-input-medium-height: var(--ti-base-size-height-medium); +} diff --git a/packages/theme/src/selector/index.js b/packages/theme/src/selector/index.js new file mode 100644 index 000000000..efac8d65c --- /dev/null +++ b/packages/theme/src/selector/index.js @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-selector-border-color': '#d9d9d9', + 'tiny-selector-border-radius': '2px', + 'tiny-selector-font-size': '12px', + 'tiny-selector-text-color': '#333333', + 'tiny-selector-icon-size': '16px', + 'tiny-selector-icon-color': '#BFBFBF', + 'tiny-selector-selected-icon-color': '#1890ff', + 'tiny-selector-icon-hover-text-color': '#40a9ff', + 'tiny-selector-list-height': '30px', + 'tiny-selector-bg-color': '#fff', + 'tiny-selector-selected-text-color': '#999', + 'tiny-selector-selected-hover-bg-color': '#F5F5F5', + 'tiny-selector-select-bg-color': '#E6F7FF' +} diff --git a/packages/theme/src/selector/index.less b/packages/theme/src/selector/index.less new file mode 100644 index 000000000..edcac9f37 --- /dev/null +++ b/packages/theme/src/selector/index.less @@ -0,0 +1,158 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@selector-prefix-cls: ~'@{css-prefix}selector'; + +.@{selector-prefix-cls} { + .component-css-vars-selector(); + + border: 1px solid var(--ti-selector-border-color); + border-radius: var(--ti-selector-border-radius); + font-size: var(--ti-selector-font-size); + box-shadow: var(--ti-base-box-shadow); + background: var(--ti-selector-bg-color); + color: var(--ti-selector-text-color); + margin-top: 2px; + + .@{css-prefix}poplist { + li { + min-height: var(--ti-selector-list-height); + padding: 0 8px; + line-height: var(--ti-selector-list-height); + max-width: 100%; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + + &:hover { + cursor: pointer; + } + + span { + font-size: var(--ti-selector-font-size); + } + + .icon-check { + font-size: var(--ti-common-font-size-2); + + &:hover { + color: var(--ti-selector-icon-hover-text-color); + } + } + } + + .@{css-prefix}divider { + padding: 0; + } + + &.poplist-language li { + a, + span { + display: inline-block; + width: 100%; + } + } + } + + .@{css-prefix-iconfont} { + color: var(--ti-selector-icon-color); + margin-right: 16px; + + &.icon-checked { + color: var(--ti-selector-selected-icon-color); + } + } + + .select-pre { + background: var(--ti-selector-select-bg-color); + color: var(--ti-selector-text-color); + + &.@{css-prefix}selected { + background: var(--ti-selector-selected-hover-bg-color); + } + } + + .selector-loading { + min-height: 100px; + + .mini-loading { + position: absolute; + left: 45%; + top: 35%; + width: 20px; + height: 20px; + background: url(./images/container-loading.gif) center no-repeat; + } + } + + .@{css-prefix}selected { + background: var(--ti-selector-selected-hover-bg-color); + color: #333; + + &:hover { + background: var(--ti-selector-selected-hover-bg-color); + } + + .icon-check { + &:hover { + color: var(--ti-selector-icon-hover-text-color); + } + + &:before { + content: '\e61f'; + } + + color: var(--ti-selector-selected-icon-color); + } + } + + .selector-body { + max-height: 300px; + overflow-y: auto; + overflow-x: hidden; + + .@{css-prefix-iconfont}:first-child { + margin-right: 16px; + } + } + + .@{css-prefix}tree { + &.radio { + & > .tree-menus { + .tree-node { + &.node-selected { + > .tree-menus-link, + > .tree-menus-link:hover, + > .tree-menus-link .tree-node-name, + > .tree-menus-link .tree-node-name:hover, + > .tree-menus-link .tree-node-body:hover .tree-node-name { + background: var(--ti-selector-selected-hover-bg-color); + } + } + + .tree-menus-link { + &:hover { + background: var(--ti-selector-select-bg-color); + } + } + + .tree-menus .tree-node { + padding-left: 28px; + } + } + } + } + } +} diff --git a/packages/theme/src/selector/vars.less b/packages/theme/src/selector/vars.less new file mode 100644 index 000000000..8406fa90b --- /dev/null +++ b/packages/theme/src/selector/vars.less @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-selector() { + --ti-selector-border-color: var(--ti-base-color-border); + --ti-selector-border-radius: var(--ti-common-border-radius-normal); + --ti-selector-font-size: var(--ti-common-font-size-base); + --ti-selector-text-color: var(--ti-base-color-info-normal); + --ti-selector-icon-size: var(--ti-common-size-4x); + --ti-selector-icon-color: var(--ti-base-color-bg-5); + --ti-selector-selected-icon-color: var(--ti-base-color-brand-6); + --ti-selector-icon-hover-text-color: var(--ti-base-color-brand-5); + --ti-selector-list-height: var(--ti-base-size-height-normal); + --ti-selector-bg-color: var(--ti-base-color-light); + --ti-selector-selected-text-color: var(--ti-base-color-placeholder); + --ti-selector-selected-hover-bg-color: var(--ti-base-color-selected-background); + --ti-selector-select-bg-color: var(--ti-base-color-hover-background); +} diff --git a/packages/theme/src/slide-bar/index.js b/packages/theme/src/slide-bar/index.js new file mode 100644 index 000000000..77766e2d7 --- /dev/null +++ b/packages/theme/src/slide-bar/index.js @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-slider-progress-box-border-color': '#fff', + 'tiny-slider-progress-box-hover-border-color': 'rgba(153, 153, 153, 0.7)', + 'tiny-slider-progress-box-arrow-normal-text-color': '#f2f2f2', + 'tiny-slider-progress-box-arrow-hover-text-color': '#808080', + 'tiny-slider-progress-box-middleline-border-color': '#ebebeb', + 'tiny-slider-progress-box-middleline-icon-color': '#ebebeb' +} diff --git a/packages/theme/src/slide-bar/index.less b/packages/theme/src/slide-bar/index.less new file mode 100644 index 000000000..8cc8def91 --- /dev/null +++ b/packages/theme/src/slide-bar/index.less @@ -0,0 +1,146 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@slide-bar-prefix-cls: ~'@{css-prefix}slide-bar'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{slide-bar-prefix-cls} { + .component-css-vars-slide-bar(); + + padding: 0 32px; + position: relative; + + > .@{svg-prefix-cls} { + position: absolute; + top: 50%; + transform: translateY(-50%); + font-size: 2em; + cursor: pointer; + fill: var(--ti-slider-progress-box-arrow-normal-text-color); + + &:hover { + fill: var(--ti-slider-progress-box-arrow-hover-text-color); + } + + &.@{css-prefix}disabled, + &.@{css-prefix}disabled:hover { + background: transparent; + fill: #fff; + cursor: default; + } + } + + > .icon-chevron-left { + left: 0; + } + + > .icon-chevron-right { + right: 0; + } + + li li div { + margin: 15px 0; + font-size: var(--ti-common-font-size-base); + color: #4e5e67; + + &:nth-child(2) { + border-bottom: 1px solid var(--ti-slider-progress-box-middleline-border-color); + } + + svg { + float: right; + margin: -6px 0 0 0; + background: #fff; + fill: var(--ti-slider-progress-box-middleline-icon-color); + } + } + + & &__content { + width: 100%; + min-height: 170px; + position: relative; + overflow: hidden; + } + + & &__list { + position: absolute; + min-height: 170px; + display: flex; + + > li { + width: 23%; + padding: 20px; + float: left; + margin-left: 2%; + position: relative; + + border: 5px solid var(--ti-slider-progress-box-border-color); + box-sizing: border-box; + display: flex; + align-items: center; + + &:first-child { + margin-left: 0; + } + + &:hover { + border-color: var(--ti-slider-progress-box-hover-border-color); + } + + > .icon-chevron-down { + position: absolute; + top: 98.8%; + left: 50%; + margin-left: -10px; + font-size: 2em; + width: 22px; + display: none !important; + + &:before { + content: ''; + position: absolute; + width: 20px; + height: 20px; + border-right: 5px solid var(--ti-slider-progress-box-hover-border-color); + border-bottom: 5px solid var(--ti-slider-progress-box-hover-border-color); + transform: rotate(45deg); + background: #fff; + top: -5px; + } + } + + > ul { + width: 100%; + list-style: none; + } + } + + > li.@{slide-bar-prefix-cls}__select { + border-color: var(--ti-slider-progress-box-hover-border-color); + + > .icon-chevron-down { + display: block !important; + } + + li .@{css-prefix-iconfont} { + color: var(--ti-slider-progress-box-hover-border-color); + } + + li:nth-child(2) { + border-bottom: 1px solid var(--ti-slider-progress-box-hover-border-color); + } + } + } +} diff --git a/packages/theme/src/slide-bar/vars.less b/packages/theme/src/slide-bar/vars.less new file mode 100644 index 000000000..26706e358 --- /dev/null +++ b/packages/theme/src/slide-bar/vars.less @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-slide-bar() { + --ti-slider-progress-box-border-color: var(--ti-base-color-light); + --ti-slider-progress-box-hover-border-color: rgba(153, 153, 153, 0.7); + --ti-slider-progress-box-arrow-normal-text-color: #f2f2f2; + --ti-slider-progress-box-arrow-hover-text-color: #808080; + --ti-slider-progress-box-middleline-border-color: #ebebeb; + --ti-slider-progress-box-middleline-icon-color: #ebebeb; +} diff --git a/packages/theme/src/slide-img/index.js b/packages/theme/src/slide-img/index.js new file mode 100644 index 000000000..fcfbce2b6 --- /dev/null +++ b/packages/theme/src/slide-img/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // slide-img +} diff --git a/packages/theme/src/slide-img/index.less b/packages/theme/src/slide-img/index.less new file mode 100644 index 000000000..8a53776b5 --- /dev/null +++ b/packages/theme/src/slide-img/index.less @@ -0,0 +1,75 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +.slider-img { + position: relative; + + > .icon-chevron-left, + > .icon-chevron-right { + height: 100%; + position: absolute; + .opacity(@opacity: 0); + width: 80px; + font-size: 50px; + color: #c4c4c4; + + &:before { + top: 45%; + position: absolute; + padding: 0 20px; + } + + &:hover { + .opacity(@opacity: 0.6); + cursor: pointer; + } + } + + .icon-chevron-right { + right: 0; + top: 0; + } + + > ul > li { + display: none; + text-align: center; + } + + .slider-imgnav { + text-align: center; + position: absolute; + bottom: 8px; + left: 50%; + transform: translateX(-50%); + + span { + display: inline-block; + margin: 0 -2px; + cursor: pointer; + font-size: var(--ti-common-font-size-2); + color: #c4c4c4; + + &:hover, + &.imgnav-selected { + color: #fff; + } + } + } + + .@{css-prefix}repeat { + overflow-y: auto; + } +} diff --git a/packages/theme/src/slide-img/vars.less b/packages/theme/src/slide-img/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/slide-img/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/slider/index.js b/packages/theme/src/slider/index.js new file mode 100644 index 000000000..a323c941b --- /dev/null +++ b/packages/theme/src/slider/index.js @@ -0,0 +1,52 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-slider-bg-color': '#d9d9d9', + 'tiny-slider-height': '4px', + 'tiny-slider-handle-size': '16px', + 'tiny-slider-border-radius': '10px', + 'tiny-slider-range-height': '16px', + 'tiny-slider-range-border-radius': '2px', + 'tiny-slider-range-bg-color': '#1890ff', + 'tiny-slider-range-hover-bg-color': '#1890ff', + 'tiny-slider-range-margin-top': '-4px', + 'tiny-slider-handle-width': '35px', + 'tiny-slider-handle-height': '28px', + 'tiny-slider-numer-bg-color': '#40a9ff', + 'tiny-slider-handle-bg-color': '#fff', + 'tiny-slider-handle-border-radius': '20px', + 'tiny-slider-handle-border-color': '#1890ff', + 'tiny-slider-handle-text-color-hover': '#344899', + 'tiny-slider-handle-border-color-hover': '#344899', + 'tiny-slider-handle-box-shadow': '0 1px 4px 0 rgba(0, 0, 0, 0.1)', + 'tiny-slider-handle-top': '-4px', + 'tiny-slider-handle-border-weight': '1px', + 'tiny-slider-handle-icon-fill-color': '#1890ff', + 'tiny-slider-handle-icon-fill-color-hover': '#344899', + 'tiny-slider-handle-margin-top': '-10px', + 'tiny-slider-handle-margin-horizontal': '-8px', + 'tiny-slider-handle-margin-bottom': '0', + 'tiny-slider-input-height': '30px', + 'tiny-slider-input-width': '40px', + 'tiny-slider-input-border-radius': '2px', + 'tiny-slider-input-border-color': '#d9d9d9', + 'tiny-slider-input-text-color': '#333', + 'tiny-slider-input-bg-color': '#fff', + 'tiny-slider-tips-bg-color': '#464c59', + 'tiny-slider-tips-border-color': '#464c59', + 'tiny-slider-tips-text-color': '#fff', + 'tiny-slider-tips-margin-left': '3px', + 'tiny-slider-margin-vertical': '-8px', + 'tiny-slider-margin-right': '0', + 'tiny-slider-margin-left': '-6px' +} diff --git a/packages/theme/src/slider/index.less b/packages/theme/src/slider/index.less new file mode 100644 index 000000000..7b7bf49be --- /dev/null +++ b/packages/theme/src/slider/index.less @@ -0,0 +1,198 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/tip.less'; +@import '../custom.less'; +@import './vars.less'; + +@slider-prefix-cls: ~'@{css-prefix}slider'; + +.@{slider-prefix-cls} { + &__wrapper { + .component-css-vars-slider(); + } + + border-radius: var(--ti-slider-border-radius); + height: var(--ti-slider-height); + position: relative; + margin: 13px 0; + background: var(--ti-slider-bg-color); + cursor: pointer; + width: ~'calc(100% - 89px)'; + display: inline-block; + + &:hover { + .@{slider-prefix-cls}__range { + background: var(--ti-slider-range-hover-bg-color); + } + + .@{slider-prefix-cls}__handle { + border-color: var(--ti-slider-handle-border-color-hover); + } + } + + &.disabled { + cursor: default; + } + + &.disabled .@{slider-prefix-cls}__handle { + cursor: not-allowed; + } + + &__vertical { + width: var(--ti-slider-height); + height: 300px; + display: block; + margin: 0 15px; + + & + .@{slider-prefix-cls}__input { + margin-top: 12px; + float: none; + right: 0; + } + + .@{slider-prefix-cls}__range { + border-radius: 10px; + position: absolute; + z-index: 1; + width: var(--ti-slider-height); + } + + .@{slider-prefix-cls}__up { + top: 0; + } + + .@{slider-prefix-cls}__down { + bottom: 0; + } + + .@{slider-prefix-cls}__handle { + margin: var(--ti-slider-margin-vertical) var(--ti-slider-margin-right) var(--ti-slider-margin-vertical) var(--ti-slider-margin-left); + } + } + + &__range { + border-radius: var(--ti-slider-range-border-radius); + position: absolute; + z-index: 1; + margin-top: var(--ti-slider-range-margin-top); + height: var(--ti-slider-range-height); + background: var(--ti-slider-range-bg-color); + } + + &__left { + left: 0; + } + + &__right { + right: 0; + } + + &__handle { + border-radius: var(--ti-slider-handle-border-radius); + height: var(--ti-slider-handle-height); + width: var(--ti-slider-handle-width); + position: absolute; + margin: var(--ti-slider-handle-margin-top) var(--ti-slider-handle-margin-horizontal) var(--ti-slider-handle-margin-bottom); + z-index: 2; + outline: none; + background: var(--ti-slider-handle-bg-color); + border: var(--ti-slider-handle-border-weight) solid var(--ti-slider-handle-border-color); + display: flex; + align-items: center; + justify-content: center; + box-shadow: var(--ti-slider-handle-box-shadow); + user-select: none; + cursor: grab; + text-align: center; + + &:hover { + color: var(--ti-slider-handle-text-color-hover); + border-color: var(--ti-slider-handle-border-color-hover); + transform: var(--ti-slider-handle-transform); + + svg { + fill: var(--ti-slider-handle-icon-fill-color-hover); + } + } + + svg { + display: var(--ti-slider-handle-icon-display); + height: 12px; + margin-left: 4px; + fill: var(--ti-slider-handle-icon-fill-color); + } + } + + &__tips { + text-align: center; + font-size: var(--ti-common-font-size-base); + margin-top: -32px; + margin-left: var(--ti-slider-tips-margin-left); + position: absolute; + padding: 12px 16px; + line-height: 1.5; + z-index: 1010; + word-break: normal; // popup-body里面加了默认折行影响到此处需要重置 + white-space: nowrap; // 强制不换行-to liyingfu 纵向进度条上的tips如果内容过多并有空格就会掉下去,此处设置强制显示一行 + background: var(--ti-slider-tips-bg-color); + border: 1px solid var(--ti-slider-tips-border-color); + border-radius: var(--ti-common-border-radius-1); + color: var(--ti-slider-tips-text-color); + + &:before { + margin-left: -6px; + bottom: -6px; + .tip-arrow(50%; auto; 0;); + .tip-make-arrow( + 6px 6px 0 6px; var(--ti-slider-tips-border-color) transparent + ); + } + + &:after { + margin-left: -4px; + bottom: -4px; + .tip-arrow(50%; auto; 0;); + .tip-make-arrow( + 4px 4px 0 4px; var(--ti-slider-tips-border-color) transparent + ); + } + } + + &__input { + display: inline-block; + line-height: var(--ti-slider-input-height); + vertical-align: top; + margin-left: 12px; + font-size: var(--ti-common-font-size-base); + + input { + width: var(--ti-slider-input-width); + height: var(--ti-slider-input-height); + line-height: var(--ti-slider-input-height); + border: 1px solid var(--ti-slider-input-border-color); + border-radius: var(--ti-slider-input-border-radius); + color: var(--ti-slider-input-text-color); + background: var(--ti-slider-input-bg-color); + font-size: inherit; + padding: 0 8px; + outline: 0; + display: inline-block; + box-sizing: border-box; + text-align: center; + } + + span { + padding-left: 8px; + } + } +} diff --git a/packages/theme/src/slider/vars.less b/packages/theme/src/slider/vars.less new file mode 100644 index 000000000..d3fa56175 --- /dev/null +++ b/packages/theme/src/slider/vars.less @@ -0,0 +1,58 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-slider() { + --ti-slider-bg-color: var(--ti-base-color-brand-2); + --ti-slider-height: var(--ti-common-size-2x); + --ti-slider-border-radius: 2px; + + --ti-slider-range-height: var(--ti-common-size-4x); + --ti-slider-range-border-radius: 2px; + --ti-slider-range-bg-color: var(--ti-base-color-brand-6); + --ti-slider-range-hover-bg-color: var(--ti-base-color-brand-6); + --ti-slider-range-top: calc(-1 * var(--ti-common-space-base)); + --ti-slider-range-margin-top: calc(-1 * var(--ti-common-space-base)); + + --ti-slider-handle-width: var(--ti-common-size-5x); + --ti-slider-handle-height: var(--ti-common-size-7x); + --ti-slider-handle-bg-color: linear-gradient(153deg, var(--ti-base-color-white), var(--ti-base-color-brand-2) 99%); + --ti-slider-handle-border-color: var(--ti-base-color-brand-6); + --ti-slider-handle-border-radius: 10px; + --ti-slider-handle-text-color-hover: var(--ti-common-color-bg-hover); + --ti-slider-handle-border-color-hover: var(--ti-common-color-bg-hover); + --ti-slider-handle-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1); + --ti-slider-handle-top: calc(-1 * var(--ti-common-space-base)); + --ti-slider-handle-border-weight: 1px; + --ti-slider-handle-icon-display: inline-block; + --ti-slider-handle-icon-fill-color: var(--ti-slider-handle-border-color); + --ti-slider-handle-icon-fill-color-hover: var(--ti-slider-handle-text-color-hover); + --ti-slider-handle-transform: scale(1); + --ti-slider-handle-margin-top: -10px; + --ti-slider-handle-margin-horizontal: -8px; + --ti-slider-handle-margin-bottom: 0; + + --ti-slider-input-height: var(--ti-base-size-height-minor, 30px); + --ti-slider-input-width: var(--ti-common-size-10x); + --ti-slider-input-border-radius: var(--ti-common-border-radius-normal, 2px); + --ti-slider-input-border-color: var(--ti-base-color-border, #d9d9d9); + --ti-slider-input-text-color: var(--ti-base-color-info-normal, #333); + --ti-slider-input-bg-color: var(--ti-base-color-light, #fff); + + --ti-slider-tips-bg-color: var(--ti-base-color-common-6); + --ti-slider-tips-border-color: var(--ti-base-color-common-6); + --ti-slider-tips-text-color: var(--ti-base-color-white); + --ti-slider-tips-margin-left: 3px; + + --ti-slider-margin-vertical: -8px; + --ti-slider-margin-right: 0; + --ti-slider-margin-left: -6px; +} diff --git a/packages/theme/src/split/index.js b/packages/theme/src/split/index.js new file mode 100644 index 000000000..e2d3931fb --- /dev/null +++ b/packages/theme/src/split/index.js @@ -0,0 +1,23 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-split-border-color': '#d9d9d9', + 'tiny-split-trigger-bg-color': '#d9d9d9', + 'tiny-split-trigger-bar-bg-color': '#666', + 'tiny-split-trigger-hover-bg-color': '#d9d9d9', + 'tiny-split-trigger-bar-hover-bg-color': '#666', + 'tiny-split-trigger-bar-con-bg-color': '#fff', + 'tiny-split-trigger-size': '4px', + 'tiny-split-trigger-bar-margin-left': '4px', + 'tiny-split-trigger-bar-margin-top': '4px' +} diff --git a/packages/theme/src/split/index.less b/packages/theme/src/split/index.less new file mode 100644 index 000000000..540a342fe --- /dev/null +++ b/packages/theme/src/split/index.less @@ -0,0 +1,195 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +@split-prefix-cls: ~'@{css-prefix}split'; + +.@{split-prefix-cls} { + .component-css-vars-split(); + + &-wrapper { + position: relative; + width: 100%; + height: 100%; + overflow: hidden; + } + + &-pane { + position: absolute; + + &.left-pane, + &.right-pane { + top: 0; + bottom: 0; + overflow: hidden; + } + + &.left-pane { + left: 0; + } + + &.right-pane { + right: 0; + } + + &.top-pane, + &.bottom-pane { + left: 0; + right: 0; + overflow: hidden; + } + + &.top-pane { + top: 0; + } + + &.bottom-pane { + bottom: 0; + } + + &-moving { + .user-select(none); + } + } + + &-trigger { + &-con { + position: absolute; + transform: translate(-50%, -50%); + z-index: 10; + display: flex; + align-items: center; + justify-content: center; + + &:hover { + .@{split-prefix-cls}-trigger { + background: var(--ti-split-trigger-hover-bg-color); + + &-bar { + background: var(--ti-split-trigger-bar-hover-bg-color); + } + } + } + } + + &-bar-con { + position: absolute; + overflow: hidden; + background: var(--ti-split-trigger-bar-con-bg-color); + + &.vertical { + top: 50%; + height: calc(var(--ti-split-trigger-size) * 7); + transform: translate(0, -50%); + display: flex; + flex-direction: column; + } + + &.horizontal { + left: 50%; + width: calc(var(--ti-split-trigger-size) * 7); + transform: translate(-50%, 0); + } + } + + &-vertical { + width: var(--ti-split-trigger-size); + height: 100%; + background: var(--ti-split-trigger-bg-color); + + .@{split-prefix-cls}-trigger-bar { + width: var(--ti-split-trigger-size); + height: var(--ti-split-trigger-size); + background: var(--ti-split-trigger-bar-bg-color); + float: left; + margin-top: var(--ti-split-trigger-bar-margin-top); + border-radius: 50%; + } + } + + &-horizontal { + height: var(--ti-split-trigger-size); + width: 100%; + background: var(--ti-split-trigger-bg-color); + + .@{split-prefix-cls}-trigger-bar { + height: var(--ti-split-trigger-size); + width: var(--ti-split-trigger-size); + background: var(--ti-split-trigger-bar-bg-color); + float: left; + margin-left: var(--ti-split-trigger-bar-margin-left); + border-radius: 50%; + } + } + } + + &-horizontal, &-vertical { + .@{split-prefix-cls}-collapse-bar { + position: absolute; + display: flex; + justify-content: center; + align-items: center; + background: #d9d9d9; + z-index: 15; + cursor: pointer; + } + } + + &-horizontal { + .@{split-prefix-cls}-trigger-con { + top: 50%; + height: 100%; + width: 10px; + cursor: var(--ti-split-trigger-con-col-cursor); + } + + .@{split-prefix-cls}-vertical .@{split-prefix-cls}-trigger-con { + left: 50%; + height: 10px; + width: 100%; + } + + .@{split-prefix-cls}-collapse-bar { + top: calc(50% - 15px); + height: 30px; + border-radius: 0 4px 4px 0; + } + } + + &-vertical { + .@{split-prefix-cls}-trigger-con { + left: 50%; + height: 10px; + width: 100%; + cursor: var(--ti-split-trigger-con-row-cursor); + } + + .@{split-prefix-cls}-horizontal .@{split-prefix-cls}-trigger-con { + top: 50%; + height: 100%; + width: 10px; + } + + .@{split-prefix-cls}-collapse-bar { + left: calc(50% - 15px); + width: 30px; + border-radius: 0 0 4px 4px; + } + } + + .no-select { + .user-select(none); + } +} diff --git a/packages/theme/src/split/vars.less b/packages/theme/src/split/vars.less new file mode 100644 index 000000000..a231b9405 --- /dev/null +++ b/packages/theme/src/split/vars.less @@ -0,0 +1,25 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-split() { + --ti-split-border-color: #d9d9d9; + --ti-split-trigger-bg-color: #d9d9d9; + --ti-split-trigger-bar-bg-color: var(--ti-base-color-secondary); + --ti-split-trigger-hover-bg-color: var(--ti-split-trigger-bg-color); + --ti-split-trigger-bar-hover-bg-color: var(--ti-split-trigger-bar-bg-color); + --ti-split-trigger-bar-con-bg-color: var(--ti-base-color-light); + --ti-split-trigger-size: 4px; + --ti-split-trigger-bar-margin-left: 4px; + --ti-split-trigger-bar-margin-top: 4px; + --ti-split-trigger-con-col-cursor: e-resize; + --ti-split-trigger-con-row-cursor: n-resize; +} diff --git a/packages/theme/src/steps/index.js b/packages/theme/src/steps/index.js new file mode 100644 index 000000000..e537108a5 --- /dev/null +++ b/packages/theme/src/steps/index.js @@ -0,0 +1,49 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-steps-advanced-active-bg-color': '#1890ff', + 'tiny-steps-done-active-border-color': '#1890ff', + 'tiny-steps-done-icon-fill-color': '#1890ff', + 'tiny-steps-done-icon-bg-color': '#fff', + 'tiny-steps-line-bg-color': '#dbdbdb', + 'tiny-steps-done-text-color': '#252b3a', + 'tiny-steps-line-height': '4px', + 'tiny-steps-line-active-bg-color': '#1890ff', + 'tiny-steps-advanced-border-color': '#d9d9d9', + 'tiny-steps-advanced-text-color': '#999', + 'tiny-steps-advanced-line-height': '28px', + 'tiny-steps-advanced-li-bg-color': '#fff', + 'tiny-steps-advanced-li-text-color': '#fff', + 'tiny-steps-advanced-li-hover-text-color': '#999', + 'tiny-steps-advanced-li-hover-bg-color': '#f1f1f1', + 'tiny-steps-advanced-link-font-size': '12px', + 'tiny-steps-advanced-dot-height': '12px', + 'tiny-steps-advanced-dot-width': '12px', + 'tiny-steps-advanced-dot-done-bg-color': '#52c41a', + 'tiny-steps-advanced-dot-doing-bg-color': '#fa8c16', + 'tiny-steps-advanced-dot-wait-bg-color': '#52c41a', + 'tiny-steps-advanced-count-bg-color': '#f5222d', + 'tiny-steps-advanced-count-border-radius': '10px', + 'tiny-steps-advanced-count-font-size': '12px', + 'tiny-steps-advanced-count-height': '18px', + 'tiny-steps-advanced-border-weight': '14px', + 'tiny-steps-timeline-date-time-font-size': '12px', + 'tiny-steps-timeline-name-font-size': '14px', + 'tiny-steps-timeline-date-time-text-color': '#333', + 'tiny-steps-icon-size': '20px', + 'tiny-steps-font-size-7': '36px', + 'tiny-steps-font-size-base': '12px', + 'tiny-steps-icon-font-size': '12px', + 'tiny-steps-icon-bg-color': '#d9d9d9', + 'tiny-steps-unselected-text-color': '#fff' +} diff --git a/packages/theme/src/steps/index.less b/packages/theme/src/steps/index.less new file mode 100644 index 000000000..b3c1356fc --- /dev/null +++ b/packages/theme/src/steps/index.less @@ -0,0 +1,361 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@steps-prefix-cls: ~'@{css-prefix}steps'; + +.@{steps-prefix-cls} { + .component-css-vars-steps(); + + color: var(--ti-steps-timeline-date-time-text-color); + + & &-advanced { + & li { + line-height: var(--ti-steps-advanced-line-height); + display: inline-block; + background: var(--ti-steps-advanced-li-bg-color); + position: relative; + + &.current { + a { + background: var(--ti-steps-advanced-active-bg-color); + color: var(--ti-steps-advanced-li-text-color); + font-weight: bold; + + &::after { + border-left-color: var(--ti-steps-advanced-active-bg-color); + } + } + } + + a { + border: solid 1px var(--ti-steps-advanced-border-color); + border-right: none; + display: block; + text-align: center; + position: relative; + text-decoration: none; + color: var(--ti-steps-advanced-text-color); + font-size: var(--ti-steps-advanced-link-font-size); + + &::after { + content: ''; + border-top: 14px solid transparent; + border-bottom: 14px solid transparent; + border-left: 9px solid #fff; + position: absolute; + right: -9px; + top: 0; + z-index: 1; + } + + &::before { + content: ''; + border-top: 14px solid transparent; + border-bottom: 14px solid transparent; + border-left: 9px solid #d7d8da; + position: absolute; + left: 0; + top: 0; + } + + &:hover { + background: var(--ti-steps-advanced-li-hover-bg-color); + color: var(--ti-steps-advanced-li-hover-text-color); + text-decoration: none; + + &::after { + border-left-color: var(--ti-steps-advanced-li-hover-bg-color); + } + } + } + + &:first-child { + a { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + + &::before { + display: none; + } + } + } + + &:last-child { + a { + border-right: solid 1px var(--ti-steps-advanced-border-color); + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; + + &::after { + display: none; + } + } + } + + .dot { + height: var(--ti-steps-advanced-dot-height); + width: var(--ti-steps-advanced-dot-width); + margin-right: 8px; + padding: 0; + right: 0; + top: 50%; + transform: translateY(-50%); + display: flex; + position: absolute; + svg { + width: 100%; + height: 100%; + fill: var(--ti-steps-advanced-text-color); + } + } + + &.current .dot svg, + &.current .dot svg:hover { + fill: var(--ti-steps-advanced-li-bg-color); + } + &:hover .dot svg { + fill: var(--ti-steps-advanced-text-color); + } + } + + .count { + background-color: var(--ti-steps-advanced-count-bg-color); + border-radius: var(--ti-steps-advanced-count-border-radius); + color: var(--ti-steps-advanced-li-text-color); + display: inline-block; + font-size: var(--ti-steps-advanced-count-font-size); + height: var(--ti-steps-advanced-count-height); + line-height: var(--ti-steps-advanced-count-height); + padding: 0 6px; + text-align: center; + white-space: nowrap; + position: absolute; + top: -10px; + right: 10px; + } + } + + .line { + background: var(--ti-steps-line-bg-color); + } + + .icon { + width: var(--ti-steps-icon-size); + height: var(--ti-steps-icon-size); + line-height: var(--ti-steps-icon-size); + position: relative; + font-size: var(--ti-steps-icon-font-size); + text-align: center; + left: ~'calc(50% - 10px)'; + top: 4px; + border-radius: 50%; + background: var(--ti-steps-icon-bg-color); + color: var(--ti-steps-unselected-text-color); + cursor: pointer; + z-index: 15; + } + + .date-time { + text-align: center; + } + + .node-description { + position: relative; + margin-top: 6px; + overflow: hidden; + text-align: center; + + .name { + font-size: var(--ti-steps-font-size-base); + float: left; + width: 100%; + } + + .status { + font-size: var(--ti-steps-font-size-base); + float: left; + width: 100%; + } + } + + .process-done { + .node-description { + color: var(--ti-steps-done-text-color); + } + + .icon { + background: var(--ti-steps-done-icon-bg-color); + color: var(--ti-steps-done-icon-fill-color); + width: var(--ti-steps-icon-size); + height: var(--ti-steps-icon-size); + line-height: var(--ti-steps-icon-size); + font-size: var(--ti-steps-icon-size); + + .@{css-prefix}svg { + fill: var(--ti-steps-done-icon-fill-color); + vertical-align: baseline; + border: 1px solid var(--ti-steps-done-active-border-color); + border-radius: 50%; + padding: 2px; + } + } + + .line { + background: var(--ti-steps-line-active-bg-color); + } + } + + .process-current { + .icon { + background: var(--ti-steps-advanced-active-bg-color); + color: var(--ti-steps-advanced-li-text-color); + font-size: var(--ti-steps-font-size-base); + } + } + + .reverse { + .process-current { + .line { + background: var(--ti-steps-line-active-bg-color); + } + } + } + + & &-normal { + overflow: hidden; + + .normal { + display: block; + float: left; + } + + .line { + height: var(--ti-steps-line-height); + left: 50%; + top: -8px; + position: relative; + } + + .line-end { + width: 0; + } + + .process-done { + .line { + background: var(--ti-steps-line-active-bg-color); + } + } + + .process-current { + .name { + color: var(--ti-steps-advanced-active-bg-color); + font-weight: bold; + } + } + + .icon { + span { + display: inline-block; + } + } + } + + & &-timeline { + overflow: hidden; + font-size: var(--ti-steps-timeline-name-font-size); + color: var(--ti-steps-timeline-date-time-text-color); + + .timeline { + .line { + width: var(--ti-steps-line-height); + float: left; + + .@{css-prefix}svg { + vertical-align: baseline; + } + } + + .date-time { + width: 100px; + float: left; + padding-right: 20px; + text-align: right; + + .time { + display: block; + line-height: 1; + } + + .date { + display: block; + line-height: 1; + margin-bottom: 4px; + } + } + + &.process-done { + color: var(--ti-steps-done-text-color); + } + + &.process-current { + color: var(--ti-steps-advanced-active-bg-color); + } + + .name { + float: left; + margin-left: 20px; + line-height: 1.45em; + } + + .icon { + top: 0px; + } + } + } + + &.mobile { + padding-left: 10%; + + .@{steps-prefix-cls}-timeline { + overflow: inherit; + + .@{css-prefix-iconfont} { + font-size: 45px; + } + + .timeline { + .line { + .icon { + width: 45px; + line-height: 45px; + height: 45px; + font-size: var(--ti-steps-font-size-7); + position: relative; + left: -20px; + } + } + + .name { + margin-left: 30px; + font-size: 26px; + } + + & > div { + margin-left: 20px; + } + } + } + } +} diff --git a/packages/theme/src/steps/vars.less b/packages/theme/src/steps/vars.less new file mode 100644 index 000000000..8c51e2a25 --- /dev/null +++ b/packages/theme/src/steps/vars.less @@ -0,0 +1,49 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-steps() { + --ti-steps-advanced-active-bg-color: var(--ti-base-color-brand-6); + --ti-steps-done-active-border-color: var(--ti-base-color-brand-6); + --ti-steps-done-icon-fill-color: var(--ti-base-color-brand-6); + --ti-steps-done-icon-bg-color: var(--ti-base-color-light); + --ti-steps-line-bg-color: #dbdbdb; + --ti-steps-done-text-color: var(--ti-base-color-info-normal); + --ti-steps-line-height: var(--ti-common-size-base); + --ti-steps-line-active-bg-color: var(--ti-base-color-brand-6); + --ti-steps-advanced-border-color: var(--ti-base-color-border); + --ti-steps-advanced-text-color: var(--ti-base-color-placeholder); + --ti-steps-advanced-line-height: 28px; + --ti-steps-advanced-li-bg-color: var(--ti-base-color-light); + --ti-steps-advanced-li-text-color: var(--ti-base-color-light); + --ti-steps-advanced-li-hover-text-color: var(--ti-base-color-placeholder); + --ti-steps-advanced-li-hover-bg-color: #f1f1f1; + --ti-steps-advanced-link-font-size: var(--ti-common-font-size-base); + --ti-steps-advanced-dot-height: 12px; + --ti-steps-advanced-dot-width: 12px; + --ti-steps-advanced-dot-done-bg-color: var(--ti-base-color-success-normal); + --ti-steps-advanced-dot-doing-bg-color: #faad14; + --ti-steps-advanced-dot-wait-bg-color: var(--ti-base-color-success-normal); + --ti-steps-advanced-count-bg-color: var(--ti-base-color-bg-8); + --ti-steps-advanced-count-border-radius: 10px; + --ti-steps-advanced-count-font-size: var(--ti-common-font-size-base); + --ti-steps-advanced-count-height: 18px; + --ti-steps-advanced-border-weight: 14px; + --ti-steps-timeline-date-time-font-size: var(--ti-common-font-size-base); + --ti-steps-timeline-name-font-size: var(--ti-common-font-size-1); + --ti-steps-timeline-date-time-text-color: var(--ti-base-color-placeholder); + --ti-steps-icon-size: var(--ti-common-size-5x); + --ti-steps-font-size-7: var(--ti-common-font-size-7); + --ti-steps-font-size-base: var(--ti-common-font-size-base); + --ti-steps-icon-font-size: var(--ti-common-font-size-base); + --ti-steps-icon-bg-color: #d9d9d9; + --ti-steps-unselected-text-color: var(--ti-base-color-light); +} diff --git a/packages/theme/src/svg/index.js b/packages/theme/src/svg/index.js new file mode 100644 index 000000000..a3de2f0b6 --- /dev/null +++ b/packages/theme/src/svg/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // svg +} diff --git a/packages/theme/src/svg/index.less b/packages/theme/src/svg/index.less new file mode 100644 index 000000000..20def8877 --- /dev/null +++ b/packages/theme/src/svg/index.less @@ -0,0 +1,23 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{svg-prefix-cls} { + width: 1em; + height: 1em; + vertical-align: middle; + overflow: hidden; + display: inline-block; +} diff --git a/packages/theme/src/svg/vars.less b/packages/theme/src/svg/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/svg/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/svgs/add.svg b/packages/theme/src/svgs/add.svg new file mode 100644 index 000000000..17f8e399a --- /dev/null +++ b/packages/theme/src/svgs/add.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/administrator.svg b/packages/theme/src/svgs/administrator.svg new file mode 100644 index 000000000..3f6bdb863 --- /dev/null +++ b/packages/theme/src/svgs/administrator.svg @@ -0,0 +1 @@ + diff --git a/packages/theme/src/svgs/align-baseline.svg b/packages/theme/src/svgs/align-baseline.svg new file mode 100644 index 000000000..ed79a461e --- /dev/null +++ b/packages/theme/src/svgs/align-baseline.svg @@ -0,0 +1,7 @@ + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/align-center.svg b/packages/theme/src/svgs/align-center.svg new file mode 100644 index 000000000..adacfe2be --- /dev/null +++ b/packages/theme/src/svgs/align-center.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/align-flex-center.svg b/packages/theme/src/svgs/align-flex-center.svg new file mode 100644 index 000000000..a92a7260f --- /dev/null +++ b/packages/theme/src/svgs/align-flex-center.svg @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/align-flex-end.svg b/packages/theme/src/svgs/align-flex-end.svg new file mode 100644 index 000000000..191fd20e3 --- /dev/null +++ b/packages/theme/src/svgs/align-flex-end.svg @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/align-flex-start.svg b/packages/theme/src/svgs/align-flex-start.svg new file mode 100644 index 000000000..2564b9905 --- /dev/null +++ b/packages/theme/src/svgs/align-flex-start.svg @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/align-justify.svg b/packages/theme/src/svgs/align-justify.svg new file mode 100644 index 000000000..ed357f44a --- /dev/null +++ b/packages/theme/src/svgs/align-justify.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/align-left.svg b/packages/theme/src/svgs/align-left.svg new file mode 100644 index 000000000..9d141e5f0 --- /dev/null +++ b/packages/theme/src/svgs/align-left.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/align-right.svg b/packages/theme/src/svgs/align-right.svg new file mode 100644 index 000000000..4127edea5 --- /dev/null +++ b/packages/theme/src/svgs/align-right.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/align-stretch.svg b/packages/theme/src/svgs/align-stretch.svg new file mode 100644 index 000000000..d7c6ac00c --- /dev/null +++ b/packages/theme/src/svgs/align-stretch.svg @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/angularjs.svg b/packages/theme/src/svgs/angularjs.svg new file mode 100644 index 000000000..59de47343 --- /dev/null +++ b/packages/theme/src/svgs/angularjs.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/app.svg b/packages/theme/src/svgs/app.svg new file mode 100644 index 000000000..ad5eddbe8 --- /dev/null +++ b/packages/theme/src/svgs/app.svg @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/application.svg b/packages/theme/src/svgs/application.svg new file mode 100644 index 000000000..c06abf5f9 --- /dev/null +++ b/packages/theme/src/svgs/application.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/area-chart.svg b/packages/theme/src/svgs/area-chart.svg new file mode 100644 index 000000000..8ab6f17e5 --- /dev/null +++ b/packages/theme/src/svgs/area-chart.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/arrow-down.svg b/packages/theme/src/svgs/arrow-down.svg new file mode 100644 index 000000000..cf8e2b0b7 --- /dev/null +++ b/packages/theme/src/svgs/arrow-down.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/arrow-left.svg b/packages/theme/src/svgs/arrow-left.svg new file mode 100644 index 000000000..fe7c6bb7c --- /dev/null +++ b/packages/theme/src/svgs/arrow-left.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/arrow-right.svg b/packages/theme/src/svgs/arrow-right.svg new file mode 100644 index 000000000..4b27a91cb --- /dev/null +++ b/packages/theme/src/svgs/arrow-right.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/arrow-up.svg b/packages/theme/src/svgs/arrow-up.svg new file mode 100644 index 000000000..1a26f2a0e --- /dev/null +++ b/packages/theme/src/svgs/arrow-up.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/ascending.svg b/packages/theme/src/svgs/ascending.svg new file mode 100644 index 000000000..9d52dbbfa --- /dev/null +++ b/packages/theme/src/svgs/ascending.svg @@ -0,0 +1,10 @@ + + + + + + diff --git a/packages/theme/src/svgs/association.svg b/packages/theme/src/svgs/association.svg new file mode 100644 index 000000000..a37f9822e --- /dev/null +++ b/packages/theme/src/svgs/association.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/attachment.svg b/packages/theme/src/svgs/attachment.svg new file mode 100644 index 000000000..9c149da2b --- /dev/null +++ b/packages/theme/src/svgs/attachment.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/bar-chart.svg b/packages/theme/src/svgs/bar-chart.svg new file mode 100644 index 000000000..4bab1508d --- /dev/null +++ b/packages/theme/src/svgs/bar-chart.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/befilter.svg b/packages/theme/src/svgs/befilter.svg new file mode 100644 index 000000000..21dd255ad --- /dev/null +++ b/packages/theme/src/svgs/befilter.svg @@ -0,0 +1,11 @@ + + + + + + + diff --git a/packages/theme/src/svgs/boat.svg b/packages/theme/src/svgs/boat.svg new file mode 100644 index 000000000..8ee8ea446 --- /dev/null +++ b/packages/theme/src/svgs/boat.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/box-solid.svg b/packages/theme/src/svgs/box-solid.svg new file mode 100644 index 000000000..4822b468b --- /dev/null +++ b/packages/theme/src/svgs/box-solid.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/busy.svg b/packages/theme/src/svgs/busy.svg new file mode 100644 index 000000000..285ea1788 --- /dev/null +++ b/packages/theme/src/svgs/busy.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/calculator.svg b/packages/theme/src/svgs/calculator.svg new file mode 100644 index 000000000..c55b68319 --- /dev/null +++ b/packages/theme/src/svgs/calculator.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/calendar.svg b/packages/theme/src/svgs/calendar.svg new file mode 100644 index 000000000..ab63e558d --- /dev/null +++ b/packages/theme/src/svgs/calendar.svg @@ -0,0 +1,26 @@ + + + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/check-out.svg b/packages/theme/src/svgs/check-out.svg new file mode 100644 index 000000000..6febeb22f --- /dev/null +++ b/packages/theme/src/svgs/check-out.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/check.svg b/packages/theme/src/svgs/check.svg new file mode 100644 index 000000000..120ccd9e3 --- /dev/null +++ b/packages/theme/src/svgs/check.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/checked-linear.svg b/packages/theme/src/svgs/checked-linear.svg new file mode 100644 index 000000000..16abe1722 --- /dev/null +++ b/packages/theme/src/svgs/checked-linear.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/checked-sur.svg b/packages/theme/src/svgs/checked-sur.svg new file mode 100644 index 000000000..42cdf7687 --- /dev/null +++ b/packages/theme/src/svgs/checked-sur.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/checked-true.svg b/packages/theme/src/svgs/checked-true.svg new file mode 100644 index 000000000..7783a85eb --- /dev/null +++ b/packages/theme/src/svgs/checked-true.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/chevron-down.svg b/packages/theme/src/svgs/chevron-down.svg new file mode 100644 index 000000000..341cc9b8e --- /dev/null +++ b/packages/theme/src/svgs/chevron-down.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/chevron-left.svg b/packages/theme/src/svgs/chevron-left.svg new file mode 100644 index 000000000..c5c6500e7 --- /dev/null +++ b/packages/theme/src/svgs/chevron-left.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/chevron-right.svg b/packages/theme/src/svgs/chevron-right.svg new file mode 100644 index 000000000..28e1f7e12 --- /dev/null +++ b/packages/theme/src/svgs/chevron-right.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/chevron-up.svg b/packages/theme/src/svgs/chevron-up.svg new file mode 100644 index 000000000..ff2dd28a3 --- /dev/null +++ b/packages/theme/src/svgs/chevron-up.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/clear-filter.svg b/packages/theme/src/svgs/clear-filter.svg new file mode 100644 index 000000000..2f3ddcb0a --- /dev/null +++ b/packages/theme/src/svgs/clear-filter.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/clock-work.svg b/packages/theme/src/svgs/clock-work.svg new file mode 100644 index 000000000..71fd1da98 --- /dev/null +++ b/packages/theme/src/svgs/clock-work.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/svgs/close-circle.svg b/packages/theme/src/svgs/close-circle.svg new file mode 100644 index 000000000..3d5fd97fa --- /dev/null +++ b/packages/theme/src/svgs/close-circle.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/svgs/close-square.svg b/packages/theme/src/svgs/close-square.svg new file mode 100644 index 000000000..45cc399be --- /dev/null +++ b/packages/theme/src/svgs/close-square.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/close.svg b/packages/theme/src/svgs/close.svg new file mode 100644 index 000000000..3d2a6bb5b --- /dev/null +++ b/packages/theme/src/svgs/close.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/cloud-download.svg b/packages/theme/src/svgs/cloud-download.svg new file mode 100644 index 000000000..a3e1e0504 --- /dev/null +++ b/packages/theme/src/svgs/cloud-download.svg @@ -0,0 +1,27 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/cloud-upload.svg b/packages/theme/src/svgs/cloud-upload.svg new file mode 100644 index 000000000..48f7430cd --- /dev/null +++ b/packages/theme/src/svgs/cloud-upload.svg @@ -0,0 +1,27 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/code.svg b/packages/theme/src/svgs/code.svg new file mode 100644 index 000000000..dbf8c051c --- /dev/null +++ b/packages/theme/src/svgs/code.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/coin.svg b/packages/theme/src/svgs/coin.svg new file mode 100644 index 000000000..e4005126b --- /dev/null +++ b/packages/theme/src/svgs/coin.svg @@ -0,0 +1 @@ +> \ No newline at end of file diff --git a/packages/theme/src/svgs/col-reverse.svg b/packages/theme/src/svgs/col-reverse.svg new file mode 100644 index 000000000..793d3b0ef --- /dev/null +++ b/packages/theme/src/svgs/col-reverse.svg @@ -0,0 +1,7 @@ + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/commission.svg b/packages/theme/src/svgs/commission.svg new file mode 100644 index 000000000..fea73918e --- /dev/null +++ b/packages/theme/src/svgs/commission.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/conment-refresh.svg b/packages/theme/src/svgs/conment-refresh.svg new file mode 100644 index 000000000..7a9728345 --- /dev/null +++ b/packages/theme/src/svgs/conment-refresh.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/copy-solid.svg b/packages/theme/src/svgs/copy-solid.svg new file mode 100644 index 000000000..846da7266 --- /dev/null +++ b/packages/theme/src/svgs/copy-solid.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/copy.svg b/packages/theme/src/svgs/copy.svg new file mode 100644 index 000000000..6cc0c5577 --- /dev/null +++ b/packages/theme/src/svgs/copy.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/course.svg b/packages/theme/src/svgs/course.svg new file mode 100644 index 000000000..f3a6a83c0 --- /dev/null +++ b/packages/theme/src/svgs/course.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/svgs/crop.svg b/packages/theme/src/svgs/crop.svg new file mode 100644 index 000000000..c1de77ce1 --- /dev/null +++ b/packages/theme/src/svgs/crop.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/cue-l.svg b/packages/theme/src/svgs/cue-l.svg new file mode 100644 index 000000000..0cbaed27b --- /dev/null +++ b/packages/theme/src/svgs/cue-l.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/custom.svg b/packages/theme/src/svgs/custom.svg new file mode 100644 index 000000000..b2f28fec2 --- /dev/null +++ b/packages/theme/src/svgs/custom.svg @@ -0,0 +1,11 @@ + + + + + + + + + diff --git a/packages/theme/src/svgs/customer-service.svg b/packages/theme/src/svgs/customer-service.svg new file mode 100644 index 000000000..b1ead8e6d --- /dev/null +++ b/packages/theme/src/svgs/customer-service.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/data-source.svg b/packages/theme/src/svgs/data-source.svg new file mode 100644 index 000000000..f916b741b --- /dev/null +++ b/packages/theme/src/svgs/data-source.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/default.svg b/packages/theme/src/svgs/default.svg new file mode 100644 index 000000000..a349dd45b --- /dev/null +++ b/packages/theme/src/svgs/default.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/defined-filtration.svg b/packages/theme/src/svgs/defined-filtration.svg new file mode 100644 index 000000000..f32d39123 --- /dev/null +++ b/packages/theme/src/svgs/defined-filtration.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/del.svg b/packages/theme/src/svgs/del.svg new file mode 100644 index 000000000..f9697a9f5 --- /dev/null +++ b/packages/theme/src/svgs/del.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/delete-page.svg b/packages/theme/src/svgs/delete-page.svg new file mode 100644 index 000000000..91c7af5d5 --- /dev/null +++ b/packages/theme/src/svgs/delete-page.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/deleted.svg b/packages/theme/src/svgs/deleted.svg new file mode 100644 index 000000000..cf62ef36d --- /dev/null +++ b/packages/theme/src/svgs/deleted.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/delta-down-o.svg b/packages/theme/src/svgs/delta-down-o.svg new file mode 100644 index 000000000..f7cc74089 --- /dev/null +++ b/packages/theme/src/svgs/delta-down-o.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/delta-down.svg b/packages/theme/src/svgs/delta-down.svg new file mode 100644 index 000000000..38df8b779 --- /dev/null +++ b/packages/theme/src/svgs/delta-down.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/delta-left-o.svg b/packages/theme/src/svgs/delta-left-o.svg new file mode 100644 index 000000000..7c5f5d2c5 --- /dev/null +++ b/packages/theme/src/svgs/delta-left-o.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/delta-left.svg b/packages/theme/src/svgs/delta-left.svg new file mode 100644 index 000000000..c372778fb --- /dev/null +++ b/packages/theme/src/svgs/delta-left.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/delta-right-o.svg b/packages/theme/src/svgs/delta-right-o.svg new file mode 100644 index 000000000..7443f76af --- /dev/null +++ b/packages/theme/src/svgs/delta-right-o.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/delta-right.svg b/packages/theme/src/svgs/delta-right.svg new file mode 100644 index 000000000..403b335b0 --- /dev/null +++ b/packages/theme/src/svgs/delta-right.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/delta-up-o.svg b/packages/theme/src/svgs/delta-up-o.svg new file mode 100644 index 000000000..8ba5932fb --- /dev/null +++ b/packages/theme/src/svgs/delta-up-o.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/delta-up.svg b/packages/theme/src/svgs/delta-up.svg new file mode 100644 index 000000000..0878141a9 --- /dev/null +++ b/packages/theme/src/svgs/delta-up.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/derive.svg b/packages/theme/src/svgs/derive.svg new file mode 100644 index 000000000..b25eaf301 --- /dev/null +++ b/packages/theme/src/svgs/derive.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/descending.svg b/packages/theme/src/svgs/descending.svg new file mode 100644 index 000000000..856275b6e --- /dev/null +++ b/packages/theme/src/svgs/descending.svg @@ -0,0 +1,10 @@ + + + + + + diff --git a/packages/theme/src/svgs/desktop-view.svg b/packages/theme/src/svgs/desktop-view.svg new file mode 100644 index 000000000..10b263941 --- /dev/null +++ b/packages/theme/src/svgs/desktop-view.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/dialog.svg b/packages/theme/src/svgs/dialog.svg new file mode 100644 index 000000000..9d2ca13c4 --- /dev/null +++ b/packages/theme/src/svgs/dialog.svg @@ -0,0 +1,23 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/dialog2.svg b/packages/theme/src/svgs/dialog2.svg new file mode 100644 index 000000000..748d6ca9d --- /dev/null +++ b/packages/theme/src/svgs/dialog2.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/direction-col.svg b/packages/theme/src/svgs/direction-col.svg new file mode 100644 index 000000000..dfa5564d9 --- /dev/null +++ b/packages/theme/src/svgs/direction-col.svg @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/direction-row.svg b/packages/theme/src/svgs/direction-row.svg new file mode 100644 index 000000000..b04ae9654 --- /dev/null +++ b/packages/theme/src/svgs/direction-row.svg @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/dot-chart.svg b/packages/theme/src/svgs/dot-chart.svg new file mode 100644 index 000000000..89361f39c --- /dev/null +++ b/packages/theme/src/svgs/dot-chart.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/dot-download.svg b/packages/theme/src/svgs/dot-download.svg new file mode 100644 index 000000000..81d06ac16 --- /dev/null +++ b/packages/theme/src/svgs/dot-download.svg @@ -0,0 +1,24 @@ + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/dot-ipv4.svg b/packages/theme/src/svgs/dot-ipv4.svg new file mode 100644 index 000000000..6ccdd99b4 --- /dev/null +++ b/packages/theme/src/svgs/dot-ipv4.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/double-left.svg b/packages/theme/src/svgs/double-left.svg new file mode 100644 index 000000000..dbaf2f3f1 --- /dev/null +++ b/packages/theme/src/svgs/double-left.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/double-right.svg b/packages/theme/src/svgs/double-right.svg new file mode 100644 index 000000000..948e407a4 --- /dev/null +++ b/packages/theme/src/svgs/double-right.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/down-o.svg b/packages/theme/src/svgs/down-o.svg new file mode 100644 index 000000000..f7cc74089 --- /dev/null +++ b/packages/theme/src/svgs/down-o.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/down.svg b/packages/theme/src/svgs/down.svg new file mode 100644 index 000000000..1ab365f65 --- /dev/null +++ b/packages/theme/src/svgs/down.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/download-cloud.svg b/packages/theme/src/svgs/download-cloud.svg new file mode 100644 index 000000000..31a932bec --- /dev/null +++ b/packages/theme/src/svgs/download-cloud.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/svgs/download-link.svg b/packages/theme/src/svgs/download-link.svg new file mode 100644 index 000000000..da11ddae9 --- /dev/null +++ b/packages/theme/src/svgs/download-link.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/svgs/download.svg b/packages/theme/src/svgs/download.svg new file mode 100644 index 000000000..48ee88680 --- /dev/null +++ b/packages/theme/src/svgs/download.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/draft.svg b/packages/theme/src/svgs/draft.svg new file mode 100644 index 000000000..e1e0626bb --- /dev/null +++ b/packages/theme/src/svgs/draft.svg @@ -0,0 +1,21 @@ + + + Created with Sketch. + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/edit.svg b/packages/theme/src/svgs/edit.svg new file mode 100644 index 000000000..9a8d8a5d7 --- /dev/null +++ b/packages/theme/src/svgs/edit.svg @@ -0,0 +1,10 @@ + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-align-center.svg b/packages/theme/src/svgs/editor-align-center.svg new file mode 100644 index 000000000..686d43c95 --- /dev/null +++ b/packages/theme/src/svgs/editor-align-center.svg @@ -0,0 +1,10 @@ + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-align-left.svg b/packages/theme/src/svgs/editor-align-left.svg new file mode 100644 index 000000000..d55377098 --- /dev/null +++ b/packages/theme/src/svgs/editor-align-left.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-align-right.svg b/packages/theme/src/svgs/editor-align-right.svg new file mode 100644 index 000000000..097d445d8 --- /dev/null +++ b/packages/theme/src/svgs/editor-align-right.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-background.svg b/packages/theme/src/svgs/editor-background.svg new file mode 100644 index 000000000..fbfc95460 --- /dev/null +++ b/packages/theme/src/svgs/editor-background.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-bold.svg b/packages/theme/src/svgs/editor-bold.svg new file mode 100644 index 000000000..7d6fbca7b --- /dev/null +++ b/packages/theme/src/svgs/editor-bold.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-code.svg b/packages/theme/src/svgs/editor-code.svg new file mode 100644 index 000000000..2bd2a82f9 --- /dev/null +++ b/packages/theme/src/svgs/editor-code.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-deleteline.svg b/packages/theme/src/svgs/editor-deleteline.svg new file mode 100644 index 000000000..a79941227 --- /dev/null +++ b/packages/theme/src/svgs/editor-deleteline.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-eraser.svg b/packages/theme/src/svgs/editor-eraser.svg new file mode 100644 index 000000000..65bb72845 --- /dev/null +++ b/packages/theme/src/svgs/editor-eraser.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-italic.svg b/packages/theme/src/svgs/editor-italic.svg new file mode 100644 index 000000000..7ae93cec1 --- /dev/null +++ b/packages/theme/src/svgs/editor-italic.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-left-border.svg b/packages/theme/src/svgs/editor-left-border.svg new file mode 100644 index 000000000..0609a30c2 --- /dev/null +++ b/packages/theme/src/svgs/editor-left-border.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-list-dot.svg b/packages/theme/src/svgs/editor-list-dot.svg new file mode 100644 index 000000000..2613631df --- /dev/null +++ b/packages/theme/src/svgs/editor-list-dot.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-list-num.svg b/packages/theme/src/svgs/editor-list-num.svg new file mode 100644 index 000000000..59d05961b --- /dev/null +++ b/packages/theme/src/svgs/editor-list-num.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-list.svg b/packages/theme/src/svgs/editor-list.svg new file mode 100644 index 000000000..2613631df --- /dev/null +++ b/packages/theme/src/svgs/editor-list.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-menu-left.svg b/packages/theme/src/svgs/editor-menu-left.svg new file mode 100644 index 000000000..096bdd607 --- /dev/null +++ b/packages/theme/src/svgs/editor-menu-left.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-menu-right.svg b/packages/theme/src/svgs/editor-menu-right.svg new file mode 100644 index 000000000..6c42b6493 --- /dev/null +++ b/packages/theme/src/svgs/editor-menu-right.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-quote.svg b/packages/theme/src/svgs/editor-quote.svg new file mode 100644 index 000000000..1b59514b3 --- /dev/null +++ b/packages/theme/src/svgs/editor-quote.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-redo.svg b/packages/theme/src/svgs/editor-redo.svg new file mode 100644 index 000000000..c18c80f2a --- /dev/null +++ b/packages/theme/src/svgs/editor-redo.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-right-border.svg b/packages/theme/src/svgs/editor-right-border.svg new file mode 100644 index 000000000..f57a597e6 --- /dev/null +++ b/packages/theme/src/svgs/editor-right-border.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-sub.svg b/packages/theme/src/svgs/editor-sub.svg new file mode 100644 index 000000000..a2f358bda --- /dev/null +++ b/packages/theme/src/svgs/editor-sub.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-subtitle.svg b/packages/theme/src/svgs/editor-subtitle.svg new file mode 100644 index 000000000..2cff78174 --- /dev/null +++ b/packages/theme/src/svgs/editor-subtitle.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-super.svg b/packages/theme/src/svgs/editor-super.svg new file mode 100644 index 000000000..e3f3913c0 --- /dev/null +++ b/packages/theme/src/svgs/editor-super.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-tab.svg b/packages/theme/src/svgs/editor-tab.svg new file mode 100644 index 000000000..34ec5f324 --- /dev/null +++ b/packages/theme/src/svgs/editor-tab.svg @@ -0,0 +1,11 @@ + + + + + + + + + diff --git a/packages/theme/src/svgs/editor-table.svg b/packages/theme/src/svgs/editor-table.svg new file mode 100644 index 000000000..55434f96e --- /dev/null +++ b/packages/theme/src/svgs/editor-table.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-textcolor.svg b/packages/theme/src/svgs/editor-textcolor.svg new file mode 100644 index 000000000..28bf82744 --- /dev/null +++ b/packages/theme/src/svgs/editor-textcolor.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-title.svg b/packages/theme/src/svgs/editor-title.svg new file mode 100644 index 000000000..de7833577 --- /dev/null +++ b/packages/theme/src/svgs/editor-title.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-underline.svg b/packages/theme/src/svgs/editor-underline.svg new file mode 100644 index 000000000..49b20fbb6 --- /dev/null +++ b/packages/theme/src/svgs/editor-underline.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-undo.svg b/packages/theme/src/svgs/editor-undo.svg new file mode 100644 index 000000000..049148210 --- /dev/null +++ b/packages/theme/src/svgs/editor-undo.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/editor-video.svg b/packages/theme/src/svgs/editor-video.svg new file mode 100644 index 000000000..77e10966c --- /dev/null +++ b/packages/theme/src/svgs/editor-video.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/ellipsis.svg b/packages/theme/src/svgs/ellipsis.svg new file mode 100644 index 000000000..113f37c42 --- /dev/null +++ b/packages/theme/src/svgs/ellipsis.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/email-add.svg b/packages/theme/src/svgs/email-add.svg new file mode 100644 index 000000000..a5bbd1940 --- /dev/null +++ b/packages/theme/src/svgs/email-add.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/email-circle.svg b/packages/theme/src/svgs/email-circle.svg new file mode 100644 index 000000000..92a57df27 --- /dev/null +++ b/packages/theme/src/svgs/email-circle.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/end.svg b/packages/theme/src/svgs/end.svg new file mode 100644 index 000000000..95db4e419 --- /dev/null +++ b/packages/theme/src/svgs/end.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/error.svg b/packages/theme/src/svgs/error.svg new file mode 100644 index 000000000..78defc29f --- /dev/null +++ b/packages/theme/src/svgs/error.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/espace-auto.svg b/packages/theme/src/svgs/espace-auto.svg new file mode 100644 index 000000000..ae3c69d0a --- /dev/null +++ b/packages/theme/src/svgs/espace-auto.svg @@ -0,0 +1,20 @@ + + + + + + diff --git a/packages/theme/src/svgs/espace.svg b/packages/theme/src/svgs/espace.svg new file mode 100644 index 000000000..5ff711f26 --- /dev/null +++ b/packages/theme/src/svgs/espace.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/excel.svg b/packages/theme/src/svgs/excel.svg new file mode 100644 index 000000000..c9f5527b5 --- /dev/null +++ b/packages/theme/src/svgs/excel.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/svgs/exception.svg b/packages/theme/src/svgs/exception.svg new file mode 100644 index 000000000..cf74518a5 --- /dev/null +++ b/packages/theme/src/svgs/exception.svg @@ -0,0 +1,25 @@ + + + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/exclamation.svg b/packages/theme/src/svgs/exclamation.svg new file mode 100644 index 000000000..5e43e72bc --- /dev/null +++ b/packages/theme/src/svgs/exclamation.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/export.svg b/packages/theme/src/svgs/export.svg new file mode 100644 index 000000000..de3855105 --- /dev/null +++ b/packages/theme/src/svgs/export.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/express-search.svg b/packages/theme/src/svgs/express-search.svg new file mode 100644 index 000000000..f70c15707 --- /dev/null +++ b/packages/theme/src/svgs/express-search.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/eyeclose.svg b/packages/theme/src/svgs/eyeclose.svg new file mode 100644 index 000000000..a3a05ddf9 --- /dev/null +++ b/packages/theme/src/svgs/eyeclose.svg @@ -0,0 +1,18 @@ + + + + + + diff --git a/packages/theme/src/svgs/eyeopen.svg b/packages/theme/src/svgs/eyeopen.svg new file mode 100644 index 000000000..7df74e32a --- /dev/null +++ b/packages/theme/src/svgs/eyeopen.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/file-cloudupload.svg b/packages/theme/src/svgs/file-cloudupload.svg new file mode 100644 index 000000000..0a3a3cf98 --- /dev/null +++ b/packages/theme/src/svgs/file-cloudupload.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/file-excel.svg b/packages/theme/src/svgs/file-excel.svg new file mode 100644 index 000000000..63d2d3907 --- /dev/null +++ b/packages/theme/src/svgs/file-excel.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/file.svg b/packages/theme/src/svgs/file.svg new file mode 100644 index 000000000..45403a269 --- /dev/null +++ b/packages/theme/src/svgs/file.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/files-circle.svg b/packages/theme/src/svgs/files-circle.svg new file mode 100644 index 000000000..d4b3eca5f --- /dev/null +++ b/packages/theme/src/svgs/files-circle.svg @@ -0,0 +1,30 @@ + + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/files.svg b/packages/theme/src/svgs/files.svg new file mode 100644 index 000000000..7e0fa644a --- /dev/null +++ b/packages/theme/src/svgs/files.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/filetext.svg b/packages/theme/src/svgs/filetext.svg new file mode 100644 index 000000000..c0e67f0f4 --- /dev/null +++ b/packages/theme/src/svgs/filetext.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/fileupload.svg b/packages/theme/src/svgs/fileupload.svg new file mode 100644 index 000000000..268b3aef6 --- /dev/null +++ b/packages/theme/src/svgs/fileupload.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/svgs/filtered.svg b/packages/theme/src/svgs/filtered.svg new file mode 100644 index 000000000..fe77d0e48 --- /dev/null +++ b/packages/theme/src/svgs/filtered.svg @@ -0,0 +1,10 @@ + + + + + + + + diff --git a/packages/theme/src/svgs/flag.svg b/packages/theme/src/svgs/flag.svg new file mode 100644 index 000000000..23ffbe405 --- /dev/null +++ b/packages/theme/src/svgs/flag.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/folder-closed.svg b/packages/theme/src/svgs/folder-closed.svg new file mode 100644 index 000000000..31169739e --- /dev/null +++ b/packages/theme/src/svgs/folder-closed.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/folder-opened.svg b/packages/theme/src/svgs/folder-opened.svg new file mode 100644 index 000000000..c23d9825e --- /dev/null +++ b/packages/theme/src/svgs/folder-opened.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/font-color.svg b/packages/theme/src/svgs/font-color.svg new file mode 100644 index 000000000..68990647e --- /dev/null +++ b/packages/theme/src/svgs/font-color.svg @@ -0,0 +1,5 @@ + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/font-family.svg b/packages/theme/src/svgs/font-family.svg new file mode 100644 index 000000000..8c05e29f9 --- /dev/null +++ b/packages/theme/src/svgs/font-family.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/font-size.svg b/packages/theme/src/svgs/font-size.svg new file mode 100644 index 000000000..a3e69931d --- /dev/null +++ b/packages/theme/src/svgs/font-size.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/font-style.svg b/packages/theme/src/svgs/font-style.svg new file mode 100644 index 000000000..495f9453e --- /dev/null +++ b/packages/theme/src/svgs/font-style.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/font-weight.svg b/packages/theme/src/svgs/font-weight.svg new file mode 100644 index 000000000..e176f8416 --- /dev/null +++ b/packages/theme/src/svgs/font-weight.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/freeze-left.svg b/packages/theme/src/svgs/freeze-left.svg new file mode 100644 index 000000000..5e731f8d1 --- /dev/null +++ b/packages/theme/src/svgs/freeze-left.svg @@ -0,0 +1,40 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/freeze-right.svg b/packages/theme/src/svgs/freeze-right.svg new file mode 100644 index 000000000..87072717f --- /dev/null +++ b/packages/theme/src/svgs/freeze-right.svg @@ -0,0 +1,41 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/frown-o.svg b/packages/theme/src/svgs/frown-o.svg new file mode 100644 index 000000000..5960bac0b --- /dev/null +++ b/packages/theme/src/svgs/frown-o.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/frown.svg b/packages/theme/src/svgs/frown.svg new file mode 100644 index 000000000..33fcbdef0 --- /dev/null +++ b/packages/theme/src/svgs/frown.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/fullscreen-left.svg b/packages/theme/src/svgs/fullscreen-left.svg new file mode 100644 index 000000000..392197a2c --- /dev/null +++ b/packages/theme/src/svgs/fullscreen-left.svg @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/fullscreen.svg b/packages/theme/src/svgs/fullscreen.svg new file mode 100644 index 000000000..95eaa0f82 --- /dev/null +++ b/packages/theme/src/svgs/fullscreen.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/grade.svg b/packages/theme/src/svgs/grade.svg new file mode 100644 index 000000000..3060f7a23 --- /dev/null +++ b/packages/theme/src/svgs/grade.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/svgs/group-transfer.svg b/packages/theme/src/svgs/group-transfer.svg new file mode 100644 index 000000000..bbf60eaf2 --- /dev/null +++ b/packages/theme/src/svgs/group-transfer.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/group.svg b/packages/theme/src/svgs/group.svg new file mode 100644 index 000000000..6d0beeb8b --- /dev/null +++ b/packages/theme/src/svgs/group.svg @@ -0,0 +1,24 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/halfchecked.svg b/packages/theme/src/svgs/halfchecked.svg new file mode 100644 index 000000000..9225076e5 --- /dev/null +++ b/packages/theme/src/svgs/halfchecked.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/halfselect.svg b/packages/theme/src/svgs/halfselect.svg new file mode 100644 index 000000000..20cf60ae3 --- /dev/null +++ b/packages/theme/src/svgs/halfselect.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/heartempty.svg b/packages/theme/src/svgs/heartempty.svg new file mode 100644 index 000000000..ef739a47b --- /dev/null +++ b/packages/theme/src/svgs/heartempty.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/help-circle.svg b/packages/theme/src/svgs/help-circle.svg new file mode 100644 index 000000000..db4cad0d2 --- /dev/null +++ b/packages/theme/src/svgs/help-circle.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/help-query.svg b/packages/theme/src/svgs/help-query.svg new file mode 100644 index 000000000..d815b637b --- /dev/null +++ b/packages/theme/src/svgs/help-query.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/help-solid.svg b/packages/theme/src/svgs/help-solid.svg new file mode 100644 index 000000000..1a4b97b44 --- /dev/null +++ b/packages/theme/src/svgs/help-solid.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/help.svg b/packages/theme/src/svgs/help.svg new file mode 100644 index 000000000..f10b34266 --- /dev/null +++ b/packages/theme/src/svgs/help.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/helpful.svg b/packages/theme/src/svgs/helpful.svg new file mode 100644 index 000000000..e7882b826 --- /dev/null +++ b/packages/theme/src/svgs/helpful.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/svgs/hide-left.svg b/packages/theme/src/svgs/hide-left.svg new file mode 100644 index 000000000..66a8a1b5c --- /dev/null +++ b/packages/theme/src/svgs/hide-left.svg @@ -0,0 +1,5 @@ + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/hide-right.svg b/packages/theme/src/svgs/hide-right.svg new file mode 100644 index 000000000..d75957374 --- /dev/null +++ b/packages/theme/src/svgs/hide-right.svg @@ -0,0 +1,5 @@ + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/hide-topleft.svg b/packages/theme/src/svgs/hide-topleft.svg new file mode 100644 index 000000000..ebd1f180b --- /dev/null +++ b/packages/theme/src/svgs/hide-topleft.svg @@ -0,0 +1,5 @@ + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/import.svg b/packages/theme/src/svgs/import.svg new file mode 100644 index 000000000..fc53d87fb --- /dev/null +++ b/packages/theme/src/svgs/import.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/info-circle.svg b/packages/theme/src/svgs/info-circle.svg new file mode 100644 index 000000000..54164e7d9 --- /dev/null +++ b/packages/theme/src/svgs/info-circle.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/info-solid.svg b/packages/theme/src/svgs/info-solid.svg new file mode 100644 index 000000000..067b8b324 --- /dev/null +++ b/packages/theme/src/svgs/info-solid.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/info.svg b/packages/theme/src/svgs/info.svg new file mode 100644 index 000000000..afe72b05c --- /dev/null +++ b/packages/theme/src/svgs/info.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/svgs/information.svg b/packages/theme/src/svgs/information.svg new file mode 100644 index 000000000..daba831c5 --- /dev/null +++ b/packages/theme/src/svgs/information.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + diff --git a/packages/theme/src/svgs/js.svg b/packages/theme/src/svgs/js.svg new file mode 100644 index 000000000..f295f29e2 --- /dev/null +++ b/packages/theme/src/svgs/js.svg @@ -0,0 +1,5 @@ + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/jusitfy-center.svg b/packages/theme/src/svgs/jusitfy-center.svg new file mode 100644 index 000000000..30e65e9a1 --- /dev/null +++ b/packages/theme/src/svgs/jusitfy-center.svg @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/jusitfy-flex-end.svg b/packages/theme/src/svgs/jusitfy-flex-end.svg new file mode 100644 index 000000000..e18ef3ff7 --- /dev/null +++ b/packages/theme/src/svgs/jusitfy-flex-end.svg @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/jusitfy-space-around.svg b/packages/theme/src/svgs/jusitfy-space-around.svg new file mode 100644 index 000000000..41cc2334b --- /dev/null +++ b/packages/theme/src/svgs/jusitfy-space-around.svg @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/jusitfy-space-between.svg b/packages/theme/src/svgs/jusitfy-space-between.svg new file mode 100644 index 000000000..5bdd9e497 --- /dev/null +++ b/packages/theme/src/svgs/jusitfy-space-between.svg @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/justitfy-flex-start.svg b/packages/theme/src/svgs/justitfy-flex-start.svg new file mode 100644 index 000000000..1b5d546aa --- /dev/null +++ b/packages/theme/src/svgs/justitfy-flex-start.svg @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/language.svg b/packages/theme/src/svgs/language.svg new file mode 100644 index 000000000..2adf0e687 --- /dev/null +++ b/packages/theme/src/svgs/language.svg @@ -0,0 +1,7 @@ + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/leave.svg b/packages/theme/src/svgs/leave.svg new file mode 100644 index 000000000..1747357bd --- /dev/null +++ b/packages/theme/src/svgs/leave.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/left-frozen.svg b/packages/theme/src/svgs/left-frozen.svg new file mode 100644 index 000000000..792bf51ae --- /dev/null +++ b/packages/theme/src/svgs/left-frozen.svg @@ -0,0 +1,26 @@ + + + + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/left-o.svg b/packages/theme/src/svgs/left-o.svg new file mode 100644 index 000000000..7c5f5d2c5 --- /dev/null +++ b/packages/theme/src/svgs/left-o.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/left-ward.svg b/packages/theme/src/svgs/left-ward.svg new file mode 100644 index 000000000..3e3dd9b4b --- /dev/null +++ b/packages/theme/src/svgs/left-ward.svg @@ -0,0 +1,8 @@ + + + + + + diff --git a/packages/theme/src/svgs/left.svg b/packages/theme/src/svgs/left.svg new file mode 100644 index 000000000..c372778fb --- /dev/null +++ b/packages/theme/src/svgs/left.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/line-chart.svg b/packages/theme/src/svgs/line-chart.svg new file mode 100644 index 000000000..8e7877f80 --- /dev/null +++ b/packages/theme/src/svgs/line-chart.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/line-height.svg b/packages/theme/src/svgs/line-height.svg new file mode 100644 index 000000000..ceb39a8cc --- /dev/null +++ b/packages/theme/src/svgs/line-height.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/line-throught.svg b/packages/theme/src/svgs/line-throught.svg new file mode 100644 index 000000000..0eef02c36 --- /dev/null +++ b/packages/theme/src/svgs/line-throught.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/link.svg b/packages/theme/src/svgs/link.svg new file mode 100644 index 000000000..f4d5e8acd --- /dev/null +++ b/packages/theme/src/svgs/link.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/loading.svg b/packages/theme/src/svgs/loading.svg new file mode 100644 index 000000000..886feb573 --- /dev/null +++ b/packages/theme/src/svgs/loading.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/svgs/lock.svg b/packages/theme/src/svgs/lock.svg new file mode 100644 index 000000000..9e8a58c22 --- /dev/null +++ b/packages/theme/src/svgs/lock.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/mail-content.svg b/packages/theme/src/svgs/mail-content.svg new file mode 100644 index 000000000..52bc6db69 --- /dev/null +++ b/packages/theme/src/svgs/mail-content.svg @@ -0,0 +1,14 @@ + + + + + + + + diff --git a/packages/theme/src/svgs/mail.svg b/packages/theme/src/svgs/mail.svg new file mode 100644 index 000000000..1d29e0dd3 --- /dev/null +++ b/packages/theme/src/svgs/mail.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/male.svg b/packages/theme/src/svgs/male.svg new file mode 100644 index 000000000..fe875c04b --- /dev/null +++ b/packages/theme/src/svgs/male.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/mark-on.svg b/packages/theme/src/svgs/mark-on.svg new file mode 100644 index 000000000..94f7dfeb2 --- /dev/null +++ b/packages/theme/src/svgs/mark-on.svg @@ -0,0 +1 @@ + diff --git a/packages/theme/src/svgs/meh.svg b/packages/theme/src/svgs/meh.svg new file mode 100644 index 000000000..9d134085d --- /dev/null +++ b/packages/theme/src/svgs/meh.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/message-circle.svg b/packages/theme/src/svgs/message-circle.svg new file mode 100644 index 000000000..c0d6eaf55 --- /dev/null +++ b/packages/theme/src/svgs/message-circle.svg @@ -0,0 +1,28 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/minscreen-left.svg b/packages/theme/src/svgs/minscreen-left.svg new file mode 100644 index 000000000..e4b3d9e69 --- /dev/null +++ b/packages/theme/src/svgs/minscreen-left.svg @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/minscreen.svg b/packages/theme/src/svgs/minscreen.svg new file mode 100644 index 000000000..5582771c8 --- /dev/null +++ b/packages/theme/src/svgs/minscreen.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/minus-circle.svg b/packages/theme/src/svgs/minus-circle.svg new file mode 100644 index 000000000..44c6520a4 --- /dev/null +++ b/packages/theme/src/svgs/minus-circle.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/minus-square.svg b/packages/theme/src/svgs/minus-square.svg new file mode 100644 index 000000000..0c1dbc264 --- /dev/null +++ b/packages/theme/src/svgs/minus-square.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/minus.svg b/packages/theme/src/svgs/minus.svg new file mode 100644 index 000000000..3f2afdbd2 --- /dev/null +++ b/packages/theme/src/svgs/minus.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/mobile-view.svg b/packages/theme/src/svgs/mobile-view.svg new file mode 100644 index 000000000..d90395b47 --- /dev/null +++ b/packages/theme/src/svgs/mobile-view.svg @@ -0,0 +1,5 @@ + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/mobile.svg b/packages/theme/src/svgs/mobile.svg new file mode 100644 index 000000000..1d48b18fa --- /dev/null +++ b/packages/theme/src/svgs/mobile.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/svgs/more.svg b/packages/theme/src/svgs/more.svg new file mode 100644 index 000000000..dd93dfc0c --- /dev/null +++ b/packages/theme/src/svgs/more.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/new.svg b/packages/theme/src/svgs/new.svg new file mode 100644 index 000000000..ced3b8d2a --- /dev/null +++ b/packages/theme/src/svgs/new.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/no-premission.svg b/packages/theme/src/svgs/no-premission.svg new file mode 100644 index 000000000..1b5b07620 --- /dev/null +++ b/packages/theme/src/svgs/no-premission.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/node-open.svg b/packages/theme/src/svgs/node-open.svg new file mode 100644 index 000000000..cbffa4239 --- /dev/null +++ b/packages/theme/src/svgs/node-open.svg @@ -0,0 +1,10 @@ + + + + + + diff --git a/packages/theme/src/svgs/node.svg b/packages/theme/src/svgs/node.svg new file mode 100644 index 000000000..6d6f5e9d4 --- /dev/null +++ b/packages/theme/src/svgs/node.svg @@ -0,0 +1 @@ + diff --git a/packages/theme/src/svgs/nodejs.svg b/packages/theme/src/svgs/nodejs.svg new file mode 100644 index 000000000..ee1a0ba42 --- /dev/null +++ b/packages/theme/src/svgs/nodejs.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/none.svg b/packages/theme/src/svgs/none.svg new file mode 100644 index 000000000..c7af118a7 --- /dev/null +++ b/packages/theme/src/svgs/none.svg @@ -0,0 +1,5 @@ + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/off-line.svg b/packages/theme/src/svgs/off-line.svg new file mode 100644 index 000000000..3185836ee --- /dev/null +++ b/packages/theme/src/svgs/off-line.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/on-line.svg b/packages/theme/src/svgs/on-line.svg new file mode 100644 index 000000000..b5d1a6c6b --- /dev/null +++ b/packages/theme/src/svgs/on-line.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/operationfaild-l.svg b/packages/theme/src/svgs/operationfaild-l.svg new file mode 100644 index 000000000..fb3c12be8 --- /dev/null +++ b/packages/theme/src/svgs/operationfaild-l.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/operationfaild.svg b/packages/theme/src/svgs/operationfaild.svg new file mode 100644 index 000000000..f8be1347f --- /dev/null +++ b/packages/theme/src/svgs/operationfaild.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/outer-link.svg b/packages/theme/src/svgs/outer-link.svg new file mode 100644 index 000000000..18a6b81c9 --- /dev/null +++ b/packages/theme/src/svgs/outer-link.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/svgs/pagelink.svg b/packages/theme/src/svgs/pagelink.svg new file mode 100644 index 000000000..07c6b03f2 --- /dev/null +++ b/packages/theme/src/svgs/pagelink.svg @@ -0,0 +1,28 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/pager-first.svg b/packages/theme/src/svgs/pager-first.svg new file mode 100644 index 000000000..ccfa6ecb9 --- /dev/null +++ b/packages/theme/src/svgs/pager-first.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/pager-last.svg b/packages/theme/src/svgs/pager-last.svg new file mode 100644 index 000000000..202546dae --- /dev/null +++ b/packages/theme/src/svgs/pager-last.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/pager-next.svg b/packages/theme/src/svgs/pager-next.svg new file mode 100644 index 000000000..142956e20 --- /dev/null +++ b/packages/theme/src/svgs/pager-next.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/pager-prev.svg b/packages/theme/src/svgs/pager-prev.svg new file mode 100644 index 000000000..fc13e5c27 --- /dev/null +++ b/packages/theme/src/svgs/pager-prev.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/panel-max.svg b/packages/theme/src/svgs/panel-max.svg new file mode 100644 index 000000000..ee9c75b59 --- /dev/null +++ b/packages/theme/src/svgs/panel-max.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/panel-mini.svg b/packages/theme/src/svgs/panel-mini.svg new file mode 100644 index 000000000..0f052f592 --- /dev/null +++ b/packages/theme/src/svgs/panel-mini.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/panel-normal.svg b/packages/theme/src/svgs/panel-normal.svg new file mode 100644 index 000000000..1d6ecb9fb --- /dev/null +++ b/packages/theme/src/svgs/panel-normal.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/pause-circle.svg b/packages/theme/src/svgs/pause-circle.svg new file mode 100644 index 000000000..0f90dc61f --- /dev/null +++ b/packages/theme/src/svgs/pause-circle.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/pause.svg b/packages/theme/src/svgs/pause.svg new file mode 100644 index 000000000..282e840ba --- /dev/null +++ b/packages/theme/src/svgs/pause.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/picture.svg b/packages/theme/src/svgs/picture.svg new file mode 100644 index 000000000..2cafb79f2 --- /dev/null +++ b/packages/theme/src/svgs/picture.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/pie-chart.svg b/packages/theme/src/svgs/pie-chart.svg new file mode 100644 index 000000000..5c87dd3bc --- /dev/null +++ b/packages/theme/src/svgs/pie-chart.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/plus-circle.svg b/packages/theme/src/svgs/plus-circle.svg new file mode 100644 index 000000000..8bbf9d39c --- /dev/null +++ b/packages/theme/src/svgs/plus-circle.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/plus-square.svg b/packages/theme/src/svgs/plus-square.svg new file mode 100644 index 000000000..bea01a4ef --- /dev/null +++ b/packages/theme/src/svgs/plus-square.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/plus.svg b/packages/theme/src/svgs/plus.svg new file mode 100644 index 000000000..8fccd5842 --- /dev/null +++ b/packages/theme/src/svgs/plus.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/popup.svg b/packages/theme/src/svgs/popup.svg new file mode 100644 index 000000000..2045fd6c4 --- /dev/null +++ b/packages/theme/src/svgs/popup.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/svgs/pre-checked.svg b/packages/theme/src/svgs/pre-checked.svg new file mode 100644 index 000000000..f00d7d46b --- /dev/null +++ b/packages/theme/src/svgs/pre-checked.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/print-preview.svg b/packages/theme/src/svgs/print-preview.svg new file mode 100644 index 000000000..d64c339ee --- /dev/null +++ b/packages/theme/src/svgs/print-preview.svg @@ -0,0 +1,13 @@ + + + + + + + + + + diff --git a/packages/theme/src/svgs/pushpin.svg b/packages/theme/src/svgs/pushpin.svg new file mode 100644 index 000000000..e1ece10cf --- /dev/null +++ b/packages/theme/src/svgs/pushpin.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/radio.svg b/packages/theme/src/svgs/radio.svg new file mode 100644 index 000000000..27ee770b7 --- /dev/null +++ b/packages/theme/src/svgs/radio.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/radioselected.svg b/packages/theme/src/svgs/radioselected.svg new file mode 100644 index 000000000..b389c13ba --- /dev/null +++ b/packages/theme/src/svgs/radioselected.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/reactjs.svg b/packages/theme/src/svgs/reactjs.svg new file mode 100644 index 000000000..c12ebb013 --- /dev/null +++ b/packages/theme/src/svgs/reactjs.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/redo.svg b/packages/theme/src/svgs/redo.svg new file mode 100644 index 000000000..bbfebc32e --- /dev/null +++ b/packages/theme/src/svgs/redo.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/refres.svg b/packages/theme/src/svgs/refres.svg new file mode 100644 index 000000000..e6273142a --- /dev/null +++ b/packages/theme/src/svgs/refres.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/renew.svg b/packages/theme/src/svgs/renew.svg new file mode 100644 index 000000000..b4469cce7 --- /dev/null +++ b/packages/theme/src/svgs/renew.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/repeat.svg b/packages/theme/src/svgs/repeat.svg new file mode 100644 index 000000000..dea26cc02 --- /dev/null +++ b/packages/theme/src/svgs/repeat.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/replace.svg b/packages/theme/src/svgs/replace.svg new file mode 100644 index 000000000..163ffcec1 --- /dev/null +++ b/packages/theme/src/svgs/replace.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/replies.svg b/packages/theme/src/svgs/replies.svg new file mode 100644 index 000000000..80c4e7cb4 --- /dev/null +++ b/packages/theme/src/svgs/replies.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/right-frozen.svg b/packages/theme/src/svgs/right-frozen.svg new file mode 100644 index 000000000..7ddde49fb --- /dev/null +++ b/packages/theme/src/svgs/right-frozen.svg @@ -0,0 +1,28 @@ + + + + + + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/right-o.svg b/packages/theme/src/svgs/right-o.svg new file mode 100644 index 000000000..7443f76af --- /dev/null +++ b/packages/theme/src/svgs/right-o.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/right.svg b/packages/theme/src/svgs/right.svg new file mode 100644 index 000000000..403b335b0 --- /dev/null +++ b/packages/theme/src/svgs/right.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/rightward.svg b/packages/theme/src/svgs/rightward.svg new file mode 100644 index 000000000..67c2982dc --- /dev/null +++ b/packages/theme/src/svgs/rightward.svg @@ -0,0 +1,8 @@ + + + + + + diff --git a/packages/theme/src/svgs/row-reverse.svg b/packages/theme/src/svgs/row-reverse.svg new file mode 100644 index 000000000..233d0a7d2 --- /dev/null +++ b/packages/theme/src/svgs/row-reverse.svg @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/sandwich-collapse.svg b/packages/theme/src/svgs/sandwich-collapse.svg new file mode 100644 index 000000000..2dde86cc0 --- /dev/null +++ b/packages/theme/src/svgs/sandwich-collapse.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/sandwich-expand.svg b/packages/theme/src/svgs/sandwich-expand.svg new file mode 100644 index 000000000..e406f97df --- /dev/null +++ b/packages/theme/src/svgs/sandwich-expand.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/save.svg b/packages/theme/src/svgs/save.svg new file mode 100644 index 000000000..552157664 --- /dev/null +++ b/packages/theme/src/svgs/save.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/scissor.svg b/packages/theme/src/svgs/scissor.svg new file mode 100644 index 000000000..6475fa982 --- /dev/null +++ b/packages/theme/src/svgs/scissor.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + diff --git a/packages/theme/src/svgs/search.svg b/packages/theme/src/svgs/search.svg new file mode 100644 index 000000000..83e0af179 --- /dev/null +++ b/packages/theme/src/svgs/search.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/select.svg b/packages/theme/src/svgs/select.svg new file mode 100644 index 000000000..60d55d829 --- /dev/null +++ b/packages/theme/src/svgs/select.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/sent.svg b/packages/theme/src/svgs/sent.svg new file mode 100644 index 000000000..1544d8883 --- /dev/null +++ b/packages/theme/src/svgs/sent.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/separate.svg b/packages/theme/src/svgs/separate.svg new file mode 100644 index 000000000..e4d192078 --- /dev/null +++ b/packages/theme/src/svgs/separate.svg @@ -0,0 +1,10 @@ + + + + + + + + + diff --git a/packages/theme/src/svgs/setting.svg b/packages/theme/src/svgs/setting.svg new file mode 100644 index 000000000..16747aabd --- /dev/null +++ b/packages/theme/src/svgs/setting.svg @@ -0,0 +1,30 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/share-arrow.svg b/packages/theme/src/svgs/share-arrow.svg new file mode 100644 index 000000000..e4793e161 --- /dev/null +++ b/packages/theme/src/svgs/share-arrow.svg @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/share.svg b/packages/theme/src/svgs/share.svg new file mode 100644 index 000000000..7dddc6c7b --- /dev/null +++ b/packages/theme/src/svgs/share.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/shopping-card.svg b/packages/theme/src/svgs/shopping-card.svg new file mode 100644 index 000000000..b18f85989 --- /dev/null +++ b/packages/theme/src/svgs/shopping-card.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/smile-o.svg b/packages/theme/src/svgs/smile-o.svg new file mode 100644 index 000000000..c35452600 --- /dev/null +++ b/packages/theme/src/svgs/smile-o.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/smile.svg b/packages/theme/src/svgs/smile.svg new file mode 100644 index 000000000..f1e474dad --- /dev/null +++ b/packages/theme/src/svgs/smile.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/sort-default.svg b/packages/theme/src/svgs/sort-default.svg new file mode 100644 index 000000000..6da73e461 --- /dev/null +++ b/packages/theme/src/svgs/sort-default.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/packages/theme/src/svgs/sort.svg b/packages/theme/src/svgs/sort.svg new file mode 100644 index 000000000..9234afd2f --- /dev/null +++ b/packages/theme/src/svgs/sort.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/star-active.svg b/packages/theme/src/svgs/star-active.svg new file mode 100644 index 000000000..0c8a2d1e9 --- /dev/null +++ b/packages/theme/src/svgs/star-active.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/star-disable.svg b/packages/theme/src/svgs/star-disable.svg new file mode 100644 index 000000000..66e2a88bb --- /dev/null +++ b/packages/theme/src/svgs/star-disable.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/star-o.svg b/packages/theme/src/svgs/star-o.svg new file mode 100644 index 000000000..da81600be --- /dev/null +++ b/packages/theme/src/svgs/star-o.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/start-circle.svg b/packages/theme/src/svgs/start-circle.svg new file mode 100644 index 000000000..1fae70058 --- /dev/null +++ b/packages/theme/src/svgs/start-circle.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/start.svg b/packages/theme/src/svgs/start.svg new file mode 100644 index 000000000..9742569d6 --- /dev/null +++ b/packages/theme/src/svgs/start.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/statistics.svg b/packages/theme/src/svgs/statistics.svg new file mode 100644 index 000000000..d753ae36c --- /dev/null +++ b/packages/theme/src/svgs/statistics.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/stop.svg b/packages/theme/src/svgs/stop.svg new file mode 100644 index 000000000..82e7e9a05 --- /dev/null +++ b/packages/theme/src/svgs/stop.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/stream-solid.svg b/packages/theme/src/svgs/stream-solid.svg new file mode 100644 index 000000000..9a99cca2d --- /dev/null +++ b/packages/theme/src/svgs/stream-solid.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/success.svg b/packages/theme/src/svgs/success.svg new file mode 100644 index 000000000..fdb516515 --- /dev/null +++ b/packages/theme/src/svgs/success.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/successful.svg b/packages/theme/src/svgs/successful.svg new file mode 100644 index 000000000..ff04da21b --- /dev/null +++ b/packages/theme/src/svgs/successful.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/tablet-view.svg b/packages/theme/src/svgs/tablet-view.svg new file mode 100644 index 000000000..1981e1ed0 --- /dev/null +++ b/packages/theme/src/svgs/tablet-view.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/task-cooperation.svg b/packages/theme/src/svgs/task-cooperation.svg new file mode 100644 index 000000000..ce8de227c --- /dev/null +++ b/packages/theme/src/svgs/task-cooperation.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/telephone-circle.svg b/packages/theme/src/svgs/telephone-circle.svg new file mode 100644 index 000000000..b6e443645 --- /dev/null +++ b/packages/theme/src/svgs/telephone-circle.svg @@ -0,0 +1,28 @@ + + + + + + + + + + + diff --git a/packages/theme/src/svgs/telephone.svg b/packages/theme/src/svgs/telephone.svg new file mode 100644 index 000000000..33cf346f0 --- /dev/null +++ b/packages/theme/src/svgs/telephone.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/svgs/text-align.svg b/packages/theme/src/svgs/text-align.svg new file mode 100644 index 000000000..5c87a4e78 --- /dev/null +++ b/packages/theme/src/svgs/text-align.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/text-decoration.svg b/packages/theme/src/svgs/text-decoration.svg new file mode 100644 index 000000000..7ff57d2a0 --- /dev/null +++ b/packages/theme/src/svgs/text-decoration.svg @@ -0,0 +1,5 @@ + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/text-tab.svg b/packages/theme/src/svgs/text-tab.svg new file mode 100644 index 000000000..b4be9b857 --- /dev/null +++ b/packages/theme/src/svgs/text-tab.svg @@ -0,0 +1,10 @@ + + + + + + + + diff --git a/packages/theme/src/svgs/text.svg b/packages/theme/src/svgs/text.svg new file mode 100644 index 000000000..e67d6d320 --- /dev/null +++ b/packages/theme/src/svgs/text.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/time.svg b/packages/theme/src/svgs/time.svg new file mode 100644 index 000000000..a1f40fb51 --- /dev/null +++ b/packages/theme/src/svgs/time.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/total.svg b/packages/theme/src/svgs/total.svg new file mode 100644 index 000000000..87c809954 --- /dev/null +++ b/packages/theme/src/svgs/total.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/svgs/triangle-down.svg b/packages/theme/src/svgs/triangle-down.svg new file mode 100644 index 000000000..341cc9b8e --- /dev/null +++ b/packages/theme/src/svgs/triangle-down.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/undelete.svg b/packages/theme/src/svgs/undelete.svg new file mode 100644 index 000000000..56e4f12a0 --- /dev/null +++ b/packages/theme/src/svgs/undelete.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/underline.svg b/packages/theme/src/svgs/underline.svg new file mode 100644 index 000000000..deafd93e9 --- /dev/null +++ b/packages/theme/src/svgs/underline.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/undo.svg b/packages/theme/src/svgs/undo.svg new file mode 100644 index 000000000..df9941f54 --- /dev/null +++ b/packages/theme/src/svgs/undo.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/unfilter.svg b/packages/theme/src/svgs/unfilter.svg new file mode 100644 index 000000000..ad88271e8 --- /dev/null +++ b/packages/theme/src/svgs/unfilter.svg @@ -0,0 +1,13 @@ + + + + + + + + + + diff --git a/packages/theme/src/svgs/unfreeze.svg b/packages/theme/src/svgs/unfreeze.svg new file mode 100644 index 000000000..ae91546ce --- /dev/null +++ b/packages/theme/src/svgs/unfreeze.svg @@ -0,0 +1,39 @@ + + + + + + + + + + + diff --git a/packages/theme/src/svgs/unknow.svg b/packages/theme/src/svgs/unknow.svg new file mode 100644 index 000000000..1a4b97b44 --- /dev/null +++ b/packages/theme/src/svgs/unknow.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/unknown.svg b/packages/theme/src/svgs/unknown.svg new file mode 100644 index 000000000..1a4b97b44 --- /dev/null +++ b/packages/theme/src/svgs/unknown.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/unlock.svg b/packages/theme/src/svgs/unlock.svg new file mode 100644 index 000000000..3da63889c --- /dev/null +++ b/packages/theme/src/svgs/unlock.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/unsent.svg b/packages/theme/src/svgs/unsent.svg new file mode 100644 index 000000000..cd19bdfa7 --- /dev/null +++ b/packages/theme/src/svgs/unsent.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/up-o.svg b/packages/theme/src/svgs/up-o.svg new file mode 100644 index 000000000..8ba5932fb --- /dev/null +++ b/packages/theme/src/svgs/up-o.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/up.svg b/packages/theme/src/svgs/up.svg new file mode 100644 index 000000000..0878141a9 --- /dev/null +++ b/packages/theme/src/svgs/up.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/upload.svg b/packages/theme/src/svgs/upload.svg new file mode 100644 index 000000000..beb941b6d --- /dev/null +++ b/packages/theme/src/svgs/upload.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/user.svg b/packages/theme/src/svgs/user.svg new file mode 100644 index 000000000..c89d255ab --- /dev/null +++ b/packages/theme/src/svgs/user.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/versiontree.svg b/packages/theme/src/svgs/versiontree.svg new file mode 100644 index 000000000..71c9c766a --- /dev/null +++ b/packages/theme/src/svgs/versiontree.svg @@ -0,0 +1 @@ +defs> \ No newline at end of file diff --git a/packages/theme/src/svgs/view.svg b/packages/theme/src/svgs/view.svg new file mode 100644 index 000000000..80ec6bb2c --- /dev/null +++ b/packages/theme/src/svgs/view.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/vuejs.svg b/packages/theme/src/svgs/vuejs.svg new file mode 100644 index 000000000..9b6994332 --- /dev/null +++ b/packages/theme/src/svgs/vuejs.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/warning-triangle.svg b/packages/theme/src/svgs/warning-triangle.svg new file mode 100644 index 000000000..2b258ae7e --- /dev/null +++ b/packages/theme/src/svgs/warning-triangle.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/warning.svg b/packages/theme/src/svgs/warning.svg new file mode 100644 index 000000000..9f977d88f --- /dev/null +++ b/packages/theme/src/svgs/warning.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/web-plus.svg b/packages/theme/src/svgs/web-plus.svg new file mode 100644 index 000000000..b8172cf59 --- /dev/null +++ b/packages/theme/src/svgs/web-plus.svg @@ -0,0 +1,9 @@ + + + + + + + + diff --git a/packages/theme/src/svgs/writing.svg b/packages/theme/src/svgs/writing.svg new file mode 100644 index 000000000..cf3523bd0 --- /dev/null +++ b/packages/theme/src/svgs/writing.svg @@ -0,0 +1,24 @@ + + + + + + + + + + + + + + + diff --git a/packages/theme/src/svgs/yes.svg b/packages/theme/src/svgs/yes.svg new file mode 100644 index 000000000..167e28b00 --- /dev/null +++ b/packages/theme/src/svgs/yes.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/theme/src/svgs/zoom-in.svg b/packages/theme/src/svgs/zoom-in.svg new file mode 100644 index 000000000..92c5e5b5f --- /dev/null +++ b/packages/theme/src/svgs/zoom-in.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/svgs/zoom-out.svg b/packages/theme/src/svgs/zoom-out.svg new file mode 100644 index 000000000..fa1be860e --- /dev/null +++ b/packages/theme/src/svgs/zoom-out.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/theme/src/switch/index.js b/packages/theme/src/switch/index.js new file mode 100644 index 000000000..b15c46ec8 --- /dev/null +++ b/packages/theme/src/switch/index.js @@ -0,0 +1,29 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-switch-on-bg-color': '#1890ff', + 'tiny-switch-off-bg-color': '#bfbfbf', + 'tiny-switch-disabled-bg-color': '#d9d9d9', + 'tiny-switch-checked-disabled-bg-color': '#beccfa', + 'tiny-switch-checked-disabled-border-color': '#beccfa', + 'tiny-switch-disabled-text-color': '#bfbfbf', + 'tiny-switch-disabled-dot-bg-color': '#bfbfbf', + 'tiny-switch-text-color': '#fff', + 'tiny-switch-dot-bg-color': '#fff', + 'tiny-switch-width': '50px', + 'tiny-switch-height': '22px', + 'tiny-switch-border-radius': '24px', + 'tiny-switch-inner-font-size': '12px', + 'tiny-switch-dot-size-height-width': '16px', + 'tiny-switch-text-width': '45px' +} diff --git a/packages/theme/src/switch/index.less b/packages/theme/src/switch/index.less new file mode 100644 index 000000000..0d197d8a2 --- /dev/null +++ b/packages/theme/src/switch/index.less @@ -0,0 +1,101 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@switch-prefix-cls: ~'@{css-prefix}switch'; + +.@{switch-prefix-cls} { + .component-css-vars-switch(); + + display: inline-block; + width: var(--ti-switch-width); + height: var(--ti-switch-height); + line-height: var(--ti-switch-height); + border-radius: var(--ti-switch-border-radius); + vertical-align: middle; + border: 1px solid var(--ti-switch-off-bg-color); + background-color: var(--ti-switch-off-bg-color); + position: relative; + cursor: pointer; + outline: none; + transition: all 0.2s ease-in-out; + + & &-inner { + color: var(--ti-switch-text-color); + font-size: var(--ti-switch-inner-font-size); + position: absolute; + left: calc(var(--ti-switch-dot-position-left) + 4px); + top: -1px; + } + + &__text{ + width: var(--ti-switch-text-width); + .@{switch-prefix-cls}-inner{ + left: calc(var(--ti-switch-dot-position-left) + 9px); + } + } + + &.mini { + width: calc(var(--ti-switch-width) - 6px); + } + + &&-checked.disabled, + &.disabled { + cursor: not-allowed; + background: var(--ti-switch-disabled-bg-color); + border-color: var(--ti-switch-disabled-bg-color); + + &::after { + background: var(--ti-switch-disabled-dot-bg-color); + cursor: not-allowed; + } + + .@{switch-prefix-cls}-inner { + color: var(--ti-switch-disabled-text-color); + } + } + + &&-checked.disabled { + background: var(--ti-switch-checked-disabled-bg-color); + border-color: var(--ti-switch-checked-disabled-border-color); + } + + &::after { + content: ''; + width: var(--ti-switch-dot-size-height-width); + height: var(--ti-switch-dot-size-height-width); + border-radius: 50%; + background-color: var(--ti-switch-dot-bg-color); + position: absolute; + left: 1px; + top: 1px; + cursor: pointer; + transition: left 0.2s ease-in-out, width 0.2s ease-in-out; + } + + &&-checked { + border-color: var(--ti-switch-on-bg-color); + background-color: var(--ti-switch-on-bg-color); + + .@{switch-prefix-cls}-inner { + left: 8px; + width: calc(100% - var(--ti-switch-dot-size-height-width)); + overflow: hidden; + } + + &:after { + left: calc(100% - var(--ti-switch-dot-offset)); + } + } +} diff --git a/packages/theme/src/switch/vars.less b/packages/theme/src/switch/vars.less new file mode 100644 index 000000000..62b1ff3dc --- /dev/null +++ b/packages/theme/src/switch/vars.less @@ -0,0 +1,31 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-switch() { + --ti-switch-on-bg-color: var(--ti-base-color-brand-6); + --ti-switch-off-bg-color: var(--ti-base-color-common-2); + --ti-switch-disabled-bg-color: var(--ti-base-color-common-1); + --ti-switch-checked-disabled-bg-color: var(--ti-base-color-brand-3); + --ti-switch-checked-disabled-border-color: var(--ti-base-color-brand-3); + --ti-switch-disabled-text-color: var(--ti-base-color-bg-5); + --ti-switch-disabled-dot-bg-color: var(--ti-base-color-bg-5); + --ti-switch-text-color: var(--ti-base-color-light); + --ti-switch-dot-bg-color: var(--ti-base-color-light); + --ti-switch-width: 38px; + --ti-switch-height: 20px; + --ti-switch-border-radius: 24px; + --ti-switch-inner-font-size: var(--ti-common-font-size-base, 12px); + --ti-switch-dot-size-height-width: 16px; + --ti-switch-dot-position-left: 16px; + --ti-switch-dot-offset: calc(var(--ti-switch-dot-size-height-width) + 1px); + --ti-switch-text-width: 45px; +} diff --git a/packages/theme/src/table/index.js b/packages/theme/src/table/index.js new file mode 100644 index 000000000..a85c9ba7f --- /dev/null +++ b/packages/theme/src/table/index.js @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-table-text-color': '#333', + 'tiny-table-bg-color': '#fafafa', + 'tiny-table-odd-bg-color': '#fff', + 'tiny-table-hover-bg-color': '#e6f7ff', + 'tiny-table-disabled-text-color': '#999', + 'tiny-table-disabled-bg-color': '#f5f5f5', + 'tiny-table-nodata-text-color': '#909399', + 'tiny-table-td-height': '36px', + 'tiny-table-td-font-size': '12px', + 'tiny-table-border-color': '#d9d9d9', + 'tiny-table-thead-bg-color': '#f1f1f1', + 'tiny-table-icon-font-size': '16px', + 'tiny-table-check-icon-color': '#1890ff' +} diff --git a/packages/theme/src/table/index.less b/packages/theme/src/table/index.less new file mode 100644 index 000000000..d8caa4f0d --- /dev/null +++ b/packages/theme/src/table/index.less @@ -0,0 +1,129 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@table-prefix-cls: ~'@{css-prefix}table'; +@table-header-prefix-cls: ~'@{css-prefix}table-header'; +@table-cell-prefix-cls: ~'@{css-prefix}table-cell'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{table-prefix-cls} { + .component-css-vars-table(); + + &.simple { + table { + table-layout: fixed; + + tr { + display: table-row; + vertical-align: inherit; + border-color: inherit; + } + + tbody { + border-bottom: 1px solid var(--ti-table-border-color); + + tr { + color: var(--ti-table-text-color); + background: var(--ti-table-bg-color); + + &:nth-child(odd) { + background: var(--ti-table-odd-bg-color); + } + + &:hover { + background: var(--ti-table-hover-bg-color); + } + + &.is-disabled { + background: var(--ti-table-disabled-bg-color); + color: var(--ti-table-disabled-text-color); + } + } + + .noData { + width: 582px; + height: 360px; + text-align: center; + color: var(--ti-table-nodata-text-color); + margin-bottom: -1px; + border-bottom: 1px solid var(--ti-table-border-color); + padding-top: 10px; + display: flex; + justify-content: center; + align-items: center; + } + } + + th { + padding: 2px 0 2px 8px; + height: var(--ti-table-td-height); + border-left: none; + } + + td { + padding: 2px 0 2px 8px; + height: var(--ti-table-td-height); + font-size: var(--ti-table-td-font-size); + + .overflow { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + } + + thead { + border-bottom: 1px solid var(--ti-table-border-color); + text-align: left; + background: var(--ti-table-thead-bg-color); + color: var(--ti-table-text-color); + + th { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + text-align: left; + font-size: var(--ti-table-td-font-size); + color: var(--ti-table-text-color); + line-height: 1.7em; + + .overflow { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + } + } + } + + .@{table-header-prefix-cls}__line { + float: right; + border-left: 1px solid var(--ti-table-border-color); + height: 20px; + } + + .@{table-cell-prefix-cls} { + .@{svg-prefix-cls} { + font-size: var(--ti-common-font-size-2); + font-size: var(--ti-table-icon-font-size); + fill: var(--ti-table-border-color); + + &.is-check { + fill: var(--ti-table-check-icon-color); + } + } + } + } +} diff --git a/packages/theme/src/table/vars.less b/packages/theme/src/table/vars.less new file mode 100644 index 000000000..6e0b52d69 --- /dev/null +++ b/packages/theme/src/table/vars.less @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-table() { + --ti-table-text-color: var(--ti-base-color-info-normal); + --ti-table-bg-color: #fafafa; + --ti-table-odd-bg-color: var(--ti-base-color-light); + --ti-table-hover-bg-color: var(--ti-base-color-hover-background); + --ti-table-disabled-text-color: var(--ti-base-color-placeholder); + --ti-table-disabled-bg-color: #f1f1f1; + --ti-table-nodata-text-color: #909399; + --ti-table-td-height: var(--ti-base-size-height-medium); + --ti-table-td-font-size: var(--ti-common-font-size-base); + --ti-table-border-color: var(--ti-base-color-border); + --ti-table-thead-bg-color: var(--ti-base-color-brand-1); + --ti-table-icon-font-size: var(--ti-common-font-size-2); + --ti-table-check-icon-color: var(--ti-base-color-brand-6); +} diff --git a/packages/theme/src/tabs/index.js b/packages/theme/src/tabs/index.js new file mode 100644 index 000000000..0d9587a9e --- /dev/null +++ b/packages/theme/src/tabs/index.js @@ -0,0 +1,60 @@ +/** +* Copyright (c 2022 - present TinyVue Authors. +* Copyright (c 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-tabs-header-font-normal-text-color': '#333333', + 'tiny-tabs-header-font-active-border-color': '#1890ff', + 'tiny-tabs-header-text-color': '#1890ff', + 'tiny-tabs-header-bg-color': '#f5f5f5', + 'tiny-tabs-border-color': '#d9d9d9', + 'tiny-tabs-height': '40px', + 'tiny-tabs-item-disabled-text-color': '#b4bccc', + 'tiny-tabs-icon-close-hover-bg-color': '#fff', + 'tiny-tabs-new-height': '18px', + 'tiny-tabs-new-width': '18px', + 'tiny-tabs-new-border-radius': '3px', + 'tiny-tabs-new-svg-text-color': '#999', + 'tiny-tabs-font-size-base': '12px', + 'tiny-tabs-more-hover-text-color': '#40a9ff', + 'tiny-tabs-more-item-hover-bg-color': '#e6f7ff', + 'tiny-tabs-dropdown-font-size': '14px', + 'tiny-tabs-dropdown-bg-color': '#fff', + 'tiny-tabs-dropdown-border-radius': '2px', + 'tiny-tabs-dropdown-li-text-color': '#666', + 'tiny-tabs-dropdown-li-border-color': '#e6e6e6', + 'tiny-tabs-small-height': '36px', + 'tiny-tab-dark-border-radius': '2px 2px 0 0', + 'tiny-tab-dark-text-color-active': '#252b3a', + 'tiny-tab-dark-bg-color-active': '#eef0f5', + 'tiny-tab-dark-text-color-hover': '#fff', + 'tiny-tab-dark-bg-color-hover': '#5c6173', + 'tiny-tab-dark-text-color': '#adb0b8', + 'tiny-tabs-header-dark-bg-color': '#464c59', + 'tiny-tabs-item-margin-right': '40px', + 'tiny-tabs-item-padding-horizontal': '12px', + 'tiny-tabs-item-vertical-padding-horizontal': '20px', + 'tiny-tabs-item-active-border-weight': '3px', + 'tiny-tabs-item-active-border-style': 'solid', + 'tiny-tabs-item-active-border-color': '#1890ff', + 'tiny-tabs-item-bottom-border-weight': '1px', + 'tiny-tabs-item-bottom-border-style': 'solid', + 'tiny-tabs-item-bottom-border-color': '#fff', + 'tiny-tabs-item-card-active-bg-color': '#fff', + 'tiny-tabs-item-card-border-radius': '0', + 'tiny-tabs-icon-close-default-bg-color': 'transparent', + 'tiny-tabs-icon-close-default-text-color': '#333333', + 'tiny-tabs-icon-close-hover-text-color': '#1890ff', + 'tiny-tabs-icon-size-close': '14px', + 'tiny-tabs-icon-close-margin-vertical': '0', + 'tiny-tabs-icon-close-margin-right': '0', + 'tiny-tabs-icon-close-margin-left': '5px' +} diff --git a/packages/theme/src/tabs/index.less b/packages/theme/src/tabs/index.less new file mode 100644 index 000000000..be01e7951 --- /dev/null +++ b/packages/theme/src/tabs/index.less @@ -0,0 +1,1278 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@tabs-prefix-cls: ~'@{css-prefix}tabs'; +@tab-pane-prefix-cls: ~'@{css-prefix}tab-pane'; +@popover-prefix-cls: ~'@{css-prefix}popover'; +@popper-prefix-cls: ~'@{css-prefix}popper'; + +.@{tabs-prefix-cls} { + .component-css-vars-tabs(); + + &--left, + &--right, + &__content, + &__nav-scroll, + &__nav-wrap { + overflow: hidden; + } + + &__header { + padding: 0; + position: relative; + margin: 0; + + .@{tabs-prefix-cls}__active-bar { + position: absolute; + bottom: 0; + left: 0; + height: 2px; + background-color: var(--ti-tabs-header-text-color); + z-index: 1; + transition: transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); + list-style: none; + } + + .@{tabs-prefix-cls}__new-tab { + float: right; + border: 1px solid var(--ti-tabs-border-color); + height: var(--ti-tabs-new-height); + line-height: var(--ti-tabs-new-height); + width: var(--ti-tabs-new-width); + margin: 12px 0 9px 10px; + border-radius: var(--ti-tabs-new-border-radius); + font-size: var(--ti-tabs-font-size-base); + display: inline-flex; + justify-content: center; + align-items: center; + cursor: pointer; + transition: all 0.15s; + outline: none; + + svg { + fill: var(--ti-tabs-new-svg-text-color); + } + + &:hover svg { + fill: var(--ti-tabs-header-text-color); + } + } + + .@{tabs-prefix-cls}__nav-wrap { + margin-bottom: -1px; + position: relative; + + &::after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + width: 100%; + height: 1px; + background-color: var(--ti-tabs-border-color); + z-index: 1; + } + + &.is-scrollable { + padding: 0 20px; + box-sizing: border-box; + } + } + + .tab-dropdown { + position: absolute; + right: 8px; + z-index: 90; + font-size: var(--ti-tabs-dropdown-font-size); + box-shadow: 0 1px 2px 1px rgba(0, 0, 0, 0.18); + background: var(--ti-tabs-dropdown-bg-color); + border-radius: var(--ti-tabs-dropdown-border-radius); + + &:before { + position: absolute; + display: inline-block; + top: -5px; + left: 44%; + width: 0; + height: 0px; + content: ''; + border-style: solid; + border-width: 6px; + border-color: #fff #fff transparent transparent; + transform: rotate(-45deg); + box-shadow: 1px -1px 1px #e4e4e4; + } + + li { + border-bottom: 1px solid var(--ti-tabs-dropdown-li-border-color); + } + + li:last-child { + border-bottom: none; + } + + li a { + white-space: nowrap; + color: var(--ti-tabs-dropdown-li-text-color); + line-height: 26px; + padding: 0 10px; + min-width: 100px; + display: block; + font-size: var(--ti-tabs-font-size-base); + } + + li a:hover { + color: var(--ti-tabs-more-hover-text-color); + text-decoration: none; + } + } + } + + &__nav-more { + position: absolute; + cursor: pointer; + height: var(--ti-tabs-height); + line-height: var(--ti-tabs-height); + font-size: var(--ti-common-font-size-1); + right: 45px; + z-index: 99; + color: var(--ti-tabs-header-text-color); + } + + &__nav-next, + &__nav-prev { + position: absolute; + cursor: pointer; + line-height: var(--ti-tabs-height); + font-size: var(--ti-common-font-size-base); + color: var(--ti-tabs-header-font-normal-text-color); + } + + &__nav-next { + right: 0; + } + + &__nav-prev { + left: 0; + } + + &__nav:not(.is-stretch) { + .@{tabs-prefix-cls}__item__title { + display: inline-block; + white-space: nowrap; + width: 100%; + overflow: hidden; + text-overflow: ellipsis; + } + } + + &__nav { + white-space: nowrap; + position: relative; + transition: transform 0.3s; + float: left; + z-index: 2; + + &.is-stretch { + min-width: 100%; + display: flex; + + & > * { + flex-grow: 1; + text-align: center; + } + } + &.is-show-active-bar .@{tabs-prefix-cls}__item { + margin-right: var(--ti-tabs-item-margin-right); + &.is-active { + border-bottom: var(--ti-tabs-item-active-border-weight) var(--ti-tabs-item-active-border-style) var(--ti-tabs-item-active-border-color); + } + } + } + + &__item { + height: var(--ti-tabs-height); + box-sizing: border-box; + line-height: var(--ti-tabs-height); + display: inline-block; + list-style: none; + font-size: var(--ti-tabs-dropdown-font-size); + color: var(--ti-tabs-header-font-normal-text-color); + display: inline-flex; + justify-content: center; + align-items: center; + position: relative; + + &:focus, + &:active { + outline: 0; + } + + &:hover, + &.is-active { + color: var(--ti-tabs-header-font-active-border-color); + cursor: pointer; + + .@{tabs-prefix-cls}__icon-close svg { + fill: var(--ti-tabs-icon-close-hover-text-color); + } + } + + &.is-disabled { + color: var(--ti-tabs-item-disabled-text-color); + cursor: default; + + .@{tabs-prefix-cls}__icon-close { + &, + &:hover { + background-color: transparent; + + svg { + fill: var(--ti-tabs-item-disabled-text-color); + } + } + } + } + + &.is-closable { + // 修复自定义标签配置:with-close="true"样式错乱问题 + > div { + display: inline-block; + } + } + & > div { + display: flex; + align-items: center; + } + + .@{tabs-prefix-cls}__icon-close { + border-radius: 50%; + text-align: center; + transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); + margin: var(--ti-tabs-icon-close-margin-vertical) var(--ti-tabs-icon-close-margin-right) var(--ti-tabs-icon-close-margin-vertical) + var(--ti-tabs-icon-close-margin-left); + display: inline-flex; + justify-content: center; + align-items: center; + vertical-align: middle; + background-color: var(--ti-tabs-icon-close-default-bg-color); + + svg { + font-size: var(--ti-tabs-font-size-base); + transform: scale(0.9); + vertical-align: middle; + fill: var(--ti-tabs-icon-close-default-text-color); + } + + &:hover { + background-color: var(--ti-tabs-icon-close-hover-bg-color); + + svg { + fill: var(--ti-tabs-icon-close-hover-text-color); + } + } + } + } + + &__content { + position: relative; + padding: 15px 24px; + } + + .is-show-more { + padding: 0 48px 0 0; + } + + &__more-container { + position: absolute; + right: 0px; + font-size: var(--ti-tabs-font-size-base); + color: var(--ti-tabs-header-font-normal-text-color); + line-height: var(--ti-tabs-height); + } + + &__more { + cursor: pointer; + color: var(--ti-tabs-header-text-color); + font-size: var(--ti-tabs-dropdown-font-size); + outline: 0; + + &:hover { + color: var(--ti-tabs-more-hover-text-color); + } + } + + &__more-popover { + &.@{popover-prefix-cls}.@{popper-prefix-cls} { + padding: 0; + border-radius: var(--ti-tabs-dropdown-border-radius); + box-shadow: 0 0 4px rgba(0, 0, 0, 0.15); + } + } + + &__more-popover &__more-item { + cursor: pointer; + padding: 8px 12px; + outline: 0; + + &:hover { + background: var(--ti-tabs-more-item-hover-bg-color); + } + } + + // 一层tab页签 + &&--card { + &.@{tabs-prefix-cls}--left .@{tabs-prefix-cls}__nav, + &.@{tabs-prefix-cls}--right .@{tabs-prefix-cls}__nav { + width: 120px; + } + + &.@{tabs-prefix-cls}--top { + & > .@{tabs-prefix-cls}__header .@{tabs-prefix-cls}__item { + &.is-active { + top: -1px; + border-bottom: var(--ti-tabs-item-bottom-border-weight) var(--ti-tabs-item-bottom-border-style) var(--ti-tabs-item-bottom-border-color); + border-top: 1px solid var(--ti-tabs-border-color); + border-left: 1px solid var(--ti-tabs-border-color); + border-right: 1px solid var(--ti-tabs-border-color); + background-color: var(--ti-tabs-item-card-active-bg-color); + border-radius: var(--ti-tabs-item-card-border-radius); + + &:before { + left: 0; + top: 0; + } + + &.is-closable { + padding: 0 var(--ti-tabs-item-padding-horizontal); + } + } + } + } + + &.@{tabs-prefix-cls}--bottom { + & > .@{tabs-prefix-cls}__header .@{tabs-prefix-cls}__item { + &.is-active { + box-shadow: 0 -2px 0 0 #fff; + + &:before { + left: 0; + bottom: 0; + } + + &.is-closable { + padding: 0 var(--ti-tabs-item-padding-horizontal); + } + } + } + } + + & > .@{tabs-prefix-cls}__header { + border-bottom: 1px solid var(--ti-tabs-border-color); + + .@{tabs-prefix-cls}__item { + border-bottom: 1px solid transparent; + border-left: 1px solid transparent; + border-right: 1px solid transparent; + border-top: 1px solid transparent; + transition: color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); + + &:first-child { + border-left: none; + } + } + + .@{tabs-prefix-cls}__nav { + border-bottom: none; + top: 1px; + } + } + } + + // 二层tab页签 + &&--border-card { + background: #fff; + border-top: 1px solid var(--ti-tabs-border-color); + box-shadow: none; + + & > .@{tabs-prefix-cls}__content { + padding: 0px 24px 15px; + + .@{tabs-prefix-cls}__content { + padding: 15px 0; + } + } + + &.@{tabs-prefix-cls}--top { + & > .@{tabs-prefix-cls}__header { + background-color: var(--ti-tabs-header-dark-bg-color); + + border: none; + margin: 0; + + .@{tabs-prefix-cls}__item { + transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); + margin: -1px -1px 0; + color: var(--ti-tab-dark-text-color); + padding: 0 24px; + border: none; + height: 37px; + margin: 5px 4px 0 0; + line-height: 37px; + + &:nth-child(2) { + padding: 0 12px; + } + + &.is-active { + color: var(--ti-tab-dark-text-color-active); + background-color: var(--ti-tab-dark-bg-color-active); + border: none; + border-bottom-color: #fff; + border-radius: var(--ti-tab-dark-border-radius); + + &:before { + left: 0; + top: 0; + } + + &.is-closable { + padding: 0 var(--ti-tabs-item-padding-horizontal); + } + } + + &:not(.is-active) { + &:hover { + color: var(--ti-tab-dark-text-color-hover); + background: var(--ti-tab-dark-bg-color-hover); + } + } + + &:first-child { + margin-left: 20px; + } + } + + .@{tabs-prefix-cls}__nav-prev, + .@{tabs-prefix-cls}__nav-next { + fill: var(--ti-common-color-icon-white); + } + } + } + + .@{tabs-prefix-cls}--border-card { + .@{tabs-prefix-cls}--bottom { + border-top: 0; + } + } + } + + // 一、二层页签公类 + &&--card, + &&--border-card { + &.@{tabs-prefix-cls}--top, + &.@{tabs-prefix-cls}--bottom { + & > .@{tabs-prefix-cls}__header .@{tabs-prefix-cls}__item { + &.is-active:before { + position: absolute; + content: ''; + width: 100%; + height: 0; + background: var(--ti-tabs-header-text-color); + } + + .@{tabs-prefix-cls}__icon-close { + display: inline-flex; + justify-content: center; + align-items: center; + width: var(--ti-tabs-icon-size-close); + height: var(--ti-tabs-icon-size-close); + line-height: var(--ti-tabs-icon-size-close); + vertical-align: middle; + overflow: hidden; + transform-origin: 100% 50%; + } + } + + .is-scrollable { + padding: 0 24px; + } + } + + & > .@{tabs-prefix-cls}__header { + .@{tabs-prefix-cls}__nav-wrap:after { + content: none; + } + } + } + + // 小尺寸 + &&--small { + .@{tabs-prefix-cls}__item { + height: var(--ti-tabs-small-height); + line-height: var(--ti-tabs-small-height); + } + } + + // 竖排tab页签 + &&--left { + .@{tabs-prefix-cls}__header { + float: left; + margin-bottom: 0; + margin-right: 10px; + } + + .@{tabs-prefix-cls}__nav-wrap { + margin-right: -1px; + } + + .@{tabs-prefix-cls}__item { + text-align: left; + } + + &.@{tabs-prefix-cls}--card { + .@{tabs-prefix-cls}__item { + padding: 0 var(--ti-tabs-item-vertical-padding-horizontal); + } + + > .@{tabs-prefix-cls}__header { + .@{tabs-prefix-cls}__item { + border-left: 1px solid var(--ti-tabs-border-color); + border-right: 1px solid var(--ti-tabs-border-color); + border-top: 1px solid var(--ti-tabs-border-color); + background-color: var(--ti-tabs-header-bg-color); + + &:first-child { + border-top: none; + } + + &.is-active { + border-right-color: transparent; + border-left: var(--ti-tabs-item-active-border-weight) var(--ti-tabs-item-active-border-style) var(--ti-tabs-item-active-border-color); + border-bottom: none; + background: transparent; + + &:first-child { + border-top: none; + border-right-color: transparent; + } + + &:last-child { + border-bottom: none; + } + } + } + + .@{tabs-prefix-cls}__nav { + border-right: none; + border-left: none; + } + + .@{tabs-prefix-cls}__new-tab { + float: none; + } + } + } + + &.@{tabs-prefix-cls}--border-card { + .@{tabs-prefix-cls}__header { + border-right: 1px solid var(--ti-tabs-border-color); + } + + .@{tabs-prefix-cls}__item { + border: 1px solid transparent; + margin: -1px -1px -1px 0; + + &.is-active { + border: 1px solid var(--ti-tabs-border-color); + border-left: none; + } + } + + .@{tabs-prefix-cls}--border-card { + .@{tabs-prefix-cls}__item { + margin: -1px; + &.is-bottom { + &.is-active { + border-left: 1px solid var(--ti-tabs-border-color); + } + } + } + } + } + + .@{tabs-prefix-cls}__active-bar, + .@{tabs-prefix-cls}__nav-wrap::after { + right: auto; + left: 0; + } + } + + &&--right { + .@{tabs-prefix-cls}__nav-scroll { + height: 100%; + } + + .@{tabs-prefix-cls}__header { + float: right; + margin-bottom: 0; + margin-left: 10px; + &.is-left { + margin-left: 0; + } + } + + .@{tabs-prefix-cls}__nav-wrap { + margin-left: -1px; + &.is-left { + margin-left: 0; + } + + &:after { + left: 0; + right: auto; + } + } + + &.@{tabs-prefix-cls}--card { + .@{tabs-prefix-cls}__item { + border-top: 1px solid var(--ti-tabs-border-color); + border-bottom: none; + background-color: var(--ti-tabs-header-bg-color); + padding: 0 var(--ti-tabs-item-vertical-padding-horizontal); + + &.is-active { + border-left-color: transparent; + border-right: var(--ti-tabs-item-active-border-weight) var(--ti-tabs-item-active-border-style) var(--ti-tabs-item-active-border-color); + background: transparent; + + &:first-child { + border-left: none; + } + + &:last-child { + border-bottom: none; + } + + &.is-bottom { + border-top: 0; + border-right: 0; + border-left-color: var(--ti-tabs-border-color); + &:first-child { + border-left: 1px solid var(--ti-tabs-border-color); + } + } + } + + &:first-child { + border-left: 1px solid var(--ti-tabs-border-color); + border-top: none; + } + + &.is-bottom { + &:first-child { + border-top: 1px solid var(--ti-tabs-border-color); + } + &.is-active:first-child { + border-top: none; + } + } + + &.is-top, + &.is-bottom { + background: transparent; + } + } + + .@{tabs-prefix-cls}__nav { + border-bottom: 1px solid var(--ti-tabs-border-color); + border-left: none; + &.is-bottom { + border-top: none; + } + } + + .@{tab-pane-prefix-cls} .@{tabs-prefix-cls}--top { + .@{tabs-prefix-cls}__header { + margin-left: 0; + } + + .@{tabs-prefix-cls}__item { + border-top: none; + border-bottom: 1px solid var(--ti-tabs-border-color); + + &.is-active { + top: 0; + border-right: 0; + border-left-color: var(--ti-tabs-border-color); + border-bottom: 1px solid #fff; + + &:first-child { + border-left: 1px solid var(--ti-tabs-border-color); + } + } + } + } + + .@{tabs-prefix-cls}--border-card { + .@{tabs-prefix-cls}__item { + &.is-top { + margin: 0 0 -1px -1px; + &.is-active { + border-right: 1px solid var(--ti-tabs-border-color); + } + } + + &.is-bottom { + margin: -1px; + &.is-active { + border-right: 1px solid var(--ti-tabs-border-color); + } + } + + &.is-right { + margin: -1px 0 -1px 0; + &.is-active { + border-top: 1px solid var(--ti-tabs-border-color); + border-bottom: 1px solid var(--ti-tabs-border-color); + border-right: 3px solid var(--ti-tabs-header-font-active-border-color); + } + } + } + .@{tabs-prefix-cls}__nav { + &.is-bottom { + border-bottom: 0; + } + } + } + } + + &.@{tabs-prefix-cls}--border-card { + .@{tabs-prefix-cls}__header { + border-left: 1px solid var(--ti-tabs-border-color); + } + + .@{tabs-prefix-cls}__item { + border: 1px solid transparent; + margin: -1px -1px -1px 0; + + &.is-active { + border-color: var(--ti-tabs-border-color) transparent; + } + } + } + + &:not(.@{tabs-prefix-cls}--card) { + .@{tabs-prefix-cls}__active-bar { + left: auto; + right: 0; + &.is-bottom { + left: 0; + } + &.is-left { + left: 0; + right: auto; + } + } + + .@{tabs-prefix-cls}__nav-wrap { + &::after { + left: auto; + right: 0; + } + &.is-left::after { + left: 0; + right: auto; + } + } + } + + .@{tab-pane-prefix-cls} { + .@{tabs-prefix-cls}__header { + &.is-bottom { + margin-left: 0; + } + } + + .@{tabs-prefix-cls}--top:not(.@{tabs-prefix-cls}--card):not(.@{tabs-prefix-cls}--border-card) .@{tabs-prefix-cls}__item { + border-bottom: 0; + background-color: transparent; + } + } + + .@{tabs-prefix-cls}--bottom:not(.@{tabs-prefix-cls}--card) .@{tabs-prefix-cls}__item { + border-top: 0; + background-color: transparent; + } + + .@{tabs-prefix-cls}--left.@{tabs-prefix-cls}--card .@{tabs-prefix-cls}__item { + &.is-active:first-child { + border-left: 3px solid var(--ti-tabs-header-font-active-border-color); + border-right: 0; + } + } + + .@{tabs-prefix-cls}--left, + .@{tabs-prefix-cls}--right { + &:not(.@{tabs-prefix-cls}--card) { + .@{tabs-prefix-cls}__nav { + border-bottom: 0; + } + + .@{tabs-prefix-cls}__item { + border: 0; + background-color: transparent; + } + } + } + + .@{tabs-prefix-cls}--left { + &.@{tabs-prefix-cls}--border-card { + .@{tabs-prefix-cls}__item.is-active { + border: 1px solid var(--ti-tabs-border-color); + &.is-left { + border-left: 3px solid var(--ti-tabs-header-font-active-border-color); + } + } + } + } + } + + &&--left, + &&--right { + .@{tabs-prefix-cls}__header, + .@{tabs-prefix-cls}__nav-wrap { + height: 100%; + } + + .@{tabs-prefix-cls}__active-bar { + top: 1px; + bottom: auto; + width: 2px; + height: auto; + &.is-top { + height: 3px; + bottom: 0; + left: 0; + top: auto; + } + &.is-bottom { + top: auto; + bottom: 0; + height: 3px; + } + } + + .@{tabs-prefix-cls}__nav-wrap { + margin-bottom: 0; + + &.is-scrollable { + padding: 30px 0; + } + + &::after { + height: 100%; + width: 2px; + bottom: auto; + top: 0; + } + + &.is-top::after { + left: 0; + bottom: 0; + top: auto; + width: 100%; + height: 1px; + } + + &.is-bottom:after { + left: 0; + bottom: 0; + top: auto; + width: 100%; + height: 1px; + background-color: #d9d9d9; + z-index: 1; + } + } + + .@{tabs-prefix-cls}__nav { + float: none; + } + + .@{tabs-prefix-cls}__item { + display: block; + font-size: var(--ti-tabs-font-size-base); + } + + .@{tabs-prefix-cls}__nav-next, + .@{tabs-prefix-cls}__nav-prev { + height: 30px; + line-height: 30px; + width: 100%; + text-align: center; + cursor: pointer; + + i { + -webkit-transform: rotateZ(90deg); + transform: rotateZ(90deg); + } + } + + .@{tabs-prefix-cls}__nav-prev { + left: auto; + top: 0; + } + + .@{tabs-prefix-cls}__nav-next { + right: auto; + bottom: 0; + } + + .@{tab-pane-prefix-cls} { + .@{tabs-prefix-cls}__header, + .@{tabs-prefix-cls}__nav-wrap { + float: inherit; + margin-bottom: -1px; + &.is-top, + &.is-bottom { + float: none; + margin-right: 0; + } + + &.is-left { + float: left; + margin-bottom: 0; + } + + &.is-right { + float: right; + margin-bottom: 0; + margin-right: 0; + } + } + + .@{tabs-prefix-cls}__item { + display: inline-block; + &.is-left, + &.is-right { + display: inherit; + } + } + + .@{tabs-prefix-cls}__nav { + width: fit-content; + } + } + + &.@{tabs-prefix-cls}--border-card { + border-top: 0; + .@{tabs-prefix-cls}__nav-wrap { + &.is-scrollable { + padding: 0; + } + } + .@{tabs-prefix-cls}__nav-prev, + .@{tabs-prefix-cls}__nav-next { + display: none; + } + .@{tabs-prefix-cls}__header { + border: 1px solid var(--ti-tabs-border-color); + } + + .@{tabs-prefix-cls}--border-card { + .is-top { + &.@{tabs-prefix-cls}__header { + border-top: 0; + border-left: 0; + } + + &.tiny-tabs__item.is-active { + border-left: 1px solid var(--ti-tabs-border-color); + } + } + + .is-bottom { + &.@{tabs-prefix-cls}__header { + border-left: 0; + } + } + } + } + } + + &&--bottom { + .@{tabs-prefix-cls}__header { + margin-bottom: 0; + margin-top: 10px; + } + + &.@{tabs-prefix-cls}--border-card { + border-top: 0; + .@{tabs-prefix-cls}__header { + background: var(--ti-tabs-header-bg-color); + border-bottom: 1px solid var(--ti-tabs-border-color); + border-right: 1px solid var(--ti-tabs-border-color); + border-top: 1px solid var(--ti-tabs-border-color); + } + + .@{tabs-prefix-cls}__nav-wrap { + margin-top: -1px; + margin-bottom: 0; + &.is-top { + margin-bottom: -1px; + } + } + + .@{tabs-prefix-cls}__item { + border: 1px solid transparent; + margin: 0 -1px -1px; + &.is-active { + background-color: var(--ti-tabs-dropdown-bg-color); + border-right-color: var(--ti-tabs-border-color); + border-left-color: var(--ti-tabs-border-color); + &:before { + left: 0; + bottom: 0; + } + } + } + + .@{tabs-prefix-cls}--border-card { + border-top: 0; + } + } + + .@{tabs-prefix-cls}:not(.@{tabs-prefix-cls}--border-card):not(.@{tabs-prefix-cls}--card) { + .@{tabs-prefix-cls}__header { + background: transparent; + border: 0; + &.is-left, + &.is-right { + .@{tabs-prefix-cls}__nav-prev, + .@{tabs-prefix-cls}__nav-next { + display: none; + } + .@{tabs-prefix-cls}__nav-wrap { + padding: 0; + } + } + } + + .@{tabs-prefix-cls}__item.is-active { + background-color: transparent; + border: none; + } + } + } + + &&--top, + &&--bottom { + .@{tabs-prefix-cls}--left .@{tabs-prefix-cls}__item:nth-child(2), + .@{tabs-prefix-cls}--right .@{tabs-prefix-cls}__item:nth-child(2), + &.@{tabs-prefix-cls}--border-card .@{tabs-prefix-cls}__item:nth-child(2), + &.@{tabs-prefix-cls}--card .@{tabs-prefix-cls}__item { + padding: 0 var(--ti-tabs-item-padding-horizontal); + } + + &:not(.@{tabs-prefix-cls}--card):not(.@{tabs-prefix-cls}--border-card) .@{tabs-prefix-cls}__item { + padding-left: 0; + + &.is-left { + padding: 0 24px; + } + + &:nth-child(2) { + padding-left: 0; + } + } + } + + // 动效 + .slideInLeft-transition, + .slideInRight-transition { + display: inline-block; + } + + .slideInRight-enter { + -webkit-animation: slideInRight-enter 0.3s; + animation: slideInRight-enter 0.3s; + } + + .slideInRight-leave { + position: absolute; + left: 0; + right: 0; + -webkit-animation: slideInRight-leave 0.3s; + animation: slideInRight-leave 0.3s; + } + + .slideInLeft-enter { + -webkit-animation: slideInLeft-enter 0.3s; + animation: slideInLeft-enter 0.3s; + } + + .slideInLeft-leave { + position: absolute; + left: 0; + right: 0; + -webkit-animation: slideInLeft-leave 0.3s; + animation: slideInLeft-leave 0.3s; + } + + @-webkit-keyframes slideInRight-enter { + 0% { + opacity: 0; + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(100%); + transform: translateX(100%); + } + + to { + opacity: 1; + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(0); + transform: translateX(0); + } + } + + @keyframes slideInRight-enter { + 0% { + opacity: 0; + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(100%); + transform: translateX(100%); + } + + to { + opacity: 1; + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(0); + transform: translateX(0); + } + } + + @-webkit-keyframes slideInRight-leave { + 0% { + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(0); + transform: translateX(0); + opacity: 1; + } + + 100% { + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(100%); + transform: translateX(100%); + opacity: 0; + } + } + + @keyframes slideInRight-leave { + 0% { + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(0); + transform: translateX(0); + opacity: 1; + } + + 100% { + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(100%); + transform: translateX(100%); + opacity: 0; + } + } + + @-webkit-keyframes slideInLeft-enter { + 0% { + opacity: 0; + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(-100%); + transform: translateX(-100%); + } + + to { + opacity: 1; + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(0); + transform: translateX(0); + } + } + + @keyframes slideInLeft-enter { + 0% { + opacity: 0; + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(-100%); + transform: translateX(-100%); + } + + to { + opacity: 1; + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(0); + transform: translateX(0); + } + } + + @-webkit-keyframes slideInLeft-leave { + 0% { + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(0); + transform: translateX(0); + opacity: 1; + } + + 100% { + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(-100%); + transform: translateX(-100%); + opacity: 0; + } + } + + @keyframes slideInLeft-leave { + 0% { + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(0); + transform: translateX(0); + opacity: 1; + } + + 100% { + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(-100%); + transform: translateX(-100%); + opacity: 0; + } + } +} diff --git a/packages/theme/src/tabs/vars.less b/packages/theme/src/tabs/vars.less new file mode 100644 index 000000000..12d2c7774 --- /dev/null +++ b/packages/theme/src/tabs/vars.less @@ -0,0 +1,60 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-tabs() { + --ti-tabs-header-font-normal-text-color: var(--ti-base-color-common-5); + --ti-tabs-header-font-active-border-color: var(--ti-base-color-brand-6); + --ti-tabs-header-text-color: var(--ti-base-color-brand-6); + --ti-tabs-header-bg-color: #f5f5f5; + --ti-tabs-border-color: var(--ti-common-color-line-dividing); + --ti-tabs-height: var(--ti-common-size-10x); + --ti-tabs-item-disabled-text-color: #b4bccc; + --ti-tabs-icon-close-hover-bg-color: var(--ti-base-color-light); + --ti-tabs-new-height: 18px; + --ti-tabs-new-width: 18px; + --ti-tabs-new-border-radius: var(--ti-base-radius-large); + --ti-tabs-new-svg-text-color: var(--ti-base-color-placeholder); + --ti-tabs-font-size-base: var(--ti-common-font-size-base); + --ti-tabs-more-hover-text-color: var(--ti-base-color-brand-5); + --ti-tabs-more-item-hover-bg-color: var(--ti-base-color-hover-background); + --ti-tabs-dropdown-font-size: var(--ti-common-font-size-1); + --ti-tabs-dropdown-bg-color: var(--ti-base-color-light); + --ti-tabs-dropdown-border-radius: var(--ti-common-border-radius-normal); + --ti-tabs-dropdown-li-text-color: var(--ti-base-color-secondary); + --ti-tabs-dropdown-li-border-color: #e6e6e6; + --ti-tabs-small-height: var(--ti-common-size-9x); + --ti-tab-dark-border-radius: var(--ti-common-border-radius-normal) var(--ti-common-border-radius-normal) 0 0; + --ti-tab-dark-text-color-active: var(--ti-base-color-common-7); + --ti-tab-dark-bg-color-active: var(--ti-base-color-bg-6); + --ti-tab-dark-text-color-hover: var(--ti-base-color-white); + --ti-tab-dark-bg-color-hover: var(--ti-base-color-common-4); + --ti-tab-dark-text-color: var(--ti-base-color-common-2); + --ti-tabs-header-dark-bg-color: var(--ti-base-color-common-6); + --ti-tabs-item-margin-right: var(--ti-common-space-10x); + --ti-tabs-item-padding-horizontal: var(--ti-common-space-3x); + --ti-tabs-item-vertical-padding-horizontal: var(--ti-common-space-5x); + --ti-tabs-item-active-border-weight: 3px; + --ti-tabs-item-active-border-style: solid; + --ti-tabs-item-active-border-color: var(--ti-tabs-header-font-active-border-color); + --ti-tabs-item-bottom-border-weight: 1px; + --ti-tabs-item-bottom-border-style: solid; + --ti-tabs-item-bottom-border-color: var(--ti-base-color-white); + --ti-tabs-item-card-active-bg-color: var(--ti-base-color-white); + --ti-tabs-item-card-border-radius: 0; + --ti-tabs-icon-close-default-bg-color: transparent; + --ti-tabs-icon-close-default-text-color: var(--ti-tabs-header-font-normal-text-color); + --ti-tabs-icon-close-hover-text-color: var(--ti-tabs-header-font-active-border-color); + --ti-tabs-icon-size-close: var(--ti-common-font-size-1); + --ti-tabs-icon-close-margin-vertical: 0; + --ti-tabs-icon-close-margin-right: 0; + --ti-tabs-icon-close-margin-left: 5px; +} diff --git a/packages/theme/src/tag/index.js b/packages/theme/src/tag/index.js new file mode 100644 index 000000000..f99ed4447 --- /dev/null +++ b/packages/theme/src/tag/index.js @@ -0,0 +1,54 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-tag-height': '22px', + 'tiny-tag-medium-height': '24px', + 'tiny-tag-small-height': '20px', + 'tiny-tag-mini-height': '16px', + 'tiny-tag-border-color': '#d9d9d9', + 'tiny-tag-border-radius': '2px', + 'tiny-tag-font-size': '12px', + 'tiny-tag-close-font-size': '14px', + 'tiny-tag-primary-text-color': '#1890ff', + 'tiny-tag-primary-border-color': 'rgba(24, 144, 255, 0.15)', + 'tiny-tag-primary-background-color': 'rgba(24, 144, 255, 0.06)', + 'tiny-tag-warning-text-color': '#faad14', + 'tiny-tag-warning-border-color': 'rgba(250, 173, 20, 0.15)', + 'tiny-tag-warning-background-color': 'rgba(250, 173, 20, 0.06)', + 'tiny-tag-danger-text-color': '#f5222d', + 'tiny-tag-danger-border-color': 'rgba(245, 34, 45, 0.15)', + 'tiny-tag-danger-background-color': 'rgba(245, 34, 45, 0.06)', + 'tiny-tag-success-text-color': '#52c41a', + 'tiny-tag-success-border-color': 'rgba(82, 196, 26, 0.15)', + 'tiny-tag-success-background-color': 'rgba(82, 196, 26, 0.06)', + 'tiny-tag-info-text-color': '#333333', + 'tiny-tag-info-border-color': 'rgba(51, 51, 51, 0.15)', + 'tiny-tag-info-background-color': 'rgba(51, 51, 51, 0.06)', + 'tiny-tag-dark-text-color': '#fff', + 'tiny-tag-dark-bg-color': '#40a9ff', + 'tiny-tag-dark-info-bg-color': '#909399', + 'tiny-tag-dark-success-bg-color': '#67c23a', + 'tiny-tag-dark-warning-bg-color': '#e6a23c', + 'tiny-tag-dark-danger-bg-color': '#f5222d', + 'tiny-tag-plain-text-color': '#40a9ff', + 'tiny-tag-plain-border-color': '#b3d8ff', + 'tiny-tag-plain-background-color': '#fff', + 'tiny-tag-plain-info-text-color': '#909399', + 'tiny-tag-plain-info-border-color': '#d3d4d6', + 'tiny-tag-plain-success-text-color': '#67c23a', + 'tiny-tag-plain-success-border-color': '#c2e7b0', + 'tiny-tag-plain-warning-text-color': '#e6a23c', + 'tiny-tag-plain-warning-border-color': '#f5dab1', + 'tiny-tag-plain-danger-text-color': '#f5222d', + 'tiny-tag-plain-danger-border-color': '#fbc4c4' +} diff --git a/packages/theme/src/tag/index.less b/packages/theme/src/tag/index.less new file mode 100644 index 000000000..293859f84 --- /dev/null +++ b/packages/theme/src/tag/index.less @@ -0,0 +1,175 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/tag.less'; +@import '../mixins/common.less'; +@import '../custom.less'; +@import './vars.less'; + +@tag-prefix-cls: ~'@{css-prefix}tag'; + +.@{tag-prefix-cls} { + .component-css-vars-tag(); + + height: var(--ti-tag-height); + line-height: var(--ti-tag-height); + padding: 0 8px; + font-size: var(--ti-tag-font-size); + border-width: 1px; + border-radius: var(--ti-tag-border-radius); + border-style: solid; + box-sizing: border-box; + white-space: nowrap; + display: inline-flex; + align-items: center; + .tag-variant( + var(--ti-tag-primary-text-color), + var(--ti-tag-primary-border-color), + var(--ti-tag-primary-background-color) + ); + & &__text:hover { + cursor: pointer; + color: #526ecc; + } + + & &__close { + font-size: var(--ti-tag-close-font-size); + margin-left: 6px; + + &:hover { + cursor: pointer; + fill: #5e7ce0; + } + } + + &&--info { + .tag-variant( + var(--ti-tag-info-text-color), + var(--ti-tag-info-border-color), + var(--ti-tag-info-background-color) + ); + } + + &&--success { + .tag-variant( + var(--ti-tag-success-text-color), + var(--ti-tag-success-border-color), + var(--ti-tag-success-background-color) + ); + } + + &&--warning { + .tag-variant( + var(--ti-tag-warning-text-color), + var(--ti-tag-warning-border-color), + var(--ti-tag-warning-background-color) + ); + } + + &&--danger { + .tag-variant( + var(--ti-tag-danger-text-color), + var(--ti-tag-danger-border-color), + var(--ti-tag-danger-background-color) + ); + } + + &--dark { + .tag-dark-variant( + var(--ti-tag-dark-text-color), + var(--ti-tag-dark-bg-color) + ); + } + + &--dark&--info { + .tag-dark-variant( + var(--ti-tag-dark-text-color), + var(--ti-tag-dark-info-bg-color) + ); + } + + &--dark&--success { + .tag-dark-variant( + var(--ti-tag-dark-text-color), + var(--ti-tag-dark-success-bg-color) + ); + } + + &--dark&--warning { + .tag-dark-variant( + var(--ti-tag-dark-text-color), + var(--ti-tag-dark-warning-bg-color) + ); + } + + &--dark&--danger { + .tag-dark-variant( + var(--ti-tag-dark-text-color), + var(--ti-tag-dark-danger-bg-color) + ); + } + + &--plain { + .tag-variant( + var(--ti-tag-plain-text-color), + var(--ti-tag-plain-border-color), + var(--ti-tag-plain-background-color) + ); + } + + &--plain&--info { + .tag-variant( + var(--ti-tag-plain-info-text-color), + var(--ti-tag-plain-info-border-color), + var(--ti-tag-plain-background-color) + ); + } + + &--plain&--success { + .tag-variant( + var(--ti-tag-plain-success-text-color), + var(--ti-tag-plain-success-border-color), + var(--ti-tag-plain-background-color) + ); + } + + &--plain&--warning { + .tag-variant( + var(--ti-tag-plain-warning-text-color), + var(--ti-tag-plain-warning-border-color), + var(--ti-tag-plain-background-color) + ); + } + + &--plain&--danger { + .tag-variant( + var(--ti-tag-plain-danger-text-color), + var(--ti-tag-plain-danger-border-color), + var(--ti-tag-plain-background-color) + ); + } + + &--medium { + height: var(--ti-tag-medium-height); + line-height: calc(var(--ti-tag-medium-height) - 2px); + } + + &--small { + height: var(--ti-tag-small-height); + line-height: calc(var(--ti-tag-small-height) - 2px); + } + + &--mini { + height: var(--ti-tag-mini-height); + line-height: calc(var(--ti-tag-mini-height) - 2px); + } +} diff --git a/packages/theme/src/tag/vars.less b/packages/theme/src/tag/vars.less new file mode 100644 index 000000000..8b8d113c0 --- /dev/null +++ b/packages/theme/src/tag/vars.less @@ -0,0 +1,65 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-tag() { + --ti-tag-height: 22px; + --ti-tag-medium-height: var(--ti-common-size-6x); + --ti-tag-small-height: var(--ti-common-size-5x); + --ti-tag-mini-height: var(--ti-common-size-4x); + --ti-tag-border-color: var(--ti-base-color-border); + --ti-tag-border-radius: var(--ti-base-radius-medium); + --ti-tag-font-size: var(--ti-base-font-size); + --ti-tag-close-font-size: var(--ti-common-font-size-1); + + --ti-tag-primary-text-color: var(--ti-base-color-common-5); + --ti-tag-primary-border-color: var(--ti-base-color-bg-6); + --ti-tag-primary-background-color: var(--ti-base-color-bg-6); + + --ti-tag-warning-text-color: var(--ti-common-color-warn-text); + --ti-tag-warning-border-color: var(--ti-common-color-warn-border); + --ti-tag-warning-background-color: var(--ti-common-color-warn-bg); + + --ti-tag-danger-text-color: var(--ti-common-color-error-text); + --ti-tag-danger-border-color: var(--ti-common-color-error-border-secondary); + --ti-tag-danger-background-color: var(--ti-common-color-error-bg); + + --ti-tag-success-text-color: var(--ti-common-color-text-success); + --ti-tag-success-border-color: var(--ti-common-color-success-border); + --ti-tag-success-background-color: var(--ti-common-color-success-bg); + + --ti-tag-info-text-color: var(--ti-common-color-info-text); + --ti-tag-info-border-color: var(--ti-common-color-info-border); + --ti-tag-info-background-color: var(--ti-common-color-info-bg); + + --ti-tag-dark-text-color: var(--ti-base-color-light); + --ti-tag-dark-bg-color: var(--ti-common-color-prompt); + --ti-tag-dark-success-bg-color: var(--ti-common-color-success); + --ti-tag-dark-warning-bg-color: var(--ti-common-color-warn); + --ti-tag-dark-danger-bg-color: var(--ti-common-color-error); + --ti-tag-dark-info-bg-color: var(--ti-common-color-info); + + --ti-tag-plain-text-color: var(--ti-common-color-prompt); + --ti-tag-plain-border-color: var(--ti-common-color-prompt-border); + --ti-tag-plain-background-color: var(--ti-base-color-light); + + --ti-tag-plain-info-text-color: var(--ti-common-color-info); + --ti-tag-plain-info-border-color: var(--ti-common-color-info-border); + + --ti-tag-plain-success-text-color: var(--ti-common-color-success); + --ti-tag-plain-success-border-color: var(--ti-common-color-success-border); + + --ti-tag-plain-warning-text-color: var(--ti-common-color-warn); + --ti-tag-plain-warning-border-color: var(--ti-common-color-warn-border); + + --ti-tag-plain-danger-text-color: var(--ti-common-color-error); + --ti-tag-plain-danger-border-color: var(--ti-common-color-error-border-secondary); +} diff --git a/packages/theme/src/tall-storage/index.js b/packages/theme/src/tall-storage/index.js new file mode 100644 index 000000000..80a358fd9 --- /dev/null +++ b/packages/theme/src/tall-storage/index.js @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-tall-storage-bg-color': '#fff', + 'tiny-tall-storage-border-radius': '2px', + 'tiny-tall-storage-item-height': '30px', + 'tiny-tall-storage-item-bg-color': '#e6f7ff' +} diff --git a/packages/theme/src/tall-storage/index.less b/packages/theme/src/tall-storage/index.less new file mode 100644 index 000000000..54b3e97ac --- /dev/null +++ b/packages/theme/src/tall-storage/index.less @@ -0,0 +1,54 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@tall-storage-prefix-cls: ~'@{css-prefix}tall-storage'; +@storage-list-style-prefix-cls: ~'@{css-prefix}storage-list-style'; +@storage-list-prefix-cls: ~'@{css-prefix}storage-list'; +@storage-item-prefix-cls: ~'@{css-prefix}storage-item'; + +.@{tall-storage-prefix-cls} { + .component-css-vars-tall-storage(); + + position: relative; + margin-top: 2px; + + .@{storage-list-style-prefix-cls} { + position: absolute; + background-color: var(--ti-tall-storage-bg-color); + box-shadow: var(--ti-base-box-shadow); + border-radius: var(--ti-tall-storage-border-radius); + width: 100%; + box-sizing: border-box; + z-index: 10; + + .@{storage-list-prefix-cls} { + padding: 0; + list-style: none; + + .@{storage-item-prefix-cls} { + height: var(--ti-tall-storage-item-height); + line-height: var(--ti-tall-storage-item-height); + padding: 0 8px; + white-space: nowrap; + + &:hover, + &.item-hover { + cursor: pointer; + background-color: var(--ti-tall-storage-item-bg-color); + } + } + } + } +} diff --git a/packages/theme/src/tall-storage/vars.less b/packages/theme/src/tall-storage/vars.less new file mode 100644 index 000000000..0d51d4a50 --- /dev/null +++ b/packages/theme/src/tall-storage/vars.less @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-tall-storage() { + --ti-tall-storage-bg-color: var(--ti-base-color-light); + --ti-tall-storage-border-radius: var(--ti-common-border-radius-normal); + --ti-tall-storage-item-height: var(--ti-base-size-height-minor); + --ti-tall-storage-item-bg-color: var(--ti-base-color-hover-background); +} diff --git a/packages/theme/src/text-popup/index.js b/packages/theme/src/text-popup/index.js new file mode 100644 index 000000000..addb78468 --- /dev/null +++ b/packages/theme/src/text-popup/index.js @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-text-popup-border-radius': '2px', + 'tiny-text-popup-border-color': '#d9d9d9', + 'tiny-text-popup-box-shadow': '0 0 1px 1px rgba(175, 175, 175, 0.3)', + 'tiny-text-popup-hover-border-color': '#1890ff' +} diff --git a/packages/theme/src/text-popup/index.less b/packages/theme/src/text-popup/index.less new file mode 100644 index 000000000..90910f6b9 --- /dev/null +++ b/packages/theme/src/text-popup/index.less @@ -0,0 +1,44 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@text-popup-prefix-cls: ~'@{css-prefix}text-popup'; + +.@{text-popup-prefix-cls} { + .component-css-vars-text-popup(); + + display: inline-block; + + .area { + padding: 6px; + width: 100%; + border-radius: var(--ti-text-popup-border-radius, 2px); + outline: none; + } + + .text { + border: 1px solid var(--ti-text-popup-border-color); + line-height: 1; + + &:hover { + border-color: var(--ti-text-popup-hover-border-color); + } + } + + .popup { + resize: none; + box-shadow: var(--ti-text-popup-box-shadow); + border: 1px solid var(--ti-text-popup-border-color); + } +} diff --git a/packages/theme/src/text-popup/vars.less b/packages/theme/src/text-popup/vars.less new file mode 100644 index 000000000..42e7d49b5 --- /dev/null +++ b/packages/theme/src/text-popup/vars.less @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-text-popup() { + --ti-text-popup-border-radius: var(--ti-common-border-radius-normal); + --ti-text-popup-border-color: var(--ti-base-color-border); + --ti-text-popup-box-shadow: 0 0 1px 1px rgba(175, 175, 175, 0.3); + --ti-text-popup-hover-border-color: var(--ti-base-color-brand-6); +} diff --git a/packages/theme/src/theme-tool.js b/packages/theme/src/theme-tool.js new file mode 100644 index 000000000..c2d2bba73 --- /dev/null +++ b/packages/theme/src/theme-tool.js @@ -0,0 +1,125 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import components from './theme.config' + +/** + * TinyVue主题切换类 负责CSS变量主题的装卸,主题元数据转换成主题数据 + * 使用示例:new TinyThemeTool(theme,'styleSheetId') + * @param {Object} theme 主题配置数据,结构如下: + * { + * id: 'tiny-infinity-theme', + * name: 'Infinity', + * cnName: '无限', + * data: {'ti-base-color': 'white'} + * } + * @param {String} styleSheetId style标签的id + */ + +export default class TinyThemeTool { + // 当前主题 + currentTheme + + // 当前style标签元素 + contentElement + + // 当前style标签的id + styleSheetId + + // 默认主题 + + defaultTheme = { + id: 'tiny-default-theme', + name: 'Default', + cnName: '默认', + data: {} + } + + constructor(theme, styleSheetId = 'tinyThemeVariables') { + let currentTheme = theme + if (!theme) { + currentTheme = this.defaultTheme + } + this.styleSheetId = styleSheetId + this.changeTheme(currentTheme) + } + + changeTheme(theme) { + let currentTheme = theme + if (typeof window === 'undefined' || typeof document === 'undefined') { + throw new TypeError('当前主题工具只支持浏览器环境') + } + if (!theme) { + currentTheme = this.defaultTheme + } + this.currentTheme = currentTheme + if (!this.contentElement) { + const styleElement = document.getElementById(this.styleSheetId) + if (styleElement) { + this.contentElement = styleElement + } else { + this.contentElement = document.createElement('style') + this.contentElement.id = this.styleSheetId + document.head.appendChild(this.contentElement) + } + } + this.contentElement.textContent = this.formatCSSVariables(currentTheme.data) + this.contentElement.setAttribute('tiny-theme', this.currentTheme.id) + } + + findClassName(name) { + const compNameList = name.split('-') + if (compNameList.length < 2) { + return false + } + const compLength = components.length + let compName = '' + for (let i = 0; i < compLength; i++) { + if (components[i] === `${compNameList[1]}-${compNameList[2]}`) { + compName = `tiny-${components[i]}` + break + } + } + if (!compName) { + compName = `tiny-${compNameList[1]}` + } + return compName + } + + formatCSSVariables(themeData) { + const componentsMap = {} + let rootCssVar = ':root {' + let componentsCssVar = '' + + Object.keys(themeData).forEach((item) => { + const isBaseCssVar = item.startsWith('ti-base') || item.startsWith('ti-common') + if (isBaseCssVar) { + rootCssVar += `--${item}:${themeData[item]};` + } else { + const classkey = this.findClassName(item) + if (classkey) { + if (componentsMap[classkey]) { + componentsMap[classkey].push(`--${item}:${themeData[item]};`) + } else { + componentsMap[classkey] = [`--${item}:${themeData[item]};`] + } + } + } + }) + + Object.keys(componentsMap).forEach((item) => { + componentsCssVar += `.${item}{${componentsMap[item].join('')}}` + }) + + return `${rootCssVar}}${componentsCssVar}` + } +} diff --git a/packages/theme/src/theme.config.js b/packages/theme/src/theme.config.js new file mode 100644 index 000000000..3188a0f71 --- /dev/null +++ b/packages/theme/src/theme.config.js @@ -0,0 +1,58 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default [ + 'bulletin-board', + 'button-group', + 'card-container', + 'card-item', + 'card-layout', + 'card-template', + 'carousel-item', + 'cascader-menu', + 'cascader-panel', + 'cascader-node', + 'context-menu', + 'detail-page', + 'dialog-box', + 'drop-roles', + 'drop-times', + 'fall-menu', + 'form-item', + 'img-preview', + 'img-preview-item', + 'ip-address', + 'link-menu', + 'nav-menu', + 'pop-editor', + 'picker-panel', + 'date-picker', + 'popup-horiz-menu', + 'popup-menu', + 'quick-link-menu', + 'scroll-text', + 'slide-bar', + 'slide-img', + 'select-dropdown', + 'suggest-popup', + 'tab-item', + 'textarea', + 'text-parse', + 'text-popup', + 'toggle-menu', + 'tree-menu', + 'user-account', + 'user-card', + 'user-contact', + 'user-head', + 'user-link' +] diff --git a/packages/theme/src/theme.config.json b/packages/theme/src/theme.config.json new file mode 100644 index 000000000..9715d5461 --- /dev/null +++ b/packages/theme/src/theme.config.json @@ -0,0 +1,140 @@ +{ + "tiny2": [ + "$", + "tiny", + "chart", + "chart3", + "drag", + "drop", + "dialog", + "install", + "jalor", + "fragment", + "fullscreen", + "gantt", + "gateway", + "gridster", + "hae", + "version", + "tollbar", + "user-face", + "richtext", + "standalone", + "logon-user", + "logout", + "flowchart", + "edoc", + "espace", + "bootstrap" + ], + "components": [ + "alert", + "amount", + "area", + "aside", + "badge", + "base", + "breadcrumb", + "bulletin-board", + "button", + "button-group", + "calendar", + "calendars", + "card", + "card-container", + "card-item", + "card-layout", + "card-template", + "carousel", + "carousel-item", + "cascade-menu", + "col", + "company", + "container", + "context-menu", + "country", + "crop", + "currency", + "customer", + "datepicker", + "dept", + "detail-page", + "dialog-box", + "dropdown", + "drop-roles", + "drop-times", + "espace", + "fall-menu", + "fileupload", + "floatbar", + "footer", + "form", + "form-item", + "grid", + "header", + "hrapprover", + "img-preview", + "img-preview-item", + "input", + "ip-address", + "layout", + "layoutbar", + "link-menu", + "loading", + "locales", + "main", + "menubar", + "nav-menu", + "numeric", + "pager", + "panel", + "pbi", + "pop-editor", + "poplist", + "popover", + "popup-horiz-menu", + "popupload", + "popup-menu", + "progressbar", + "quick-link-menu", + "radio", + "rate", + "repeater", + "richtext", + "roles", + "row", + "scroll-text", + "search", + "selectgroup", + "selector", + "slide-bar", + "slide-img", + "slider", + "spacecontrol", + "split", + "steps", + "suggest", + "suggest-popup", + "switch", + "tab", + "tab-item", + "tabs", + "tag", + "textarea", + "text-parse", + "text-popup", + "time", + "tip", + "toggle-menu", + "transfer", + "tree", + "tree-menu", + "user", + "user-account", + "user-card", + "user-contact", + "user-head", + "user-link", + "wizard" + ] +} diff --git a/packages/theme/src/theme/deep-theme/devui.json b/packages/theme/src/theme/deep-theme/devui.json new file mode 100644 index 000000000..b4981d638 --- /dev/null +++ b/packages/theme/src/theme/deep-theme/devui.json @@ -0,0 +1,45 @@ +{ + "devui-btn-common-bg": "#E0E0E0", + "devui-btn-common-bg-hover": "#BDBDBD", + + "devui-global-bg": "#F2F2F3", + "devui-glass-morphism-bg": "rgba(242,242,243,0.9)", + "devui-base-bg": "#ffffff", + "devui-brand": "#252b3a", + "devui-brand-foil": "#f3f4f7", + "devui-brand-active-focus": "#252b3a", + "devui-primary-active": "#252b3a", + "devui-brand-active": "#252b3a", + "devui-brand-hover": "#252b3a", + "devui-text": "#252b3a", + "devui-aide-text": "#575d6c", + "devui-placeholder": "#9B9FA8", + "devui-disabled-text": "#9B9FA8", + "devui-disabled-bg": "#ebebeb", + "devui-line": "#CFD0D3", + "devui-dividing-line": "#E2E2E6", + "devui-list-item-hover-bg": "#E2E2E6", + "devui-list-item-active-bg": "#d5d5db", + "devui-list-item-active-hover-bg": "#d5d5db", + "devui-list-item-selected-bg": "#d5d5db", + "devui-list-item-hover-text": "#252b3a", + "devui-list-item-active-text": "#252b3a", + "devui-icon-text": "#babbc0", + "devui-primary": "#252b3a", + "devui-primary-hover": "#252b3a", + "devui-form-control-line": "#CFD0D3", + "devui-form-control-line-hover": "#71757F", + "devui-icon-fill": "#575d6c", + "devui-icon-fill-weak": "#9B9FA8", + "devui-icon-fill-active": "#252b3a", + "devui-icon-fill-active-hover": "#252b3a", + "devui-shape-icon-fill": "#C7C7D1", + "devui-shape-icon-fill-hover": "#AEAEBD", + "devui-shape-icon-fill-active": "#AEAEBD", + "devui-shape-icon-fill-disabled": "#E0E0E0", + "devui-form-control-line-active": "#252b3a", + "devui-form-control-line-active-hover": "#252b3a", + "devui-connected-overlay-line": "#252b3a", + "devui-primary-disabled": "#bebfc4", + "devui-icon-fill-active-disabled": "#bebfc4" +} diff --git a/packages/theme/src/theme/deep-theme/index.js b/packages/theme/src/theme/deep-theme/index.js new file mode 100644 index 000000000..842861a84 --- /dev/null +++ b/packages/theme/src/theme/deep-theme/index.js @@ -0,0 +1,22 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const deepTheme = { + 'ti-base-color-primary-normal': '#252b3a', + 'ti-base-color-primary-hover': '#54657e', + 'ti-button-primary-plain-bg-color': 'rgba(51, 51, 51, 0.06)', + + 'ti-base-color-brand-5': '#252b3a', + 'ti-autocomplete-li-text-color': '#252b3a', + 'ti-autocomplete-li-hover-bg-color': '#E2E2E6', + 'ti-autocomplete-li-select-bg-color': '#d5d5db', +} diff --git a/packages/theme/src/theme/deep-theme/index.json b/packages/theme/src/theme/deep-theme/index.json new file mode 100644 index 000000000..7c1189771 --- /dev/null +++ b/packages/theme/src/theme/deep-theme/index.json @@ -0,0 +1,5 @@ +{ + "ti-base-color-brand-6": "#252b3a", + "ti-base-color-common-7": "#252b3a", + "ti-button-normal-background-color": "#E0E0E0" +} \ No newline at end of file diff --git a/packages/theme/src/theme/devui-theme-map.js b/packages/theme/src/theme/devui-theme-map.js new file mode 100644 index 000000000..8c5f47428 --- /dev/null +++ b/packages/theme/src/theme/devui-theme-map.js @@ -0,0 +1,164 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +// 全量 DevUI 主题变量对应的 Tiny 主题变量 +export const DEVUI_THEME_MAP = { + 'devui-global-bg': '#f3f6f8', + 'devui-glass-morphism-bg': 'rgba(243,246,248,0.9)', + 'devui-global-bg-normal': '#ffffff', + 'devui-base-bg': '#ffffff', + 'devui-base-bg-dark': '#333854', + 'devui-brand': 'ti-base-color-brand-6', + 'devui-brand-foil': '#859bff', + 'devui-brand-hover': '#7693f5', + 'devui-brand-active': '#526ecc', + 'devui-brand-active-focus': '#344899', + 'devui-contrast': '#c7000b', + 'devui-text': 'ti-base-color-common-7', + 'devui-text-weak': '#575d6c', + 'devui-aide-text': '#8a8e99', + 'devui-aide-text-hover': '#252b3a', + 'devui-aide-text-stress': '#575d6c', + 'devui-placeholder': '#8a8e99', + 'devui-light-text': '#ffffff', + 'devui-dark-text': '#252b3a', + 'devui-link': '#526ecc', + 'devui-link-active': '#344899', + 'devui-link-light': '#96adfa', + 'devui-link-light-active': '#beccfa', + 'devui-line': '#adb0b8', + 'devui-dividing-line': 'ti-common-color-line-dividing', + 'devui-block': '#ffffff', + 'devui-area': '#f8f8f8', + 'devui-danger': '#f66f6a', + 'devui-warning': '#fac20a', + 'devui-waiting': '#9faad7', + 'devui-success': '#50d4ab', + 'devui-info': '#5e7ce0', + 'devui-initial': '#e9edfa', + 'devui-unavailable': '#f5f5f6', + 'devui-shadow': 'rgba(37, 43, 58, 0.2)', + 'devui-light-shadow': 'rgba(37, 43, 58, 0.1)', + 'devui-connected-overlay-shadow': 'rgba(37, 43, 58, 0.12)', + 'devui-feedback-overlay-shadow': 'rgba(37, 43, 58, 0.16)', + 'devui-icon-text': '#252b3a', + 'devui-icon-bg': '#ffffff', + 'devui-icon-fill': '#252b3a', + 'devui-icon-fill-weak': '#babbc0', + 'devui-icon-fill-hover': '#5e7ce0', + 'devui-icon-fill-active': '#5e7ce0', + 'devui-icon-fill-active-hover': 'ti-grid-icon-fill-hover-bg-color', + 'devui-shape-icon-fill': '#d7d8da', + 'devui-shape-icon-fill-active': '#babbc0', + 'devui-shape-icon-fill-hover': '#babbc0', + 'devui-shape-icon-fill-disabled': '#f5f5f5', + 'devui-form-control-line': '#adb0b8', + 'devui-form-control-bg': '#ffffff', + 'devui-form-control-line-hover': '#575d6c', + 'devui-form-control-line-active': '#5e7ce0', + 'devui-form-control-line-active-hover': '#344899', + 'devui-list-item-active-bg': '#5e7ce0', + 'devui-list-item-active-text': '#ffffff', + 'devui-list-item-active-hover-bg': '#526ecc', + 'devui-list-item-hover-bg': '#f2f5fc', + 'devui-list-item-hover-text': '#526ecc', + 'devui-list-item-selected-bg': '#e9edfa', + 'devui-list-item-strip-bg': '#f2f5fc', + 'devui-disabled-bg': 'ti-common-color-bg-disabled', + 'devui-disabled-line': '#dfe1e6', + 'devui-disabled-text': '#adb0b8', + 'devui-primary-disabled': '#beccfa', + 'devui-icon-fill-active-disabled': '#beccfa', + 'devui-label-bg': '#eef0f5', + 'devui-connected-overlay-bg': '#ffffff', + 'devui-connected-overlay-line': '#526ecc', + 'devui-fullscreen-overlay-bg': '#ffffff', + 'devui-feedback-overlay-bg': '#464d6e', + 'devui-feedback-overlay-text': '#dfe1e6', + 'devui-embed-search-bg': '#f2f5fc', + 'devui-embed-search-bg-hover': '#eef0f5', + 'devui-float-block-shadow': 'rgba(94, 124, 224, 0.3)', + 'devui-highlight-overlay': 'rgba(255, 255, 255, 0.8)', + 'devui-range-item-hover-bg': '#e9edfa', + 'devui-primary': 'ti-base-color-brand-6', + 'devui-primary-hover': '#7693f5', + 'devui-primary-active': '#344899', + 'devui-contrast-hover': '#d64a52', + 'devui-contrast-active': '#b12220', + 'devui-danger-line': '#f66f6a', + 'devui-danger-bg': '#ffeeed', + 'devui-warning-line': '#fa9841', + 'devui-warning-bg': '#fff3e8', + 'devui-info-line': '#5e7ce0', + 'devui-info-bg': '#f2f5fc', + 'devui-success-line': '#50d4ab', + 'devui-success-bg': '#edfff9', + 'devui-primary-line': '#5e7ce0', + 'devui-primary-bg': '#f2f5fc', + 'devui-default-line': '#5e7ce0', + 'devui-default-bg': '#f3f6f8', + 'devui-shadow-length-base': '0 1px 4px 0', + 'devui-shadow-length-slide-left': '-2px 0 8px 0', + 'devui-shadow-length-slide-right': '2px 0 8px 0', + 'devui-shadow-length-connected-overlay': '0 4px 8px 0', + 'devui-shadow-length-hover': '0 8px 16px 0', + 'devui-shadow-length-feedback-overlay': '0 8px 16px 0', + 'devui-shadow-length-fullscreen-overlay': '0 12px 24px 0', + 'devui-border-radius': '2px', + 'devui-border-radius-feedback': '4px', + 'devui-border-radius-card': '6px', + 'devui-border-radius-full': '100px', + 'devui-font-size': '12px', + 'devui-font-size-card-title': '14px', + 'devui-font-size-page-title': '16px', + 'devui-font-size-modal-title': '18px', + 'devui-font-size-price': '20px', + 'devui-font-size-data-overview': '24px', + 'devui-font-size-icon': '16px', + 'devui-font-size-sm': '12px', + 'devui-font-size-md': '12px', + 'devui-font-size-lg': '14px', + 'devui-font-title-weight': 'bold', + 'devui-font-content-weight': 'normal', + 'devui-line-height-base': '1.5', + 'devui-animation-ease-in-smooth': 'cubic-bezier(0.645, 0.045, 0.355, 1)', + 'devui-animation-duration-slow': '300ms', + 'devui-animation-duration-base': '200ms', + 'devui-animation-duration-fast': '100ms', + 'devui-animation-ease-in': 'cubic-bezier(0.5, 0, 0.84, 0.25)', + 'devui-animation-ease-out': 'cubic-bezier(0.16, 0.75, 0.5, 1)', + 'devui-animation-ease-in-out': 'cubic-bezier(0.5, 0.05, 0.5, 0.95)', + 'devui-animation-ease-in-out-smooth': 'cubic-bezier(0.645, 0.045, 0.355, 1)', + 'devui-animation-linear': 'cubic-bezier(0, 0, 1, 1)', + 'devui-z-index-full-page-overlay': '1080', + 'devui-z-index-pop-up': '1060', + 'devui-z-index-dropdown': '1052', + 'devui-z-index-modal': '1050', + 'devui-z-index-drawer': '1040', + 'devui-z-index-framework': '1000', + 'devui-icon-active-color': '#ffffff', + + 'devui-btn-sm-padding': '0 12px', + 'devui-btn-padding': '0 16px', + 'devui-btn-lg-padding': '0 20px', + 'devui-btn-common-bg': 'ti-button-normal-background-color', + 'devui-btn-common-border-color': 'transparent', + 'devui-btn-common-bg-hover': '#d1d1d1', + 'devui-btn-common-color-hover': '#252b3a', + 'devui-btn-common-border-color-hover': 'transparent', + 'devui-btn-common-bg-active': '#BDBDBD', + 'devui-btn-common-color-active': '#252b3a', + 'devui-btn-common-border-color-active': 'transparent', + 'devui-btn-common-border-disabled': 'transparent', + 'devui-icon-hover-bg': '#ebebeb', + 'devui-icon-active-bg': '#d1d1d1' +} diff --git a/packages/theme/src/theme/galaxy-theme/devui.json b/packages/theme/src/theme/galaxy-theme/devui.json new file mode 100644 index 000000000..bbff46dbb --- /dev/null +++ b/packages/theme/src/theme/galaxy-theme/devui.json @@ -0,0 +1,124 @@ +{ + "devui-brand": "#526ECC", + "devui-info": "#526ECC", + "devui-primary": "#526ECC", + "devui-default-line": "#526ECC", + "devui-brand-hover": "#5E7CE0", + "devui-primary-hover": "#5E7CE0", + "devui-brand-foil": "#F2F2F3", + "devui-global-bg": "#1A1A1C", + "devui-glass-morphism-bg": "rgba(26,26,28,0.9)", + "devui-base-bg": "#292A2E", + "devui-text": "#CED1DB", + "devui-aide-text": "#868A99", + "devui-placeholder": "#4E5057", + "devui-disabled-text": "#5b5d66", + "devui-disabled-bg": "#2D2E32", + "devui-line": "#4e5057", + "devui-dividing-line": "#323438", + "devui-list-item-hover-bg": "#393A3E", + "devui-list-item-active-bg": "#303548", + "devui-list-item-active-hover-bg": "#303548", + "devui-list-item-selected-bg": "#303548", + "devui-list-item-hover-text": "#F5F5F5", + "devui-list-item-active-text": "#4660B8", + "devui-primary-disabled": "#3f3f3f", + "devui-form-control-line": "#4e5057", + "devui-form-control-bg": "#292A2E", + "devui-form-control-line-hover": "#696c75", + "devui-form-control-line-active": "#526ECC", + "devui-icon-text": "#868A99", + "devui-connected-overlay-bg": "#2E2F33", + "devui-fullscreen-overlay-bg": "#2E2F33", + "devui-warning-line": "#EB8F3D", + "devui-warning-bg": "#4b2e14", + "devui-success-line": "#2AA37E ", + "devui-success-bg": "#123d32", + "devui-danger-line": "#D15854", + "devui-danger-bg": "#4a2120", + "devui-info-line": "#4482BD", + "devui-info-bg": "#1c2543", + "devui-default-bg": "#313131", + "devui-label-bg": "#353537", + "devui-icon-fill": "#868A99", + "devui-icon-fill-hover": "#ced1db", + "devui-icon-fill-active": "#ced1db", + "devui-icon-fill-active-hover": "#ced1db", + + "devui-global-bg-normal": "#202124", + "devui-base-bg-dark": "#2e2f31", + "devui-brand-active": "#526ecc", + "devui-brand-active-focus": "#344899", + "devui-contrast": "#C7000B", + "devui-text-weak": "#A0A0A0", + "devui-aide-text-hover": "#73788a", + "devui-aide-text-stress": "#A0A0A0", + "devui-light-text": "#ffffff", + "devui-dark-text": "#252b3a", + "devui-link": "#526ECC", + "devui-link-active": "#344899", + "devui-link-light": "#96adfa", + "devui-link-light-active": "#beccfa", + "devui-block": "#606061", + "devui-area": "#34363A", + "devui-danger": "#f66f6a", + "devui-warning": "#fac20a", + "devui-waiting": "#5e6580", + "devui-success": "#50d4ab", + "devui-initial": "#64676e", + "devui-unavailable": "#5b5b5c", + "devui-shadow": "rgba(0, 0, 0, 0.72)", + "devui-light-shadow": "rgba(0, 0, 0, 0.3)", + "devui-connected-overlay-shadow": "rgba(0, 0, 0, 0.42)", + "devui-feedback-overlay-shadow": "rgba(0, 0, 0, 0.54)", + + "devui-icon-bg": "#2E2F31", + "devui-shape-icon-fill": "#5b5d66", + "devui-shape-icon-fill-active": "#868a99", + + "devui-form-control-line-active-hover": "#344899", + "devui-list-item-strip-bg": "#383838", + "devui-table-expand-area-bg": "#393a3e", + + "devui-disabled-line": "#505153", + "devui-icon-fill-active-disabled": "#2B3458", + + "devui-connected-overlay-line": "#526ecc", + "devui-feedback-overlay-bg": "#4C4C4C", + "devui-feedback-overlay-text": "#DFE1E6", + "devui-embed-search-bg": "#383838", + "devui-embed-search-bg-hover": "#3D3E40", + "devui-float-block-shadow": "rgba(94, 124, 224, 0.3)", + "devui-highlight-overlay": "rgba(255, 255, 255, 0.1)", + "devui-range-item-hover-bg": "#454545", + + "devui-primary-active": "#344899", + "devui-contrast-hover": "#D64A52", + "devui-contrast-active": "#B12220", + + "devui-primary-line": "#546BB7", + "devui-primary-bg": "#383D4F", + "devui-icon-active-color": "#ffffff", + + "devui-btn-sm-padding": "0 12px", + "devui-btn-padding": "0 16px", + "devui-btn-lg-padding": "0 20px", + "devui-btn-common-bg": "#393a3e", + "devui-btn-common-border-color": "transparent", + "devui-btn-common-bg-hover": "#4e5057", + "devui-btn-common-color-hover": "#CED1DB", + "devui-btn-common-border-color-hover": "transparent", + "devui-btn-common-bg-active": "#4e5057", + "devui-btn-common-color-active": "#CED1DB", + "devui-btn-common-border-color-active": "transparent", + "devui-btn-common-border-disabled": "transparent", + "devui-icon-hover-bg": "#393a3e", + "devui-icon-active-bg": "#4e5057", + + "devui-border-radius": "4px", + "devui-font-size": "14px", + "devui-font-size-md": "14px", + "devui-font-size-card-title": "16px", + "devui-shadow-length-fullscreen-overlay": "0 0 6px 0", + "devui-border-radius-card": "4px" +} diff --git a/packages/theme/src/theme/galaxy-theme/index.js b/packages/theme/src/theme/galaxy-theme/index.js new file mode 100644 index 000000000..ba86fceee --- /dev/null +++ b/packages/theme/src/theme/galaxy-theme/index.js @@ -0,0 +1,24 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const galaxyTheme = { + 'ti-base-color-bg-1': '#1A1A1C', + 'ti-base-color-common-7': '#CED1DB', + 'ti-button-normal-background-color': '#393a3e', + 'ti-button-normal-hover-background-color': '#4e5057', + 'ti-base-color-border': '#353638', + 'ti-base-color-light': '#292A2E', + 'ti-base-color-info-normal': 'var(--ti-base-color-common-7)', + 'ti-base-color-hover-background': '#393A3E', + 'ti-base-color-selected-background': '#393A3E', + 'ti-button-primary-text-color': '#ffffff' +} diff --git a/packages/theme/src/theme/galaxy-theme/index.json b/packages/theme/src/theme/galaxy-theme/index.json new file mode 100644 index 000000000..8d252fcfa --- /dev/null +++ b/packages/theme/src/theme/galaxy-theme/index.json @@ -0,0 +1,5 @@ +{ + "ti-base-color-brand-6": "#526ECC", + "ti-base-color-common-7": "#CED1DB", + "ti-button-normal-background-color": "#393a3e" +} \ No newline at end of file diff --git a/packages/theme/src/theme/generate-theme.js b/packages/theme/src/theme/generate-theme.js new file mode 100644 index 000000000..c8153ccc1 --- /dev/null +++ b/packages/theme/src/theme/generate-theme.js @@ -0,0 +1,51 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +const fs = require('fs') +require('esbuild-register') + +const { DEVUI_THEME_MAP } = require('./devui-theme-map') +const themes = ['impression-theme', 'infinity-theme', 'deep-theme', 'galaxy-theme'] + +function generateTheme(themeName) { + const themeData = {} + + for (let mapItemKey of Object.keys(DEVUI_THEME_MAP)) { + const mapItemValue = DEVUI_THEME_MAP[mapItemKey] + if (mapItemValue.includes('ti-')) { + const themeJson = require(`./${themeName}/devui.json`) + for (let themeItemKey in themeJson) { + if (themeItemKey === mapItemKey) { + themeData[mapItemValue] = themeJson[themeItemKey] + } + } + } + } + + fs.writeFile( + `./${themeName}/index.json`, + JSON.stringify(themeData, null, ' '), + (err) => { + if (err) { + throw new Error('写入文件出错!') + } + } + ) +} + +function main() { + for (let theme of themes) { + generateTheme(theme) + } +} + +main() diff --git a/packages/theme/src/theme/impression-theme/devui.json b/packages/theme/src/theme/impression-theme/devui.json new file mode 100644 index 000000000..3b2cc64a1 --- /dev/null +++ b/packages/theme/src/theme/impression-theme/devui.json @@ -0,0 +1,136 @@ +{ + "devui-global-bg": "#f3f6f8", + "devui-glass-morphism-bg": "rgba(243,246,248,0.9)", + "devui-global-bg-normal": "#ffffff", + "devui-base-bg": "#ffffff", + "devui-base-bg-dark": "#333854", + "devui-brand": "#5e7ce0", + "devui-brand-foil": "#859bff", + "devui-brand-hover": "#7693f5", + "devui-brand-active": "#526ecc", + "devui-brand-active-focus": "#344899", + "devui-contrast": "#c7000b", + "devui-text": "#252b3a", + "devui-text-weak": "#575d6c", + "devui-aide-text": "#8a8e99", + "devui-aide-text-hover":"#252b3a", + "devui-aide-text-stress": "#575d6c", + "devui-placeholder": "#8a8e99", + "devui-light-text": "#ffffff", + "devui-dark-text": "#252b3a", + "devui-link": "#526ecc", + "devui-link-active": "#344899", + "devui-link-light": "#96adfa", + "devui-link-light-active": "#beccfa", + "devui-line": "#adb0b8", + "devui-dividing-line": "#dfe1e6", + "devui-block": "#ffffff", + "devui-area": "#f8f8f8", + "devui-danger": "#f66f6a", + "devui-warning": "#fac20a", + "devui-waiting": "#9faad7", + "devui-success": "#50d4ab", + "devui-info": "#5e7ce0", + "devui-initial": "#e9edfa", + "devui-unavailable": "#f5f5f6", + "devui-shadow": "rgba(37, 43, 58, 0.2)", + "devui-light-shadow": "rgba(37, 43, 58, 0.1)", + "devui-connected-overlay-shadow": "rgba(37, 43, 58, 0.12)", + "devui-feedback-overlay-shadow": "rgba(37, 43, 58, 0.16)", + "devui-icon-text": "#252b3a", + "devui-icon-bg": "#ffffff", + "devui-icon-fill": "#252b3a", + "devui-icon-fill-weak": "#babbc0", + "devui-icon-fill-hover": "#5e7ce0", + "devui-icon-fill-active": "#5e7ce0", + "devui-icon-fill-active-hover": "#526ecc", + "devui-shape-icon-fill": "#d7d8da", + "devui-shape-icon-fill-active": "#babbc0", + "devui-shape-icon-fill-hover": "#babbc0", + "devui-shape-icon-fill-disabled":"#f5f5f5", + "devui-form-control-line": "#adb0b8", + "devui-form-control-bg": "#ffffff", + "devui-form-control-line-hover": "#575d6c", + "devui-form-control-line-active": "#5e7ce0", + "devui-form-control-line-active-hover": "#344899", + "devui-list-item-active-bg": "#5e7ce0", + "devui-list-item-active-text": "#ffffff", + "devui-list-item-active-hover-bg": "#526ecc", + "devui-list-item-hover-bg": "#f2f5fc", + "devui-list-item-hover-text": "#526ecc", + "devui-list-item-selected-bg": "#e9edfa", + "devui-list-item-strip-bg": "#f2f5fc", + "devui-disabled-bg": "#f5f5f6", + "devui-disabled-line": "#dfe1e6", + "devui-disabled-text": "#adb0b8", + "devui-primary-disabled": "#beccfa", + "devui-icon-fill-active-disabled": "#beccfa", + "devui-label-bg": "#eef0f5", + "devui-connected-overlay-bg": "#ffffff", + "devui-connected-overlay-line": "#526ecc", + "devui-fullscreen-overlay-bg": "#ffffff", + "devui-feedback-overlay-bg": "#464d6e", + "devui-feedback-overlay-text": "#dfe1e6", + "devui-embed-search-bg": "#f2f5fc", + "devui-embed-search-bg-hover": "#eef0f5", + "devui-float-block-shadow": "rgba(94, 124, 224, 0.3)", + "devui-highlight-overlay": "rgba(255, 255, 255, 0.8)", + "devui-range-item-hover-bg": "#e9edfa", + "devui-primary": "#5e7ce0", + "devui-primary-hover": "#7693f5", + "devui-primary-active": "#344899", + "devui-contrast-hover": "#d64a52", + "devui-contrast-active": "#b12220", + "devui-danger-line": "#f66f6a", + "devui-danger-bg": "#ffeeed", + "devui-warning-line": "#fa9841", + "devui-warning-bg": "#fff3e8", + "devui-info-line": "#5e7ce0", + "devui-info-bg": "#f2f5fc", + "devui-success-line": "#50d4ab", + "devui-success-bg": "#edfff9", + "devui-primary-line": "#5e7ce0", + "devui-primary-bg": "#f2f5fc", + "devui-default-line": "#5e7ce0", + "devui-default-bg": "#f3f6f8", + "devui-shadow-length-base": "0 1px 4px 0", + "devui-shadow-length-slide-left": "-2px 0 8px 0", + "devui-shadow-length-slide-right": "2px 0 8px 0", + "devui-shadow-length-connected-overlay": "0 4px 8px 0", + "devui-shadow-length-hover": "0 8px 16px 0", + "devui-shadow-length-feedback-overlay": "0 8px 16px 0", + "devui-shadow-length-fullscreen-overlay": "0 12px 24px 0", + "devui-border-radius": "2px", + "devui-border-radius-feedback": "4px", + "devui-border-radius-card": "6px", + "devui-border-radius-full": "100px", + "devui-font-size": "12px", + "devui-font-size-card-title": "14px", + "devui-font-size-page-title": "16px", + "devui-font-size-modal-title": "18px", + "devui-font-size-price": "20px", + "devui-font-size-data-overview": "24px", + "devui-font-size-icon": "16px", + "devui-font-size-sm": "12px", + "devui-font-size-md": "12px", + "devui-font-size-lg": "14px", + "devui-font-title-weight": "bold", + "devui-font-content-weight": "normal", + "devui-line-height-base": "1.5", + "devui-animation-ease-in-smooth": "cubic-bezier(0.645, 0.045, 0.355, 1)", + "devui-animation-duration-slow": "300ms", + "devui-animation-duration-base": "200ms", + "devui-animation-duration-fast": "100ms", + "devui-animation-ease-in": "cubic-bezier(0.5, 0, 0.84, 0.25)", + "devui-animation-ease-out": "cubic-bezier(0.16, 0.75, 0.5, 1)", + "devui-animation-ease-in-out": "cubic-bezier(0.5, 0.05, 0.5, 0.95)", + "devui-animation-ease-in-out-smooth": "cubic-bezier(0.645, 0.045, 0.355, 1)", + "devui-animation-linear": "cubic-bezier(0, 0, 1, 1)", + "devui-z-index-full-page-overlay": "1080", + "devui-z-index-pop-up": "1060", + "devui-z-index-dropdown": "1052", + "devui-z-index-modal": "1050", + "devui-z-index-drawer": "1040", + "devui-z-index-framework": "1000", + "devui-icon-active-color": "#ffffff" +} diff --git a/packages/theme/src/theme/impression-theme/index.js b/packages/theme/src/theme/impression-theme/index.js new file mode 100644 index 000000000..49b8670e7 --- /dev/null +++ b/packages/theme/src/theme/impression-theme/index.js @@ -0,0 +1,14 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export const impressionTheme = { +} diff --git a/packages/theme/src/theme/impression-theme/index.json b/packages/theme/src/theme/impression-theme/index.json new file mode 100644 index 000000000..0df1a1439 --- /dev/null +++ b/packages/theme/src/theme/impression-theme/index.json @@ -0,0 +1,4 @@ +{ + "ti-base-color-brand-6": "#5e7ce0", + "ti-base-color-common-7": "#252b3a" +} \ No newline at end of file diff --git a/packages/theme/src/theme/index.js b/packages/theme/src/theme/index.js new file mode 100644 index 000000000..e8ec780fd --- /dev/null +++ b/packages/theme/src/theme/index.js @@ -0,0 +1,44 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import { impressionTheme } from './impression-theme' +import { infinityTheme } from './infinity-theme' +import { deepTheme } from './deep-theme' +import { galaxyTheme } from './galaxy-theme' + +export const tinyImpressionTheme = { + id: 'tiny-impression-theme', + name: 'Impression', + cnName: '印象', + data: impressionTheme +} + +export const tinyInfinityTheme = { + id: 'tiny-infinity-theme', + name: 'Infinity', + cnName: '无限', + data: infinityTheme +} + +export const tinyDeepTheme = { + id: 'tiny-deep-theme', + name: 'Deep', + cnName: '深邃夜空', + data: deepTheme +} + +export const tinyGalaxyTheme = { + id: 'tiny-galaxy-theme', + name: 'Galaxy', + cnName: '追光', + data: galaxyTheme +} diff --git a/packages/theme/src/theme/infinity-theme/devui.json b/packages/theme/src/theme/infinity-theme/devui.json new file mode 100644 index 000000000..664cd1746 --- /dev/null +++ b/packages/theme/src/theme/infinity-theme/devui.json @@ -0,0 +1,150 @@ +{ + "devui-global-bg": "#f7f7f9", + "devui-glass-morphism-bg": "rgba(247,247,249,0.9)", + "devui-global-bg-normal": "#ffffff", + "devui-base-bg": "#ffffff", + "devui-base-bg-dark": "#252b3a", + "devui-brand": "#5e7ce0", + "devui-brand-foil": "#f2f2f3", + "devui-brand-hover": "#7693f5", + "devui-brand-active": "#526ecc", + "devui-brand-active-focus": "#344899", + "devui-contrast": "#c7000b", + "devui-text": "#252b3a", + "devui-text-weak": "#575d6c", + "devui-aide-text": "#71757f", + "devui-aide-text-hover": "#252b3a", + "devui-aide-text-stress": "#575d6c", + "devui-placeholder": "#babbc0", + "devui-light-text": "#ffffff", + "devui-dark-text": "#252b3a", + "devui-link": "#526ecc", + "devui-link-active": "#526ecc", + "devui-link-light": "#96adfa", + "devui-link-light-active": "#beccfa", + "devui-line": "#d7d8da", + "devui-dividing-line": "#f2f2f3", + "devui-block": "#ffffff", + "devui-area": "#f5f5f5", + "devui-danger": "#f66f6a", + "devui-warning": "#fac20a", + "devui-waiting": "#beccfa", + "devui-success": "#50d4ab", + "devui-info": "#5e7ce0", + "devui-initial": "#e9edfa", + "devui-unavailable": "#f5f5f5", + "devui-shadow": "rgba(37, 43, 58, 0.2)", + "devui-light-shadow": "rgba(37, 43, 58, 0.1)", + "devui-connected-overlay-shadow": "rgba(37, 43, 58, 0.12)", + "devui-feedback-overlay-shadow": "rgba(37, 43, 58, 0.16)", + "devui-icon-text": "#71757f", + "devui-icon-bg": "#ffffff", + "devui-icon-fill": "#71757f", + "devui-icon-fill-weak": "#babbc0", + "devui-icon-fill-hover": "#252b3a", + "devui-icon-fill-active": "#252b3a", + "devui-icon-fill-active-hover": "#252b3a", + "devui-shape-icon-fill": "#d7d8da", + "devui-shape-icon-fill-hover": "#babbc0", + "devui-shape-icon-fill-active": "#babbc0", + "devui-shape-icon-fill-disabled": "#f5f5f5", + "devui-form-control-line": "#d7d8da", + "devui-form-control-bg": "#ffffff", + "devui-form-control-line-hover": "#9b9fa8", + "devui-form-control-line-active": "#5e7ce0", + "devui-form-control-line-active-hover": "#344899", + "devui-list-item-active-bg": "#f2f5fc", + "devui-list-item-active-text": "#252b3a", + "devui-list-item-active-hover-bg": "#f2f5fc", + "devui-list-item-hover-bg": "#f2f2f3", + "devui-list-item-hover-text": "#252b3a", + "devui-list-item-selected-bg": "#f2f5fc", + "devui-list-item-strip-bg": "#f2f5fc", + "devui-disabled-bg": "#f5f5f5", + "devui-disabled-line": "#dfe1e6", + "devui-disabled-text": "#cfd0d3", + "devui-primary-disabled": "#beccfa", + "devui-icon-fill-active-disabled": "#beccfa", + "devui-label-bg": "#e9edfa", + "devui-connected-overlay-bg": "#ffffff", + "devui-connected-overlay-line": "#526ecc", + "devui-fullscreen-overlay-bg": "#ffffff", + "devui-feedback-overlay-bg": "#464d6e", + "devui-feedback-overlay-text": "#dfe1e6", + "devui-embed-search-bg": "#f2f2f3", + "devui-embed-search-bg-hover": "#eef0f5", + "devui-float-block-shadow": "rgba(94, 124, 224, 0.3)", + "devui-highlight-overlay": "rgba(255, 255, 255, 0.8)", + "devui-range-item-hover-bg": "#e9edfa", + "devui-primary": "#5e7ce0", + "devui-primary-hover": "#7693f5", + "devui-primary-active": "#344899", + "devui-contrast-hover": "#d64a52", + "devui-contrast-active": "#b12220", + "devui-danger-line": "#f66f6a", + "devui-danger-bg": "#ffd5d4", + "devui-warning-line": "#fa9841", + "devui-warning-bg": "#ffe1c7", + "devui-info-line": "#5e7ce0", + "devui-info-bg": "#e9edfa", + "devui-success-line": "#50d4ab", + "devui-success-bg": "#cffcee", + "devui-primary-line": "#5e7ce0", + "devui-primary-bg": "#f2f5fc", + "devui-default-line": "#5e7ce0", + "devui-default-bg": "#f7f8fa", + "devui-shadow-length-base": "0 1px 4px 0", + "devui-shadow-length-slide-left": "-2px 0 8px 0", + "devui-shadow-length-slide-right": "2px 0 8px 0", + "devui-shadow-length-connected-overlay": "0 4px 8px 0", + "devui-shadow-length-hover": "0 8px 16px 0", + "devui-shadow-length-feedback-overlay": "0 8px 16px 0", + "devui-shadow-length-fullscreen-overlay": "0 12px 24px 0", + "devui-border-radius": "4px", + "devui-border-radius-feedback": "4px", + "devui-border-radius-card": "8px", + "devui-border-radius-full": "100px", + "devui-font-size": "14px", + "devui-font-size-card-title": "16px", + "devui-font-size-page-title": "16px", + "devui-font-size-modal-title": "18px", + "devui-font-size-price": "20px", + "devui-font-size-data-overview": "24px", + "devui-font-size-icon": "16px", + "devui-font-size-sm": "12px", + "devui-font-size-md": "14px", + "devui-font-size-lg": "14px", + "devui-font-title-weight": "bold", + "devui-font-content-weight": "normal", + "devui-line-height-base": "1.5", + "devui-animation-ease-in-smooth": "cubic-bezier(0.645, 0.045, 0.355, 1)", + "devui-animation-duration-slow": "300ms", + "devui-animation-duration-base": "200ms", + "devui-animation-duration-fast": "100ms", + "devui-animation-ease-in": "cubic-bezier(0.5, 0, 0.84, 0.25)", + "devui-animation-ease-out": "cubic-bezier(0.16, 0.75, 0.5, 1)", + "devui-animation-ease-in-out": "cubic-bezier(0.5, 0.05, 0.5, 0.95)", + "devui-animation-ease-in-out-smooth": "cubic-bezier(0.645, 0.045, 0.355, 1)", + "devui-animation-linear": "cubic-bezier(0, 0, 1, 1)", + "devui-z-index-full-page-overlay": "1080", + "devui-z-index-pop-up": "1060", + "devui-z-index-dropdown": "1052", + "devui-z-index-modal": "1050", + "devui-z-index-drawer": "1040", + "devui-z-index-framework": "1000", + + "devui-btn-sm-padding": "0 12px", + "devui-btn-padding": "0 16px", + "devui-btn-lg-padding": "0 20px", + "devui-btn-common-bg": "#ebebeb", + "devui-btn-common-border-color": "transparent", + "devui-btn-common-bg-hover": "#d1d1d1", + "devui-btn-common-color-hover": "#252b3a", + "devui-btn-common-border-color-hover": "transparent", + "devui-btn-common-bg-active": "#BDBDBD", + "devui-btn-common-color-active": "#252b3a", + "devui-btn-common-border-color-active": "transparent", + "devui-btn-common-border-disabled": "transparent", + "devui-icon-hover-bg": "#ebebeb", + "devui-icon-active-bg": "#d1d1d1" +} diff --git a/packages/theme/src/theme/infinity-theme/index.js b/packages/theme/src/theme/infinity-theme/index.js new file mode 100644 index 000000000..87e187880 --- /dev/null +++ b/packages/theme/src/theme/infinity-theme/index.js @@ -0,0 +1,401 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +export const infinityTheme = { + 'ti-common-border-radius-normal': 'var(--ti-common-border-radius-1)', + 'ti-common-font-size-base': 'var(--ti-common-font-size-1)', + 'ti-common-color-line-dividing': '#f2f2f3', + 'ti-base-color-warning-normal': '#fac20a', + 'ti-base-color-warning-hover': '#ffd138', + 'ti-base-color-warning-active': '#ffd138', + 'ti-base-color-danger-normal': '#c7000b', + 'ti-base-color-danger-hover': '#d64a52', + 'ti-base-color-danger-active': '#d64a52', + 'ti-base-color-success-normal': '#50d4ab', + 'ti-base-color-success-hover': '#6ddebb', + 'ti-base-color-success-active': '#6ddebb', + 'ti-base-color-info-normal': '#252b3a', + 'ti-base-color-info-hover': '#575d5c', + 'ti-base-color-info-active': '#575d5c', + 'ti-base-color-border': '#d7d8da', + 'ti-base-color-brand-5': '#526ecc', + 'ti-base-size-height-normal': '32px', + 'ti-base-box-shadow': '0 4px 8px 0 rgba(37,43,58,.2)', + 'ti-base-color-hover-background': '#f2f2f3', + 'ti-base-color-selected-background': '#f2f5fc', + 'ti-base-dropdown-gap': '8px', + 'ti-common-color-bg-disabled': '#f5f5f5', + + 'ti-button-size-normal-height': 'var(--ti-common-space-8x)', + 'ti-button-normal-background-color': '#ebebeb', + 'ti-button-normal-border-color': 'var(--ti-base-color-transparent)', + 'ti-button-normal-text-color': 'var(--ti-base-color-common-7)', + 'ti-button-padding-vertical': '0', + 'ti-button-padding-horizontal': 'var(--ti-common-space-4x)', + 'ti-button-normal-hover-background-color': '#d1d1d1', + 'ti-button-normal-hover-border-color': 'var(--ti-base-color-transparent)', + 'ti-button-normal-hover-text-color': 'var(--ti-base-color-common-7)', + 'ti-button-text-color': '#526ecc', + 'ti-button-text-color-hover': 'var(--ti-base-color-brand-8)', + 'ti-autocomplete-suggestion-border-color': '#fff', + 'ti-autocomplete-suggestion-bg-color': '#fff', + 'ti-autocomplete-li-hover-bg-color': 'var(--ti-base-color-hover-background)', + 'ti-autocomplete-li-select-bg-color': '#f2f5fc', + 'ti-autocomplete-li-height': '36px', + 'ti-checkbox-border-color': '#d7d8da', + 'ti-checkbox-border-color-hover': '#252b3a', + 'ti-checkbox-icon-height': '6px', + 'ti-checkbox-icon-width': '3px', + 'ti-checkbox-icon-top': '2px', + 'ti-picker-panel-border-color': '#fff', + 'ti-radio-inner-size': '10px', + 'ti-radio-bordered-checked-hover-border-color': 'var(--ti-base-color-brand-8)', + 'ti-radio-bordered-border-color': '#d7d8da', + 'ti-radio-input-disabled-bg-color': '#f5f5f5', + 'ti-switch-off-bg-color': '#d7d8da', + 'ti-link-default-text-color': 'var(--ti-base-color-brand-7)', + 'ti-link-default-hover-text-color': 'var(--ti-base-color-brand-8)', + 'ti-numeric-input-normal-height': 'var(--ti-base-size-height-normal)', + 'ti-numeric-input-width': '140px', + 'ti-slider-height': '5px', + 'ti-slider-range-height': '5px', + 'ti-slider-handle-border-radius': '50%', + 'ti-slider-handle-width': '14px', + 'ti-slider-handle-height': '14px', + 'ti-slider-range-top': '0', + 'ti-slider-handle-top': '0', + 'ti-slider-border-radius': '100px', + 'ti-slider-range-border-radius': '100px', + 'ti-slider-handle-border-weight': '2px', + 'ti-slider-range-hover-bg-color': '#7693f5', + 'ti-slider-handle-icon-display': 'none', + 'ti-slider-tips-margin-left': '0', + 'ti-slider-handle-transform': 'scale(1.3)', + 'ti-slider-range-margin-top': '0', + 'ti-slider-handle-margin-top': '-5px', + 'ti-slider-handle-margin-horizontal': '-8px', + 'ti-slider-handle-margin-bottom': '0', + 'ti-slider-margin-vertical': '-8px', + 'ti-slider-margin-right': '0', + 'ti-slider-margin-left': '-4px', + 'ti-time-panel-border-color': 'transparent', + 'ti-time-panel-box-shadow': 'var(--ti-base-box-shadow)', + 'ti-time-spinner-item-font-weight': 'normal', + 'ti-time-panel-content-split-line-display': 'none', + 'ti-time-spinner-item-bg-color': '#f2f5fc', + 'ti-time-spinner-list-border-color': 'var(--ti-common-color-line-dividing)', + 'ti-time-panel-btn-cancel-display': 'none', + 'ti-time-panel-btn-confirm-text-color': 'var(--ti-base-color-info-normal)', + 'ti-time-panel-btn-bg-color': '#EBEBEB', + 'ti-time-panel-btn-padding-vertical': '0', + 'ti-time-panel-btn-padding-horizontal': '12px', + 'ti-time-panel-btn-height': '24px', + 'ti-time-panel-btn-min-width': '56px', + 'ti-time-panel-btn-font-weight': 'normal', + 'ti-time-panel-btn-confirm-hover-bg-color': 'var(--ti-button-normal-hover-background-color)', + 'ti-tree-node-content-current-bg-color': 'var(--ti-base-color-selected-background)', + 'ti-tree-node-content-hover-bg-color': 'var(--ti-base-color-hover-background)', + // tabs + 'ti-tabs-header-font-active-border-color': 'var(--ti-base-color-common-7)', + 'ti-tabs-header-text-color': 'var(--ti-base-color-common-7)', + 'ti-tabs-header-font-normal-text-color': '#71757f', + 'ti-tabs-item-margin-right': 'var(--ti-common-space-8x)', + 'ti-tabs-item-padding-horizontal': 'var(--ti-common-space-4x)', + 'ti-tabs-item-vertical-padding-horizontal': 'var(--ti-common-space-5x)', + 'ti-tabs-item-active-border-weight': '2px', + 'ti-tabs-item-active-border-style': 'solid', + 'ti-tabs-item-active-border-color': 'var(--ti-tabs-header-font-active-border-color)', + 'ti-tabs-item-bottom-border-weight': '1px', + 'ti-tabs-item-bottom-border-style': 'solid', + 'ti-tabs-item-bottom-border-color': '#f2f2f3', + 'ti-tabs-item-card-active-bg-color': '#f7f7f9', + 'ti-tabs-item-card-border-radius': 'var(--ti-common-border-radius-1) var(--ti-common-border-radius-1) 0 0', + 'ti-tabs-icon-close-default-bg-color': '#d7d8da', + 'ti-tabs-icon-close-hover-bg-color': 'var(--ti-base-color-common-7)', + 'ti-tabs-icon-close-default-text-color': 'var(--ti-base-color-white)', + 'ti-tabs-icon-close-hover-text-color': 'var(--ti-base-color-white)', + 'ti-tabs-icon-size-close': '12px', + 'ti-tabs-icon-close-margin-vertical': '0', + 'ti-tabs-icon-close-margin-right': '0', + 'ti-tabs-icon-close-margin-left': 'var(--ti-common-space-3x)', + // popover + 'ti-popover-box-shadow': '0 8px 16px 0 rgba(37,43,58,.2)', + 'ti-popover-text-color': '#dfe1e6', + 'ti-popover-bg-color': '#464d6e', + 'ti-popover-border-color': 'transparent', + 'ti-popover-title-text-color': '#dfe1e6', + 'ti-popover-arrow-border-color': 'var(--ti-popover-bg-color)', + 'ti-popover-placement-arrow-after-border-color': 'var(--ti-popover-arrow-border-color)', + 'ti-popover-padding-vertical': '8px', + 'ti-popover-padding-horizontal': '14px', + // tooltip + 'ti-tooltip-box-shadow': '0 8px 16px 0 rgba(37,43,58,.2)', + 'ti-tooltip-popper-border-color': '#464d6e', + 'ti-tooltip-popper-dark-bg-color': '#464d6e', + 'ti-tooltip-popper-light-text-color': '#464d6e', + 'ti-tooltip-popper-light-border-color': '#464d6e', + 'ti-tooltip-padding-vertical': '8px', + 'ti-tooltip-padding-horizontal': '14px', + 'ti-tooltip-color': '#dfe1e6', + 'ti-tooltip-popper-dark-text-color': '#dfe1e6', + + 'ti-dropdown-menu-padding-vertical': '12px', + 'ti-dropdown-menu-padding-horizontal': '12px', + 'ti-dropdown-menu-box-shadow': 'var(--ti-base-box-shadow)', + 'ti-dropdown-menu-margin-vertical': '8px', + 'ti-dropdown-menu-item-height': '36px', + 'ti-dropdown-menu-item-padding-vertical': '0', + 'ti-dropdown-menu-item-padding-horizontal': '12px', + 'ti-dropdown-menu-item-hover-bg-color': '#f2f2f3', + 'ti-dropdown-menu-item-active-bg-color': 'var(--ti-dropdown-menu-item-hover-bg-color)', + 'ti-dropdown-menu-item-text-color': '#252b3a', + 'ti-dropdown-menu-item-hover-text-color': 'var(--ti-dropdown-menu-item-text-color)', + 'ti-dropdown-menu-item-active-text-color': 'var(--ti-dropdown-menu-item-text-color)', + 'ti-dropdown-menu-item-border-radius': 'var(--ti-common-border-radius-normal)', + 'ti-dropdown-menu-item-disabled-text-color': '#cfd0d3', + 'ti-dropdown-menu-item-max-width': '100%', + 'ti-split-trigger-bg-color': '#f2f2f3', + 'ti-split-trigger-bar-bg-color': 'var(--ti-split-trigger-bg-color)', + 'ti-split-trigger-hover-bg-color': '#7693f5', + 'ti-split-trigger-bar-hover-bg-color': 'var(--ti-split-trigger-hover-bg-color)', + 'ti-split-trigger-size': '2px', + 'ti-split-trigger-bar-margin-left': '2px', + 'ti-split-trigger-bar-margin-top': '2px', + 'ti-split-trigger-con-col-cursor': 'col-resize', + 'ti-split-trigger-con-row-cursor': 'row-resize', + 'ti-picker-panel-box-shadow': 'var(--ti-base-box-shadow)', + 'ti-date-picker-width': '249px', + 'ti-date-picker-font-size': '12px', + 'ti-date-table-td-today-border-color': 'transparent', + 'ti-date-table-td-today-text-color': 'var(--ti-base-color-brand-6)', + 'ti-date-picker-current-border-radius': 'var(--ti-common-border-radius-normal)', + 'ti-date-picker-hover-bg-color': 'var(--ti-base-color-selected-background)', + 'ti-date-table-td-width': '30px', + 'ti-date-table-td-height': '22px', + 'ti-date-table-td-padding-vertical': '0', + 'ti-date-table-td-padding-horizontal': '4px', + 'ti-date-table-td-span-width': '22px', + 'ti-date-table-td-span-height': '22px', + 'ti-date-editor-input-icon-color-fill': '#d7d8da', + // grid + 'ti-grid-header-background-color': '#fff', + 'ti-grid-header-column-height': '42px', + 'ti-grid-icon-fill-hover-bg-color': '#252b3a', + // modal + 'ti-modal-box-width': '346px', + 'ti-modal-header-padding-top': '20px', + 'ti-modal-header-padding-horizontal': '20px', + 'ti-modal-header-padding-bottom': '0', + 'ti-modal-close-btn-font-size': '32px', + 'ti-modal-body-padding-top': '20px', + 'ti-modal-body-padding-horizontal': '20px', + 'ti-modal-body-padding-bottom': '0', + 'ti-modal-footer-padding-top': '18px', + 'ti-modal-footer-padding-horizontal': '32px', + 'ti-modal-footer-padding-bottom': '20px', + 'ti-modal-close-btn-top': '18px', + 'ti-modal-close-btn-scale': 'scale(1)', + 'ti-modal-btn-text-color': '#71757f', + 'ti-modal-close-btn-background-color-hover': '#ebebeb', + 'ti-modal-footer-default-display-button': 'none', + 'ti-modal-box-shadow': '0 12px 24px 0 rgba(37,43,58,.2)', + 'ti-modal-footer-btn-border-radius': '4px', + 'ti-modal-box-border-radius': '8px', + 'ti-modal-close-btn-padding-horizontal-vertical': '5px', + // pager + 'ti-pager-input-height': '26px', + 'ti-pager-normal-text-color': '#71757f', + 'ti-pager-poplist-item-padding-vertical': '0', + 'ti-pager-poplist-item-padding-horizontal': '10px', + 'ti-pager-poplist-item-unchecked-box-shadow': ' 0 1px 3px 0 rgba(37, 43, 58, 0.1)', + 'ti-pager-poplist-item-hover-bg-color': 'transparent', + 'ti-pager-poplist-item-hover-border-color': 'var(--ti-common-color-line-dividing)', + 'ti-pager-poplist-item-hover-text-color': 'var(--ti-base-color-info-normal)', + // alert + 'ti-alert-success-bg-color': '#cffcee', + 'ti-alert-description-font-size': '14px', + 'ti-alert-success-border-color': 'transparent', + 'ti-alert-warning-border-color': 'transparent', + 'ti-alert-info-border-color': 'transparent', + 'ti-alert-error-border-color': 'transparent', + 'ti-alert-nomal-content-line-height': '18px', + 'ti-alert-info-bg-color': 'var(--ti-base-color-brand-2)', + 'ti-alert-warning-bg-color': '#ffe1c7', + 'ti-alert-error-bg-color': '#ffd5d4', + 'ti-alert-close-font-size': '15px', + // steps + 'ti-steps-icon-size': '24px', + 'ti-steps-done-icon-bg-color': 'var(--ti-base-color-success-normal)', + 'ti-steps-done-active-border-color': 'var(--ti-base-color-success-normal)', + 'ti-steps-done-icon-fill-color': '#fff', + 'ti-steps-line-active-bg-color': 'var(--ti-base-color-border)', + 'ti-steps-line-height': '1px', + 'ti-steps-done-text-color': 'var(--ti-base-color-success-normal)', + // tag + 'ti-tag-border-radius': 'var(--ti-common-border-radius-1)', + 'ti-tag-height': 'var(--ti-common-size-5x)', + 'ti-tag-close-font-size': 'var(--ti-common-font-size-base)', + // transfer + 'ti-transfer-panel-width': '300px', + 'ti-transfer-header-bg-color': '#fff', + 'ti-transfer-header-border-color': 'var(--ti-common-color-line-dividing)', + 'ti-transfer-panel-body-height': '320px', + 'ti-transfer-panel-body-filter-height': '276px', + 'ti-transfer-panel-item-height': '36px', + 'ti-transfer-header-span-text-color': '#71757f', + 'ti-transfer-button-border-radius': '100%', + 'ti-transfer-button-disabled-bg-color': 'var(--ti-common-color-bg-disabled)', + // badge + 'ti-badge-size': 'var(--ti-common-size-4x)', + 'ti-badge-font-weight': 'var(--ti-common-font-weight-4)', + 'ti-badge-border-radius': '100px', + // carousel + 'ti-carousel-arrow-hover-bg-color': 'ti-base-color-selected-background', + 'ti-carousel-arrow-bg-color': 'rgba(255,255,255,0.8)', + 'ti-carousel-arrow-box-shadow': '0 8px 16px 0 rgba(37,43,58,.1)', + 'ti-carousel-arrow-active-text-color': 'var(--ti-base-color-common-7)', + 'ti-carousel-arrow-width': 'var(--ti-base-size-width-small)', + 'ti-carousel-arrow-height': 'var(--ti-base-size-width-small)', + 'ti-carousel-indicators-bg-color': 'none', + 'ti-carousel-indicator-button-bg-color': '#71757f', + 'ti-carousel-indicator-button-width': '6px', + 'ti-carousel-indicator-button-height': '6px', + 'ti-carousel-indicator-margin-right': 'var(--ti-common-size-2x)', + 'ti-carousel-indicator-active-text-color': 'var(--ti-base-color-info-normal)', + 'ti-carousel-indicator-active-border-radius': 'var(--ti-common-border-radius-1)', + 'ti-carousel-indicator-active-width': 'var(--ti-common-size-6x)', + 'ti-carousel-hover-opacity': '1', + 'ti-carousel-indicator-active-transition': 'all 0.1s cubic-bezier(0.645,0.045,0.355,1)', + 'ti-carousel-indicator-active-background-color': '#71757f', + 'ti-carousel-indicator-active-button-width': 'var(--ti-common-size-6x)', + 'ti-carousel-indicator-padding-vertical': '0', + 'ti-carousel-indicator-padding-horizontal': '0', + 'ti-carousel-indicator-active-transition-property': 'width', + // dialog-box + 'ti-dialogbox-border-radius': 'var(--ti-common-border-radius-2)', + 'ti-dialogbox-head-padding-top': '20px', + 'ti-dialogbox-head-padding-horizontal': '20px', + 'ti-dialogbox-head-padding-bottom': '0', + 'ti-dialogbox-btn-background-color-hover': '#ebebeb', + 'ti-dialogbox-head-font-icon-size': '20px', + 'ti-dialogbox-close-icon-color': '#71757f', + 'ti-dialogbox-close-icon-color-hover': '#71757f', + 'ti-dialogbox-box-body-padding-vertical': '20px', + 'ti-dialogbox-box-body-padding-horizontal': '20px', + 'ti-dialogbox-box-body-margin-bottom': '0', + 'ti-dialogbox-box-shadow': '0 12px 24px 0 rgba(37,43,58,.2)', + // notify + 'ti-notify-max-width': '280px', + 'ti-notify-bg-color': '#464d6e', + 'ti-notify-text-color': 'var(--ti-base-color-common-1)', + 'ti-notify-info-bg-color': 'var(--ti-notify-bg-color)', + 'ti-notify-warning-bg-color': 'var(--ti-notify-bg-color)', + 'ti-notify-error-bg-color': 'var(--ti-notify-bg-color)', + 'ti-notify-success-bg-color': 'var(--ti-notify-bg-color)', + 'ti-alert-info-icon-color': 'var(--ti-base-color-brand-6)', + 'ti-alert-warning-icon-color': 'var(--ti-base-color-warn-4)', + 'ti-alert-error-icon-color': 'var(--ti-base-color-error-3)', + 'ti-alert-success-icon-color': 'var(--ti-base-color-success-3)', + 'ti-notify-close-icon-color': 'var(--ti-base-color-common-1)', + 'ti-notify-title-text-color': 'var(--ti-base-color-common-1)', + 'ti-notify-title-margin-top': '0', + 'ti-notify-title-margin-horizontal': '', + 'ti-notify-title-margin-bottom': '8px', + 'ti-notify-title-height': '25px', + 'ti-notify-title-line-height': '25px', + 'ti-notify-title-font-size': 'var(--ti-common-font-size-1)', + 'ti-notify-content-font-size': 'var(--ti-common-font-size-1)', + 'ti-notify-icon-size': 'var(--ti-common-font-size-2)', + 'ti-notify-message-margin-vertical': '6px', + 'ti-notify-message-margin-right': 0, + 'ti-notify-message-margin-left': 0, + 'ti-notify-border-radius': 'var(--ti-common-border-radius-1)', + // image-preview + 'ti-image-viewer-close-bg-color': 'rgba(255,255,255,0.8)', + 'ti-image-viewer-text-color': '#71757f', + 'ti-image-viewer-close-top': '55px', + 'ti-image-viewer-close-right': '20px', + 'ti-image-viewer-close-width': 'var(--ti-common-size-9x)', + 'ti-image-viewer-close-height': 'var(--ti-common-size-9x)', + 'ti-image-viewer-close-font-size': '18px', + 'ti-image-viewer-actions-width': '100%', + 'ti-image-viewer-actions-height': '50px', + 'ti-image-viewer-actions-bottom': '0', + 'ti-image-viewer-actions-border-radius': 'none', + 'ti-image-viewer-actions-inner-justify-content': 'center', + 'ti-image-viewer-actions-inner-font-size': '18px', + 'ti-image-viewer-actions-inner-text-color': '#71757f', + 'ti-image-viewer-next-width': '36px', + 'ti-image-viewer-next-height': '36px', + 'ti-image-viewer-mask-wrap-bg-color': 'rgba(37,43,58,.2)', + 'ti-image-viewer-close-bg-color-hover': 'var(--ti-base-color-selected-background)', + 'ti-image-viewer-btn-opacity': '1', + 'ti-image-viewer-mask-bg-color': 'transparent', + // input + 'ti-input-border-radius': 'var(--ti-common-border-radius-1)', + 'ti-input-hover-border-color': 'var(--ti-base-color-border-hover)', + 'ti-input-active-border-color': 'var(--ti-base-color-brand-7)', + 'ti-input-height': '32px', + 'ti-input-mini-height': '24px', + 'ti-input-small-height': '32px', + 'ti-input-medium-height': '40px', + // cascader + 'ti-cascader-width': '300px', + 'ti-cascader-medium-line-height': 'var(--ti-input-medium-height)', + 'ti-cascader-small-line-height': 'var(--ti-input-small-height)', + 'ti-cascader-mini-line-height': 'var(--ti-input-mini-height)', + 'ti-cascader-menu-list-padding-vertical': 'var(--ti-common-space-3x)', + 'ti-cascader-menu-list-padding-horizontal': 'var(--ti-common-space-3x)', + 'ti-cascader-panel-node-height': '36px', + 'ti-cascader-node-selectable-hover-bg-color': '#f2f2f3', + 'ti-cascader-node-selectable-hover-text-color': 'var(--ti-base-color-brand-7)', + 'ti-cascader-node-disabled-text-color': '#cfd0d3', + 'ti-cascader-node-disabled-bg-color': '#f5f5f5', + 'ti-cascader-node-icon-color': 'var(--ti-base-color-common-7)', + 'ti-cascader-panel-node-label-padding-vertical': '0', + 'ti-cascader-panel-node-label-padding-right': '30px', + 'ti-cascader-panel-node-label-padding-left': '12px', + 'ti-cascader-node-prefix-display': 'none', + 'ti-cascader-node-label-padding-vertical': 0, + 'ti-cascader-node-label-padding-horizontal': 0, + 'ti-cascader-dropdown-box-shadow': '0 4px 8px 0 rgba(37, 43, 58, 0.2)', + 'ti-cascader-dropdown-border-color': 'var(--ti-cascader-dropdown-bg-color)', + 'ti-cascader-menu-border-color': 'var(--ti-base-color-hover-background)', + 'ti-cascader-node-hover-bg-color': 'var(--ti-base-color-hover-background)', + 'ti-cascader-menu-width': '200px', + 'ti-cascader-panel-node-margin-top': 'var(--ti-common-space-base)', + 'ti-cascader-tag-bg-color': 'var(--ti-base-color-brand-2)', + 'ti-tag-info-text-color': '#71757f', + 'ti-cascader-hover-border-color': '#71757f', + 'ti-cascader-focus-border-color': 'var(--ti-base-color-brand-6)', + 'ti-cascader-node-selectable-text-color': 'var(--ti-base-color-brand-7)', + 'ti-cascader-node-hover-text-color': 'var(--ti-base-color-brand-7)', + // select + 'ti-select-input-caret-text-color': 'var(--ti-base-color-common-5)', + 'ti-select-input-caret-hover-text-color': 'var(--ti-base-color-common-7)', + // option + 'ti-select-dropdown-list-padding-top': 'var(--ti-common-space-3x)', + 'ti-select-dropdown-list-padding-horizontal': 'var(--ti-common-space-3x)', + 'ti-select-dropdown-list-padding-bottom': 'var(--ti-common-space-3x)', + 'ti-select-dropdown-border-color': 'var(--ti-base-color-white)', + 'ti-select-dropdown-item-padding-vertical': '0', + 'ti-select-dropdown-item-padding-horizontal': 'var(--ti-common-space-3x)', + 'ti-select-dropdown-item-margin-top': 'var(--ti-common-space-base)', + 'ti-select-dropdown-item-height': '36px', + 'ti-select-dropdown-item-selected-text-color': 'var(--ti-base-color-info-normal)', + 'ti-select-dropdown-item-selected-bg-color': 'var(--ti-base-color-brand-1)', + // form-item + 'ti-form-item-error-text-color': 'var(--ti-base-color-error-3)', + 'ti-form-item-error-bg-color': '#ffd5d4', + // search + 'ti-search-input-btn-width': 'var(--ti-base-size-height-minor)' +} diff --git a/packages/theme/src/theme/infinity-theme/index.json b/packages/theme/src/theme/infinity-theme/index.json new file mode 100644 index 000000000..a60ffba2e --- /dev/null +++ b/packages/theme/src/theme/infinity-theme/index.json @@ -0,0 +1,5 @@ +{ + "ti-base-color-brand-6": "#5e7ce0", + "ti-base-color-common-7": "#252b3a", + "ti-button-normal-background-color": "#ebebeb" +} diff --git a/packages/theme/src/time/index.js b/packages/theme/src/time/index.js new file mode 100644 index 000000000..fad351783 --- /dev/null +++ b/packages/theme/src/time/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // time +} diff --git a/packages/theme/src/time/index.less b/packages/theme/src/time/index.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/time/index.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/time/vars.less b/packages/theme/src/time/vars.less new file mode 100644 index 000000000..229917d52 --- /dev/null +++ b/packages/theme/src/time/vars.less @@ -0,0 +1,12 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + diff --git a/packages/theme/src/tip/index.js b/packages/theme/src/tip/index.js new file mode 100644 index 000000000..307294772 --- /dev/null +++ b/packages/theme/src/tip/index.js @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-tips-normal-bg-color': '#666', + 'tiny-tips-normal-text-color': '#fff', + 'tiny-tips-error-bg-color': '#ff7875', + 'tiny-tips-error-text-color': '#fff', + 'tiny-tips-succeed-bg-color': '#52c41a', + 'tiny-tips-succeed-text-color': '#fff', + 'tiny-tips-warning-bg-color': '#fa8c16', + 'tiny-tips-warning-text-color': '#fff', + 'tiny-tips-infor-bg-color': '#d9d9d9', + 'tiny-tips-infor-text-color': '#333', + 'tiny-tips-bg-color': '#ff7875', + 'tiny-tips-border-radius': '2px', + 'tiny-tips-height': '26px' +} diff --git a/packages/theme/src/tip/index.less b/packages/theme/src/tip/index.less new file mode 100644 index 000000000..241c6c2b2 --- /dev/null +++ b/packages/theme/src/tip/index.less @@ -0,0 +1,211 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/tip.less'; +@import '../custom.less'; +@import './vars.less'; + +@tips-prefix-cls: ~'@{css-prefix}tips'; + +.@{tips-prefix-cls} { + .component-css-vars-tip(); + + z-index: 900; + position: absolute; + padding: var(--ti-tips-padding); + background: var(--ti-tips-bg-color); + border-radius: var(--ti-tips-border-radius); + color: var(--ti-tips-color-infor); + min-height: var(--ti-tips-height); + text-align: center; + line-height: var(--ti-tips-height); + + .@{css-prefix-iconfont} { + color: var(--ti-tips-color-infor); + line-height: 36px; + } + + > span { + float: left; + top: -5px; + } + + &:before { + .tip-arrow(-4px; 50%; -4px); + .tip-make-arrow( + 4px 4px 4px 0; transparent var(--ti-tips-bg-color) + ); + } + + span + p { + max-width: 300px; + max-height: 100px; + word-break: break-all; + -webkit-box-orient: vertical; + -webkit-line-clamp: 3; + overflow: auto; + } + + .@{css-prefix}small-close { + position: absolute; + cursor: pointer; + right: 8px; + top: -5px; + } + + .icon-remove + p, + .icon-remove + p, + .icon-successful + p { + margin-left: 0; + } + + &.tips-bottom { + top: -5px; + left: 0; + + &:before { + .tip-arrow(50%; -4px; 0); + .tip-make-arrow( + 0 4px 4px 4px; var(--ti-tips-bg-color) transparent + ); + margin-left: -6px; + } + } + + &.tips-left { + &:before { + .tip-arrow(auto; 50%; -4px); + .tip-make-arrow( + 4px 0 4px 4px; transparent var(--ti-tips-bg-color) + ); + right: -4px; + } + } + + &.tips-top { + top: -5px; + left: 0; + + &:before { + .tip-arrow(50%; auto; auto); + .tip-make-arrow( + 4px 4px 0 4px; var(--ti-tips-bg-color) transparent + ); + margin-left: -6px; + bottom: -4px; + margin-bottom: 0; + } + } + + &.tips-top-left { + top: -5px; + left: 0; + + &:before { + .tip-arrow(0%; auto; auto); + .tip-make-arrow( + 4px 4px 0 4px; var(--ti-tips-bg-color) transparent + ); + margin-left: 10px; + bottom: -4px; + margin-bottom: 0; + } + } + + &.tips-top-right { + top: -5px; + left: 0; + + &:before { + .tip-arrow(100%; auto; auto); + .tip-make-arrow( + 4px 4px 0 4px; var(--ti-tips-bg-color) transparent + ); + margin-left: -16px; + bottom: -4px; + margin-bottom: 0; + } + } + + &.tips-bottom-left { + top: -5px; + left: 0; + + &:before { + .tip-arrow(0%; -4px; 0); + .tip-make-arrow( + 0 4px 4px 4px; var(--ti-tips-bg-color) transparent + ); + margin-left: 10px; + } + } + + &.tips-bottom-right { + top: -5px; + left: 0; + + &:before { + .tip-arrow(100%; -4px; 0); + .tip-make-arrow( + 0 4px 4px 4px; var(--ti-tips-bg-color) transparent + ); + margin-left: -16px; + } + } + + &.tips-error { + .tip-variant( + var(--ti-tips-error-bg-color) ; + var(--ti-tips-error-text-color) ; 0 0 4px + var(--ti-tips-error-bg-color) ; 0 + ); + } + + &.tips-warning { + .tip-variant( + var(--ti-tips-warning-bg-color) ; + var(--ti-tips-warning-text-color) ; 0 0 4px + var(--ti-tips-warning-bg-color) ; 0 + ); + } + + &.tips-succeed { + .tip-variant( + var(--ti-tips-succeed-bg-color) ; + var(--ti-tips-succeed-text-color) ; 0 0 4px + var(--ti-tips-succeed-bg-color) ; 0 + ); + } + + &.tips-infor { + .tip-variant( + var(--ti-tips-infor-bg-color) ; + var(--ti-tips-infor-text-color) ; 0 0 4px + var(--ti-tips-infor-bg-color) ; 0 + ); + } + + &.tips-normal { + .tip-variant( + var(--ti-tips-normal-bg-color) ; + var(--ti-tips-normal-text-color) ; 0 0 4px + var(--ti-tips-normal-bg-color) ; 0 + ); + } + + // Grid表头提示显示时隐藏simplesort箭头 + .grid-innercell { + .grid-simplesort { + display: none; + } + } +} diff --git a/packages/theme/src/tip/vars.less b/packages/theme/src/tip/vars.less new file mode 100644 index 000000000..44d9e5ed3 --- /dev/null +++ b/packages/theme/src/tip/vars.less @@ -0,0 +1,32 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-tip() { + --ti-tips-normal-bg-color: var(--ti-base-color-secondary); + --ti-tips-normal-text-color: var(--ti-base-color-light); + + --ti-tips-error-bg-color: #ff7875; + --ti-tips-error-text-color: var(--ti-base-color-light); + + --ti-tips-succeed-bg-color: var(--ti-base-color-success-normal); + --ti-tips-succeed-text-color: var(--ti-base-color-light); + + --ti-tips-warning-bg-color: #fa8c16; + --ti-tips-warning-text-color: var(--ti-base-color-light); + + --ti-tips-infor-bg-color: var(--ti-base-color-border); + --ti-tips-infor-text-color: var(--ti-base-color-info-normal); + + --ti-tips-bg-color: #ff7875; + --ti-tips-border-radius: var(--ti-common-border-radius-normal); + --ti-tips-height: 26px; +} diff --git a/packages/theme/src/toggle-menu/index.js b/packages/theme/src/toggle-menu/index.js new file mode 100644 index 000000000..271b21dbe --- /dev/null +++ b/packages/theme/src/toggle-menu/index.js @@ -0,0 +1,24 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-toggle-menu-width': '210px', + 'tiny-toggle-menu-font-size': '12px', + 'tiny-toggle-menu-name-text-color': '#333', + 'tiny-toggle-menu-tree-node-height': '28px', + 'tiny-toggle-menu-filter-search-size': '30px', + 'tiny-toggle-menu-filter-search-font-size': '16px', + 'tiny-toggle-menu-filter-search-icon-color': '#1890ff', + 'tiny-toggle-menu-toggle-icon-color': '#1890ff', + 'tiny-toggle-menu-toggle-icon-color-hover': '#40a9ff', + 'tiny-toggle-menu-toggle-bg-color': '#d9d9d9' +} diff --git a/packages/theme/src/toggle-menu/index.less b/packages/theme/src/toggle-menu/index.less new file mode 100644 index 000000000..a14181713 --- /dev/null +++ b/packages/theme/src/toggle-menu/index.less @@ -0,0 +1,172 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@toggle-menu-prefix-cls: ~'@{css-prefix}toggle-menu'; +@input-prefix-cls: ~'@{css-prefix}input'; +@tree-node-prefix-cls: ~'@{css-prefix}tree-node'; +@tree-prefix-cls: ~'@{css-prefix}tree'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{toggle-menu-prefix-cls} { + .component-css-vars-toggle-menu(); + + width: var(--ti-toggle-menu-width); + position: relative; + + & &__body { + cursor: pointer; + line-height: 1; + padding-left: 4px; + width: 100%; + + &, + &:hover { + text-decoration: none; + } + } + + & &__name { + color: var(--ti-toggle-menu-name-text-color); + font-size: var(--ti-toggle-menu-font-size); + } + + & &__tree { + position: relative; + } + + & &__filter { + position: relative; + margin-bottom: 4px; + width: calc(100% - 16px); + } + + & &__filter-search { + width: var(--ti-toggle-menu-filter-search-size); + height: var(--ti-toggle-menu-filter-search-size); + line-height: var(--ti-toggle-menu-filter-search-size); + display: block; + text-align: center; + position: absolute; + right: 0; + top: 0; + + .@{svg-prefix-cls} { + fill: var(--ti-toggle-menu-filter-search-icon-color); + font-size: var(--ti-toggle-menu-filter-search-font-size); + } + } + + & &__toggle { + position: absolute; + top: 0; + left: calc(100% - 14px); + z-index: 2; + width: 14px; + height: var(--ti-toggle-menu-filter-search-size); + line-height: var(--ti-toggle-menu-filter-search-size); + background: var(--ti-toggle-menu-toggle-bg-color); + cursor: pointer; + transition: 0.2s linear; + + .@{svg-prefix-cls} { + fill: var(--ti-toggle-menu-toggle-icon-color); + } + + &:hover .@{svg-prefix-cls} { + fill: var(--ti-toggle-menu-toggle-icon-color-hover); + } + } + + & &__link { + width: 100%; + } + + &.is-toggle-right { + width: 80px; + + .@{tree-node-prefix-cls}.is-current { + .@{tree-node-prefix-cls}__content { + background: none; + } + } + + .@{tree-node-prefix-cls}__content:hover { + background: none; + + .@{svg-prefix-cls} { + fill: var(--ti-toggle-menu-toggle-icon-color-hover); + } + } + } + + &.is-toggle-right &__toggle { + position: relative; + left: 0; + } + + &.is-toggle-right &__filter { + display: none; + } + + .@{tree-prefix-cls} { + &.is-wrap { + .@{tree-node-prefix-cls}__content { + height: auto; + } + + .@{toggle-menu-prefix-cls}__name { + display: inline-block; + white-space: normal; + line-height: normal; + word-break: break-word; + } + } + + &.is-overflow { + .@{toggle-menu-prefix-cls}__name { + width: calc(100% - 18px); + vertical-align: middle; + display: inline-block; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + } + + &.is-node-hide { + .@{toggle-menu-prefix-cls}__body, + .@{tree-node-prefix-cls}__children { + display: none; + } + } + } + + .@{input-prefix-cls}__inner { + font-size: var(--ti-toggle-menu-font-size); + padding-right: 30px; + border-radius: 0; + border-top: 0; + border-left: 0; + border-right: 0; + } + + .@{tree-node-prefix-cls}__content { + height: var(--ti-toggle-menu-tree-node-height); + line-height: var(--ti-toggle-menu-tree-node-height); + font-size: var(--ti-toggle-menu-font-size); + padding-left: 0; + margin-left: 0; + } +} diff --git a/packages/theme/src/toggle-menu/vars.less b/packages/theme/src/toggle-menu/vars.less new file mode 100644 index 000000000..39e3077cd --- /dev/null +++ b/packages/theme/src/toggle-menu/vars.less @@ -0,0 +1,24 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-toggle-menu() { + --ti-toggle-menu-width: 210px; + --ti-toggle-menu-font-size: var(--ti-common-font-size-base); + --ti-toggle-menu-name-text-color: var(--ti-base-color-info-normal); + --ti-toggle-menu-tree-node-height: var(--ti-common-size-7x); + --ti-toggle-menu-filter-search-size: 30px; + --ti-toggle-menu-filter-search-font-size: var(--ti-common-font-size-2); + --ti-toggle-menu-filter-search-icon-color: var(--ti-base-color-brand-6); + --ti-toggle-menu-toggle-icon-color: var(--ti-base-color-brand-6); + --ti-toggle-menu-toggle-icon-color-hover: var(--ti-base-color-brand-5); + --ti-toggle-menu-toggle-bg-color: var(--ti-base-color-border); +} diff --git a/packages/theme/src/tooltip/index.js b/packages/theme/src/tooltip/index.js new file mode 100644 index 000000000..3a3d39cd7 --- /dev/null +++ b/packages/theme/src/tooltip/index.js @@ -0,0 +1,41 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-tooltip-popper-border-radius': '4px', + 'tiny-tooltip-popper-font-size': '12px', + 'tiny-tooltip-popper-border-color': '#303133', + 'tiny-tooltip-popper-normal-bg-color': '#666', + 'tiny-tooltip-popper-normal-text-color': '#fff', + 'tiny-tooltip-popper-normal-border-color': '#666', + 'tiny-tooltip-popper-info-bg-color': '#69c0ff', + 'tiny-tooltip-popper-info-text-color': '#fff', + 'tiny-tooltip-popper-info-border-color': '#69c0ff', + 'tiny-tooltip-popper-error-bg-color': '#ff7875', + 'tiny-tooltip-popper-error-text-color': '#fff', + 'tiny-tooltip-popper-error-border-color': '#ff7875', + 'tiny-tooltip-popper-warning-bg-color': '#ffd666', + 'tiny-tooltip-popper-warning-text-color': '#fff', + 'tiny-tooltip-popper-warning-border-color': '#ffd666', + 'tiny-tooltip-popper-success-bg-color': '#95de64', + 'tiny-tooltip-popper-success-text-color': '#fff', + 'tiny-tooltip-popper-success-border-color': '#95de64', + 'tiny-tooltip-popper-dark-bg-color': '#303133', + 'tiny-tooltip-popper-dark-text-color': '#fff', + 'tiny-tooltip-popper-light-bg-color': '#fff', + 'tiny-tooltip-popper-light-text-color': '#303133', + 'tiny-tooltip-popper-light-border-color': '#303133', + 'tiny-tooltip-box-shadow': '0 4px 16px 0 rgba(0, 0, 0, 0.2)', + 'tiny-tooltip-padding-vertical': '11px', + 'tiny-tooltip-padding-horizontal': '15px', + 'tiny-tooltip-validate-icon-color': '#f66f6a' +} diff --git a/packages/theme/src/tooltip/index.less b/packages/theme/src/tooltip/index.less new file mode 100644 index 000000000..9b674a018 --- /dev/null +++ b/packages/theme/src/tooltip/index.less @@ -0,0 +1,216 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/tooltip.less'; +@import '../custom.less'; +@import './vars.less'; + +@tooltip-prefix-cls: ~'@{css-prefix}tooltip'; + +.@{tooltip-prefix-cls} { + .component-css-vars-tooltip(); + + &:focus:hover, + &:focus:not(.focusing) { + outline-width: 0; + } + + &&__popper { + position: absolute; + left: -9999px; + border-radius: var(--ti-tooltip-popper-border-radius); + padding: var(--ti-tooltip-padding-vertical) var(--ti-tooltip-padding-horizontal); + font-size: var(--ti-tooltip-popper-font-size); + line-height: 1.2; + min-width: 10px; + max-width: 450px; + z-index: 2000; + word-wrap: break-word; + box-shadow: var(--ti-tooltip-box-shadow); + + .popper__arrow, + .popper__arrow::after { + position: absolute; + display: block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + } + + .popper__arrow { + border-width: 6px; + } + + .popper__arrow::after { + content: ' '; + border-width: 5px; + } + + &[x-placement^='top'] { + margin-bottom: 12px; + + .popper__arrow { + bottom: -6px; + border-top-color: var(--ti-tooltip-popper-border-color); + border-bottom-width: 0; + + &::after { + bottom: 1px; + margin-left: -5px; + border-top-color: var(--ti-tooltip-popper-border-color); + border-bottom-width: 0; + } + } + } + + &[x-placement^='bottom'] { + margin-top: 12px; + + .popper__arrow { + top: -6px; + border-top-width: 0; + border-bottom-color: var(--ti-tooltip-popper-border-color); + + &::after { + top: 1px; + margin-left: -5px; + border-top-width: 0; + border-bottom-color: var(--ti-tooltip-popper-border-color); + } + } + } + + &[x-placement^='right'] { + margin-left: 12px; + + .popper__arrow { + left: -6px; + border-right-color: var(--ti-tooltip-popper-border-color); + border-left-width: 0; + + &::after { + bottom: -5px; + left: 1px; + border-right-color: var(--ti-tooltip-popper-border-color); + border-left-width: 0; + } + } + } + + &[x-placement^='left'] { + margin-right: 12px; + + .popper__arrow { + right: -6px; + border-right-width: 0; + border-left-color: var(--ti-tooltip-popper-border-color); + + &::after { + right: 1px; + bottom: -5px; + margin-left: -5px; + border-right-width: 0; + border-left-color: var(--ti-tooltip-popper-border-color); + } + } + } + + &.is-normal { + .tooltip-type( + var(--ti-tooltip-popper-normal-text-color), + var(--ti-tooltip-popper-normal-bg-color), + var(--ti-tooltip-popper-normal-border-color) + ); + } + + &.is-info { + .tooltip-type( + var(--ti-tooltip-popper-info-text-color), + var(--ti-tooltip-popper-info-bg-color), + var(--ti-tooltip-popper-info-border-color) + ); + } + + &.is-error { + .tooltip-type( + var(--ti-tooltip-popper-error-text-color), + var(--ti-tooltip-popper-error-bg-color), + var(--ti-tooltip-popper-error-border-color) + ); + + .tooltip-validate-icon { + fill: var(--ti-tooltip-validate-icon-color); + margin-right: 8px; + } + } + + &.is-warning { + .tooltip-type( + var(--ti-tooltip-popper-warning-text-color), + var(--ti-tooltip-popper-warning-bg-color), + var(--ti-tooltip-popper-warning-border-color) + ); + } + + &.is-success { + .tooltip-type( + var(--ti-tooltip-popper-success-text-color), + var(--ti-tooltip-popper-success-bg-color), + var(--ti-tooltip-popper-success-border-color) + ); + } + + &.is-dark { + background: var(--ti-tooltip-popper-dark-bg-color); + color: var(--ti-tooltip-popper-dark-text-color); + } + + &.is-light { + .tooltip-light( + var(--ti-tooltip-popper-light-text-color), + var(--ti-tooltip-popper-light-bg-color), + var(--ti-tooltip-popper-light-border-color) + ); + } + + &.is-blank-content { + display: none; + } + } +} + +.@{css-prefix} { + &fade-in-linear-enter-active, + &fade-in-linear-leave-active { + transition: opacity 0.2s linear; + } + + &fade-in-linear-enter, + &fade-in-linear-enter-from, + &fade-in-linear-leave, + &fade-in-linear-leave-from, + &fade-in-linear-leave-active { + opacity: 0; + } + + &fade-in-enter-active, + &fade-in-leave-active { + transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1); + } + + &fade-in-enter, + &fade-in-enter-from, + &fade-in-leave-active { + opacity: 0; + } +} diff --git a/packages/theme/src/tooltip/vars.less b/packages/theme/src/tooltip/vars.less new file mode 100644 index 000000000..af6fcca7f --- /dev/null +++ b/packages/theme/src/tooltip/vars.less @@ -0,0 +1,41 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-tooltip() { + --ti-tooltip-popper-border-radius: var(--ti-common-border-radius-1); + --ti-tooltip-popper-font-size: var(--ti-common-font-size-base); + --ti-tooltip-popper-border-color: var(--ti-base-color-common-6); + --ti-tooltip-popper-normal-bg-color: var(--ti-base-color-secondary); + --ti-tooltip-popper-normal-text-color: var(--ti-base-color-light); + --ti-tooltip-popper-normal-border-color: var(--ti-base-color-secondary); + --ti-tooltip-popper-info-bg-color: #69c0ff; + --ti-tooltip-popper-info-text-color: var(--ti-base-color-light); + --ti-tooltip-popper-info-border-color: #69c0ff; + --ti-tooltip-popper-error-bg-color: var(--ti-base-color-common-6); + --ti-tooltip-popper-error-text-color: var(--ti-base-color-light); + --ti-tooltip-popper-error-border-color: var(--ti-base-color-common-6); + --ti-tooltip-popper-warning-bg-color: #ffd666; + --ti-tooltip-popper-warning-text-color: var(--ti-base-color-light); + --ti-tooltip-popper-warning-border-color: #ffd666; + --ti-tooltip-popper-success-bg-color: #95de64; + --ti-tooltip-popper-success-text-color: var(--ti-base-color-light); + --ti-tooltip-popper-success-border-color: #95de64; + --ti-tooltip-popper-dark-bg-color: var(--ti-base-color-common-6); + --ti-tooltip-popper-dark-text-color: var(--ti-base-color-light); + --ti-tooltip-popper-light-bg-color: var(--ti-base-color-light); + --ti-tooltip-popper-light-text-color: var(--ti-base-color-common-6); + --ti-tooltip-popper-light-border-color: var(--ti-base-color-common-6); + --ti-tooltip-box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.2); + --ti-tooltip-padding-vertical: 11px; + --ti-tooltip-padding-horizontal: 15px; + --ti-tooltip-validate-icon-color: var(--ti-base-color-error-3); +} diff --git a/packages/theme/src/top-box/index.js b/packages/theme/src/top-box/index.js new file mode 100644 index 000000000..daa6d363f --- /dev/null +++ b/packages/theme/src/top-box/index.js @@ -0,0 +1,21 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-top-box-bg-color': '#fff', + 'tiny-top-box-icon-font-size': '24px', + 'tiny-top-box-success-icon-color': '#52c41a', + 'tiny-top-box-error-icon-color': '#f5222d', + 'tiny-top-box-warning-icon-color': '#faad14', + 'tiny-top-box-help-icon-color': '#1890ff', + 'tiny-top-box-info-icon-color': '#333333' +} diff --git a/packages/theme/src/top-box/index.less b/packages/theme/src/top-box/index.less new file mode 100644 index 000000000..7f1eb0e9c --- /dev/null +++ b/packages/theme/src/top-box/index.less @@ -0,0 +1,98 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/common.less'; +@import '../mixins/button.less'; +@import '../custom.less'; +@import './vars.less'; + +@top-box-prefix-cls: ~'@{css-prefix}top-box'; + +.@{top-box-prefix-cls} { + .component-css-vars-top-box(); + + position: fixed; + top: 20px; + left: 50%; + transform: translateX(-50%); + width: 400px; + max-height: 600px; + background: var(--ti-top-box-bg-color); + padding: 24px; + box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.2); + transition: opacity 0.3s, transform 0.4s, top 0.4s; + + & &__icon { + font-size: var(--ti-top-box-icon-font-size, 24px); + vertical-align: middle; + } + + & &__content { + display: inline-block; + padding: 0 16px; + vertical-align: middle; + } + + & &__closeBtn { + position: absolute; + top: 14px; + right: 12px; + cursor: pointer; + fill: rgba(51, 51, 51, 0.5); + display: none; + + &:hover { + fill: rgba(51, 51, 51, 1); + } + } + + & &__toolbar { + float: right; + margin-top: 24px; + } + + &.is-closable &__closeBtn { + display: inline-block; + } + + &.is-center { + display: flex; + justify-content: center; + align-items: center; + } + + &--success &__icon { + fill: var(--ti-top-box-success-icon-color); + } + + &--error &__icon { + fill: var(--ti-top-box-error-icon-color); + } + + &--warning &__icon { + fill: var(--ti-top-box-warning-icon-color); + } + + &--help &__icon { + fill: var(--ti-top-box-help-icon-color); + } + + &--info &__icon { + fill: var(--ti-top-box-info-icon-color); + } + + &-fade-enter, + &-fade-leave-active { + opacity: 0; + transform: translate(-50%, -100%); + } +} diff --git a/packages/theme/src/top-box/vars.less b/packages/theme/src/top-box/vars.less new file mode 100644 index 000000000..06a09589e --- /dev/null +++ b/packages/theme/src/top-box/vars.less @@ -0,0 +1,21 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-top-box() { + --ti-top-box-bg-color: var(--ti-base-color-light); + --ti-top-box-icon-font-size: var(--ti-common-font-size-5); + --ti-top-box-success-icon-color: var(--ti-base-color-success-normal); + --ti-top-box-error-icon-color: var(--ti-base-color-bg-8); + --ti-top-box-warning-icon-color: var(--ti-base-color-warning-normal); + --ti-top-box-help-icon-color: var(--ti-base-color-brand-6); + --ti-top-box-info-icon-color: var(--ti-base-color-info-normal); +} diff --git a/packages/theme/src/transfer/index.js b/packages/theme/src/transfer/index.js new file mode 100644 index 000000000..4c7bbaf4d --- /dev/null +++ b/packages/theme/src/transfer/index.js @@ -0,0 +1,47 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-transfer-font-size': '14px', + 'tiny-transfer-button-bg-color': '#1890ff', + 'tiny-transfer-button-border-radius': '2px', + 'tiny-transfer-button-disabled-text-color': '#999', + 'tiny-transfer-button-disabled-border-color': '#d9d9d9', + 'tiny-transfer-button-disabled-bg-color': '#f5f5f5', + 'tiny-transfer-panel-bg-color': '#fff', + 'tiny-transfer-panel-body-height': '260px', + 'tiny-transfer-panel-border-color': '#d9d9d9', + 'tiny-transfer-panel-border-radius': '2px', + 'tiny-transfer-panel-item-height': '30px', + 'tiny-transfer-panel-item-text-color': '#333', + 'tiny-transfer-panel-item-hover-text-color': '#1890ff', + 'tiny-transfer-panel-item-hover-bg-color': '#e6f7ff', + 'tiny-transfer-panel-filter-height': '30px', + 'tiny-transfer-panel-filter-font-size': '12px', + 'tiny-transfer-panel-filter-border-radius': '2px', + 'tiny-transfer-panel-body-filter-height': '216px', + 'tiny-transfer-panel-width': '200px', + 'tiny-transfer-header-height': '36px', + 'tiny-transfer-header-bg-color': '#f5f5f5', + 'tiny-transfer-header-border-color': '#d9d9d9', + 'tiny-transfer-header-text-color': '#333', + 'tiny-transfer-header-span-text-color': '#252b3a', + 'tiny-transfer-header-font-size': '12px', + 'tiny-transfer-header-sort-width': '20px', + 'tiny-transfer-header-sort-text-color': '#1890ff', + 'tiny-transfer-footer-height': '40px', + 'tiny-transfer-footer-bg-color': '#fff', + 'tiny-transfer-footer-border-color': '#d9d9d9', + 'tiny-transfer-footer-text-color': '#606266', + 'tiny-transfer-empty-height': '30px', + 'tiny-transfer-empty-text-color': '#909399' +} diff --git a/packages/theme/src/transfer/index.less b/packages/theme/src/transfer/index.less new file mode 100644 index 000000000..3532c6235 --- /dev/null +++ b/packages/theme/src/transfer/index.less @@ -0,0 +1,382 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/transfer.less'; +@import '../custom.less'; +@import './vars.less'; +@import '../transition/transfer.less'; + +@transfer-prefix-cls: ~'@{css-prefix}transfer'; +@transfer-panel-prefix-cls: ~'@{css-prefix}transfer-panel'; +@checkbox-prefix-cls: ~'@{css-prefix}checkbox'; +@checkbox-group-prefix-cls: ~'@{css-prefix}checkbox-group'; +@input-prefix-cls: ~'@{css-prefix}input'; +@table-prefix-cls: ~'@{css-prefix}table'; +@pager-prefix-cls: ~'@{css-prefix}pager'; +@button-prefix-cls: ~'@{css-prefix}button'; +@svg-prefix-cls: ~'@{css-prefix}svg'; +@tree-node-prefix-cls: ~'@{css-prefix}tree-node'; +@tree-prefix-cls: ~'@{css-prefix}tree'; + +.@{transfer-prefix-cls} { + .component-css-vars-transfer(); + + display: flex; + justify-content: flex-start; + align-items: center; + font-size: var(--ti-transfer-font-size); + + &__buttons { + padding: 0 16px; + + .defaultButton { + display: flex; + flex-direction: column; + + .@{button-prefix-cls} + .@{button-prefix-cls} { + margin-left: 0; + } + + & + .@{button-prefix-cls} { + margin: 12px 0 0; + } + } + + .@{button-prefix-cls} { + min-width: auto; + margin: 0 0 8px 0; + } + } + + &__button { + display: block; + margin: 0 auto; + border-color: var(--ti-transfer-button-bg-color); + background-color: var(--ti-transfer-button-bg-color); + min-width: 30px; + min-height: 30px; + border-radius: var(--ti-transfer-button-border-radius); + line-height: normal; + padding: 8px; + + &.is-with-texts { + border-radius: var(--ti-transfer-button-border-radius); + min-width: 60px; + } + + &.@{button-prefix-cls}:not(.is-circle) .@{svg-prefix-cls} { + margin-right: 0; + } + + &:first-child { + margin-bottom: 12px; + } + + &:nth-child(2) { + margin: 0; + } + + i, + span { + font-size: var(--ti-transfer-font-size); + } + + [class*='tiny-icon'] + span { + margin-left: 0; + } + } + + & &__button { + &.is-disabled, + &.is-disabled:hover { + border: 1px solid var(--ti-transfer-button-disabled-border-color); + background-color: var(--ti-transfer-button-disabled-bg-color); + color: var(--ti-transfer-button-disabled-text-color); + line-height: 1; + + .@{svg-prefix-cls} { + fill: var(--ti-transfer-button-disabled-text-color); + } + } + } +} + +.@{transfer-panel-prefix-cls} { + border: 1px solid var(--ti-transfer-panel-border-color); + border-radius: var(--ti-transfer-panel-border-radius); + overflow: hidden; + background: var(--ti-transfer-panel-bg-color); + width: var(--ti-transfer-panel-width); + max-height: 100%; + vertical-align: middle; + box-sizing: border-box; + position: relative; + + &__body { + position: relative; + height: var(--ti-transfer-panel-body-height); + text-align: left; + padding-right: 2px; + + &.is-with-footer { + padding-bottom: 40px; + height: calc(100% - 40px); + } + + .@{tree-prefix-cls} { + height: 100%; + padding: 0px 8px 8px; + overflow: auto; + .transfer-scrollbar(8px); + } + + .@{transfer-panel-prefix-cls}__filter ~ .@{tree-prefix-cls} { + height: calc(100% - 46px); + } + } + + &__list { + margin: 0; + padding: 6px 0; + list-style: none; + height: var(--ti-transfer-panel-body-height); + overflow: auto; + box-sizing: border-box; + display: block; + + &.@{checkbox-group-prefix-cls} { + display: block; + } + + &.is-filterable { + height: var(--ti-transfer-panel-body-filter-height); + padding-top: 0; + display: flex; + flex-direction: column; + + .@{transfer-panel-prefix-cls}__item { + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + flex-shrink: 0; + } + } + } + } + + & &__list { + .transfer-scrollbar(8px); + } + + &__item { + line-height: var(--ti-transfer-panel-item-height); + padding-left: 8px; + display: flex; + transition: all 0.5s; + + & + & { + margin-left: 0; + display: flex; + } + + &.@{checkbox-prefix-cls} { + color: var(--ti-transfer-panel-item-text-color); + line-height: var(--ti-transfer-panel-item-height); + margin: 0; + display: flex; + + &.@{checkbox-prefix-cls}__label { + width: 100%; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + display: block; + box-sizing: border-box; + padding-left: 22px; + line-height: var(--ti-transfer-panel-item-height); + } + + .@{checkbox-prefix-cls}__input { + line-height: 1; + } + } + + &:hover { + background: var(--ti-transfer-panel-item-hover-bg-color); + color: var(--ti-transfer-panel-item-hover-text-color); + } + + &.is-disabled:hover { + background: 0; + } + + &.@{checkbox-prefix-cls}__input { + position: absolute; + top: 7px; + } + } + + &__filter { + text-align: center; + padding: 8px; + box-sizing: border-box; + display: block; + width: auto; + + .@{input-prefix-cls}__inner { + height: var(--ti-transfer-panel-filter-height); + line-height: var(--ti-transfer-panel-filter-height); + width: 100%; + font-size: var(--ti-transfer-panel-filter-font-size); + display: inline-block; + box-sizing: border-box; + border-radius: var(--ti-transfer-panel-filter-border-radius); + padding-right: 30px; + padding-left: 8px; + } + + .@{input-prefix-cls}__icon { + margin-left: 5px; + } + + .@{css-prefix}icon-circle-close { + cursor: pointer; + } + } + + & &__header { + height: var(--ti-transfer-header-height); + line-height: var(--ti-transfer-header-height); + background: var(--ti-transfer-header-bg-color); + margin: 0; + padding: 0 8px; + border-bottom: 1px solid var(--ti-transfer-header-border-color); + box-sizing: border-box; + color: var(--ti-transfer-header-text-color); + position: relative; + display: flex; + justify-content: flex-start; + align-items: center; + + .@{checkbox-prefix-cls} { + width: 100%; + line-height: 1; + text-align: left; + + .@{checkbox-prefix-cls}__label { + font-size: var(--ti-transfer-header-font-size); + color: var(--ti-transfer-header-text-color); + font-weight: 400; + width: calc(100% - 38px); + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + + span { + position: absolute; + right: 0; + color: var(--ti-transfer-header-span-text-color); + font-size: var(--ti-transfer-header-font-size); + font-weight: 400; + } + } + } + + .headSort { + position: absolute; + left: 50%; + top: 50%; + transform: translateY(-50%); + + div { + width: var(--ti-transfer-header-sort-width); + height: var(--ti-transfer-header-sort-width); + line-height: var(--ti-transfer-header-sort-width); + margin-right: 8px; + text-align: center; + border: 1px solid; + border-radius: 50%; + color: var(--ti-transfer-header-sort-text-color); + display: inline-block; + cursor: pointer; + + i { + width: calc(var(--ti-transfer-header-sort-width) - 2px); + height: calc(var(--ti-transfer-header-sort-width) - 2px); + display: block; + } + } + } + } + + & &__footer { + height: var(--ti-transfer-footer-height); + background: var(--ti-transfer-footer-bg-color); + margin: 0; + padding: 0; + border-top: 1px solid var(--ti-transfer-footer-border-color); + position: absolute; + bottom: 0; + left: 0; + width: 100%; + z-index: 1; + + &::after { + display: inline-block; + content: ''; + height: 100%; + vertical-align: middle; + } + + .@{checkbox-prefix-cls} { + padding-left: 20px; + color: var(--ti-transfer-footer-text-color); + } + } + + & &__empty { + position: absolute; + width: 100%; + top: calc(50% - 33px); + margin: 0; + height: var(--ti-transfer-empty-height); + line-height: var(--ti-transfer-empty-height); + padding: 6px 15px 0; + color: var(--ti-transfer-empty-text-color); + text-align: center; + } + + &.transferGrid { + width: 600px; + + .@{transfer-panel-prefix-cls}__body { + height: 100%; + } + + .@{table-prefix-cls}.simple { + width: 100%; + padding: 0 8px; + height: 400px; + overflow-y: auto; + + table { + width: 100%; + } + } + + .@{pager-prefix-cls} { + padding: 10px; + } + } + + .@{checkbox-prefix-cls}__label { + padding-left: 8px; + } +} diff --git a/packages/theme/src/transfer/vars.less b/packages/theme/src/transfer/vars.less new file mode 100644 index 000000000..c0e903415 --- /dev/null +++ b/packages/theme/src/transfer/vars.less @@ -0,0 +1,52 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-transfer() { + --ti-transfer-font-size: var(--ti-common-font-size-1); + + --ti-transfer-button-bg-color: var(--ti-base-color-brand-6); + --ti-transfer-button-border-radius: var(--ti-common-border-radius-normal); + --ti-transfer-button-disabled-text-color: var(--ti-base-color-placeholder); + --ti-transfer-button-disabled-border-color: var(--ti-base-color-border); + --ti-transfer-button-disabled-bg-color: var(--ti-common-color-bg-disabled); + --ti-transfer-panel-bg-color: var(--ti-base-color-light); + + --ti-transfer-panel-body-height: 260px; + --ti-transfer-panel-border-color: var(--ti-base-color-border); + --ti-transfer-panel-border-radius: var(--ti-common-border-radius-normal); + --ti-transfer-panel-item-height: var(--ti-base-size-height-minor); + --ti-transfer-panel-item-text-color: var(--ti-base-color-info-normal); + --ti-transfer-panel-item-hover-text-color: var(--ti-base-color-brand-6); + --ti-transfer-panel-item-hover-bg-color: var(--ti-base-color-hover-background); + --ti-transfer-panel-filter-height: var(--ti-base-size-height-minor); + --ti-transfer-panel-filter-font-size: var(--ti-common-font-size-base); + --ti-transfer-panel-filter-border-radius: var(--ti-common-border-radius-normal); + --ti-transfer-panel-body-filter-height: 216px; + --ti-transfer-panel-width: 200px; + + --ti-transfer-header-height: 40px; + --ti-transfer-header-bg-color: var(--ti-base-color-hover-background); + --ti-transfer-header-border-color: var(--ti-base-color-border); + --ti-transfer-header-text-color: var(--ti-base-color-info-normal); + --ti-transfer-header-span-text-color: var(--ti-base-color-info-normal); + --ti-transfer-header-font-size: var(--ti-common-font-size-base); + --ti-transfer-header-sort-width: var(--ti-common-size-5x); + --ti-transfer-header-sort-text-color: var(--ti-base-color-brand-6); + + --ti-transfer-footer-height: var(--ti-common-size-10x); + --ti-transfer-footer-bg-color: var(--ti-base-color-light); + --ti-transfer-footer-border-color: var(--ti-base-color-border); + --ti-transfer-footer-text-color: #606266; + + --ti-transfer-empty-height: var(--ti-base-size-height-minor); + --ti-transfer-empty-text-color: #909399; +} diff --git a/packages/theme/src/transition/alert-fade.less b/packages/theme/src/transition/alert-fade.less new file mode 100644 index 000000000..fe7f0460b --- /dev/null +++ b/packages/theme/src/transition/alert-fade.less @@ -0,0 +1,23 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +.@{css-prefix}transition-alert-fade-enter, +.@{css-prefix}transition-alert-fade-enter-from, +.@{css-prefix}transition-alert-fade-leave-active { + opacity: 0; +} + +.@{css-prefix}transition-alert-fade-leave-active { + transition: opacity 0.3s ease-in; +} diff --git a/packages/theme/src/transition/carousel-arrow.less b/packages/theme/src/transition/carousel-arrow.less new file mode 100644 index 000000000..b6faacb83 --- /dev/null +++ b/packages/theme/src/transition/carousel-arrow.less @@ -0,0 +1,69 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +.@{css-prefix}transition-carousel-arrow-left-enter, +.@{css-prefix}transition-carousel-arrow-left-enter-from, +.@{css-prefix}transition-carousel-arrow-left-leave-to { + opacity: 0; + left: 0; +} + +.@{css-prefix}transition-carousel-arrow-left-enter-active { + animation: animation-left 0.3s; +} + +.@{css-prefix}transition-carousel-arrow-left-leave-active { + animation: animation-left 0.3s reverse; +} + +.@{css-prefix}transition-carousel-arrow-right-enter, +.@{css-prefix}transition-carousel-arrow-right-enter-from, +.@{css-prefix}transition-carousel-arrow-right-leave-to { + opacity: 0; + right: 0; +} + +.@{css-prefix}transition-carousel-arrow-right-enter-active { + animation: animation-right 0.3s; +} + +.@{css-prefix}transition-carousel-arrow-right-leave-active { + animation: animation-right 0.3s reverse; +} + +@keyframes animation-right { + 0% { + opacity: 0; + right: 0; + } + + 100% { + opacity: 1; + transform: translateY(-50%); + right: 16px; + } +} + +@keyframes animation-left { + 0% { + opacity: 0; + left: 0; + } + + 100% { + opacity: 1; + transform: translateY(-50%); + left: 16px; + } +} diff --git a/packages/theme/src/transition/icon.less b/packages/theme/src/transition/icon.less new file mode 100644 index 000000000..8135d29d6 --- /dev/null +++ b/packages/theme/src/transition/icon.less @@ -0,0 +1,58 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +// input右边icon显示隐藏动画 +.@{css-prefix}transition-icon-out-in-enter-active { + animation: bounce-in 0.3s; +} + +.@{css-prefix}transition-icon-out-in-leave-active { + animation: bounce-in 0.3s reverse; +} + +.@{css-prefix}transition-icon-scale-in-enter-active { + animation: scale-in 0.3s; +} + +.@{css-prefix}transition-icon-scale-in-leave-active { + animation: scale-in 0.3s reverse; +} + +@keyframes bounce-in { + 0% { + transform: translateY(-50%) scale(0); + } + + 50% { + transform: translateY(-50%) scale(1.2); + } + + 100% { + transform: translateY(-50%) scale(1); + } +} + +@keyframes scale-in { + 0% { + transform: scale(0); + } + + 50% { + transform: scale(1.2); + } + + 100% { + transform: scale(1); + } +} diff --git a/packages/theme/src/transition/index.js b/packages/theme/src/transition/index.js new file mode 100644 index 000000000..ee59fe44d --- /dev/null +++ b/packages/theme/src/transition/index.js @@ -0,0 +1,15 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + // transition +} diff --git a/packages/theme/src/transition/search-line.less b/packages/theme/src/transition/search-line.less new file mode 100644 index 000000000..c18181b67 --- /dev/null +++ b/packages/theme/src/transition/search-line.less @@ -0,0 +1,28 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +.@{css-prefix}transition-search-line-fade-enter, +.@{css-prefix}transition-search-line-fade-enter-from, +.@{css-prefix}transition-search-line-fade-leave-to { + opacity: 0; +} + +.@{css-prefix}transition-search-line-fade-enter-to { + opacity: 0; +} + +.@{css-prefix}transition-search-line-fade-enter-active, +.@{css-prefix}transition-search-line-fade-leave-active { + transition: opacity 0.3s; +} diff --git a/packages/theme/src/transition/timepicker.less b/packages/theme/src/transition/timepicker.less new file mode 100644 index 000000000..81d25ce8c --- /dev/null +++ b/packages/theme/src/transition/timepicker.less @@ -0,0 +1,45 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +.@{css-prefix}transition-timepicker { + animation: fadein 0.3s; +} + +.@{css-prefix}transition-timepicker-up { + animation: fadeup 0.3s; +} + +@keyframes fadein { + 0% { + transform: translateY(-200px); + z-index: -999; + } + + 100% { + transform: translateY(0); + z-index: 0; + } +} + +@keyframes fadeup { + 0% { + transform: translateY(200px); + z-index: -999; + } + + 100% { + transform: translateY(0); + z-index: 0; + } +} diff --git a/packages/theme/src/transition/transfer.less b/packages/theme/src/transition/transfer.less new file mode 100644 index 000000000..99ef09175 --- /dev/null +++ b/packages/theme/src/transition/transfer.less @@ -0,0 +1,30 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +// 左右穿梭动画 +.@{css-prefix}transition-transfer-fade-enter-active, +.@{css-prefix}transition-transfer-fade-leave-active { + transition: all 0.3s; +} + +.@{css-prefix}transition-transfer-fade-leave-active { + position: absolute; +} + +.@{css-prefix}transition-transfer-fade-enter, +.@{css-prefix}transition-transfer-fade-enter-from, +.@{css-prefix}transition-transfer-fade-leave-to { + opacity: 0; + transform: translateX(30px); +} diff --git a/packages/theme/src/transition/zoom-in-top.less b/packages/theme/src/transition/zoom-in-top.less new file mode 100644 index 000000000..1770432d6 --- /dev/null +++ b/packages/theme/src/transition/zoom-in-top.less @@ -0,0 +1,30 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; + +.@{css-prefix}transition-zoom-in-top-enter-active, +.@{css-prefix}transition-zoom-in-top-leave-active { + opacity: 1; + transform: scaleY(1); + transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), + opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1); + transform-origin: center top; +} + +.@{css-prefix}transition-zoom-in-top-enter, +.@{css-prefix}transition-zoom-in-top-enter-from, +.@{css-prefix}transition-zoom-in-top-leave-to { + opacity: 0; + transform: scaleY(0); + transform-origin: center top; +} diff --git a/packages/theme/src/tree-menu/index.js b/packages/theme/src/tree-menu/index.js new file mode 100644 index 000000000..ffb9aee8d --- /dev/null +++ b/packages/theme/src/tree-menu/index.js @@ -0,0 +1,22 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-tree-menu-width': '210px', + 'tiny-tree-menu-font-size': '12px', + 'tiny-tree-menu-border-color': '#d9d9d9', + 'tiny-tree-menu-node-height': '40px', + 'tiny-tree-menu-node-hover-bg-color': '#e6f7ff', + 'tiny-tree-menu-node-current-text-color': '#1890ff', + 'tiny-tree-menu-node-body-text-color': '#333', + 'tiny-tree-menu-square-left-border-color': '#1890ff' +} diff --git a/packages/theme/src/tree-menu/index.less b/packages/theme/src/tree-menu/index.less new file mode 100644 index 000000000..6ba118e14 --- /dev/null +++ b/packages/theme/src/tree-menu/index.less @@ -0,0 +1,149 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@tree-prefix-cls: ~'@{css-prefix}tree'; +@tree-node-prefix-cls: ~'@{css-prefix}tree-node'; +@input-prefix-cls: ~'@{css-prefix}input'; +@tree-menu-prefix-cls: ~'@{css-prefix}tree-menu'; + +.@{tree-menu-prefix-cls} { + .component-css-vars-tree-menu(); + + width: var(--ti-tree-menu-width); + position: relative; + font-size: var(--ti-tree-menu-font-size); + + &:before { + content: ''; + border-right: 1px solid var(--ti-tree-menu-border-color); + position: absolute; + top: 0; + right: 0; + height: 100%; + z-index: 1; + } + + .@{input-prefix-cls} { + .@{input-prefix-cls}__inner { + border: none; + border-bottom: 1px solid var(--ti-tree-menu-border-color); + } + } + + .@{tree-prefix-cls} { + .@{tree-node-prefix-cls} { + .@{tree-node-prefix-cls}__content { + height: var(--ti-tree-menu-node-height); + line-height: var(--ti-tree-menu-node-height); + overflow: hidden; + + .tree-node-icon { + order: 1; + margin-right: 8px; + } + + .tree-node { + width: 100%; + } + + .tree-node-name { + padding: 0 24px; + } + } + + &.is-current { + & > .@{tree-node-prefix-cls}__content { + background-color: var(--ti-tree-menu-node-hover-bg-color); + position: relative; + + .tree-node-name { + border-left: 2px solid var(--ti-tree-menu-square-left-border-color); + } + + .tree-node-body { + color: var(--ti-tree-menu-node-current-text-color); + } + } + } + + .tree-node-body { + color: var(--ti-tree-menu-node-body-text-color); + display: block; + + &, + &:hover { + text-decoration: none; + } + } + + &.is-loading { + .@{tree-node-prefix-cls}__content { + .tree-node-name { + padding-left: 0; + } + } + } + } + } + + & &__overflow { + &.@{tree-prefix-cls} { + .@{tree-node-prefix-cls} { + .@{tree-node-prefix-cls}__content { + .tree-node-name { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + display: block; + padding-right: 0; + } + + .tree-node { + width: calc(100% - 24px); + } + } + } + } + } + + & &__wrap { + &.@{tree-prefix-cls} { + .@{tree-node-prefix-cls}__content { + min-height: var(--ti-tree-menu-node-height); + height: auto; + } + + .tree-node-body { + min-height: 40px; + display: flex; + align-items: center; + } + + .@{tree-node-prefix-cls}__label { + //兼容ie10-ie11 + @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { + display: flex; + } + } + + .tree-node-name { + white-space: normal; + line-height: normal; + display: block; + word-break: break-all; + } + } + } +} diff --git a/packages/theme/src/tree-menu/vars.less b/packages/theme/src/tree-menu/vars.less new file mode 100644 index 000000000..f5fc3b74d --- /dev/null +++ b/packages/theme/src/tree-menu/vars.less @@ -0,0 +1,22 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-tree-menu() { + --ti-tree-menu-width: 210px; + --ti-tree-menu-font-size: var(--ti-common-font-size-base); + --ti-tree-menu-border-color: #d9d9d9; + --ti-tree-menu-node-height: var(--ti-common-size-10x); + --ti-tree-menu-node-hover-bg-color: var(--ti-base-color-white); + --ti-tree-menu-node-current-text-color: var(--ti-base-color-brand-6); + --ti-tree-menu-node-body-text-color: var(--ti-base-color-info-normal); + --ti-tree-menu-square-left-border-color: var(--ti-base-color-brand-6); +} diff --git a/packages/theme/src/tree/index.js b/packages/theme/src/tree/index.js new file mode 100644 index 000000000..5ad5eebf6 --- /dev/null +++ b/packages/theme/src/tree/index.js @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-tree-text-color': '#333', + 'tiny-tree-bg-color': '#fff', + 'tiny-tree-empty-text-color': '#909399', + 'tiny-tree-node-content-current-bg-color': '#f5f5f5', + 'tiny-tree-node-content-hover-bg-color': '#e6f7ff', + 'tiny-tree-node-label-font-size': '14px', + 'tiny-tree-node-label-margin-left': '4px', + 'tiny-tree-node-label-bg-color': '#40a9ff', + 'tiny-tree-node-label-text-color': '#fff', + 'tiny-tree-node-icon-font-size': '14px', + 'tiny-tree-node-loading-icon-color': '#1890ff', + 'tiny-tree-node-expand-icon-color': '#333', + 'tiny-tree-node-checked-icon-color': '#5e7ce0' +} diff --git a/packages/theme/src/tree/index.less b/packages/theme/src/tree/index.less new file mode 100644 index 000000000..ef2e070ce --- /dev/null +++ b/packages/theme/src/tree/index.less @@ -0,0 +1,229 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@tree-prefix-cls: ~'@{css-prefix}tree'; +@tree-node-prefix-cls: ~'@{css-prefix}tree-node'; +@radio-prefix-cls: ~'@{css-prefix}radio'; + +.@{tree-prefix-cls} { + .component-css-vars-tree(); + + position: relative; + cursor: default; + background: var(--ti-tree-bg-color); + color: var(--ti-tree-text-color); + + .is-drop-inner { + position: relative; + + &::before { + pointer-events: none; + border: 2px solid var(--ti-tree-node-checked-icon-color); + content: ' '; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + } + } + + &__empty-block { + position: relative; + min-height: 60px; + text-align: center; + width: 100%; + height: 100%; + } + + &__empty-text { + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + color: var(--ti-tree-empty-text-color); + } + + &__drop-indicator { + position: absolute; + left: 0; + right: 0; + height: 2px; + background-color: var(--ti-tree-node-checked-icon-color); + } + + &.is-dragging { + .@{tree-node-prefix-cls}__content { + cursor: move; + + * { + pointer-events: none; + } + } + + &.is-drop-not-allow { + .@{tree-node-prefix-cls}__content { + cursor: not-allowed; + } + } + } + + &--highlight-current { + .@{tree-node-prefix-cls}.is-current > .@{tree-node-prefix-cls}__content { + background-color: #f0f7ff; + } + } +} + +.@{tree-node-prefix-cls} { + white-space: nowrap; + outline: 0; + + &:focus > &__content { + background-color: var(--ti-tree-node-content-hover-bg-color); + } + + &.is-current > &__content { + background-color: var(--ti-tree-node-content-current-bg-color); + } + + &.is-drop-inner > &__content &__label { + background-color: var(--ti-tree-node-label-bg-color); + color: var(--ti-tree-node-label-text-color); + } + + &.is-indeterminate, + &.is-expanded, + &.is-checked { + .@{tree-node-prefix-cls}__expand-icon { + fill: var(--ti-tree-node-expand-icon-color); + } + } + + &__content { + display: flex; + align-items: center; + height: 30px; + cursor: pointer; + border-radius: var(--ti-common-border-radius-normal); + + &:hover { + background-color: var(--ti-tree-node-content-hover-bg-color) !important; + .@{tree-node-prefix-cls}__expand-icon { + fill: var(--ti-tree-node-checked-icon-color) !important; // 只有hover时,才进行高亮 + } + } + + & > label.@{css-prefix}checkbox { + margin-left: var(--ti-tree-node-label-margin-left); + } + } + + &__expand-icon { + cursor: pointer; + fill: var(--ti-tree-node-expand-icon-color); + font-size: var(--ti-tree-node-icon-font-size); + transform: rotate(0); + transition: transform 0.3s ease-in-out; + flex-shrink: 0; + + &.expanded { + transform: rotate(90deg); + } + + &.is-leaf { + visibility: hidden; + } + } + + &__label { + font-size: var(--ti-tree-node-label-font-size); + margin-left: var(--ti-tree-node-label-margin-left); + } + + &__loading.circular { + margin-right: 4px; + margin-left: var(--ti-tree-node-label-margin-left); + font-size: var(--ti-tree-node-icon-font-size); + fill: var(--ti-tree-node-loading-icon-color); + animation: loading-rotate 2s linear infinite; + + .path { + animation: loading-dash 1.5s ease-in-out infinite; + stroke-dasharray: 90, 150; + stroke-dashoffset: 0; + stroke-width: 2; + stroke: #1890ff; + stroke-linecap: round; + } + } + + & > &__children { + overflow: hidden; + background-color: transparent; + } + + &.is-expanded > &__children { + display: block; + } + + &__menu { + position: absolute; + top: 0; + left: 0; + z-index: 5000; + font-size: var(--ti-common-font-size-base); + box-shadow: 2px 2px 4px -2px rgb(0, 0, 0, 0.2); + padding: 0 1px; + color: #606266; + font-family: Helvetica, Arial, 'Microsoft YaHei', sans-serif; + user-select: none; + } + + .@{radio-prefix-cls} { + margin-right: 0; + + .@{radio-prefix-cls}__label { + display: none; + } + } + + .collapse-transition { + transition: 0.3s height ease-in-out, 0.3s padding-top ease-in-out, 0.3s padding-bottom ease-in-out; + } +} + +@keyframes loading-rotate { + 100% { + transform: rotate(360deg); + } +} + +@keyframes loading-dash { + 0% { + stroke-dasharray: 1, 200; + stroke-dashoffset: 0; + } + + 50% { + stroke-dasharray: 90, 150; + stroke-dashoffset: -40px; + } + + 100% { + stroke-dasharray: 90, 150; + stroke-dashoffset: -120px; + } +} diff --git a/packages/theme/src/tree/vars.less b/packages/theme/src/tree/vars.less new file mode 100644 index 000000000..56f5946fd --- /dev/null +++ b/packages/theme/src/tree/vars.less @@ -0,0 +1,27 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-tree() { + --ti-tree-text-color: var(--ti-base-color-info-normal); + --ti-tree-bg-color: var(--ti-base-color-light); + --ti-tree-empty-text-color: #909399; + --ti-tree-node-content-current-bg-color: var(--ti-base-color-brand-2); + --ti-tree-node-content-hover-bg-color: var(--ti-base-color-hover-background); + --ti-tree-node-label-font-size: var(--ti-common-font-size-1); + --ti-tree-node-label-margin-left: var(--ti-common-space-base); + --ti-tree-node-label-bg-color: var(--ti-base-color-brand-5); + --ti-tree-node-label-text-color: var(--ti-base-color-light); + --ti-tree-node-icon-font-size: var(--ti-common-font-size-1); + --ti-tree-node-loading-icon-color: #1890ff; + --ti-tree-node-expand-icon-color: var(--ti-base-color-info-normal); + --ti-tree-node-checked-icon-color: var(--ti-base-color-brand-6); +} diff --git a/packages/theme/src/upload-dragger/index.js b/packages/theme/src/upload-dragger/index.js new file mode 100644 index 000000000..2affa29d8 --- /dev/null +++ b/packages/theme/src/upload-dragger/index.js @@ -0,0 +1,26 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-upload-dragger-width': '360px', + 'tiny-upload-dragger-height': '180px', + 'tiny-upload-dragger-bg-color': '#fafafa', + 'tiny-upload-dragger-border-color': '#d9d9d9', + 'tiny-upload-dragger-border-radius': '2px', + 'tiny-upload-dragger-hover-text-color': '#40a9ff', + 'tiny-upload-dragger-dragover-bg-color': 'rgba(32, 159, 255, 0.06)', + 'tiny-upload-dragger-icon-color': '#999', + 'tiny-upload-dragger-icon-font-size': '36px', + 'tiny-upload-dragger-text-color': '#666', + 'tiny-upload-dragger-text-font-size': '12px', + 'tiny-upload-dragger-files-border-color': '#dcdfe6' +} diff --git a/packages/theme/src/upload-dragger/index.less b/packages/theme/src/upload-dragger/index.less new file mode 100644 index 000000000..8eee79988 --- /dev/null +++ b/packages/theme/src/upload-dragger/index.less @@ -0,0 +1,69 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@upload-prefix-cls: ~'@{css-prefix}upload'; +@upload-dragger-prefix-cls: ~'@{css-prefix}upload-dragger'; + +.@{upload-dragger-prefix-cls} { + .component-css-vars-upload-dragger(); + + width: var(--ti-upload-dragger-width); + height: var(--ti-upload-dragger-height); + background-color: var(--ti-upload-dragger-bg-color); + border: 1px dashed var(--ti-upload-dragger-border-color); + border-radius: var(--ti-upload-dragger-border-radius); + box-sizing: border-box; + text-align: center; + overflow: hidden; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + + &:hover { + border-color: var(--ti-upload-dragger-hover-text-color); + } + + &.is-dragover { + background-color: var(--ti-upload-dragger-dragover-bg-color, rgba(32, 159, 255, 0.06)); + border: 2px dashed var(--ti-upload-dragger-hover-text-color); + } + + .icon-fileupload { + font-size: var(--ti-upload-dragger-icon-font-size); + fill: var(--ti-upload-dragger-icon-color); + } + + .@{upload-prefix-cls}__text { + color: var(--ti-upload-dragger-text-color); + font-size: var(--ti-upload-dragger-text-font-size); + text-align: center; + + em { + color: var(--ti-upload-dragger-hover-text-color); + font-style: normal; + } + } + + & + .@{upload-prefix-cls}__tip { + text-align: center; + } + + & ~ .@{upload-prefix-cls}__files { + border-top: 1px solid var(--ti-upload-dragger-files-border-color); + margin-top: 7px; + padding-top: 5px; + } +} diff --git a/packages/theme/src/upload-dragger/vars.less b/packages/theme/src/upload-dragger/vars.less new file mode 100644 index 000000000..f5f23405d --- /dev/null +++ b/packages/theme/src/upload-dragger/vars.less @@ -0,0 +1,26 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-upload-dragger() { + --ti-upload-dragger-width: 360px; + --ti-upload-dragger-height: 180px; + --ti-upload-dragger-bg-color: #fafafa; + --ti-upload-dragger-border-color: var(--ti-base-color-border); + --ti-upload-dragger-border-radius: var(--ti-common-border-radius-normal); + --ti-upload-dragger-hover-text-color: var(--ti-base-color-brand-5); + --ti-upload-dragger-dragover-bg-color: rgba(32, 159, 255, 0.06); + --ti-upload-dragger-icon-color: var(--ti-base-color-placeholder); + --ti-upload-dragger-icon-font-size: var(--ti-common-font-size-7); + --ti-upload-dragger-text-color: var(--ti-base-color-secondary); + --ti-upload-dragger-text-font-size: var(--ti-common-font-size-base); + --ti-upload-dragger-files-border-color: #dcdfe6; +} diff --git a/packages/theme/src/upload-list/index.js b/packages/theme/src/upload-list/index.js new file mode 100644 index 000000000..2f7845aef --- /dev/null +++ b/packages/theme/src/upload-list/index.js @@ -0,0 +1,28 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-upload-list-item-font-size': '14px', + 'tiny-upload-list-item-text-color': '#333', + 'tiny-upload-list-item-border-radius': '2px', + 'tiny-upload-list-item-hover-background-color': '#f5f7fa', + 'tiny-upload-list-item-hover-text-color': '#40a9ff', + 'tiny-upload-list-item-name-icon-color': '#909399', + 'tiny-upload-list-item-name-icon-font-size': '16px', + 'tiny-upload-list-svg-close-icon-color': '#606266', + 'tiny-upload-list-svg-icon-font-size': '12px', + 'tiny-upload-list-successful-icon-font-size': '14px', + 'tiny-upload-list-picture-card-item-border-color': '#d9d9d9', + 'tiny-upload-list-picture-card-item-bg-color': '#fff', + 'tiny-upload-list-picture-card-item-text-color': '#fff', + 'tiny-upload-list-successful-status-bg-color': '#52c41a' +} diff --git a/packages/theme/src/upload-list/index.less b/packages/theme/src/upload-list/index.less new file mode 100644 index 000000000..376706a82 --- /dev/null +++ b/packages/theme/src/upload-list/index.less @@ -0,0 +1,464 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@upload-list-prefix-cls: ~'@{css-prefix}upload-list'; +@progress-prefix-cls: ~'@{css-prefix}progress'; +@icon-close-tip-prefix-cls: ~'@{css-prefix}icon-close-tip'; +@icon-check-prefix-cls: ~'@{css-prefix}icon-check'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{upload-list-prefix-cls} { + .component-css-vars-upload-list(); + + margin: 0; + padding: 0; + list-style: none; + + &__item { + transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1); + font-size: var(--ti-upload-list-item-font-size); + color: var(--ti-upload-list-item-text-color); + line-height: 1.8; + margin-top: 8px; + position: relative; + box-sizing: border-box; + border-radius: var(--ti-upload-list-item-border-radius); + width: 100%; + outline: none; + + &:hover { + background-color: var(--ti-upload-list-item-hover-background-color); + + .@{svg-prefix-cls}.icon-close, + .@{svg-prefix-cls}.icon-refres { + display: inline-block; + } + + .@{progress-prefix-cls}__text { + display: none; + } + } + + &.is-success { + .@{upload-list-prefix-cls}__item-status-label { + display: block; + } + + .@{upload-list-prefix-cls}__item-name:focus, + .@{upload-list-prefix-cls}__item-name:hover { + color: var(--ti-upload-list-item-hover-text-color); + cursor: pointer; + text-decoration: none; + } + + &:focus:not(:hover) .@{icon-close-tip-prefix-cls} { + display: inline-block; + } + + &:active, + &:not(.focusing):focus { + outline-width: 0; + } + + &:active .@{icon-close-tip-prefix-cls}, + &:focus .@{upload-list-prefix-cls}__item-status-label, + &:hover .@{upload-list-prefix-cls}__item-status-label, + &:not(.focusing):focus .@{icon-close-tip-prefix-cls} { + display: none; + } + } + + &.is-disabled &:hover &-status-label { + display: block; + } + + &.isEdm { + .@{upload-list-prefix-cls}__item-name { + display: inline-block; + + &.isFail { + color: red; + } + } + + .@{upload-list-prefix-cls}__item-edminfo { + margin-right: 46px; + } + + .@{upload-list-prefix-cls}__item-status-label { + right: 16px; + } + + &:not(.showUpdate) { + .icon-refres { + display: none; + } + } + + &:not(.showDel) { + .icon-close { + display: none; + } + } + + &.showUpdate { + .icon-refres { + right: 16px; + } + } + + &.showDel { + .icon-close { + right: 16px; + } + } + + &.showUpdate.showDel { + .icon-refres { + right: 28px; + } + + .icon-close { + right: 8px; + } + } + + &:not(.showUpdate):not(.showDel) { + .@{upload-list-prefix-cls}__item-status-label { + display: block; + } + } + } + + .@{progress-prefix-cls} { + position: absolute; + top: 20px; + width: 100%; + } + + .@{progress-prefix-cls}__text { + position: absolute; + right: 0; + top: -13px; + } + + .@{progress-prefix-cls}-bar { + margin-right: 0; + padding-right: 0; + } + + .@{svg-prefix-cls} { + &.icon-successful { + font-size: var(--ti-upload-list-successful-icon-font-size); + fill: var(--ti-upload-list-successful-status-bg-color); + } + + &.icon-close { + display: none; + position: absolute; + top: 50%; + right: 8px; + transform: translateY(-50%); + fill: var(--ti-upload-list-svg-close-icon-color); + font-size: var(--ti-upload-list-svg-icon-font-size); + opacity: 0.75; + cursor: pointer; + + &:hover { + opacity: 1; + } + } + + &.icon-refres { + display: none; + position: absolute; + top: 50%; + right: 28px; + transform: translateY(-50%); + fill: #606266; + font-size: var(--ti-common-font-size-base); + opacity: 0.75; + cursor: pointer; + + &:hover { + opacity: 1; + } + } + } + + .@{icon-close-tip-prefix-cls} { + display: none; + position: absolute; + top: 5px; + right: 5px; + font-size: var(--ti-upload-list-svg-icon-font-size); + cursor: pointer; + opacity: 1; + color: var(--ti-upload-list-item-hover-text-color); + } + } + + &__item-edminfo, + &__item-folder { + display: inline-block; + vertical-align: top; + } + + &__item-edminfo { + margin-right: 20px; + + span { + display: inline-block; + margin-right: 10px; + } + + &.isFail span { + color: #f5222d; + } + } + + &__item-name { + color: var(--ti-upload-list-item-text-color); + display: block; + margin-right: 40px; + padding-left: 4px; + transition: color 0.3s; + + .@{svg-prefix-cls} { + font-size: var(--ti-upload-list-item-name-icon-font-size); + margin-right: 4px; + fill: var(--ti-upload-list-item-name-icon-color); + } + } + + &__item-status-label { + position: absolute; + right: 5px; + top: 0; + line-height: inherit; + display: none; + } + + &__item-delete { + position: absolute; + right: 10px; + top: 0; + font-size: var(--ti-upload-list-svg-icon-font-size); + color: var(--ti-upload-list-svg-close-icon-color); + display: none; + + &:hover { + color: var(--ti-upload-list-item-hover-text-color); + } + } + + &--picture-card { + margin: 0; + display: inline; + vertical-align: top; + + .@{upload-list-prefix-cls}__item { + overflow: hidden; + background-color: var(--ti-upload-list-picture-card-item-bg-color); + border: 1px solid var(--ti-upload-list-picture-card-item-border-color); + border-radius: var(--ti-upload-list-item-border-radius); + box-sizing: border-box; + width: 148px; + height: 148px; + margin: 0 8px 8px 0; + display: inline-block; + + .@{icon-check-prefix-cls} { + fill: var(--ti-upload-list-picture-card-item-text-color); + } + + .@{svg-prefix-cls}.icon-close, + .@{svg-prefix-cls}.icon-refres, + &:hover .@{upload-list-prefix-cls}__item-status-label { + display: none; + } + + &:hover .@{progress-prefix-cls}__text { + display: block; + } + } + + .@{upload-list-prefix-cls}__item-name { + display: none; + } + + .@{upload-list-prefix-cls}__item-thumbnail { + width: 100%; + height: 100%; + } + + .@{upload-list-prefix-cls}__item-status-label { + position: absolute; + right: -15px; + top: -6px; + width: 40px; + height: 24px; + background: var(--ti-upload-list-successful-status-bg-color); + text-align: center; + transform: rotate(45deg); + box-shadow: 0 0 1pc 1px rgba(0, 0, 0, 0.2); + + .@{svg-prefix-cls} { + font-size: var(--ti-upload-list-svg-icon-font-size, 12px); + margin-top: 11px; + transform: rotate(-45deg); + } + } + + .@{upload-list-prefix-cls}__item-actions { + position: absolute; + width: 100%; + height: 100%; + left: 0; + top: 0; + cursor: default; + text-align: center; + color: var(--ti-upload-list-picture-card-item-text-color); + opacity: 0; + font-size: var(--ti-common-font-size-4); + background-color: rgba(0, 0, 0, 0.5); + transition: opacity 0.3s; + + &::after { + display: inline-block; + content: ''; + height: 100%; + vertical-align: middle; + } + + &:hover { + opacity: 1; + + span { + display: inline-block; + } + } + + span { + display: none; + cursor: pointer; + + & + span { + margin-left: 15px; + } + } + + .@{upload-list-prefix-cls}__item-delete, + .@{upload-list-prefix-cls}__item-refres { + position: static; + font-size: inherit; + color: inherit; + } + } + + .@{progress-prefix-cls} { + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + bottom: auto; + width: 126px; + + .@{progress-prefix-cls}__text { + top: 50%; + } + } + } + + &--picture &__item { + overflow: hidden; + z-index: 0; + background-color: var(--ti-upload-list-picture-card-item-bg-color); + box-sizing: border-box; + margin-top: 8px; + outline: 0; + + .@{icon-check-prefix-cls} { + fill: var(--ti-upload-list-picture-card-item-text-color); + } + + &:hover { + .@{upload-list-prefix-cls}__item-status-label { + background: 0 0; + box-shadow: none; + top: -2px; + right: -12px; + } + + .@{progress-prefix-cls}__text { + display: block; + } + } + + &.is-success { + .@{upload-list-prefix-cls}__item-name { + line-height: 56px; + margin-top: 0; + + .@{svg-prefix-cls} { + display: none; + } + } + } + } + + &--picture &__item-thumbnail { + width: 56px; + height: 56px; + border: 1px solid var(--ti-upload-list-picture-card-item-border-color); + border-radius: var(--ti-upload-list-item-border-radius); + float: left; + position: relative; + z-index: 1; + vertical-align: middle; + margin-right: 12px; + } + + &--picture &__item-name { + display: block; + line-height: 56px; + + .@{svg-prefix-cls} { + font-size: var(--ti-common-font-size-1); + } + } + + &--picture &__item-status-label { + position: absolute; + right: -17px; + top: -7px; + width: 46px; + height: 26px; + background: var(--ti-upload-list-successful-status-bg-color); + text-align: center; + transform: rotate(45deg); + box-shadow: 0 1px 1px #ccc; + + .@{svg-prefix-cls} { + font-size: var(--ti-upload-list-svg-icon-font-size); + margin-top: 12px; + transform: rotate(-45deg); + } + } + + &--picture .@{progress-prefix-cls} { + position: relative; + top: -7px; + } +} diff --git a/packages/theme/src/upload-list/vars.less b/packages/theme/src/upload-list/vars.less new file mode 100644 index 000000000..0f5fb74b3 --- /dev/null +++ b/packages/theme/src/upload-list/vars.less @@ -0,0 +1,28 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-upload-list() { + --ti-upload-list-item-font-size: var(--ti-common-font-size-1); + --ti-upload-list-item-text-color: var(--ti-base-color-info-normal); + --ti-upload-list-item-border-radius: var(--ti-common-border-radius-normal); + --ti-upload-list-item-hover-background-color: #f5f7fa; + --ti-upload-list-item-hover-text-color: var(--ti-base-color-brand-5); + --ti-upload-list-item-name-icon-color: #909399; + --ti-upload-list-item-name-icon-font-size: var(--ti-common-font-size-2); + --ti-upload-list-svg-close-icon-color: #606266; + --ti-upload-list-svg-icon-font-size: var(--ti-common-font-size-base); + --ti-upload-list-successful-icon-font-size: var(--ti-common-font-size-1); + --ti-upload-list-picture-card-item-border-color: var(--ti-base-color-border); + --ti-upload-list-picture-card-item-bg-color: var(--ti-base-color-light); + --ti-upload-list-picture-card-item-text-color: var(--ti-base-color-light); + --ti-upload-list-successful-status-bg-color: var(--ti-base-color-success-normal); +} diff --git a/packages/theme/src/upload/index.js b/packages/theme/src/upload/index.js new file mode 100644 index 000000000..044a2f9e9 --- /dev/null +++ b/packages/theme/src/upload/index.js @@ -0,0 +1,22 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-upload-tip-font-size': '14px', + 'tiny-upload-tip-text-color': '#333', + 'tiny-upload-picture-card-bg-color': '#fbfdff', + 'tiny-upload-picture-card-border-color': '#c0ccda', + 'tiny-upload-picture-card-border-radius': '6px', + 'tiny-upload-picture-card-hover-text-color': '#40a9ff', + 'tiny-upload-picture-card-icon-font-size': '28px', + 'tiny-upload-picture-card-icon-color': '#8c939d' +} diff --git a/packages/theme/src/upload/index.less b/packages/theme/src/upload/index.less new file mode 100644 index 000000000..e7c1c1b54 --- /dev/null +++ b/packages/theme/src/upload/index.less @@ -0,0 +1,221 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@upload-prefix-cls: ~'@{css-prefix}upload'; +@upload-cover-prefix-cls: ~'@{css-prefix}upload-cover'; + +.@{upload-prefix-cls} { + .component-css-vars-upload(); + + display: inline-block; + text-align: center; + cursor: pointer; + outline: 0; + + &__input { + display: none; + } + + &__tip { + font-size: var(--ti-upload-tip-font-size); + color: var(--ti-upload-tip-text-color); + margin-top: 8px; + } + + &--picture-card { + width: 148px; + height: 148px; + line-height: 146px; + background-color: var(--ti-upload-picture-card-bg-color); + border: 1px dashed var(--ti-upload-picture-card-border-color); + border-radius: var(--ti-upload-picture-card-border-radius); + box-sizing: border-box; + vertical-align: top; + + svg { + font-size: var(--ti-upload-picture-card-icon-font-size); + fill: var(--ti-upload-picture-card-icon-color); + } + } + + &--picture-card:hover, + &:focus { + border-color: var(--ti-upload-picture-card-hover-text-color); + color: var(--ti-upload-picture-card-hover-text-color); + } + + &:focus &-dragger { + border-color: var(--ti-upload-picture-card-hover-text-color); + } + + &-cover__title, + &-list__item-name { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + + &--picture-card, + &-dragger { + box-sizing: border-box; + cursor: pointer; + } + + iframe { + position: absolute; + z-index: -1; + top: 0; + left: 0; + opacity: 0; + filter: alpha(opacity=0); + } + + input[type='file'] { + display: none; + } +} + +.@{upload-cover-prefix-cls} { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + overflow: hidden; + z-index: 10; + cursor: default; + + &::after { + display: inline-block; + content: ''; + height: 100%; + vertical-align: middle; + } + + img { + display: block; + width: 100%; + height: 100%; + } + + &__label { + position: absolute; + right: -15px; + top: -6px; + width: 40px; + height: 24px; + background: #13ce66; + text-align: center; + transform: rotate(45deg); + box-shadow: 0 0 1pc 1px rgba(0, 0, 0, 0.2); + + i { + color: #fff; + font-size: var(--ti-common-font-size-base); + margin-top: 11px; + transform: rotate(-45deg); + } + } + + &__progress { + display: inline-block; + vertical-align: middle; + position: static; + width: 243px; + + & + .@{upload-prefix-cls}__inner { + opacity: 0; + } + } + + &__content { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + } + + &__interact { + position: absolute; + bottom: 0; + left: 0; + width: 100%; + height: 100%; + background-color: rgba(0, 0, 0, 0.72); + text-align: center; + + .btn { + display: inline-block; + color: #fff; + font-size: var(--ti-common-font-size-1); + cursor: pointer; + vertical-align: middle; + transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1); + margin-top: 60px; + + span { + opacity: 0; + transition: opacity 0.15s linear; + } + + i { + color: #fff; + display: block; + font-size: var(--ti-common-font-size-5); + line-height: inherit; + margin: 0 auto 5px; + } + + &:not(:first-child) { + margin-left: 35px; + } + + &:hover { + transform: translateY(-13px); + + span { + opacity: 1; + } + } + } + } + + &__title { + position: absolute; + bottom: 0; + left: 0; + background-color: #fff; + width: 100%; + height: 36px; + line-height: 36px; + font-weight: 400; + padding: 0 10px; + margin: 0; + font-size: var(--ti-common-font-size-1); + color: #303133; + text-align: left; + } + + & + .@{upload-prefix-cls}__inner { + opacity: 0; + position: relative; + z-index: 1; + } +} + +.is-hidden { + display: none; +} diff --git a/packages/theme/src/upload/vars.less b/packages/theme/src/upload/vars.less new file mode 100644 index 000000000..f97343152 --- /dev/null +++ b/packages/theme/src/upload/vars.less @@ -0,0 +1,22 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-upload() { + --ti-upload-tip-font-size: var(--ti-common-font-size-base); + --ti-upload-tip-text-color: #666; + --ti-upload-picture-card-bg-color: #fbfdff; + --ti-upload-picture-card-border-color: #c0ccda; + --ti-upload-picture-card-border-radius: 6px; + --ti-upload-picture-card-hover-text-color: var(--ti-base-color-brand-5); + --ti-upload-picture-card-icon-font-size: 28px; + --ti-upload-picture-card-icon-color: #8c939d; +} diff --git a/packages/theme/src/user-account/index.js b/packages/theme/src/user-account/index.js new file mode 100644 index 000000000..7898f60a9 --- /dev/null +++ b/packages/theme/src/user-account/index.js @@ -0,0 +1,17 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-user-account-padding-vertical': '0', + 'tiny-user-account-padding-horizontal': '8px', + 'tiny-user-account-line-height': '36px' +} diff --git a/packages/theme/src/user-account/index.less b/packages/theme/src/user-account/index.less new file mode 100644 index 000000000..20df19446 --- /dev/null +++ b/packages/theme/src/user-account/index.less @@ -0,0 +1,35 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@user-contact-prefix-cls: ~'@{css-prefix}user-contact'; +@logout-prefix-cls: ~'@{css-prefix}logout'; + +.@{user-contact-prefix-cls} { + .component-css-vars-user-account(); + + &__main { + .user-account-pop { + padding: var(--ti-user-account-padding-vertical) var(--ti-user-account-padding-horizontal); + } + + .user-account-custom { + line-height: var(--ti-user-account-line-height); + } + + .@{logout-prefix-cls} { + line-height: var(--ti-user-account-line-height); + } + } +} diff --git a/packages/theme/src/user-account/vars.less b/packages/theme/src/user-account/vars.less new file mode 100644 index 000000000..c53435233 --- /dev/null +++ b/packages/theme/src/user-account/vars.less @@ -0,0 +1,17 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-user-account() { + --ti-user-account-padding-vertical: 0; + --ti-user-account-padding-horizontal: var(--ti-common-space-2x); + --ti-user-account-line-height: 36px; +} diff --git a/packages/theme/src/user-card/index.js b/packages/theme/src/user-card/index.js new file mode 100644 index 000000000..666db87a5 --- /dev/null +++ b/packages/theme/src/user-card/index.js @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-usercard-border-color': '#d9d9d9', + 'tiny-usercard-image-border-radius': '3px', + 'tiny-usercard-state-online-text-color': '#33cc00', + 'tiny-usercard-state-busy-text-color': '#ff3300', + 'tiny-usercard-state-goaway-text-color': '#ffae00', + 'tiny-usercard-state-offline-text-color': '#aeaeae' +} diff --git a/packages/theme/src/user-card/index.less b/packages/theme/src/user-card/index.less new file mode 100644 index 000000000..eed4aaab6 --- /dev/null +++ b/packages/theme/src/user-card/index.less @@ -0,0 +1,90 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@card-prefix-cls: ~'@{css-prefix}card'; + +.@{card-prefix-cls} { + .component-css-vars-user-card(); + + border: 1px solid var(--ti-usercard-border-color); + box-shadow: 2px 3px 7px rgba(0, 0, 0, 0.15); + + .dialog-foot { + display: block; + + > div { + width: 100%; + text-align: center; + } + } + + h5, + p { + margin: 5px 0; + } + + .card-top { + margin-bottom: 10px; + + img { + width: 80px; + height: 80px; + border-radius: var(--ti-usercard-image-border-radius, 3px); + } + + .card-top-text { + padding: 10px - 5px 10px; + overflow: hidden; + } + + .card-top-img, + .card-top-text { + display: inline-block; + vertical-align: middle; + } + } + + .card-bottom { + text-align: center; + display: block; + height: 20px; + margin: 0 -20px -20px; + } + + .espace-online { + color: var(--ti-usercard-state-online-text-color); + } + + .espace-busy { + color: var(--ti-usercard-state-busy-text-color); + font-size: 23px; + vertical-align: middle; + margin-top: -5px; + } + + .espace-goaway { + color: var(--ti-usercard-state-goaway-text-color); + background: #fff; + border-radius: 50%; + font-size: 13px; + } + + .espace-offline { + color: var(--ti-usercard-state-offline-text-color); + font-size: 23px; + vertical-align: middle; + margin-top: -5px; + } +} diff --git a/packages/theme/src/user-card/vars.less b/packages/theme/src/user-card/vars.less new file mode 100644 index 000000000..ccde2816a --- /dev/null +++ b/packages/theme/src/user-card/vars.less @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-user-card() { + --ti-usercard-border-color: var(--ti-base-color-border); + --ti-usercard-image-border-radius: var(--ti-base-radius-large); + --ti-usercard-state-online-text-color: #33cc00; + --ti-usercard-state-busy-text-color: #ff3300; + --ti-usercard-state-goaway-text-color: #ffae00; + --ti-usercard-state-offline-text-color: #aeaeae; +} diff --git a/packages/theme/src/user-contact/index.js b/packages/theme/src/user-contact/index.js new file mode 100644 index 000000000..ac3b3ba3c --- /dev/null +++ b/packages/theme/src/user-contact/index.js @@ -0,0 +1,23 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-user-contact-roleInfo-text-color': '#333', + 'tiny-user-contact-roleInfo-font-size': '12px', + 'tiny-user-contact-card-message-text-color': '#999', + 'tiny-user-contact-card-border-color': '#ddd', + 'tiny-user-contact-card-header-bg-color': '#3f4251', + 'tiny-user-contact-card-header-role-text-color': '#fff', + 'tiny-user-contact-card-header-role-font-size': '16px', + 'tiny-user-contact-card-header-roleNum-text-color': '#b9babc', + 'tiny-user-contact-card-espace-text-color': '#999' +} diff --git a/packages/theme/src/user-contact/index.less b/packages/theme/src/user-contact/index.less new file mode 100644 index 000000000..07722cce3 --- /dev/null +++ b/packages/theme/src/user-contact/index.less @@ -0,0 +1,201 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@user-contact-prefix-cls: ~'@{css-prefix}user-contact'; +@user-head-prefix-cls: ~'@{css-prefix}user-head'; +@espace-prefix-cls: ~'@{css-prefix}espace'; +@card-template-prefix-cls: ~'@{css-prefix}card-template'; +@logout-prefix-cls: ~'@{css-prefix}logout'; + +.@{user-contact-prefix-cls} { + .component-css-vars-user-contact(); + + position: relative; + display: inline-block; + font-size: 0; + + & &__main { + width: 300px; + overflow: visible; + font-size: var(--ti-user-contact-roleInfo-font-size); + + .@{user-head-prefix-cls} { + height: 100%; + width: 86px; + float: left; + } + + .@{user-head-prefix-cls}__portrait { + margin-top: 16px; + width: 54px; + height: 54px; + line-height: 54px; + margin-left: 20px; + } + + .@{user-contact-prefix-cls}__role { + height: 100%; + width: auto; + float: left; + margin-left: 0; + } + + .@{user-contact-prefix-cls}__role-name { + display: block; + width: 100%; + color: var(--ti-user-contact-card-header-role-text-color); + margin: 16px 0 6px; + height: 24px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + font-size: var(--ti-user-contact-card-header-role-font-size); + text-align: left; + } + + .@{user-contact-prefix-cls}__role-number { + display: block; + color: var(--ti-user-contact-card-header-roleNum-text-color); + } + + .@{css-prefix}espace svg { + fill: var(--ti-user-contact-card-message-left-color); + } + + .card-tools { + display: none; + } + } + + & &__header { + line-height: 1.42857143; + border: 1px solid var(--ti-user-contact-card-border-color); + height: 86px; + background: var(--ti-user-contact-card-header-bg-color); + opacity: 0.9; + } + + & &__title { + display: block; + height: 100%; + font-size: var(--ti-user-contact-roleInfo-font-size); + font-weight: normal; + line-height: 46px; + } + + & &__role { + display: inline-block; + color: var(--ti-user-contact-roleInfo-text-color); + margin-left: 8px; + vertical-align: middle; + font-size: var(--ti-user-contact-roleInfo-font-size); + line-height: 1.5; + } + + & &__arrow { + margin-left: 4px; + font-size: var(--ti-user-contact-roleInfo-font-size); + vertical-align: middle; + fill: var(--ti-user-contact-roleInfo-text-color); + } + + & &__message { + padding: 10px 20px; + } + + & &__state { + text-align: left; + margin-bottom: 0; + + &:nth-of-type(2) { + margin-top: 3px; + } + + &:nth-of-type(3) { + margin-top: 3px; + } + } + + & &__state-left { + color: var(--ti-user-contact-card-message-text-color); + opacity: 1; + font-size: var(--ti-common-font-size-base); + font-family: MicrosoftYaHei; + line-height: 16px; + text-align: left; + width: auto; + margin-right: 0; + } + + & &__state-right { + color: var(--ti-user-contact-card-message-text-color); + opacity: 1; + font-size: var(--ti-common-font-size-base); + font-family: MicrosoftYaHei; + line-height: 16px; + } + + &.@{css-prefix}popover.@{css-prefix}popper { + padding: 0; + border: 0; + border-radius: 0; + } + + .@{card-template-prefix-cls}__header.is-line { + height: auto; + border-bottom: 0; + padding: 0; + } + + .@{card-template-prefix-cls}__body { + padding: 0; + border: 1px solid var(--ti-user-contact-card-border-color); + } + + .@{user-head-prefix-cls} { + position: relative; + display: inline-block; + vertical-align: middle; + } + + .@{espace-prefix-cls} { + padding: 0px 20px 10px; + + .item-talk, + .item-call, + .item-email { + color: var(--ti-user-contact-card-espace-text-color); + } + } + + &.show-arrow { + .@{user-contact-prefix-cls}__main { + width: auto; + + .user-account-custom { + line-height: 30px; + } + + .@{logout-prefix-cls} { + line-height: 30px; + } + } + + .@{card-template-prefix-cls}__body { + min-width: 180px; + border-radius: 4px; + } + } +} diff --git a/packages/theme/src/user-contact/vars.less b/packages/theme/src/user-contact/vars.less new file mode 100644 index 000000000..169074932 --- /dev/null +++ b/packages/theme/src/user-contact/vars.less @@ -0,0 +1,23 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-user-contact() { + --ti-user-contact-roleInfo-text-color: var(--ti-base-color-info-normal); + --ti-user-contact-roleInfo-font-size: var(--ti-common-font-size-base); + --ti-user-contact-card-message-text-color: var(--ti-base-color-placeholder); + --ti-user-contact-card-border-color: #ddd; + --ti-user-contact-card-header-bg-color: #3f4251; + --ti-user-contact-card-header-role-text-color: var(--ti-base-color-light); + --ti-user-contact-card-header-role-font-size: var(--ti-common-font-size-2); + --ti-user-contact-card-header-roleNum-text-color: #b9babc; + --ti-user-contact-card-espace-text-color: var(--ti-base-color-placeholder); +} diff --git a/packages/theme/src/user-head/index.js b/packages/theme/src/user-head/index.js new file mode 100644 index 000000000..96aa204ca --- /dev/null +++ b/packages/theme/src/user-head/index.js @@ -0,0 +1,20 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +export default { + 'tiny-userhead-head-normal-size': '72px', + 'tiny-userhead-head-small-size': '30px', + 'tiny-userhead-head-icon-size-normal': '40px', + 'tiny-userhead-head-icon-small-size': '14px', + 'tiny-userhead-head-border-radius': '4px', + 'tiny-userhead-head-bg-color': '#bbbbbb', +} diff --git a/packages/theme/src/user-head/index.less b/packages/theme/src/user-head/index.less new file mode 100644 index 000000000..88e78561a --- /dev/null +++ b/packages/theme/src/user-head/index.less @@ -0,0 +1,122 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@user-head-prefix-cls: ~'@{css-prefix}user-head'; + +.@{user-head-prefix-cls} { + .component-css-vars-user-head(); + + display: inline-block; + position: relative; + + &__portrait { + overflow: hidden; + width: var(--ti-userhead-head-normal-size); + height: var(--ti-userhead-head-normal-size); + line-height: var(--ti-userhead-head-normal-size); + text-align: center; + border-radius: var(--ti-userhead-head-border-radius); + background-position: center center; + background-repeat: no-repeat; + background-size: cover; + background-color: var(--ti-userhead-head-bg-color, #bbbbbb); + + &.round { + border-radius: 50%; + } + + &.min { + width: var(--ti-userhead-head-small-size); + height: var(--ti-userhead-head-small-size); + line-height: var(--ti-userhead-head-small-size); + } + + &.icon { + font-size: var(--ti-userhead-head-icon-size-normal); + + &.min { + font-size: var(--ti-userhead-head-icon-small-size); + } + + svg { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + } + } + + &.label { + > span { + overflow: hidden; + width: calc(~'100% - 6px'); + display: block; + margin: 0 3px; + } + } + } + + &__message { + position: absolute; + top: -9px; + left: 63px; + height: 18px; + line-height: 16px; + min-width: 18px; + width: auto; + border-radius: 9px; + background: red; + color: #fff; + text-align: center; + padding: 0 2px; + border: 2px solid #fff; + font-size: var(--ti-common-font-size-base); + word-break: initial; + + &.round { + top: 0; + left: 54px; + } + + &.min { + top: -9px; + left: 21px; + } + + &.basic { + top: -4px; + left: 68px; + height: 8px; + width: 8px; + min-width: 8px; + line-height: 0; + border-radius: 4px; + + &.round { + top: 10px; + left: 64px; + } + + &.min { + top: -4px; + left: 26px; + + &.round { + top: 0; + } + } + } + } +} diff --git a/packages/theme/src/user-head/vars.less b/packages/theme/src/user-head/vars.less new file mode 100644 index 000000000..edfdf1725 --- /dev/null +++ b/packages/theme/src/user-head/vars.less @@ -0,0 +1,20 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-user-head() { + --ti-userhead-head-normal-size: var(--ti-common-size-18x); + --ti-userhead-head-small-size: 30px; + --ti-userhead-head-icon-size-normal: var(--ti-common-size-10x); + --ti-userhead-head-icon-small-size: 14px; + --ti-userhead-head-border-radius: var(--ti-common-border-radius-1); + --ti-userhead-head-bg-color: #bbbbbb; +} diff --git a/packages/theme/src/user-link/index.js b/packages/theme/src/user-link/index.js new file mode 100644 index 000000000..5d4797949 --- /dev/null +++ b/packages/theme/src/user-link/index.js @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-user-link-font-size': '12px', + 'tiny-user-link-text-color': '#333', + 'tiny-user-link-font-weight': '700', + 'tiny-user-link-border-radius': '3px' +} diff --git a/packages/theme/src/user-link/index.less b/packages/theme/src/user-link/index.less new file mode 100644 index 000000000..29fca922f --- /dev/null +++ b/packages/theme/src/user-link/index.less @@ -0,0 +1,88 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@userlink-prefix-cls: ~'@{css-prefix}userlink'; +@user-card-prefix-cls: ~'@{css-prefix}user-card'; + +.@{userlink-prefix-cls} { + .component-css-vars-user-link(); + + li { + float: left; + list-style: none; + + .@{css-prefix}popover__reference { + font-size: var(--ti-common-font-size-base); + color: #1890ff; + + &:hover { + color: #40a9ff; + text-decoration: none; + cursor: pointer; + } + } + } + + .@{user-card-prefix-cls} { + width: 600px; + } +} + +.@{user-card-prefix-cls} { + .card-box { + font-size: var(--ti-user-link-font-size); + color: var(--ti-user-link-text-color); + font-weight: var(--ti-user-link-font-weight); + + .card-box__body { + .card-top-img, + .card-top-text { + display: inline-block; + vertical-align: middle; + } + + .card-top-img { + width: 80px; + border-radius: var(--ti-user-link-border-radius); + + img { + width: 100%; + } + } + + .card-top-text { + padding: 5px 10px; + overflow: hidden; + } + + .card-center { + margin-top: 10px; + } + } + + .box__footer { + text-align: center; + cursor: pointer; + } + + p { + margin: 5px 0; + } + } + + &.@{css-prefix}popover.@{css-prefix}popper { + padding: 24px; + } +} diff --git a/packages/theme/src/user-link/vars.less b/packages/theme/src/user-link/vars.less new file mode 100644 index 000000000..d85229827 --- /dev/null +++ b/packages/theme/src/user-link/vars.less @@ -0,0 +1,18 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-user-link() { + --ti-user-link-font-size: var(--ti-common-font-size-base); + --ti-user-link-text-color: var(--ti-base-color-info-normal); + --ti-user-link-font-weight: var(--ti-common-font-weight-7); + --ti-user-link-border-radius: var(--ti-base-radius-large); +} diff --git a/packages/theme/src/user/index.js b/packages/theme/src/user/index.js new file mode 100644 index 000000000..2e1de3ad1 --- /dev/null +++ b/packages/theme/src/user/index.js @@ -0,0 +1,17 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-user-font-size': '12px', + 'tiny-user-tag-bg-color': '#e6f7ff', + 'tiny-user-svg-text-color': '#1890ff' +} diff --git a/packages/theme/src/user/index.less b/packages/theme/src/user/index.less new file mode 100644 index 000000000..4185dc3a3 --- /dev/null +++ b/packages/theme/src/user/index.less @@ -0,0 +1,77 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../custom.less'; +@import './vars.less'; + +@user-prefix-cls: ~'@{css-prefix}user'; +@tag-prefix-cls: ~'@{css-prefix}tag'; +@input-prefix-cls: ~'@{css-prefix}input'; +@select-prefix-cls: ~'@{css-prefix}select'; +@svg-prefix-cls: ~'@{css-prefix}svg'; + +.@{user-prefix-cls} { + .component-css-vars-user(); + + &.mini { + height: 30px; + } + + & &__select { + width: 100%; + + .@{input-prefix-cls} { + .@{svg-prefix-cls} { + fill: var(--ti-user-svg-text-color); + } + + &.is-disabled .@{svg-prefix-cls} { + fill: var(--ti-input-normal-disabled-color); + } + } + + .@{select-prefix-cls}__input { + height: 20px; + } + } + + & &__ghost { + &.@{tag-prefix-cls} { + background: var(--ti-user-tag-bg-color); + } + } + + &_select { + max-width: 50%; + width: auto; + font-size: var(--ti-user-font-size); + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + + &.left { + float: left; + margin-right: 4px; + } + + &.right { + float: right; + margin-left: 4px; + } + } + + &__select-dropdown { + display: flex; + justify-content: flex-start; + align-items: center; + } +} diff --git a/packages/theme/src/user/vars.less b/packages/theme/src/user/vars.less new file mode 100644 index 000000000..0ee9390d3 --- /dev/null +++ b/packages/theme/src/user/vars.less @@ -0,0 +1,17 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-user() { + --ti-user-font-size: var(--ti-common-font-size-base); + --ti-user-tag-bg-color: var(--ti-base-color-hover-background); + --ti-user-svg-text-color: var(--ti-base-color-brand-6); +} diff --git a/packages/theme/src/vars.less b/packages/theme/src/vars.less new file mode 100644 index 000000000..cadd1132c --- /dev/null +++ b/packages/theme/src/vars.less @@ -0,0 +1,53 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import './base/vars.less'; +@import './alert/vars.less'; +@import './badge/vars.less'; +@import './breadcrumb/vars.less'; +@import './bulletin-board/vars.less'; +@import './button/vars.less'; +@import './button-group/vars.less'; +@import './calendar/vars.less'; +@import './card-layout/vars.less'; +@import './card-container/vars.less'; +@import './card-template/vars.less'; +@import './carousel/vars.less'; +@import './carousel-item/vars.less'; +@import './checkbox/vars.less'; +@import './dialog-box/vars.less'; +@import './espace/vars.less'; +@import './fall-menu/vars.less'; +@import './floatbar/vars.less'; +@import './form-item/vars.less'; +@import './input/vars.less'; +@import './ip-address/vars.less'; +@import './loading/vars.less'; +@import './menubar/vars.less'; +@import './milestone/vars.less'; +@import './pager/vars.less'; +@import './panel/vars.less'; +@import './popover/vars.less'; +@import './slider/vars.less'; +@import './radio/vars.less'; +@import './scroll-text/vars.less'; +@import './search/vars.less'; +@import './slide-bar/vars.less'; +@import './split/vars.less'; +@import './steps/vars.less'; +@import './switch/vars.less'; +@import './grid/vars.less'; +@import './tabs/vars.less'; +@import './tag/vars.less'; +@import './user-contact/vars.less'; +@import './user-head/vars.less'; +@import './tooltip/vars.less'; diff --git a/packages/theme/src/vars/index.js b/packages/theme/src/vars/index.js new file mode 100644 index 000000000..d9558687b --- /dev/null +++ b/packages/theme/src/vars/index.js @@ -0,0 +1,169 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +import Alert from '../alert' +import Amount from '../amount' +import Area from '../area' +import Badge from '../badge' +import Base from '../base' +import Breadcrumb from '../breadcrumb' +import BulletinBoard from '../bulletin-board' +import Button from '../button' +import ButtonGroup from '../button-group' +import Calendar from '../calendar' +import Card from '../card' +import CardContainer from '../card-container' +import CardItem from '../card-item' +import CardLayout from '../card-layout' +import CardTemplate from '../card-template' +import Carousel from '../carousel' +import CarouselItem from '../carousel-item' +import Col from '../col' +import Company from '../company' +import Container from '../container' +import Country from '../country' +import Crop from '../crop' +import Currency from '../currency' +import Dept from '../dept' +import DetailPage from '../detail-page' +import DialogBox from '../dialog-box' +import DropRoles from '../drop-roles' +import DropTimes from '../drop-times' +import Espace from '../espace' +import FallMenu from '../fall-menu' +import Floatbar from '../floatbar' +import Form from '../form' +import FormItem from '../form-item' +import Grid from '../grid' +import Hrapprover from '../hrapprover' +import Input from '../input' +import IpAddress from '../ip-address' +import Layout from '../layout' +import LinkMenu from '../link-menu' +import Loading from '../loading' +import Locales from '../locales' +import Menubar from '../menubar' +import NavMenu from '../nav-menu' +import Numeric from '../numeric' +import Pager from '../pager' +import Pbi from '../pbi' +import Poplist from '../poplist' +import Popover from '../popover' +import Radio from '../radio' +import Rate from '../rate' +import Roles from '../roles' +import Row from '../row' +import ScrollText from '../scroll-text' +import Search from '../search' +import Selector from '../selector' +import SlideBar from '../slide-bar' +import SlideImg from '../slide-img' +import Slider from '../slider' +import Split from '../split' +import Steps from '../steps' +import Switch from '../switch' +import Tabs from '../tabs' +import Tag from '../tag' +import TextPopup from '../text-popup' +import Time from '../time' +import Tip from '../tip' +import ToggleMenu from '../toggle-menu' +import Transfer from '../transfer' +import Tree from '../tree' +import TreeMenu from '../tree-menu' +import User from '../user' +import UserAccount from '../user-account' +import UserCard from '../user-card' +import UserContact from '../user-contact' +import UserHead from '../user-head' +import UserLink from '../user-link' +import Wizard from '../wizard' + +export default { + ...Alert, + ...Amount, + ...Area, + ...Base, + ...Badge, + ...Breadcrumb, + ...BulletinBoard, + ...Button, + ...ButtonGroup, + ...Calendar, + ...Card, + ...CardContainer, + ...CardLayout, + ...CardItem, + ...CardTemplate, + ...Carousel, + ...CarouselItem, + ...Col, + ...Company, + ...Container, + ...Country, + ...Currency, + ...Crop, + ...Dept, + ...DetailPage, + ...DialogBox, + ...DropRoles, + ...DropTimes, + ...Espace, + ...Floatbar, + ...FallMenu, + ...Form, + ...FormItem, + ...Grid, + ...Hrapprover, + ...Input, + ...IpAddress, + ...LinkMenu, + ...Layout, + ...Loading, + ...Locales, + ...Menubar, + ...NavMenu, + ...Numeric, + ...Pager, + ...Pbi, + ...Popover, + ...Poplist, + ...Radio, + ...Rate, + ...Roles, + ...Row, + ...ScrollText, + ...Search, + ...Selector, + ...SlideBar, + ...SlideImg, + ...Slider, + ...Steps, + ...Split, + ...Switch, + ...Tabs, + ...Tag, + ...TextPopup, + ...Time, + ...Tip, + ...ToggleMenu, + ...Tree, + ...Transfer, + ...TreeMenu, + ...User, + ...UserAccount, + ...UserCard, + ...UserContact, + ...UserLink, + ...UserHead, + ...Wizard +} diff --git a/packages/theme/src/wizard/index.js b/packages/theme/src/wizard/index.js new file mode 100644 index 000000000..2a15d1723 --- /dev/null +++ b/packages/theme/src/wizard/index.js @@ -0,0 +1,21 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +export default { + 'tiny-wizard-font-size': '12px', + 'tiny-wizard-text-color': '#333', + 'tiny-wizard-icon-color': '#fff', + 'tiny-wizard-icon-bg-color': '#1890ff', + 'tiny-wizard-detail-border-radius': '2px', + 'tiny-wizard-detail-bg-color': '#faad14', + 'tiny-wizard-chart-icon-bg-color': '#d9d9d9' +} diff --git a/packages/theme/src/wizard/index.less b/packages/theme/src/wizard/index.less new file mode 100644 index 000000000..b0b271993 --- /dev/null +++ b/packages/theme/src/wizard/index.less @@ -0,0 +1,309 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +@import '../mixins/wizard.less'; +@import '../custom.less'; +@import './vars.less'; + +@wizard-prefix-cls: ~'@{css-prefix}wizard'; +@user-contact-prefix-cls: ~'@{css-prefix}user-contact'; +@user-head-prefix-cls: ~'@{css-prefix}user-head'; +@svg-prefix-cls: ~'@{css-prefix}svg'; +@svg-wrapper-prefix-cls: ~'@{css-prefix}wizard__chart-svg'; + +.@{wizard-prefix-cls} { + .component-css-vars-wizard(); + + & &__nomarl { + .@{wizard-prefix-cls}__steps { + display: flex; + align-items: center; + } + + .@{wizard-prefix-cls}__chart span { + display: inline-block; + } + + .@{wizard-prefix-cls}__name { + margin-top: 6px; + overflow: hidden; + text-align: center; + + .name { + font-size: var(--ti-wizard-font-size); + width: 100%; + } + } + + .@{wizard-prefix-cls}__button { + margin-top: 10px; + text-align: right; + } + } + + & &__vertical { + .@{wizard-prefix-cls}__steps-item { + &.is-doing { + .@{wizard-prefix-cls}__chart-icon { + .wizard-icon-color( + var(--ti-wizard-icon-color), + var(--ti-wizard-icon-bg-color) + ); + + .@{wizard-prefix-cls}__chart-line { + &, + &.is-time-line { + .wizard-line-color(var(--ti-wizard-icon-bg-color)); + } + } + } + } + + &:last-child > ul .@{wizard-prefix-cls}__chart-line { + background: none; + } + } + + .@{wizard-prefix-cls}__chart-line { + height: 88px; + width: 4px; + top: 0px; + position: relative; + display: inline-block; + } + + .@{wizard-prefix-cls}__chart-name { + font-size: var(--ti-common-font-size-1); + margin-left: 15px; + display: inline-flex; + flex-direction: column; + transform: translateY(-50%); + position: relative; + top: -5px; + } + + .@{wizard-prefix-cls}__chart-icon { + position: relative; + left: 50%; + top: -14px; + transform: translateX(-50%); + } + + .@{wizard-prefix-cls}__time-wrapper { + position: relative; + left: 50%; + top: -14px; + transform: translateX(-50%); + fill: var(--ti-wizard-icon-bg-color); + font-size: var(--ti-common-font-size-5); + box-sizing: border-box; + width: 24px; + height: 24px; + display: flex; + border-radius: 50%; + text-align: center; + background: var(--ti-wizard-icon-color); + border: 2px solid var(--ti-wizard-icon-bg-color); + justify-content: center; + + .@{svg-prefix-cls} { + width: 16px; + height: 20px; + } + } + + .@{wizard-prefix-cls}__chart-children { + position: relative; + + .children-name { + position: absolute; + margin-left: 15px; + } + } + } + + & &__date { + min-width: 100px; + width: auto; + color: var(--ti-wizard-text-color); + font-size: var(--ti-wizard-font-size); + line-height: 1.2em; + display: inline-block; + text-align: right; + position: relative; + top: -24px; + right: 15px; + + .date-icon { + margin-left: 4px; + } + + span { + vertical-align: middle; + } + + &.time-line-text { + top: -14px; + } + } + + & &__steps-item { + &.is-ready { + .name { + color: var(--ti-wizard-icon-bg-color); + } + + .@{wizard-prefix-cls}__chart-icon { + .wizard-icon-color( + var(--ti-wizard-icon-color), + var(--ti-wizard-icon-bg-color) + ); + } + + .@{wizard-prefix-cls}__chart-line { + .wizard-line-color(var(--ti-wizard-icon-bg-color)); + } + } + + ul { + list-style: none; + } + } + + & &__chart { + display: flex; + justify-content: flex-start; + align-items: center; + + & > .@{svg-wrapper-prefix-cls} { + & > .@{svg-prefix-cls} { + font-size: var(--ti-common-font-size-4); + fill: var(--ti-wizard-icon-bg-color); + } + } + } + + & &__steps-item, + & &__chart-children { + &.is-ready, + &.is-doing { + .@{wizard-prefix-cls}__chart-icon { + .wizard-icon-color( + var(--ti-wizard-icon-color), + var(--ti-wizard-icon-bg-color) + ); + } + } + + &.is-doing .@{wizard-prefix-cls}__chart-line { + .wizard-line-color(var(--ti-wizard-icon-bg-color)); + } + } + + & &__chart-children.is-ready .@{wizard-prefix-cls}__chart-line, + & &__chart-line.is-time-line { + .wizard-line-color(var(--ti-wizard-icon-bg-color)); + } + + & &__chart-detail { + padding: 4px 8px; + border-radius: 2px; + border-radius: var(--ti-wizard-detail-border-radius, 2px); + min-height: 26px; + height: auto; + line-height: 1; + margin-left: 12px; + text-align: center; + display: inline-block; + position: absolute; + top: -14px; + + &:hover { + background: var(--ti-wizard-detail-bg-color); + + &::before { + content: ''; + width: 0; + height: 0; + margin-top: -4px; + border-style: solid; + border-width: 4px 4px 4px 0; + border-color: transparent var(--ti-wizard-detail-bg-color); + position: absolute; + left: -4px; + top: 10px; + } + + .detail-title, + .@{user-contact-prefix-cls}__role { + color: var(--ti-wizard-icon-color); + } + } + + .detail-title { + color: var(--ti-wizard-text-color); + font-size: var(--ti-common-font-size-1); + font-weight: 700; + margin-bottom: 8px; + } + } + + & &__chart-icon { + width: 20px; + height: 20px; + line-height: 20px; + border-radius: 50%; + font-size: var(--ti-common-font-size-base); + text-align: center; + background: var(--ti-wizard-chart-icon-bg-color); + color: var(--ti-wizard-icon-color); + box-sizing: content-box; + // 垂直简易流程图加 + display: inline-block; + + &.time-line-icon { + width: 10px; + height: 10px; + line-height: 10px; + } + } + + & &__chart-icon, + & &__chart-name, + & &__date, + .@{svg-prefix-cls} { + cursor: pointer; + } + + & &__chart-line { + height: 4px; + background: #c2c4c7; + width: 50px; + } + + & &__chart-line &__chart-icon-time { + font-size: var(--ti-common-font-size-4); + fill: var(--ti-wizard-icon-bg-color); + background: var(--ti-wizard-icon-color); + } + + .@{user-contact-prefix-cls} { + .dropdown-part .@{user-head-prefix-cls}, + .@{svg-prefix-cls} { + display: none; + } + + .@{user-contact-prefix-cls}__role span { + display: inline-block; + } + } +} diff --git a/packages/theme/src/wizard/vars.less b/packages/theme/src/wizard/vars.less new file mode 100644 index 000000000..61325dd7f --- /dev/null +++ b/packages/theme/src/wizard/vars.less @@ -0,0 +1,21 @@ +/** +* Copyright (c) 2022 - present TinyVue Authors. +* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. +* +* Use of this source code is governed by an MIT-style license. +* +* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, +* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR +* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. +* +*/ + +.component-css-vars-wizard() { + --ti-wizard-font-size: var(--ti-common-font-size-base); + --ti-wizard-text-color: var(--ti-base-color-info-normal); + --ti-wizard-icon-color: var(--ti-base-color-light); + --ti-wizard-icon-bg-color: var(--ti-base-color-brand-6); + --ti-wizard-detail-border-radius: var(--ti-common-border-radius-normal); + --ti-wizard-detail-bg-color: var(--ti-base-color-warning-normal); + --ti-wizard-chart-icon-bg-color: #d9d9d9; +} diff --git a/packages/time-line/index.js b/packages/time-line/index.js deleted file mode 100644 index 22725f61f..000000000 --- a/packages/time-line/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import TimeLine from './src/index' - -/* istanbul ignore next */ -TimeLine.install = function (Vue) { - Vue.component(TimeLine.name, TimeLine) -} - -TimeLine.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - TimeLine.install(window.Vue) - } -} - -export default TimeLine diff --git a/packages/time-line/package.json b/packages/time-line/package.json deleted file mode 100644 index 0043b7efa..000000000 --- a/packages/time-line/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-time-line", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/time-line/src/index.js b/packages/time-line/src/index.js deleted file mode 100644 index d2d3bd5f1..000000000 --- a/packages/time-line/src/index.js +++ /dev/null @@ -1,78 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $prefix, $props, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const $constants = { - PROCESS_DONE_CLS: 'process-done', - PROCESS_CUR_CLS: 'process-current', - PROCESS_WAIT_CLS: 'process-wait' -} - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'TimeLine', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - vertical: { - type: Boolean, - default: false - }, - horizontal: { - type: Boolean, - default: false - }, - showNumber: { - type: Boolean, - default: true - }, - nameField: { - type: String, - default: 'name' - }, - timeField: { - type: String, - default: 'time' - }, - start: { - type: Number, - default: 1 - }, - data: Array, - space: Number, - active: { - type: Number, - default: -1 - }, - reverse: { - type: Boolean, - default: false - }, - showStatus: { - type: Boolean, - default: false - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/time-line/src/pc.vue b/packages/time-line/src/pc.vue deleted file mode 100644 index 73c0ccebe..000000000 --- a/packages/time-line/src/pc.vue +++ /dev/null @@ -1,105 +0,0 @@ - - - - diff --git a/packages/time-panel/index.js b/packages/time-panel/index.js deleted file mode 100644 index 6f9b6880f..000000000 --- a/packages/time-panel/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import TimePanel from './src/index.vue' - -/* istanbul ignore next */ -TimePanel.install = function (Vue) { - Vue.component(TimePanel.name, TimePanel) -} - -TimePanel.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - TimePanel.install(window.Vue) - } -} - -export default TimePanel diff --git a/packages/time-panel/package.json b/packages/time-panel/package.json deleted file mode 100644 index 1e33d9fb4..000000000 --- a/packages/time-panel/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-time-panel", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-scrollbar": "~0.1.0", - "@opentiny/vue-numeric": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/time-panel/src/index.vue b/packages/time-panel/src/index.vue deleted file mode 100644 index 9f8a3ff96..000000000 --- a/packages/time-panel/src/index.vue +++ /dev/null @@ -1,59 +0,0 @@ - - - - diff --git a/packages/time-picker/index.js b/packages/time-picker/index.js deleted file mode 100644 index a74729c54..000000000 --- a/packages/time-picker/index.js +++ /dev/null @@ -1,40 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Picker from '@opentiny/vue-picker' -import { extend } from '@opentiny/vue-renderless/common/object' -import { $prefix } from '@opentiny/vue-common' - -const TimePicker = extend(true, { props: { componentName: { type: String, default: 'TimePicker' } } }, Picker, { - props: { - type: { - type: String, - default: 'time' - } - }, - name: $prefix + 'TimePicker' -}) - -/* istanbul ignore next */ -TimePicker.install = function (Vue) { - Vue.component(TimePicker.name, TimePicker) -} - -TimePicker.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - TimePicker.install(window.Vue) - } -} - -export default TimePicker diff --git a/packages/time-picker/package.json b/packages/time-picker/package.json deleted file mode 100644 index 82340a87d..000000000 --- a/packages/time-picker/package.json +++ /dev/null @@ -1,15 +0,0 @@ -{ - "name": "@opentiny/vue-time-picker", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/time-range/index.js b/packages/time-range/index.js deleted file mode 100644 index 64ba5197e..000000000 --- a/packages/time-range/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import TimeRange from './src/index.vue' - -/* istanbul ignore next */ -TimeRange.install = function (Vue) { - Vue.component(TimeRange.name, TimeRange) -} - -TimeRange.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - TimeRange.install(window.Vue) - } -} - -export default TimeRange diff --git a/packages/time-range/package.json b/packages/time-range/package.json deleted file mode 100644 index a193374f1..000000000 --- a/packages/time-range/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-time-range", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0", - "@opentiny/vue-time-spinner": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/time-range/src/index.vue b/packages/time-range/src/index.vue deleted file mode 100644 index 138fc36e9..000000000 --- a/packages/time-range/src/index.vue +++ /dev/null @@ -1,92 +0,0 @@ - - - - - diff --git a/packages/time-select/index.js b/packages/time-select/index.js deleted file mode 100644 index d0872efd5..000000000 --- a/packages/time-select/index.js +++ /dev/null @@ -1,40 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Picker from '@opentiny/vue-picker' -import { extend } from '@opentiny/vue-renderless/common/object' -import { $prefix } from '@opentiny/vue-common' - -const TimeSelect = extend(true, { props: { componentName: { type: String, default: 'TimeSelect' } } }, Picker, { - props: { - type: { - type: String, - default: 'time' - } - }, - name: $prefix + 'TimeSelect' -}) - -/* istanbul ignore next */ -TimeSelect.install = function (Vue) { - Vue.component(TimeSelect.name, TimeSelect) -} - -TimeSelect.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - TimeSelect.install(window.Vue) - } -} - -export default TimeSelect diff --git a/packages/time-select/package.json b/packages/time-select/package.json deleted file mode 100644 index ff404f24e..000000000 --- a/packages/time-select/package.json +++ /dev/null @@ -1,15 +0,0 @@ -{ - "name": "@opentiny/vue-time-select", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/time-spinner/index.js b/packages/time-spinner/index.js deleted file mode 100644 index e787213cb..000000000 --- a/packages/time-spinner/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import TimeSpinner from './src/index.vue' - -/* istanbul ignore next */ -TimeSpinner.install = function (Vue) { - Vue.component(TimeSpinner.name, TimeSpinner) -} - -TimeSpinner.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - TimeSpinner.install(window.Vue) - } -} - -export default TimeSpinner diff --git a/packages/time-spinner/package.json b/packages/time-spinner/package.json deleted file mode 100644 index 98699af1c..000000000 --- a/packages/time-spinner/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-time-spinner", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-scrollbar": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/time-spinner/src/index.vue b/packages/time-spinner/src/index.vue deleted file mode 100644 index 466cee594..000000000 --- a/packages/time-spinner/src/index.vue +++ /dev/null @@ -1,177 +0,0 @@ - - - - - diff --git a/packages/time/index.js b/packages/time/index.js deleted file mode 100644 index ef5d7d434..000000000 --- a/packages/time/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Time from './src/index.vue' - -/* istanbul ignore next */ -Time.install = function (Vue) { - Vue.component(Time.name, Time) -} - -Time.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Time.install(window.Vue) - } -} - -export default Time diff --git a/packages/time/package.json b/packages/time/package.json deleted file mode 100644 index 4a7b79669..000000000 --- a/packages/time/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-time", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0", - "@opentiny/vue-time-spinner": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/time/src/index.vue b/packages/time/src/index.vue deleted file mode 100644 index 77225a050..000000000 --- a/packages/time/src/index.vue +++ /dev/null @@ -1,60 +0,0 @@ - - - - diff --git a/packages/toggle-menu/index.js b/packages/toggle-menu/index.js deleted file mode 100644 index e7827aad5..000000000 --- a/packages/toggle-menu/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import ToggleMenu from './src/index.js' -import '@opentiny/vue-theme/toggle-menu/index.css' - -/* istanbul ignore next */ -ToggleMenu.install = function (Vue) { - Vue.component(ToggleMenu.name, ToggleMenu) -} - -ToggleMenu.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - ToggleMenu.install(window.Vue) - } -} - -export default ToggleMenu diff --git a/packages/toggle-menu/package.json b/packages/toggle-menu/package.json deleted file mode 100644 index e90c6570a..000000000 --- a/packages/toggle-menu/package.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "name": "@opentiny/vue-toggle-menu", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-input": "~0.1.0", - "@opentiny/vue-tree": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/toggle-menu/src/index.js b/packages/toggle-menu/src/index.js deleted file mode 100644 index 9352200c0..000000000 --- a/packages/toggle-menu/src/index.js +++ /dev/null @@ -1,75 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - LOCALE_PLACEHOLDER: 'ui.toggleMenu.placeholder' -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'ToggleMenu', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - data: Array, - placeholder: { - type: String, - default: '' - }, - icon: Object, - defaultExpandAll: { - type: Boolean, - default: false - }, - draggable: { - type: Boolean, - default: false - }, - expandOnClickNode: { - type: Boolean, - default: true - }, - ellipsis: { - type: Boolean, - default: false - }, - wrap: { - type: Boolean, - default: false - }, - showFilter: { - type: Boolean, - default: true - }, - automaticFiltering: { - type: Boolean, - default: true - }, - props: { - default: () => ({ children: 'children', disabled: 'disabled', label: 'label' }) - }, - getMenuDataSync: Function, // deprecated v3.4.0废弃, v3.16.0移除;移除原因:如果是同步数据则和:data功能重复 - getMenuDataAsync: Function, - accordion: Boolean, - defaultCheckedKeys: Array, - showCheckbox: Boolean - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/toggle-menu/src/pc.vue b/packages/toggle-menu/src/pc.vue deleted file mode 100644 index e062b9a95..000000000 --- a/packages/toggle-menu/src/pc.vue +++ /dev/null @@ -1,119 +0,0 @@ - - - - - diff --git a/packages/tooltip/index.js b/packages/tooltip/index.js deleted file mode 100644 index 4b9d50cfd..000000000 --- a/packages/tooltip/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Tooltip from './src/index.vue' -import '@opentiny/vue-theme/tooltip/index.css' - -Tooltip.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Tooltip.install = function (Vue) { - Vue.component(Tooltip.name, Tooltip) -} - -Tooltip.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Tooltip.install(window.Vue) - } -} - -export default Tooltip diff --git a/packages/tooltip/package.json b/packages/tooltip/package.json deleted file mode 100644 index 336693f4e..000000000 --- a/packages/tooltip/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-tooltip", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/tooltip/src/index.vue b/packages/tooltip/src/index.vue deleted file mode 100644 index 9b02b6494..000000000 --- a/packages/tooltip/src/index.vue +++ /dev/null @@ -1,227 +0,0 @@ - - - diff --git a/packages/top-box/index.js b/packages/top-box/index.js deleted file mode 100644 index ab1f2491a..000000000 --- a/packages/top-box/index.js +++ /dev/null @@ -1,166 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { createComponent, emitter } from '@opentiny/vue-common' -import TopBoxConstructor from './src/index.js' -import '@opentiny/vue-theme/top-box/index.css' - -let instances = [] -let seed = 1 - -const handleTopBoxMounted = ({ instance, options }) => { - instance.$el.style.zIndex = instance.getZindex() - - let { state } = instance - - for (let key in options) { - if (Object.prototype.hasOwnProperty.call(state, key)) { - state[key] = options[key] - } - } - - let verticalOffset = options.offset || 20 - - instances.forEach((item) => { - verticalOffset += item.$el.offsetHeight + 16 - }) - - state.verticalOffset = verticalOffset - state.visible = true - - if (state.buttons && state.buttons.length) { - state.buttons.map((button, key) => { - if (key === 0) { - !button.type && (button.type = 'primary') - !button.onClick && - (button.onClick = () => { - instance.close() - }) - } else { - !button.onClick && - (button.onClick = () => { - // do nothing - }) - } - - return button - }) - } - - instance.startTimer() -} - -const TopBox = function (options) { - const _emitter = emitter() - options = options || {} - - if (typeof options === 'string') { - options = { - message: options - } - } - - let id = 'message_' + seed++ - let userOnClose = options.onClose - - options.onClose = function () { - TopBox.close(id, userOnClose) - } - - options.emitter = _emitter - - let instance = createComponent({ - el: document.createElement('div'), - propsData: options, - component: TopBoxConstructor - }) - - instance.id = id - - document.body.appendChild(instance.$el) - instances.push(instance) - - _emitter.on('TopBoxMounted', () => { - handleTopBoxMounted({ instance, options }) - }) - - return instance -} - -const topBox = TopBox - -const types = ['success', 'warning', 'info', 'error', 'help'] - -types.forEach((type) => { - TopBox[type] = (options) => { - if (typeof options === 'string') { - options = { - message: options - } - } - - options.type = type - - return topBox(options) - } -}) - -const findRemove = ({ id, len, userOnClose }) => { - let index = -1 - let removedHeight = 0 - let instance - - for (let i = 0; i < len; i++) { - let tmp = instances[i] - if (tmp.id === id) { - index = i - removedHeight = tmp.$el.offsetHeight - instance = tmp - break - } - } - - if (instance) { - typeof userOnClose === 'function' && userOnClose(instance) - instances.splice(index, 1) - } - - return { index, removedHeight } -} - -const adjustTopOther = ({ index, len, removedHeight }) => { - for (let i = index; i < len - 1; i++) { - let dom = instances[i].$el - dom.style.top = parseInt(dom.style.top, 10) - removedHeight - 16 + 'px' - } -} - -TopBox.close = function (id, userOnClose) { - let len = instances.length - let { index, removedHeight } = findRemove({ id, len, userOnClose }) - - if (len <= 1 || index === -1 || index > instances.length - 1) return - // removedHeight = instances[index].$el.offsetHeight - adjustTopOther({ index, len, removedHeight }) -} - -TopBox.closeAll = function () { - let copys = instances.slice(0) - - copys = copys.reverse() - copys.forEach((instance) => { - instance.close() - }) -} - -TopBox.version = process.env.COMPONENT_VERSION - -export default TopBox diff --git a/packages/top-box/package.json b/packages/top-box/package.json deleted file mode 100644 index e99e4b86f..000000000 --- a/packages/top-box/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-top-box", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-button": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/top-box/src/index.js b/packages/top-box/src/index.js deleted file mode 100644 index 295411281..000000000 --- a/packages/top-box/src/index.js +++ /dev/null @@ -1,38 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - SUCCESS: 'icon-success', - INFO: 'icon-info', - WARNING: 'icon-warning', - ERROR: 'icon-error', - HELP: 'icon-help' -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'TopBox', - props: { - ...$props, - emitter: Object, - _constants: { - type: Object, - default: () => $constants - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/top-box/src/pc.vue b/packages/top-box/src/pc.vue deleted file mode 100644 index bf1759f86..000000000 --- a/packages/top-box/src/pc.vue +++ /dev/null @@ -1,66 +0,0 @@ - - - - - diff --git a/packages/transfer-panel/index.js b/packages/transfer-panel/index.js deleted file mode 100644 index a46632152..000000000 --- a/packages/transfer-panel/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import TransferPanel from './src/index.vue' - -/* istanbul ignore next */ -TransferPanel.install = function (Vue) { - Vue.component(TransferPanel.name, TransferPanel) -} - -TransferPanel.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - TransferPanel.install(window.Vue) - } -} - -export default TransferPanel diff --git a/packages/transfer-panel/package.json b/packages/transfer-panel/package.json deleted file mode 100644 index e404ab733..000000000 --- a/packages/transfer-panel/package.json +++ /dev/null @@ -1,20 +0,0 @@ -{ - "name": "@opentiny/vue-transfer-panel", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0", - "@opentiny/vue-checkbox": "~0.1.0", - "@opentiny/vue-input": "~0.1.0", - "@opentiny/vue-pager": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/transfer-panel/src/index.vue b/packages/transfer-panel/src/index.vue deleted file mode 100644 index 4f4c45cd7..000000000 --- a/packages/transfer-panel/src/index.vue +++ /dev/null @@ -1,173 +0,0 @@ - - - - - diff --git a/packages/transfer/index.js b/packages/transfer/index.js deleted file mode 100644 index 7fb1d14c0..000000000 --- a/packages/transfer/index.js +++ /dev/null @@ -1,34 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Transfer from './src/index.js' -import '@opentiny/vue-theme/transfer/index.css' - -Transfer.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -Transfer.install = function (Vue) { - Vue.component(Transfer.name, Transfer) -} - -Transfer.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Transfer.install(window.Vue) - } -} - -export default Transfer diff --git a/packages/transfer/package.json b/packages/transfer/package.json deleted file mode 100644 index cef4efda2..000000000 --- a/packages/transfer/package.json +++ /dev/null @@ -1,20 +0,0 @@ -{ - "name": "@opentiny/vue-transfer", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-button": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-checkbox": "~0.1.0", - "@opentiny/vue-transfer-panel": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/transfer/src/index.js b/packages/transfer/src/index.js deleted file mode 100644 index 6e8e190a2..000000000 --- a/packages/transfer/src/index.js +++ /dev/null @@ -1,102 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - TARGETORDER: 'original', - ISCHECKED: 'is-checked', - DROPPANEL: '.tiny-transfer-panel__list', - TRANSFERPANEL: '.tiny-transfer-panel__item' -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'Transfer', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - buttonTexts: { - type: Array, - default: () => [] - }, - columns: Array, - data: { - type: Array, - default: () => [] - }, - dropConfig: Object, - filterMethod: Function, - filterPlaceholder: { - type: String, - default: '' - }, - filterable: Boolean, - format: { - type: Object, - default: () => ({}) - }, - leftDefaultChecked: { - type: Array, - default: () => [] - }, - modelValue: { - type: Array, - default: () => [] - }, - pagerOp: { - type: Object, - default: () => ({ mode: 'fixed', pageVO: { currentPage: 1, pageSize: 10 } }) - }, - props: { - type: Object, - default: () => ({ label: 'label', key: 'key', disabled: 'disabled' }) - }, - render: Object, - renderContent: Function, - renderType: String, - rightDefaultChecked: { - type: Array, - default: () => [] - }, - showAllBtn: Boolean, - showPager: { - type: Boolean, - default: false - }, - targetOrder: { - type: String, - default: 'original' - }, - titles: { - type: Array, - default: () => [] - }, - toLeftDisable: { - type: Boolean, - default: true - }, - toRightDisable: { - type: Boolean, - default: true - }, - treeOp: Object, - beforeTransfer: Function - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/transfer/src/pc.vue b/packages/transfer/src/pc.vue deleted file mode 100644 index 966b6b036..000000000 --- a/packages/transfer/src/pc.vue +++ /dev/null @@ -1,147 +0,0 @@ - - - - - diff --git a/packages/tree-menu/index.js b/packages/tree-menu/index.js deleted file mode 100644 index fb40d7805..000000000 --- a/packages/tree-menu/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import TreeMenu from './src/index.vue' -import '@opentiny/vue-theme/tree-menu/index.css' - -/* istanbul ignore next */ -TreeMenu.install = function (Vue) { - Vue.component(TreeMenu.name, TreeMenu) -} - -TreeMenu.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - TreeMenu.install(window.Vue) - } -} - -export default TreeMenu diff --git a/packages/tree-menu/package.json b/packages/tree-menu/package.json deleted file mode 100644 index 7b94e5221..000000000 --- a/packages/tree-menu/package.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "name": "@opentiny/vue-tree-menu", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-input": "~0.1.0", - "@opentiny/vue-tree": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/tree-menu/src/index.vue b/packages/tree-menu/src/index.vue deleted file mode 100644 index 1c32628ba..000000000 --- a/packages/tree-menu/src/index.vue +++ /dev/null @@ -1,148 +0,0 @@ - - - - - diff --git a/packages/tree/index.js b/packages/tree/index.js deleted file mode 100644 index 162f9bef0..000000000 --- a/packages/tree/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Tree from './src/index.js' -import '@opentiny/vue-theme/tree/index.css' - -/* istanbul ignore next */ -Tree.install = function (Vue) { - Vue.component(Tree.name, Tree) -} - -Tree.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Tree.install(window.Vue) - } -} - -export default Tree diff --git a/packages/tree/package.json b/packages/tree/package.json deleted file mode 100644 index e481eba2b..000000000 --- a/packages/tree/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-tree", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/tree/src/index.js b/packages/tree/src/index.js deleted file mode 100644 index db7fad6b6..000000000 --- a/packages/tree/src/index.js +++ /dev/null @@ -1,110 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - EMPTY_TEXT_LOCAL: 'ui.tree.emptyText' -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'Tree', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - accordion: Boolean, - allowDrag: Function, - allowDrop: Function, - autoExpandParent: { - type: Boolean, - default: true - }, - checkDescendants: { - type: Boolean, - default: false - }, - checkOnClickNode: Boolean, - checkStrictly: Boolean, - currentNodeKey: [String, Number], - data: { - type: Array - }, - dataset: Object, - defaultCheckedKeys: Array, - defaultExpandAll: Boolean, - defaultExpandedKeys: Array, - defaultExpandedKeysHighlight: [Number, String], - draggable: { - type: Boolean, - default: false - }, - emptyText: String, - expandIcon: Object, - expandOnClickNode: { - type: Boolean, - default: true - }, - filterNodeMethod: Function, - highlightCurrent: Boolean, - icon: Object, - iconTriggerClickNode: { - type: Boolean, - default: true - }, - indent: { - type: Number, - default: 16 - }, - lazy: { - type: Boolean, - default: false - }, - load: Function, - nodeKey: String, - parentKey: String, - props: { - default() { - return { - children: 'children', - label: 'label', - disabled: 'disabled' - } - } - }, - renderAfterExpand: { - type: Boolean, - default: true - }, - renderContent: Function, - showCheckbox: { - type: Boolean, - default: false - }, - showContextmenu: { - type: Boolean, - default: false - }, - showRadio: { - type: Boolean, - default: false - }, - shrinkIcon: Object - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/tree/src/pc.vue b/packages/tree/src/pc.vue deleted file mode 100644 index 38fa1db5a..000000000 --- a/packages/tree/src/pc.vue +++ /dev/null @@ -1,118 +0,0 @@ - - - - - diff --git a/packages/upload-dragger/index.js b/packages/upload-dragger/index.js deleted file mode 100644 index 710fc80bf..000000000 --- a/packages/upload-dragger/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import UploadDragger from './src/index.vue' - -/* istanbul ignore next */ -UploadDragger.install = function (Vue) { - Vue.component(UploadDragger.name, UploadDragger) -} - -UploadDragger.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - UploadDragger.install(window.Vue) - } -} - -export default UploadDragger diff --git a/packages/upload-dragger/package.json b/packages/upload-dragger/package.json deleted file mode 100644 index dbf0e706b..000000000 --- a/packages/upload-dragger/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-upload-dragger", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/upload-dragger/src/index.vue b/packages/upload-dragger/src/index.vue deleted file mode 100644 index e133eb3cc..000000000 --- a/packages/upload-dragger/src/index.vue +++ /dev/null @@ -1,38 +0,0 @@ - - - - - diff --git a/packages/upload-list/index.js b/packages/upload-list/index.js deleted file mode 100644 index 7823bbf91..000000000 --- a/packages/upload-list/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import UploadList from './src/index.vue' - -/* istanbul ignore next */ -UploadList.install = function (Vue) { - Vue.component(UploadList.name, UploadList) -} - -UploadList.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - UploadList.install(window.Vue) - } -} - -export default UploadList diff --git a/packages/upload-list/package.json b/packages/upload-list/package.json deleted file mode 100644 index 624e2c0a4..000000000 --- a/packages/upload-list/package.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "name": "@opentiny/vue-upload-list", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-locale": "~0.1.0", - "@opentiny/vue-progress": "~0.1.0", - "@opentiny/vue-image-viewer": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/upload-list/src/index.vue b/packages/upload-list/src/index.vue deleted file mode 100644 index d12e02778..000000000 --- a/packages/upload-list/src/index.vue +++ /dev/null @@ -1,236 +0,0 @@ - - - - - diff --git a/packages/upload/index.js b/packages/upload/index.js deleted file mode 100644 index 6868f8000..000000000 --- a/packages/upload/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Upload from './src/index.vue' - -/* istanbul ignore next */ -Upload.install = function (Vue) { - Vue.component(Upload.name, Upload) -} - -Upload.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Upload.install(window.Vue) - } -} - -export default Upload diff --git a/packages/upload/package.json b/packages/upload/package.json deleted file mode 100644 index f470f2803..000000000 --- a/packages/upload/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-upload", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-upload-dragger": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/upload/src/index.vue b/packages/upload/src/index.vue deleted file mode 100644 index c9b08514d..000000000 --- a/packages/upload/src/index.vue +++ /dev/null @@ -1,132 +0,0 @@ - - - diff --git a/packages/user-account/index.js b/packages/user-account/index.js deleted file mode 100644 index f8ef32ceb..000000000 --- a/packages/user-account/index.js +++ /dev/null @@ -1,18 +0,0 @@ -import UserAccount from './src/index.js' -import '@opentiny/vue-theme/user-account/index.css' - -/* istanbul ignore next */ -UserAccount.install = function (Vue) { - Vue.component(UserAccount.name, UserAccount) -} - -UserAccount.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - UserAccount.install(window.Vue) - } -} - -export default UserAccount diff --git a/packages/user-account/package.json b/packages/user-account/package.json deleted file mode 100644 index 119111877..000000000 --- a/packages/user-account/package.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "name": "@opentiny/vue-user-account", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-user-contact": "~0.1.0", - "@opentiny/vue-logout": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/user-account/src/index.js b/packages/user-account/src/index.js deleted file mode 100644 index 6e457abe6..000000000 --- a/packages/user-account/src/index.js +++ /dev/null @@ -1,34 +0,0 @@ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc.vue' - -const template = () => PCTemplate - -export default { - name: $prefix + 'UserAccount', - props: { - ...$props, - getLangData: Function, - getUserInfo: Function, - getUserImageUrl: Function, - getLogoutUrl: Function, - redirectUrl: String, - isLocal: Boolean, - network: Function, - isMock: Boolean, - isGuestUser: Function, - showLogin: Function, - showArrow: { - type: Boolean, - default: false - }, - popperClass: String, - popperAppendToBody: { - type: Boolean, - default: true - }, - beforeLogout: Function - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/user-account/src/pc.vue b/packages/user-account/src/pc.vue deleted file mode 100644 index 3ab61e1a2..000000000 --- a/packages/user-account/src/pc.vue +++ /dev/null @@ -1,62 +0,0 @@ - - - diff --git a/packages/user-contact/index.js b/packages/user-contact/index.js deleted file mode 100644 index d3b270455..000000000 --- a/packages/user-contact/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import UserContact from './src/index' -import '@opentiny/vue-theme/user-contact/index.css' - -/* istanbul ignore next */ -UserContact.install = function (Vue) { - Vue.component(UserContact.name, UserContact) -} - -UserContact.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - UserContact.install(window.Vue) - } -} - -export default UserContact diff --git a/packages/user-contact/package.json b/packages/user-contact/package.json deleted file mode 100644 index 4bd8d5de4..000000000 --- a/packages/user-contact/package.json +++ /dev/null @@ -1,20 +0,0 @@ -{ - "name": "@opentiny/vue-user-contact", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-user-head": "~0.1.0", - "@opentiny/vue-card-template": "~0.1.0", - "@opentiny/vue-popover": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/user-contact/src/index.js b/packages/user-contact/src/index.js deleted file mode 100644 index 60d3ad546..000000000 --- a/packages/user-contact/src/index.js +++ /dev/null @@ -1,71 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $setup, $prefix } from '@opentiny/vue-common' -import PCTemplate from './pc' - -export default { - name: $prefix + 'UserContact', - props: { - ...$props, - showName: { - type: Boolean, - default: true - }, - showArrow: { - type: Boolean, - default: false - }, - - /** - * 是否显示 userDescription, colType 为 false 时生效 - */ - showDescription: { - type: Boolean, - default: true - }, - - /** - * 是否显示 头像 - */ - showImg: { - type: Boolean, - default: true - }, - - /** - * 数据 - */ - data: { - type: Object, - validator: (value) => - typeof value.userName === 'string' && value.imgUrl - ? typeof value.imgUrl === 'string' - : true && typeof value.userDescription === 'string' && (!value.values || Array.isArray(value.values)) - }, - popperClass: String, - popperAppendToBody: { - type: Boolean, - default: true - }, - isNewImMode: { - type: Boolean, - default: true - } - }, - setup(props, context) { - return $setup({ - context, - props, - template: () => PCTemplate - }) - } -} diff --git a/packages/user-contact/src/pc.vue b/packages/user-contact/src/pc.vue deleted file mode 100644 index 3e8d23784..000000000 --- a/packages/user-contact/src/pc.vue +++ /dev/null @@ -1,84 +0,0 @@ - - - - - diff --git a/packages/user-head/index.js b/packages/user-head/index.js deleted file mode 100644 index 2b42a5c9d..000000000 --- a/packages/user-head/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import UserHead from './src/index' - -/* istanbul ignore next */ -UserHead.install = function (Vue) { - Vue.component(UserHead.name, UserHead) -} - -UserHead.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - UserHead.install(window.Vue) - } -} - -export default UserHead diff --git a/packages/user-head/package.json b/packages/user-head/package.json deleted file mode 100644 index ede396d63..000000000 --- a/packages/user-head/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "@opentiny/vue-user-head", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/user-head/src/index.js b/packages/user-head/src/index.js deleted file mode 100644 index c29f4b605..000000000 --- a/packages/user-head/src/index.js +++ /dev/null @@ -1,104 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' -import MobileTemplate from './mobile' - -const template = (mode) => { - if (process.env.TINY_MODE === 'pc') return PCTemplate - else if (process.env.TINY_MODE === 'mobile') return MobileTemplate - else return mode === 'mobile' ? MobileTemplate : PCTemplate -} - -export default { - name: $prefix + 'UserHead', - props: { - ...$props, - - /** - * @property {Boolean} [min=false] - 小尺寸模式 - */ - min: Boolean, - - /** - * @property {Boolean} [round=true] - 圆形模式 - */ - round: Boolean, - - /** - * @property {String} [color=#ffffff] - 文字颜色 - */ - color: { - type: String, - default: '#ffffff' - }, - - /** - * @property {String} [backgroundColor=#BBBBBB] - 背景色 - */ - backgroundColor: String, - - /** - * @property {String} [type=label] - 头像类型,icon|image|label 可选 - */ - type: { - type: String, - default: 'label', - validator: (value) => ~['icon', 'image', 'label'].indexOf(value) - }, - - /** - * @property {String} - 头像资源 - * type=icon 时为图标类名,type=label时为字体串,type=image时为资源路径 - */ - value: { - type: [Object, String], - default: null - }, - - /** - * @property {Number} - 消息计数 - */ - messageTotal: Number, - - /** - * @property {String} [messageType=details] - 消息类型 details|basic 可选 - */ - messageType: { - type: String, - default: 'details', - validator: (value) => ~['details', 'basic'].indexOf(value) - }, - - /** - * @property {Number} [messageUpperLimit=0] - 消息显示上限 - */ - messageUpperLimit: { - type: Number, - default: 0 - }, - - /** - * @property {String, Number} [size=normal] - 头像尺寸 - */ - size: { - type: [Number, String], - default: 'medium', - validator(val) { - return typeof val === 'string' ? ~['large', 'medium', 'small'].indexOf(val) : typeof val === 'number' - } - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/user-head/src/mobile.vue b/packages/user-head/src/mobile.vue deleted file mode 100644 index e176f908d..000000000 --- a/packages/user-head/src/mobile.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - - - diff --git a/packages/user-head/src/pc.vue b/packages/user-head/src/pc.vue deleted file mode 100644 index e4840c3e0..000000000 --- a/packages/user-head/src/pc.vue +++ /dev/null @@ -1,42 +0,0 @@ - - - - - diff --git a/packages/user-link/index.js b/packages/user-link/index.js deleted file mode 100644 index 96425fd05..000000000 --- a/packages/user-link/index.js +++ /dev/null @@ -1,23 +0,0 @@ -import UserLink from './src/index.js' -import '@opentiny/vue-theme/user-link/index.css' - -UserLink.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -UserLink.install = function (Vue) { - Vue.component(UserLink.name, UserLink) -} - -UserLink.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - UserLink.install(window.Vue) - } -} - -export default UserLink diff --git a/packages/user-link/package.json b/packages/user-link/package.json deleted file mode 100644 index c54d9be21..000000000 --- a/packages/user-link/package.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "name": "@opentiny/vue-user-link", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-popover": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0", - "@opentiny/vue-loading": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/user-link/src/index.js b/packages/user-link/src/index.js deleted file mode 100644 index bca7ac5aa..000000000 --- a/packages/user-link/src/index.js +++ /dev/null @@ -1,56 +0,0 @@ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc.vue' - -const template = () => PCTemplate - -export default { - name: $prefix + 'UserLink', - props: { - ...$props, - modelValue: String, - cache: { - type: Boolean, - default: true - }, - cacheKey: { - type: String, - default: 'aurora-user' - }, - cacheFields: { - type: Array, - default: () => [] - }, - valueSplit: { - type: String, - default: () => ',' - }, - textSplit: { - type: String, - default: () => ',' - }, - valueField: { - type: String, - default: () => 'userId' - }, - textField: { - type: String, - default: () => 'userCN' - }, - card: { - type: Boolean, - default: true - }, - fetchUser: Function, - fetchW3Accounts: Function, - getUserImageUrl: Function, - fetchUserByUserId: Function, - UserCache: Object, - batch: { - type: [Boolean, Number], - default: 0 - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/user-link/src/pc.vue b/packages/user-link/src/pc.vue deleted file mode 100644 index 242ae836e..000000000 --- a/packages/user-link/src/pc.vue +++ /dev/null @@ -1,131 +0,0 @@ - - - - - diff --git a/packages/user/index.js b/packages/user/index.js deleted file mode 100644 index b28c3673d..000000000 --- a/packages/user/index.js +++ /dev/null @@ -1,23 +0,0 @@ -import User from './src/index.js' -import '@opentiny/vue-theme/user/index.css' - -User.model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -User.install = function (Vue) { - Vue.component(User.name, User) -} - -User.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - User.install(window.Vue) - } -} - -export default User diff --git a/packages/user/package.json b/packages/user/package.json deleted file mode 100644 index 993b1ddba..000000000 --- a/packages/user/package.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "name": "@opentiny/vue-user", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-select": "~0.1.0", - "@opentiny/vue-option": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/user/src/index.js b/packages/user/src/index.js deleted file mode 100644 index bc31f2e1f..000000000 --- a/packages/user/src/index.js +++ /dev/null @@ -1,129 +0,0 @@ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc.vue' - -const $constants = { - COMPONENT_NAME: { FormItem: 'FormItem' }, - EVENT_NAME: { FormBlur: 'form.blur' } -} - -const template = function () { - return PCTemplate -} - -export default { - name: $prefix + 'User', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - tabindex: { type: String, default: '1' }, - modelValue: { - type: [String, Number], - required: false - }, - multiple: { - type: Boolean, - default: false - }, - disabled: { - type: Boolean, - default: false - }, - valueSplit: { - type: String, - default: ',' - }, - textSplit: { - type: String, - default: ',' - }, - valueField: { - type: String, - default: 'userId' - }, - textField: { - type: String, - default: 'userCN' - }, - cache: { - type: Boolean, - default: true - }, - cacheKey: { - type: String, - default: 'aurora-user' - }, - delay: { - type: Number, - default: 600 - }, - suggestLength: { - type: Number, - default: 3 - }, - cacheFields: { - type: Array, - default: () => [] - }, - collapseTags: { - type: Boolean, - default: false - }, - placeholder: { - type: String, - default: '' - }, - showOverflowTooltip: { - type: Boolean, - default: true - }, - sortByFetchData: { - type: Boolean, - default: false - }, - sortable: Function, - size: String, - fetchW3Accounts: Function, - fetchSuggestUser: Function, - fetchUserByUserId: Function, - userCache: Object, - popperClass: String, - popperAppendToBody: { - type: Boolean, - default: true - }, - tagSelectable: { - type: Boolean, - default: false - }, - copyable: { - type: Boolean, - default: false - }, - batch: { - type: [Boolean, Number], - default: 0 - }, - allowCopy: { - type: Boolean, - default: false - }, - noDataText: String, - loadingText: String, - autoClose: Boolean, - queryDebounce: { - type: Number, - default: 100 - }, - hideSelected: Boolean, - ignoreEnter: { - type: Boolean, - default: true - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/user/src/pc.vue b/packages/user/src/pc.vue deleted file mode 100644 index a65dc7e07..000000000 --- a/packages/user/src/pc.vue +++ /dev/null @@ -1,118 +0,0 @@ - - - diff --git a/packages/vue-common/.depcheckrc b/packages/vue-common/.depcheckrc new file mode 100644 index 000000000..31c43fa84 --- /dev/null +++ b/packages/vue-common/.depcheckrc @@ -0,0 +1 @@ +ignores: ["@opentiny/vue-theme*", "@opentiny/vue-common", "vue3"] diff --git a/packages/vue-common/CHANGELOG.md b/packages/vue-common/CHANGELOG.md new file mode 100644 index 000000000..e69de29bb diff --git a/packages/vue-common/package.json b/packages/vue-common/package.json new file mode 100644 index 000000000..1920491b7 --- /dev/null +++ b/packages/vue-common/package.json @@ -0,0 +1,19 @@ +{ + "name": "@opentiny/vue-common", + "private": true, + "version": "3.7.0", + "description": "", + "main": "src/index.ts", + "sideEffects": false, + "dependencies": { + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-theme": "workspace:~", + "@opentiny/vue-theme-mobile": "workspace:~" + }, + "license": "MIT", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + } +} diff --git a/packages/vue-common/src/adapter/index.ts b/packages/vue-common/src/adapter/index.ts new file mode 100644 index 000000000..a27bdb77c --- /dev/null +++ b/packages/vue-common/src/adapter/index.ts @@ -0,0 +1,7 @@ +import vue from 'virtual:common/adapter/vue' + +export * from 'virtual:common/adapter/vue' + +export type { PropType, ExtractPropTypes, DefineComponent } from 'virtual:common/adapter/vue' + +export default vue diff --git a/packages/vue-common/src/adapter/teleport.ts b/packages/vue-common/src/adapter/teleport.ts new file mode 100644 index 000000000..d8e0fc8f0 --- /dev/null +++ b/packages/vue-common/src/adapter/teleport.ts @@ -0,0 +1,189 @@ +let globalId = 0 + +const getHasComment = (state) => (comment) => { + const childNodes = Array.from(state.parent.childNodes) as any + + for (let i = 0; i < childNodes.length; i++) { + if (childNodes[i].textContent === comment) { + return true + } + } +} + +const getGetFragment = + ({ hasComment, startComment, state, endComment }) => + (commentFlag) => { + const fragment = document.createDocumentFragment() + + commentFlag && !hasComment(startComment) && fragment.appendChild(document.createComment(startComment)) + + state.nodes.forEach((node) => fragment.appendChild(node)) + + commentFlag && !hasComment(endComment) && fragment.appendChild(document.createComment(endComment)) + + return fragment + } + +const getDisable = + ({ instance, getFragment, state, startComment, endComment }) => + () => { + instance.$el.appendChild(getFragment()) + + const indices = [] as any + + (Array.from(state.parent.childNodes) as any).forEach((child, i) => { + if (child.nodeType === 8) { + if (child.textContent === startComment || child.textContent === endComment) { + indices.push(i) + } + } + }) + + const minIndex = Math.min(...indices) + const maxIndex = Math.max(...indices) + + Array.from(state.parent.childNodes) + .slice(minIndex, maxIndex + 1) + .reverse() + .forEach((child) => state.parent.removeChild(child)) + + state.parent = null + } + +const getMove = + ({ state, props, disable, getFragment }) => + () => { + state.waiting = false + state.parent = document.querySelector(props.to) + + if (!state.parent) { + disable() + state.waiting = true + + return + } + + if (props.where === 'before') { + state.parent.prepend(getFragment(true)) + } else { + state.parent.appendChild(getFragment(true)) + } + } + +const getTeardownObserver = (state) => () => { + if (state.observer) { + state.observer.disconnect() + state.observer = null + } +} + +const getOnMutations = + ({ state, disable, props, move }) => + (mutations) => { + let shouldMove = false + + for (let i = 0; i < mutations.length; i++) { + const mutation = mutations[i] + const filteredAddedNodes = Array.from(mutation.addedNodes).filter((node) => !state.nodes.includes(node)) + + if (Array.from(mutation.removedNodes).includes(state.parent)) { + disable() + state.waiting = !props.disabled + } else if (state.waiting && filteredAddedNodes.length > 0) { + shouldMove = true + } + } + + shouldMove && move() + } + +const getBootObserver = + ({ state, onMutations }) => + () => { + if (state.observer) return + + state.observer = new MutationObserver((mutations) => onMutations(mutations)) + + state.observer.observe(document.body, { + attributes: false, + characterData: false, + childList: true, + subtree: true + }) + } + +const getAfterUpdated = + ({ state, instance, props, bootObserver, maybeMove }) => + () => { + state.nodes = Array.from(instance.$el.childNodes) + + !props.disabled && bootObserver() + maybeMove() + } + +const getWatchDisabled = + ({ disable, teardownObserver, bootObserver, move }) => + (value) => { + if (value) { + disable() + teardownObserver() + + return + } + + bootObserver() + move() + } + +export default ({ + reactive, + watch, + getCurrentInstance, + onUpdated, + onMounted, + onBeforeUnmount, + h, + defineComponent +}) => defineComponent({ + name: 'Vue2Teleport', + props: { + to: { type: String, required: true }, + where: { type: String, default: 'after' }, + disabled: Boolean + }, + setup(props) { + const state = reactive({ nodes: [], waiting: false, observer: null, parent: null, id: ++globalId }) + const instance = getCurrentInstance()?.proxy + const startComment = `[${state.id}]vue2-teleporter-start` + const endComment = `[${state.id}]vue2-teleporter-end` + + const hasComment = getHasComment(state) + const getFragment = getGetFragment({ hasComment, startComment, state, endComment }) + const disable = getDisable({ instance, getFragment, state, startComment, endComment }) + const move = getMove({ state, props, disable, getFragment }) + const maybeMove = () => !props.disabled && move() + const teardownObserver = getTeardownObserver(state) + const onMutations = getOnMutations({ state, disable, props, move }) + const bootObserver = getBootObserver({ state, onMutations }) + const afterUpdated = getAfterUpdated({ state, instance, props, bootObserver, maybeMove }) + const watchDisabled = getWatchDisabled({ disable, teardownObserver, bootObserver, move }) + + watch(() => props.to, maybeMove) + watch(() => props.where, maybeMove) + watch(() => props.disabled, watchDisabled) + + onUpdated(afterUpdated) + onMounted(afterUpdated) + onBeforeUnmount(() => { + disable() + teardownObserver() + }) + + return () => + h( + 'div', + { class: 'vue2-teleporter', style: { 'visibility:hidden;display:none;': !props.disabled } }, + (typeof instance?.$slots.default === 'function' ? instance.$slots.default() : instance.$slots.default) || null + ) + } +}) diff --git a/packages/vue-common/src/adapter/utils.ts b/packages/vue-common/src/adapter/utils.ts new file mode 100644 index 000000000..f6da5c187 --- /dev/null +++ b/packages/vue-common/src/adapter/utils.ts @@ -0,0 +1,118 @@ +export const emitter = () => { + let listeners = {} + + const on = (event, callback, once = false) => { + if (event && typeof event === 'string' && typeof callback === 'function') { + const callbacks = listeners[event] || [] + + listeners[event] = callbacks + callbacks.push(callback) + callback.once = once + } + } + + const emitter = { + emit(eventName) { + const callbacks = listeners[eventName] + + if (callbacks) { + callbacks.forEach((callback) => callback.apply(null, [].slice.call(arguments, 1))) + + listeners[eventName] = callbacks.filter((callback) => !callback.once) + } + }, + on, + once(event, callback) { + on(event, callback, true) + }, + off(event, callback) { + if (event && typeof event === 'string') { + const callbacks = listeners[event] + + if (typeof callback === 'function') { + listeners[event] = callbacks.filter((cb) => cb !== callback) + } else { + delete listeners[event] + } + } else { + listeners = {} + } + } + } + + return emitter +} + +export const bindFilter = (props, attrs = {}) => { + const properties = {} + + for (let name in props) { + if (name.indexOf('_') !== 0) { + properties[name] = props[name] + } + } + + for (let name in attrs) { + properties[name] = attrs[name] + } + + return properties +} + +/** + * 根据类名生成对应的hover、active等类名 + * + * getElementStatusClass('border-color', 'hover') // 'border-color hover:border-color-hover' + * getElementStatusClass(['border-color'], ['hover', 'active']) // 'border-color hover:border-color-hover active:border-color-active' + * + * @method + * @param {String|Array} className - 类名 + * @param {String|Array} status - 状态 + * @returns {String} - 类名拼接的字符串 + */ +export const getElementStatusClass = (className, status) => { + if (!className || !status) return + + let classNames: string[] = [] + if (typeof className === 'string') { + classNames.push(className) + } else if (Array.isArray(className)) { + classNames = className + } + + let statusList: string[] = [] + if (typeof status === 'string') { + statusList.push(status) + } else if (Array.isArray(status)) { + statusList = status + } + + let res: string[] = [] + statusList.forEach((status) => classNames.forEach((name) => res.push(`${status}:${name}-${status}`))) + + return classNames.concat(res).join(' ') +} + +/** + * 根据key值获取对应的classes类名配置 + * + * getElementCssClass({ button: 'border-color' }, 'button') // 'border-color' + * getElementCssClass({ button: 'border-color' }, { 'button': true }) // 'border-color' + * + * @method + * @param {Object} classes - 类名集合 + * @param {String|Object} key - 状态 + * @returns {String} - 类名配置值 + */ +export const getElementCssClass = (classes = {}, key) => { + if (typeof key === 'object') { + const keys = Object.keys(key) + let cls = '' + keys.forEach((k) => { + if (key[k] && classes[k]) cls += `${classes[k]} ` + }) + return cls + } else { + return classes[key] || '' + } +} diff --git a/packages/vue-common/src/adapter/vue2.7/CHANGELOG.md b/packages/vue-common/src/adapter/vue2.7/CHANGELOG.md new file mode 100644 index 000000000..df8282c95 --- /dev/null +++ b/packages/vue-common/src/adapter/vue2.7/CHANGELOG.md @@ -0,0 +1,19 @@ +# Change Log + +All notable changes to this project will be documented in this file. +See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + +## [5.0.2-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue2.7-common@1.0.1-beta.0...vue2.7-common@5.0.2-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue2.7-common + + + + + +## 1.0.1-beta.0 (2023-02-08) + + +### Bug Fixes + +* 修正 vue2 和 vue2.7 下扩展 ([ad71cc0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/ad71cc096bdbb02b1070917e11bc5e48bab4ca19)) diff --git a/packages/vue-common/src/adapter/vue2.7/index.ts b/packages/vue-common/src/adapter/vue2.7/index.ts new file mode 100644 index 000000000..68cf9c2f0 --- /dev/null +++ b/packages/vue-common/src/adapter/vue2.7/index.ts @@ -0,0 +1,336 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Vue from 'vue' +import * as hooks from 'vue' +import type { } from 'vue-router' // https://github.com/microsoft/TypeScript/issues/47663#issuecomment-1270716220 +import { emitter, bindFilter, getElementCssClass, getElementStatusClass } from '../utils' +import teleport from '../teleport' + +const Teleport = teleport(hooks) + +export { emitter, bindFilter, getElementCssClass, getElementStatusClass, Teleport } + +export const defineAsyncComponent = hooks.defineAsyncComponent + +export const markRaw = (ref) => ref + +export const renderComponent = ({ view = null as any, component = null as any, props, context: { attrs, listeners: on, slots }, extend = {} }) => { + return () => + hooks.h((view && view.value) || component, Object.assign({ props, attrs, [extend.isSvg ? 'nativeOn' : 'on']: on, scopedSlots: { ...slots } }, extend)) +} + +export const rootConfig = () => hooks.getCurrentInstance()?.proxy.$root + +export const appContext = () => Vue + +export const appProperties = () => Vue.prototype + +export const useRouter = (instance = hooks.getCurrentInstance()?.proxy) => { + return { + route: instance?.$route, + router: instance?.$router + } +} + +const emitEvent = (vm) => { + const broadcast = (vm, componentName, eventName, params) => { + vm.$children.forEach((child) => { + const name = child.$options.componentName + + if (name === componentName) { + child.$emit(eventName, params) + } else { + broadcast(child, componentName, eventName, params) + } + }) + } + + return { + dispatch(componentName, eventName, params) { + let parent = vm.$parent || vm.$root + let name = parent.$options.componentName + + while (parent && (!name || name !== componentName)) { + parent = parent.$parent + + if (parent) { + name = parent.$options.componentName + } + } + + if (parent) { + parent.$emit.apply(parent, [eventName].concat(params)) + } + }, + broadcast(componentName, eventName, params) { + broadcast(vm, componentName, eventName, params) + } + } +} + +const parent = (vm) => (handler) => { + let parent = vm.$parent + let level = 0 + + const parentObject = (parent) => { + return { + level, + vm: createVm({}, parent), + el: parent.$el, + options: parent.$options + } + } + + if (typeof handler !== 'function') { + return parent ? parentObject(parent) : {} + } + + level++ + + while (parent) { + if (handler(parentObject(parent))) break + + parent = parent.$parent + level++ + } +} + +const children = (vm) => (handler) => { + if (typeof handler !== 'function') { + return generateChildren(vm.$children) + } + + let layer = 1 + + const broadcast = ($children) => { + const level = layer++ + + if ( + $children.some((child) => { + return handler({ + level, + vm: createVm({}, child), + el: child.$el, + options: child.$options, + isLevel1: level === 1 + }) + }) + ) { + return + } + + $children.forEach((child) => broadcast(child.$children)) + } + + broadcast(vm.$children) +} + +const generateChildren = ($children) => { + const children: any = [] + + children.refs = {} + + $children.forEach((child) => { + const vm = createVm({}, child) + + children.push(vm) + child.$vnode.data.ref && (children.refs[child.$vnode.data.ref] = vm) + }) + + return children +} + +const defineProperties = (vm, instance, filter) => { + for (let name in instance) { + if (typeof filter === 'function' && filter(name)) continue + + Object.defineProperty(vm, name, { + configurable: true, + enumerable: true, + get: () => instance[name], + set: (value) => (instance[name] = value) + }) + } + + return vm +} + +const filter = (name) => name.indexOf('$') === 0 || name.indexOf('_') === 0 || name === 'constructor' + +const customEmit = (context, emit) => { + return function () { + const args = Array.prototype.slice.apply(arguments) + + emit.apply(context, args) + + // vue3 下 emit('update:modelValue') 会同时触发 input 事件,vue2 不会 + if (args[0] === 'update:modelValue') { + emit.apply(context, ['input'].concat(args.slice(1))) + } + } +} + +const createVm = (vm, instance, context = undefined) => { + context || defineProperties(vm, instance, filter) + + Object.defineProperties(vm, { + $attrs: { get: () => instance.$attrs }, + $children: { get: () => generateChildren(instance.$children) }, + $constants: { get: () => instance._constants }, + $emit: { get: () => customEmit(instance, instance.$emit) }, + $el: { get: () => instance.$el }, + $listeners: { get: () => instance.$listeners }, + $mode: { get: () => instance._tiny_mode }, + $nextTick: { get: () => hooks.nextTick }, + $off: { get: () => instance.$off.bind(instance) }, + $on: { get: () => instance.$on.bind(instance) }, + $once: { get: () => instance.$once.bind(instance) }, + $options: { + get: () => ({ componentName: instance.$options.componentName }) + }, + $parent: { get: () => instance.$parent && createVm({}, instance.$parent) }, + $refs: { get: () => instance.$refs }, + $renderless: { get: () => instance.tiny_renderless }, + $scopedSlots: { get: () => instance.$scopedSlots }, + $set: { get: () => instance.$set }, + $slots: { get: () => instance.$scopedSlots }, + $template: { get: () => instance.tiny_template } + }) + + return vm +} + +const onBeforeMount = (instance, refs) => { + for (let name in instance.refs) { + if (Object.prototype.hasOwnProperty.call(instance.refs, name)) { + refs[name] = instance.refs[name] + } + } +} + +export const tools = (context, mode) => { + const instance = hooks.getCurrentInstance()?.proxy as any + const root = instance?.$root + const { route, router } = useRouter(instance) + const i18n = root?.$i18n + const { dispatch, broadcast } = emitEvent(instance) + const parentHandler = parent(instance) + const childrenHandler = children(instance) + const vm = createVm({}, instance, context) + const emit = context.emit + const refs = {} + const parentVm = instance.$parent ? createVm({}, instance.$parent) : null + + const setParentAttribute = ({ name, value }) => { + instance.$parent[name] = value + } + + const defineInstanceProperties = (props) => { + Object.defineProperties(vm, props) + Object.defineProperties(instance, props) + } + + const defineParentInstanceProperties = (props) => { + parentVm && Object.defineProperties(parentVm, props) + } + + hooks.onBeforeMount(() => defineProperties(vm, instance, filter)) + hooks.onMounted(() => onBeforeMount(instance, refs)) + + return { + vm, + emit: customEmit(context, emit), + emitter, + route, + router, + dispatch, + broadcast, + parentHandler, + childrenHandler, + i18n, + refs, + slots: context.slots, + scopedSlots: context.slots, + attrs: context.attrs, + parent: parentVm, + nextTick: hooks.nextTick, + constants: instance?._constants, + mode, + isPCMode: mode === 'pc', + isMobileMode: mode === 'mobile', + service: instance?.$service, + getService: () => instance?.$getService(vm), + setParentAttribute, + defineInstanceProperties, + defineParentInstanceProperties + } +} + +const mapping = (content, before, after) => { + if (typeof content[before] !== 'undefined') { + const fn = content[before] + + content[after] = (el, binding, vnode) => { + binding.instance = vnode.context + fn(el, binding, vnode) + } + + delete content[before] + } +} + +export const directive = (directives) => { + for (let name in directives) { + const content = directives[name] + + mapping(content, 'beforeMount', 'bind') + mapping(content, 'updated', 'update') + mapping(content, 'unmounted', 'unbind') + } + + return directives +} + +const bindVnodeData = ({ props, data, name, attr = name }) => { + Object.defineProperty(props, attr, { + get: () => data[name], + set: (value) => (data[name] = value) + }) +} + +export const parseVnode = (vnode) => { + const props = {} + const data = (vnode.componentOptions && vnode.componentOptions.propsData) || {} + + for (let name in data) { + bindVnodeData({ props, data, name }) + } + + vnode.props = props + vnode.type = { name: vnode.componentOptions && vnode.componentOptions.tag } + + return vnode +} + +export const h = hooks.h + +export const createComponent = ({ component, propsData, el }) => new (Vue.extend(component))({ propsData, el }).$mount() + +export const defineComponent = hooks.defineComponent + +export default hooks + +export const isVue2 = true + +export const isVue3 = false + +export type { PropType, ExtractPropTypes, DefineComponent } from 'vue' diff --git a/packages/vue-common/src/adapter/vue2.7/package.json b/packages/vue-common/src/adapter/vue2.7/package.json new file mode 100644 index 000000000..3bca3542c --- /dev/null +++ b/packages/vue-common/src/adapter/vue2.7/package.json @@ -0,0 +1,11 @@ +{ + "name": "vue2.7-common", + "private": true, + "version": "5.0.2-mf.0", + "description": "", + "main": "index.ts", + "devDependencies": { + "vue": "~2.7.10", + "vue-router": "^3.6.4" + } +} diff --git a/packages/vue-common/src/adapter/vue2/CHANGELOG.md b/packages/vue-common/src/adapter/vue2/CHANGELOG.md new file mode 100644 index 000000000..fecdd7da6 --- /dev/null +++ b/packages/vue-common/src/adapter/vue2/CHANGELOG.md @@ -0,0 +1,20 @@ +# Change Log + +All notable changes to this project will be documented in this file. +See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + +## [5.0.2-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue2-common@1.0.1-beta.0...vue2-common@5.0.2-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue2-common + + + + + +## 1.0.1-beta.0 (2023-02-08) + + +### Bug Fixes + +* 修复 loading 组件由于文件改名导致引用错误问题,同时删除无用文件 ([d63c084](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/d63c084595f3e9ba6845cf374bf4bee70949e90f)) +* 修正 vue2 和 vue2.7 下扩展 ([ad71cc0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/commits/ad71cc096bdbb02b1070917e11bc5e48bab4ca19)) diff --git a/packages/vue-common/src/adapter/vue2/index.ts b/packages/vue-common/src/adapter/vue2/index.ts new file mode 100644 index 000000000..963e7433d --- /dev/null +++ b/packages/vue-common/src/adapter/vue2/index.ts @@ -0,0 +1,320 @@ +import Vue from 'vue' +import * as hooks from '@vue/composition-api' +import type { } from 'vue-router' +import { bindFilter, emitter, getElementCssClass, getElementStatusClass } from '../utils' +import teleport from '../teleport' + +const Teleport = teleport(hooks) + +export { emitter, bindFilter, getElementCssClass, getElementStatusClass, Teleport } + +Vue.use(hooks.default) + +export const defineAsyncComponent = ({ loader, loadingComponent, errorComponent, delay, timeout }) => { + return () => ({ + component: loader(), + loading: loadingComponent, + error: errorComponent, + delay, + timeout, + }) +} + +export const markRaw = ref => ref + +export const renderComponent = ({ view = null as any, component = null as any, props, context: { attrs, listeners: on, slots }, extend = {} }) => { + return () => + hooks.h((view && view.value) || component, Object.assign({ props, attrs, [extend.isSvg ? 'nativeOn' : 'on']: on, scopedSlots: { ...slots } }, extend)) +} + +export const rootConfig = () => hooks.getCurrentInstance()?.proxy.$root + +export const appContext = () => Vue + +export const appProperties = () => Vue.prototype + +export const useRouter = (instance = hooks.getCurrentInstance()?.proxy) => { + return { + route: instance?.$route, + router: instance?.$router, + } +} + +const emitEvent = (vm) => { + const broadcast = (vm, componentName, eventName, params) => { + vm.$children.forEach((child) => { + const name = child.$options.componentName + + if (name === componentName) + child.$emit(eventName, params) + + else + broadcast(child, componentName, eventName, params) + }) + } + + return { + dispatch(componentName, eventName, params) { + let parent = vm.$parent || vm.$root + let name = parent.$options.componentName + + while (parent && (!name || name !== componentName)) { + parent = parent.$parent + + if (parent) + name = parent.$options.componentName + } + + if (parent) + parent.$emit(...[eventName].concat(params)) + }, + broadcast(componentName, eventName, params) { + broadcast(vm, componentName, eventName, params) + }, + } +} + +const parent = vm => (handler) => { + let parent = vm.$parent + let level = 0 + + const parentObject = (parent) => { + return { + level, + vm: createVm({}, parent), + el: parent.$el, + options: parent.$options, + } + } + + if (typeof handler !== 'function') + return parent ? parentObject(parent) : {} + + level++ + + while (parent) { + if (handler(parentObject(parent))) + break + + parent = parent.$parent + level++ + } +} + +const children = vm => (handler) => { + if (typeof handler !== 'function') + return generateChildren(vm.$children) + + let layer = 1 + + const broadcast = ($children) => { + const level = layer++ + + if ( + $children.some((child) => { + return handler({ + level, + vm: createVm({}, child), + el: child.$el, + options: child.$options, + isLevel1: level === 1, + }) + }) + ) + return + + $children.forEach(child => broadcast(child.$children)) + } + + broadcast(vm.$children) +} + +const generateChildren = ($children) => { + const children: any = [] + + children.refs = {} + + $children.forEach((child) => { + const vm = createVm({}, child) + + children.push(vm) + child.$vnode.data.ref && (children.refs[child.$vnode.data.ref] = vm) + }) + + return children +} + +const defineProperties = (vm, instance, filter) => { + for (const name in instance) { + if (typeof filter === 'function' && filter(name)) + continue + + Object.defineProperty(vm, name, { + configurable: true, + enumerable: true, + get: () => instance[name], + set: value => (instance[name] = value), + }) + } + + return vm +} + +const filter = name => name.indexOf('$') === 0 || name.indexOf('_') === 0 || name === 'constructor' + +const customEmit = (context, emit) => { + return function (...args) { + emit.apply(context, args) + + // vue3 下 emit('update:modelValue') 会同时触发 input 事件,vue2 不会 + if (args[0] === 'update:modelValue') + emit.apply(context, ['input'].concat(args.slice(1))) + } +} + +const createVm = (vm, instance, context = undefined) => { + context || defineProperties(vm, instance, filter) + + Object.defineProperties(vm, { + $attrs: { get: () => instance.$attrs }, + $children: { get: () => generateChildren(instance.$children) }, + $constants: { get: () => instance._constants }, + $emit: { get: () => customEmit(instance, instance.$emit) }, + $el: { get: () => instance.$el }, + $listeners: { get: () => instance.$listeners }, + $mode: { get: () => instance._tiny_mode }, + $nextTick: { get: () => hooks.nextTick }, + $off: { get: () => instance.$off.bind(instance) }, + $on: { get: () => instance.$on.bind(instance) }, + $once: { get: () => instance.$once.bind(instance) }, + $options: { + get: () => ({ componentName: instance.$options.componentName }), + }, + $parent: { get: () => instance.$parent && createVm({}, instance.$parent) }, + $refs: { get: () => instance.$refs }, + $renderless: { get: () => instance.tiny_renderless }, + $scopedSlots: { get: () => instance.$scopedSlots }, + $set: { get: () => instance.$set }, + $slots: { get: () => instance.$scopedSlots }, + $template: { get: () => instance.tiny_template }, + }) + + return vm +} + +export const tools = (context, mode) => { + const instance = hooks.getCurrentInstance()?.proxy as any + const root = instance?.$root + const { route, router } = useRouter(instance) + const i18n = root?.$i18n + const { dispatch, broadcast } = emitEvent(instance) + const parentHandler = parent(instance) + const childrenHandler = children(instance) + const vm = createVm({}, instance, context) + const emit = context.emit + const parentVm = instance.$parent ? createVm({}, instance.$parent) : null + + const setParentAttribute = ({ name, value }) => { + instance.$parent[name] = value + } + + const defineInstanceProperties = (props) => { + Object.defineProperties(vm, props) + Object.defineProperties(instance, props) + } + + const defineParentInstanceProperties = (props) => { + parentVm && Object.defineProperties(parentVm, props) + } + + hooks.onBeforeMount(() => defineProperties(vm, instance, filter)) + + return { + vm, + emit: customEmit(context, emit), + emitter, + route, + router, + dispatch, + broadcast, + parentHandler, + childrenHandler, + refs: context.refs, + i18n, + slots: context.slots, + scopedSlots: context.slots, + attrs: context.attrs, + parent: parentVm, + nextTick: hooks.nextTick, + constants: instance?._constants, + mode, + isPCMode: mode === 'pc', + isMobileMode: mode === 'mobile', + service: instance?.$service, + getService: () => instance?.$getService(vm), + setParentAttribute, + defineInstanceProperties, + defineParentInstanceProperties, + } +} + +const mapping = (content, before, after) => { + if (typeof content[before] !== 'undefined') { + const fn = content[before] + + content[after] = (el, binding, vnode) => { + binding.instance = vnode.context + fn(el, binding, vnode) + } + + delete content[before] + } +} + +export const directive = (directives) => { + for (const name in directives) { + const content = directives[name] + + mapping(content, 'beforeMount', 'bind') + mapping(content, 'updated', 'update') + mapping(content, 'unmounted', 'unbind') + } + + return directives +} + +const bindVnodeData = ({ props, data, name, attr = name }) => { + Object.defineProperty(props, attr, { + get: () => data[name], + set: value => (data[name] = value), + }) +} + +export const parseVnode = (vnode) => { + const props = {} + const data = (vnode.componentOptions && vnode.componentOptions.propsData) || {} + + for (const name in data) + bindVnodeData({ props, data, name }) + + vnode.props = props + vnode.type = { name: vnode.componentOptions && vnode.componentOptions.tag } + + return vnode +} + +export const h = hooks.h + +export const createComponent = ({ component, propsData, el }) => new (Vue.extend(component))({ propsData, el }).$mount() + +export const defineComponent = hooks.defineComponent + +export default hooks + +export const isVue2 = true + +export const isVue3 = false + +export type { PropType, ExtractPropTypes } from '@vue/composition-api' + +export type DefineComponent = typeof defineComponent diff --git a/packages/vue-common/src/adapter/vue2/package.json b/packages/vue-common/src/adapter/vue2/package.json new file mode 100644 index 000000000..ba3e637d3 --- /dev/null +++ b/packages/vue-common/src/adapter/vue2/package.json @@ -0,0 +1,12 @@ +{ + "name": "vue2-common", + "private": true, + "version": "5.0.2-mf.0", + "description": "", + "main": "index.ts", + "devDependencies": { + "@vue/composition-api": "~1.2.2", + "vue": "~2.6.14", + "vue-router": "^3.6.4" + } +} diff --git a/packages/vue-common/src/adapter/vue3/CHANGELOG.md b/packages/vue-common/src/adapter/vue3/CHANGELOG.md new file mode 100644 index 000000000..e69de29bb diff --git a/packages/vue-common/src/adapter/vue3/index.ts b/packages/vue-common/src/adapter/vue3/index.ts new file mode 100644 index 000000000..6923d01a9 --- /dev/null +++ b/packages/vue-common/src/adapter/vue3/index.ts @@ -0,0 +1,482 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import * as hooks from 'vue' + +import { camelize, capitalize, hyphenate } from '@opentiny/vue-renderless/common/string' +import { bindFilter, emitter, getElementCssClass, getElementStatusClass } from '../utils' + +const Teleport = hooks.Teleport + +export { emitter, bindFilter, getElementCssClass, getElementStatusClass, Teleport } + +export const defineAsyncComponent = hooks.defineAsyncComponent + +export const markRaw = hooks.markRaw + +export const renderComponent = ({ view = undefined as any, component = undefined as any, props, context: { attrs, slots }, extend = {} }) => { + return () => hooks.h((view && view.value) || component, { ...props, ...attrs, ...extend }, slots) +} + +export const rootConfig = (context) => { + const instance = hooks.getCurrentInstance() + context && setInstanceEmitter(instance) + return instance?.appContext.config.globalProperties +} + +export const appContext = () => + hooks.getCurrentInstance()?.appContext || { + component: () => { + // do nothing + }, + } + +export const appProperties = () => { + const instance = hooks.getCurrentInstance() + return instance?.appContext.config.globalProperties || {} +} + +export const useRouter = (instance = hooks.getCurrentInstance()) => { + const router = instance?.appContext.config.globalProperties.$router + const route = router && router.currentRoute.value + + return { route, router } +} + +const setInstanceEmitter = (instance) => { + const $emitter = emitter() + + if (typeof instance.$emitter === 'undefined') + Object.defineProperty(instance, '$emitter', { get: () => $emitter }) +} + +const emitEvent = (vm) => { + const broadcast = (vm, componentName, eventName, params) => { + const children = (vm.subTree && vm.subTree.children) || vm.children + + Array.isArray(children) + && children.forEach((child) => { + const name = child.type && child.type.componentName + const component = child.component + + if (name === componentName) { + component.emit(eventName, params) + component.$emitter && component.$emitter.emit(eventName, params) + } + else { + broadcast(child, componentName, eventName, params) + } + }) + } + + return { + dispatch(componentName, eventName, params) { + let parent = vm.parent || vm.root + let name = parent.type && parent.type.componentName + + while (parent && (!name || name !== componentName)) { + parent = parent.parent + + if (parent) + name = parent.type && parent.type.componentName + } + + if (parent) { + parent.emit(...[eventName].concat(params)) + // fix: VUE3下事件参数为数组,VUE2下事件参数不是数组,这里修改为和VUE2兼容 + parent.$emitter && parent.$emitter.emit(...[eventName].concat(params)) + } + }, + broadcast(componentName, eventName, params) { + broadcast(vm, componentName, eventName, params) + }, + } +} + +const getRealParent = (vm) => { + if (vm && vm.parent) + return vm.parent.type.name === 'AsyncComponentWrapper' && vm.parent.parent ? vm.parent.parent : vm.parent +} + +const parent = vm => (handler) => { + let parent = getRealParent(vm) + let level = 0 + + const parentObject = (parent) => { + return { + level, + vm: createVm({}, parent), + el: parent.vnode.el, + options: parent.type, + } + } + + if (typeof handler !== 'function') + return parent ? parentObject(parent) : {} + + level++ + + while (parent) { + if (handler(parentObject(parent))) + break + parent = getRealParent(parent) + level++ + } +} + +const children = vm => (handler) => { + if (typeof handler !== 'function') + return generateChildren(vm.subTree) + + let layer = 1 + const broadcast = (subTree) => { + if (subTree) { + const children = subTree.children || subTree.dynamicChildren + const level = layer++ + + if (Array.isArray(children)) { + if ( + children.some((child) => { + return ( + child.component + && handler({ + level, + vm: createVm({}, child.component), + el: child.el, + options: child.type, + isLevel1: true, + }) + ) + }) + ) + return + + children.forEach(child => broadcast(child)) + } + } + } + + broadcast(vm.subTree) +} + +const regEventPrefix = /^on[A-Z]/ + +const generateListeners = (attrs) => { + const $attrs = {} + const $listeners = {} + + for (const name in attrs) { + const event = attrs[name] + + if (regEventPrefix.test(name) && typeof event === 'function') { + $listeners[hyphenate(name.substr(2))] = event + continue + } + + $attrs[name] = event + } + + return { $attrs, $listeners } +} + +const generateChildren = (subTree) => { + const children: any = [] + children.refs = {} + + if (subTree) { + const arr = subTree.dynamicChildren || subTree.children + + if (Array.isArray(arr)) { + arr.forEach((child) => { + if (child.component) { + const vm = createVm({}, child.component) + + children.push(vm) + child.props.ref && (children.refs[child.props.ref] = vm) + } + }) + } + else if (subTree.component) { + children.push(createVm({}, subTree.component)) + } + } + + return children +} + +const defineProperties = (vm, instance, property, filter) => { + for (const name in instance[property]) { + if (typeof filter === 'function' && filter(name)) + continue + + Object.defineProperty(vm, name, { + configurable: true, + enumerable: true, + get: () => instance[property][name], + set: value => (instance[property][name] = value), + }) + } + + return vm +} + +const filter = name => name.indexOf('_') === 0 + +const defineInstanceVm = (vm, instance) => { + defineProperties(vm, instance, 'setupState', null) + defineProperties(vm, instance, 'props', filter) + defineProperties(vm, instance, 'ctx', filter) + + return vm +} + +const createVm = (vm, instance, context = null) => { + const { $attrs, $listeners } = generateListeners(instance.attrs) + let $emitter = instance.$emitter + + if (!$emitter) { + setInstanceEmitter(instance) + $emitter = instance.$emitter + } + + const emit = (...args) => { + instance.emit(...args) + $emitter.emit.apply(vm, args) + } + + const $set = (target, propertyName, value) => (target[propertyName] = value) + + context || defineInstanceVm(vm, instance) + + Object.defineProperties(vm, { + $attrs: { get: () => $attrs }, + $children: { get: () => generateChildren(instance.subTree) }, + $constants: { get: () => instance.props._constants }, + $emit: { get: () => emit }, + $el: { get: () => instance.vnode.el }, + $listeners: { get: () => $listeners }, + $mode: { get: () => instance._tiny_mode }, + $nextTick: { get: () => hooks.nextTick }, + $off: { get: () => $emitter.off }, + $on: { get: () => $emitter.on }, + $once: { get: () => $emitter.once }, + $options: { get: () => ({ componentName: instance.type.componentName }) }, + $parent: { + get: () => instance.parent && createVm({}, getRealParent(instance)), + }, + $refs: { get: () => instance.refs }, + $renderless: { get: () => instance.props.tiny_renderless }, + $scopedSlots: { get: () => instance.slots }, + $set: { get: () => $set }, + $slots: { get: () => instance.slots }, + $template: { get: () => instance.props.tiny_template }, + }) + + return vm +} + +const onBeforeMount = (instance, refs) => { + for (let name in instance.refs) { + if (Object.prototype.hasOwnProperty.call(instance.refs, name)) { + refs[name] = instance.refs[name] + } + } +} + +export const tools = (context, mode) => { + const instance = hooks.getCurrentInstance() as any + const root = instance?.appContext.config.globalProperties + const { route, router } = useRouter(instance) + const i18n = instance?.proxy?.$root?.$i18n + const { dispatch, broadcast } = emitEvent(instance) + const parentHandler = parent(instance) + const childrenHandler = children(instance) + const vm = createVm({}, instance, context) + const emit = context.emit + const refs = {} + const grandParent = typeof instance.props.tiny_template === 'undefined' && getRealParent(instance) + const parentVm = grandParent ? createVm({}, grandParent) : instance.parent ? createVm({}, instance.parent) : null + + const setParentAttribute = ({ name, value }) => { + const ctx = grandParent ? grandParent.ctx : instance?.parent?.ctx + + ctx[name] = value + } + + const defineInstanceProperties = (props) => { + Object.defineProperties(vm, props) + Object.defineProperties(instance?.ctx, props) + } + + const defineParentInstanceProperties = (props) => { + parentVm && Object.defineProperties(parentVm, props) + } + + hooks.onBeforeMount(() => defineInstanceVm(vm, instance)) + hooks.onMounted(() => onBeforeMount(instance, refs)) + + return { + vm, + emit, + emitter, + route, + router, + dispatch, + broadcast, + parentHandler, + childrenHandler, + i18n, + refs, + slots: instance?.slots, + scopedSlots: instance?.slots, + attrs: context.attrs, + parent: parentVm, + nextTick: hooks.nextTick, + constants: instance?.props._constants, + mode, + isPCMode: mode === 'pc', + isMobileMode: mode === 'mobile', + service: root?.$service, + getService: () => root?.$getService(vm), + setParentAttribute, + defineInstanceProperties, + defineParentInstanceProperties, + } +} + +const mapping = (content, before, after) => { + if (typeof content[before] !== 'undefined') { + const fn = content[before] + + content[after] = (el, binding, vnode) => { + vnode.context = binding.instance + fn(el, binding, vnode) + } + + delete content[before] + } +} + +export const directive = (directives) => { + for (const name in directives) { + const content = directives[name] + + mapping(content, 'bind', 'beforeMount') + mapping(content, 'update', 'updated') + mapping(content, 'unbind', 'unmounted') + } + + return directives +} + +export const parseVnode = vnode => vnode + +const parseProps = (propsData) => { + const props = {} + + for (const name in propsData) { + if (name === 'class' || name === 'style') { + props[name] = propsData[name] + } + else if (name === 'on' || name === 'nativeOn') { + const events = propsData[name] + + for (const eventName in events) + props[`on${capitalize(camelize(eventName))}`] = events[eventName] + } + else if (name === 'attrs' || name === 'props' || name === 'domProps') { + const attrs = propsData[name] + + for (const key in attrs) + props[key] = attrs[key] + } + else { + props[name] = propsData[name] + } + } + + return props +} + +const customResolveComponent = (component) => { + let type = component + let customElement = false + + if (typeof component === 'string') { + const el = document.createElement(component) + const svgTagNames = ['SVG', 'CIRCLE', 'PATH'] + + if ( + (el instanceof HTMLUnknownElement && !svgTagNames.includes(el.nodeName)) + || component.includes('-') + ) { + component = component.toLowerCase() + customElement = true + + if (component === 'transition') + type = hooks.Transition + + else if (component === 'transition-group') + type = hooks.TransitionGroup + + else + type = hooks.resolveComponent(component) + } + else { + type = component + } + } + + return { type, component, customElement } +} + +type CreateElement = (component: any, propsData?: any, childData?: any) => ReturnType + +export const h: CreateElement = (component, propsData, childData) => { + let props = {} + let children = childData + const ret = customResolveComponent(component) + const customElement = ret.customElement + const type = ret.type + + component = ret.component + + if (propsData && typeof propsData === 'object' && !Array.isArray(propsData)) { + props = parseProps(propsData) + propsData.scopedSlots && (children = propsData.scopedSlots) + } + else if (typeof propsData === 'string' || Array.isArray(propsData)) { + childData = propsData + } + + if (typeof childData === 'string' || Array.isArray(childData)) + children = typeof component !== 'string' || customElement ? () => childData : childData + + return hooks.h(type, props, children) +} + +export const createComponent = ({ component, propsData, el }) => { + const vnode = hooks.createVNode(component, propsData) + + hooks.render(vnode, el) + + return createVm({}, vnode.component) +} + +export const defineComponent = hooks.defineComponent + +export default hooks + +export const isVue2 = false + +export const isVue3 = true + +export type { PropType, ExtractPropTypes, DefineComponent } from 'vue' diff --git a/packages/vue-common/src/adapter/vue3/package.json b/packages/vue-common/src/adapter/vue3/package.json new file mode 100644 index 000000000..0704a9582 --- /dev/null +++ b/packages/vue-common/src/adapter/vue3/package.json @@ -0,0 +1,11 @@ +{ + "name": "vue3-common", + "private": true, + "version": "5.0.2-mf.0", + "description": "", + "main": "index.ts", + "devDependencies": { + "@vue/runtime-core": "^3.2.31", + "vue": "^3.2.31" + } +} diff --git a/packages/vue-common/src/index.ts b/packages/vue-common/src/index.ts new file mode 100644 index 000000000..dc2a991a7 --- /dev/null +++ b/packages/vue-common/src/index.ts @@ -0,0 +1,215 @@ +import hooks from './adapter' +import { + appContext, + appProperties, + bindFilter, + createComponent +} from './adapter' +import { defineAsyncComponent, directive, emitter, h, markRaw, Teleport } from './adapter' +import { parseVnode, renderComponent, rootConfig, tools, useRouter } from './adapter' +import { t } from '@opentiny/vue-locale' +import '@opentiny/vue-theme/base/index.less' + +import { defineComponent, isVue2, isVue3 } from './adapter' +export { defineComponent, isVue2, isVue3, appProperties } + +export const $prefix = 'Tiny' + +const tinyMap = { + tinyMode: 'tiny_mode', + tinyModeRoot: 'tiny_mode_root', + tinyTemplate: 'tiny_template', + tinyRenderless: 'tiny_renderless' +} + +export const $props = { + [tinyMap.tinyMode]: String, + [tinyMap.tinyModeRoot]: Boolean, + [tinyMap.tinyTemplate]: [Function, Object], + [tinyMap.tinyRenderless]: Function +} + +export const props = ['tiny_mode', 'tiny_mode_root', 'tiny_template', 'tiny_renderless', '_constants'] + +const resolveMode = (props, context) => { + let isRightMode = (mode) => ~['pc', 'mobile'].indexOf(mode) + let config = rootConfig(context) + let tinyModeProp = typeof props.tiny_mode === 'string' ? props.tiny_mode : null + let tinyModeInject = hooks.inject('TinyMode', null) + let tinyModeGlobal = config.tiny_mode && config.tiny_mode.value + + !isRightMode(tinyModeProp) && (tinyModeProp = null) + !isRightMode(tinyModeInject) && (tinyModeInject = null) + !isRightMode(tinyModeGlobal) && (tinyModeGlobal = null) + + let tinyMode = tinyModeProp || tinyModeInject || tinyModeGlobal || 'pc' + + if (props.tiny_mode_root) { + hooks.provide('TinyMode', tinyMode) + } + + return tinyMode +} + +export const $setup = ({ props, context, template, extend = {} }) => { + const view = hooks.computed(() => { + if (typeof props.tiny_template !== 'undefined') return props.tiny_template + + const component = template(resolveMode(props, context), props) + + return typeof component === 'function' ? defineAsyncComponent(component) : component + }) + + initComponent() + + return renderComponent({ view, props, context, extend }) +} + +export const setup = ({ props, context, renderless, api, extendOptions = {}, mono = false }) => { + const render = typeof props.tiny_renderless === 'function' ? props.tiny_renderless : renderless + const utils = { $prefix, t, ...tools(context) } + const sdk = render(props, hooks, utils, extendOptions) + + const attrs = { + t, + vm: utils.vm, + f: bindFilter, + a: filterAttrs, + d: utils.defineInstanceProperties, + dp: utils.defineParentInstanceProperties + } + + /** + * 修复 render 函数下 this.slots 不会动态更新的问题(vue3 环境没有问题) + * 解决方法:在 instance 下注入 slots、scopedSlots + * 注意:renderless 下尽量使用 vm.$refs、vm.$slots + */ + attrs.d({ + slots: { get: () => utils.vm.$slots }, + scopedSlots: { get: () => utils.vm.$scopedSlots } + }) + + attrs.dp({ + slots: { get: () => utils.parent.$slots }, + scopedSlots: { get: () => utils.parent.$scopedSlots } + }) + + initComponent() + + Array.isArray(api) && + api.forEach((name) => { + const value = sdk[name] + + if (typeof value !== 'undefined') { + attrs[name] = value + mono || utils.setParentAttribute({ name, value }) + } + }) + + return attrs +} + +export const svg = ({ name = 'Icon', component }) => { + return () => + markRaw({ + name: $prefix + name, + setup: (props, context) => { + const { fill, width, height } = context.attrs || {} + const extend = Object.assign( + { + style: { fill, width, height }, + class: { 'tiny-svg': true } + } + ) + + extend.isSvg = true + + // 解决本地运行会报大量警告的问题 + if (process.env.BUILD_TARGET) { + extend.nativeOn = context.listeners + } + + return renderComponent({ + component, + props, + context, + extend + }) + } + }) +} + +export const filterAttrs = (attrs, filters, include) => { + const props = {} + + for (let name in attrs) { + const find = filters.some((r) => new RegExp(r).test(name)) + + if ((include && find) || (!include && !find)) { + props[name] = attrs[name] + } + } + + return props +} + +export let setupComponent = {} + +export const initComponent = () => { + for (let name in setupComponent) { + const component = setupComponent[name] + + if (typeof component.install === 'function') { + component.install(appContext()) + } + + if (typeof component.init === 'function') { + component.init(appProperties()) + } + } + + setupComponent = {} +} + +export const $install = (component) => { + component.install = function (Vue) { + Vue.component(component.name, component) + } +} + +export const version = process.env.COMPONENT_VERSION + +export type { PropType, ExtractPropTypes, DefineComponent } from './adapter' + +export { + h, + hooks, + directive, + parseVnode, + useRouter, + emitter, + createComponent, + defineAsyncComponent, + Teleport +} + +export default { + h, + directive, + parseVnode, + useRouter, + emitter, + createComponent, + defineAsyncComponent, + filterAttrs, + initComponent, + setupComponent, + svg, + $prefix, + $props, + props, + $setup, + setup, + hooks, + $install +} diff --git a/packages/vue-icon/CHANGELOG.md b/packages/vue-icon/CHANGELOG.md new file mode 100644 index 000000000..e69de29bb diff --git a/packages/vue-icon/index.ts b/packages/vue-icon/index.ts new file mode 100644 index 000000000..8ee72241d --- /dev/null +++ b/packages/vue-icon/index.ts @@ -0,0 +1,945 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import IconAdd from './src/add' +import IconAdministrator from './src/administrator' +import IconAlignBaseline from './src/align-baseline' +import IconAlignCenter from './src/align-center' +import IconAlignFlexCenter from './src/align-flex-center' +import IconAlignFlexEnd from './src/align-flex-end' +import IconAlignFlexStart from './src/align-flex-start' +import IconAlignJustify from './src/align-justify' +import IconAlignLeft from './src/align-left' +import IconAlignRight from './src/align-right' +import IconAlignStretch from './src/align-stretch' +import IconAngularjs from './src/angularjs' +import IconApp from './src/app' +import IconApplication from './src/application' +import IconAreaChart from './src/area-chart' +import IconArrowDown from './src/arrow-down' +import IconArrowLeft from './src/arrow-left' +import IconArrowRight from './src/arrow-right' +import IconArrowUp from './src/arrow-up' +import IconAscending from './src/ascending' +import IconAssociation from './src/association' +import IconAttachment from './src/attachment' +import IconBarChart from './src/bar-chart' +import IconBefilter from './src/befilter' +import IconBoat from './src/boat' +import IconBoxSolid from './src/box-solid' +import IconBusy from './src/busy' +import IconCalculator from './src/calculator' +import IconCalendar from './src/calendar' +import IconCheckOut from './src/check-out' +import IconCheck from './src/check' +import IconCheckedLinear from './src/checked-linear' +import IconCheckedSur from './src/checked-sur' +import IconCheckedTrue from './src/checked-true' +import IconChevronDown from './src/chevron-down' +import IconChevronLeft from './src/chevron-left' +import IconChevronRight from './src/chevron-right' +import IconChevronUp from './src/chevron-up' +import IconClearFilter from './src/clear-filter' +import IconClockWork from './src/clock-work' +import IconCloseCircle from './src/close-circle' +import IconCloseSquare from './src/close-square' +import IconClose from './src/close' +import IconCloudDownload from './src/cloud-download' +import IconCloudUpload from './src/cloud-upload' +import IconCode from './src/code' +import IconCoin from './src/coin' +import IconColReverse from './src/col-reverse' +import IconCommission from './src/commission' +import IconConmentRefresh from './src/conment-refresh' +import IconCopySolid from './src/copy-solid' +import IconCopy from './src/copy' +import IconCourse from './src/course' +import IconCueL from './src/cue-l' +import IconCustom from './src/custom' +import IconCustomerService from './src/customer-service' +import IconCrop from './src/crop' +import IconDataSource from './src/data-source' +import IconDefault from './src/default' +import IconDefinedFiltration from './src/defined-filtration' +import IconDel from './src/del' +import IconDeletePage from './src/delete-page' +import IconDeleted from './src/deleted' +import IconDeltaDownO from './src/delta-down-o' +import IconDeltaDown from './src/delta-down' +import IconDeltaLeftO from './src/delta-left-o' +import IconDeltaLeft from './src/delta-left' +import IconDeltaRightO from './src/delta-right-o' +import IconDeltaRight from './src/delta-right' +import IconDeltaUpO from './src/delta-up-o' +import IconDeltaUp from './src/delta-up' +import IconDerive from './src/derive' +import IconDescending from './src/descending' +import IconDesktopView from './src/desktop-view' +import IconDialog from './src/dialog' +import IconDialog2 from './src/dialog2' +import IconDirectionCol from './src/direction-col' +import IconDirectionRow from './src/direction-row' +import IconDotChart from './src/dot-chart' +import IconDotDownload from './src/dot-download' +import IconDotIpv4 from './src/dot-ipv4' +import IconDoubleLeft from './src/double-left' +import IconDoubleRight from './src/double-right' +import IconDownO from './src/down-o' +import IconDown from './src/down' +import IconDownloadCloud from './src/download-cloud' +import IconDownloadLink from './src/download-link' +import IconDownload from './src/download' +import IconDraft from './src/draft' +import IconEdit from './src/edit' +import IconEditorTab from './src/editor-tab' +import IconEllipsis from './src/ellipsis' +import IconEmailAdd from './src/email-add' +import IconEmailCircle from './src/email-circle' +import IconEnd from './src/end' +import IconError from './src/error' +import IconEspaceAuto from './src/espace-auto' +import IconEspace from './src/espace' +import IconExcel from './src/excel' +import IconException from './src/exception' +import IconExclamation from './src/exclamation' +import IconExport from './src/export' +import IconExpressSearch from './src/express-search' +import IconEyeclose from './src/eyeclose' +import IconEyeopen from './src/eyeopen' +import IconEditorAlignCenter from './src/editor-align-center' +import IconEditorAlignLeft from './src/editor-align-left' +import IconEditorAlignRight from './src/editor-align-right' +import IconEditorBackground from './src/editor-background' +import IconEditorBold from './src/editor-bold' +import IconEditorCode from './src/editor-code' +import IconEditorDeleteline from './src/editor-deleteline' +import IconEditorEraser from './src/editor-eraser' +import IconEditorItalic from './src/editor-italic' +import IconEditorLeftBorder from './src/editor-left-border' +import IconEditorList from './src/editor-list' +import IconEditorListDot from './src/editor-list-dot' +import IconEditorListNum from './src/editor-list-num' +import IconEditorMenuLeft from './src/editor-menu-left' +import IconEditorMenuRight from './src/editor-menu-right' +import IconEditorQuote from './src/editor-quote' +import IconEditorRedo from './src/editor-redo' +import IconEditorRightBorder from './src/editor-right-border' +import IconEditorSub from './src/editor-sub' +import IconEditorSubtitle from './src/editor-subtitle' +import IconEditorSuper from './src/editor-super' +import IconEditorTable from './src/editor-table' +import IconEditorTextcolor from './src/editor-textcolor' +import IconEditorTitle from './src/editor-title' +import IconEditorUnderline from './src/editor-underline' +import IconEditorUndo from './src/editor-undo' +import IconEditorVideo from './src/editor-video' +import IconFileCloudupload from './src/file-cloudupload' +import IconFileExcel from './src/file-excel' +import IconFile from './src/file' +import IconFilesCircle from './src/files-circle' +import IconFiles from './src/files' +import IconFiletext from './src/filetext' +import IconFileupload from './src/fileupload' +import IconFiltered from './src/filtered' +import IconFlag from './src/flag' +import IconFolderClosed from './src/folder-closed' +import IconFolderOpened from './src/folder-opened' +import IconFontColor from './src/font-color' +import IconFontFamily from './src/font-family' +import IconFontSize from './src/font-size' +import IconFontStyle from './src/font-style' +import IconFontWeight from './src/font-weight' +import IconFreezeLeft from './src/freeze-left' +import IconFreezeRight from './src/freeze-right' +import IconFrownO from './src/frown-o' +import IconFrown from './src/frown' +import IconFullscreen from './src/fullscreen' +import IconFullscreenLeft from './src/fullscreen-left' +import IconGrade from './src/grade' +import IconGroupTransfer from './src/group-transfer' +import IconGroup from './src/group' +import IconHalfchecked from './src/halfchecked' +import IconHalfselect from './src/halfselect' +import IconHeartempty from './src/heartempty' +import IconHelpCircle from './src/help-circle' +import IconHelpQuery from './src/help-query' +import IconHelpSolid from './src/help-solid' +import IconHelp from './src/help' +import IconHelpful from './src/helpful' +import IconHideLeft from './src/hide-left' +import IconHideRight from './src/hide-right' +import IconHideTopleft from './src/hide-topleft' +import IconImport from './src/import' +import IconInfoCircle from './src/info-circle' +import IconInfoSolid from './src/info-solid' +import IconInfo from './src/info' +import IconInformation from './src/information' +import IconJs from './src/js' +import IconJusitfyCenter from './src/jusitfy-center' +import IconJusitfyFlexEnd from './src/jusitfy-flex-end' +import IconJusitfySpaceAround from './src/jusitfy-space-around' +import IconJusitfySpaceBetween from './src/jusitfy-space-between' +import IconJustitfyFlexStart from './src/justitfy-flex-start' +import IconLanguage from './src/language' +import IconLeave from './src/leave' +import IconLeftFrozen from './src/left-frozen' +import IconLeftO from './src/left-o' +import IconLeftWard from './src/left-ward' +import IconLeft from './src/left' +import IconLineChart from './src/line-chart' +import IconLineHeight from './src/line-height' +import IconLineThrought from './src/line-throught' +import IconLink from './src/link' +import IconLoading from './src/loading' +import IconLock from './src/lock' +import IconMailContent from './src/mail-content' +import IconMail from './src/mail' +import IconMale from './src/male' +import IconMarkOn from './src/mark-on' +import IconMeh from './src/meh' +import IconMessageCircle from './src/message-circle' +import IconMinscreen from './src/minscreen' +import IconMinscreenLeft from './src/minscreen-left' +import IconMinusCircle from './src/minus-circle' +import IconMinusSquare from './src/minus-square' +import IconMinus from './src/minus' +import IconMobileView from './src/mobile-view' +import IconMobile from './src/mobile' +import IconMore from './src/more' +import IconNew from './src/new' +import IconNoPremission from './src/no-premission' +import IconNodeOpen from './src/node-open' +import IconNode from './src/node' +import IconNodejs from './src/nodejs' +import IconNone from './src/none' +import IconOffLine from './src/off-line' +import IconOnLine from './src/on-line' +import IconOperationfaildL from './src/operationfaild-l' +import IconOperationfaild from './src/operationfaild' +import IconOuterLink from './src/outer-link' +import IconPagelink from './src/pagelink' +import IconPagerFirst from './src/pager-first' +import IconPagerLast from './src/pager-last' +import IconPagerNext from './src/pager-next' +import IconPagerPrev from './src/pager-prev' +import IconPanelMax from './src/panel-max' +import IconPanelMini from './src/panel-mini' +import IconPanelNormal from './src/panel-normal' +import IconPauseCircle from './src/pause-circle' +import IconPause from './src/pause' +import IconPicture from './src/picture' +import IconPieChart from './src/pie-chart' +import IconPlusCircle from './src/plus-circle' +import IconPlusSquare from './src/plus-square' +import IconPlus from './src/plus' +import IconPopup from './src/popup' +import IconPreChecked from './src/pre-checked' +import IconPrintPreview from './src/print-preview' +import IconPushpin from './src/pushpin' +import IconRadio from './src/radio' +import IconRadioselected from './src/radioselected' +import IconReactjs from './src/reactjs' +import IconRedo from './src/redo' +import IconRefres from './src/refres' +import IconRenew from './src/renew' +import IconRepeat from './src/repeat' +import IconReplace from './src/replace' +import IconReplies from './src/replies' +import IconRightFrozen from './src/right-frozen' +import IconRightO from './src/right-o' +import IconRight from './src/right' +import IconRightward from './src/rightward' +import IconRowReverse from './src/row-reverse' +import IconSandwichCollapse from './src/sandwich-collapse' +import IconSandwichExpand from './src/sandwich-expand' +import IconSave from './src/save' +import IconScissor from './src/scissor' +import IconSearch from './src/search' +import IconSelect from './src/select' +import IconSent from './src/sent' +import IconSeparate from './src/separate' +import IconSetting from './src/setting' +import IconShare from './src/share' +import IconShareArrow from './src/share-arrow' +import IconShoppingCard from './src/shopping-card' +import IconSmileO from './src/smile-o' +import IconSmile from './src/smile' +import IconSortDefault from './src/sort-default' +import IconSort from './src/sort' +import IconStarActive from './src/star-active' +import IconStarDisable from './src/star-disable' +import IconStarO from './src/star-o' +import IconStartCircle from './src/start-circle' +import IconStart from './src/start' +import IconStatistics from './src/statistics' +import IconStop from './src/stop' +import IconStreamSolid from './src/stream-solid' +import IconSuccess from './src/success' +import IconSuccessful from './src/successful' +import IconTabletView from './src/tablet-view' +import IconTaskCooperation from './src/task-cooperation' +import IconTelephoneCircle from './src/telephone-circle' +import IconTelephone from './src/telephone' +import IconTextAlign from './src/text-align' +import IconTextDecoration from './src/text-decoration' +import IconTextTab from './src/text-tab' +import IconText from './src/text' +import IconTime from './src/time' +import IconTotal from './src/total' +import IconTriangleDown from './src/triangle-down' +import IconUndelete from './src/undelete' +import IconUnderline from './src/underline' +import IconUndo from './src/undo' +import IconUnfilter from './src/unfilter' +import IconUnfreeze from './src/unfreeze' +import IconUnknow from './src/unknow' +import IconUnknown from './src/unknown' +import IconUnlock from './src/unlock' +import IconUnsent from './src/unsent' +import IconUpO from './src/up-o' +import IconUp from './src/up' +import IconUpload from './src/upload' +import IconUser from './src/user' +import IconVersiontree from './src/versiontree' +import IconView from './src/view' +import IconVuejs from './src/vuejs' +import IconWarningTriangle from './src/warning-triangle' +import IconWarning from './src/warning' +import IconWebPlus from './src/web-plus' +import IconWriting from './src/writing' +import IconYes from './src/yes' +import IconZoomIn from './src/zoom-in' +import IconZoomOut from './src/zoom-out' +export * from './src/lowercase' +export { + IconAdd, + IconAdministrator, + IconAlignBaseline, + IconAlignCenter, + IconAlignFlexCenter, + IconAlignFlexEnd, + IconAlignFlexStart, + IconAlignJustify, + IconAlignLeft, + IconAlignRight, + IconAlignStretch, + IconAngularjs, + IconApp, + IconApplication, + IconAreaChart, + IconArrowDown, + IconArrowLeft, + IconArrowRight, + IconArrowUp, + IconAscending, + IconAssociation, + IconAttachment, + IconBarChart, + IconBefilter, + IconBoat, + IconBoxSolid, + IconBusy, + IconCalculator, + IconCalendar, + IconCheckOut, + IconCheck, + IconCheckedLinear, + IconCheckedSur, + IconCheckedTrue, + IconChevronDown, + IconChevronLeft, + IconChevronRight, + IconChevronUp, + IconClearFilter, + IconClockWork, + IconCloseCircle, + IconCloseSquare, + IconClose, + IconCloudDownload, + IconCloudUpload, + IconCode, + IconCoin, + IconColReverse, + IconCommission, + IconConmentRefresh, + IconCopySolid, + IconCopy, + IconCrop, + IconCourse, + IconCueL, + IconCustom, + IconCustomerService, + IconDataSource, + IconDefault, + IconDefinedFiltration, + IconDel, + IconDeletePage, + IconDeleted, + IconDeltaDownO, + IconDeltaDown, + IconDeltaLeftO, + IconDeltaLeft, + IconDeltaRightO, + IconDeltaRight, + IconDeltaUpO, + IconDeltaUp, + IconDerive, + IconDescending, + IconDesktopView, + IconDialog, + IconDialog2, + IconDirectionCol, + IconDirectionRow, + IconDotChart, + IconDotDownload, + IconDotIpv4, + IconDoubleLeft, + IconDoubleRight, + IconDownO, + IconDown, + IconDownloadCloud, + IconDownloadLink, + IconDownload, + IconDraft, + IconEdit, + IconEditorTab, + IconEllipsis, + IconEmailAdd, + IconEmailCircle, + IconEnd, + IconError, + IconEspaceAuto, + IconEspace, + IconExcel, + IconException, + IconExclamation, + IconExport, + IconExpressSearch, + IconEyeclose, + IconEyeopen, + IconEditorAlignCenter, + IconEditorAlignLeft, + IconEditorAlignRight, + IconEditorBackground, + IconEditorBold, + IconEditorCode, + IconEditorDeleteline, + IconEditorEraser, + IconEditorItalic, + IconEditorLeftBorder, + IconEditorList, + IconEditorListDot, + IconEditorListNum, + IconEditorMenuLeft, + IconEditorMenuRight, + IconEditorQuote, + IconEditorRedo, + IconEditorRightBorder, + IconEditorSub, + IconEditorSubtitle, + IconEditorSuper, + IconEditorTable, + IconEditorTextcolor, + IconEditorTitle, + IconEditorUnderline, + IconEditorUndo, + IconEditorVideo, + IconFileCloudupload, + IconFileExcel, + IconFile, + IconFilesCircle, + IconFiles, + IconFiletext, + IconFileupload, + IconFiltered, + IconFlag, + IconFolderClosed, + IconFolderOpened, + IconFontColor, + IconFontFamily, + IconFontSize, + IconFontStyle, + IconFontWeight, + IconFreezeLeft, + IconFreezeRight, + IconFrownO, + IconFrown, + IconFullscreen, + IconFullscreenLeft, + IconMinscreenLeft, + IconGrade, + IconGroupTransfer, + IconGroup, + IconHalfchecked, + IconHalfselect, + IconHeartempty, + IconHelpCircle, + IconHelpQuery, + IconHelpSolid, + IconHelp, + IconHelpful, + IconHideLeft, + IconHideRight, + IconHideTopleft, + IconImport, + IconInfoCircle, + IconInfoSolid, + IconInfo, + IconInformation, + IconJs, + IconJusitfyCenter, + IconJusitfyFlexEnd, + IconJusitfySpaceAround, + IconJusitfySpaceBetween, + IconJustitfyFlexStart, + IconLanguage, + IconLeave, + IconLeftFrozen, + IconLeftO, + IconLeftWard, + IconLeft, + IconLineChart, + IconLineHeight, + IconLineThrought, + IconLink, + IconLoading, + IconLock, + IconMailContent, + IconMail, + IconMale, + IconMarkOn, + IconMeh, + IconMessageCircle, + IconMinscreen, + IconMinusCircle, + IconMinusSquare, + IconMinus, + IconMobileView, + IconMobile, + IconMore, + IconNew, + IconNoPremission, + IconNodeOpen, + IconNode, + IconNodejs, + IconNone, + IconOffLine, + IconOnLine, + IconOperationfaildL, + IconOperationfaild, + IconOuterLink, + IconPagelink, + IconPagerFirst, + IconPagerLast, + IconPagerNext, + IconPagerPrev, + IconPanelMax, + IconPanelMini, + IconPanelNormal, + IconPauseCircle, + IconPause, + IconPicture, + IconPieChart, + IconPlusCircle, + IconPlusSquare, + IconPlus, + IconPopup, + IconPreChecked, + IconPrintPreview, + IconPushpin, + IconRadio, + IconRadioselected, + IconReactjs, + IconRedo, + IconRefres, + IconRenew, + IconRepeat, + IconReplace, + IconReplies, + IconRightFrozen, + IconRightO, + IconRight, + IconRightward, + IconRowReverse, + IconSandwichCollapse, + IconSandwichExpand, + IconSave, + IconScissor, + IconSearch, + IconSelect, + IconSent, + IconSeparate, + IconSetting, + IconShare, + IconShareArrow, + IconShoppingCard, + IconSmileO, + IconSmile, + IconSortDefault, + IconSort, + IconStarActive, + IconStarDisable, + IconStarO, + IconStartCircle, + IconStart, + IconStatistics, + IconStop, + IconStreamSolid, + IconSuccess, + IconSuccessful, + IconTabletView, + IconTaskCooperation, + IconTelephoneCircle, + IconTelephone, + IconTextAlign, + IconTextDecoration, + IconTextTab, + IconText, + IconTime, + IconTotal, + IconTriangleDown, + IconUndelete, + IconUnderline, + IconUndo, + IconUnfilter, + IconUnfreeze, + IconUnknow, + IconUnknown, + IconUnlock, + IconUnsent, + IconUpO, + IconUp, + IconUpload, + IconUser, + IconVersiontree, + IconView, + IconVuejs, + IconWarningTriangle, + IconWarning, + IconWebPlus, + IconWriting, + IconYes, + IconZoomIn, + IconZoomOut +} + +export default { + IconAdd, + IconAdministrator, + IconAlignBaseline, + IconAlignCenter, + IconAlignFlexCenter, + IconAlignFlexEnd, + IconAlignFlexStart, + IconAlignJustify, + IconAlignLeft, + IconAlignRight, + IconAlignStretch, + IconAngularjs, + IconApp, + IconApplication, + IconAreaChart, + IconArrowDown, + IconArrowLeft, + IconArrowRight, + IconArrowUp, + IconAscending, + IconAssociation, + IconAttachment, + IconBarChart, + IconBefilter, + IconBoat, + IconBoxSolid, + IconBusy, + IconCalculator, + IconCalendar, + IconCheckOut, + IconCheck, + IconCheckedLinear, + IconCheckedSur, + IconCheckedTrue, + IconChevronDown, + IconChevronLeft, + IconChevronRight, + IconChevronUp, + IconClearFilter, + IconClockWork, + IconCloseCircle, + IconCloseSquare, + IconClose, + IconCloudDownload, + IconCloudUpload, + IconCode, + IconCoin, + IconColReverse, + IconCommission, + IconConmentRefresh, + IconCopySolid, + IconCopy, + IconCourse, + IconCueL, + IconCustom, + IconCustomerService, + IconCrop, + IconDataSource, + IconDefault, + IconDefinedFiltration, + IconDel, + IconDeletePage, + IconDeleted, + IconDeltaDownO, + IconDeltaDown, + IconDeltaLeftO, + IconDeltaLeft, + IconDeltaRightO, + IconDeltaRight, + IconDeltaUpO, + IconDeltaUp, + IconDerive, + IconDescending, + IconDesktopView, + IconDialog, + IconDialog2, + IconDirectionCol, + IconDirectionRow, + IconDotChart, + IconDotDownload, + IconDotIpv4, + IconDoubleLeft, + IconDoubleRight, + IconDownO, + IconDown, + IconDownloadCloud, + IconDownloadLink, + IconDownload, + IconDraft, + IconEdit, + IconEditorTab, + IconEllipsis, + IconEmailAdd, + IconEmailCircle, + IconEnd, + IconError, + IconEspaceAuto, + IconEspace, + IconExcel, + IconException, + IconExclamation, + IconExport, + IconExpressSearch, + IconEyeclose, + IconEyeopen, + IconEditorAlignCenter, + IconEditorAlignLeft, + IconEditorAlignRight, + IconEditorBackground, + IconEditorBold, + IconEditorCode, + IconEditorDeleteline, + IconEditorEraser, + IconEditorItalic, + IconEditorLeftBorder, + IconEditorList, + IconEditorListDot, + IconEditorListNum, + IconEditorMenuLeft, + IconEditorMenuRight, + IconEditorQuote, + IconEditorRedo, + IconEditorRightBorder, + IconEditorSub, + IconEditorSubtitle, + IconEditorSuper, + IconEditorTable, + IconEditorTextcolor, + IconEditorTitle, + IconEditorUnderline, + IconEditorUndo, + IconEditorVideo, + IconFileCloudupload, + IconFileExcel, + IconFile, + IconFilesCircle, + IconFiles, + IconFiletext, + IconFileupload, + IconFiltered, + IconFlag, + IconFolderClosed, + IconFolderOpened, + IconFontColor, + IconFontFamily, + IconFontSize, + IconFontStyle, + IconFontWeight, + IconFreezeLeft, + IconFreezeRight, + IconFrownO, + IconFrown, + IconFullscreen, + IconFullscreenLeft, + IconGrade, + IconGroupTransfer, + IconGroup, + IconHalfchecked, + IconHalfselect, + IconHeartempty, + IconHelpCircle, + IconHelpQuery, + IconHelpSolid, + IconHelp, + IconHelpful, + IconHideLeft, + IconHideRight, + IconHideTopleft, + IconImport, + IconInfoCircle, + IconInfoSolid, + IconInfo, + IconInformation, + IconJs, + IconJusitfyCenter, + IconJusitfyFlexEnd, + IconJusitfySpaceAround, + IconJusitfySpaceBetween, + IconJustitfyFlexStart, + IconLanguage, + IconLeave, + IconLeftFrozen, + IconLeftO, + IconLeftWard, + IconLeft, + IconLineChart, + IconLineHeight, + IconLineThrought, + IconLink, + IconLoading, + IconLock, + IconMailContent, + IconMail, + IconMale, + IconMarkOn, + IconMeh, + IconMessageCircle, + IconMinscreenLeft, + IconMinscreen, + IconMinusCircle, + IconMinusSquare, + IconMinus, + IconMobileView, + IconMobile, + IconMore, + IconNew, + IconNoPremission, + IconNodeOpen, + IconNode, + IconNodejs, + IconNone, + IconOffLine, + IconOnLine, + IconOperationfaildL, + IconOperationfaild, + IconOuterLink, + IconPagelink, + IconPagerFirst, + IconPagerLast, + IconPagerNext, + IconPagerPrev, + IconPanelMax, + IconPanelMini, + IconPanelNormal, + IconPauseCircle, + IconPause, + IconPicture, + IconPieChart, + IconPlusCircle, + IconPlusSquare, + IconPlus, + IconPopup, + IconPreChecked, + IconPrintPreview, + IconPushpin, + IconRadio, + IconRadioselected, + IconReactjs, + IconRedo, + IconRefres, + IconRenew, + IconRepeat, + IconReplace, + IconReplies, + IconRightFrozen, + IconRightO, + IconRight, + IconRightward, + IconRowReverse, + IconSandwichCollapse, + IconSandwichExpand, + IconSave, + IconScissor, + IconSearch, + IconSelect, + IconSent, + IconSeparate, + IconSetting, + IconShare, + IconShareArrow, + IconShoppingCard, + IconSmileO, + IconSmile, + IconSortDefault, + IconSort, + IconStarActive, + IconStarDisable, + IconStarO, + IconStartCircle, + IconStart, + IconStatistics, + IconStop, + IconStreamSolid, + IconSuccess, + IconSuccessful, + IconTabletView, + IconTaskCooperation, + IconTelephoneCircle, + IconTelephone, + IconTextAlign, + IconTextDecoration, + IconTextTab, + IconText, + IconTime, + IconTotal, + IconTriangleDown, + IconUndelete, + IconUnderline, + IconUndo, + IconUnfilter, + IconUnfreeze, + IconUnknow, + IconUnknown, + IconUnlock, + IconUnsent, + IconUpO, + IconUp, + IconUpload, + IconUser, + IconVersiontree, + IconView, + IconVuejs, + IconWarningTriangle, + IconWarning, + IconWebPlus, + IconWriting, + IconYes, + IconZoomIn, + IconZoomOut +} diff --git a/packages/vue-icon/lowercase.ts b/packages/vue-icon/lowercase.ts new file mode 100644 index 000000000..133e6061d --- /dev/null +++ b/packages/vue-icon/lowercase.ts @@ -0,0 +1,946 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import iconAdd from './src/add' +import iconAdministrator from './src/administrator' +import iconAlignBaseline from './src/align-baseline' +import iconAlignCenter from './src/align-center' +import iconAlignFlexCenter from './src/align-flex-center' +import iconAlignFlexEnd from './src/align-flex-end' +import iconAlignFlexStart from './src/align-flex-start' +import iconAlignJustify from './src/align-justify' +import iconAlignLeft from './src/align-left' +import iconAlignRight from './src/align-right' +import iconAlignStretch from './src/align-stretch' +import iconAngularjs from './src/angularjs' +import iconApp from './src/app' +import iconApplication from './src/application' +import iconAreaChart from './src/area-chart' +import iconArrowDown from './src/arrow-down' +import iconArrowLeft from './src/arrow-left' +import iconArrowRight from './src/arrow-right' +import iconArrowUp from './src/arrow-up' +import iconAscending from './src/ascending' +import iconAssociation from './src/association' +import iconAttachment from './src/attachment' +import iconBarChart from './src/bar-chart' +import iconBefilter from './src/befilter' +import iconBoat from './src/boat' +import iconBoxSolid from './src/box-solid' +import iconBusy from './src/busy' +import iconCalculator from './src/calculator' +import iconCalendar from './src/calendar' +import iconCheckOut from './src/check-out' +import iconCheck from './src/check' +import iconCheckedLinear from './src/checked-linear' +import iconCheckedSur from './src/checked-sur' +import iconCheckedTrue from './src/checked-true' +import iconChevronDown from './src/chevron-down' +import iconChevronLeft from './src/chevron-left' +import iconChevronRight from './src/chevron-right' +import iconChevronUp from './src/chevron-up' +import iconClearFilter from './src/clear-filter' +import iconClockWork from './src/clock-work' +import iconCloseCircle from './src/close-circle' +import iconCloseSquare from './src/close-square' +import iconClose from './src/close' +import iconCloudDownload from './src/cloud-download' +import iconCloudUpload from './src/cloud-upload' +import iconCode from './src/code' +import iconCoin from './src/coin' +import iconColReverse from './src/col-reverse' +import iconCommission from './src/commission' +import iconConmentRefresh from './src/conment-refresh' +import iconCopySolid from './src/copy-solid' +import iconCopy from './src/copy' +import iconCourse from './src/course' +import iconCueL from './src/cue-l' +import iconCustom from './src/custom' +import iconCustomerService from './src/customer-service' +import iconCrop from './src/crop' +import iconDataSource from './src/data-source' +import iconDefault from './src/default' +import iconDefinedFiltration from './src/defined-filtration' +import iconDel from './src/del' +import iconDeletePage from './src/delete-page' +import iconDeleted from './src/deleted' +import iconDeltaDownO from './src/delta-down-o' +import iconDeltaDown from './src/delta-down' +import iconDeltaLeftO from './src/delta-left-o' +import iconDeltaLeft from './src/delta-left' +import iconDeltaRightO from './src/delta-right-o' +import iconDeltaRight from './src/delta-right' +import iconDeltaUpO from './src/delta-up-o' +import iconDeltaUp from './src/delta-up' +import iconDerive from './src/derive' +import iconDescending from './src/descending' +import iconDesktopView from './src/desktop-view' +import iconDialog from './src/dialog' +import iconDialog2 from './src/dialog2' +import iconDirectionCol from './src/direction-col' +import iconDirectionRow from './src/direction-row' +import iconDotChart from './src/dot-chart' +import iconDotDownload from './src/dot-download' +import iconDotIpv4 from './src/dot-ipv4' +import iconDoubleLeft from './src/double-left' +import iconDoubleRight from './src/double-right' +import iconDownO from './src/down-o' +import iconDown from './src/down' +import iconDownloadCloud from './src/download-cloud' +import iconDownloadLink from './src/download-link' +import iconDownload from './src/download' +import iconDraft from './src/draft' +import iconEdit from './src/edit' +import iconEditorTab from './src/editor-tab' +import iconEllipsis from './src/ellipsis' +import iconEmailAdd from './src/email-add' +import iconEmailCircle from './src/email-circle' +import iconEnd from './src/end' +import iconError from './src/error' +import iconEspaceAuto from './src/espace-auto' +import iconEspace from './src/espace' +import iconExcel from './src/excel' +import iconException from './src/exception' +import iconExclamation from './src/exclamation' +import iconExport from './src/export' +import iconExpressSearch from './src/express-search' +import iconEyeclose from './src/eyeclose' +import iconEyeopen from './src/eyeopen' + +import iconEditorAlignCenter from './src/editor-align-center' +import iconEditorAlignLeft from './src/editor-align-left' +import iconEditorAlignRight from './src/editor-align-right' +import iconEditorBackground from './src/editor-background' +import iconEditorBold from './src/editor-bold' +import iconEditorCode from './src/editor-code' +import iconEditorDeleteline from './src/editor-deleteline' +import iconEditorEraser from './src/editor-eraser' +import iconEditorItalic from './src/editor-italic' +import iconEditorLeftBorder from './src/editor-left-border' +import iconEditorList from './src/editor-list' +import iconEditorListDot from './src/editor-list-dot' +import iconEditorListNum from './src/editor-list-num' +import iconEditorMenuLeft from './src/editor-menu-left' +import iconEditorMenuRight from './src/editor-menu-right' +import iconEditorQuote from './src/editor-quote' +import iconEditorRedo from './src/editor-redo' +import iconEditorRightBorder from './src/editor-right-border' +import iconEditorSub from './src/editor-sub' +import iconEditorSubtitle from './src/editor-subtitle' +import iconEditorSuper from './src/editor-super' +import iconEditorTable from './src/editor-table' +import iconEditorTextcolor from './src/editor-textcolor' +import iconEditorTitle from './src/editor-title' +import iconEditorUnderline from './src/editor-underline' +import iconEditorUndo from './src/editor-undo' +import iconEditorVideo from './src/editor-video' +import iconFileCloudupload from './src/file-cloudupload' +import iconFileExcel from './src/file-excel' +import iconFile from './src/file' +import iconFilesCircle from './src/files-circle' +import iconFiles from './src/files' +import iconFiletext from './src/filetext' +import iconFileupload from './src/fileupload' +import iconFiltered from './src/filtered' +import iconFlag from './src/flag' +import iconFolderClosed from './src/folder-closed' +import iconFolderOpened from './src/folder-opened' +import iconFontColor from './src/font-color' +import iconFontFamily from './src/font-family' +import iconFontSize from './src/font-size' +import iconFontStyle from './src/font-style' +import iconFontWeight from './src/font-weight' +import iconFreezeLeft from './src/freeze-left' +import iconFreezeRight from './src/freeze-right' +import iconFrownO from './src/frown-o' +import iconFrown from './src/frown' +import iconFullscreen from './src/fullscreen' +import iconFullscreenLeft from './src/fullscreen-left' +import iconGrade from './src/grade' +import iconGroupTransfer from './src/group-transfer' +import iconGroup from './src/group' +import iconHalfchecked from './src/halfchecked' +import iconHalfselect from './src/halfselect' +import iconHeartempty from './src/heartempty' +import iconHelpCircle from './src/help-circle' +import iconHelpQuery from './src/help-query' +import iconHelpSolid from './src/help-solid' +import iconHelp from './src/help' +import iconHelpful from './src/helpful' +import iconHideLeft from './src/hide-left' +import iconHideRight from './src/hide-right' +import iconHideTopleft from './src/hide-topleft' +import iconImport from './src/import' +import iconInfoCircle from './src/info-circle' +import iconInfoSolid from './src/info-solid' +import iconInfo from './src/info' +import iconInformation from './src/information' +import iconJs from './src/js' +import iconJusitfyCenter from './src/jusitfy-center' +import iconJusitfyFlexEnd from './src/jusitfy-flex-end' +import iconJusitfySpaceAround from './src/jusitfy-space-around' +import iconJusitfySpaceBetween from './src/jusitfy-space-between' +import iconJustitfyFlexStart from './src/justitfy-flex-start' +import iconLanguage from './src/language' +import iconLeave from './src/leave' +import iconLeftFrozen from './src/left-frozen' +import iconLeftO from './src/left-o' +import iconLeftWard from './src/left-ward' +import iconLeft from './src/left' +import iconLineChart from './src/line-chart' +import iconLineHeight from './src/line-height' +import iconLineThrought from './src/line-throught' +import iconLink from './src/link' +import iconLoading from './src/loading' +import iconLock from './src/lock' +import iconMailContent from './src/mail-content' +import iconMail from './src/mail' +import iconMale from './src/male' +import iconMarkOn from './src/mark-on' +import iconMeh from './src/meh' +import iconMessageCircle from './src/message-circle' +import iconMinscreen from './src/minscreen' +import iconMinscreenLeft from './src/minscreen-left' +import iconMinusCircle from './src/minus-circle' +import iconMinusSquare from './src/minus-square' +import iconMinus from './src/minus' +import iconMobileView from './src/mobile-view' +import iconMobile from './src/mobile' +import iconMore from './src/more' +import iconNew from './src/new' +import iconNoPremission from './src/no-premission' +import iconNodeOpen from './src/node-open' +import iconNode from './src/node' +import iconNodejs from './src/nodejs' +import iconNone from './src/none' +import iconOffLine from './src/off-line' +import iconOnLine from './src/on-line' +import iconOperationfaildL from './src/operationfaild-l' +import iconOperationfaild from './src/operationfaild' +import iconOuterLink from './src/outer-link' +import iconPagelink from './src/pagelink' +import iconPagerFirst from './src/pager-first' +import iconPagerLast from './src/pager-last' +import iconPagerNext from './src/pager-next' +import iconPagerPrev from './src/pager-prev' +import iconPanelMax from './src/panel-max' +import iconPanelMini from './src/panel-mini' +import iconPanelNormal from './src/panel-normal' +import iconPauseCircle from './src/pause-circle' +import iconPause from './src/pause' +import iconPicture from './src/picture' +import iconPieChart from './src/pie-chart' +import iconPlusCircle from './src/plus-circle' +import iconPlusSquare from './src/plus-square' +import iconPlus from './src/plus' +import iconPopup from './src/popup' +import iconPreChecked from './src/pre-checked' +import iconPrintPreview from './src/print-preview' +import iconPushpin from './src/pushpin' +import iconRadio from './src/radio' +import iconRadioselected from './src/radioselected' +import iconReactjs from './src/reactjs' +import iconRedo from './src/redo' +import iconRefres from './src/refres' +import iconRenew from './src/renew' +import iconRepeat from './src/repeat' +import iconReplace from './src/replace' +import iconReplies from './src/replies' +import iconRightFrozen from './src/right-frozen' +import iconRightO from './src/right-o' +import iconRight from './src/right' +import iconRightward from './src/rightward' +import iconRowReverse from './src/row-reverse' +import iconSandwichCollapse from './src/sandwich-collapse' +import iconSandwichExpand from './src/sandwich-expand' +import iconSave from './src/save' +import iconScissor from './src/scissor' +import iconSearch from './src/search' +import iconSelect from './src/select' +import iconSent from './src/sent' +import iconSeparate from './src/separate' +import iconSetting from './src/setting' +import iconShare from './src/share' +import iconShareArrow from './src/share-arrow' +import iconShoppingCard from './src/shopping-card' +import iconSmileO from './src/smile-o' +import iconSmile from './src/smile' +import iconSortDefault from './src/sort-default' +import iconSort from './src/sort' +import iconStarActive from './src/star-active' +import iconStarDisable from './src/star-disable' +import iconStarO from './src/star-o' +import iconStartCircle from './src/start-circle' +import iconStart from './src/start' +import iconStatistics from './src/statistics' +import iconStop from './src/stop' +import iconStreamSolid from './src/stream-solid' +import iconSuccess from './src/success' +import iconSuccessful from './src/successful' +import iconTabletView from './src/tablet-view' +import iconTaskCooperation from './src/task-cooperation' +import iconTelephoneCircle from './src/telephone-circle' +import iconTelephone from './src/telephone' +import iconTextAlign from './src/text-align' +import iconTextDecoration from './src/text-decoration' +import iconTextTab from './src/text-tab' +import iconText from './src/text' +import iconTime from './src/time' +import iconTotal from './src/total' +import iconTriangleDown from './src/triangle-down' +import iconUndelete from './src/undelete' +import iconUnderline from './src/underline' +import iconUndo from './src/undo' +import iconUnfilter from './src/unfilter' +import iconUnfreeze from './src/unfreeze' +import iconUnknow from './src/unknow' +import iconUnknown from './src/unknown' +import iconUnlock from './src/unlock' +import iconUnsent from './src/unsent' +import iconUpO from './src/up-o' +import iconUp from './src/up' +import iconUpload from './src/upload' +import iconUser from './src/user' +import iconVersiontree from './src/versiontree' +import iconView from './src/view' +import iconVuejs from './src/vuejs' +import iconWarningTriangle from './src/warning-triangle' +import iconWarning from './src/warning' +import iconWebPlus from './src/web-plus' +import iconWriting from './src/writing' +import iconYes from './src/yes' +import iconZoomIn from './src/zoom-in' +import iconZoomOut from './src/zoom-out' + +export { + iconAdd, + iconAdministrator, + iconAlignBaseline, + iconAlignCenter, + iconAlignFlexCenter, + iconAlignFlexEnd, + iconAlignFlexStart, + iconAlignJustify, + iconAlignLeft, + iconAlignRight, + iconAlignStretch, + iconAngularjs, + iconApp, + iconApplication, + iconAreaChart, + iconArrowDown, + iconArrowLeft, + iconArrowRight, + iconArrowUp, + iconAscending, + iconAssociation, + iconAttachment, + iconBarChart, + iconBefilter, + iconBoat, + iconBoxSolid, + iconBusy, + iconCalculator, + iconCalendar, + iconCheckOut, + iconCheck, + iconCheckedLinear, + iconCheckedSur, + iconCheckedTrue, + iconChevronDown, + iconChevronLeft, + iconChevronRight, + iconChevronUp, + iconClearFilter, + iconClockWork, + iconCloseCircle, + iconCloseSquare, + iconClose, + iconCloudDownload, + iconCloudUpload, + iconCode, + iconCoin, + iconColReverse, + iconCommission, + iconConmentRefresh, + iconCopySolid, + iconCopy, + iconCrop, + iconCourse, + iconCueL, + iconCustom, + iconCustomerService, + iconDataSource, + iconDefault, + iconDefinedFiltration, + iconDel, + iconDeletePage, + iconDeleted, + iconDeltaDownO, + iconDeltaDown, + iconDeltaLeftO, + iconDeltaLeft, + iconDeltaRightO, + iconDeltaRight, + iconDeltaUpO, + iconDeltaUp, + iconDerive, + iconDescending, + iconDesktopView, + iconDialog, + iconDialog2, + iconDirectionCol, + iconDirectionRow, + iconDotChart, + iconDotDownload, + iconDotIpv4, + iconDoubleLeft, + iconDoubleRight, + iconDownO, + iconDown, + iconDownloadCloud, + iconDownloadLink, + iconDownload, + iconDraft, + iconEdit, + iconEditorTab, + iconEllipsis, + iconEmailAdd, + iconEmailCircle, + iconEnd, + iconError, + iconEspaceAuto, + iconEspace, + iconExcel, + iconException, + iconExclamation, + iconExport, + iconExpressSearch, + iconEyeclose, + iconEyeopen, + iconEditorAlignCenter, + iconEditorAlignLeft, + iconEditorAlignRight, + iconEditorBackground, + iconEditorBold, + iconEditorCode, + iconEditorDeleteline, + iconEditorEraser, + iconEditorItalic, + iconEditorLeftBorder, + iconEditorList, + iconEditorListDot, + iconEditorListNum, + iconEditorMenuLeft, + iconEditorMenuRight, + iconEditorQuote, + iconEditorRedo, + iconEditorRightBorder, + iconEditorSub, + iconEditorSubtitle, + iconEditorSuper, + iconEditorTable, + iconEditorTextcolor, + iconEditorTitle, + iconEditorUnderline, + iconEditorUndo, + iconEditorVideo, + iconFileCloudupload, + iconFileExcel, + iconFile, + iconFilesCircle, + iconFiles, + iconFiletext, + iconFileupload, + iconFiltered, + iconFlag, + iconFolderClosed, + iconFolderOpened, + iconFontColor, + iconFontFamily, + iconFontSize, + iconFontStyle, + iconFontWeight, + iconFreezeLeft, + iconFreezeRight, + iconFrownO, + iconFrown, + iconFullscreen, + iconFullscreenLeft, + iconMinscreenLeft, + iconGrade, + iconGroupTransfer, + iconGroup, + iconHalfchecked, + iconHalfselect, + iconHeartempty, + iconHelpCircle, + iconHelpQuery, + iconHelpSolid, + iconHelp, + iconHelpful, + iconHideLeft, + iconHideRight, + iconHideTopleft, + iconImport, + iconInfoCircle, + iconInfoSolid, + iconInfo, + iconInformation, + iconJs, + iconJusitfyCenter, + iconJusitfyFlexEnd, + iconJusitfySpaceAround, + iconJusitfySpaceBetween, + iconJustitfyFlexStart, + iconLanguage, + iconLeave, + iconLeftFrozen, + iconLeftO, + iconLeftWard, + iconLeft, + iconLineChart, + iconLineHeight, + iconLineThrought, + iconLink, + iconLoading, + iconLock, + iconMailContent, + iconMail, + iconMale, + iconMarkOn, + iconMeh, + iconMessageCircle, + iconMinscreen, + iconMinusCircle, + iconMinusSquare, + iconMinus, + iconMobileView, + iconMobile, + iconMore, + iconNew, + iconNoPremission, + iconNodeOpen, + iconNode, + iconNodejs, + iconNone, + iconOffLine, + iconOnLine, + iconOperationfaildL, + iconOperationfaild, + iconOuterLink, + iconPagelink, + iconPagerFirst, + iconPagerLast, + iconPagerNext, + iconPagerPrev, + iconPanelMax, + iconPanelMini, + iconPanelNormal, + iconPauseCircle, + iconPause, + iconPicture, + iconPieChart, + iconPlusCircle, + iconPlusSquare, + iconPlus, + iconPopup, + iconPreChecked, + iconPrintPreview, + iconPushpin, + iconRadio, + iconRadioselected, + iconReactjs, + iconRedo, + iconRefres, + iconRenew, + iconRepeat, + iconReplace, + iconReplies, + iconRightFrozen, + iconRightO, + iconRight, + iconRightward, + iconRowReverse, + iconSandwichCollapse, + iconSandwichExpand, + iconSave, + iconScissor, + iconSearch, + iconSelect, + iconSent, + iconSeparate, + iconSetting, + iconShare, + iconShareArrow, + iconShoppingCard, + iconSmileO, + iconSmile, + iconSortDefault, + iconSort, + iconStarActive, + iconStarDisable, + iconStarO, + iconStartCircle, + iconStart, + iconStatistics, + iconStop, + iconStreamSolid, + iconSuccess, + iconSuccessful, + iconTabletView, + iconTaskCooperation, + iconTelephoneCircle, + iconTelephone, + iconTextAlign, + iconTextDecoration, + iconTextTab, + iconText, + iconTime, + iconTotal, + iconTriangleDown, + iconUndelete, + iconUnderline, + iconUndo, + iconUnfilter, + iconUnfreeze, + iconUnknow, + iconUnknown, + iconUnlock, + iconUnsent, + iconUpO, + iconUp, + iconUpload, + iconUser, + iconVersiontree, + iconView, + iconVuejs, + iconWarningTriangle, + iconWarning, + iconWebPlus, + iconWriting, + iconYes, + iconZoomIn, + iconZoomOut +} + +export default { + iconAdd, + iconAdministrator, + iconAlignBaseline, + iconAlignCenter, + iconAlignFlexCenter, + iconAlignFlexEnd, + iconAlignFlexStart, + iconAlignJustify, + iconAlignLeft, + iconAlignRight, + iconAlignStretch, + iconAngularjs, + iconApp, + iconApplication, + iconAreaChart, + iconArrowDown, + iconArrowLeft, + iconArrowRight, + iconArrowUp, + iconAscending, + iconAssociation, + iconAttachment, + iconBarChart, + iconBefilter, + iconBoat, + iconBoxSolid, + iconBusy, + iconCalculator, + iconCalendar, + iconCheckOut, + iconCheck, + iconCheckedLinear, + iconCheckedSur, + iconCheckedTrue, + iconChevronDown, + iconChevronLeft, + iconChevronRight, + iconChevronUp, + iconClearFilter, + iconClockWork, + iconCloseCircle, + iconCloseSquare, + iconClose, + iconCloudDownload, + iconCloudUpload, + iconCode, + iconCoin, + iconColReverse, + iconCommission, + iconConmentRefresh, + iconCopySolid, + iconCopy, + iconCourse, + iconCueL, + iconCustom, + iconCustomerService, + iconCrop, + iconDataSource, + iconDefault, + iconDefinedFiltration, + iconDel, + iconDeletePage, + iconDeleted, + iconDeltaDownO, + iconDeltaDown, + iconDeltaLeftO, + iconDeltaLeft, + iconDeltaRightO, + iconDeltaRight, + iconDeltaUpO, + iconDeltaUp, + iconDerive, + iconDescending, + iconDesktopView, + iconDialog, + iconDialog2, + iconDirectionCol, + iconDirectionRow, + iconDotChart, + iconDotDownload, + iconDotIpv4, + iconDoubleLeft, + iconDoubleRight, + iconDownO, + iconDown, + iconDownloadCloud, + iconDownloadLink, + iconDownload, + iconDraft, + iconEdit, + iconEditorTab, + iconEllipsis, + iconEmailAdd, + iconEmailCircle, + iconEnd, + iconError, + iconEspaceAuto, + iconEspace, + iconExcel, + iconException, + iconExclamation, + iconExport, + iconExpressSearch, + iconEyeclose, + iconEyeopen, + iconEditorAlignCenter, + iconEditorAlignLeft, + iconEditorAlignRight, + iconEditorBackground, + iconEditorBold, + iconEditorCode, + iconEditorDeleteline, + iconEditorEraser, + iconEditorItalic, + iconEditorLeftBorder, + iconEditorList, + iconEditorListDot, + iconEditorListNum, + iconEditorMenuLeft, + iconEditorMenuRight, + iconEditorQuote, + iconEditorRedo, + iconEditorRightBorder, + iconEditorSub, + iconEditorSubtitle, + iconEditorSuper, + iconEditorTable, + iconEditorTextcolor, + iconEditorTitle, + iconEditorUnderline, + iconEditorUndo, + iconEditorVideo, + iconFileCloudupload, + iconFileExcel, + iconFile, + iconFilesCircle, + iconFiles, + iconFiletext, + iconFileupload, + iconFiltered, + iconFlag, + iconFolderClosed, + iconFolderOpened, + iconFontColor, + iconFontFamily, + iconFontSize, + iconFontStyle, + iconFontWeight, + iconFreezeLeft, + iconFreezeRight, + iconFrownO, + iconFrown, + iconFullscreen, + iconFullscreenLeft, + iconGrade, + iconGroupTransfer, + iconGroup, + iconHalfchecked, + iconHalfselect, + iconHeartempty, + iconHelpCircle, + iconHelpQuery, + iconHelpSolid, + iconHelp, + iconHelpful, + iconHideLeft, + iconHideRight, + iconHideTopleft, + iconImport, + iconInfoCircle, + iconInfoSolid, + iconInfo, + iconInformation, + iconJs, + iconJusitfyCenter, + iconJusitfyFlexEnd, + iconJusitfySpaceAround, + iconJusitfySpaceBetween, + iconJustitfyFlexStart, + iconLanguage, + iconLeave, + iconLeftFrozen, + iconLeftO, + iconLeftWard, + iconLeft, + iconLineChart, + iconLineHeight, + iconLineThrought, + iconLink, + iconLoading, + iconLock, + iconMailContent, + iconMail, + iconMale, + iconMarkOn, + iconMeh, + iconMessageCircle, + iconMinscreenLeft, + iconMinscreen, + iconMinusCircle, + iconMinusSquare, + iconMinus, + iconMobileView, + iconMobile, + iconMore, + iconNew, + iconNoPremission, + iconNodeOpen, + iconNode, + iconNodejs, + iconNone, + iconOffLine, + iconOnLine, + iconOperationfaildL, + iconOperationfaild, + iconOuterLink, + iconPagelink, + iconPagerFirst, + iconPagerLast, + iconPagerNext, + iconPagerPrev, + iconPanelMax, + iconPanelMini, + iconPanelNormal, + iconPauseCircle, + iconPause, + iconPicture, + iconPieChart, + iconPlusCircle, + iconPlusSquare, + iconPlus, + iconPopup, + iconPreChecked, + iconPrintPreview, + iconPushpin, + iconRadio, + iconRadioselected, + iconReactjs, + iconRedo, + iconRefres, + iconRenew, + iconRepeat, + iconReplace, + iconReplies, + iconRightFrozen, + iconRightO, + iconRight, + iconRightward, + iconRowReverse, + iconSandwichCollapse, + iconSandwichExpand, + iconSave, + iconScissor, + iconSearch, + iconSelect, + iconSent, + iconSeparate, + iconSetting, + iconShare, + iconShareArrow, + iconShoppingCard, + iconSmileO, + iconSmile, + iconSortDefault, + iconSort, + iconStarActive, + iconStarDisable, + iconStarO, + iconStartCircle, + iconStart, + iconStatistics, + iconStop, + iconStreamSolid, + iconSuccess, + iconSuccessful, + iconTabletView, + iconTaskCooperation, + iconTelephoneCircle, + iconTelephone, + iconTextAlign, + iconTextDecoration, + iconTextTab, + iconText, + iconTime, + iconTotal, + iconTriangleDown, + iconUndelete, + iconUnderline, + iconUndo, + iconUnfilter, + iconUnfreeze, + iconUnknow, + iconUnknown, + iconUnlock, + iconUnsent, + iconUpO, + iconUp, + iconUpload, + iconUser, + iconVersiontree, + iconView, + iconVuejs, + iconWarningTriangle, + iconWarning, + iconWebPlus, + iconWriting, + iconYes, + iconZoomIn, + iconZoomOut +} diff --git a/packages/vue-icon/package.json b/packages/vue-icon/package.json new file mode 100644 index 000000000..eeac6c471 --- /dev/null +++ b/packages/vue-icon/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-icon", + "private": true, + "version": "3.7.0", + "description": "", + "main": "index.ts", + "license": "MIT", + "sideEffects": false, + "exports": { + ".": "./index.ts", + "./*": "./src/*" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-theme": "workspace:~" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + } +} diff --git a/packages/icon/add/index.js b/packages/vue-icon/src/add/index.ts similarity index 100% rename from packages/icon/add/index.js rename to packages/vue-icon/src/add/index.ts diff --git a/packages/icon/administrator/index.js b/packages/vue-icon/src/administrator/index.ts similarity index 100% rename from packages/icon/administrator/index.js rename to packages/vue-icon/src/administrator/index.ts diff --git a/packages/icon/align-baseline/index.js b/packages/vue-icon/src/align-baseline/index.ts similarity index 100% rename from packages/icon/align-baseline/index.js rename to packages/vue-icon/src/align-baseline/index.ts diff --git a/packages/icon/align-center/index.js b/packages/vue-icon/src/align-center/index.ts similarity index 100% rename from packages/icon/align-center/index.js rename to packages/vue-icon/src/align-center/index.ts diff --git a/packages/icon/align-flex-center/index.js b/packages/vue-icon/src/align-flex-center/index.ts similarity index 100% rename from packages/icon/align-flex-center/index.js rename to packages/vue-icon/src/align-flex-center/index.ts diff --git a/packages/icon/align-flex-end/index.js b/packages/vue-icon/src/align-flex-end/index.ts similarity index 100% rename from packages/icon/align-flex-end/index.js rename to packages/vue-icon/src/align-flex-end/index.ts diff --git a/packages/icon/align-flex-start/index.js b/packages/vue-icon/src/align-flex-start/index.ts similarity index 100% rename from packages/icon/align-flex-start/index.js rename to packages/vue-icon/src/align-flex-start/index.ts diff --git a/packages/icon/align-justify/index.js b/packages/vue-icon/src/align-justify/index.ts similarity index 100% rename from packages/icon/align-justify/index.js rename to packages/vue-icon/src/align-justify/index.ts diff --git a/packages/icon/align-left/index.js b/packages/vue-icon/src/align-left/index.ts similarity index 100% rename from packages/icon/align-left/index.js rename to packages/vue-icon/src/align-left/index.ts diff --git a/packages/icon/align-right/index.js b/packages/vue-icon/src/align-right/index.ts similarity index 100% rename from packages/icon/align-right/index.js rename to packages/vue-icon/src/align-right/index.ts diff --git a/packages/icon/align-stretch/index.js b/packages/vue-icon/src/align-stretch/index.ts similarity index 100% rename from packages/icon/align-stretch/index.js rename to packages/vue-icon/src/align-stretch/index.ts diff --git a/packages/icon/angularjs/index.js b/packages/vue-icon/src/angularjs/index.ts similarity index 100% rename from packages/icon/angularjs/index.js rename to packages/vue-icon/src/angularjs/index.ts diff --git a/packages/icon/app/index.js b/packages/vue-icon/src/app/index.ts similarity index 100% rename from packages/icon/app/index.js rename to packages/vue-icon/src/app/index.ts diff --git a/packages/icon/application/index.js b/packages/vue-icon/src/application/index.ts similarity index 100% rename from packages/icon/application/index.js rename to packages/vue-icon/src/application/index.ts diff --git a/packages/icon/area-chart/index.js b/packages/vue-icon/src/area-chart/index.ts similarity index 100% rename from packages/icon/area-chart/index.js rename to packages/vue-icon/src/area-chart/index.ts diff --git a/packages/icon/arrow-down/index.js b/packages/vue-icon/src/arrow-down/index.ts similarity index 100% rename from packages/icon/arrow-down/index.js rename to packages/vue-icon/src/arrow-down/index.ts diff --git a/packages/icon/arrow-left/index.js b/packages/vue-icon/src/arrow-left/index.ts similarity index 100% rename from packages/icon/arrow-left/index.js rename to packages/vue-icon/src/arrow-left/index.ts diff --git a/packages/icon/arrow-right/index.js b/packages/vue-icon/src/arrow-right/index.ts similarity index 100% rename from packages/icon/arrow-right/index.js rename to packages/vue-icon/src/arrow-right/index.ts diff --git a/packages/icon/arrow-up/index.js b/packages/vue-icon/src/arrow-up/index.ts similarity index 100% rename from packages/icon/arrow-up/index.js rename to packages/vue-icon/src/arrow-up/index.ts diff --git a/packages/icon/ascending/index.js b/packages/vue-icon/src/ascending/index.ts similarity index 100% rename from packages/icon/ascending/index.js rename to packages/vue-icon/src/ascending/index.ts diff --git a/packages/icon/association/index.js b/packages/vue-icon/src/association/index.ts similarity index 100% rename from packages/icon/association/index.js rename to packages/vue-icon/src/association/index.ts diff --git a/packages/icon/attachment/index.js b/packages/vue-icon/src/attachment/index.ts similarity index 100% rename from packages/icon/attachment/index.js rename to packages/vue-icon/src/attachment/index.ts diff --git a/packages/icon/bar-chart/index.js b/packages/vue-icon/src/bar-chart/index.ts similarity index 100% rename from packages/icon/bar-chart/index.js rename to packages/vue-icon/src/bar-chart/index.ts diff --git a/packages/icon/befilter/index.js b/packages/vue-icon/src/befilter/index.ts similarity index 100% rename from packages/icon/befilter/index.js rename to packages/vue-icon/src/befilter/index.ts diff --git a/packages/icon/boat/index.js b/packages/vue-icon/src/boat/index.ts similarity index 100% rename from packages/icon/boat/index.js rename to packages/vue-icon/src/boat/index.ts diff --git a/packages/icon/box-solid/index.js b/packages/vue-icon/src/box-solid/index.ts similarity index 100% rename from packages/icon/box-solid/index.js rename to packages/vue-icon/src/box-solid/index.ts diff --git a/packages/icon/busy/index.js b/packages/vue-icon/src/busy/index.ts similarity index 100% rename from packages/icon/busy/index.js rename to packages/vue-icon/src/busy/index.ts diff --git a/packages/icon/calculator/index.js b/packages/vue-icon/src/calculator/index.ts similarity index 100% rename from packages/icon/calculator/index.js rename to packages/vue-icon/src/calculator/index.ts diff --git a/packages/icon/calendar/index.js b/packages/vue-icon/src/calendar/index.ts similarity index 100% rename from packages/icon/calendar/index.js rename to packages/vue-icon/src/calendar/index.ts diff --git a/packages/icon/check-out/index.js b/packages/vue-icon/src/check-out/index.ts similarity index 100% rename from packages/icon/check-out/index.js rename to packages/vue-icon/src/check-out/index.ts diff --git a/packages/icon/check/index.js b/packages/vue-icon/src/check/index.ts similarity index 100% rename from packages/icon/check/index.js rename to packages/vue-icon/src/check/index.ts diff --git a/packages/icon/checked-linear/index.js b/packages/vue-icon/src/checked-linear/index.ts similarity index 100% rename from packages/icon/checked-linear/index.js rename to packages/vue-icon/src/checked-linear/index.ts diff --git a/packages/icon/checked-sur/index.js b/packages/vue-icon/src/checked-sur/index.ts similarity index 100% rename from packages/icon/checked-sur/index.js rename to packages/vue-icon/src/checked-sur/index.ts diff --git a/packages/icon/checked-true/index.js b/packages/vue-icon/src/checked-true/index.ts similarity index 100% rename from packages/icon/checked-true/index.js rename to packages/vue-icon/src/checked-true/index.ts diff --git a/packages/icon/chevron-down/index.js b/packages/vue-icon/src/chevron-down/index.ts similarity index 100% rename from packages/icon/chevron-down/index.js rename to packages/vue-icon/src/chevron-down/index.ts diff --git a/packages/icon/chevron-left/index.js b/packages/vue-icon/src/chevron-left/index.ts similarity index 100% rename from packages/icon/chevron-left/index.js rename to packages/vue-icon/src/chevron-left/index.ts diff --git a/packages/icon/chevron-right/index.js b/packages/vue-icon/src/chevron-right/index.ts similarity index 100% rename from packages/icon/chevron-right/index.js rename to packages/vue-icon/src/chevron-right/index.ts diff --git a/packages/icon/chevron-up/index.js b/packages/vue-icon/src/chevron-up/index.ts similarity index 100% rename from packages/icon/chevron-up/index.js rename to packages/vue-icon/src/chevron-up/index.ts diff --git a/packages/icon/clear-filter/index.js b/packages/vue-icon/src/clear-filter/index.ts similarity index 100% rename from packages/icon/clear-filter/index.js rename to packages/vue-icon/src/clear-filter/index.ts diff --git a/packages/icon/clock-work/index.js b/packages/vue-icon/src/clock-work/index.ts similarity index 100% rename from packages/icon/clock-work/index.js rename to packages/vue-icon/src/clock-work/index.ts diff --git a/packages/icon/close-circle/index.js b/packages/vue-icon/src/close-circle/index.ts similarity index 100% rename from packages/icon/close-circle/index.js rename to packages/vue-icon/src/close-circle/index.ts diff --git a/packages/icon/close-square/index.js b/packages/vue-icon/src/close-square/index.ts similarity index 100% rename from packages/icon/close-square/index.js rename to packages/vue-icon/src/close-square/index.ts diff --git a/packages/icon/close/index.js b/packages/vue-icon/src/close/index.ts similarity index 100% rename from packages/icon/close/index.js rename to packages/vue-icon/src/close/index.ts diff --git a/packages/icon/cloud-download/index.js b/packages/vue-icon/src/cloud-download/index.ts similarity index 100% rename from packages/icon/cloud-download/index.js rename to packages/vue-icon/src/cloud-download/index.ts diff --git a/packages/icon/cloud-upload/index.js b/packages/vue-icon/src/cloud-upload/index.ts similarity index 100% rename from packages/icon/cloud-upload/index.js rename to packages/vue-icon/src/cloud-upload/index.ts diff --git a/packages/icon/code/index.js b/packages/vue-icon/src/code/index.ts similarity index 100% rename from packages/icon/code/index.js rename to packages/vue-icon/src/code/index.ts diff --git a/packages/icon/coin/index.js b/packages/vue-icon/src/coin/index.ts similarity index 100% rename from packages/icon/coin/index.js rename to packages/vue-icon/src/coin/index.ts diff --git a/packages/icon/col-reverse/index.js b/packages/vue-icon/src/col-reverse/index.ts similarity index 100% rename from packages/icon/col-reverse/index.js rename to packages/vue-icon/src/col-reverse/index.ts diff --git a/packages/icon/commission/index.js b/packages/vue-icon/src/commission/index.ts similarity index 100% rename from packages/icon/commission/index.js rename to packages/vue-icon/src/commission/index.ts diff --git a/packages/icon/conment-refresh/index.js b/packages/vue-icon/src/conment-refresh/index.ts similarity index 100% rename from packages/icon/conment-refresh/index.js rename to packages/vue-icon/src/conment-refresh/index.ts diff --git a/packages/icon/copy-solid/index.js b/packages/vue-icon/src/copy-solid/index.ts similarity index 100% rename from packages/icon/copy-solid/index.js rename to packages/vue-icon/src/copy-solid/index.ts diff --git a/packages/icon/copy/index.js b/packages/vue-icon/src/copy/index.ts similarity index 100% rename from packages/icon/copy/index.js rename to packages/vue-icon/src/copy/index.ts diff --git a/packages/icon/course/index.js b/packages/vue-icon/src/course/index.ts similarity index 100% rename from packages/icon/course/index.js rename to packages/vue-icon/src/course/index.ts diff --git a/packages/icon/crop/index.js b/packages/vue-icon/src/crop/index.ts similarity index 100% rename from packages/icon/crop/index.js rename to packages/vue-icon/src/crop/index.ts diff --git a/packages/icon/cue-l/index.js b/packages/vue-icon/src/cue-l/index.ts similarity index 100% rename from packages/icon/cue-l/index.js rename to packages/vue-icon/src/cue-l/index.ts diff --git a/packages/icon/custom/index.js b/packages/vue-icon/src/custom/index.ts similarity index 100% rename from packages/icon/custom/index.js rename to packages/vue-icon/src/custom/index.ts diff --git a/packages/icon/customer-service/index.js b/packages/vue-icon/src/customer-service/index.ts similarity index 100% rename from packages/icon/customer-service/index.js rename to packages/vue-icon/src/customer-service/index.ts diff --git a/packages/icon/data-source/index.js b/packages/vue-icon/src/data-source/index.ts similarity index 100% rename from packages/icon/data-source/index.js rename to packages/vue-icon/src/data-source/index.ts diff --git a/packages/icon/default/index.js b/packages/vue-icon/src/default/index.ts similarity index 100% rename from packages/icon/default/index.js rename to packages/vue-icon/src/default/index.ts diff --git a/packages/icon/defined-filtration/index.js b/packages/vue-icon/src/defined-filtration/index.ts similarity index 100% rename from packages/icon/defined-filtration/index.js rename to packages/vue-icon/src/defined-filtration/index.ts diff --git a/packages/icon/del/index.js b/packages/vue-icon/src/del/index.ts similarity index 100% rename from packages/icon/del/index.js rename to packages/vue-icon/src/del/index.ts diff --git a/packages/icon/delete-page/index.js b/packages/vue-icon/src/delete-page/index.ts similarity index 100% rename from packages/icon/delete-page/index.js rename to packages/vue-icon/src/delete-page/index.ts diff --git a/packages/icon/deleted/index.js b/packages/vue-icon/src/deleted/index.ts similarity index 100% rename from packages/icon/deleted/index.js rename to packages/vue-icon/src/deleted/index.ts diff --git a/packages/icon/delta-down-o/index.js b/packages/vue-icon/src/delta-down-o/index.ts similarity index 100% rename from packages/icon/delta-down-o/index.js rename to packages/vue-icon/src/delta-down-o/index.ts diff --git a/packages/icon/delta-down/index.js b/packages/vue-icon/src/delta-down/index.ts similarity index 100% rename from packages/icon/delta-down/index.js rename to packages/vue-icon/src/delta-down/index.ts diff --git a/packages/icon/delta-left-o/index.js b/packages/vue-icon/src/delta-left-o/index.ts similarity index 100% rename from packages/icon/delta-left-o/index.js rename to packages/vue-icon/src/delta-left-o/index.ts diff --git a/packages/icon/delta-left/index.js b/packages/vue-icon/src/delta-left/index.ts similarity index 100% rename from packages/icon/delta-left/index.js rename to packages/vue-icon/src/delta-left/index.ts diff --git a/packages/icon/delta-right-o/index.js b/packages/vue-icon/src/delta-right-o/index.ts similarity index 100% rename from packages/icon/delta-right-o/index.js rename to packages/vue-icon/src/delta-right-o/index.ts diff --git a/packages/icon/delta-right/index.js b/packages/vue-icon/src/delta-right/index.ts similarity index 100% rename from packages/icon/delta-right/index.js rename to packages/vue-icon/src/delta-right/index.ts diff --git a/packages/icon/delta-up-o/index.js b/packages/vue-icon/src/delta-up-o/index.ts similarity index 100% rename from packages/icon/delta-up-o/index.js rename to packages/vue-icon/src/delta-up-o/index.ts diff --git a/packages/icon/delta-up/index.js b/packages/vue-icon/src/delta-up/index.ts similarity index 100% rename from packages/icon/delta-up/index.js rename to packages/vue-icon/src/delta-up/index.ts diff --git a/packages/icon/derive/index.js b/packages/vue-icon/src/derive/index.ts similarity index 100% rename from packages/icon/derive/index.js rename to packages/vue-icon/src/derive/index.ts diff --git a/packages/icon/descending/index.js b/packages/vue-icon/src/descending/index.ts similarity index 100% rename from packages/icon/descending/index.js rename to packages/vue-icon/src/descending/index.ts diff --git a/packages/icon/desktop-view/index.js b/packages/vue-icon/src/desktop-view/index.ts similarity index 100% rename from packages/icon/desktop-view/index.js rename to packages/vue-icon/src/desktop-view/index.ts diff --git a/packages/icon/dialog/index.js b/packages/vue-icon/src/dialog/index.ts similarity index 100% rename from packages/icon/dialog/index.js rename to packages/vue-icon/src/dialog/index.ts diff --git a/packages/icon/dialog2/index.js b/packages/vue-icon/src/dialog2/index.ts similarity index 100% rename from packages/icon/dialog2/index.js rename to packages/vue-icon/src/dialog2/index.ts diff --git a/packages/icon/direction-col/index.js b/packages/vue-icon/src/direction-col/index.ts similarity index 100% rename from packages/icon/direction-col/index.js rename to packages/vue-icon/src/direction-col/index.ts diff --git a/packages/icon/direction-row/index.js b/packages/vue-icon/src/direction-row/index.ts similarity index 100% rename from packages/icon/direction-row/index.js rename to packages/vue-icon/src/direction-row/index.ts diff --git a/packages/icon/dot-chart/index.js b/packages/vue-icon/src/dot-chart/index.ts similarity index 100% rename from packages/icon/dot-chart/index.js rename to packages/vue-icon/src/dot-chart/index.ts diff --git a/packages/vue-icon/src/dot-download/index.ts b/packages/vue-icon/src/dot-download/index.ts new file mode 100644 index 000000000..2dceac477 --- /dev/null +++ b/packages/vue-icon/src/dot-download/index.ts @@ -0,0 +1,15 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { svg } from '@opentiny/vue-common' +import DotDownload from '@opentiny/vue-theme/svgs/dot-download.svg' + +export default svg({ name: 'iconDotDownload', component: DotDownload }) diff --git a/packages/icon/dot-ipv4/index.js b/packages/vue-icon/src/dot-ipv4/index.ts similarity index 100% rename from packages/icon/dot-ipv4/index.js rename to packages/vue-icon/src/dot-ipv4/index.ts diff --git a/packages/icon/double-left/index.js b/packages/vue-icon/src/double-left/index.ts similarity index 100% rename from packages/icon/double-left/index.js rename to packages/vue-icon/src/double-left/index.ts diff --git a/packages/icon/double-right/index.js b/packages/vue-icon/src/double-right/index.ts similarity index 100% rename from packages/icon/double-right/index.js rename to packages/vue-icon/src/double-right/index.ts diff --git a/packages/icon/down-o/index.js b/packages/vue-icon/src/down-o/index.ts similarity index 100% rename from packages/icon/down-o/index.js rename to packages/vue-icon/src/down-o/index.ts diff --git a/packages/icon/down/index.js b/packages/vue-icon/src/down/index.ts similarity index 100% rename from packages/icon/down/index.js rename to packages/vue-icon/src/down/index.ts diff --git a/packages/icon/download-cloud/index.js b/packages/vue-icon/src/download-cloud/index.ts similarity index 100% rename from packages/icon/download-cloud/index.js rename to packages/vue-icon/src/download-cloud/index.ts diff --git a/packages/icon/download-link/index.js b/packages/vue-icon/src/download-link/index.ts similarity index 100% rename from packages/icon/download-link/index.js rename to packages/vue-icon/src/download-link/index.ts diff --git a/packages/icon/download/index.js b/packages/vue-icon/src/download/index.ts similarity index 100% rename from packages/icon/download/index.js rename to packages/vue-icon/src/download/index.ts diff --git a/packages/icon/draft/index.js b/packages/vue-icon/src/draft/index.ts similarity index 100% rename from packages/icon/draft/index.js rename to packages/vue-icon/src/draft/index.ts diff --git a/packages/icon/edit/index.js b/packages/vue-icon/src/edit/index.ts similarity index 100% rename from packages/icon/edit/index.js rename to packages/vue-icon/src/edit/index.ts diff --git a/packages/icon/editor-align-center/index.js b/packages/vue-icon/src/editor-align-center/index.ts similarity index 100% rename from packages/icon/editor-align-center/index.js rename to packages/vue-icon/src/editor-align-center/index.ts diff --git a/packages/icon/editor-align-left/index.js b/packages/vue-icon/src/editor-align-left/index.ts similarity index 100% rename from packages/icon/editor-align-left/index.js rename to packages/vue-icon/src/editor-align-left/index.ts diff --git a/packages/icon/editor-align-right/index.js b/packages/vue-icon/src/editor-align-right/index.ts similarity index 100% rename from packages/icon/editor-align-right/index.js rename to packages/vue-icon/src/editor-align-right/index.ts diff --git a/packages/icon/editor-background/index.js b/packages/vue-icon/src/editor-background/index.ts similarity index 100% rename from packages/icon/editor-background/index.js rename to packages/vue-icon/src/editor-background/index.ts diff --git a/packages/icon/editor-bold/index.js b/packages/vue-icon/src/editor-bold/index.ts similarity index 100% rename from packages/icon/editor-bold/index.js rename to packages/vue-icon/src/editor-bold/index.ts diff --git a/packages/icon/editor-code/index.js b/packages/vue-icon/src/editor-code/index.ts similarity index 100% rename from packages/icon/editor-code/index.js rename to packages/vue-icon/src/editor-code/index.ts diff --git a/packages/icon/editor-deleteline/index.js b/packages/vue-icon/src/editor-deleteline/index.ts similarity index 100% rename from packages/icon/editor-deleteline/index.js rename to packages/vue-icon/src/editor-deleteline/index.ts diff --git a/packages/icon/editor-eraser/index.js b/packages/vue-icon/src/editor-eraser/index.ts similarity index 100% rename from packages/icon/editor-eraser/index.js rename to packages/vue-icon/src/editor-eraser/index.ts diff --git a/packages/icon/editor-italic/index.js b/packages/vue-icon/src/editor-italic/index.ts similarity index 100% rename from packages/icon/editor-italic/index.js rename to packages/vue-icon/src/editor-italic/index.ts diff --git a/packages/icon/editor-left-border/index.js b/packages/vue-icon/src/editor-left-border/index.ts similarity index 100% rename from packages/icon/editor-left-border/index.js rename to packages/vue-icon/src/editor-left-border/index.ts diff --git a/packages/icon/editor-list-dot/index.js b/packages/vue-icon/src/editor-list-dot/index.ts similarity index 100% rename from packages/icon/editor-list-dot/index.js rename to packages/vue-icon/src/editor-list-dot/index.ts diff --git a/packages/icon/editor-list-num/index.js b/packages/vue-icon/src/editor-list-num/index.ts similarity index 100% rename from packages/icon/editor-list-num/index.js rename to packages/vue-icon/src/editor-list-num/index.ts diff --git a/packages/icon/editor-list/index.js b/packages/vue-icon/src/editor-list/index.ts similarity index 100% rename from packages/icon/editor-list/index.js rename to packages/vue-icon/src/editor-list/index.ts diff --git a/packages/icon/editor-menu-left/index.js b/packages/vue-icon/src/editor-menu-left/index.ts similarity index 100% rename from packages/icon/editor-menu-left/index.js rename to packages/vue-icon/src/editor-menu-left/index.ts diff --git a/packages/icon/editor-menu-right/index.js b/packages/vue-icon/src/editor-menu-right/index.ts similarity index 100% rename from packages/icon/editor-menu-right/index.js rename to packages/vue-icon/src/editor-menu-right/index.ts diff --git a/packages/icon/editor-quote/index.js b/packages/vue-icon/src/editor-quote/index.ts similarity index 100% rename from packages/icon/editor-quote/index.js rename to packages/vue-icon/src/editor-quote/index.ts diff --git a/packages/icon/editor-redo/index.js b/packages/vue-icon/src/editor-redo/index.ts similarity index 100% rename from packages/icon/editor-redo/index.js rename to packages/vue-icon/src/editor-redo/index.ts diff --git a/packages/icon/editor-right-border/index.js b/packages/vue-icon/src/editor-right-border/index.ts similarity index 100% rename from packages/icon/editor-right-border/index.js rename to packages/vue-icon/src/editor-right-border/index.ts diff --git a/packages/icon/editor-sub/index.js b/packages/vue-icon/src/editor-sub/index.ts similarity index 100% rename from packages/icon/editor-sub/index.js rename to packages/vue-icon/src/editor-sub/index.ts diff --git a/packages/icon/editor-subtitle/index.js b/packages/vue-icon/src/editor-subtitle/index.ts similarity index 100% rename from packages/icon/editor-subtitle/index.js rename to packages/vue-icon/src/editor-subtitle/index.ts diff --git a/packages/icon/editor-super/index.js b/packages/vue-icon/src/editor-super/index.ts similarity index 100% rename from packages/icon/editor-super/index.js rename to packages/vue-icon/src/editor-super/index.ts diff --git a/packages/icon/editor-tab/index.js b/packages/vue-icon/src/editor-tab/index.ts similarity index 100% rename from packages/icon/editor-tab/index.js rename to packages/vue-icon/src/editor-tab/index.ts diff --git a/packages/icon/editor-table/index.js b/packages/vue-icon/src/editor-table/index.ts similarity index 100% rename from packages/icon/editor-table/index.js rename to packages/vue-icon/src/editor-table/index.ts diff --git a/packages/icon/editor-textcolor/index.js b/packages/vue-icon/src/editor-textcolor/index.ts similarity index 100% rename from packages/icon/editor-textcolor/index.js rename to packages/vue-icon/src/editor-textcolor/index.ts diff --git a/packages/icon/editor-title/index.js b/packages/vue-icon/src/editor-title/index.ts similarity index 100% rename from packages/icon/editor-title/index.js rename to packages/vue-icon/src/editor-title/index.ts diff --git a/packages/icon/editor-underline/index.js b/packages/vue-icon/src/editor-underline/index.ts similarity index 100% rename from packages/icon/editor-underline/index.js rename to packages/vue-icon/src/editor-underline/index.ts diff --git a/packages/icon/editor-undo/index.js b/packages/vue-icon/src/editor-undo/index.ts similarity index 100% rename from packages/icon/editor-undo/index.js rename to packages/vue-icon/src/editor-undo/index.ts diff --git a/packages/icon/editor-video/index.js b/packages/vue-icon/src/editor-video/index.ts similarity index 100% rename from packages/icon/editor-video/index.js rename to packages/vue-icon/src/editor-video/index.ts diff --git a/packages/icon/ellipsis/index.js b/packages/vue-icon/src/ellipsis/index.ts similarity index 100% rename from packages/icon/ellipsis/index.js rename to packages/vue-icon/src/ellipsis/index.ts diff --git a/packages/icon/email-add/index.js b/packages/vue-icon/src/email-add/index.ts similarity index 100% rename from packages/icon/email-add/index.js rename to packages/vue-icon/src/email-add/index.ts diff --git a/packages/icon/email-circle/index.js b/packages/vue-icon/src/email-circle/index.ts similarity index 100% rename from packages/icon/email-circle/index.js rename to packages/vue-icon/src/email-circle/index.ts diff --git a/packages/icon/end/index.js b/packages/vue-icon/src/end/index.ts similarity index 100% rename from packages/icon/end/index.js rename to packages/vue-icon/src/end/index.ts diff --git a/packages/icon/error/index.js b/packages/vue-icon/src/error/index.ts similarity index 100% rename from packages/icon/error/index.js rename to packages/vue-icon/src/error/index.ts diff --git a/packages/icon/espace-auto/index.js b/packages/vue-icon/src/espace-auto/index.ts similarity index 100% rename from packages/icon/espace-auto/index.js rename to packages/vue-icon/src/espace-auto/index.ts diff --git a/packages/icon/espace/index.js b/packages/vue-icon/src/espace/index.ts similarity index 100% rename from packages/icon/espace/index.js rename to packages/vue-icon/src/espace/index.ts diff --git a/packages/icon/excel/index.js b/packages/vue-icon/src/excel/index.ts similarity index 100% rename from packages/icon/excel/index.js rename to packages/vue-icon/src/excel/index.ts diff --git a/packages/icon/exception/index.js b/packages/vue-icon/src/exception/index.ts similarity index 100% rename from packages/icon/exception/index.js rename to packages/vue-icon/src/exception/index.ts diff --git a/packages/icon/exclamation/index.js b/packages/vue-icon/src/exclamation/index.ts similarity index 100% rename from packages/icon/exclamation/index.js rename to packages/vue-icon/src/exclamation/index.ts diff --git a/packages/icon/export/index.js b/packages/vue-icon/src/export/index.ts similarity index 100% rename from packages/icon/export/index.js rename to packages/vue-icon/src/export/index.ts diff --git a/packages/icon/express-search/index.js b/packages/vue-icon/src/express-search/index.ts similarity index 100% rename from packages/icon/express-search/index.js rename to packages/vue-icon/src/express-search/index.ts diff --git a/packages/icon/eyeclose/index.js b/packages/vue-icon/src/eyeclose/index.ts similarity index 100% rename from packages/icon/eyeclose/index.js rename to packages/vue-icon/src/eyeclose/index.ts diff --git a/packages/icon/eyeopen/index.js b/packages/vue-icon/src/eyeopen/index.ts similarity index 100% rename from packages/icon/eyeopen/index.js rename to packages/vue-icon/src/eyeopen/index.ts diff --git a/packages/icon/file-cloudupload/index.js b/packages/vue-icon/src/file-cloudupload/index.ts similarity index 100% rename from packages/icon/file-cloudupload/index.js rename to packages/vue-icon/src/file-cloudupload/index.ts diff --git a/packages/icon/file-excel/index.js b/packages/vue-icon/src/file-excel/index.ts similarity index 100% rename from packages/icon/file-excel/index.js rename to packages/vue-icon/src/file-excel/index.ts diff --git a/packages/icon/file/index.js b/packages/vue-icon/src/file/index.ts similarity index 100% rename from packages/icon/file/index.js rename to packages/vue-icon/src/file/index.ts diff --git a/packages/icon/files-circle/index.js b/packages/vue-icon/src/files-circle/index.ts similarity index 100% rename from packages/icon/files-circle/index.js rename to packages/vue-icon/src/files-circle/index.ts diff --git a/packages/icon/files/index.js b/packages/vue-icon/src/files/index.ts similarity index 100% rename from packages/icon/files/index.js rename to packages/vue-icon/src/files/index.ts diff --git a/packages/icon/filetext/index.js b/packages/vue-icon/src/filetext/index.ts similarity index 100% rename from packages/icon/filetext/index.js rename to packages/vue-icon/src/filetext/index.ts diff --git a/packages/icon/fileupload/index.js b/packages/vue-icon/src/fileupload/index.ts similarity index 100% rename from packages/icon/fileupload/index.js rename to packages/vue-icon/src/fileupload/index.ts diff --git a/packages/icon/filtered/index.js b/packages/vue-icon/src/filtered/index.ts similarity index 100% rename from packages/icon/filtered/index.js rename to packages/vue-icon/src/filtered/index.ts diff --git a/packages/icon/flag/index.js b/packages/vue-icon/src/flag/index.ts similarity index 100% rename from packages/icon/flag/index.js rename to packages/vue-icon/src/flag/index.ts diff --git a/packages/icon/folder-closed/index.js b/packages/vue-icon/src/folder-closed/index.ts similarity index 100% rename from packages/icon/folder-closed/index.js rename to packages/vue-icon/src/folder-closed/index.ts diff --git a/packages/icon/folder-opened/index.js b/packages/vue-icon/src/folder-opened/index.ts similarity index 100% rename from packages/icon/folder-opened/index.js rename to packages/vue-icon/src/folder-opened/index.ts diff --git a/packages/icon/font-color/index.js b/packages/vue-icon/src/font-color/index.ts similarity index 100% rename from packages/icon/font-color/index.js rename to packages/vue-icon/src/font-color/index.ts diff --git a/packages/icon/font-family/index.js b/packages/vue-icon/src/font-family/index.ts similarity index 100% rename from packages/icon/font-family/index.js rename to packages/vue-icon/src/font-family/index.ts diff --git a/packages/icon/font-size/index.js b/packages/vue-icon/src/font-size/index.ts similarity index 100% rename from packages/icon/font-size/index.js rename to packages/vue-icon/src/font-size/index.ts diff --git a/packages/icon/font-style/index.js b/packages/vue-icon/src/font-style/index.ts similarity index 100% rename from packages/icon/font-style/index.js rename to packages/vue-icon/src/font-style/index.ts diff --git a/packages/icon/font-weight/index.js b/packages/vue-icon/src/font-weight/index.ts similarity index 100% rename from packages/icon/font-weight/index.js rename to packages/vue-icon/src/font-weight/index.ts diff --git a/packages/icon/freeze-left/index.js b/packages/vue-icon/src/freeze-left/index.ts similarity index 100% rename from packages/icon/freeze-left/index.js rename to packages/vue-icon/src/freeze-left/index.ts diff --git a/packages/icon/freeze-right/index.js b/packages/vue-icon/src/freeze-right/index.ts similarity index 100% rename from packages/icon/freeze-right/index.js rename to packages/vue-icon/src/freeze-right/index.ts diff --git a/packages/icon/frown-o/index.js b/packages/vue-icon/src/frown-o/index.ts similarity index 100% rename from packages/icon/frown-o/index.js rename to packages/vue-icon/src/frown-o/index.ts diff --git a/packages/icon/frown/index.js b/packages/vue-icon/src/frown/index.ts similarity index 100% rename from packages/icon/frown/index.js rename to packages/vue-icon/src/frown/index.ts diff --git a/packages/icon/fullscreen-left/index.js b/packages/vue-icon/src/fullscreen-left/index.ts similarity index 100% rename from packages/icon/fullscreen-left/index.js rename to packages/vue-icon/src/fullscreen-left/index.ts diff --git a/packages/icon/fullscreen/index.js b/packages/vue-icon/src/fullscreen/index.ts similarity index 100% rename from packages/icon/fullscreen/index.js rename to packages/vue-icon/src/fullscreen/index.ts diff --git a/packages/icon/grade/index.js b/packages/vue-icon/src/grade/index.ts similarity index 100% rename from packages/icon/grade/index.js rename to packages/vue-icon/src/grade/index.ts diff --git a/packages/icon/group-transfer/index.js b/packages/vue-icon/src/group-transfer/index.ts similarity index 100% rename from packages/icon/group-transfer/index.js rename to packages/vue-icon/src/group-transfer/index.ts diff --git a/packages/icon/group/index.js b/packages/vue-icon/src/group/index.ts similarity index 100% rename from packages/icon/group/index.js rename to packages/vue-icon/src/group/index.ts diff --git a/packages/icon/halfchecked/index.js b/packages/vue-icon/src/halfchecked/index.ts similarity index 100% rename from packages/icon/halfchecked/index.js rename to packages/vue-icon/src/halfchecked/index.ts diff --git a/packages/icon/halfselect/index.js b/packages/vue-icon/src/halfselect/index.ts similarity index 100% rename from packages/icon/halfselect/index.js rename to packages/vue-icon/src/halfselect/index.ts diff --git a/packages/icon/heartempty/index.js b/packages/vue-icon/src/heartempty/index.ts similarity index 100% rename from packages/icon/heartempty/index.js rename to packages/vue-icon/src/heartempty/index.ts diff --git a/packages/icon/help-circle/index.js b/packages/vue-icon/src/help-circle/index.ts similarity index 100% rename from packages/icon/help-circle/index.js rename to packages/vue-icon/src/help-circle/index.ts diff --git a/packages/icon/help-query/index.js b/packages/vue-icon/src/help-query/index.ts similarity index 100% rename from packages/icon/help-query/index.js rename to packages/vue-icon/src/help-query/index.ts diff --git a/packages/icon/help-solid/index.js b/packages/vue-icon/src/help-solid/index.ts similarity index 100% rename from packages/icon/help-solid/index.js rename to packages/vue-icon/src/help-solid/index.ts diff --git a/packages/icon/help/index.js b/packages/vue-icon/src/help/index.ts similarity index 100% rename from packages/icon/help/index.js rename to packages/vue-icon/src/help/index.ts diff --git a/packages/icon/helpful/index.js b/packages/vue-icon/src/helpful/index.ts similarity index 100% rename from packages/icon/helpful/index.js rename to packages/vue-icon/src/helpful/index.ts diff --git a/packages/icon/hide-left/index.js b/packages/vue-icon/src/hide-left/index.ts similarity index 100% rename from packages/icon/hide-left/index.js rename to packages/vue-icon/src/hide-left/index.ts diff --git a/packages/icon/hide-right/index.js b/packages/vue-icon/src/hide-right/index.ts similarity index 100% rename from packages/icon/hide-right/index.js rename to packages/vue-icon/src/hide-right/index.ts diff --git a/packages/icon/hide-topleft/index.js b/packages/vue-icon/src/hide-topleft/index.ts similarity index 100% rename from packages/icon/hide-topleft/index.js rename to packages/vue-icon/src/hide-topleft/index.ts diff --git a/packages/icon/import/index.js b/packages/vue-icon/src/import/index.ts similarity index 100% rename from packages/icon/import/index.js rename to packages/vue-icon/src/import/index.ts diff --git a/packages/icon/info-circle/index.js b/packages/vue-icon/src/info-circle/index.ts similarity index 100% rename from packages/icon/info-circle/index.js rename to packages/vue-icon/src/info-circle/index.ts diff --git a/packages/icon/info-solid/index.js b/packages/vue-icon/src/info-solid/index.ts similarity index 100% rename from packages/icon/info-solid/index.js rename to packages/vue-icon/src/info-solid/index.ts diff --git a/packages/icon/info/index.js b/packages/vue-icon/src/info/index.ts similarity index 100% rename from packages/icon/info/index.js rename to packages/vue-icon/src/info/index.ts diff --git a/packages/icon/information/index.js b/packages/vue-icon/src/information/index.ts similarity index 100% rename from packages/icon/information/index.js rename to packages/vue-icon/src/information/index.ts diff --git a/packages/icon/js/index.js b/packages/vue-icon/src/js/index.ts similarity index 100% rename from packages/icon/js/index.js rename to packages/vue-icon/src/js/index.ts diff --git a/packages/icon/jusitfy-center/index.js b/packages/vue-icon/src/jusitfy-center/index.ts similarity index 100% rename from packages/icon/jusitfy-center/index.js rename to packages/vue-icon/src/jusitfy-center/index.ts diff --git a/packages/icon/jusitfy-flex-end/index.js b/packages/vue-icon/src/jusitfy-flex-end/index.ts similarity index 100% rename from packages/icon/jusitfy-flex-end/index.js rename to packages/vue-icon/src/jusitfy-flex-end/index.ts diff --git a/packages/icon/jusitfy-space-around/index.js b/packages/vue-icon/src/jusitfy-space-around/index.ts similarity index 100% rename from packages/icon/jusitfy-space-around/index.js rename to packages/vue-icon/src/jusitfy-space-around/index.ts diff --git a/packages/icon/jusitfy-space-between/index.js b/packages/vue-icon/src/jusitfy-space-between/index.ts similarity index 100% rename from packages/icon/jusitfy-space-between/index.js rename to packages/vue-icon/src/jusitfy-space-between/index.ts diff --git a/packages/icon/justitfy-flex-start/index.js b/packages/vue-icon/src/justitfy-flex-start/index.ts similarity index 100% rename from packages/icon/justitfy-flex-start/index.js rename to packages/vue-icon/src/justitfy-flex-start/index.ts diff --git a/packages/icon/language/index.js b/packages/vue-icon/src/language/index.ts similarity index 100% rename from packages/icon/language/index.js rename to packages/vue-icon/src/language/index.ts diff --git a/packages/icon/leave/index.js b/packages/vue-icon/src/leave/index.ts similarity index 100% rename from packages/icon/leave/index.js rename to packages/vue-icon/src/leave/index.ts diff --git a/packages/icon/left-frozen/index.js b/packages/vue-icon/src/left-frozen/index.ts similarity index 100% rename from packages/icon/left-frozen/index.js rename to packages/vue-icon/src/left-frozen/index.ts diff --git a/packages/icon/left-o/index.js b/packages/vue-icon/src/left-o/index.ts similarity index 100% rename from packages/icon/left-o/index.js rename to packages/vue-icon/src/left-o/index.ts diff --git a/packages/icon/left-ward/index.js b/packages/vue-icon/src/left-ward/index.ts similarity index 100% rename from packages/icon/left-ward/index.js rename to packages/vue-icon/src/left-ward/index.ts diff --git a/packages/icon/left/index.js b/packages/vue-icon/src/left/index.ts similarity index 100% rename from packages/icon/left/index.js rename to packages/vue-icon/src/left/index.ts diff --git a/packages/icon/line-chart/index.js b/packages/vue-icon/src/line-chart/index.ts similarity index 100% rename from packages/icon/line-chart/index.js rename to packages/vue-icon/src/line-chart/index.ts diff --git a/packages/icon/line-height/index.js b/packages/vue-icon/src/line-height/index.ts similarity index 100% rename from packages/icon/line-height/index.js rename to packages/vue-icon/src/line-height/index.ts diff --git a/packages/icon/line-throught/index.js b/packages/vue-icon/src/line-throught/index.ts similarity index 100% rename from packages/icon/line-throught/index.js rename to packages/vue-icon/src/line-throught/index.ts diff --git a/packages/icon/link/index.js b/packages/vue-icon/src/link/index.ts similarity index 100% rename from packages/icon/link/index.js rename to packages/vue-icon/src/link/index.ts diff --git a/packages/icon/loading/index.js b/packages/vue-icon/src/loading/index.ts similarity index 100% rename from packages/icon/loading/index.js rename to packages/vue-icon/src/loading/index.ts diff --git a/packages/icon/lock/index.js b/packages/vue-icon/src/lock/index.ts similarity index 100% rename from packages/icon/lock/index.js rename to packages/vue-icon/src/lock/index.ts diff --git a/packages/icon/mail-content/index.js b/packages/vue-icon/src/mail-content/index.ts similarity index 100% rename from packages/icon/mail-content/index.js rename to packages/vue-icon/src/mail-content/index.ts diff --git a/packages/icon/mail/index.js b/packages/vue-icon/src/mail/index.ts similarity index 100% rename from packages/icon/mail/index.js rename to packages/vue-icon/src/mail/index.ts diff --git a/packages/icon/male/index.js b/packages/vue-icon/src/male/index.ts similarity index 100% rename from packages/icon/male/index.js rename to packages/vue-icon/src/male/index.ts diff --git a/packages/icon/mark-on/index.js b/packages/vue-icon/src/mark-on/index.ts similarity index 100% rename from packages/icon/mark-on/index.js rename to packages/vue-icon/src/mark-on/index.ts diff --git a/packages/icon/meh/index.js b/packages/vue-icon/src/meh/index.ts similarity index 100% rename from packages/icon/meh/index.js rename to packages/vue-icon/src/meh/index.ts diff --git a/packages/icon/message-circle/index.js b/packages/vue-icon/src/message-circle/index.ts similarity index 100% rename from packages/icon/message-circle/index.js rename to packages/vue-icon/src/message-circle/index.ts diff --git a/packages/icon/minscreen-left/index.js b/packages/vue-icon/src/minscreen-left/index.ts similarity index 100% rename from packages/icon/minscreen-left/index.js rename to packages/vue-icon/src/minscreen-left/index.ts diff --git a/packages/icon/minscreen/index.js b/packages/vue-icon/src/minscreen/index.ts similarity index 100% rename from packages/icon/minscreen/index.js rename to packages/vue-icon/src/minscreen/index.ts diff --git a/packages/icon/minus-circle/index.js b/packages/vue-icon/src/minus-circle/index.ts similarity index 100% rename from packages/icon/minus-circle/index.js rename to packages/vue-icon/src/minus-circle/index.ts diff --git a/packages/icon/minus-square/index.js b/packages/vue-icon/src/minus-square/index.ts similarity index 100% rename from packages/icon/minus-square/index.js rename to packages/vue-icon/src/minus-square/index.ts diff --git a/packages/icon/minus/index.js b/packages/vue-icon/src/minus/index.ts similarity index 100% rename from packages/icon/minus/index.js rename to packages/vue-icon/src/minus/index.ts diff --git a/packages/icon/mobile-view/index.js b/packages/vue-icon/src/mobile-view/index.ts similarity index 100% rename from packages/icon/mobile-view/index.js rename to packages/vue-icon/src/mobile-view/index.ts diff --git a/packages/icon/mobile/index.js b/packages/vue-icon/src/mobile/index.ts similarity index 100% rename from packages/icon/mobile/index.js rename to packages/vue-icon/src/mobile/index.ts diff --git a/packages/icon/more/index.js b/packages/vue-icon/src/more/index.ts similarity index 100% rename from packages/icon/more/index.js rename to packages/vue-icon/src/more/index.ts diff --git a/packages/icon/new/index.js b/packages/vue-icon/src/new/index.ts similarity index 100% rename from packages/icon/new/index.js rename to packages/vue-icon/src/new/index.ts diff --git a/packages/icon/no-premission/index.js b/packages/vue-icon/src/no-premission/index.ts similarity index 100% rename from packages/icon/no-premission/index.js rename to packages/vue-icon/src/no-premission/index.ts diff --git a/packages/icon/node-open/index.js b/packages/vue-icon/src/node-open/index.ts similarity index 100% rename from packages/icon/node-open/index.js rename to packages/vue-icon/src/node-open/index.ts diff --git a/packages/icon/node/index.js b/packages/vue-icon/src/node/index.ts similarity index 100% rename from packages/icon/node/index.js rename to packages/vue-icon/src/node/index.ts diff --git a/packages/icon/nodejs/index.js b/packages/vue-icon/src/nodejs/index.ts similarity index 100% rename from packages/icon/nodejs/index.js rename to packages/vue-icon/src/nodejs/index.ts diff --git a/packages/icon/none/index.js b/packages/vue-icon/src/none/index.ts similarity index 100% rename from packages/icon/none/index.js rename to packages/vue-icon/src/none/index.ts diff --git a/packages/icon/off-line/index.js b/packages/vue-icon/src/off-line/index.ts similarity index 100% rename from packages/icon/off-line/index.js rename to packages/vue-icon/src/off-line/index.ts diff --git a/packages/icon/on-line/index.js b/packages/vue-icon/src/on-line/index.ts similarity index 100% rename from packages/icon/on-line/index.js rename to packages/vue-icon/src/on-line/index.ts diff --git a/packages/icon/operationfaild-l/index.js b/packages/vue-icon/src/operationfaild-l/index.ts similarity index 100% rename from packages/icon/operationfaild-l/index.js rename to packages/vue-icon/src/operationfaild-l/index.ts diff --git a/packages/icon/operationfaild/index.js b/packages/vue-icon/src/operationfaild/index.ts similarity index 100% rename from packages/icon/operationfaild/index.js rename to packages/vue-icon/src/operationfaild/index.ts diff --git a/packages/icon/outer-link/index.js b/packages/vue-icon/src/outer-link/index.ts similarity index 100% rename from packages/icon/outer-link/index.js rename to packages/vue-icon/src/outer-link/index.ts diff --git a/packages/icon/pagelink/index.js b/packages/vue-icon/src/pagelink/index.ts similarity index 100% rename from packages/icon/pagelink/index.js rename to packages/vue-icon/src/pagelink/index.ts diff --git a/packages/icon/pager-first/index.js b/packages/vue-icon/src/pager-first/index.ts similarity index 100% rename from packages/icon/pager-first/index.js rename to packages/vue-icon/src/pager-first/index.ts diff --git a/packages/icon/pager-last/index.js b/packages/vue-icon/src/pager-last/index.ts similarity index 100% rename from packages/icon/pager-last/index.js rename to packages/vue-icon/src/pager-last/index.ts diff --git a/packages/icon/pager-next/index.js b/packages/vue-icon/src/pager-next/index.ts similarity index 100% rename from packages/icon/pager-next/index.js rename to packages/vue-icon/src/pager-next/index.ts diff --git a/packages/icon/pager-prev/index.js b/packages/vue-icon/src/pager-prev/index.ts similarity index 100% rename from packages/icon/pager-prev/index.js rename to packages/vue-icon/src/pager-prev/index.ts diff --git a/packages/icon/panel-max/index.js b/packages/vue-icon/src/panel-max/index.ts similarity index 100% rename from packages/icon/panel-max/index.js rename to packages/vue-icon/src/panel-max/index.ts diff --git a/packages/icon/panel-mini/index.js b/packages/vue-icon/src/panel-mini/index.ts similarity index 100% rename from packages/icon/panel-mini/index.js rename to packages/vue-icon/src/panel-mini/index.ts diff --git a/packages/icon/panel-normal/index.js b/packages/vue-icon/src/panel-normal/index.ts similarity index 100% rename from packages/icon/panel-normal/index.js rename to packages/vue-icon/src/panel-normal/index.ts diff --git a/packages/icon/pause-circle/index.js b/packages/vue-icon/src/pause-circle/index.ts similarity index 100% rename from packages/icon/pause-circle/index.js rename to packages/vue-icon/src/pause-circle/index.ts diff --git a/packages/icon/pause/index.js b/packages/vue-icon/src/pause/index.ts similarity index 100% rename from packages/icon/pause/index.js rename to packages/vue-icon/src/pause/index.ts diff --git a/packages/icon/picture/index.js b/packages/vue-icon/src/picture/index.ts similarity index 100% rename from packages/icon/picture/index.js rename to packages/vue-icon/src/picture/index.ts diff --git a/packages/icon/pie-chart/index.js b/packages/vue-icon/src/pie-chart/index.ts similarity index 100% rename from packages/icon/pie-chart/index.js rename to packages/vue-icon/src/pie-chart/index.ts diff --git a/packages/icon/plus-circle/index.js b/packages/vue-icon/src/plus-circle/index.ts similarity index 100% rename from packages/icon/plus-circle/index.js rename to packages/vue-icon/src/plus-circle/index.ts diff --git a/packages/icon/plus-square/index.js b/packages/vue-icon/src/plus-square/index.ts similarity index 100% rename from packages/icon/plus-square/index.js rename to packages/vue-icon/src/plus-square/index.ts diff --git a/packages/icon/plus/index.js b/packages/vue-icon/src/plus/index.ts similarity index 100% rename from packages/icon/plus/index.js rename to packages/vue-icon/src/plus/index.ts diff --git a/packages/icon/popup/index.js b/packages/vue-icon/src/popup/index.ts similarity index 100% rename from packages/icon/popup/index.js rename to packages/vue-icon/src/popup/index.ts diff --git a/packages/icon/pre-checked/index.js b/packages/vue-icon/src/pre-checked/index.ts similarity index 100% rename from packages/icon/pre-checked/index.js rename to packages/vue-icon/src/pre-checked/index.ts diff --git a/packages/icon/print-preview/index.js b/packages/vue-icon/src/print-preview/index.ts similarity index 100% rename from packages/icon/print-preview/index.js rename to packages/vue-icon/src/print-preview/index.ts diff --git a/packages/icon/pushpin/index.js b/packages/vue-icon/src/pushpin/index.ts similarity index 100% rename from packages/icon/pushpin/index.js rename to packages/vue-icon/src/pushpin/index.ts diff --git a/packages/icon/radio/index.js b/packages/vue-icon/src/radio/index.ts similarity index 100% rename from packages/icon/radio/index.js rename to packages/vue-icon/src/radio/index.ts diff --git a/packages/icon/radioselected/index.js b/packages/vue-icon/src/radioselected/index.ts similarity index 100% rename from packages/icon/radioselected/index.js rename to packages/vue-icon/src/radioselected/index.ts diff --git a/packages/icon/reactjs/index.js b/packages/vue-icon/src/reactjs/index.ts similarity index 100% rename from packages/icon/reactjs/index.js rename to packages/vue-icon/src/reactjs/index.ts diff --git a/packages/icon/redo/index.js b/packages/vue-icon/src/redo/index.ts similarity index 100% rename from packages/icon/redo/index.js rename to packages/vue-icon/src/redo/index.ts diff --git a/packages/icon/refres/index.js b/packages/vue-icon/src/refres/index.ts similarity index 100% rename from packages/icon/refres/index.js rename to packages/vue-icon/src/refres/index.ts diff --git a/packages/icon/renew/index.js b/packages/vue-icon/src/renew/index.ts similarity index 100% rename from packages/icon/renew/index.js rename to packages/vue-icon/src/renew/index.ts diff --git a/packages/icon/repeat/index.js b/packages/vue-icon/src/repeat/index.ts similarity index 100% rename from packages/icon/repeat/index.js rename to packages/vue-icon/src/repeat/index.ts diff --git a/packages/icon/replace/index.js b/packages/vue-icon/src/replace/index.ts similarity index 100% rename from packages/icon/replace/index.js rename to packages/vue-icon/src/replace/index.ts diff --git a/packages/icon/replies/index.js b/packages/vue-icon/src/replies/index.ts similarity index 100% rename from packages/icon/replies/index.js rename to packages/vue-icon/src/replies/index.ts diff --git a/packages/icon/right-frozen/index.js b/packages/vue-icon/src/right-frozen/index.ts similarity index 100% rename from packages/icon/right-frozen/index.js rename to packages/vue-icon/src/right-frozen/index.ts diff --git a/packages/icon/right-o/index.js b/packages/vue-icon/src/right-o/index.ts similarity index 100% rename from packages/icon/right-o/index.js rename to packages/vue-icon/src/right-o/index.ts diff --git a/packages/icon/right/index.js b/packages/vue-icon/src/right/index.ts similarity index 100% rename from packages/icon/right/index.js rename to packages/vue-icon/src/right/index.ts diff --git a/packages/icon/rightward/index.js b/packages/vue-icon/src/rightward/index.ts similarity index 100% rename from packages/icon/rightward/index.js rename to packages/vue-icon/src/rightward/index.ts diff --git a/packages/icon/row-reverse/index.js b/packages/vue-icon/src/row-reverse/index.ts similarity index 100% rename from packages/icon/row-reverse/index.js rename to packages/vue-icon/src/row-reverse/index.ts diff --git a/packages/icon/sandwich-collapse/index.js b/packages/vue-icon/src/sandwich-collapse/index.ts similarity index 100% rename from packages/icon/sandwich-collapse/index.js rename to packages/vue-icon/src/sandwich-collapse/index.ts diff --git a/packages/icon/sandwich-expand/index.js b/packages/vue-icon/src/sandwich-expand/index.ts similarity index 100% rename from packages/icon/sandwich-expand/index.js rename to packages/vue-icon/src/sandwich-expand/index.ts diff --git a/packages/icon/save/index.js b/packages/vue-icon/src/save/index.ts similarity index 100% rename from packages/icon/save/index.js rename to packages/vue-icon/src/save/index.ts diff --git a/packages/icon/scissor/index.js b/packages/vue-icon/src/scissor/index.ts similarity index 100% rename from packages/icon/scissor/index.js rename to packages/vue-icon/src/scissor/index.ts diff --git a/packages/icon/search/index.js b/packages/vue-icon/src/search/index.ts similarity index 100% rename from packages/icon/search/index.js rename to packages/vue-icon/src/search/index.ts diff --git a/packages/icon/select/index.js b/packages/vue-icon/src/select/index.ts similarity index 100% rename from packages/icon/select/index.js rename to packages/vue-icon/src/select/index.ts diff --git a/packages/icon/sent/index.js b/packages/vue-icon/src/sent/index.ts similarity index 100% rename from packages/icon/sent/index.js rename to packages/vue-icon/src/sent/index.ts diff --git a/packages/icon/separate/index.js b/packages/vue-icon/src/separate/index.ts similarity index 100% rename from packages/icon/separate/index.js rename to packages/vue-icon/src/separate/index.ts diff --git a/packages/icon/setting/index.js b/packages/vue-icon/src/setting/index.ts similarity index 100% rename from packages/icon/setting/index.js rename to packages/vue-icon/src/setting/index.ts diff --git a/packages/icon/share-arrow/index.js b/packages/vue-icon/src/share-arrow/index.ts similarity index 100% rename from packages/icon/share-arrow/index.js rename to packages/vue-icon/src/share-arrow/index.ts diff --git a/packages/icon/share/index.js b/packages/vue-icon/src/share/index.ts similarity index 100% rename from packages/icon/share/index.js rename to packages/vue-icon/src/share/index.ts diff --git a/packages/icon/shopping-card/index.js b/packages/vue-icon/src/shopping-card/index.ts similarity index 100% rename from packages/icon/shopping-card/index.js rename to packages/vue-icon/src/shopping-card/index.ts diff --git a/packages/icon/smile-o/index.js b/packages/vue-icon/src/smile-o/index.ts similarity index 100% rename from packages/icon/smile-o/index.js rename to packages/vue-icon/src/smile-o/index.ts diff --git a/packages/icon/smile/index.js b/packages/vue-icon/src/smile/index.ts similarity index 100% rename from packages/icon/smile/index.js rename to packages/vue-icon/src/smile/index.ts diff --git a/packages/icon/sort-default/index.js b/packages/vue-icon/src/sort-default/index.ts similarity index 100% rename from packages/icon/sort-default/index.js rename to packages/vue-icon/src/sort-default/index.ts diff --git a/packages/icon/sort/index.js b/packages/vue-icon/src/sort/index.ts similarity index 100% rename from packages/icon/sort/index.js rename to packages/vue-icon/src/sort/index.ts diff --git a/packages/icon/star-active/index.js b/packages/vue-icon/src/star-active/index.ts similarity index 100% rename from packages/icon/star-active/index.js rename to packages/vue-icon/src/star-active/index.ts diff --git a/packages/icon/star-disable/index.js b/packages/vue-icon/src/star-disable/index.ts similarity index 100% rename from packages/icon/star-disable/index.js rename to packages/vue-icon/src/star-disable/index.ts diff --git a/packages/icon/star-o/index.js b/packages/vue-icon/src/star-o/index.ts similarity index 100% rename from packages/icon/star-o/index.js rename to packages/vue-icon/src/star-o/index.ts diff --git a/packages/icon/start-circle/index.js b/packages/vue-icon/src/start-circle/index.ts similarity index 100% rename from packages/icon/start-circle/index.js rename to packages/vue-icon/src/start-circle/index.ts diff --git a/packages/icon/start/index.js b/packages/vue-icon/src/start/index.ts similarity index 100% rename from packages/icon/start/index.js rename to packages/vue-icon/src/start/index.ts diff --git a/packages/icon/statistics/index.js b/packages/vue-icon/src/statistics/index.ts similarity index 100% rename from packages/icon/statistics/index.js rename to packages/vue-icon/src/statistics/index.ts diff --git a/packages/icon/stop/index.js b/packages/vue-icon/src/stop/index.ts similarity index 100% rename from packages/icon/stop/index.js rename to packages/vue-icon/src/stop/index.ts diff --git a/packages/icon/stream-solid/index.js b/packages/vue-icon/src/stream-solid/index.ts similarity index 100% rename from packages/icon/stream-solid/index.js rename to packages/vue-icon/src/stream-solid/index.ts diff --git a/packages/icon/success/index.js b/packages/vue-icon/src/success/index.ts similarity index 100% rename from packages/icon/success/index.js rename to packages/vue-icon/src/success/index.ts diff --git a/packages/icon/successful/index.js b/packages/vue-icon/src/successful/index.ts similarity index 100% rename from packages/icon/successful/index.js rename to packages/vue-icon/src/successful/index.ts diff --git a/packages/icon/tablet-view/index.js b/packages/vue-icon/src/tablet-view/index.ts similarity index 100% rename from packages/icon/tablet-view/index.js rename to packages/vue-icon/src/tablet-view/index.ts diff --git a/packages/icon/task-cooperation/index.js b/packages/vue-icon/src/task-cooperation/index.ts similarity index 100% rename from packages/icon/task-cooperation/index.js rename to packages/vue-icon/src/task-cooperation/index.ts diff --git a/packages/icon/telephone-circle/index.js b/packages/vue-icon/src/telephone-circle/index.ts similarity index 100% rename from packages/icon/telephone-circle/index.js rename to packages/vue-icon/src/telephone-circle/index.ts diff --git a/packages/icon/telephone/index.js b/packages/vue-icon/src/telephone/index.ts similarity index 100% rename from packages/icon/telephone/index.js rename to packages/vue-icon/src/telephone/index.ts diff --git a/packages/icon/text-align/index.js b/packages/vue-icon/src/text-align/index.ts similarity index 100% rename from packages/icon/text-align/index.js rename to packages/vue-icon/src/text-align/index.ts diff --git a/packages/icon/text-decoration/index.js b/packages/vue-icon/src/text-decoration/index.ts similarity index 100% rename from packages/icon/text-decoration/index.js rename to packages/vue-icon/src/text-decoration/index.ts diff --git a/packages/icon/text-tab/index.js b/packages/vue-icon/src/text-tab/index.ts similarity index 100% rename from packages/icon/text-tab/index.js rename to packages/vue-icon/src/text-tab/index.ts diff --git a/packages/icon/text/index.js b/packages/vue-icon/src/text/index.ts similarity index 100% rename from packages/icon/text/index.js rename to packages/vue-icon/src/text/index.ts diff --git a/packages/icon/time/index.js b/packages/vue-icon/src/time/index.ts similarity index 100% rename from packages/icon/time/index.js rename to packages/vue-icon/src/time/index.ts diff --git a/packages/icon/total/index.js b/packages/vue-icon/src/total/index.ts similarity index 100% rename from packages/icon/total/index.js rename to packages/vue-icon/src/total/index.ts diff --git a/packages/icon/triangle-down/index.js b/packages/vue-icon/src/triangle-down/index.ts similarity index 100% rename from packages/icon/triangle-down/index.js rename to packages/vue-icon/src/triangle-down/index.ts diff --git a/packages/icon/undelete/index.js b/packages/vue-icon/src/undelete/index.ts similarity index 100% rename from packages/icon/undelete/index.js rename to packages/vue-icon/src/undelete/index.ts diff --git a/packages/icon/underline/index.js b/packages/vue-icon/src/underline/index.ts similarity index 100% rename from packages/icon/underline/index.js rename to packages/vue-icon/src/underline/index.ts diff --git a/packages/icon/undo/index.js b/packages/vue-icon/src/undo/index.ts similarity index 100% rename from packages/icon/undo/index.js rename to packages/vue-icon/src/undo/index.ts diff --git a/packages/icon/unfilter/index.js b/packages/vue-icon/src/unfilter/index.ts similarity index 100% rename from packages/icon/unfilter/index.js rename to packages/vue-icon/src/unfilter/index.ts diff --git a/packages/icon/unfreeze/index.js b/packages/vue-icon/src/unfreeze/index.ts similarity index 100% rename from packages/icon/unfreeze/index.js rename to packages/vue-icon/src/unfreeze/index.ts diff --git a/packages/icon/unknow/index.js b/packages/vue-icon/src/unknow/index.ts similarity index 100% rename from packages/icon/unknow/index.js rename to packages/vue-icon/src/unknow/index.ts diff --git a/packages/icon/unknown/index.js b/packages/vue-icon/src/unknown/index.ts similarity index 100% rename from packages/icon/unknown/index.js rename to packages/vue-icon/src/unknown/index.ts diff --git a/packages/icon/unlock/index.js b/packages/vue-icon/src/unlock/index.ts similarity index 100% rename from packages/icon/unlock/index.js rename to packages/vue-icon/src/unlock/index.ts diff --git a/packages/icon/unsent/index.js b/packages/vue-icon/src/unsent/index.ts similarity index 100% rename from packages/icon/unsent/index.js rename to packages/vue-icon/src/unsent/index.ts diff --git a/packages/icon/up-o/index.js b/packages/vue-icon/src/up-o/index.ts similarity index 100% rename from packages/icon/up-o/index.js rename to packages/vue-icon/src/up-o/index.ts diff --git a/packages/icon/up/index.js b/packages/vue-icon/src/up/index.ts similarity index 100% rename from packages/icon/up/index.js rename to packages/vue-icon/src/up/index.ts diff --git a/packages/icon/upload/index.js b/packages/vue-icon/src/upload/index.ts similarity index 100% rename from packages/icon/upload/index.js rename to packages/vue-icon/src/upload/index.ts diff --git a/packages/icon/user/index.js b/packages/vue-icon/src/user/index.ts similarity index 100% rename from packages/icon/user/index.js rename to packages/vue-icon/src/user/index.ts diff --git a/packages/icon/versiontree/index.js b/packages/vue-icon/src/versiontree/index.ts similarity index 100% rename from packages/icon/versiontree/index.js rename to packages/vue-icon/src/versiontree/index.ts diff --git a/packages/icon/view/index.js b/packages/vue-icon/src/view/index.ts similarity index 100% rename from packages/icon/view/index.js rename to packages/vue-icon/src/view/index.ts diff --git a/packages/icon/vuejs/index.js b/packages/vue-icon/src/vuejs/index.ts similarity index 100% rename from packages/icon/vuejs/index.js rename to packages/vue-icon/src/vuejs/index.ts diff --git a/packages/icon/warning-triangle/index.js b/packages/vue-icon/src/warning-triangle/index.ts similarity index 100% rename from packages/icon/warning-triangle/index.js rename to packages/vue-icon/src/warning-triangle/index.ts diff --git a/packages/icon/warning/index.js b/packages/vue-icon/src/warning/index.ts similarity index 100% rename from packages/icon/warning/index.js rename to packages/vue-icon/src/warning/index.ts diff --git a/packages/icon/web-plus/index.js b/packages/vue-icon/src/web-plus/index.ts similarity index 100% rename from packages/icon/web-plus/index.js rename to packages/vue-icon/src/web-plus/index.ts diff --git a/packages/icon/writing/index.js b/packages/vue-icon/src/writing/index.ts similarity index 100% rename from packages/icon/writing/index.js rename to packages/vue-icon/src/writing/index.ts diff --git a/packages/icon/yes/index.js b/packages/vue-icon/src/yes/index.ts similarity index 100% rename from packages/icon/yes/index.js rename to packages/vue-icon/src/yes/index.ts diff --git a/packages/icon/zoom-in/index.js b/packages/vue-icon/src/zoom-in/index.ts similarity index 100% rename from packages/icon/zoom-in/index.js rename to packages/vue-icon/src/zoom-in/index.ts diff --git a/packages/icon/zoom-out/index.js b/packages/vue-icon/src/zoom-out/index.ts similarity index 100% rename from packages/icon/zoom-out/index.js rename to packages/vue-icon/src/zoom-out/index.ts diff --git a/packages/vue-locale/.depcheckrc b/packages/vue-locale/.depcheckrc new file mode 100644 index 000000000..0c2dcac6e --- /dev/null +++ b/packages/vue-locale/.depcheckrc @@ -0,0 +1 @@ +ignores: ["@opentiny/vue-locale"] \ No newline at end of file diff --git a/packages/vue-locale/CHANGELOG.md b/packages/vue-locale/CHANGELOG.md new file mode 100644 index 000000000..e69de29bb diff --git a/packages/vue-locale/package.json b/packages/vue-locale/package.json new file mode 100644 index 000000000..6b084f968 --- /dev/null +++ b/packages/vue-locale/package.json @@ -0,0 +1,18 @@ +{ + "name": "@opentiny/vue-locale", + "private": true, + "version": "3.7.0", + "description": "", + "main": "src/index.ts", + "license": "MIT", + "sideEffects": false, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-theme": "workspace:~", + "@opentiny/vue-theme-mobile": "workspace:~" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + } +} diff --git a/packages/vue-locale/src/format.ts b/packages/vue-locale/src/format.ts new file mode 100644 index 000000000..0719fc5bf --- /dev/null +++ b/packages/vue-locale/src/format.ts @@ -0,0 +1,27 @@ +const RE_NARGS = /(%|)\{([0-9a-zA-Z_]+)\}/g + +export default function (string, ...args) { + if (args.length === 1 && typeof args[0] === 'object') { + args = args[0] + } + + if (!args || !args.hasOwnProperty) { + args = {} + } + + return string.replace(RE_NARGS, (match, prefix, i, index) => { + let result + + if (string[index - 1] === '{' && string[index + match.length] === '}') { + return i + } else { + result = Object.prototype.hasOwnProperty.call(args, i) ? args[i] : null + + if (result === null || result === undefined) { + return '' + } + + return result + } + }) +} diff --git a/packages/vue-locale/src/glob.ts b/packages/vue-locale/src/glob.ts new file mode 100644 index 000000000..ce63c14d6 --- /dev/null +++ b/packages/vue-locale/src/glob.ts @@ -0,0 +1,154 @@ +import { formatNumber, recoverNumber } from '@opentiny/vue-renderless/common/decimal' +import { toDate, getDateWithNewTimezone } from '@opentiny/vue-renderless/common/date' +import { isPlainObject, isDate, isNull } from '@opentiny/vue-renderless/common/type' +import { formatDate } from '@opentiny/vue-renderless/common/deps/date-util' +import { isNumber } from '@opentiny/vue-renderless/common/type' + +export const getNumberFormat = (config) => { + const groupSize = 3 + let groupSeparator = ',' + let decimalSeparator = '.' + + if (isPlainObject(config)) { + return config + } + + if (typeof config === 'string') { + const match = config.match(/\d{2}([^\d]?)\d{3}([^\d]?)\d{2}/) + + if (match && match.length === 3) { + groupSeparator = match[1] + decimalSeparator = match[2] + } + } + + return { + groupSeparator, + groupSize, + decimalSeparator + } +} + +export const getDateFormat = (config) => { + const { DateFormat = 'yyyy-MM-dd', TimeFormat = 'HH:mm:ss' } = config + + return { + DateFormat, + DateTimeFormat: `${DateFormat} ${TimeFormat}`, + TimeFormat + } +} + +const TZRE = /(-|\+)(\d{2}):?(\d{2})$/ + +export const getStrTimezone = (value) => { + const localTimeZone = 0 - new Date().getTimezoneOffset() / 60 + const match = typeof value === 'string' && value.match(TZRE) + + if (match) { + const minoffset = match[2] * 1 + (match[3] * 1) / 60 + value = minoffset * `${match[1]}1` + } + + if (isNumber(value) && value >= -12 && value <= 12) { + return value + } + + return localTimeZone +} + +export default function (t) { + return function (config) { + const opt = { + ...getDateFormat(config), + NumberFormat: getNumberFormat(config.NumberFormat), + DbTimezone: getStrTimezone(config.DbTimezone), + Timezone: getStrTimezone(config.Timezone) + } + + const tools = { + getFormatConfig() { + return opt + }, + setFormatConfig(obj) { + Object.assign(opt, obj) + }, + getNumberFormat() { + return opt.NumberFormat + }, + getDateFormat() { + return { + DateTimeFormat: opt.DateTimeFormat, + TimeFormat: opt.TimeFormat, + Timezone: opt.Timezone, + DateFormat: opt.DateFormat, + DbTimezone: opt.DbTimezone + } + }, + + /** + * + * @param {Date|String} value 日期或日期字符串 + * @param {String} format 格式化模式 + * @returns {String} + */ + formatDate(value, format) { + if (isNull(value)) { + return value + } + + let date = isDate(value) ? value : toDate(value) + let dbtimezone = opt.DbTimezone + let includeTz = value.match && value.match(TZRE) + const convers = format === false || arguments[2] === false + + if (includeTz) { + dbtimezone = getStrTimezone(value) + date = toDate(value.replace('T', ' ').slice(0, -5)) + } + + if (!convers) { + date = this.getDateWithNewTimezone(date, dbtimezone, opt.Timezone) + } + + return isDate(date) ? formatDate(date, format || opt.DateFormat, t) : null + }, + + /** + * + * @param {Number} value 数字 + * @param {Object} format 格式化选项 + * @returns {String} + */ + formatNumber(value, format) { + return formatNumber(value, { ...opt.NumberFormat, ...format }) + }, + + /** + * + * @param {String} value 格式化后的字符串 + * @param {Object} format 格式化选项 + * @returns {Number} + */ + recoverNumber(value, format) { + return recoverNumber(value, { ...opt.NumberFormat, ...format }) + }, + + /** + * + * @param {Date} value Date + * @param {Number} from + * @param {Number} to + * @returns {String} + */ + getDateWithNewTimezone(value, from, to) { + from = from === 0 ? from : from || opt.DbTimezone + to = to === 0 ? to : to || opt.Timezone + + return getDateWithNewTimezone(value, from, to) + } + } + + return tools + } +} diff --git a/packages/vue-locale/src/index.ts b/packages/vue-locale/src/index.ts new file mode 100644 index 000000000..c4634b494 --- /dev/null +++ b/packages/vue-locale/src/index.ts @@ -0,0 +1,17 @@ +import * as vue from 'virtual:locale/vue' +import glob from './glob' + +export const { use, t, i18n, initI18n, extend, zh_CN, en_US, language } = vue + +export const zhCN = zh_CN +export const enUS = en_US + +export const globalization = glob(t) + +export const version = process.env.COMPONENT_VERSION + +export default { + ...vue.default, + language, + globalization +} diff --git a/packages/locale/lang/en.js b/packages/vue-locale/src/lang/en.ts similarity index 100% rename from packages/locale/lang/en.js rename to packages/vue-locale/src/lang/en.ts diff --git a/packages/locale/lang/zh-CN.js b/packages/vue-locale/src/lang/zh-CN.ts similarity index 100% rename from packages/locale/lang/zh-CN.js rename to packages/vue-locale/src/lang/zh-CN.ts diff --git a/packages/vue-locale/src/vue2.7/CHANGELOG.md b/packages/vue-locale/src/vue2.7/CHANGELOG.md new file mode 100644 index 000000000..7464fb99b --- /dev/null +++ b/packages/vue-locale/src/vue2.7/CHANGELOG.md @@ -0,0 +1,16 @@ +# Change Log + +All notable changes to this project will be documented in this file. +See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + +## [5.0.2-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue2.7-locale@1.0.1-beta.0...vue2.7-locale@5.0.2-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue2.7-locale + + + + + +## 1.0.1-beta.0 (2023-02-08) + +**Note:** Version bump only for package vue2.7-locale diff --git a/packages/vue-locale/src/vue2.7/index.ts b/packages/vue-locale/src/vue2.7/index.ts new file mode 100644 index 000000000..0205c5295 --- /dev/null +++ b/packages/vue-locale/src/vue2.7/index.ts @@ -0,0 +1,88 @@ +import zhCN from '../lang/zh-CN' +import enUS from '../lang/en' +import format from '../format' +import { extend as _extend } from '@opentiny/vue-renderless/common/object' + +let lang = zhCN +let i18nHandler = null as any + +export const t = function (this: any, path, options = undefined as any) { + if (i18nHandler) return i18nHandler.apply(this, arguments) + + const array = path.split('.') + let value = null + let current = lang + + for (let i = 0, j = array.length; i < j; i++) { + const property = array[i] + + value = current[property] || '' + + if (i === j - 1) return format(value, options) + if (!value) return '' + + current = value + } + + return '' +} + +export const use = (l) => { + lang = l || lang + return lang +} + +export const language = () => lang.code + +export const i18n = (fn) => { + i18nHandler = fn || t + return i18nHandler +} + +export const extend = _extend + +export const initI18n = ({ app, createI18n, messages = {}, i18n = {} as any, merge }) => { + if (typeof merge !== 'function') { + merge = ({ lang, i18n, messages }) => extend.call(null, true, lang, i18n.messages, messages) + } + + const lang = { + 'zh_CN': zhCN, + 'en_US': enUS + } + + if (typeof createI18n === 'function') { + const vueI18n = createI18n({ + locale: i18n.locale || 'zh_CN', + messages: merge({ lang, i18n, messages }) + }) + + i18nHandler = (key, value) => vueI18n.global.t(key, value) + + return vueI18n + } + + if (app && app.config && app.config.globalProperties) { + app.config.globalProperties.$t = t + } + + return merge({ lang, i18n, messages }) +} + +export const isVue2 = true + +export const isVue3 = false + +export { zhCN as zh_CN, enUS as en_US } + +export default { + isVue2, + isVue3, + use, + t, + i18n, + initI18n, + extend, + 'zh_CN': zhCN, + 'en_US': enUS +} diff --git a/packages/vue-locale/src/vue2.7/package.json b/packages/vue-locale/src/vue2.7/package.json new file mode 100644 index 000000000..67b22897a --- /dev/null +++ b/packages/vue-locale/src/vue2.7/package.json @@ -0,0 +1,7 @@ +{ + "name": "vue2.7-locale", + "private": true, + "version": "5.0.2-mf.0", + "description": "", + "main": "index.ts" +} diff --git a/packages/vue-locale/src/vue2/CHANGELOG.md b/packages/vue-locale/src/vue2/CHANGELOG.md new file mode 100644 index 000000000..6305f13fa --- /dev/null +++ b/packages/vue-locale/src/vue2/CHANGELOG.md @@ -0,0 +1,16 @@ +# Change Log + +All notable changes to this project will be documented in this file. +See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + +## [5.0.2-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue2-locale@1.0.1-beta.0...vue2-locale@5.0.2-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue2-locale + + + + + +## 1.0.1-beta.0 (2023-02-08) + +**Note:** Version bump only for package vue2-locale diff --git a/packages/vue-locale/src/vue2/index.ts b/packages/vue-locale/src/vue2/index.ts new file mode 100644 index 000000000..a8985cfe3 --- /dev/null +++ b/packages/vue-locale/src/vue2/index.ts @@ -0,0 +1,98 @@ +import Vue from 'vue' +import zhCN from '../lang/zh-CN' +import enUS from '../lang/en' +import format from '../format' +import { extend as _extend } from '@opentiny/vue-renderless/common/object' + +let lang = zhCN + +let i18nHandler = function (this: any, key, value) { + const vuei18n = Object.getPrototypeOf(this || Vue).$t + + if (typeof vuei18n === 'function' && vuei18n !== t) { + return vuei18n.apply(this, arguments) + } +} + +export const t = function (this: any, path, options = undefined as any) { + let message = i18nHandler.apply(this, arguments as any) + + if (message === null || message === undefined || message === path) { + let paths = path.split('.') + let current = lang + + for (let pos = 0, len = paths.length; pos < len; pos++) { + const property = paths[pos] + + message = current[property] || '' + + if (pos === len - 1) return format(message, options) + + if (!message) return '' + + current = message + } + + return '' + } else { + return message + } +} + +export const use = (language) => { + lang = language || lang + return lang +} + +export const language = () => lang.code + +export const i18n = (func) => { + i18nHandler = func || i18nHandler + + return i18nHandler +} + +export const extend = _extend + +export const initI18n = ({ VueI18n, messages = {}, i18n = {} as any, merge }) => { + if (typeof merge !== 'function') { + merge = ({ lang, i18n, messages }) => extend.call(null, true, lang, i18n.messages, messages) + } + + const lang = { 'zh_CN': zhCN, 'en_US': enUS } + + if (typeof VueI18n === 'function') { + const vueI18n = new VueI18n({ + locale: i18n.locale || 'zh_CN', + messages: merge({ lang, i18n, messages }) + }) + + i18nHandler = (key, value) => vueI18n.t(key, value) + + return vueI18n + } + + if (Vue && typeof Vue.prototype.$t !== 'function') { + Vue.prototype.$t = t + } + + return merge({ lang, i18n, messages }) +} + +export const isVue2 = true + +export const isVue3 = false + +export { zhCN as zh_CN, enUS as en_US } + +export default { + isVue2, + isVue3, + extend, + i18n, + initI18n, + t, + use, + 'en_US': enUS, + 'zh_CN': zhCN +} diff --git a/packages/vue-locale/src/vue2/package.json b/packages/vue-locale/src/vue2/package.json new file mode 100644 index 000000000..a84e77e95 --- /dev/null +++ b/packages/vue-locale/src/vue2/package.json @@ -0,0 +1,10 @@ +{ + "name": "vue2-locale", + "private": true, + "version": "5.0.2-mf.0", + "description": "", + "main": "index.ts", + "devDependencies": { + "vue": "~2.6.14" + } +} diff --git a/packages/vue-locale/src/vue3/CHANGELOG.md b/packages/vue-locale/src/vue3/CHANGELOG.md new file mode 100644 index 000000000..28c5452e8 --- /dev/null +++ b/packages/vue-locale/src/vue3/CHANGELOG.md @@ -0,0 +1,16 @@ +# Change Log + +All notable changes to this project will be documented in this file. +See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + +## [5.0.2-mf.0](https://codehub-dg-g.huawei.com/AIF/TINY/opentiny-vue/compare/vue3-locale@1.0.1-beta.0...vue3-locale@5.0.2-mf.0) (2023-02-08) + +**Note:** Version bump only for package vue3-locale + + + + + +## 1.0.1-beta.0 (2023-02-08) + +**Note:** Version bump only for package vue3-locale diff --git a/packages/vue-locale/src/vue3/index.ts b/packages/vue-locale/src/vue3/index.ts new file mode 100644 index 000000000..0205c5295 --- /dev/null +++ b/packages/vue-locale/src/vue3/index.ts @@ -0,0 +1,88 @@ +import zhCN from '../lang/zh-CN' +import enUS from '../lang/en' +import format from '../format' +import { extend as _extend } from '@opentiny/vue-renderless/common/object' + +let lang = zhCN +let i18nHandler = null as any + +export const t = function (this: any, path, options = undefined as any) { + if (i18nHandler) return i18nHandler.apply(this, arguments) + + const array = path.split('.') + let value = null + let current = lang + + for (let i = 0, j = array.length; i < j; i++) { + const property = array[i] + + value = current[property] || '' + + if (i === j - 1) return format(value, options) + if (!value) return '' + + current = value + } + + return '' +} + +export const use = (l) => { + lang = l || lang + return lang +} + +export const language = () => lang.code + +export const i18n = (fn) => { + i18nHandler = fn || t + return i18nHandler +} + +export const extend = _extend + +export const initI18n = ({ app, createI18n, messages = {}, i18n = {} as any, merge }) => { + if (typeof merge !== 'function') { + merge = ({ lang, i18n, messages }) => extend.call(null, true, lang, i18n.messages, messages) + } + + const lang = { + 'zh_CN': zhCN, + 'en_US': enUS + } + + if (typeof createI18n === 'function') { + const vueI18n = createI18n({ + locale: i18n.locale || 'zh_CN', + messages: merge({ lang, i18n, messages }) + }) + + i18nHandler = (key, value) => vueI18n.global.t(key, value) + + return vueI18n + } + + if (app && app.config && app.config.globalProperties) { + app.config.globalProperties.$t = t + } + + return merge({ lang, i18n, messages }) +} + +export const isVue2 = true + +export const isVue3 = false + +export { zhCN as zh_CN, enUS as en_US } + +export default { + isVue2, + isVue3, + use, + t, + i18n, + initI18n, + extend, + 'zh_CN': zhCN, + 'en_US': enUS +} diff --git a/packages/vue-locale/src/vue3/package.json b/packages/vue-locale/src/vue3/package.json new file mode 100644 index 000000000..1be35f55a --- /dev/null +++ b/packages/vue-locale/src/vue3/package.json @@ -0,0 +1,7 @@ +{ + "name": "vue3-locale", + "private": true, + "version": "5.0.2-mf.0", + "description": "", + "main": "index.ts" +} diff --git a/packages/vue/.depcheckrc.yaml b/packages/vue/.depcheckrc.yaml new file mode 100644 index 000000000..a5bd37839 --- /dev/null +++ b/packages/vue/.depcheckrc.yaml @@ -0,0 +1,2 @@ +ignores: + - "@opentiny/vue*" \ No newline at end of file diff --git a/packages/vue/CHANGELOG.md b/packages/vue/CHANGELOG.md new file mode 100644 index 000000000..e69de29bb diff --git a/packages/vue/package.json b/packages/vue/package.json new file mode 100644 index 000000000..5cb402ab5 --- /dev/null +++ b/packages/vue/package.json @@ -0,0 +1,181 @@ +{ + "name": "@opentiny/vue", + "private": true, + "version": "3.7.0", + "description": "opentiny vue components", + "main": "index.ts", + "type": "module", + "files": [ + "index.js", + "pc.js", + "mobile.js", + "runtime" + ], + "sideEffects": false, + "dependencies": { + "@opentiny/vue-alert": "workspace:~", + "@opentiny/vue-amount": "workspace:~", + "@opentiny/vue-area": "workspace:~", + "@opentiny/vue-autocomplete": "workspace:~", + "@opentiny/vue-autonavi-map": "workspace:~", + "@opentiny/vue-badge": "workspace:~", + "@opentiny/vue-baidu-map": "workspace:~", + "@opentiny/vue-breadcrumb": "workspace:~", + "@opentiny/vue-breadcrumb-item": "workspace:~", + "@opentiny/vue-bulletin-board": "workspace:~", + "@opentiny/vue-button": "workspace:~", + "@opentiny/vue-button-group": "workspace:~", + "@opentiny/vue-calendar": "workspace:~", + "@opentiny/vue-card-template": "workspace:~", + "@opentiny/vue-carousel": "workspace:~", + "@opentiny/vue-carousel-item": "workspace:~", + "@opentiny/vue-cascader": "workspace:~", + "@opentiny/vue-cascader-menu": "workspace:~", + "@opentiny/vue-cascader-node": "workspace:~", + "@opentiny/vue-cascader-panel": "workspace:~", + "@opentiny/vue-chart": "workspace:~", + "@opentiny/vue-chart-bar": "workspace:~", + "@opentiny/vue-chart-boxplot": "workspace:~", + "@opentiny/vue-chart-candle": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~", + "@opentiny/vue-chart-funnel": "workspace:~", + "@opentiny/vue-chart-gauge": "workspace:~", + "@opentiny/vue-chart-graph": "workspace:~", + "@opentiny/vue-chart-heatmap": "workspace:~", + "@opentiny/vue-chart-histogram": "workspace:~", + "@opentiny/vue-chart-line": "workspace:~", + "@opentiny/vue-chart-liquidfill": "workspace:~", + "@opentiny/vue-chart-map": "workspace:~", + "@opentiny/vue-chart-pie": "workspace:~", + "@opentiny/vue-chart-radar": "workspace:~", + "@opentiny/vue-chart-ring": "workspace:~", + "@opentiny/vue-chart-sankey": "workspace:~", + "@opentiny/vue-chart-scatter": "workspace:~", + "@opentiny/vue-chart-sunburst": "workspace:~", + "@opentiny/vue-chart-tree": "workspace:~", + "@opentiny/vue-chart-waterfall": "workspace:~", + "@opentiny/vue-chart-wordcloud": "workspace:~", + "@opentiny/vue-checkbox": "workspace:~", + "@opentiny/vue-checkbox-button": "workspace:~", + "@opentiny/vue-checkbox-group": "workspace:~", + "@opentiny/vue-col": "workspace:~", + "@opentiny/vue-collapse": "workspace:~", + "@opentiny/vue-collapse-item": "workspace:~", + "@opentiny/vue-collapse-transition": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-company": "workspace:~", + "@opentiny/vue-container": "workspace:~", + "@opentiny/vue-country": "workspace:~", + "@opentiny/vue-crop": "workspace:~", + "@opentiny/vue-currency": "workspace:~", + "@opentiny/vue-date-panel": "workspace:~", + "@opentiny/vue-date-picker": "workspace:~", + "@opentiny/vue-date-range": "workspace:~", + "@opentiny/vue-date-table": "workspace:~", + "@opentiny/vue-dept": "workspace:~", + "@opentiny/vue-detail-page": "workspace:~", + "@opentiny/vue-dialog-box": "workspace:~", + "@opentiny/vue-drop-roles": "workspace:~", + "@opentiny/vue-drop-times": "workspace:~", + "@opentiny/vue-dropdown": "workspace:~", + "@opentiny/vue-dropdown-item": "workspace:~", + "@opentiny/vue-dropdown-menu": "workspace:~", + "@opentiny/vue-espace": "workspace:~", + "@opentiny/vue-fall-menu": "workspace:~", + "@opentiny/vue-file-upload": "workspace:~", + "@opentiny/vue-floatbar": "workspace:~", + "@opentiny/vue-form": "workspace:~", + "@opentiny/vue-form-item": "workspace:~", + "@opentiny/vue-fullscreen": "workspace:~", + "@opentiny/vue-grid": "workspace:~", + "@opentiny/vue-grid-column": "workspace:~", + "@opentiny/vue-grid-manager": "workspace:~", + "@opentiny/vue-grid-toolbar": "workspace:~", + "@opentiny/vue-hrapprover": "workspace:~", + "@opentiny/vue-image": "workspace:~", + "@opentiny/vue-image-viewer": "workspace:~", + "@opentiny/vue-input": "workspace:~", + "@opentiny/vue-ip-address": "workspace:~", + "@opentiny/vue-layout": "workspace:~", + "@opentiny/vue-link": "workspace:~", + "@opentiny/vue-link-menu": "workspace:~", + "@opentiny/vue-loading": "workspace:~", + "@opentiny/vue-locales": "workspace:~", + "@opentiny/vue-logon-user": "workspace:~", + "@opentiny/vue-logout": "workspace:~", + "@opentiny/vue-milestone": "workspace:~", + "@opentiny/vue-modal": "workspace:~", + "@opentiny/vue-month-range": "workspace:~", + "@opentiny/vue-month-table": "workspace:~", + "@opentiny/vue-nav-menu": "workspace:~", + "@opentiny/vue-notify": "workspace:~", + "@opentiny/vue-numeric": "workspace:~", + "@opentiny/vue-option": "workspace:~", + "@opentiny/vue-option-group": "workspace:~", + "@opentiny/vue-pager": "workspace:~", + "@opentiny/vue-pager-item": "workspace:~", + "@opentiny/vue-picker": "workspace:~", + "@opentiny/vue-pop-upload": "workspace:~", + "@opentiny/vue-popeditor": "workspace:~", + "@opentiny/vue-popover": "workspace:~", + "@opentiny/vue-progress": "workspace:~", + "@opentiny/vue-radio": "workspace:~", + "@opentiny/vue-radio-button": "workspace:~", + "@opentiny/vue-radio-group": "workspace:~", + "@opentiny/vue-rate": "workspace:~", + "@opentiny/vue-roles": "workspace:~", + "@opentiny/vue-row": "workspace:~", + "@opentiny/vue-scroll-text": "workspace:~", + "@opentiny/vue-scrollbar": "workspace:~", + "@opentiny/vue-search": "workspace:~", + "@opentiny/vue-select": "workspace:~", + "@opentiny/vue-select-dropdown": "workspace:~", + "@opentiny/vue-slide-bar": "workspace:~", + "@opentiny/vue-slider": "workspace:~", + "@opentiny/vue-split": "workspace:~", + "@opentiny/vue-steps": "workspace:~", + "@opentiny/vue-svg-icon": "workspace:~", + "@opentiny/vue-switch": "workspace:~", + "@opentiny/vue-tab-item": "workspace:~", + "@opentiny/vue-table": "workspace:~", + "@opentiny/vue-tabs": "workspace:~", + "@opentiny/vue-tag": "workspace:~", + "@opentiny/vue-text-popup": "workspace:~", + "@opentiny/vue-time": "workspace:~", + "@opentiny/vue-time-line": "workspace:~", + "@opentiny/vue-time-panel": "workspace:~", + "@opentiny/vue-time-picker": "workspace:~", + "@opentiny/vue-time-range": "workspace:~", + "@opentiny/vue-time-select": "workspace:~", + "@opentiny/vue-time-spinner": "workspace:~", + "@opentiny/vue-toggle-menu": "workspace:~", + "@opentiny/vue-tooltip": "workspace:~", + "@opentiny/vue-transfer": "workspace:~", + "@opentiny/vue-transfer-panel": "workspace:~", + "@opentiny/vue-tree": "workspace:~", + "@opentiny/vue-tree-menu": "workspace:~", + "@opentiny/vue-upload": "workspace:~", + "@opentiny/vue-upload-dragger": "workspace:~", + "@opentiny/vue-upload-list": "workspace:~", + "@opentiny/vue-user": "workspace:~", + "@opentiny/vue-user-account": "workspace:~", + "@opentiny/vue-user-contact": "workspace:~", + "@opentiny/vue-user-head": "workspace:~", + "@opentiny/vue-user-link": "workspace:~", + "@opentiny/vue-wizard": "workspace:~", + "@opentiny/vue-year-table": "workspace:~" + }, + "devDependencies": { + "@vue/composition-api": "1.2.2", + "@vue/runtime-core": "^3.2.47", + "@vue/runtime-dom": "^3.2.31", + "vue2": "npm:vue@2.6.14", + "vue2.7": "npm:vue@2.7.10", + "vue3": "npm:vue@3.2.31" + }, + "license": "MIT", + "scripts": { + "build": "pnpm -w build:ui", + "postversion": "pnpm build" + } +} diff --git a/packages/vue/src/action-menu/index.ts b/packages/vue/src/action-menu/index.ts new file mode 100644 index 000000000..e021e724b --- /dev/null +++ b/packages/vue/src/action-menu/index.ts @@ -0,0 +1,19 @@ +import ActionMenu from './src/index.vue' +import '@opentiny/vue-theme/action-menu/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +ActionMenu.install = function (Vue) { + Vue.component(ActionMenu.name, ActionMenu) +} + +ActionMenu.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + ActionMenu.install(window.Vue) + } +} + +export default ActionMenu diff --git a/packages/vue/src/action-menu/package.json b/packages/vue/src/action-menu/package.json new file mode 100644 index 000000000..9d7630677 --- /dev/null +++ b/packages/vue/src/action-menu/package.json @@ -0,0 +1,23 @@ +{ + "name": "@opentiny/vue-action-menu", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-dropdown": "workspace:~", + "@opentiny/vue-dropdown-menu": "workspace:~", + "@opentiny/vue-dropdown-item": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/action-menu/src/index.vue b/packages/vue/src/action-menu/src/index.vue new file mode 100644 index 000000000..3bade0a71 --- /dev/null +++ b/packages/vue/src/action-menu/src/index.vue @@ -0,0 +1,89 @@ + + + diff --git a/packages/vue/src/action-sheet/index.ts b/packages/vue/src/action-sheet/index.ts new file mode 100644 index 000000000..be1042ce4 --- /dev/null +++ b/packages/vue/src/action-sheet/index.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import ActionSheet from './src/index.vue' +import { version } from './package.json' + +ActionSheet.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +ActionSheet.install = function (Vue) { + Vue.component(ActionSheet.name, ActionSheet) +} + +ActionSheet.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + ActionSheet.install(window.Vue) + } +} + +export default ActionSheet diff --git a/packages/vue/src/action-sheet/package.json b/packages/vue/src/action-sheet/package.json new file mode 100644 index 000000000..382dbb59c --- /dev/null +++ b/packages/vue/src/action-sheet/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-action-sheet", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@better-scroll/core": "2.5.0" + }, + "license": "MIT" +} diff --git a/packages/vue/src/action-sheet/src/index.vue b/packages/vue/src/action-sheet/src/index.vue new file mode 100644 index 000000000..36ec39a02 --- /dev/null +++ b/packages/vue/src/action-sheet/src/index.vue @@ -0,0 +1,78 @@ + + + + diff --git a/packages/vue/src/alert/index.ts b/packages/vue/src/alert/index.ts new file mode 100644 index 000000000..20e6969a9 --- /dev/null +++ b/packages/vue/src/alert/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Alert from './src/index' +import { version } from './package.json' + +/* istanbul ignore next */ +Alert.install = function (Vue) { + Vue.component(Alert.name, Alert) +} + +Alert.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Alert.install(window.Vue) + } +} + +export default Alert diff --git a/packages/vue/src/alert/package.json b/packages/vue/src/alert/package.json new file mode 100644 index 000000000..1b6e5f0dd --- /dev/null +++ b/packages/vue/src/alert/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-alert", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/alert/src/index.ts b/packages/vue/src/alert/src/index.ts new file mode 100644 index 000000000..75702eec0 --- /dev/null +++ b/packages/vue/src/alert/src/index.ts @@ -0,0 +1,71 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +const $constants = { + ICON_MAP: { + success: 'icon-success', + error: 'icon-error', + info: 'icon-help', + warning: 'icon-warning' + }, + TITLE_MAP: { + success: 'ui.alert.success', + error: 'ui.alert.error', + info: 'ui.alert.info', + warning: 'ui.alert.warning' + } +} + +export default defineComponent({ + name: $prefix + 'Alert', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + icon: [String, Object], + type: { + type: String, + default: 'success' + }, + size: { + type: String, + default: 'normal' + }, + description: { + type: String, + default: '' + }, + title: { + type: String + }, + center: Boolean, + showIcon: { + type: Boolean, + default: true + }, + closable: { + type: Boolean, + default: true + }, + closeText: { + type: String, + default: '' + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +}) diff --git a/packages/vue/src/alert/src/mobile.vue b/packages/vue/src/alert/src/mobile.vue new file mode 100644 index 000000000..bb7f1d9f0 --- /dev/null +++ b/packages/vue/src/alert/src/mobile.vue @@ -0,0 +1,44 @@ + + + + diff --git a/packages/vue/src/alert/src/pc.vue b/packages/vue/src/alert/src/pc.vue new file mode 100644 index 000000000..1e29190d5 --- /dev/null +++ b/packages/vue/src/alert/src/pc.vue @@ -0,0 +1,59 @@ + + + + diff --git a/packages/vue/src/amount/index.ts b/packages/vue/src/amount/index.ts new file mode 100644 index 000000000..517d7350f --- /dev/null +++ b/packages/vue/src/amount/index.ts @@ -0,0 +1,24 @@ +import Amount from './src/index.vue' +import '@opentiny/vue-theme/amount/index.less' +import { version } from './package.json' + +Amount.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Amount.install = function (Vue) { + Vue.component(Amount.name, Amount) +} + +Amount.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Amount.install(window.Vue) + } +} + +export default Amount diff --git a/packages/vue/src/amount/package.json b/packages/vue/src/amount/package.json new file mode 100644 index 000000000..8bfb48442 --- /dev/null +++ b/packages/vue/src/amount/package.json @@ -0,0 +1,26 @@ +{ + "name": "@opentiny/vue-amount", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-date-picker": "workspace:~", + "@opentiny/vue-currency": "workspace:~", + "@opentiny/vue-button": "workspace:~", + "@opentiny/vue-input": "workspace:~", + "@opentiny/vue-popover": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/amount/src/index.vue b/packages/vue/src/amount/src/index.vue new file mode 100644 index 000000000..78905219d --- /dev/null +++ b/packages/vue/src/amount/src/index.vue @@ -0,0 +1,163 @@ + + + diff --git a/packages/vue/src/anchor/index.ts b/packages/vue/src/anchor/index.ts new file mode 100644 index 000000000..f74765e63 --- /dev/null +++ b/packages/vue/src/anchor/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Anchor from './src/index' +import '@opentiny/vue-theme/anchor/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Anchor.install = function (Vue) { + Vue.component(Anchor.name, Anchor) +} + +Anchor.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Anchor.install(window.Vue) + } +} + +export default Anchor diff --git a/packages/vue/src/anchor/package.json b/packages/vue/src/anchor/package.json new file mode 100644 index 000000000..a5096d2f1 --- /dev/null +++ b/packages/vue/src/anchor/package.json @@ -0,0 +1,16 @@ +{ + "name": "@opentiny/vue-anchor", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" + } + \ No newline at end of file diff --git a/packages/vue/src/anchor/src/index.vue b/packages/vue/src/anchor/src/index.vue new file mode 100644 index 000000000..0c6e031bf --- /dev/null +++ b/packages/vue/src/anchor/src/index.vue @@ -0,0 +1,69 @@ + diff --git a/packages/vue/src/area/index.ts b/packages/vue/src/area/index.ts new file mode 100644 index 000000000..2185fffb2 --- /dev/null +++ b/packages/vue/src/area/index.ts @@ -0,0 +1,24 @@ +import Area from './src/index.vue' +import '@opentiny/vue-theme/area/index.less' +import { version } from './package.json' + +Area.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Area.install = function (Vue) { + Vue.component(Area.name, Area) +} + +Area.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Area.install(window.Vue) + } +} + +export default Area diff --git a/packages/vue/src/area/package.json b/packages/vue/src/area/package.json new file mode 100644 index 000000000..8e3069fa2 --- /dev/null +++ b/packages/vue/src/area/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-area", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-select": "workspace:~", + "@opentiny/vue-option": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/area/src/index.vue b/packages/vue/src/area/src/index.vue new file mode 100644 index 000000000..2b19c762f --- /dev/null +++ b/packages/vue/src/area/src/index.vue @@ -0,0 +1,115 @@ + + + diff --git a/packages/vue/src/autocomplete/index.ts b/packages/vue/src/autocomplete/index.ts new file mode 100644 index 000000000..955bbe245 --- /dev/null +++ b/packages/vue/src/autocomplete/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Autocomplete from './src/index' +import '@opentiny/vue-theme/autocomplete/index.less' +import { version } from './package.json' + +Autocomplete.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Autocomplete.install = function (Vue) { + Vue.component(Autocomplete.name, Autocomplete) +} + +Autocomplete.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Autocomplete.install(window.Vue) + } +} + +export default Autocomplete diff --git a/packages/vue/src/autocomplete/package.json b/packages/vue/src/autocomplete/package.json new file mode 100644 index 000000000..9b0426eaa --- /dev/null +++ b/packages/vue/src/autocomplete/package.json @@ -0,0 +1,23 @@ +{ + "name": "@opentiny/vue-autocomplete", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-input": "workspace:~", + "@opentiny/vue-scrollbar": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/autocomplete/src/index.ts b/packages/vue/src/autocomplete/src/index.ts new file mode 100644 index 000000000..066632b14 --- /dev/null +++ b/packages/vue/src/autocomplete/src/index.ts @@ -0,0 +1,81 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + WARP_CLS: '.tiny-autocomplete-suggestion__wrap', + ITEM_CLS: '.tiny-autocomplete-suggestion__list li' +} + +export default defineComponent({ + name: $prefix + 'Autocomplete', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + autofocus: Boolean, + clearable: { + type: Boolean, + default: () => false + }, + customItem: String, + debounce: { + type: Number, + default: () => 300 + }, + disabled: Boolean, + fetchSuggestions: Function, + hideLoading: Boolean, + highlightFirstItem: { + type: Boolean, + default: () => false + }, + label: String, + maxlength: Number, + minlength: Number, + modelValue: String, + name: String, + placeholder: String, + placement: { + type: String, + default: () => 'bottom-start' + }, + popperAppendToBody: { + type: Boolean, + default: () => true + }, + popperClass: String, + popperOptions: Object, + prefixIcon: [String, Object], + selectWhenUnmatched: { + type: Boolean, + default: () => false + }, + size: String, + suffixIcon: [String, Object], + triggerOnFocus: { + type: Boolean, + default: () => true + }, + valueKey: { + type: String, + default: () => 'value' + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/autocomplete/src/pc.vue b/packages/vue/src/autocomplete/src/pc.vue new file mode 100644 index 000000000..284dd0cba --- /dev/null +++ b/packages/vue/src/autocomplete/src/pc.vue @@ -0,0 +1,122 @@ + + + + diff --git a/packages/vue/src/avatar/index.ts b/packages/vue/src/avatar/index.ts new file mode 100644 index 000000000..eb6e37c6e --- /dev/null +++ b/packages/vue/src/avatar/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Avatar from './src/index.vue' +import '@opentiny/vue-theme-mobile/avatar/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Avatar.install = function (Vue) { + Vue.component(Avatar.name, Avatar) +} + +Avatar.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Avatar.install(window.Vue) + } +} + +export default Avatar diff --git a/packages/vue/src/avatar/package.json b/packages/vue/src/avatar/package.json new file mode 100644 index 000000000..b3cdf1a06 --- /dev/null +++ b/packages/vue/src/avatar/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-avatar", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/avatar/src/index.vue b/packages/vue/src/avatar/src/index.vue new file mode 100644 index 000000000..92ba076c2 --- /dev/null +++ b/packages/vue/src/avatar/src/index.vue @@ -0,0 +1,95 @@ + + diff --git a/packages/vue/src/badge/index.ts b/packages/vue/src/badge/index.ts new file mode 100644 index 000000000..1586403c5 --- /dev/null +++ b/packages/vue/src/badge/index.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Badge from './src/index' +import { version } from './package.json' + +Badge.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Badge.install = function (Vue) { + Vue.component(Badge.name, Badge) +} + +Badge.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Badge.install(window.Vue) + } +} + +export default Badge diff --git a/packages/vue/src/badge/package.json b/packages/vue/src/badge/package.json new file mode 100644 index 000000000..1a49c152a --- /dev/null +++ b/packages/vue/src/badge/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-badge", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/badge/src/index.ts b/packages/vue/src/badge/src/index.ts new file mode 100644 index 000000000..a4781d437 --- /dev/null +++ b/packages/vue/src/badge/src/index.ts @@ -0,0 +1,54 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +export default defineComponent({ + name: $prefix + 'Badge', + props: { + ...$props, + isDot: { + type: Boolean, + default: false + }, + isFixed: { + type: Boolean, + default: true + }, + isMini: { + type: Boolean, + default: false + }, + max: Number, + value: [String, Number], + modelValue: [String, Number], + href: String, + target: String, + hidden: { + type: Boolean, + default: false + }, + type: { + type: String, + validator: (value) => ~['primary', 'success', 'warning', 'info', 'danger'].indexOf(value) + }, + badgeClass: String, + offset: { + type: Array, + default: [0, 0] + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/badge/src/mobile.vue b/packages/vue/src/badge/src/mobile.vue new file mode 100644 index 000000000..5c489d24f --- /dev/null +++ b/packages/vue/src/badge/src/mobile.vue @@ -0,0 +1,48 @@ + + + + diff --git a/packages/vue/src/badge/src/pc.vue b/packages/vue/src/badge/src/pc.vue new file mode 100644 index 000000000..24ea38da2 --- /dev/null +++ b/packages/vue/src/badge/src/pc.vue @@ -0,0 +1,40 @@ + + + + diff --git a/packages/vue/src/breadcrumb-item/index.ts b/packages/vue/src/breadcrumb-item/index.ts new file mode 100644 index 000000000..2be9f8eeb --- /dev/null +++ b/packages/vue/src/breadcrumb-item/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import BreadcrumbItem from './src/index' +import '@opentiny/vue-theme/breadcrumb-item/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +BreadcrumbItem.install = function (Vue) { + Vue.component(BreadcrumbItem.name, BreadcrumbItem) +} + +BreadcrumbItem.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + BreadcrumbItem.install(window.Vue) + } +} + +export default BreadcrumbItem diff --git a/packages/vue/src/breadcrumb-item/package.json b/packages/vue/src/breadcrumb-item/package.json new file mode 100644 index 000000000..2cb20b455 --- /dev/null +++ b/packages/vue/src/breadcrumb-item/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-breadcrumb-item", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/breadcrumb-item/src/index.ts b/packages/vue/src/breadcrumb-item/src/index.ts new file mode 100644 index 000000000..8b7702f0f --- /dev/null +++ b/packages/vue/src/breadcrumb-item/src/index.ts @@ -0,0 +1,33 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'BreadcrumbItem', + props: { + ...$props, + to: Object, + replace: { + type: Boolean, + default: false + }, + option: { + type: Object, + default: () => ({}) + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/breadcrumb-item/src/pc.vue b/packages/vue/src/breadcrumb-item/src/pc.vue new file mode 100644 index 000000000..a014ca7e0 --- /dev/null +++ b/packages/vue/src/breadcrumb-item/src/pc.vue @@ -0,0 +1,36 @@ + + + + diff --git a/packages/vue/src/breadcrumb/index.ts b/packages/vue/src/breadcrumb/index.ts new file mode 100644 index 000000000..a04e0db9b --- /dev/null +++ b/packages/vue/src/breadcrumb/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Breadcrumb from './src/index' +import '@opentiny/vue-theme/breadcrumb/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Breadcrumb.install = function (Vue) { + Vue.component(Breadcrumb.name, Breadcrumb) +} + +Breadcrumb.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Breadcrumb.install(window.Vue) + } +} + +export default Breadcrumb diff --git a/packages/vue/src/breadcrumb/package.json b/packages/vue/src/breadcrumb/package.json new file mode 100644 index 000000000..1d724b41c --- /dev/null +++ b/packages/vue/src/breadcrumb/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-breadcrumb", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/breadcrumb/src/index.ts b/packages/vue/src/breadcrumb/src/index.ts new file mode 100644 index 000000000..6724d0ecd --- /dev/null +++ b/packages/vue/src/breadcrumb/src/index.ts @@ -0,0 +1,49 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + EVENT_NAME: { + breadcrumbItemSelect: 'breadcrumbItemSelect' + } +} + +export default defineComponent({ + name: $prefix + 'Breadcrumb', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + separator: { + type: String, + default: '>' + }, + separatorIcon: { + type: Object + }, + textField: { + type: String, + default: 'label' + }, + options: { + type: Array, + default: () => [] + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/breadcrumb/src/pc.vue b/packages/vue/src/breadcrumb/src/pc.vue new file mode 100644 index 000000000..8e82ad594 --- /dev/null +++ b/packages/vue/src/breadcrumb/src/pc.vue @@ -0,0 +1,41 @@ + + + + diff --git a/packages/vue/src/bulletin-board/index.ts b/packages/vue/src/bulletin-board/index.ts new file mode 100644 index 000000000..2a90df2f7 --- /dev/null +++ b/packages/vue/src/bulletin-board/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import BulletinBoard from './src/index' +import '@opentiny/vue-theme/bulletin-board/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +BulletinBoard.install = function (Vue) { + Vue.component(BulletinBoard.name, BulletinBoard) +} + +BulletinBoard.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + BulletinBoard.install(window.Vue) + } +} + +export default BulletinBoard diff --git a/packages/vue/src/bulletin-board/package.json b/packages/vue/src/bulletin-board/package.json new file mode 100644 index 000000000..fd347b0ca --- /dev/null +++ b/packages/vue/src/bulletin-board/package.json @@ -0,0 +1,23 @@ +{ + "name": "@opentiny/vue-bulletin-board", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-tabs": "workspace:~", + "@opentiny/vue-tab-item": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/bulletin-board/src/index.ts b/packages/vue/src/bulletin-board/src/index.ts new file mode 100644 index 000000000..fc2697e50 --- /dev/null +++ b/packages/vue/src/bulletin-board/src/index.ts @@ -0,0 +1,47 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'BulletinBoard', + props: { + ...$props, + title: String, + icon: [Object, String], + showMore: { + type: Boolean, + default: true + }, + moreLink: { + type: Object, + default: () => {} + }, + tabTitle: { + type: Array, + required: true, + validator: (value) => Array.isArray(value) && value.length > 0 + }, + activeName: { + type: String, + default: '1' + }, + data: { + type: Array, + required: true + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/bulletin-board/src/pc.vue b/packages/vue/src/bulletin-board/src/pc.vue new file mode 100644 index 000000000..9d76beb7f --- /dev/null +++ b/packages/vue/src/bulletin-board/src/pc.vue @@ -0,0 +1,70 @@ + + + + diff --git a/packages/vue/src/button-group/index.ts b/packages/vue/src/button-group/index.ts new file mode 100644 index 000000000..106ca309b --- /dev/null +++ b/packages/vue/src/button-group/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import ButtonGroup from './src/index' +import '@opentiny/vue-theme/button-group/index.less' +import { version } from './package.json' + +ButtonGroup.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +ButtonGroup.install = function (Vue) { + Vue.component(ButtonGroup.name, ButtonGroup) +} + +ButtonGroup.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + ButtonGroup.install(window.Vue) + } +} + +export default ButtonGroup diff --git a/packages/vue/src/button-group/package.json b/packages/vue/src/button-group/package.json new file mode 100644 index 000000000..9c529ca33 --- /dev/null +++ b/packages/vue/src/button-group/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-button-group", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/button-group/src/index.ts b/packages/vue/src/button-group/src/index.ts new file mode 100644 index 000000000..eb0222f3c --- /dev/null +++ b/packages/vue/src/button-group/src/index.ts @@ -0,0 +1,47 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'ButtonGroup', + provide() { + return { + buttonGroup: this + } + }, + props: { + ...$props, + size: String, + data: Array, + plain: Boolean, + modelValue: [String, Number], + disabled: Boolean, + valueField: { + type: String, + default: 'value' + }, + textField: { + type: String, + default: 'text' + }, + showMore: Number, + showEdit: { + type: Boolean, + default: false + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/button-group/src/pc.vue b/packages/vue/src/button-group/src/pc.vue new file mode 100644 index 000000000..81d515281 --- /dev/null +++ b/packages/vue/src/button-group/src/pc.vue @@ -0,0 +1,87 @@ + + + + diff --git a/packages/vue/src/button/index.ts b/packages/vue/src/button/index.ts new file mode 100644 index 000000000..339743d0c --- /dev/null +++ b/packages/vue/src/button/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Button from './src/index' +import { version } from './package.json' + +/* istanbul ignore next */ +Button.install = function (Vue) { + Vue.component(Button.name, Button) +} + +Button.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Button.install(window.Vue) + } +} + +export default Button diff --git a/packages/vue/src/button/package.json b/packages/vue/src/button/package.json new file mode 100644 index 000000000..55dec02de --- /dev/null +++ b/packages/vue/src/button/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-button", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/button/src/index.ts b/packages/vue/src/button/src/index.ts new file mode 100644 index 000000000..a43e6b7eb --- /dev/null +++ b/packages/vue/src/button/src/index.ts @@ -0,0 +1,57 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +export default defineComponent({ + name: $prefix + 'Button', + inject: { + buttonGroup: { + default: '' + } + }, + props: { + ...$props, + type: { + type: String, + default: 'default' + }, + tabindex: { type: String, default: '1' }, + icon: { + type: [Object, String], + default: '' + }, + text: { + type: String, + default: '' + }, + resetTime: { + type: Number, + default: 1000 + }, + nativeType: { + type: String, + default: 'button' + }, + size: String, + round: Boolean, + plain: Boolean, + circle: Boolean, + loading: Boolean, + disabled: Boolean, + autofocus: Boolean + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/button/src/mobile.vue b/packages/vue/src/button/src/mobile.vue new file mode 100644 index 000000000..7fb27452e --- /dev/null +++ b/packages/vue/src/button/src/mobile.vue @@ -0,0 +1,53 @@ + + + + diff --git a/packages/vue/src/button/src/pc.vue b/packages/vue/src/button/src/pc.vue new file mode 100644 index 000000000..44c6acc06 --- /dev/null +++ b/packages/vue/src/button/src/pc.vue @@ -0,0 +1,56 @@ + + + + diff --git a/packages/vue/src/calendar/index.ts b/packages/vue/src/calendar/index.ts new file mode 100644 index 000000000..dd5efb19e --- /dev/null +++ b/packages/vue/src/calendar/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Calendar from './src/index' +import '@opentiny/vue-theme/calendar/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Calendar.install = function (Vue) { + Vue.component(Calendar.name, Calendar) +} + +Calendar.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Calendar.install(window.Vue) + } +} + +export default Calendar diff --git a/packages/vue/src/calendar/package.json b/packages/vue/src/calendar/package.json new file mode 100644 index 000000000..0079534a0 --- /dev/null +++ b/packages/vue/src/calendar/package.json @@ -0,0 +1,23 @@ +{ + "name": "@opentiny/vue-calendar", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-tooltip": "workspace:~", + "@opentiny/vue-popover": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/calendar/src/index.ts b/packages/vue/src/calendar/src/index.ts new file mode 100644 index 000000000..9495bfcb1 --- /dev/null +++ b/packages/vue/src/calendar/src/index.ts @@ -0,0 +1,67 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'Calendar', + props: { + ...$props, + + /** + * @property {String} [mode='month'] - 显示模式,month|year 可选 + */ + mode: { + type: String, + default: 'month', + validator: (value) => ~['month', 'year'].indexOf(value) + }, + + /** + * @property {Number} [year=getFullYear()] - 指定年份,默认今年 + */ + year: { + type: Number, + default() { + return new Date().getFullYear() + } + }, + + /** + * @property {Number} [month=getMonth()] - 指定月份,默认当月 + */ + month: { + type: Number, + default() { + return new Date().getMonth() + 1 + } + }, + + /** + * @property {Array} events - 事件列表 + * @example + * [{ time: 1534297845236, title: '消息', content: '这是一条消息', type: 'primary' }, + * { time: 1534297845236, title: '消息', content: '还有', type: 'info' }] + * type 类型: warning、error、info、success + */ + events: Array, + + /** + * @property {Boolean} [showSelected=false] - 显示选中的日期 + */ + showSelected: Boolean + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/calendar/src/pc.vue b/packages/vue/src/calendar/src/pc.vue new file mode 100644 index 000000000..067872f92 --- /dev/null +++ b/packages/vue/src/calendar/src/pc.vue @@ -0,0 +1,267 @@ + + + + diff --git a/packages/vue/src/card-template/index.ts b/packages/vue/src/card-template/index.ts new file mode 100644 index 000000000..98b9f08e0 --- /dev/null +++ b/packages/vue/src/card-template/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import CardTemplate from './src/index' +import '@opentiny/vue-theme/card-template/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +CardTemplate.install = function (Vue) { + Vue.component(CardTemplate.name, CardTemplate) +} + +CardTemplate.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + CardTemplate.install(window.Vue) + } +} + +export default CardTemplate diff --git a/packages/vue/src/card-template/package.json b/packages/vue/src/card-template/package.json new file mode 100644 index 000000000..38b5b1c39 --- /dev/null +++ b/packages/vue/src/card-template/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-card-template", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/card-template/src/index.ts b/packages/vue/src/card-template/src/index.ts new file mode 100644 index 000000000..8b6027db7 --- /dev/null +++ b/packages/vue/src/card-template/src/index.ts @@ -0,0 +1,39 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + MOREICON: 'icon-more' +} + +export default defineComponent({ + name: $prefix + 'CardTemplate', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + tools: Array, + header: String, + bodyStyle: Object, + headerLine: { + type: Boolean, + default: true + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/card-template/src/pc.vue b/packages/vue/src/card-template/src/pc.vue new file mode 100644 index 000000000..ca0605ede --- /dev/null +++ b/packages/vue/src/card-template/src/pc.vue @@ -0,0 +1,70 @@ + + + + diff --git a/packages/vue/src/carousel-item/index.ts b/packages/vue/src/carousel-item/index.ts new file mode 100644 index 000000000..9e2cbfaea --- /dev/null +++ b/packages/vue/src/carousel-item/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import CarouselItem from './src/index' +import '@opentiny/vue-theme/carousel-item/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +CarouselItem.install = function (Vue) { + Vue.component(CarouselItem.name, CarouselItem) +} + +CarouselItem.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + CarouselItem.install(window.Vue) + } +} + +export default CarouselItem diff --git a/packages/vue/src/carousel-item/package.json b/packages/vue/src/carousel-item/package.json new file mode 100644 index 000000000..c72d493e7 --- /dev/null +++ b/packages/vue/src/carousel-item/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-carousel-item", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/carousel-item/src/index.ts b/packages/vue/src/carousel-item/src/index.ts new file mode 100644 index 000000000..1688b77a6 --- /dev/null +++ b/packages/vue/src/carousel-item/src/index.ts @@ -0,0 +1,40 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + TYPE_CARD: 'card', + TYPE_VERTICAL: 'vertical', + CARD_SCALE: 0.83 +} + +export default defineComponent({ + name: $prefix + 'CarouselItem', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + name: String, + title: String, + label: { + type: [String, Number], + default: '' + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/carousel-item/src/pc.vue b/packages/vue/src/carousel-item/src/pc.vue new file mode 100644 index 000000000..6e1b68d63 --- /dev/null +++ b/packages/vue/src/carousel-item/src/pc.vue @@ -0,0 +1,46 @@ + + + + diff --git a/packages/vue/src/carousel/index.ts b/packages/vue/src/carousel/index.ts new file mode 100644 index 000000000..6ba1fbb51 --- /dev/null +++ b/packages/vue/src/carousel/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Carousel from './src/index' +import '@opentiny/vue-theme/carousel/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Carousel.install = function (Vue) { + Vue.component(Carousel.name, Carousel) +} + +Carousel.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Carousel.install(window.Vue) + } +} + +export default Carousel diff --git a/packages/vue/src/carousel/package.json b/packages/vue/src/carousel/package.json new file mode 100644 index 000000000..743425901 --- /dev/null +++ b/packages/vue/src/carousel/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-carousel", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/carousel/src/index.ts b/packages/vue/src/carousel/src/index.ts new file mode 100644 index 000000000..5ce9ef069 --- /dev/null +++ b/packages/vue/src/carousel/src/index.ts @@ -0,0 +1,70 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $setup, $prefix, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + CHILD_NAME: $prefix + 'CarouselItem' +} + +export default defineComponent({ + name: $prefix + 'Carousel', + componentName: 'Carousel', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + initialIndex: { + type: Number, + default: 0 + }, + height: String, + trigger: { + type: String, + default: 'hover' + }, + autoplay: { + type: Boolean, + default: false + }, + interval: { + type: Number, + default: 3000 + }, + loop: { + type: Boolean, + default: true + }, + indicatorPosition: String, + arrow: { + type: String, + default: 'hover' + }, + type: { + type: String, + validator: (value) => !value || ~['card', 'vertical'].indexOf(value) + }, + showTitle: { + type: Boolean, + default: false + } + }, + setup(props, context) { + return $setup({ + props, + context, + template + }) + } +}) diff --git a/packages/vue/src/carousel/src/pc.vue b/packages/vue/src/carousel/src/pc.vue new file mode 100644 index 000000000..deeb5af98 --- /dev/null +++ b/packages/vue/src/carousel/src/pc.vue @@ -0,0 +1,83 @@ + + + + diff --git a/packages/vue/src/cascader-menu/index.ts b/packages/vue/src/cascader-menu/index.ts new file mode 100644 index 000000000..26debe22c --- /dev/null +++ b/packages/vue/src/cascader-menu/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import CascaderMenu from './src/index' +import '@opentiny/vue-theme/cascader-menu/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +CascaderMenu.install = function (Vue) { + Vue.component(CascaderMenu.name, CascaderMenu) +} + +CascaderMenu.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + CascaderMenu.install(window.Vue) + } +} + +export default CascaderMenu diff --git a/packages/vue/src/cascader-menu/package.json b/packages/vue/src/cascader-menu/package.json new file mode 100644 index 000000000..5f64bcd3a --- /dev/null +++ b/packages/vue/src/cascader-menu/package.json @@ -0,0 +1,23 @@ +{ + "name": "@opentiny/vue-cascader-menu", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-scrollbar": "workspace:~", + "@opentiny/vue-cascader-node": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/cascader-menu/src/index.jsx b/packages/vue/src/cascader-menu/src/index.tsx similarity index 100% rename from packages/cascader-menu/src/index.jsx rename to packages/vue/src/cascader-menu/src/index.tsx diff --git a/packages/vue/src/cascader-node/index.ts b/packages/vue/src/cascader-node/index.ts new file mode 100644 index 000000000..40844ad5b --- /dev/null +++ b/packages/vue/src/cascader-node/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import CascaderNode from './src/index.vue' +import '@opentiny/vue-theme/cascader-node/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +CascaderNode.install = function (Vue) { + Vue.component(CascaderNode.name, CascaderNode) +} + +CascaderNode.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + CascaderNode.install(window.Vue) + } +} + +export default CascaderNode diff --git a/packages/vue/src/cascader-node/package.json b/packages/vue/src/cascader-node/package.json new file mode 100644 index 000000000..a634195db --- /dev/null +++ b/packages/vue/src/cascader-node/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-cascader-node", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-checkbox": "workspace:~", + "@opentiny/vue-radio": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/cascader-node/src/index.vue b/packages/vue/src/cascader-node/src/index.vue new file mode 100644 index 000000000..939bf0c16 --- /dev/null +++ b/packages/vue/src/cascader-node/src/index.vue @@ -0,0 +1,159 @@ + + diff --git a/packages/vue/src/cascader-panel/index.ts b/packages/vue/src/cascader-panel/index.ts new file mode 100644 index 000000000..980d0ab75 --- /dev/null +++ b/packages/vue/src/cascader-panel/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import CascaderPanel from './src/index.vue' +import '@opentiny/vue-theme/cascader-panel/index.less' +import { version } from './package.json' + +CascaderPanel.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +CascaderPanel.install = function (Vue) { + Vue.component(CascaderPanel.name, CascaderPanel) +} + +CascaderPanel.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + CascaderPanel.install(window.Vue) + } +} + +export default CascaderPanel diff --git a/packages/vue/src/cascader-panel/package.json b/packages/vue/src/cascader-panel/package.json new file mode 100644 index 000000000..42d631f27 --- /dev/null +++ b/packages/vue/src/cascader-panel/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-cascader-panel", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-cascader-menu": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/cascader-panel/src/index.vue b/packages/vue/src/cascader-panel/src/index.vue new file mode 100644 index 000000000..d7f03d6ed --- /dev/null +++ b/packages/vue/src/cascader-panel/src/index.vue @@ -0,0 +1,49 @@ + + + + diff --git a/packages/vue/src/cascader/index.ts b/packages/vue/src/cascader/index.ts new file mode 100644 index 000000000..94bd24c53 --- /dev/null +++ b/packages/vue/src/cascader/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Cascader from './src/index' +import '@opentiny/vue-theme/cascader/index.less' +import { version } from './package.json' + +Cascader.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Cascader.install = function (Vue) { + Vue.component(Cascader.name, Cascader) +} + +Cascader.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Cascader.install(window.Vue) + } +} + +export default Cascader diff --git a/packages/vue/src/cascader/package.json b/packages/vue/src/cascader/package.json new file mode 100644 index 000000000..020f3a16d --- /dev/null +++ b/packages/vue/src/cascader/package.json @@ -0,0 +1,25 @@ +{ + "name": "@opentiny/vue-cascader", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-input": "workspace:~", + "@opentiny/vue-tag": "workspace:~", + "@opentiny/vue-scrollbar": "workspace:~", + "@opentiny/vue-cascader-panel": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/cascader/src/index.ts b/packages/vue/src/cascader/src/index.ts new file mode 100644 index 000000000..5c4124dc2 --- /dev/null +++ b/packages/vue/src/cascader/src/index.ts @@ -0,0 +1,71 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + placeholder: 'ui.cascader.placeholder', + COMPONENT_NAME: { FormItem: 'FormItem' }, + EVENT_NAME: { FormBlur: 'form.blur' } +} + +export default defineComponent({ + name: $prefix + 'Cascader', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + autoSize: Boolean, + beforeFilter: { + type: Function, + default: () => () => { + // do nothing + } + }, + clearable: Boolean, + collapseTags: Boolean, + debounce: { + type: Number, + default: 300 + }, + disabled: Boolean, + filterMethod: Function, + filterable: Boolean, + modelValue: {}, + options: Array, + placeholder: { + type: String, + default: '' + }, + popperAppendToBody: { + type: Boolean, + default: true + }, + popperClass: String, + props: Object, + separator: { + type: String, + default: '/' + }, + showAllLevels: { + type: Boolean, + default: true + }, + size: String + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/cascader/src/pc.vue b/packages/vue/src/cascader/src/pc.vue new file mode 100644 index 000000000..700962684 --- /dev/null +++ b/packages/vue/src/cascader/src/pc.vue @@ -0,0 +1,183 @@ + + + + diff --git a/packages/vue/src/chart/autonavi-map/index.ts b/packages/vue/src/chart/autonavi-map/index.ts new file mode 100644 index 000000000..0e6ad231f --- /dev/null +++ b/packages/vue/src/chart/autonavi-map/index.ts @@ -0,0 +1,18 @@ +import AMap from './src/index.js' +import { version } from './package.json' + +/* istanbul ignore next */ +AMap.install = function (Vue) { + Vue.component(AMap.name, AMap) +} + +AMap.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + AMap.install(window.Vue) + } +} + +export default AMap diff --git a/packages/vue/src/chart/autonavi-map/package.json b/packages/vue/src/chart/autonavi-map/package.json new file mode 100644 index 000000000..726a06941 --- /dev/null +++ b/packages/vue/src/chart/autonavi-map/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-autonavi-map", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/autonavi-map/src/AMapCoordSys.ts b/packages/vue/src/chart/autonavi-map/src/AMapCoordSys.ts new file mode 100644 index 000000000..4ee235c57 --- /dev/null +++ b/packages/vue/src/chart/autonavi-map/src/AMapCoordSys.ts @@ -0,0 +1,119 @@ +import * as echarts from 'echarts' + +export default class AMapCoordSys { + constructor(amap, api) { + this._amap = amap + this.dimensions = ['lng', 'lat'] + this._mapOffset = [0, 0] + this._api = api + } + + static create(ecModel, api) { + let tinySys + let root = api.getDom() + + ecModel.eachComponent('amap', (tinyModel) => { + let viewportRoot = api.getZr().painter.getViewportRoot() + + if (typeof window.AMap === 'undefined') { + throw new TypeError('AMap api is not loaded') + } + + if (tinySys) { + throw new Error('Only one amap component can exist') + } + + if (!tinyModel.__amap) { + let amapRoot = root.querySelector('.ec-extension-amap') + + if (amapRoot) { + viewportRoot.style.left = '0px' + viewportRoot.style.top = '0px' + root.removeChild(amapRoot) + } + amapRoot = document.createElement('div') + amapRoot.style.cssText = 'width:100%;height:100%' + + amapRoot.classList.add('ec-extension-amap') + root.appendChild(amapRoot) + + let options = tinyModel.get() || {} + + options = tinyModel.__options = echarts.util.clone(options) + + let amap = (tinyModel.__amap = new window.AMap.Map(amapRoot, options)) + + let layer = (tinyModel.__layer = new window.AMap.CustomLayer(viewportRoot)) + + layer.setMap(amap) + } + + let tinyApm = tinyModel.getAMap() + let tinyOut = tinyModel.getLayer() + tinyOut.hide() + + let tinyZoom = tinyApm.getZoom() + let tinyCenter = tinyApm.getCenter() + + tinySys = new AMapCoordSys(tinyApm, api) + tinySys.setMapOffset(tinyModel.__mapOffset || [0, 0]) + tinySys.setZoom(tinyZoom) + tinySys.setCenter([tinyCenter.lng, tinyCenter.lat]) + tinyModel.coordinateSystem = tinySys + tinyOut.show() + }) + + ecModel.eachSeries((seriesModel) => { + if (seriesModel.get('coordinateSystem') === 'amap') { + seriesModel.coordinateSystem = tinySys + } + }) + } + + setZoom(zoom) { + this._zoom = zoom + } + + setCenter(center) { + this._center = this._amap.lnglatToPixel(center) + } + + setMapOffset(mapOffset) { + this._mapOffset = mapOffset + } + + getAMap() { + return this._amap + } + + dataToPoint(data) { + let point = new window.AMap.LngLat(data[0], data[1]) + let px = this._amap.lngLatToContainer(point) + let mapOffset = this._mapOffset + + return [px.x - mapOffset[0], px.y - mapOffset[1]] + } + + pointToData(pt) { + let mapOffset = this._mapOffset + + pt = this._amap.containerToLngLat({ + x: pt[0] + mapOffset[0], + y: pt[1] + mapOffset[1] + }) + + return [pt.lng, pt.lat] + } + + getViewRect() { + let api = this._api + + return new echarts.graphic.BoundingRect(0, 0, api.getWidth(), api.getHeight()) + } + + getRoamTransform() { + return echarts.matrix.create() + } +} + +AMapCoordSys.dimensions = AMapCoordSys.prototype.dimensions diff --git a/packages/chart/autonavi-map/src/AMapModel.js b/packages/vue/src/chart/autonavi-map/src/AMapModel.ts similarity index 100% rename from packages/chart/autonavi-map/src/AMapModel.js rename to packages/vue/src/chart/autonavi-map/src/AMapModel.ts diff --git a/packages/chart/autonavi-map/src/AMapView.js b/packages/vue/src/chart/autonavi-map/src/AMapView.ts similarity index 100% rename from packages/chart/autonavi-map/src/AMapView.js rename to packages/vue/src/chart/autonavi-map/src/AMapView.ts diff --git a/packages/chart/autonavi-map/src/amap.js b/packages/vue/src/chart/autonavi-map/src/amap.ts similarity index 100% rename from packages/chart/autonavi-map/src/amap.js rename to packages/vue/src/chart/autonavi-map/src/amap.ts diff --git a/packages/vue/src/chart/autonavi-map/src/index.ts b/packages/vue/src/chart/autonavi-map/src/index.ts new file mode 100644 index 000000000..d54a4f621 --- /dev/null +++ b/packages/vue/src/chart/autonavi-map/src/index.ts @@ -0,0 +1,16 @@ +import './amap' +import { amap } from '@opentiny/vue-renderless/autonavi-map/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartAutonaviMap', + data() { + this.chartHandler = amap + return {} + } + } +} +) diff --git a/packages/vue/src/chart/baidu-map/index.ts b/packages/vue/src/chart/baidu-map/index.ts new file mode 100644 index 000000000..9fe215c42 --- /dev/null +++ b/packages/vue/src/chart/baidu-map/index.ts @@ -0,0 +1,18 @@ +import BMap from './src/index.js' +import { version } from './package.json' + +/* istanbul ignore next */ +BMap.install = function (Vue) { + Vue.component(BMap.name, BMap) +} + +BMap.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + BMap.install(window.Vue) + } +} + +export default BMap diff --git a/packages/vue/src/chart/baidu-map/package.json b/packages/vue/src/chart/baidu-map/package.json new file mode 100644 index 000000000..6903c9380 --- /dev/null +++ b/packages/vue/src/chart/baidu-map/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-baidu-map", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/baidu-map/src/index.ts b/packages/vue/src/chart/baidu-map/src/index.ts new file mode 100644 index 000000000..9aafb71b7 --- /dev/null +++ b/packages/vue/src/chart/baidu-map/src/index.ts @@ -0,0 +1,16 @@ +import 'echarts/extension/bmap/bmap' +import { bmap } from '@opentiny/vue-renderless/baidu-map/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartBaiduMap', + data() { + this.chartHandler = bmap + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-bar/index.ts b/packages/vue/src/chart/chart-bar/index.ts new file mode 100644 index 000000000..6f712c81b --- /dev/null +++ b/packages/vue/src/chart/chart-bar/index.ts @@ -0,0 +1,21 @@ +import Bar from './src/index.js' +import { histogram, bar } from '@opentiny/vue-renderless/chart-bar/index' +import { version } from './package.json' + +/* istanbul ignore next */ +Bar.install = function (Vue) { + Vue.component(Bar.name, Bar) +} + +Bar.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Bar.install(window.Vue) + } +} + +export { histogram, bar } + +export default Bar diff --git a/packages/vue/src/chart/chart-bar/package.json b/packages/vue/src/chart/chart-bar/package.json new file mode 100644 index 000000000..61fbcd1b3 --- /dev/null +++ b/packages/vue/src/chart/chart-bar/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-chart-bar", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-bar/src/index.ts b/packages/vue/src/chart/chart-bar/src/index.ts new file mode 100644 index 000000000..83a287a78 --- /dev/null +++ b/packages/vue/src/chart/chart-bar/src/index.ts @@ -0,0 +1,21 @@ +import * as echarts from 'echarts/core' +import { GridComponent } from 'echarts/components' +import { BarChart } from 'echarts/charts' +import { CanvasRenderer } from 'echarts/renderers' +import { bar } from '@opentiny/vue-renderless/chart-bar/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +echarts.use([GridComponent, BarChart, CanvasRenderer]) + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartBar', + data() { + this.chartHandler = bar + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-boxplot/index.ts b/packages/vue/src/chart/chart-boxplot/index.ts new file mode 100644 index 000000000..5b7eb8fe3 --- /dev/null +++ b/packages/vue/src/chart/chart-boxplot/index.ts @@ -0,0 +1,18 @@ +import Boxplot from './src/index.js' +import { version } from './package.json' + +/* istanbul ignore next */ +Boxplot.install = function (Vue) { + Vue.component(Boxplot.name, Boxplot) +} + +Boxplot.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Boxplot.install(window.Vue) + } +} + +export default Boxplot diff --git a/packages/vue/src/chart/chart-boxplot/package.json b/packages/vue/src/chart/chart-boxplot/package.json new file mode 100644 index 000000000..6ee075586 --- /dev/null +++ b/packages/vue/src/chart/chart-boxplot/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-chart-boxplot", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-boxplot/src/index.ts b/packages/vue/src/chart/chart-boxplot/src/index.ts new file mode 100644 index 000000000..79d472500 --- /dev/null +++ b/packages/vue/src/chart/chart-boxplot/src/index.ts @@ -0,0 +1,24 @@ +import * as echarts from 'echarts/core' +import { DatasetComponent, GridComponent, DataZoomComponent, TransformComponent } from 'echarts/components' +import { BoxplotChart, ScatterChart } from 'echarts/charts' +import { UniversalTransition } from 'echarts/features' +import { CanvasRenderer } from 'echarts/renderers' +import { prepareBoxplotData } from 'echarts/dist/extension/dataTool' +import { boxplot } from '@opentiny/vue-renderless/chart-boxplot' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +echarts.use([DatasetComponent, GridComponent, DataZoomComponent, TransformComponent, BoxplotChart, ScatterChart, CanvasRenderer, UniversalTransition]) + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartBoxplot', + data() { + this.prepareBoxplotData = prepareBoxplotData + this.chartHandler = boxplot + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-candle/index.ts b/packages/vue/src/chart/chart-candle/index.ts new file mode 100644 index 000000000..80e10fa5b --- /dev/null +++ b/packages/vue/src/chart/chart-candle/index.ts @@ -0,0 +1,18 @@ +import Candle from './src/index.js' +import { version } from './package.json' + +/* istanbul ignore next */ +Candle.install = function (Vue) { + Vue.component(Candle.name, Candle) +} + +Candle.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Candle.install(window.Vue) + } +} + +export default Candle diff --git a/packages/vue/src/chart/chart-candle/package.json b/packages/vue/src/chart/chart-candle/package.json new file mode 100644 index 000000000..08a4e893b --- /dev/null +++ b/packages/vue/src/chart/chart-candle/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-chart-candle", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-candle/src/index.ts b/packages/vue/src/chart/chart-candle/src/index.ts new file mode 100644 index 000000000..ed51a45c1 --- /dev/null +++ b/packages/vue/src/chart/chart-candle/src/index.ts @@ -0,0 +1,32 @@ +import * as echarts from 'echarts/core' +import { GraphicComponent, GridComponent, DataZoomComponent, MarkLineComponent, MarkPointComponent } from 'echarts/components' +import { BarChart, CandlestickChart, LineChart } from 'echarts/charts' +import { UniversalTransition } from 'echarts/features' +import { CanvasRenderer } from 'echarts/renderers' +import { candle } from '@opentiny/vue-renderless/chart-candle/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +echarts.use([ + GraphicComponent, + GridComponent, + DataZoomComponent, + BarChart, + MarkLineComponent, + MarkPointComponent, + CandlestickChart, + LineChart, + CanvasRenderer, + UniversalTransition +]) +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartCandle', + data() { + this.chartHandler = candle + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-core/index.ts b/packages/vue/src/chart/chart-core/index.ts new file mode 100644 index 000000000..a297ec038 --- /dev/null +++ b/packages/vue/src/chart/chart-core/index.ts @@ -0,0 +1,12 @@ +import Core from './src/index.vue' +import '@opentiny/vue-theme/chart-core/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Core.install = function (Vue) { + Vue.component(Core.name, Core) +} + +Core.version = version + +export default Core diff --git a/packages/vue/src/chart/chart-core/package.json b/packages/vue/src/chart/chart-core/package.json new file mode 100644 index 000000000..5f26d0d51 --- /dev/null +++ b/packages/vue/src/chart/chart-core/package.json @@ -0,0 +1,18 @@ +{ + "name": "@opentiny/vue-chart-core", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "echarts": "5.2.1", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-locale": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-core/src/index.vue b/packages/vue/src/chart/chart-core/src/index.vue new file mode 100644 index 000000000..0dfbf998d --- /dev/null +++ b/packages/vue/src/chart/chart-core/src/index.vue @@ -0,0 +1,108 @@ + + + diff --git a/packages/vue/src/chart/chart-funnel/index.ts b/packages/vue/src/chart/chart-funnel/index.ts new file mode 100644 index 000000000..b8b2c5cad --- /dev/null +++ b/packages/vue/src/chart/chart-funnel/index.ts @@ -0,0 +1,21 @@ +import Funnel from './src/index.js' +import { funnel } from '@opentiny/vue-renderless/chart-funnel/index' +import { version } from './package.json' + +/* istanbul ignore next */ +Funnel.install = function (Vue) { + Vue.component(Funnel.name, Funnel) +} + +Funnel.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Funnel.install(window.Vue) + } +} + +export { funnel } + +export default Funnel diff --git a/packages/vue/src/chart/chart-funnel/package.json b/packages/vue/src/chart/chart-funnel/package.json new file mode 100644 index 000000000..09f8326c6 --- /dev/null +++ b/packages/vue/src/chart/chart-funnel/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-chart-funnel", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-funnel/src/index.ts b/packages/vue/src/chart/chart-funnel/src/index.ts new file mode 100644 index 000000000..e6971f5d9 --- /dev/null +++ b/packages/vue/src/chart/chart-funnel/src/index.ts @@ -0,0 +1,21 @@ +import * as echarts from 'echarts/core' +import { ToolboxComponent } from 'echarts/components' +import { FunnelChart } from 'echarts/charts' +import { CanvasRenderer } from 'echarts/renderers' +import { funnel } from '@opentiny/vue-renderless/chart-funnel/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +echarts.use([ToolboxComponent, FunnelChart, CanvasRenderer]) + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartFunnel', + data() { + this.chartHandler = funnel + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-gauge/index.ts b/packages/vue/src/chart/chart-gauge/index.ts new file mode 100644 index 000000000..6983698d4 --- /dev/null +++ b/packages/vue/src/chart/chart-gauge/index.ts @@ -0,0 +1,18 @@ +import Gauge from './src/index.vue' +import { version } from './package.json' + +/* istanbul ignore next */ +Gauge.install = function (Vue) { + Vue.component(Gauge.name, Gauge) +} + +Gauge.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Gauge.install(window.Vue) + } +} + +export default Gauge diff --git a/packages/vue/src/chart/chart-gauge/package.json b/packages/vue/src/chart/chart-gauge/package.json new file mode 100644 index 000000000..c1547ccfa --- /dev/null +++ b/packages/vue/src/chart/chart-gauge/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-chart-gauge", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-gauge/src/index.vue b/packages/vue/src/chart/chart-gauge/src/index.vue new file mode 100644 index 000000000..caff5b228 --- /dev/null +++ b/packages/vue/src/chart/chart-gauge/src/index.vue @@ -0,0 +1,21 @@ + diff --git a/packages/vue/src/chart/chart-graph/index.ts b/packages/vue/src/chart/chart-graph/index.ts new file mode 100644 index 000000000..ca0408f4c --- /dev/null +++ b/packages/vue/src/chart/chart-graph/index.ts @@ -0,0 +1,18 @@ +import Graph from './src/index.js' +import { version } from './package.json' + +/* istanbul ignore next */ +Graph.install = function (Vue) { + Vue.component(Graph.name, Graph) +} + +Graph.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Graph.install(window.Vue) + } +} + +export default Graph diff --git a/packages/vue/src/chart/chart-graph/package.json b/packages/vue/src/chart/chart-graph/package.json new file mode 100644 index 000000000..7276b63b7 --- /dev/null +++ b/packages/vue/src/chart/chart-graph/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-chart-graph", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-graph/src/index.ts b/packages/vue/src/chart/chart-graph/src/index.ts new file mode 100644 index 000000000..ad41d1228 --- /dev/null +++ b/packages/vue/src/chart/chart-graph/src/index.ts @@ -0,0 +1,21 @@ +import * as echarts from 'echarts/core' +import { GridComponent } from 'echarts/components' +import { GraphChart } from 'echarts/charts' +import { CanvasRenderer } from 'echarts/renderers' +import { graph } from '@opentiny/vue-renderless/chart-graph/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +echarts.use([GridComponent, GraphChart, CanvasRenderer]) + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartGraph', + data() { + this.chartHandler = graph + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-heatmap/index.ts b/packages/vue/src/chart/chart-heatmap/index.ts new file mode 100644 index 000000000..20397e742 --- /dev/null +++ b/packages/vue/src/chart/chart-heatmap/index.ts @@ -0,0 +1,18 @@ +import Heatmap from './src/index.js' +import { version } from './package.json' + +/* istanbul ignore next */ +Heatmap.install = function (Vue) { + Vue.component(Heatmap.name, Heatmap) +} + +Heatmap.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Heatmap.install(window.Vue) + } +} + +export default Heatmap diff --git a/packages/vue/src/chart/chart-heatmap/package.json b/packages/vue/src/chart/chart-heatmap/package.json new file mode 100644 index 000000000..901e57252 --- /dev/null +++ b/packages/vue/src/chart/chart-heatmap/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-chart-heatmap", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-heatmap/src/index.ts b/packages/vue/src/chart/chart-heatmap/src/index.ts new file mode 100644 index 000000000..051887206 --- /dev/null +++ b/packages/vue/src/chart/chart-heatmap/src/index.ts @@ -0,0 +1,21 @@ +import * as echarts from 'echarts/core' +import { HeatmapChart, MapChart } from 'echarts/charts' +import { GridComponent, VisualMapComponent } from 'echarts/components' +import 'echarts/extension/bmap/bmap' +import { heatmap } from '@opentiny/vue-renderless/chart-heatmap/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +echarts.use([HeatmapChart, MapChart, GridComponent, VisualMapComponent]) + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartHeatmap', + data() { + this.chartHandler = heatmap + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-histogram/index.ts b/packages/vue/src/chart/chart-histogram/index.ts new file mode 100644 index 000000000..b3e71dfd6 --- /dev/null +++ b/packages/vue/src/chart/chart-histogram/index.ts @@ -0,0 +1,18 @@ +import Histogram from './src/index.js' +import { version } from './package.json' + +/* istanbul ignore next */ +Histogram.install = function (Vue) { + Vue.component(Histogram.name, Histogram) +} + +Histogram.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Histogram.install(window.Vue) + } +} + +export default Histogram diff --git a/packages/vue/src/chart/chart-histogram/package.json b/packages/vue/src/chart/chart-histogram/package.json new file mode 100644 index 000000000..de2591cb5 --- /dev/null +++ b/packages/vue/src/chart/chart-histogram/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-chart-histogram", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-histogram/src/index.ts b/packages/vue/src/chart/chart-histogram/src/index.ts new file mode 100644 index 000000000..42243f68c --- /dev/null +++ b/packages/vue/src/chart/chart-histogram/src/index.ts @@ -0,0 +1,21 @@ +import * as echarts from 'echarts/core' +import { GridComponent } from 'echarts/components' +import { BarChart } from 'echarts/charts' +import { CanvasRenderer } from 'echarts/renderers' +import { histogram } from '@opentiny/vue-renderless/chart-bar/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +echarts.use([GridComponent, BarChart, CanvasRenderer]) + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartHistogram', + data() { + this.chartHandler = histogram + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-line/index.ts b/packages/vue/src/chart/chart-line/index.ts new file mode 100644 index 000000000..bb7873d47 --- /dev/null +++ b/packages/vue/src/chart/chart-line/index.ts @@ -0,0 +1,21 @@ +import Line from './src/index.js' +import { line } from '@opentiny/vue-renderless/chart-line/index' +import { version } from './package.json' + +/* istanbul ignore next */ +Line.install = function (Vue) { + Vue.component(Line.name, Line) +} + +Line.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Line.install(window.Vue) + } +} + +export { line } + +export default Line diff --git a/packages/vue/src/chart/chart-line/package.json b/packages/vue/src/chart/chart-line/package.json new file mode 100644 index 000000000..b12bc9fa2 --- /dev/null +++ b/packages/vue/src/chart/chart-line/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-chart-line", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-line/src/index.ts b/packages/vue/src/chart/chart-line/src/index.ts new file mode 100644 index 000000000..f4a78eeec --- /dev/null +++ b/packages/vue/src/chart/chart-line/src/index.ts @@ -0,0 +1,22 @@ +import * as echarts from 'echarts/core' +import { ToolboxComponent, GridComponent } from 'echarts/components' +import { LineChart } from 'echarts/charts' +import { UniversalTransition } from 'echarts/features' +import { CanvasRenderer } from 'echarts/renderers' +import { line } from '@opentiny/vue-renderless/chart-line/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +echarts.use([ToolboxComponent, GridComponent, LineChart, UniversalTransition, CanvasRenderer]) + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartLine', + data() { + this.chartHandler = line + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-liquidfill/index.ts b/packages/vue/src/chart/chart-liquidfill/index.ts new file mode 100644 index 000000000..f4c9ea0e6 --- /dev/null +++ b/packages/vue/src/chart/chart-liquidfill/index.ts @@ -0,0 +1,18 @@ +import Liquidfill from './src/index.js' +import { version } from './package.json' + +/* istanbul ignore next */ +Liquidfill.install = function (Vue) { + Vue.component(Liquidfill.name, Liquidfill) +} + +Liquidfill.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Liquidfill.install(window.Vue) + } +} + +export default Liquidfill diff --git a/packages/vue/src/chart/chart-liquidfill/package.json b/packages/vue/src/chart/chart-liquidfill/package.json new file mode 100644 index 000000000..5b509105b --- /dev/null +++ b/packages/vue/src/chart/chart-liquidfill/package.json @@ -0,0 +1,18 @@ +{ + "name": "@opentiny/vue-chart-liquidfill", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~", + "echarts-liquidfill": "3.0.0" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-liquidfill/src/index.ts b/packages/vue/src/chart/chart-liquidfill/src/index.ts new file mode 100644 index 000000000..248c98849 --- /dev/null +++ b/packages/vue/src/chart/chart-liquidfill/src/index.ts @@ -0,0 +1,16 @@ +import 'echarts-liquidfill' +import { liquidfill } from '@opentiny/vue-renderless/chart-liquidfill/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartLiquidfill', + data() { + this.chartHandler = liquidfill + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-map/index.ts b/packages/vue/src/chart/chart-map/index.ts new file mode 100644 index 000000000..1a48e6a86 --- /dev/null +++ b/packages/vue/src/chart/chart-map/index.ts @@ -0,0 +1,18 @@ +import ChartMap from './src/index.js' +import { version } from './package.json' + +/* istanbul ignore next */ +ChartMap.install = function (Vue) { + Vue.component(ChartMap.name, ChartMap) +} + +ChartMap.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + ChartMap.install(window.Vue) + } +} + +export default ChartMap diff --git a/packages/vue/src/chart/chart-map/package.json b/packages/vue/src/chart/chart-map/package.json new file mode 100644 index 000000000..0cd8e9712 --- /dev/null +++ b/packages/vue/src/chart/chart-map/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-chart-map", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-map/src/index.ts b/packages/vue/src/chart/chart-map/src/index.ts new file mode 100644 index 000000000..ea3b0106a --- /dev/null +++ b/packages/vue/src/chart/chart-map/src/index.ts @@ -0,0 +1,19 @@ +import * as echarts from 'echarts/core' +import { MapChart } from 'echarts/charts' +import { map } from '@opentiny/vue-renderless/chart-map/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +echarts.use([MapChart]) + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartMap', + data() { + this.chartHandler = map + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-pie/index.ts b/packages/vue/src/chart/chart-pie/index.ts new file mode 100644 index 000000000..08d8e4842 --- /dev/null +++ b/packages/vue/src/chart/chart-pie/index.ts @@ -0,0 +1,21 @@ +import Pie from './src/index.js' +import { ring, pie } from '@opentiny/vue-renderless/chart-pie/index' +import { version } from './package.json' + +/* istanbul ignore next */ +Pie.install = function (Vue) { + Vue.component(Pie.name, Pie) +} + +Pie.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Pie.install(window.Vue) + } +} + +export { ring, pie } + +export default Pie diff --git a/packages/vue/src/chart/chart-pie/package.json b/packages/vue/src/chart/chart-pie/package.json new file mode 100644 index 000000000..04c0a5e03 --- /dev/null +++ b/packages/vue/src/chart/chart-pie/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-chart-pie", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-pie/src/index.ts b/packages/vue/src/chart/chart-pie/src/index.ts new file mode 100644 index 000000000..b8cfb2419 --- /dev/null +++ b/packages/vue/src/chart/chart-pie/src/index.ts @@ -0,0 +1,21 @@ +import * as echarts from 'echarts/core' +import { PieChart } from 'echarts/charts' +import { LabelLayout } from 'echarts/features' +import { CanvasRenderer } from 'echarts/renderers' +import { pie } from '@opentiny/vue-renderless/chart-pie/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +echarts.use([PieChart, LabelLayout, CanvasRenderer]) + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartPie', + data() { + this.chartHandler = pie + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-radar/index.ts b/packages/vue/src/chart/chart-radar/index.ts new file mode 100644 index 000000000..daf0caf4b --- /dev/null +++ b/packages/vue/src/chart/chart-radar/index.ts @@ -0,0 +1,21 @@ +import Radar from './src/index.js' +import { radar } from '@opentiny/vue-renderless/chart-radar/index' +import { version } from './package.json' + +/* istanbul ignore next */ +Radar.install = function (Vue) { + Vue.component(Radar.name, Radar) +} + +Radar.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Radar.install(window.Vue) + } +} + +export { radar } + +export default Radar diff --git a/packages/vue/src/chart/chart-radar/package.json b/packages/vue/src/chart/chart-radar/package.json new file mode 100644 index 000000000..643b407a9 --- /dev/null +++ b/packages/vue/src/chart/chart-radar/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-chart-radar", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-radar/src/index.ts b/packages/vue/src/chart/chart-radar/src/index.ts new file mode 100644 index 000000000..a9b858c43 --- /dev/null +++ b/packages/vue/src/chart/chart-radar/src/index.ts @@ -0,0 +1,20 @@ +import * as echarts from 'echarts/core' +import { RadarChart } from 'echarts/charts' +import { CanvasRenderer } from 'echarts/renderers' +import { radar } from '@opentiny/vue-renderless/chart-radar/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +echarts.use([RadarChart, CanvasRenderer]) + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartRadar', + data() { + this.chartHandler = radar + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-ring/index.ts b/packages/vue/src/chart/chart-ring/index.ts new file mode 100644 index 000000000..a0e022c26 --- /dev/null +++ b/packages/vue/src/chart/chart-ring/index.ts @@ -0,0 +1,18 @@ +import Ring from './src/index.js' +import { version } from './package.json' + +/* istanbul ignore next */ +Ring.install = function (Vue) { + Vue.component(Ring.name, Ring) +} + +Ring.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Ring.install(window.Vue) + } +} + +export default Ring diff --git a/packages/vue/src/chart/chart-ring/package.json b/packages/vue/src/chart/chart-ring/package.json new file mode 100644 index 000000000..5e936bc0b --- /dev/null +++ b/packages/vue/src/chart/chart-ring/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-chart-ring", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-ring/src/index.ts b/packages/vue/src/chart/chart-ring/src/index.ts new file mode 100644 index 000000000..279b68558 --- /dev/null +++ b/packages/vue/src/chart/chart-ring/src/index.ts @@ -0,0 +1,21 @@ +import * as echarts from 'echarts/core' +import { PieChart } from 'echarts/charts' +import { LabelLayout } from 'echarts/features' +import { CanvasRenderer } from 'echarts/renderers' +import { ring } from '@opentiny/vue-renderless/chart-pie/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +echarts.use([PieChart, LabelLayout, CanvasRenderer]) + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartRing', + data() { + this.chartHandler = ring + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-sankey/index.ts b/packages/vue/src/chart/chart-sankey/index.ts new file mode 100644 index 000000000..47502f679 --- /dev/null +++ b/packages/vue/src/chart/chart-sankey/index.ts @@ -0,0 +1,18 @@ +import Sankey from './src/index.js' +import { version } from './package.json' + +/* istanbul ignore next */ +Sankey.install = function (Vue) { + Vue.component(Sankey.name, Sankey) +} + +Sankey.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Sankey.install(window.Vue) + } +} + +export default Sankey diff --git a/packages/vue/src/chart/chart-sankey/package.json b/packages/vue/src/chart/chart-sankey/package.json new file mode 100644 index 000000000..6e278af11 --- /dev/null +++ b/packages/vue/src/chart/chart-sankey/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-chart-sankey", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-sankey/src/index.ts b/packages/vue/src/chart/chart-sankey/src/index.ts new file mode 100644 index 000000000..1b318bad7 --- /dev/null +++ b/packages/vue/src/chart/chart-sankey/src/index.ts @@ -0,0 +1,20 @@ +import * as echarts from 'echarts/core' +import { SankeyChart } from 'echarts/charts' +import { CanvasRenderer } from 'echarts/renderers' +import { sankey } from '@opentiny/vue-renderless/chart-sankey/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +echarts.use([SankeyChart, CanvasRenderer]) + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartSankey', + data() { + this.chartHandler = sankey + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-scatter/index.ts b/packages/vue/src/chart/chart-scatter/index.ts new file mode 100644 index 000000000..0c3a8ed6f --- /dev/null +++ b/packages/vue/src/chart/chart-scatter/index.ts @@ -0,0 +1,18 @@ +import Scatter from './src/index.js' +import { version } from './package.json' + +/* istanbul ignore next */ +Scatter.install = function (Vue) { + Vue.component(Scatter.name, Scatter) +} + +Scatter.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Scatter.install(window.Vue) + } +} + +export default Scatter diff --git a/packages/vue/src/chart/chart-scatter/package.json b/packages/vue/src/chart/chart-scatter/package.json new file mode 100644 index 000000000..aa66426b0 --- /dev/null +++ b/packages/vue/src/chart/chart-scatter/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-chart-scatter", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-scatter/src/index.ts b/packages/vue/src/chart/chart-scatter/src/index.ts new file mode 100644 index 000000000..f2f69d220 --- /dev/null +++ b/packages/vue/src/chart/chart-scatter/src/index.ts @@ -0,0 +1,22 @@ +import * as echarts from 'echarts/core' +import { GridComponent } from 'echarts/components' +import { ScatterChart } from 'echarts/charts' +import { UniversalTransition } from 'echarts/features' +import { CanvasRenderer } from 'echarts/renderers' +import { scatter } from '@opentiny/vue-renderless/chart-scatter/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +echarts.use([GridComponent, ScatterChart, UniversalTransition, CanvasRenderer]) + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartScatter', + data() { + this.chartHandler = scatter + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-sunburst/index.ts b/packages/vue/src/chart/chart-sunburst/index.ts new file mode 100644 index 000000000..1531adb23 --- /dev/null +++ b/packages/vue/src/chart/chart-sunburst/index.ts @@ -0,0 +1,18 @@ +import Sunburst from './src/index.js' +import { version } from './package.json' + +/* istanbul ignore next */ +Sunburst.install = function (Vue) { + Vue.component(Sunburst.name, Sunburst) +} + +Sunburst.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Sunburst.install(window.Vue) + } +} + +export default Sunburst diff --git a/packages/vue/src/chart/chart-sunburst/package.json b/packages/vue/src/chart/chart-sunburst/package.json new file mode 100644 index 000000000..3a10b7bd5 --- /dev/null +++ b/packages/vue/src/chart/chart-sunburst/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-chart-sunburst", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-sunburst/src/index.ts b/packages/vue/src/chart/chart-sunburst/src/index.ts new file mode 100644 index 000000000..d734e01df --- /dev/null +++ b/packages/vue/src/chart/chart-sunburst/src/index.ts @@ -0,0 +1,20 @@ +import * as echarts from 'echarts/core' +import { SunburstChart } from 'echarts/charts' +import { CanvasRenderer } from 'echarts/renderers' +import { sunburst } from '@opentiny/vue-renderless/chart-sunburst/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +echarts.use([SunburstChart, CanvasRenderer]) + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartSunburst', + data() { + this.chartHandler = sunburst + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-tree/index.ts b/packages/vue/src/chart/chart-tree/index.ts new file mode 100644 index 000000000..df655e80c --- /dev/null +++ b/packages/vue/src/chart/chart-tree/index.ts @@ -0,0 +1,18 @@ +import ChartTree from './src/index.js' +import { version } from './package.json' + +/* istanbul ignore next */ +ChartTree.install = function (Vue) { + Vue.component(ChartTree.name, ChartTree) +} + +ChartTree.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + ChartTree.install(window.Vue) + } +} + +export default ChartTree diff --git a/packages/vue/src/chart/chart-tree/package.json b/packages/vue/src/chart/chart-tree/package.json new file mode 100644 index 000000000..2995d9714 --- /dev/null +++ b/packages/vue/src/chart/chart-tree/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-chart-tree", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-tree/src/index.ts b/packages/vue/src/chart/chart-tree/src/index.ts new file mode 100644 index 000000000..876182c87 --- /dev/null +++ b/packages/vue/src/chart/chart-tree/src/index.ts @@ -0,0 +1,20 @@ +import * as echarts from 'echarts/core' +import { TreeChart } from 'echarts/charts' +import { CanvasRenderer } from 'echarts/renderers' +import { tree } from '@opentiny/vue-renderless/chart-tree/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +echarts.use([TreeChart, CanvasRenderer]) + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartTree', + data() { + this.chartHandler = tree + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-waterfall/index.ts b/packages/vue/src/chart/chart-waterfall/index.ts new file mode 100644 index 000000000..4add35a87 --- /dev/null +++ b/packages/vue/src/chart/chart-waterfall/index.ts @@ -0,0 +1,21 @@ +import Waterfall from './src/index.js' +import { waterfall } from '@opentiny/vue-renderless/chart-waterfall/index' +import { version } from './package.json' + +/* istanbul ignore next */ +Waterfall.install = function (Vue) { + Vue.component(Waterfall.name, Waterfall) +} + +Waterfall.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Waterfall.install(window.Vue) + } +} + +export { waterfall } + +export default Waterfall diff --git a/packages/vue/src/chart/chart-waterfall/package.json b/packages/vue/src/chart/chart-waterfall/package.json new file mode 100644 index 000000000..afd92608a --- /dev/null +++ b/packages/vue/src/chart/chart-waterfall/package.json @@ -0,0 +1,17 @@ +{ + "name": "@opentiny/vue-chart-waterfall", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-waterfall/src/index.ts b/packages/vue/src/chart/chart-waterfall/src/index.ts new file mode 100644 index 000000000..05aa3c445 --- /dev/null +++ b/packages/vue/src/chart/chart-waterfall/src/index.ts @@ -0,0 +1,21 @@ +import * as echarts from 'echarts/core' +import { GridComponent } from 'echarts/components' +import { BarChart } from 'echarts/charts' +import { CanvasRenderer } from 'echarts/renderers' +import { waterfall } from '@opentiny/vue-renderless/chart-waterfall/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +echarts.use([GridComponent, BarChart, CanvasRenderer]) + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartWaterfall', + data() { + this.chartHandler = waterfall + return {} + } + } +} +) diff --git a/packages/vue/src/chart/chart-wordcloud/index.ts b/packages/vue/src/chart/chart-wordcloud/index.ts new file mode 100644 index 000000000..5d8345544 --- /dev/null +++ b/packages/vue/src/chart/chart-wordcloud/index.ts @@ -0,0 +1,18 @@ +import Wordcloud from './src/index.js' +import { version } from './package.json' + +/* istanbul ignore next */ +Wordcloud.install = function (Vue) { + Vue.component(Wordcloud.name, Wordcloud) +} + +Wordcloud.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Wordcloud.install(window.Vue) + } +} + +export default Wordcloud diff --git a/packages/vue/src/chart/chart-wordcloud/package.json b/packages/vue/src/chart/chart-wordcloud/package.json new file mode 100644 index 000000000..0e23cf7d4 --- /dev/null +++ b/packages/vue/src/chart/chart-wordcloud/package.json @@ -0,0 +1,18 @@ +{ + "name": "@opentiny/vue-chart-wordcloud", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~", + "echarts-wordcloud": "2.0.0" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/chart-wordcloud/src/index.ts b/packages/vue/src/chart/chart-wordcloud/src/index.ts new file mode 100644 index 000000000..900e0b27c --- /dev/null +++ b/packages/vue/src/chart/chart-wordcloud/src/index.ts @@ -0,0 +1,16 @@ +import 'echarts-wordcloud' +import { wordcloud } from '@opentiny/vue-renderless/chart-wordcloud/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'ChartWordcloud', + data() { + this.chartHandler = wordcloud + return {} + } + } +} +) diff --git a/packages/vue/src/chart/index.ts b/packages/vue/src/chart/index.ts new file mode 100644 index 000000000..d7c07058e --- /dev/null +++ b/packages/vue/src/chart/index.ts @@ -0,0 +1,18 @@ +import Chart from './src/index.js' +import { version } from './package.json' + +/* istanbul ignore next */ +Chart.install = function (Vue) { + Vue.component(Chart.name, Chart) +} + +Chart.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Chart.install(window.Vue) + } +} + +export default Chart diff --git a/packages/vue/src/chart/package.json b/packages/vue/src/chart/package.json new file mode 100644 index 000000000..1fe7e926c --- /dev/null +++ b/packages/vue/src/chart/package.json @@ -0,0 +1,31 @@ +{ + "name": "@opentiny/vue-chart", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "files": [ + "index.js", + "lib" + ], + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-chart-core": "workspace:~", + "@opentiny/vue-chart-bar": "workspace:~", + "@opentiny/vue-chart-line": "workspace:~", + "@opentiny/vue-chart-pie": "workspace:~", + "@opentiny/vue-chart-funnel": "workspace:~", + "@opentiny/vue-chart-radar": "workspace:~", + "@opentiny/vue-chart-waterfall": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/chart/src/index.ts b/packages/vue/src/chart/src/index.ts new file mode 100644 index 000000000..075345cf3 --- /dev/null +++ b/packages/vue/src/chart/src/index.ts @@ -0,0 +1,37 @@ +import * as echarts from 'echarts/core' +import { ToolboxComponent, GridComponent } from 'echarts/components' +import { BarChart, FunnelChart, LineChart, PieChart, RadarChart } from 'echarts/charts' +import { LabelLayout, UniversalTransition } from 'echarts/features' +import { CanvasRenderer } from 'echarts/renderers' +import { bar, histogram } from '@opentiny/vue-renderless/chart-bar/index' +import { line } from '@opentiny/vue-renderless/chart-line/index' +import { pie, ring } from '@opentiny/vue-renderless/chart-pie/index' +import { funnel } from '@opentiny/vue-renderless/chart-funnel/index' +import { radar } from '@opentiny/vue-renderless/chart-radar/index' +import { waterfall } from '@opentiny/vue-renderless/chart-waterfall/index' +import Core from '@opentiny/vue-chart-core' +import { $prefix, defineComponent } from '@opentiny/vue-common' + +echarts.use([ToolboxComponent, GridComponent, BarChart, FunnelChart, LineChart, PieChart, RadarChart, LabelLayout, UniversalTransition, CanvasRenderer]) + +export default defineComponent({ + ...Core, + ...{ + name: $prefix + 'Chart', + data() { + this.chartLib = { + bar, + funnel, + histogram, + line, + pie, + radar, + ring, + waterfall + } + this.chartHandler = this.chartLib[this.settings.type] + return {} + } + } +} +) diff --git a/packages/vue/src/checkbox-button/index.ts b/packages/vue/src/checkbox-button/index.ts new file mode 100644 index 000000000..f5f17492f --- /dev/null +++ b/packages/vue/src/checkbox-button/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import CheckboxButton from './src/index' +import '@opentiny/vue-theme/checkbox-button/index.less' +import { version } from './package.json' + +CheckboxButton.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +CheckboxButton.install = function (Vue) { + Vue.component(CheckboxButton.name, CheckboxButton) +} + +CheckboxButton.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + CheckboxButton.install(window.Vue) + } +} + +export default CheckboxButton diff --git a/packages/vue/src/checkbox-button/package.json b/packages/vue/src/checkbox-button/package.json new file mode 100644 index 000000000..fb04661d2 --- /dev/null +++ b/packages/vue/src/checkbox-button/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-checkbox-button", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/checkbox-button/src/index.ts b/packages/vue/src/checkbox-button/src/index.ts new file mode 100644 index 000000000..c02bd5687 --- /dev/null +++ b/packages/vue/src/checkbox-button/src/index.ts @@ -0,0 +1,44 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + CHECKBOX_GROUP: 'CheckboxGroup' +} + +export default defineComponent({ + name: $prefix + 'CheckboxButton', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + modelValue: {}, + label: {}, + disabled: Boolean, + checked: Boolean, + name: String, + trueLabel: [String, Number], + falseLabel: [String, Number], + text: String, + events: { + type: Object, + default: () => ({}) + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/checkbox-button/src/pc.vue b/packages/vue/src/checkbox-button/src/pc.vue new file mode 100644 index 000000000..42480e751 --- /dev/null +++ b/packages/vue/src/checkbox-button/src/pc.vue @@ -0,0 +1,68 @@ + + + + diff --git a/packages/vue/src/checkbox-group/index.ts b/packages/vue/src/checkbox-group/index.ts new file mode 100644 index 000000000..4cccca633 --- /dev/null +++ b/packages/vue/src/checkbox-group/index.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import CheckboxGroup from './src/index' +import { version } from './package.json' + +CheckboxGroup.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +CheckboxGroup.install = function (Vue) { + Vue.component(CheckboxGroup.name, CheckboxGroup) +} + +CheckboxGroup.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + CheckboxGroup.install(window.Vue) + } +} + +export default CheckboxGroup diff --git a/packages/vue/src/checkbox-group/package.json b/packages/vue/src/checkbox-group/package.json new file mode 100644 index 000000000..2bc052fb9 --- /dev/null +++ b/packages/vue/src/checkbox-group/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-checkbox-group", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-checkbox": "workspace:~", + "@opentiny/vue-checkbox-button": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/checkbox-group/src/index.ts b/packages/vue/src/checkbox-group/src/index.ts new file mode 100644 index 000000000..e37c90582 --- /dev/null +++ b/packages/vue/src/checkbox-group/src/index.ts @@ -0,0 +1,51 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +const $constants = { + FORM_ITEM: 'FormItem', + FORM_CHANGE: 'form.change' +} + +export default defineComponent({ + name: $prefix + 'CheckboxGroup', + componentName: 'CheckboxGroup', + emits: ['change', 'update:modelValue'], + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + modelValue: {}, + disabled: Boolean, + min: Number, + max: Number, + size: String, + fill: String, + textColor: String, + vertical: Boolean, + options: { + type: Array, + default: () => [] + }, + type: { + type: String, + default: 'checkbox' + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/checkbox-group/src/mobile.vue b/packages/vue/src/checkbox-group/src/mobile.vue new file mode 100644 index 000000000..a87f940f0 --- /dev/null +++ b/packages/vue/src/checkbox-group/src/mobile.vue @@ -0,0 +1,38 @@ + + + + diff --git a/packages/vue/src/checkbox-group/src/pc.vue b/packages/vue/src/checkbox-group/src/pc.vue new file mode 100644 index 000000000..b5bc066b6 --- /dev/null +++ b/packages/vue/src/checkbox-group/src/pc.vue @@ -0,0 +1,42 @@ + + + + diff --git a/packages/vue/src/checkbox/index.ts b/packages/vue/src/checkbox/index.ts new file mode 100644 index 000000000..0618aacff --- /dev/null +++ b/packages/vue/src/checkbox/index.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Checkbox from './src/index' +import { version } from './package.json' + +Checkbox.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Checkbox.install = function (Vue) { + Vue.component(Checkbox.name, Checkbox) +} + +Checkbox.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Checkbox.install(window.Vue) + } +} + +export default Checkbox diff --git a/packages/vue/src/checkbox/package.json b/packages/vue/src/checkbox/package.json new file mode 100644 index 000000000..7e77bea64 --- /dev/null +++ b/packages/vue/src/checkbox/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-checkbox", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/checkbox/src/index.ts b/packages/vue/src/checkbox/src/index.ts new file mode 100644 index 000000000..2e1e118cf --- /dev/null +++ b/packages/vue/src/checkbox/src/index.ts @@ -0,0 +1,64 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +const $constants = { + FORM_ITEM: 'FormItem', + FORM_CHANGE: 'form.change', + CHECKBOX: $prefix + 'Checkbox', + CHECKBOX_GROUP: 'CheckboxGroup' +} + +export default defineComponent({ + name: $prefix + 'Checkbox', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + modelValue: {}, + label: {}, + indeterminate: Boolean, + disabled: Boolean, + checked: Boolean, + name: String, + trueLabel: [String, Number], + falseLabel: [String, Number], + + /* + * 当indeterminate为真时,为controls提供相关连的checkbox的id,表明元素间的控制关系 + */ + id: String, + + /* + * 当indeterminate为真时,为controls提供相关连的checkbox的id,表明元素间的控制关系 + */ + controls: String, + border: Boolean, + size: String, + text: String, + validateEvent: { + type: Boolean, + default: true + }, + events: { + type: Object, + default: () => ({}) + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/checkbox/src/mobile.vue b/packages/vue/src/checkbox/src/mobile.vue new file mode 100644 index 000000000..307df72fd --- /dev/null +++ b/packages/vue/src/checkbox/src/mobile.vue @@ -0,0 +1,76 @@ + + + + diff --git a/packages/vue/src/checkbox/src/pc.vue b/packages/vue/src/checkbox/src/pc.vue new file mode 100644 index 000000000..d07533050 --- /dev/null +++ b/packages/vue/src/checkbox/src/pc.vue @@ -0,0 +1,112 @@ + + + + diff --git a/packages/vue/src/col/index.ts b/packages/vue/src/col/index.ts new file mode 100644 index 000000000..6134a09ea --- /dev/null +++ b/packages/vue/src/col/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Col from './src/index' +import '@opentiny/vue-theme/col/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Col.install = function (Vue) { + Vue.component(Col.name, Col) +} + +Col.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Col.install(window.Vue) + } +} + +export default Col diff --git a/packages/vue/src/col/package.json b/packages/vue/src/col/package.json new file mode 100644 index 000000000..03c656e40 --- /dev/null +++ b/packages/vue/src/col/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-col", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/col/src/index.ts b/packages/vue/src/col/src/index.ts new file mode 100644 index 000000000..c28fa58fc --- /dev/null +++ b/packages/vue/src/col/src/index.ts @@ -0,0 +1,101 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'Col', + props: { + ...$props, + + /** + * @property {number} [span=12] - 栅格占据的列数(一行以12栅格划分) + */ + span: { + type: Number, + default: 12, + validator: (value) => Math.floor(value) === value && value > 0 && value <= 12 + }, + + /** + * @property {number} [offset=0] - 栅格左侧的间隔格数 + */ + offset: { + type: Number, + default: 0, + validator: (value) => value >= 0 + }, + + /** + * @property {no} [no=0] - 排序编号 + */ + no: { + type: Number, + default: 0 + }, + + /** + * @property {number} [move=0] - 栅格向左向右移动格数 + */ + move: { + type: Number, + default: 0 + }, + + /** + * @property {(number|object)} xs - <768px 响应式栅格数或者栅格属性对象 + */ + xs: { + type: [Number, Object] + }, + + /** + * @property {(number|object)} sm - ≥768px 响应式栅格数或者栅格属性对象 + */ + sm: { + type: [Number, Object] + }, + + /** + * @property {(number|object)} md - ≥992px 响应式栅格数或者栅格属性对象 + */ + md: { + type: [Number, Object] + }, + + /** + * @property {(number|object)} lg - ≥1200px 响应式栅格数或者栅格属性对象 + */ + lg: { + type: [Number, Object] + }, + + /** + * @property {(number|object)} xl - ≥1920px 响应式栅格数或者栅格属性对象 + */ + xl: { + type: [Number, Object] + }, + + /** + * @property {string} [tag=div] - 自定义元素标签 + */ + tag: { + type: String, + default: 'div' + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/col/src/pc.vue b/packages/vue/src/col/src/pc.vue new file mode 100644 index 000000000..7fe4c8265 --- /dev/null +++ b/packages/vue/src/col/src/pc.vue @@ -0,0 +1,28 @@ + + + + diff --git a/packages/vue/src/collapse-item/index.ts b/packages/vue/src/collapse-item/index.ts new file mode 100644 index 000000000..9f01389ef --- /dev/null +++ b/packages/vue/src/collapse-item/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import CollapseItem from './src/index' +import '@opentiny/vue-theme/collapse-item/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +CollapseItem.install = function (Vue) { + Vue.component(CollapseItem.name, CollapseItem) +} + +CollapseItem.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + CollapseItem.install(window.Vue) + } +} + +export default CollapseItem diff --git a/packages/vue/src/collapse-item/package.json b/packages/vue/src/collapse-item/package.json new file mode 100644 index 000000000..baec07751 --- /dev/null +++ b/packages/vue/src/collapse-item/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-collapse-item", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/collapse-item/src/index.ts b/packages/vue/src/collapse-item/src/index.ts new file mode 100644 index 000000000..acfc23bcf --- /dev/null +++ b/packages/vue/src/collapse-item/src/index.ts @@ -0,0 +1,42 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + INTERVAL: 50 +} + +export default defineComponent({ + name: $prefix + 'CollapseItem', + componentName: 'CollapseItem', + inject: ['collapse'], + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + title: String, + name: { + type: [String, Number], + default() { + return this._uid + } + }, + disabled: Boolean + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/collapse-item/src/pc.vue b/packages/vue/src/collapse-item/src/pc.vue new file mode 100644 index 000000000..c68d218fc --- /dev/null +++ b/packages/vue/src/collapse-item/src/pc.vue @@ -0,0 +1,73 @@ + + + + diff --git a/packages/vue/src/collapse-transition/index.ts b/packages/vue/src/collapse-transition/index.ts new file mode 100644 index 000000000..351046b0b --- /dev/null +++ b/packages/vue/src/collapse-transition/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import CollapseTransition from './src/index.vue' +import '@opentiny/vue-theme/collapse/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +CollapseTransition.install = function (Vue) { + Vue.component(CollapseTransition.name, CollapseTransition) +} + +CollapseTransition.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + CollapseTransition.install(window.Vue) + } +} + +export default CollapseTransition diff --git a/packages/vue/src/collapse-transition/package.json b/packages/vue/src/collapse-transition/package.json new file mode 100644 index 000000000..bfd897b23 --- /dev/null +++ b/packages/vue/src/collapse-transition/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-collapse-transition", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/collapse-transition/src/index.vue b/packages/vue/src/collapse-transition/src/index.vue new file mode 100644 index 000000000..9870ef05b --- /dev/null +++ b/packages/vue/src/collapse-transition/src/index.vue @@ -0,0 +1,96 @@ + + + + diff --git a/packages/vue/src/collapse/index.ts b/packages/vue/src/collapse/index.ts new file mode 100644 index 000000000..474573363 --- /dev/null +++ b/packages/vue/src/collapse/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Collapse from './src/index' +import '@opentiny/vue-theme/collapse/index.less' +import { version } from './package.json' + +Collapse.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Collapse.install = function (Vue) { + Vue.component(Collapse.name, Collapse) +} + +Collapse.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Collapse.install(window.Vue) + } +} + +export default Collapse diff --git a/packages/vue/src/collapse/package.json b/packages/vue/src/collapse/package.json new file mode 100644 index 000000000..882472bc9 --- /dev/null +++ b/packages/vue/src/collapse/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-collapse", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/collapse/src/index.ts b/packages/vue/src/collapse/src/index.ts new file mode 100644 index 000000000..25c22979b --- /dev/null +++ b/packages/vue/src/collapse/src/index.ts @@ -0,0 +1,51 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + COMPONENT_NAME: { + Collapse: 'Collapse' + }, + EVENT_NAME: { + CollapseItemClick: 'collapse-item.click' + } +} + +export default defineComponent({ + name: $prefix + 'Collapse', + componentName: 'Collapse', + provide() { + return { + collapse: this + } + }, + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + accordion: Boolean, + beforeClose: Function, + modelValue: { + type: [Array, String, Number], + default() { + return [] + } + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/collapse/src/pc.vue b/packages/vue/src/collapse/src/pc.vue new file mode 100644 index 000000000..872fe0be8 --- /dev/null +++ b/packages/vue/src/collapse/src/pc.vue @@ -0,0 +1,28 @@ + + + + diff --git a/packages/vue/src/company/index.ts b/packages/vue/src/company/index.ts new file mode 100644 index 000000000..4bdcd6224 --- /dev/null +++ b/packages/vue/src/company/index.ts @@ -0,0 +1,23 @@ +import Company from './src/index' +import '@opentiny/vue-theme/company/index.less' + +Company.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Company.install = function (Vue) { + Vue.component(Company.name, Company) +} + +Company.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Company.install(window.Vue) + } +} + +export default Company diff --git a/packages/vue/src/company/package.json b/packages/vue/src/company/package.json new file mode 100644 index 000000000..290da8d49 --- /dev/null +++ b/packages/vue/src/company/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-company", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-select": "workspace:~", + "@opentiny/vue-option": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/company/src/index.ts b/packages/vue/src/company/src/index.ts new file mode 100644 index 000000000..7ae6bc19f --- /dev/null +++ b/packages/vue/src/company/src/index.ts @@ -0,0 +1,38 @@ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'Company', + props: { + ...$props, + clearable: { + type: Boolean, + default: () => true + }, + disabled: { + type: Boolean, + default: () => false + }, + fetchCompany: Function, + fields: Object, + max: { + type: Number, + default: 1000 + }, + modelValue: {}, + placeholder: { + type: String, + default: () => '' + }, + popperAppendToBody: { + type: Boolean, + default: () => true + }, + popperClass: String, + size: String + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/company/src/pc.vue b/packages/vue/src/company/src/pc.vue new file mode 100644 index 000000000..a5a7c7b3c --- /dev/null +++ b/packages/vue/src/company/src/pc.vue @@ -0,0 +1,47 @@ + + + + diff --git a/packages/vue/src/container/index.ts b/packages/vue/src/container/index.ts new file mode 100644 index 000000000..f05a7fc1a --- /dev/null +++ b/packages/vue/src/container/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Container from './src/index' +import '@opentiny/vue-theme/container/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Container.install = function (Vue) { + Vue.component(Container.name, Container) +} + +Container.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Container.install(window.Vue) + } +} + +export default Container diff --git a/packages/vue/src/container/package.json b/packages/vue/src/container/package.json new file mode 100644 index 000000000..10756a3c1 --- /dev/null +++ b/packages/vue/src/container/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-container", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/container/src/index.ts b/packages/vue/src/container/src/index.ts new file mode 100644 index 000000000..c01a07abc --- /dev/null +++ b/packages/vue/src/container/src/index.ts @@ -0,0 +1,53 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + DEFAULT: 'default', + SIMPLE: 'simple', + LEGEND: 'legend', + CLASSIC: 'classic', + FASHION: 'fashion' +} + +export default defineComponent({ + name: $prefix + 'Container', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + pattern: { + type: String, + default: 'default', + validator: (value) => !!$constants[value.toUpperCase()] + }, + headerHeight: { + type: [Number, String], + default: 60 + }, + asideWidth: { + type: [Number, String], + default: 200 + }, + footerHeight: { + type: [Number, String], + default: 60 + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/container/src/pc.vue b/packages/vue/src/container/src/pc.vue new file mode 100644 index 000000000..ecb283aa4 --- /dev/null +++ b/packages/vue/src/container/src/pc.vue @@ -0,0 +1,39 @@ + + + + diff --git a/packages/vue/src/country/index.ts b/packages/vue/src/country/index.ts new file mode 100644 index 000000000..6a332438a --- /dev/null +++ b/packages/vue/src/country/index.ts @@ -0,0 +1,24 @@ +import Country from './src/index' +import '@opentiny/vue-theme/country/index.less' +import { version } from './package.json' + +Country.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Country.install = function (Vue) { + Vue.component(Country.name, Country) +} + +Country.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Country.install(window.Vue) + } +} + +export default Country diff --git a/packages/vue/src/country/package.json b/packages/vue/src/country/package.json new file mode 100644 index 000000000..cfedfd7e6 --- /dev/null +++ b/packages/vue/src/country/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-country", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-select": "workspace:~", + "@opentiny/vue-option": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/country/src/index.ts b/packages/vue/src/country/src/index.ts new file mode 100644 index 000000000..b6ee7436e --- /dev/null +++ b/packages/vue/src/country/src/index.ts @@ -0,0 +1,34 @@ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'Country', + props: { + ...$props, + disabled: { + type: Boolean, + default: () => false + }, + clearable: { + type: Boolean, + default: () => true + }, + fetchCountry: Function, + fields: Object, + placeholder: { + type: String, + default: () => '' + }, + modelValue: {}, + popperClass: String, + popperAppendToBody: { + type: Boolean, + default: () => true + }, + size: String + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/country/src/pc.vue b/packages/vue/src/country/src/pc.vue new file mode 100644 index 000000000..cae86027f --- /dev/null +++ b/packages/vue/src/country/src/pc.vue @@ -0,0 +1,47 @@ + + + + diff --git a/packages/vue/src/credit-card-form/index.ts b/packages/vue/src/credit-card-form/index.ts new file mode 100644 index 000000000..939ebbcaf --- /dev/null +++ b/packages/vue/src/credit-card-form/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import CreditCardForm from './src/index' +import '@opentiny/vue-theme/credit-card-form/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +CreditCardForm.install = function (Vue) { + Vue.component(CreditCardForm.name, CreditCardForm) +} + +CreditCardForm.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + CreditCardForm.install(window.Vue) + } +} + +export default CreditCardForm diff --git a/packages/vue/src/credit-card-form/package.json b/packages/vue/src/credit-card-form/package.json new file mode 100644 index 000000000..7b11c63b4 --- /dev/null +++ b/packages/vue/src/credit-card-form/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-credit-card-form", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-credit-card": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/credit-card-form/src/index.ts b/packages/vue/src/credit-card-form/src/index.ts new file mode 100644 index 000000000..ee864c90a --- /dev/null +++ b/packages/vue/src/credit-card-form/src/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'CreditCardForm', + props: { + ...$props, + backgroundImage: [String, Object], + formData: { + type: Object, + default: () => ({ cardYear: '', cardNumber: '', cardName: '', cardMonth: '', cardCvv: '' }) + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/credit-card-form/src/pc.vue b/packages/vue/src/credit-card-form/src/pc.vue new file mode 100644 index 000000000..bedd91a39 --- /dev/null +++ b/packages/vue/src/credit-card-form/src/pc.vue @@ -0,0 +1,123 @@ + + + + diff --git a/packages/vue/src/credit-card/index.ts b/packages/vue/src/credit-card/index.ts new file mode 100644 index 000000000..3fe800359 --- /dev/null +++ b/packages/vue/src/credit-card/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import CreditCard from './src/index' +import '@opentiny/vue-theme/credit-card/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +CreditCard.install = function (Vue) { + Vue.component(CreditCard.name, CreditCard) +} + +CreditCard.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + CreditCard.install(window.Vue) + } +} + +export default CreditCard diff --git a/packages/vue/src/credit-card/package.json b/packages/vue/src/credit-card/package.json new file mode 100644 index 000000000..93299393a --- /dev/null +++ b/packages/vue/src/credit-card/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-credit-card", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/credit-card/src/index.ts b/packages/vue/src/credit-card/src/index.ts new file mode 100644 index 000000000..edbf68be7 --- /dev/null +++ b/packages/vue/src/credit-card/src/index.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'CreditCard', + props: { + ...$props, + backgroundImage: [String, Object], + isCardNumberMasked: Boolean, + fields: { + type: Object, + default: () => ({}) + }, + labels: { + type: Object, + default: () => ({ cardCvv: '', cardMonth: '', cardName: '', cardNumber: '', cardYear: '' }) + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/credit-card/src/pc.vue b/packages/vue/src/credit-card/src/pc.vue new file mode 100644 index 000000000..fe1826ac4 --- /dev/null +++ b/packages/vue/src/credit-card/src/pc.vue @@ -0,0 +1,128 @@ + + + + diff --git a/packages/vue/src/crop/index.ts b/packages/vue/src/crop/index.ts new file mode 100644 index 000000000..16aab5f04 --- /dev/null +++ b/packages/vue/src/crop/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Crop from './src/index.vue' +import '@opentiny/vue-theme/crop/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Crop.install = function (Vue) { + Vue.component(Crop.name, Crop) +} + +Crop.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Crop.install(window.Vue) + } +} + +export default Crop diff --git a/packages/vue/src/crop/package.json b/packages/vue/src/crop/package.json new file mode 100644 index 000000000..479d29e58 --- /dev/null +++ b/packages/vue/src/crop/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-crop", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "cropperjs": "1.5.7" + }, + "license": "MIT" +} diff --git a/packages/vue/src/crop/src/index.vue b/packages/vue/src/crop/src/index.vue new file mode 100644 index 000000000..d8bfae47a --- /dev/null +++ b/packages/vue/src/crop/src/index.vue @@ -0,0 +1,193 @@ + + + + diff --git a/packages/vue/src/currency/index.ts b/packages/vue/src/currency/index.ts new file mode 100644 index 000000000..39b766fa7 --- /dev/null +++ b/packages/vue/src/currency/index.ts @@ -0,0 +1,24 @@ +import Currency from './src/index' +import '@opentiny/vue-theme/currency/index.less' +import { version } from './package.json' + +Currency.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Currency.install = function (Vue) { + Vue.component(Currency.name, Currency) +} + +Currency.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Currency.install(window.Vue) + } +} + +export default Currency diff --git a/packages/vue/src/currency/package.json b/packages/vue/src/currency/package.json new file mode 100644 index 000000000..2a0fbb740 --- /dev/null +++ b/packages/vue/src/currency/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-currency", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-select": "workspace:~", + "@opentiny/vue-option": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/currency/src/index.ts b/packages/vue/src/currency/src/index.ts new file mode 100644 index 000000000..35578bb87 --- /dev/null +++ b/packages/vue/src/currency/src/index.ts @@ -0,0 +1,38 @@ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'Currency', + props: { + ...$props, + clearable: { + type: Boolean, + default: true + }, + currency: { + type: String, + default: 'CNY' + }, + disabled: { + type: Boolean, + default: false + }, + fetchCurrency: Function, + fields: Object, + modelValue: {}, + placeholder: { + type: String, + default: '' + }, + popperAppendToBody: { + type: Boolean, + default: true + }, + popperClass: String, + size: String + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/currency/src/pc.vue b/packages/vue/src/currency/src/pc.vue new file mode 100644 index 000000000..c531ca587 --- /dev/null +++ b/packages/vue/src/currency/src/pc.vue @@ -0,0 +1,36 @@ + + + diff --git a/packages/vue/src/date-panel/index.ts b/packages/vue/src/date-panel/index.ts new file mode 100644 index 000000000..ba6ac772d --- /dev/null +++ b/packages/vue/src/date-panel/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import DatePanel from './src/index.vue' +import { version } from './package.json' + +/* istanbul ignore next */ +DatePanel.install = function (Vue) { + Vue.component(DatePanel.name, DatePanel) +} + +DatePanel.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + DatePanel.install(window.Vue) + } +} + +export default DatePanel diff --git a/packages/vue/src/date-panel/package.json b/packages/vue/src/date-panel/package.json new file mode 100644 index 000000000..ac600b736 --- /dev/null +++ b/packages/vue/src/date-panel/package.json @@ -0,0 +1,27 @@ +{ + "name": "@opentiny/vue-date-panel", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-input": "workspace:~", + "@opentiny/vue-button": "workspace:~", + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-time": "workspace:~", + "@opentiny/vue-date-table": "workspace:~", + "@opentiny/vue-year-table": "workspace:~", + "@opentiny/vue-month-table": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/date-panel/src/index.vue b/packages/vue/src/date-panel/src/index.vue new file mode 100644 index 000000000..0e604912f --- /dev/null +++ b/packages/vue/src/date-panel/src/index.vue @@ -0,0 +1,243 @@ + + + + diff --git a/packages/vue/src/date-picker/index.ts b/packages/vue/src/date-picker/index.ts new file mode 100644 index 000000000..16ad9a29a --- /dev/null +++ b/packages/vue/src/date-picker/index.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import DatePicker from './src/index.js' +import { version } from './package.json' + +DatePicker.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +DatePicker.install = function (Vue) { + Vue.component(DatePicker.name, DatePicker) +} + +DatePicker.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + DatePicker.install(window.Vue) + } +} + +export default DatePicker diff --git a/packages/vue/src/date-picker/package.json b/packages/vue/src/date-picker/package.json new file mode 100644 index 000000000..f2ef97870 --- /dev/null +++ b/packages/vue/src/date-picker/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-date-picker", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-picker": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/date-picker/src/index.ts b/packages/vue/src/date-picker/src/index.ts new file mode 100644 index 000000000..757cb86a6 --- /dev/null +++ b/packages/vue/src/date-picker/src/index.ts @@ -0,0 +1,143 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $setup, $prefix, defineComponent } from '@opentiny/vue-common' +import { iconOperationfaild } from '@opentiny/vue-icon' +import template from 'virtual-template?pc|mobile' + +const currentYear = new Date().getFullYear() + +const $constants = { + MonthDay: 32, + Minutes: 59, + Hours: 23, + TotalMonth: 12, + Max: 'max', + Min: 'min', + Hour: 'hour', + Minute: 'minute', + CapYear: 'Year', + CapMonth: 'Month', + CapDate: 'Date', + CapHour: 'Hour', + CapMinute: 'Minute', + YearMonth: 'year-month', + DateTime: 'datetime', + Date: 'date', + HookMounted: 'hook-mounted', + Hidden: 'hidden', + Year: 'year', + Day: 'day' +} + +const validator = (value) => { + const result = + value === null || + value === undefined || + typeof value === 'string' || + value instanceof String || + (Array.isArray(value) && value.length === 2 && value.every((item) => typeof item === 'string' || item instanceof String)) + + return result +} + +export default defineComponent({ + name: $prefix + 'DatePicker', + props: { + ...$props, + type: { + type: String, + default: 'date' + }, + _constants: { + type: Object, + default: () => $constants + }, + timeArrowControl: Boolean, + size: String, + format: String, + valueFormat: String, + readonly: Boolean, + placeholder: String, + startPlaceholder: String, + endPlaceholder: String, + prefixIcon: Object, + clearIcon: { + type: Object, + default() { + return iconOperationfaild() + } + }, + name: { + default: '', + validator + }, + disabled: Boolean, + clearable: { + type: Boolean, + default: true + }, + id: { + default: '', + validator + }, + popperClass: String, + editable: { + type: Boolean, + default: true + }, + align: { + type: String, + default: 'left' + }, + modelValue: {}, + defaultValue: {}, + defaultTime: {}, + rangeSeparator: { + type: [Object, String], + default: '-' + }, + pickerOptions: {}, + unlinkPanels: Boolean, + validateEvent: { + type: Boolean, + default: true + }, + isRange: Boolean, + arrowControl: Boolean, + timezoneData: {}, + showTimezone: { + type: Boolean, + default: false + }, + defaultTimezone: {}, + visible: Boolean, + minDate: { + type: Date, + default: () => new Date(currentYear - 10, 0, 1), + validator: (val) => Object.prototype.toString.call(val) === '[object Date]' && !isNaN(val.getTime()) + }, + maxDate: { + type: Date, + default: () => new Date(currentYear + 10, 11, 31), + validator: (val) => Object.prototype.toString.call(val) === '[object Date]' && !isNaN(val.getTime()) + }, + formatter: { + type: Function, + default: (type, value) => value + }, + componentName: { type: String, default: 'DatePicker' } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/date-picker/src/mobile.vue b/packages/vue/src/date-picker/src/mobile.vue new file mode 100644 index 000000000..550fa91b9 --- /dev/null +++ b/packages/vue/src/date-picker/src/mobile.vue @@ -0,0 +1,46 @@ + + + + diff --git a/packages/vue/src/date-picker/src/pc.vue b/packages/vue/src/date-picker/src/pc.vue new file mode 100644 index 000000000..6a65f1aa4 --- /dev/null +++ b/packages/vue/src/date-picker/src/pc.vue @@ -0,0 +1,33 @@ + + diff --git a/packages/vue/src/date-range/index.ts b/packages/vue/src/date-range/index.ts new file mode 100644 index 000000000..42400eae2 --- /dev/null +++ b/packages/vue/src/date-range/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import DateRange from './src/index.vue' +import { version } from './package.json' + +/* istanbul ignore next */ +DateRange.install = function (Vue) { + Vue.component(DateRange.name, DateRange) +} + +DateRange.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + DateRange.install(window.Vue) + } +} + +export default DateRange diff --git a/packages/vue/src/date-range/package.json b/packages/vue/src/date-range/package.json new file mode 100644 index 000000000..bba7ffc18 --- /dev/null +++ b/packages/vue/src/date-range/package.json @@ -0,0 +1,25 @@ +{ + "name": "@opentiny/vue-date-range", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-input": "workspace:~", + "@opentiny/vue-button": "workspace:~", + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-time": "workspace:~", + "@opentiny/vue-date-table": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/date-range/src/index.vue b/packages/vue/src/date-range/src/index.vue new file mode 100644 index 000000000..8294cb643 --- /dev/null +++ b/packages/vue/src/date-range/src/index.vue @@ -0,0 +1,247 @@ + + + + diff --git a/packages/vue/src/date-table/index.ts b/packages/vue/src/date-table/index.ts new file mode 100644 index 000000000..0770d36c9 --- /dev/null +++ b/packages/vue/src/date-table/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import DateTable from './src/index.vue' +import { version } from './package.json' + +/* istanbul ignore next */ +DateTable.install = function (Vue) { + Vue.component(DateTable.name, DateTable) +} + +DateTable.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + DateTable.install(window.Vue) + } +} + +export default DateTable diff --git a/packages/vue/src/date-table/package.json b/packages/vue/src/date-table/package.json new file mode 100644 index 000000000..e72a40609 --- /dev/null +++ b/packages/vue/src/date-table/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-date-table", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/date-table/src/index.vue b/packages/vue/src/date-table/src/index.vue new file mode 100644 index 000000000..d6776508c --- /dev/null +++ b/packages/vue/src/date-table/src/index.vue @@ -0,0 +1,85 @@ + + + + diff --git a/packages/vue/src/dept/index.ts b/packages/vue/src/dept/index.ts new file mode 100644 index 000000000..334d3f635 --- /dev/null +++ b/packages/vue/src/dept/index.ts @@ -0,0 +1,24 @@ +import Dept from './src/index' +import '@opentiny/vue-theme/dept/index.less' +import { version } from './package.json' + +Dept.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Dept.install = function (Vue) { + Vue.component(Dept.name, Dept) +} + +Dept.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Dept.install(window.Vue) + } +} + +export default Dept diff --git a/packages/vue/src/dept/package.json b/packages/vue/src/dept/package.json new file mode 100644 index 000000000..8f70ad9ce --- /dev/null +++ b/packages/vue/src/dept/package.json @@ -0,0 +1,27 @@ +{ + "name": "@opentiny/vue-dept", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-select": "workspace:~", + "@opentiny/vue-option": "workspace:~", + "@opentiny/vue-row": "workspace:~", + "@opentiny/vue-col": "workspace:~", + "@opentiny/vue-modal": "workspace:~", + "@opentiny/vue-input": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/dept/src/index.ts b/packages/vue/src/dept/src/index.ts new file mode 100644 index 000000000..0b01448f5 --- /dev/null +++ b/packages/vue/src/dept/src/index.ts @@ -0,0 +1,31 @@ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'Dept', + props: { + ...$props, + modelValue: String, + disabled: { + type: Boolean, + default: false + }, + autoSelect: { + type: Boolean, + default: true + }, + size: String, + fetchDeptList: Function, + fetchDeptByValue: Function, + fetchDept: Function, + beforeConfirm: Function, + title: { + type: String, + default: '' + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/dept/src/pc.vue b/packages/vue/src/dept/src/pc.vue new file mode 100644 index 000000000..0fdb75c4e --- /dev/null +++ b/packages/vue/src/dept/src/pc.vue @@ -0,0 +1,112 @@ + + + diff --git a/packages/vue/src/detail-page/index.ts b/packages/vue/src/detail-page/index.ts new file mode 100644 index 000000000..c2f425c42 --- /dev/null +++ b/packages/vue/src/detail-page/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import DetailPage from './src/index' +import '@opentiny/vue-theme/detail-page/index.less' +import { version } from './package.json' + +DetailPage.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +DetailPage.install = function (Vue) { + Vue.component(DetailPage.name, DetailPage) +} + +DetailPage.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + DetailPage.install(window.Vue) + } +} + +export default DetailPage diff --git a/packages/vue/src/detail-page/package.json b/packages/vue/src/detail-page/package.json new file mode 100644 index 000000000..5d4aa8c07 --- /dev/null +++ b/packages/vue/src/detail-page/package.json @@ -0,0 +1,24 @@ +{ + "name": "@opentiny/vue-detail-page", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-checkbox": "workspace:~", + "@opentiny/vue-button": "workspace:~", + "@opentiny/vue-modal": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/detail-page/src/index.ts b/packages/vue/src/detail-page/src/index.ts new file mode 100644 index 000000000..332236be4 --- /dev/null +++ b/packages/vue/src/detail-page/src/index.ts @@ -0,0 +1,71 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + LOCAL_TIPS: 'ui.detailpage.localTips', + LOCAL_TITLE: 'ui.detailpage.localTitle', + VALUE_TITLE: 'ui.detailpage.valueTitle', + LABEL_TITLE: 'ui.detailpage.labelTitle', + DIALOG_TITLE: 'ui.detailpage.dialogTitle', + SAVE_BUTTON_TEXT: 'ui.detailpage.saveButtonText', + CANCEL_BUTTTON_TEXT: 'ui.detailpage.cancelButtonText' +} + +export default defineComponent({ + name: $prefix + 'DetailPage', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + modelValue: Array, + title: { + type: String, + default: '' + }, + textSplit: { + type: String, + default: '---' + }, + dialogTitle: { + type: String, + default: '' + }, + labelTitle: { + type: String, + default: '' + }, + tips: { + type: String, + default: '' + }, + valueTitle: { + type: String, + default: '' + }, + saveButton: { + type: String, + default: '' + }, + cancelButton: { + type: String, + default: '' + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/detail-page/src/pc.vue b/packages/vue/src/detail-page/src/pc.vue new file mode 100644 index 000000000..d19a48c84 --- /dev/null +++ b/packages/vue/src/detail-page/src/pc.vue @@ -0,0 +1,76 @@ + + + + diff --git a/packages/vue/src/dialog-box/index.ts b/packages/vue/src/dialog-box/index.ts new file mode 100644 index 000000000..69c503eac --- /dev/null +++ b/packages/vue/src/dialog-box/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import DialogBox from './src/index' +import { version } from './package.json' + +/* istanbul ignore next */ +DialogBox.install = function (Vue) { + Vue.component(DialogBox.name, DialogBox) +} + +DialogBox.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + DialogBox.install(window.Vue) + } +} + +export default DialogBox diff --git a/packages/vue/src/dialog-box/package.json b/packages/vue/src/dialog-box/package.json new file mode 100644 index 000000000..cb6dd7ae2 --- /dev/null +++ b/packages/vue/src/dialog-box/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-dialog-box", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/dialog-box/src/index.ts b/packages/vue/src/dialog-box/src/index.ts new file mode 100644 index 000000000..e672d01b3 --- /dev/null +++ b/packages/vue/src/dialog-box/src/index.ts @@ -0,0 +1,121 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +const $constants = { + DIALOG_SLIDER_RIGHT: 'dialog-slideRight', + DIALOG_FADE: 'dialog-fade', + SELECT_DROPDOWN: $prefix + 'SelectDropdown', + DROPDOWN_MENU: $prefix + 'DropdownMenu', + DIALOG_BOX_CLASS: 'div.tiny-dialog-box', + PC_SCROLL_LOCK_CLASS: 'tiny-dialog-box__scroll-lock', + MOBILE_SCROLL_LOCK_CLASS: 'tiny-mobile-dialog-box__scroll-lock', + Mode: 'pc', + scrollLockClass(mode) { + return mode === this.Mode ? this.PC_SCROLL_LOCK_CLASS : this.MOBILE_SCROLL_LOCK_CLASS + } +} + +export default defineComponent({ + name: $prefix + 'DialogBox', + model: { + prop: 'visible', + event: 'update:visible' + }, + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + appendToBody: { + type: Boolean, + default: () => false + }, + beforeClose: Function, + center: { + type: Boolean, + default: () => false + }, + closeOnClickModal: { + type: Boolean, + default: () => true + }, + closeOnPressEscape: { + type: Boolean, + default: () => true + }, + destroyOnClose: Boolean, + dialogClass: { + type: String, + default: () => '' + }, + draggable: { + type: Boolean, + default: () => false + }, + fullscreen: { + type: Boolean, + default: () => false + }, + isFormReset: { + type: Boolean, + default: () => true + }, + lockScroll: { + type: Boolean, + default: () => true + }, + modal: { + type: Boolean, + default: () => true + }, + modalAppendToBody: { + type: Boolean, + default: () => true + }, + resize: { + type: Boolean, + default: () => false + }, + rightSlide: { + type: Boolean, + default: () => false + }, + showClose: { + type: Boolean, + default: () => true + }, + showHeader: { + type: Boolean, + default: () => true + }, + title: { + type: String, + default: () => '' + }, + top: String, + visible: { + type: Boolean, + default: () => false + }, + width: { + type: String, + default: () => '500px' + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/dialog-box/src/mobile.vue b/packages/vue/src/dialog-box/src/mobile.vue new file mode 100644 index 000000000..afb3e4b10 --- /dev/null +++ b/packages/vue/src/dialog-box/src/mobile.vue @@ -0,0 +1,55 @@ + + + + diff --git a/packages/vue/src/dialog-box/src/pc.vue b/packages/vue/src/dialog-box/src/pc.vue new file mode 100644 index 000000000..a01315e19 --- /dev/null +++ b/packages/vue/src/dialog-box/src/pc.vue @@ -0,0 +1,100 @@ + + + + diff --git a/packages/vue/src/drop-roles/index.ts b/packages/vue/src/drop-roles/index.ts new file mode 100644 index 000000000..ecc037ef9 --- /dev/null +++ b/packages/vue/src/drop-roles/index.ts @@ -0,0 +1,24 @@ +import DropRoles from './src/index' +import '@opentiny/vue-theme/drop-roles/index.less' +import { version } from './package.json' + +DropRoles.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +DropRoles.install = function (Vue) { + Vue.component(DropRoles.name, DropRoles) +} + +DropRoles.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + DropRoles.install(window.Vue) + } +} + +export default DropRoles diff --git a/packages/vue/src/drop-roles/package.json b/packages/vue/src/drop-roles/package.json new file mode 100644 index 000000000..3e6e4ca00 --- /dev/null +++ b/packages/vue/src/drop-roles/package.json @@ -0,0 +1,23 @@ +{ + "name": "@opentiny/vue-drop-roles", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-select": "workspace:~", + "@opentiny/vue-option": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/drop-roles/src/index.ts b/packages/vue/src/drop-roles/src/index.ts new file mode 100644 index 000000000..029b37e19 --- /dev/null +++ b/packages/vue/src/drop-roles/src/index.ts @@ -0,0 +1,27 @@ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'DropRoles', + props: { + ...$props, + modelValue: {}, + placeholder: { + type: String, + default: '' + }, + size: String, + fetchRole: Function, + fetchCurrentRole: Function, + fields: Object, + popperClass: String, + popperAppendToBody: { + type: Boolean, + default: true + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/drop-roles/src/pc.vue b/packages/vue/src/drop-roles/src/pc.vue new file mode 100644 index 000000000..9dc43ab13 --- /dev/null +++ b/packages/vue/src/drop-roles/src/pc.vue @@ -0,0 +1,37 @@ + + + diff --git a/packages/vue/src/drop-times/index.ts b/packages/vue/src/drop-times/index.ts new file mode 100644 index 000000000..d8a95c4ee --- /dev/null +++ b/packages/vue/src/drop-times/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import DropTimes from './src/index' +import '@opentiny/vue-theme/drop-times/index.less' +import { version } from './package.json' + +DropTimes.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +DropTimes.install = function (Vue) { + Vue.component(DropTimes.name, DropTimes) +} + +DropTimes.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + DropTimes.install(window.Vue) + } +} + +export default DropTimes diff --git a/packages/vue/src/drop-times/package.json b/packages/vue/src/drop-times/package.json new file mode 100644 index 000000000..f98b6aa11 --- /dev/null +++ b/packages/vue/src/drop-times/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-drop-times", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-select": "workspace:~", + "@opentiny/vue-option": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/drop-times/src/index.ts b/packages/vue/src/drop-times/src/index.ts new file mode 100644 index 000000000..e640ba105 --- /dev/null +++ b/packages/vue/src/drop-times/src/index.ts @@ -0,0 +1,51 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'DropTimes', + props: { + ...$props, + modelValue: {}, + placeholder: { + type: String, + default: '' + }, + tabindex: { + type: String, + default: '1' + }, + size: String, + popperClass: String, + popperAppendToBody: { + type: Boolean, + default: true + }, + start: { + type: Number, + default: 0 + }, + end: { + type: Number, + default: 24 * 60 + }, + step: { + type: Number, + default: 15 + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/drop-times/src/pc.vue b/packages/vue/src/drop-times/src/pc.vue new file mode 100644 index 000000000..bb2b609c5 --- /dev/null +++ b/packages/vue/src/drop-times/src/pc.vue @@ -0,0 +1,46 @@ + + + + diff --git a/packages/vue/src/dropdown-item/index.ts b/packages/vue/src/dropdown-item/index.ts new file mode 100644 index 000000000..8d3b1a52f --- /dev/null +++ b/packages/vue/src/dropdown-item/index.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import DropdownItem from './src/index' +import { version } from './package.json' + +DropdownItem.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +DropdownItem.install = function (Vue) { + Vue.component(DropdownItem.name, DropdownItem) +} + +DropdownItem.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + DropdownItem.install(window.Vue) + } +} + +export default DropdownItem diff --git a/packages/vue/src/dropdown-item/package.json b/packages/vue/src/dropdown-item/package.json new file mode 100644 index 000000000..7dd09c8a9 --- /dev/null +++ b/packages/vue/src/dropdown-item/package.json @@ -0,0 +1,23 @@ +{ + "name": "@opentiny/vue-dropdown-item", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-popup": "workspace:~", + "@opentiny/vue-button": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/dropdown-item/src/index.ts b/packages/vue/src/dropdown-item/src/index.ts new file mode 100644 index 000000000..84cf87c9d --- /dev/null +++ b/packages/vue/src/dropdown-item/src/index.ts @@ -0,0 +1,55 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +export default defineComponent({ + name: $prefix + 'DropdownItem', + componentName: 'TinyDropdownItem', + props: { + ...$props, + icon: [String, Object], + disabled: Boolean, + divided: Boolean, + command: {}, + title: String, + titleClass: String, + options: { + type: Array, + default: () => [] + }, + type: { + type: String, + default: 'selection' + }, + label: { + type: String, + default: '' + }, + itemData: { + type: Object, + default: () => ({}) + }, + appendToBody: { + type: Boolean, + default: true + }, + textField: { + type: String, + default: 'label' + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/dropdown-item/src/index.vue b/packages/vue/src/dropdown-item/src/index.vue new file mode 100644 index 000000000..54c4423fb --- /dev/null +++ b/packages/vue/src/dropdown-item/src/index.vue @@ -0,0 +1,129 @@ + + + + diff --git a/packages/vue/src/dropdown-item/src/mobile.vue b/packages/vue/src/dropdown-item/src/mobile.vue new file mode 100644 index 000000000..e8911d848 --- /dev/null +++ b/packages/vue/src/dropdown-item/src/mobile.vue @@ -0,0 +1,82 @@ + + + + diff --git a/packages/vue/src/dropdown-item/src/pc.vue b/packages/vue/src/dropdown-item/src/pc.vue new file mode 100644 index 000000000..38a932ca3 --- /dev/null +++ b/packages/vue/src/dropdown-item/src/pc.vue @@ -0,0 +1,69 @@ + + + + + diff --git a/packages/vue/src/dropdown-menu/index.ts b/packages/vue/src/dropdown-menu/index.ts new file mode 100644 index 000000000..cb9e80f19 --- /dev/null +++ b/packages/vue/src/dropdown-menu/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import DropdownMenu from './src/index' +import { version } from './package.json' + +/* istanbul ignore next */ +DropdownMenu.install = function (Vue) { + Vue.component(DropdownMenu.name, DropdownMenu) +} + +DropdownMenu.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + DropdownMenu.install(window.Vue) + } +} + +export default DropdownMenu diff --git a/packages/vue/src/dropdown-menu/package.json b/packages/vue/src/dropdown-menu/package.json new file mode 100644 index 000000000..a0610ba82 --- /dev/null +++ b/packages/vue/src/dropdown-menu/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-dropdown-menu", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/dropdown-menu/src/index.ts b/packages/vue/src/dropdown-menu/src/index.ts new file mode 100644 index 000000000..81d17486b --- /dev/null +++ b/packages/vue/src/dropdown-menu/src/index.ts @@ -0,0 +1,72 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +export default defineComponent({ + name: $prefix + 'DropdownMenu', + componentName: $prefix + 'DropdownMenu', + props: { + ...$props, + visibleArrow: { + type: Boolean, + default: false + }, + arrowOffset: { + type: Number, + default: 0 + }, + placement: { + type: String, + default: 'bottom-end' + }, + popperClass: String, + popperAppendToBody: { + type: Boolean, + default: true + }, + activeColor: String, + closeOnClickOutside: { + type: Boolean, + default: true + }, + closeOnClickOverlay: { + type: Boolean, + default: true + }, + direction: { + type: String, + default: 'down' + }, + duration: { + type: [Number, String], + default: 0.2 + }, + overlay: { + type: Boolean, + default: true + }, + zIndex: [Number, String], + options: { + type: Array, + default: () => [] + }, + textField: { + type: String, + default: 'label' + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/dropdown-menu/src/index.vue b/packages/vue/src/dropdown-menu/src/index.vue new file mode 100644 index 000000000..f7ed6351f --- /dev/null +++ b/packages/vue/src/dropdown-menu/src/index.vue @@ -0,0 +1,102 @@ + + + + diff --git a/packages/vue/src/dropdown-menu/src/mobile.vue b/packages/vue/src/dropdown-menu/src/mobile.vue new file mode 100644 index 000000000..fe260555e --- /dev/null +++ b/packages/vue/src/dropdown-menu/src/mobile.vue @@ -0,0 +1,79 @@ + + + + diff --git a/packages/vue/src/dropdown-menu/src/pc.vue b/packages/vue/src/dropdown-menu/src/pc.vue new file mode 100644 index 000000000..4678db614 --- /dev/null +++ b/packages/vue/src/dropdown-menu/src/pc.vue @@ -0,0 +1,52 @@ + + + + + diff --git a/packages/vue/src/dropdown/index.ts b/packages/vue/src/dropdown/index.ts new file mode 100644 index 000000000..f01fadc7d --- /dev/null +++ b/packages/vue/src/dropdown/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Dropdown from './src/index.vue' +import '@opentiny/vue-theme/dropdown/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Dropdown.install = function (Vue) { + Vue.component(Dropdown.name, Dropdown) +} + +Dropdown.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Dropdown.install(window.Vue) + } +} + +export default Dropdown diff --git a/packages/vue/src/dropdown/package.json b/packages/vue/src/dropdown/package.json new file mode 100644 index 000000000..19f5a891f --- /dev/null +++ b/packages/vue/src/dropdown/package.json @@ -0,0 +1,24 @@ +{ + "name": "@opentiny/vue-dropdown", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-theme": "workspace:~", + "@opentiny/vue-button": "workspace:~", + "@opentiny/vue-button-group": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/dropdown/src/index.vue b/packages/vue/src/dropdown/src/index.vue new file mode 100644 index 000000000..58c5388f8 --- /dev/null +++ b/packages/vue/src/dropdown/src/index.vue @@ -0,0 +1,142 @@ + + + diff --git a/packages/vue/src/espace/index.ts b/packages/vue/src/espace/index.ts new file mode 100644 index 000000000..e521b7c5f --- /dev/null +++ b/packages/vue/src/espace/index.ts @@ -0,0 +1,19 @@ +import Espace from './src/index' +import '@opentiny/vue-theme/espace/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Espace.install = function (Vue) { + Vue.component(Espace.name, Espace) +} + +Espace.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Espace.install(window.Vue) + } +} + +export default Espace diff --git a/packages/vue/src/espace/package.json b/packages/vue/src/espace/package.json new file mode 100644 index 000000000..15b06dd13 --- /dev/null +++ b/packages/vue/src/espace/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-espace", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/espace/src/index.ts b/packages/vue/src/espace/src/index.ts new file mode 100644 index 000000000..4c4d5a055 --- /dev/null +++ b/packages/vue/src/espace/src/index.ts @@ -0,0 +1,17 @@ +import { $prefix, $props, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'Espace', + props: { + ...$props, + data: Array, + isNewImMode: { + type: Boolean, + default: true + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +}) diff --git a/packages/vue/src/espace/src/pc.vue b/packages/vue/src/espace/src/pc.vue new file mode 100644 index 000000000..0b57495ed --- /dev/null +++ b/packages/vue/src/espace/src/pc.vue @@ -0,0 +1,35 @@ + + + diff --git a/packages/vue/src/exception/index.ts b/packages/vue/src/exception/index.ts new file mode 100644 index 000000000..6405a3691 --- /dev/null +++ b/packages/vue/src/exception/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Exception from './src/index.vue' +import '@opentiny/vue-theme-mobile/exception/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Exception.install = function (Vue) { + Vue.component(Exception.name, Exception) +} + +Exception.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Exception.install(window.Vue) + } +} + +export default Exception diff --git a/packages/vue/src/exception/package.json b/packages/vue/src/exception/package.json new file mode 100644 index 000000000..c0f8f11d0 --- /dev/null +++ b/packages/vue/src/exception/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-exception", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-button": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/exception/src/index.vue b/packages/vue/src/exception/src/index.vue new file mode 100644 index 000000000..c120b1000 --- /dev/null +++ b/packages/vue/src/exception/src/index.vue @@ -0,0 +1,60 @@ + + + + diff --git a/packages/vue/src/fall-menu/index.ts b/packages/vue/src/fall-menu/index.ts new file mode 100644 index 000000000..01ca1ce36 --- /dev/null +++ b/packages/vue/src/fall-menu/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import FallMenu from './src/index' +import '@opentiny/vue-theme/fall-menu/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +FallMenu.install = function (Vue) { + Vue.component(FallMenu.name, FallMenu) +} + +FallMenu.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + FallMenu.install(window.Vue) + } +} + +export default FallMenu diff --git a/packages/vue/src/fall-menu/package.json b/packages/vue/src/fall-menu/package.json new file mode 100644 index 000000000..0b6657caf --- /dev/null +++ b/packages/vue/src/fall-menu/package.json @@ -0,0 +1,23 @@ +{ + "name": "@opentiny/vue-fall-menu", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-row": "workspace:~", + "@opentiny/vue-col": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/fall-menu/src/index.ts b/packages/vue/src/fall-menu/src/index.ts new file mode 100644 index 000000000..4c4e80101 --- /dev/null +++ b/packages/vue/src/fall-menu/src/index.ts @@ -0,0 +1,25 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $prefix, $props, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'FallMenu', + props: { + ...$props, + data: { type: Array, default: () => [] } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/fall-menu/src/pc.vue b/packages/vue/src/fall-menu/src/pc.vue new file mode 100644 index 000000000..4f6ac4ae8 --- /dev/null +++ b/packages/vue/src/fall-menu/src/pc.vue @@ -0,0 +1,99 @@ + + + + diff --git a/packages/vue/src/file-upload/index.ts b/packages/vue/src/file-upload/index.ts new file mode 100644 index 000000000..d148e52fe --- /dev/null +++ b/packages/vue/src/file-upload/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import FileUpload from './src/index' +import '@opentiny/vue-theme/file-upload/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +FileUpload.install = function (Vue) { + Vue.component(FileUpload.name, FileUpload) +} + +FileUpload.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + FileUpload.install(window.Vue) + } +} + +export default FileUpload diff --git a/packages/vue/src/file-upload/package.json b/packages/vue/src/file-upload/package.json new file mode 100644 index 000000000..495cf89de --- /dev/null +++ b/packages/vue/src/file-upload/package.json @@ -0,0 +1,23 @@ +{ + "name": "@opentiny/vue-file-upload", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-progress": "workspace:~", + "@opentiny/vue-upload-list": "workspace:~", + "@opentiny/vue-upload": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/file-upload/src/index.ts b/packages/vue/src/file-upload/src/index.ts new file mode 100644 index 000000000..006a0b202 --- /dev/null +++ b/packages/vue/src/file-upload/src/index.ts @@ -0,0 +1,197 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' +import streamSaver from 'streamsaver' + +const $constants = { + UPLOAD_INNER: 'upload-inner', + FILE_STATUS: { + READY: 'ready', + SUCESS: 'success', + UPLOADING: 'uploading', + FAIL: 'fail', + DOWNLOADING: 'downloading' + }, + LIST_TYPE: { + TEXT: 'text', + PICTURE_CARD: 'picture-card', + PICTURE: 'picture', + THUMB: 'thumb' + }, + EDM: { + CHUNKINIT: 'chunkInit', + FILESIZE: 'fileSize', + CHUNKS: 'chunks', + FILENAME: 'fileName', + ISCHECKCODE: 'isCheckCode', + CHECKCODE: 'checkCode', + MULTIPART: 'multipartFile', + DOCID: 'docId', + CHUNK: 'chunk', + SINGLEUPLOAD: 'uploadFile', + LOWERNAME: 'filename', + FOLDERKEY: 'ui.fileUpload.folder', + FORMAT: 'docFormat=wm&', + WATER: 'usageScenes=water&wmType=wm&', + SOURCE: 'usageScenes=source&', + URLCONTS: '&type=doc&pageNum=1&docVersion=', + EDMTOKEN: 'EDM-Authorization', + TRACEID: 'x-trace-id', + TEXT: 'edm-text', + JSLIB: './jslib/', + I18NKEY: 'ui.fileUpload.token', + LARGEFILEKEY: 'ui.fileUpload.largefile', + EXCEED: 'ui.fileUpload.exceed', + SIZE: 'ui.fileUpload.fileSize', + SIZE_2G: 2 * 1024 * 1024, // 单位(KB) + SIZE_20M: 20 * 1024, + SIZE_8M: 8 * 1024, + FILEEMPTY: 'ui.fileUpload.empty', + KIASCANTIP: 'ui.fileUpload.kiaScanTip', + FILENAMEEXCEEDS: 'ui.fileUpload.fileNameExceeds', + THEFILENAME: 'ui.fileUpload.fileName' + } +} + +export default defineComponent({ + name: $prefix + 'FileUpload', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + accept: String, + action: String, + autoUpload: { + type: Boolean, + default: () => true + }, + beforeRemove: Function, + beforeUpload: Function, + data: Object, + disabled: Boolean, + display: { + type: Boolean, + default: () => true + }, + drag: Boolean, + dragger: Boolean, + edm: { + type: Object, + default: () => ({}) + }, + fileIconList: { + type: Array, + default: () => [] + }, + fileList: { + type: Array, + default: () => [] + }, + fileSize: { + type: [Number, Array], + validator(value) { + return Array.isArray(value) ? value[0] < value[1] : typeof value === 'number' + } + }, + fileTitle: { + type: String, + default: () => '附件' + }, + headerShow: { + type: Boolean, + default: () => true + }, + headers: { + type: Object, + default: () => ({}) + }, + httpRequest: Function, + limit: Number, + listType: { + type: String, + default: () => 'text', + validator: (value) => !!$constants.LIST_TYPE[value.toUpperCase().replace('-', '_')] + }, + mergeService: { + type: Boolean, + default: () => false + }, + multiple: Boolean, + name: { + type: String, + default: () => 'file' + }, + openDownloadFile: { + type: Boolean, + default: () => false + }, + showFileList: { + type: Boolean, + default: () => true + }, + size: String, + successStatistics: { + type: Boolean, + default: () => true + }, + thumbOption: { + type: Object, + default: () => ({ + popperClass: '', + width: 270, + showDownload: false, + downloadFile: Function, + showDel: false, + icon: 'icon-attachment', + showTooltip: false + }) + }, + type: { + type: String, + default: () => 'select' + }, + uploadIcon: { + type: Boolean, + default: () => true + }, + withCredentials: { + type: Boolean, + default: () => true + }, + isFolderTitle: { + type: Boolean, + default: false + }, + plugin: { + type: [Object, Function], + default: () => streamSaver + }, + listOption: { + type: Object, + default: () => ({ + showUpdate: true, + showDel: true + }) + }, + maxNameLength: { + type: Number, + default: 20 + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/file-upload/src/mobile.vue b/packages/vue/src/file-upload/src/mobile.vue new file mode 100644 index 000000000..409d1169f --- /dev/null +++ b/packages/vue/src/file-upload/src/mobile.vue @@ -0,0 +1,182 @@ + + diff --git a/packages/vue/src/file-upload/src/pc.vue b/packages/vue/src/file-upload/src/pc.vue new file mode 100644 index 000000000..789cc4aae --- /dev/null +++ b/packages/vue/src/file-upload/src/pc.vue @@ -0,0 +1,264 @@ + + diff --git a/packages/vue/src/floatbar/index.ts b/packages/vue/src/floatbar/index.ts new file mode 100644 index 000000000..260c0c7c6 --- /dev/null +++ b/packages/vue/src/floatbar/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Floatbar from './src/index.js' +import '@opentiny/vue-theme/floatbar/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Floatbar.install = function (Vue) { + Vue.component(Floatbar.name, Floatbar) +} + +Floatbar.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Floatbar.install(window.Vue) + } +} + +export default Floatbar diff --git a/packages/vue/src/floatbar/package.json b/packages/vue/src/floatbar/package.json new file mode 100644 index 000000000..566276446 --- /dev/null +++ b/packages/vue/src/floatbar/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-floatbar", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/floatbar/src/index.ts b/packages/vue/src/floatbar/src/index.ts new file mode 100644 index 000000000..0fab49980 --- /dev/null +++ b/packages/vue/src/floatbar/src/index.ts @@ -0,0 +1,24 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $prefix, $props, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'Floatbar', + props: { + ...$props + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/floatbar/src/pc.vue b/packages/vue/src/floatbar/src/pc.vue new file mode 100644 index 000000000..357424bf5 --- /dev/null +++ b/packages/vue/src/floatbar/src/pc.vue @@ -0,0 +1,35 @@ + + + + diff --git a/packages/form-item/index.js b/packages/vue/src/form-item/index.ts similarity index 100% rename from packages/form-item/index.js rename to packages/vue/src/form-item/index.ts diff --git a/packages/vue/src/form-item/package.json b/packages/vue/src/form-item/package.json new file mode 100644 index 000000000..35c2de732 --- /dev/null +++ b/packages/vue/src/form-item/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-form-item", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-tooltip": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/form-item/src/index.vue b/packages/vue/src/form-item/src/index.vue new file mode 100644 index 000000000..3de683552 --- /dev/null +++ b/packages/vue/src/form-item/src/index.vue @@ -0,0 +1,286 @@ + + diff --git a/packages/form-item/src/label-wrap.js b/packages/vue/src/form-item/src/label-wrap.ts similarity index 100% rename from packages/form-item/src/label-wrap.js rename to packages/vue/src/form-item/src/label-wrap.ts diff --git a/packages/form/index.js b/packages/vue/src/form/index.ts similarity index 100% rename from packages/form/index.js rename to packages/vue/src/form/index.ts diff --git a/packages/vue/src/form/package.json b/packages/vue/src/form/package.json new file mode 100644 index 000000000..9a6b64e72 --- /dev/null +++ b/packages/vue/src/form/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-form", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/form/src/index.ts b/packages/vue/src/form/src/index.ts new file mode 100644 index 000000000..d27dce5f3 --- /dev/null +++ b/packages/vue/src/form/src/index.ts @@ -0,0 +1,92 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +export default defineComponent({ + name: $prefix + 'Form', + componentName: 'Form', + props: { + ...$props, + model: Object, + rules: Object, + inlineMessage: Boolean, + statusIcon: Boolean, + showMessage: { + type: Boolean, + default: true + }, + validatePosition: { + type: String, + default: 'right' + }, + size: String, + disabled: Boolean, + validateOnRuleChange: { + type: Boolean, + default: true + }, + hideRequiredAsterisk: { + type: Boolean, + default: false + }, + labelPosition: { + type: String, + default: 'right', + validator: (value) => ~['left', 'top', 'right'].indexOf(value) + }, + labelWidth: { + type: String, + default: '80px' + }, + labelAlign: { + type: Boolean, + default: false + }, + contentOffset: Number, + labelSuffix: { + type: String, + default: '' + }, + inline: { + type: Boolean, + default: false + }, + responsiveLayout: { + type: Boolean, + default: false + }, + validateType: { + type: String, + default: 'tip', + validator(value) { + return ~['tip', 'text'].indexOf(value) + } + }, + manual: { + type: Boolean, + default: false + }, + appendToBody: { + type: Boolean, + default: undefined + }, + popperOptions: { + type: Object, + default: () => ({}) + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/form/src/mobile.vue b/packages/vue/src/form/src/mobile.vue new file mode 100644 index 000000000..304a9cde3 --- /dev/null +++ b/packages/vue/src/form/src/mobile.vue @@ -0,0 +1,54 @@ + + + + diff --git a/packages/vue/src/form/src/pc.vue b/packages/vue/src/form/src/pc.vue new file mode 100644 index 000000000..d04ec9560 --- /dev/null +++ b/packages/vue/src/form/src/pc.vue @@ -0,0 +1,60 @@ + + + + diff --git a/packages/vue/src/fullscreen/index.ts b/packages/vue/src/fullscreen/index.ts new file mode 100644 index 000000000..749d47bcf --- /dev/null +++ b/packages/vue/src/fullscreen/index.ts @@ -0,0 +1,39 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Fullscreen from './src/index.vue' +import FullscreenApi from '@opentiny/vue-renderless/common/deps/fullscreen/apis' +import '@opentiny/vue-theme/fullscreen/index.less' +import { version } from './package.json' + +const apis = ['exit', 'enter', 'element', 'getState', 'isEnabled', 'isFullscreen', 'options', 'request', 'support', 'toggle'] + +apis.forEach((api) => { + if (FullscreenApi[api] && !Fullscreen[api]) { + Fullscreen[api] = FullscreenApi[api] + } +}) + +/* istanbul ignore next */ +Fullscreen.install = function (Vue) { + Vue.component(Fullscreen.name, Fullscreen) +} + +Fullscreen.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Fullscreen.install(window.Vue) + } +} + +export default Fullscreen diff --git a/packages/vue/src/fullscreen/package.json b/packages/vue/src/fullscreen/package.json new file mode 100644 index 000000000..653e75fc6 --- /dev/null +++ b/packages/vue/src/fullscreen/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-fullscreen", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/fullscreen/src/index.vue b/packages/vue/src/fullscreen/src/index.vue new file mode 100644 index 000000000..87b9cedb3 --- /dev/null +++ b/packages/vue/src/fullscreen/src/index.vue @@ -0,0 +1,63 @@ + + + + diff --git a/packages/grid-column/index.js b/packages/vue/src/grid-column/index.ts similarity index 100% rename from packages/grid-column/index.js rename to packages/vue/src/grid-column/index.ts diff --git a/packages/vue/src/grid-column/package.json b/packages/vue/src/grid-column/package.json new file mode 100644 index 000000000..aef4d3974 --- /dev/null +++ b/packages/vue/src/grid-column/package.json @@ -0,0 +1,19 @@ +{ + "name": "@opentiny/vue-grid-column", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-grid": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/grid-column/src/index.js b/packages/vue/src/grid-column/src/index.ts similarity index 100% rename from packages/grid-column/src/index.js rename to packages/vue/src/grid-column/src/index.ts diff --git a/packages/grid-manager/index.js b/packages/vue/src/grid-manager/index.ts similarity index 100% rename from packages/grid-manager/index.js rename to packages/vue/src/grid-manager/index.ts diff --git a/packages/vue/src/grid-manager/package.json b/packages/vue/src/grid-manager/package.json new file mode 100644 index 000000000..782e27212 --- /dev/null +++ b/packages/vue/src/grid-manager/package.json @@ -0,0 +1,19 @@ +{ + "name": "@opentiny/vue-grid-manager", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-grid": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/grid-manager/src/antd.js b/packages/vue/src/grid-manager/src/antd.ts similarity index 100% rename from packages/grid-manager/src/antd.js rename to packages/vue/src/grid-manager/src/antd.ts diff --git a/packages/grid-manager/src/element-ui.js b/packages/vue/src/grid-manager/src/element-ui.ts similarity index 100% rename from packages/grid-manager/src/element-ui.js rename to packages/vue/src/grid-manager/src/element-ui.ts diff --git a/packages/vue/src/grid-manager/src/index.ts b/packages/vue/src/grid-manager/src/index.ts new file mode 100644 index 000000000..a1c2c9ab9 --- /dev/null +++ b/packages/vue/src/grid-manager/src/index.ts @@ -0,0 +1,23 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { GridAdapter } from '@opentiny/vue-grid' +import useAntd from './antd' +import useiView from './iview' +import useElementUI from './element-ui' + +export default defineComponent({ + useAntd, + useiView, + useElementUI, + Interceptor: GridAdapter +} +) diff --git a/packages/grid-manager/src/iview.js b/packages/vue/src/grid-manager/src/iview.ts similarity index 100% rename from packages/grid-manager/src/iview.js rename to packages/vue/src/grid-manager/src/iview.ts diff --git a/packages/vue/src/grid-toolbar/index.ts b/packages/vue/src/grid-toolbar/index.ts new file mode 100644 index 000000000..7be5d2ca9 --- /dev/null +++ b/packages/vue/src/grid-toolbar/index.ts @@ -0,0 +1,28 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import GridToolbar from './src/index' +import { version } from './package.json' + +GridToolbar.install = function (Vue) { + Vue.component(GridToolbar.name, GridToolbar) +} + +GridToolbar.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + GridToolbar.install(window.Vue) + } +} + +export default GridToolbar diff --git a/packages/vue/src/grid-toolbar/package.json b/packages/vue/src/grid-toolbar/package.json new file mode 100644 index 000000000..d83f14936 --- /dev/null +++ b/packages/vue/src/grid-toolbar/package.json @@ -0,0 +1,25 @@ +{ + "name": "@opentiny/vue-grid-toolbar", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-button": "workspace:~", + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-modal": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-grid": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/grid-toolbar/src/custom-select.vue b/packages/vue/src/grid-toolbar/src/custom-select.vue similarity index 97% rename from packages/grid-toolbar/src/custom-select.vue rename to packages/vue/src/grid-toolbar/src/custom-select.vue index 9988a64ba..9dfcd155f 100644 --- a/packages/grid-toolbar/src/custom-select.vue +++ b/packages/vue/src/grid-toolbar/src/custom-select.vue @@ -18,7 +18,7 @@ - diff --git a/packages/vue/src/image-viewer/src/mobileTouch.ts b/packages/vue/src/image-viewer/src/mobileTouch.ts new file mode 100644 index 000000000..4c6940fe2 --- /dev/null +++ b/packages/vue/src/image-viewer/src/mobileTouch.ts @@ -0,0 +1,118 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { directive } from '@opentiny/vue-common' +import { isObject } from '@opentiny/vue-renderless/common/type' + +class TinyTouch { + constructor(element, tinyBinding, type) { + const that = this + that.element = element + that.tinyBinding = tinyBinding + that.touchType = type + that.tinyVueTouches = { x: 0, y: 0 } + that.tinyVueMoves = true + that.tinyVueLeave = true + that.tinyLongTouch = true + that.tinyVueCallBack = isObject(tinyBinding.value) ? tinyBinding.value.fn : tinyBinding.value + that.element.addEventListener('touchstart', (e) => { + that.start(e) + }) + that.element.addEventListener('touchend', (e) => { + that.end(e) + }) + that.element.addEventListener('touchmove', (e) => { + that.move(e) + }) + } + + start(e) { + if (e.touches >= 2) { + return + } + + this.tinyVueMoves = true + this.tinyVueLeave = true + this.tinyLongTouch = true + this.tinyVueTouches = { + x: e.changedTouches[0].pageX, + y: e.changedTouches[0].pageY + } + + this.time = setTimeout(() => { + if (this.tinyVueLeave && this.tinyVueMoves) { + this.touchType == 'longtap' && this.tinyVueCallBack(this.tinyBinding.value, e) + this.tinyLongTouch = false + } + }, 1000) + } + + end(e) { + if (e.touches >= 2) { + return + } + + let disX = e.changedTouches[0].pageX - this.tinyVueTouches.x + let disY = e.changedTouches[0].pageY - this.tinyVueTouches.y + + clearTimeout(this.time) + + if (Math.abs(disX) > 10 || Math.abs(disY) > 100) { + this.touchType == 'swipe' && this.tinyVueCallBack(this.tinyBinding.value, e) + + if (Math.abs(disX) > Math.abs(disY)) { + if (disX > 10) { + this.touchType == 'swiperight' && this.tinyVueCallBack(this.tinyBinding.value, e) + } + + if (disX < -10) { + this.touchType == 'swipeleft' && this.tinyVueCallBack(this.tinyBinding.value, e) + } + } else { + if (disY > 10) { + this.touchType == 'swipedown' && this.tinyVueCallBack(this.tinyBinding.value, e) + } + + if (disY < -10) { + this.touchType == 'swipeup' && this.tinyVueCallBack(this.tinyBinding.value, e) + } + } + } else { + if (this.tinyLongTouch && this.tinyVueMoves) { + this.touchType == 'tap' && this.tinyVueCallBack(this.tinyBinding.value, e) + this.tinyVueLeave = false + } + } + } + + move() { + this.tinyVueMoves = false + } +} + +const mapDirective = () => { + const deactives = {} + const names = ['tap', 'swipe', 'swipeleft', 'swiperight', 'swipedown', 'swipeup', 'longtap'] + + names.forEach((name) => { + deactives[name] = directive({ + vTouch: { + bind(el, tinyBinding) { + new TinyTouch(el, tinyBinding, name) + } + } + }).vTouch + }) + + return deactives +} + +export default mapDirective() diff --git a/packages/vue/src/image-viewer/src/pc.vue b/packages/vue/src/image-viewer/src/pc.vue new file mode 100644 index 000000000..b559ef08f --- /dev/null +++ b/packages/vue/src/image-viewer/src/pc.vue @@ -0,0 +1,94 @@ + + + + diff --git a/packages/vue/src/image/index.ts b/packages/vue/src/image/index.ts new file mode 100644 index 000000000..1c2650103 --- /dev/null +++ b/packages/vue/src/image/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Image from './src/index' +import '@opentiny/vue-theme/image/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Image.install = function (Vue) { + Vue.component(Image.name, Image) +} + +Image.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Image.install(window.Vue) + } +} + +export default Image diff --git a/packages/vue/src/image/package.json b/packages/vue/src/image/package.json new file mode 100644 index 000000000..bc0a2ce86 --- /dev/null +++ b/packages/vue/src/image/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-image", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-image-viewer": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/image/src/index.ts b/packages/vue/src/image/src/index.ts new file mode 100644 index 000000000..6888ee32b --- /dev/null +++ b/packages/vue/src/image/src/index.ts @@ -0,0 +1,49 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + NONE: 'none', + CONTAIN: 'contain', + COVER: 'cover', + FILL: 'fill', + SCALE_DOWN: 'scale-down', + DEFAULT_POPPER_ZINDEX: Number.POSITIVE_INFINITY +} + +export default defineComponent({ + name: $prefix + 'Image', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + fit: String, + lazy: Boolean, + previewSrcList: { + type: Array, + default: () => [] + }, + scrollContainer: {}, + src: String, + zIndex: { + type: Number, + default: $constants.DEFAULT_POPPER_ZINDEX + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/image/src/pc.vue b/packages/vue/src/image/src/pc.vue new file mode 100644 index 000000000..441925905 --- /dev/null +++ b/packages/vue/src/image/src/pc.vue @@ -0,0 +1,51 @@ + + + + diff --git a/packages/vue/src/index-bar-anchor/index.ts b/packages/vue/src/index-bar-anchor/index.ts new file mode 100644 index 000000000..9c27ee5a5 --- /dev/null +++ b/packages/vue/src/index-bar-anchor/index.ts @@ -0,0 +1,28 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import IndexBarAnchor from './src/index.vue' + +/* istanbul ignore next */ +IndexBarAnchor.install = function (Vue) { + Vue.component(IndexBarAnchor.name, IndexBarAnchor) +} + +IndexBarAnchor.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + IndexBarAnchor.install(window.Vue) + } +} + +export default IndexBarAnchor diff --git a/packages/vue/src/index-bar-anchor/package.json b/packages/vue/src/index-bar-anchor/package.json new file mode 100644 index 000000000..7bbb20204 --- /dev/null +++ b/packages/vue/src/index-bar-anchor/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-index-bar-anchor", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/index-bar-anchor/src/index.vue b/packages/vue/src/index-bar-anchor/src/index.vue new file mode 100644 index 000000000..4a732d0c1 --- /dev/null +++ b/packages/vue/src/index-bar-anchor/src/index.vue @@ -0,0 +1,34 @@ + + + + diff --git a/packages/vue/src/index-bar/index.ts b/packages/vue/src/index-bar/index.ts new file mode 100644 index 000000000..9f8a7e71e --- /dev/null +++ b/packages/vue/src/index-bar/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import IndexBar from './src/index' +import { version } from './package.json' + +/* istanbul ignore next */ +IndexBar.install = function (Vue) { + Vue.component(IndexBar.name, IndexBar) +} + +IndexBar.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + IndexBar.install(window.Vue) + } +} + +export default IndexBar diff --git a/packages/vue/src/index-bar/package.json b/packages/vue/src/index-bar/package.json new file mode 100644 index 000000000..83f64ee14 --- /dev/null +++ b/packages/vue/src/index-bar/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-index-bar", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/index-bar/src/index.ts b/packages/vue/src/index-bar/src/index.ts new file mode 100644 index 000000000..859504465 --- /dev/null +++ b/packages/vue/src/index-bar/src/index.ts @@ -0,0 +1,28 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?mobile' + +export default defineComponent({ + name: $prefix + 'IndexBar', + props: { + ...$props, + indexList: { + type: Array, + default: () => [] + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/index-bar/src/mobile.vue b/packages/vue/src/index-bar/src/mobile.vue new file mode 100644 index 000000000..8912e7545 --- /dev/null +++ b/packages/vue/src/index-bar/src/mobile.vue @@ -0,0 +1,54 @@ + + + + diff --git a/packages/vue/src/input/index.ts b/packages/vue/src/input/index.ts new file mode 100644 index 000000000..9921bac99 --- /dev/null +++ b/packages/vue/src/input/index.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Input from './src/index' +import { version } from './package.json' + +Input.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Input.install = function (Vue) { + Vue.component(Input.name, Input) +} + +Input.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Input.install(window.Vue) + } +} + +export default Input diff --git a/packages/vue/src/input/package.json b/packages/vue/src/input/package.json new file mode 100644 index 000000000..06ed2b5e0 --- /dev/null +++ b/packages/vue/src/input/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-input", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-action-sheet": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/input/src/index.ts b/packages/vue/src/input/src/index.ts new file mode 100644 index 000000000..018fd3145 --- /dev/null +++ b/packages/vue/src/input/src/index.ts @@ -0,0 +1,117 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +const $constants = { + INPUT_PC: 'tiny-input__', + INPUTGROUP_PC: 'tiny-input-group__', + INPUT_MOBILE: 'tiny-mobile-input__', + INPUTGROUP_MOBILE: 'tiny-mobile-input-group__', + Mode: 'pc', + inputMode(mode) { + return mode === this.Mode ? this.INPUT_PC : this.INPUT_MOBILE + }, + inputGroupMode(mode) { + return mode === this.Mode ? this.INPUTGROUP_PC : this.INPUTGROUP_MOBILE + }, + VALIDATE_ICON: { + Validating: 'tiny-icon-loading', + Success: 'tiny-icon-circle-check', + Error: 'tiny-icon-circle-close' + }, + COMPONENT_NAME: { + FormItem: 'FormItem' + } +} + +export default defineComponent({ + name: $prefix + 'Input', + inheritAttrs: false, + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + name: String, + size: String, + form: String, + label: String, + height: Number, + resize: String, + tabindex: { type: String, default: '1' }, + disabled: Boolean, + readonly: Boolean, + suffixIcon: [Object, String], + prefixIcon: [Object, String], + modelValue: [String, Number], + type: { + type: String, + default: 'text' + }, + vertical: { + type: Boolean, + default: false + }, + selectMenu: { + type: Array, + default: () => [] + }, + isSelect: { + type: Boolean, + default: false + }, + mobileTips: String, + counter: { + type: Boolean, + default: false + }, + autosize: { + type: [Boolean, Object], + default: false + }, + clearable: { + type: Boolean, + default: false + }, + autocomplete: { + type: String, + default: 'off' + }, + showPassword: { + type: Boolean, + default: false + }, + showWordLimit: { + type: Boolean, + default: false + }, + showTitle: { + type: Boolean, + default: false + }, + validateEvent: { + type: Boolean, + default: true + }, + // mobile特有属性 + textareaTitle: { + type: String, + default: '标题' + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/input/src/mobile.vue b/packages/vue/src/input/src/mobile.vue new file mode 100644 index 000000000..874d47de3 --- /dev/null +++ b/packages/vue/src/input/src/mobile.vue @@ -0,0 +1,226 @@ + + + + diff --git a/packages/vue/src/input/src/pc.vue b/packages/vue/src/input/src/pc.vue new file mode 100644 index 000000000..a93ac4917 --- /dev/null +++ b/packages/vue/src/input/src/pc.vue @@ -0,0 +1,187 @@ + + + + diff --git a/packages/input/src/tall-storage.vue b/packages/vue/src/input/src/tall-storage.vue similarity index 94% rename from packages/input/src/tall-storage.vue rename to packages/vue/src/input/src/tall-storage.vue index 70dd64462..6255d436d 100644 --- a/packages/input/src/tall-storage.vue +++ b/packages/vue/src/input/src/tall-storage.vue @@ -27,10 +27,10 @@
    - diff --git a/packages/vue/src/layout/index.ts b/packages/vue/src/layout/index.ts new file mode 100644 index 000000000..1c60d41ce --- /dev/null +++ b/packages/vue/src/layout/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Layout from './src/index' +import '@opentiny/vue-theme/layout/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Layout.install = function (Vue) { + Vue.component(Layout.name, Layout) +} + +Layout.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Layout.install(window.Vue) + } +} + +export default Layout diff --git a/packages/vue/src/layout/package.json b/packages/vue/src/layout/package.json new file mode 100644 index 000000000..712fc95a1 --- /dev/null +++ b/packages/vue/src/layout/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-layout", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/layout/src/index.ts b/packages/vue/src/layout/src/index.ts new file mode 100644 index 000000000..a07c07865 --- /dev/null +++ b/packages/vue/src/layout/src/index.ts @@ -0,0 +1,38 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'Layout', + provide() { + return { + layout: this + } + }, + props: { + ...$props, + tag: { + type: String, + default: 'div' + }, + size: { + type: String, + default: 'medium', + validator: (value) => ~['medium', 'small', 'mini'].indexOf(value) + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/layout/src/pc.vue b/packages/vue/src/layout/src/pc.vue new file mode 100644 index 000000000..835798d75 --- /dev/null +++ b/packages/vue/src/layout/src/pc.vue @@ -0,0 +1,28 @@ + + + + diff --git a/packages/vue/src/link-menu/index.ts b/packages/vue/src/link-menu/index.ts new file mode 100644 index 000000000..4484d1d72 --- /dev/null +++ b/packages/vue/src/link-menu/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import LinkMenu from './src/index' +import '@opentiny/vue-theme/link-menu/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +LinkMenu.install = function (Vue) { + Vue.component(LinkMenu.name, LinkMenu) +} + +LinkMenu.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + LinkMenu.install(window.Vue) + } +} + +export default LinkMenu diff --git a/packages/vue/src/link-menu/package.json b/packages/vue/src/link-menu/package.json new file mode 100644 index 000000000..20460ad36 --- /dev/null +++ b/packages/vue/src/link-menu/package.json @@ -0,0 +1,25 @@ +{ + "name": "@opentiny/vue-link-menu", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-input": "workspace:~", + "@opentiny/vue-tree": "workspace:~", + "@opentiny/vue-button": "workspace:~", + "@opentiny/vue-dialog-box": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/link-menu/src/index.ts b/packages/vue/src/link-menu/src/index.ts new file mode 100644 index 000000000..030f324bc --- /dev/null +++ b/packages/vue/src/link-menu/src/index.ts @@ -0,0 +1,69 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import { iconSearch } from '@opentiny/vue-icon' +import template from 'virtual-template?pc' + +const $constants = { + DIALOG_TITLE: 'ui.linkMenu.title' +} + +export default defineComponent({ + name: $prefix + 'LinkMenu', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + icon: Object, + searchIcon: { + type: Object, + default: () => iconSearch() + }, + data: { + type: Array + }, + maxItem: { + type: Number, + validator: (value) => value >= 0 + }, + title: { + type: String, + default: '' + }, + defaultExpandAll: { + type: Boolean, + default: false + }, + ellipsis: { + type: Boolean, + default: true + }, + wrap: { + type: Boolean, + default: false + }, + props: { + default: () => ({ children: 'children', disabled: 'disabled', label: 'label' }) + }, + getMenuDataSync: Function, + keepSelectedNodes: { + type: Boolean, + default: true + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/link-menu/src/pc.vue b/packages/vue/src/link-menu/src/pc.vue new file mode 100644 index 000000000..81b1743fc --- /dev/null +++ b/packages/vue/src/link-menu/src/pc.vue @@ -0,0 +1,100 @@ + + + + diff --git a/packages/vue/src/link/index.ts b/packages/vue/src/link/index.ts new file mode 100644 index 000000000..43a61cbc1 --- /dev/null +++ b/packages/vue/src/link/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Link from './src/index' +import '@opentiny/vue-theme/link/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Link.install = function (Vue) { + Vue.component(Link.name, Link) +} + +Link.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Link.install(window.Vue) + } +} + +export default Link diff --git a/packages/vue/src/link/package.json b/packages/vue/src/link/package.json new file mode 100644 index 000000000..7c7b875b0 --- /dev/null +++ b/packages/vue/src/link/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-link", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/link/src/index.ts b/packages/vue/src/link/src/index.ts new file mode 100644 index 000000000..c554fa7fe --- /dev/null +++ b/packages/vue/src/link/src/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $prefix, $props, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'Link', + props: { + ...$props, + type: { + type: String, + default: 'default' + }, + underline: { + type: Boolean, + default: true + }, + href: String, + icon: [Object, String], + disabled: Boolean + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/link/src/pc.vue b/packages/vue/src/link/src/pc.vue new file mode 100644 index 000000000..c96e462da --- /dev/null +++ b/packages/vue/src/link/src/pc.vue @@ -0,0 +1,40 @@ + + + + diff --git a/packages/vue/src/list/index.ts b/packages/vue/src/list/index.ts new file mode 100644 index 000000000..6730bd72b --- /dev/null +++ b/packages/vue/src/list/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import List from './src/index.vue' +import '@opentiny/vue-theme-mobile/list/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +List.install = function (Vue) { + Vue.component(List.name, List) +} + +List.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + List.install(window.Vue) + } +} + +export default List diff --git a/packages/vue/src/list/package.json b/packages/vue/src/list/package.json new file mode 100644 index 000000000..38ae82dd5 --- /dev/null +++ b/packages/vue/src/list/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-list", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/list/src/index.vue b/packages/vue/src/list/src/index.vue new file mode 100644 index 000000000..052c81137 --- /dev/null +++ b/packages/vue/src/list/src/index.vue @@ -0,0 +1,69 @@ + + + + diff --git a/packages/vue/src/loading/index.ts b/packages/vue/src/loading/index.ts new file mode 100644 index 000000000..32eb6e025 --- /dev/null +++ b/packages/vue/src/loading/index.ts @@ -0,0 +1,42 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import service from './src/service.js' +import directive from './src/directive.js' +import '@opentiny/vue-theme/loading/index.less' +import { setupComponent } from '@opentiny/vue-common' +import { version } from './package.json' + +let Loadings = {} + +/* istanbul ignore next */ +Loadings.install = function (app) { + app.directive('loading', directive) +} + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Loadings.install(window.Vue) + } +} + +setupComponent.TINYLoading = { + init(root) { + root.$loading = service + } +} + +Loadings.service = service +Loadings.directive = directive +Loadings.version = version + +export default Loadings diff --git a/packages/vue/src/loading/package.json b/packages/vue/src/loading/package.json new file mode 100644 index 000000000..affe835e9 --- /dev/null +++ b/packages/vue/src/loading/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-loading", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-locale": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/loading/src/directive.js b/packages/vue/src/loading/src/directive.ts similarity index 100% rename from packages/loading/src/directive.js rename to packages/vue/src/loading/src/directive.ts diff --git a/packages/vue/src/loading/src/index.ts b/packages/vue/src/loading/src/index.ts new file mode 100644 index 000000000..470d7902f --- /dev/null +++ b/packages/vue/src/loading/src/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import { constants, tinyMode } from './service' +import template from 'virtual-template?pc|mobile' + +export default defineComponent({ + name: $prefix + 'Loading', + emits: [], + props: { + ...$props, + type: { + type: String, + validator: (value) => ~['primary', 'simple'].indexOf(value) + }, + loadtext: { + type: String, + default: () => constants.LOAD_ICON_TEXT + }, + _constants: Object + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/loading/src/index.vue b/packages/vue/src/loading/src/index.vue new file mode 100644 index 000000000..12a26716d --- /dev/null +++ b/packages/vue/src/loading/src/index.vue @@ -0,0 +1,45 @@ + + + + diff --git a/packages/vue/src/loading/src/mobile.vue b/packages/vue/src/loading/src/mobile.vue new file mode 100644 index 000000000..2e198b815 --- /dev/null +++ b/packages/vue/src/loading/src/mobile.vue @@ -0,0 +1,30 @@ + + + diff --git a/packages/vue/src/loading/src/pc.vue b/packages/vue/src/loading/src/pc.vue new file mode 100644 index 000000000..a2d9d7916 --- /dev/null +++ b/packages/vue/src/loading/src/pc.vue @@ -0,0 +1,27 @@ + + + diff --git a/packages/loading/src/service.js b/packages/vue/src/loading/src/service.ts similarity index 100% rename from packages/loading/src/service.js rename to packages/vue/src/loading/src/service.ts diff --git a/packages/vue/src/locales/index.ts b/packages/vue/src/locales/index.ts new file mode 100644 index 000000000..a4e7cbdf7 --- /dev/null +++ b/packages/vue/src/locales/index.ts @@ -0,0 +1,19 @@ +import Locales from './src/index.vue' +import '@opentiny/vue-theme/locales/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Locales.install = function (Vue) { + Vue.component(Locales.name, Locales) +} + +Locales.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Locales.install(window.Vue) + } +} + +export default Locales diff --git a/packages/vue/src/locales/package.json b/packages/vue/src/locales/package.json new file mode 100644 index 000000000..e80a5036c --- /dev/null +++ b/packages/vue/src/locales/package.json @@ -0,0 +1,23 @@ +{ + "name": "@opentiny/vue-locales", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-popover": "workspace:~", + "@opentiny/vue-locale": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/locales/src/index.vue b/packages/vue/src/locales/src/index.vue new file mode 100644 index 000000000..b02de56cb --- /dev/null +++ b/packages/vue/src/locales/src/index.vue @@ -0,0 +1,78 @@ + + + diff --git a/packages/vue/src/logon-user/index.ts b/packages/vue/src/logon-user/index.ts new file mode 100644 index 000000000..913ea6c6a --- /dev/null +++ b/packages/vue/src/logon-user/index.ts @@ -0,0 +1,18 @@ +import LogonUser from './src/index.vue' +import { version } from './package.json' + +/* istanbul ignore next */ +LogonUser.install = function (Vue) { + Vue.component(LogonUser.name, LogonUser) +} + +LogonUser.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + LogonUser.install(window.Vue) + } +} + +export default LogonUser diff --git a/packages/vue/src/logon-user/package.json b/packages/vue/src/logon-user/package.json new file mode 100644 index 000000000..f2d5377d8 --- /dev/null +++ b/packages/vue/src/logon-user/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-logon-user", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/logon-user/src/index.vue b/packages/vue/src/logon-user/src/index.vue new file mode 100644 index 000000000..67362dfe6 --- /dev/null +++ b/packages/vue/src/logon-user/src/index.vue @@ -0,0 +1,18 @@ + + + diff --git a/packages/vue/src/logout/index.ts b/packages/vue/src/logout/index.ts new file mode 100644 index 000000000..7a2f4400d --- /dev/null +++ b/packages/vue/src/logout/index.ts @@ -0,0 +1,19 @@ +import Logout from './src/index' +import '@opentiny/vue-theme/logout/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Logout.install = function (Vue) { + Vue.component(Logout.name, Logout) +} + +Logout.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Logout.install(window.Vue) + } +} + +export default Logout diff --git a/packages/vue/src/logout/package.json b/packages/vue/src/logout/package.json new file mode 100644 index 000000000..99e6b50d6 --- /dev/null +++ b/packages/vue/src/logout/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-logout", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-locale": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/logout/src/index.ts b/packages/vue/src/logout/src/index.ts new file mode 100644 index 000000000..8e0d38230 --- /dev/null +++ b/packages/vue/src/logout/src/index.ts @@ -0,0 +1,25 @@ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'Logout', + props: { + ...$props, + guestRole: { + type: String, + default: '-Default-' + }, + getLogoutUrl: Function, + redirectUrl: String, + isLocal: Boolean, + network: Function, + isMock: Boolean, + isGuestUser: Function, + showLogin: Function, + beforeLogout: Function + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/logout/src/pc.vue b/packages/vue/src/logout/src/pc.vue new file mode 100644 index 000000000..75fc5db93 --- /dev/null +++ b/packages/vue/src/logout/src/pc.vue @@ -0,0 +1,17 @@ + + + diff --git a/packages/vue/src/milestone/index.ts b/packages/vue/src/milestone/index.ts new file mode 100644 index 000000000..563256c74 --- /dev/null +++ b/packages/vue/src/milestone/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Milestone from './src/index' +import '@opentiny/vue-theme/milestone/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Milestone.install = function (Vue) { + Vue.component(Milestone.name, Milestone) +} + +Milestone.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Milestone.install(window.Vue) + } +} + +export default Milestone diff --git a/packages/vue/src/milestone/package.json b/packages/vue/src/milestone/package.json new file mode 100644 index 000000000..121350de1 --- /dev/null +++ b/packages/vue/src/milestone/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-milestone", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-tooltip": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/milestone/src/index.ts b/packages/vue/src/milestone/src/index.ts new file mode 100644 index 000000000..00b41a5fe --- /dev/null +++ b/packages/vue/src/milestone/src/index.ts @@ -0,0 +1,93 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + DEFAULT_COLOR: '#1890FF', + DEFAULT_BACK_COLOR: '#FFFFFF', + BOX_SHADOW_PX: '0px 0px 0px 4px', + FLAG_CONTENT_CLS: '.content' +} + +export default defineComponent({ + name: $prefix + 'Milestone', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + showNumber: { + type: Boolean, + default: true + }, + solid: { + type: Boolean, + default: false + }, + lineStyle: { + type: [String, Number], + default: 1 + }, + flagBefore: { + type: Boolean, + default: false + }, + completedField: { + type: String, + default: 'completed' + }, + milestonesStatus: { + type: Object, + default: () => ({}) + }, + statusField: { + type: String, + default: 'status' + }, + nameField: { + type: String, + default: 'name' + }, + flagField: { + type: String, + default: 'flags' + }, + flagNameField: { + type: String, + default: 'name' + }, + flagContentField: { + type: String, + default: 'content' + }, + flagStatusField: { + type: String, + default: 'status' + }, + timeField: { + type: String, + default: 'time' + }, + data: [Object, Array], + space: Number, + start: { + type: Number, + default: -1 + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/milestone/src/pc.vue b/packages/vue/src/milestone/src/pc.vue new file mode 100644 index 000000000..e72239260 --- /dev/null +++ b/packages/vue/src/milestone/src/pc.vue @@ -0,0 +1,129 @@ + + + + diff --git a/packages/vue/src/mini-picker/index.ts b/packages/vue/src/mini-picker/index.ts new file mode 100644 index 000000000..f7a6cb51d --- /dev/null +++ b/packages/vue/src/mini-picker/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import MiniPicker from './src/index.vue' +import '@opentiny/vue-theme-mobile/mini-picker/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +MiniPicker.install = function (Vue) { + Vue.component(MiniPicker.name, MiniPicker) +} + +MiniPicker.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + MiniPicker.install(window.Vue) + } +} + +export default MiniPicker diff --git a/packages/vue/src/mini-picker/package.json b/packages/vue/src/mini-picker/package.json new file mode 100644 index 000000000..737b09e5c --- /dev/null +++ b/packages/vue/src/mini-picker/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-mini-picker", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-picker-column": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/mini-picker/src/index.vue b/packages/vue/src/mini-picker/src/index.vue new file mode 100644 index 000000000..0174fb6b7 --- /dev/null +++ b/packages/vue/src/mini-picker/src/index.vue @@ -0,0 +1,110 @@ + + + + diff --git a/packages/vue/src/modal/index.ts b/packages/vue/src/modal/index.ts new file mode 100644 index 000000000..51c3cf49d --- /dev/null +++ b/packages/vue/src/modal/index.ts @@ -0,0 +1,125 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { createComponent, setupComponent } from '@opentiny/vue-common' +import { MsgQueue } from '@opentiny/vue-renderless/modal' +import TINYModal from './src/index' +import { version } from './package.json' + +TINYModal.version = version + +TINYModal.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +export function Modal(options) { + return new Promise((resolve) => { + if (options && options.id && MsgQueue.some((comp) => comp.id === options.id)) { + resolve('exist') + } else { + let events = options.events || {} + let $modal + + options.events = { + ...events, + hide(params) { + events.hide && events.hide.call(this, params) + + $modal.beforeUnmouted() + resolve(params.type) + } + } + + $modal = createComponent({ + el: document.createElement('div'), + propsData: options, + component: TINYModal + }) + + $modal.open() + } + }) +} + +const modal = Modal + +const types = ['alert', 'confirm', 'message'] + +types.forEach((type, index) => { + let defOpts = { showFooter: true } + + if (index === 2) { + defOpts = { + mask: false, + lockView: false, + showHeader: false + } + } + + defOpts.type = type + + if (index === 1) { + defOpts.status = 'question' + } + + TINYModal[type] = Modal[type] = function (message, title, options) { + let opts + + if (typeof message === 'object' && message !== null) { + opts = message + } else if (title) { + opts = { title } + } + + if (message === undefined || message === null) { + message = '' + } + + return modal({ + message: message.toString(), + type, + ...defOpts, + ...opts, + ...options + }) + } +}) + +export const alert = (Modal as any).alert +export const message = (Modal as any).message +export const confirm = (Modal as any).confirm + +TINYModal.installed = false +setupComponent.TINYModal = { + install(Vue) { + if (TINYModal.installed) return + // vue3 或 vue2 + const isVue2 = !!Vue.component + const tinyMode = isVue2 ? Vue.prototype.tiny_mode : Vue.config.globalProperties.tiny_mode + TINYModal.tiny_mode = process.env.TINY_MODE || (tinyMode && tinyMode.value) + TINYModal.installed = true + }, + init(root) { + let prefix = root.$TinyModalApiPrefix || '$' + + root[`${prefix}alert`] = (Modal as any).alert + root[`${prefix}message`] = (Modal as any).message + root[`${prefix}confirm`] = (Modal as any).confirm + } +} + +TINYModal.install = function (Vue) { + Vue.component(TINYModal.name, TINYModal) +} + +export default TINYModal diff --git a/packages/vue/src/modal/package.json b/packages/vue/src/modal/package.json new file mode 100644 index 000000000..5a4924630 --- /dev/null +++ b/packages/vue/src/modal/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-modal", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-button": "workspace:~", + "@opentiny/vue-locale": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/modal/src/index.ts b/packages/vue/src/modal/src/index.ts new file mode 100644 index 000000000..487109ecd --- /dev/null +++ b/packages/vue/src/modal/src/index.ts @@ -0,0 +1,85 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +const $constants = { + MODAL_STATUS: { + INFO: 'info', + SUCCESS: 'success', + WARNING: 'warning', + ERROR: 'error', + LOADING: 'loading' + }, + NODAL_TYPE: { + ALERT: 'alert', + CONFIRM: 'confirm', + MESSAGE: 'message' + }, + STATUS_MAPPING_CLASSS: { + INFO: 'tiny-modal-svg__info', + SUCCESS: 'tiny-modal-svg__success', + WARNING: 'tiny-modal-svg__warning', + ERROR: 'tiny-modal-svg__error', + LOADING: 'tiny-modal-svg__refresh roll' + } +} + +export default defineComponent({ + name: $prefix + 'Modal', + componentName: 'Modal', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + animat: { type: Boolean, default: () => true }, + beforeClose: Function, + duration: { type: [Number, String], default: () => 3000 }, + escClosable: Boolean, + events: Object, + fullscreen: Boolean, + height: [Number, String], + id: String, + isFormReset: { + type: Boolean, + default: true + }, + lockScroll: Boolean, + lockView: { type: Boolean, default: () => true }, + marginSize: { type: [Number, String], default: 10 }, + mask: { type: Boolean, default: () => true }, + maskClosable: Boolean, + message: [String, Function, Object], + minHeight: { type: [Number, String], default: () => 200 }, + minWidth: { type: [Number, String], default: () => 340 }, + modelValue: Boolean, + resize: Boolean, + showFooter: Boolean, + showHeader: { type: Boolean, default: true }, + status: { + type: [String, Object], + default: '' + }, + title: String, + top: { type: [Number, String], default: 15 }, + type: { type: String, default: 'alert' }, + vSize: String, + width: [Number, String], + zIndex: [Number, String], + mode: null + }, + setup(props, context) { + return $setup({ props, context, template }) + } +}) diff --git a/packages/vue/src/modal/src/mobile.vue b/packages/vue/src/modal/src/mobile.vue new file mode 100644 index 000000000..d55474f76 --- /dev/null +++ b/packages/vue/src/modal/src/mobile.vue @@ -0,0 +1,211 @@ + + diff --git a/packages/vue/src/modal/src/pc.vue b/packages/vue/src/modal/src/pc.vue new file mode 100644 index 000000000..51d50394d --- /dev/null +++ b/packages/vue/src/modal/src/pc.vue @@ -0,0 +1,263 @@ + + diff --git a/packages/vue/src/month-range/index.ts b/packages/vue/src/month-range/index.ts new file mode 100644 index 000000000..baffc81c2 --- /dev/null +++ b/packages/vue/src/month-range/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import MonthRange from './src/index.vue' +import { version } from './package.json' + +/* istanbul ignore next */ +MonthRange.install = function (Vue) { + Vue.component(MonthRange.name, MonthRange) +} + +MonthRange.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + MonthRange.install(window.Vue) + } +} + +export default MonthRange diff --git a/packages/vue/src/month-range/package.json b/packages/vue/src/month-range/package.json new file mode 100644 index 000000000..fa4f488aa --- /dev/null +++ b/packages/vue/src/month-range/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-month-range", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-month-table": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/month-range/src/index.vue b/packages/vue/src/month-range/src/index.vue new file mode 100644 index 000000000..0d6d2fad6 --- /dev/null +++ b/packages/vue/src/month-range/src/index.vue @@ -0,0 +1,127 @@ + + + + diff --git a/packages/vue/src/month-table/index.ts b/packages/vue/src/month-table/index.ts new file mode 100644 index 000000000..447cb064b --- /dev/null +++ b/packages/vue/src/month-table/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import MonthTable from './src/index.vue' +import { version } from './package.json' + +/* istanbul ignore next */ +MonthTable.install = function (Vue) { + Vue.component(MonthTable.name, MonthTable) +} + +MonthTable.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + MonthTable.install(window.Vue) + } +} + +export default MonthTable diff --git a/packages/vue/src/month-table/package.json b/packages/vue/src/month-table/package.json new file mode 100644 index 000000000..ebc1831e2 --- /dev/null +++ b/packages/vue/src/month-table/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-month-table", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-locale": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/month-table/src/index.vue b/packages/vue/src/month-table/src/index.vue new file mode 100644 index 000000000..154cb1fa6 --- /dev/null +++ b/packages/vue/src/month-table/src/index.vue @@ -0,0 +1,55 @@ + + + + diff --git a/packages/vue/src/multi-select/index.ts b/packages/vue/src/multi-select/index.ts new file mode 100644 index 000000000..c7f658481 --- /dev/null +++ b/packages/vue/src/multi-select/index.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import MultiSelect from './src/index' +import '@opentiny/vue-theme-mobile/multi-select/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +MultiSelect.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +MultiSelect.install = function (Vue) { + Vue.component(MultiSelect.name, MultiSelect) +} + +MultiSelect.version = version + +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + MultiSelect.install(window.Vue) + } +} + +export default MultiSelect diff --git a/packages/vue/src/multi-select/package.json b/packages/vue/src/multi-select/package.json new file mode 100644 index 000000000..7449e0b40 --- /dev/null +++ b/packages/vue/src/multi-select/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-multi-select", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/multi-select/src/index.ts b/packages/vue/src/multi-select/src/index.ts new file mode 100644 index 000000000..6915bb111 --- /dev/null +++ b/packages/vue/src/multi-select/src/index.ts @@ -0,0 +1,25 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?mobile' + +export default defineComponent({ + name: $prefix + 'MultiSelect', + inject: {}, + props: { + ...$props + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/multi-select/src/mobile.vue b/packages/vue/src/multi-select/src/mobile.vue new file mode 100644 index 000000000..248368429 --- /dev/null +++ b/packages/vue/src/multi-select/src/mobile.vue @@ -0,0 +1,99 @@ + + + + diff --git a/packages/vue/src/nav-bar/index.ts b/packages/vue/src/nav-bar/index.ts new file mode 100644 index 000000000..098d042dc --- /dev/null +++ b/packages/vue/src/nav-bar/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import NavBar from './src/index.vue' +import '@opentiny/vue-theme-mobile/nav-bar/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +NavBar.install = function (Vue) { + Vue.component(NavBar.name, NavBar) +} + +NavBar.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + NavBar.install(window.Vue) + } +} + +export default NavBar diff --git a/packages/vue/src/nav-bar/package.json b/packages/vue/src/nav-bar/package.json new file mode 100644 index 000000000..8fbeb98d4 --- /dev/null +++ b/packages/vue/src/nav-bar/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-nav-bar", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/nav-bar/src/index.vue b/packages/vue/src/nav-bar/src/index.vue new file mode 100644 index 000000000..5a68492dd --- /dev/null +++ b/packages/vue/src/nav-bar/src/index.vue @@ -0,0 +1,90 @@ + + diff --git a/packages/vue/src/nav-menu/index.ts b/packages/vue/src/nav-menu/index.ts new file mode 100644 index 000000000..0f140cfec --- /dev/null +++ b/packages/vue/src/nav-menu/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import NavMenu from './src/index' +import '@opentiny/vue-theme/nav-menu/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +NavMenu.install = function (Vue) { + Vue.component(NavMenu.name, NavMenu) +} + +NavMenu.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + NavMenu.install(window.Vue) + } +} + +export default NavMenu diff --git a/packages/vue/src/nav-menu/package.json b/packages/vue/src/nav-menu/package.json new file mode 100644 index 000000000..190363b95 --- /dev/null +++ b/packages/vue/src/nav-menu/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-nav-menu", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-locale": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/nav-menu/src/index.ts b/packages/vue/src/nav-menu/src/index.ts new file mode 100644 index 000000000..a80de7f36 --- /dev/null +++ b/packages/vue/src/nav-menu/src/index.ts @@ -0,0 +1,44 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'NavMenu', + props: { + ...$props, + data: Array, + overflow: { + type: String, + default: 'auto', + validator(value) { + return /^(auto|retract|fixed|hidden)$/.test(value) + } + }, + parentKey: String, + beforeSkip: Function, + fetchMenuData: Function, + fields: Object, + prevent: { + type: Boolean, + default: false + }, + allowFullUrl: { + type: Boolean, + default: false + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/nav-menu/src/pc.vue b/packages/vue/src/nav-menu/src/pc.vue new file mode 100644 index 000000000..5cb31ced7 --- /dev/null +++ b/packages/vue/src/nav-menu/src/pc.vue @@ -0,0 +1,124 @@ + + + + diff --git a/packages/vue/src/notify/index.ts b/packages/vue/src/notify/index.ts new file mode 100644 index 000000000..96b2fdf1c --- /dev/null +++ b/packages/vue/src/notify/index.ts @@ -0,0 +1,160 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ + +import { createComponent } from '@opentiny/vue-common' +import NotifyConstructor from './src/index.vue' +import '@opentiny/vue-theme/notify/index.less' +import { iconSuccessful, iconError, iconInfoSolid, iconWarning } from '@opentiny/vue-icon' + +let seed = 1 +let instances = [] + +const IconMap = { + warning: iconWarning(), + error: iconError(), + info: iconInfoSolid(), + success: iconSuccessful() +} + +const durationMap = { + info: 5000, + success: 5000, + warning: 10000, + error: 10000 +} + +const positionList = ['top-right', 'bottom-right'] + +const debounce = (fn, debounceDelay) => { + let timer = null + + return async function () { + if (timer) { + clearTimeout(timer) + } + + let instance = null + + await new Promise((resolve) => { + timer = setTimeout(() => { + instance = fn.apply(this, arguments) + timer = null + + resolve() + }, debounceDelay) + }) + + return instance + } +} + +const notify = (options) => { + if (!~Object.keys(IconMap).indexOf(options.type)) { + options.type = 'info' + } + + options.duration = options.duration ? options.duration : durationMap[options.type] + options.position = !~positionList.indexOf(options.position) ? 'bottom-right' : options.position + !options.statusIcon && options.type && (options.statusIcon = IconMap[options.type]) + + const id = 'notify_' + seed++ + const userOnClose = options.onClose + const position = options.position + + options.onClose = function () { + Notify.close(id, userOnClose) + } + + const instance = createComponent({ + el: document.createElement('div'), + propsData: options, + component: NotifyConstructor + }) + instance.id = id + document.body.appendChild(instance.$el) + + let verticalOffset = options.offset || 0 + + instances + .filter((item) => item.state.position === position) + .forEach((item) => { + verticalOffset += item.$el.offsetHeight + 16 + }) + + verticalOffset += options.verticalOffset ? Number(options.verticalOffset) : 16 + instances.push(instance) + + instance.dom = instance.$el + instance.dom.style.zIndex = instance.getZindex() + instance.state.verticalOffset = verticalOffset + instance.state.visible = true + + return instance +} + +const Notify = (options) => { + let { debounceDelay } = options + + if (debounceDelay) { + return debounce(() => notify(options), debounceDelay) + } else { + return notify(options) + } +} +Notify.close = function (id, userOnClose) { + let index = -1 + let len = instances.length + let instance + + for (let i = 0; i < len; i++) { + let tmp = instances[i] + if (tmp.id === id) { + index = i + instance = tmp + break + } + } + + if (!instance) { + return + } + + typeof userOnClose === 'function' && userOnClose(instance) + let lastHeight = instance.$el.offsetHeight + instance.$el.parentNode.removeChild(instance.$el) + instances.splice(index, 1) + + if (len <= 1) { + return + } + + let removedPosition = instance.position + let copys = instances.slice(index) + + copys.forEach((copy) => { + if (copy.position === removedPosition) { + let height = parseInt(copy.dom.style[instance.state.verticalProperty], 10) - lastHeight - 16 + copy.dom.style[instance.state.verticalProperty] = height + 'px' + } + }) +} + +Notify.closeAll = function () { + let copys = instances.slice(0) + + copys = copys.reverse() + copys.forEach((instance) => { + instance.close() + }) +} + +export default Notify diff --git a/packages/vue/src/notify/package.json b/packages/vue/src/notify/package.json new file mode 100644 index 000000000..492f066cc --- /dev/null +++ b/packages/vue/src/notify/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-notify", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/notify/src/index.vue b/packages/vue/src/notify/src/index.vue new file mode 100644 index 000000000..a86129f99 --- /dev/null +++ b/packages/vue/src/notify/src/index.vue @@ -0,0 +1,119 @@ + + diff --git a/packages/vue/src/numeric/index.ts b/packages/vue/src/numeric/index.ts new file mode 100644 index 000000000..d541eecc1 --- /dev/null +++ b/packages/vue/src/numeric/index.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Numeric from './src/index' +import { version } from './package.json' + +Numeric.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Numeric.install = function (Vue) { + Vue.component(Numeric.name, Numeric) +} + +Numeric.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Numeric.install(window.Vue) + } +} + +export default Numeric diff --git a/packages/vue/src/numeric/package.json b/packages/vue/src/numeric/package.json new file mode 100644 index 000000000..68af0699d --- /dev/null +++ b/packages/vue/src/numeric/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-numeric", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/numeric/src/index.ts b/packages/vue/src/numeric/src/index.ts new file mode 100644 index 000000000..b12903304 --- /dev/null +++ b/packages/vue/src/numeric/src/index.ts @@ -0,0 +1,120 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +const $constants = { + MAX: 'aria-valuemax', + MIN: 'aria-valuemin', + VALUENOW: 'aria-valuenow', + DISABLED: 'aria-disabled', + KEY: 'role', + VALUE: 'spinbutton', + EVENT_NAME: { + blur: 'form.blur', + change: 'form.change' + }, + COMPONENT_NAME: 'FormItem' +} + +export default defineComponent({ + name: $prefix + 'Numeric', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + allowEmpty: { + type: Boolean, + default: false + }, + circulate: Boolean, + controls: { + type: Boolean, + default: true + }, + controlsPosition: { + type: String, + default: '' + }, + disabled: Boolean, + format: [Object, String], + hideUnit: { + type: Boolean, + default: false + }, + holdZero: { + type: Boolean, + default: true + }, + label: String, + max: { + type: [Number, String], + default: Infinity + }, + min: { + type: [Number, String], + default: -Infinity + }, + modelTruncation: { + type: Boolean, + default: true + }, + modelValue: {}, + mouseWheel: Boolean, + name: String, + placeholder: String, + plugin: Function, + precision: { + type: Number, + validator(val) { + return val >= 0 && val === parseInt(val, 10) + } + }, + size: String, + step: { + type: [Number, String], + default: 1 + }, + stepStrictly: { + type: Boolean, + default: false + }, + strictInput: { + type: Boolean, + default: false + }, + stringMode: Boolean, + tabindex: { + type: String, + default: '1' + }, + theme: { + type: String, + default: '' + }, + unit: String, + unitCenter: { + type: Boolean, + default: false + }, + validateEvent: { + type: Boolean, + default: true + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/numeric/src/mobile.vue b/packages/vue/src/numeric/src/mobile.vue new file mode 100644 index 000000000..d526fa75d --- /dev/null +++ b/packages/vue/src/numeric/src/mobile.vue @@ -0,0 +1,106 @@ + + + + diff --git a/packages/vue/src/numeric/src/pc.vue b/packages/vue/src/numeric/src/pc.vue new file mode 100644 index 000000000..9c49b0640 --- /dev/null +++ b/packages/vue/src/numeric/src/pc.vue @@ -0,0 +1,129 @@ + + + + diff --git a/packages/vue/src/option-group/index.ts b/packages/vue/src/option-group/index.ts new file mode 100644 index 000000000..a04d6ced0 --- /dev/null +++ b/packages/vue/src/option-group/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import OptionGroup from './src/index.vue' +import '@opentiny/vue-theme/option-group/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +OptionGroup.install = function (Vue) { + Vue.component(OptionGroup.name, OptionGroup) +} + +OptionGroup.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + OptionGroup.install(window.Vue) + } +} + +export default OptionGroup diff --git a/packages/vue/src/option-group/package.json b/packages/vue/src/option-group/package.json new file mode 100644 index 000000000..aaeac94b5 --- /dev/null +++ b/packages/vue/src/option-group/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-option-group", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/option-group/src/index.vue b/packages/vue/src/option-group/src/index.vue new file mode 100644 index 000000000..4a89ae6f8 --- /dev/null +++ b/packages/vue/src/option-group/src/index.vue @@ -0,0 +1,41 @@ + + + + diff --git a/packages/vue/src/option/index.ts b/packages/vue/src/option/index.ts new file mode 100644 index 000000000..0c5d5dbe4 --- /dev/null +++ b/packages/vue/src/option/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Option from './src/index.vue' +import '@opentiny/vue-theme/option/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Option.install = function (Vue) { + Vue.component(Option.name, Option) +} + +Option.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Option.install(window.Vue) + } +} + +export default Option diff --git a/packages/vue/src/option/package.json b/packages/vue/src/option/package.json new file mode 100644 index 000000000..ac6065ab0 --- /dev/null +++ b/packages/vue/src/option/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-option", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/option/src/index.vue b/packages/vue/src/option/src/index.vue new file mode 100644 index 000000000..12df82ffd --- /dev/null +++ b/packages/vue/src/option/src/index.vue @@ -0,0 +1,74 @@ + + + + diff --git a/packages/vue/src/pager-item/index.ts b/packages/vue/src/pager-item/index.ts new file mode 100644 index 000000000..9a8b453a5 --- /dev/null +++ b/packages/vue/src/pager-item/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import PagerItem from './src/index.vue' +import { version } from './package.json' + +/* istanbul ignore next */ +PagerItem.install = function (Vue) { + Vue.component(PagerItem.name, PagerItem) +} + +PagerItem.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + PagerItem.install(window.Vue) + } +} + +export default PagerItem diff --git a/packages/vue/src/pager-item/package.json b/packages/vue/src/pager-item/package.json new file mode 100644 index 000000000..0b2655b00 --- /dev/null +++ b/packages/vue/src/pager-item/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-pager-item", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-locale": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/pager-item/src/index.vue b/packages/vue/src/pager-item/src/index.vue new file mode 100644 index 000000000..bc66d6504 --- /dev/null +++ b/packages/vue/src/pager-item/src/index.vue @@ -0,0 +1,66 @@ + + + + diff --git a/packages/vue/src/pager/index.ts b/packages/vue/src/pager/index.ts new file mode 100644 index 000000000..1977ab98f --- /dev/null +++ b/packages/vue/src/pager/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Pager from './src/index.vue' +import '@opentiny/vue-theme/pager/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Pager.install = function (Vue) { + Vue.component(Pager.name, Pager) +} + +Pager.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Pager.install(window.Vue) + } +} + +export default Pager diff --git a/packages/vue/src/pager/package.json b/packages/vue/src/pager/package.json new file mode 100644 index 000000000..6c2fc53d5 --- /dev/null +++ b/packages/vue/src/pager/package.json @@ -0,0 +1,23 @@ +{ + "name": "@opentiny/vue-pager", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-popover": "workspace:~", + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-pager-item": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/pager/src/index.vue b/packages/vue/src/pager/src/index.vue new file mode 100644 index 000000000..7042e191b --- /dev/null +++ b/packages/vue/src/pager/src/index.vue @@ -0,0 +1,651 @@ + + diff --git a/packages/vue/src/panel/index.ts b/packages/vue/src/panel/index.ts new file mode 100644 index 000000000..559dbe620 --- /dev/null +++ b/packages/vue/src/panel/index.ts @@ -0,0 +1,28 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Panel from './src/index' + +/* istanbul ignore next */ +Panel.install = function (Vue) { + Vue.component(Panel.name, Panel) +} + +Panel.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Panel.install(window.Vue) + } +} + +export default Panel diff --git a/packages/vue/src/panel/package.json b/packages/vue/src/panel/package.json new file mode 100644 index 000000000..7027e4836 --- /dev/null +++ b/packages/vue/src/panel/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-panel", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/panel/src/index.ts b/packages/vue/src/panel/src/index.ts new file mode 100644 index 000000000..1d88733a5 --- /dev/null +++ b/packages/vue/src/panel/src/index.ts @@ -0,0 +1,50 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $prefix, $props, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'Panel', + props: { + ...$props, + expand: { + type: Boolean, + default: true + }, + foot: { + type: String + }, + head: { + type: String + }, + iconOpen: { + type: String, + default: 'icon-chevron-down' + }, + iconClose: { + type: String, + default: 'icon-chevron-right' + }, + isToggle: { + type: Boolean, + default: false + }, + transition: { + type: String, + default: 'panel' + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/panel/src/pc.vue b/packages/vue/src/panel/src/pc.vue new file mode 100644 index 000000000..f33e49328 --- /dev/null +++ b/packages/vue/src/panel/src/pc.vue @@ -0,0 +1,57 @@ + + + + diff --git a/packages/vue/src/picker-column/index.ts b/packages/vue/src/picker-column/index.ts new file mode 100644 index 000000000..251ee0f01 --- /dev/null +++ b/packages/vue/src/picker-column/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import PickerColumn from './src/index.vue' +import '@opentiny/vue-theme-mobile/picker-column/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +PickerColumn.install = function (Vue) { + Vue.component(PickerColumn.name, PickerColumn) +} + +PickerColumn.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + PickerColumn.install(window.Vue) + } +} + +export default PickerColumn diff --git a/packages/vue/src/picker-column/package.json b/packages/vue/src/picker-column/package.json new file mode 100644 index 000000000..92b7da981 --- /dev/null +++ b/packages/vue/src/picker-column/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-picker-column", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/picker-column/src/index.vue b/packages/vue/src/picker-column/src/index.vue new file mode 100644 index 000000000..347c0b9f9 --- /dev/null +++ b/packages/vue/src/picker-column/src/index.vue @@ -0,0 +1,56 @@ + + + + diff --git a/packages/vue/src/picker/index.ts b/packages/vue/src/picker/index.ts new file mode 100644 index 000000000..4a02a1537 --- /dev/null +++ b/packages/vue/src/picker/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Picker from './src/index.vue' +import '@opentiny/vue-theme/picker/index.less' +import '@opentiny/vue-theme/input/index.less' +import { version } from './package.json' + +Picker.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Picker.install = function (Vue) { + Vue.component(Picker.name, Picker) +} + +Picker.version = version + +export default Picker diff --git a/packages/vue/src/picker/package.json b/packages/vue/src/picker/package.json new file mode 100644 index 000000000..fc14771f4 --- /dev/null +++ b/packages/vue/src/picker/package.json @@ -0,0 +1,28 @@ +{ + "name": "@opentiny/vue-picker", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-input": "workspace:~", + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-date-panel": "workspace:~", + "@opentiny/vue-date-range": "workspace:~", + "@opentiny/vue-month-range": "workspace:~", + "@opentiny/vue-time": "workspace:~", + "@opentiny/vue-time-range": "workspace:~", + "@opentiny/vue-time-panel": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/picker/src/index.vue b/packages/vue/src/picker/src/index.vue new file mode 100644 index 000000000..4ba99a4aa --- /dev/null +++ b/packages/vue/src/picker/src/index.vue @@ -0,0 +1,257 @@ + + + + diff --git a/packages/vue/src/pop-upload/index.ts b/packages/vue/src/pop-upload/index.ts new file mode 100644 index 000000000..9a76f428e --- /dev/null +++ b/packages/vue/src/pop-upload/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import PopUpload from './src/index' +import '@opentiny/vue-theme/pop-upload/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +PopUpload.install = function (Vue) { + Vue.component(PopUpload.name, PopUpload) +} + +PopUpload.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + PopUpload.install(window.Vue) + } +} + +export default PopUpload diff --git a/packages/vue/src/pop-upload/package.json b/packages/vue/src/pop-upload/package.json new file mode 100644 index 000000000..4c7a382b5 --- /dev/null +++ b/packages/vue/src/pop-upload/package.json @@ -0,0 +1,25 @@ +{ + "name": "@opentiny/vue-pop-upload", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-alert": "workspace:~", + "@opentiny/vue-button": "workspace:~", + "@opentiny/vue-modal": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-file-upload": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/pop-upload/src/index.ts b/packages/vue/src/pop-upload/src/index.ts new file mode 100644 index 000000000..e8162751e --- /dev/null +++ b/packages/vue/src/pop-upload/src/index.ts @@ -0,0 +1,96 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + KB: 'KB', + FILE_NAME: 'ui.popupload.fileName', + FILE_SIZE: 'ui.popupload.fileSize', + FILE_STATUS: 'ui.popupload.fileStatus', + DIALOG_TITLE: 'ui.popupload.dialogTitle', + UPLOAD_ERROR: 'ui.popupload.uploadError', + ERROR_NUM_TIPS: 'ui.popupload.errorNumTips', + UPLOAD_SUCCESS: 'ui.popupload.uploadSuccess', + TIPS_TITLE_TEXT: 'ui.popupload.tipsFileText', + ERROR_TYPE_TIPS: 'ui.popupload.errorTypeTips', + ERROR_SIZE_TIPS: 'ui.popupload.errorSizeTips', + SAVE_BUTTON_TEXT: 'ui.popupload.saveButtonText', + UPLOAD_BUTTON_TEXT: 'ui.popupload.uploadButtonText', + CANCEL_BUTTTON_TEXT: 'ui.popupload.cancelButtonText', + UPLOADS_BUTTON_TEXT: 'ui.popupload.uploadsButtonText', + LIMIT_UPLOAD_FILE_TYPE: 'ui.popupload.limitUploadFileType', + LIMIT_UPLOAD_FILE_SIZE: 'ui.popupload.limitUploadFileSize', + LIMIT_UPLOAD_FILE_NUMBER: 'ui.popupload.limitUploadFileNumber' +} + +export default defineComponent({ + name: $prefix + 'PopUpload', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + size: String, + data: Object, + uploadName: String, + dialogTitle: { + type: String, + default: '' + }, + action: { + type: String, + default: '' + }, + uploadButtonText: { + type: String, + default: '' + }, + headers: { + type: Object, + default: () => ({}) + }, + withCredentials: { + type: Boolean, + default: false + }, + limit: Number, + multiple: Boolean, + disabled: { + type: Boolean, + default: false + }, + filters: { + type: Object, + default: () => ({}) + }, + accept: String, + submitButtonText: { + typee: String, + default: '' + }, + cancelButtonText: { + typee: String, + default: '' + }, + uploadFileType: Array, + beforeUpload: Function, + beforeRemove: Function, + maxUploadFileSize: Number, + httpRequest: Function + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/pop-upload/src/pc.vue b/packages/vue/src/pop-upload/src/pc.vue new file mode 100644 index 000000000..335788b78 --- /dev/null +++ b/packages/vue/src/pop-upload/src/pc.vue @@ -0,0 +1,148 @@ + + + + diff --git a/packages/vue/src/popeditor/index.ts b/packages/vue/src/popeditor/index.ts new file mode 100644 index 000000000..3ac30a924 --- /dev/null +++ b/packages/vue/src/popeditor/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Popeditor from './src/index' +import '@opentiny/vue-theme/popeditor/index.less' +import { version } from './package.json' + +Popeditor.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Popeditor.install = function (Vue) { + Vue.component(Popeditor.name, Popeditor) +} + +Popeditor.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Popeditor.install(window.Vue) + } +} + +export default Popeditor diff --git a/packages/vue/src/popeditor/package.json b/packages/vue/src/popeditor/package.json new file mode 100644 index 000000000..80e0549f1 --- /dev/null +++ b/packages/vue/src/popeditor/package.json @@ -0,0 +1,25 @@ +{ + "name": "@opentiny/vue-popeditor", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-input": "workspace:~", + "@opentiny/vue-grid": "workspace:~", + "@opentiny/vue-pager": "workspace:~", + "@opentiny/vue-dialog-box": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/popeditor/src/index.ts b/packages/vue/src/popeditor/src/index.ts new file mode 100644 index 000000000..137a48303 --- /dev/null +++ b/packages/vue/src/popeditor/src/index.ts @@ -0,0 +1,206 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import { iconPopup, iconSearch } from '@opentiny/vue-icon' +import template from 'virtual-template?pc' + +const $constants = { + TITLE: 'ui.popeditor.title', + COLUMNS_TYPE: { + selection: 'selection', + radio: 'radio', + index: 'index', + width: 40 + }, + GRID_REF: { + history: 'historyGrid', + source: 'sourceGrid' + }, + TAG_NAME: 'INPUT', + MODAL_WIDTH: { + multi: 900, + radio: 600 + }, + ACTIVE_NAME: { + history: 'history', + source: 'source' + }, + TYPE_GRID: 'grid', + TYPE_TREE: 'tree', + ID: 'id', + LABEL: 'label' +} + +export default defineComponent({ + name: $prefix + 'Popeditor', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + modelValue: { + type: [String, Number, Array], + default: '' + }, + tabindex: { + type: String, + default: '1' + }, + placeholder: { + type: String, + default: '' + }, + size: String, + trigger: { + type: String, + default: 'default' + }, + icon: { + type: Object, + default() { + return iconPopup() + } + }, + iconSearch: { + type: Object, + default() { + return iconSearch() + } + }, + title: { + type: String, + default: '' + }, + textField: { + type: String, + default: 'label' + }, + textSplit: { + type: String, + default: '/' + }, + valueField: { + type: String, + default: 'id' + }, + valueSplit: { + type: String, + default: ';' + }, + popseletor: { + type: String, + default: 'grid', + validator(value) { + return ['grid', 'tree'].includes(value) + } + }, + conditions: { + type: Array, + default() { + return [] + } + }, + width: { + type: [String, Number], + default: '' + }, + gridOp: { + type: Object, + default() { + return { + columns: [], + data: [] + } + } + }, + remoteSearch: Function, + dataset: Object, + alwaysLoad: { + type: Boolean, + default: false + }, + treeOp: { + type: Object, + default() { + return { + data: [] + } + } + }, + pagerOp: { + type: Object, + default() { + return {} + } + }, + disabled: { + type: Boolean, + default: false + }, + readonly: { + type: Boolean, + default: true + }, + multi: { + type: Boolean, + default: false + }, + showClearBtn: { + type: Boolean, + default: true + }, + showPager: { + type: Boolean, + default: false + }, + showHistory: { + type: Boolean, + default: false + }, + autoLookup: { + type: Boolean, + default: true + }, + beforeReset: Function, + resize: { + type: Boolean, + default: false + }, + dialogClass: { + type: String, + default: '' + }, + textRenderSource: Function, + draggable: { + type: Boolean, + default: true + }, + placement: { + type: String, + default: 'bottom-start' + }, + popperAppendToBody: { + type: Boolean, + default: true + }, + suggest: Boolean, + beforeClose: { + type: Function, + default: () => () => true + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/popeditor/src/pc.vue b/packages/vue/src/popeditor/src/pc.vue new file mode 100644 index 000000000..08db4cf70 --- /dev/null +++ b/packages/vue/src/popeditor/src/pc.vue @@ -0,0 +1,314 @@ + + + + diff --git a/packages/vue/src/popover/index.ts b/packages/vue/src/popover/index.ts new file mode 100644 index 000000000..09c2bbdec --- /dev/null +++ b/packages/vue/src/popover/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Popover from './src/index' +import '@opentiny/vue-theme/popover/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Popover.install = function (Vue) { + Vue.component(Popover.name, Popover) +} + +Popover.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +Popover.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Popover.install(window.Vue) + } +} + +export default Popover diff --git a/packages/vue/src/popover/package.json b/packages/vue/src/popover/package.json new file mode 100644 index 000000000..ccee7edab --- /dev/null +++ b/packages/vue/src/popover/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-popover", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/popover/src/index.ts b/packages/vue/src/popover/src/index.ts new file mode 100644 index 000000000..96de73b8b --- /dev/null +++ b/packages/vue/src/popover/src/index.ts @@ -0,0 +1,93 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +export default defineComponent({ + inheritAttrs: true, + name: $prefix + 'Popover', + props: { + ...$props, + appendToBody: { + type: Boolean, + default: true + }, + arrowOffset: { + type: Number, + default: 0 + }, + boundariesPadding: { + type: Number, + default: 5 + }, + closeDelay: { + type: Number, + default: 200 + }, + content: String, + disabled: Boolean, + modelValue: Boolean, + offset: { + default: 0 + }, + openDelay: { + type: Number, + default: 0 + }, + placement: { + type: String, + default: 'bottom' + }, + popper: {}, + popperClass: String, + popperOptions: { + type: Object, + default: () => ({ gpuAcceleration: false }) + }, + reference: {}, + tabindex: { + type: Number, + default: 0 + }, + title: String, + transformOrigin: { + type: [Boolean, String], + default: true + }, + transition: { + type: String, + default: 'fade-in-linear' + }, + trigger: { + type: String, + default: 'click', + validator: (value) => ~['click', 'focus', 'hover', 'manual'].indexOf(value) + }, + visibleArrow: { + default: true + }, + width: { + type: [String, Number] + }, + height: { + type: [String, Number] + }, + maxHeight: { + type: [String, Number] + }, + listData: [Object, Array] + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/popover/src/index.vue b/packages/vue/src/popover/src/index.vue new file mode 100644 index 000000000..1ec4d881c --- /dev/null +++ b/packages/vue/src/popover/src/index.vue @@ -0,0 +1,113 @@ + + + + diff --git a/packages/vue/src/popover/src/mobile.vue b/packages/vue/src/popover/src/mobile.vue new file mode 100644 index 000000000..d2bfcc1b4 --- /dev/null +++ b/packages/vue/src/popover/src/mobile.vue @@ -0,0 +1,54 @@ + + + + diff --git a/packages/vue/src/popover/src/pc.vue b/packages/vue/src/popover/src/pc.vue new file mode 100644 index 000000000..e2f49b161 --- /dev/null +++ b/packages/vue/src/popover/src/pc.vue @@ -0,0 +1,42 @@ + + + + diff --git a/packages/vue/src/popup/index.ts b/packages/vue/src/popup/index.ts new file mode 100644 index 000000000..086ba9a10 --- /dev/null +++ b/packages/vue/src/popup/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Popup from './src/index.vue' +import '@opentiny/vue-theme-mobile/popup/index.less' +import { version } from './package.json' + +Popup.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Popup.install = function (Vue) { + Vue.component(Popup.name, Popup) +} + +Popup.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Popup.install(window.Vue) + } +} + +export default Popup diff --git a/packages/vue/src/popup/package.json b/packages/vue/src/popup/package.json new file mode 100644 index 000000000..172dfc072 --- /dev/null +++ b/packages/vue/src/popup/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-popup", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/popup/src/index.vue b/packages/vue/src/popup/src/index.vue new file mode 100644 index 000000000..2f3913164 --- /dev/null +++ b/packages/vue/src/popup/src/index.vue @@ -0,0 +1,102 @@ + + + + diff --git a/packages/vue/src/progress/index.ts b/packages/vue/src/progress/index.ts new file mode 100644 index 000000000..d26c0789d --- /dev/null +++ b/packages/vue/src/progress/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Progress from './src/index' +import { version } from './package.json' + +/* istanbul ignore next */ +Progress.install = function (Vue) { + Vue.component(Progress.name, Progress) +} + +Progress.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Progress.install(window.Vue) + } +} + +export default Progress diff --git a/packages/vue/src/progress/package.json b/packages/vue/src/progress/package.json new file mode 100644 index 000000000..23efeb517 --- /dev/null +++ b/packages/vue/src/progress/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-progress", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/progress/src/index.ts b/packages/vue/src/progress/src/index.ts new file mode 100644 index 000000000..9a023a785 --- /dev/null +++ b/packages/vue/src/progress/src/index.ts @@ -0,0 +1,89 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +const $constants = { + PROGRESS_TYPE: { + LINE: 'line', + CIRCLE: 'circle', + DASHBOARD: 'dashboard' + }, + PROGRESS_STATUS: { + SUCCESS: 'success', + EXCEPTION: 'exception', + WARNING: 'warning' + }, + STATUS_TO_COLOR: { + success: '#13ce66', + exception: '#ff4949', + warning: '#e6a23c' + }, + STATUS_DEFAULT_COLOR: '#20a0ff', + ICON_CIRCLE_WARNING: 'icon-warning', + ICON_CIRCLE_SUCCESS: 'icon-successful', + ICON_CIRCLE_EXCEPTION: 'icon-error', + ICON_SUCCESS: 'icon-yes', + ICON_EXCEPTION: 'icon-close', + ICON_WARNING: 'icon-warning' +} + +export default defineComponent({ + name: $prefix + 'Progress', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + color: { + type: [String, Array, Function], + default: '' + }, + format: Function, + percentage: { + type: Number, + default: 0, + required: true, + validator: (val) => val >= 0 && val <= 100 + }, + showText: { + type: Boolean, + default: true + }, + status: { + type: String, + validator: (value) => !!$constants.PROGRESS_STATUS[value.toUpperCase()] + }, + strokeWidth: { + type: Number, + default: 6 + }, + textInside: { + type: Boolean, + default: false + }, + type: { + type: String, + default: $constants.PROGRESS_TYPE.LINE, + validator: (value) => !!$constants.PROGRESS_TYPE[value.toUpperCase()] + }, + width: { + type: Number, + default: 126 + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/progress/src/mobile.vue b/packages/vue/src/progress/src/mobile.vue new file mode 100644 index 000000000..be2229cbb --- /dev/null +++ b/packages/vue/src/progress/src/mobile.vue @@ -0,0 +1,84 @@ + + + + diff --git a/packages/vue/src/progress/src/pc.vue b/packages/vue/src/progress/src/pc.vue new file mode 100644 index 000000000..625a0744c --- /dev/null +++ b/packages/vue/src/progress/src/pc.vue @@ -0,0 +1,100 @@ + + + + diff --git a/packages/vue/src/pull-refresh/index.ts b/packages/vue/src/pull-refresh/index.ts new file mode 100644 index 000000000..4a8710544 --- /dev/null +++ b/packages/vue/src/pull-refresh/index.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import PullRefresh from './src/index.vue' +import { version } from './package.json' + +PullRefresh.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +PullRefresh.install = function (Vue) { + Vue.component(PullRefresh.name, PullRefresh) +} + +PullRefresh.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + PullRefresh.install(window.Vue) + } +} + +export default PullRefresh diff --git a/packages/vue/src/pull-refresh/package.json b/packages/vue/src/pull-refresh/package.json new file mode 100644 index 000000000..4945a3f54 --- /dev/null +++ b/packages/vue/src/pull-refresh/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-pull-refresh", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/pull-refresh/src/index.vue b/packages/vue/src/pull-refresh/src/index.vue new file mode 100644 index 000000000..c2f2bc626 --- /dev/null +++ b/packages/vue/src/pull-refresh/src/index.vue @@ -0,0 +1,84 @@ + + + + diff --git a/packages/vue/src/radio-button/index.ts b/packages/vue/src/radio-button/index.ts new file mode 100644 index 000000000..cfe503f5d --- /dev/null +++ b/packages/vue/src/radio-button/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import RadioButton from './src/index' +import '@opentiny/vue-theme/radio-button/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +RadioButton.install = function (Vue) { + Vue.component(RadioButton.name, RadioButton) +} + +RadioButton.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + RadioButton.install(window.Vue) + } +} + +export default RadioButton diff --git a/packages/vue/src/radio-button/package.json b/packages/vue/src/radio-button/package.json new file mode 100644 index 000000000..2de4c054c --- /dev/null +++ b/packages/vue/src/radio-button/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-radio-button", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/radio-button/src/index.ts b/packages/vue/src/radio-button/src/index.ts new file mode 100644 index 000000000..4737dff39 --- /dev/null +++ b/packages/vue/src/radio-button/src/index.ts @@ -0,0 +1,40 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + RADIO_GROUP: 'RadioGroup' +} + +export default defineComponent({ + name: $prefix + 'RadioButton', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + name: String, + text: String, + events: { + type: Object, + default: () => ({}) + }, + label: {}, + disabled: Boolean + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/radio-button/src/pc.vue b/packages/vue/src/radio-button/src/pc.vue new file mode 100644 index 000000000..9dd11ff3e --- /dev/null +++ b/packages/vue/src/radio-button/src/pc.vue @@ -0,0 +1,38 @@ + + + + diff --git a/packages/vue/src/radio-group/index.ts b/packages/vue/src/radio-group/index.ts new file mode 100644 index 000000000..58b206965 --- /dev/null +++ b/packages/vue/src/radio-group/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import RadioGroup from './src/index' +import '@opentiny/vue-theme/radio-group/index.less' +import { version } from './package.json' + +RadioGroup.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +RadioGroup.install = function (Vue) { + Vue.component(RadioGroup.name, RadioGroup) +} + +RadioGroup.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + RadioGroup.install(window.Vue) + } +} + +export default RadioGroup diff --git a/packages/vue/src/radio-group/package.json b/packages/vue/src/radio-group/package.json new file mode 100644 index 000000000..c7832d457 --- /dev/null +++ b/packages/vue/src/radio-group/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-radio-group", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-radio": "workspace:~", + "@opentiny/vue-radio-button": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/radio-group/src/index.ts b/packages/vue/src/radio-group/src/index.ts new file mode 100644 index 000000000..ddeb7337a --- /dev/null +++ b/packages/vue/src/radio-group/src/index.ts @@ -0,0 +1,39 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'RadioGroup', + componentName: 'RadioGroup', + props: { + ...$props, + modelValue: {}, + size: String, + fill: String, + textColor: String, + disabled: Boolean, + vertical: Boolean, + options: { + type: Array, + default: () => [] + }, + type: { + type: String, + default: 'radio' + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/radio-group/src/pc.vue b/packages/vue/src/radio-group/src/pc.vue new file mode 100644 index 000000000..0dc43b313 --- /dev/null +++ b/packages/vue/src/radio-group/src/pc.vue @@ -0,0 +1,42 @@ + + + + diff --git a/packages/vue/src/radio/index.ts b/packages/vue/src/radio/index.ts new file mode 100644 index 000000000..e6948df0b --- /dev/null +++ b/packages/vue/src/radio/index.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Radio from './src/index' +import { version } from './package.json' + +Radio.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Radio.install = function (Vue) { + Vue.component(Radio.name, Radio) +} + +Radio.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Radio.install(window.Vue) + } +} + +export default Radio diff --git a/packages/vue/src/radio/package.json b/packages/vue/src/radio/package.json new file mode 100644 index 000000000..998c19011 --- /dev/null +++ b/packages/vue/src/radio/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-radio", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/radio/src/index.ts b/packages/vue/src/radio/src/index.ts new file mode 100644 index 000000000..c86dcc2af --- /dev/null +++ b/packages/vue/src/radio/src/index.ts @@ -0,0 +1,47 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +const $constants = { + RADIO_GROUP: 'RadioGroup' +} + +export default defineComponent({ + name: $prefix + 'Radio', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + modelValue: {}, + label: {}, + disabled: Boolean, + name: String, + border: Boolean, + size: String, + text: String, + events: { + type: Object, + default: () => ({}) + }, + tabindex: { + type: String, + default: '1' + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/radio/src/mobile.vue b/packages/vue/src/radio/src/mobile.vue new file mode 100644 index 000000000..9df9c5cb6 --- /dev/null +++ b/packages/vue/src/radio/src/mobile.vue @@ -0,0 +1,58 @@ + + + + diff --git a/packages/vue/src/radio/src/pc.vue b/packages/vue/src/radio/src/pc.vue new file mode 100644 index 000000000..d0e027dc5 --- /dev/null +++ b/packages/vue/src/radio/src/pc.vue @@ -0,0 +1,70 @@ + + + + diff --git a/packages/vue/src/rate/index.ts b/packages/vue/src/rate/index.ts new file mode 100644 index 000000000..f44ef97d1 --- /dev/null +++ b/packages/vue/src/rate/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Rate from './src/index' +import '@opentiny/vue-theme/rate/index.less' +import { version } from './package.json' + +Rate.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Rate.install = function (Vue) { + Vue.component(Rate.name, Rate) +} + +Rate.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Rate.install(window.Vue) + } +} + +export default Rate diff --git a/packages/vue/src/rate/package.json b/packages/vue/src/rate/package.json new file mode 100644 index 000000000..44b7bb62e --- /dev/null +++ b/packages/vue/src/rate/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-rate", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/rate/src/index.ts b/packages/vue/src/rate/src/index.ts new file mode 100644 index 000000000..2c65c08e2 --- /dev/null +++ b/packages/vue/src/rate/src/index.ts @@ -0,0 +1,120 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import { t } from '@opentiny/vue-locale' +import template from 'virtual-template?pc' + +const $constants = { + RATENODECLS: 'tiny-rate__star', + ICON_PREFIXCLS: '.tiny-rate__icon', + DECIMALCLS: 'tiny-rate__decimal' +} + +export default defineComponent({ + name: $prefix + 'Rate', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + allowHalf: { + type: Boolean, + default: false + }, + colors: { + type: Array, + default: () => ['#FFBB33', '#FFBB33', '#FFBB33'] + }, + disabled: { + type: Boolean, + default: false + }, + disabledVoidColor: { + type: String, + default: 'rgba(25,25,25,0.05)' + }, + disabledVoidIconClass: { + type: String, + default: 'icon-star-active' + }, + highThreshold: { + type: Number, + default: 4 + }, + iconClasses: { + type: Array, + default: () => ['icon-star-active', 'icon-star-active', 'icon-star-active'] + }, + lowThreshold: { + type: Number, + default: 2 + }, + max: { + type: Number, + default: 5 + }, + modelValue: { + type: Number, + default: 0 + }, + radio: { + // 是否单选其他形态 + type: Boolean, + default: false + }, + scoreTemplate: { + type: String, + default: '{value}' + }, + showScore: { + type: Boolean, + default: false + }, + showText: { + type: Boolean, + default: false + }, + size: { + type: String, + default: '16px' + }, + space: { + type: String, + default: '24px' + }, + textColor: { + type: String, + default: '#191919' + }, + textOnBottom: { + type: Boolean, + default: false + }, + texts: { + type: Array, + default: () => [t('ui.rate.level.poor'), t('ui.rate.level.fair'), t('ui.rate.level.average'), t('ui.rate.level.good'), t('ui.rate.level.excellent')] + }, + voidColor: { + type: String, + default: 'rgba(25,25,25,0.05)' + }, + voidIconClass: { + type: String, + default: 'icon-star-active' + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/rate/src/pc.vue b/packages/vue/src/rate/src/pc.vue new file mode 100644 index 000000000..e4fe4cc49 --- /dev/null +++ b/packages/vue/src/rate/src/pc.vue @@ -0,0 +1,82 @@ + + + + diff --git a/packages/vue/src/roles/index.ts b/packages/vue/src/roles/index.ts new file mode 100644 index 000000000..9e0436326 --- /dev/null +++ b/packages/vue/src/roles/index.ts @@ -0,0 +1,19 @@ +import Roles from './src/index' +import '@opentiny/vue-theme/roles/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Roles.install = function (Vue) { + Vue.component(Roles.name, Roles) +} + +Roles.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Roles.install(window.Vue) + } +} + +export default Roles diff --git a/packages/vue/src/roles/package.json b/packages/vue/src/roles/package.json new file mode 100644 index 000000000..6fdd2b543 --- /dev/null +++ b/packages/vue/src/roles/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-roles", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-popover": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/roles/src/index.ts b/packages/vue/src/roles/src/index.ts new file mode 100644 index 000000000..7fa135e23 --- /dev/null +++ b/packages/vue/src/roles/src/index.ts @@ -0,0 +1,25 @@ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + AUTH: 'authenticated', + ANONYMOUS: 'anonymous', + GLOBAL: 'global', + ROLE: 'role' +} + +export default defineComponent({ + name: $prefix + 'Roles', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + fetchRole: Function + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/roles/src/pc.vue b/packages/vue/src/roles/src/pc.vue new file mode 100644 index 000000000..83fbbafa0 --- /dev/null +++ b/packages/vue/src/roles/src/pc.vue @@ -0,0 +1,51 @@ + + + diff --git a/packages/vue/src/row/index.ts b/packages/vue/src/row/index.ts new file mode 100644 index 000000000..b1809f62a --- /dev/null +++ b/packages/vue/src/row/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Row from './src/index' +import '@opentiny/vue-theme/row/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Row.install = function (Vue) { + Vue.component(Row.name, Row) +} + +Row.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Row.install(window.Vue) + } +} + +export default Row diff --git a/packages/vue/src/row/package.json b/packages/vue/src/row/package.json new file mode 100644 index 000000000..762b44881 --- /dev/null +++ b/packages/vue/src/row/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-row", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/row/src/index.ts b/packages/vue/src/row/src/index.ts new file mode 100644 index 000000000..333e85f87 --- /dev/null +++ b/packages/vue/src/row/src/index.ts @@ -0,0 +1,55 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'Row', + componentName: 'Row', + props: { + ...$props, + flex: Boolean, + gutter: { + type: Number, + default: 0, + validator(value) { + return value >= 0 + } + }, + justify: { + type: String, + default: 'start', + validator: (value) => ~['start', 'center', 'end', 'space-between', 'space-around'].indexOf(value) + }, + align: { + type: String, + default: 'top', + validator: (value) => ~['top', 'middle', 'bottom'].indexOf(value) + }, + order: { + type: String, + validator: (value) => ~['asc', 'des'].indexOf(value) + }, + tag: { + type: String, + default: 'div' + }, + noSpace: { + type: Boolean, + default: false + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/row/src/pc.vue b/packages/vue/src/row/src/pc.vue new file mode 100644 index 000000000..96c7ed1dd --- /dev/null +++ b/packages/vue/src/row/src/pc.vue @@ -0,0 +1,28 @@ + + + + diff --git a/packages/vue/src/scroll-text/index.ts b/packages/vue/src/scroll-text/index.ts new file mode 100644 index 000000000..48f4e6e0b --- /dev/null +++ b/packages/vue/src/scroll-text/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import ScrollText from './src/index' +import '@opentiny/vue-theme/scroll-text/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +ScrollText.install = function (Vue) { + Vue.component(ScrollText.name, ScrollText) +} + +ScrollText.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + ScrollText.install(window.Vue) + } +} + +export default ScrollText diff --git a/packages/vue/src/scroll-text/package.json b/packages/vue/src/scroll-text/package.json new file mode 100644 index 000000000..8ce535cb8 --- /dev/null +++ b/packages/vue/src/scroll-text/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-scroll-text", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/scroll-text/src/index.ts b/packages/vue/src/scroll-text/src/index.ts new file mode 100644 index 000000000..0d7a4812d --- /dev/null +++ b/packages/vue/src/scroll-text/src/index.ts @@ -0,0 +1,53 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + ANIMATION_DURATION: 'animation-duration' +} + +export default defineComponent({ + name: $prefix + 'ScrollText', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + text: { + type: String, + default: 'ScrollText' + }, + time: { + type: Number, + default: 5 + }, + styles: { + type: String, + default: '' + }, + direction: { + type: String, + default: 'left', + validator: (value) => ~['up', 'left', 'down', 'right'].indexOf(value) + }, + hoverStop: { + type: Boolean, + default: true + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/scroll-text/src/pc.vue b/packages/vue/src/scroll-text/src/pc.vue new file mode 100644 index 000000000..9b9854efc --- /dev/null +++ b/packages/vue/src/scroll-text/src/pc.vue @@ -0,0 +1,34 @@ + + + + diff --git a/packages/vue/src/scrollbar/index.ts b/packages/vue/src/scrollbar/index.ts new file mode 100644 index 000000000..c611715df --- /dev/null +++ b/packages/vue/src/scrollbar/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Scrollbar from './src/index.vue' +import '@opentiny/vue-theme/scrollbar/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Scrollbar.install = function (Vue) { + Vue.component(Scrollbar.name, Scrollbar) +} + +Scrollbar.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Scrollbar.install(window.Vue) + } +} + +export default Scrollbar diff --git a/packages/vue/src/scrollbar/package.json b/packages/vue/src/scrollbar/package.json new file mode 100644 index 000000000..0fe2af6cc --- /dev/null +++ b/packages/vue/src/scrollbar/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-scrollbar", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/scrollbar/src/bar.vue b/packages/vue/src/scrollbar/src/bar.vue similarity index 98% rename from packages/scrollbar/src/bar.vue rename to packages/vue/src/scrollbar/src/bar.vue index d21f1f369..1e560363a 100644 --- a/packages/scrollbar/src/bar.vue +++ b/packages/vue/src/scrollbar/src/bar.vue @@ -9,7 +9,7 @@ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. * --> - diff --git a/packages/vue/src/search/index.ts b/packages/vue/src/search/index.ts new file mode 100644 index 000000000..1fb6f9334 --- /dev/null +++ b/packages/vue/src/search/index.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Search from './src/index' +import { version } from './package.json' + +Search.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Search.install = function (Vue) { + Vue.component(Search.name, Search) +} + +Search.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Search.install(window.Vue) + } +} + +export default Search diff --git a/packages/vue/src/search/package.json b/packages/vue/src/search/package.json new file mode 100644 index 000000000..475bce630 --- /dev/null +++ b/packages/vue/src/search/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-search", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/search/src/index.ts b/packages/vue/src/search/src/index.ts new file mode 100644 index 000000000..d473c056a --- /dev/null +++ b/packages/vue/src/search/src/index.ts @@ -0,0 +1,82 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $prefix, $props, $setup, defineComponent } from '@opentiny/vue-common' +import { t } from '@opentiny/vue-locale' +import template from 'virtual-template?pc|mobile' + +export default defineComponent({ + name: $prefix + 'Search', + props: { + ...$props, + mini: { + type: Boolean, + default: false + }, + buttonText: { + type: String, + default: () => t('ui.search.placeholder') + }, + + /** + * 设置为透明模式,配置为true时,边框变为透明且收缩后半透明显示,一般用在带有背景的场景 + */ + transparent: { + type: Boolean, + default: false + }, + + /** + * 搜索的类型选项,格式为[{text:'文档',value:1},...],不配置时类型选择固定显示为All + */ + searchTypes: { + type: Array, + default: () => [] + }, + + /** + * 设置搜索输入框内的提示占位文本 + */ + placeholder: { + type: String, + default: '' + }, + modelValue: String, + clearable: { + type: Boolean, + default: false + }, + tabindex: { + type: String, + default: '1' + }, + + /** + * 配置搜索输入框enter键,enter按下触发搜索 + */ + isEnterSearch: { + type: Boolean, + default: false + }, + /** + * 配置主题色,primary:蓝 gray:灰 + */ + themeType: { + type: String, + default: 'primary', + validator: (value) => ['primary', 'gray'].includes(value) + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/search/src/mobile.vue b/packages/vue/src/search/src/mobile.vue new file mode 100644 index 000000000..06287e10c --- /dev/null +++ b/packages/vue/src/search/src/mobile.vue @@ -0,0 +1,84 @@ + + + + diff --git a/packages/vue/src/search/src/pc.vue b/packages/vue/src/search/src/pc.vue new file mode 100644 index 000000000..bdfe38f08 --- /dev/null +++ b/packages/vue/src/search/src/pc.vue @@ -0,0 +1,94 @@ + + + + diff --git a/packages/vue/src/select-dropdown/index.ts b/packages/vue/src/select-dropdown/index.ts new file mode 100644 index 000000000..94874088a --- /dev/null +++ b/packages/vue/src/select-dropdown/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import SelectDropdown from './src/index' +import '@opentiny/vue-theme/select-dropdown/index.less' +import { version } from './package.json' + +SelectDropdown.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +SelectDropdown.install = function (Vue) { + Vue.component(SelectDropdown.name, SelectDropdown) +} + +SelectDropdown.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + SelectDropdown.install(window.Vue) + } +} + +export default SelectDropdown diff --git a/packages/vue/src/select-dropdown/package.json b/packages/vue/src/select-dropdown/package.json new file mode 100644 index 000000000..a55f5e620 --- /dev/null +++ b/packages/vue/src/select-dropdown/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-select-dropdown", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/select-dropdown/src/index.ts b/packages/vue/src/select-dropdown/src/index.ts new file mode 100644 index 000000000..0ad50bac2 --- /dev/null +++ b/packages/vue/src/select-dropdown/src/index.ts @@ -0,0 +1,57 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'SelectDropdown', + componentName: 'SelectDropdown', + inject: ['select'], + props: { + ...$props, + appendToBody: { + type: Boolean, + default: () => true + }, + arrowOffset: { + type: Number, + default: () => 35 + }, + boundariesPadding: { + default: () => 0 + }, + isDropInheritWidth: Boolean, + modelValue: Boolean, + offset: { + default: () => 0 + }, + placement: { + default: () => 'bottom-start' + }, + popper: {}, + popperOptions: { + default: () => ({ gpuAcceleration: false }) + }, + reference: {}, + transformOrigin: { + type: [Boolean, String], + default: () => true + }, + visibleArrow: { + default: () => false + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/select-dropdown/src/pc.vue b/packages/vue/src/select-dropdown/src/pc.vue new file mode 100644 index 000000000..676b3e468 --- /dev/null +++ b/packages/vue/src/select-dropdown/src/pc.vue @@ -0,0 +1,50 @@ + + + + diff --git a/packages/vue/src/select/index.ts b/packages/vue/src/select/index.ts new file mode 100644 index 000000000..7a0790192 --- /dev/null +++ b/packages/vue/src/select/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Select from './src/index' +import '@opentiny/vue-theme/select/index.less' +import { version } from './package.json' + +Select.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Select.install = function (Vue) { + Vue.component(Select.name, Select) +} + +Select.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Select.install(window.Vue) + } +} + +export default Select diff --git a/packages/vue/src/select/package.json b/packages/vue/src/select/package.json new file mode 100644 index 000000000..328ca72e2 --- /dev/null +++ b/packages/vue/src/select/package.json @@ -0,0 +1,30 @@ +{ + "name": "@opentiny/vue-select", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-tag": "workspace:~", + "@opentiny/vue-input": "workspace:~", + "@opentiny/vue-option": "workspace:~", + "@opentiny/vue-scrollbar": "workspace:~", + "@opentiny/vue-popover": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-select-dropdown": "workspace:~", + "@opentiny/vue-grid": "workspace:~", + "@opentiny/vue-tree": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/select/src/index.ts b/packages/vue/src/select/src/index.ts new file mode 100644 index 000000000..dc871d6eb --- /dev/null +++ b/packages/vue/src/select/src/index.ts @@ -0,0 +1,227 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import { t } from '@opentiny/vue-locale' +import template from 'virtual-template?pc' + +const $constants = { + CLASS: { + SelectDropdownWrap: '.tiny-select-dropdown__wrap', + IsReverse: 'is-reverse' + }, + I18N: { + noData: 'ui.select.noData', + noMatch: 'ui.select.noMatch', + loading: 'ui.select.loading' + }, + COMPONENT_NAME: { + Form: 'Form', + Select: 'Select', + Option: 'Option', + FormItem: 'FormItem', + OptionGroup: 'OptionGroup', + SelectDropdown: 'SelectDropdown' + }, + EVENT_NAME: { + removeTag: 'remove-tag', + formChange: 'form.change', + formBlur: 'form.blur', + queryChange: 'queryChange', + setSelected: 'setSelected', + updatePopper: 'updatePopper', + destroyPopper: 'destroyPopper', + visibleChange: 'visible-change', + handleOptionClick: 'handleOptionClick', + handleGroupDisabled: 'handleGroupDisabled' + }, + TYPE: { + Grid: 'grid', + Tree: 'tree' + } +} + +export default defineComponent({ + name: $prefix + 'Select', + componentName: 'Select', + inject: { + form: { + default: '' + }, + formItem: { + default: '' + } + }, + provide() { + return { + select: this + } + }, + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + id: [Number, String], + name: String, + size: String, + remote: Boolean, + remoteConfig: { + type: Object, + default() { + return { + showIcon: false, + clearData: false, + autoSearch: false + } + } + }, + loading: Boolean, + disabled: Boolean, + options: Array, + dataset: Object, + textField: { + type: String, + default: 'label' + }, + tabindex: { + type: String, + default: '1' + }, + valueField: { + type: String, + default: 'value' + }, + placement: { + type: String, + default: 'bottom-start' + }, + showCheck: { + type: Boolean, + default: true + }, + showAlloption: { + type: Boolean, + default: true + }, + multiple: Boolean, + clearable: Boolean, + noDataText: String, + filterable: Boolean, + loadingText: String, + noMatchText: String, + popperClass: String, + allowCreate: Boolean, + collapseTags: Boolean, + remoteMethod: Function, + filterMethod: Function, + reserveKeyword: Boolean, + automaticDropdown: Boolean, + defaultFirstOption: Boolean, + modelValue: {}, + valueKey: { + type: String, + default: 'value' + }, + placeholder: { + type: String, + default: () => t('ui.select.placeholder') + }, + autocomplete: { + type: String, + default: 'off' + }, + multipleLimit: { + type: Number, + default: 0 + }, + popperAppendToBody: { + type: Boolean, + default: true + }, + hideDrop: { + type: Boolean, + default: false + }, + copyable: { + type: Boolean, + default: false + }, + renderType: String, + gridOp: { + type: Object, + default: () => ({}) + }, + treeOp: { + type: Object, + default: () => ({}) + }, + delay: { + type: Number, + default: 0 + }, + readonly: Boolean, + dropStyle: { + type: Object, + default: () => ({}) + }, + cacheOp: Object, + isDropInheritWidth: Boolean, + tagSelectable: { + type: Boolean, + default: false + }, + selectConfig: { + type: Object, + default() { + return { + checkMethod() { + return true + } + } + } + }, + radioConfig: { + type: Object, + default() { + return { + checkMethod() { + return true + } + } + } + }, + allowCopy: { + type: Boolean, + default: false + }, + textSplit: { + type: String, + default: ',' + }, + autoClose: Boolean, + queryDebounce: Number, + ignoreEnter: { + type: Boolean, + default: false + }, + optimization: [Boolean, Object], + searchable: { + type: Boolean, + default: false + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/select/src/pc.vue b/packages/vue/src/select/src/pc.vue new file mode 100644 index 000000000..ce6abb5ba --- /dev/null +++ b/packages/vue/src/select/src/pc.vue @@ -0,0 +1,397 @@ + + + + diff --git a/packages/vue/src/slide-bar/index.ts b/packages/vue/src/slide-bar/index.ts new file mode 100644 index 000000000..b94fa04e7 --- /dev/null +++ b/packages/vue/src/slide-bar/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import SlideBar from './src/index' +import '@opentiny/vue-theme/slide-bar/index.less' +import { version } from './package.json' + +SlideBar.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +SlideBar.install = function (Vue) { + Vue.component(SlideBar.name, SlideBar) +} + +SlideBar.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + SlideBar.install(window.Vue) + } +} + +export default SlideBar diff --git a/packages/vue/src/slide-bar/package.json b/packages/vue/src/slide-bar/package.json new file mode 100644 index 000000000..6ab778a50 --- /dev/null +++ b/packages/vue/src/slide-bar/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-slide-bar", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/slide-bar/src/index.ts b/packages/vue/src/slide-bar/src/index.ts new file mode 100644 index 000000000..48a4d4795 --- /dev/null +++ b/packages/vue/src/slide-bar/src/index.ts @@ -0,0 +1,38 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'SlideBar', + props: { + ...$props, + initBlocks: Number, + wheelBlocks: { + type: Number, + default: 1 + }, + modelValue: Array, + tag: { + type: String, + default: 'ul' + }, + subTag: { + type: String, + default: 'li' + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/slide-bar/src/pc.vue b/packages/vue/src/slide-bar/src/pc.vue new file mode 100644 index 000000000..8f813fb28 --- /dev/null +++ b/packages/vue/src/slide-bar/src/pc.vue @@ -0,0 +1,66 @@ + + + + diff --git a/packages/vue/src/slider/index.ts b/packages/vue/src/slider/index.ts new file mode 100644 index 000000000..b26cdee07 --- /dev/null +++ b/packages/vue/src/slider/index.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Slider from './src/index' +import { version } from './package.json' + +/* istanbul ignore next */ +Slider.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +Slider.install = function (Vue) { + Vue.component(Slider.name, Slider) +} + +Slider.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Slider.install(window.Vue) + } +} + +export default Slider diff --git a/packages/vue/src/slider/package.json b/packages/vue/src/slider/package.json new file mode 100644 index 000000000..5070d1471 --- /dev/null +++ b/packages/vue/src/slider/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-slider", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/slider/src/index.ts b/packages/vue/src/slider/src/index.ts new file mode 100644 index 000000000..1e3560df1 --- /dev/null +++ b/packages/vue/src/slider/src/index.ts @@ -0,0 +1,110 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +const $constants = { + TIP_HEIGHT: 22, + BUTTON_SIZE: 28, + HALF_BAR_HEIGHT: 2, + PC_TIP_CLS: 'tiny-slider__tips', + PC_SLIDER_CLS: 'tiny-slider', + PC_RANGE_CLS: 'tiny-slider__range', + PC_BUTTON_CLS: 'tiny-slider__handle', + PC_LEFT_SVG_CLS: 'tiny-slider-left-svg', + PC_RIGHT_SVG_CLS: 'tiny-slider-right-svg', + MOBILE_TIP_CLS: 'tiny-mobile-slider__tips', + MOBILE_SLIDER_CLS: 'tiny-mobile-slider', + MOBILE_RANGE_CLS: 'tiny-mobile-slider__range', + MOBILE_BUTTON_CLS: 'tiny-mobile-slider__handle', + MOBILE_LEFT_SVG_CLS: 'tiny-mobile-slider-left-svg', + MOBILE_RIGHT_SVG_CLS: 'tiny-mobile-slider-right-svg', + Mode: 'pc', + tipCls(mode) { + return mode === this.Mode ? this.PC_TIP_CLS : this.MOBILE_TIP_CLS + }, + sliderCls(mode) { + return mode === this.Mode ? this.PC_SLIDER_CLS : this.MOBILE_SLIDER_CLS + }, + rangeCls(mode) { + return mode === this.Mode ? this.PC_RANGE_CLS : this.MOBILE_RANGE_CLS + }, + buttonCls(mode) { + return mode === this.Mode ? this.PC_BUTTON_CLS : this.MOBILE_BUTTON_CLS + }, + leftSvgCls(mode) { + return mode === this.Mode ? this.PC_LEFT_SVG_CLS : this.MOBILE_LEFT_SVG_CLS + }, + rightSvgCls(mode) { + return mode === this.Mode ? this.PC_RIGHT_SVG_CLS : this.MOBILE_RIGHT_SVG_CLS + } +} + +export default defineComponent({ + name: $prefix + 'Slider', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + formatTooltip: Function, + disabled: { + type: Boolean, + default: false + }, + height: { + type: String, + default: '300px' + }, + max: { + type: Number, + default: 100 + }, + min: { + type: Number, + default: 0 + }, + modelValue: { + type: [Number, Array], + default: 0 + }, + numPages: { + type: Number, + default: 1 + }, + range: { + type: Boolean, + default: false + }, + showInput: { + type: Boolean, + default: false + }, + showTip: { + type: Boolean, + default: true + }, + step: { + type: Number, + default: 1 + }, + vertical: { + type: Boolean, + default: false + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/slider/src/mobile.vue b/packages/vue/src/slider/src/mobile.vue new file mode 100644 index 000000000..67e788292 --- /dev/null +++ b/packages/vue/src/slider/src/mobile.vue @@ -0,0 +1,67 @@ + + + + diff --git a/packages/vue/src/slider/src/pc.vue b/packages/vue/src/slider/src/pc.vue new file mode 100644 index 000000000..3b8c3bac3 --- /dev/null +++ b/packages/vue/src/slider/src/pc.vue @@ -0,0 +1,80 @@ + + + + diff --git a/packages/vue/src/split/index.ts b/packages/vue/src/split/index.ts new file mode 100644 index 000000000..f99c50a86 --- /dev/null +++ b/packages/vue/src/split/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Split from './src/index.js' +import '@opentiny/vue-theme/split/index.less' +import { version } from './package.json' + +Split.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Split.install = function (Vue) { + Vue.component(Split.name, Split) +} + +Split.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Split.install(window.Vue) + } +} + +export default Split diff --git a/packages/vue/src/split/package.json b/packages/vue/src/split/package.json new file mode 100644 index 000000000..9868a0e23 --- /dev/null +++ b/packages/vue/src/split/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-split", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/split/src/index.ts b/packages/vue/src/split/src/index.ts new file mode 100644 index 000000000..4ebd96b63 --- /dev/null +++ b/packages/vue/src/split/src/index.ts @@ -0,0 +1,61 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + PREFIX: 'tiny-split', + HORIZONTAL: 'horizontal', + VERTICAL: 'vertical' +} + +export default defineComponent({ + name: $prefix + 'Split', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + modelValue: { + type: [Number, String], + default: 0.5 + }, + mode: { + validator(value) { + const arr = [$constants.HORIZONTAL, $constants.VERTICAL] + + for (let i = 0; i < arr.length; i++) { + if (value === arr[i]) { + return true + } + } + + return false + }, + default: $constants.HORIZONTAL + }, + leftTopMin: { + type: [Number, String], + default: '40px' + }, + rightBottomMin: { + type: [Number, String], + default: '40px' + }, + collapsible: Boolean + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/split/src/pc.vue b/packages/vue/src/split/src/pc.vue new file mode 100644 index 000000000..cdea33444 --- /dev/null +++ b/packages/vue/src/split/src/pc.vue @@ -0,0 +1,86 @@ + + + + diff --git a/packages/vue/src/steps/index.ts b/packages/vue/src/steps/index.ts new file mode 100644 index 000000000..d12a90270 --- /dev/null +++ b/packages/vue/src/steps/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Steps from './src/index' +import '@opentiny/vue-theme/steps/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Steps.install = function (Vue) { + Vue.component(Steps.name, Steps) +} + +Steps.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Steps.install(window.Vue) + } +} + +export default Steps diff --git a/packages/vue/src/steps/package.json b/packages/vue/src/steps/package.json new file mode 100644 index 000000000..326bc5661 --- /dev/null +++ b/packages/vue/src/steps/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-steps", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/steps/src/index.ts b/packages/vue/src/steps/src/index.ts new file mode 100644 index 000000000..f77f9ef3d --- /dev/null +++ b/packages/vue/src/steps/src/index.ts @@ -0,0 +1,42 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'Steps', + props: { + ...$props, + nameField: { + type: String, + default: 'name' + }, + countField: { + type: String, + default: 'count' + }, + statusField: { + type: String, + default: 'status' + }, + data: [Object, Array], + space: Number, + active: { + type: Number, + default: -1 + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/steps/src/pc.vue b/packages/vue/src/steps/src/pc.vue new file mode 100644 index 000000000..f10da9333 --- /dev/null +++ b/packages/vue/src/steps/src/pc.vue @@ -0,0 +1,58 @@ + + + + diff --git a/packages/vue/src/svg-icon/index.ts b/packages/vue/src/svg-icon/index.ts new file mode 100644 index 000000000..6e083f585 --- /dev/null +++ b/packages/vue/src/svg-icon/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import SvgIcon from './src/index.vue' +import '@opentiny/vue-theme/svg/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +SvgIcon.install = function (Vue) { + Vue.component(SvgIcon.name, SvgIcon) +} + +SvgIcon.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + SvgIcon.install(window.Vue) + } +} + +export default SvgIcon diff --git a/packages/vue/src/svg-icon/package.json b/packages/vue/src/svg-icon/package.json new file mode 100644 index 000000000..9ea5d90ea --- /dev/null +++ b/packages/vue/src/svg-icon/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-svg-icon", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/svg-icon/src/index.vue b/packages/vue/src/svg-icon/src/index.vue new file mode 100644 index 000000000..d3c7bb7d8 --- /dev/null +++ b/packages/vue/src/svg-icon/src/index.vue @@ -0,0 +1,45 @@ + + + + diff --git a/packages/vue/src/switch/index.ts b/packages/vue/src/switch/index.ts new file mode 100644 index 000000000..caf3bcd1b --- /dev/null +++ b/packages/vue/src/switch/index.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Switch from './src/index' +import { version } from './package.json' + +Switch.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Switch.install = function (Vue) { + Vue.component(Switch.name, Switch) +} + +Switch.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Switch.install(window.Vue) + } +} + +export default Switch diff --git a/packages/vue/src/switch/package.json b/packages/vue/src/switch/package.json new file mode 100644 index 000000000..cfe66b422 --- /dev/null +++ b/packages/vue/src/switch/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-switch", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/switch/src/index.ts b/packages/vue/src/switch/src/index.ts new file mode 100644 index 000000000..cd962c19f --- /dev/null +++ b/packages/vue/src/switch/src/index.ts @@ -0,0 +1,69 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +const $constants = { + PC_PREFIXCLS: 'tiny-switch', + MOBILE_PREFIXCLS: 'tiny-mobile-switch', + Mode: 'pc', + prefixcls(mode) { + return mode === this.Mode ? this.PC_PREFIXCLS : this.MOBILE_PREFIXCLS + } +} + +export default defineComponent({ + name: $prefix + 'Switch', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + disabled: { + type: Boolean, + default: false + }, + showText: { + type: Boolean, + default: false + }, + falseColor: String, + falseValue: { + type: [String, Number, Boolean], + default: false + }, + mini: { + type: Boolean, + default: false + }, + modelValue: { + type: [String, Number, Boolean], + default: false + }, + size: [Number, String], + tabindex: { + type: String, + default: '1' + }, + trueColor: String, + trueValue: { + type: [String, Number, Boolean], + default: true + }, + beforeChange: Function + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/switch/src/mobile.vue b/packages/vue/src/switch/src/mobile.vue new file mode 100644 index 000000000..9b8ed89a7 --- /dev/null +++ b/packages/vue/src/switch/src/mobile.vue @@ -0,0 +1,27 @@ + + + + diff --git a/packages/vue/src/switch/src/pc.vue b/packages/vue/src/switch/src/pc.vue new file mode 100644 index 000000000..1ed814da3 --- /dev/null +++ b/packages/vue/src/switch/src/pc.vue @@ -0,0 +1,35 @@ + + + + diff --git a/packages/vue/src/tab-item/index.ts b/packages/vue/src/tab-item/index.ts new file mode 100644 index 000000000..d7af8ea29 --- /dev/null +++ b/packages/vue/src/tab-item/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import TabItem from './src/index.vue' +import { version } from './package.json' + +/* istanbul ignore next */ +TabItem.install = function (Vue) { + Vue.component(TabItem.name, TabItem) +} + +TabItem.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + TabItem.install(window.Vue) + } +} + +export default TabItem diff --git a/packages/vue/src/tab-item/package.json b/packages/vue/src/tab-item/package.json new file mode 100644 index 000000000..6495928c8 --- /dev/null +++ b/packages/vue/src/tab-item/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-tab-item", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/tab-item/src/index.vue b/packages/vue/src/tab-item/src/index.vue new file mode 100644 index 000000000..15f473378 --- /dev/null +++ b/packages/vue/src/tab-item/src/index.vue @@ -0,0 +1,45 @@ + + + + diff --git a/packages/vue/src/tabbar-item/index.ts b/packages/vue/src/tabbar-item/index.ts new file mode 100644 index 000000000..8ce529c0f --- /dev/null +++ b/packages/vue/src/tabbar-item/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import TabbarItem from './src/index.vue' +import '@opentiny/vue-theme-mobile/tabbar-item/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +TabbarItem.install = function (Vue) { + Vue.component(TabbarItem.name, TabbarItem) +} + +TabbarItem.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + TabbarItem.install(window.Vue) + } +} + +export default TabbarItem diff --git a/packages/vue/src/tabbar-item/package.json b/packages/vue/src/tabbar-item/package.json new file mode 100644 index 000000000..aade41d9f --- /dev/null +++ b/packages/vue/src/tabbar-item/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-tabbar-item", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/tabbar-item/src/index.vue b/packages/vue/src/tabbar-item/src/index.vue new file mode 100644 index 000000000..92df30a4d --- /dev/null +++ b/packages/vue/src/tabbar-item/src/index.vue @@ -0,0 +1,45 @@ + + + + diff --git a/packages/vue/src/tabbar-item/src/mobile.vue b/packages/vue/src/tabbar-item/src/mobile.vue new file mode 100644 index 000000000..5317d1e6f --- /dev/null +++ b/packages/vue/src/tabbar-item/src/mobile.vue @@ -0,0 +1,38 @@ + + + + diff --git a/packages/vue/src/tabbar/index.ts b/packages/vue/src/tabbar/index.ts new file mode 100644 index 000000000..202b24afd --- /dev/null +++ b/packages/vue/src/tabbar/index.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Tabbar from './src/index.vue' +import '@opentiny/vue-theme-mobile/tabbar/index.less' + +Tabbar.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Tabbar.install = function (Vue) { + Vue.component(Tabbar.name, Tabbar) +} + +Tabbar.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Tabbar.install(window.Vue) + } +} + +export default Tabbar diff --git a/packages/vue/src/tabbar/package.json b/packages/vue/src/tabbar/package.json new file mode 100644 index 000000000..76a986d10 --- /dev/null +++ b/packages/vue/src/tabbar/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-tabbar", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-tabbar-item": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/tabbar/src/index.vue b/packages/vue/src/tabbar/src/index.vue new file mode 100644 index 000000000..6c2fbc575 --- /dev/null +++ b/packages/vue/src/tabbar/src/index.vue @@ -0,0 +1,53 @@ + + + + diff --git a/packages/vue/src/table/index.ts b/packages/vue/src/table/index.ts new file mode 100644 index 000000000..479e48fc7 --- /dev/null +++ b/packages/vue/src/table/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Table from './src/index' +import { version } from './package.json' + +/* istanbul ignore next */ +Table.install = function (Vue) { + Vue.component(Table.name, Table) +} + +Table.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Table.install(window.Vue) + } +} + +export default Table diff --git a/packages/vue/src/table/package.json b/packages/vue/src/table/package.json new file mode 100644 index 000000000..1b75c918c --- /dev/null +++ b/packages/vue/src/table/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-table", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/table/src/index.js b/packages/vue/src/table/src/index.js similarity index 100% rename from packages/table/src/index.js rename to packages/vue/src/table/src/index.js diff --git a/packages/vue/src/table/src/index.ts b/packages/vue/src/table/src/index.ts new file mode 100644 index 000000000..850521387 --- /dev/null +++ b/packages/vue/src/table/src/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +export default defineComponent({ + name: $prefix + 'Table', + props: { + ...$props, + columns: Array, + data: Array, + width: String, + defaultChecked: Array, + keys: String + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/table/src/mobile.vue b/packages/vue/src/table/src/mobile.vue new file mode 100644 index 000000000..a4ee64d05 --- /dev/null +++ b/packages/vue/src/table/src/mobile.vue @@ -0,0 +1,103 @@ + + + + diff --git a/packages/vue/src/table/src/pc.vue b/packages/vue/src/table/src/pc.vue new file mode 100644 index 000000000..ddbd67ee5 --- /dev/null +++ b/packages/vue/src/table/src/pc.vue @@ -0,0 +1,88 @@ + + + + diff --git a/packages/vue/src/tabs/index.ts b/packages/vue/src/tabs/index.ts new file mode 100644 index 000000000..c294678af --- /dev/null +++ b/packages/vue/src/tabs/index.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Tabs from './src/index' +import { version } from './package.json' + +Tabs.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Tabs.install = function (Vue) { + Vue.component(Tabs.name, Tabs) +} + +Tabs.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Tabs.install(window.Vue) + } +} + +export default Tabs diff --git a/packages/vue/src/tabs/package.json b/packages/vue/src/tabs/package.json new file mode 100644 index 000000000..d25f007f9 --- /dev/null +++ b/packages/vue/src/tabs/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-tabs", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-popover": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/tabs/src/index.ts b/packages/vue/src/tabs/src/index.ts new file mode 100644 index 000000000..7725ca6ec --- /dev/null +++ b/packages/vue/src/tabs/src/index.ts @@ -0,0 +1,66 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +const $constants = { + TAB_ITEM: 'TabItem' +} + +export default defineComponent({ + name: $prefix + 'Tabs', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + tabStyle: String, + activeName: String, + withClose: Boolean, + withAdd: Boolean, + size: String, + activeColor: { + type: String, + default: '' + }, + modelValue: {}, + editable: Boolean, + position: { + type: String, + default: 'top' + }, + beforeLeave: Function, + stretch: Boolean, + showMoreTabs: Boolean, + showExpandTabs: Boolean, + expandTabsTitle: String, + expandTabsMode: String, + swipeable: { + type: Boolean, + default: true + }, + popperClass: String, + popperAppendToBody: { + type: Boolean, + default: true + }, + dropConfig: { + type: Object, + default: () => null + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/tabs/src/mobile.vue b/packages/vue/src/tabs/src/mobile.vue new file mode 100644 index 000000000..1ee607f52 --- /dev/null +++ b/packages/vue/src/tabs/src/mobile.vue @@ -0,0 +1,162 @@ + + diff --git a/packages/vue/src/tabs/src/pc.vue b/packages/vue/src/tabs/src/pc.vue new file mode 100644 index 000000000..82138881c --- /dev/null +++ b/packages/vue/src/tabs/src/pc.vue @@ -0,0 +1,141 @@ + + diff --git a/packages/vue/src/tabs/src/tab-nav/mb.vue b/packages/vue/src/tabs/src/tab-nav/mb.vue new file mode 100644 index 000000000..39cd32add --- /dev/null +++ b/packages/vue/src/tabs/src/tab-nav/mb.vue @@ -0,0 +1,245 @@ + + diff --git a/packages/vue/src/tabs/src/tab-nav/pc.vue b/packages/vue/src/tabs/src/tab-nav/pc.vue new file mode 100644 index 000000000..849ae783c --- /dev/null +++ b/packages/vue/src/tabs/src/tab-nav/pc.vue @@ -0,0 +1,286 @@ + + diff --git a/packages/tabs/src/tab-nav/tab-bar.vue b/packages/vue/src/tabs/src/tab-nav/tab-bar.vue similarity index 97% rename from packages/tabs/src/tab-nav/tab-bar.vue rename to packages/vue/src/tabs/src/tab-nav/tab-bar.vue index 8da38be60..d25f63f6a 100644 --- a/packages/tabs/src/tab-nav/tab-bar.vue +++ b/packages/vue/src/tabs/src/tab-nav/tab-bar.vue @@ -13,7 +13,7 @@
    - diff --git a/packages/vue/src/text-popup/index.ts b/packages/vue/src/text-popup/index.ts new file mode 100644 index 000000000..bc10f149a --- /dev/null +++ b/packages/vue/src/text-popup/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import TextPopup from './src/index' +import '@opentiny/vue-theme/text-popup/index.less' +import { version } from './package.json' + +TextPopup.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +TextPopup.install = function (Vue) { + Vue.component(TextPopup.name, TextPopup) +} + +TextPopup.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + TextPopup.install(window.Vue) + } +} + +export default TextPopup diff --git a/packages/vue/src/text-popup/package.json b/packages/vue/src/text-popup/package.json new file mode 100644 index 000000000..db6419692 --- /dev/null +++ b/packages/vue/src/text-popup/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-text-popup", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/text-popup/src/index.ts b/packages/vue/src/text-popup/src/index.ts new file mode 100644 index 000000000..4a2b643ca --- /dev/null +++ b/packages/vue/src/text-popup/src/index.ts @@ -0,0 +1,46 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'TextPopup', + props: { + ...$props, + modelValue: { + default: '' + }, + placeholder: { + type: String, + required: false + }, + readonly: { + type: Boolean, + default: false + }, + width: { + type: [Number, String], + default: 150, + validator(value) { + return parseInt(value) >= 0 + } + }, + separtor: { + type: String, + default: ',' + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/text-popup/src/pc.vue b/packages/vue/src/text-popup/src/pc.vue new file mode 100644 index 000000000..2d2dc2434 --- /dev/null +++ b/packages/vue/src/text-popup/src/pc.vue @@ -0,0 +1,39 @@ + + + + diff --git a/packages/vue/src/time-line/index.ts b/packages/vue/src/time-line/index.ts new file mode 100644 index 000000000..414e44e66 --- /dev/null +++ b/packages/vue/src/time-line/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import TimeLine from './src/index' +import { version } from './package.json' + +/* istanbul ignore next */ +TimeLine.install = function (Vue) { + Vue.component(TimeLine.name, TimeLine) +} + +TimeLine.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + TimeLine.install(window.Vue) + } +} + +export default TimeLine diff --git a/packages/vue/src/time-line/package.json b/packages/vue/src/time-line/package.json new file mode 100644 index 000000000..683ef8a57 --- /dev/null +++ b/packages/vue/src/time-line/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-time-line", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/time-line/src/index.ts b/packages/vue/src/time-line/src/index.ts new file mode 100644 index 000000000..6dbc37da7 --- /dev/null +++ b/packages/vue/src/time-line/src/index.ts @@ -0,0 +1,72 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $prefix, $props, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +const $constants = { + PROCESS_DONE_CLS: 'process-done', + PROCESS_CUR_CLS: 'process-current', + PROCESS_WAIT_CLS: 'process-wait' +} + +export default defineComponent({ + name: $prefix + 'TimeLine', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + vertical: { + type: Boolean, + default: false + }, + horizontal: { + type: Boolean, + default: false + }, + showNumber: { + type: Boolean, + default: true + }, + nameField: { + type: String, + default: 'name' + }, + timeField: { + type: String, + default: 'time' + }, + start: { + type: Number, + default: 1 + }, + data: Array, + space: Number, + active: { + type: Number, + default: -1 + }, + reverse: { + type: Boolean, + default: false + }, + showStatus: { + type: Boolean, + default: false + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/time-line/src/mobile.vue b/packages/vue/src/time-line/src/mobile.vue new file mode 100644 index 000000000..7cb504db5 --- /dev/null +++ b/packages/vue/src/time-line/src/mobile.vue @@ -0,0 +1,108 @@ + + + + diff --git a/packages/vue/src/time-line/src/pc.vue b/packages/vue/src/time-line/src/pc.vue new file mode 100644 index 000000000..2c8306679 --- /dev/null +++ b/packages/vue/src/time-line/src/pc.vue @@ -0,0 +1,105 @@ + + + + diff --git a/packages/vue/src/time-panel/index.ts b/packages/vue/src/time-panel/index.ts new file mode 100644 index 000000000..fb231fc66 --- /dev/null +++ b/packages/vue/src/time-panel/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import TimePanel from './src/index.vue' +import { version } from './package.json' + +/* istanbul ignore next */ +TimePanel.install = function (Vue) { + Vue.component(TimePanel.name, TimePanel) +} + +TimePanel.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + TimePanel.install(window.Vue) + } +} + +export default TimePanel diff --git a/packages/vue/src/time-panel/package.json b/packages/vue/src/time-panel/package.json new file mode 100644 index 000000000..fa43243da --- /dev/null +++ b/packages/vue/src/time-panel/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-time-panel", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-scrollbar": "workspace:~", + "@opentiny/vue-numeric": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/time-panel/src/index.vue b/packages/vue/src/time-panel/src/index.vue new file mode 100644 index 000000000..d89f9a98f --- /dev/null +++ b/packages/vue/src/time-panel/src/index.vue @@ -0,0 +1,59 @@ + + + + diff --git a/packages/vue/src/time-picker/index.ts b/packages/vue/src/time-picker/index.ts new file mode 100644 index 000000000..82058d207 --- /dev/null +++ b/packages/vue/src/time-picker/index.ts @@ -0,0 +1,41 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Picker from '@opentiny/vue-picker' +import { extend } from '@opentiny/vue-renderless/common/object' +import { $prefix } from '@opentiny/vue-common' +import { version } from './package.json' + +const TimePicker = extend(true, { props: { componentName: { type: String, default: 'TimePicker' } } }, Picker, { + props: { + type: { + type: String, + default: 'time' + } + }, + name: $prefix + 'TimePicker' +}) + +/* istanbul ignore next */ +TimePicker.install = function (Vue) { + Vue.component(TimePicker.name, TimePicker) +} + +TimePicker.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + TimePicker.install(window.Vue) + } +} + +export default TimePicker diff --git a/packages/vue/src/time-picker/package.json b/packages/vue/src/time-picker/package.json new file mode 100644 index 000000000..f0f1c0ef3 --- /dev/null +++ b/packages/vue/src/time-picker/package.json @@ -0,0 +1,19 @@ +{ + "name": "@opentiny/vue-time-picker", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/time-picker/src/index.vue b/packages/vue/src/time-picker/src/index.vue similarity index 100% rename from packages/time-picker/src/index.vue rename to packages/vue/src/time-picker/src/index.vue diff --git a/packages/vue/src/time-range/index.ts b/packages/vue/src/time-range/index.ts new file mode 100644 index 000000000..b9a3d0eb8 --- /dev/null +++ b/packages/vue/src/time-range/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import TimeRange from './src/index.vue' +import { version } from './package.json' + +/* istanbul ignore next */ +TimeRange.install = function (Vue) { + Vue.component(TimeRange.name, TimeRange) +} + +TimeRange.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + TimeRange.install(window.Vue) + } +} + +export default TimeRange diff --git a/packages/vue/src/time-range/package.json b/packages/vue/src/time-range/package.json new file mode 100644 index 000000000..088a939f5 --- /dev/null +++ b/packages/vue/src/time-range/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-time-range", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-time-spinner": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/time-range/src/index.vue b/packages/vue/src/time-range/src/index.vue new file mode 100644 index 000000000..6276dd448 --- /dev/null +++ b/packages/vue/src/time-range/src/index.vue @@ -0,0 +1,92 @@ + + + + + diff --git a/packages/vue/src/time-select/index.ts b/packages/vue/src/time-select/index.ts new file mode 100644 index 000000000..afb4cbe32 --- /dev/null +++ b/packages/vue/src/time-select/index.ts @@ -0,0 +1,41 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Picker from '@opentiny/vue-picker' +import { extend } from '@opentiny/vue-renderless/common/object' +import { $prefix } from '@opentiny/vue-common' +import { version } from './package.json' + +const TimeSelect = extend(true, { props: { componentName: { type: String, default: 'TimeSelect' } } }, Picker, { + props: { + type: { + type: String, + default: 'time' + } + }, + name: $prefix + 'TimeSelect' +}) + +/* istanbul ignore next */ +TimeSelect.install = function (Vue) { + Vue.component(TimeSelect.name, TimeSelect) +} + +TimeSelect.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + TimeSelect.install(window.Vue) + } +} + +export default TimeSelect diff --git a/packages/vue/src/time-select/package.json b/packages/vue/src/time-select/package.json new file mode 100644 index 000000000..55e1b7b80 --- /dev/null +++ b/packages/vue/src/time-select/package.json @@ -0,0 +1,19 @@ +{ + "name": "@opentiny/vue-time-select", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/time-select/src/index.vue b/packages/vue/src/time-select/src/index.vue similarity index 100% rename from packages/time-select/src/index.vue rename to packages/vue/src/time-select/src/index.vue diff --git a/packages/vue/src/time-spinner/index.ts b/packages/vue/src/time-spinner/index.ts new file mode 100644 index 000000000..6626fe504 --- /dev/null +++ b/packages/vue/src/time-spinner/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import TimeSpinner from './src/index.vue' +import { version } from './package.json' + +/* istanbul ignore next */ +TimeSpinner.install = function (Vue) { + Vue.component(TimeSpinner.name, TimeSpinner) +} + +TimeSpinner.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + TimeSpinner.install(window.Vue) + } +} + +export default TimeSpinner diff --git a/packages/vue/src/time-spinner/package.json b/packages/vue/src/time-spinner/package.json new file mode 100644 index 000000000..f0fa25e51 --- /dev/null +++ b/packages/vue/src/time-spinner/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-time-spinner", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-scrollbar": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/time-spinner/src/index.vue b/packages/vue/src/time-spinner/src/index.vue new file mode 100644 index 000000000..1fd573fd8 --- /dev/null +++ b/packages/vue/src/time-spinner/src/index.vue @@ -0,0 +1,177 @@ + + + + + diff --git a/packages/vue/src/time/index.ts b/packages/vue/src/time/index.ts new file mode 100644 index 000000000..1842b478a --- /dev/null +++ b/packages/vue/src/time/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Time from './src/index.vue' +import { version } from './package.json' + +/* istanbul ignore next */ +Time.install = function (Vue) { + Vue.component(Time.name, Time) +} + +Time.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Time.install(window.Vue) + } +} + +export default Time diff --git a/packages/vue/src/time/package.json b/packages/vue/src/time/package.json new file mode 100644 index 000000000..466d46386 --- /dev/null +++ b/packages/vue/src/time/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-time", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-time-spinner": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/time/src/index.vue b/packages/vue/src/time/src/index.vue new file mode 100644 index 000000000..b60af2ed8 --- /dev/null +++ b/packages/vue/src/time/src/index.vue @@ -0,0 +1,60 @@ + + + + diff --git a/packages/vue/src/toggle-menu/index.ts b/packages/vue/src/toggle-menu/index.ts new file mode 100644 index 000000000..adb26051e --- /dev/null +++ b/packages/vue/src/toggle-menu/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import ToggleMenu from './src/index.js' +import '@opentiny/vue-theme/toggle-menu/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +ToggleMenu.install = function (Vue) { + Vue.component(ToggleMenu.name, ToggleMenu) +} + +ToggleMenu.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + ToggleMenu.install(window.Vue) + } +} + +export default ToggleMenu diff --git a/packages/vue/src/toggle-menu/package.json b/packages/vue/src/toggle-menu/package.json new file mode 100644 index 000000000..e4578d869 --- /dev/null +++ b/packages/vue/src/toggle-menu/package.json @@ -0,0 +1,23 @@ +{ + "name": "@opentiny/vue-toggle-menu", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-input": "workspace:~", + "@opentiny/vue-tree": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/toggle-menu/src/index.ts b/packages/vue/src/toggle-menu/src/index.ts new file mode 100644 index 000000000..ebf8455c8 --- /dev/null +++ b/packages/vue/src/toggle-menu/src/index.ts @@ -0,0 +1,74 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + LOCALE_PLACEHOLDER: 'ui.toggleMenu.placeholder' +} + +export default defineComponent({ + name: $prefix + 'ToggleMenu', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + data: Array, + placeholder: { + type: String, + default: '' + }, + icon: Object, + defaultExpandAll: { + type: Boolean, + default: false + }, + draggable: { + type: Boolean, + default: false + }, + expandOnClickNode: { + type: Boolean, + default: true + }, + ellipsis: { + type: Boolean, + default: false + }, + wrap: { + type: Boolean, + default: false + }, + showFilter: { + type: Boolean, + default: true + }, + automaticFiltering: { + type: Boolean, + default: true + }, + props: { + default: () => ({ children: 'children', disabled: 'disabled', label: 'label' }) + }, + getMenuDataSync: Function, // deprecated v3.4.0废弃, v3.16.0移除;移除原因:如果是同步数据则和:data功能重复 + getMenuDataAsync: Function, + accordion: Boolean, + defaultCheckedKeys: Array, + showCheckbox: Boolean + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/toggle-menu/src/pc.vue b/packages/vue/src/toggle-menu/src/pc.vue new file mode 100644 index 000000000..05c52404d --- /dev/null +++ b/packages/vue/src/toggle-menu/src/pc.vue @@ -0,0 +1,119 @@ + + + + + diff --git a/packages/vue/src/tooltip/index.ts b/packages/vue/src/tooltip/index.ts new file mode 100644 index 000000000..3896b2cc4 --- /dev/null +++ b/packages/vue/src/tooltip/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Tooltip from './src/index.vue' +import '@opentiny/vue-theme/tooltip/index.less' +import { version } from './package.json' + +Tooltip.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Tooltip.install = function (Vue) { + Vue.component(Tooltip.name, Tooltip) +} + +Tooltip.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Tooltip.install(window.Vue) + } +} + +export default Tooltip diff --git a/packages/vue/src/tooltip/package.json b/packages/vue/src/tooltip/package.json new file mode 100644 index 000000000..8439f8cec --- /dev/null +++ b/packages/vue/src/tooltip/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-tooltip", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/tooltip/src/index.vue b/packages/vue/src/tooltip/src/index.vue new file mode 100644 index 000000000..15e7a347d --- /dev/null +++ b/packages/vue/src/tooltip/src/index.vue @@ -0,0 +1,227 @@ + + + diff --git a/packages/vue/src/top-box/index.ts b/packages/vue/src/top-box/index.ts new file mode 100644 index 000000000..b4a77579c --- /dev/null +++ b/packages/vue/src/top-box/index.ts @@ -0,0 +1,167 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { createComponent, emitter } from '@opentiny/vue-common' +import TopBoxConstructor from './src/index.js' +import '@opentiny/vue-theme/top-box/index.less' +import { version } from './package.json' + +let instances = [] +let seed = 1 + +const handleTopBoxMounted = ({ instance, options }) => { + instance.$el.style.zIndex = instance.getZindex() + + let { state } = instance + + for (let key in options) { + if (Object.prototype.hasOwnProperty.call(state, key)) { + state[key] = options[key] + } + } + + let verticalOffset = options.offset || 20 + + instances.forEach((item) => { + verticalOffset += item.$el.offsetHeight + 16 + }) + + state.verticalOffset = verticalOffset + state.visible = true + + if (state.buttons && state.buttons.length) { + state.buttons.map((button, key) => { + if (key === 0) { + !button.type && (button.type = 'primary') + !button.onClick && + (button.onClick = () => { + instance.close() + }) + } else { + !button.onClick && + (button.onClick = () => { + // do nothing + }) + } + + return button + }) + } + + instance.startTimer() +} + +const TopBox = function (options) { + const _emitter = emitter() + options = options || {} + + if (typeof options === 'string') { + options = { + message: options + } + } + + let id = 'message_' + seed++ + let userOnClose = options.onClose + + options.onClose = function () { + TopBox.close(id, userOnClose) + } + + options.emitter = _emitter + + let instance = createComponent({ + el: document.createElement('div'), + propsData: options, + component: TopBoxConstructor + }) + + instance.id = id + + document.body.appendChild(instance.$el) + instances.push(instance) + + _emitter.on('TopBoxMounted', () => { + handleTopBoxMounted({ instance, options }) + }) + + return instance +} + +const topBox = TopBox + +const types = ['success', 'warning', 'info', 'error', 'help'] + +types.forEach((type) => { + TopBox[type] = (options) => { + if (typeof options === 'string') { + options = { + message: options + } + } + + options.type = type + + return topBox(options) + } +}) + +const findRemove = ({ id, len, userOnClose }) => { + let index = -1 + let removedHeight = 0 + let instance + + for (let i = 0; i < len; i++) { + let tmp = instances[i] + if (tmp.id === id) { + index = i + removedHeight = tmp.$el.offsetHeight + instance = tmp + break + } + } + + if (instance) { + typeof userOnClose === 'function' && userOnClose(instance) + instances.splice(index, 1) + } + + return { index, removedHeight } +} + +const adjustTopOther = ({ index, len, removedHeight }) => { + for (let i = index; i < len - 1; i++) { + let dom = instances[i].$el + dom.style.top = parseInt(dom.style.top, 10) - removedHeight - 16 + 'px' + } +} + +TopBox.close = function (id, userOnClose) { + let len = instances.length + let { index, removedHeight } = findRemove({ id, len, userOnClose }) + + if (len <= 1 || index === -1 || index > instances.length - 1) return + // removedHeight = instances[index].$el.offsetHeight + adjustTopOther({ index, len, removedHeight }) +} + +TopBox.closeAll = function () { + let copys = instances.slice(0) + + copys = copys.reverse() + copys.forEach((instance) => { + instance.close() + }) +} + +TopBox.version = version + +export default TopBox diff --git a/packages/vue/src/top-box/package.json b/packages/vue/src/top-box/package.json new file mode 100644 index 000000000..148b4cab6 --- /dev/null +++ b/packages/vue/src/top-box/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-top-box", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-button": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/top-box/src/index.ts b/packages/vue/src/top-box/src/index.ts new file mode 100644 index 000000000..3160de0f4 --- /dev/null +++ b/packages/vue/src/top-box/src/index.ts @@ -0,0 +1,37 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + SUCCESS: 'icon-success', + INFO: 'icon-info', + WARNING: 'icon-warning', + ERROR: 'icon-error', + HELP: 'icon-help' +} + +export default defineComponent({ + name: $prefix + 'TopBox', + props: { + ...$props, + emitter: Object, + _constants: { + type: Object, + default: () => $constants + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/top-box/src/pc.vue b/packages/vue/src/top-box/src/pc.vue new file mode 100644 index 000000000..c8b51d04b --- /dev/null +++ b/packages/vue/src/top-box/src/pc.vue @@ -0,0 +1,66 @@ + + + + + diff --git a/packages/vue/src/transfer-panel/index.ts b/packages/vue/src/transfer-panel/index.ts new file mode 100644 index 000000000..675e4074b --- /dev/null +++ b/packages/vue/src/transfer-panel/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import TransferPanel from './src/index.vue' +import { version } from './package.json' + +/* istanbul ignore next */ +TransferPanel.install = function (Vue) { + Vue.component(TransferPanel.name, TransferPanel) +} + +TransferPanel.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + TransferPanel.install(window.Vue) + } +} + +export default TransferPanel diff --git a/packages/vue/src/transfer-panel/package.json b/packages/vue/src/transfer-panel/package.json new file mode 100644 index 000000000..b28f570df --- /dev/null +++ b/packages/vue/src/transfer-panel/package.json @@ -0,0 +1,24 @@ +{ + "name": "@opentiny/vue-transfer-panel", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-checkbox": "workspace:~", + "@opentiny/vue-input": "workspace:~", + "@opentiny/vue-pager": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/transfer-panel/src/index.vue b/packages/vue/src/transfer-panel/src/index.vue new file mode 100644 index 000000000..4e64ab54f --- /dev/null +++ b/packages/vue/src/transfer-panel/src/index.vue @@ -0,0 +1,173 @@ + + + + + diff --git a/packages/vue/src/transfer/index.ts b/packages/vue/src/transfer/index.ts new file mode 100644 index 000000000..be25b18f7 --- /dev/null +++ b/packages/vue/src/transfer/index.ts @@ -0,0 +1,35 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Transfer from './src/index.js' +import '@opentiny/vue-theme/transfer/index.less' +import { version } from './package.json' + +Transfer.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +Transfer.install = function (Vue) { + Vue.component(Transfer.name, Transfer) +} + +Transfer.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Transfer.install(window.Vue) + } +} + +export default Transfer diff --git a/packages/vue/src/transfer/package.json b/packages/vue/src/transfer/package.json new file mode 100644 index 000000000..999c5a17f --- /dev/null +++ b/packages/vue/src/transfer/package.json @@ -0,0 +1,24 @@ +{ + "name": "@opentiny/vue-transfer", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-button": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-checkbox": "workspace:~", + "@opentiny/vue-transfer-panel": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/transfer/src/index.ts b/packages/vue/src/transfer/src/index.ts new file mode 100644 index 000000000..9221a4b40 --- /dev/null +++ b/packages/vue/src/transfer/src/index.ts @@ -0,0 +1,101 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + TARGETORDER: 'original', + ISCHECKED: 'is-checked', + DROPPANEL: '.tiny-transfer-panel__list', + TRANSFERPANEL: '.tiny-transfer-panel__item' +} + +export default defineComponent({ + name: $prefix + 'Transfer', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + buttonTexts: { + type: Array, + default: () => [] + }, + columns: Array, + data: { + type: Array, + default: () => [] + }, + dropConfig: Object, + filterMethod: Function, + filterPlaceholder: { + type: String, + default: '' + }, + filterable: Boolean, + format: { + type: Object, + default: () => ({}) + }, + leftDefaultChecked: { + type: Array, + default: () => [] + }, + modelValue: { + type: Array, + default: () => [] + }, + pagerOp: { + type: Object, + default: () => ({ mode: 'fixed', pageVO: { currentPage: 1, pageSize: 10 } }) + }, + props: { + type: Object, + default: () => ({ label: 'label', key: 'key', disabled: 'disabled' }) + }, + render: Object, + renderContent: Function, + renderType: String, + rightDefaultChecked: { + type: Array, + default: () => [] + }, + showAllBtn: Boolean, + showPager: { + type: Boolean, + default: false + }, + targetOrder: { + type: String, + default: 'original' + }, + titles: { + type: Array, + default: () => [] + }, + toLeftDisable: { + type: Boolean, + default: true + }, + toRightDisable: { + type: Boolean, + default: true + }, + treeOp: Object, + beforeTransfer: Function + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/transfer/src/pc.vue b/packages/vue/src/transfer/src/pc.vue new file mode 100644 index 000000000..eeaeccc59 --- /dev/null +++ b/packages/vue/src/transfer/src/pc.vue @@ -0,0 +1,147 @@ + + + + + diff --git a/packages/vue/src/tree-menu/index.ts b/packages/vue/src/tree-menu/index.ts new file mode 100644 index 000000000..40b7c86be --- /dev/null +++ b/packages/vue/src/tree-menu/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import TreeMenu from './src/index.vue' +import '@opentiny/vue-theme/tree-menu/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +TreeMenu.install = function (Vue) { + Vue.component(TreeMenu.name, TreeMenu) +} + +TreeMenu.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + TreeMenu.install(window.Vue) + } +} + +export default TreeMenu diff --git a/packages/vue/src/tree-menu/package.json b/packages/vue/src/tree-menu/package.json new file mode 100644 index 000000000..359990e0a --- /dev/null +++ b/packages/vue/src/tree-menu/package.json @@ -0,0 +1,23 @@ +{ + "name": "@opentiny/vue-tree-menu", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-input": "workspace:~", + "@opentiny/vue-tree": "workspace:~", + "@opentiny/vue-locale": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/tree-menu/src/index.vue b/packages/vue/src/tree-menu/src/index.vue new file mode 100644 index 000000000..9338a8a8a --- /dev/null +++ b/packages/vue/src/tree-menu/src/index.vue @@ -0,0 +1,148 @@ + + + + + diff --git a/packages/vue/src/tree/index.ts b/packages/vue/src/tree/index.ts new file mode 100644 index 000000000..947a936dd --- /dev/null +++ b/packages/vue/src/tree/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Tree from './src/index.js' +import '@opentiny/vue-theme/tree/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Tree.install = function (Vue) { + Vue.component(Tree.name, Tree) +} + +Tree.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Tree.install(window.Vue) + } +} + +export default Tree diff --git a/packages/vue/src/tree/package.json b/packages/vue/src/tree/package.json new file mode 100644 index 000000000..338c4a2d6 --- /dev/null +++ b/packages/vue/src/tree/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-tree", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/tree/src/index.ts b/packages/vue/src/tree/src/index.ts new file mode 100644 index 000000000..955843272 --- /dev/null +++ b/packages/vue/src/tree/src/index.ts @@ -0,0 +1,108 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + EMPTY_TEXT_LOCAL: 'ui.tree.emptyText' +} + +export default defineComponent({ + name: $prefix + 'Tree', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + accordion: Boolean, + allowDrag: Function, + allowDrop: Function, + autoExpandParent: { + type: Boolean, + default: true + }, + checkDescendants: { + type: Boolean, + default: false + }, + checkOnClickNode: Boolean, + checkStrictly: Boolean, + currentNodeKey: [String, Number], + data: { + type: Array + }, + dataset: Object, + defaultCheckedKeys: Array, + defaultExpandAll: Boolean, + defaultExpandedKeys: Array, + defaultExpandedKeysHighlight: [Number, String], + draggable: { + type: Boolean, + default: false + }, + emptyText: String, + expandIcon: Object, + expandOnClickNode: { + type: Boolean, + default: true + }, + filterNodeMethod: Function, + highlightCurrent: Boolean, + icon: Object, + iconTriggerClickNode: { + type: Boolean, + default: true + }, + indent: { + type: Number, + default: 16 + }, + lazy: { + type: Boolean, + default: false + }, + load: Function, + nodeKey: String, + parentKey: String, + props: { + default() { + return { + children: 'children', + label: 'label', + disabled: 'disabled' + } + } + }, + renderAfterExpand: { + type: Boolean, + default: true + }, + renderContent: Function, + showCheckbox: { + type: Boolean, + default: false + }, + showContextmenu: { + type: Boolean, + default: false + }, + showRadio: { + type: Boolean, + default: false + }, + shrinkIcon: Object + }, + setup(props, context) { + return $setup({ props, context, template }) + } +}) diff --git a/packages/vue/src/tree/src/pc.vue b/packages/vue/src/tree/src/pc.vue new file mode 100644 index 000000000..63d2b237e --- /dev/null +++ b/packages/vue/src/tree/src/pc.vue @@ -0,0 +1,118 @@ + + + + + diff --git a/packages/tree/src/tree-node.vue b/packages/vue/src/tree/src/tree-node.vue similarity index 99% rename from packages/tree/src/tree-node.vue rename to packages/vue/src/tree/src/tree-node.vue index 1bf51e487..566536970 100644 --- a/packages/tree/src/tree-node.vue +++ b/packages/vue/src/tree/src/tree-node.vue @@ -120,7 +120,7 @@ - diff --git a/packages/vue/src/upload-list/index.ts b/packages/vue/src/upload-list/index.ts new file mode 100644 index 000000000..d7e1c5c52 --- /dev/null +++ b/packages/vue/src/upload-list/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import UploadList from './src/index.vue' +import { version } from './package.json' + +/* istanbul ignore next */ +UploadList.install = function (Vue) { + Vue.component(UploadList.name, UploadList) +} + +UploadList.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + UploadList.install(window.Vue) + } +} + +export default UploadList diff --git a/packages/vue/src/upload-list/package.json b/packages/vue/src/upload-list/package.json new file mode 100644 index 000000000..8bec61339 --- /dev/null +++ b/packages/vue/src/upload-list/package.json @@ -0,0 +1,23 @@ +{ + "name": "@opentiny/vue-upload-list", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-progress": "workspace:~", + "@opentiny/vue-image-viewer": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/upload-list/src/index.vue b/packages/vue/src/upload-list/src/index.vue new file mode 100644 index 000000000..bca5d74d7 --- /dev/null +++ b/packages/vue/src/upload-list/src/index.vue @@ -0,0 +1,236 @@ + + + + + diff --git a/packages/vue/src/upload/index.ts b/packages/vue/src/upload/index.ts new file mode 100644 index 000000000..38b950b8d --- /dev/null +++ b/packages/vue/src/upload/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Upload from './src/index.vue' +import { version } from './package.json' + +/* istanbul ignore next */ +Upload.install = function (Vue) { + Vue.component(Upload.name, Upload) +} + +Upload.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Upload.install(window.Vue) + } +} + +export default Upload diff --git a/packages/vue/src/upload/package.json b/packages/vue/src/upload/package.json new file mode 100644 index 000000000..525f31f4d --- /dev/null +++ b/packages/vue/src/upload/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-upload", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-upload-dragger": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/upload/src/index.vue b/packages/vue/src/upload/src/index.vue new file mode 100644 index 000000000..e49af4080 --- /dev/null +++ b/packages/vue/src/upload/src/index.vue @@ -0,0 +1,134 @@ + + + diff --git a/packages/vue/src/user-account/index.ts b/packages/vue/src/user-account/index.ts new file mode 100644 index 000000000..8f9bb6ded --- /dev/null +++ b/packages/vue/src/user-account/index.ts @@ -0,0 +1,19 @@ +import UserAccount from './src/index.js' +import '@opentiny/vue-theme/user-account/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +UserAccount.install = function (Vue) { + Vue.component(UserAccount.name, UserAccount) +} + +UserAccount.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + UserAccount.install(window.Vue) + } +} + +export default UserAccount diff --git a/packages/vue/src/user-account/package.json b/packages/vue/src/user-account/package.json new file mode 100644 index 000000000..2411ebf1d --- /dev/null +++ b/packages/vue/src/user-account/package.json @@ -0,0 +1,22 @@ +{ + "name": "@opentiny/vue-user-account", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-user-contact": "workspace:~", + "@opentiny/vue-logout": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/user-account/src/index.ts b/packages/vue/src/user-account/src/index.ts new file mode 100644 index 000000000..3f22a0deb --- /dev/null +++ b/packages/vue/src/user-account/src/index.ts @@ -0,0 +1,32 @@ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'UserAccount', + props: { + ...$props, + getLangData: Function, + getUserInfo: Function, + getUserImageUrl: Function, + getLogoutUrl: Function, + redirectUrl: String, + isLocal: Boolean, + network: Function, + isMock: Boolean, + isGuestUser: Function, + showLogin: Function, + showArrow: { + type: Boolean, + default: false + }, + popperClass: String, + popperAppendToBody: { + type: Boolean, + default: true + }, + beforeLogout: Function + }, + setup(props, context) { + return $setup({ props, context, template }) + } +}) diff --git a/packages/vue/src/user-account/src/pc.vue b/packages/vue/src/user-account/src/pc.vue new file mode 100644 index 000000000..5fde3629e --- /dev/null +++ b/packages/vue/src/user-account/src/pc.vue @@ -0,0 +1,62 @@ + + + diff --git a/packages/vue/src/user-contact/index.ts b/packages/vue/src/user-contact/index.ts new file mode 100644 index 000000000..d84cc747a --- /dev/null +++ b/packages/vue/src/user-contact/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import UserContact from './src/index' +import '@opentiny/vue-theme/user-contact/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +UserContact.install = function (Vue) { + Vue.component(UserContact.name, UserContact) +} + +UserContact.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + UserContact.install(window.Vue) + } +} + +export default UserContact diff --git a/packages/vue/src/user-contact/package.json b/packages/vue/src/user-contact/package.json new file mode 100644 index 000000000..0c7b53143 --- /dev/null +++ b/packages/vue/src/user-contact/package.json @@ -0,0 +1,24 @@ +{ + "name": "@opentiny/vue-user-contact", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-user-head": "workspace:~", + "@opentiny/vue-card-template": "workspace:~", + "@opentiny/vue-popover": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/user-contact/src/index.ts b/packages/vue/src/user-contact/src/index.ts new file mode 100644 index 000000000..e97dfab36 --- /dev/null +++ b/packages/vue/src/user-contact/src/index.ts @@ -0,0 +1,71 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $setup, $prefix, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'UserContact', + props: { + ...$props, + showName: { + type: Boolean, + default: true + }, + showArrow: { + type: Boolean, + default: false + }, + + /** + * 是否显示 userDescription, colType 为 false 时生效 + */ + showDescription: { + type: Boolean, + default: true + }, + + /** + * 是否显示 头像 + */ + showImg: { + type: Boolean, + default: true + }, + + /** + * 数据 + */ + data: { + type: Object, + validator: (value) => + typeof value.userName === 'string' && value.imgUrl + ? typeof value.imgUrl === 'string' + : true && typeof value.userDescription === 'string' && (!value.values || Array.isArray(value.values)) + }, + popperClass: String, + popperAppendToBody: { + type: Boolean, + default: true + }, + isNewImMode: { + type: Boolean, + default: true + } + }, + setup(props, context) { + return $setup({ + context, + props, + template + }) + } +}) diff --git a/packages/vue/src/user-contact/src/pc.vue b/packages/vue/src/user-contact/src/pc.vue new file mode 100644 index 000000000..337bd1fb6 --- /dev/null +++ b/packages/vue/src/user-contact/src/pc.vue @@ -0,0 +1,84 @@ + + + + + diff --git a/packages/vue/src/user-head/index.ts b/packages/vue/src/user-head/index.ts new file mode 100644 index 000000000..6fc12a46c --- /dev/null +++ b/packages/vue/src/user-head/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import UserHead from './src/index' +import { version } from './package.json' + +/* istanbul ignore next */ +UserHead.install = function (Vue) { + Vue.component(UserHead.name, UserHead) +} + +UserHead.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + UserHead.install(window.Vue) + } +} + +export default UserHead diff --git a/packages/vue/src/user-head/package.json b/packages/vue/src/user-head/package.json new file mode 100644 index 000000000..601ba838c --- /dev/null +++ b/packages/vue/src/user-head/package.json @@ -0,0 +1,21 @@ +{ + "name": "@opentiny/vue-user-head", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/user-head/src/index.ts b/packages/vue/src/user-head/src/index.ts new file mode 100644 index 000000000..4f06be23c --- /dev/null +++ b/packages/vue/src/user-head/src/index.ts @@ -0,0 +1,98 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc|mobile' + +export default defineComponent({ + name: $prefix + 'UserHead', + props: { + ...$props, + + /** + * @property {Boolean} [min=false] - 小尺寸模式 + */ + min: Boolean, + + /** + * @property {Boolean} [round=true] - 圆形模式 + */ + round: Boolean, + + /** + * @property {String} [color=#ffffff] - 文字颜色 + */ + color: { + type: String, + default: '#ffffff' + }, + + /** + * @property {String} [backgroundColor=#BBBBBB] - 背景色 + */ + backgroundColor: String, + + /** + * @property {String} [type=label] - 头像类型,icon|image|label 可选 + */ + type: { + type: String, + default: 'label', + validator: (value) => ~['icon', 'image', 'label'].indexOf(value) + }, + + /** + * @property {String} - 头像资源 + * type=icon 时为图标类名,type=label时为字体串,type=image时为资源路径 + */ + value: { + type: [Object, String], + default: null + }, + + /** + * @property {Number} - 消息计数 + */ + messageTotal: Number, + + /** + * @property {String} [messageType=details] - 消息类型 details|basic 可选 + */ + messageType: { + type: String, + default: 'details', + validator: (value) => ~['details', 'basic'].indexOf(value) + }, + + /** + * @property {Number} [messageUpperLimit=0] - 消息显示上限 + */ + messageUpperLimit: { + type: Number, + default: 0 + }, + + /** + * @property {String, Number} [size=normal] - 头像尺寸 + */ + size: { + type: [Number, String], + default: 'medium', + validator(val) { + return typeof val === 'string' ? ~['large', 'medium', 'small'].indexOf(val) : typeof val === 'number' + } + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/user-head/src/mobile.vue b/packages/vue/src/user-head/src/mobile.vue new file mode 100644 index 000000000..11de88ae8 --- /dev/null +++ b/packages/vue/src/user-head/src/mobile.vue @@ -0,0 +1,46 @@ + + + + + diff --git a/packages/vue/src/user-head/src/pc.vue b/packages/vue/src/user-head/src/pc.vue new file mode 100644 index 000000000..3b2f457f0 --- /dev/null +++ b/packages/vue/src/user-head/src/pc.vue @@ -0,0 +1,42 @@ + + + + + diff --git a/packages/vue/src/user-link/index.ts b/packages/vue/src/user-link/index.ts new file mode 100644 index 000000000..850a99cca --- /dev/null +++ b/packages/vue/src/user-link/index.ts @@ -0,0 +1,24 @@ +import UserLink from './src/index.js' +import '@opentiny/vue-theme/user-link/index.less' +import { version } from './package.json' + +UserLink.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +UserLink.install = function (Vue) { + Vue.component(UserLink.name, UserLink) +} + +UserLink.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + UserLink.install(window.Vue) + } +} + +export default UserLink diff --git a/packages/vue/src/user-link/package.json b/packages/vue/src/user-link/package.json new file mode 100644 index 000000000..fe37c5f40 --- /dev/null +++ b/packages/vue/src/user-link/package.json @@ -0,0 +1,23 @@ +{ + "name": "@opentiny/vue-user-link", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-popover": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@opentiny/vue-loading": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/user-link/src/index.ts b/packages/vue/src/user-link/src/index.ts new file mode 100644 index 000000000..92784e2b5 --- /dev/null +++ b/packages/vue/src/user-link/src/index.ts @@ -0,0 +1,55 @@ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +export default defineComponent({ + name: $prefix + 'UserLink', + props: { + ...$props, + modelValue: String, + cache: { + type: Boolean, + default: true + }, + cacheKey: { + type: String, + default: 'tiny-user' + }, + cacheFields: { + type: Array, + default: () => [] + }, + valueSplit: { + type: String, + default: () => ',' + }, + textSplit: { + type: String, + default: () => ',' + }, + valueField: { + type: String, + default: () => 'userId' + }, + textField: { + type: String, + default: () => 'userCN' + }, + card: { + type: Boolean, + default: true + }, + fetchUser: Function, + fetchW3Accounts: Function, + getUserImageUrl: Function, + fetchUserByUserId: Function, + UserCache: Object, + batch: { + type: [Boolean, Number], + default: 0 + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/user-link/src/pc.vue b/packages/vue/src/user-link/src/pc.vue new file mode 100644 index 000000000..33804a629 --- /dev/null +++ b/packages/vue/src/user-link/src/pc.vue @@ -0,0 +1,131 @@ + + + + + diff --git a/packages/vue/src/user/index.ts b/packages/vue/src/user/index.ts new file mode 100644 index 000000000..ab52a43b6 --- /dev/null +++ b/packages/vue/src/user/index.ts @@ -0,0 +1,24 @@ +import User from './src/index.js' +import '@opentiny/vue-theme/user/index.less' +import { version } from './package.json' + +User.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +/* istanbul ignore next */ +User.install = function (Vue) { + Vue.component(User.name, User) +} + +User.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + User.install(window.Vue) + } +} + +export default User diff --git a/packages/vue/src/user/package.json b/packages/vue/src/user/package.json new file mode 100644 index 000000000..52f616c25 --- /dev/null +++ b/packages/vue/src/user/package.json @@ -0,0 +1,23 @@ +{ + "name": "@opentiny/vue-user", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-select": "workspace:~", + "@opentiny/vue-option": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/user/src/index.ts b/packages/vue/src/user/src/index.ts new file mode 100644 index 000000000..2664e010c --- /dev/null +++ b/packages/vue/src/user/src/index.ts @@ -0,0 +1,125 @@ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + COMPONENT_NAME: { FormItem: 'FormItem' }, + EVENT_NAME: { FormBlur: 'form.blur' } +} + +export default defineComponent({ + name: $prefix + 'User', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + tabindex: { type: String, default: '1' }, + modelValue: { + type: [String, Number], + required: false + }, + multiple: { + type: Boolean, + default: false + }, + disabled: { + type: Boolean, + default: false + }, + valueSplit: { + type: String, + default: ',' + }, + textSplit: { + type: String, + default: ',' + }, + valueField: { + type: String, + default: 'userId' + }, + textField: { + type: String, + default: 'userCN' + }, + cache: { + type: Boolean, + default: true + }, + cacheKey: { + type: String, + default: 'tiny-user' + }, + delay: { + type: Number, + default: 600 + }, + suggestLength: { + type: Number, + default: 3 + }, + cacheFields: { + type: Array, + default: () => [] + }, + collapseTags: { + type: Boolean, + default: false + }, + placeholder: { + type: String, + default: '' + }, + showOverflowTooltip: { + type: Boolean, + default: true + }, + sortByFetchData: { + type: Boolean, + default: false + }, + sortable: Function, + size: String, + fetchW3Accounts: Function, + fetchSuggestUser: Function, + fetchUserByUserId: Function, + userCache: Object, + popperClass: String, + popperAppendToBody: { + type: Boolean, + default: true + }, + tagSelectable: { + type: Boolean, + default: false + }, + copyable: { + type: Boolean, + default: false + }, + batch: { + type: [Boolean, Number], + default: 0 + }, + allowCopy: { + type: Boolean, + default: false + }, + noDataText: String, + loadingText: String, + autoClose: Boolean, + queryDebounce: { + type: Number, + default: 100 + }, + hideSelected: Boolean, + ignoreEnter: { + type: Boolean, + default: true + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +}) diff --git a/packages/vue/src/user/src/pc.vue b/packages/vue/src/user/src/pc.vue new file mode 100644 index 000000000..639a6d7eb --- /dev/null +++ b/packages/vue/src/user/src/pc.vue @@ -0,0 +1,118 @@ + + + diff --git a/packages/vue/src/wheel/index.ts b/packages/vue/src/wheel/index.ts new file mode 100644 index 000000000..5be3a0323 --- /dev/null +++ b/packages/vue/src/wheel/index.ts @@ -0,0 +1,34 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Wheel from './src/index' +import '@opentiny/vue-theme-mobile/wheel/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Wheel.model = { + prop: 'modelValue', + event: 'update:modelValue' +} + +Wheel.install = function (Vue) { + Vue.component(Wheel.name, Wheel) +} + +Wheel.version = version + +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Wheel.install(window.Vue) + } +} + +export default Wheel diff --git a/packages/vue/src/wheel/package.json b/packages/vue/src/wheel/package.json new file mode 100644 index 000000000..ba9dc7f95 --- /dev/null +++ b/packages/vue/src/wheel/package.json @@ -0,0 +1,24 @@ +{ + "name": "@opentiny/vue-wheel", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-locale": "workspace:~", + "@opentiny/vue-icon": "workspace:~", + "@better-scroll/core": "2.5.0", + "@better-scroll/wheel": "2.5.0" + }, + "license": "MIT" +} \ No newline at end of file diff --git a/packages/vue/src/wheel/src/index.vue b/packages/vue/src/wheel/src/index.vue new file mode 100644 index 000000000..dc23bca21 --- /dev/null +++ b/packages/vue/src/wheel/src/index.vue @@ -0,0 +1,74 @@ + + + + diff --git a/packages/vue/src/wizard/index.ts b/packages/vue/src/wizard/index.ts new file mode 100644 index 000000000..aa2597de4 --- /dev/null +++ b/packages/vue/src/wizard/index.ts @@ -0,0 +1,30 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import Wizard from './src/index' +import '@opentiny/vue-theme/wizard/index.less' +import { version } from './package.json' + +/* istanbul ignore next */ +Wizard.install = function (Vue) { + Vue.component(Wizard.name, Wizard) +} + +Wizard.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + Wizard.install(window.Vue) + } +} + +export default Wizard diff --git a/packages/vue/src/wizard/package.json b/packages/vue/src/wizard/package.json new file mode 100644 index 000000000..61b32d8a8 --- /dev/null +++ b/packages/vue/src/wizard/package.json @@ -0,0 +1,23 @@ +{ + "name": "@opentiny/vue-wizard", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~", + "@opentiny/vue-button": "workspace:~", + "@opentiny/vue-user-contact": "workspace:~", + "@opentiny/vue-icon": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/wizard/src/index.ts b/packages/vue/src/wizard/src/index.ts new file mode 100644 index 000000000..1116a6182 --- /dev/null +++ b/packages/vue/src/wizard/src/index.ts @@ -0,0 +1,50 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import { $props, $prefix, $setup, defineComponent } from '@opentiny/vue-common' +import template from 'virtual-template?pc' + +const $constants = { + DOING_STATUS: 'doing', + READY_STATUS: 'ready', + WAIT_STATUS: 'wait' +} + +export default defineComponent({ + name: $prefix + 'Wizard', + props: { + ...$props, + _constants: { + type: Object, + default: () => $constants + }, + data: { + type: Array, + default: () => [] + }, + pageGuide: { + type: Boolean, + default: false + }, + vertical: { + type: Boolean, + default: false + }, + timeLineFlow: { + type: Boolean, + default: false + } + }, + setup(props, context) { + return $setup({ props, context, template }) + } +} +) diff --git a/packages/vue/src/wizard/src/pc.vue b/packages/vue/src/wizard/src/pc.vue new file mode 100644 index 000000000..953656f76 --- /dev/null +++ b/packages/vue/src/wizard/src/pc.vue @@ -0,0 +1,142 @@ + + + + + diff --git a/packages/vue/src/year-table/index.ts b/packages/vue/src/year-table/index.ts new file mode 100644 index 000000000..6f3778849 --- /dev/null +++ b/packages/vue/src/year-table/index.ts @@ -0,0 +1,29 @@ +/** + * Copyright (c) 2022 - present TinyVue Authors. + * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. + * + * Use of this source code is governed by an MIT-style license. + * + * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, + * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR + * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. + * + */ +import YearTable from './src/index.vue' +import { version } from './package.json' + +/* istanbul ignore next */ +YearTable.install = function (Vue) { + Vue.component(YearTable.name, YearTable) +} + +YearTable.version = version + +/* istanbul ignore next */ +if (process.env.BUILD_TARGET === 'runtime') { + if (typeof window !== 'undefined' && window.Vue) { + YearTable.install(window.Vue) + } +} + +export default YearTable diff --git a/packages/vue/src/year-table/package.json b/packages/vue/src/year-table/package.json new file mode 100644 index 000000000..2ff60d399 --- /dev/null +++ b/packages/vue/src/year-table/package.json @@ -0,0 +1,20 @@ +{ + "name": "@opentiny/vue-year-table", + "version": "3.7.0", + "description": "", + "main": "lib/index.js", + "module": "index.ts", + "devDependencies": { + "@opentiny-internal/vue-test-utils": "workspace:*", + "vitest": "^0.25.7" + }, + "scripts": { + "build": "pnpm -w build:ui $npm_package_name", + "//postversion": "pnpm build" + }, + "dependencies": { + "@opentiny/vue-renderless": "workspace:~", + "@opentiny/vue-common": "workspace:~" + }, + "license": "MIT" +} diff --git a/packages/vue/src/year-table/src/index.vue b/packages/vue/src/year-table/src/index.vue new file mode 100644 index 000000000..0d0d02723 --- /dev/null +++ b/packages/vue/src/year-table/src/index.vue @@ -0,0 +1,81 @@ + + + + + diff --git a/packages/wizard/index.js b/packages/wizard/index.js deleted file mode 100644 index e4f69b5a7..000000000 --- a/packages/wizard/index.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Wizard from './src/index' -import '@opentiny/vue-theme/wizard/index.css' - -/* istanbul ignore next */ -Wizard.install = function (Vue) { - Vue.component(Wizard.name, Wizard) -} - -Wizard.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - Wizard.install(window.Vue) - } -} - -export default Wizard diff --git a/packages/wizard/package.json b/packages/wizard/package.json deleted file mode 100644 index e2f1fcb2a..000000000 --- a/packages/wizard/package.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "name": "@opentiny/vue-wizard", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0", - "@opentiny/vue-button": "~0.1.0", - "@opentiny/vue-user-contact": "~0.1.0", - "@opentiny/vue-icon": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/wizard/src/index.js b/packages/wizard/src/index.js deleted file mode 100644 index 89213ea0d..000000000 --- a/packages/wizard/src/index.js +++ /dev/null @@ -1,51 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { $props, $prefix, $setup } from '@opentiny/vue-common' -import PCTemplate from './pc' - -const $constants = { - DOING_STATUS: 'doing', - READY_STATUS: 'ready', - WAIT_STATUS: 'wait' -} - -const template = () => PCTemplate - -export default { - name: $prefix + 'Wizard', - props: { - ...$props, - _constants: { - type: Object, - default: () => $constants - }, - data: { - type: Array, - default: () => [] - }, - pageGuide: { - type: Boolean, - default: false - }, - vertical: { - type: Boolean, - default: false - }, - timeLineFlow: { - type: Boolean, - default: false - } - }, - setup(props, context) { - return $setup({ props, context, template }) - } -} diff --git a/packages/wizard/src/pc.vue b/packages/wizard/src/pc.vue deleted file mode 100644 index 9235d45b3..000000000 --- a/packages/wizard/src/pc.vue +++ /dev/null @@ -1,142 +0,0 @@ - - - - - diff --git a/packages/year-table/index.js b/packages/year-table/index.js deleted file mode 100644 index dc56ee607..000000000 --- a/packages/year-table/index.js +++ /dev/null @@ -1,28 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import YearTable from './src/index.vue' - -/* istanbul ignore next */ -YearTable.install = function (Vue) { - Vue.component(YearTable.name, YearTable) -} - -YearTable.version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - YearTable.install(window.Vue) - } -} - -export default YearTable diff --git a/packages/year-table/package.json b/packages/year-table/package.json deleted file mode 100644 index 7fe866915..000000000 --- a/packages/year-table/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "@opentiny/vue-year-table", - "version": "0.1.0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet", - "build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js", - "build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/packages/year-table/src/index.vue b/packages/year-table/src/index.vue deleted file mode 100644 index d5072f386..000000000 --- a/packages/year-table/src/index.vue +++ /dev/null @@ -1,81 +0,0 @@ - - - - - diff --git a/patches/depcheck@1.4.3.patch b/patches/depcheck@1.4.3.patch new file mode 100644 index 000000000..4dc22949e --- /dev/null +++ b/patches/depcheck@1.4.3.patch @@ -0,0 +1,39 @@ +diff --git a/dist/cli.js b/dist/cli.js +index 8141a0fc3e83688b98448fd83d2e36ec99c92a68..69877a452ba8c9ce6001a13b431acbe44fb3c929 100644 +--- a/dist/cli.js ++++ b/dist/cli.js +@@ -85,6 +85,7 @@ function print(result, log, opt, rootDir) { + const content = deps.concat(devDeps, missing).join('\n'); + log(content); + } ++ log(rootDir + '/package.json'); + + return result; + } +diff --git a/dist/constants.js b/dist/constants.js +index 5d79cb47845c497ce25cd8ff9e9758b55c3e33c0..12c274e75b62d17387b929f1541b923349babf1e 100644 +--- a/dist/constants.js ++++ b/dist/constants.js +@@ -44,7 +44,8 @@ const defaultOptions = { + '**/*.sass': availableParsers.sass, + '**/*.scss': availableParsers.sass, + '**/*.vue': availableParsers.vue, +- '**/*.svelte': availableParsers.svelte ++ '**/*.svelte': availableParsers.svelte, ++ '**/*.mjs': availableParsers.es6 + }, + detectors: [availableDetectors.importDeclaration, availableDetectors.exportDeclaration, availableDetectors.requireCallExpression, availableDetectors.requireResolveCallExpression, availableDetectors.typescriptImportEqualsDeclaration, availableDetectors.importCallExpression, availableDetectors.gruntLoadTaskCallExpression], + specials: _lodash.default.values(availableSpecials) +diff --git a/dist/parser/vue.js b/dist/parser/vue.js +index 1806187981ee9390f52846b31a14b14083841906..02bc8f96b2c14f4c5d3538af9a6382d3b6638801 100644 +--- a/dist/parser/vue.js ++++ b/dist/parser/vue.js +@@ -25,7 +25,7 @@ async function parseVue(filename) { + // Because we only parse them, not evaluate any code, it is safe to do so. + // note that babel/parser 7+ does not support *, due to plugin incompatibilities + // Because the guys using React always want the newest syntax. +- plugins: ['asyncGenerators', 'bigInt', 'classProperties', 'classPrivateProperties', 'classPrivateMethods', // ['decorators', { decoratorsBeforeExport: true }], ++ plugins: ['typescript', 'asyncGenerators', 'bigInt', 'classProperties', 'classPrivateProperties', 'classPrivateMethods', // ['decorators', { decoratorsBeforeExport: true }], + 'decorators-legacy', // Vue cannot support both decorators + 'doExpressions', 'dynamicImport', 'exportDefaultFrom', 'exportNamespaceFrom', 'functionBind', 'functionSent', 'importMeta', 'logicalAssignment', 'nullishCoalescingOperator', 'numericSeparator', 'objectRestSpread', 'optionalCatchBinding', 'optionalChaining', ['pipelineOperator', { + proposal: 'minimal' \ No newline at end of file diff --git a/patches/vite-plugin-importus@1.0.4.patch b/patches/vite-plugin-importus@1.0.4.patch new file mode 100644 index 000000000..1ef3dadb6 --- /dev/null +++ b/patches/vite-plugin-importus@1.0.4.patch @@ -0,0 +1,64 @@ +diff --git a/dist/index.d.ts b/dist/index.d.ts +index db9f95e0c23a27b1991782e5e1b824e4224ba2f8..1027527a0b49d55e57f95a52f0183ac691eb25b0 100644 +--- a/dist/index.d.ts ++++ b/dist/index.d.ts +@@ -1,6 +1,9 @@ + interface ImportOption { +- [key: string]: any; + libraryName: string; ++ style?: string | boolean | ((name: string, file?: any) => string); ++ styleLibraryDirectory?: string; ++ customName?: (name: string, file: any) => string; ++ customStyleName?: (name: string) => string; + libraryDirectory?: string; + camel2DashComponentName?: boolean; + } +diff --git a/dist/index.js b/dist/index.js +index 8f41efa9facb84ec8f8c437cd09de1b0d34e664a..468456172970fc6224e1c367b9cd1d95b0c5546e 100644 +--- a/dist/index.js ++++ b/dist/index.js +@@ -37,8 +37,9 @@ var import_acorn2 = require("acorn"); + var import_magic_string = __toESM(require("magic-string")); + + // src/format.ts +-var import_lodash = __toESM(require("lodash")); +-var kebabCase = import_lodash.default.kebabCase; ++var import_param_case = __toESM(require("param-case")); ++var kebabCase = import_param_case.paramCase; ++ + function formatedComponentName(libraryName, componentName, option) { + const { + libraryDirectory = "lib", +@@ -316,7 +317,7 @@ function dynamicImportPlugin(options) { + throw new Error("Options must be array."); + } + const ext = import_path.default.extname(id).slice(1); +- if (["js", "jsx", "ts", "tsx"].indexOf(ext) > -1) { ++ if (["js", "jsx", "ts", "tsx", "vue"].indexOf(ext) > -1) { + code = await transform_default(code, importOptions); + } + return code; +diff --git a/dist/index.mjs b/dist/index.mjs +index 2813fc5d7336fcadf9e14f411d0624d58503872d..baf135c4932159f1d31d6f12d96920af2407761b 100644 +--- a/dist/index.mjs ++++ b/dist/index.mjs +@@ -7,8 +7,8 @@ import { Parser as Parser2 } from "acorn"; + import MagicString from "magic-string"; + + // src/format.ts +-import _ from "lodash"; +-var kebabCase = _.kebabCase; ++import { paramCase } from 'param-case' ++var kebabCase = paramCase; + function formatedComponentName(libraryName, componentName, option) { + const { + libraryDirectory = "lib", +@@ -286,7 +286,7 @@ function dynamicImportPlugin(options) { + throw new Error("Options must be array."); + } + const ext = path.extname(id).slice(1); +- if (["js", "jsx", "ts", "tsx"].indexOf(ext) > -1) { ++ if (["js", "jsx", "ts", "tsx", "vue"].indexOf(ext) > -1) { + code = await transform_default(code, importOptions); + } + return code; \ No newline at end of file diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml new file mode 100644 index 000000000..2d98772f4 --- /dev/null +++ b/pnpm-workspace.yaml @@ -0,0 +1,4 @@ +packages: + - packages/** + - examples/* + - internals/* diff --git a/template/common/vue2.js b/template/common/vue2.js deleted file mode 100644 index 8cd6324b6..000000000 --- a/template/common/vue2.js +++ /dev/null @@ -1,20 +0,0 @@ -import * as vue from '@opentiny/vue-common/adapter/vue2' - -export default vue.default - -export const { - defineAsyncComponent, - markRaw, - renderComponent, - rootConfig, - appContext, - appProperties, - tools, - directive, - h, - createComponent, - parseVnode, - bindFilter, - useRouter, - emitter -} = vue diff --git a/template/common/vue3.js b/template/common/vue3.js deleted file mode 100644 index 5036c3258..000000000 --- a/template/common/vue3.js +++ /dev/null @@ -1,20 +0,0 @@ -import * as vue from '@opentiny/vue-common/adapter/vue3' - -export default vue.default - -export const { - defineAsyncComponent, - markRaw, - renderComponent, - rootConfig, - appContext, - appProperties, - tools, - directive, - h, - createComponent, - parseVnode, - bindFilter, - useRouter, - emitter -} = vue diff --git a/template/component/index.js b/template/component/index.js deleted file mode 100644 index ccf34ea37..000000000 --- a/template/component/index.js +++ /dev/null @@ -1,23 +0,0 @@ -import [[UNAME]] from './src/index[[SUFFIX]]' -// import '@huawei/[[THEME]]/[[NAME]]/index.css' - -[[UNAME]].model = { - prop: 'modelValue', - event: 'update:modelValue' -} - -/* istanbul ignore next */ -[[UNAME]].install = function (Vue) { - Vue.component([[UNAME]].name, [[UNAME]]) -} - -[[UNAME]].version = process.env.COMPONENT_VERSION - -/* istanbul ignore next */ -if (process.env.BUILD_TARGET === 'runtime') { - if (typeof window !== 'undefined' && window.Vue) { - [[UNAME]].install(window.Vue) - } -} - -export default [[UNAME]] diff --git a/template/component/package.json b/template/component/package.json deleted file mode 100644 index df4f63d65..000000000 --- a/template/component/package.json +++ /dev/null @@ -1,15 +0,0 @@ -{ - "name": "@opentiny/vue-[[NAME]]", - "version": "0.[[MINOR]].0", - "description": "", - "main": "lib/index.js", - "scripts": { - "lint": "eslint src/**/*{.js,.html,.vue} --quiet" - }, - "dependencies": { - "@opentiny/vue-renderless": "~0.1.0", - "@opentiny/vue-theme": "~0.1.0", - "@opentiny/vue-common": "~0.1.0" - }, - "license": "MIT" -} diff --git a/template/component/src/index.js b/template/component/src/index.js deleted file mode 100644 index 3d4367f29..000000000 --- a/template/component/src/index.js +++ /dev/null @@ -1,34 +0,0 @@ -import { $props, $setup, $prefix } from '@opentiny/vue-common' - -const _constants = {} - -export default { - name: $prefix + '[[UNAME]]', - props: { - ...$props, - _constants: { - type: Object, - default: () => _constants - }, - modelValue: String - }, - setup(props, context) { - return $setup({ - props, - context, - template: (mode) => { - /* istanbul ignore next */ - if (process.env.NODE_ENV === 'test') { - return require(`./${mode}`).default - } else if (process.env.TINY_MODE) { - return require('./' + process.env.TINY_MODE).default - } else { - return () => - import( - /* webpackChunkName: "[[NAME]]-[request]" */ /* webpackExclude: /index|dist/ */ `./${mode}` - ) - } - } - }) - } -} diff --git a/template/component/src/mobile.vue b/template/component/src/mobile.vue deleted file mode 100644 index 65064c2cb..000000000 --- a/template/component/src/mobile.vue +++ /dev/null @@ -1,16 +0,0 @@ - - - diff --git a/template/component/src/pc.vue b/template/component/src/pc.vue deleted file mode 100644 index 65064c2cb..000000000 --- a/template/component/src/pc.vue +++ /dev/null @@ -1,16 +0,0 @@ - - - diff --git a/template/locale/vue2.js b/template/locale/vue2.js deleted file mode 100644 index 8c517625f..000000000 --- a/template/locale/vue2.js +++ /dev/null @@ -1,21 +0,0 @@ -import * as vue from '@opentiny/vue-locale/vue2' -import glob from './glob' - -export const { use, t, i18n, initI18n, extend, zhCN, enUS, language } = vue - -export const globalization = glob(t) - -export const version = process.env.COMPONENT_VERSION - -export default { - use, - t, - i18n, - initI18n, - extend, - zhCN, - enUS, - language, - ...vue.default, - globalization -} diff --git a/template/locale/vue3.js b/template/locale/vue3.js deleted file mode 100644 index 7ec7bf5c9..000000000 --- a/template/locale/vue3.js +++ /dev/null @@ -1,21 +0,0 @@ -import * as vue from '@opentiny/vue-locale/vue3' -import glob from './glob' - -export const { use, t, i18n, initI18n, extend, zhCN, enUS, language } = vue - -export const globalization = glob(t) - -export const version = process.env.COMPONENT_VERSION - -export default { - use, - t, - i18n, - initI18n, - extend, - zhCN, - enUS, - language, - ...vue.default, - globalization -} diff --git a/template/runtime/demo.html b/template/runtime/demo.html deleted file mode 100644 index ae94e6606..000000000 --- a/template/runtime/demo.html +++ /dev/null @@ -1,284 +0,0 @@ -
    -

    Tag 标签组件

    - 标签一 - 标签二 - 标签三 - 标签四 - 标签五 -
    -
    -

    Alert 警告组件

    - - - - -
    -
    -

    FallMenu 瀑布菜单组件

    - -
    -
    -

    Layout 布局组件

    - - - -
    span 12
    -
    -
    - - -
    span 3
    -
    - -
    span 6
    -
    - -
    span 3
    -
    -
    - - -
    span 2
    -
    - -
    span 3
    -
    - -
    span 2
    -
    - -
    span 3
    -
    - -
    span 2
    -
    -
    -
    -
    -
    -

    Button 组件

    - 默认按钮 - 主要按钮 - 成功按钮 - 信息按钮 - 警告按钮 - 危险按钮 -
    -
    -

    Input 组件

    - -
    -
    - -
    -
    -

    Select 组件

    - - - - -
    -
    -

    DropTimes 组件

    - -
    -
    -

    DatePiker 组件

    - -
    -
    -

    Form 表单

    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 立即创建 - 取消 - - -
    -
    -

    Grid 组件

    - - - - - - - - - -
    -
    -

    Pager 组件

    - -
    -
    -

    Transfer 组件

    - -
    -
    -

    Tree 组件

    - -
    -
    -

    Loading 组件

    -
    测试
    -
    测试
    -
    -
    -

    Modal 组件

    - 确认提示框 -
    -
    -

    Icon 组件

    - - - - - -

    组件图标

    - - - - - - -
    -
    -

    bar

    - -
    -
    -

    candle

    - -
    -
    -

    funnel

    - -
    -
    -

    gauge

    - -
    -
    -

    graph

    - -
    -
    -

    heatmap

    - -
    -
    -

    histogram

    - -
    -
    -

    line

    - -
    -
    -

    pie

    - -
    -
    -

    radar

    - -
    -
    -

    ring

    - -
    -
    -

    sankey

    - -
    -
    -

    scatter

    - -
    -
    -

    sunburst

    - -
    -
    -

    tree

    - -
    diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 000000000..7bc486177 --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,3 @@ +{ + "extends": "./tsconfig.vue3.json" +} \ No newline at end of file diff --git a/tsconfig.vue2.7.json b/tsconfig.vue2.7.json new file mode 100644 index 000000000..8f2be0a59 --- /dev/null +++ b/tsconfig.vue2.7.json @@ -0,0 +1,53 @@ +{ + "extends": "@vue/tsconfig/tsconfig.web.json", + "compilerOptions": { + "noImplicitAny": false, + "baseUrl": ".", + "paths": { + "@opentiny/vue-autonavi-map": [ + "packages/vue/src/chart/autonavi-map" + ], + "@opentiny/vue-baidu-map": [ + "packages/vue/src/chart/baidu-map" + ], + "@opentiny/vue-chart-*": [ + "packages/vue/src/chart/chart-*" + ], + "@opentiny/vue-*": [ + "packages/vue-*", + "packages/vue/src/*" + ], + "@opentiny/vue-renderless*": [ + "packages/renderless/src*" + ], + "virtual:common/adapter/vue": [ + "packages/vue-common/src/adapter/vue2.7/index.ts" + ], + "virtual:locale/vue": [ + "packages/vue-locale/src/vue2.7/index.ts" + ] + }, + "types": [ + "node", + "vite/client" + ] + }, + "vueCompilerOptions": { + "target": 2.7, + "_hooks": [ + "./linting/vue-tsc-hook.js" + ] + }, + "include": [ + "packages/**/*.ts", + "packages/**/*.tsx", + "packages/**/*.vue", + "examples/vue2.7/shims-app.d.ts", + "examples/vue2.7/shims-vue.d.ts" + ], + "exclude": [ + "**/node_modules", + "**/dist*", + "**/*.md" + ] +} \ No newline at end of file diff --git a/tsconfig.vue2.json b/tsconfig.vue2.json new file mode 100644 index 000000000..62e705b08 --- /dev/null +++ b/tsconfig.vue2.json @@ -0,0 +1,53 @@ +{ + "extends": "@vue/tsconfig/tsconfig.web.json", + "compilerOptions": { + "noImplicitAny": false, + "baseUrl": ".", + "paths": { + "@opentiny/vue-autonavi-map": [ + "packages/vue/src/chart/autonavi-map" + ], + "@opentiny/vue-baidu-map": [ + "packages/vue/src/chart/baidu-map" + ], + "@opentiny/vue-chart-*": [ + "packages/vue/src/chart/chart-*" + ], + "@opentiny/vue-*": [ + "packages/vue-*", + "packages/vue/src/*" + ], + "@opentiny/vue-renderless*": [ + "packages/renderless/src*" + ], + "virtual:common/adapter/vue": [ + "packages/vue-common/src/adapter/vue2/index.ts" + ], + "virtual:locale/vue": [ + "packages/vue-locale/src/vue2/index.ts" + ] + }, + "types": [ + "node", + "vite/client" + ] + }, + "vueCompilerOptions": { + "target": 2, + "_hooks": [ + "./linting/vue-tsc-hook.js" + ] + }, + "include": [ + "packages/**/*.ts", + "packages/**/*.tsx", + "packages/**/*.vue", + "examples/vue2/shims-app.d.ts", + "examples/vue2/shims-vue.d.ts" + ], + "exclude": [ + "**/node_modules", + "**/dist*", + "**/*.md" + ] +} \ No newline at end of file diff --git a/tsconfig.vue3.json b/tsconfig.vue3.json new file mode 100644 index 000000000..a5b6612fe --- /dev/null +++ b/tsconfig.vue3.json @@ -0,0 +1,53 @@ +{ + "extends": "@vue/tsconfig/tsconfig.web.json", + "compilerOptions": { + "noImplicitAny": false, + "baseUrl": ".", + "paths": { + "@opentiny/vue-autonavi-map": [ + "packages/vue/src/chart/autonavi-map" + ], + "@opentiny/vue-baidu-map": [ + "packages/vue/src/chart/baidu-map" + ], + "@opentiny/vue-chart-*": [ + "packages/vue/src/chart/chart-*" + ], + "@opentiny/vue-*": [ + "packages/vue-*", + "packages/vue/src/*" + ], + "@opentiny/vue-renderless*": [ + "packages/renderless/src*" + ], + "virtual:common/adapter/vue": [ + "packages/vue-common/src/adapter/vue3/index.ts" + ], + "virtual:locale/vue": [ + "packages/vue-locale/src/vue3/index.ts" + ] + }, + "types": [ + "node", + "vite/client" + ] + }, + "vueCompilerOptions": { + "target": 3, + "_hooks": [ + "./linting/vue-tsc-hook.js" + ] + }, + "include": [ + "packages/**/*.ts", + "packages/**/*.tsx", + "packages/**/*.vue", + "examples/vue3/shims-app.d.ts", + "examples/vue3/shims-vue.d.ts" + ], + "exclude": [ + "**/node_modules", + "**/dist*", + "**/*.md" + ] +} \ No newline at end of file diff --git a/typings/action-menu/index.d.ts b/typings/action-menu/index.d.ts deleted file mode 100644 index 73fbf685d..000000000 --- a/typings/action-menu/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import ActionMenu from './src/index.vue'; -import '@opentiny/vue-theme/action-menu/index.css'; -export default ActionMenu; diff --git a/typings/action-menu/src/index.vue.d.ts b/typings/action-menu/src/index.vue.d.ts deleted file mode 100644 index 436fb6ac2..000000000 --- a/typings/action-menu/src/index.vue.d.ts +++ /dev/null @@ -1,79 +0,0 @@ -import '@opentiny/vue-theme/action-menu/index.css'; -declare const _default: import("vue").DefineComponent<{ - options: { - type: ArrayConstructor; - default: () => never[]; - }; - maxShowNum: { - type: NumberConstructor; - default: number; - }; - moreText: { - type: StringConstructor; - default: any; - }; - spacing: { - type: (StringConstructor | NumberConstructor)[]; - default: string; - }; - textField: { - type: StringConstructor; - default: string; - }; - popperClass: { - type: StringConstructor; - default: string; - }; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("moreClick" | "itemClick")[], "moreClick" | "itemClick", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly never[]; - }; - maxShowNum: { - type: NumberConstructor; - default: number; - }; - moreText: { - type: StringConstructor; - default: any; - }; - spacing: { - type: (StringConstructor | NumberConstructor)[]; - default: string; - }; - textField: { - type: StringConstructor; - default: string; - }; - popperClass: { - type: StringConstructor; - default: string; - }; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; -}>> & { - onMoreClick?: ((...args: any[]) => any) | undefined; - onItemClick?: ((...args: any[]) => any) | undefined; -}, { - options: unknown[]; - maxShowNum: number; - moreText: string; - spacing: string | number; - textField: string; - popperClass: string; - popperAppendToBody: boolean; -}>; -export default _default; diff --git a/typings/action-sheet/index.d.ts b/typings/action-sheet/index.d.ts deleted file mode 100644 index 05abf9ef2..000000000 --- a/typings/action-sheet/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import ActionSheet from './src/index.vue'; -export default ActionSheet; diff --git a/typings/action-sheet/src/index.vue.d.ts b/typings/action-sheet/src/index.vue.d.ts deleted file mode 100644 index 66f7e9bb5..000000000 --- a/typings/action-sheet/src/index.vue.d.ts +++ /dev/null @@ -1,42 +0,0 @@ -import '@opentiny/vue-theme-mobile/action-sheet/index.css'; -declare const _default: import("vue").DefineComponent<{ - menus: { - type: ArrayConstructor; - default: () => never[]; - }; - modelValue: (StringConstructor | NumberConstructor)[]; - visible: { - type: BooleanConstructor; - default: boolean; - }; - ellipsis: { - type: BooleanConstructor; - default: boolean; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly never[]; - }; - modelValue: (StringConstructor | NumberConstructor)[]; - visible: { - type: BooleanConstructor; - default: boolean; - }; - ellipsis: { - type: BooleanConstructor; - default: boolean; - }; -}>>, { - menus: unknown[]; - visible: boolean; - ellipsis: boolean; -}>; -export default _default; diff --git a/typings/alert/index.d.ts b/typings/alert/index.d.ts deleted file mode 100644 index e324faf18..000000000 --- a/typings/alert/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Alert from './src/index'; -export default Alert; diff --git a/typings/alert/src/index.d.ts b/typings/alert/src/index.d.ts deleted file mode 100644 index 42501377e..000000000 --- a/typings/alert/src/index.d.ts +++ /dev/null @@ -1,107 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - ICON_MAP: { - success: string; - error: string; - info: string; - warning: string; - }; - TITLE_MAP: { - success: string; - error: string; - info: string; - warning: string; - }; - }; - }; - icon: (ObjectConstructor | StringConstructor)[]; - type: { - type: StringConstructor; - default: string; - }; - size: { - type: StringConstructor; - default: string; - }; - description: { - type: StringConstructor; - default: string; - }; - title: { - type: StringConstructor; - }; - center: BooleanConstructor; - showIcon: { - type: BooleanConstructor; - default: boolean; - }; - closable: { - type: BooleanConstructor; - default: boolean; - }; - closeText: { - type: StringConstructor; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "close"[], "close", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - ICON_MAP: { - success: string; - error: string; - info: string; - warning: string; - }; - TITLE_MAP: { - success: string; - error: string; - info: string; - warning: string; - }; - }; - }; - icon: (ObjectConstructor | StringConstructor)[]; - type: { - type: StringConstructor; - default: string; - }; - size: { - type: StringConstructor; - default: string; - }; - description: { - type: StringConstructor; - default: string; - }; - title: { - type: StringConstructor; - }; - center: BooleanConstructor; - showIcon: { - type: BooleanConstructor; - default: boolean; - }; - closable: { - type: BooleanConstructor; - default: boolean; - }; - closeText: { - type: StringConstructor; - default: string; - }; -}>> & { - onClose?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - center: boolean; - type: string; - size: string; - description: string; - closable: boolean; - showIcon: boolean; - closeText: string; -}>; -export default _default; diff --git a/typings/alert/src/mobile.vue.d.ts b/typings/alert/src/mobile.vue.d.ts deleted file mode 100644 index 1f6d928f8..000000000 --- a/typings/alert/src/mobile.vue.d.ts +++ /dev/null @@ -1,20 +0,0 @@ -import '@opentiny/vue-theme-mobile/alert/index.css'; -declare const _default: { - props: string[]; - components: { - IconClose: any; - IconSuccess: any; - IconError: any; - IconHelp: any; - IconWarning: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/alert/src/pc.vue.d.ts b/typings/alert/src/pc.vue.d.ts deleted file mode 100644 index 2d7885243..000000000 --- a/typings/alert/src/pc.vue.d.ts +++ /dev/null @@ -1,20 +0,0 @@ -import '@opentiny/vue-theme/alert/index.css'; -declare const _default: { - props: string[]; - components: { - IconClose: any; - IconSuccess: any; - IconError: any; - IconHelp: any; - IconWarning: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/amount/index.d.ts b/typings/amount/index.d.ts deleted file mode 100644 index 3c9808658..000000000 --- a/typings/amount/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import Amount from './src/index.vue'; -import '@opentiny/vue-theme/amount/index.css'; -export default Amount; diff --git a/typings/amount/src/index.vue.d.ts b/typings/amount/src/index.vue.d.ts deleted file mode 100644 index 87573851b..000000000 --- a/typings/amount/src/index.vue.d.ts +++ /dev/null @@ -1,178 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - modelValue: { - type: (StringConstructor | NumberConstructor)[]; - }; - tabindex: { - type: StringConstructor; - default: string; - }; - size: StringConstructor; - placeholder: { - type: StringConstructor; - default: string; - }; - currency: { - type: StringConstructor; - default: string; - }; - date: (StringConstructor | DateConstructor)[]; - dateAllowEmpty: { - type: BooleanConstructor; - default: boolean; - }; - digits: { - type: NumberConstructor; - default: number; - }; - rounding: { - type: BooleanConstructor; - default: boolean; - }; - maxLen: { - type: NumberConstructor; - default: number; - }; - negative: { - type: BooleanConstructor; - default: boolean; - }; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - fetchCurrency: FunctionConstructor; - fields: ObjectConstructor; - popperClass: StringConstructor; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - format: ObjectConstructor; - type: { - type: StringConstructor; - default: string; - }; - holdZero: { - type: BooleanConstructor; - default: boolean; - }; - modelTruncation: { - type: BooleanConstructor; - default: boolean; - }; - strictInput: { - type: BooleanConstructor; - default: boolean; - }; - plugin: FunctionConstructor; - popUp: { - type: BooleanConstructor; - default: boolean; - }; - hideCurrency: { - type: BooleanConstructor; - default: boolean; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "change"[], "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onChange?: ((...args: any[]) => any) | undefined; -}, { - type: string; - tabindex: string; - placeholder: string; - currency: string; - dateAllowEmpty: boolean; - digits: number; - rounding: boolean; - maxLen: number; - negative: boolean; - disabled: boolean; - popperAppendToBody: boolean; - holdZero: boolean; - modelTruncation: boolean; - strictInput: boolean; - popUp: boolean; - hideCurrency: boolean; -}>; -export default _default; diff --git a/typings/area/index.d.ts b/typings/area/index.d.ts deleted file mode 100644 index 92e429844..000000000 --- a/typings/area/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import Area from './src/index.vue'; -import '@opentiny/vue-theme/area/index.css'; -export default Area; diff --git a/typings/area/src/index.vue.d.ts b/typings/area/src/index.vue.d.ts deleted file mode 100644 index 649ed175d..000000000 --- a/typings/area/src/index.vue.d.ts +++ /dev/null @@ -1,88 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - modelValue: {}; - placeholder: { - type: StringConstructor; - default: string; - }; - size: StringConstructor; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - props: { - type: ObjectConstructor; - default: () => { - label: string; - value: string; - }; - }; - fetchJcr: { - type: FunctionConstructor; - }; - fetchRegion: { - type: FunctionConstructor; - }; - fetchRep: { - type: FunctionConstructor; - }; - fetchOffice: { - type: FunctionConstructor; - }; - popperClass: StringConstructor; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change-region" | "change-rep" | "change-office")[], "change-region" | "change-rep" | "change-office", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - label: string; - value: string; - }; - }; - fetchJcr: { - type: FunctionConstructor; - }; - fetchRegion: { - type: FunctionConstructor; - }; - fetchRep: { - type: FunctionConstructor; - }; - fetchOffice: { - type: FunctionConstructor; - }; - popperClass: StringConstructor; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; -}>> & { - "onChange-region"?: ((...args: any[]) => any) | undefined; - "onChange-rep"?: ((...args: any[]) => any) | undefined; - "onChange-office"?: ((...args: any[]) => any) | undefined; -}, { - props: Record; - placeholder: string; - disabled: boolean; - popperAppendToBody: boolean; -}>; -export default _default; diff --git a/typings/autocomplete/index.d.ts b/typings/autocomplete/index.d.ts deleted file mode 100644 index 38de94c32..000000000 --- a/typings/autocomplete/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Autocomplete from './src/index'; -import '@opentiny/vue-theme/autocomplete/index.css'; -export default Autocomplete; diff --git a/typings/autocomplete/src/index.d.ts b/typings/autocomplete/src/index.d.ts deleted file mode 100644 index d036d78a5..000000000 --- a/typings/autocomplete/src/index.d.ts +++ /dev/null @@ -1,129 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - WARP_CLS: string; - ITEM_CLS: string; - }; - }; - autofocus: BooleanConstructor; - clearable: { - type: BooleanConstructor; - default: () => boolean; - }; - customItem: StringConstructor; - debounce: { - type: NumberConstructor; - default: () => number; - }; - disabled: BooleanConstructor; - fetchSuggestions: FunctionConstructor; - hideLoading: BooleanConstructor; - highlightFirstItem: { - type: BooleanConstructor; - default: () => boolean; - }; - label: StringConstructor; - maxlength: NumberConstructor; - minlength: NumberConstructor; - modelValue: StringConstructor; - name: StringConstructor; - placeholder: StringConstructor; - placement: { - type: StringConstructor; - default: () => string; - }; - popperAppendToBody: { - type: BooleanConstructor; - default: () => boolean; - }; - popperClass: StringConstructor; - popperOptions: ObjectConstructor; - prefixIcon: (ObjectConstructor | StringConstructor)[]; - selectWhenUnmatched: { - type: BooleanConstructor; - default: () => boolean; - }; - size: StringConstructor; - suffixIcon: (ObjectConstructor | StringConstructor)[]; - triggerOnFocus: { - type: BooleanConstructor; - default: () => boolean; - }; - valueKey: { - type: StringConstructor; - default: () => string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "select"[], "select", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - WARP_CLS: string; - ITEM_CLS: string; - }; - }; - autofocus: BooleanConstructor; - clearable: { - type: BooleanConstructor; - default: () => boolean; - }; - customItem: StringConstructor; - debounce: { - type: NumberConstructor; - default: () => number; - }; - disabled: BooleanConstructor; - fetchSuggestions: FunctionConstructor; - hideLoading: BooleanConstructor; - highlightFirstItem: { - type: BooleanConstructor; - default: () => boolean; - }; - label: StringConstructor; - maxlength: NumberConstructor; - minlength: NumberConstructor; - modelValue: StringConstructor; - name: StringConstructor; - placeholder: StringConstructor; - placement: { - type: StringConstructor; - default: () => string; - }; - popperAppendToBody: { - type: BooleanConstructor; - default: () => boolean; - }; - popperClass: StringConstructor; - popperOptions: ObjectConstructor; - prefixIcon: (ObjectConstructor | StringConstructor)[]; - selectWhenUnmatched: { - type: BooleanConstructor; - default: () => boolean; - }; - size: StringConstructor; - suffixIcon: (ObjectConstructor | StringConstructor)[]; - triggerOnFocus: { - type: BooleanConstructor; - default: () => boolean; - }; - valueKey: { - type: StringConstructor; - default: () => string; - }; -}>> & { - onSelect?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - disabled: boolean; - popperAppendToBody: boolean; - valueKey: string; - clearable: boolean; - autofocus: boolean; - triggerOnFocus: boolean; - selectWhenUnmatched: boolean; - debounce: number; - placement: string; - hideLoading: boolean; - highlightFirstItem: boolean; -}>; -export default _default; diff --git a/typings/autocomplete/src/pc.vue.d.ts b/typings/autocomplete/src/pc.vue.d.ts deleted file mode 100644 index 4bd3626cf..000000000 --- a/typings/autocomplete/src/pc.vue.d.ts +++ /dev/null @@ -1,18 +0,0 @@ -declare const _default: { - components: { - TinyInput: any; - TinyScrollbar: any; - IconLoading: any; - }; - directives: any; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/avatar/index.d.ts b/typings/avatar/index.d.ts deleted file mode 100644 index dc868bae9..000000000 --- a/typings/avatar/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Avatar from './src/index.vue'; -import '@opentiny/vue-theme-mobile/avatar/index.css'; -export default Avatar; diff --git a/typings/avatar/src/index.vue.d.ts b/typings/avatar/src/index.vue.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/avatar/src/index.vue.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/badge/index.d.ts b/typings/badge/index.d.ts deleted file mode 100644 index c631c235b..000000000 --- a/typings/badge/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Badge from './src/index'; -export default Badge; diff --git a/typings/badge/src/index.d.ts b/typings/badge/src/index.d.ts deleted file mode 100644 index 746e5bab0..000000000 --- a/typings/badge/src/index.d.ts +++ /dev/null @@ -1,57 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - isDot: { - type: BooleanConstructor; - default: boolean; - }; - isFixed: { - type: BooleanConstructor; - default: boolean; - }; - isMini: { - type: BooleanConstructor; - default: boolean; - }; - max: NumberConstructor; - value: (StringConstructor | NumberConstructor)[]; - modelValue: (StringConstructor | NumberConstructor)[]; - href: StringConstructor; - target: StringConstructor; - hidden: { - type: BooleanConstructor; - default: boolean; - }; - type: { - type: StringConstructor; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - isDot: boolean; - isFixed: boolean; - isMini: boolean; - hidden: boolean; -}>; -export default _default; diff --git a/typings/badge/src/mobile.vue.d.ts b/typings/badge/src/mobile.vue.d.ts deleted file mode 100644 index 0d412fab6..000000000 --- a/typings/badge/src/mobile.vue.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -import '@opentiny/vue-theme-mobile/badge/index.css'; -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/badge/src/pc.vue.d.ts b/typings/badge/src/pc.vue.d.ts deleted file mode 100644 index d8cc394b2..000000000 --- a/typings/badge/src/pc.vue.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -import '@opentiny/vue-theme/badge/index.css'; -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/breadcrumb-item/index.d.ts b/typings/breadcrumb-item/index.d.ts deleted file mode 100644 index 574942233..000000000 --- a/typings/breadcrumb-item/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import BreadcrumbItem from './src/index'; -import '@opentiny/vue-theme/breadcrumb-item/index.css'; -export default BreadcrumbItem; diff --git a/typings/breadcrumb-item/src/index.d.ts b/typings/breadcrumb-item/src/index.d.ts deleted file mode 100644 index d1c693148..000000000 --- a/typings/breadcrumb-item/src/index.d.ts +++ /dev/null @@ -1,10 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - to: {}; - replace: BooleanConstructor; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - replace: boolean; -}>; -export default _default; diff --git a/typings/breadcrumb-item/src/pc.vue.d.ts b/typings/breadcrumb-item/src/pc.vue.d.ts deleted file mode 100644 index ed730ed70..000000000 --- a/typings/breadcrumb-item/src/pc.vue.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -declare const _default: { - props: string[]; - inject: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/breadcrumb/index.d.ts b/typings/breadcrumb/index.d.ts deleted file mode 100644 index 4164231af..000000000 --- a/typings/breadcrumb/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Breadcrumb from './src/index'; -import '@opentiny/vue-theme/breadcrumb/index.css'; -export default Breadcrumb; diff --git a/typings/breadcrumb/src/index.d.ts b/typings/breadcrumb/src/index.d.ts deleted file mode 100644 index b4ea4e1ae..000000000 --- a/typings/breadcrumb/src/index.d.ts +++ /dev/null @@ -1,20 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - separator: { - type: StringConstructor; - default: string; - }; - separatorIcon: { - type: ObjectConstructor; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - separator: string; -}>; -export default _default; diff --git a/typings/breadcrumb/src/pc.vue.d.ts b/typings/breadcrumb/src/pc.vue.d.ts deleted file mode 100644 index da430c5ef..000000000 --- a/typings/breadcrumb/src/pc.vue.d.ts +++ /dev/null @@ -1,26 +0,0 @@ -declare const _default: { - props: string[]; - provide(): { - breadcrumb: { - props: string[]; - provide(): any; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - }; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/bulletin-board/index.d.ts b/typings/bulletin-board/index.d.ts deleted file mode 100644 index 368155547..000000000 --- a/typings/bulletin-board/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import BulletinBoard from './src/index'; -import '@opentiny/vue-theme/bulletin-board/index.css'; -export default BulletinBoard; diff --git a/typings/bulletin-board/src/index.d.ts b/typings/bulletin-board/src/index.d.ts deleted file mode 100644 index ce7f22510..000000000 --- a/typings/bulletin-board/src/index.d.ts +++ /dev/null @@ -1,52 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - title: StringConstructor; - icon: (ObjectConstructor | StringConstructor)[]; - showMore: { - type: BooleanConstructor; - default: boolean; - }; - moreLink: { - type: ObjectConstructor; - default: () => void; - }; - tabTitle: { - type: ArrayConstructor; - required: true; - }; - activeName: { - type: StringConstructor; - default: string; - }; - data: { - type: ArrayConstructor; - required: true; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly void; - }; - tabTitle: { - type: ArrayConstructor; - required: true; - }; - activeName: { - type: StringConstructor; - default: string; - }; - data: { - type: ArrayConstructor; - required: true; - }; -}>>, { - showMore: boolean; - moreLink: Record; - activeName: string; -}>; -export default _default; diff --git a/typings/bulletin-board/src/pc.vue.d.ts b/typings/bulletin-board/src/pc.vue.d.ts deleted file mode 100644 index 54ea54168..000000000 --- a/typings/bulletin-board/src/pc.vue.d.ts +++ /dev/null @@ -1,17 +0,0 @@ -declare const _default: { - props: string[]; - components: { - Tabs: any; - TabItem: any; - IconChevronRight: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/button-group/index.d.ts b/typings/button-group/index.d.ts deleted file mode 100644 index a8cbac2ec..000000000 --- a/typings/button-group/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import ButtonGroup from './src/index'; -import '@opentiny/vue-theme/button-group/index.css'; -export default ButtonGroup; diff --git a/typings/button-group/src/index.d.ts b/typings/button-group/src/index.d.ts deleted file mode 100644 index d8e74c0b5..000000000 --- a/typings/button-group/src/index.d.ts +++ /dev/null @@ -1,48 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - size: StringConstructor; - data: ArrayConstructor; - plain: BooleanConstructor; - modelValue: (StringConstructor | NumberConstructor)[]; - disabled: BooleanConstructor; - valueField: { - type: StringConstructor; - default: string; - }; - textField: { - type: StringConstructor; - default: string; - }; - showMore: NumberConstructor; - showEdit: { - type: BooleanConstructor; - default: boolean; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "edit"[], "edit", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onEdit?: ((...args: any[]) => any) | undefined; -}, { - disabled: boolean; - plain: boolean; - valueField: string; - textField: string; - showEdit: boolean; -}>; -export default _default; diff --git a/typings/button-group/src/pc.vue.d.ts b/typings/button-group/src/pc.vue.d.ts deleted file mode 100644 index f8c08983f..000000000 --- a/typings/button-group/src/pc.vue.d.ts +++ /dev/null @@ -1,18 +0,0 @@ -declare const _default: { - props: string[]; - components: { - TinyPopover: any; - TinyButton: any; - IconPopup: any; - IconWriting: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/button/index.d.ts b/typings/button/index.d.ts deleted file mode 100644 index 68c584d36..000000000 --- a/typings/button/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Button from './src/index'; -export default Button; diff --git a/typings/button/src/index.d.ts b/typings/button/src/index.d.ts deleted file mode 100644 index f416947c5..000000000 --- a/typings/button/src/index.d.ts +++ /dev/null @@ -1,81 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - type: { - type: StringConstructor; - default: string; - }; - tabindex: { - type: StringConstructor; - default: string; - }; - icon: { - type: (ObjectConstructor | StringConstructor)[]; - default: string; - }; - text: { - type: StringConstructor; - default: string; - }; - resetTime: { - type: NumberConstructor; - default: number; - }; - nativeType: { - type: StringConstructor; - default: string; - }; - size: StringConstructor; - round: BooleanConstructor; - plain: BooleanConstructor; - circle: BooleanConstructor; - loading: BooleanConstructor; - disabled: BooleanConstructor; - autofocus: BooleanConstructor; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "click"[], "click", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onClick?: ((...args: any[]) => any) | undefined; -}, { - type: string; - circle: boolean; - text: string; - icon: string | Record; - tabindex: string; - disabled: boolean; - autofocus: boolean; - resetTime: number; - nativeType: string; - loading: boolean; - plain: boolean; - round: boolean; -}>; -export default _default; diff --git a/typings/button/src/mobile.vue.d.ts b/typings/button/src/mobile.vue.d.ts deleted file mode 100644 index e0dbf28cc..000000000 --- a/typings/button/src/mobile.vue.d.ts +++ /dev/null @@ -1,18 +0,0 @@ -import '@opentiny/vue-theme-mobile/button/index.css'; -declare const _default: { - inheritAttrs: boolean; - emits: string[]; - props: string[]; - components: { - IconLoading: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/button/src/pc.vue.d.ts b/typings/button/src/pc.vue.d.ts deleted file mode 100644 index 0628253d7..000000000 --- a/typings/button/src/pc.vue.d.ts +++ /dev/null @@ -1,17 +0,0 @@ -import '@opentiny/vue-theme/button/index.css'; -declare const _default: { - emits: string[]; - props: string[]; - components: { - IconLoading: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/calendar/index.d.ts b/typings/calendar/index.d.ts deleted file mode 100644 index 7b53acc9a..000000000 --- a/typings/calendar/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Calendar from './src/index'; -import '@opentiny/vue-theme/calendar/index.css'; -export default Calendar; diff --git a/typings/calendar/src/index.d.ts b/typings/calendar/src/index.d.ts deleted file mode 100644 index 3099ed205..000000000 --- a/typings/calendar/src/index.d.ts +++ /dev/null @@ -1,75 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - /** - * @property {String} [mode='month'] - 显示模式,month|year 可选 - */ - mode: { - type: StringConstructor; - default: string; - }; - /** - * @property {Number} [year=getFullYear()] - 指定年份,默认今年 - */ - year: { - type: NumberConstructor; - default(): number; - }; - /** - * @property {Number} [month=getMonth()] - 指定月份,默认当月 - */ - month: { - type: NumberConstructor; - default(): number; - }; - /** - * @property {Array} events - 事件列表 - * @example - * [{ time: 1534297845236, title: '消息', content: '这是一条消息', type: 'primary' }, - * { time: 1534297845236, title: '消息', content: '还有', type: 'info' }] - * type 类型: warning、error、info、success - */ - events: ArrayConstructor; - /** - * @property {Boolean} [showSelected=false] - 显示选中的日期 - */ - showSelected: BooleanConstructor; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - mode: string; - year: number; - month: number; - showSelected: boolean; -}>; -export default _default; diff --git a/typings/calendar/src/pc.vue.d.ts b/typings/calendar/src/pc.vue.d.ts deleted file mode 100644 index fdca22e3e..000000000 --- a/typings/calendar/src/pc.vue.d.ts +++ /dev/null @@ -1,19 +0,0 @@ -declare const _default: { - components: { - Tooltip: any; - Popover: any; - Button: any; - IconChevronUp: any; - IconChevronDown: any; - }; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/card-template/index.d.ts b/typings/card-template/index.d.ts deleted file mode 100644 index dd7b05bbf..000000000 --- a/typings/card-template/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CardTemplate from './src/index'; -import '@opentiny/vue-theme/card-template/index.css'; -export default CardTemplate; diff --git a/typings/card-template/src/index.d.ts b/typings/card-template/src/index.d.ts deleted file mode 100644 index 5bc69be9b..000000000 --- a/typings/card-template/src/index.d.ts +++ /dev/null @@ -1,33 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - MOREICON: string; - }; - }; - tools: ArrayConstructor; - header: StringConstructor; - bodyStyle: ObjectConstructor; - headerLine: { - type: BooleanConstructor; - default: boolean; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - MOREICON: string; - }; - }; - tools: ArrayConstructor; - header: StringConstructor; - bodyStyle: ObjectConstructor; - headerLine: { - type: BooleanConstructor; - default: boolean; - }; -}>>, { - _constants: Record; - headerLine: boolean; -}>; -export default _default; diff --git a/typings/card-template/src/pc.vue.d.ts b/typings/card-template/src/pc.vue.d.ts deleted file mode 100644 index 9ad5fa624..000000000 --- a/typings/card-template/src/pc.vue.d.ts +++ /dev/null @@ -1,19 +0,0 @@ -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - components: { - IconEdit: any; - IconHelp: any; - IconMore: any; - IconClose: any; - IconExcel: any; - }; -}; -export default _default; diff --git a/typings/carousel-item/index.d.ts b/typings/carousel-item/index.d.ts deleted file mode 100644 index 33ee38ebd..000000000 --- a/typings/carousel-item/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CarouselItem from './src/index'; -import '@opentiny/vue-theme/carousel-item/index.css'; -export default CarouselItem; diff --git a/typings/carousel-item/src/index.d.ts b/typings/carousel-item/src/index.d.ts deleted file mode 100644 index 07cc99ff3..000000000 --- a/typings/carousel-item/src/index.d.ts +++ /dev/null @@ -1,35 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - TYPE_CARD: string; - TYPE_VERTICAL: string; - CARD_SCALE: number; - }; - }; - name: StringConstructor; - title: StringConstructor; - label: { - type: (StringConstructor | NumberConstructor)[]; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - TYPE_CARD: string; - TYPE_VERTICAL: string; - CARD_SCALE: number; - }; - }; - name: StringConstructor; - title: StringConstructor; - label: { - type: (StringConstructor | NumberConstructor)[]; - default: string; - }; -}>>, { - _constants: Record; - label: string | number; -}>; -export default _default; diff --git a/typings/carousel-item/src/pc.vue.d.ts b/typings/carousel-item/src/pc.vue.d.ts deleted file mode 100644 index f5d461606..000000000 --- a/typings/carousel-item/src/pc.vue.d.ts +++ /dev/null @@ -1,12 +0,0 @@ -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/carousel/index.d.ts b/typings/carousel/index.d.ts deleted file mode 100644 index 34c8bd114..000000000 --- a/typings/carousel/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Carousel from './src/index'; -import '@opentiny/vue-theme/carousel/index.css'; -export default Carousel; diff --git a/typings/carousel/src/index.d.ts b/typings/carousel/src/index.d.ts deleted file mode 100644 index 5c0e44d94..000000000 --- a/typings/carousel/src/index.d.ts +++ /dev/null @@ -1,93 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - CHILD_NAME: string; - }; - }; - autoplay: { - type: BooleanConstructor; - default: boolean; - }; - initialIndex: { - type: NumberConstructor; - default: number; - }; - height: StringConstructor; - trigger: { - type: StringConstructor; - default: string; - }; - interval: { - type: NumberConstructor; - default: number; - }; - loop: { - type: BooleanConstructor; - default: boolean; - }; - indicatorPosition: StringConstructor; - arrow: { - type: StringConstructor; - default: string; - }; - type: { - type: StringConstructor; - }; - showTitle: { - type: BooleanConstructor; - default: boolean; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "change"[], "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - CHILD_NAME: string; - }; - }; - autoplay: { - type: BooleanConstructor; - default: boolean; - }; - initialIndex: { - type: NumberConstructor; - default: number; - }; - height: StringConstructor; - trigger: { - type: StringConstructor; - default: string; - }; - interval: { - type: NumberConstructor; - default: number; - }; - loop: { - type: BooleanConstructor; - default: boolean; - }; - indicatorPosition: StringConstructor; - arrow: { - type: StringConstructor; - default: string; - }; - type: { - type: StringConstructor; - }; - showTitle: { - type: BooleanConstructor; - default: boolean; - }; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - initialIndex: number; - trigger: string; - autoplay: boolean; - interval: number; - arrow: string; - showTitle: boolean; - loop: boolean; -}>; -export default _default; diff --git a/typings/carousel/src/pc.vue.d.ts b/typings/carousel/src/pc.vue.d.ts deleted file mode 100644 index 6b20dc47d..000000000 --- a/typings/carousel/src/pc.vue.d.ts +++ /dev/null @@ -1,16 +0,0 @@ -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - components: { - IconChevronLeft: any; - IconChevronRight: any; - }; -}; -export default _default; diff --git a/typings/cascader-menu/index.d.ts b/typings/cascader-menu/index.d.ts deleted file mode 100644 index 156fbde0e..000000000 --- a/typings/cascader-menu/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CascaderMenu from './src/index'; -import '@opentiny/vue-theme/cascader-menu/index.css'; -export default CascaderMenu; diff --git a/typings/cascader-menu/src/index.d.ts b/typings/cascader-menu/src/index.d.ts deleted file mode 100644 index 906c6753c..000000000 --- a/typings/cascader-menu/src/index.d.ts +++ /dev/null @@ -1,25 +0,0 @@ -declare const _default: { - name: string; - components: { - TinyScrollbar: any; - CascaderNode: any; - }; - props: { - nodes: { - type: ArrayConstructor; - required: boolean; - }; - index: NumberConstructor; - }; - inject: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - render(): any; -}; -export default _default; diff --git a/typings/cascader-node/index.d.ts b/typings/cascader-node/index.d.ts deleted file mode 100644 index 53e59520b..000000000 --- a/typings/cascader-node/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CascaderNode from './src/index.vue'; -import '@opentiny/vue-theme/cascader-node/index.css'; -export default CascaderNode; diff --git a/typings/cascader-node/src/index.vue.d.ts b/typings/cascader-node/src/index.vue.d.ts deleted file mode 100644 index dcf23c109..000000000 --- a/typings/cascader-node/src/index.vue.d.ts +++ /dev/null @@ -1,25 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - node: { - required: true; - }; - nodeId: StringConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "update:modelValue" | "expand-change" | "expand" | "active-item-change")[], "change" | "update:modelValue" | "expand-change" | "expand" | "active-item-change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onChange?: ((...args: any[]) => any) | undefined; - "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined; - "onExpand-change"?: ((...args: any[]) => any) | undefined; - onExpand?: ((...args: any[]) => any) | undefined; - "onActive-item-change"?: ((...args: any[]) => any) | undefined; -}, {}>; -export default _default; diff --git a/typings/cascader-panel/index.d.ts b/typings/cascader-panel/index.d.ts deleted file mode 100644 index 09fc6cb79..000000000 --- a/typings/cascader-panel/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CascaderPanel from './src/index.vue'; -import '@opentiny/vue-theme/cascader-panel/index.css'; -export default CascaderPanel; diff --git a/typings/cascader-panel/src/index.vue.d.ts b/typings/cascader-panel/src/index.vue.d.ts deleted file mode 100644 index 2f671a82a..000000000 --- a/typings/cascader-panel/src/index.vue.d.ts +++ /dev/null @@ -1,32 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - modelValue: {}; - options: ArrayConstructor; - props: ObjectConstructor; - border: { - type: BooleanConstructor; - default: boolean; - }; - renderLabel: FunctionConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "expand-change")[], "change" | "expand-change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onChange?: ((...args: any[]) => any) | undefined; - "onExpand-change"?: ((...args: any[]) => any) | undefined; -}, { - border: boolean; -}>; -export default _default; diff --git a/typings/cascader/index.d.ts b/typings/cascader/index.d.ts deleted file mode 100644 index 4d4354a7d..000000000 --- a/typings/cascader/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Cascader from './src/index'; -import '@opentiny/vue-theme/cascader/index.css'; -export default Cascader; diff --git a/typings/cascader/src/index.d.ts b/typings/cascader/src/index.d.ts deleted file mode 100644 index df47901af..000000000 --- a/typings/cascader/src/index.d.ts +++ /dev/null @@ -1,118 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - placeholder: string; - COMPONENT_NAME: { - FormItem: string; - }; - EVENT_NAME: { - FormBlur: string; - }; - }; - }; - autoSize: BooleanConstructor; - beforeFilter: { - type: FunctionConstructor; - default: () => () => void; - }; - clearable: BooleanConstructor; - collapseTags: BooleanConstructor; - debounce: { - type: NumberConstructor; - default: number; - }; - disabled: BooleanConstructor; - filterMethod: FunctionConstructor; - filterable: BooleanConstructor; - modelValue: {}; - options: ArrayConstructor; - placeholder: { - type: StringConstructor; - default: string; - }; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - popperClass: StringConstructor; - showAllLevels: { - type: BooleanConstructor; - default: boolean; - }; - props: ObjectConstructor; - separator: { - type: StringConstructor; - default: string; - }; - size: StringConstructor; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "focus" | "blur" | "visible-change" | "expand-change" | "remove-tag")[], "change" | "focus" | "blur" | "visible-change" | "expand-change" | "remove-tag", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - placeholder: string; - COMPONENT_NAME: { - FormItem: string; - }; - EVENT_NAME: { - FormBlur: string; - }; - }; - }; - autoSize: BooleanConstructor; - beforeFilter: { - type: FunctionConstructor; - default: () => () => void; - }; - clearable: BooleanConstructor; - collapseTags: BooleanConstructor; - debounce: { - type: NumberConstructor; - default: number; - }; - disabled: BooleanConstructor; - filterMethod: FunctionConstructor; - filterable: BooleanConstructor; - modelValue: {}; - options: ArrayConstructor; - placeholder: { - type: StringConstructor; - default: string; - }; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - popperClass: StringConstructor; - props: ObjectConstructor; - showAllLevels: { - type: BooleanConstructor; - default: boolean; - }; - separator: { - type: StringConstructor; - default: string; - }; - size: StringConstructor; -}>> & { - onFocus?: ((...args: any[]) => any) | undefined; - onBlur?: ((...args: any[]) => any) | undefined; - onChange?: ((...args: any[]) => any) | undefined; - "onVisible-change"?: ((...args: any[]) => any) | undefined; - "onExpand-change"?: ((...args: any[]) => any) | undefined; - "onRemove-tag"?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - placeholder: string; - disabled: boolean; - popperAppendToBody: boolean; - clearable: boolean; - debounce: number; - separator: string; - filterable: boolean; - showAllLevels: boolean; - collapseTags: boolean; - beforeFilter: Function; - autoSize: boolean; -}>; -export default _default; diff --git a/typings/cascader/src/pc.vue.d.ts b/typings/cascader/src/pc.vue.d.ts deleted file mode 100644 index c5e965c7b..000000000 --- a/typings/cascader/src/pc.vue.d.ts +++ /dev/null @@ -1,54 +0,0 @@ -declare const _default: { - props: string[]; - directives: { - Clickoutside: any; - }; - inheritAttrs: boolean; - provide(): { - cascaderRoot: { - props: string[]; - directives: { - Clickoutside: any; - }; - inheritAttrs: boolean; - provide(): any; - components: { - TinyInput: any; - TinyTag: any; - TinyScrollbar: any; - TinyCascaderPanel: any; - IconClose: any; - IconChevronDown: any; - IconChevronUp: any; - IconYes: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - }; - }; - components: { - TinyInput: any; - TinyTag: any; - TinyScrollbar: any; - TinyCascaderPanel: any; - IconClose: any; - IconChevronDown: any; - IconChevronUp: any; - IconYes: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/chart/autonavi-map/index.d.ts b/typings/chart/autonavi-map/index.d.ts deleted file mode 100644 index 26c0adf1a..000000000 --- a/typings/chart/autonavi-map/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import AMap from './src/index.js'; -export default AMap; diff --git a/typings/chart/autonavi-map/src/AMapView.d.ts b/typings/chart/autonavi-map/src/AMapView.d.ts deleted file mode 100644 index 119211f16..000000000 --- a/typings/chart/autonavi-map/src/AMapView.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import * as echarts from 'echarts'; -declare const _default: echarts.ChartView; -export default _default; diff --git a/typings/chart/autonavi-map/src/amap.d.ts b/typings/chart/autonavi-map/src/amap.d.ts deleted file mode 100644 index 8c3192509..000000000 --- a/typings/chart/autonavi-map/src/amap.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import './AMapModel.js'; -import './AMapView.js'; diff --git a/typings/chart/autonavi-map/src/index.d.ts b/typings/chart/autonavi-map/src/index.d.ts deleted file mode 100644 index 572e11a3b..000000000 --- a/typings/chart/autonavi-map/src/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import './amap'; -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/baidu-map/index.d.ts b/typings/chart/baidu-map/index.d.ts deleted file mode 100644 index 66581ce66..000000000 --- a/typings/chart/baidu-map/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import BMap from './src/index.js'; -export default BMap; diff --git a/typings/chart/baidu-map/src/index.d.ts b/typings/chart/baidu-map/src/index.d.ts deleted file mode 100644 index f7abcda8f..000000000 --- a/typings/chart/baidu-map/src/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import 'echarts/extension/bmap/bmap'; -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-bar/index.d.ts b/typings/chart/chart-bar/index.d.ts deleted file mode 100644 index 6ae4814d6..000000000 --- a/typings/chart/chart-bar/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import Bar from './src/index.js'; -import { histogram, bar } from '@opentiny/vue-renderless/chart-bar/index'; -export { histogram, bar }; -export default Bar; diff --git a/typings/chart/chart-bar/src/index.d.ts b/typings/chart/chart-bar/src/index.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/chart/chart-bar/src/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-boxplot/index.d.ts b/typings/chart/chart-boxplot/index.d.ts deleted file mode 100644 index cd18d8f07..000000000 --- a/typings/chart/chart-boxplot/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import Boxplot from './src/index.js'; -export default Boxplot; diff --git a/typings/chart/chart-boxplot/src/index.d.ts b/typings/chart/chart-boxplot/src/index.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/chart/chart-boxplot/src/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-candle/index.d.ts b/typings/chart/chart-candle/index.d.ts deleted file mode 100644 index 1f3a91533..000000000 --- a/typings/chart/chart-candle/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import Candle from './src/index.js'; -export default Candle; diff --git a/typings/chart/chart-candle/src/index.d.ts b/typings/chart/chart-candle/src/index.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/chart/chart-candle/src/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-core/index.d.ts b/typings/chart/chart-core/index.d.ts deleted file mode 100644 index 657463c04..000000000 --- a/typings/chart/chart-core/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import Core from './src/index.vue'; -import '@opentiny/vue-theme/chart-core/index.css'; -export default Core; diff --git a/typings/chart/chart-core/src/index.vue.d.ts b/typings/chart/chart-core/src/index.vue.d.ts deleted file mode 100644 index 92c57dbc6..000000000 --- a/typings/chart/chart-core/src/index.vue.d.ts +++ /dev/null @@ -1,266 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - afterConfig: { - type: FunctionConstructor; - }; - afterSetOption: { - type: FunctionConstructor; - }; - afterSetOptionOnce: { - type: FunctionConstructor; - }; - animation: ObjectConstructor; - axisPointer: (ObjectConstructor | ArrayConstructor)[]; - backgroundColor: (ObjectConstructor | StringConstructor)[]; - beforeConfig: { - type: FunctionConstructor; - }; - brush: (ObjectConstructor | ArrayConstructor)[]; - cancelResizeCheck: BooleanConstructor; - changeDelay: { - type: NumberConstructor; - default: number; - }; - colors: { - type: ArrayConstructor; - }; - data: { - type: (ObjectConstructor | ArrayConstructor)[]; - default(): {}; - }; - dataEmpty: BooleanConstructor; - dataZoom: { - type: (ObjectConstructor | ArrayConstructor)[]; - }; - events: { - type: ObjectConstructor; - }; - extend: ObjectConstructor; - geo: (ObjectConstructor | ArrayConstructor)[]; - graphic: (ObjectConstructor | ArrayConstructor)[]; - grid: { - type: (ObjectConstructor | ArrayConstructor)[]; - }; - height: { - type: StringConstructor; - default: string; - }; - initOptions: { - type: ObjectConstructor; - default(): {}; - }; - judgeWidth: { - type: BooleanConstructor; - default: boolean; - }; - legend: (ObjectConstructor | ArrayConstructor)[]; - legendPosition: { - type: StringConstructor; - }; - legendVisible: { - type: BooleanConstructor; - default: boolean; - }; - loading: BooleanConstructor; - markArea: { - type: ObjectConstructor; - }; - markLine: { - type: ObjectConstructor; - }; - markPoint: { - type: ObjectConstructor; - }; - notSetUnchange: ArrayConstructor; - radar: ObjectConstructor; - resizeDelay: { - type: NumberConstructor; - default: number; - }; - resizeable: { - type: BooleanConstructor; - default: boolean; - }; - series: (ObjectConstructor | ArrayConstructor)[]; - setOptionOpts: { - type: (ObjectConstructor | BooleanConstructor)[]; - default: boolean; - }; - settings: { - type: ObjectConstructor; - default(): {}; - }; - textStyle: (ObjectConstructor | ArrayConstructor)[]; - theme: ObjectConstructor; - themeName: (ObjectConstructor | StringConstructor)[]; - timeline: (ObjectConstructor | ArrayConstructor)[]; - title: (ObjectConstructor | ArrayConstructor)[]; - toolbox: { - type: (ObjectConstructor | ArrayConstructor)[]; - }; - tooltip: ObjectConstructor; - tooltipFormatter: { - type: FunctionConstructor; - }; - tooltipVisible: { - type: BooleanConstructor; - default: boolean; - }; - visualMap: { - type: (ObjectConstructor | ArrayConstructor)[]; - }; - width: { - type: StringConstructor; - default: string; - }; - widthChangeDelay: { - type: NumberConstructor; - default: number; - }; - xAxis: (ObjectConstructor | ArrayConstructor)[]; - yAxis: (ObjectConstructor | ArrayConstructor)[]; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - data: Record | unknown[]; - width: string; - height: string; - loading: boolean; - cancelResizeCheck: boolean; - changeDelay: number; - dataEmpty: boolean; - initOptions: Record; - judgeWidth: boolean; - legendVisible: boolean; - resizeDelay: number; - resizeable: boolean; - setOptionOpts: boolean | Record; - settings: Record; - tooltipVisible: boolean; - widthChangeDelay: number; -}>; -export default _default; diff --git a/typings/chart/chart-funnel/index.d.ts b/typings/chart/chart-funnel/index.d.ts deleted file mode 100644 index 6323c9c4a..000000000 --- a/typings/chart/chart-funnel/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import Funnel from './src/index.js'; -import { funnel } from '@opentiny/vue-renderless/chart-funnel/index'; -export { funnel }; -export default Funnel; diff --git a/typings/chart/chart-funnel/src/index.d.ts b/typings/chart/chart-funnel/src/index.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/chart/chart-funnel/src/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-gauge/index.d.ts b/typings/chart/chart-gauge/index.d.ts deleted file mode 100644 index ec62f0311..000000000 --- a/typings/chart/chart-gauge/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import Gauge from './src/index.vue'; -export default Gauge; diff --git a/typings/chart/chart-gauge/src/index.vue.d.ts b/typings/chart/chart-gauge/src/index.vue.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/chart/chart-gauge/src/index.vue.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-graph/index.d.ts b/typings/chart/chart-graph/index.d.ts deleted file mode 100644 index 112188077..000000000 --- a/typings/chart/chart-graph/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import Graph from './src/index.js'; -export default Graph; diff --git a/typings/chart/chart-graph/src/index.d.ts b/typings/chart/chart-graph/src/index.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/chart/chart-graph/src/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-heatmap/index.d.ts b/typings/chart/chart-heatmap/index.d.ts deleted file mode 100644 index 19bcc3ef2..000000000 --- a/typings/chart/chart-heatmap/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import Heatmap from './src/index.js'; -export default Heatmap; diff --git a/typings/chart/chart-heatmap/src/index.d.ts b/typings/chart/chart-heatmap/src/index.d.ts deleted file mode 100644 index f7abcda8f..000000000 --- a/typings/chart/chart-heatmap/src/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import 'echarts/extension/bmap/bmap'; -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-histogram/index.d.ts b/typings/chart/chart-histogram/index.d.ts deleted file mode 100644 index 377ee3139..000000000 --- a/typings/chart/chart-histogram/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import Histogram from './src/index.js'; -export default Histogram; diff --git a/typings/chart/chart-histogram/src/index.d.ts b/typings/chart/chart-histogram/src/index.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/chart/chart-histogram/src/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-line/index.d.ts b/typings/chart/chart-line/index.d.ts deleted file mode 100644 index 51db02f61..000000000 --- a/typings/chart/chart-line/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import Line from './src/index.js'; -import { line } from '@opentiny/vue-renderless/chart-line/index'; -export { line }; -export default Line; diff --git a/typings/chart/chart-line/src/index.d.ts b/typings/chart/chart-line/src/index.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/chart/chart-line/src/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-liquidfill/index.d.ts b/typings/chart/chart-liquidfill/index.d.ts deleted file mode 100644 index 64c6a9dda..000000000 --- a/typings/chart/chart-liquidfill/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import Liquidfill from './src/index.js'; -export default Liquidfill; diff --git a/typings/chart/chart-liquidfill/src/index.d.ts b/typings/chart/chart-liquidfill/src/index.d.ts deleted file mode 100644 index 4481b9654..000000000 --- a/typings/chart/chart-liquidfill/src/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import 'echarts-liquidfill'; -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-map/index.d.ts b/typings/chart/chart-map/index.d.ts deleted file mode 100644 index 846f47c7f..000000000 --- a/typings/chart/chart-map/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import ChartMap from './src/index.js'; -export default ChartMap; diff --git a/typings/chart/chart-map/src/index.d.ts b/typings/chart/chart-map/src/index.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/chart/chart-map/src/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-pie/index.d.ts b/typings/chart/chart-pie/index.d.ts deleted file mode 100644 index 578fe1047..000000000 --- a/typings/chart/chart-pie/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import Pie from './src/index.js'; -import { ring, pie } from '@opentiny/vue-renderless/chart-pie/index'; -export { ring, pie }; -export default Pie; diff --git a/typings/chart/chart-pie/src/index.d.ts b/typings/chart/chart-pie/src/index.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/chart/chart-pie/src/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-radar/index.d.ts b/typings/chart/chart-radar/index.d.ts deleted file mode 100644 index 647ed107e..000000000 --- a/typings/chart/chart-radar/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import Radar from './src/index.js'; -import { radar } from '@opentiny/vue-renderless/chart-radar/index'; -export { radar }; -export default Radar; diff --git a/typings/chart/chart-radar/src/index.d.ts b/typings/chart/chart-radar/src/index.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/chart/chart-radar/src/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-ring/index.d.ts b/typings/chart/chart-ring/index.d.ts deleted file mode 100644 index 51e5933c1..000000000 --- a/typings/chart/chart-ring/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import Ring from './src/index.js'; -export default Ring; diff --git a/typings/chart/chart-ring/src/index.d.ts b/typings/chart/chart-ring/src/index.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/chart/chart-ring/src/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-sankey/index.d.ts b/typings/chart/chart-sankey/index.d.ts deleted file mode 100644 index 67dc1b095..000000000 --- a/typings/chart/chart-sankey/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import Sankey from './src/index.js'; -export default Sankey; diff --git a/typings/chart/chart-sankey/src/index.d.ts b/typings/chart/chart-sankey/src/index.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/chart/chart-sankey/src/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-scatter/index.d.ts b/typings/chart/chart-scatter/index.d.ts deleted file mode 100644 index b55177738..000000000 --- a/typings/chart/chart-scatter/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import Scatter from './src/index.js'; -export default Scatter; diff --git a/typings/chart/chart-scatter/src/index.d.ts b/typings/chart/chart-scatter/src/index.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/chart/chart-scatter/src/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-sunburst/index.d.ts b/typings/chart/chart-sunburst/index.d.ts deleted file mode 100644 index 6d4e34ab8..000000000 --- a/typings/chart/chart-sunburst/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import Sunburst from './src/index.js'; -export default Sunburst; diff --git a/typings/chart/chart-sunburst/src/index.d.ts b/typings/chart/chart-sunburst/src/index.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/chart/chart-sunburst/src/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-tree/index.d.ts b/typings/chart/chart-tree/index.d.ts deleted file mode 100644 index f8c74c51e..000000000 --- a/typings/chart/chart-tree/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import ChartTree from './src/index.js'; -export default ChartTree; diff --git a/typings/chart/chart-tree/src/index.d.ts b/typings/chart/chart-tree/src/index.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/chart/chart-tree/src/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-waterfall/index.d.ts b/typings/chart/chart-waterfall/index.d.ts deleted file mode 100644 index 0dfe1f925..000000000 --- a/typings/chart/chart-waterfall/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import Waterfall from './src/index.js'; -import { waterfall } from '@opentiny/vue-renderless/chart-waterfall/index'; -export { waterfall }; -export default Waterfall; diff --git a/typings/chart/chart-waterfall/src/index.d.ts b/typings/chart/chart-waterfall/src/index.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/chart/chart-waterfall/src/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/chart-wordcloud/index.d.ts b/typings/chart/chart-wordcloud/index.d.ts deleted file mode 100644 index 015ad1bd8..000000000 --- a/typings/chart/chart-wordcloud/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import Wordcloud from './src/index.js'; -export default Wordcloud; diff --git a/typings/chart/chart-wordcloud/src/index.d.ts b/typings/chart/chart-wordcloud/src/index.d.ts deleted file mode 100644 index 006fbb5cd..000000000 --- a/typings/chart/chart-wordcloud/src/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import 'echarts-wordcloud'; -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/chart/index.d.ts b/typings/chart/index.d.ts deleted file mode 100644 index 2550b84a8..000000000 --- a/typings/chart/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import Chart from './src/index.js'; -export default Chart; diff --git a/typings/chart/src/index.d.ts b/typings/chart/src/index.d.ts deleted file mode 100644 index cb508073e..000000000 --- a/typings/chart/src/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent, {}>; -export default _default; diff --git a/typings/checkbox-button/index.d.ts b/typings/checkbox-button/index.d.ts deleted file mode 100644 index c325e6bd7..000000000 --- a/typings/checkbox-button/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CheckboxButton from './src/index'; -import '@opentiny/vue-theme/checkbox-button/index.css'; -export default CheckboxButton; diff --git a/typings/checkbox-button/src/index.d.ts b/typings/checkbox-button/src/index.d.ts deleted file mode 100644 index 80f79d314..000000000 --- a/typings/checkbox-button/src/index.d.ts +++ /dev/null @@ -1,45 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - CHECKBOX_GROUP: string; - }; - }; - modelValue: {}; - label: {}; - disabled: BooleanConstructor; - checked: BooleanConstructor; - name: StringConstructor; - trueLabel: (StringConstructor | NumberConstructor)[]; - falseLabel: (StringConstructor | NumberConstructor)[]; - text: StringConstructor; - events: { - type: ObjectConstructor; - default: () => {}; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - CHECKBOX_GROUP: string; - }; - }; - modelValue: {}; - label: {}; - disabled: BooleanConstructor; - checked: BooleanConstructor; - name: StringConstructor; - trueLabel: (StringConstructor | NumberConstructor)[]; - falseLabel: (StringConstructor | NumberConstructor)[]; - text: StringConstructor; - events: { - type: ObjectConstructor; - default: () => {}; - }; -}>>, { - _constants: Record; - disabled: boolean; - events: Record; - checked: boolean; -}>; -export default _default; diff --git a/typings/checkbox-button/src/pc.vue.d.ts b/typings/checkbox-button/src/pc.vue.d.ts deleted file mode 100644 index 44f78b897..000000000 --- a/typings/checkbox-button/src/pc.vue.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -declare const _default: { - inheritAttrs: boolean; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/checkbox-group/index.d.ts b/typings/checkbox-group/index.d.ts deleted file mode 100644 index c0a3872ba..000000000 --- a/typings/checkbox-group/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CheckboxGroup from './src/index'; -export default CheckboxGroup; diff --git a/typings/checkbox-group/src/index.d.ts b/typings/checkbox-group/src/index.d.ts deleted file mode 100644 index 5a69e47cc..000000000 --- a/typings/checkbox-group/src/index.d.ts +++ /dev/null @@ -1,58 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - FORM_ITEM: string; - FORM_CHANGE: string; - }; - }; - modelValue: {}; - disabled: BooleanConstructor; - min: NumberConstructor; - max: NumberConstructor; - size: StringConstructor; - fill: StringConstructor; - textColor: StringConstructor; - vertical: BooleanConstructor; - options: { - type: ArrayConstructor; - default: () => never[]; - }; - type: { - type: StringConstructor; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "change"[], "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - FORM_ITEM: string; - FORM_CHANGE: string; - }; - }; - modelValue: {}; - disabled: BooleanConstructor; - min: NumberConstructor; - max: NumberConstructor; - size: StringConstructor; - fill: StringConstructor; - textColor: StringConstructor; - vertical: BooleanConstructor; - options: { - type: ArrayConstructor; - default: () => never[]; - }; - type: { - type: StringConstructor; - default: string; - }; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - type: string; - disabled: boolean; - vertical: boolean; - options: unknown[]; -}>; -export default _default; diff --git a/typings/checkbox-group/src/mobile.vue.d.ts b/typings/checkbox-group/src/mobile.vue.d.ts deleted file mode 100644 index bcd83e51c..000000000 --- a/typings/checkbox-group/src/mobile.vue.d.ts +++ /dev/null @@ -1,17 +0,0 @@ -import '@opentiny/vue-theme-mobile/checkbox-group/index.css'; -declare const _default: { - inheritAttrs: boolean; - components: { - Checkbox: any; - }; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/checkbox-group/src/pc.vue.d.ts b/typings/checkbox-group/src/pc.vue.d.ts deleted file mode 100644 index 16255342e..000000000 --- a/typings/checkbox-group/src/pc.vue.d.ts +++ /dev/null @@ -1,18 +0,0 @@ -import '@opentiny/vue-theme/checkbox-group/index.css'; -declare const _default: { - components: { - Checkbox: any; - CheckboxButton: any; - }; - inheritAttrs: boolean; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/checkbox/index.d.ts b/typings/checkbox/index.d.ts deleted file mode 100644 index 407719b82..000000000 --- a/typings/checkbox/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Checkbox from './src/index'; -export default Checkbox; diff --git a/typings/checkbox/src/index.d.ts b/typings/checkbox/src/index.d.ts deleted file mode 100644 index 99e27a801..000000000 --- a/typings/checkbox/src/index.d.ts +++ /dev/null @@ -1,74 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - FORM_ITEM: string; - FORM_CHANGE: string; - CHECKBOX: string; - CHECKBOX_GROUP: string; - }; - }; - modelValue: {}; - label: {}; - indeterminate: BooleanConstructor; - disabled: BooleanConstructor; - checked: BooleanConstructor; - name: StringConstructor; - trueLabel: (StringConstructor | NumberConstructor)[]; - falseLabel: (StringConstructor | NumberConstructor)[]; - id: StringConstructor; - controls: StringConstructor; - border: BooleanConstructor; - size: StringConstructor; - text: StringConstructor; - validateEvent: { - type: BooleanConstructor; - default: boolean; - }; - events: { - type: ObjectConstructor; - default: () => {}; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "change"[], "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - FORM_ITEM: string; - FORM_CHANGE: string; - CHECKBOX: string; - CHECKBOX_GROUP: string; - }; - }; - modelValue: {}; - label: {}; - indeterminate: BooleanConstructor; - disabled: BooleanConstructor; - checked: BooleanConstructor; - name: StringConstructor; - trueLabel: (StringConstructor | NumberConstructor)[]; - falseLabel: (StringConstructor | NumberConstructor)[]; - id: StringConstructor; - controls: StringConstructor; - border: BooleanConstructor; - size: StringConstructor; - text: StringConstructor; - validateEvent: { - type: BooleanConstructor; - default: boolean; - }; - events: { - type: ObjectConstructor; - default: () => {}; - }; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - disabled: boolean; - events: Record; - border: boolean; - indeterminate: boolean; - checked: boolean; - validateEvent: boolean; -}>; -export default _default; diff --git a/typings/checkbox/src/mobile.vue.d.ts b/typings/checkbox/src/mobile.vue.d.ts deleted file mode 100644 index a72b774cb..000000000 --- a/typings/checkbox/src/mobile.vue.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -import '@opentiny/vue-theme-mobile/checkbox/index.css'; -declare const _default: { - inheritAttrs: boolean; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/checkbox/src/pc.vue.d.ts b/typings/checkbox/src/pc.vue.d.ts deleted file mode 100644 index 1e60e23a0..000000000 --- a/typings/checkbox/src/pc.vue.d.ts +++ /dev/null @@ -1,19 +0,0 @@ -import '@opentiny/vue-theme/checkbox/index.css'; -declare const _default: { - inheritAttrs: boolean; - props: string[]; - components: { - IconHalfselect: any; - IconCheckedSur: any; - IconCheck: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/col/index.d.ts b/typings/col/index.d.ts deleted file mode 100644 index 6e35b10b7..000000000 --- a/typings/col/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Col from './src/index'; -import '@opentiny/vue-theme/col/index.css'; -export default Col; diff --git a/typings/col/src/index.d.ts b/typings/col/src/index.d.ts deleted file mode 100644 index eb5486b78..000000000 --- a/typings/col/src/index.d.ts +++ /dev/null @@ -1,140 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - /** - * @property {number} [span=12] - 栅格占据的列数(一行以12栅格划分) - */ - span: { - type: NumberConstructor; - default: number; - }; - /** - * @property {number} [offset=0] - 栅格左侧的间隔格数 - */ - offset: { - type: NumberConstructor; - default: number; - }; - /** - * @property {no} [no=0] - 排序编号 - */ - no: { - type: NumberConstructor; - default: number; - }; - /** - * @property {number} [move=0] - 栅格向左向右移动格数 - */ - move: { - type: NumberConstructor; - default: number; - }; - /** - * @property {(number|object)} xs - <768px 响应式栅格数或者栅格属性对象 - */ - xs: { - type: (ObjectConstructor | NumberConstructor)[]; - }; - /** - * @property {(number|object)} sm - ≥768px 响应式栅格数或者栅格属性对象 - */ - sm: { - type: (ObjectConstructor | NumberConstructor)[]; - }; - /** - * @property {(number|object)} md - ≥992px 响应式栅格数或者栅格属性对象 - */ - md: { - type: (ObjectConstructor | NumberConstructor)[]; - }; - /** - * @property {(number|object)} lg - ≥1200px 响应式栅格数或者栅格属性对象 - */ - lg: { - type: (ObjectConstructor | NumberConstructor)[]; - }; - /** - * @property {(number|object)} xl - ≥1920px 响应式栅格数或者栅格属性对象 - */ - xl: { - type: (ObjectConstructor | NumberConstructor)[]; - }; - /** - * @property {string} [tag=div] - 自定义元素标签 - */ - tag: { - type: StringConstructor; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - span: number; - offset: number; - tag: string; - no: number; - move: number; -}>; -export default _default; diff --git a/typings/col/src/pc.vue.d.ts b/typings/col/src/pc.vue.d.ts deleted file mode 100644 index f5d461606..000000000 --- a/typings/col/src/pc.vue.d.ts +++ /dev/null @@ -1,12 +0,0 @@ -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/collapse-item/index.d.ts b/typings/collapse-item/index.d.ts deleted file mode 100644 index f098d675d..000000000 --- a/typings/collapse-item/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CollapseItem from './src/index'; -import '@opentiny/vue-theme/collapse-item/index.css'; -export default CollapseItem; diff --git a/typings/collapse-item/src/index.d.ts b/typings/collapse-item/src/index.d.ts deleted file mode 100644 index ee3f48c8f..000000000 --- a/typings/collapse-item/src/index.d.ts +++ /dev/null @@ -1,32 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - INTERVAL: number; - }; - }; - title: StringConstructor; - name: { - type: (StringConstructor | NumberConstructor)[]; - default(): any; - }; - disabled: BooleanConstructor; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - INTERVAL: number; - }; - }; - title: StringConstructor; - name: { - type: (StringConstructor | NumberConstructor)[]; - default(): any; - }; - disabled: BooleanConstructor; -}>>, { - name: string | number; - _constants: Record; - disabled: boolean; -}>; -export default _default; diff --git a/typings/collapse-item/src/pc.vue.d.ts b/typings/collapse-item/src/pc.vue.d.ts deleted file mode 100644 index e8a0ef51e..000000000 --- a/typings/collapse-item/src/pc.vue.d.ts +++ /dev/null @@ -1,16 +0,0 @@ -declare const _default: { - props: string[]; - components: { - CollapseTransition: any; - IconChevronRight: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/collapse-transition/index.d.ts b/typings/collapse-transition/index.d.ts deleted file mode 100644 index d7369512e..000000000 --- a/typings/collapse-transition/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CollapseTransition from './src/index.vue'; -import '@opentiny/vue-theme/collapse/index.css'; -export default CollapseTransition; diff --git a/typings/collapse-transition/src/index.vue.d.ts b/typings/collapse-transition/src/index.vue.d.ts deleted file mode 100644 index d65a836c1..000000000 --- a/typings/collapse-transition/src/index.vue.d.ts +++ /dev/null @@ -1,11 +0,0 @@ -declare const _default: import("vue").DefineComponent<{}, { - on: { - beforeEnter(elem: any): void; - enter(elem: any): void; - afterEnter(elem: any): void; - beforeLeave(elem: any): void; - leave(elem: any): void; - afterLeave(elem: any): void; - }; -}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, {}>; -export default _default; diff --git a/typings/collapse/index.d.ts b/typings/collapse/index.d.ts deleted file mode 100644 index dcc692078..000000000 --- a/typings/collapse/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Collapse from './src/index'; -import '@opentiny/vue-theme/collapse/index.css'; -export default Collapse; diff --git a/typings/collapse/src/index.d.ts b/typings/collapse/src/index.d.ts deleted file mode 100644 index 20c515c70..000000000 --- a/typings/collapse/src/index.d.ts +++ /dev/null @@ -1,44 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - COMPONENT_NAME: { - Collapse: string; - }; - EVENT_NAME: { - CollapseItemClick: string; - }; - }; - }; - accordion: BooleanConstructor; - beforeClose: FunctionConstructor; - modelValue: { - type: (ArrayConstructor | StringConstructor | NumberConstructor)[]; - default(): never[]; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "change"[], "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - COMPONENT_NAME: { - Collapse: string; - }; - EVENT_NAME: { - CollapseItemClick: string; - }; - }; - }; - accordion: BooleanConstructor; - beforeClose: FunctionConstructor; - modelValue: { - type: (ArrayConstructor | StringConstructor | NumberConstructor)[]; - default(): never[]; - }; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - modelValue: string | number | unknown[]; - accordion: boolean; -}>; -export default _default; diff --git a/typings/collapse/src/pc.vue.d.ts b/typings/collapse/src/pc.vue.d.ts deleted file mode 100644 index f5d461606..000000000 --- a/typings/collapse/src/pc.vue.d.ts +++ /dev/null @@ -1,12 +0,0 @@ -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/common/adapter/index.d.ts b/typings/common/adapter/index.d.ts deleted file mode 100644 index 597438468..000000000 --- a/typings/common/adapter/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -declare const _default: any; -export default _default; -export declare const defineAsyncComponent: any, markRaw: any, renderComponent: any, rootConfig: any, appContext: any, appProperties: any, tools: any, directive: any, h: any, createComponent: any, parseVnode: any, bindFilter: any, useRouter: any, emitter: any; diff --git a/typings/common/adapter/utils.d.ts b/typings/common/adapter/utils.d.ts deleted file mode 100644 index 3230e316b..000000000 --- a/typings/common/adapter/utils.d.ts +++ /dev/null @@ -1,18 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -export declare const emitter: () => { - emit(eventName: any): void; - on: (event: any, callback: any, once: any) => void; - once(event: any, callback: any): void; - off(event: any, callback: any): void; -}; -export declare const bindFilter: (props: any, attrs?: {}) => {}; diff --git a/typings/common/adapter/vue2.d.ts b/typings/common/adapter/vue2.d.ts deleted file mode 100644 index c42766988..000000000 --- a/typings/common/adapter/vue2.d.ts +++ /dev/null @@ -1,77 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Vue from 'vue'; -import * as hooks from '@vue/composition-api'; -import { emitter, bindFilter } from './utils'; -export { emitter, bindFilter }; -export declare const defineAsyncComponent: (promise: any) => any; -export declare const markRaw: (ref: any) => any; -export declare const renderComponent: ({ view, component, props, context: { attrs, listeners, slots }, extend }: { - view: any; - component: any; - props: any; - context: { - attrs: any; - listeners: any; - slots: any; - }; - extend?: {} | undefined; -}) => () => any; -export declare const rootConfig: () => any; -export declare const appContext: () => typeof Vue; -export declare const appProperties: () => any; -export declare const useRouter: (instance?: any) => { - route: any; - router: any; -}; -export declare const tools: (context: any) => { - vm: any; - emit: any; - emitter: () => { - emit(eventName: any): void; - on: (event: any, callback: any, once: any) => void; - once(event: any, callback: any): void; - off(event: any, callback: any): void; - }; - route: any; - router: any; - dispatch: (componentName: any, eventName: any, params: any) => void; - broadcast: (componentName: any, eventName: any, params: any) => void; - parentHandler: (handler: any) => {} | undefined; - childrenHandler: (handler: any) => any[] | undefined; - refs: any; - i18n: any; - slots: any; - scopedSlots: any; - attrs: any; - parent: any; - nextTick: Vue__default; - constants: any; - mode: any; - service: any; - getService: () => any; - setParentAttribute: ({ name, value }: { - name: any; - value: any; - }) => void; - defineInstanceProperties: (props: any) => void; - defineParentInstanceProperties: (props: any) => void; -}; -export declare const directive: (directives: any) => any; -export declare const parseVnode: (vnode: any) => any; -export declare const h: Vue$1.CreateElement; -export declare const createComponent: ({ component, propsData, el }: { - component: any; - propsData: any; - el: any; -}) => any; -export default hooks; diff --git a/typings/common/adapter/vue3.d.ts b/typings/common/adapter/vue3.d.ts deleted file mode 100644 index ed1510575..000000000 --- a/typings/common/adapter/vue3.d.ts +++ /dev/null @@ -1,83 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import * as hooks from 'vue'; -import { emitter, bindFilter } from './utils'; -export { emitter, bindFilter }; -export declare const defineAsyncComponent: typeof hooks.defineAsyncComponent; -export declare const markRaw: typeof hooks.markRaw; -export declare const renderComponent: ({ view, component, props, context: { attrs, slots }, extend }: { - view: any; - component: any; - props: any; - context: { - attrs: any; - slots: any; - }; - extend?: {} | undefined; -}) => () => hooks.VNode; -export declare const rootConfig: (context: any) => Record; -export declare const appContext: () => hooks.App; -export declare const appProperties: () => Record; -export declare const useRouter: (instance?: hooks.ComponentInternalInstance | null) => { - route: any; - router: any; -}; -export declare const tools: (context: any) => { - vm: any; - emit: any; - emitter: () => { - emit(eventName: any): void; - on: (event: any, callback: any, once: any) => void; - once(event: any, callback: any): void; - off(event: any, callback: any): void; - }; - route: any; - router: any; - dispatch: (componentName: any, eventName: any, params: any) => void; - broadcast: (componentName: any, eventName: any, params: any) => void; - parentHandler: (handler: any) => {} | undefined; - childrenHandler: (handler: any) => any[] | undefined; - refs: {}; - i18n: any; - slots: { - [name: string]: hooks.Slot | undefined; - }; - scopedSlots: { - [name: string]: hooks.Slot | undefined; - }; - attrs: any; - parent: any; - nextTick: typeof hooks.nextTick; - constants: unknown; - mode: any; - service: any; - getService: () => any; - setParentAttribute: ({ name, value }: { - name: any; - value: any; - }) => void; - defineInstanceProperties: (props: any) => void; - defineParentInstanceProperties: (props: any) => void; -}; -export declare const directive: (directives: any) => any; -export declare const parseVnode: (vnode: any) => any; -export declare const h: (component: any, propsData: any, childData: any) => hooks.VNode; -export declare const createComponent: ({ component, propsData, el }: { - component: any; - propsData: any; - el: any; -}) => any; -export default hooks; diff --git a/typings/common/index.d.ts b/typings/common/index.d.ts deleted file mode 100644 index dc072571a..000000000 --- a/typings/common/index.d.ts +++ /dev/null @@ -1,94 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import hooks from '@opentiny/vue-common/adapter'; -import { createComponent } from '@opentiny/vue-common/adapter'; -import { defineAsyncComponent, directive, emitter, h } from '@opentiny/vue-common/adapter'; -import { parseVnode, useRouter } from '@opentiny/vue-common/adapter'; -import '@opentiny/vue-theme/base/index.css'; -export declare const $prefix = "Tiny"; -export declare const $props: { - [x: string]: StringConstructor | BooleanConstructor | FunctionConstructor | (FunctionConstructor | ObjectConstructor)[]; -}; -export declare const props: string[]; -export declare let setupComponent: {}; -export declare const initComponent: () => void; -export declare const $setup: ({ props, context, template }: { - props: any; - context: any; - template: any; -}) => any; -export declare const filterAttrs: (attrs: any, filters: any, include: any) => {}; -export declare const setup: ({ props, context, renderless, api, extendOptions, mono }: { - props: any; - context: any; - renderless: any; - api: any; - extendOptions?: {} | undefined; - mono?: boolean | undefined; -}) => { - t: any; - vm: any; - f: any; - a: (attrs: any, filters: any, include: any) => {}; - d: any; - dp: any; -}; -export declare const svg: ({ name, component }: { - name?: string | undefined; - component: any; -}) => () => any; -export declare const $install: (component: any) => void; -export declare const version: string | undefined; -export { h, hooks, directive, parseVnode, useRouter, emitter, createComponent, defineAsyncComponent }; -declare const _default: { - h: any; - directive: any; - parseVnode: any; - useRouter: any; - emitter: any; - createComponent: any; - defineAsyncComponent: any; - filterAttrs: (attrs: any, filters: any, include: any) => {}; - initComponent: () => void; - setupComponent: {}; - svg: ({ name, component }: { - name?: string | undefined; - component: any; - }) => () => any; - $prefix: string; - $props: { - [x: string]: StringConstructor | BooleanConstructor | FunctionConstructor | (FunctionConstructor | ObjectConstructor)[]; - }; - props: string[]; - $setup: ({ props, context, template }: { - props: any; - context: any; - template: any; - }) => any; - setup: ({ props, context, renderless, api, extendOptions, mono }: { - props: any; - context: any; - renderless: any; - api: any; - extendOptions?: {} | undefined; - mono?: boolean | undefined; - }) => { - t: any; - vm: any; - f: any; - a: (attrs: any, filters: any, include: any) => {}; - d: any; - dp: any; - }; - hooks: any; -}; -export default _default; diff --git a/typings/company/index.d.ts b/typings/company/index.d.ts deleted file mode 100644 index 812b2b48a..000000000 --- a/typings/company/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import Company from './src/index'; -import '@opentiny/vue-theme/company/index.css'; -export default Company; diff --git a/typings/company/src/index.d.ts b/typings/company/src/index.d.ts deleted file mode 100644 index 87200a684..000000000 --- a/typings/company/src/index.d.ts +++ /dev/null @@ -1,60 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - clearable: { - type: BooleanConstructor; - default: () => boolean; - }; - disabled: { - type: BooleanConstructor; - default: () => boolean; - }; - fetchCompany: FunctionConstructor; - fields: ObjectConstructor; - max: { - type: NumberConstructor; - default: number; - }; - modelValue: {}; - placeholder: { - type: StringConstructor; - default: () => string; - }; - popperAppendToBody: { - type: BooleanConstructor; - default: () => boolean; - }; - popperClass: StringConstructor; - size: StringConstructor; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly boolean; - }; - disabled: { - type: BooleanConstructor; - default: () => boolean; - }; - fetchCompany: FunctionConstructor; - fields: ObjectConstructor; - max: { - type: NumberConstructor; - default: number; - }; - modelValue: {}; - placeholder: { - type: StringConstructor; - default: () => string; - }; - popperAppendToBody: { - type: BooleanConstructor; - default: () => boolean; - }; - popperClass: StringConstructor; - size: StringConstructor; -}>>, { - placeholder: string; - disabled: boolean; - popperAppendToBody: boolean; - clearable: boolean; - max: number; -}>; -export default _default; diff --git a/typings/company/src/pc.vue.d.ts b/typings/company/src/pc.vue.d.ts deleted file mode 100644 index 627e8b399..000000000 --- a/typings/company/src/pc.vue.d.ts +++ /dev/null @@ -1,18 +0,0 @@ -declare const _default: { - inheritAttrs: boolean; - emits: string[]; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - components: { - TinySelect: any; - TinyOption: any; - }; -}; -export default _default; diff --git a/typings/container/index.d.ts b/typings/container/index.d.ts deleted file mode 100644 index ea33c0195..000000000 --- a/typings/container/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Container from './src/index'; -import '@opentiny/vue-theme/container/index.css'; -export default Container; diff --git a/typings/container/src/index.d.ts b/typings/container/src/index.d.ts deleted file mode 100644 index ca78b68b4..000000000 --- a/typings/container/src/index.d.ts +++ /dev/null @@ -1,62 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - DEFAULT: string; - SIMPLE: string; - LEGEND: string; - CLASSIC: string; - FASHION: string; - }; - }; - pattern: { - type: StringConstructor; - default: string; - }; - headerHeight: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - asideWidth: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - footerHeight: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - DEFAULT: string; - SIMPLE: string; - LEGEND: string; - CLASSIC: string; - FASHION: string; - }; - }; - pattern: { - type: StringConstructor; - default: string; - }; - headerHeight: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - asideWidth: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - footerHeight: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; -}>>, { - _constants: Record; - pattern: string; - headerHeight: string | number; - asideWidth: string | number; - footerHeight: string | number; -}>; -export default _default; diff --git a/typings/container/src/pc.vue.d.ts b/typings/container/src/pc.vue.d.ts deleted file mode 100644 index f5d461606..000000000 --- a/typings/container/src/pc.vue.d.ts +++ /dev/null @@ -1,12 +0,0 @@ -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/country/index.d.ts b/typings/country/index.d.ts deleted file mode 100644 index 363df7224..000000000 --- a/typings/country/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import Country from './src/index'; -import '@opentiny/vue-theme/country/index.css'; -export default Country; diff --git a/typings/country/src/index.d.ts b/typings/country/src/index.d.ts deleted file mode 100644 index 61b7c474a..000000000 --- a/typings/country/src/index.d.ts +++ /dev/null @@ -1,51 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - disabled: { - type: BooleanConstructor; - default: () => boolean; - }; - clearable: { - type: BooleanConstructor; - default: () => boolean; - }; - fetchCountry: FunctionConstructor; - fields: ObjectConstructor; - placeholder: { - type: StringConstructor; - default: () => string; - }; - modelValue: {}; - popperClass: StringConstructor; - popperAppendToBody: { - type: BooleanConstructor; - default: () => boolean; - }; - size: StringConstructor; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly boolean; - }; - clearable: { - type: BooleanConstructor; - default: () => boolean; - }; - fetchCountry: FunctionConstructor; - fields: ObjectConstructor; - placeholder: { - type: StringConstructor; - default: () => string; - }; - modelValue: {}; - popperClass: StringConstructor; - popperAppendToBody: { - type: BooleanConstructor; - default: () => boolean; - }; - size: StringConstructor; -}>>, { - placeholder: string; - disabled: boolean; - popperAppendToBody: boolean; - clearable: boolean; -}>; -export default _default; diff --git a/typings/country/src/pc.vue.d.ts b/typings/country/src/pc.vue.d.ts deleted file mode 100644 index 6d95106b5..000000000 --- a/typings/country/src/pc.vue.d.ts +++ /dev/null @@ -1,18 +0,0 @@ -declare const _default: { - inheritAttrs: boolean; - components: { - TinySelect: any; - TinyOption: any; - }; - emits: string[]; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/credit-card-form/index.d.ts b/typings/credit-card-form/index.d.ts deleted file mode 100644 index 365dee9d7..000000000 --- a/typings/credit-card-form/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CreditCardForm from './src/index'; -import '@opentiny/vue-theme/credit-card-form/index.css'; -export default CreditCardForm; diff --git a/typings/credit-card-form/src/index.d.ts b/typings/credit-card-form/src/index.d.ts deleted file mode 100644 index e9f5d17a7..000000000 --- a/typings/credit-card-form/src/index.d.ts +++ /dev/null @@ -1,35 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - backgroundImage: (ObjectConstructor | StringConstructor)[]; - formData: { - type: ObjectConstructor; - default: () => { - cardYear: string; - cardNumber: string; - cardName: string; - cardMonth: string; - cardCvv: string; - }; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("submit" | "input-card-number" | "input-card-name" | "input-card-month" | "input-card-year" | "input-card-cvv")[], "submit" | "input-card-number" | "input-card-name" | "input-card-month" | "input-card-year" | "input-card-cvv", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - cardYear: string; - cardNumber: string; - cardName: string; - cardMonth: string; - cardCvv: string; - }; - }; -}>> & { - onSubmit?: ((...args: any[]) => any) | undefined; - "onInput-card-number"?: ((...args: any[]) => any) | undefined; - "onInput-card-name"?: ((...args: any[]) => any) | undefined; - "onInput-card-month"?: ((...args: any[]) => any) | undefined; - "onInput-card-year"?: ((...args: any[]) => any) | undefined; - "onInput-card-cvv"?: ((...args: any[]) => any) | undefined; -}, { - formData: Record; -}>; -export default _default; diff --git a/typings/credit-card-form/src/pc.vue.d.ts b/typings/credit-card-form/src/pc.vue.d.ts deleted file mode 100644 index bd02acb4b..000000000 --- a/typings/credit-card-form/src/pc.vue.d.ts +++ /dev/null @@ -1,16 +0,0 @@ -declare const _default: { - components: { - TinyCreditCard: any; - }; - directives: any; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/credit-card/index.d.ts b/typings/credit-card/index.d.ts deleted file mode 100644 index 97de1e37b..000000000 --- a/typings/credit-card/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CreditCard from './src/index'; -import '@opentiny/vue-theme/credit-card/index.css'; -export default CreditCard; diff --git a/typings/credit-card/src/index.d.ts b/typings/credit-card/src/index.d.ts deleted file mode 100644 index 15ab6188c..000000000 --- a/typings/credit-card/src/index.d.ts +++ /dev/null @@ -1,40 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - backgroundImage: (ObjectConstructor | StringConstructor)[]; - isCardNumberMasked: BooleanConstructor; - fields: { - type: ObjectConstructor; - default: () => {}; - }; - labels: { - type: ObjectConstructor; - default: () => { - cardCvv: string; - cardMonth: string; - cardName: string; - cardNumber: string; - cardYear: string; - }; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly {}; - }; - labels: { - type: ObjectConstructor; - default: () => { - cardCvv: string; - cardMonth: string; - cardName: string; - cardNumber: string; - cardYear: string; - }; - }; -}>>, { - fields: Record; - labels: Record; - isCardNumberMasked: boolean; -}>; -export default _default; diff --git a/typings/credit-card/src/pc.vue.d.ts b/typings/credit-card/src/pc.vue.d.ts deleted file mode 100644 index 3d77f3a85..000000000 --- a/typings/credit-card/src/pc.vue.d.ts +++ /dev/null @@ -1,25 +0,0 @@ -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - } & { - images: { - jcb: any; - amex: any; - chip: any; - troy: any; - visa: any; - discover: any; - unionpay: any; - background: any; - dinersclub: any; - mastercard: any; - }; - }; -}; -export default _default; diff --git a/typings/crop/index.d.ts b/typings/crop/index.d.ts deleted file mode 100644 index 2e8c061f4..000000000 --- a/typings/crop/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Crop from './src/index.vue'; -import '@opentiny/vue-theme/crop/index.css'; -export default Crop; diff --git a/typings/crop/src/index.vue.d.ts b/typings/crop/src/index.vue.d.ts deleted file mode 100644 index eadbd1d36..000000000 --- a/typings/crop/src/index.vue.d.ts +++ /dev/null @@ -1,277 +0,0 @@ -import Cropper from 'cropperjs'; -import 'cropperjs/dist/cropper.css'; -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - CROP_IMAGE: string; - }; - }; - alt: { - type: StringConstructor; - default: string; - }; - aspectRatio: { - type: NumberConstructor; - default: number; - }; - autoCrop: { - type: BooleanConstructor; - default: boolean; - }; - autoCropArea: { - type: NumberConstructor; - default: number; - }; - background: { - type: BooleanConstructor; - default: boolean; - }; - center: { - type: BooleanConstructor; - default: boolean; - }; - cropType: { - type: StringConstructor; - default: string; - }; - cropvisible: { - type: BooleanConstructor; - default: boolean; - }; - dragMode: { - type: StringConstructor; - default: string; - }; - guides: { - type: BooleanConstructor; - default: boolean; - }; - maxSize: { - type: StringConstructor; - default: string; - }; - minContainerHeight: { - type: NumberConstructor; - default: number; - }; - minContainerWidth: { - type: NumberConstructor; - default: number; - }; - minCropBoxHeight: { - type: NumberConstructor; - default: number; - }; - minCropBoxWidth: { - type: NumberConstructor; - default: number; - }; - modal: { - type: BooleanConstructor; - default: boolean; - }; - movable: { - type: BooleanConstructor; - default: boolean; - }; - plugin: { - type: (ObjectConstructor | FunctionConstructor)[]; - default: () => typeof Cropper; - }; - preview: { - type: BooleanConstructor; - default: boolean; - }; - previewShow: { - type: BooleanConstructor; - default: boolean; - }; - quality: { - type: NumberConstructor; - default: number; - }; - rotatable: { - type: BooleanConstructor; - default: boolean; - }; - src: { - type: StringConstructor; - default: string; - }; - viewMode: { - type: NumberConstructor; - default: number; - }; - wheelZoomRatio: { - type: NumberConstructor; - default: number; - }; - zoomOnWheel: { - type: BooleanConstructor; - default: boolean; - }; - zoomable: { - type: BooleanConstructor; - default: boolean; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("ready" | "cropdata" | "cropstart" | "cropmove" | "cropend" | "crop")[], "ready" | "cropdata" | "cropstart" | "cropmove" | "cropend" | "crop", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - CROP_IMAGE: string; - }; - }; - alt: { - type: StringConstructor; - default: string; - }; - aspectRatio: { - type: NumberConstructor; - default: number; - }; - autoCrop: { - type: BooleanConstructor; - default: boolean; - }; - autoCropArea: { - type: NumberConstructor; - default: number; - }; - background: { - type: BooleanConstructor; - default: boolean; - }; - center: { - type: BooleanConstructor; - default: boolean; - }; - cropType: { - type: StringConstructor; - default: string; - }; - cropvisible: { - type: BooleanConstructor; - default: boolean; - }; - dragMode: { - type: StringConstructor; - default: string; - }; - guides: { - type: BooleanConstructor; - default: boolean; - }; - maxSize: { - type: StringConstructor; - default: string; - }; - minContainerHeight: { - type: NumberConstructor; - default: number; - }; - minContainerWidth: { - type: NumberConstructor; - default: number; - }; - minCropBoxHeight: { - type: NumberConstructor; - default: number; - }; - minCropBoxWidth: { - type: NumberConstructor; - default: number; - }; - modal: { - type: BooleanConstructor; - default: boolean; - }; - movable: { - type: BooleanConstructor; - default: boolean; - }; - plugin: { - type: (ObjectConstructor | FunctionConstructor)[]; - default: () => typeof Cropper; - }; - preview: { - type: BooleanConstructor; - default: boolean; - }; - previewShow: { - type: BooleanConstructor; - default: boolean; - }; - quality: { - type: NumberConstructor; - default: number; - }; - rotatable: { - type: BooleanConstructor; - default: boolean; - }; - src: { - type: StringConstructor; - default: string; - }; - viewMode: { - type: NumberConstructor; - default: number; - }; - wheelZoomRatio: { - type: NumberConstructor; - default: number; - }; - zoomOnWheel: { - type: BooleanConstructor; - default: boolean; - }; - zoomable: { - type: BooleanConstructor; - default: boolean; - }; -}>> & { - onCrop?: ((...args: any[]) => any) | undefined; - onReady?: ((...args: any[]) => any) | undefined; - onCropdata?: ((...args: any[]) => any) | undefined; - onCropstart?: ((...args: any[]) => any) | undefined; - onCropmove?: ((...args: any[]) => any) | undefined; - onCropend?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - center: boolean; - plugin: Function | Record; - alt: string; - src: string; - aspectRatio: number; - autoCrop: boolean; - autoCropArea: number; - background: boolean; - cropType: string; - cropvisible: boolean; - dragMode: string; - guides: boolean; - maxSize: string; - minContainerHeight: number; - minContainerWidth: number; - minCropBoxHeight: number; - minCropBoxWidth: number; - modal: boolean; - movable: boolean; - preview: boolean; - previewShow: boolean; - quality: number; - rotatable: boolean; - viewMode: number; - wheelZoomRatio: number; - zoomOnWheel: boolean; - zoomable: boolean; -}>; -export default _default; diff --git a/typings/currency/index.d.ts b/typings/currency/index.d.ts deleted file mode 100644 index afa0dfa69..000000000 --- a/typings/currency/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import Currency from './src/index'; -import '@opentiny/vue-theme/currency/index.css'; -export default Currency; diff --git a/typings/currency/src/index.d.ts b/typings/currency/src/index.d.ts deleted file mode 100644 index d78012f32..000000000 --- a/typings/currency/src/index.d.ts +++ /dev/null @@ -1,60 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - clearable: { - type: BooleanConstructor; - default: boolean; - }; - currency: { - type: StringConstructor; - default: string; - }; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - fetchCurrency: FunctionConstructor; - fields: ObjectConstructor; - modelValue: {}; - placeholder: { - type: StringConstructor; - default: string; - }; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - popperClass: StringConstructor; - size: StringConstructor; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - placeholder: string; - currency: string; - disabled: boolean; - popperAppendToBody: boolean; - clearable: boolean; -}>; -export default _default; diff --git a/typings/currency/src/pc.vue.d.ts b/typings/currency/src/pc.vue.d.ts deleted file mode 100644 index 6d95106b5..000000000 --- a/typings/currency/src/pc.vue.d.ts +++ /dev/null @@ -1,18 +0,0 @@ -declare const _default: { - inheritAttrs: boolean; - components: { - TinySelect: any; - TinyOption: any; - }; - emits: string[]; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/date-panel/index.d.ts b/typings/date-panel/index.d.ts deleted file mode 100644 index 58e465d7d..000000000 --- a/typings/date-panel/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import DatePanel from './src/index.vue'; -export default DatePanel; diff --git a/typings/date-panel/src/index.vue.d.ts b/typings/date-panel/src/index.vue.d.ts deleted file mode 100644 index 35ac22b94..000000000 --- a/typings/date-panel/src/index.vue.d.ts +++ /dev/null @@ -1,18 +0,0 @@ -import '@opentiny/vue-theme/input/index.css'; -declare const _default: import("vue").DefineComponent<{ - emitter: ObjectConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("pick" | "select-change" | "dodestroy")[], "pick" | "select-change" | "dodestroy", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onPick?: ((...args: any[]) => any) | undefined; - "onSelect-change"?: ((...args: any[]) => any) | undefined; - onDodestroy?: ((...args: any[]) => any) | undefined; -}, {}>; -export default _default; diff --git a/typings/date-picker/index.d.ts b/typings/date-picker/index.d.ts deleted file mode 100644 index 2984da126..000000000 --- a/typings/date-picker/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import DatePicker from './src/index.js'; -export default DatePicker; diff --git a/typings/date-picker/src/index.d.ts b/typings/date-picker/src/index.d.ts deleted file mode 100644 index 3eb8c7a88..000000000 --- a/typings/date-picker/src/index.d.ts +++ /dev/null @@ -1,235 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - type: { - type: StringConstructor; - default: string; - }; - _constants: { - type: ObjectConstructor; - default: () => { - MonthDay: number; - Minutes: number; - Hours: number; - TotalMonth: number; - Max: string; - Min: string; - Hour: string; - Minute: string; - CapYear: string; - CapMonth: string; - CapDate: string; - CapHour: string; - CapMinute: string; - YearMonth: string; - DateTime: string; - Date: string; - HookMounted: string; - Hidden: string; - Year: string; - Day: string; - }; - }; - timeArrowControl: BooleanConstructor; - size: StringConstructor; - format: StringConstructor; - valueFormat: StringConstructor; - readonly: BooleanConstructor; - placeholder: StringConstructor; - startPlaceholder: StringConstructor; - endPlaceholder: StringConstructor; - prefixIcon: ObjectConstructor; - clearIcon: { - type: ObjectConstructor; - default(): any; - }; - name: { - default: string; - validator: (value: any) => boolean; - }; - disabled: BooleanConstructor; - clearable: { - type: BooleanConstructor; - default: boolean; - }; - id: { - default: string; - validator: (value: any) => boolean; - }; - popperClass: StringConstructor; - editable: { - type: BooleanConstructor; - default: boolean; - }; - align: { - type: StringConstructor; - default: string; - }; - modelValue: {}; - defaultValue: {}; - defaultTime: {}; - rangeSeparator: { - type: (ObjectConstructor | StringConstructor)[]; - default: string; - }; - pickerOptions: {}; - unlinkPanels: BooleanConstructor; - validateEvent: { - type: BooleanConstructor; - default: boolean; - }; - isRange: BooleanConstructor; - arrowControl: BooleanConstructor; - timezoneData: {}; - showTimezone: { - type: BooleanConstructor; - default: boolean; - }; - defaultTimezone: {}; - visible: BooleanConstructor; - minDate: { - type: DateConstructor; - default: () => Date; - }; - maxDate: { - type: DateConstructor; - default: () => Date; - }; - formatter: { - type: FunctionConstructor; - default: (type: any, value: any) => any; - }; - componentName: { - type: StringConstructor; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "focus" | "blur")[], "change" | "focus" | "blur", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - MonthDay: number; - Minutes: number; - Hours: number; - TotalMonth: number; - Max: string; - Min: string; - Hour: string; - Minute: string; - CapYear: string; - CapMonth: string; - CapDate: string; - CapHour: string; - CapMinute: string; - YearMonth: string; - DateTime: string; - Date: string; - HookMounted: string; - Hidden: string; - Year: string; - Day: string; - }; - }; - timeArrowControl: BooleanConstructor; - size: StringConstructor; - format: StringConstructor; - valueFormat: StringConstructor; - readonly: BooleanConstructor; - placeholder: StringConstructor; - startPlaceholder: StringConstructor; - endPlaceholder: StringConstructor; - prefixIcon: ObjectConstructor; - clearIcon: { - type: ObjectConstructor; - default(): any; - }; - name: { - default: string; - validator: (value: any) => boolean; - }; - disabled: BooleanConstructor; - clearable: { - type: BooleanConstructor; - default: boolean; - }; - id: { - default: string; - validator: (value: any) => boolean; - }; - popperClass: StringConstructor; - editable: { - type: BooleanConstructor; - default: boolean; - }; - align: { - type: StringConstructor; - default: string; - }; - modelValue: {}; - defaultValue: {}; - defaultTime: {}; - rangeSeparator: { - type: (ObjectConstructor | StringConstructor)[]; - default: string; - }; - pickerOptions: {}; - unlinkPanels: BooleanConstructor; - validateEvent: { - type: BooleanConstructor; - default: boolean; - }; - isRange: BooleanConstructor; - arrowControl: BooleanConstructor; - timezoneData: {}; - showTimezone: { - type: BooleanConstructor; - default: boolean; - }; - defaultTimezone: {}; - visible: BooleanConstructor; - minDate: { - type: DateConstructor; - default: () => Date; - }; - maxDate: { - type: DateConstructor; - default: () => Date; - }; - formatter: { - type: FunctionConstructor; - default: (type: any, value: any) => any; - }; - componentName: { - type: StringConstructor; - default: string; - }; -}>> & { - onFocus?: ((...args: any[]) => any) | undefined; - onBlur?: ((...args: any[]) => any) | undefined; - onChange?: ((...args: any[]) => any) | undefined; -}, { - name: string; - _constants: Record; - type: string; - readonly: boolean; - visible: boolean; - disabled: boolean; - clearable: boolean; - componentName: string; - id: string; - validateEvent: boolean; - minDate: Date; - maxDate: Date; - formatter: Function; - timeArrowControl: boolean; - clearIcon: Record; - editable: boolean; - align: string; - rangeSeparator: string | Record; - unlinkPanels: boolean; - isRange: boolean; - arrowControl: boolean; - showTimezone: boolean; -}>; -export default _default; diff --git a/typings/date-picker/src/mobile.vue.d.ts b/typings/date-picker/src/mobile.vue.d.ts deleted file mode 100644 index f6c8ebf6c..000000000 --- a/typings/date-picker/src/mobile.vue.d.ts +++ /dev/null @@ -1,17 +0,0 @@ -declare const _default: { - components: { - TinyMiniPicker: any; - TinyInput: any; - IconClose: any; - }; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/date-picker/src/pc.vue.d.ts b/typings/date-picker/src/pc.vue.d.ts deleted file mode 100644 index 09dab256a..000000000 --- a/typings/date-picker/src/pc.vue.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const DatePicker: any; -export default DatePicker; diff --git a/typings/date-range/index.d.ts b/typings/date-range/index.d.ts deleted file mode 100644 index 2f9c871d7..000000000 --- a/typings/date-range/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import DateRange from './src/index.vue'; -export default DateRange; diff --git a/typings/date-range/src/index.vue.d.ts b/typings/date-range/src/index.vue.d.ts deleted file mode 100644 index ac93e3f77..000000000 --- a/typings/date-range/src/index.vue.d.ts +++ /dev/null @@ -1,16 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - emitter: ObjectConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("pick" | "dodestroy")[], "pick" | "dodestroy", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onPick?: ((...args: any[]) => any) | undefined; - onDodestroy?: ((...args: any[]) => any) | undefined; -}, {}>; -export default _default; diff --git a/typings/date-table/index.d.ts b/typings/date-table/index.d.ts deleted file mode 100644 index 0ed2c36a4..000000000 --- a/typings/date-table/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import DateTable from './src/index.vue'; -export default DateTable; diff --git a/typings/date-table/src/index.vue.d.ts b/typings/date-table/src/index.vue.d.ts deleted file mode 100644 index 3ba4c4cdb..000000000 --- a/typings/date-table/src/index.vue.d.ts +++ /dev/null @@ -1,74 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - value: {}; - defaultValue: { - validator(value: unknown): any; - }; - firstDayOfWeek: { - default: number; - type: NumberConstructor; - }; - date: {}; - selectionMode: { - default: string; - }; - disabledDate: {}; - cellClassName: {}; - maxDate: {}; - minDate: {}; - showWeekNumber: { - type: BooleanConstructor; - default: boolean; - }; - rangeState: { - default(): { - endDate: null; - selecting: boolean; - }; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("pick" | "changerange")[], "pick" | "changerange", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onPick?: ((...args: any[]) => any) | undefined; - onChangerange?: ((...args: any[]) => any) | undefined; -}, { - firstDayOfWeek: number; - selectionMode: string; - showWeekNumber: boolean; - rangeState: { - endDate: null; - selecting: boolean; - }; -}>; -export default _default; diff --git a/typings/dept/index.d.ts b/typings/dept/index.d.ts deleted file mode 100644 index 4e56193a9..000000000 --- a/typings/dept/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import Dept from './src/index'; -import '@opentiny/vue-theme/dept/index.css'; -export default Dept; diff --git a/typings/dept/src/index.d.ts b/typings/dept/src/index.d.ts deleted file mode 100644 index 390e72305..000000000 --- a/typings/dept/src/index.d.ts +++ /dev/null @@ -1,51 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - modelValue: StringConstructor; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - autoSelect: { - type: BooleanConstructor; - default: boolean; - }; - size: StringConstructor; - fetchDeptList: FunctionConstructor; - fetchDeptByValue: FunctionConstructor; - fetchDept: FunctionConstructor; - beforeConfirm: FunctionConstructor; - title: { - type: StringConstructor; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "close" | "confirm" | "cancel" | "open" | "selected")[], "change" | "close" | "confirm" | "cancel" | "open" | "selected", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onChange?: ((...args: any[]) => any) | undefined; - onClose?: ((...args: any[]) => any) | undefined; - onConfirm?: ((...args: any[]) => any) | undefined; - onCancel?: ((...args: any[]) => any) | undefined; - onOpen?: ((...args: any[]) => any) | undefined; - onSelected?: ((...args: any[]) => any) | undefined; -}, { - title: string; - disabled: boolean; - autoSelect: boolean; -}>; -export default _default; diff --git a/typings/dept/src/pc.vue.d.ts b/typings/dept/src/pc.vue.d.ts deleted file mode 100644 index c1fe602ef..000000000 --- a/typings/dept/src/pc.vue.d.ts +++ /dev/null @@ -1,21 +0,0 @@ -declare const _default: { - components: { - TinyInput: any; - TinyDialogBox: any; - TinySelect: any; - TinyOption: any; - TinyRow: any; - TinyCol: any; - IconPopup: any; - }; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/detail-page/index.d.ts b/typings/detail-page/index.d.ts deleted file mode 100644 index 75d6c1171..000000000 --- a/typings/detail-page/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import DetailPage from './src/index'; -import '@opentiny/vue-theme/detail-page/index.css'; -export default DetailPage; diff --git a/typings/detail-page/src/index.d.ts b/typings/detail-page/src/index.d.ts deleted file mode 100644 index 505a95701..000000000 --- a/typings/detail-page/src/index.d.ts +++ /dev/null @@ -1,104 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - LOCAL_TIPS: string; - LOCAL_TITLE: string; - VALUE_TITLE: string; - LABEL_TITLE: string; - DIALOG_TITLE: string; - SAVE_BUTTON_TEXT: string; - CANCEL_BUTTTON_TEXT: string; - }; - }; - modelValue: ArrayConstructor; - title: { - type: StringConstructor; - default: string; - }; - textSplit: { - type: StringConstructor; - default: string; - }; - dialogTitle: { - type: StringConstructor; - default: string; - }; - labelTitle: { - type: StringConstructor; - default: string; - }; - tips: { - type: StringConstructor; - default: string; - }; - valueTitle: { - type: StringConstructor; - default: string; - }; - saveButton: { - type: StringConstructor; - default: string; - }; - cancelButton: { - type: StringConstructor; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - LOCAL_TIPS: string; - LOCAL_TITLE: string; - VALUE_TITLE: string; - LABEL_TITLE: string; - DIALOG_TITLE: string; - SAVE_BUTTON_TEXT: string; - CANCEL_BUTTTON_TEXT: string; - }; - }; - modelValue: ArrayConstructor; - title: { - type: StringConstructor; - default: string; - }; - textSplit: { - type: StringConstructor; - default: string; - }; - dialogTitle: { - type: StringConstructor; - default: string; - }; - labelTitle: { - type: StringConstructor; - default: string; - }; - tips: { - type: StringConstructor; - default: string; - }; - valueTitle: { - type: StringConstructor; - default: string; - }; - saveButton: { - type: StringConstructor; - default: string; - }; - cancelButton: { - type: StringConstructor; - default: string; - }; -}>>, { - _constants: Record; - title: string; - valueTitle: string; - textSplit: string; - dialogTitle: string; - labelTitle: string; - tips: string; - saveButton: string; - cancelButton: string; -}>; -export default _default; diff --git a/typings/detail-page/src/pc.vue.d.ts b/typings/detail-page/src/pc.vue.d.ts deleted file mode 100644 index a1ed6de15..000000000 --- a/typings/detail-page/src/pc.vue.d.ts +++ /dev/null @@ -1,19 +0,0 @@ -declare const _default: { - components: { - IconSetting: any; - TinyButton: any; - TinyModal: any; - TinyCheckbox: any; - }; - props: string[]; - emits: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/dialog-box/index.d.ts b/typings/dialog-box/index.d.ts deleted file mode 100644 index 1e6dee1ad..000000000 --- a/typings/dialog-box/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import DialogBox from './src/index'; -export default DialogBox; diff --git a/typings/dialog-box/src/index.d.ts b/typings/dialog-box/src/index.d.ts deleted file mode 100644 index f4fceeb0a..000000000 --- a/typings/dialog-box/src/index.d.ts +++ /dev/null @@ -1,211 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - DIALOG_SLIDER_RIGHT: string; - DIALOG_FADE: string; - SELECT_DROPDOWN: string; - DROPDOWN_MENU: string; - DIALOG_BOX_CLASS: string; - PC_SCROLL_LOCK_CLASS: string; - MOBILE_SCROLL_LOCK_CLASS: string; - Mode: string; - scrollLockClass(mode: any): string; - }; - }; - appendToBody: { - type: BooleanConstructor; - default: () => boolean; - }; - beforeClose: FunctionConstructor; - center: { - type: BooleanConstructor; - default: () => boolean; - }; - closeOnClickModal: { - type: BooleanConstructor; - default: () => boolean; - }; - closeOnPressEscape: { - type: BooleanConstructor; - default: () => boolean; - }; - destroyOnClose: BooleanConstructor; - dialogClass: { - type: StringConstructor; - default: () => string; - }; - draggable: { - type: BooleanConstructor; - default: () => boolean; - }; - fullscreen: { - type: BooleanConstructor; - default: () => boolean; - }; - isFormReset: { - type: BooleanConstructor; - default: () => boolean; - }; - lockScroll: { - type: BooleanConstructor; - default: () => boolean; - }; - modal: { - type: BooleanConstructor; - default: () => boolean; - }; - modalAppendToBody: { - type: BooleanConstructor; - default: () => boolean; - }; - resize: { - type: BooleanConstructor; - default: () => boolean; - }; - rightSlide: { - type: BooleanConstructor; - default: () => boolean; - }; - showClose: { - type: BooleanConstructor; - default: () => boolean; - }; - showHeader: { - type: BooleanConstructor; - default: () => boolean; - }; - title: { - type: StringConstructor; - default: () => string; - }; - top: StringConstructor; - visible: { - type: BooleanConstructor; - default: () => boolean; - }; - width: { - type: StringConstructor; - default: () => string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("close" | "open" | "opened" | "closed" | "drag-start" | "drag-move" | "drag-end")[], "close" | "open" | "opened" | "closed" | "drag-start" | "drag-move" | "drag-end", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - DIALOG_SLIDER_RIGHT: string; - DIALOG_FADE: string; - SELECT_DROPDOWN: string; - DROPDOWN_MENU: string; - DIALOG_BOX_CLASS: string; - PC_SCROLL_LOCK_CLASS: string; - MOBILE_SCROLL_LOCK_CLASS: string; - Mode: string; - scrollLockClass(mode: any): string; - }; - }; - appendToBody: { - type: BooleanConstructor; - default: () => boolean; - }; - beforeClose: FunctionConstructor; - center: { - type: BooleanConstructor; - default: () => boolean; - }; - closeOnClickModal: { - type: BooleanConstructor; - default: () => boolean; - }; - closeOnPressEscape: { - type: BooleanConstructor; - default: () => boolean; - }; - destroyOnClose: BooleanConstructor; - dialogClass: { - type: StringConstructor; - default: () => string; - }; - draggable: { - type: BooleanConstructor; - default: () => boolean; - }; - fullscreen: { - type: BooleanConstructor; - default: () => boolean; - }; - isFormReset: { - type: BooleanConstructor; - default: () => boolean; - }; - lockScroll: { - type: BooleanConstructor; - default: () => boolean; - }; - modal: { - type: BooleanConstructor; - default: () => boolean; - }; - modalAppendToBody: { - type: BooleanConstructor; - default: () => boolean; - }; - resize: { - type: BooleanConstructor; - default: () => boolean; - }; - rightSlide: { - type: BooleanConstructor; - default: () => boolean; - }; - showClose: { - type: BooleanConstructor; - default: () => boolean; - }; - showHeader: { - type: BooleanConstructor; - default: () => boolean; - }; - title: { - type: StringConstructor; - default: () => string; - }; - top: StringConstructor; - visible: { - type: BooleanConstructor; - default: () => boolean; - }; - width: { - type: StringConstructor; - default: () => string; - }; -}>> & { - onClose?: ((...args: any[]) => any) | undefined; - onOpen?: ((...args: any[]) => any) | undefined; - onOpened?: ((...args: any[]) => any) | undefined; - onClosed?: ((...args: any[]) => any) | undefined; - "onDrag-start"?: ((...args: any[]) => any) | undefined; - "onDrag-move"?: ((...args: any[]) => any) | undefined; - "onDrag-end"?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - title: string; - center: boolean; - width: string; - visible: boolean; - modal: boolean; - closeOnClickModal: boolean; - modalAppendToBody: boolean; - appendToBody: boolean; - showHeader: boolean; - destroyOnClose: boolean; - resize: boolean; - isFormReset: boolean; - lockScroll: boolean; - closeOnPressEscape: boolean; - showClose: boolean; - fullscreen: boolean; - draggable: boolean; - rightSlide: boolean; - dialogClass: string; -}>; -export default _default; diff --git a/typings/dialog-box/src/mobile.vue.d.ts b/typings/dialog-box/src/mobile.vue.d.ts deleted file mode 100644 index d969e23af..000000000 --- a/typings/dialog-box/src/mobile.vue.d.ts +++ /dev/null @@ -1,18 +0,0 @@ -import '@opentiny/vue-theme-mobile/dialog-box/index.css'; -declare const _default: { - emits: string[]; - props: string[]; - model: { - prop: string; - event: string; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/dialog-box/src/pc.vue.d.ts b/typings/dialog-box/src/pc.vue.d.ts deleted file mode 100644 index 6dc6888cc..000000000 --- a/typings/dialog-box/src/pc.vue.d.ts +++ /dev/null @@ -1,47 +0,0 @@ -import '@opentiny/vue-theme/dialog-box/index.css'; -declare const _default: { - components: { - IconClose: any; - IconFullscreen: any; - IconMinscreen: any; - }; - emits: string[]; - props: string[]; - model: { - prop: string; - event: string; - }; - provide(): { - dialog: { - components: { - IconClose: any; - IconFullscreen: any; - IconMinscreen: any; - }; - emits: string[]; - props: string[]; - model: { - prop: string; - event: string; - }; - provide(): any; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - }; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/drop-roles/index.d.ts b/typings/drop-roles/index.d.ts deleted file mode 100644 index 9bf823221..000000000 --- a/typings/drop-roles/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import DropRoles from './src/index'; -import '@opentiny/vue-theme/drop-roles/index.css'; -export default DropRoles; diff --git a/typings/drop-roles/src/index.d.ts b/typings/drop-roles/src/index.d.ts deleted file mode 100644 index 6b025283d..000000000 --- a/typings/drop-roles/src/index.d.ts +++ /dev/null @@ -1,37 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - modelValue: {}; - placeholder: { - type: StringConstructor; - default: string; - }; - size: StringConstructor; - fetchRole: FunctionConstructor; - fetchCurrentRole: FunctionConstructor; - fields: ObjectConstructor; - popperClass: StringConstructor; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "change"[], "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onChange?: ((...args: any[]) => any) | undefined; -}, { - placeholder: string; - popperAppendToBody: boolean; -}>; -export default _default; diff --git a/typings/drop-roles/src/pc.vue.d.ts b/typings/drop-roles/src/pc.vue.d.ts deleted file mode 100644 index e8de4d8c3..000000000 --- a/typings/drop-roles/src/pc.vue.d.ts +++ /dev/null @@ -1,18 +0,0 @@ -declare const _default: { - components: { - TinySelect: any; - TinyOption: any; - IconAdministrator: any; - }; - props: string[]; - emits: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/drop-times/index.d.ts b/typings/drop-times/index.d.ts deleted file mode 100644 index ce06f7371..000000000 --- a/typings/drop-times/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import DropTimes from './src/index'; -import '@opentiny/vue-theme/drop-times/index.css'; -export default DropTimes; diff --git a/typings/drop-times/src/index.d.ts b/typings/drop-times/src/index.d.ts deleted file mode 100644 index 059aca2d9..000000000 --- a/typings/drop-times/src/index.d.ts +++ /dev/null @@ -1,67 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - modelValue: {}; - placeholder: { - type: StringConstructor; - default: string; - }; - tabindex: { - type: StringConstructor; - default: string; - }; - size: StringConstructor; - popperClass: StringConstructor; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - start: { - type: NumberConstructor; - default: number; - }; - end: { - type: NumberConstructor; - default: number; - }; - step: { - type: NumberConstructor; - default: number; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "change"[], "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onChange?: ((...args: any[]) => any) | undefined; -}, { - tabindex: string; - placeholder: string; - popperAppendToBody: boolean; - start: number; - end: number; - step: number; -}>; -export default _default; diff --git a/typings/drop-times/src/pc.vue.d.ts b/typings/drop-times/src/pc.vue.d.ts deleted file mode 100644 index fe099f5f5..000000000 --- a/typings/drop-times/src/pc.vue.d.ts +++ /dev/null @@ -1,17 +0,0 @@ -declare const _default: { - components: { - TinySelect: any; - TinyOption: any; - }; - props: string[]; - emits: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/dropdown-item/index.d.ts b/typings/dropdown-item/index.d.ts deleted file mode 100644 index 88c2e213f..000000000 --- a/typings/dropdown-item/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import DropdownItem from './src/index'; -export default DropdownItem; diff --git a/typings/dropdown-item/src/index.d.ts b/typings/dropdown-item/src/index.d.ts deleted file mode 100644 index e02c9a958..000000000 --- a/typings/dropdown-item/src/index.d.ts +++ /dev/null @@ -1,37 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - icon: (ObjectConstructor | StringConstructor)[]; - disabled: BooleanConstructor; - divided: BooleanConstructor; - command: {}; - title: StringConstructor; - titleClass: StringConstructor; - options: { - type: ArrayConstructor; - default: () => never[]; - }; - type: { - type: StringConstructor; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly never[]; - }; - type: { - type: StringConstructor; - default: string; - }; -}>>, { - type: string; - disabled: boolean; - options: unknown[]; - divided: boolean; -}>; -export default _default; diff --git a/typings/dropdown-item/src/index.vue.d.ts b/typings/dropdown-item/src/index.vue.d.ts deleted file mode 100644 index 29872c7f4..000000000 --- a/typings/dropdown-item/src/index.vue.d.ts +++ /dev/null @@ -1,50 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - modelValue: null; - title: StringConstructor; - disabled: BooleanConstructor; - titleClass: StringConstructor; - options: { - type: ArrayConstructor; - default: () => never[]; - }; - icon: ObjectConstructor; - type: { - type: StringConstructor; - default: string; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click" | "change" | "update:modelValue" | "close" | "confirm" | "open" | "opened" | "closed")[], "click" | "change" | "update:modelValue" | "close" | "confirm" | "open" | "opened" | "closed", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly never[]; - }; - icon: ObjectConstructor; - type: { - type: StringConstructor; - default: string; - }; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; - onClick?: ((...args: any[]) => any) | undefined; - "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined; - onClose?: ((...args: any[]) => any) | undefined; - onConfirm?: ((...args: any[]) => any) | undefined; - onOpen?: ((...args: any[]) => any) | undefined; - onOpened?: ((...args: any[]) => any) | undefined; - onClosed?: ((...args: any[]) => any) | undefined; -}, { - type: string; - disabled: boolean; - options: unknown[]; -}>; -export default _default; diff --git a/typings/dropdown-item/src/mobile.vue.d.ts b/typings/dropdown-item/src/mobile.vue.d.ts deleted file mode 100644 index e132d8594..000000000 --- a/typings/dropdown-item/src/mobile.vue.d.ts +++ /dev/null @@ -1,22 +0,0 @@ -import '@opentiny/vue-theme-mobile/dropdown-item/index.css'; -declare const _default: { - directives: { - Clickoutside: any; - }; - props: string[]; - components: { - IconYes: any; - TinyPopup: any; - TinyButton: any; - }; - emits: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/dropdown-item/src/pc.vue.d.ts b/typings/dropdown-item/src/pc.vue.d.ts deleted file mode 100644 index 19db95e8d..000000000 --- a/typings/dropdown-item/src/pc.vue.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -import '@opentiny/vue-theme/dropdown-item/index.css'; -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/dropdown-menu/index.d.ts b/typings/dropdown-menu/index.d.ts deleted file mode 100644 index d930fbae3..000000000 --- a/typings/dropdown-menu/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import DropdownMenu from './src/index'; -export default DropdownMenu; diff --git a/typings/dropdown-menu/src/index.d.ts b/typings/dropdown-menu/src/index.d.ts deleted file mode 100644 index 7d860b3d9..000000000 --- a/typings/dropdown-menu/src/index.d.ts +++ /dev/null @@ -1,92 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - visibleArrow: { - type: BooleanConstructor; - default: boolean; - }; - arrowOffset: { - type: NumberConstructor; - default: number; - }; - placement: { - type: StringConstructor; - default: string; - }; - popperClass: StringConstructor; - closeOnClickOutside: { - type: BooleanConstructor; - default: boolean; - }; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - activeColor: StringConstructor; - closeOnClickOverlay: { - type: BooleanConstructor; - default: boolean; - }; - direction: { - type: StringConstructor; - default: string; - }; - duration: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - overlay: { - type: BooleanConstructor; - default: boolean; - }; - zIndex: (StringConstructor | NumberConstructor)[]; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - duration: string | number; - popperAppendToBody: boolean; - placement: string; - visibleArrow: boolean; - arrowOffset: number; - overlay: boolean; - direction: string; - closeOnClickOverlay: boolean; - closeOnClickOutside: boolean; -}>; -export default _default; diff --git a/typings/dropdown-menu/src/index.vue.d.ts b/typings/dropdown-menu/src/index.vue.d.ts deleted file mode 100644 index d4354310f..000000000 --- a/typings/dropdown-menu/src/index.vue.d.ts +++ /dev/null @@ -1,63 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - zIndex: (StringConstructor | NumberConstructor)[]; - activeColor: StringConstructor; - overlay: { - type: BooleanConstructor; - default: boolean; - }; - duration: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - direction: { - type: StringConstructor; - default: string; - }; - closeOnClickOverlay: { - type: BooleanConstructor; - default: boolean; - }; - closeOnClickOutside: { - type: BooleanConstructor; - default: boolean; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "open"[], "open", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onOpen?: ((...args: any[]) => any) | undefined; -}, { - duration: string | number; - overlay: boolean; - direction: string; - closeOnClickOverlay: boolean; - closeOnClickOutside: boolean; -}>; -export default _default; diff --git a/typings/dropdown-menu/src/mobile.vue.d.ts b/typings/dropdown-menu/src/mobile.vue.d.ts deleted file mode 100644 index d73debbe5..000000000 --- a/typings/dropdown-menu/src/mobile.vue.d.ts +++ /dev/null @@ -1,25 +0,0 @@ -import '@opentiny/vue-theme-mobile/dropdown-menu/index.css'; -declare const _default: { - props: string[]; - components: { - IconUp: any; - IconDown: any; - IconUnfilter: any; - IconSort: any; - IconDeltaDown: any; - IconDeltaUp: any; - }; - directives: { - Clickoutside: any; - }; - emits: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/dropdown-menu/src/pc.vue.d.ts b/typings/dropdown-menu/src/pc.vue.d.ts deleted file mode 100644 index c40f588d5..000000000 --- a/typings/dropdown-menu/src/pc.vue.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -import '@opentiny/vue-theme/dropdown-menu/index.css'; -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/dropdown/index.d.ts b/typings/dropdown/index.d.ts deleted file mode 100644 index 45a5d797a..000000000 --- a/typings/dropdown/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Dropdown from './src/index.vue'; -import '@opentiny/vue-theme/dropdown/index.css'; -export default Dropdown; diff --git a/typings/dropdown/src/index.vue.d.ts b/typings/dropdown/src/index.vue.d.ts deleted file mode 100644 index 2967a388c..000000000 --- a/typings/dropdown/src/index.vue.d.ts +++ /dev/null @@ -1,86 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - type: StringConstructor; - trigger: { - type: StringConstructor; - default: string; - }; - size: { - type: StringConstructor; - default: string; - }; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - splitButton: BooleanConstructor; - showTimeout: { - type: NumberConstructor; - default: number; - }; - hideTimeout: { - type: NumberConstructor; - default: number; - }; - hideOnClick: { - type: BooleanConstructor; - default: boolean; - }; - tabindex: { - type: NumberConstructor; - default: number; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("visible-change" | "item-click" | "button-click" | "visibles-change" | "menu-item-click")[], "visible-change" | "item-click" | "button-click" | "visibles-change" | "menu-item-click", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - "onVisible-change"?: ((...args: any[]) => any) | undefined; - "onItem-click"?: ((...args: any[]) => any) | undefined; - "onButton-click"?: ((...args: any[]) => any) | undefined; - "onVisibles-change"?: ((...args: any[]) => any) | undefined; - "onMenu-item-click"?: ((...args: any[]) => any) | undefined; -}, { - size: string; - tabindex: number; - disabled: boolean; - trigger: string; - splitButton: boolean; - showTimeout: number; - hideTimeout: number; - hideOnClick: boolean; -}>; -export default _default; diff --git a/typings/espace/index.d.ts b/typings/espace/index.d.ts deleted file mode 100644 index 947440a70..000000000 --- a/typings/espace/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import Espace from './src/index'; -import '@opentiny/vue-theme/espace/index.css'; -export default Espace; diff --git a/typings/espace/src/index.d.ts b/typings/espace/src/index.d.ts deleted file mode 100644 index d8b10e94c..000000000 --- a/typings/espace/src/index.d.ts +++ /dev/null @@ -1,16 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - data: ArrayConstructor; - isNewImMode: { - type: BooleanConstructor; - default: boolean; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - isNewImMode: boolean; -}>; -export default _default; diff --git a/typings/espace/src/pc.vue.d.ts b/typings/espace/src/pc.vue.d.ts deleted file mode 100644 index ffc11ed11..000000000 --- a/typings/espace/src/pc.vue.d.ts +++ /dev/null @@ -1,20 +0,0 @@ -declare const _default: { - components: { - IconMessageCircle: any; - IconTelephoneCircle: any; - IconEmailCircle: any; - IconEmailAdd: any; - IconTelephone: any; - IconDialog: any; - }; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/exception/index.d.ts b/typings/exception/index.d.ts deleted file mode 100644 index e261423c1..000000000 --- a/typings/exception/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Exception from './src/index.vue'; -import '@opentiny/vue-theme-mobile/exception/index.css'; -export default Exception; diff --git a/typings/exception/src/index.vue.d.ts b/typings/exception/src/index.vue.d.ts deleted file mode 100644 index a2fd3cf7f..000000000 --- a/typings/exception/src/index.vue.d.ts +++ /dev/null @@ -1,29 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - type: { - type: StringConstructor; - default: string; - }; - message: StringConstructor; - subMessage: StringConstructor; - exceptionClass: StringConstructor; - buttonText: StringConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - type: string; -}>; -export default _default; diff --git a/typings/fall-menu/index.d.ts b/typings/fall-menu/index.d.ts deleted file mode 100644 index 11f72fe04..000000000 --- a/typings/fall-menu/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import FallMenu from './src/index'; -import '@opentiny/vue-theme/fall-menu/index.css'; -export default FallMenu; diff --git a/typings/fall-menu/src/index.d.ts b/typings/fall-menu/src/index.d.ts deleted file mode 100644 index 9011c1aaf..000000000 --- a/typings/fall-menu/src/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - data: { - type: ArrayConstructor; - default: () => never[]; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly never[]; - }; -}>>, { - data: unknown[]; -}>; -export default _default; diff --git a/typings/fall-menu/src/pc.vue.d.ts b/typings/fall-menu/src/pc.vue.d.ts deleted file mode 100644 index d72009b83..000000000 --- a/typings/fall-menu/src/pc.vue.d.ts +++ /dev/null @@ -1,19 +0,0 @@ -declare const _default: { - emits: string[]; - props: string[]; - components: { - TinyRow: any; - TinyCol: any; - IconChevronLeft: any; - IconChevronRight: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/file-upload/index.d.ts b/typings/file-upload/index.d.ts deleted file mode 100644 index 26a42e487..000000000 --- a/typings/file-upload/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import FileUpload from './src/index'; -import '@opentiny/vue-theme/file-upload/index.css'; -export default FileUpload; diff --git a/typings/file-upload/src/index.d.ts b/typings/file-upload/src/index.d.ts deleted file mode 100644 index 3c55a0285..000000000 --- a/typings/file-upload/src/index.d.ts +++ /dev/null @@ -1,375 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - UPLOAD_INNER: string; - FILE_STATUS: { - READY: string; - SUCESS: string; - UPLOADING: string; - FAIL: string; - DOWNLOADING: string; - }; - LIST_TYPE: { - TEXT: string; - PICTURE_CARD: string; - PICTURE: string; - THUMB: string; - }; - EDM: { - CHUNKINIT: string; - FILESIZE: string; - CHUNKS: string; - FILENAME: string; - ISCHECKCODE: string; - CHECKCODE: string; - MULTIPART: string; - DOCID: string; - CHUNK: string; - SINGLEUPLOAD: string; - LOWERNAME: string; - FOLDERKEY: string; - FORMAT: string; - WATER: string; - SOURCE: string; - URLCONTS: string; - EDMTOKEN: string; - TRACEID: string; - TEXT: string; - JSLIB: string; - I18NKEY: string; - LARGEFILEKEY: string; - EXCEED: string; - SIZE: string; - SIZE_2G: number; - SIZE_20M: number; - SIZE_8M: number; - FILEEMPTY: string; - KIASCANTIP: string; - FILENAMEEXCEEDS: string; - THEFILENAME: string; - }; - }; - }; - accept: StringConstructor; - action: StringConstructor; - autoUpload: { - type: BooleanConstructor; - default: () => true; - }; - beforeRemove: FunctionConstructor; - beforeUpload: FunctionConstructor; - data: ObjectConstructor; - disabled: BooleanConstructor; - display: { - type: BooleanConstructor; - default: () => true; - }; - drag: BooleanConstructor; - dragger: BooleanConstructor; - edm: { - type: ObjectConstructor; - default: () => {}; - }; - fileIconList: { - type: ArrayConstructor; - default: () => never[]; - }; - fileList: { - type: ArrayConstructor; - default: () => never[]; - }; - fileSize: { - type: (ArrayConstructor | NumberConstructor)[]; - validator(value: unknown): boolean; - }; - fileTitle: { - type: StringConstructor; - default: () => "附件"; - }; - headerShow: { - type: BooleanConstructor; - default: () => true; - }; - headers: { - type: ObjectConstructor; - default: () => {}; - }; - httpRequest: FunctionConstructor; - limit: NumberConstructor; - listType: { - type: StringConstructor; - default: () => "text"; - }; - mergeService: { - type: BooleanConstructor; - default: () => false; - }; - multiple: BooleanConstructor; - name: { - type: StringConstructor; - default: () => "file"; - }; - openDownloadFile: { - type: BooleanConstructor; - default: () => false; - }; - showFileList: { - type: BooleanConstructor; - default: () => true; - }; - size: StringConstructor; - successStatistics: { - type: BooleanConstructor; - default: () => true; - }; - thumbOption: { - type: ObjectConstructor; - default: () => { - popperClass: string; - width: number; - showDownload: boolean; - downloadFile: FunctionConstructor; - showDel: boolean; - icon: string; - showTooltip: boolean; - }; - }; - type: { - type: StringConstructor; - default: () => "select"; - }; - uploadIcon: { - type: BooleanConstructor; - default: () => true; - }; - withCredentials: { - type: BooleanConstructor; - default: () => true; - }; - isFolderTitle: { - type: BooleanConstructor; - default: boolean; - }; - plugin: { - type: (ObjectConstructor | FunctionConstructor)[]; - default: () => any; - }; - listOption: { - type: ObjectConstructor; - default: () => { - showUpdate: boolean; - showDel: boolean; - }; - }; - maxNameLength: { - type: NumberConstructor; - default: number; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("progress" | "change" | "drop-error" | "preview" | "remove" | "error" | "exceed" | "success")[], "progress" | "change" | "error" | "preview" | "exceed" | "drop-error" | "remove" | "success", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - UPLOAD_INNER: string; - FILE_STATUS: { - READY: string; - SUCESS: string; - UPLOADING: string; - FAIL: string; - DOWNLOADING: string; - }; - LIST_TYPE: { - TEXT: string; - PICTURE_CARD: string; - PICTURE: string; - THUMB: string; - }; - EDM: { - CHUNKINIT: string; - FILESIZE: string; - CHUNKS: string; - FILENAME: string; - ISCHECKCODE: string; - CHECKCODE: string; - MULTIPART: string; - DOCID: string; - CHUNK: string; - SINGLEUPLOAD: string; - LOWERNAME: string; - FOLDERKEY: string; - FORMAT: string; - WATER: string; - SOURCE: string; - URLCONTS: string; - EDMTOKEN: string; - TRACEID: string; - TEXT: string; - JSLIB: string; - I18NKEY: string; - LARGEFILEKEY: string; - EXCEED: string; - SIZE: string; - SIZE_2G: number; - SIZE_20M: number; - SIZE_8M: number; - FILEEMPTY: string; - KIASCANTIP: string; - FILENAMEEXCEEDS: string; - THEFILENAME: string; - }; - }; - }; - accept: StringConstructor; - action: StringConstructor; - autoUpload: { - type: BooleanConstructor; - default: () => true; - }; - beforeRemove: FunctionConstructor; - beforeUpload: FunctionConstructor; - data: ObjectConstructor; - disabled: BooleanConstructor; - display: { - type: BooleanConstructor; - default: () => true; - }; - drag: BooleanConstructor; - dragger: BooleanConstructor; - edm: { - type: ObjectConstructor; - default: () => {}; - }; - fileIconList: { - type: ArrayConstructor; - default: () => never[]; - }; - fileList: { - type: ArrayConstructor; - default: () => never[]; - }; - fileSize: { - type: (ArrayConstructor | NumberConstructor)[]; - validator(value: unknown): boolean; - }; - fileTitle: { - type: StringConstructor; - default: () => "附件"; - }; - headerShow: { - type: BooleanConstructor; - default: () => true; - }; - headers: { - type: ObjectConstructor; - default: () => {}; - }; - httpRequest: FunctionConstructor; - limit: NumberConstructor; - listType: { - type: StringConstructor; - default: () => "text"; - }; - mergeService: { - type: BooleanConstructor; - default: () => false; - }; - multiple: BooleanConstructor; - name: { - type: StringConstructor; - default: () => "file"; - }; - openDownloadFile: { - type: BooleanConstructor; - default: () => false; - }; - showFileList: { - type: BooleanConstructor; - default: () => true; - }; - size: StringConstructor; - successStatistics: { - type: BooleanConstructor; - default: () => true; - }; - thumbOption: { - type: ObjectConstructor; - default: () => { - popperClass: string; - width: number; - showDownload: boolean; - downloadFile: FunctionConstructor; - showDel: boolean; - icon: string; - showTooltip: boolean; - }; - }; - type: { - type: StringConstructor; - default: () => "select"; - }; - uploadIcon: { - type: BooleanConstructor; - default: () => true; - }; - withCredentials: { - type: BooleanConstructor; - default: () => true; - }; - isFolderTitle: { - type: BooleanConstructor; - default: boolean; - }; - plugin: { - type: (ObjectConstructor | FunctionConstructor)[]; - default: () => any; - }; - listOption: { - type: ObjectConstructor; - default: () => { - showUpdate: boolean; - showDel: boolean; - }; - }; - maxNameLength: { - type: NumberConstructor; - default: number; - }; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; - onError?: ((...args: any[]) => any) | undefined; - onProgress?: ((...args: any[]) => any) | undefined; - onRemove?: ((...args: any[]) => any) | undefined; - onExceed?: ((...args: any[]) => any) | undefined; - onSuccess?: ((...args: any[]) => any) | undefined; - onPreview?: ((...args: any[]) => any) | undefined; - "onDrop-error"?: ((...args: any[]) => any) | undefined; -}, { - name: string; - _constants: Record; - type: string; - disabled: boolean; - plugin: Function | Record; - multiple: boolean; - display: boolean; - drag: boolean; - headers: Record; - withCredentials: boolean; - showFileList: boolean; - fileList: unknown[]; - autoUpload: boolean; - listType: string; - fileIconList: unknown[]; - fileTitle: string; - headerShow: boolean; - successStatistics: boolean; - uploadIcon: boolean; - edm: Record; - dragger: boolean; - openDownloadFile: boolean; - mergeService: boolean; - thumbOption: Record; - isFolderTitle: boolean; - listOption: Record; - maxNameLength: number; -}>; -export default _default; diff --git a/typings/file-upload/src/mobile.vue.d.ts b/typings/file-upload/src/mobile.vue.d.ts deleted file mode 100644 index 08270cf6e..000000000 --- a/typings/file-upload/src/mobile.vue.d.ts +++ /dev/null @@ -1,24 +0,0 @@ -import '@opentiny/vue-theme-mobile/file-upload/index.css'; -import '@opentiny/vue-theme-mobile/upload-list/index.css'; -import '@opentiny/vue-theme-mobile/upload-dragger/index.css'; -import '@opentiny/vue-theme-mobile/upload/index.css'; -declare const _default: { - inheritAttrs: boolean; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - components: { - Progress: any; - UploadList: any; - Upload: any; - IconUpload: any; - }; - render(): JSX.Element; -}; -export default _default; diff --git a/typings/file-upload/src/pc.vue.d.ts b/typings/file-upload/src/pc.vue.d.ts deleted file mode 100644 index 59cf18062..000000000 --- a/typings/file-upload/src/pc.vue.d.ts +++ /dev/null @@ -1,30 +0,0 @@ -import '@opentiny/vue-theme/file-upload/index.css'; -import '@opentiny/vue-theme/upload-list/index.css'; -import '@opentiny/vue-theme/upload-dragger/index.css'; -import '@opentiny/vue-theme/upload/index.css'; -declare const _default: { - inheritAttrs: boolean; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - components: { - Progress: any; - UploadList: any; - Upload: any; - TinyDialogBox: any; - Popover: any; - IconAttachment: any; - IconSuccessful: any; - IconCloseCircle: any; - IconDownload: any; - IconFileCloudupload: any; - }; - render(): JSX.Element; -}; -export default _default; diff --git a/typings/floatbar/index.d.ts b/typings/floatbar/index.d.ts deleted file mode 100644 index fc79e75d8..000000000 --- a/typings/floatbar/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Floatbar from './src/index.js'; -import '@opentiny/vue-theme/floatbar/index.css'; -export default Floatbar; diff --git a/typings/floatbar/src/index.d.ts b/typings/floatbar/src/index.d.ts deleted file mode 100644 index b0bf89cd6..000000000 --- a/typings/floatbar/src/index.d.ts +++ /dev/null @@ -1,6 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - [x: string]: BooleanConstructor | StringConstructor | FunctionConstructor | (ObjectConstructor | FunctionConstructor)[]; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, {}>; -export default _default; diff --git a/typings/floatbar/src/pc.vue.d.ts b/typings/floatbar/src/pc.vue.d.ts deleted file mode 100644 index f5d461606..000000000 --- a/typings/floatbar/src/pc.vue.d.ts +++ /dev/null @@ -1,12 +0,0 @@ -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/form-item/index.d.ts b/typings/form-item/index.d.ts deleted file mode 100644 index 0a64a67fa..000000000 --- a/typings/form-item/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import FormItem from './src/index.vue'; -export default FormItem; diff --git a/typings/form-item/src/index.vue.d.ts b/typings/form-item/src/index.vue.d.ts deleted file mode 100644 index 4baa0caef..000000000 --- a/typings/form-item/src/index.vue.d.ts +++ /dev/null @@ -1,108 +0,0 @@ -declare const _default: import('vue').DefineComponent< - { - _constants: { - type: ObjectConstructor - default: () => { - FORM_NAME: string - FORM_ITEM_NAME: string - } - } - appendToBody: { - type: BooleanConstructor - default: undefined - } - error: StringConstructor - for: StringConstructor - inlineMessage: { - type: (StringConstructor | BooleanConstructor)[] - default: string - } - label: StringConstructor - labelWidth: StringConstructor - manual: BooleanConstructor - popperOptions: { - type: ObjectConstructor - default: () => {} - } - prop: StringConstructor - required: { - type: BooleanConstructor - default: undefined - } - rules: (ArrayConstructor | ObjectConstructor)[] - showMessage: { - type: BooleanConstructor - default: boolean - } - size: StringConstructor - validateDebounce: BooleanConstructor - validatePosition: StringConstructor - validateStatus: StringConstructor - validateType: StringConstructor - }, - any, - unknown, - {}, - {}, - import('vue').ComponentOptionsMixin, - import('vue').ComponentOptionsMixin, - 'validate'[], - 'validate', - import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, - Readonly< - import('vue').ExtractPropTypes<{ - _constants: { - type: ObjectConstructor - default: () => { - FORM_NAME: string - FORM_ITEM_NAME: string - } - } - appendToBody: { - type: BooleanConstructor - default: undefined - } - error: StringConstructor - for: StringConstructor - inlineMessage: { - type: (StringConstructor | BooleanConstructor)[] - default: string - } - label: StringConstructor - labelWidth: StringConstructor - manual: BooleanConstructor - popperOptions: { - type: ObjectConstructor - default: () => {} - } - prop: StringConstructor - required: { - type: BooleanConstructor - default: undefined - } - rules: (ArrayConstructor | ObjectConstructor)[] - showMessage: { - type: BooleanConstructor - default: boolean - } - size: StringConstructor - validateDebounce: BooleanConstructor - validatePosition: StringConstructor - validateStatus: StringConstructor - validateType: StringConstructor - }> - > & { - onValidate?: ((...args: any[]) => any) | undefined - }, - { - required: boolean - manual: boolean - popperOptions: Record - _constants: Record - appendToBody: boolean - inlineMessage: string | boolean - showMessage: boolean - validateDebounce: boolean - } -> -export default _default diff --git a/typings/form-item/src/label-wrap.d.ts b/typings/form-item/src/label-wrap.d.ts deleted file mode 100644 index aaec42413..000000000 --- a/typings/form-item/src/label-wrap.d.ts +++ /dev/null @@ -1,25 +0,0 @@ -declare const _default: { - props: { - isAutoWidth: BooleanConstructor; - updateAll: BooleanConstructor; - isMobile: BooleanConstructor; - }; - inject: string[]; - render(): any; - methods: { - getLabelWidth(): any; - updateLabelWidth(action?: string): void; - }; - watch: { - computedWidth(val: any, oldVal: any): void; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/form/index.d.ts b/typings/form/index.d.ts deleted file mode 100644 index bfd1a9e17..000000000 --- a/typings/form/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Form from './src/index'; -export default Form; diff --git a/typings/form/src/index.d.ts b/typings/form/src/index.d.ts deleted file mode 100644 index 8c4981625..000000000 --- a/typings/form/src/index.d.ts +++ /dev/null @@ -1,165 +0,0 @@ -declare const _default: import('vue').DefineComponent< - { - model: ObjectConstructor - rules: ObjectConstructor - inlineMessage: BooleanConstructor - statusIcon: BooleanConstructor - showMessage: { - type: BooleanConstructor - default: boolean - } - validateOnRuleChange: { - type: BooleanConstructor - default: boolean - } - validatePosition: { - type: StringConstructor - default: string - } - size: StringConstructor - disabled: BooleanConstructor - hideRequiredAsterisk: { - type: BooleanConstructor - default: boolean - } - labelPosition: { - type: StringConstructor - default: string - } - labelWidth: { - type: StringConstructor - default: string - } - labelAlign: { - type: BooleanConstructor - default: boolean - } - contentOffset: NumberConstructor - labelSuffix: { - type: StringConstructor - default: string - } - inline: { - type: BooleanConstructor - default: boolean - } - responsiveLayout: { - type: BooleanConstructor - default: boolean - } - validateType: { - type: StringConstructor - default: string - } - manual: { - type: BooleanConstructor - default: boolean - } - appendToBody: { - type: BooleanConstructor - default: boolean - } - popperOptions: { - type: ObjectConstructor - default: () => {} - } - }, - () => any, - unknown, - {}, - {}, - import('vue').ComponentOptionsMixin, - import('vue').ComponentOptionsMixin, - 'validate'[], - 'validate', - import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, - Readonly< - import('vue').ExtractPropTypes<{ - model: ObjectConstructor - rules: ObjectConstructor - inlineMessage: BooleanConstructor - statusIcon: BooleanConstructor - validateOnRuleChange: { - type: BooleanConstructor - default: boolean - } - showMessage: { - type: BooleanConstructor - default: boolean - } - validatePosition: { - type: StringConstructor - default: string - } - size: StringConstructor - disabled: BooleanConstructor - hideRequiredAsterisk: { - type: BooleanConstructor - default: boolean - } - labelPosition: { - type: StringConstructor - default: string - } - labelWidth: { - type: StringConstructor - default: string - } - labelAlign: { - type: BooleanConstructor - default: boolean - } - contentOffset: NumberConstructor - labelSuffix: { - type: StringConstructor - default: string - } - inline: { - type: BooleanConstructor - default: boolean - } - responsiveLayout: { - type: BooleanConstructor - default: boolean - } - validateType: { - type: StringConstructor - default: string - } - manual: { - type: BooleanConstructor - default: boolean - } - appendToBody: { - type: BooleanConstructor - default: boolean - } - popperOptions: { - type: ObjectConstructor - default: () => {} - } - }> - > & { - onValidate?: ((...args: any[]) => any) | undefined - }, - { - validatePosition: string - validateOnRuleChange: boolean - hideRequiredAsterisk: boolean - inlineMessage: boolean - statusIcon: boolean - labelPosition: string - labelAlign: boolean - showMessage: boolean - disabled: boolean - labelWidth: string - labelSuffix: string - inline: boolean - responsiveLayout: boolean - validateType: string - manual: boolean - appendToBody: boolean - popperOptions: Record - } -> -export default _default diff --git a/typings/form/src/mobile.vue.d.ts b/typings/form/src/mobile.vue.d.ts deleted file mode 100644 index ee1e54b47..000000000 --- a/typings/form/src/mobile.vue.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -import '@opentiny/vue-theme-mobile/form/index.css'; -import '@opentiny/vue-theme-mobile/form-item/index.css'; -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/form/src/pc.vue.d.ts b/typings/form/src/pc.vue.d.ts deleted file mode 100644 index 8c4a1f947..000000000 --- a/typings/form/src/pc.vue.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -import '@opentiny/vue-theme/form/index.css'; -import '@opentiny/vue-theme/form-item/index.css'; -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/fullscreen/index.d.ts b/typings/fullscreen/index.d.ts deleted file mode 100644 index 46f262992..000000000 --- a/typings/fullscreen/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Fullscreen from './src/index.vue'; -import '@opentiny/vue-theme/fullscreen/index.css'; -export default Fullscreen; diff --git a/typings/fullscreen/src/index.vue.d.ts b/typings/fullscreen/src/index.vue.d.ts deleted file mode 100644 index f5900fa0b..000000000 --- a/typings/fullscreen/src/index.vue.d.ts +++ /dev/null @@ -1,68 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - fullscreen: { - type: BooleanConstructor; - default: boolean; - }; - exitOnClickWrapper: { - type: BooleanConstructor; - default: boolean; - }; - fullscreenClass: { - type: StringConstructor; - default: string; - }; - pageOnly: { - type: BooleanConstructor; - default: boolean; - }; - teleport: { - type: BooleanConstructor; - default: boolean; - }; - zIndex: { - type: NumberConstructor; - default: number; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:fullscreen"[], "update:fullscreen", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - "onUpdate:fullscreen"?: ((...args: any[]) => any) | undefined; -}, { - fullscreen: boolean; - zIndex: number; - exitOnClickWrapper: boolean; - fullscreenClass: string; - pageOnly: boolean; - teleport: boolean; -}>; -export default _default; diff --git a/typings/grid-column/index.d.ts b/typings/grid-column/index.d.ts deleted file mode 100644 index 404311ac7..000000000 --- a/typings/grid-column/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import GridColumn from './src/index'; -export default GridColumn; diff --git a/typings/grid-column/src/index.d.ts b/typings/grid-column/src/index.d.ts deleted file mode 100644 index 8fd34b766..000000000 --- a/typings/grid-column/src/index.d.ts +++ /dev/null @@ -1,220 +0,0 @@ -declare const _default: import('vue').DefineComponent< - { - align: StringConstructor - className: (StringConstructor | FunctionConstructor)[] - editor: (ObjectConstructor | FunctionConstructor)[] - field: StringConstructor - filter: {} - filterMethod: FunctionConstructor - filterMultiple: { - type: BooleanConstructor - default: boolean - } - filterRender: ObjectConstructor - filters: ArrayConstructor - fixed: StringConstructor - footerAlign: StringConstructor - footerClassName: (StringConstructor | FunctionConstructor)[] - formatConfig: { - type: ObjectConstructor - default: () => { - data: never[] - } - } - formatText: (StringConstructor | FunctionConstructor)[] - formatValue: FunctionConstructor - group: { - type: BooleanConstructor - default: boolean - } - headerAlign: StringConstructor - headerClassName: (StringConstructor | FunctionConstructor)[] - indexMethod: FunctionConstructor - label: StringConstructor - minWidth: (StringConstructor | NumberConstructor)[] - params: ObjectConstructor - prop: StringConstructor - remoteSort: { - type: BooleanConstructor - default: null - } - renderer: (ObjectConstructor | FunctionConstructor)[] - required: { - type: BooleanConstructor - default: boolean - } - resizable: { - type: BooleanConstructor - default: null - } - rules: ObjectConstructor - showHeaderOverflow: { - type: (StringConstructor | BooleanConstructor)[] - default: null - } - showHeaderTip: { - type: BooleanConstructor - default: null - } - showIcon: { - type: BooleanConstructor - default: boolean - } - showOverflow: { - type: (StringConstructor | BooleanConstructor)[] - default: null - } - showTip: { - type: BooleanConstructor - default: null - } - sortBy: (ArrayConstructor | StringConstructor)[] - sortMethod: FunctionConstructor - sortable: { - type: BooleanConstructor - default: boolean - } - title: (StringConstructor | FunctionConstructor)[] - treeNode: BooleanConstructor - type: StringConstructor - width: (StringConstructor | NumberConstructor)[] - }, - any, - unknown, - {}, - { - createColumn($table: any, colProps: any): any - renderHeader(h: any, params: any): any - renderCell(h: any, params: any): any - renderTreeCell(h: any, params: any): any[] - renderTreeIcon(h: any, params: any): any[] - renderIndexHeader(h: any, params: any): any - renderTreeIndexCell(h: any, params: any): any[] - renderIndexCell(h: any, params: any): any - renderRadioHeader(h: any, params: any): any - renderRadioCell(h: any, params: any): any - renderTreeRadioCell(h: any, params: any): any[] - renderSelectionHeader(h: any, params: any): any - renderSelectionCell(h: any, params: any): any - renderTreeSelectionCell(h: any, params: any): any[] - renderSelectionCellByProp(h: any, params: any): any - renderTreeSelectionCellByProp(h: any, params: any): any[] - renderExpandCell(h: any, params: any): any[] - renderExpandData(h: any, params: any): any - renderSortAndFilterHeader(h: any, params: any): any - renderSortHeader(h: any, params: any): any - renderSortIcon(h: any, params: any): any[] - renderFilterHeader(h: any, params: any): any - renderFilterIcon(h: any, params: any, cls?: string): any[] - renderEditHeader(h: any, params: any): any[] - renderTreeRowEdit(h: any, params: any): any[] - renderRowEdit(h: any, params: any): any - renderTreeCellEdit(h: any, params: any): any[] - renderCellEdit(h: any, params: any): any - runRenderer(h: any, params: any, _vm: any, isEdit: any): any - getSuffixCls(params: any): string[] - }, - import('vue').ComponentOptionsMixin, - import('vue').ComponentOptionsMixin, - {}, - string, - import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, - Readonly< - import('vue').ExtractPropTypes<{ - align: StringConstructor - className: (StringConstructor | FunctionConstructor)[] - editor: (ObjectConstructor | FunctionConstructor)[] - field: StringConstructor - filter: {} - filterMethod: FunctionConstructor - filterMultiple: { - type: BooleanConstructor - default: boolean - } - filterRender: ObjectConstructor - filters: ArrayConstructor - fixed: StringConstructor - footerAlign: StringConstructor - footerClassName: (StringConstructor | FunctionConstructor)[] - formatConfig: { - type: ObjectConstructor - default: () => { - data: never[] - } - } - formatText: (StringConstructor | FunctionConstructor)[] - formatValue: FunctionConstructor - group: { - type: BooleanConstructor - default: boolean - } - headerAlign: StringConstructor - headerClassName: (StringConstructor | FunctionConstructor)[] - indexMethod: FunctionConstructor - label: StringConstructor - minWidth: (StringConstructor | NumberConstructor)[] - params: ObjectConstructor - prop: StringConstructor - remoteSort: { - type: BooleanConstructor - default: null - } - renderer: (ObjectConstructor | FunctionConstructor)[] - required: { - type: BooleanConstructor - default: boolean - } - resizable: { - type: BooleanConstructor - default: null - } - rules: ObjectConstructor - showHeaderOverflow: { - type: (StringConstructor | BooleanConstructor)[] - default: null - } - showHeaderTip: { - type: BooleanConstructor - default: null - } - showIcon: { - type: BooleanConstructor - default: boolean - } - showOverflow: { - type: (StringConstructor | BooleanConstructor)[] - default: null - } - showTip: { - type: BooleanConstructor - default: null - } - sortBy: (ArrayConstructor | StringConstructor)[] - sortMethod: FunctionConstructor - sortable: { - type: BooleanConstructor - default: boolean - } - title: (StringConstructor | FunctionConstructor)[] - treeNode: BooleanConstructor - type: StringConstructor - width: (StringConstructor | NumberConstructor)[] - }> - >, - { - formatConfig: Record - showHeaderTip: boolean - resizable: boolean - showHeaderOverflow: string | boolean - showOverflow: string | boolean - sortable: boolean - remoteSort: boolean - treeNode: boolean - showTip: boolean - filterMultiple: boolean - group: boolean - required: boolean - showIcon: boolean - } -> -export default _default diff --git a/typings/grid-manager/index.d.ts b/typings/grid-manager/index.d.ts deleted file mode 100644 index 86c99a1c9..000000000 --- a/typings/grid-manager/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import GridManager from './src/index'; -export default GridManager; diff --git a/typings/grid-manager/src/antd.d.ts b/typings/grid-manager/src/antd.d.ts deleted file mode 100644 index 399a90f26..000000000 --- a/typings/grid-manager/src/antd.d.ts +++ /dev/null @@ -1 +0,0 @@ -export default function (): void; diff --git a/typings/grid-manager/src/element-ui.d.ts b/typings/grid-manager/src/element-ui.d.ts deleted file mode 100644 index 399a90f26..000000000 --- a/typings/grid-manager/src/element-ui.d.ts +++ /dev/null @@ -1 +0,0 @@ -export default function (): void; diff --git a/typings/grid-manager/src/index.d.ts b/typings/grid-manager/src/index.d.ts deleted file mode 100644 index 13f61dfea..000000000 --- a/typings/grid-manager/src/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, {}>; -export default _default; diff --git a/typings/grid-manager/src/iview.d.ts b/typings/grid-manager/src/iview.d.ts deleted file mode 100644 index 399a90f26..000000000 --- a/typings/grid-manager/src/iview.d.ts +++ /dev/null @@ -1 +0,0 @@ -export default function (): void; diff --git a/typings/grid-toolbar/index.d.ts b/typings/grid-toolbar/index.d.ts deleted file mode 100644 index a4e59c757..000000000 --- a/typings/grid-toolbar/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import GridToolbar from './src/index'; -export default GridToolbar; diff --git a/typings/grid-toolbar/src/custom-switch.vue.d.ts b/typings/grid-toolbar/src/custom-switch.vue.d.ts deleted file mode 100644 index db14471ab..000000000 --- a/typings/grid-toolbar/src/custom-switch.vue.d.ts +++ /dev/null @@ -1,68 +0,0 @@ -declare const _default: { - name: string; - components: { - TinyButton: any; - TinySelect: any; - TinyInput: any; - TinyLayout: any; - TinyRow: any; - TinyCol: any; - TinyAlert: any; - TinyDialogBox: any; - }; - inject: { - $grid: { - default: null; - }; - }; - emits: string[]; - props: { - historyConfig: { - type: ObjectConstructor; - default: () => {}; - }; - }; - data(): { - IconSave: any; - IconEdit: any; - IconDel: any; - saveDisabled: boolean; - selectDisabled: boolean; - applyDisabled: boolean; - editDisabled: boolean; - delDisabled: boolean; - options: never[]; - option: null; - selected: null; - selectedName: null; - visible: boolean; - userKey: null; - status: null; - editName: null; - }; - computed: { - dialogTitle(): any; - }; - created(): void; - methods: { - t: any; - handleSave(): void; - handleSaveConfirm(flag: any): void; - handleApply(): void; - handleApplyConfirm(flag: any): void; - handleEdit(): void; - handleEditConfirm(flag: any): void; - handleDel(): void; - handleDelConfirm(flag: any): void; - doStorage(business: any, postOperate: any, noStore: any): void; - handleSelectChange(): void; - doCheck({ storageType }: { - storageType: any; - }): boolean; - setUserKey(): void; - setSelected(): void; - fixStatus(): void; - enableAll(): void; - }; -}; -export default _default; diff --git a/typings/grid-toolbar/src/custom.vue.d.ts b/typings/grid-toolbar/src/custom.vue.d.ts deleted file mode 100644 index fe4599958..000000000 --- a/typings/grid-toolbar/src/custom.vue.d.ts +++ /dev/null @@ -1,125 +0,0 @@ -declare const _default: { - components: { - TinyModal: any; - TinyButton: any; - TinyRadio: any; - TinyGrid: any; - TinyGridColumn: any; - TinySelect: any; - TinyOption: any; - IconEyeopen: any; - IconEyeclose: any; - IconUnlock: any; - IconLeftFrozen: any; - IconRightFrozen: any; - IconLock: any; - IconMinus: any; - IconDescending: any; - IconAscending: any; - IconHelp: any; - TinyCustomSwitch: any; - }; - name: string; - inject: { - $grid: { - default: null; - }; - }; - emits: string[]; - props: { - data: { - type: ArrayConstructor; - default(): never[]; - }; - other: { - type: BooleanConstructor; - default: boolean; - }; - initSettings: { - type: ObjectConstructor; - default(): { - pageSizes: number[]; - pageSize: number; - sortType: string; - showIndex: boolean; - }; - }; - value: BooleanConstructor; - sortable: FunctionConstructor; - rowClassName: (StringConstructor | FunctionConstructor)[]; - onBeforeMove: FunctionConstructor; - filter: StringConstructor; - refresh: BooleanConstructor; - keys: { - type: ArrayConstructor; - default: () => never[]; - }; - numberSorting: BooleanConstructor; - multipleHistory: (ObjectConstructor | BooleanConstructor)[]; - }; - data(): { - activeName: string; - animateShow: string; - constants: { - icon: { - asc: string; - desc: string; - left: string; - right: string; - }; - }; - columns: never[]; - fullColumn: never[]; - customColumns: { - field: string; - }[]; - settings: { - sortType: any; - pageSize: any; - columns: never[]; - }; - sortingOptions: never[]; - multipleHistoryId: null; - saveDisabled: boolean; - }; - created(): void; - watch: { - value(): void; - data: { - handler(val: any): void; - }; - activeName: { - handler(val: any): void; - }; - }; - computed: { - visible: { - get(): any; - set(): void; - }; - showFixed(): any; - tinyTable(): any; - isGroup(): any; - historyConfig(): any; - }; - methods: { - t: any; - getColumnConfigs(configs: any): any; - initNumberSorting(columns: any): void; - handelNumberSorting(sort: any, row: any): void; - handleRowDropEnd(): void; - renderNumberSorting(h: any, { row }: { - row: any; - }): JSX.Element; - handleCustomMouseMove(): void; - handleInput(val: any): void; - handleFixed(column: any): void; - handlerSetting(type: any, column: any): void; - buildSettings(): any; - saveSettings(): void; - resetSettings(event: any): void; - cancelSettings(): void; - handleClose(): void; - }; -}; -export default _default; diff --git a/typings/grid-toolbar/src/index.d.ts b/typings/grid-toolbar/src/index.d.ts deleted file mode 100644 index 9b6925daf..000000000 --- a/typings/grid-toolbar/src/index.d.ts +++ /dev/null @@ -1,171 +0,0 @@ -declare const _default: import('vue').DefineComponent< - { - id: StringConstructor - loading: { - type: BooleanConstructor - default: boolean - } - resizable: { - type: (ObjectConstructor | BooleanConstructor)[] - default: () => any - } - refresh: { - type: (ObjectConstructor | BooleanConstructor)[] - default: () => any - } - setting: { - type: (ObjectConstructor | BooleanConstructor)[] - default: () => any - } - fullScreen: { - type: BooleanConstructor - default: boolean - } - buttons: { - type: ArrayConstructor - default: () => any - } - size: StringConstructor - data: ArrayConstructor - customs: ArrayConstructor - beforeOpenFullScreen: FunctionConstructor - beforeCloseFullScreen: FunctionConstructor - }, - { - slots: Readonly<{ - [name: string]: import('vue').Slot | undefined - }> - tableListeners: any - }, - { - table: null - isRefresh: boolean - tableFullColumn: never[] - initSettings: { - pageSizes: never[] - pageSize: number - sortType: string - showIndex: boolean - multipleHistory: { - tableMaxHeight: string - showTitle: boolean - title: string - showSave: boolean - saveDisabled: boolean - saveText: string - labelText: string - selectPlaceholder: string - selectDisabled: boolean - showApply: boolean - applyDisabled: boolean - applyTitle: string - applyIcon: null - showEdit: boolean - editDisabled: boolean - editTitle: string - editIcon: null - showDel: boolean - delDisabled: boolean - delTitle: string - delIcon: null - storageKey: string - remoteMethod: null - userKey: string - remoteSelectedMethod: null - } - } - settingStore: { - visible: boolean - customVisible: boolean - } - isFull: boolean - }, - { - vSize(): any - refreshOpts(): any - resizableOpts(): any - settingOpts(): any - }, - { - updateConf(): void - closeSetting(): void - openSetting(): void - orderSetting(): any - loadColWidth(): {} | undefined - loadStorage(): void - updateColumn(fullColumn: any): void - updateCustoms(customs: any): void - getStorageMap(key: any): any - saveCustomSettings(columnConfigs: any): Promise - savePagerSettings(settingConfigs: any): Promise - saveColumnHide(): Promise - saveColumnWidth(isReset: any): Promise - resetResizable(): void - updateResizable(isReset: any): any - updateSetting(): Promise - applySettings({ columns, pageSize }: { columns: any; pageSize: any }): void - handleSaveSettings(settingConfigs: any): void - handleGlobalMousedownEvent(event: any): void - handleGlobalBlurEvent(): void - handleClickSettingEvent(): void - handleClickCustomEvent(): void - handleMouseenterSettingEvent(): void - handleMouseleaveSettingEvent(): void - handleWrapperMouseenterEvent(): void - handleWrapperMouseleaveEvent(): void - refreshEvent(): void - btnEvent(event: any, item: any): void - fullscreenEvent(): void - }, - import('vue').ComponentOptionsMixin, - import('vue').ComponentOptionsMixin, - ('button-click' | 'on-before-move')[], - 'button-click' | 'on-before-move', - import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, - Readonly< - import('vue').ExtractPropTypes<{ - id: StringConstructor - loading: { - type: BooleanConstructor - default: boolean - } - resizable: { - type: (ObjectConstructor | BooleanConstructor)[] - default: () => any - } - refresh: { - type: (ObjectConstructor | BooleanConstructor)[] - default: () => any - } - setting: { - type: (ObjectConstructor | BooleanConstructor)[] - default: () => any - } - fullScreen: { - type: BooleanConstructor - default: boolean - } - buttons: { - type: ArrayConstructor - default: () => any - } - size: StringConstructor - data: ArrayConstructor - customs: ArrayConstructor - beforeOpenFullScreen: FunctionConstructor - beforeCloseFullScreen: FunctionConstructor - }> - > & { - 'onButton-click'?: ((...args: any[]) => any) | undefined - 'onOn-before-move'?: ((...args: any[]) => any) | undefined - }, - { - setting: boolean | Record - buttons: unknown[] - loading: boolean - resizable: boolean | Record - refresh: boolean | Record - fullScreen: boolean - } -> -export default _default diff --git a/typings/grid-toolbar/src/multiple-history.d.ts b/typings/grid-toolbar/src/multiple-history.d.ts deleted file mode 100644 index 7eeafda71..000000000 --- a/typings/grid-toolbar/src/multiple-history.d.ts +++ /dev/null @@ -1,15 +0,0 @@ -export declare function getStorage(storageKey: any, storageType: any, remoteMethod: any): Promise; -export declare function setStorage(storageKey: any, valueObj: any, storageType: any, vm: any, eventName: any): void; -export declare function generateId(): { - id: string; - name: any; -}; -export declare function createCustom(setting: any, userKey: any): { - id: string; - name: any; - userKey: any; - setting: { - custom: any; - }; -}; -export declare function mergeArray(toArr: any, fromArr: any): any[]; diff --git a/typings/grid/index.d.ts b/typings/grid/index.d.ts deleted file mode 100644 index ef4526f8b..000000000 --- a/typings/grid/index.d.ts +++ /dev/null @@ -1,10 +0,0 @@ -import '@opentiny/vue-theme/grid/index.css'; -import GridAdapter from './src/adapter'; -import GridColumn from './src/column'; -import Grid from './src'; -import GridConfig from './src/config'; -import GridRadio from './src/radio'; -import GridButton from './src/button'; -import * as GridTools from './src/tools'; -export default Grid; -export { GridColumn, GridConfig, GridAdapter, GridRadio, GridButton, GridTools }; diff --git a/typings/grid/src/adapter/index.d.ts b/typings/grid/src/adapter/index.d.ts deleted file mode 100644 index d7f9073b8..000000000 --- a/typings/grid/src/adapter/index.d.ts +++ /dev/null @@ -1,26 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import { Interceptor } from '@opentiny/vue-renderless/grid/core'; -import Renderer from './src/renderer'; -declare const Buttons: any; -declare const Menus: any; -export declare const Grid: { - use(Plugin: any, options: any): any; - setup: (options?: {}) => void; - interceptor: any; - renderer: {}; - buttons: any; - menus: any; - _tooltip: boolean; -}; -export { Menus, Buttons, Interceptor, Renderer }; -export default Grid; diff --git a/typings/grid/src/adapter/src/renderer.d.ts b/typings/grid/src/adapter/src/renderer.d.ts deleted file mode 100644 index 11efa8f0f..000000000 --- a/typings/grid/src/adapter/src/renderer.d.ts +++ /dev/null @@ -1,5 +0,0 @@ -/** - * 全局渲染器 - */ -export declare const Renderer: {}; -export default Renderer; diff --git a/typings/grid/src/adapter/src/setup.d.ts b/typings/grid/src/adapter/src/setup.d.ts deleted file mode 100644 index b6533df09..000000000 --- a/typings/grid/src/adapter/src/setup.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const setup: (options?: {}) => void; -export default setup; diff --git a/typings/grid/src/body/index.d.ts b/typings/grid/src/body/index.d.ts deleted file mode 100644 index f7971a10f..000000000 --- a/typings/grid/src/body/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Body from './src/body'; -export default Body; diff --git a/typings/grid/src/button/index.d.ts b/typings/grid/src/button/index.d.ts deleted file mode 100644 index 9047943a7..000000000 --- a/typings/grid/src/button/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import Button from './src/button'; -export default Button; diff --git a/typings/grid/src/button/src/button.d.ts b/typings/grid/src/button/src/button.d.ts deleted file mode 100644 index bbf43dbc2..000000000 --- a/typings/grid/src/button/src/button.d.ts +++ /dev/null @@ -1,29 +0,0 @@ -declare const _default: { - name: string; - inheritAttrs: boolean; - props: { - type: StringConstructor; - size: StringConstructor; - name: (StringConstructor | NumberConstructor)[]; - disabled: BooleanConstructor; - loading: BooleanConstructor; - }; - computed: { - vSize(): any; - }; - render(): any; - methods: { - clickDropdownEvent(event: any): void; - mouseenterEvent(event: any): void; - mouseleaveEvent(event: any): void; - }; - setup(props: any, { slots, attrs, listeners }: { - slots: any; - attrs: any; - listeners: any; - }): { - slots: any; - tableListeners: any; - }; -}; -export default _default; diff --git a/typings/grid/src/cell/index.d.ts b/typings/grid/src/cell/index.d.ts deleted file mode 100644 index cc655f2eb..000000000 --- a/typings/grid/src/cell/index.d.ts +++ /dev/null @@ -1,45 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import CellDefault from './src/cell'; -export declare const Cell: { - createColumn($table: any, colProps: any): any; - renderHeader(h: any, params: any): any; - renderCell(h: any, params: any): any; - renderTreeCell(h: any, params: any): any[]; - renderTreeIcon(h: any, params: any): any[]; - renderIndexHeader(h: any, params: any): any; - renderTreeIndexCell(h: any, params: any): any[]; - renderIndexCell(h: any, params: any): any; - renderRadioHeader(h: any, params: any): any; - renderRadioCell(h: any, params: any): any; - renderTreeRadioCell(h: any, params: any): any[]; - renderSelectionHeader(h: any, params: any): any; - renderSelectionCell(h: any, params: any): any; - renderTreeSelectionCell(h: any, params: any): any[]; - renderSelectionCellByProp(h: any, params: any): any; - renderTreeSelectionCellByProp(h: any, params: any): any[]; - renderExpandCell(h: any, params: any): any[]; - renderExpandData(h: any, params: any): any; - renderSortAndFilterHeader(h: any, params: any): any; - renderSortHeader(h: any, params: any): any; - renderSortIcon(h: any, params: any): any[]; - renderFilterHeader(h: any, params: any): any; - renderFilterIcon(h: any, params: any, cls?: string): any[]; - renderEditHeader(h: any, params: any): any[]; - renderTreeRowEdit(h: any, params: any): any[]; - renderRowEdit(h: any, params: any): any; - renderTreeCellEdit(h: any, params: any): any[]; - renderCellEdit(h: any, params: any): any; - runRenderer(h: any, params: any, _vm: any, isEdit: any): any; - getSuffixCls(params: any): string[]; -}; -export default CellDefault; diff --git a/typings/grid/src/cell/src/cell.d.ts b/typings/grid/src/cell/src/cell.d.ts deleted file mode 100644 index a974f3583..000000000 --- a/typings/grid/src/cell/src/cell.d.ts +++ /dev/null @@ -1,33 +0,0 @@ -export declare const Cell: { - createColumn($table: any, colProps: any): any; - renderHeader(h: any, params: any): any; - renderCell(h: any, params: any): any; - renderTreeCell(h: any, params: any): any[]; - renderTreeIcon(h: any, params: any): any[]; - renderIndexHeader(h: any, params: any): any; - renderTreeIndexCell(h: any, params: any): any[]; - renderIndexCell(h: any, params: any): any; - renderRadioHeader(h: any, params: any): any; - renderRadioCell(h: any, params: any): any; - renderTreeRadioCell(h: any, params: any): any[]; - renderSelectionHeader(h: any, params: any): any; - renderSelectionCell(h: any, params: any): any; - renderTreeSelectionCell(h: any, params: any): any[]; - renderSelectionCellByProp(h: any, params: any): any; - renderTreeSelectionCellByProp(h: any, params: any): any[]; - renderExpandCell(h: any, params: any): any[]; - renderExpandData(h: any, params: any): any; - renderSortAndFilterHeader(h: any, params: any): any; - renderSortHeader(h: any, params: any): any; - renderSortIcon(h: any, params: any): any[]; - renderFilterHeader(h: any, params: any): any; - renderFilterIcon(h: any, params: any, cls?: string): any[]; - renderEditHeader(h: any, params: any): any[]; - renderTreeRowEdit(h: any, params: any): any[]; - renderRowEdit(h: any, params: any): any; - renderTreeCellEdit(h: any, params: any): any[]; - renderCellEdit(h: any, params: any): any; - runRenderer(h: any, params: any, _vm: any, isEdit: any): any; - getSuffixCls(params: any): string[]; -}; -export default Cell; diff --git a/typings/grid/src/column/index.d.ts b/typings/grid/src/column/index.d.ts deleted file mode 100644 index 0c0346c4c..000000000 --- a/typings/grid/src/column/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any -export default _default diff --git a/typings/grid/src/config.d.ts b/typings/grid/src/config.d.ts deleted file mode 100644 index 7a5f3b32a..000000000 --- a/typings/grid/src/config.d.ts +++ /dev/null @@ -1,87 +0,0 @@ -declare const GlobalConfig: { - validConfig: { - message: string; - }; - sortConfig: {}; - stripe: boolean; - highlightHoverRow: boolean; - resizable: boolean; - fit: boolean; - showHeader: boolean; - defaultTreeIndent: number; - defaultTreeSpacing: number; - rowId: string; - version: number; - optimization: { - animat: boolean; - delayHover: number; - scrollX: { - gt: number; - }; - scrollY: { - gt: number; - }; - }; - icon: { - sortAsc: any; - sortDesc: any; - sortDefault: any; - required: string; - filter: any; - edit: any; - tree: string; - refresh: any; - minscreen: any; - fullscreen: any; - custom: any; - jumpPrev: string; - jumpNext: string; - prevPage: string; - nextPage: string; - zoomIn: string; - zoomOut: string; - modalClose: string; - modalInfo: string; - modalSuccess: string; - modalWarning: string; - modalError: string; - modalQuestion: string; - modalLoading: string; - caretBottom: string; - dropdownBottom: string; - btnLoading: string; - }; - grid: {}; - menu: {}; - tooltip: { - trigger: string; - theme: string; - }; - pager: {}; - toolbar: { - resizable: { - storage: boolean; - }; - buttons: never[]; - }; - modal: { - zIndex: number; - minWidth: number; - minHeight: number; - lockView: boolean; - mask: boolean; - duration: number; - marginSize: number; - animat: boolean; - }; - i18n: (key: any) => any; - constant: { - insertedField: string; - deletedField: string; - asyncPrefix: string; - }; - TINY_TABLE_CUSTOM_COLUMN_WIDTH: string; - TINY_TABLE_CUSTOM_SETTING: string; -}; -export default GlobalConfig; -export declare const prefix = "tiny-grid"; diff --git a/typings/grid/src/edit/index.d.ts b/typings/grid/src/edit/index.d.ts deleted file mode 100644 index f16ef6a4a..000000000 --- a/typings/grid/src/edit/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -declare const _default: { - install(Table: any): void; -}; -export default _default; diff --git a/typings/grid/src/edit/src/methods.d.ts b/typings/grid/src/edit/src/methods.d.ts deleted file mode 100644 index 86150b9b0..000000000 --- a/typings/grid/src/edit/src/methods.d.ts +++ /dev/null @@ -1,74 +0,0 @@ -declare const _default: { - _insert(data: any): any; - _insertAt(records: any, row: any): any; - /** - * 删除指定行数据 - * 如果传 row 则删除一行 - * 如果传 rows 则删除多行 - */ - _remove(rows: any): any; - /** - * 删除选中数据 - */ - _removeSelecteds(): any; - _revert(...args: any[]): any; - /** - * 对数据进行还原 - * 如果不传任何参数,则还原整个表格; - * 如果传row则还原一行; - * 如果传rows则还原多行; - * 如果还额外传了field则还原指定单元格。 - */ - _revertData(rows: any, field: any): any; - /** - * 获取表格操作数据集 - */ - _getRecordset(): {}; - /** - * 获取删除数据列表 - */ - _getRemoveRecords(): any; - /** - * 获取新增数据列表 - */ - _getInsertRecords(): any; - /** - * 获取更新数据列表 - * 只精准匹配row的更改。如果是树表格,子节点更改状态不会影响父节点的更新状态 - */ - _getUpdateRecords(): any; - /** - * 处理激活编辑 - */ - handleActived(params: any, event: any): any; - _getColumnModel(row: any, column: any): void; - _setColumnModel(row: any, column: any): void; - _getActiveRow(): any; - /** - * 清除已激活的编辑 - */ - _clearActived(event: any): any; - _hasActiveRow(row: any): boolean; - /** - * 处理聚焦 - */ - handleFocus(params: any): void; - /** - * 激活单元格编辑 - */ - _setActiveCell: (row: any, field: any) => any; - /** - * 激活行编辑 - */ - _setActiveRow(row: any): any; - /** - * 只对trigger为dblclick有效,选中单元格 - */ - _setSelectCell(row: any, field: any): any; - updateSelectedCls(clear: any): void; - /** - * 处理选中源 - */ - handleSelected(params: any, event: any): any; -}; -export default _default; diff --git a/typings/grid/src/edit/src/utils/handleActived.d.ts b/typings/grid/src/edit/src/utils/handleActived.d.ts deleted file mode 100644 index 55f523a37..000000000 --- a/typings/grid/src/edit/src/utils/handleActived.d.ts +++ /dev/null @@ -1,39 +0,0 @@ -export declare function handleActivedCheckCell({ actived, column, editConfig, row }: { - actived: any; - column: any; - editConfig: any; - row: any; -}): boolean; -export declare function handleActivedCanActive({ editConfig, params }: { - editConfig: any; - params: any; -}): any; -export declare function handleActivedDoActive({ _vm, actived, canActive, cell, column, editConfig, event, params, row, tableColumn, type }: { - _vm: any; - actived: any; - canActive: any; - cell: any; - column: any; - editConfig: any; - event: any; - params: any; - row: any; - tableColumn: any; - type: any; -}): any; -export declare function handleActivedClearActive({ _vm, canActive, event }: { - _vm: any; - canActive: any; - event: any; -}): void; -export declare function handleActivedTryActive({ _vm, actived, cell, column, editor, event, isActiveCell, params, row }: { - _vm: any; - actived: any; - cell: any; - column: any; - editor: any; - event: any; - isActiveCell: any; - params: any; - row: any; -}): void; diff --git a/typings/grid/src/export/index.d.ts b/typings/grid/src/export/index.d.ts deleted file mode 100644 index f16ef6a4a..000000000 --- a/typings/grid/src/export/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -declare const _default: { - install(Table: any): void; -}; -export default _default; diff --git a/typings/grid/src/filter/index.d.ts b/typings/grid/src/filter/index.d.ts deleted file mode 100644 index 261db6780..000000000 --- a/typings/grid/src/filter/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import Panel from './src/panel'; -export default Panel; diff --git a/typings/grid/src/filter/src/methods.d.ts b/typings/grid/src/filter/src/methods.d.ts deleted file mode 100644 index c27542d32..000000000 --- a/typings/grid/src/filter/src/methods.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -declare const _default: { - filter(field: any, callback: any): any; - getOptions({ property, filter }: { - property: any; - filter: any; - }): any; - /** - * 点击筛选事件 - */ - triggerFilterEvent(event: any, column: any, params: any): void; - confirmFilterEvent(): void; - clearFilter(field: any): any; -}; -export default _default; diff --git a/typings/grid/src/footer/index.d.ts b/typings/grid/src/footer/index.d.ts deleted file mode 100644 index 412793071..000000000 --- a/typings/grid/src/footer/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Footer from './src/footer'; -export default Footer; diff --git a/typings/grid/src/footer/src/footer.d.ts b/typings/grid/src/footer/src/footer.d.ts deleted file mode 100644 index 109468c7f..000000000 --- a/typings/grid/src/footer/src/footer.d.ts +++ /dev/null @@ -1,36 +0,0 @@ -declare const _default: { - name: string; - props: { - fixedColumn: ArrayConstructor; - fixedType: StringConstructor; - footerData: ArrayConstructor; - size: StringConstructor; - tableColumn: ArrayConstructor; - visibleColumn: ArrayConstructor; - }; - mounted(): void; - render(): any; - methods: { - scrollEvent(event: any): void; - buildParamFunc(opt: any): { - attrs: { - 'data-colid': any; - }; - columnIndex: any; - fixedHiddenColumn: any; - footAlign: any; - footerClassName: any; - hasEllipsis: boolean; - params: { - $table: any; - $rowIndex: any; - column: any; - columnIndex: any; - $columnIndex: any; - fixed: any; - }; - tfOns: {}; - }; - }; -}; -export default _default; diff --git a/typings/grid/src/grid/grid.d.ts b/typings/grid/src/grid/grid.d.ts deleted file mode 100644 index fe0789b50..000000000 --- a/typings/grid/src/grid/grid.d.ts +++ /dev/null @@ -1,518 +0,0 @@ -declare const _default: import('vue').DefineComponent< - { - isBeforePageChange: BooleanConstructor - showSaveMsg: { - type: BooleanConstructor - default: boolean - } - isMultipleHistory: BooleanConstructor - selectToolbar: (ObjectConstructor | BooleanConstructor)[] - align: { - type: StringConstructor - default: () => any - } - autoResize: BooleanConstructor - border: { - type: BooleanConstructor - default: () => any - } - cellClassName: (StringConstructor | FunctionConstructor)[] - columnKey: BooleanConstructor - columnMinWidth: (StringConstructor | NumberConstructor)[] - columnWidth: (StringConstructor | NumberConstructor)[] - contextMenu: ObjectConstructor - customs: ArrayConstructor - data: (ArrayConstructor | ObjectConstructor)[] - dropConfig: ObjectConstructor - editConfig: (ObjectConstructor | BooleanConstructor)[] - editRules: ObjectConstructor - expandConfig: ObjectConstructor - fit: { - type: BooleanConstructor - default: () => boolean - } - footerAlign: { - type: StringConstructor - default: () => any - } - footerCellClassName: (StringConstructor | FunctionConstructor)[] - footerMethod: FunctionConstructor - footerRowClassName: (StringConstructor | FunctionConstructor)[] - footerSpanMethod: FunctionConstructor - headerAlign: { - type: StringConstructor - default: () => any - } - headerCellClassName: (StringConstructor | FunctionConstructor)[] - headerRowClassName: (StringConstructor | FunctionConstructor)[] - headerSuffixIconAbsolute: BooleanConstructor - height: (StringConstructor | NumberConstructor)[] - highlightCell: BooleanConstructor - highlightCurrentColumn: { - type: BooleanConstructor - default: () => any - } - highlightCurrentRow: { - type: BooleanConstructor - default: () => any - } - highlightHoverColumn: { - type: BooleanConstructor - default: () => any - } - highlightHoverRow: { - type: BooleanConstructor - default: () => boolean - } - isAsyncColumn: BooleanConstructor - isCenterEmpty: BooleanConstructor - isDragHeaderSorting: BooleanConstructor - keyboardConfig: ObjectConstructor - loading: BooleanConstructor - loadingComponent: ObjectConstructor - maxHeight: (StringConstructor | NumberConstructor)[] - minHeight: (StringConstructor | NumberConstructor)[] - mouseConfig: ObjectConstructor - optimization: ObjectConstructor - params: ObjectConstructor - radioConfig: ObjectConstructor - remoteFilter: BooleanConstructor - remoteSort: BooleanConstructor - renderEmpty: FunctionConstructor - renderRowAfter: FunctionConstructor - resizable: { - type: BooleanConstructor - default: () => boolean - } - rowClassName: (StringConstructor | FunctionConstructor)[] - rowGroup: ObjectConstructor - rowId: { - type: StringConstructor - default: () => string - } - rowKey: BooleanConstructor - rowSpan: ArrayConstructor - scrollLoad: ObjectConstructor - selectConfig: ObjectConstructor - showFooter: BooleanConstructor - showHeader: { - type: BooleanConstructor - default: () => boolean - } - showHeaderOverflow: { - type: (StringConstructor | BooleanConstructor)[] - default: () => any - } - showOverflow: { - type: (StringConstructor | BooleanConstructor)[] - default: () => any - } - size: { - type: StringConstructor - default: () => any - } - sortConfig: ObjectConstructor - sortMethod: FunctionConstructor - sortable: { - type: BooleanConstructor - default: boolean - } - spanMethod: FunctionConstructor - startIndex: { - type: NumberConstructor - default: number - } - stripe: { - type: BooleanConstructor - default: () => boolean - } - summaryConfig: ObjectConstructor - syncResize: BooleanConstructor - tableLayout: StringConstructor - tooltipConfig: { - type: ObjectConstructor - default: () => {} - } - treeConfig: ObjectConstructor - validConfig: ObjectConstructor - columns: ArrayConstructor - proxyConfig: ObjectConstructor - fetchData: ObjectConstructor - saveData: ObjectConstructor - deleteData: ObjectConstructor - toolbar: ObjectConstructor - pager: ObjectConstructor - dataset: ObjectConstructor - autoLoad: { - type: BooleanConstructor - default: boolean - } - seqSerial: { - type: BooleanConstructor - default: boolean - } - events: ObjectConstructor - }, - { - slots: Readonly<{ - [name: string]: import('vue').Slot | undefined - }> - tableListeners: any - }, - { - emitter: any - fetchOption: null - filterData: never[] - listeners: {} - pagerConfig: null - pendingRecords: never[] - seqIndex: number - sortData: {} - tableCustoms: never[] - tableData: never[] - tableLoading: boolean - tablePage: { - total: number - pageSize: number - currentPage: number - } - toolBarVm: null - }, - { - isMsg(): boolean - tableProps(): {} - proxyOpts(): any - vSize(): any - }, - { - initPagerConfig(): any - initFetchOption(): - | { - api: any - dataset: Record - fields: any - loading: any - } - | undefined - getParentHeight(): number - handleRowClassName(params: any): string[] - handleActiveMethod(params: any): any - handleFetch(code: any, sortArg: any): any - loadFetchData(rest: any): void - handleSave(code: any, args: any): Promise | undefined - handleDelete(code: any, args: any): void - handleFullScreen([show]: [any]): void - commitProxy(code: any): Promise - handleDeleteRow(code: any, i18nKey: any, callback: any): void - getPendingRecords(): never[] - triggerToolbarBtnEvent(button: any, event: any): void - triggerPendingEvent(code: any): void - pageChangeEvent(params: any): void - pageSizeChange(size: any, load: any): void - pageCurrentChange(current: any): void - beforePageChangeHandler(params: any): void - sortChangeEvent(params: any): void - filterChangeEvent(params: any): void - }, - import('vue').ComponentOptionsMixin, - import('vue').ComponentOptionsMixin, - ( - | 'header-cell-dblclick' - | 'header-cell-click' - | 'resizable-change' - | 'footer-cell-dblclick' - | 'footer-cell-click' - | 'scroll' - | 'filter-change' - | 'context-menu-click' - | 'select-change' - | 'select-all' - | 'radio-change' - | 'current-change' - | 'cell-click' - | 'cell-dblclick' - | 'sort-change' - | 'toggle-expand-change' - | 'toggle-tree-change' - | 'page-change' - | 'before-page-change' - | 'toolbar-button-click' - | 'cancel-page-change' - | 'cell-context-menu' - | 'cell-mouseenter' - | 'cell-mouseleave' - | 'edit-actived' - | 'edit-closed' - | 'edit-disabled' - | 'footer-cell-context-menu' - | 'header-cell-context-menu' - | 'valid-error' - | 'BeforeEdit' - | 'CellClick' - | 'fullscreen' - )[], - | 'header-cell-dblclick' - | 'header-cell-click' - | 'resizable-change' - | 'footer-cell-dblclick' - | 'footer-cell-click' - | 'scroll' - | 'filter-change' - | 'context-menu-click' - | 'select-change' - | 'select-all' - | 'radio-change' - | 'current-change' - | 'cell-click' - | 'cell-dblclick' - | 'sort-change' - | 'toggle-expand-change' - | 'toggle-tree-change' - | 'page-change' - | 'before-page-change' - | 'toolbar-button-click' - | 'cancel-page-change' - | 'cell-context-menu' - | 'cell-mouseenter' - | 'cell-mouseleave' - | 'edit-actived' - | 'edit-closed' - | 'edit-disabled' - | 'footer-cell-context-menu' - | 'header-cell-context-menu' - | 'valid-error' - | 'BeforeEdit' - | 'CellClick' - | 'fullscreen', - import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, - Readonly< - import('vue').ExtractPropTypes<{ - isBeforePageChange: BooleanConstructor - showSaveMsg: { - type: BooleanConstructor - default: boolean - } - isMultipleHistory: BooleanConstructor - selectToolbar: (ObjectConstructor | BooleanConstructor)[] - align: { - type: StringConstructor - default: () => any - } - autoResize: BooleanConstructor - border: { - type: BooleanConstructor - default: () => any - } - cellClassName: (StringConstructor | FunctionConstructor)[] - columnKey: BooleanConstructor - columnMinWidth: (StringConstructor | NumberConstructor)[] - columnWidth: (StringConstructor | NumberConstructor)[] - contextMenu: ObjectConstructor - customs: ArrayConstructor - data: (ArrayConstructor | ObjectConstructor)[] - dropConfig: ObjectConstructor - editConfig: (ObjectConstructor | BooleanConstructor)[] - editRules: ObjectConstructor - expandConfig: ObjectConstructor - fit: { - type: BooleanConstructor - default: () => boolean - } - footerAlign: { - type: StringConstructor - default: () => any - } - footerCellClassName: (StringConstructor | FunctionConstructor)[] - footerMethod: FunctionConstructor - footerRowClassName: (StringConstructor | FunctionConstructor)[] - footerSpanMethod: FunctionConstructor - headerAlign: { - type: StringConstructor - default: () => any - } - headerCellClassName: (StringConstructor | FunctionConstructor)[] - headerRowClassName: (StringConstructor | FunctionConstructor)[] - headerSuffixIconAbsolute: BooleanConstructor - height: (StringConstructor | NumberConstructor)[] - highlightCell: BooleanConstructor - highlightCurrentColumn: { - type: BooleanConstructor - default: () => any - } - highlightCurrentRow: { - type: BooleanConstructor - default: () => any - } - highlightHoverColumn: { - type: BooleanConstructor - default: () => any - } - highlightHoverRow: { - type: BooleanConstructor - default: () => boolean - } - isAsyncColumn: BooleanConstructor - isCenterEmpty: BooleanConstructor - isDragHeaderSorting: BooleanConstructor - keyboardConfig: ObjectConstructor - loading: BooleanConstructor - loadingComponent: ObjectConstructor - maxHeight: (StringConstructor | NumberConstructor)[] - minHeight: (StringConstructor | NumberConstructor)[] - mouseConfig: ObjectConstructor - optimization: ObjectConstructor - params: ObjectConstructor - radioConfig: ObjectConstructor - remoteFilter: BooleanConstructor - remoteSort: BooleanConstructor - renderEmpty: FunctionConstructor - renderRowAfter: FunctionConstructor - resizable: { - type: BooleanConstructor - default: () => boolean - } - rowClassName: (StringConstructor | FunctionConstructor)[] - rowGroup: ObjectConstructor - rowId: { - type: StringConstructor - default: () => string - } - rowKey: BooleanConstructor - rowSpan: ArrayConstructor - scrollLoad: ObjectConstructor - selectConfig: ObjectConstructor - showFooter: BooleanConstructor - showHeader: { - type: BooleanConstructor - default: () => boolean - } - showHeaderOverflow: { - type: (StringConstructor | BooleanConstructor)[] - default: () => any - } - showOverflow: { - type: (StringConstructor | BooleanConstructor)[] - default: () => any - } - size: { - type: StringConstructor - default: () => any - } - sortConfig: ObjectConstructor - sortMethod: FunctionConstructor - sortable: { - type: BooleanConstructor - default: boolean - } - spanMethod: FunctionConstructor - startIndex: { - type: NumberConstructor - default: number - } - stripe: { - type: BooleanConstructor - default: () => boolean - } - summaryConfig: ObjectConstructor - syncResize: BooleanConstructor - tableLayout: StringConstructor - tooltipConfig: { - type: ObjectConstructor - default: () => {} - } - treeConfig: ObjectConstructor - validConfig: ObjectConstructor - columns: ArrayConstructor - proxyConfig: ObjectConstructor - fetchData: ObjectConstructor - saveData: ObjectConstructor - deleteData: ObjectConstructor - toolbar: ObjectConstructor - pager: ObjectConstructor - dataset: ObjectConstructor - autoLoad: { - type: BooleanConstructor - default: boolean - } - seqSerial: { - type: BooleanConstructor - default: boolean - } - events: ObjectConstructor - }> - > & { - onBeforeEdit?: ((...args: any[]) => any) | undefined - onCellClick?: ((...args: any[]) => any) | undefined - 'onHeader-cell-dblclick'?: ((...args: any[]) => any) | undefined - 'onHeader-cell-click'?: ((...args: any[]) => any) | undefined - 'onResizable-change'?: ((...args: any[]) => any) | undefined - 'onFooter-cell-dblclick'?: ((...args: any[]) => any) | undefined - 'onFooter-cell-click'?: ((...args: any[]) => any) | undefined - onScroll?: ((...args: any[]) => any) | undefined - 'onFilter-change'?: ((...args: any[]) => any) | undefined - 'onContext-menu-click'?: ((...args: any[]) => any) | undefined - 'onSelect-change'?: ((...args: any[]) => any) | undefined - 'onSelect-all'?: ((...args: any[]) => any) | undefined - 'onRadio-change'?: ((...args: any[]) => any) | undefined - 'onCurrent-change'?: ((...args: any[]) => any) | undefined - 'onCell-click'?: ((...args: any[]) => any) | undefined - 'onCell-dblclick'?: ((...args: any[]) => any) | undefined - 'onSort-change'?: ((...args: any[]) => any) | undefined - 'onToggle-expand-change'?: ((...args: any[]) => any) | undefined - 'onToggle-tree-change'?: ((...args: any[]) => any) | undefined - 'onPage-change'?: ((...args: any[]) => any) | undefined - 'onBefore-page-change'?: ((...args: any[]) => any) | undefined - 'onToolbar-button-click'?: ((...args: any[]) => any) | undefined - 'onCancel-page-change'?: ((...args: any[]) => any) | undefined - 'onCell-context-menu'?: ((...args: any[]) => any) | undefined - 'onCell-mouseenter'?: ((...args: any[]) => any) | undefined - 'onCell-mouseleave'?: ((...args: any[]) => any) | undefined - 'onEdit-actived'?: ((...args: any[]) => any) | undefined - 'onEdit-closed'?: ((...args: any[]) => any) | undefined - 'onEdit-disabled'?: ((...args: any[]) => any) | undefined - 'onFooter-cell-context-menu'?: ((...args: any[]) => any) | undefined - 'onHeader-cell-context-menu'?: ((...args: any[]) => any) | undefined - 'onValid-error'?: ((...args: any[]) => any) | undefined - onFullscreen?: ((...args: any[]) => any) | undefined - }, - { - startIndex: number - highlightCurrentColumn: boolean - columnKey: boolean - isDragHeaderSorting: boolean - border: boolean - resizable: boolean - headerSuffixIconAbsolute: boolean - showHeaderOverflow: string | boolean - headerAlign: string - align: string - footerAlign: string - showOverflow: string | boolean - remoteFilter: boolean - sortable: boolean - remoteSort: boolean - showFooter: boolean - highlightCurrentRow: boolean - fit: boolean - tooltipConfig: Record - isAsyncColumn: boolean - rowId: string - isMultipleHistory: boolean - showHeader: boolean - highlightCell: boolean - stripe: boolean - loading: boolean - highlightHoverRow: boolean - highlightHoverColumn: boolean - size: string - autoResize: boolean - autoLoad: boolean - seqSerial: boolean - isBeforePageChange: boolean - showSaveMsg: boolean - isCenterEmpty: boolean - rowKey: boolean - syncResize: boolean - } -> -export default _default diff --git a/typings/grid/src/grid/methods.d.ts b/typings/grid/src/grid/methods.d.ts deleted file mode 100644 index e18416de9..000000000 --- a/typings/grid/src/grid/methods.d.ts +++ /dev/null @@ -1,27 +0,0 @@ -export declare function setBodyRecords({ body, insertRecords, pendingRecords }: { - body: any; - insertRecords: any; - pendingRecords: any; -}): void; -export declare function doRemoveOrShowMsg({ _vm, canInvoke, code, isMsg, pendingRecords, resolve, valid }: { - _vm: any; - canInvoke: any; - code: any; - isMsg: any; - pendingRecords: any; - resolve: any; - valid: any; -}): void; -export declare function invokeSaveDataApi({ _vm, args, body, code, removeRecords, resolve, saveData, updateRecords, valid }: { - _vm: any; - args: any; - body: any; - code: any; - removeRecords: any; - resolve: any; - saveData: any; - updateRecords: any; - valid: any; -}): boolean; -declare const methods: {}; -export default methods; diff --git a/typings/grid/src/header/index.d.ts b/typings/grid/src/header/index.d.ts deleted file mode 100644 index 4494a4ad1..000000000 --- a/typings/grid/src/header/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Header from './src/header'; -export default Header; diff --git a/typings/grid/src/header/src/header.d.ts b/typings/grid/src/header/src/header.d.ts deleted file mode 100644 index 5e011d3f9..000000000 --- a/typings/grid/src/header/src/header.d.ts +++ /dev/null @@ -1,27 +0,0 @@ -declare const _default: { - name: string; - props: { - collectColumn: ArrayConstructor; - fixedColumn: ArrayConstructor; - fixedType: StringConstructor; - size: StringConstructor; - isGroup: BooleanConstructor; - tableColumn: ArrayConstructor; - tableData: ArrayConstructor; - visibleColumn: ArrayConstructor; - }; - watch: { - tableColumn(): void; - }; - data(): { - headerColumn: never[]; - }; - mounted(): void; - created(): void; - render(): any; - methods: { - uploadColumn(): void; - resizeMousedown(event: any, params: any): void; - }; -}; -export default _default; diff --git a/typings/grid/src/index.d.ts b/typings/grid/src/index.d.ts deleted file mode 100644 index ce0b4eeb5..000000000 --- a/typings/grid/src/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Grid from './grid/grid'; -export default Grid; diff --git a/typings/grid/src/keyboard/index.d.ts b/typings/grid/src/keyboard/index.d.ts deleted file mode 100644 index f16ef6a4a..000000000 --- a/typings/grid/src/keyboard/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -declare const _default: { - install(Table: any): void; -}; -export default _default; diff --git a/typings/grid/src/keyboard/src/methods.d.ts b/typings/grid/src/keyboard/src/methods.d.ts deleted file mode 100644 index 7cb4024c1..000000000 --- a/typings/grid/src/keyboard/src/methods.d.ts +++ /dev/null @@ -1,32 +0,0 @@ -declare const _default: { - moveTabSelected(args: any, isLeft: any, event: any, edit: any): void; - moveCurrentRow(isUpArrow: any, isDwArrow: any, event: any): void; - moveSelected({ args, isLeftArrow, isUpArrow, isRightArrow, isDwArrow, event }: { - args: any; - isLeftArrow: any; - isUpArrow: any; - isRightArrow: any; - isDwArrow: any; - event: any; - }): void; - triggerHeaderCellMousedownEvent(event: any, params: any): void; - triggerCellMousedownEvent(event: any, params: any): void; - _clearSelected(keep: any): any; - _clearChecked(): any; - _getMouseCheckeds(): { - rows: never[]; - columns: never[]; - rowNodes: any; - }; - _getMouseSelecteds(): any; - handleChecked(rowNodes: any): void; - handleAllChecked(event: any): void; - handleIndexChecked(rowNodes: any): void; - _clearIndexChecked(): any; - handleHeaderChecked(rowNodes: any): void; - _clearHeaderChecked(): any; - _clearCopyed(): any; - handleCopyed(cut: any): void; - handlePaste(): void; -}; -export default _default; diff --git a/typings/grid/src/keyboard/src/utils/moveTabSelected.d.ts b/typings/grid/src/keyboard/src/utils/moveTabSelected.d.ts deleted file mode 100644 index 1d23afeda..000000000 --- a/typings/grid/src/keyboard/src/utils/moveTabSelected.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -export declare function findLeft(params: any): { - targetColumn: any; - targetColumnIndex: any; - targetRow: any; - targetRowIndex: any; -}; -export declare function findRight(params: any): { - targetColumn: any; - targetColumnIndex: any; - targetRow: any; - targetRowIndex: any; -}; -export declare function processTarget(args1: any): void; diff --git a/typings/grid/src/keyboard/src/utils/triggerCellMousedownEvent.d.ts b/typings/grid/src/keyboard/src/utils/triggerCellMousedownEvent.d.ts deleted file mode 100644 index b8ed8d8e5..000000000 --- a/typings/grid/src/keyboard/src/utils/triggerCellMousedownEvent.d.ts +++ /dev/null @@ -1,20 +0,0 @@ -export declare function onCellMousedownGridEl(args: any): void; -export declare function handleCellMousedownEvent(args1: any): void; -export declare function onCellMousedownSelectEditable(args: any): void; -export declare function onCellMousedownSelect({ _vm, editConfig, event, mouseConfig, params }: { - _vm: any; - editConfig: any; - event: any; - mouseConfig: any; - params: any; -}): void; -export declare function onCellMousedownIndexColumn(args: any): void; -export declare function onCellMousedownNotIndexColumn({ _vm, cell, column, event, headerList, isIndex, params }: { - _vm: any; - cell: any; - column: any; - event: any; - headerList: any; - isIndex: any; - params: any; -}): void; diff --git a/typings/grid/src/keyboard/src/utils/triggerHeaderCellMousedownEvent.d.ts b/typings/grid/src/keyboard/src/utils/triggerHeaderCellMousedownEvent.d.ts deleted file mode 100644 index 3c26e923e..000000000 --- a/typings/grid/src/keyboard/src/utils/triggerHeaderCellMousedownEvent.d.ts +++ /dev/null @@ -1,8 +0,0 @@ -export declare function handleHeaderCellMousedownEvent({ $el, _vm, bodyList, cell, headerList, startCell }: { - $el: any; - _vm: any; - bodyList: any; - cell: any; - headerList: any; - startCell: any; -}): void; diff --git a/typings/grid/src/loading/index.d.ts b/typings/grid/src/loading/index.d.ts deleted file mode 100644 index 224eecb70..000000000 --- a/typings/grid/src/loading/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import Loading from './src/loading'; -export default Loading; diff --git a/typings/grid/src/loading/src/loading.d.ts b/typings/grid/src/loading/src/loading.d.ts deleted file mode 100644 index 740278df3..000000000 --- a/typings/grid/src/loading/src/loading.d.ts +++ /dev/null @@ -1,8 +0,0 @@ -declare const _default: { - name: string; - props: { - visible: BooleanConstructor; - }; - render(): any; -}; -export default _default; diff --git a/typings/grid/src/menu/index.d.ts b/typings/grid/src/menu/index.d.ts deleted file mode 100644 index 261db6780..000000000 --- a/typings/grid/src/menu/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import Panel from './src/panel'; -export default Panel; diff --git a/typings/grid/src/menu/src/children.d.ts b/typings/grid/src/menu/src/children.d.ts deleted file mode 100644 index 18c805090..000000000 --- a/typings/grid/src/menu/src/children.d.ts +++ /dev/null @@ -1,16 +0,0 @@ -declare const _default: { - name: string; - props: { - item: ObjectConstructor; - gIndex: NumberConstructor; - index: NumberConstructor; - show: BooleanConstructor; - ctxMenuStore: ObjectConstructor; - tableInstance: ObjectConstructor; - }; - render(): any; - watch: { - show(value: any): void; - }; -}; -export default _default; diff --git a/typings/grid/src/menu/src/methods.d.ts b/typings/grid/src/menu/src/methods.d.ts deleted file mode 100644 index 1728933d6..000000000 --- a/typings/grid/src/menu/src/methods.d.ts +++ /dev/null @@ -1,19 +0,0 @@ -declare const _default: { - _closeMenu(): any; - moveCtxMenu({ event, keyCode, ctxMenuStore, property, operKey, operRest, menuList }: { - event: any; - keyCode: any; - ctxMenuStore: any; - property: any; - operKey: any; - operRest: any; - menuList: any; - }): void; - handleGlobalContextmenuEvent(event: any): void; - openContextMenu(event: any, type: any, params: any): void; - ctxMenuMouseoverEvent(event: any, item: any, child: any): void; - ctxMenuMouseoutEvent(event: any, item: any): void; - ctxMenuLinkEvent(event: any, menu: any): void; - toKebab(code: any): string; -}; -export default _default; diff --git a/typings/grid/src/menu/src/panel.d.ts b/typings/grid/src/menu/src/panel.d.ts deleted file mode 100644 index 1c681411d..000000000 --- a/typings/grid/src/menu/src/panel.d.ts +++ /dev/null @@ -1,8 +0,0 @@ -declare const _default: { - name: string; - props: { - ctxMenuStore: ObjectConstructor; - }; - render(): any; -}; -export default _default; diff --git a/typings/grid/src/radio/index.d.ts b/typings/grid/src/radio/index.d.ts deleted file mode 100644 index eadf21e48..000000000 --- a/typings/grid/src/radio/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import Radio from './src/radio'; -export default Radio; diff --git a/typings/grid/src/radio/src/radio.d.ts b/typings/grid/src/radio/src/radio.d.ts deleted file mode 100644 index 46a0f0eed..000000000 --- a/typings/grid/src/radio/src/radio.d.ts +++ /dev/null @@ -1,24 +0,0 @@ -declare const _default: { - name: string; - model: { - prop: string; - event: string; - }; - props: { - value: (StringConstructor | NumberConstructor)[]; - label: (StringConstructor | NumberConstructor)[]; - disabled: BooleanConstructor; - name: StringConstructor; - size: StringConstructor; - }; - computed: { - vSize(): any; - }; - setup(props: any, { slots }: { - slots: any; - }): { - slots: any; - }; - render(): any; -}; -export default _default; diff --git a/typings/grid/src/resize/index.d.ts b/typings/grid/src/resize/index.d.ts deleted file mode 100644 index f16ef6a4a..000000000 --- a/typings/grid/src/resize/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -declare const _default: { - install(Table: any): void; -}; -export default _default; diff --git a/typings/grid/src/resize/src/methods.d.ts b/typings/grid/src/resize/src/methods.d.ts deleted file mode 100644 index b174bba74..000000000 --- a/typings/grid/src/resize/src/methods.d.ts +++ /dev/null @@ -1,5 +0,0 @@ -declare const _default: { - bindResize(): void; - unbindResize(): void; -}; -export default _default; diff --git a/typings/grid/src/table/index.d.ts b/typings/grid/src/table/index.d.ts deleted file mode 100644 index 31738ad11..000000000 --- a/typings/grid/src/table/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Table from './src/table'; -export default Table; diff --git a/typings/grid/src/table/src/events.d.ts b/typings/grid/src/table/src/events.d.ts deleted file mode 100644 index 9e7899de2..000000000 --- a/typings/grid/src/table/src/events.d.ts +++ /dev/null @@ -1,49 +0,0 @@ -export declare function handleGlobalMousedownEvent(event: any): void; -export declare function handleGlobalBlurEvent(): void; -export declare function handleGlobalMousewheelEvent(event: any): void; -export declare function handleEscKeyDown({ event, actived, mouseConfig }: { - event: any; - actived: any; - mouseConfig: any; -}): void; -export declare function handleEnterKeyDown({ event, selected, actived }: { - event: any; - selected: any; - actived: any; -}): void; -export declare function handleCtxMenu({ event }: { - event: any; -}): void; -export declare function handleArrowKeyDown({ event, selected }: { - event: any; - selected: any; -}): void; -export declare function handleDelKeyDown({ event, selected }: { - event: any; - selected: any; -}): void; -export declare function handleSpaceKeyDown({ event, selected }: { - event: any; - selected: any; -}): void; -export declare function handleTabKeyDown({ event, selected, actived }: { - event: any; - selected: any; - actived: any; -}): void; -export declare function handleCopyKeyDown({ event }: { - event: any; -}): void; -export declare function handleF2KeyDown({ event, selected }: { - event: any; - selected: any; -}): void; -export declare function handleOtherKeyDown({ event, selected }: { - event: any; - selected: any; -}): void; -export declare function handleGlobalKeydownEvent(event: any): void; -export declare function handleGlobalResizeEvent(): void; -export declare function triggerHeaderTooltipEvent(event: any, params: any): void; -export declare function triggerFooterTooltipEvent(event: any, params: any): void; -export declare function triggerTooltipEvent(event: any, params: any): void; diff --git a/typings/grid/src/table/src/funcs.d.ts b/typings/grid/src/table/src/funcs.d.ts deleted file mode 100644 index 8c822ca11..000000000 --- a/typings/grid/src/table/src/funcs.d.ts +++ /dev/null @@ -1,10 +0,0 @@ -export declare const funcs: string[]; -export declare const headerProps: { - children: string; -}; -export declare const getSortColumns: (columns: any) => any[]; -export declare const onEndEvent: ({ event, _this }: { - event: any; - _this: any; -}) => any; -export declare const handleAllColumnPromises: (opt: any, ctx: any) => (data: any) => void; diff --git a/typings/grid/src/table/src/methods.d.ts b/typings/grid/src/table/src/methods.d.ts deleted file mode 100644 index 731105b02..000000000 --- a/typings/grid/src/table/src/methods.d.ts +++ /dev/null @@ -1,205 +0,0 @@ -import { triggerHeaderTooltipEvent, triggerFooterTooltipEvent, triggerTooltipEvent, handleGlobalMousedownEvent, handleGlobalBlurEvent, handleGlobalMousewheelEvent, handleArrowKeyDown, handleCopyKeyDown, handleCtxMenu, handleDelKeyDown, handleEnterKeyDown, handleEscKeyDown, handleF2KeyDown, handleOtherKeyDown, handleSpaceKeyDown, handleTabKeyDown, handleGlobalKeydownEvent, handleGlobalResizeEvent } from './events'; -declare const Methods: { - columnDrop(): void; - rowDrop(): void; - getParentElem(): any; - getParentHeight(): any; - clearAll(silent: any): any; - refreshData(): any; - refreshStyle(): any; - updateData(): any; - handleTableData(force: any): any; - loadTableData(datas: any, notRefresh: any): any; - reloadData(datas: any): any; - loadData(datas: any): Promise; - reloadRow(row: any, record: any, field: any): any; - reloadColumn(columns: any): any; - loadColumn(columns: any): Promise; - updateCache(source: any): void; - modifyCache(): void; - cacheColumnMap(): void; - getRowNode(tr: any): any; - getColumnNode(cell: any): any; - getRowIndex(row: any): any; - getColumnIndex(column: any): any; - hasIndexColumn(column: any): any; - defineField(row: any, copy: any): any; - isTemporaryRow(row: any): any; - createData(records: any, copy: any): Promise; - createRow(records: any): Promise; - clearData(rows: any, field: any): any; - hasRowInsert(row: any): number; - hasRowChange(row: any, field: any): boolean; - getColumns(columnIndex: any): any; - getColumnById(colid: any): any; - getColumnByField(field: any): any; - getTableColumn(): { - fullColumn: any; - visibleColumn: any; - tableColumn: any; - collectColumn: any; - }; - getRecords(): any; - getData(rowIndex: any): any; - getAllRecords(): any; - getSelectRecords(notCopy: any): any; - handleLocalFilter(row: any, column: any): any; - updateAfterFullData(): any; - buildGroupData(): void; - getRowById(rowid: any): any; - getTableData(): { - visibleData: any; - footerData: any; - tableData: any; - fullData: any; - }; - handleDefault(): void; - mergeCustomColumn(customColumns: any, sort: any, colWidth: any): void; - resetAll(): void; - hideColumn(tableColumn: any): any; - showColumn(tableColumn: any): any; - resetCustoms(): any; - handleVisibleColumn(tableColumn: any, visible: any): any; - reloadCustoms(customColumns: any, sort: any, colWidth: any): any; - watchColumn(value: any): void; - refreshColumn(): any; - analyColumnWidth(): void; - /** - * 计算单元格列宽,动态分配可用剩余空间 - * 支持(width=?、width=?px、width=?%、min-width=?、min-width=?px、min-width=?%) - */ - recalculate(refull: any): any; - autoCellWidth(headerEl: any, bodyEl: any, footerEl: any): void; - resetResizable(): any; - syncFixedTop(): void; - updateStyle(): any; - checkScrolling(): void; - preventEvent(event: any, type: any, args: any, next: any, end: any): void; - blurOutside({ row, args, column }: { - row: any; - args: any; - column: any; - }, event: any): any; - handleGlobalMousedownEvent: typeof handleGlobalMousedownEvent; - handleGlobalBlurEvent: typeof handleGlobalBlurEvent; - handleGlobalMousewheelEvent: typeof handleGlobalMousewheelEvent; - handleEscKeyDown: typeof handleEscKeyDown; - handleEnterKeyDown: typeof handleEnterKeyDown; - handleCtxMenu: typeof handleCtxMenu; - handleArrowKeyDown: typeof handleArrowKeyDown; - handleDelKeyDown: typeof handleDelKeyDown; - handleSpaceKeyDown: typeof handleSpaceKeyDown; - handleTabKeyDown: typeof handleTabKeyDown; - handleCopyKeyDown: typeof handleCopyKeyDown; - handleF2KeyDown: typeof handleF2KeyDown; - handleOtherKeyDown: typeof handleOtherKeyDown; - handleGlobalKeydownEvent: typeof handleGlobalKeydownEvent; - handleGlobalResizeEvent: typeof handleGlobalResizeEvent; - triggerHeaderTooltipEvent: typeof triggerHeaderTooltipEvent; - triggerFooterTooltipEvent: typeof triggerFooterTooltipEvent; - triggerTooltipEvent: typeof triggerTooltipEvent; - activateTooltip: any; - activateTooltipValid: any; - handleTooltip(event: any, column: any, row: any, showTip: any, isHeader: any): any; - clostTooltip(): any; - debounceClose: any; - handleSelectionDefChecked(): void; - setSelection(rows: any, value: any): any; - handleSelectRow({ row }: { - row: any; - }, value: any): void; - handleToggleCheckRowEvent(params: any, event: any): void; - triggerCheckRowEvent(event: any, params: any, value: any): void; - toggleRowSelection(row: any): any; - setAllSelection(value: any): void; - checkSelectionStatus(): void; - reserveCheckSelection(): void; - triggerCheckAllEvent(event: any, value: any): void; - toggleAllSelection(): any; - clearSelection(): any; - handleRadioDefChecked(): void; - triggerRadioRowEvent(event: any, params: any): void; - triggerCurrentRowEvent(event: any, params: any): void; - setCurrentRow(row: any): any; - setRadioRow(row: any): any; - clearCurrentRow(): any; - clearRadioRow(): any; - getCurrentRow(): any; - getRadioRow(): any; - triggerHoverEvent(event: any, { row }: { - row: any; - }): void; - setHoverRow(row: any): void; - clearHoverRow(): void; - triggerHeaderCellClickEvent(event: any, params: any): any; - setCurrentColumn(column: any): any; - clearCurrentColumn(): any; - handleChangeCell(event: any, params: any): void; - triggerCellClickEvent(event: any, params: any): void; - triggerCellDBLClickEvent(event: any, params: any): void; - triggerSortEvent(event: any, column: any, order: any): void; - sort(field: any, order: any): any; - clearSort(): any; - closeFilter(): any; - toggleGroupExpansion(row: any): void; - triggerRowExpandEvent(event: any, { row }: { - row: any; - }): any; - toggleRowExpansion(row: any): any; - handleDefaultRowExpand(): void; - setAllRowExpansion(expanded: any): any; - setRowExpansion(rows: any, expanded: any): any; - hasRowExpand(row: any): number; - clearRowExpand(): any; - triggerTreeExpandEvent(event: any, { row }: { - row: any; - }): any; - toggleTreeExpansion(row: any): any; - handleDefaultTreeExpand(): void; - setAllTreeExpansion(expanded: any): any; - setTreeExpansion(rows: any, expanded: any): any; - hasTreeExpand(row: any): number; - clearTreeExpand(): any; - getVirtualScroller(): { - scrollX: any; - scrollY: any; - scrollLeft: any; - scrollTop: any; - }; - triggerScrollXEvent(event: any): void; - debounceScrollX: any; - loadScrollXData(): void; - triggerScrollYEvent(event: any): void; - debounceScrollY: any; - debounceScrollLoad: any; - loadScrollYData(event: any): void; - getRowHeight(): any; - computeScrollLoad(): any; - updateScrollXData(): void; - updateScrollXSpace(): void; - updateScrollYData(): void; - updateScrollYSpace(): void; - updateScrollLoadBar(event: any): void; - scrollTo(scrollLeft: any, scrollTop: any): any; - scrollToRow(row: any, column: any, isDelay: any, move: any): any; - scrollToTreeRow(row: any): any; - scrollToColumn(column: any, isDelay: any, move: any): any; - resetScrollTop(): void; - clearScroll(): any; - updateFooter(): any; - updateStatus(scope: any, cellValue: any, renderOpts: any): any; - updateScrollStatus: any; - getAsyncColumnUniqueKey(property: any, row: any): string; - getAsyncColumnName(property: any): string; - collectAsyncColumn(tableData: any): any[]; - handleAsyncColumn(tableData: any): void; - handleResolveColumn(tableData: any, fetchColumns: any): void; - connect({ toolbar }: { - toolbar: any; - }): void; - getEventTargetNode: any; - initMultipleHistory(): void; - showSelectToolbar(): any; - toggleSelectToolbarVisible(): any; -}; -export default Methods; diff --git a/typings/grid/src/table/src/strategy.d.ts b/typings/grid/src/table/src/strategy.d.ts deleted file mode 100644 index bc52d909f..000000000 --- a/typings/grid/src/table/src/strategy.d.ts +++ /dev/null @@ -1,34 +0,0 @@ -declare const getRowUniqueId: () => string; -declare const setTableRowKey: ($table: any) => any; -declare const getTableRowKey: ($table: any) => any; -declare const getTableCellKey: ({ $table, column, row }: { - $table: any; - column: any; - row: any; -}) => string; -declare const setTreeScrollYCache: (_vm: any) => void; -declare const sliceFullData: ({ afterFullData, renderSize, scrollYLoad, startIndex, treeConfig, treeExpandeds }: { - afterFullData: any; - renderSize: any; - scrollYLoad: any; - startIndex: any; - treeConfig: any; - treeExpandeds: any; -}) => any; -declare const getTotalRows: (_vm: any) => any; -declare const getTreeChildrenKey: ({ scrollYLoad, treeConfig }: { - scrollYLoad: any; - treeConfig: any; -}) => any; -declare const getTreeShowKey: ({ scrollYLoad, treeConfig }: { - scrollYLoad: any; - treeConfig: any; -}) => string | undefined; -declare const sliceVisibleColumn: (args: any) => { - tableColumn: any; - lastStartIndex: any; - visibleColumnChanged: any; - sliced: boolean; -}; -declare const clearOnTableUnmount: ($table: any) => void; -export { clearOnTableUnmount, getRowUniqueId, getTableCellKey, getTableRowKey, getTotalRows, getTreeChildrenKey, getTreeShowKey, setTreeScrollYCache, setTableRowKey, sliceFullData, sliceVisibleColumn }; diff --git a/typings/grid/src/table/src/table.d.ts b/typings/grid/src/table/src/table.d.ts deleted file mode 100644 index 3864694c4..000000000 --- a/typings/grid/src/table/src/table.d.ts +++ /dev/null @@ -1,755 +0,0 @@ -declare const _default: { - name: string; - props: { - align: { - type: StringConstructor; - default: () => any; - }; - autoResize: BooleanConstructor; - border: { - type: BooleanConstructor; - default: () => any; - }; - cellClassName: (StringConstructor | FunctionConstructor)[]; - columnKey: BooleanConstructor; - columnMinWidth: (StringConstructor | NumberConstructor)[]; - columnWidth: (StringConstructor | NumberConstructor)[]; - contextMenu: ObjectConstructor; - customs: ArrayConstructor; - data: (ObjectConstructor | ArrayConstructor)[]; - dropConfig: ObjectConstructor; - editConfig: (ObjectConstructor | BooleanConstructor)[]; - editRules: ObjectConstructor; - expandConfig: ObjectConstructor; - fit: { - type: BooleanConstructor; - default: () => boolean; - }; - footerAlign: { - type: StringConstructor; - default: () => any; - }; - footerCellClassName: (StringConstructor | FunctionConstructor)[]; - footerMethod: FunctionConstructor; - footerRowClassName: (StringConstructor | FunctionConstructor)[]; - footerSpanMethod: FunctionConstructor; - headerAlign: { - type: StringConstructor; - default: () => any; - }; - headerCellClassName: (StringConstructor | FunctionConstructor)[]; - headerRowClassName: (StringConstructor | FunctionConstructor)[]; - headerSuffixIconAbsolute: BooleanConstructor; - height: (StringConstructor | NumberConstructor)[]; - highlightCell: BooleanConstructor; - highlightCurrentColumn: { - type: BooleanConstructor; - default: () => any; - }; - highlightCurrentRow: { - type: BooleanConstructor; - default: () => any; - }; - highlightHoverColumn: { - type: BooleanConstructor; - default: () => any; - }; - highlightHoverRow: { - type: BooleanConstructor; - default: () => boolean; - }; - isAsyncColumn: BooleanConstructor; - isCenterEmpty: BooleanConstructor; - isDragHeaderSorting: BooleanConstructor; - keyboardConfig: ObjectConstructor; - loading: BooleanConstructor; - loadingComponent: ObjectConstructor; - maxHeight: (StringConstructor | NumberConstructor)[]; - minHeight: (StringConstructor | NumberConstructor)[]; - mouseConfig: ObjectConstructor; - optimization: ObjectConstructor; - params: ObjectConstructor; - radioConfig: ObjectConstructor; - remoteFilter: BooleanConstructor; - remoteSort: BooleanConstructor; - renderEmpty: FunctionConstructor; - renderRowAfter: FunctionConstructor; - resizable: { - type: BooleanConstructor; - default: () => boolean; - }; - rowClassName: (StringConstructor | FunctionConstructor)[]; - rowGroup: ObjectConstructor; - rowId: { - type: StringConstructor; - default: () => string; - }; - rowKey: BooleanConstructor; - rowSpan: ArrayConstructor; - scrollLoad: ObjectConstructor; - selectConfig: ObjectConstructor; - showFooter: BooleanConstructor; - showHeader: { - type: BooleanConstructor; - default: () => boolean; - }; - showHeaderOverflow: { - type: (BooleanConstructor | StringConstructor)[]; - default: () => any; - }; - showOverflow: { - type: (BooleanConstructor | StringConstructor)[]; - default: () => any; - }; - size: { - type: StringConstructor; - default: () => any; - }; - sortConfig: ObjectConstructor; - sortMethod: FunctionConstructor; - sortable: { - type: BooleanConstructor; - default: boolean; - }; - spanMethod: FunctionConstructor; - startIndex: { - type: NumberConstructor; - default: number; - }; - stripe: { - type: BooleanConstructor; - default: () => boolean; - }; - summaryConfig: ObjectConstructor; - syncResize: BooleanConstructor; - tableLayout: StringConstructor; - tooltipConfig: { - type: ObjectConstructor; - default: () => {}; - }; - treeConfig: ObjectConstructor; - validConfig: ObjectConstructor; - }; - provide(): { - $table: { - name: string; - props: { - align: { - type: StringConstructor; - default: () => any; - }; - autoResize: BooleanConstructor; - border: { - type: BooleanConstructor; - default: () => any; - }; - cellClassName: (StringConstructor | FunctionConstructor)[]; - columnKey: BooleanConstructor; - columnMinWidth: (StringConstructor | NumberConstructor)[]; - columnWidth: (StringConstructor | NumberConstructor)[]; - contextMenu: ObjectConstructor; - customs: ArrayConstructor; - data: (ObjectConstructor | ArrayConstructor)[]; - dropConfig: ObjectConstructor; - editConfig: (ObjectConstructor | BooleanConstructor)[]; - editRules: ObjectConstructor; - expandConfig: ObjectConstructor; - fit: { - type: BooleanConstructor; - default: () => boolean; - }; - footerAlign: { - type: StringConstructor; - default: () => any; - }; - footerCellClassName: (StringConstructor | FunctionConstructor)[]; - footerMethod: FunctionConstructor; - footerRowClassName: (StringConstructor | FunctionConstructor)[]; - footerSpanMethod: FunctionConstructor; - headerAlign: { - type: StringConstructor; - default: () => any; - }; - headerCellClassName: (StringConstructor | FunctionConstructor)[]; - headerRowClassName: (StringConstructor | FunctionConstructor)[]; - headerSuffixIconAbsolute: BooleanConstructor; - height: (StringConstructor | NumberConstructor)[]; - highlightCell: BooleanConstructor; - highlightCurrentColumn: { - type: BooleanConstructor; - default: () => any; - }; - highlightCurrentRow: { - type: BooleanConstructor; - default: () => any; - }; - highlightHoverColumn: { - type: BooleanConstructor; - default: () => any; - }; - highlightHoverRow: { - type: BooleanConstructor; - default: () => boolean; - }; - isAsyncColumn: BooleanConstructor; - isCenterEmpty: BooleanConstructor; - isDragHeaderSorting: BooleanConstructor; - keyboardConfig: ObjectConstructor; - loading: BooleanConstructor; - loadingComponent: ObjectConstructor; - maxHeight: (StringConstructor | NumberConstructor)[]; - minHeight: (StringConstructor | NumberConstructor)[]; - mouseConfig: ObjectConstructor; - optimization: ObjectConstructor; - params: ObjectConstructor; - radioConfig: ObjectConstructor; - remoteFilter: BooleanConstructor; - remoteSort: BooleanConstructor; - renderEmpty: FunctionConstructor; - renderRowAfter: FunctionConstructor; - resizable: { - type: BooleanConstructor; - default: () => boolean; - }; - rowClassName: (StringConstructor | FunctionConstructor)[]; - rowGroup: ObjectConstructor; - rowId: { - type: StringConstructor; - default: () => string; - }; - rowKey: BooleanConstructor; - rowSpan: ArrayConstructor; - scrollLoad: ObjectConstructor; - selectConfig: ObjectConstructor; - showFooter: BooleanConstructor; - showHeader: { - type: BooleanConstructor; - default: () => boolean; - }; - showHeaderOverflow: { - type: (BooleanConstructor | StringConstructor)[]; - default: () => any; - }; - showOverflow: { - type: (BooleanConstructor | StringConstructor)[]; - default: () => any; - }; - size: { - type: StringConstructor; - default: () => any; - }; - sortConfig: ObjectConstructor; - sortMethod: FunctionConstructor; - sortable: { - type: BooleanConstructor; - default: boolean; - }; - spanMethod: FunctionConstructor; - startIndex: { - type: NumberConstructor; - default: number; - }; - stripe: { - type: BooleanConstructor; - default: () => boolean; - }; - summaryConfig: ObjectConstructor; - syncResize: BooleanConstructor; - tableLayout: StringConstructor; - tooltipConfig: { - type: ObjectConstructor; - default: () => {}; - }; - treeConfig: ObjectConstructor; - validConfig: ObjectConstructor; - }; - provide(): any; - inject: { - $grid: { - default: null; - }; - }; - data(): any; - computed: { - bodyCtxMenu(): any; - ctxMenuList(): any[]; - ctxMenuOpts(): any; - hasFilter(): any; - hasTip(): boolean; - headerCtxMenu(): any; - isCtxMenu(): number; - isGroup(): any; - isResizable(): any; - optimizeOpts(): any; - sortOpts(): any; - tooltipContentOpts(): any; - vSize(): any; - vaildTipOpts(): any; - validOpts(): any; - }; - watch: { - collectColumn(value: any): void; - customs(value: any): void; - data(value: any): void; - height(): void; - syncResize(value: any): void; - tableColumn(): void; - }; - created(): void; - mounted(): void; - activated(): void; - setup(props: any, { slots, attrs, listeners }: { - slots: any; - attrs: any; - listeners: any; - }): { - slots: any; - tableListeners: any; - }; - render(): any; - methods: { - columnDrop(): void; - rowDrop(): void; - getParentElem(): any; - getParentHeight(): any; - clearAll(silent: any): any; - refreshData(): any; - refreshStyle(): any; - updateData(): any; - handleTableData(force: any): any; - loadTableData(datas: any, notRefresh: any): any; - reloadData(datas: any): any; - loadData(datas: any): Promise; - reloadRow(row: any, record: any, field: any): any; - reloadColumn(columns: any): any; - loadColumn(columns: any): Promise; - updateCache(source: any): void; - modifyCache(): void; - cacheColumnMap(): void; - getRowNode(tr: any): any; - getColumnNode(cell: any): any; - getRowIndex(row: any): any; - getColumnIndex(column: any): any; - hasIndexColumn(column: any): any; - defineField(row: any, copy: any): any; - isTemporaryRow(row: any): any; - createData(records: any, copy: any): Promise; - createRow(records: any): Promise; - clearData(rows: any, field: any): any; - hasRowInsert(row: any): number; - hasRowChange(row: any, field: any): boolean; - getColumns(columnIndex: any): any; - getColumnById(colid: any): any; - getColumnByField(field: any): any; - getTableColumn(): { - fullColumn: any; - visibleColumn: any; - tableColumn: any; - collectColumn: any; - }; - getRecords(): any; - getData(rowIndex: any): any; - getAllRecords(): any; - getSelectRecords(notCopy: any): any; - handleLocalFilter(row: any, column: any): any; - updateAfterFullData(): any; - buildGroupData(): void; - getRowById(rowid: any): any; - getTableData(): { - visibleData: any; - footerData: any; - tableData: any; - fullData: any; - }; - handleDefault(): void; - mergeCustomColumn(customColumns: any, sort: any, colWidth: any): void; - resetAll(): void; - hideColumn(tableColumn: any): any; - showColumn(tableColumn: any): any; - resetCustoms(): any; - handleVisibleColumn(tableColumn: any, visible: any): any; - reloadCustoms(customColumns: any, sort: any, colWidth: any): any; - watchColumn(value: any): void; - refreshColumn(): any; - analyColumnWidth(): void; - recalculate(refull: any): any; - autoCellWidth(headerEl: any, bodyEl: any, footerEl: any): void; - resetResizable(): any; - syncFixedTop(): void; - updateStyle(): any; - checkScrolling(): void; - preventEvent(event: any, type: any, args: any, next: any, end: any): void; - blurOutside({ row, args, column }: { - row: any; - args: any; - column: any; - }, event: any): any; - handleGlobalMousedownEvent: typeof import("./events").handleGlobalMousedownEvent; - handleGlobalBlurEvent: typeof import("./events").handleGlobalBlurEvent; - handleGlobalMousewheelEvent: typeof import("./events").handleGlobalMousewheelEvent; - handleEscKeyDown: typeof import("./events").handleEscKeyDown; - handleEnterKeyDown: typeof import("./events").handleEnterKeyDown; - handleCtxMenu: typeof import("./events").handleCtxMenu; - handleArrowKeyDown: typeof import("./events").handleArrowKeyDown; - handleDelKeyDown: typeof import("./events").handleDelKeyDown; - handleSpaceKeyDown: typeof import("./events").handleSpaceKeyDown; - handleTabKeyDown: typeof import("./events").handleTabKeyDown; - handleCopyKeyDown: typeof import("./events").handleCopyKeyDown; - handleF2KeyDown: typeof import("./events").handleF2KeyDown; - handleOtherKeyDown: typeof import("./events").handleOtherKeyDown; - handleGlobalKeydownEvent: typeof import("./events").handleGlobalKeydownEvent; - handleGlobalResizeEvent: typeof import("./events").handleGlobalResizeEvent; - triggerHeaderTooltipEvent: typeof import("./events").triggerHeaderTooltipEvent; - triggerFooterTooltipEvent: typeof import("./events").triggerFooterTooltipEvent; - triggerTooltipEvent: typeof import("./events").triggerTooltipEvent; - activateTooltip: any; - activateTooltipValid: any; - handleTooltip(event: any, column: any, row: any, showTip: any, isHeader: any): any; - clostTooltip(): any; - debounceClose: any; - handleSelectionDefChecked(): void; - setSelection(rows: any, value: any): any; - handleSelectRow({ row }: { - row: any; - }, value: any): void; - handleToggleCheckRowEvent(params: any, event: any): void; - triggerCheckRowEvent(event: any, params: any, value: any): void; - toggleRowSelection(row: any): any; - setAllSelection(value: any): void; - checkSelectionStatus(): void; - reserveCheckSelection(): void; - triggerCheckAllEvent(event: any, value: any): void; - toggleAllSelection(): any; - clearSelection(): any; - handleRadioDefChecked(): void; - triggerRadioRowEvent(event: any, params: any): void; - triggerCurrentRowEvent(event: any, params: any): void; - setCurrentRow(row: any): any; - setRadioRow(row: any): any; - clearCurrentRow(): any; - clearRadioRow(): any; - getCurrentRow(): any; - getRadioRow(): any; - triggerHoverEvent(event: any, { row }: { - row: any; - }): void; - setHoverRow(row: any): void; - clearHoverRow(): void; - triggerHeaderCellClickEvent(event: any, params: any): any; - setCurrentColumn(column: any): any; - clearCurrentColumn(): any; - handleChangeCell(event: any, params: any): void; - triggerCellClickEvent(event: any, params: any): void; - triggerCellDBLClickEvent(event: any, params: any): void; - triggerSortEvent(event: any, column: any, order: any): void; - sort(field: any, order: any): any; - clearSort(): any; - closeFilter(): any; - toggleGroupExpansion(row: any): void; - triggerRowExpandEvent(event: any, { row }: { - row: any; - }): any; - toggleRowExpansion(row: any): any; - handleDefaultRowExpand(): void; - setAllRowExpansion(expanded: any): any; - setRowExpansion(rows: any, expanded: any): any; - hasRowExpand(row: any): number; - clearRowExpand(): any; - triggerTreeExpandEvent(event: any, { row }: { - row: any; - }): any; - toggleTreeExpansion(row: any): any; - handleDefaultTreeExpand(): void; - setAllTreeExpansion(expanded: any): any; - setTreeExpansion(rows: any, expanded: any): any; - hasTreeExpand(row: any): number; - clearTreeExpand(): any; - getVirtualScroller(): { - scrollX: any; - scrollY: any; - scrollLeft: any; - scrollTop: any; - }; - triggerScrollXEvent(event: any): void; - debounceScrollX: any; - loadScrollXData(): void; - triggerScrollYEvent(event: any): void; - debounceScrollY: any; - debounceScrollLoad: any; - loadScrollYData(event: any): void; - getRowHeight(): any; - computeScrollLoad(): any; - updateScrollXData(): void; - updateScrollXSpace(): void; - updateScrollYData(): void; - updateScrollYSpace(): void; - updateScrollLoadBar(event: any): void; - scrollTo(scrollLeft: any, scrollTop: any): any; - scrollToRow(row: any, column: any, isDelay: any, move: any): any; - scrollToTreeRow(row: any): any; - scrollToColumn(column: any, isDelay: any, move: any): any; - resetScrollTop(): void; - clearScroll(): any; - updateFooter(): any; - updateStatus(scope: any, cellValue: any, renderOpts: any): any; - updateScrollStatus: any; - getAsyncColumnUniqueKey(property: any, row: any): string; - getAsyncColumnName(property: any): string; - collectAsyncColumn(tableData: any): any[]; - handleAsyncColumn(tableData: any): void; - handleResolveColumn(tableData: any, fetchColumns: any): void; - connect({ toolbar }: { - toolbar: any; - }): void; - getEventTargetNode: any; - initMultipleHistory(): void; - showSelectToolbar(): any; - toggleSelectToolbarVisible(): any; - }; - }; - $column: null; - }; - inject: { - $grid: { - default: null; - }; - }; - data(): any; - computed: { - bodyCtxMenu(): any; - ctxMenuList(): any[]; - ctxMenuOpts(): any; - hasFilter(): any; - hasTip(): boolean; - headerCtxMenu(): any; - isCtxMenu(): number; - isGroup(): any; - isResizable(): any; - optimizeOpts(): any; - sortOpts(): any; - tooltipContentOpts(): any; - vSize(): any; - vaildTipOpts(): any; - validOpts(): any; - }; - watch: { - collectColumn(value: any): void; - customs(value: any): void; - data(value: any): void; - height(): void; - syncResize(value: any): void; - tableColumn(): void; - }; - created(): void; - mounted(): void; - activated(): void; - setup(props: any, { slots, attrs, listeners }: { - slots: any; - attrs: any; - listeners: any; - }): { - slots: any; - tableListeners: any; - }; - render(): any; - methods: { - columnDrop(): void; - rowDrop(): void; - getParentElem(): any; - getParentHeight(): any; - clearAll(silent: any): any; - refreshData(): any; - refreshStyle(): any; - updateData(): any; - handleTableData(force: any): any; - loadTableData(datas: any, notRefresh: any): any; - reloadData(datas: any): any; - loadData(datas: any): Promise; - reloadRow(row: any, record: any, field: any): any; - reloadColumn(columns: any): any; - loadColumn(columns: any): Promise; - updateCache(source: any): void; - modifyCache(): void; - cacheColumnMap(): void; - getRowNode(tr: any): any; - getColumnNode(cell: any): any; - getRowIndex(row: any): any; - getColumnIndex(column: any): any; - hasIndexColumn(column: any): any; - defineField(row: any, copy: any): any; - isTemporaryRow(row: any): any; - createData(records: any, copy: any): Promise; - createRow(records: any): Promise; - clearData(rows: any, field: any): any; - hasRowInsert(row: any): number; - hasRowChange(row: any, field: any): boolean; - getColumns(columnIndex: any): any; - getColumnById(colid: any): any; - getColumnByField(field: any): any; - getTableColumn(): { - fullColumn: any; - visibleColumn: any; - tableColumn: any; - collectColumn: any; - }; - getRecords(): any; - getData(rowIndex: any): any; - getAllRecords(): any; - getSelectRecords(notCopy: any): any; - handleLocalFilter(row: any, column: any): any; - updateAfterFullData(): any; - buildGroupData(): void; - getRowById(rowid: any): any; - getTableData(): { - visibleData: any; - footerData: any; - tableData: any; - fullData: any; - }; - handleDefault(): void; - mergeCustomColumn(customColumns: any, sort: any, colWidth: any): void; - resetAll(): void; - hideColumn(tableColumn: any): any; - showColumn(tableColumn: any): any; - resetCustoms(): any; - handleVisibleColumn(tableColumn: any, visible: any): any; - reloadCustoms(customColumns: any, sort: any, colWidth: any): any; - watchColumn(value: any): void; - refreshColumn(): any; - analyColumnWidth(): void; - recalculate(refull: any): any; - autoCellWidth(headerEl: any, bodyEl: any, footerEl: any): void; - resetResizable(): any; - syncFixedTop(): void; - updateStyle(): any; - checkScrolling(): void; - preventEvent(event: any, type: any, args: any, next: any, end: any): void; - blurOutside({ row, args, column }: { - row: any; - args: any; - column: any; - }, event: any): any; - handleGlobalMousedownEvent: typeof import("./events").handleGlobalMousedownEvent; - handleGlobalBlurEvent: typeof import("./events").handleGlobalBlurEvent; - handleGlobalMousewheelEvent: typeof import("./events").handleGlobalMousewheelEvent; - handleEscKeyDown: typeof import("./events").handleEscKeyDown; - handleEnterKeyDown: typeof import("./events").handleEnterKeyDown; - handleCtxMenu: typeof import("./events").handleCtxMenu; - handleArrowKeyDown: typeof import("./events").handleArrowKeyDown; - handleDelKeyDown: typeof import("./events").handleDelKeyDown; - handleSpaceKeyDown: typeof import("./events").handleSpaceKeyDown; - handleTabKeyDown: typeof import("./events").handleTabKeyDown; - handleCopyKeyDown: typeof import("./events").handleCopyKeyDown; - handleF2KeyDown: typeof import("./events").handleF2KeyDown; - handleOtherKeyDown: typeof import("./events").handleOtherKeyDown; - handleGlobalKeydownEvent: typeof import("./events").handleGlobalKeydownEvent; - handleGlobalResizeEvent: typeof import("./events").handleGlobalResizeEvent; - triggerHeaderTooltipEvent: typeof import("./events").triggerHeaderTooltipEvent; - triggerFooterTooltipEvent: typeof import("./events").triggerFooterTooltipEvent; - triggerTooltipEvent: typeof import("./events").triggerTooltipEvent; - activateTooltip: any; - activateTooltipValid: any; - handleTooltip(event: any, column: any, row: any, showTip: any, isHeader: any): any; - clostTooltip(): any; - debounceClose: any; - handleSelectionDefChecked(): void; - setSelection(rows: any, value: any): any; - handleSelectRow({ row }: { - row: any; - }, value: any): void; - handleToggleCheckRowEvent(params: any, event: any): void; - triggerCheckRowEvent(event: any, params: any, value: any): void; - toggleRowSelection(row: any): any; - setAllSelection(value: any): void; - checkSelectionStatus(): void; - reserveCheckSelection(): void; - triggerCheckAllEvent(event: any, value: any): void; - toggleAllSelection(): any; - clearSelection(): any; - handleRadioDefChecked(): void; - triggerRadioRowEvent(event: any, params: any): void; - triggerCurrentRowEvent(event: any, params: any): void; - setCurrentRow(row: any): any; - setRadioRow(row: any): any; - clearCurrentRow(): any; - clearRadioRow(): any; - getCurrentRow(): any; - getRadioRow(): any; - triggerHoverEvent(event: any, { row }: { - row: any; - }): void; - setHoverRow(row: any): void; - clearHoverRow(): void; - triggerHeaderCellClickEvent(event: any, params: any): any; - setCurrentColumn(column: any): any; - clearCurrentColumn(): any; - handleChangeCell(event: any, params: any): void; - triggerCellClickEvent(event: any, params: any): void; - triggerCellDBLClickEvent(event: any, params: any): void; - triggerSortEvent(event: any, column: any, order: any): void; - sort(field: any, order: any): any; - clearSort(): any; - closeFilter(): any; - toggleGroupExpansion(row: any): void; - triggerRowExpandEvent(event: any, { row }: { - row: any; - }): any; - toggleRowExpansion(row: any): any; - handleDefaultRowExpand(): void; - setAllRowExpansion(expanded: any): any; - setRowExpansion(rows: any, expanded: any): any; - hasRowExpand(row: any): number; - clearRowExpand(): any; - triggerTreeExpandEvent(event: any, { row }: { - row: any; - }): any; - toggleTreeExpansion(row: any): any; - handleDefaultTreeExpand(): void; - setAllTreeExpansion(expanded: any): any; - setTreeExpansion(rows: any, expanded: any): any; - hasTreeExpand(row: any): number; - clearTreeExpand(): any; - getVirtualScroller(): { - scrollX: any; - scrollY: any; - scrollLeft: any; - scrollTop: any; - }; - triggerScrollXEvent(event: any): void; - debounceScrollX: any; - loadScrollXData(): void; - triggerScrollYEvent(event: any): void; - debounceScrollY: any; - debounceScrollLoad: any; - loadScrollYData(event: any): void; - getRowHeight(): any; - computeScrollLoad(): any; - updateScrollXData(): void; - updateScrollXSpace(): void; - updateScrollYData(): void; - updateScrollYSpace(): void; - updateScrollLoadBar(event: any): void; - scrollTo(scrollLeft: any, scrollTop: any): any; - scrollToRow(row: any, column: any, isDelay: any, move: any): any; - scrollToTreeRow(row: any): any; - scrollToColumn(column: any, isDelay: any, move: any): any; - resetScrollTop(): void; - clearScroll(): any; - updateFooter(): any; - updateStatus(scope: any, cellValue: any, renderOpts: any): any; - updateScrollStatus: any; - getAsyncColumnUniqueKey(property: any, row: any): string; - getAsyncColumnName(property: any): string; - collectAsyncColumn(tableData: any): any[]; - handleAsyncColumn(tableData: any): void; - handleResolveColumn(tableData: any, fetchColumns: any): void; - connect({ toolbar }: { - toolbar: any; - }): void; - getEventTargetNode: any; - initMultipleHistory(): void; - showSelectToolbar(): any; - toggleSelectToolbarVisible(): any; - }; -}; -export default _default; diff --git a/typings/grid/src/table/src/utils/autoCellWidth.d.ts b/typings/grid/src/table/src/utils/autoCellWidth.d.ts deleted file mode 100644 index 827814f20..000000000 --- a/typings/grid/src/table/src/utils/autoCellWidth.d.ts +++ /dev/null @@ -1,7 +0,0 @@ -export declare const calcTableWidth: ({ bodyWidth, columnStore, fit, minCellWidth, remainWidth }: { - bodyWidth: any; - columnStore: any; - fit: any; - minCellWidth: any; - remainWidth: any; -}) => any; diff --git a/typings/grid/src/table/src/utils/computeScrollLoad.d.ts b/typings/grid/src/table/src/utils/computeScrollLoad.d.ts deleted file mode 100644 index 9327d61aa..000000000 --- a/typings/grid/src/table/src/utils/computeScrollLoad.d.ts +++ /dev/null @@ -1,16 +0,0 @@ -export declare function computeScrollYLoad({ _vm, scrollLoad, scrollY, scrollYLoad, scrollYStore, tableBodyElem }: { - _vm: any; - scrollLoad: any; - scrollY: any; - scrollYLoad: any; - scrollYStore: any; - tableBodyElem: any; -}): void; -export declare function computeScrollXLoad({ _vm, scrollX, scrollXLoad, scrollXStore, tableBodyElem, visibleColumn }: { - _vm: any; - scrollX: any; - scrollXLoad: any; - scrollXStore: any; - tableBodyElem: any; - visibleColumn: any; -}): void; diff --git a/typings/grid/src/table/src/utils/handleGlobalKeydownEvent.d.ts b/typings/grid/src/table/src/utils/handleGlobalKeydownEvent.d.ts deleted file mode 100644 index c3da85ee9..000000000 --- a/typings/grid/src/table/src/utils/handleGlobalKeydownEvent.d.ts +++ /dev/null @@ -1 +0,0 @@ -export declare function onGlobalKeydown(event: any, _vm: any): any; diff --git a/typings/grid/src/table/src/utils/handleGlobalMousedownEvent.d.ts b/typings/grid/src/table/src/utils/handleGlobalMousedownEvent.d.ts deleted file mode 100644 index 97e724fd1..000000000 --- a/typings/grid/src/table/src/utils/handleGlobalMousedownEvent.d.ts +++ /dev/null @@ -1,43 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -export declare function handleGlobalMousedownOnFilterWrapper({ $el, _vm, event, filterStore, filterWrapper }: { - $el: any; - _vm: any; - event: any; - filterStore: any; - filterWrapper: any; -}): void; -export declare function handleGlobalMousedownOnCtxMenu({ _vm, ctxMenuStore, event }: { - _vm: any; - ctxMenuStore: any; - event: any; -}): void; -export declare function handleGlobalBlurOutside({ _vm, actived, event }: { - _vm: any; - actived: any; - event: any; -}): boolean; -export declare function handleGlobalIsClear({ $el, _vm, actived, editConfig, event, isClear, isReadonlyCol }: { - $el: any; - _vm: any; - actived: any; - editConfig: any; - event: any; - isClear: any; - isReadonlyCol: any; -}): any; -export declare function handleGlobalClearActived({ $el, _vm, event, isClear }: { - $el: any; - _vm: any; - event: any; - isClear: any; -}): void; diff --git a/typings/grid/src/table/src/utils/handleLocalFilter.d.ts b/typings/grid/src/table/src/utils/handleLocalFilter.d.ts deleted file mode 100644 index c9ad7f267..000000000 --- a/typings/grid/src/table/src/utils/handleLocalFilter.d.ts +++ /dev/null @@ -1,37 +0,0 @@ -export declare function handleFilterConditionCustom({ column, condition, method, property, row }: { - column: any; - condition: any; - method: any; - property: any; - row: any; -}): { - flag: boolean; - result: null; -}; -export declare function handleFilterConditionExtend({ column, condition, property, row }: { - column: any; - condition: any; - property: any; - row: any; -}): { - flag: boolean; - result: null; -}; -export declare function handleFilterRelations({ inputFilter }: { - inputFilter: any; -}): any; -export declare function handleFilterCheckStr({ column, relationMethod, relations, row }: { - column: any; - relationMethod: any; - relations: any; - row: any; -}): (value: any, input: any, relation: any) => boolean; -export declare function handleFilterCheck({ checkStr, empty, input, property, relation, row, valueList }: { - checkStr: any; - empty: any; - input: any; - property: any; - relation: any; - row: any; - valueList: any; -}): () => any; diff --git a/typings/grid/src/table/src/utils/handleOtherKeyDown.d.ts b/typings/grid/src/table/src/utils/handleOtherKeyDown.d.ts deleted file mode 100644 index ed6b0f3f2..000000000 --- a/typings/grid/src/table/src/utils/handleOtherKeyDown.d.ts +++ /dev/null @@ -1,12 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -export declare function checkOtherKey(keyCode: any): boolean; diff --git a/typings/grid/src/table/src/utils/handleResolveColumn.d.ts b/typings/grid/src/table/src/utils/handleResolveColumn.d.ts deleted file mode 100644 index 148b681c8..000000000 --- a/typings/grid/src/table/src/utils/handleResolveColumn.d.ts +++ /dev/null @@ -1,28 +0,0 @@ -export declare function mapFetchColumnPromise({ _vm, fetchColumns, tableColumn }: { - _vm: any; - fetchColumns: any; - tableColumn: any; -}): any; -export declare function preprocessDataObjectFormat({ columnCount, columnValues, columnValuesMap, fields }: { - columnCount: any; - columnValues: any; - columnValuesMap: any; - fields: any; -}): void; -export declare function preventDupRender({ asyncColumnName, cellTexts, cellValuesCount, columnData, columnValuesMap, isRender, property, renderCount, row, splitConfig }: { - asyncColumnName: any; - cellTexts: any; - cellValuesCount: any; - columnData: any; - columnValuesMap: any; - isRender: any; - property: any; - renderCount: any; - row: any; - splitConfig: any; -}): any; -export declare function handleResolveColumnComplete({ _vm, columnData, complete }: { - _vm: any; - columnData: any; - complete: any; -}): void; diff --git a/typings/grid/src/table/src/utils/handleSelectRow.d.ts b/typings/grid/src/table/src/utils/handleSelectRow.d.ts deleted file mode 100644 index e67656d9e..000000000 --- a/typings/grid/src/table/src/utils/handleSelectRow.d.ts +++ /dev/null @@ -1,6 +0,0 @@ -export declare function hasCheckField({ row }: { - row: any; -}, value: any, _vm: any): any; -export declare function hasNoCheckField({ row }: { - row: any; -}, value: any, _vm: any): void; diff --git a/typings/grid/src/table/src/utils/handleTooltip.d.ts b/typings/grid/src/table/src/utils/handleTooltip.d.ts deleted file mode 100644 index 1192577e8..000000000 --- a/typings/grid/src/table/src/utils/handleTooltip.d.ts +++ /dev/null @@ -1,27 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -export declare function createTooltipRange({ _vm, cell, column, isHeader }: { - _vm: any; - cell: any; - column: any; - isHeader: any; -}): Range; -export declare function processContentMethod({ _vm, column, content, contentMethod, event, isHeader, row, showTip }: { - _vm: any; - column: any; - content: any; - contentMethod: any; - event: any; - isHeader: any; - row: any; - showTip: any; -}): void; diff --git a/typings/grid/src/table/src/utils/refreshColumn.d.ts b/typings/grid/src/table/src/utils/refreshColumn.d.ts deleted file mode 100644 index a0eb509fc..000000000 --- a/typings/grid/src/table/src/utils/refreshColumn.d.ts +++ /dev/null @@ -1,46 +0,0 @@ -export declare function onGroupHeader({ _vm, isGroup, headerProps }: { - _vm: any; - isGroup: any; - headerProps: any; -}): void; -export declare function reassignNotFixed({ centerList, column }: { - centerList: any; - column: any; -}): void; -export declare function reassignFixedRight({ column, columnIndex, isColspan, rightEndIndex, rightList }: { - column: any; - columnIndex: any; - isColspan: any; - rightEndIndex: any; - rightList: any; -}): { - isColspan: any; - rightEndIndex: any; -}; -export declare function reassignFixedLeft({ column, columnIndex, isColspan, leftList, leftStartIndex, letIndex }: { - column: any; - columnIndex: any; - isColspan: any; - leftList: any; - leftStartIndex: any; - letIndex: any; -}): { - leftStartIndex: any; - letIndex: any; - isColspan: any; -}; -export declare function showGroupFixedError({ isColspan, isGroup, leftStartIndex, rightEndIndex, visibleColumn }: { - isColspan: any; - isGroup: any; - leftStartIndex: any; - rightEndIndex: any; - visibleColumn: any; -}): void; -export declare function onScrollXLoad({ _vm, scrollX, scrollXLoad, scrollXStore, tableColumn, visibleColumn }: { - _vm: any; - scrollX: any; - scrollXLoad: any; - scrollXStore: any; - tableColumn: any; - visibleColumn: any; -}): any; diff --git a/typings/grid/src/table/src/utils/rowDrop.d.ts b/typings/grid/src/table/src/utils/rowDrop.d.ts deleted file mode 100644 index 6cb03a19a..000000000 --- a/typings/grid/src/table/src/utils/rowDrop.d.ts +++ /dev/null @@ -1,5 +0,0 @@ -declare function createHandlerOnEnd({ _vm, refresh }: { - _vm: any; - refresh: any; -}): (event: any) => any; -export { createHandlerOnEnd }; diff --git a/typings/grid/src/table/src/utils/setAllSelection.d.ts b/typings/grid/src/table/src/utils/setAllSelection.d.ts deleted file mode 100644 index d9eba3d53..000000000 --- a/typings/grid/src/table/src/utils/setAllSelection.d.ts +++ /dev/null @@ -1,26 +0,0 @@ -export declare function hasCheckFieldNoStrictly({ afterFullData, checkMethod, checkStrictly, property, selection, treeConfig, value }: { - afterFullData: any; - checkMethod: any; - checkStrictly: any; - property: any; - selection: any; - treeConfig: any; - value: any; -}): void; -export declare function hasNoCheckFieldNoStrictly({ afterFullData, checkMethod, checkStrictly, property, selection, treeConfig, value }: { - afterFullData: any; - checkMethod: any; - checkStrictly: any; - property: any; - selection: any; - treeConfig: any; - value: any; -}): any; -export declare function setSelectionNoStrictly({ _vm, checkStrictly, reserve, selectRows, selection, value }: { - _vm: any; - checkStrictly: any; - reserve: any; - selectRows: any; - selection: any; - value: any; -}): void; diff --git a/typings/grid/src/table/src/utils/triggerCellClickEvent.d.ts b/typings/grid/src/table/src/utils/triggerCellClickEvent.d.ts deleted file mode 100644 index 74dd5d29a..000000000 --- a/typings/grid/src/table/src/utils/triggerCellClickEvent.d.ts +++ /dev/null @@ -1,61 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -export declare function isTargetRadioOrCheckbox(event: any, column: any, colType: any, targetType: any): any; -export declare function onClickExpandColumn({ $el, _vm, column, event, expandConfig, params }: { - $el: any; - _vm: any; - column: any; - event: any; - expandConfig: any; - params: any; -}): void; -export declare function onClickTreeNodeColumn({ _vm, column, event, params, treeConfig }: { - _vm: any; - column: any; - event: any; - params: any; - treeConfig: any; -}): void; -export declare function onHighlightCurrentRow({ $el, _vm, event, highlightCurrentRow, params, radioConfig }: { - $el: any; - _vm: any; - event: any; - highlightCurrentRow: any; - params: any; - radioConfig: any; -}): void; -export declare function onClickRadioColumn({ $el, _vm, column, event, params, radioConfig }: { - $el: any; - _vm: any; - column: any; - event: any; - params: any; - radioConfig: any; -}): void; -export declare function onClickSelectColumn({ _vm, column, event, params, selectConfig }: { - _vm: any; - column: any; - event: any; - params: any; - selectConfig: any; -}): void; -export declare function onClickCellSelect({ _vm, actived, cell, column, editConfig, event, mouseConfig, params, row }: { - _vm: any; - actived: any; - cell: any; - column: any; - editConfig: any; - event: any; - mouseConfig: any; - params: any; - row: any; -}): void; diff --git a/typings/grid/src/table/src/utils/updateStyle.d.ts b/typings/grid/src/table/src/utils/updateStyle.d.ts deleted file mode 100644 index e288b70a0..000000000 --- a/typings/grid/src/table/src/utils/updateStyle.d.ts +++ /dev/null @@ -1,5 +0,0 @@ -export declare function handleLayout(params: any): { - tableColumn: any; - maxHeight: any; - minHeight: any; -}; diff --git a/typings/grid/src/tools/formatter.d.ts b/typings/grid/src/tools/formatter.d.ts deleted file mode 100644 index bf30971b6..000000000 --- a/typings/grid/src/tools/formatter.d.ts +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -declare const _default: { - money(value: any): any; - enum(value: any): any; - select(cellValue: any): any; - number(value: any): any; - integer(value: any): any; - filesize(value: any): any; - date(value: any): any; - dateTime(value: any): any; - longDateTime(value: any): any; - time(value: any): any; - longTime(value: any): any; - yearMonth(value: any): any; - ellipsis(value: any): (h: any) => any; - rate(value: any): any; - boole(value: any): any; -}; -export default _default; diff --git a/typings/grid/src/tools/index.d.ts b/typings/grid/src/tools/index.d.ts deleted file mode 100644 index 500268fa2..000000000 --- a/typings/grid/src/tools/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -export declare const getCellLabel: (row: any, column: any, params: any) => any; -export declare const warn: (message: any) => string; -export declare const error: (message: any) => string; diff --git a/typings/grid/src/validator/index.d.ts b/typings/grid/src/validator/index.d.ts deleted file mode 100644 index f16ef6a4a..000000000 --- a/typings/grid/src/validator/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -declare const _default: { - install(Table: any): void; -}; -export default _default; diff --git a/typings/grid/src/validator/src/methods.d.ts b/typings/grid/src/validator/src/methods.d.ts deleted file mode 100644 index 40c23c4f0..000000000 --- a/typings/grid/src/validator/src/methods.d.ts +++ /dev/null @@ -1,37 +0,0 @@ -declare const _default: { - _validate(rows: any, cb: any): Promise; - _fullValidate(rows: any, cb: any): Promise; - handleValidError(params: any): void; - validatePromise(row: any, column: any, columnIndex: any, isAll: any, validRest: any): Promise; - /** - * 对表格数据进行校验 - * 如果传 row 指定行记录,则只验证传入的行 - * 如果传 rows 为多行记录,则只验证传入的行 - * 如果只传 callback 否则默认验证整个表格数据 - * 返回 Promise 对象,或者使用回调方式 - */ - beginValidate(rows: any, cb: any, isAll: any): Promise; - hasCellRules(type: any, row: any, { property }: { - property: any; - }): any; - /** - * 校验数据: - * 按表格行顺序、列顺序依次校验(同步或异步); - * 根据校验规则的索引顺序依次校验,如果是异步则会等待校验完成才会继续校验下一列; - * 如果校验失败,则触发回调或者Promise,结果返回一个Boolean值; - * 如果是传回调方式这返回一个Boolean值和校验不通过列的错误消息; - * - * rule 配置: - * required为Boolean表示是否必填; - * max为Number表示最大长度; - * min为Number表示最小长度; - * validator为Function(rule, value, callback, {rules, row, column, rowIndex, columnIndex})进行自定义校验; - * trigger为blur|change表示触发方式(默认为空就行,除非特殊场景); - */ - validCellRules(type: any, row: any, column: any, defVal: any): Promise; - _clearValidate(): any; - triggerValidate(type: any): Promise; - showValidTooltip(params: any): void; - clostValidTooltip(): any; -}; -export default _default; diff --git a/typings/grid/src/validator/src/utils/beginValidate.d.ts b/typings/grid/src/validator/src/utils/beginValidate.d.ts deleted file mode 100644 index 213d65f04..000000000 --- a/typings/grid/src/validator/src/utils/beginValidate.d.ts +++ /dev/null @@ -1,23 +0,0 @@ -export declare function adjustParams(rows: any, cb: any, vaildDatas: any): { - cb: any; - vaildDatas: any; -}; -export declare function columnHandler({ _vm, colVailds, editRules, isAll, row, validRest }: { - _vm: any; - colVailds: any; - editRules: any; - isAll: any; - row: any; - validRest: any; -}): (column: any, columnIndex: any) => void; -export declare function hasNoEditRules(cb: any, status: any): void; -export declare function realValid({ _vm, editRules, isAll, validRest, treeConfig, hasTreeExpand, vaildDatas, treeOpts }: { - _vm: any; - editRules: any; - isAll: any; - validRest: any; - treeConfig: any; - hasTreeExpand: any; - vaildDatas: any; - treeOpts: any; -}): any[]; diff --git a/typings/hrapprover/index.d.ts b/typings/hrapprover/index.d.ts deleted file mode 100644 index e1f868edd..000000000 --- a/typings/hrapprover/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import Hrapprover from './src/index'; -import '@opentiny/vue-theme/hrapprover/index.css'; -export default Hrapprover; diff --git a/typings/hrapprover/src/index.d.ts b/typings/hrapprover/src/index.d.ts deleted file mode 100644 index 48a1cc5cc..000000000 --- a/typings/hrapprover/src/index.d.ts +++ /dev/null @@ -1,44 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - modelValue: StringConstructor; - approvalPerson: { - type: StringConstructor; - default: string; - }; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - category: { - type: StringConstructor; - default: string; - }; - title: StringConstructor; - fetchHrapprover: FunctionConstructor; - fetchDeptList: FunctionConstructor; - fetchDeptByValue: FunctionConstructor; - fetchDept: FunctionConstructor; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - disabled: boolean; - approvalPerson: string; - category: string; -}>; -export default _default; diff --git a/typings/hrapprover/src/pc.vue.d.ts b/typings/hrapprover/src/pc.vue.d.ts deleted file mode 100644 index 1eacb0982..000000000 --- a/typings/hrapprover/src/pc.vue.d.ts +++ /dev/null @@ -1,46 +0,0 @@ -declare const _default: { - inheritAttrs: boolean; - props: string[]; - components: { - Dept: any; - Radio: any; - }; - directives: { - loading: any; - }; - provide(): { - hrapprover: { - inheritAttrs: boolean; - props: string[]; - components: { - Dept: any; - Radio: any; - }; - directives: { - loading: any; - }; - provide(): any; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - } & { - showModal(): void; - }; - }; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - } & { - showModal(): void; - }; -}; -export default _default; diff --git a/typings/icon/add/index.d.ts b/typings/icon/add/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/add/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/administrator/index.d.ts b/typings/icon/administrator/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/administrator/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/align-baseline/index.d.ts b/typings/icon/align-baseline/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/align-baseline/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/align-center/index.d.ts b/typings/icon/align-center/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/align-center/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/align-flex-center/index.d.ts b/typings/icon/align-flex-center/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/align-flex-center/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/align-flex-end/index.d.ts b/typings/icon/align-flex-end/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/align-flex-end/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/align-flex-start/index.d.ts b/typings/icon/align-flex-start/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/align-flex-start/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/align-justify/index.d.ts b/typings/icon/align-justify/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/align-justify/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/align-left/index.d.ts b/typings/icon/align-left/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/align-left/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/align-right/index.d.ts b/typings/icon/align-right/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/align-right/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/align-stretch/index.d.ts b/typings/icon/align-stretch/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/align-stretch/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/angularjs/index.d.ts b/typings/icon/angularjs/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/angularjs/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/app/index.d.ts b/typings/icon/app/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/app/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/application/index.d.ts b/typings/icon/application/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/application/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/area-chart/index.d.ts b/typings/icon/area-chart/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/area-chart/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/arrow-down/index.d.ts b/typings/icon/arrow-down/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/arrow-down/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/arrow-left/index.d.ts b/typings/icon/arrow-left/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/arrow-left/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/arrow-right/index.d.ts b/typings/icon/arrow-right/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/arrow-right/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/arrow-up/index.d.ts b/typings/icon/arrow-up/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/arrow-up/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/ascending/index.d.ts b/typings/icon/ascending/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/ascending/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/association/index.d.ts b/typings/icon/association/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/association/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/attachment/index.d.ts b/typings/icon/attachment/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/attachment/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/bar-chart/index.d.ts b/typings/icon/bar-chart/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/bar-chart/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/befilter/index.d.ts b/typings/icon/befilter/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/befilter/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/boat/index.d.ts b/typings/icon/boat/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/boat/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/box-solid/index.d.ts b/typings/icon/box-solid/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/box-solid/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/busy/index.d.ts b/typings/icon/busy/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/busy/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/calculator/index.d.ts b/typings/icon/calculator/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/calculator/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/calendar/index.d.ts b/typings/icon/calendar/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/calendar/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/check-out/index.d.ts b/typings/icon/check-out/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/check-out/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/check/index.d.ts b/typings/icon/check/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/check/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/checked-linear/index.d.ts b/typings/icon/checked-linear/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/checked-linear/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/checked-sur/index.d.ts b/typings/icon/checked-sur/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/checked-sur/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/checked-true/index.d.ts b/typings/icon/checked-true/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/checked-true/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/chevron-down/index.d.ts b/typings/icon/chevron-down/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/chevron-down/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/chevron-left/index.d.ts b/typings/icon/chevron-left/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/chevron-left/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/chevron-right/index.d.ts b/typings/icon/chevron-right/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/chevron-right/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/chevron-up/index.d.ts b/typings/icon/chevron-up/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/chevron-up/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/clear-filter/index.d.ts b/typings/icon/clear-filter/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/clear-filter/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/clock-work/index.d.ts b/typings/icon/clock-work/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/clock-work/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/close-circle/index.d.ts b/typings/icon/close-circle/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/close-circle/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/close-square/index.d.ts b/typings/icon/close-square/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/close-square/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/close/index.d.ts b/typings/icon/close/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/close/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/cloud-download/index.d.ts b/typings/icon/cloud-download/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/cloud-download/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/cloud-upload/index.d.ts b/typings/icon/cloud-upload/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/cloud-upload/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/code/index.d.ts b/typings/icon/code/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/code/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/coin/index.d.ts b/typings/icon/coin/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/coin/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/col-reverse/index.d.ts b/typings/icon/col-reverse/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/col-reverse/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/commission/index.d.ts b/typings/icon/commission/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/commission/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/conment-refresh/index.d.ts b/typings/icon/conment-refresh/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/conment-refresh/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/copy-solid/index.d.ts b/typings/icon/copy-solid/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/copy-solid/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/copy/index.d.ts b/typings/icon/copy/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/copy/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/course/index.d.ts b/typings/icon/course/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/course/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/crop/index.d.ts b/typings/icon/crop/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/crop/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/cue-l/index.d.ts b/typings/icon/cue-l/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/cue-l/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/custom/index.d.ts b/typings/icon/custom/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/custom/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/customer-service/index.d.ts b/typings/icon/customer-service/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/customer-service/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/data-source/index.d.ts b/typings/icon/data-source/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/data-source/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/default/index.d.ts b/typings/icon/default/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/default/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/defined-filtration/index.d.ts b/typings/icon/defined-filtration/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/defined-filtration/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/del/index.d.ts b/typings/icon/del/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/del/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/delete-page/index.d.ts b/typings/icon/delete-page/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/delete-page/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/deleted/index.d.ts b/typings/icon/deleted/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/deleted/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/delta-down-o/index.d.ts b/typings/icon/delta-down-o/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/delta-down-o/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/delta-down/index.d.ts b/typings/icon/delta-down/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/delta-down/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/delta-left-o/index.d.ts b/typings/icon/delta-left-o/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/delta-left-o/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/delta-left/index.d.ts b/typings/icon/delta-left/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/delta-left/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/delta-right-o/index.d.ts b/typings/icon/delta-right-o/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/delta-right-o/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/delta-right/index.d.ts b/typings/icon/delta-right/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/delta-right/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/delta-up-o/index.d.ts b/typings/icon/delta-up-o/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/delta-up-o/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/delta-up/index.d.ts b/typings/icon/delta-up/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/delta-up/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/derive/index.d.ts b/typings/icon/derive/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/derive/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/descending/index.d.ts b/typings/icon/descending/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/descending/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/desktop-view/index.d.ts b/typings/icon/desktop-view/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/desktop-view/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/dialog/index.d.ts b/typings/icon/dialog/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/dialog/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/dialog2/index.d.ts b/typings/icon/dialog2/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/dialog2/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/direction-col/index.d.ts b/typings/icon/direction-col/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/direction-col/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/direction-row/index.d.ts b/typings/icon/direction-row/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/direction-row/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/dot-chart/index.d.ts b/typings/icon/dot-chart/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/dot-chart/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/dot-ipv4/index.d.ts b/typings/icon/dot-ipv4/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/dot-ipv4/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/double-left/index.d.ts b/typings/icon/double-left/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/double-left/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/double-right/index.d.ts b/typings/icon/double-right/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/double-right/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/down-o/index.d.ts b/typings/icon/down-o/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/down-o/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/down/index.d.ts b/typings/icon/down/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/down/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/download-cloud/index.d.ts b/typings/icon/download-cloud/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/download-cloud/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/download-link/index.d.ts b/typings/icon/download-link/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/download-link/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/download/index.d.ts b/typings/icon/download/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/download/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/draft/index.d.ts b/typings/icon/draft/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/draft/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/edit/index.d.ts b/typings/icon/edit/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/edit/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-align-center/index.d.ts b/typings/icon/editor-align-center/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-align-center/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-align-left/index.d.ts b/typings/icon/editor-align-left/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-align-left/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-align-right/index.d.ts b/typings/icon/editor-align-right/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-align-right/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-background/index.d.ts b/typings/icon/editor-background/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-background/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-bold/index.d.ts b/typings/icon/editor-bold/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-bold/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-code/index.d.ts b/typings/icon/editor-code/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-code/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-deleteline/index.d.ts b/typings/icon/editor-deleteline/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-deleteline/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-eraser/index.d.ts b/typings/icon/editor-eraser/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-eraser/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-italic/index.d.ts b/typings/icon/editor-italic/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-italic/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-left-border/index.d.ts b/typings/icon/editor-left-border/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-left-border/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-list-dot/index.d.ts b/typings/icon/editor-list-dot/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-list-dot/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-list-num/index.d.ts b/typings/icon/editor-list-num/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-list-num/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-list/index.d.ts b/typings/icon/editor-list/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-list/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-menu-left/index.d.ts b/typings/icon/editor-menu-left/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-menu-left/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-menu-right/index.d.ts b/typings/icon/editor-menu-right/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-menu-right/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-quote/index.d.ts b/typings/icon/editor-quote/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-quote/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-redo/index.d.ts b/typings/icon/editor-redo/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-redo/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-right-border/index.d.ts b/typings/icon/editor-right-border/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-right-border/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-sub/index.d.ts b/typings/icon/editor-sub/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-sub/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-subtitle/index.d.ts b/typings/icon/editor-subtitle/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-subtitle/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-super/index.d.ts b/typings/icon/editor-super/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-super/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-tab/index.d.ts b/typings/icon/editor-tab/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-tab/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-table/index.d.ts b/typings/icon/editor-table/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-table/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-textcolor/index.d.ts b/typings/icon/editor-textcolor/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-textcolor/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-title/index.d.ts b/typings/icon/editor-title/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-title/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-underline/index.d.ts b/typings/icon/editor-underline/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-underline/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-undo/index.d.ts b/typings/icon/editor-undo/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-undo/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/editor-video/index.d.ts b/typings/icon/editor-video/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/editor-video/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/ellipsis/index.d.ts b/typings/icon/ellipsis/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/ellipsis/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/email-add/index.d.ts b/typings/icon/email-add/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/email-add/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/email-circle/index.d.ts b/typings/icon/email-circle/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/email-circle/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/end/index.d.ts b/typings/icon/end/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/end/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/error/index.d.ts b/typings/icon/error/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/error/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/espace-auto/index.d.ts b/typings/icon/espace-auto/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/espace-auto/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/espace/index.d.ts b/typings/icon/espace/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/espace/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/excel/index.d.ts b/typings/icon/excel/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/excel/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/exception/index.d.ts b/typings/icon/exception/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/exception/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/exclamation/index.d.ts b/typings/icon/exclamation/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/exclamation/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/export/index.d.ts b/typings/icon/export/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/export/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/express-search/index.d.ts b/typings/icon/express-search/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/express-search/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/eyeclose/index.d.ts b/typings/icon/eyeclose/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/eyeclose/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/eyeopen/index.d.ts b/typings/icon/eyeopen/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/eyeopen/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/file-cloudupload/index.d.ts b/typings/icon/file-cloudupload/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/file-cloudupload/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/file-excel/index.d.ts b/typings/icon/file-excel/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/file-excel/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/file/index.d.ts b/typings/icon/file/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/file/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/files-circle/index.d.ts b/typings/icon/files-circle/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/files-circle/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/files/index.d.ts b/typings/icon/files/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/files/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/filetext/index.d.ts b/typings/icon/filetext/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/filetext/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/fileupload/index.d.ts b/typings/icon/fileupload/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/fileupload/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/filtered/index.d.ts b/typings/icon/filtered/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/filtered/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/flag/index.d.ts b/typings/icon/flag/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/flag/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/folder-closed/index.d.ts b/typings/icon/folder-closed/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/folder-closed/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/folder-opened/index.d.ts b/typings/icon/folder-opened/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/folder-opened/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/font-color/index.d.ts b/typings/icon/font-color/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/font-color/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/font-family/index.d.ts b/typings/icon/font-family/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/font-family/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/font-size/index.d.ts b/typings/icon/font-size/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/font-size/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/font-style/index.d.ts b/typings/icon/font-style/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/font-style/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/font-weight/index.d.ts b/typings/icon/font-weight/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/font-weight/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/freeze-left/index.d.ts b/typings/icon/freeze-left/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/freeze-left/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/freeze-right/index.d.ts b/typings/icon/freeze-right/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/freeze-right/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/frown-o/index.d.ts b/typings/icon/frown-o/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/frown-o/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/frown/index.d.ts b/typings/icon/frown/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/frown/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/fullscreen-left/index.d.ts b/typings/icon/fullscreen-left/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/fullscreen-left/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/fullscreen/index.d.ts b/typings/icon/fullscreen/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/fullscreen/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/grade/index.d.ts b/typings/icon/grade/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/grade/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/group-transfer/index.d.ts b/typings/icon/group-transfer/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/group-transfer/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/group/index.d.ts b/typings/icon/group/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/group/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/halfchecked/index.d.ts b/typings/icon/halfchecked/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/halfchecked/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/halfselect/index.d.ts b/typings/icon/halfselect/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/halfselect/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/heartempty/index.d.ts b/typings/icon/heartempty/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/heartempty/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/help-circle/index.d.ts b/typings/icon/help-circle/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/help-circle/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/help-query/index.d.ts b/typings/icon/help-query/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/help-query/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/help-solid/index.d.ts b/typings/icon/help-solid/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/help-solid/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/help/index.d.ts b/typings/icon/help/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/help/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/helpful/index.d.ts b/typings/icon/helpful/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/helpful/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/hide-left/index.d.ts b/typings/icon/hide-left/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/hide-left/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/hide-right/index.d.ts b/typings/icon/hide-right/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/hide-right/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/hide-topleft/index.d.ts b/typings/icon/hide-topleft/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/hide-topleft/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/import/index.d.ts b/typings/icon/import/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/import/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/index.d.ts b/typings/icon/index.d.ts deleted file mode 100644 index d94816bc8..000000000 --- a/typings/icon/index.d.ts +++ /dev/null @@ -1,630 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import IconAdd from './add'; -import IconAdministrator from './administrator'; -import IconAlignBaseline from './align-baseline'; -import IconAlignCenter from './align-center'; -import IconAlignFlexCenter from './align-flex-center'; -import IconAlignFlexEnd from './align-flex-end'; -import IconAlignFlexStart from './align-flex-start'; -import IconAlignJustify from './align-justify'; -import IconAlignLeft from './align-left'; -import IconAlignRight from './align-right'; -import IconAlignStretch from './align-stretch'; -import IconAngularjs from './angularjs'; -import IconApp from './app'; -import IconApplication from './application'; -import IconAreaChart from './area-chart'; -import IconArrowDown from './arrow-down'; -import IconArrowLeft from './arrow-left'; -import IconArrowRight from './arrow-right'; -import IconArrowUp from './arrow-up'; -import IconAscending from './ascending'; -import IconAssociation from './association'; -import IconAttachment from './attachment'; -import IconBarChart from './bar-chart'; -import IconBefilter from './befilter'; -import IconBoat from './boat'; -import IconBoxSolid from './box-solid'; -import IconBusy from './busy'; -import IconCalculator from './calculator'; -import IconCalendar from './calendar'; -import IconCheckOut from './check-out'; -import IconCheck from './check'; -import IconCheckedLinear from './checked-linear'; -import IconCheckedSur from './checked-sur'; -import IconCheckedTrue from './checked-true'; -import IconChevronDown from './chevron-down'; -import IconChevronLeft from './chevron-left'; -import IconChevronRight from './chevron-right'; -import IconChevronUp from './chevron-up'; -import IconClearFilter from './clear-filter'; -import IconClockWork from './clock-work'; -import IconCloseCircle from './close-circle'; -import IconCloseSquare from './close-square'; -import IconClose from './close'; -import IconCloudDownload from './cloud-download'; -import IconCloudUpload from './cloud-upload'; -import IconCode from './code'; -import IconCoin from './coin'; -import IconColReverse from './col-reverse'; -import IconCommission from './commission'; -import IconConmentRefresh from './conment-refresh'; -import IconCopySolid from './copy-solid'; -import IconCopy from './copy'; -import IconCourse from './course'; -import IconCueL from './cue-l'; -import IconCustom from './custom'; -import IconCustomerService from './customer-service'; -import IconCrop from './crop'; -import IconDataSource from './data-source'; -import IconDefault from './default'; -import IconDefinedFiltration from './defined-filtration'; -import IconDel from './del'; -import IconDeletePage from './delete-page'; -import IconDeleted from './deleted'; -import IconDeltaDownO from './delta-down-o'; -import IconDeltaDown from './delta-down'; -import IconDeltaLeftO from './delta-left-o'; -import IconDeltaLeft from './delta-left'; -import IconDeltaRightO from './delta-right-o'; -import IconDeltaRight from './delta-right'; -import IconDeltaUpO from './delta-up-o'; -import IconDeltaUp from './delta-up'; -import IconDerive from './derive'; -import IconDescending from './descending'; -import IconDesktopView from './desktop-view'; -import IconDialog from './dialog'; -import IconDialog2 from './dialog2'; -import IconDirectionCol from './direction-col'; -import IconDirectionRow from './direction-row'; -import IconDotChart from './dot-chart'; -import IconDotIpv4 from './dot-ipv4'; -import IconDoubleLeft from './double-left'; -import IconDoubleRight from './double-right'; -import IconDownO from './down-o'; -import IconDown from './down'; -import IconDownloadCloud from './download-cloud'; -import IconDownloadLink from './download-link'; -import IconDownload from './download'; -import IconDraft from './draft'; -import IconEdit from './edit'; -import IconEditorTab from './editor-tab'; -import IconEllipsis from './ellipsis'; -import IconEmailAdd from './email-add'; -import IconEmailCircle from './email-circle'; -import IconEnd from './end'; -import IconError from './error'; -import IconEspaceAuto from './espace-auto'; -import IconEspace from './espace'; -import IconExcel from './excel'; -import IconException from './exception'; -import IconExclamation from './exclamation'; -import IconExport from './export'; -import IconExpressSearch from './express-search'; -import IconEyeclose from './eyeclose'; -import IconEyeopen from './eyeopen'; -import IconEditorAlignCenter from './editor-align-center'; -import IconEditorAlignLeft from './editor-align-left'; -import IconEditorAlignRight from './editor-align-right'; -import IconEditorBackground from './editor-background'; -import IconEditorBold from './editor-bold'; -import IconEditorCode from './editor-code'; -import IconEditorDeleteline from './editor-deleteline'; -import IconEditorEraser from './editor-eraser'; -import IconEditorItalic from './editor-italic'; -import IconEditorLeftBorder from './editor-left-border'; -import IconEditorList from './editor-list'; -import IconEditorListDot from './editor-list-dot'; -import IconEditorListNum from './editor-list-num'; -import IconEditorMenuLeft from './editor-menu-left'; -import IconEditorMenuRight from './editor-menu-right'; -import IconEditorQuote from './editor-quote'; -import IconEditorRedo from './editor-redo'; -import IconEditorRightBorder from './editor-right-border'; -import IconEditorSub from './editor-sub'; -import IconEditorSubtitle from './editor-subtitle'; -import IconEditorSuper from './editor-super'; -import IconEditorTable from './editor-table'; -import IconEditorTextcolor from './editor-textcolor'; -import IconEditorTitle from './editor-title'; -import IconEditorUnderline from './editor-underline'; -import IconEditorUndo from './editor-undo'; -import IconEditorVideo from './editor-video'; -import IconFileCloudupload from './file-cloudupload'; -import IconFileExcel from './file-excel'; -import IconFile from './file'; -import IconFilesCircle from './files-circle'; -import IconFiles from './files'; -import IconFiletext from './filetext'; -import IconFileupload from './fileupload'; -import IconFiltered from './filtered'; -import IconFlag from './flag'; -import IconFolderClosed from './folder-closed'; -import IconFolderOpened from './folder-opened'; -import IconFontColor from './font-color'; -import IconFontFamily from './font-family'; -import IconFontSize from './font-size'; -import IconFontStyle from './font-style'; -import IconFontWeight from './font-weight'; -import IconFreezeLeft from './freeze-left'; -import IconFreezeRight from './freeze-right'; -import IconFrownO from './frown-o'; -import IconFrown from './frown'; -import IconFullscreen from './fullscreen'; -import IconFullscreenLeft from './fullscreen-left'; -import IconGrade from './grade'; -import IconGroupTransfer from './group-transfer'; -import IconGroup from './group'; -import IconHalfchecked from './halfchecked'; -import IconHalfselect from './halfselect'; -import IconHeartempty from './heartempty'; -import IconHelpCircle from './help-circle'; -import IconHelpQuery from './help-query'; -import IconHelpSolid from './help-solid'; -import IconHelp from './help'; -import IconHelpful from './helpful'; -import IconHideLeft from './hide-left'; -import IconHideRight from './hide-right'; -import IconHideTopleft from './hide-topleft'; -import IconImport from './import'; -import IconInfoCircle from './info-circle'; -import IconInfoSolid from './info-solid'; -import IconInfo from './info'; -import IconInformation from './information'; -import IconJs from './js'; -import IconJusitfyCenter from './jusitfy-center'; -import IconJusitfyFlexEnd from './jusitfy-flex-end'; -import IconJusitfySpaceAround from './jusitfy-space-around'; -import IconJusitfySpaceBetween from './jusitfy-space-between'; -import IconJustitfyFlexStart from './justitfy-flex-start'; -import IconLanguage from './language'; -import IconLeave from './leave'; -import IconLeftFrozen from './left-frozen'; -import IconLeftO from './left-o'; -import IconLeftWard from './left-ward'; -import IconLeft from './left'; -import IconLineChart from './line-chart'; -import IconLineHeight from './line-height'; -import IconLineThrought from './line-throught'; -import IconLink from './link'; -import IconLoading from './loading'; -import IconLock from './lock'; -import IconMailContent from './mail-content'; -import IconMail from './mail'; -import IconMale from './male'; -import IconMarkOn from './mark-on'; -import IconMeh from './meh'; -import IconMessageCircle from './message-circle'; -import IconMinscreen from './minscreen'; -import IconMinscreenLeft from './minscreen-left'; -import IconMinusCircle from './minus-circle'; -import IconMinusSquare from './minus-square'; -import IconMinus from './minus'; -import IconMobileView from './mobile-view'; -import IconMobile from './mobile'; -import IconMore from './more'; -import IconNew from './new'; -import IconNoPremission from './no-premission'; -import IconNodeOpen from './node-open'; -import IconNode from './node'; -import IconNodejs from './nodejs'; -import IconNone from './none'; -import IconOffLine from './off-line'; -import IconOnLine from './on-line'; -import IconOperationfaildL from './operationfaild-l'; -import IconOperationfaild from './operationfaild'; -import IconOuterLink from './outer-link'; -import IconPagelink from './pagelink'; -import IconPagerFirst from './pager-first'; -import IconPagerLast from './pager-last'; -import IconPagerNext from './pager-next'; -import IconPagerPrev from './pager-prev'; -import IconPanelMax from './panel-max'; -import IconPanelMini from './panel-mini'; -import IconPanelNormal from './panel-normal'; -import IconPauseCircle from './pause-circle'; -import IconPause from './pause'; -import IconPicture from './picture'; -import IconPieChart from './pie-chart'; -import IconPlusCircle from './plus-circle'; -import IconPlusSquare from './plus-square'; -import IconPlus from './plus'; -import IconPopup from './popup'; -import IconPreChecked from './pre-checked'; -import IconPrintPreview from './print-preview'; -import IconPushpin from './pushpin'; -import IconRadio from './radio'; -import IconRadioselected from './radioselected'; -import IconReactjs from './reactjs'; -import IconRedo from './redo'; -import IconRefres from './refres'; -import IconRenew from './renew'; -import IconRepeat from './repeat'; -import IconReplace from './replace'; -import IconReplies from './replies'; -import IconRightFrozen from './right-frozen'; -import IconRightO from './right-o'; -import IconRight from './right'; -import IconRightward from './rightward'; -import IconRowReverse from './row-reverse'; -import IconSandwichCollapse from './sandwich-collapse'; -import IconSandwichExpand from './sandwich-expand'; -import IconSave from './save'; -import IconScissor from './scissor'; -import IconSearch from './search'; -import IconSelect from './select'; -import IconSent from './sent'; -import IconSeparate from './separate'; -import IconSetting from './setting'; -import IconShare from './share'; -import IconShareArrow from './share-arrow'; -import IconShoppingCard from './shopping-card'; -import IconSmileO from './smile-o'; -import IconSmile from './smile'; -import IconSortDefault from './sort-default'; -import IconSort from './sort'; -import IconStarActive from './star-active'; -import IconStarDisable from './star-disable'; -import IconStarO from './star-o'; -import IconStartCircle from './start-circle'; -import IconStart from './start'; -import IconStatistics from './statistics'; -import IconStop from './stop'; -import IconStreamSolid from './stream-solid'; -import IconSuccess from './success'; -import IconSuccessful from './successful'; -import IconTabletView from './tablet-view'; -import IconTaskCooperation from './task-cooperation'; -import IconTelephoneCircle from './telephone-circle'; -import IconTelephone from './telephone'; -import IconTextAlign from './text-align'; -import IconTextDecoration from './text-decoration'; -import IconTextTab from './text-tab'; -import IconText from './text'; -import IconTime from './time'; -import IconTotal from './total'; -import IconTriangleDown from './triangle-down'; -import IconUndelete from './undelete'; -import IconUnderline from './underline'; -import IconUndo from './undo'; -import IconUnfilter from './unfilter'; -import IconUnfreeze from './unfreeze'; -import IconUnknow from './unknow'; -import IconUnlock from './unlock'; -import IconUnsent from './unsent'; -import IconUpO from './up-o'; -import IconUp from './up'; -import IconUpload from './upload'; -import IconUser from './user'; -import IconVersiontree from './versiontree'; -import IconView from './view'; -import IconVuejs from './vuejs'; -import IconWarningTriangle from './warning-triangle'; -import IconWarning from './warning'; -import IconWebPlus from './web-plus'; -import IconWriting from './writing'; -import IconYes from './yes'; -import IconZoomIn from './zoom-in'; -import IconZoomOut from './zoom-out'; -export * from './lowercase'; -export { IconAdd, IconAdministrator, IconAlignBaseline, IconAlignCenter, IconAlignFlexCenter, IconAlignFlexEnd, IconAlignFlexStart, IconAlignJustify, IconAlignLeft, IconAlignRight, IconAlignStretch, IconAngularjs, IconApp, IconApplication, IconAreaChart, IconArrowDown, IconArrowLeft, IconArrowRight, IconArrowUp, IconAscending, IconAssociation, IconAttachment, IconBarChart, IconBefilter, IconBoat, IconBoxSolid, IconBusy, IconCalculator, IconCalendar, IconCheckOut, IconCheck, IconCheckedLinear, IconCheckedSur, IconCheckedTrue, IconChevronDown, IconChevronLeft, IconChevronRight, IconChevronUp, IconClearFilter, IconClockWork, IconCloseCircle, IconCloseSquare, IconClose, IconCloudDownload, IconCloudUpload, IconCode, IconCoin, IconColReverse, IconCommission, IconConmentRefresh, IconCopySolid, IconCopy, IconCrop, IconCourse, IconCueL, IconCustom, IconCustomerService, IconDataSource, IconDefault, IconDefinedFiltration, IconDel, IconDeletePage, IconDeleted, IconDeltaDownO, IconDeltaDown, IconDeltaLeftO, IconDeltaLeft, IconDeltaRightO, IconDeltaRight, IconDeltaUpO, IconDeltaUp, IconDerive, IconDescending, IconDesktopView, IconDialog, IconDialog2, IconDirectionCol, IconDirectionRow, IconDotChart, IconDotIpv4, IconDoubleLeft, IconDoubleRight, IconDownO, IconDown, IconDownloadCloud, IconDownloadLink, IconDownload, IconDraft, IconEdit, IconEditorTab, IconEllipsis, IconEmailAdd, IconEmailCircle, IconEnd, IconError, IconEspaceAuto, IconEspace, IconExcel, IconException, IconExclamation, IconExport, IconExpressSearch, IconEyeclose, IconEyeopen, IconEditorAlignCenter, IconEditorAlignLeft, IconEditorAlignRight, IconEditorBackground, IconEditorBold, IconEditorCode, IconEditorDeleteline, IconEditorEraser, IconEditorItalic, IconEditorLeftBorder, IconEditorList, IconEditorListDot, IconEditorListNum, IconEditorMenuLeft, IconEditorMenuRight, IconEditorQuote, IconEditorRedo, IconEditorRightBorder, IconEditorSub, IconEditorSubtitle, IconEditorSuper, IconEditorTable, IconEditorTextcolor, IconEditorTitle, IconEditorUnderline, IconEditorUndo, IconEditorVideo, IconFileCloudupload, IconFileExcel, IconFile, IconFilesCircle, IconFiles, IconFiletext, IconFileupload, IconFiltered, IconFlag, IconFolderClosed, IconFolderOpened, IconFontColor, IconFontFamily, IconFontSize, IconFontStyle, IconFontWeight, IconFreezeLeft, IconFreezeRight, IconFrownO, IconFrown, IconFullscreen, IconFullscreenLeft, IconMinscreenLeft, IconGrade, IconGroupTransfer, IconGroup, IconHalfchecked, IconHalfselect, IconHeartempty, IconHelpCircle, IconHelpQuery, IconHelpSolid, IconHelp, IconHelpful, IconHideLeft, IconHideRight, IconHideTopleft, IconImport, IconInfoCircle, IconInfoSolid, IconInfo, IconInformation, IconJs, IconJusitfyCenter, IconJusitfyFlexEnd, IconJusitfySpaceAround, IconJusitfySpaceBetween, IconJustitfyFlexStart, IconLanguage, IconLeave, IconLeftFrozen, IconLeftO, IconLeftWard, IconLeft, IconLineChart, IconLineHeight, IconLineThrought, IconLink, IconLoading, IconLock, IconMailContent, IconMail, IconMale, IconMarkOn, IconMeh, IconMessageCircle, IconMinscreen, IconMinusCircle, IconMinusSquare, IconMinus, IconMobileView, IconMobile, IconMore, IconNew, IconNoPremission, IconNodeOpen, IconNode, IconNodejs, IconNone, IconOffLine, IconOnLine, IconOperationfaildL, IconOperationfaild, IconOuterLink, IconPagelink, IconPagerFirst, IconPagerLast, IconPagerNext, IconPagerPrev, IconPanelMax, IconPanelMini, IconPanelNormal, IconPauseCircle, IconPause, IconPicture, IconPieChart, IconPlusCircle, IconPlusSquare, IconPlus, IconPopup, IconPreChecked, IconPrintPreview, IconPushpin, IconRadio, IconRadioselected, IconReactjs, IconRedo, IconRefres, IconRenew, IconRepeat, IconReplace, IconReplies, IconRightFrozen, IconRightO, IconRight, IconRightward, IconRowReverse, IconSandwichCollapse, IconSandwichExpand, IconSave, IconScissor, IconSearch, IconSelect, IconSent, IconSeparate, IconSetting, IconShare, IconShareArrow, IconShoppingCard, IconSmileO, IconSmile, IconSortDefault, IconSort, IconStarActive, IconStarDisable, IconStarO, IconStartCircle, IconStart, IconStatistics, IconStop, IconStreamSolid, IconSuccess, IconSuccessful, IconTabletView, IconTaskCooperation, IconTelephoneCircle, IconTelephone, IconTextAlign, IconTextDecoration, IconTextTab, IconText, IconTime, IconTotal, IconTriangleDown, IconUndelete, IconUnderline, IconUndo, IconUnfilter, IconUnfreeze, IconUnknow, IconUnlock, IconUnsent, IconUpO, IconUp, IconUpload, IconUser, IconVersiontree, IconView, IconVuejs, IconWarningTriangle, IconWarning, IconWebPlus, IconWriting, IconYes, IconZoomIn, IconZoomOut }; -declare const _default: { - IconAdd: () => any; - IconAdministrator: () => any; - IconAlignBaseline: () => any; - IconAlignCenter: () => any; - IconAlignFlexCenter: () => any; - IconAlignFlexEnd: () => any; - IconAlignFlexStart: () => any; - IconAlignJustify: () => any; - IconAlignLeft: () => any; - IconAlignRight: () => any; - IconAlignStretch: () => any; - IconAngularjs: () => any; - IconApp: () => any; - IconApplication: () => any; - IconAreaChart: () => any; - IconArrowDown: () => any; - IconArrowLeft: () => any; - IconArrowRight: () => any; - IconArrowUp: () => any; - IconAscending: () => any; - IconAssociation: () => any; - IconAttachment: () => any; - IconBarChart: () => any; - IconBefilter: () => any; - IconBoat: () => any; - IconBoxSolid: () => any; - IconBusy: () => any; - IconCalculator: () => any; - IconCalendar: () => any; - IconCheckOut: () => any; - IconCheck: () => any; - IconCheckedLinear: () => any; - IconCheckedSur: () => any; - IconCheckedTrue: () => any; - IconChevronDown: () => any; - IconChevronLeft: () => any; - IconChevronRight: () => any; - IconChevronUp: () => any; - IconClearFilter: () => any; - IconClockWork: () => any; - IconCloseCircle: () => any; - IconCloseSquare: () => any; - IconClose: () => any; - IconCloudDownload: () => any; - IconCloudUpload: () => any; - IconCode: () => any; - IconCoin: () => any; - IconColReverse: () => any; - IconCommission: () => any; - IconConmentRefresh: () => any; - IconCopySolid: () => any; - IconCopy: () => any; - IconCourse: () => any; - IconCueL: () => any; - IconCustom: () => any; - IconCustomerService: () => any; - IconCrop: () => any; - IconDataSource: () => any; - IconDefault: () => any; - IconDefinedFiltration: () => any; - IconDel: () => any; - IconDeletePage: () => any; - IconDeleted: () => any; - IconDeltaDownO: () => any; - IconDeltaDown: () => any; - IconDeltaLeftO: () => any; - IconDeltaLeft: () => any; - IconDeltaRightO: () => any; - IconDeltaRight: () => any; - IconDeltaUpO: () => any; - IconDeltaUp: () => any; - IconDerive: () => any; - IconDescending: () => any; - IconDesktopView: () => any; - IconDialog: () => any; - IconDialog2: () => any; - IconDirectionCol: () => any; - IconDirectionRow: () => any; - IconDotChart: () => any; - IconDotIpv4: () => any; - IconDoubleLeft: () => any; - IconDoubleRight: () => any; - IconDownO: () => any; - IconDown: () => any; - IconDownloadCloud: () => any; - IconDownloadLink: () => any; - IconDownload: () => any; - IconDraft: () => any; - IconEdit: () => any; - IconEditorTab: () => any; - IconEllipsis: () => any; - IconEmailAdd: () => any; - IconEmailCircle: () => any; - IconEnd: () => any; - IconError: () => any; - IconEspaceAuto: () => any; - IconEspace: () => any; - IconExcel: () => any; - IconException: () => any; - IconExclamation: () => any; - IconExport: () => any; - IconExpressSearch: () => any; - IconEyeclose: () => any; - IconEyeopen: () => any; - IconEditorAlignCenter: () => any; - IconEditorAlignLeft: () => any; - IconEditorAlignRight: () => any; - IconEditorBackground: () => any; - IconEditorBold: () => any; - IconEditorCode: () => any; - IconEditorDeleteline: () => any; - IconEditorEraser: () => any; - IconEditorItalic: () => any; - IconEditorLeftBorder: () => any; - IconEditorList: () => any; - IconEditorListDot: () => any; - IconEditorListNum: () => any; - IconEditorMenuLeft: () => any; - IconEditorMenuRight: () => any; - IconEditorQuote: () => any; - IconEditorRedo: () => any; - IconEditorRightBorder: () => any; - IconEditorSub: () => any; - IconEditorSubtitle: () => any; - IconEditorSuper: () => any; - IconEditorTable: () => any; - IconEditorTextcolor: () => any; - IconEditorTitle: () => any; - IconEditorUnderline: () => any; - IconEditorUndo: () => any; - IconEditorVideo: () => any; - IconFileCloudupload: () => any; - IconFileExcel: () => any; - IconFile: () => any; - IconFilesCircle: () => any; - IconFiles: () => any; - IconFiletext: () => any; - IconFileupload: () => any; - IconFiltered: () => any; - IconFlag: () => any; - IconFolderClosed: () => any; - IconFolderOpened: () => any; - IconFontColor: () => any; - IconFontFamily: () => any; - IconFontSize: () => any; - IconFontStyle: () => any; - IconFontWeight: () => any; - IconFreezeLeft: () => any; - IconFreezeRight: () => any; - IconFrownO: () => any; - IconFrown: () => any; - IconFullscreen: () => any; - IconFullscreenLeft: () => any; - IconGrade: () => any; - IconGroupTransfer: () => any; - IconGroup: () => any; - IconHalfchecked: () => any; - IconHalfselect: () => any; - IconHeartempty: () => any; - IconHelpCircle: () => any; - IconHelpQuery: () => any; - IconHelpSolid: () => any; - IconHelp: () => any; - IconHelpful: () => any; - IconHideLeft: () => any; - IconHideRight: () => any; - IconHideTopleft: () => any; - IconImport: () => any; - IconInfoCircle: () => any; - IconInfoSolid: () => any; - IconInfo: () => any; - IconInformation: () => any; - IconJs: () => any; - IconJusitfyCenter: () => any; - IconJusitfyFlexEnd: () => any; - IconJusitfySpaceAround: () => any; - IconJusitfySpaceBetween: () => any; - IconJustitfyFlexStart: () => any; - IconLanguage: () => any; - IconLeave: () => any; - IconLeftFrozen: () => any; - IconLeftO: () => any; - IconLeftWard: () => any; - IconLeft: () => any; - IconLineChart: () => any; - IconLineHeight: () => any; - IconLineThrought: () => any; - IconLink: () => any; - IconLoading: () => any; - IconLock: () => any; - IconMailContent: () => any; - IconMail: () => any; - IconMale: () => any; - IconMarkOn: () => any; - IconMeh: () => any; - IconMessageCircle: () => any; - IconMinscreenLeft: () => any; - IconMinscreen: () => any; - IconMinusCircle: () => any; - IconMinusSquare: () => any; - IconMinus: () => any; - IconMobileView: () => any; - IconMobile: () => any; - IconMore: () => any; - IconNew: () => any; - IconNoPremission: () => any; - IconNodeOpen: () => any; - IconNode: () => any; - IconNodejs: () => any; - IconNone: () => any; - IconOffLine: () => any; - IconOnLine: () => any; - IconOperationfaildL: () => any; - IconOperationfaild: () => any; - IconOuterLink: () => any; - IconPagelink: () => any; - IconPagerFirst: () => any; - IconPagerLast: () => any; - IconPagerNext: () => any; - IconPagerPrev: () => any; - IconPanelMax: () => any; - IconPanelMini: () => any; - IconPanelNormal: () => any; - IconPauseCircle: () => any; - IconPause: () => any; - IconPicture: () => any; - IconPieChart: () => any; - IconPlusCircle: () => any; - IconPlusSquare: () => any; - IconPlus: () => any; - IconPopup: () => any; - IconPreChecked: () => any; - IconPrintPreview: () => any; - IconPushpin: () => any; - IconRadio: () => any; - IconRadioselected: () => any; - IconReactjs: () => any; - IconRedo: () => any; - IconRefres: () => any; - IconRenew: () => any; - IconRepeat: () => any; - IconReplace: () => any; - IconReplies: () => any; - IconRightFrozen: () => any; - IconRightO: () => any; - IconRight: () => any; - IconRightward: () => any; - IconRowReverse: () => any; - IconSandwichCollapse: () => any; - IconSandwichExpand: () => any; - IconSave: () => any; - IconScissor: () => any; - IconSearch: () => any; - IconSelect: () => any; - IconSent: () => any; - IconSeparate: () => any; - IconSetting: () => any; - IconShare: () => any; - IconShareArrow: () => any; - IconShoppingCard: () => any; - IconSmileO: () => any; - IconSmile: () => any; - IconSortDefault: () => any; - IconSort: () => any; - IconStarActive: () => any; - IconStarDisable: () => any; - IconStarO: () => any; - IconStartCircle: () => any; - IconStart: () => any; - IconStatistics: () => any; - IconStop: () => any; - IconStreamSolid: () => any; - IconSuccess: () => any; - IconSuccessful: () => any; - IconTabletView: () => any; - IconTaskCooperation: () => any; - IconTelephoneCircle: () => any; - IconTelephone: () => any; - IconTextAlign: () => any; - IconTextDecoration: () => any; - IconTextTab: () => any; - IconText: () => any; - IconTime: () => any; - IconTotal: () => any; - IconTriangleDown: () => any; - IconUndelete: () => any; - IconUnderline: () => any; - IconUndo: () => any; - IconUnfilter: () => any; - IconUnfreeze: () => any; - IconUnknow: () => any; - IconUnlock: () => any; - IconUnsent: () => any; - IconUpO: () => any; - IconUp: () => any; - IconUpload: () => any; - IconUser: () => any; - IconVersiontree: () => any; - IconView: () => any; - IconVuejs: () => any; - IconWarningTriangle: () => any; - IconWarning: () => any; - IconWebPlus: () => any; - IconWriting: () => any; - IconYes: () => any; - IconZoomIn: () => any; - IconZoomOut: () => any; -}; -export default _default; diff --git a/typings/icon/info-circle/index.d.ts b/typings/icon/info-circle/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/info-circle/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/info-solid/index.d.ts b/typings/icon/info-solid/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/info-solid/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/info/index.d.ts b/typings/icon/info/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/info/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/information/index.d.ts b/typings/icon/information/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/information/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/js/index.d.ts b/typings/icon/js/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/js/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/jusitfy-center/index.d.ts b/typings/icon/jusitfy-center/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/jusitfy-center/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/jusitfy-flex-end/index.d.ts b/typings/icon/jusitfy-flex-end/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/jusitfy-flex-end/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/jusitfy-space-around/index.d.ts b/typings/icon/jusitfy-space-around/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/jusitfy-space-around/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/jusitfy-space-between/index.d.ts b/typings/icon/jusitfy-space-between/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/jusitfy-space-between/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/justitfy-flex-start/index.d.ts b/typings/icon/justitfy-flex-start/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/justitfy-flex-start/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/language/index.d.ts b/typings/icon/language/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/language/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/leave/index.d.ts b/typings/icon/leave/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/leave/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/left-frozen/index.d.ts b/typings/icon/left-frozen/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/left-frozen/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/left-o/index.d.ts b/typings/icon/left-o/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/left-o/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/left-ward/index.d.ts b/typings/icon/left-ward/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/left-ward/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/left/index.d.ts b/typings/icon/left/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/left/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/line-chart/index.d.ts b/typings/icon/line-chart/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/line-chart/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/line-height/index.d.ts b/typings/icon/line-height/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/line-height/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/line-throught/index.d.ts b/typings/icon/line-throught/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/line-throught/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/link/index.d.ts b/typings/icon/link/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/link/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/loading/index.d.ts b/typings/icon/loading/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/loading/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/lock/index.d.ts b/typings/icon/lock/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/lock/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/lowercase.d.ts b/typings/icon/lowercase.d.ts deleted file mode 100644 index 02b81d16b..000000000 --- a/typings/icon/lowercase.d.ts +++ /dev/null @@ -1,939 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import iconAdd from './add' -import iconAdministrator from './administrator' -import iconAlignBaseline from './align-baseline' -import iconAlignCenter from './align-center' -import iconAlignFlexCenter from './align-flex-center' -import iconAlignFlexEnd from './align-flex-end' -import iconAlignFlexStart from './align-flex-start' -import iconAlignJustify from './align-justify' -import iconAlignLeft from './align-left' -import iconAlignRight from './align-right' -import iconAlignStretch from './align-stretch' -import iconAngularjs from './angularjs' -import iconApp from './app' -import iconApplication from './application' -import iconAreaChart from './area-chart' -import iconArrowDown from './arrow-down' -import iconArrowLeft from './arrow-left' -import iconArrowRight from './arrow-right' -import iconArrowUp from './arrow-up' -import iconAscending from './ascending' -import iconAssociation from './association' -import iconAttachment from './attachment' -import iconBarChart from './bar-chart' -import iconBefilter from './befilter' -import iconBoat from './boat' -import iconBoxSolid from './box-solid' -import iconBusy from './busy' -import iconCalculator from './calculator' -import iconCalendar from './calendar' -import iconCheckOut from './check-out' -import iconCheck from './check' -import iconCheckedLinear from './checked-linear' -import iconCheckedSur from './checked-sur' -import iconCheckedTrue from './checked-true' -import iconChevronDown from './chevron-down' -import iconChevronLeft from './chevron-left' -import iconChevronRight from './chevron-right' -import iconChevronUp from './chevron-up' -import iconClearFilter from './clear-filter' -import iconClockWork from './clock-work' -import iconCloseCircle from './close-circle' -import iconCloseSquare from './close-square' -import iconClose from './close' -import iconCloudDownload from './cloud-download' -import iconCloudUpload from './cloud-upload' -import iconCode from './code' -import iconCoin from './coin' -import iconColReverse from './col-reverse' -import iconCommission from './commission' -import iconConmentRefresh from './conment-refresh' -import iconCopySolid from './copy-solid' -import iconCopy from './copy' -import iconCourse from './course' -import iconCueL from './cue-l' -import iconCustom from './custom' -import iconCustomerService from './customer-service' -import iconCrop from './crop' -import iconDataSource from './data-source' -import iconDefault from './default' -import iconDefinedFiltration from './defined-filtration' -import iconDel from './del' -import iconDeletePage from './delete-page' -import iconDeleted from './deleted' -import iconDeltaDownO from './delta-down-o' -import iconDeltaDown from './delta-down' -import iconDeltaLeftO from './delta-left-o' -import iconDeltaLeft from './delta-left' -import iconDeltaRightO from './delta-right-o' -import iconDeltaRight from './delta-right' -import iconDeltaUpO from './delta-up-o' -import iconDeltaUp from './delta-up' -import iconDerive from './derive' -import iconDescending from './descending' -import iconDesktopView from './desktop-view' -import iconDialog from './dialog' -import iconDialog2 from './dialog2' -import iconDirectionCol from './direction-col' -import iconDirectionRow from './direction-row' -import iconDotChart from './dot-chart' -import iconDotIpv4 from './dot-ipv4' -import iconDoubleLeft from './double-left' -import iconDoubleRight from './double-right' -import iconDownO from './down-o' -import iconDown from './down' -import iconDownloadCloud from './download-cloud' -import iconDownloadLink from './download-link' -import iconDownload from './download' -import iconDraft from './draft' -import iconEdit from './edit' -import iconEditorTab from './editor-tab' -import iconEllipsis from './ellipsis' -import iconEmailAdd from './email-add' -import iconEmailCircle from './email-circle' -import iconEnd from './end' -import iconError from './error' -import iconEspaceAuto from './espace-auto' -import iconEspace from './espace' -import iconExcel from './excel' -import iconException from './exception' -import iconExclamation from './exclamation' -import iconExport from './export' -import iconExpressSearch from './express-search' -import iconEyeclose from './eyeclose' -import iconEyeopen from './eyeopen' -import iconEditorAlignCenter from './editor-align-center' -import iconEditorAlignLeft from './editor-align-left' -import iconEditorAlignRight from './editor-align-right' -import iconEditorBackground from './editor-background' -import iconEditorBold from './editor-bold' -import iconEditorCode from './editor-code' -import iconEditorDeleteline from './editor-deleteline' -import iconEditorEraser from './editor-eraser' -import iconEditorItalic from './editor-italic' -import iconEditorLeftBorder from './editor-left-border' -import iconEditorList from './editor-list' -import iconEditorListDot from './editor-list-dot' -import iconEditorListNum from './editor-list-num' -import iconEditorMenuLeft from './editor-menu-left' -import iconEditorMenuRight from './editor-menu-right' -import iconEditorQuote from './editor-quote' -import iconEditorRedo from './editor-redo' -import iconEditorRightBorder from './editor-right-border' -import iconEditorSub from './editor-sub' -import iconEditorSubtitle from './editor-subtitle' -import iconEditorSuper from './editor-super' -import iconEditorTable from './editor-table' -import iconEditorTextcolor from './editor-textcolor' -import iconEditorTitle from './editor-title' -import iconEditorUnderline from './editor-underline' -import iconEditorUndo from './editor-undo' -import iconEditorVideo from './editor-video' -import iconFileCloudupload from './file-cloudupload' -import iconFileExcel from './file-excel' -import iconFile from './file' -import iconFilesCircle from './files-circle' -import iconFiles from './files' -import iconFiletext from './filetext' -import iconFileupload from './fileupload' -import iconFiltered from './filtered' -import iconFlag from './flag' -import iconFolderClosed from './folder-closed' -import iconFolderOpened from './folder-opened' -import iconFontColor from './font-color' -import iconFontFamily from './font-family' -import iconFontSize from './font-size' -import iconFontStyle from './font-style' -import iconFontWeight from './font-weight' -import iconFreezeLeft from './freeze-left' -import iconFreezeRight from './freeze-right' -import iconFrownO from './frown-o' -import iconFrown from './frown' -import iconFullscreen from './fullscreen' -import iconFullscreenLeft from './fullscreen-left' -import iconGrade from './grade' -import iconGroupTransfer from './group-transfer' -import iconGroup from './group' -import iconHalfchecked from './halfchecked' -import iconHalfselect from './halfselect' -import iconHeartempty from './heartempty' -import iconHelpCircle from './help-circle' -import iconHelpQuery from './help-query' -import iconHelpSolid from './help-solid' -import iconHelp from './help' -import iconHelpful from './helpful' -import iconHideLeft from './hide-left' -import iconHideRight from './hide-right' -import iconHideTopleft from './hide-topleft' -import iconImport from './import' -import iconInfoCircle from './info-circle' -import iconInfoSolid from './info-solid' -import iconInfo from './info' -import iconInformation from './information' -import iconJs from './js' -import iconJusitfyCenter from './jusitfy-center' -import iconJusitfyFlexEnd from './jusitfy-flex-end' -import iconJusitfySpaceAround from './jusitfy-space-around' -import iconJusitfySpaceBetween from './jusitfy-space-between' -import iconJustitfyFlexStart from './justitfy-flex-start' -import iconLanguage from './language' -import iconLeave from './leave' -import iconLeftFrozen from './left-frozen' -import iconLeftO from './left-o' -import iconLeftWard from './left-ward' -import iconLeft from './left' -import iconLineChart from './line-chart' -import iconLineHeight from './line-height' -import iconLineThrought from './line-throught' -import iconLink from './link' -import iconLoading from './loading' -import iconLock from './lock' -import iconMailContent from './mail-content' -import iconMail from './mail' -import iconMale from './male' -import iconMarkOn from './mark-on' -import iconMeh from './meh' -import iconMessageCircle from './message-circle' -import iconMinscreen from './minscreen' -import iconMinscreenLeft from './minscreen-left' -import iconMinusCircle from './minus-circle' -import iconMinusSquare from './minus-square' -import iconMinus from './minus' -import iconMobileView from './mobile-view' -import iconMobile from './mobile' -import iconMore from './more' -import iconNew from './new' -import iconNoPremission from './no-premission' -import iconNodeOpen from './node-open' -import iconNode from './node' -import iconNodejs from './nodejs' -import iconNone from './none' -import iconOffLine from './off-line' -import iconOnLine from './on-line' -import iconOperationfaildL from './operationfaild-l' -import iconOperationfaild from './operationfaild' -import iconOuterLink from './outer-link' -import iconPagelink from './pagelink' -import iconPagerFirst from './pager-first' -import iconPagerLast from './pager-last' -import iconPagerNext from './pager-next' -import iconPagerPrev from './pager-prev' -import iconPanelMax from './panel-max' -import iconPanelMini from './panel-mini' -import iconPanelNormal from './panel-normal' -import iconPauseCircle from './pause-circle' -import iconPause from './pause' -import iconPicture from './picture' -import iconPieChart from './pie-chart' -import iconPlusCircle from './plus-circle' -import iconPlusSquare from './plus-square' -import iconPlus from './plus' -import iconPopup from './popup' -import iconPreChecked from './pre-checked' -import iconPrintPreview from './print-preview' -import iconPushpin from './pushpin' -import iconRadio from './radio' -import iconRadioselected from './radioselected' -import iconReactjs from './reactjs' -import iconRedo from './redo' -import iconRefres from './refres' -import iconRenew from './renew' -import iconRepeat from './repeat' -import iconReplace from './replace' -import iconReplies from './replies' -import iconRightFrozen from './right-frozen' -import iconRightO from './right-o' -import iconRight from './right' -import iconRightward from './rightward' -import iconRowReverse from './row-reverse' -import iconSandwichCollapse from './sandwich-collapse' -import iconSandwichExpand from './sandwich-expand' -import iconSave from './save' -import iconScissor from './scissor' -import iconSearch from './search' -import iconSelect from './select' -import iconSent from './sent' -import iconSeparate from './separate' -import iconSetting from './setting' -import iconShare from './share' -import iconShareArrow from './share-arrow' -import iconShoppingCard from './shopping-card' -import iconSmileO from './smile-o' -import iconSmile from './smile' -import iconSortDefault from './sort-default' -import iconSort from './sort' -import iconStarActive from './star-active' -import iconStarDisable from './star-disable' -import iconStarO from './star-o' -import iconStartCircle from './start-circle' -import iconStart from './start' -import iconStatistics from './statistics' -import iconStop from './stop' -import iconStreamSolid from './stream-solid' -import iconSuccess from './success' -import iconSuccessful from './successful' -import iconTabletView from './tablet-view' -import iconTaskCooperation from './task-cooperation' -import iconTelephoneCircle from './telephone-circle' -import iconTelephone from './telephone' -import iconTextAlign from './text-align' -import iconTextDecoration from './text-decoration' -import iconTextTab from './text-tab' -import iconText from './text' -import iconTime from './time' -import iconTotal from './total' -import iconTriangleDown from './triangle-down' -import iconUndelete from './undelete' -import iconUnderline from './underline' -import iconUndo from './undo' -import iconUnfilter from './unfilter' -import iconUnfreeze from './unfreeze' -import iconUnknow from './unknow' -import iconUnknown from './unknown' -import iconUnlock from './unlock' -import iconUnsent from './unsent' -import iconUpO from './up-o' -import iconUp from './up' -import iconUpload from './upload' -import iconUser from './user' -import iconVersiontree from './versiontree' -import iconView from './view' -import iconVuejs from './vuejs' -import iconWarningTriangle from './warning-triangle' -import iconWarning from './warning' -import iconWebPlus from './web-plus' -import iconWriting from './writing' -import iconYes from './yes' -import iconZoomIn from './zoom-in' -import iconZoomOut from './zoom-out' -export { - iconAdd, - iconAdministrator, - iconAlignBaseline, - iconAlignCenter, - iconAlignFlexCenter, - iconAlignFlexEnd, - iconAlignFlexStart, - iconAlignJustify, - iconAlignLeft, - iconAlignRight, - iconAlignStretch, - iconAngularjs, - iconApp, - iconApplication, - iconAreaChart, - iconArrowDown, - iconArrowLeft, - iconArrowRight, - iconArrowUp, - iconAscending, - iconAssociation, - iconAttachment, - iconBarChart, - iconBefilter, - iconBoat, - iconBoxSolid, - iconBusy, - iconCalculator, - iconCalendar, - iconCheckOut, - iconCheck, - iconCheckedLinear, - iconCheckedSur, - iconCheckedTrue, - iconChevronDown, - iconChevronLeft, - iconChevronRight, - iconChevronUp, - iconClearFilter, - iconClockWork, - iconCloseCircle, - iconCloseSquare, - iconClose, - iconCloudDownload, - iconCloudUpload, - iconCode, - iconCoin, - iconColReverse, - iconCommission, - iconConmentRefresh, - iconCopySolid, - iconCopy, - iconCrop, - iconCourse, - iconCueL, - iconCustom, - iconCustomerService, - iconDataSource, - iconDefault, - iconDefinedFiltration, - iconDel, - iconDeletePage, - iconDeleted, - iconDeltaDownO, - iconDeltaDown, - iconDeltaLeftO, - iconDeltaLeft, - iconDeltaRightO, - iconDeltaRight, - iconDeltaUpO, - iconDeltaUp, - iconDerive, - iconDescending, - iconDesktopView, - iconDialog, - iconDialog2, - iconDirectionCol, - iconDirectionRow, - iconDotChart, - iconDotIpv4, - iconDoubleLeft, - iconDoubleRight, - iconDownO, - iconDown, - iconDownloadCloud, - iconDownloadLink, - iconDownload, - iconDraft, - iconEdit, - iconEditorTab, - iconEllipsis, - iconEmailAdd, - iconEmailCircle, - iconEnd, - iconError, - iconEspaceAuto, - iconEspace, - iconExcel, - iconException, - iconExclamation, - iconExport, - iconExpressSearch, - iconEyeclose, - iconEyeopen, - iconEditorAlignCenter, - iconEditorAlignLeft, - iconEditorAlignRight, - iconEditorBackground, - iconEditorBold, - iconEditorCode, - iconEditorDeleteline, - iconEditorEraser, - iconEditorItalic, - iconEditorLeftBorder, - iconEditorList, - iconEditorListDot, - iconEditorListNum, - iconEditorMenuLeft, - iconEditorMenuRight, - iconEditorQuote, - iconEditorRedo, - iconEditorRightBorder, - iconEditorSub, - iconEditorSubtitle, - iconEditorSuper, - iconEditorTable, - iconEditorTextcolor, - iconEditorTitle, - iconEditorUnderline, - iconEditorUndo, - iconEditorVideo, - iconFileCloudupload, - iconFileExcel, - iconFile, - iconFilesCircle, - iconFiles, - iconFiletext, - iconFileupload, - iconFiltered, - iconFlag, - iconFolderClosed, - iconFolderOpened, - iconFontColor, - iconFontFamily, - iconFontSize, - iconFontStyle, - iconFontWeight, - iconFreezeLeft, - iconFreezeRight, - iconFrownO, - iconFrown, - iconFullscreen, - iconFullscreenLeft, - iconMinscreenLeft, - iconGrade, - iconGroupTransfer, - iconGroup, - iconHalfchecked, - iconHalfselect, - iconHeartempty, - iconHelpCircle, - iconHelpQuery, - iconHelpSolid, - iconHelp, - iconHelpful, - iconHideLeft, - iconHideRight, - iconHideTopleft, - iconImport, - iconInfoCircle, - iconInfoSolid, - iconInfo, - iconInformation, - iconJs, - iconJusitfyCenter, - iconJusitfyFlexEnd, - iconJusitfySpaceAround, - iconJusitfySpaceBetween, - iconJustitfyFlexStart, - iconLanguage, - iconLeave, - iconLeftFrozen, - iconLeftO, - iconLeftWard, - iconLeft, - iconLineChart, - iconLineHeight, - iconLineThrought, - iconLink, - iconLoading, - iconLock, - iconMailContent, - iconMail, - iconMale, - iconMarkOn, - iconMeh, - iconMessageCircle, - iconMinscreen, - iconMinusCircle, - iconMinusSquare, - iconMinus, - iconMobileView, - iconMobile, - iconMore, - iconNew, - iconNoPremission, - iconNodeOpen, - iconNode, - iconNodejs, - iconNone, - iconOffLine, - iconOnLine, - iconOperationfaildL, - iconOperationfaild, - iconOuterLink, - iconPagelink, - iconPagerFirst, - iconPagerLast, - iconPagerNext, - iconPagerPrev, - iconPanelMax, - iconPanelMini, - iconPanelNormal, - iconPauseCircle, - iconPause, - iconPicture, - iconPieChart, - iconPlusCircle, - iconPlusSquare, - iconPlus, - iconPopup, - iconPreChecked, - iconPrintPreview, - iconPushpin, - iconRadio, - iconRadioselected, - iconReactjs, - iconRedo, - iconRefres, - iconRenew, - iconRepeat, - iconReplace, - iconReplies, - iconRightFrozen, - iconRightO, - iconRight, - iconRightward, - iconRowReverse, - iconSandwichCollapse, - iconSandwichExpand, - iconSave, - iconScissor, - iconSearch, - iconSelect, - iconSent, - iconSeparate, - iconSetting, - iconShare, - iconShareArrow, - iconShoppingCard, - iconSmileO, - iconSmile, - iconSortDefault, - iconSort, - iconStarActive, - iconStarDisable, - iconStarO, - iconStartCircle, - iconStart, - iconStatistics, - iconStop, - iconStreamSolid, - iconSuccess, - iconSuccessful, - iconTabletView, - iconTaskCooperation, - iconTelephoneCircle, - iconTelephone, - iconTextAlign, - iconTextDecoration, - iconTextTab, - iconText, - iconTime, - iconTotal, - iconTriangleDown, - iconUndelete, - iconUnderline, - iconUndo, - iconUnfilter, - iconUnfreeze, - iconUnknow, - iconUnknown, - iconUnlock, - iconUnsent, - iconUpO, - iconUp, - iconUpload, - iconUser, - iconVersiontree, - iconView, - iconVuejs, - iconWarningTriangle, - iconWarning, - iconWebPlus, - iconWriting, - iconYes, - iconZoomIn, - iconZoomOut -} -declare const _default: { - iconAdd: () => any - iconAdministrator: () => any - iconAlignBaseline: () => any - iconAlignCenter: () => any - iconAlignFlexCenter: () => any - iconAlignFlexEnd: () => any - iconAlignFlexStart: () => any - iconAlignJustify: () => any - iconAlignLeft: () => any - iconAlignRight: () => any - iconAlignStretch: () => any - iconAngularjs: () => any - iconApp: () => any - iconApplication: () => any - iconAreaChart: () => any - iconArrowDown: () => any - iconArrowLeft: () => any - iconArrowRight: () => any - iconArrowUp: () => any - iconAscending: () => any - iconAssociation: () => any - iconAttachment: () => any - iconBarChart: () => any - iconBefilter: () => any - iconBoat: () => any - iconBoxSolid: () => any - iconBusy: () => any - iconCalculator: () => any - iconCalendar: () => any - iconCheckOut: () => any - iconCheck: () => any - iconCheckedLinear: () => any - iconCheckedSur: () => any - iconCheckedTrue: () => any - iconChevronDown: () => any - iconChevronLeft: () => any - iconChevronRight: () => any - iconChevronUp: () => any - iconClearFilter: () => any - iconClockWork: () => any - iconCloseCircle: () => any - iconCloseSquare: () => any - iconClose: () => any - iconCloudDownload: () => any - iconCloudUpload: () => any - iconCode: () => any - iconCoin: () => any - iconColReverse: () => any - iconCommission: () => any - iconConmentRefresh: () => any - iconCopySolid: () => any - iconCopy: () => any - iconCourse: () => any - iconCueL: () => any - iconCustom: () => any - iconCustomerService: () => any - iconCrop: () => any - iconDataSource: () => any - iconDefault: () => any - iconDefinedFiltration: () => any - iconDel: () => any - iconDeletePage: () => any - iconDeleted: () => any - iconDeltaDownO: () => any - iconDeltaDown: () => any - iconDeltaLeftO: () => any - iconDeltaLeft: () => any - iconDeltaRightO: () => any - iconDeltaRight: () => any - iconDeltaUpO: () => any - iconDeltaUp: () => any - iconDerive: () => any - iconDescending: () => any - iconDesktopView: () => any - iconDialog: () => any - iconDialog2: () => any - iconDirectionCol: () => any - iconDirectionRow: () => any - iconDotChart: () => any - iconDotIpv4: () => any - iconDoubleLeft: () => any - iconDoubleRight: () => any - iconDownO: () => any - iconDown: () => any - iconDownloadCloud: () => any - iconDownloadLink: () => any - iconDownload: () => any - iconDraft: () => any - iconEdit: () => any - iconEditorTab: () => any - iconEllipsis: () => any - iconEmailAdd: () => any - iconEmailCircle: () => any - iconEnd: () => any - iconError: () => any - iconEspaceAuto: () => any - iconEspace: () => any - iconExcel: () => any - iconException: () => any - iconExclamation: () => any - iconExport: () => any - iconExpressSearch: () => any - iconEyeclose: () => any - iconEyeopen: () => any - iconEditorAlignCenter: () => any - iconEditorAlignLeft: () => any - iconEditorAlignRight: () => any - iconEditorBackground: () => any - iconEditorBold: () => any - iconEditorCode: () => any - iconEditorDeleteline: () => any - iconEditorEraser: () => any - iconEditorItalic: () => any - iconEditorLeftBorder: () => any - iconEditorList: () => any - iconEditorListDot: () => any - iconEditorListNum: () => any - iconEditorMenuLeft: () => any - iconEditorMenuRight: () => any - iconEditorQuote: () => any - iconEditorRedo: () => any - iconEditorRightBorder: () => any - iconEditorSub: () => any - iconEditorSubtitle: () => any - iconEditorSuper: () => any - iconEditorTable: () => any - iconEditorTextcolor: () => any - iconEditorTitle: () => any - iconEditorUnderline: () => any - iconEditorUndo: () => any - iconEditorVideo: () => any - iconFileCloudupload: () => any - iconFileExcel: () => any - iconFile: () => any - iconFilesCircle: () => any - iconFiles: () => any - iconFiletext: () => any - iconFileupload: () => any - iconFiltered: () => any - iconFlag: () => any - iconFolderClosed: () => any - iconFolderOpened: () => any - iconFontColor: () => any - iconFontFamily: () => any - iconFontSize: () => any - iconFontStyle: () => any - iconFontWeight: () => any - iconFreezeLeft: () => any - iconFreezeRight: () => any - iconFrownO: () => any - iconFrown: () => any - iconFullscreen: () => any - iconFullscreenLeft: () => any - iconGrade: () => any - iconGroupTransfer: () => any - iconGroup: () => any - iconHalfchecked: () => any - iconHalfselect: () => any - iconHeartempty: () => any - iconHelpCircle: () => any - iconHelpQuery: () => any - iconHelpSolid: () => any - iconHelp: () => any - iconHelpful: () => any - iconHideLeft: () => any - iconHideRight: () => any - iconHideTopleft: () => any - iconImport: () => any - iconInfoCircle: () => any - iconInfoSolid: () => any - iconInfo: () => any - iconInformation: () => any - iconJs: () => any - iconJusitfyCenter: () => any - iconJusitfyFlexEnd: () => any - iconJusitfySpaceAround: () => any - iconJusitfySpaceBetween: () => any - iconJustitfyFlexStart: () => any - iconLanguage: () => any - iconLeave: () => any - iconLeftFrozen: () => any - iconLeftO: () => any - iconLeftWard: () => any - iconLeft: () => any - iconLineChart: () => any - iconLineHeight: () => any - iconLineThrought: () => any - iconLink: () => any - iconLoading: () => any - iconLock: () => any - iconMailContent: () => any - iconMail: () => any - iconMale: () => any - iconMarkOn: () => any - iconMeh: () => any - iconMessageCircle: () => any - iconMinscreenLeft: () => any - iconMinscreen: () => any - iconMinusCircle: () => any - iconMinusSquare: () => any - iconMinus: () => any - iconMobileView: () => any - iconMobile: () => any - iconMore: () => any - iconNew: () => any - iconNoPremission: () => any - iconNodeOpen: () => any - iconNode: () => any - iconNodejs: () => any - iconNone: () => any - iconOffLine: () => any - iconOnLine: () => any - iconOperationfaildL: () => any - iconOperationfaild: () => any - iconOuterLink: () => any - iconPagelink: () => any - iconPagerFirst: () => any - iconPagerLast: () => any - iconPagerNext: () => any - iconPagerPrev: () => any - iconPanelMax: () => any - iconPanelMini: () => any - iconPanelNormal: () => any - iconPauseCircle: () => any - iconPause: () => any - iconPicture: () => any - iconPieChart: () => any - iconPlusCircle: () => any - iconPlusSquare: () => any - iconPlus: () => any - iconPopup: () => any - iconPreChecked: () => any - iconPrintPreview: () => any - iconPushpin: () => any - iconRadio: () => any - iconRadioselected: () => any - iconReactjs: () => any - iconRedo: () => any - iconRefres: () => any - iconRenew: () => any - iconRepeat: () => any - iconReplace: () => any - iconReplies: () => any - iconRightFrozen: () => any - iconRightO: () => any - iconRight: () => any - iconRightward: () => any - iconRowReverse: () => any - iconSandwichCollapse: () => any - iconSandwichExpand: () => any - iconSave: () => any - iconScissor: () => any - iconSearch: () => any - iconSelect: () => any - iconSent: () => any - iconSeparate: () => any - iconSetting: () => any - iconShare: () => any - iconShareArrow: () => any - iconShoppingCard: () => any - iconSmileO: () => any - iconSmile: () => any - iconSortDefault: () => any - iconSort: () => any - iconStarActive: () => any - iconStarDisable: () => any - iconStarO: () => any - iconStartCircle: () => any - iconStart: () => any - iconStatistics: () => any - iconStop: () => any - iconStreamSolid: () => any - iconSuccess: () => any - iconSuccessful: () => any - iconTabletView: () => any - iconTaskCooperation: () => any - iconTelephoneCircle: () => any - iconTelephone: () => any - iconTextAlign: () => any - iconTextDecoration: () => any - iconTextTab: () => any - iconText: () => any - iconTime: () => any - iconTotal: () => any - iconTriangleDown: () => any - iconUndelete: () => any - iconUnderline: () => any - iconUndo: () => any - iconUnfilter: () => any - iconUnfreeze: () => any - iconUnknow: () => any - iconUnlock: () => any - iconUnsent: () => any - iconUpO: () => any - iconUp: () => any - iconUpload: () => any - iconUser: () => any - iconVersiontree: () => any - iconView: () => any - iconVuejs: () => any - iconWarningTriangle: () => any - iconWarning: () => any - iconWebPlus: () => any - iconWriting: () => any - iconYes: () => any - iconZoomIn: () => any - iconZoomOut: () => any -} -export default _default diff --git a/typings/icon/mail-content/index.d.ts b/typings/icon/mail-content/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/mail-content/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/mail/index.d.ts b/typings/icon/mail/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/mail/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/male/index.d.ts b/typings/icon/male/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/male/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/mark-on/index.d.ts b/typings/icon/mark-on/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/mark-on/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/meh/index.d.ts b/typings/icon/meh/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/meh/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/message-circle/index.d.ts b/typings/icon/message-circle/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/message-circle/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/minscreen-left/index.d.ts b/typings/icon/minscreen-left/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/minscreen-left/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/minscreen/index.d.ts b/typings/icon/minscreen/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/minscreen/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/minus-circle/index.d.ts b/typings/icon/minus-circle/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/minus-circle/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/minus-square/index.d.ts b/typings/icon/minus-square/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/minus-square/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/minus/index.d.ts b/typings/icon/minus/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/minus/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/mobile-view/index.d.ts b/typings/icon/mobile-view/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/mobile-view/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/mobile/index.d.ts b/typings/icon/mobile/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/mobile/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/more/index.d.ts b/typings/icon/more/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/more/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/new/index.d.ts b/typings/icon/new/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/new/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/no-premission/index.d.ts b/typings/icon/no-premission/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/no-premission/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/node-open/index.d.ts b/typings/icon/node-open/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/node-open/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/node/index.d.ts b/typings/icon/node/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/node/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/nodejs/index.d.ts b/typings/icon/nodejs/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/nodejs/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/none/index.d.ts b/typings/icon/none/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/none/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/off-line/index.d.ts b/typings/icon/off-line/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/off-line/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/on-line/index.d.ts b/typings/icon/on-line/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/on-line/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/operationfaild-l/index.d.ts b/typings/icon/operationfaild-l/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/operationfaild-l/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/operationfaild/index.d.ts b/typings/icon/operationfaild/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/operationfaild/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/outer-link/index.d.ts b/typings/icon/outer-link/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/outer-link/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/pagelink/index.d.ts b/typings/icon/pagelink/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/pagelink/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/pager-first/index.d.ts b/typings/icon/pager-first/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/pager-first/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/pager-last/index.d.ts b/typings/icon/pager-last/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/pager-last/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/pager-next/index.d.ts b/typings/icon/pager-next/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/pager-next/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/pager-prev/index.d.ts b/typings/icon/pager-prev/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/pager-prev/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/panel-max/index.d.ts b/typings/icon/panel-max/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/panel-max/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/panel-mini/index.d.ts b/typings/icon/panel-mini/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/panel-mini/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/panel-normal/index.d.ts b/typings/icon/panel-normal/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/panel-normal/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/pause-circle/index.d.ts b/typings/icon/pause-circle/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/pause-circle/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/pause/index.d.ts b/typings/icon/pause/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/pause/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/picture/index.d.ts b/typings/icon/picture/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/picture/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/pie-chart/index.d.ts b/typings/icon/pie-chart/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/pie-chart/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/plus-circle/index.d.ts b/typings/icon/plus-circle/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/plus-circle/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/plus-square/index.d.ts b/typings/icon/plus-square/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/plus-square/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/plus/index.d.ts b/typings/icon/plus/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/plus/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/popup/index.d.ts b/typings/icon/popup/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/popup/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/pre-checked/index.d.ts b/typings/icon/pre-checked/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/pre-checked/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/print-preview/index.d.ts b/typings/icon/print-preview/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/print-preview/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/pushpin/index.d.ts b/typings/icon/pushpin/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/pushpin/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/radio/index.d.ts b/typings/icon/radio/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/radio/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/radioselected/index.d.ts b/typings/icon/radioselected/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/radioselected/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/reactjs/index.d.ts b/typings/icon/reactjs/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/reactjs/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/redo/index.d.ts b/typings/icon/redo/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/redo/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/refres/index.d.ts b/typings/icon/refres/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/refres/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/renew/index.d.ts b/typings/icon/renew/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/renew/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/repeat/index.d.ts b/typings/icon/repeat/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/repeat/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/replace/index.d.ts b/typings/icon/replace/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/replace/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/replies/index.d.ts b/typings/icon/replies/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/replies/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/right-frozen/index.d.ts b/typings/icon/right-frozen/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/right-frozen/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/right-o/index.d.ts b/typings/icon/right-o/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/right-o/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/right/index.d.ts b/typings/icon/right/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/right/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/rightward/index.d.ts b/typings/icon/rightward/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/rightward/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/row-reverse/index.d.ts b/typings/icon/row-reverse/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/row-reverse/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/sandwich-collapse/index.d.ts b/typings/icon/sandwich-collapse/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/sandwich-collapse/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/sandwich-expand/index.d.ts b/typings/icon/sandwich-expand/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/sandwich-expand/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/save/index.d.ts b/typings/icon/save/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/save/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/scissor/index.d.ts b/typings/icon/scissor/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/scissor/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/search/index.d.ts b/typings/icon/search/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/search/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/select/index.d.ts b/typings/icon/select/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/select/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/sent/index.d.ts b/typings/icon/sent/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/sent/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/separate/index.d.ts b/typings/icon/separate/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/separate/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/setting/index.d.ts b/typings/icon/setting/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/setting/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/share-arrow/index.d.ts b/typings/icon/share-arrow/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/share-arrow/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/share/index.d.ts b/typings/icon/share/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/share/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/shopping-card/index.d.ts b/typings/icon/shopping-card/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/shopping-card/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/smile-o/index.d.ts b/typings/icon/smile-o/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/smile-o/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/smile/index.d.ts b/typings/icon/smile/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/smile/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/sort-default/index.d.ts b/typings/icon/sort-default/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/sort-default/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/sort/index.d.ts b/typings/icon/sort/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/sort/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/star-active/index.d.ts b/typings/icon/star-active/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/star-active/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/star-disable/index.d.ts b/typings/icon/star-disable/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/star-disable/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/star-o/index.d.ts b/typings/icon/star-o/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/star-o/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/start-circle/index.d.ts b/typings/icon/start-circle/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/start-circle/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/start/index.d.ts b/typings/icon/start/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/start/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/statistics/index.d.ts b/typings/icon/statistics/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/statistics/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/stop/index.d.ts b/typings/icon/stop/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/stop/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/stream-solid/index.d.ts b/typings/icon/stream-solid/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/stream-solid/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/success/index.d.ts b/typings/icon/success/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/success/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/successful/index.d.ts b/typings/icon/successful/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/successful/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/tablet-view/index.d.ts b/typings/icon/tablet-view/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/tablet-view/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/task-cooperation/index.d.ts b/typings/icon/task-cooperation/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/task-cooperation/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/telephone-circle/index.d.ts b/typings/icon/telephone-circle/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/telephone-circle/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/telephone/index.d.ts b/typings/icon/telephone/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/telephone/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/text-align/index.d.ts b/typings/icon/text-align/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/text-align/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/text-decoration/index.d.ts b/typings/icon/text-decoration/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/text-decoration/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/text-tab/index.d.ts b/typings/icon/text-tab/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/text-tab/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/text/index.d.ts b/typings/icon/text/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/text/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/time/index.d.ts b/typings/icon/time/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/time/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/total/index.d.ts b/typings/icon/total/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/total/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/triangle-down/index.d.ts b/typings/icon/triangle-down/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/triangle-down/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/undelete/index.d.ts b/typings/icon/undelete/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/undelete/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/underline/index.d.ts b/typings/icon/underline/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/underline/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/undo/index.d.ts b/typings/icon/undo/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/undo/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/unfilter/index.d.ts b/typings/icon/unfilter/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/unfilter/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/unfreeze/index.d.ts b/typings/icon/unfreeze/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/unfreeze/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/unknow/index.d.ts b/typings/icon/unknow/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/unknow/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/unlock/index.d.ts b/typings/icon/unlock/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/unlock/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/unsent/index.d.ts b/typings/icon/unsent/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/unsent/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/up-o/index.d.ts b/typings/icon/up-o/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/up-o/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/up/index.d.ts b/typings/icon/up/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/up/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/upload/index.d.ts b/typings/icon/upload/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/upload/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/user/index.d.ts b/typings/icon/user/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/user/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/versiontree/index.d.ts b/typings/icon/versiontree/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/versiontree/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/view/index.d.ts b/typings/icon/view/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/view/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/vuejs/index.d.ts b/typings/icon/vuejs/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/vuejs/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/warning-triangle/index.d.ts b/typings/icon/warning-triangle/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/warning-triangle/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/warning/index.d.ts b/typings/icon/warning/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/warning/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/web-plus/index.d.ts b/typings/icon/web-plus/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/web-plus/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/writing/index.d.ts b/typings/icon/writing/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/writing/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/yes/index.d.ts b/typings/icon/yes/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/yes/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/zoom-in/index.d.ts b/typings/icon/zoom-in/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/zoom-in/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/icon/zoom-out/index.d.ts b/typings/icon/zoom-out/index.d.ts deleted file mode 100644 index 2840c9301..000000000 --- a/typings/icon/zoom-out/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: () => any; -export default _default; diff --git a/typings/image-viewer/index.d.ts b/typings/image-viewer/index.d.ts deleted file mode 100644 index 259b40958..000000000 --- a/typings/image-viewer/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import ImageViewer from './src/index'; -export default ImageViewer; diff --git a/typings/image-viewer/src/index.d.ts b/typings/image-viewer/src/index.d.ts deleted file mode 100644 index 200d74956..000000000 --- a/typings/image-viewer/src/index.d.ts +++ /dev/null @@ -1,155 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - MODE: { - CONTAIN: { - name: string; - icon: string; - }; - ORIGINAL: { - name: string; - icon: string; - }; - }; - DEFAULT_POPPER_ZINDEX: number; - }; - }; - urlList: { - type: ArrayConstructor; - default: () => never[]; - }; - zIndex: { - type: NumberConstructor; - default: number; - }; - previewVisible: { - type: BooleanConstructor; - default: boolean; - }; - closeShow: { - type: BooleanConstructor; - default: boolean; - }; - arrowShow: { - type: BooleanConstructor; - default: boolean; - }; - toolShow: { - type: BooleanConstructor; - default: boolean; - }; - showIndex: { - type: BooleanConstructor; - default: boolean; - }; - imageFullCurrent: { - type: BooleanConstructor; - default: boolean; - }; - startPosition: { - type: NumberConstructor; - default: number; - }; - asyncClose: { - type: BooleanConstructor; - default: boolean; - }; - deleteButton: { - type: BooleanConstructor; - default: boolean; - }; - onSwitch: { - type: FunctionConstructor; - default: () => void; - }; - onClose: { - type: FunctionConstructor; - default: () => void; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - MODE: { - CONTAIN: { - name: string; - icon: string; - }; - ORIGINAL: { - name: string; - icon: string; - }; - }; - DEFAULT_POPPER_ZINDEX: number; - }; - }; - urlList: { - type: ArrayConstructor; - default: () => never[]; - }; - zIndex: { - type: NumberConstructor; - default: number; - }; - previewVisible: { - type: BooleanConstructor; - default: boolean; - }; - closeShow: { - type: BooleanConstructor; - default: boolean; - }; - arrowShow: { - type: BooleanConstructor; - default: boolean; - }; - toolShow: { - type: BooleanConstructor; - default: boolean; - }; - showIndex: { - type: BooleanConstructor; - default: boolean; - }; - imageFullCurrent: { - type: BooleanConstructor; - default: boolean; - }; - startPosition: { - type: NumberConstructor; - default: number; - }; - asyncClose: { - type: BooleanConstructor; - default: boolean; - }; - deleteButton: { - type: BooleanConstructor; - default: boolean; - }; - onSwitch: { - type: FunctionConstructor; - default: () => void; - }; - onClose: { - type: FunctionConstructor; - default: () => void; - }; -}>>, { - _constants: Record; - onClose: Function; - zIndex: number; - urlList: unknown[]; - onSwitch: Function; - previewVisible: boolean; - closeShow: boolean; - arrowShow: boolean; - toolShow: boolean; - showIndex: boolean; - imageFullCurrent: boolean; - startPosition: number; - asyncClose: boolean; - deleteButton: boolean; -}>; -export default _default; diff --git a/typings/image-viewer/src/mobile.vue.d.ts b/typings/image-viewer/src/mobile.vue.d.ts deleted file mode 100644 index e42e656ee..000000000 --- a/typings/image-viewer/src/mobile.vue.d.ts +++ /dev/null @@ -1,24 +0,0 @@ -import '@opentiny/vue-theme-mobile/image-viewer/index.css'; -declare const _default: { - props: string[]; - components: { - IconClose: any; - IconChevronLeft: any; - IconChevronRight: any; - IconZoomOut: any; - IconZoomIn: any; - IconRepeat: any; - IconRefres: any; - IconDel: any; - }; - directives: {}; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/image-viewer/src/mobileTouch.d.ts b/typings/image-viewer/src/mobileTouch.d.ts deleted file mode 100644 index d87c48512..000000000 --- a/typings/image-viewer/src/mobileTouch.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: {}; -export default _default; diff --git a/typings/image-viewer/src/pc.vue.d.ts b/typings/image-viewer/src/pc.vue.d.ts deleted file mode 100644 index b8af6ca24..000000000 --- a/typings/image-viewer/src/pc.vue.d.ts +++ /dev/null @@ -1,24 +0,0 @@ -import '@opentiny/vue-theme/image-viewer/index.css'; -declare const _default: { - props: string[]; - components: { - IconClose: any; - IconChevronLeft: any; - IconChevronRight: any; - IconZoomOut: any; - IconZoomIn: any; - IconFullscreen: any; - IconMinscreen: any; - IconRepeat: any; - IconRefres: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/image/index.d.ts b/typings/image/index.d.ts deleted file mode 100644 index bac0c7925..000000000 --- a/typings/image/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Image from './src/index'; -import '@opentiny/vue-theme/image/index.css'; -export default Image; diff --git a/typings/image/src/index.d.ts b/typings/image/src/index.d.ts deleted file mode 100644 index 5b72d343f..000000000 --- a/typings/image/src/index.d.ts +++ /dev/null @@ -1,58 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - NONE: string; - CONTAIN: string; - COVER: string; - FILL: string; - SCALE_DOWN: string; - DEFAULT_POPPER_ZINDEX: number; - }; - }; - fit: StringConstructor; - lazy: BooleanConstructor; - previewSrcList: { - type: ArrayConstructor; - default: () => never[]; - }; - scrollContainer: {}; - src: StringConstructor; - zIndex: { - type: NumberConstructor; - default: number; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("error" | "load")[], "error" | "load", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - NONE: string; - CONTAIN: string; - COVER: string; - FILL: string; - SCALE_DOWN: string; - DEFAULT_POPPER_ZINDEX: number; - }; - }; - fit: StringConstructor; - lazy: BooleanConstructor; - previewSrcList: { - type: ArrayConstructor; - default: () => never[]; - }; - scrollContainer: {}; - src: StringConstructor; - zIndex: { - type: NumberConstructor; - default: number; - }; -}>> & { - onLoad?: ((...args: any[]) => any) | undefined; - onError?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - zIndex: number; - lazy: boolean; - previewSrcList: unknown[]; -}>; -export default _default; diff --git a/typings/image/src/pc.vue.d.ts b/typings/image/src/pc.vue.d.ts deleted file mode 100644 index 85e10b22a..000000000 --- a/typings/image/src/pc.vue.d.ts +++ /dev/null @@ -1,16 +0,0 @@ -declare const _default: { - components: { - ImageViewer: any; - }; - emits: string[]; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/index.d.ts b/typings/index.d.ts deleted file mode 100644 index 761c34568..000000000 --- a/typings/index.d.ts +++ /dev/null @@ -1,502 +0,0 @@ -import ActionSheet from '@opentiny/vue-action-sheet' -import Alert from '@opentiny/vue-alert' -import Amount from '@opentiny/vue-amount' -import Area from '@opentiny/vue-area' -import Autocomplete from '@opentiny/vue-autocomplete' -import AutonaviMap from '@opentiny/vue-autonavi-map' -import Avatar from '@opentiny/vue-avatar' -import Badge from '@opentiny/vue-badge' -import BaiduMap from '@opentiny/vue-baidu-map' -import Breadcrumb from '@opentiny/vue-breadcrumb' -import BreadcrumbItem from '@opentiny/vue-breadcrumb-item' -import BulletinBoard from '@opentiny/vue-bulletin-board' -import Button from '@opentiny/vue-button' -import ButtonGroup from '@opentiny/vue-button-group' -import Calendar from '@opentiny/vue-calendar' -import CardTemplate from '@opentiny/vue-card-template' -import Carousel from '@opentiny/vue-carousel' -import CarouselItem from '@opentiny/vue-carousel-item' -import Cascader from '@opentiny/vue-cascader' -import CascaderMenu from '@opentiny/vue-cascader-menu' -import CascaderNode from '@opentiny/vue-cascader-node' -import CascaderPanel from '@opentiny/vue-cascader-panel' -import Chart from '@opentiny/vue-chart' -import ChartBar from '@opentiny/vue-chart-bar' -import ChartBoxplot from '@opentiny/vue-chart-boxplot' -import ChartCandle from '@opentiny/vue-chart-candle' -import ChartCore from '@opentiny/vue-chart-core' -import ChartFunnel from '@opentiny/vue-chart-funnel' -import ChartGauge from '@opentiny/vue-chart-gauge' -import ChartGraph from '@opentiny/vue-chart-graph' -import ChartHeatmap from '@opentiny/vue-chart-heatmap' -import ChartHistogram from '@opentiny/vue-chart-histogram' -import ChartLine from '@opentiny/vue-chart-line' -import ChartLiquidfill from '@opentiny/vue-chart-liquidfill' -import ChartMap from '@opentiny/vue-chart-map' -import ChartPie from '@opentiny/vue-chart-pie' -import ChartRadar from '@opentiny/vue-chart-radar' -import ChartRing from '@opentiny/vue-chart-ring' -import ChartSankey from '@opentiny/vue-chart-sankey' -import ChartScatter from '@opentiny/vue-chart-scatter' -import ChartSunburst from '@opentiny/vue-chart-sunburst' -import ChartTree from '@opentiny/vue-chart-tree' -import ChartWaterfall from '@opentiny/vue-chart-waterfall' -import ChartWordcloud from '@opentiny/vue-chart-wordcloud' -import Checkbox from '@opentiny/vue-checkbox' -import CheckboxButton from '@opentiny/vue-checkbox-button' -import CheckboxGroup from '@opentiny/vue-checkbox-group' -import Col from '@opentiny/vue-col' -import Collapse from '@opentiny/vue-collapse' -import CollapseItem from '@opentiny/vue-collapse-item' -import CollapseTransition from '@opentiny/vue-collapse-transition' -import Company from '@opentiny/vue-company' -import Container from '@opentiny/vue-container' -import Country from '@opentiny/vue-country' -import CreditCard from '@opentiny/vue-credit-card' -import CreditCardForm from '@opentiny/vue-credit-card-form' -import Crop from '@opentiny/vue-crop' -import Currency from '@opentiny/vue-currency' -import DatePanel from '@opentiny/vue-date-panel' -import DatePicker from '@opentiny/vue-date-picker' -import DateRange from '@opentiny/vue-date-range' -import DateTable from '@opentiny/vue-date-table' -import Dept from '@opentiny/vue-dept' -import DetailPage from '@opentiny/vue-detail-page' -import DialogBox from '@opentiny/vue-dialog-box' -import DropRoles from '@opentiny/vue-drop-roles' -import DropTimes from '@opentiny/vue-drop-times' -import Dropdown from '@opentiny/vue-dropdown' -import DropdownItem from '@opentiny/vue-dropdown-item' -import DropdownMenu from '@opentiny/vue-dropdown-menu' -import Espace from '@opentiny/vue-espace' -import Exception from '@opentiny/vue-exception' -import FallMenu from '@opentiny/vue-fall-menu' -import FileUpload from '@opentiny/vue-file-upload' -import Floatbar from '@opentiny/vue-floatbar' -import Form from '@opentiny/vue-form' -import FormItem from '@opentiny/vue-form-item' -import Fullscreen from '@opentiny/vue-fullscreen' -import Grid from '@opentiny/vue-grid' -import GridColumn from '@opentiny/vue-grid-column' -import GridManager from '@opentiny/vue-grid-manager' -import GridToolbar from '@opentiny/vue-grid-toolbar' -import Hrapprover from '@opentiny/vue-hrapprover' -import Image from '@opentiny/vue-image' -import ImageViewer from '@opentiny/vue-image-viewer' -import Input from '@opentiny/vue-input' -import IpAddress from '@opentiny/vue-ip-address' -import Layout from '@opentiny/vue-layout' -import Link from '@opentiny/vue-link' -import LinkMenu from '@opentiny/vue-link-menu' -import List from '@opentiny/vue-list' -import Loading from '@opentiny/vue-loading' -import Locales from '@opentiny/vue-locales' -import LogonUser from '@opentiny/vue-logon-user' -import Logout from '@opentiny/vue-logout' -import Milestone from '@opentiny/vue-milestone' -import MiniPicker from '@opentiny/vue-mini-picker' -import Modal from '@opentiny/vue-modal' -import MonthRange from '@opentiny/vue-month-range' -import MonthTable from '@opentiny/vue-month-table' -import NavBar from '@opentiny/vue-nav-bar' -import NavMenu from '@opentiny/vue-nav-menu' -import Notify from '@opentiny/vue-notify' -import Numeric from '@opentiny/vue-numeric' -import Option from '@opentiny/vue-option' -import OptionGroup from '@opentiny/vue-option-group' -import Pager from '@opentiny/vue-pager' -import PagerItem from '@opentiny/vue-pager-item' -import Picker from '@opentiny/vue-picker' -import PickerColumn from '@opentiny/vue-picker-column' -import PopUpload from '@opentiny/vue-pop-upload' -import Popeditor from '@opentiny/vue-popeditor' -import Popover from '@opentiny/vue-popover' -import Popup from '@opentiny/vue-popup' -import Progress from '@opentiny/vue-progress' -import PullRefresh from '@opentiny/vue-pull-refresh' -import Radio from '@opentiny/vue-radio' -import RadioButton from '@opentiny/vue-radio-button' -import RadioGroup from '@opentiny/vue-radio-group' -import Rate from '@opentiny/vue-rate' -import Roles from '@opentiny/vue-roles' -import Row from '@opentiny/vue-row' -import ScrollText from '@opentiny/vue-scroll-text' -import Scrollbar from '@opentiny/vue-scrollbar' -import Search from '@opentiny/vue-search' -import Select from '@opentiny/vue-select' -import SelectDropdown from '@opentiny/vue-select-dropdown' -import SlideBar from '@opentiny/vue-slide-bar' -import Slider from '@opentiny/vue-slider' -import Split from '@opentiny/vue-split' -import Steps from '@opentiny/vue-steps' -import SvgIcon from '@opentiny/vue-svg-icon' -import Switch from '@opentiny/vue-switch' -import TabItem from '@opentiny/vue-tab-item' -import Tabbar from '@opentiny/vue-tabbar' -import TabbarItem from '@opentiny/vue-tabbar-item' -import Table from '@opentiny/vue-table' -import Tabs from '@opentiny/vue-tabs' -import Tag from '@opentiny/vue-tag' -import TextPopup from '@opentiny/vue-text-popup' -import Time from '@opentiny/vue-time' -import TimeLine from '@opentiny/vue-time-line' -import TimePanel from '@opentiny/vue-time-panel' -import TimePicker from '@opentiny/vue-time-picker' -import TimeRange from '@opentiny/vue-time-range' -import TimeSelect from '@opentiny/vue-time-select' -import TimeSpinner from '@opentiny/vue-time-spinner' -import ToggleMenu from '@opentiny/vue-toggle-menu' -import Tooltip from '@opentiny/vue-tooltip' -import TopBox from '@opentiny/vue-top-box' -import Transfer from '@opentiny/vue-transfer' -import TransferPanel from '@opentiny/vue-transfer-panel' -import Tree from '@opentiny/vue-tree' -import TreeMenu from '@opentiny/vue-tree-menu' -import Upload from '@opentiny/vue-upload' -import UploadDragger from '@opentiny/vue-upload-dragger' -import UploadList from '@opentiny/vue-upload-list' -import User from '@opentiny/vue-user' -import UserAccount from '@opentiny/vue-user-account' -import UserContact from '@opentiny/vue-user-contact' -import UserHead from '@opentiny/vue-user-head' -import UserLink from '@opentiny/vue-user-link' -import Wizard from '@opentiny/vue-wizard' -import YearTable from '@opentiny/vue-year-table' -export declare const install: (app: any, opts?: {}) => void -declare const version = '3.0.0' -export { - version, - ActionSheet, - Alert, - Amount, - Area, - Autocomplete, - AutonaviMap, - Avatar, - Badge, - BaiduMap, - Breadcrumb, - BreadcrumbItem, - BulletinBoard, - Button, - ButtonGroup, - Calendar, - CardTemplate, - Carousel, - CarouselItem, - Cascader, - CascaderMenu, - CascaderNode, - CascaderPanel, - Chart, - ChartBar, - ChartBoxplot, - ChartCandle, - ChartCore, - ChartFunnel, - ChartGauge, - ChartGraph, - ChartHeatmap, - ChartHistogram, - ChartLine, - ChartLiquidfill, - ChartMap, - ChartPie, - ChartRadar, - ChartRing, - ChartSankey, - ChartScatter, - ChartSunburst, - ChartTree, - ChartWaterfall, - ChartWordcloud, - Checkbox, - CheckboxButton, - CheckboxGroup, - Col, - Collapse, - CollapseItem, - CollapseTransition, - Company, - Container, - Country, - CreditCard, - CreditCardForm, - Crop, - Currency, - DatePanel, - DatePicker, - DateRange, - DateTable, - Dept, - DetailPage, - DialogBox, - DropRoles, - DropTimes, - Dropdown, - DropdownItem, - DropdownMenu, - Espace, - Exception, - FallMenu, - FileUpload, - Floatbar, - Form, - FormItem, - Fullscreen, - Grid, - GridColumn, - GridManager, - GridToolbar, - Hrapprover, - Image, - ImageViewer, - Input, - IpAddress, - Layout, - Link, - LinkMenu, - List, - Loading, - Locales, - LogonUser, - Logout, - Milestone, - MiniPicker, - Modal, - MonthRange, - MonthTable, - NavBar, - NavMenu, - Notify, - Numeric, - Option, - OptionGroup, - Pager, - PagerItem, - Picker, - PickerColumn, - PopUpload, - Popeditor, - Popover, - Popup, - Progress, - PullRefresh, - Radio, - RadioButton, - RadioGroup, - Rate, - Roles, - Row, - ScrollText, - Scrollbar, - Search, - Select, - SelectDropdown, - SlideBar, - Slider, - Split, - Steps, - SvgIcon, - Switch, - TabItem, - Tabbar, - TabbarItem, - Table, - Tabs, - Tag, - TextPopup, - Time, - TimeLine, - TimePanel, - TimePicker, - TimeRange, - TimeSelect, - TimeSpinner, - ToggleMenu, - Tooltip, - TopBox, - Transfer, - TransferPanel, - Tree, - TreeMenu, - Upload, - UploadDragger, - UploadList, - User, - UserAccount, - UserContact, - UserHead, - UserLink, - Wizard, - YearTable -} -declare const _default: { - version: string - ActionSheet: any - Alert: any - Amount: any - Area: any - Autocomplete: any - AutonaviMap: any - Avatar: any - Badge: any - BaiduMap: any - Breadcrumb: any - BreadcrumbItem: any - BulletinBoard: any - Button: any - ButtonGroup: any - Calendar: any - CardTemplate: any - Carousel: any - CarouselItem: any - Cascader: any - CascaderMenu: any - CascaderNode: any - CascaderPanel: any - Chart: any - ChartBar: any - ChartBoxplot: any - ChartCandle: any - ChartCore: any - ChartFunnel: any - ChartGauge: any - ChartGraph: any - ChartHeatmap: any - ChartHistogram: any - ChartLine: any - ChartLiquidfill: any - ChartMap: any - ChartPie: any - ChartRadar: any - ChartRing: any - ChartSankey: any - ChartScatter: any - ChartSunburst: any - ChartTree: any - ChartWaterfall: any - ChartWordcloud: any - Checkbox: any - CheckboxButton: any - CheckboxGroup: any - Col: any - Collapse: any - CollapseItem: any - CollapseTransition: any - Company: any - Container: any - Country: any - CreditCard: any - CreditCardForm: any - Crop: any - Currency: any - DatePanel: any - DatePicker: any - DateRange: any - DateTable: any - Dept: any - DetailPage: any - DialogBox: any - DropRoles: any - DropTimes: any - Dropdown: any - DropdownItem: any - DropdownMenu: any - Espace: any - Exception: any - FallMenu: any - FileUpload: any - Floatbar: any - Form: any - FormItem: any - Fullscreen: any - Grid: any - GridColumn: any - GridManager: any - GridToolbar: any - Hrapprover: any - Image: any - ImageViewer: any - Input: any - IpAddress: any - Layout: any - Link: any - LinkMenu: any - List: any - Loading: any - Locales: any - LogonUser: any - Logout: any - Milestone: any - MiniPicker: any - Modal: any - MonthRange: any - MonthTable: any - NavBar: any - NavMenu: any - Notify: any - Numeric: any - Option: any - OptionGroup: any - Pager: any - PagerItem: any - Picker: any - PickerColumn: any - PopUpload: any - Popeditor: any - Popover: any - Popup: any - Progress: any - PullRefresh: any - Radio: any - RadioButton: any - RadioGroup: any - Rate: any - Roles: any - Row: any - ScrollText: any - Scrollbar: any - Search: any - Select: any - SelectDropdown: any - SlideBar: any - Slider: any - Split: any - Steps: any - SvgIcon: any - Switch: any - TabItem: any - Tabbar: any - TabbarItem: any - Table: any - Tabs: any - Tag: any - TextPopup: any - Time: any - TimeLine: any - TimePanel: any - TimePicker: any - TimeRange: any - TimeSelect: any - TimeSpinner: any - ToggleMenu: any - Tooltip: any - TopBox: any - Transfer: any - TransferPanel: any - Tree: any - TreeMenu: any - Upload: any - UploadDragger: any - UploadList: any - User: any - UserAccount: any - UserContact: any - UserHead: any - UserLink: any - Wizard: any - YearTable: any - install: (app: any, opts?: {}) => void -} -export default _default diff --git a/typings/input/index.d.ts b/typings/input/index.d.ts deleted file mode 100644 index 090a22078..000000000 --- a/typings/input/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Input from './src/index'; -export default Input; diff --git a/typings/input/src/index.d.ts b/typings/input/src/index.d.ts deleted file mode 100644 index 517b6fd7c..000000000 --- a/typings/input/src/index.d.ts +++ /dev/null @@ -1,222 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - INPUT_PC: string; - INPUTGROUP_PC: string; - INPUT_MOBILE: string; - INPUTGROUP_MOBILE: string; - Mode: string; - inputMode(mode: any): string; - inputGroupMode(mode: any): string; - VALIDATE_ICON: { - Validating: string; - Success: string; - Error: string; - }; - COMPONENT_NAME: { - FormItem: string; - }; - }; - }; - name: StringConstructor; - size: StringConstructor; - form: StringConstructor; - label: StringConstructor; - height: NumberConstructor; - resize: StringConstructor; - tabindex: { - type: StringConstructor; - default: string; - }; - disabled: BooleanConstructor; - readonly: BooleanConstructor; - suffixIcon: (ObjectConstructor | StringConstructor)[]; - prefixIcon: (ObjectConstructor | StringConstructor)[]; - modelValue: (StringConstructor | NumberConstructor)[]; - type: { - type: StringConstructor; - default: string; - }; - vertical: { - type: BooleanConstructor; - default: boolean; - }; - selectMenu: { - type: ArrayConstructor; - default: () => never[]; - }; - isSelect: { - type: BooleanConstructor; - default: boolean; - }; - mobileTips: StringConstructor; - counter: { - type: BooleanConstructor; - default: boolean; - }; - autosize: { - type: (ObjectConstructor | BooleanConstructor)[]; - default: boolean; - }; - clearable: { - type: BooleanConstructor; - default: boolean; - }; - autocomplete: { - type: StringConstructor; - default: string; - }; - showPassword: { - type: BooleanConstructor; - default: boolean; - }; - showWordLimit: { - type: BooleanConstructor; - default: boolean; - }; - showTitle: { - type: BooleanConstructor; - default: boolean; - }; - validateEvent: { - type: BooleanConstructor; - default: boolean; - }; - textareaTitle: { - type: StringConstructor; - default: string; - }; - rows: { - type: NumberConstructor; - default: number; - }; - placeholder: { - type: StringConstructor; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("input" | "change" | "clear" | "focus" | "blur")[], "input" | "change" | "clear" | "focus" | "blur", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - INPUT_PC: string; - INPUTGROUP_PC: string; - INPUT_MOBILE: string; - INPUTGROUP_MOBILE: string; - Mode: string; - inputMode(mode: any): string; - inputGroupMode(mode: any): string; - VALIDATE_ICON: { - Validating: string; - Success: string; - Error: string; - }; - COMPONENT_NAME: { - FormItem: string; - }; - }; - }; - name: StringConstructor; - size: StringConstructor; - form: StringConstructor; - label: StringConstructor; - height: NumberConstructor; - resize: StringConstructor; - tabindex: { - type: StringConstructor; - default: string; - }; - disabled: BooleanConstructor; - readonly: BooleanConstructor; - suffixIcon: (ObjectConstructor | StringConstructor)[]; - prefixIcon: (ObjectConstructor | StringConstructor)[]; - modelValue: (StringConstructor | NumberConstructor)[]; - type: { - type: StringConstructor; - default: string; - }; - vertical: { - type: BooleanConstructor; - default: boolean; - }; - selectMenu: { - type: ArrayConstructor; - default: () => never[]; - }; - isSelect: { - type: BooleanConstructor; - default: boolean; - }; - mobileTips: StringConstructor; - counter: { - type: BooleanConstructor; - default: boolean; - }; - autosize: { - type: (ObjectConstructor | BooleanConstructor)[]; - default: boolean; - }; - clearable: { - type: BooleanConstructor; - default: boolean; - }; - autocomplete: { - type: StringConstructor; - default: string; - }; - showPassword: { - type: BooleanConstructor; - default: boolean; - }; - showWordLimit: { - type: BooleanConstructor; - default: boolean; - }; - showTitle: { - type: BooleanConstructor; - default: boolean; - }; - validateEvent: { - type: BooleanConstructor; - default: boolean; - }; - textareaTitle: { - type: StringConstructor; - default: string; - }; - rows: { - type: NumberConstructor; - default: number; - }; - placeholder: { - type: StringConstructor; - default: string; - }; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; - onClear?: ((...args: any[]) => any) | undefined; - onFocus?: ((...args: any[]) => any) | undefined; - onBlur?: ((...args: any[]) => any) | undefined; - onInput?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - type: string; - selectMenu: unknown[]; - vertical: boolean; - isSelect: boolean; - disabled: boolean; - readonly: boolean; - clearable: boolean; - autocomplete: string; - showPassword: boolean; - validateEvent: boolean; - showWordLimit: boolean; - showTitle: boolean; - textareaTitle: string; - counter: boolean; - autosize: boolean | Record; - tabindex: string; - rows: number; - placeholder: string; -}>; -export default _default; diff --git a/typings/input/src/mobile.vue.d.ts b/typings/input/src/mobile.vue.d.ts deleted file mode 100644 index c3ec69c76..000000000 --- a/typings/input/src/mobile.vue.d.ts +++ /dev/null @@ -1,27 +0,0 @@ -import '@opentiny/vue-theme-mobile/input/index.css'; -declare const _default: import("vue").DefineComponent, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "change" | "clear" | "focus" | "blur" | "keyup" | "keydown" | "paste" | "mouseenter" | "mouseleave")[], "update:modelValue" | "change" | "clear" | "focus" | "blur" | "keyup" | "keydown" | "paste" | "mouseenter" | "mouseleave", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>> & { - "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined; - onChange?: ((...args: any[]) => any) | undefined; - onClear?: ((...args: any[]) => any) | undefined; - onFocus?: ((...args: any[]) => any) | undefined; - onBlur?: ((...args: any[]) => any) | undefined; - onKeyup?: ((...args: any[]) => any) | undefined; - onKeydown?: ((...args: any[]) => any) | undefined; - onPaste?: ((...args: any[]) => any) | undefined; - onMouseenter?: ((...args: any[]) => any) | undefined; - onMouseleave?: ((...args: any[]) => any) | undefined; -}, { - [x: string]: any; -}>; -export default _default; diff --git a/typings/input/src/pc.vue.d.ts b/typings/input/src/pc.vue.d.ts deleted file mode 100644 index a665a17e8..000000000 --- a/typings/input/src/pc.vue.d.ts +++ /dev/null @@ -1,29 +0,0 @@ -import '@opentiny/vue-theme/input/index.css'; -declare const _default: import("vue").DefineComponent, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("input" | "update:modelValue" | "change" | "clear" | "focus" | "blur" | "keyup" | "keydown" | "paste" | "mouseenter" | "mouseleave" | "click")[], "input" | "update:modelValue" | "change" | "clear" | "focus" | "blur" | "keyup" | "keydown" | "paste" | "mouseenter" | "mouseleave" | "click", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>> & { - "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined; - onChange?: ((...args: any[]) => any) | undefined; - onClear?: ((...args: any[]) => any) | undefined; - onFocus?: ((...args: any[]) => any) | undefined; - onBlur?: ((...args: any[]) => any) | undefined; - onKeyup?: ((...args: any[]) => any) | undefined; - onKeydown?: ((...args: any[]) => any) | undefined; - onPaste?: ((...args: any[]) => any) | undefined; - onMouseenter?: ((...args: any[]) => any) | undefined; - onMouseleave?: ((...args: any[]) => any) | undefined; - onInput?: ((...args: any[]) => any) | undefined; - onClick?: ((...args: any[]) => any) | undefined; -}, { - [x: string]: any; -}>; -export default _default; diff --git a/typings/input/src/tall-storage.vue.d.ts b/typings/input/src/tall-storage.vue.d.ts deleted file mode 100644 index 51163a71c..000000000 --- a/typings/input/src/tall-storage.vue.d.ts +++ /dev/null @@ -1,24 +0,0 @@ -import '@opentiny/vue-theme/tall-storage/index.css'; -declare const _default: import("vue").DefineComponent<{ - isMemoryStorage: BooleanConstructor; - localstorageData: ArrayConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("input" | "change" | "clear" | "focus" | "blur")[], "input" | "change" | "clear" | "focus" | "blur", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onChange?: ((...args: any[]) => any) | undefined; - onClear?: ((...args: any[]) => any) | undefined; - onFocus?: ((...args: any[]) => any) | undefined; - onBlur?: ((...args: any[]) => any) | undefined; - onInput?: ((...args: any[]) => any) | undefined; -}, { - isMemoryStorage: boolean; -}>; -export default _default; diff --git a/typings/ip-address/index.d.ts b/typings/ip-address/index.d.ts deleted file mode 100644 index c488f2acf..000000000 --- a/typings/ip-address/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import IpAddress from './src/index'; -import '@opentiny/vue-theme/ip-address/index.css'; -export default IpAddress; diff --git a/typings/ip-address/src/index.d.ts b/typings/ip-address/src/index.d.ts deleted file mode 100644 index 6cb54d031..000000000 --- a/typings/ip-address/src/index.d.ts +++ /dev/null @@ -1,69 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - size: StringConstructor; - /** - * @property {String} value - 显示值 - */ - modelValue: StringConstructor; - /** - * @property {String} [type = IPv4] - IP地址输入组件类型('IPv4', 'IPv6',)可选择 - */ - type: { - type: StringConstructor; - default: string; - }; - /** - * @property {Boolean} readonly - 只读 - */ - readonly: BooleanConstructor; - /** - * @property {Boolean} disabled - 禁用 - */ - disabled: BooleanConstructor; - /** - * @property {String, Object} [delimiter = .] - 组件IP段显示的分隔符改为图标 - */ - delimiter: { - type: (ObjectConstructor | StringConstructor)[]; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("input" | "select" | "change" | "focus" | "blur")[], "input" | "select" | "change" | "focus" | "blur", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onFocus?: ((...args: any[]) => any) | undefined; - onBlur?: ((...args: any[]) => any) | undefined; - onChange?: ((...args: any[]) => any) | undefined; - onInput?: ((...args: any[]) => any) | undefined; - onSelect?: ((...args: any[]) => any) | undefined; -}, { - type: string; - readonly: boolean; - disabled: boolean; - delimiter: string | Record; -}>; -export default _default; diff --git a/typings/ip-address/src/pc.vue.d.ts b/typings/ip-address/src/pc.vue.d.ts deleted file mode 100644 index 8b797cb73..000000000 --- a/typings/ip-address/src/pc.vue.d.ts +++ /dev/null @@ -1,16 +0,0 @@ -declare const _default: { - props: string[]; - emits: string[]; - components: { - IconDotIpv4: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/layout/index.d.ts b/typings/layout/index.d.ts deleted file mode 100644 index 5bd483e2e..000000000 --- a/typings/layout/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Layout from './src/index'; -import '@opentiny/vue-theme/layout/index.css'; -export default Layout; diff --git a/typings/layout/src/index.d.ts b/typings/layout/src/index.d.ts deleted file mode 100644 index f6a4184dd..000000000 --- a/typings/layout/src/index.d.ts +++ /dev/null @@ -1,23 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - tag: { - type: StringConstructor; - default: string; - }; - size: { - type: StringConstructor; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - size: string; - tag: string; -}>; -export default _default; diff --git a/typings/layout/src/pc.vue.d.ts b/typings/layout/src/pc.vue.d.ts deleted file mode 100644 index f5d461606..000000000 --- a/typings/layout/src/pc.vue.d.ts +++ /dev/null @@ -1,12 +0,0 @@ -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/link-menu/index.d.ts b/typings/link-menu/index.d.ts deleted file mode 100644 index d02a2352c..000000000 --- a/typings/link-menu/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import LinkMenu from './src/index'; -import '@opentiny/vue-theme/link-menu/index.css'; -export default LinkMenu; diff --git a/typings/link-menu/src/index.d.ts b/typings/link-menu/src/index.d.ts deleted file mode 100644 index fb75dd384..000000000 --- a/typings/link-menu/src/index.d.ts +++ /dev/null @@ -1,107 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - DIALOG_TITLE: string; - }; - }; - icon: ObjectConstructor; - searchIcon: { - type: ObjectConstructor; - default: () => any; - }; - data: { - type: ArrayConstructor; - }; - maxItem: { - type: NumberConstructor; - }; - title: { - type: StringConstructor; - default: string; - }; - defaultExpandAll: { - type: BooleanConstructor; - default: boolean; - }; - ellipsis: { - type: BooleanConstructor; - default: boolean; - }; - wrap: { - type: BooleanConstructor; - default: boolean; - }; - props: { - default: () => { - children: string; - disabled: string; - label: string; - }; - }; - getMenuDataSync: FunctionConstructor; - keepSelectedNodes: { - type: BooleanConstructor; - default: boolean; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - DIALOG_TITLE: string; - }; - }; - icon: ObjectConstructor; - searchIcon: { - type: ObjectConstructor; - default: () => any; - }; - data: { - type: ArrayConstructor; - }; - maxItem: { - type: NumberConstructor; - }; - title: { - type: StringConstructor; - default: string; - }; - defaultExpandAll: { - type: BooleanConstructor; - default: boolean; - }; - ellipsis: { - type: BooleanConstructor; - default: boolean; - }; - wrap: { - type: BooleanConstructor; - default: boolean; - }; - props: { - default: () => { - children: string; - disabled: string; - label: string; - }; - }; - getMenuDataSync: FunctionConstructor; - keepSelectedNodes: { - type: BooleanConstructor; - default: boolean; - }; -}>>, { - props: { - children: string; - disabled: string; - label: string; - }; - _constants: Record; - title: string; - ellipsis: boolean; - defaultExpandAll: boolean; - searchIcon: Record; - wrap: boolean; - keepSelectedNodes: boolean; -}>; -export default _default; diff --git a/typings/link-menu/src/pc.vue.d.ts b/typings/link-menu/src/pc.vue.d.ts deleted file mode 100644 index f14b54879..000000000 --- a/typings/link-menu/src/pc.vue.d.ts +++ /dev/null @@ -1,19 +0,0 @@ -declare const _default: { - props: string[]; - components: { - TinyTree: any; - TinyInput: any; - TinyButton: any; - TinyDialogBox: any; - IconSetting: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/link/index.d.ts b/typings/link/index.d.ts deleted file mode 100644 index 95507a6e4..000000000 --- a/typings/link/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Link from './src/index'; -import '@opentiny/vue-theme/link/index.css'; -export default Link; diff --git a/typings/link/src/index.d.ts b/typings/link/src/index.d.ts deleted file mode 100644 index 6e936af39..000000000 --- a/typings/link/src/index.d.ts +++ /dev/null @@ -1,30 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - type: { - type: StringConstructor; - default: string; - }; - underline: { - type: BooleanConstructor; - default: boolean; - }; - href: StringConstructor; - icon: (ObjectConstructor | StringConstructor)[]; - disabled: BooleanConstructor; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - type: string; - disabled: boolean; - underline: boolean; -}>; -export default _default; diff --git a/typings/link/src/pc.vue.d.ts b/typings/link/src/pc.vue.d.ts deleted file mode 100644 index b8fe0ad47..000000000 --- a/typings/link/src/pc.vue.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -declare const _default: { - props: string[]; - emits: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/list/index.d.ts b/typings/list/index.d.ts deleted file mode 100644 index b7dea8171..000000000 --- a/typings/list/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import List from './src/index.vue'; -import '@opentiny/vue-theme-mobile/list/index.css'; -export default List; diff --git a/typings/list/src/index.vue.d.ts b/typings/list/src/index.vue.d.ts deleted file mode 100644 index dd16fc548..000000000 --- a/typings/list/src/index.vue.d.ts +++ /dev/null @@ -1,57 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - content: { - type: StringConstructor; - default: string; - }; - subText: { - type: StringConstructor; - default: string; - }; - contentDes: { - type: StringConstructor; - default: string; - }; - list: { - type: BooleanConstructor; - default: boolean; - }; - id: { - type: (StringConstructor | NumberConstructor)[]; - default: string; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - content: string; - id: string | number; - list: boolean; - subText: string; - contentDes: string; -}>; -export default _default; diff --git a/typings/loading/index.d.ts b/typings/loading/index.d.ts deleted file mode 100644 index 4724f426e..000000000 --- a/typings/loading/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import '@opentiny/vue-theme/loading/index.css'; -declare let Loadings: any; -export default Loadings; diff --git a/typings/loading/src/directive.d.ts b/typings/loading/src/directive.d.ts deleted file mode 100644 index 5298df7f0..000000000 --- a/typings/loading/src/directive.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: any; -export default _default; diff --git a/typings/loading/src/index.vue.d.ts b/typings/loading/src/index.vue.d.ts deleted file mode 100644 index 1f2d16e6d..000000000 --- a/typings/loading/src/index.vue.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: ObjectConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, {}>; -export default _default; diff --git a/typings/loading/src/service.d.ts b/typings/loading/src/service.d.ts deleted file mode 100644 index cc0007761..000000000 --- a/typings/loading/src/service.d.ts +++ /dev/null @@ -1,11 +0,0 @@ -export declare const constants: { - TEXT_ATTR: string; - IS_FULLSCREEN_CLS: string; - TEXT_SPINNER: string; - TEXT_BACKGROUND: string; - TEXT_CUSTOM_CLS: string; - PARENT_HIDDEN_CLS: string; - PARENT_RELATIVE_CLS: string; -}; -declare const _default: (configs?: {}) => any; -export default _default; diff --git a/typings/locale/format.d.ts b/typings/locale/format.d.ts deleted file mode 100644 index 56e3742c7..000000000 --- a/typings/locale/format.d.ts +++ /dev/null @@ -1 +0,0 @@ -export default function (string: any, ...args: any[]): any; diff --git a/typings/locale/glob.d.ts b/typings/locale/glob.d.ts deleted file mode 100644 index 4fa461c80..000000000 --- a/typings/locale/glob.d.ts +++ /dev/null @@ -1,24 +0,0 @@ -export declare const getNumberFormat: (config: any) => any; -export declare const getDateFormat: (config: any) => { - DateFormat: any; - DateTimeFormat: string; - TimeFormat: any; -}; -export declare const getStrTimezone: (value: any) => any; -declare const _default: (t: any) => (config: any) => { - getFormatConfig: () => any; - setFormatConfig: (obj: any) => any; - getNumberFormat: () => any; - getDateFormat: () => { - DateTimeFormat: any; - TimeFormat: any; - Timezone: any; - DateFormat: any; - DbTimezone: any; - }; - formatDate: (value: any, format: any, convert: any) => any; - formatNumber: (value: any, format: any) => any; - recoverNumber: (value: any, format: any) => any; - getDateWithNewTimezone: (value: any, from: any, to: any) => any; -}; -export default _default; diff --git a/typings/locale/index.d.ts b/typings/locale/index.d.ts deleted file mode 100644 index aa5c8cb1d..000000000 --- a/typings/locale/index.d.ts +++ /dev/null @@ -1,20 +0,0 @@ -export declare const use: any, t: any, i18n: any, initI18n: any, extend: any, zhCN: any, enUS: any, language: any; -export declare const globalization: (config: any) => { - getFormatConfig: () => any; - setFormatConfig: (obj: any) => any; - getNumberFormat: () => any; - getDateFormat: () => { - DateTimeFormat: any; - TimeFormat: any; - Timezone: any; - DateFormat: any; - DbTimezone: any; - }; - formatDate: (value: any, format: any, convert: any) => any; - formatNumber: (value: any, format: any) => any; - recoverNumber: (value: any, format: any) => any; - getDateWithNewTimezone: (value: any, from: any, to: any) => any; -}; -export declare const version: string | undefined; -declare const _default: any; -export default _default; diff --git a/typings/locale/lang/en.d.ts b/typings/locale/lang/en.d.ts deleted file mode 100644 index d0681ef00..000000000 --- a/typings/locale/lang/en.d.ts +++ /dev/null @@ -1,544 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -declare const _default: { - 'en-US': string; - 'zh-CN': string; - 'zh-TW': string; - hello: string; - code: string; - ui: { - wizard: { - previousStep: string; - nextStep: string; - save: string; - submit: string; - }; - linkMenu: { - title: string; - placeholder: string; - sure: string; - cancel: string; - }; - todoList: { - add: string; - placeholder: string; - }; - alert: { - error: string; - info: string; - success: string; - title: string; - warning: string; - }; - amount: { - currency: string; - amount: string; - date: string; - }; - base: { - all: string; - cancel: string; - confirm: string; - more: string; - reset: string; - }; - button: { - cancel: string; - confirm: string; - }; - cascader: { - noMatch: string; - loading: string; - placeholder: string; - noData: string; - }; - chart: { - auxiliary: string; - emptyText: string; - kName: string; - other: string; - summation: string; - total: string; - value: string; - }; - creditCardForm: { - submit: string; - }; - crop: { - cropImage: string; - croppedImage: string; - }; - datepicker: { - clear: string; - cancel: string; - endDate: string; - confirm: string; - month: string; - endTime: string; - month2: string; - month1: string; - month4: string; - month3: string; - month6: string; - month5: string; - month8: string; - month7: string; - month10: string; - month9: string; - month12: string; - month11: string; - months: { - feb: string; - jan: string; - apr: string; - mar: string; - jun: string; - may: string; - aug: string; - jul: string; - oct: string; - sep: string; - dec: string; - nov: string; - }; - nextYear: string; - nextMonth: string; - prevMonth: string; - now: string; - selectDate: string; - prevYear: string; - startDate: string; - selectTime: string; - today: string; - currentMonth: string; - startTime: string; - week: string; - weeks: { - mon: string; - sun: string; - wed: string; - tue: string; - thu: string; - sat: string; - fri: string; - }; - timezone: string; - year: string; - }; - calendar: { - showType: { - year: string; - }; - }; - dept: { - code: string; - company: string; - dept1: string; - dept2: string; - dept3: string; - dept4: string; - dept5: string; - dept6: string; - dept7: string; - dept8: string; - input: string; - name: string; - search: string; - selected: string; - }; - detailpage: { - saveButtonText: string; - cancelButtonText: string; - localTips: string; - localTitle: string; - valueTitle: string; - labelTitle: string; - dialogTitle: string; - }; - dialogBox: { - confirm: string; - cancel: string; - }; - exception: { - build: string; - busy: string; - noperm: string; - weaknet: string; - pcview: string; - nodata: string; - create: string; - provide: string; - }; - fileUpload: { - largefile: string; - folder: string; - init: string; - token: string; - exceed: string; - largeFile: string; - fileSize: string; - deleteTip: string; - downloadFile: string; - previewFile: string; - updateFile: string; - deleteFile: string; - empty: string; - }; - grid: { - dataUnchanged: string; - deleteSelectRecord: string; - emptyText: string; - error: { - cellEditRender: string; - delGetAllRecords: string; - delGetRecords: string; - delLabel: string; - delProp: string; - delRevert: string; - groupFixed: string; - notDelete: string; - notMouse: string; - notQuery: string; - notResizable: string; - notSave: string; - reqModule: string; - rowIdEmpty: string; - scrollOriginal: string; - scrollYHeight: string; - toolbarId: string; - treeFixedExpand: string; - treeInsert: string; - treeRemove: string; - unableInsert: string; - dargSelf: string; - dargFixed: string; - remoteMethod: string; - remoteSelectedMethod: string; - }; - filter: { - allFilter: string; - clear: string; - clearAll: string; - confirmFilter: string; - empty: string; - emptyText: string; - equal: string; - include: string; - prefix: string; - resetFilter: string; - unempty: string; - }; - individuation: { - cancelBtn: string; - colConfigs: { - asc: string; - desc: string; - frozenLeft: string; - frozenRight: string; - invisible: string; - unsorted: string; - unfrozen: string; - visible: string; - }; - hideMsg: string; - resetBtn: string; - saveBtn: string; - tabs: { - base: { - title: string; - tips: string; - }; - other: { - allDataSort: string; - currPageSort: string; - pageSize: string; - title: string; - tips: string; - sortType: string; - }; - }; - title: string; - switchtitle: string; - switchsave: string; - switchlabel: string; - switchapply: string; - switchedit: string; - switchdel: string; - switchconfirm: string; - switchonlytemp: string; - switchtempapply: string; - switchtempoverwrite: string; - switchdelcon: string; - switchdelyes: string; - switchdelno: string; - switchapplycon: string; - }; - removeSelectRecord: string; - saveSuccess: string; - selectOneRecord: string; - isSaveMsg: string; - }; - hrapprover: { - approver: string; - noapprover: string; - noselected: string; - remark: string; - }; - imageViewer: { - loadErrorAlt: string; - }; - navMenu: { - moreText: string; - }; - logout: { - in: string; - out: string; - }; - page: { - goto: string; - item: string; - next: string; - page: string; - pageClassifier: string; - pagesize: string; - prev: string; - total: string; - }; - popeditor: { - cancel: string; - confirm: string; - historyLists: string; - reset: string; - search: string; - selectionLists: string; - sourceLists: string; - title: string; - filterNode: string; - }; - popupload: { - fileName: string; - fileSize: string; - fileStatus: string; - dialogTitle: string; - cancelButtonText: string; - tipsFileText: string; - uploadError: string; - uploadButtonText: string; - uploadSuccess: string; - saveButtonText: string; - uploadsButtonText: string; - errorTypeTips: string; - errorSizeTips: string; - limitUploadFileType: string; - limitUploadFileNumber: string; - limitUploadFileSize: string; - errorNumTips: string; - }; - rate: { - level: { - average: string; - excellent: string; - fair: string; - good: string; - poor: string; - }; - }; - select: { - loading: string; - noData: string; - noMatch: string; - placeholder: string; - }; - search: { - placeholder: string; - }; - tabs: { - moreItem: string; - }; - tag: { - add: string; - }; - toggleMenu: { - placeholder: string; - }; - treeMenu: { - placeholder: string; - }; - transfer: { - filterPlaceholder: string; - hasCheckedFormat: string; - noData: string; - noMatch: string; - noCheckedFormat: string; - titles: string[]; - }; - tree: { - emptyText: string; - }; - usercard: { - address: string; - collapse: string; - department: string; - email: string; - employeeId: string; - empno: string; - expand: string; - fax: string; - internal: string; - manager: string; - mobile: string; - other: string; - phone: string; - timezone: string; - title: string; - travelcode: string; - viop: string; - zipcode: string; - }; - richText: { - bold: string; - italic: string; - underline: string; - header: string; - strike: string; - blockquote: string; - codeBlock: string; - size: string; - listOrdered: string; - listBullet: string; - header1: string; - header2: string; - align: string; - color: string; - background: string; - image: string; - video: string; - link: string; - formula: string; - clean: string; - indent1: string; - indent2: string; - pickerLabel: string; - headerPicker1: string; - headerPicker2: string; - headerPicker3: string; - headerPicker4: string; - headerPicker5: string; - headerPicker6: string; - normal: string; - sizeSmall: string; - sizeLarge: string; - sizeHuge: string; - alignPicker1: string; - alignPicker2: string; - alignPicker3: string; - alignPicker4: string; - subScript: string; - superScript: string; - directionRTL: string; - font: string; - file: string; - betterTable: string; - insertColumnRight: string; - insertColumnLeft: string; - insertRowUp: string; - insertRowDown: string; - mergeCells: string; - unmergeCells: string; - deleteColumn: string; - deleteRow: string; - deleteTable: string; - colorPicker: string; - placeholder: string; - }; - steps: { - done: string; - doing: string; - wait: string; - }; - actionSheet: { - cancel: string; - }; - image: { - loadFail: string; - }; - miniPicker: { - cancel: string; - confirm: string; - }; - pullRefresh: { - pulling: string; - loosing: string; - }; - }; - validation: { - array: { - len: string; - min: string; - max: string; - range: string; - }; - date: { - format: string; - invalid: string; - parse: string; - }; - default: string; - enum: string; - number: { - len: string; - min: string; - max: string; - range: string; - }; - pattern: { - mismatch: string; - }; - required: string; - string: { - len: string; - min: string; - max: string; - range: string; - }; - types: { - acceptFile: string; - acceptImg: string; - array: string; - boolean: string; - date: string; - dateTime: string; - dateYM: string; - dateYMD: string; - digits: string; - email: string; - fileSize: string; - float: string; - hex: string; - integer: string; - longDateTime: string; - method: string; - number: string; - object: string; - regexp: string; - specialch: string; - specialch2: string; - speczh: string; - string: string; - time: string; - url: string; - version: string; - }; - whitespace: string; - }; -}; -export default _default; diff --git a/typings/locale/lang/zh-CN.d.ts b/typings/locale/lang/zh-CN.d.ts deleted file mode 100644 index 5dfa88585..000000000 --- a/typings/locale/lang/zh-CN.d.ts +++ /dev/null @@ -1,542 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -declare const _default: { - 'en-US': string; - 'zh-CN': string; - 'zh-TW': string; - hello: string; - code: string; - ui: { - wizard: { - previousStep: string; - nextStep: string; - save: string; - submit: string; - }; - linkMenu: { - title: string; - placeholder: string; - sure: string; - cancel: string; - }; - todoList: { - add: string; - placeholder: string; - }; - alert: { - error: string; - info: string; - success: string; - title: string; - warning: string; - }; - amount: { - currency: string; - amount: string; - date: string; - }; - base: { - all: string; - cancel: string; - confirm: string; - more: string; - reset: string; - }; - button: { - cancel: string; - confirm: string; - }; - cascader: { - noMatch: string; - loading: string; - placeholder: string; - noData: string; - }; - chart: { - auxiliary: string; - emptyText: string; - kName: string; - other: string; - summation: string; - total: string; - value: string; - }; - creditCardForm: { - submit: string; - }; - crop: { - cropImage: string; - croppedImage: string; - }; - datepicker: { - clear: string; - cancel: string; - endDate: string; - confirm: string; - month: string; - endTime: string; - month2: string; - month1: string; - month4: string; - month3: string; - month6: string; - month5: string; - month8: string; - month7: string; - month10: string; - month9: string; - month12: string; - month11: string; - months: { - feb: string; - jan: string; - apr: string; - mar: string; - jun: string; - may: string; - aug: string; - jul: string; - oct: string; - sep: string; - dec: string; - nov: string; - }; - nextYear: string; - nextMonth: string; - prevMonth: string; - now: string; - selectDate: string; - prevYear: string; - startDate: string; - selectTime: string; - today: string; - currentMonth: string; - startTime: string; - week: string; - weeks: { - mon: string; - sun: string; - wed: string; - tue: string; - fri: string; - thu: string; - sat: string; - }; - timezone: string; - year: string; - }; - calendar: { - showType: { - year: string; - }; - }; - dept: { - code: string; - company: string; - dept1: string; - dept2: string; - dept3: string; - dept4: string; - dept5: string; - dept6: string; - dept7: string; - dept8: string; - input: string; - name: string; - search: string; - selected: string; - }; - detailpage: { - saveButtonText: string; - cancelButtonText: string; - localTips: string; - localTitle: string; - valueTitle: string; - labelTitle: string; - dialogTitle: string; - }; - dialogBox: { - confirm: string; - cancel: string; - }; - exception: { - build: string; - busy: string; - noperm: string; - weaknet: string; - pcview: string; - nodata: string; - create: string; - provide: string; - }; - fileUpload: { - largefile: string; - folder: string; - init: string; - exceed: string; - largeFile: string; - fileSize: string; - deleteTip: string; - downloadFile: string; - previewFile: string; - updateFile: string; - deleteFile: string; - empty: string; - }; - grid: { - dataUnchanged: string; - deleteSelectRecord: string; - emptyText: string; - error: { - cellEditRender: string; - delGetAllRecords: string; - delGetRecords: string; - delLabel: string; - delProp: string; - delRevert: string; - groupFixed: string; - notDelete: string; - notMouse: string; - notQuery: string; - notResizable: string; - notSave: string; - reqModule: string; - rowIdEmpty: string; - scrollOriginal: string; - scrollYHeight: string; - toolbarId: string; - treeFixedExpand: string; - treeInsert: string; - treeRemove: string; - unableInsert: string; - dargSelf: string; - dargFixed: string; - remoteMethod: string; - remoteSelectedMethod: string; - }; - filter: { - allFilter: string; - clear: string; - clearAll: string; - confirmFilter: string; - empty: string; - emptyText: string; - equal: string; - include: string; - prefix: string; - resetFilter: string; - unempty: string; - }; - individuation: { - cancelBtn: string; - colConfigs: { - visible: string; - invisible: string; - asc: string; - desc: string; - unsorted: string; - frozenLeft: string; - frozenRight: string; - unfrozen: string; - }; - hideMsg: string; - resetBtn: string; - saveBtn: string; - tabs: { - base: { - title: string; - tips: string; - }; - other: { - title: string; - tips: string; - sortType: string; - currPageSort: string; - allDataSort: string; - pageSize: string; - }; - }; - title: string; - switchtitle: string; - switchsave: string; - switchlabel: string; - switchapply: string; - switchedit: string; - switchdel: string; - switchconfirm: string; - switchonlytemp: string; - switchtempapply: string; - switchtempoverwrite: string; - switchdelcon: string; - switchdelyes: string; - switchdelno: string; - switchapplycon: string; - }; - removeSelectRecord: string; - saveSuccess: string; - selectOneRecord: string; - isSaveMsg: string; - }; - hrapprover: { - approver: string; - noselected: string; - noapprover: string; - remark: string; - }; - imageViewer: { - loadErrorAlt: string; - }; - navMenu: { - moreText: string; - }; - logout: { - in: string; - out: string; - }; - page: { - goto: string; - item: string; - next: string; - page: string; - pageClassifier: string; - pagesize: string; - prev: string; - total: string; - }; - popeditor: { - cancel: string; - confirm: string; - historyLists: string; - reset: string; - search: string; - selectionLists: string; - sourceLists: string; - title: string; - filterNode: string; - }; - popupload: { - fileName: string; - fileSize: string; - fileStatus: string; - uploadError: string; - dialogTitle: string; - cancelButtonText: string; - tipsFileText: string; - saveButtonText: string; - uploadSuccess: string; - uploadButtonText: string; - uploadsButtonText: string; - errorTypeTips: string; - errorNumTips: string; - errorSizeTips: string; - limitUploadFileNumber: string; - limitUploadFileType: string; - limitUploadFileSize: string; - }; - rate: { - level: { - average: string; - excellent: string; - fair: string; - good: string; - poor: string; - }; - }; - select: { - loading: string; - noMatch: string; - noData: string; - placeholder: string; - }; - search: { - placeholder: string; - }; - tabs: { - moreItem: string; - }; - tag: { - add: string; - }; - toggleMenu: { - placeholder: string; - }; - treeMenu: { - placeholder: string; - }; - transfer: { - filterPlaceholder: string; - hasCheckedFormat: string; - noCheckedFormat: string; - noData: string; - noMatch: string; - titles: string[]; - }; - tree: { - emptyText: string; - }; - usercard: { - address: string; - collapse: string; - department: string; - email: string; - employeeId: string; - expand: string; - fax: string; - internal: string; - manager: string; - mobile: string; - other: string; - phone: string; - timezone: string; - title: string; - travelcode: string; - viop: string; - zipcode: string; - }; - richText: { - bold: string; - italic: string; - underline: string; - header: string; - strike: string; - blockquote: string; - codeBlock: string; - size: string; - listOrdered: string; - listBullet: string; - header1: string; - header2: string; - align: string; - color: string; - background: string; - image: string; - video: string; - link: string; - formula: string; - clean: string; - indent1: string; - indent2: string; - pickerLabel: string; - headerPicker1: string; - headerPicker2: string; - headerPicker3: string; - headerPicker4: string; - headerPicker5: string; - headerPicker6: string; - normal: string; - sizeSmall: string; - sizeLarge: string; - sizeHuge: string; - alignPicker1: string; - alignPicker2: string; - alignPicker3: string; - alignPicker4: string; - subScript: string; - superScript: string; - directionRTL: string; - font: string; - file: string; - betterTable: string; - insertColumnRight: string; - insertColumnLeft: string; - insertRowUp: string; - insertRowDown: string; - mergeCells: string; - unmergeCells: string; - deleteColumn: string; - deleteRow: string; - deleteTable: string; - colorPicker: string; - placeholder: string; - }; - steps: { - done: string; - doing: string; - wait: string; - }; - actionSheet: { - cancel: string; - }; - image: { - loadFail: string; - }; - miniPicker: { - cancel: string; - confirm: string; - }; - pullRefresh: { - pulling: string; - loosing: string; - }; - }; - validation: { - array: { - len: string; - min: string; - max: string; - range: string; - }; - date: { - format: string; - invalid: string; - parse: string; - }; - default: string; - enum: string; - number: { - len: string; - min: string; - max: string; - range: string; - }; - pattern: { - mismatch: string; - }; - required: string; - string: { - len: string; - min: string; - max: string; - range: string; - }; - types: { - acceptFile: string; - acceptImg: string; - array: string; - boolean: string; - date: string; - dateTime: string; - dateYM: string; - dateYMD: string; - digits: string; - email: string; - fileSize: string; - float: string; - hex: string; - integer: string; - longDateTime: string; - method: string; - number: string; - object: string; - regexp: string; - specialch: string; - specialch2: string; - speczh: string; - string: string; - time: string; - url: string; - version: string; - }; - whitespace: string; - }; -}; -export default _default; diff --git a/typings/locale/vue2.d.ts b/typings/locale/vue2.d.ts deleted file mode 100644 index 997fccc4f..000000000 --- a/typings/locale/vue2.d.ts +++ /dev/null @@ -1,28 +0,0 @@ -import zhCN from '@opentiny/vue-locale/lang/zh-CN'; -import enUS from '@opentiny/vue-locale/lang/en'; -export declare function t(path: any, options: any): any; -export declare const use: (language: any) => any; -export declare const language: () => any; -export declare const i18n: (func: any) => any; -export declare const initI18n: ({ VueI18n, messages, i18n, merge }: { - VueI18n: any; - messages?: {} | undefined; - i18n?: {} | undefined; - merge: any; -}) => any; -export { zhCN, enUS }; -declare const _default: { - extend: any; - i18n: (func: any) => any; - initI18n: ({ VueI18n, messages, i18n, merge }: { - VueI18n: any; - messages?: {} | undefined; - i18n?: {} | undefined; - merge: any; - }) => any; - t: typeof t; - use: (language: any) => any; - enUS: any; - zhCN: any; -}; -export default _default; diff --git a/typings/locale/vue3.d.ts b/typings/locale/vue3.d.ts deleted file mode 100644 index 85878ec1d..000000000 --- a/typings/locale/vue3.d.ts +++ /dev/null @@ -1,41 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import zhCN from '@opentiny/vue-locale/lang/zh-CN'; -import enUS from '@opentiny/vue-locale/lang/en'; -export declare function t(path: any, options: any): any; -export declare const use: (l: any) => any; -export declare const language: () => any; -export declare const i18n: (fn: any) => any; -export declare const initI18n: ({ app, createI18n, messages, i18n, merge }: { - app: any; - createI18n: any; - messages?: {} | undefined; - i18n?: {} | undefined; - merge: any; -}) => any; -export { zhCN, enUS }; -declare const _default: { - use: (l: any) => any; - t: typeof t; - i18n: (fn: any) => any; - initI18n: ({ app, createI18n, messages, i18n, merge }: { - app: any; - createI18n: any; - messages?: {} | undefined; - i18n?: {} | undefined; - merge: any; - }) => any; - extend: any; - zhCN: any; - enUS: any; -}; -export default _default; diff --git a/typings/locales/index.d.ts b/typings/locales/index.d.ts deleted file mode 100644 index 48dd5179c..000000000 --- a/typings/locales/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import Locales from './src/index.vue'; -import '@opentiny/vue-theme/locales/index.css'; -export default Locales; diff --git a/typings/locales/src/index.vue.d.ts b/typings/locales/src/index.vue.d.ts deleted file mode 100644 index db0b31590..000000000 --- a/typings/locales/src/index.vue.d.ts +++ /dev/null @@ -1,44 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - local: { - type: BooleanConstructor; - default: boolean; - }; - changeLang: FunctionConstructor; - getLocale: FunctionConstructor; - getDomain: FunctionConstructor; - getCurrentLocale: FunctionConstructor; - getChangeLocaleUrl: FunctionConstructor; - fetchSsoUpdate: FunctionConstructor; - popperClass: StringConstructor; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - popperAppendToBody: boolean; - local: boolean; -}>; -export default _default; diff --git a/typings/logon-user/index.d.ts b/typings/logon-user/index.d.ts deleted file mode 100644 index 647021500..000000000 --- a/typings/logon-user/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import LogonUser from './src/index.vue'; -export default LogonUser; diff --git a/typings/logon-user/src/index.vue.d.ts b/typings/logon-user/src/index.vue.d.ts deleted file mode 100644 index 5133bdc67..000000000 --- a/typings/logon-user/src/index.vue.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - getUserInfo: FunctionConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, {}>; -export default _default; diff --git a/typings/logout/index.d.ts b/typings/logout/index.d.ts deleted file mode 100644 index 96f8bbe09..000000000 --- a/typings/logout/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import Logout from './src/index'; -import '@opentiny/vue-theme/logout/index.css'; -export default Logout; diff --git a/typings/logout/src/index.d.ts b/typings/logout/src/index.d.ts deleted file mode 100644 index 4700133f8..000000000 --- a/typings/logout/src/index.d.ts +++ /dev/null @@ -1,32 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - guestRole: { - type: StringConstructor; - default: string; - }; - getLogoutUrl: FunctionConstructor; - redirectUrl: StringConstructor; - isLocal: BooleanConstructor; - network: FunctionConstructor; - isMock: BooleanConstructor; - isGuestUser: FunctionConstructor; - showLogin: FunctionConstructor; - beforeLogout: FunctionConstructor; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - guestRole: string; - isLocal: boolean; - isMock: boolean; -}>; -export default _default; diff --git a/typings/logout/src/pc.vue.d.ts b/typings/logout/src/pc.vue.d.ts deleted file mode 100644 index f5d461606..000000000 --- a/typings/logout/src/pc.vue.d.ts +++ /dev/null @@ -1,12 +0,0 @@ -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/milestone/index.d.ts b/typings/milestone/index.d.ts deleted file mode 100644 index 457fcea1a..000000000 --- a/typings/milestone/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Milestone from './src/index'; -import '@opentiny/vue-theme/milestone/index.css'; -export default Milestone; diff --git a/typings/milestone/src/index.d.ts b/typings/milestone/src/index.d.ts deleted file mode 100644 index fb41105cc..000000000 --- a/typings/milestone/src/index.d.ts +++ /dev/null @@ -1,157 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - DEFAULT_COLOR: string; - DEFAULT_BACK_COLOR: string; - BOX_SHADOW_PX: string; - FLAG_CONTENT_CLS: string; - }; - }; - showNumber: { - type: BooleanConstructor; - default: boolean; - }; - solid: { - type: BooleanConstructor; - default: boolean; - }; - lineStyle: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - flagBefore: { - type: BooleanConstructor; - default: boolean; - }; - completedField: { - type: StringConstructor; - default: string; - }; - milestonesStatus: { - type: ObjectConstructor; - default: () => {}; - }; - statusField: { - type: StringConstructor; - default: string; - }; - nameField: { - type: StringConstructor; - default: string; - }; - flagField: { - type: StringConstructor; - default: string; - }; - flagNameField: { - type: StringConstructor; - default: string; - }; - flagContentField: { - type: StringConstructor; - default: string; - }; - flagStatusField: { - type: StringConstructor; - default: string; - }; - timeField: { - type: StringConstructor; - default: string; - }; - data: (ObjectConstructor | ArrayConstructor)[]; - space: NumberConstructor; - start: { - type: NumberConstructor; - default: number; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click" | "flag-click")[], "click" | "flag-click", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - DEFAULT_COLOR: string; - DEFAULT_BACK_COLOR: string; - BOX_SHADOW_PX: string; - FLAG_CONTENT_CLS: string; - }; - }; - showNumber: { - type: BooleanConstructor; - default: boolean; - }; - solid: { - type: BooleanConstructor; - default: boolean; - }; - lineStyle: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - flagBefore: { - type: BooleanConstructor; - default: boolean; - }; - completedField: { - type: StringConstructor; - default: string; - }; - milestonesStatus: { - type: ObjectConstructor; - default: () => {}; - }; - statusField: { - type: StringConstructor; - default: string; - }; - nameField: { - type: StringConstructor; - default: string; - }; - flagField: { - type: StringConstructor; - default: string; - }; - flagNameField: { - type: StringConstructor; - default: string; - }; - flagContentField: { - type: StringConstructor; - default: string; - }; - flagStatusField: { - type: StringConstructor; - default: string; - }; - timeField: { - type: StringConstructor; - default: string; - }; - data: (ObjectConstructor | ArrayConstructor)[]; - space: NumberConstructor; - start: { - type: NumberConstructor; - default: number; - }; -}>> & { - onClick?: ((...args: any[]) => any) | undefined; - onFlagclick?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - start: number; - solid: boolean; - lineStyle: string | number; - timeField: string; - showNumber: boolean; - flagBefore: boolean; - completedField: string; - milestonesStatus: Record; - statusField: string; - nameField: string; - flagField: string; - flagNameField: string; - flagContentField: string; - flagStatusField: string; -}>; -export default _default; diff --git a/typings/milestone/src/pc.vue.d.ts b/typings/milestone/src/pc.vue.d.ts deleted file mode 100644 index 860993a67..000000000 --- a/typings/milestone/src/pc.vue.d.ts +++ /dev/null @@ -1,17 +0,0 @@ -declare const _default: { - components: { - Tooltip: any; - IconYes: any; - }; - inheritAttrs: boolean; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/mini-picker/index.d.ts b/typings/mini-picker/index.d.ts deleted file mode 100644 index cadec1f98..000000000 --- a/typings/mini-picker/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import MiniPicker from './src/index.vue'; -import '@opentiny/vue-theme-mobile/mini-picker/index.css'; -export default MiniPicker; diff --git a/typings/mini-picker/src/index.vue.d.ts b/typings/mini-picker/src/index.vue.d.ts deleted file mode 100644 index adbc2718e..000000000 --- a/typings/mini-picker/src/index.vue.d.ts +++ /dev/null @@ -1,115 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - CHILDREN_PICKER: string; - }; - }; - columns: { - type: ArrayConstructor; - default: () => never[]; - }; - visible: { - type: BooleanConstructor; - default: boolean; - }; - title: { - type: StringConstructor; - default: string; - }; - confirmButtonText: { - type: StringConstructor; - default: () => any; - }; - cancelButtonText: { - type: StringConstructor; - default: () => any; - }; - defaultIndex: { - type: NumberConstructor; - default: number; - }; - valueKey: { - type: StringConstructor; - default: string; - }; - itemHeight: { - type: NumberConstructor; - default: number; - }; - visibleItemCount: { - type: NumberConstructor; - default: number; - }; - swipeDuration: { - type: NumberConstructor; - default: number; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - CHILDREN_PICKER: string; - }; - }; - columns: { - type: ArrayConstructor; - default: () => never[]; - }; - visible: { - type: BooleanConstructor; - default: boolean; - }; - title: { - type: StringConstructor; - default: string; - }; - confirmButtonText: { - type: StringConstructor; - default: () => any; - }; - cancelButtonText: { - type: StringConstructor; - default: () => any; - }; - defaultIndex: { - type: NumberConstructor; - default: number; - }; - valueKey: { - type: StringConstructor; - default: string; - }; - itemHeight: { - type: NumberConstructor; - default: number; - }; - visibleItemCount: { - type: NumberConstructor; - default: number; - }; - swipeDuration: { - type: NumberConstructor; - default: number; - }; -}>>, { - _constants: Record; - title: string; - visible: boolean; - valueKey: string; - columns: unknown[]; - confirmButtonText: string; - cancelButtonText: string; - defaultIndex: number; - itemHeight: number; - visibleItemCount: number; - swipeDuration: number; -}>; -export default _default; diff --git a/typings/mobile.d.ts b/typings/mobile.d.ts deleted file mode 100644 index 4af0fa5ec..000000000 --- a/typings/mobile.d.ts +++ /dev/null @@ -1,84 +0,0 @@ -import ActionSheet from '@opentiny/vue-action-sheet'; -import Alert from '@opentiny/vue-alert'; -import Avatar from '@opentiny/vue-avatar'; -import Badge from '@opentiny/vue-badge'; -import Button from '@opentiny/vue-button'; -import Checkbox from '@opentiny/vue-checkbox'; -import CheckboxGroup from '@opentiny/vue-checkbox-group'; -import DatePicker from '@opentiny/vue-date-picker'; -import DialogBox from '@opentiny/vue-dialog-box'; -import DropdownItem from '@opentiny/vue-dropdown-item'; -import DropdownMenu from '@opentiny/vue-dropdown-menu'; -import Exception from '@opentiny/vue-exception'; -import FileUpload from '@opentiny/vue-file-upload'; -import Form from '@opentiny/vue-form'; -import FormItem from '@opentiny/vue-form-item'; -import Fullscreen from '@opentiny/vue-fullscreen'; -import ImageViewer from '@opentiny/vue-image-viewer'; -import Input from '@opentiny/vue-input'; -import List from '@opentiny/vue-list'; -import MiniPicker from '@opentiny/vue-mini-picker'; -import NavBar from '@opentiny/vue-nav-bar'; -import Numeric from '@opentiny/vue-numeric'; -import PickerColumn from '@opentiny/vue-picker-column'; -import Popup from '@opentiny/vue-popup'; -import Progress from '@opentiny/vue-progress'; -import PullRefresh from '@opentiny/vue-pull-refresh'; -import Radio from '@opentiny/vue-radio'; -import Search from '@opentiny/vue-search'; -import Slider from '@opentiny/vue-slider'; -import Switch from '@opentiny/vue-switch'; -import TabItem from '@opentiny/vue-tab-item'; -import Tabbar from '@opentiny/vue-tabbar'; -import TabbarItem from '@opentiny/vue-tabbar-item'; -import TabbarItemMobile from '@opentiny/vue-tabbar-item/lib/mobile'; -import Tabs from '@opentiny/vue-tabs'; -import TimeLine from '@opentiny/vue-time-line'; -import Upload from '@opentiny/vue-upload'; -import UploadList from '@opentiny/vue-upload-list'; -export declare const install: (app: any, opts?: {}) => void; -declare const version = "3.0.0"; -export { version, ActionSheet, Alert, Avatar, Badge, Button, Checkbox, CheckboxGroup, DatePicker, DialogBox, DropdownItem, DropdownMenu, Exception, FileUpload, Form, FormItem, Fullscreen, ImageViewer, Input, List, MiniPicker, NavBar, Numeric, PickerColumn, Popup, Progress, PullRefresh, Radio, Search, Slider, Switch, TabItem, Tabbar, TabbarItem, TabbarItemMobile, Tabs, TimeLine, Upload, UploadList }; -declare const _default: { - version: string; - ActionSheet: any; - Alert: any; - Avatar: any; - Badge: any; - Button: any; - Checkbox: any; - CheckboxGroup: any; - DatePicker: any; - DialogBox: any; - DropdownItem: any; - DropdownMenu: any; - Exception: any; - FileUpload: any; - Form: any; - FormItem: any; - Fullscreen: any; - ImageViewer: any; - Input: any; - List: any; - MiniPicker: any; - NavBar: any; - Numeric: any; - PickerColumn: any; - Popup: any; - Progress: any; - PullRefresh: any; - Radio: any; - Search: any; - Slider: any; - Switch: any; - TabItem: any; - Tabbar: any; - TabbarItem: any; - TabbarItemMobile: any; - Tabs: any; - TimeLine: any; - Upload: any; - UploadList: any; - install: (app: any, opts?: {}) => void; -}; -export default _default; diff --git a/typings/modal/index.d.ts b/typings/modal/index.d.ts deleted file mode 100644 index 58a8da04f..000000000 --- a/typings/modal/index.d.ts +++ /dev/null @@ -1,7 +0,0 @@ -import TINYModal from './src/index.vue'; -import '@opentiny/vue-theme/modal/index.css'; -export declare function Modal(options: any): Promise; -export declare let alert: any; -export declare let message: any; -export declare let confirm: any; -export default TINYModal; diff --git a/typings/modal/src/index.vue.d.ts b/typings/modal/src/index.vue.d.ts deleted file mode 100644 index 8bcfbb24d..000000000 --- a/typings/modal/src/index.vue.d.ts +++ /dev/null @@ -1,215 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - MODAL_STATUS: { - INFO: string; - SUCCESS: string; - WARNING: string; - ERROR: string; - LOADING: string; - }; - NODAL_TYPE: { - ALERT: string; - CONFIRM: string; - MESSAGE: string; - }; - STATUS_MAPPING_CLASSS: { - INFO: string; - SUCCESS: string; - WARNING: string; - ERROR: string; - LOADING: string; - }; - }; - }; - animat: { - type: BooleanConstructor; - default: () => boolean; - }; - beforeClose: FunctionConstructor; - duration: { - type: (StringConstructor | NumberConstructor)[]; - default: () => number; - }; - escClosable: BooleanConstructor; - events: ObjectConstructor; - fullscreen: BooleanConstructor; - height: (StringConstructor | NumberConstructor)[]; - id: StringConstructor; - isFormReset: { - type: BooleanConstructor; - default: boolean; - }; - lockScroll: BooleanConstructor; - lockView: { - type: BooleanConstructor; - default: () => boolean; - }; - marginSize: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - mask: { - type: BooleanConstructor; - default: () => boolean; - }; - maskClosable: BooleanConstructor; - message: (StringConstructor | FunctionConstructor)[]; - minHeight: { - type: (StringConstructor | NumberConstructor)[]; - default: () => number; - }; - minWidth: { - type: (StringConstructor | NumberConstructor)[]; - default: () => number; - }; - modelValue: BooleanConstructor; - resize: BooleanConstructor; - showFooter: BooleanConstructor; - showHeader: { - type: BooleanConstructor; - default: boolean; - }; - status: { - type: (ObjectConstructor | StringConstructor)[]; - default: string; - }; - title: StringConstructor; - top: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - type: { - type: StringConstructor; - default: string; - }; - vSize: StringConstructor; - width: (StringConstructor | NumberConstructor)[]; - zIndex: (StringConstructor | NumberConstructor)[]; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("close" | "confirm" | "cancel" | "show" | "hide" | "zoom")[], "close" | "confirm" | "cancel" | "hide" | "show" | "zoom", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - MODAL_STATUS: { - INFO: string; - SUCCESS: string; - WARNING: string; - ERROR: string; - LOADING: string; - }; - NODAL_TYPE: { - ALERT: string; - CONFIRM: string; - MESSAGE: string; - }; - STATUS_MAPPING_CLASSS: { - INFO: string; - SUCCESS: string; - WARNING: string; - ERROR: string; - LOADING: string; - }; - }; - }; - animat: { - type: BooleanConstructor; - default: () => boolean; - }; - beforeClose: FunctionConstructor; - duration: { - type: (StringConstructor | NumberConstructor)[]; - default: () => number; - }; - escClosable: BooleanConstructor; - events: ObjectConstructor; - fullscreen: BooleanConstructor; - height: (StringConstructor | NumberConstructor)[]; - id: StringConstructor; - isFormReset: { - type: BooleanConstructor; - default: boolean; - }; - lockScroll: BooleanConstructor; - lockView: { - type: BooleanConstructor; - default: () => boolean; - }; - marginSize: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - mask: { - type: BooleanConstructor; - default: () => boolean; - }; - maskClosable: BooleanConstructor; - message: (StringConstructor | FunctionConstructor)[]; - minHeight: { - type: (StringConstructor | NumberConstructor)[]; - default: () => number; - }; - minWidth: { - type: (StringConstructor | NumberConstructor)[]; - default: () => number; - }; - modelValue: BooleanConstructor; - resize: BooleanConstructor; - showFooter: BooleanConstructor; - showHeader: { - type: BooleanConstructor; - default: boolean; - }; - status: { - type: (ObjectConstructor | StringConstructor)[]; - default: string; - }; - title: StringConstructor; - top: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - type: { - type: StringConstructor; - default: string; - }; - vSize: StringConstructor; - width: (StringConstructor | NumberConstructor)[]; - zIndex: (StringConstructor | NumberConstructor)[]; -}>> & { - onClose?: ((...args: any[]) => any) | undefined; - onConfirm?: ((...args: any[]) => any) | undefined; - onCancel?: ((...args: any[]) => any) | undefined; - onShow?: ((...args: any[]) => any) | undefined; - onHide?: ((...args: any[]) => any) | undefined; - onZoom?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - type: string; - mask: boolean; - modelValue: boolean; - duration: string | number; - top: string | number; - showHeader: boolean; - resize: boolean; - isFormReset: boolean; - lockScroll: boolean; - fullscreen: boolean; - status: string | Record; - animat: boolean; - escClosable: boolean; - lockView: boolean; - marginSize: string | number; - maskClosable: boolean; - minHeight: string | number; - minWidth: string | number; - showFooter: boolean; -}>; -export default _default; diff --git a/typings/month-range/index.d.ts b/typings/month-range/index.d.ts deleted file mode 100644 index 5f734c9a8..000000000 --- a/typings/month-range/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import MonthRange from './src/index.vue'; -export default MonthRange; diff --git a/typings/month-range/src/index.vue.d.ts b/typings/month-range/src/index.vue.d.ts deleted file mode 100644 index ac93e3f77..000000000 --- a/typings/month-range/src/index.vue.d.ts +++ /dev/null @@ -1,16 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - emitter: ObjectConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("pick" | "dodestroy")[], "pick" | "dodestroy", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onPick?: ((...args: any[]) => any) | undefined; - onDodestroy?: ((...args: any[]) => any) | undefined; -}, {}>; -export default _default; diff --git a/typings/month-table/index.d.ts b/typings/month-table/index.d.ts deleted file mode 100644 index dafccd8b7..000000000 --- a/typings/month-table/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import MonthTable from './src/index.vue'; -export default MonthTable; diff --git a/typings/month-table/src/index.vue.d.ts b/typings/month-table/src/index.vue.d.ts deleted file mode 100644 index df800e60c..000000000 --- a/typings/month-table/src/index.vue.d.ts +++ /dev/null @@ -1,48 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - date: {}; - disabledDate: {}; - maxDate: {}; - minDate: {}; - rangeState: { - default: () => { - endDate: null; - selecting: boolean; - }; - }; - selectionMode: { - default: string; - }; - value: {}; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("pick" | "changerange")[], "pick" | "changerange", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - endDate: null; - selecting: boolean; - }; - }; - selectionMode: { - default: string; - }; - value: {}; -}>> & { - onPick?: ((...args: any[]) => any) | undefined; - onChangerange?: ((...args: any[]) => any) | undefined; -}, { - selectionMode: string; - rangeState: { - endDate: null; - selecting: boolean; - }; -}>; -export default _default; diff --git a/typings/nav-bar/index.d.ts b/typings/nav-bar/index.d.ts deleted file mode 100644 index d838c3d0b..000000000 --- a/typings/nav-bar/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import NavBar from './src/index.vue'; -import '@opentiny/vue-theme-mobile/nav-bar/index.css'; -export default NavBar; diff --git a/typings/nav-bar/src/index.vue.d.ts b/typings/nav-bar/src/index.vue.d.ts deleted file mode 100644 index ce356a3fa..000000000 --- a/typings/nav-bar/src/index.vue.d.ts +++ /dev/null @@ -1,26 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - tiny_renderless: FunctionConstructor; - title: StringConstructor; - subTitle: StringConstructor; - fixed: BooleanConstructor; - zIndex: (StringConstructor | NumberConstructor)[]; - leftText: StringConstructor; - rightText: StringConstructor; - leftArrow: BooleanConstructor; - rightArrow: BooleanConstructor; -}, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - fixed: boolean; - leftArrow: boolean; - rightArrow: boolean; -}>; -export default _default; diff --git a/typings/nav-menu/index.d.ts b/typings/nav-menu/index.d.ts deleted file mode 100644 index 3837f10a2..000000000 --- a/typings/nav-menu/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import NavMenu from './src/index'; -import '@opentiny/vue-theme/nav-menu/index.css'; -export default NavMenu; diff --git a/typings/nav-menu/src/index.d.ts b/typings/nav-menu/src/index.d.ts deleted file mode 100644 index 6667d7804..000000000 --- a/typings/nav-menu/src/index.d.ts +++ /dev/null @@ -1,44 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - data: ArrayConstructor; - overflow: { - type: StringConstructor; - default: string; - validator(value: unknown): boolean; - }; - parentKey: StringConstructor; - beforeSkip: FunctionConstructor; - fetchMenuData: FunctionConstructor; - fields: ObjectConstructor; - prevent: { - type: BooleanConstructor; - default: boolean; - }; - allowFullUrl: { - type: BooleanConstructor; - default: boolean; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - overflow: string; - prevent: boolean; - allowFullUrl: boolean; -}>; -export default _default; diff --git a/typings/nav-menu/src/pc.vue.d.ts b/typings/nav-menu/src/pc.vue.d.ts deleted file mode 100644 index 9a87e5a33..000000000 --- a/typings/nav-menu/src/pc.vue.d.ts +++ /dev/null @@ -1,19 +0,0 @@ -declare const _default: { - props: string[]; - components: { - IconSetting: any; - IconChevronRight: any; - IconSandwichCollapse: any; - IconSandwichExpand: any; - }; - inheritAttrs: boolean; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/notify/index.d.ts b/typings/notify/index.d.ts deleted file mode 100644 index cff2bda86..000000000 --- a/typings/notify/index.d.ts +++ /dev/null @@ -1,10 +0,0 @@ -import NotifyConstructor from './src/index.vue'; -import '@opentiny/vue-theme/notify/index.css'; -import { ExtractPropTypes } from 'vue'; -type NotifyType = ExtractPropTypes; -declare const Notify: { - ({ type, ...options }?: NotifyType): any; - close(id: any, userOnClose: any): void; - closeAll(): void; -}; -export default Notify; diff --git a/typings/notify/src/index.vue.d.ts b/typings/notify/src/index.vue.d.ts deleted file mode 100644 index 560396268..000000000 --- a/typings/notify/src/index.vue.d.ts +++ /dev/null @@ -1,71 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - beforeClose: FunctionConstructor; - closeIcon: { - type: ObjectConstructor; - default: () => any; - }; - customClass: (ObjectConstructor | StringConstructor)[]; - duration: { - type: NumberConstructor; - default: number; - }; - message: (StringConstructor | FunctionConstructor)[]; - onClose: FunctionConstructor; - position: { - type: StringConstructor; - default: string; - }; - showClose: { - type: BooleanConstructor; - default: boolean; - }; - showIcon: { - type: BooleanConstructor; - default: boolean; - }; - statusIcon: ObjectConstructor; - title: (StringConstructor | FunctionConstructor)[]; - type: StringConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly any; - }; - customClass: (ObjectConstructor | StringConstructor)[]; - duration: { - type: NumberConstructor; - default: number; - }; - message: (StringConstructor | FunctionConstructor)[]; - onClose: FunctionConstructor; - position: { - type: StringConstructor; - default: string; - }; - showClose: { - type: BooleanConstructor; - default: boolean; - }; - showIcon: { - type: BooleanConstructor; - default: boolean; - }; - statusIcon: ObjectConstructor; - title: (StringConstructor | FunctionConstructor)[]; - type: StringConstructor; -}>>, { - closeIcon: Record; - duration: number; - position: string; - showClose: boolean; - showIcon: boolean; -}>; -export default _default; diff --git a/typings/numeric/index.d.ts b/typings/numeric/index.d.ts deleted file mode 100644 index f5aa2a413..000000000 --- a/typings/numeric/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Numeric from './src/index'; -export default Numeric; diff --git a/typings/numeric/src/index.d.ts b/typings/numeric/src/index.d.ts deleted file mode 100644 index 7ccb4c745..000000000 --- a/typings/numeric/src/index.d.ts +++ /dev/null @@ -1,213 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - MAX: string; - MIN: string; - VALUENOW: string; - DISABLED: string; - KEY: string; - VALUE: string; - EVENT_NAME: { - blur: string; - change: string; - }; - COMPONENT_NAME: string; - }; - }; - allowEmpty: { - type: BooleanConstructor; - default: boolean; - }; - circulate: BooleanConstructor; - controls: { - type: BooleanConstructor; - default: boolean; - }; - controlsPosition: { - type: StringConstructor; - default: string; - }; - disabled: BooleanConstructor; - format: (ObjectConstructor | StringConstructor)[]; - hideUnit: { - type: BooleanConstructor; - default: boolean; - }; - holdZero: { - type: BooleanConstructor; - default: boolean; - }; - label: StringConstructor; - max: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - min: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - modelTruncation: { - type: BooleanConstructor; - default: boolean; - }; - modelValue: {}; - mouseWheel: BooleanConstructor; - name: StringConstructor; - placeholder: StringConstructor; - plugin: FunctionConstructor; - precision: { - type: NumberConstructor; - validator(val: unknown): boolean; - }; - size: StringConstructor; - step: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - stepStrictly: { - type: BooleanConstructor; - default: boolean; - }; - strictInput: { - type: BooleanConstructor; - default: boolean; - }; - stringMode: BooleanConstructor; - tabindex: { - type: StringConstructor; - default: string; - }; - theme: { - type: StringConstructor; - default: string; - }; - unit: StringConstructor; - unitCenter: { - type: BooleanConstructor; - default: boolean; - }; - validateEvent: { - type: BooleanConstructor; - default: boolean; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "focus" | "blur")[], "change" | "focus" | "blur", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - MAX: string; - MIN: string; - VALUENOW: string; - DISABLED: string; - KEY: string; - VALUE: string; - EVENT_NAME: { - blur: string; - change: string; - }; - COMPONENT_NAME: string; - }; - }; - allowEmpty: { - type: BooleanConstructor; - default: boolean; - }; - circulate: BooleanConstructor; - controls: { - type: BooleanConstructor; - default: boolean; - }; - controlsPosition: { - type: StringConstructor; - default: string; - }; - disabled: BooleanConstructor; - format: (ObjectConstructor | StringConstructor)[]; - hideUnit: { - type: BooleanConstructor; - default: boolean; - }; - holdZero: { - type: BooleanConstructor; - default: boolean; - }; - label: StringConstructor; - max: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - min: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - modelTruncation: { - type: BooleanConstructor; - default: boolean; - }; - modelValue: {}; - mouseWheel: BooleanConstructor; - name: StringConstructor; - placeholder: StringConstructor; - plugin: FunctionConstructor; - precision: { - type: NumberConstructor; - validator(val: unknown): boolean; - }; - size: StringConstructor; - step: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - stepStrictly: { - type: BooleanConstructor; - default: boolean; - }; - strictInput: { - type: BooleanConstructor; - default: boolean; - }; - stringMode: BooleanConstructor; - tabindex: { - type: StringConstructor; - default: string; - }; - theme: { - type: StringConstructor; - default: string; - }; - unit: StringConstructor; - unitCenter: { - type: BooleanConstructor; - default: boolean; - }; - validateEvent: { - type: BooleanConstructor; - default: boolean; - }; -}>> & { - onFocus?: ((...args: any[]) => any) | undefined; - onBlur?: ((...args: any[]) => any) | undefined; - onChange?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - tabindex: string; - disabled: boolean; - holdZero: boolean; - modelTruncation: boolean; - strictInput: boolean; - max: string | number; - theme: string; - controls: boolean; - validateEvent: boolean; - min: string | number; - step: string | number; - stepStrictly: boolean; - controlsPosition: string; - circulate: boolean; - mouseWheel: boolean; - allowEmpty: boolean; - stringMode: boolean; - hideUnit: boolean; - unitCenter: boolean; -}>; -export default _default; diff --git a/typings/numeric/src/mobile.vue.d.ts b/typings/numeric/src/mobile.vue.d.ts deleted file mode 100644 index d4a833071..000000000 --- a/typings/numeric/src/mobile.vue.d.ts +++ /dev/null @@ -1,21 +0,0 @@ -import '@opentiny/vue-theme-mobile/numeric/index.css'; -declare const _default: { - directives: any; - components: { - IconChevronDown: any; - IconChevronUp: any; - IconMinus: any; - IconPlus: any; - }; - props: string[]; - emits: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/numeric/src/pc.vue.d.ts b/typings/numeric/src/pc.vue.d.ts deleted file mode 100644 index b8d53039a..000000000 --- a/typings/numeric/src/pc.vue.d.ts +++ /dev/null @@ -1,21 +0,0 @@ -import '@opentiny/vue-theme/numeric/index.css'; -declare const _default: { - directives: any; - components: { - IconChevronDown: any; - IconChevronUp: any; - IconMinus: any; - IconPlus: any; - }; - props: string[]; - emits: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/option-group/index.d.ts b/typings/option-group/index.d.ts deleted file mode 100644 index 2344a7e60..000000000 --- a/typings/option-group/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import OptionGroup from './src/index.vue'; -import '@opentiny/vue-theme/option-group/index.css'; -export default OptionGroup; diff --git a/typings/option-group/src/index.vue.d.ts b/typings/option-group/src/index.vue.d.ts deleted file mode 100644 index 185e27d94..000000000 --- a/typings/option-group/src/index.vue.d.ts +++ /dev/null @@ -1,23 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - label: StringConstructor; - disabled: { - type: BooleanConstructor; - default: boolean; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - disabled: boolean; -}>; -export default _default; diff --git a/typings/option/index.d.ts b/typings/option/index.d.ts deleted file mode 100644 index bbd549967..000000000 --- a/typings/option/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Option from './src/index.vue'; -import '@opentiny/vue-theme/option/index.css'; -export default Option; diff --git a/typings/option/src/index.vue.d.ts b/typings/option/src/index.vue.d.ts deleted file mode 100644 index ced0414d9..000000000 --- a/typings/option/src/index.vue.d.ts +++ /dev/null @@ -1,52 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - value: { - required: true; - }; - label: (StringConstructor | NumberConstructor)[]; - created: BooleanConstructor; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - events: { - type: ObjectConstructor; - default: () => {}; - }; - visible: { - type: BooleanConstructor; - default: boolean; - }; - highlightClass: StringConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly {}; - }; - visible: { - type: BooleanConstructor; - default: boolean; - }; - highlightClass: StringConstructor; -}>>, { - visible: boolean; - disabled: boolean; - events: Record; - created: boolean; -}>; -export default _default; diff --git a/typings/pager-item/index.d.ts b/typings/pager-item/index.d.ts deleted file mode 100644 index fbaeae094..000000000 --- a/typings/pager-item/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import PagerItem from './src/index.vue'; -export default PagerItem; diff --git a/typings/pager-item/src/index.vue.d.ts b/typings/pager-item/src/index.vue.d.ts deleted file mode 100644 index 48279915a..000000000 --- a/typings/pager-item/src/index.vue.d.ts +++ /dev/null @@ -1,57 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - disabled: { - type: BooleanConstructor; - default: boolean; - }; - currentPage: NumberConstructor; - pageCount: NumberConstructor; - pagerCount: NumberConstructor; - popupIcon: { - type: ObjectConstructor; - default: () => any; - }; - doubleLeftIcon: { - type: ObjectConstructor; - default: () => any; - }; - doubleRightIcon: { - type: ObjectConstructor; - default: () => any; - }; - isBeforePageChange: BooleanConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly any; - }; - doubleLeftIcon: { - type: ObjectConstructor; - default: () => any; - }; - doubleRightIcon: { - type: ObjectConstructor; - default: () => any; - }; - isBeforePageChange: BooleanConstructor; -}>>, { - disabled: boolean; - isBeforePageChange: boolean; - popupIcon: Record; - doubleLeftIcon: Record; - doubleRightIcon: Record; -}>; -export default _default; diff --git a/typings/pager/index.d.ts b/typings/pager/index.d.ts deleted file mode 100644 index 48d2f1f27..000000000 --- a/typings/pager/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Pager from './src/index.vue'; -import '@opentiny/vue-theme/pager/index.css'; -export default Pager; diff --git a/typings/pager/src/index.vue.d.ts b/typings/pager/src/index.vue.d.ts deleted file mode 100644 index d2c7c85ad..000000000 --- a/typings/pager/src/index.vue.d.ts +++ /dev/null @@ -1,118 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - pageSize: { - type: NumberConstructor; - default: number; - }; - total: NumberConstructor; - pageCount: NumberConstructor; - pagerCount: { - type: NumberConstructor; - validator(value: unknown): boolean; - default: number; - }; - currentPage: { - type: NumberConstructor; - default: number; - }; - layout: StringConstructor; - pageSizes: { - type: ArrayConstructor; - default(): number[]; - }; - prevText: StringConstructor; - nextText: StringConstructor; - hideOnSinglePage: BooleanConstructor; - mode: StringConstructor; - appendToBody: { - type: BooleanConstructor; - default: boolean; - }; - isBeforePageChange: BooleanConstructor; - popperClass: StringConstructor; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - disabled: { - type: BooleanConstructor; - default: boolean; - }; -}, unknown, { - internalCurrentPage: number; - internalPageSize: number; - lastEmittedPage: number; - userChangePageSize: boolean; - internalTotal: number | undefined; -}, { - internalPageCount(): number | null; - internalLayout(): string; -}, { - beforeSizeChangeHandler(params: any): void; - beforePagerChangeHandler(params: any): void; - beforeJumperChangeHandler(params: any): void; - copyEmit(...args: any[]): void; - beforeChangeHandler(val?: number): any; - handleCurrentChange(val: any): false | undefined; - prev(): void; - next(): void; - buildBeforePageChangeParam(param: any): any; - getValidCurrentPage(val: any): any; - emitChange(): void; - setTotal(val: any): void; -}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("before-page-change" | "size-change" | "current-change" | "prev-click" | "next-click")[], "before-page-change" | "size-change" | "current-change" | "prev-click" | "next-click", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - "onBefore-page-change"?: ((...args: any[]) => any) | undefined; - "onSize-change"?: ((...args: any[]) => any) | undefined; - "onCurrent-change"?: ((...args: any[]) => any) | undefined; - "onPrev-click"?: ((...args: any[]) => any) | undefined; - "onNext-click"?: ((...args: any[]) => any) | undefined; -}, { - disabled: boolean; - popperAppendToBody: boolean; - appendToBody: boolean; - pageSizes: unknown[]; - isBeforePageChange: boolean; - currentPage: number; - pageSize: number; - pagerCount: number; - hideOnSinglePage: boolean; -}>; -export default _default; diff --git a/typings/panel/index.d.ts b/typings/panel/index.d.ts deleted file mode 100644 index e17691cdd..000000000 --- a/typings/panel/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Panel from './src/index'; -export default Panel; diff --git a/typings/panel/src/index.d.ts b/typings/panel/src/index.d.ts deleted file mode 100644 index 12863766e..000000000 --- a/typings/panel/src/index.d.ts +++ /dev/null @@ -1,67 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - expand: { - type: BooleanConstructor; - default: boolean; - }; - foot: { - type: StringConstructor; - }; - head: { - type: StringConstructor; - }; - iconOpen: { - type: StringConstructor; - default: string; - }; - iconClose: { - type: StringConstructor; - default: string; - }; - isToggle: { - type: BooleanConstructor; - default: boolean; - }; - transition: { - type: StringConstructor; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("expand" | "collapse" | "beforeCollapse" | "beforeExpand")[], "expand" | "collapse" | "beforeCollapse" | "beforeExpand", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onExpand?: ((...args: any[]) => any) | undefined; - onCollapse?: ((...args: any[]) => any) | undefined; - onBeforeCollapse?: ((...args: any[]) => any) | undefined; - onBeforeExpand?: ((...args: any[]) => any) | undefined; -}, { - transition: string; - iconClose: string; - expand: boolean; - iconOpen: string; - isToggle: boolean; -}>; -export default _default; diff --git a/typings/panel/src/pc.vue.d.ts b/typings/panel/src/pc.vue.d.ts deleted file mode 100644 index 2e1bd7aa4..000000000 --- a/typings/panel/src/pc.vue.d.ts +++ /dev/null @@ -1,16 +0,0 @@ -declare const _default: { - components: { - IconChevronDown: any; - IconChevronRight: any; - }; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/pc.d.ts b/typings/pc.d.ts deleted file mode 100644 index 712f13ffa..000000000 --- a/typings/pc.d.ts +++ /dev/null @@ -1,463 +0,0 @@ -import Alert from '@opentiny/vue-alert' -import Amount from '@opentiny/vue-amount' -import Area from '@opentiny/vue-area' -import Autocomplete from '@opentiny/vue-autocomplete' -import AutonaviMap from '@opentiny/vue-autonavi-map' -import Badge from '@opentiny/vue-badge' -import BaiduMap from '@opentiny/vue-baidu-map' -import Breadcrumb from '@opentiny/vue-breadcrumb' -import BreadcrumbItem from '@opentiny/vue-breadcrumb-item' -import BulletinBoard from '@opentiny/vue-bulletin-board' -import Button from '@opentiny/vue-button' -import ButtonGroup from '@opentiny/vue-button-group' -import Calendar from '@opentiny/vue-calendar' -import CardTemplate from '@opentiny/vue-card-template' -import Carousel from '@opentiny/vue-carousel' -import CarouselItem from '@opentiny/vue-carousel-item' -import Cascader from '@opentiny/vue-cascader' -import CascaderMenu from '@opentiny/vue-cascader-menu' -import CascaderNode from '@opentiny/vue-cascader-node' -import CascaderPanel from '@opentiny/vue-cascader-panel' -import Chart from '@opentiny/vue-chart' -import ChartBar from '@opentiny/vue-chart-bar' -import ChartBoxplot from '@opentiny/vue-chart-boxplot' -import ChartCandle from '@opentiny/vue-chart-candle' -import ChartCore from '@opentiny/vue-chart-core' -import ChartFunnel from '@opentiny/vue-chart-funnel' -import ChartGauge from '@opentiny/vue-chart-gauge' -import ChartGraph from '@opentiny/vue-chart-graph' -import ChartHeatmap from '@opentiny/vue-chart-heatmap' -import ChartHistogram from '@opentiny/vue-chart-histogram' -import ChartLine from '@opentiny/vue-chart-line' -import ChartLiquidfill from '@opentiny/vue-chart-liquidfill' -import ChartMap from '@opentiny/vue-chart-map' -import ChartPie from '@opentiny/vue-chart-pie' -import ChartRadar from '@opentiny/vue-chart-radar' -import ChartRing from '@opentiny/vue-chart-ring' -import ChartSankey from '@opentiny/vue-chart-sankey' -import ChartScatter from '@opentiny/vue-chart-scatter' -import ChartSunburst from '@opentiny/vue-chart-sunburst' -import ChartTree from '@opentiny/vue-chart-tree' -import ChartWaterfall from '@opentiny/vue-chart-waterfall' -import ChartWordcloud from '@opentiny/vue-chart-wordcloud' -import Checkbox from '@opentiny/vue-checkbox' -import CheckboxButton from '@opentiny/vue-checkbox-button' -import CheckboxGroup from '@opentiny/vue-checkbox-group' -import Col from '@opentiny/vue-col' -import Collapse from '@opentiny/vue-collapse' -import CollapseItem from '@opentiny/vue-collapse-item' -import CollapseTransition from '@opentiny/vue-collapse-transition' -import Company from '@opentiny/vue-company' -import Container from '@opentiny/vue-container' -import Country from '@opentiny/vue-country' -import CreditCard from '@opentiny/vue-credit-card' -import CreditCardForm from '@opentiny/vue-credit-card-form' -import Crop from '@opentiny/vue-crop' -import Currency from '@opentiny/vue-currency' -import DatePanel from '@opentiny/vue-date-panel' -import DatePicker from '@opentiny/vue-date-picker' -import DateRange from '@opentiny/vue-date-range' -import DateTable from '@opentiny/vue-date-table' -import Dept from '@opentiny/vue-dept' -import DetailPage from '@opentiny/vue-detail-page' -import DialogBox from '@opentiny/vue-dialog-box' -import DropRoles from '@opentiny/vue-drop-roles' -import DropTimes from '@opentiny/vue-drop-times' -import Dropdown from '@opentiny/vue-dropdown' -import Espace from '@opentiny/vue-espace' -import FallMenu from '@opentiny/vue-fall-menu' -import FileUpload from '@opentiny/vue-file-upload' -import Floatbar from '@opentiny/vue-floatbar' -import Form from '@opentiny/vue-form' -import FormItem from '@opentiny/vue-form-item' -import Fullscreen from '@opentiny/vue-fullscreen' -import Grid from '@opentiny/vue-grid' -import GridColumn from '@opentiny/vue-grid-column' -import GridManager from '@opentiny/vue-grid-manager' -import GridToolbar from '@opentiny/vue-grid-toolbar' -import Hrapprover from '@opentiny/vue-hrapprover' -import Image from '@opentiny/vue-image' -import ImageViewer from '@opentiny/vue-image-viewer' -import Input from '@opentiny/vue-input' -import IpAddress from '@opentiny/vue-ip-address' -import Layout from '@opentiny/vue-layout' -import Link from '@opentiny/vue-link' -import LinkMenu from '@opentiny/vue-link-menu' -import Loading from '@opentiny/vue-loading' -import Locales from '@opentiny/vue-locales' -import LogonUser from '@opentiny/vue-logon-user' -import Logout from '@opentiny/vue-logout' -import Milestone from '@opentiny/vue-milestone' -import Modal from '@opentiny/vue-modal' -import MonthRange from '@opentiny/vue-month-range' -import MonthTable from '@opentiny/vue-month-table' -import NavMenu from '@opentiny/vue-nav-menu' -import Notify from '@opentiny/vue-notify' -import Numeric from '@opentiny/vue-numeric' -import Option from '@opentiny/vue-option' -import OptionGroup from '@opentiny/vue-option-group' -import Pager from '@opentiny/vue-pager' -import PagerItem from '@opentiny/vue-pager-item' -import Picker from '@opentiny/vue-picker' -import PopUpload from '@opentiny/vue-pop-upload' -import Popeditor from '@opentiny/vue-popeditor' -import Popover from '@opentiny/vue-popover' -import Progress from '@opentiny/vue-progress' -import Radio from '@opentiny/vue-radio' -import RadioButton from '@opentiny/vue-radio-button' -import RadioGroup from '@opentiny/vue-radio-group' -import Rate from '@opentiny/vue-rate' -import Roles from '@opentiny/vue-roles' -import Row from '@opentiny/vue-row' -import ScrollText from '@opentiny/vue-scroll-text' -import Scrollbar from '@opentiny/vue-scrollbar' -import Search from '@opentiny/vue-search' -import Select from '@opentiny/vue-select' -import SelectDropdown from '@opentiny/vue-select-dropdown' -import SlideBar from '@opentiny/vue-slide-bar' -import Slider from '@opentiny/vue-slider' -import Split from '@opentiny/vue-split' -import Steps from '@opentiny/vue-steps' -import SvgIcon from '@opentiny/vue-svg-icon' -import Switch from '@opentiny/vue-switch' -import TabItem from '@opentiny/vue-tab-item' -import Table from '@opentiny/vue-table' -import Tabs from '@opentiny/vue-tabs' -import Tag from '@opentiny/vue-tag' -import TextPopup from '@opentiny/vue-text-popup' -import Time from '@opentiny/vue-time' -import TimeLine from '@opentiny/vue-time-line' -import TimePanel from '@opentiny/vue-time-panel' -import TimePicker from '@opentiny/vue-time-picker' -import TimeRange from '@opentiny/vue-time-range' -import TimeSelect from '@opentiny/vue-time-select' -import TimeSpinner from '@opentiny/vue-time-spinner' -import ToggleMenu from '@opentiny/vue-toggle-menu' -import Tooltip from '@opentiny/vue-tooltip' -import TopBox from '@opentiny/vue-top-box' -import Transfer from '@opentiny/vue-transfer' -import TransferPanel from '@opentiny/vue-transfer-panel' -import Tree from '@opentiny/vue-tree' -import TreeMenu from '@opentiny/vue-tree-menu' -import Upload from '@opentiny/vue-upload' -import UploadDragger from '@opentiny/vue-upload-dragger' -import UploadList from '@opentiny/vue-upload-list' -import User from '@opentiny/vue-user' -import UserAccount from '@opentiny/vue-user-account' -import UserContact from '@opentiny/vue-user-contact' -import UserHead from '@opentiny/vue-user-head' -import UserLink from '@opentiny/vue-user-link' -import Wizard from '@opentiny/vue-wizard' -import YearTable from '@opentiny/vue-year-table' -export declare const install: (app: any, opts?: {}) => void -declare const version = '3.0.0' -export { - version, - Alert, - Amount, - Area, - Autocomplete, - AutonaviMap, - Badge, - BaiduMap, - Breadcrumb, - BreadcrumbItem, - BulletinBoard, - Button, - ButtonGroup, - Calendar, - CardTemplate, - Carousel, - CarouselItem, - Cascader, - CascaderMenu, - CascaderNode, - CascaderPanel, - Chart, - ChartBar, - ChartBoxplot, - ChartCandle, - ChartCore, - ChartFunnel, - ChartGauge, - ChartGraph, - ChartHeatmap, - ChartHistogram, - ChartLine, - ChartLiquidfill, - ChartMap, - ChartPie, - ChartRadar, - ChartRing, - ChartSankey, - ChartScatter, - ChartSunburst, - ChartTree, - ChartWaterfall, - ChartWordcloud, - Checkbox, - CheckboxButton, - CheckboxGroup, - Col, - Collapse, - CollapseItem, - CollapseTransition, - Company, - Container, - Country, - CreditCard, - CreditCardForm, - Crop, - Currency, - DatePanel, - DatePicker, - DateRange, - DateTable, - Dept, - DetailPage, - DialogBox, - DropRoles, - DropTimes, - Dropdown, - Espace, - FallMenu, - FileUpload, - Floatbar, - Form, - FormItem, - Fullscreen, - Grid, - GridColumn, - GridManager, - GridToolbar, - Hrapprover, - Image, - ImageViewer, - Input, - IpAddress, - Layout, - Link, - LinkMenu, - Loading, - Locales, - LogonUser, - Logout, - Milestone, - Modal, - MonthRange, - MonthTable, - NavMenu, - Notify, - Numeric, - Option, - OptionGroup, - Pager, - PagerItem, - Picker, - PopUpload, - Popeditor, - Popover, - Progress, - Radio, - RadioButton, - RadioGroup, - Rate, - Roles, - Row, - ScrollText, - Scrollbar, - Search, - Select, - SelectDropdown, - SlideBar, - Slider, - Split, - Steps, - SvgIcon, - Switch, - TabItem, - Table, - Tabs, - Tag, - TextPopup, - Time, - TimeLine, - TimePanel, - TimePicker, - TimeRange, - TimeSelect, - TimeSpinner, - ToggleMenu, - Tooltip, - TopBox, - Transfer, - TransferPanel, - Tree, - TreeMenu, - Upload, - UploadDragger, - UploadList, - User, - UserAccount, - UserContact, - UserHead, - UserLink, - Wizard, - YearTable -} -declare const _default: { - version: string - Alert: any - Amount: any - Area: any - Autocomplete: any - AutonaviMap: any - Badge: any - BaiduMap: any - Breadcrumb: any - BreadcrumbItem: any - BulletinBoard: any - Button: any - ButtonGroup: any - Calendar: any - CardTemplate: any - Carousel: any - CarouselItem: any - Cascader: any - CascaderMenu: any - CascaderNode: any - CascaderPanel: any - Chart: any - ChartBar: any - ChartBoxplot: any - ChartCandle: any - ChartCore: any - ChartFunnel: any - ChartGauge: any - ChartGraph: any - ChartHeatmap: any - ChartHistogram: any - ChartLine: any - ChartLiquidfill: any - ChartMap: any - ChartPie: any - ChartRadar: any - ChartRing: any - ChartSankey: any - ChartScatter: any - ChartSunburst: any - ChartTree: any - ChartWaterfall: any - ChartWordcloud: any - Checkbox: any - CheckboxButton: any - CheckboxGroup: any - Col: any - Collapse: any - CollapseItem: any - CollapseTransition: any - Company: any - Container: any - Country: any - CreditCard: any - CreditCardForm: any - Crop: any - Currency: any - DatePanel: any - DatePicker: any - DateRange: any - DateTable: any - Dept: any - DetailPage: any - DialogBox: any - DropRoles: any - DropTimes: any - Dropdown: any - Espace: any - FallMenu: any - FileUpload: any - Floatbar: any - Form: any - FormItem: any - Fullscreen: any - Grid: any - GridColumn: any - GridManager: any - GridToolbar: any - Hrapprover: any - Image: any - ImageViewer: any - Input: any - IpAddress: any - Layout: any - Link: any - LinkMenu: any - Loading: any - Locales: any - LogonUser: any - Logout: any - Milestone: any - Modal: any - MonthRange: any - MonthTable: any - NavMenu: any - Notify: any - Numeric: any - Option: any - OptionGroup: any - Pager: any - PagerItem: any - Picker: any - PopUpload: any - Popeditor: any - Popover: any - Progress: any - Radio: any - RadioButton: any - RadioGroup: any - Rate: any - Roles: any - Row: any - ScrollText: any - Scrollbar: any - Search: any - Select: any - SelectDropdown: any - SlideBar: any - Slider: any - Split: any - Steps: any - SvgIcon: any - Switch: any - TabItem: any - Table: any - Tabs: any - Tag: any - TextPopup: any - Time: any - TimeLine: any - TimePanel: any - TimePicker: any - TimeRange: any - TimeSelect: any - TimeSpinner: any - ToggleMenu: any - Tooltip: any - TopBox: any - Transfer: any - TransferPanel: any - Tree: any - TreeMenu: any - Upload: any - UploadDragger: any - UploadList: any - User: any - UserAccount: any - UserContact: any - UserHead: any - UserLink: any - Wizard: any - YearTable: any - install: (app: any, opts?: {}) => void -} -export default _default diff --git a/typings/picker-column/index.d.ts b/typings/picker-column/index.d.ts deleted file mode 100644 index 6a32ca0e3..000000000 --- a/typings/picker-column/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import PickerColumn from './src/index.vue'; -import '@opentiny/vue-theme-mobile/picker-column/index.css'; -export default PickerColumn; diff --git a/typings/picker-column/src/index.vue.d.ts b/typings/picker-column/src/index.vue.d.ts deleted file mode 100644 index e2a6254ef..000000000 --- a/typings/picker-column/src/index.vue.d.ts +++ /dev/null @@ -1,33 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - columnsItem: { - type: ObjectConstructor; - default: () => {}; - }; - defaultIndex: NumberConstructor; - itemHeight: NumberConstructor; - visibleItemCount: NumberConstructor; - swipeDuration: NumberConstructor; - valueKey: StringConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "change"[], "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly {}; - }; - defaultIndex: NumberConstructor; - itemHeight: NumberConstructor; - visibleItemCount: NumberConstructor; - swipeDuration: NumberConstructor; - valueKey: StringConstructor; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; -}, { - columnsItem: Record; -}>; -export default _default; diff --git a/typings/picker/index.d.ts b/typings/picker/index.d.ts deleted file mode 100644 index 8e8d7c30b..000000000 --- a/typings/picker/index.d.ts +++ /dev/null @@ -1,15 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Picker from './src/index.vue'; -import '@opentiny/vue-theme/picker/index.css'; -import '@opentiny/vue-theme/input/index.css'; -export default Picker; diff --git a/typings/picker/src/index.vue.d.ts b/typings/picker/src/index.vue.d.ts deleted file mode 100644 index 28dc0ff84..000000000 --- a/typings/picker/src/index.vue.d.ts +++ /dev/null @@ -1,193 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - type: { - type: StringConstructor; - default: string; - }; - tabindex: { - type: StringConstructor; - default: string; - }; - timeArrowControl: BooleanConstructor; - size: StringConstructor; - format: StringConstructor; - valueFormat: StringConstructor; - timeFormat: StringConstructor; - readonly: BooleanConstructor; - placeholder: StringConstructor; - startPlaceholder: StringConstructor; - endPlaceholder: StringConstructor; - prefixIcon: ObjectConstructor; - suffixIcon: ObjectConstructor; - clearIcon: { - type: ObjectConstructor; - default(): any; - }; - name: { - default: string; - validator(value: unknown): boolean; - }; - disabled: BooleanConstructor; - clearable: { - type: BooleanConstructor; - default: boolean; - }; - id: { - default: string; - validator(value: unknown): boolean; - }; - popperClass: StringConstructor; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - editable: { - type: BooleanConstructor; - default: boolean; - }; - align: { - type: StringConstructor; - default: string; - }; - modelValue: {}; - defaultValue: {}; - defaultTime: {}; - rangeSeparator: { - type: (ObjectConstructor | StringConstructor)[]; - default: string; - }; - pickerOptions: {}; - unlinkPanels: BooleanConstructor; - validateEvent: { - type: BooleanConstructor; - default: boolean; - }; - isRange: BooleanConstructor; - arrowControl: BooleanConstructor; - timezoneData: {}; - showTimezone: { - type: BooleanConstructor; - default: boolean; - }; - defaultTimezone: StringConstructor; - isutc8: { - type: BooleanConstructor; - default: boolean; - }; - dbTimezone: NumberConstructor; - timezone: NumberConstructor; - iso8601: BooleanConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "focus" | "blur" | "update:modelValue" | "select-change" | "created")[], "change" | "focus" | "blur" | "update:modelValue" | "select-change" | "created", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onFocus?: ((...args: any[]) => any) | undefined; - onBlur?: ((...args: any[]) => any) | undefined; - onChange?: ((...args: any[]) => any) | undefined; - "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined; - "onSelect-change"?: ((...args: any[]) => any) | undefined; - onCreated?: ((...args: any[]) => any) | undefined; -}, { - name: string; - type: string; - readonly: boolean; - tabindex: string; - disabled: boolean; - popperAppendToBody: boolean; - clearable: boolean; - id: string; - validateEvent: boolean; - timeArrowControl: boolean; - clearIcon: Record; - editable: boolean; - align: string; - rangeSeparator: string | Record; - unlinkPanels: boolean; - isRange: boolean; - arrowControl: boolean; - showTimezone: boolean; - isutc8: boolean; - iso8601: boolean; -}>; -export default _default; diff --git a/typings/pop-upload/index.d.ts b/typings/pop-upload/index.d.ts deleted file mode 100644 index 5cc27db03..000000000 --- a/typings/pop-upload/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import PopUpload from './src/index'; -import '@opentiny/vue-theme/pop-upload/index.css'; -export default PopUpload; diff --git a/typings/pop-upload/src/index.d.ts b/typings/pop-upload/src/index.d.ts deleted file mode 100644 index 61df98628..000000000 --- a/typings/pop-upload/src/index.d.ts +++ /dev/null @@ -1,156 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - KB: string; - FILE_NAME: string; - FILE_SIZE: string; - FILE_STATUS: string; - DIALOG_TITLE: string; - UPLOAD_ERROR: string; - ERROR_NUM_TIPS: string; - UPLOAD_SUCCESS: string; - TIPS_TITLE_TEXT: string; - ERROR_TYPE_TIPS: string; - ERROR_SIZE_TIPS: string; - SAVE_BUTTON_TEXT: string; - UPLOAD_BUTTON_TEXT: string; - CANCEL_BUTTTON_TEXT: string; - UPLOADS_BUTTON_TEXT: string; - LIMIT_UPLOAD_FILE_TYPE: string; - LIMIT_UPLOAD_FILE_SIZE: string; - LIMIT_UPLOAD_FILE_NUMBER: string; - }; - }; - size: StringConstructor; - data: ObjectConstructor; - uploadName: StringConstructor; - dialogTitle: { - type: StringConstructor; - default: string; - }; - action: { - type: StringConstructor; - default: string; - }; - uploadButtonText: { - type: StringConstructor; - default: string; - }; - headers: { - type: ObjectConstructor; - default: () => {}; - }; - withCredentials: { - type: BooleanConstructor; - default: boolean; - }; - limit: NumberConstructor; - multiple: BooleanConstructor; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - filters: { - type: ObjectConstructor; - default: () => {}; - }; - accept: StringConstructor; - submitButtonText: { - typee: StringConstructor; - default: string; - }; - cancelButtonText: { - typee: StringConstructor; - default: string; - }; - uploadFileType: ArrayConstructor; - beforeUpload: FunctionConstructor; - beforeRemove: FunctionConstructor; - maxUploadFileSize: NumberConstructor; - httpRequest: FunctionConstructor; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - KB: string; - FILE_NAME: string; - FILE_SIZE: string; - FILE_STATUS: string; - DIALOG_TITLE: string; - UPLOAD_ERROR: string; - ERROR_NUM_TIPS: string; - UPLOAD_SUCCESS: string; - TIPS_TITLE_TEXT: string; - ERROR_TYPE_TIPS: string; - ERROR_SIZE_TIPS: string; - SAVE_BUTTON_TEXT: string; - UPLOAD_BUTTON_TEXT: string; - CANCEL_BUTTTON_TEXT: string; - UPLOADS_BUTTON_TEXT: string; - LIMIT_UPLOAD_FILE_TYPE: string; - LIMIT_UPLOAD_FILE_SIZE: string; - LIMIT_UPLOAD_FILE_NUMBER: string; - }; - }; - size: StringConstructor; - data: ObjectConstructor; - uploadName: StringConstructor; - dialogTitle: { - type: StringConstructor; - default: string; - }; - action: { - type: StringConstructor; - default: string; - }; - uploadButtonText: { - type: StringConstructor; - default: string; - }; - headers: { - type: ObjectConstructor; - default: () => {}; - }; - withCredentials: { - type: BooleanConstructor; - default: boolean; - }; - limit: NumberConstructor; - multiple: BooleanConstructor; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - filters: { - type: ObjectConstructor; - default: () => {}; - }; - accept: StringConstructor; - submitButtonText: { - typee: StringConstructor; - default: string; - }; - cancelButtonText: { - typee: StringConstructor; - default: string; - }; - uploadFileType: ArrayConstructor; - beforeUpload: FunctionConstructor; - beforeRemove: FunctionConstructor; - maxUploadFileSize: NumberConstructor; - httpRequest: FunctionConstructor; -}>>, { - _constants: Record; - action: string; - disabled: boolean; - multiple: boolean; - dialogTitle: string; - headers: Record; - withCredentials: boolean; - cancelButtonText: string; - filters: Record; - uploadButtonText: string; - submitButtonText: string; -}>; -export default _default; diff --git a/typings/pop-upload/src/pc.vue.d.ts b/typings/pop-upload/src/pc.vue.d.ts deleted file mode 100644 index c19db1502..000000000 --- a/typings/pop-upload/src/pc.vue.d.ts +++ /dev/null @@ -1,19 +0,0 @@ -declare const _default: { - components: { - TinyButton: any; - TinyModal: any; - TinyAlert: any; - TinyFileUpload: any; - IconDel: any; - }; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/popeditor/index.d.ts b/typings/popeditor/index.d.ts deleted file mode 100644 index 4ef2fbf57..000000000 --- a/typings/popeditor/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Popeditor from './src/index'; -import '@opentiny/vue-theme/popeditor/index.css'; -export default Popeditor; diff --git a/typings/popeditor/src/index.d.ts b/typings/popeditor/src/index.d.ts deleted file mode 100644 index 4c4d2469f..000000000 --- a/typings/popeditor/src/index.d.ts +++ /dev/null @@ -1,374 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - TITLE: string; - COLUMNS_TYPE: { - selection: string; - radio: string; - index: string; - width: number; - }; - GRID_REF: { - history: string; - source: string; - }; - TAG_NAME: string; - MODAL_WIDTH: { - multi: number; - radio: number; - }; - ACTIVE_NAME: { - history: string; - source: string; - }; - TYPE_GRID: string; - TYPE_TREE: string; - ID: string; - LABEL: string; - }; - }; - modelValue: { - type: (ArrayConstructor | StringConstructor | NumberConstructor)[]; - default: string; - }; - tabindex: { - type: StringConstructor; - default: string; - }; - placeholder: { - type: StringConstructor; - default: string; - }; - size: StringConstructor; - trigger: { - type: StringConstructor; - default: string; - }; - icon: { - type: ObjectConstructor; - default(): any; - }; - iconSearch: { - type: ObjectConstructor; - default(): any; - }; - title: { - type: StringConstructor; - default: string; - }; - textField: { - type: StringConstructor; - default: string; - }; - textSplit: { - type: StringConstructor; - default: string; - }; - valueField: { - type: StringConstructor; - default: string; - }; - valueSplit: { - type: StringConstructor; - default: string; - }; - popseletor: { - type: StringConstructor; - default: string; - validator(value: unknown): boolean; - }; - conditions: { - type: ArrayConstructor; - default(): never[]; - }; - width: { - type: (StringConstructor | NumberConstructor)[]; - default: string; - }; - height: (StringConstructor | NumberConstructor)[]; - gridOp: { - type: ObjectConstructor; - default(): { - columns: never[]; - data: never[]; - }; - }; - remoteSearch: FunctionConstructor; - dataset: ObjectConstructor; - alwaysLoad: { - type: BooleanConstructor; - default: boolean; - }; - treeOp: { - type: ObjectConstructor; - default(): { - data: never[]; - }; - }; - pagerOp: { - type: ObjectConstructor; - default(): {}; - }; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - readonly: { - type: BooleanConstructor; - default: boolean; - }; - multi: { - type: BooleanConstructor; - default: boolean; - }; - showClearBtn: { - type: BooleanConstructor; - default: boolean; - }; - showPager: { - type: BooleanConstructor; - default: boolean; - }; - showHistory: { - type: BooleanConstructor; - default: boolean; - }; - autoLookup: { - type: BooleanConstructor; - default: boolean; - }; - beforeReset: FunctionConstructor; - resize: { - type: BooleanConstructor; - default: boolean; - }; - dialogClass: { - type: StringConstructor; - default: string; - }; - textRenderSource: FunctionConstructor; - draggable: { - type: BooleanConstructor; - default: boolean; - }; - placement: { - type: StringConstructor; - default: string; - }; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - suggest: BooleanConstructor; - beforeClose: { - type: FunctionConstructor; - default: () => () => true; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "close" | "page-change")[], "change" | "close" | "page-change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - TITLE: string; - COLUMNS_TYPE: { - selection: string; - radio: string; - index: string; - width: number; - }; - GRID_REF: { - history: string; - source: string; - }; - TAG_NAME: string; - MODAL_WIDTH: { - multi: number; - radio: number; - }; - ACTIVE_NAME: { - history: string; - source: string; - }; - TYPE_GRID: string; - TYPE_TREE: string; - ID: string; - LABEL: string; - }; - }; - modelValue: { - type: (ArrayConstructor | StringConstructor | NumberConstructor)[]; - default: string; - }; - tabindex: { - type: StringConstructor; - default: string; - }; - placeholder: { - type: StringConstructor; - default: string; - }; - size: StringConstructor; - trigger: { - type: StringConstructor; - default: string; - }; - icon: { - type: ObjectConstructor; - default(): any; - }; - iconSearch: { - type: ObjectConstructor; - default(): any; - }; - title: { - type: StringConstructor; - default: string; - }; - textField: { - type: StringConstructor; - default: string; - }; - textSplit: { - type: StringConstructor; - default: string; - }; - valueField: { - type: StringConstructor; - default: string; - }; - valueSplit: { - type: StringConstructor; - default: string; - }; - popseletor: { - type: StringConstructor; - default: string; - validator(value: unknown): boolean; - }; - conditions: { - type: ArrayConstructor; - default(): never[]; - }; - width: { - type: (StringConstructor | NumberConstructor)[]; - default: string; - }; - height: (StringConstructor | NumberConstructor)[]; - gridOp: { - type: ObjectConstructor; - default(): { - columns: never[]; - data: never[]; - }; - }; - remoteSearch: FunctionConstructor; - dataset: ObjectConstructor; - alwaysLoad: { - type: BooleanConstructor; - default: boolean; - }; - treeOp: { - type: ObjectConstructor; - default(): { - data: never[]; - }; - }; - pagerOp: { - type: ObjectConstructor; - default(): {}; - }; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - readonly: { - type: BooleanConstructor; - default: boolean; - }; - multi: { - type: BooleanConstructor; - default: boolean; - }; - showClearBtn: { - type: BooleanConstructor; - default: boolean; - }; - showPager: { - type: BooleanConstructor; - default: boolean; - }; - showHistory: { - type: BooleanConstructor; - default: boolean; - }; - autoLookup: { - type: BooleanConstructor; - default: boolean; - }; - beforeReset: FunctionConstructor; - resize: { - type: BooleanConstructor; - default: boolean; - }; - dialogClass: { - type: StringConstructor; - default: string; - }; - textRenderSource: FunctionConstructor; - draggable: { - type: BooleanConstructor; - default: boolean; - }; - placement: { - type: StringConstructor; - default: string; - }; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - suggest: BooleanConstructor; - beforeClose: { - type: FunctionConstructor; - default: () => () => true; - }; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; - onClose?: ((...args: any[]) => any) | undefined; - "onPage-change"?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - title: string; - width: string | number; - readonly: boolean; - modelValue: string | number | unknown[]; - icon: Record; - tabindex: string; - placeholder: string; - disabled: boolean; - popperAppendToBody: boolean; - placement: string; - valueField: string; - textField: string; - trigger: string; - beforeClose: Function; - textSplit: string; - resize: boolean; - draggable: boolean; - dialogClass: string; - autoLookup: boolean; - conditions: unknown[]; - gridOp: Record; - alwaysLoad: boolean; - treeOp: Record; - iconSearch: Record; - multi: boolean; - pagerOp: Record; - popseletor: string; - showClearBtn: boolean; - showHistory: boolean; - showPager: boolean; - valueSplit: string; - suggest: boolean; -}>; -export default _default; diff --git a/typings/popeditor/src/pc.vue.d.ts b/typings/popeditor/src/pc.vue.d.ts deleted file mode 100644 index 6b7cf5083..000000000 --- a/typings/popeditor/src/pc.vue.d.ts +++ /dev/null @@ -1,25 +0,0 @@ -declare const _default: { - components: { - IconClose: any; - IconChevronDown: any; - IconChevronUp: any; - TinyInput: any; - TinyGrid: any; - TinyPager: any; - TinyDialogBox: any; - TinyTree: any; - }; - directives: { - Clickoutside: any; - }; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/popover/index.d.ts b/typings/popover/index.d.ts deleted file mode 100644 index 3062eefa8..000000000 --- a/typings/popover/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Popover from './src/index.vue'; -import '@opentiny/vue-theme/popover/index.css'; -export default Popover; diff --git a/typings/popover/src/index.vue.d.ts b/typings/popover/src/index.vue.d.ts deleted file mode 100644 index afe2f99ef..000000000 --- a/typings/popover/src/index.vue.d.ts +++ /dev/null @@ -1,152 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - appendToBody: { - type: BooleanConstructor; - default: boolean; - }; - arrowOffset: { - type: NumberConstructor; - default: number; - }; - boundariesPadding: { - type: NumberConstructor; - default: number; - }; - closeDelay: { - type: NumberConstructor; - default: number; - }; - content: StringConstructor; - disabled: BooleanConstructor; - modelValue: BooleanConstructor; - offset: { - default: number; - }; - openDelay: { - type: NumberConstructor; - default: number; - }; - placement: { - type: StringConstructor; - default: string; - }; - popper: {}; - popperClass: StringConstructor; - popperOptions: { - type: ObjectConstructor; - default: () => { - gpuAcceleration: boolean; - }; - }; - reference: {}; - tabindex: { - type: NumberConstructor; - default: number; - }; - title: StringConstructor; - transformOrigin: { - type: (BooleanConstructor | StringConstructor)[]; - default: boolean; - }; - transition: { - type: StringConstructor; - default: string; - }; - trigger: { - type: StringConstructor; - default: string; - }; - visibleArrow: { - default: boolean; - }; - width: {}; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("after-leave" | "after-enter" | "show" | "hide")[], "after-leave" | "after-enter" | "hide" | "show", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - gpuAcceleration: boolean; - }; - }; - reference: {}; - tabindex: { - type: NumberConstructor; - default: number; - }; - title: StringConstructor; - transformOrigin: { - type: (BooleanConstructor | StringConstructor)[]; - default: boolean; - }; - transition: { - type: StringConstructor; - default: string; - }; - trigger: { - type: StringConstructor; - default: string; - }; - visibleArrow: { - default: boolean; - }; - width: {}; -}>> & { - "onAfter-leave"?: ((...args: any[]) => any) | undefined; - "onAfter-enter"?: ((...args: any[]) => any) | undefined; - onShow?: ((...args: any[]) => any) | undefined; - onHide?: ((...args: any[]) => any) | undefined; -}, { - transition: string; - modelValue: boolean; - tabindex: number; - disabled: boolean; - popperOptions: Record; - placement: string; - trigger: string; - visibleArrow: boolean; - offset: number; - boundariesPadding: number; - arrowOffset: number; - appendToBody: boolean; - closeDelay: number; - openDelay: number; - transformOrigin: string | boolean; -}>; -export default _default; diff --git a/typings/popup/index.d.ts b/typings/popup/index.d.ts deleted file mode 100644 index 6263aa414..000000000 --- a/typings/popup/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Popup from './src/index.vue'; -import '@opentiny/vue-theme-mobile/popup/index.css'; -export default Popup; diff --git a/typings/popup/src/index.vue.d.ts b/typings/popup/src/index.vue.d.ts deleted file mode 100644 index 0af766b96..000000000 --- a/typings/popup/src/index.vue.d.ts +++ /dev/null @@ -1,128 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - OVERFLOWHIDDEN: string; - }; - }; - closeIcon: { - type: StringConstructor; - default: string; - }; - closeIconPosition: { - type: StringConstructor; - default: string; - }; - closeOnClickOverlay: { - type: BooleanConstructor; - default: boolean; - }; - closeable: { - type: BooleanConstructor; - default: boolean; - }; - duration: (StringConstructor | NumberConstructor)[]; - lazyRender: { - type: BooleanConstructor; - default: boolean; - }; - lockScroll: { - type: BooleanConstructor; - default: boolean; - }; - modelValue: BooleanConstructor; - overlay: { - type: BooleanConstructor; - default: boolean; - }; - overlayClass: StringConstructor; - overlayStyle: ObjectConstructor; - popupClass: StringConstructor; - popupStyle: ObjectConstructor; - position: { - type: StringConstructor; - default: string; - }; - round: BooleanConstructor; - safeAreaInsetBottom: BooleanConstructor; - transition: StringConstructor; - zIndex: (StringConstructor | NumberConstructor)[]; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click" | "update:modelValue" | "close" | "open" | "opened" | "closed" | "click-overlay")[], "click" | "update:modelValue" | "close" | "open" | "opened" | "closed" | "click-overlay", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - OVERFLOWHIDDEN: string; - }; - }; - closeIcon: { - type: StringConstructor; - default: string; - }; - closeIconPosition: { - type: StringConstructor; - default: string; - }; - closeOnClickOverlay: { - type: BooleanConstructor; - default: boolean; - }; - closeable: { - type: BooleanConstructor; - default: boolean; - }; - duration: (StringConstructor | NumberConstructor)[]; - lazyRender: { - type: BooleanConstructor; - default: boolean; - }; - lockScroll: { - type: BooleanConstructor; - default: boolean; - }; - modelValue: BooleanConstructor; - overlay: { - type: BooleanConstructor; - default: boolean; - }; - overlayClass: StringConstructor; - overlayStyle: ObjectConstructor; - popupClass: StringConstructor; - popupStyle: ObjectConstructor; - position: { - type: StringConstructor; - default: string; - }; - round: BooleanConstructor; - safeAreaInsetBottom: BooleanConstructor; - transition: StringConstructor; - zIndex: (StringConstructor | NumberConstructor)[]; -}>> & { - onClick?: ((...args: any[]) => any) | undefined; - "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined; - onClose?: ((...args: any[]) => any) | undefined; - onOpen?: ((...args: any[]) => any) | undefined; - onOpened?: ((...args: any[]) => any) | undefined; - onClosed?: ((...args: any[]) => any) | undefined; - "onClick-overlay"?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - modelValue: boolean; - round: boolean; - lockScroll: boolean; - overlay: boolean; - closeOnClickOverlay: boolean; - position: string; - closeIcon: string; - closeIconPosition: string; - closeable: boolean; - lazyRender: boolean; - safeAreaInsetBottom: boolean; -}>; -export default _default; diff --git a/typings/progress/index.d.ts b/typings/progress/index.d.ts deleted file mode 100644 index d711dbaa0..000000000 --- a/typings/progress/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Progress from './src/index'; -export default Progress; diff --git a/typings/progress/src/index.d.ts b/typings/progress/src/index.d.ts deleted file mode 100644 index cc1a86fcd..000000000 --- a/typings/progress/src/index.d.ts +++ /dev/null @@ -1,133 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - PROGRESS_TYPE: { - LINE: string; - CIRCLE: string; - DASHBOARD: string; - }; - PROGRESS_STATUS: { - SUCCESS: string; - EXCEPTION: string; - WARNING: string; - }; - STATUS_TO_COLOR: { - success: string; - exception: string; - warning: string; - }; - STATUS_DEFAULT_COLOR: string; - ICON_CIRCLE_WARNING: string; - ICON_CIRCLE_SUCCESS: string; - ICON_CIRCLE_EXCEPTION: string; - ICON_SUCCESS: string; - ICON_EXCEPTION: string; - ICON_WARNING: string; - }; - }; - color: { - type: (ArrayConstructor | StringConstructor | FunctionConstructor)[]; - default: string; - }; - format: FunctionConstructor; - percentage: { - type: NumberConstructor; - default: number; - required: true; - }; - showText: { - type: BooleanConstructor; - default: boolean; - }; - status: { - type: StringConstructor; - }; - strokeWidth: { - type: NumberConstructor; - default: number; - }; - textInside: { - type: BooleanConstructor; - default: boolean; - }; - type: { - type: StringConstructor; - default: string; - }; - width: { - type: NumberConstructor; - default: number; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - PROGRESS_TYPE: { - LINE: string; - CIRCLE: string; - DASHBOARD: string; - }; - PROGRESS_STATUS: { - SUCCESS: string; - EXCEPTION: string; - WARNING: string; - }; - STATUS_TO_COLOR: { - success: string; - exception: string; - warning: string; - }; - STATUS_DEFAULT_COLOR: string; - ICON_CIRCLE_WARNING: string; - ICON_CIRCLE_SUCCESS: string; - ICON_CIRCLE_EXCEPTION: string; - ICON_SUCCESS: string; - ICON_EXCEPTION: string; - ICON_WARNING: string; - }; - }; - color: { - type: (ArrayConstructor | StringConstructor | FunctionConstructor)[]; - default: string; - }; - format: FunctionConstructor; - percentage: { - type: NumberConstructor; - default: number; - required: true; - }; - showText: { - type: BooleanConstructor; - default: boolean; - }; - status: { - type: StringConstructor; - }; - strokeWidth: { - type: NumberConstructor; - default: number; - }; - textInside: { - type: BooleanConstructor; - default: boolean; - }; - type: { - type: StringConstructor; - default: string; - }; - width: { - type: NumberConstructor; - default: number; - }; -}>>, { - _constants: Record; - type: string; - width: number; - color: string | Function | unknown[]; - percentage: number; - strokeWidth: number; - textInside: boolean; - showText: boolean; -}>; -export default _default; diff --git a/typings/progress/src/mobile.vue.d.ts b/typings/progress/src/mobile.vue.d.ts deleted file mode 100644 index 0420b169d..000000000 --- a/typings/progress/src/mobile.vue.d.ts +++ /dev/null @@ -1,20 +0,0 @@ -import '@opentiny/vue-theme-mobile/progress/index.css'; -declare const _default: { - props: string[]; - components: { - IconClose: any; - IconSuccessful: any; - IconError: any; - IconYes: any; - IconWarning: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/progress/src/pc.vue.d.ts b/typings/progress/src/pc.vue.d.ts deleted file mode 100644 index 83f2795e9..000000000 --- a/typings/progress/src/pc.vue.d.ts +++ /dev/null @@ -1,20 +0,0 @@ -import '@opentiny/vue-theme/progress/index.css'; -declare const _default: { - props: string[]; - components: { - IconClose: any; - IconSuccessful: any; - IconError: any; - IconYes: any; - IconWarning: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/pull-refresh/index.d.ts b/typings/pull-refresh/index.d.ts deleted file mode 100644 index 30b4694c1..000000000 --- a/typings/pull-refresh/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import PullRefresh from './src/index.vue'; -export default PullRefresh; diff --git a/typings/pull-refresh/src/index.vue.d.ts b/typings/pull-refresh/src/index.vue.d.ts deleted file mode 100644 index 263139f86..000000000 --- a/typings/pull-refresh/src/index.vue.d.ts +++ /dev/null @@ -1,72 +0,0 @@ -import '@opentiny/vue-theme-mobile/pull-refresh/index.css'; -declare const _default: import("vue").DefineComponent<{ - modelValue: BooleanConstructor; - pullingText: { - type: StringConstructor; - default: () => any; - }; - loosingText: { - type: StringConstructor; - default: () => any; - }; - successText: StringConstructor; - successDuration: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - animationDuration: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - headHeight: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - disabled: { - type: BooleanConstructor; - default: boolean; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly any; - }; - loosingText: { - type: StringConstructor; - default: () => any; - }; - successText: StringConstructor; - successDuration: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - animationDuration: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - headHeight: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - disabled: { - type: BooleanConstructor; - default: boolean; - }; -}>>, { - modelValue: boolean; - disabled: boolean; - pullingText: string; - loosingText: string; - successDuration: string | number; - animationDuration: string | number; - headHeight: string | number; -}>; -export default _default; diff --git a/typings/radio-button/index.d.ts b/typings/radio-button/index.d.ts deleted file mode 100644 index 9e7f2227f..000000000 --- a/typings/radio-button/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import RadioButton from './src/index'; -import '@opentiny/vue-theme/radio-button/index.css'; -export default RadioButton; diff --git a/typings/radio-button/src/index.d.ts b/typings/radio-button/src/index.d.ts deleted file mode 100644 index 0e2f76aaf..000000000 --- a/typings/radio-button/src/index.d.ts +++ /dev/null @@ -1,36 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - RADIO_GROUP: string; - }; - }; - name: StringConstructor; - text: StringConstructor; - events: { - type: ObjectConstructor; - default: () => {}; - }; - label: {}; - disabled: BooleanConstructor; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - RADIO_GROUP: string; - }; - }; - name: StringConstructor; - text: StringConstructor; - events: { - type: ObjectConstructor; - default: () => {}; - }; - label: {}; - disabled: BooleanConstructor; -}>>, { - _constants: Record; - disabled: boolean; - events: Record; -}>; -export default _default; diff --git a/typings/radio-button/src/pc.vue.d.ts b/typings/radio-button/src/pc.vue.d.ts deleted file mode 100644 index 55ef694f3..000000000 --- a/typings/radio-button/src/pc.vue.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -declare const _default: { - emits: string[]; - props: string[]; - inheritAttrs: boolean; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/radio-group/index.d.ts b/typings/radio-group/index.d.ts deleted file mode 100644 index 0ad4a0a34..000000000 --- a/typings/radio-group/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import RadioGroup from './src/index'; -import '@opentiny/vue-theme/radio-group/index.css'; -export default RadioGroup; diff --git a/typings/radio-group/src/index.d.ts b/typings/radio-group/src/index.d.ts deleted file mode 100644 index 1cdde4bff..000000000 --- a/typings/radio-group/src/index.d.ts +++ /dev/null @@ -1,39 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - modelValue: {}; - size: StringConstructor; - fill: StringConstructor; - textColor: StringConstructor; - disabled: BooleanConstructor; - vertical: BooleanConstructor; - options: { - type: ArrayConstructor; - default: () => never[]; - }; - type: { - type: StringConstructor; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "change"[], "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly never[]; - }; - type: { - type: StringConstructor; - default: string; - }; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; -}, { - type: string; - disabled: boolean; - vertical: boolean; - options: unknown[]; -}>; -export default _default; diff --git a/typings/radio-group/src/pc.vue.d.ts b/typings/radio-group/src/pc.vue.d.ts deleted file mode 100644 index 8df29895c..000000000 --- a/typings/radio-group/src/pc.vue.d.ts +++ /dev/null @@ -1,18 +0,0 @@ -declare const _default: { - components: { - Radio: any; - RadioButton: any; - }; - emits: string[]; - props: string[]; - inheritAttrs: boolean; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/radio/index.d.ts b/typings/radio/index.d.ts deleted file mode 100644 index f36b32faa..000000000 --- a/typings/radio/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Radio from './src/index'; -export default Radio; diff --git a/typings/radio/src/index.d.ts b/typings/radio/src/index.d.ts deleted file mode 100644 index faf0eb2f0..000000000 --- a/typings/radio/src/index.d.ts +++ /dev/null @@ -1,54 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - RADIO_GROUP: string; - }; - }; - modelValue: {}; - label: {}; - disabled: BooleanConstructor; - name: StringConstructor; - border: BooleanConstructor; - size: StringConstructor; - text: StringConstructor; - events: { - type: ObjectConstructor; - default: () => {}; - }; - tabindex: { - type: StringConstructor; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "change"[], "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - RADIO_GROUP: string; - }; - }; - modelValue: {}; - label: {}; - disabled: BooleanConstructor; - name: StringConstructor; - border: BooleanConstructor; - size: StringConstructor; - text: StringConstructor; - events: { - type: ObjectConstructor; - default: () => {}; - }; - tabindex: { - type: StringConstructor; - default: string; - }; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - tabindex: string; - disabled: boolean; - events: Record; - border: boolean; -}>; -export default _default; diff --git a/typings/radio/src/mobile.vue.d.ts b/typings/radio/src/mobile.vue.d.ts deleted file mode 100644 index b9a1d41b2..000000000 --- a/typings/radio/src/mobile.vue.d.ts +++ /dev/null @@ -1,15 +0,0 @@ -import '@opentiny/vue-theme-mobile/radio/index.css'; -declare const _default: { - emits: string[]; - props: string[]; - inheritAttrs: boolean; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/radio/src/pc.vue.d.ts b/typings/radio/src/pc.vue.d.ts deleted file mode 100644 index 03525433e..000000000 --- a/typings/radio/src/pc.vue.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -import '@opentiny/vue-theme/radio/index.css'; -declare const _default: { - emits: string[]; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/rate/index.d.ts b/typings/rate/index.d.ts deleted file mode 100644 index fe3057396..000000000 --- a/typings/rate/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Rate from './src/index'; -import '@opentiny/vue-theme/rate/index.css'; -export default Rate; diff --git a/typings/rate/src/index.d.ts b/typings/rate/src/index.d.ts deleted file mode 100644 index f6c9ebb47..000000000 --- a/typings/rate/src/index.d.ts +++ /dev/null @@ -1,213 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - RATENODECLS: string; - ICON_PREFIXCLS: string; - DECIMALCLS: string; - }; - }; - allowHalf: { - type: BooleanConstructor; - default: boolean; - }; - colors: { - type: ArrayConstructor; - default: () => string[]; - }; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - disabledVoidColor: { - type: StringConstructor; - default: string; - }; - disabledVoidIconClass: { - type: StringConstructor; - default: string; - }; - highThreshold: { - type: NumberConstructor; - default: number; - }; - iconClasses: { - type: ArrayConstructor; - default: () => string[]; - }; - lowThreshold: { - type: NumberConstructor; - default: number; - }; - max: { - type: NumberConstructor; - default: number; - }; - modelValue: { - type: NumberConstructor; - default: number; - }; - showText: { - type: BooleanConstructor; - default: boolean; - }; - radio: { - type: BooleanConstructor; - default: boolean; - }; - scoreTemplate: { - type: StringConstructor; - default: string; - }; - showScore: { - type: BooleanConstructor; - default: boolean; - }; - size: { - type: StringConstructor; - default: string; - }; - space: { - type: StringConstructor; - default: string; - }; - textColor: { - type: StringConstructor; - default: string; - }; - textOnBottom: { - type: BooleanConstructor; - default: boolean; - }; - texts: { - type: ArrayConstructor; - default: () => any[]; - }; - voidColor: { - type: StringConstructor; - default: string; - }; - voidIconClass: { - type: StringConstructor; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "change"[], "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - RATENODECLS: string; - ICON_PREFIXCLS: string; - DECIMALCLS: string; - }; - }; - allowHalf: { - type: BooleanConstructor; - default: boolean; - }; - colors: { - type: ArrayConstructor; - default: () => string[]; - }; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - disabledVoidColor: { - type: StringConstructor; - default: string; - }; - disabledVoidIconClass: { - type: StringConstructor; - default: string; - }; - highThreshold: { - type: NumberConstructor; - default: number; - }; - iconClasses: { - type: ArrayConstructor; - default: () => string[]; - }; - lowThreshold: { - type: NumberConstructor; - default: number; - }; - max: { - type: NumberConstructor; - default: number; - }; - modelValue: { - type: NumberConstructor; - default: number; - }; - showText: { - type: BooleanConstructor; - default: boolean; - }; - radio: { - type: BooleanConstructor; - default: boolean; - }; - scoreTemplate: { - type: StringConstructor; - default: string; - }; - showScore: { - type: BooleanConstructor; - default: boolean; - }; - size: { - type: StringConstructor; - default: string; - }; - space: { - type: StringConstructor; - default: string; - }; - textColor: { - type: StringConstructor; - default: string; - }; - textOnBottom: { - type: BooleanConstructor; - default: boolean; - }; - texts: { - type: ArrayConstructor; - default: () => any[]; - }; - voidColor: { - type: StringConstructor; - default: string; - }; - voidIconClass: { - type: StringConstructor; - default: string; - }; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - modelValue: number; - size: string; - disabled: boolean; - max: number; - colors: unknown[]; - textColor: string; - radio: boolean; - space: string; - showText: boolean; - lowThreshold: number; - highThreshold: number; - voidColor: string; - disabledVoidColor: string; - iconClasses: unknown[]; - voidIconClass: string; - disabledVoidIconClass: string; - allowHalf: boolean; - showScore: boolean; - texts: unknown[]; - textOnBottom: boolean; - scoreTemplate: string; -}>; -export default _default; diff --git a/typings/rate/src/pc.vue.d.ts b/typings/rate/src/pc.vue.d.ts deleted file mode 100644 index a5199d95e..000000000 --- a/typings/rate/src/pc.vue.d.ts +++ /dev/null @@ -1,19 +0,0 @@ -declare const _default: { - props: string[]; - components: { - IconStarActive: any; - IconStarDisable: any; - IconSmile: any; - IconFrown: any; - IconMeh: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/roles/index.d.ts b/typings/roles/index.d.ts deleted file mode 100644 index 32f2f156f..000000000 --- a/typings/roles/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import Roles from './src/index'; -import '@opentiny/vue-theme/roles/index.css'; -export default Roles; diff --git a/typings/roles/src/index.d.ts b/typings/roles/src/index.d.ts deleted file mode 100644 index 43854bb87..000000000 --- a/typings/roles/src/index.d.ts +++ /dev/null @@ -1,28 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - AUTH: string; - ANONYMOUS: string; - GLOBAL: string; - ROLE: string; - }; - }; - fetchRole: FunctionConstructor; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "change"[], "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - AUTH: string; - ANONYMOUS: string; - GLOBAL: string; - ROLE: string; - }; - }; - fetchRole: FunctionConstructor; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; -}>; -export default _default; diff --git a/typings/roles/src/pc.vue.d.ts b/typings/roles/src/pc.vue.d.ts deleted file mode 100644 index 8c7b68510..000000000 --- a/typings/roles/src/pc.vue.d.ts +++ /dev/null @@ -1,17 +0,0 @@ -declare const _default: { - props: string[]; - components: { - TinyPopover: any; - IconChevronDown: any; - IconChevronUp: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/row/index.d.ts b/typings/row/index.d.ts deleted file mode 100644 index fcf1562b8..000000000 --- a/typings/row/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Row from './src/index'; -import '@opentiny/vue-theme/row/index.css'; -export default Row; diff --git a/typings/row/src/index.d.ts b/typings/row/src/index.d.ts deleted file mode 100644 index 38f92e98e..000000000 --- a/typings/row/src/index.d.ts +++ /dev/null @@ -1,59 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - flex: BooleanConstructor; - gutter: { - type: NumberConstructor; - default: number; - }; - justify: { - type: StringConstructor; - default: string; - }; - align: { - type: StringConstructor; - default: string; - }; - order: { - type: StringConstructor; - }; - tag: { - type: StringConstructor; - default: string; - }; - noSpace: { - type: BooleanConstructor; - default: boolean; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - tag: string; - flex: boolean; - justify: string; - align: string; - gutter: number; - noSpace: boolean; -}>; -export default _default; diff --git a/typings/row/src/pc.vue.d.ts b/typings/row/src/pc.vue.d.ts deleted file mode 100644 index f5d461606..000000000 --- a/typings/row/src/pc.vue.d.ts +++ /dev/null @@ -1,12 +0,0 @@ -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/scroll-text/index.d.ts b/typings/scroll-text/index.d.ts deleted file mode 100644 index 10db1f14b..000000000 --- a/typings/scroll-text/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import ScrollText from './src/index'; -import '@opentiny/vue-theme/scroll-text/index.css'; -export default ScrollText; diff --git a/typings/scroll-text/src/index.d.ts b/typings/scroll-text/src/index.d.ts deleted file mode 100644 index 433d15fe3..000000000 --- a/typings/scroll-text/src/index.d.ts +++ /dev/null @@ -1,63 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - ANIMATION_DURATION: string; - }; - }; - text: { - type: StringConstructor; - default: string; - }; - time: { - type: NumberConstructor; - default: number; - }; - styles: { - type: StringConstructor; - default: string; - }; - direction: { - type: StringConstructor; - default: string; - }; - hoverStop: { - type: BooleanConstructor; - default: boolean; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - ANIMATION_DURATION: string; - }; - }; - text: { - type: StringConstructor; - default: string; - }; - time: { - type: NumberConstructor; - default: number; - }; - styles: { - type: StringConstructor; - default: string; - }; - direction: { - type: StringConstructor; - default: string; - }; - hoverStop: { - type: BooleanConstructor; - default: boolean; - }; -}>>, { - _constants: Record; - time: number; - text: string; - direction: string; - styles: string; - hoverStop: boolean; -}>; -export default _default; diff --git a/typings/scroll-text/src/pc.vue.d.ts b/typings/scroll-text/src/pc.vue.d.ts deleted file mode 100644 index f5d461606..000000000 --- a/typings/scroll-text/src/pc.vue.d.ts +++ /dev/null @@ -1,12 +0,0 @@ -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/scrollbar/index.d.ts b/typings/scrollbar/index.d.ts deleted file mode 100644 index 13674fac3..000000000 --- a/typings/scrollbar/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Scrollbar from './src/index.vue'; -import '@opentiny/vue-theme/scrollbar/index.css'; -export default Scrollbar; diff --git a/typings/scrollbar/src/bar.vue.d.ts b/typings/scrollbar/src/bar.vue.d.ts deleted file mode 100644 index 5ab19a152..000000000 --- a/typings/scrollbar/src/bar.vue.d.ts +++ /dev/null @@ -1,18 +0,0 @@ -declare const _default: { - name: string; - props: { - vertical: BooleanConstructor; - size: StringConstructor; - move: NumberConstructor; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - render(): JSX.Element; -}; -export default _default; diff --git a/typings/scrollbar/src/index.vue.d.ts b/typings/scrollbar/src/index.vue.d.ts deleted file mode 100644 index bbfff9a53..000000000 --- a/typings/scrollbar/src/index.vue.d.ts +++ /dev/null @@ -1,48 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - marginBottomAdjust: { - type: NumberConstructor; - default: number; - }; - native: BooleanConstructor; - noresize: BooleanConstructor; - tag: { - type: StringConstructor; - default: string; - }; - viewClass: {}; - viewStyle: {}; - wrapClass: {}; - wrapStyle: {}; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("mouseenter" | "scroll" | "mousemove")[], "mouseenter" | "scroll" | "mousemove", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onMouseenter?: ((...args: any[]) => any) | undefined; - onMousemove?: ((...args: any[]) => any) | undefined; - onScroll?: ((...args: any[]) => any) | undefined; -}, { - tag: string; - marginBottomAdjust: number; - native: boolean; - noresize: boolean; -}>; -export default _default; diff --git a/typings/search/index.d.ts b/typings/search/index.d.ts deleted file mode 100644 index bf5e2526b..000000000 --- a/typings/search/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Search from './src/index'; -export default Search; diff --git a/typings/search/src/index.d.ts b/typings/search/src/index.d.ts deleted file mode 100644 index 653885250..000000000 --- a/typings/search/src/index.d.ts +++ /dev/null @@ -1,107 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - mini: { - type: BooleanConstructor; - default: boolean; - }; - buttonText: { - type: StringConstructor; - default: () => any; - }; - /** - * 设置为透明模式,配置为true时,边框变为透明且收缩后半透明显示,一般用在带有背景的场景 - */ - transparent: { - type: BooleanConstructor; - default: boolean; - }; - /** - * 搜索的类型选项,格式为[{text:'文档',value:1},...],不配置时类型选择固定显示为All - */ - searchTypes: { - type: ArrayConstructor; - default: () => never[]; - }; - /** - * 设置搜索输入框内的提示占位文本 - */ - placeholder: { - type: StringConstructor; - default: string; - }; - modelValue: StringConstructor; - clearable: { - type: BooleanConstructor; - default: boolean; - }; - tabindex: { - type: StringConstructor; - default: string; - }; - /** - * 配置搜索输入框enter键,enter按下触发搜索 - */ - isEnterSearch: { - type: BooleanConstructor; - default: boolean; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("select" | "change" | "search")[], "select" | "search" | "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly any; - }; - /** - * 设置为透明模式,配置为true时,边框变为透明且收缩后半透明显示,一般用在带有背景的场景 - */ - transparent: { - type: BooleanConstructor; - default: boolean; - }; - /** - * 搜索的类型选项,格式为[{text:'文档',value:1},...],不配置时类型选择固定显示为All - */ - searchTypes: { - type: ArrayConstructor; - default: () => never[]; - }; - /** - * 设置搜索输入框内的提示占位文本 - */ - placeholder: { - type: StringConstructor; - default: string; - }; - modelValue: StringConstructor; - clearable: { - type: BooleanConstructor; - default: boolean; - }; - tabindex: { - type: StringConstructor; - default: string; - }; - /** - * 配置搜索输入框enter键,enter按下触发搜索 - */ - isEnterSearch: { - type: BooleanConstructor; - default: boolean; - }; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; - onSelect?: ((...args: any[]) => any) | undefined; - onSearch?: ((...args: any[]) => any) | undefined; -}, { - tabindex: string; - placeholder: string; - clearable: boolean; - mini: boolean; - transparent: boolean; - buttonText: string; - searchTypes: unknown[]; - isEnterSearch: boolean; -}>; -export default _default; diff --git a/typings/search/src/mobile.vue.d.ts b/typings/search/src/mobile.vue.d.ts deleted file mode 100644 index 6fd278f1b..000000000 --- a/typings/search/src/mobile.vue.d.ts +++ /dev/null @@ -1,17 +0,0 @@ -import '@opentiny/vue-theme-mobile/search/index.css'; -declare const _default: { - props: string[]; - components: { - IconSearch: any; - IconOperationfaild: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/search/src/pc.vue.d.ts b/typings/search/src/pc.vue.d.ts deleted file mode 100644 index bfe3b91bb..000000000 --- a/typings/search/src/pc.vue.d.ts +++ /dev/null @@ -1,18 +0,0 @@ -import '@opentiny/vue-theme/search/index.css'; -declare const _default: { - props: string[]; - components: { - IconChevronDown: any; - IconSearch: any; - IconClose: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/select-dropdown/index.d.ts b/typings/select-dropdown/index.d.ts deleted file mode 100644 index 98af57a45..000000000 --- a/typings/select-dropdown/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import SelectDropdown from './src/index'; -import '@opentiny/vue-theme/select-dropdown/index.css'; -export default SelectDropdown; diff --git a/typings/select-dropdown/src/index.d.ts b/typings/select-dropdown/src/index.d.ts deleted file mode 100644 index eaade6671..000000000 --- a/typings/select-dropdown/src/index.d.ts +++ /dev/null @@ -1,83 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - appendToBody: { - type: BooleanConstructor; - default: () => boolean; - }; - arrowOffset: { - type: NumberConstructor; - default: () => number; - }; - boundariesPadding: { - default: () => number; - }; - isDropInheritWidth: BooleanConstructor; - modelValue: BooleanConstructor; - offset: { - default: () => number; - }; - placement: { - default: () => string; - }; - popper: {}; - popperOptions: { - default: () => { - gpuAcceleration: boolean; - }; - }; - reference: {}; - transformOrigin: { - type: (BooleanConstructor | StringConstructor)[]; - default: () => boolean; - }; - visibleArrow: { - default: () => boolean; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly boolean; - }; - arrowOffset: { - type: NumberConstructor; - default: () => number; - }; - boundariesPadding: { - default: () => number; - }; - isDropInheritWidth: BooleanConstructor; - modelValue: BooleanConstructor; - offset: { - default: () => number; - }; - placement: { - default: () => string; - }; - popper: {}; - popperOptions: { - default: () => { - gpuAcceleration: boolean; - }; - }; - reference: {}; - transformOrigin: { - type: (BooleanConstructor | StringConstructor)[]; - default: () => boolean; - }; - visibleArrow: { - default: () => boolean; - }; -}>>, { - modelValue: boolean; - popperOptions: { - gpuAcceleration: boolean; - }; - placement: string; - visibleArrow: boolean; - offset: number; - boundariesPadding: number; - arrowOffset: number; - appendToBody: boolean; - transformOrigin: string | boolean; - isDropInheritWidth: boolean; -}>; -export default _default; diff --git a/typings/select-dropdown/src/pc.vue.d.ts b/typings/select-dropdown/src/pc.vue.d.ts deleted file mode 100644 index f5d461606..000000000 --- a/typings/select-dropdown/src/pc.vue.d.ts +++ /dev/null @@ -1,12 +0,0 @@ -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/select/index.d.ts b/typings/select/index.d.ts deleted file mode 100644 index a25cce466..000000000 --- a/typings/select/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Select from './src/index'; -import '@opentiny/vue-theme/select/index.css'; -export default Select; diff --git a/typings/select/src/index.d.ts b/typings/select/src/index.d.ts deleted file mode 100644 index 528ecb1b7..000000000 --- a/typings/select/src/index.d.ts +++ /dev/null @@ -1,395 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - CLASS: { - SelectDropdownWrap: string; - IsReverse: string; - }; - I18N: { - noData: string; - noMatch: string; - loading: string; - }; - COMPONENT_NAME: { - Form: string; - Select: string; - Option: string; - FormItem: string; - OptionGroup: string; - SelectDropdown: string; - }; - EVENT_NAME: { - removeTag: string; - formChange: string; - formBlur: string; - queryChange: string; - setSelected: string; - updatePopper: string; - destroyPopper: string; - visibleChange: string; - handleOptionClick: string; - handleGroupDisabled: string; - }; - TYPE: { - Grid: string; - Tree: string; - }; - }; - }; - id: (StringConstructor | NumberConstructor)[]; - name: StringConstructor; - size: StringConstructor; - remote: BooleanConstructor; - remoteConfig: { - type: ObjectConstructor; - default(): { - showIcon: boolean; - clearData: boolean; - autoSearch: boolean; - }; - }; - loading: BooleanConstructor; - disabled: BooleanConstructor; - options: ArrayConstructor; - dataset: ObjectConstructor; - textField: { - type: StringConstructor; - default: string; - }; - tabindex: { - type: StringConstructor; - default: string; - }; - valueField: { - type: StringConstructor; - default: string; - }; - placement: { - type: StringConstructor; - default: string; - }; - showCheck: { - type: BooleanConstructor; - default: boolean; - }; - showAlloption: { - type: BooleanConstructor; - default: boolean; - }; - multiple: BooleanConstructor; - clearable: BooleanConstructor; - noDataText: StringConstructor; - filterable: BooleanConstructor; - loadingText: StringConstructor; - noMatchText: StringConstructor; - popperClass: StringConstructor; - allowCreate: BooleanConstructor; - collapseTags: BooleanConstructor; - remoteMethod: FunctionConstructor; - filterMethod: FunctionConstructor; - reserveKeyword: BooleanConstructor; - automaticDropdown: BooleanConstructor; - defaultFirstOption: BooleanConstructor; - modelValue: {}; - valueKey: { - type: StringConstructor; - default: string; - }; - placeholder: { - type: StringConstructor; - default: () => any; - }; - autocomplete: { - type: StringConstructor; - default: string; - }; - multipleLimit: { - type: NumberConstructor; - default: number; - }; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - hideDrop: { - type: BooleanConstructor; - default: boolean; - }; - copyable: { - type: BooleanConstructor; - default: boolean; - }; - renderType: StringConstructor; - gridOp: { - type: ObjectConstructor; - default: () => {}; - }; - treeOp: { - type: ObjectConstructor; - default: () => {}; - }; - delay: { - type: NumberConstructor; - default: number; - }; - readonly: BooleanConstructor; - dropStyle: { - type: ObjectConstructor; - default: () => {}; - }; - cacheOp: ObjectConstructor; - isDropInheritWidth: BooleanConstructor; - tagSelectable: { - type: BooleanConstructor; - default: boolean; - }; - selectConfig: { - type: ObjectConstructor; - default(): { - checkMethod(): true; - }; - }; - radioConfig: { - type: ObjectConstructor; - default(): { - checkMethod(): true; - }; - }; - allowCopy: { - type: BooleanConstructor; - default: boolean; - }; - textSplit: { - type: StringConstructor; - default: string; - }; - autoClose: BooleanConstructor; - queryDebounce: NumberConstructor; - ignoreEnter: { - type: BooleanConstructor; - default: boolean; - }; - optimization: (ObjectConstructor | BooleanConstructor)[]; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "focus" | "blur" | "clear" | "visible-change" | "remove-tag")[], "change" | "focus" | "blur" | "clear" | "visible-change" | "remove-tag", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - CLASS: { - SelectDropdownWrap: string; - IsReverse: string; - }; - I18N: { - noData: string; - noMatch: string; - loading: string; - }; - COMPONENT_NAME: { - Form: string; - Select: string; - Option: string; - FormItem: string; - OptionGroup: string; - SelectDropdown: string; - }; - EVENT_NAME: { - removeTag: string; - formChange: string; - formBlur: string; - queryChange: string; - setSelected: string; - updatePopper: string; - destroyPopper: string; - visibleChange: string; - handleOptionClick: string; - handleGroupDisabled: string; - }; - TYPE: { - Grid: string; - Tree: string; - }; - }; - }; - id: (StringConstructor | NumberConstructor)[]; - name: StringConstructor; - size: StringConstructor; - remote: BooleanConstructor; - remoteConfig: { - type: ObjectConstructor; - default(): { - showIcon: boolean; - clearData: boolean; - autoSearch: boolean; - }; - }; - loading: BooleanConstructor; - disabled: BooleanConstructor; - options: ArrayConstructor; - dataset: ObjectConstructor; - textField: { - type: StringConstructor; - default: string; - }; - tabindex: { - type: StringConstructor; - default: string; - }; - valueField: { - type: StringConstructor; - default: string; - }; - placement: { - type: StringConstructor; - default: string; - }; - showCheck: { - type: BooleanConstructor; - default: boolean; - }; - showAlloption: { - type: BooleanConstructor; - default: boolean; - }; - multiple: BooleanConstructor; - clearable: BooleanConstructor; - noDataText: StringConstructor; - filterable: BooleanConstructor; - loadingText: StringConstructor; - noMatchText: StringConstructor; - popperClass: StringConstructor; - allowCreate: BooleanConstructor; - collapseTags: BooleanConstructor; - remoteMethod: FunctionConstructor; - filterMethod: FunctionConstructor; - reserveKeyword: BooleanConstructor; - automaticDropdown: BooleanConstructor; - defaultFirstOption: BooleanConstructor; - modelValue: {}; - valueKey: { - type: StringConstructor; - default: string; - }; - placeholder: { - type: StringConstructor; - default: () => any; - }; - autocomplete: { - type: StringConstructor; - default: string; - }; - multipleLimit: { - type: NumberConstructor; - default: number; - }; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - hideDrop: { - type: BooleanConstructor; - default: boolean; - }; - copyable: { - type: BooleanConstructor; - default: boolean; - }; - renderType: StringConstructor; - gridOp: { - type: ObjectConstructor; - default: () => {}; - }; - treeOp: { - type: ObjectConstructor; - default: () => {}; - }; - delay: { - type: NumberConstructor; - default: number; - }; - readonly: BooleanConstructor; - dropStyle: { - type: ObjectConstructor; - default: () => {}; - }; - cacheOp: ObjectConstructor; - isDropInheritWidth: BooleanConstructor; - tagSelectable: { - type: BooleanConstructor; - default: boolean; - }; - selectConfig: { - type: ObjectConstructor; - default(): { - checkMethod(): true; - }; - }; - radioConfig: { - type: ObjectConstructor; - default(): { - checkMethod(): true; - }; - }; - allowCopy: { - type: BooleanConstructor; - default: boolean; - }; - textSplit: { - type: StringConstructor; - default: string; - }; - autoClose: BooleanConstructor; - queryDebounce: NumberConstructor; - ignoreEnter: { - type: BooleanConstructor; - default: boolean; - }; - optimization: (ObjectConstructor | BooleanConstructor)[]; -}>> & { - onFocus?: ((...args: any[]) => any) | undefined; - onBlur?: ((...args: any[]) => any) | undefined; - onChange?: ((...args: any[]) => any) | undefined; - onClear?: ((...args: any[]) => any) | undefined; - "onVisible-change"?: ((...args: any[]) => any) | undefined; - "onRemove-tag"?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - readonly: boolean; - tabindex: string; - placeholder: string; - disabled: boolean; - popperAppendToBody: boolean; - valueKey: string; - clearable: boolean; - placement: string; - loading: boolean; - valueField: string; - textField: string; - filterable: boolean; - collapseTags: boolean; - multiple: boolean; - textSplit: string; - remote: boolean; - autocomplete: string; - gridOp: Record; - treeOp: Record; - dropStyle: Record; - copyable: boolean; - showCheck: boolean; - showAlloption: boolean; - hideDrop: boolean; - remoteConfig: Record; - allowCreate: boolean; - multipleLimit: number; - reserveKeyword: boolean; - automaticDropdown: boolean; - defaultFirstOption: boolean; - delay: number; - isDropInheritWidth: boolean; - tagSelectable: boolean; - selectConfig: Record; - radioConfig: Record; - allowCopy: boolean; - autoClose: boolean; - ignoreEnter: boolean; -}>; -export default _default; diff --git a/typings/select/src/pc.vue.d.ts b/typings/select/src/pc.vue.d.ts deleted file mode 100644 index 80d9cc475..000000000 --- a/typings/select/src/pc.vue.d.ts +++ /dev/null @@ -1,29 +0,0 @@ -declare const _default: { - emits: string[]; - directives: any; - components: { - TinyTag: any; - TinyInput: any; - TinyOption: any; - TinyGrid: any; - TinyTree: any; - IconClose: any; - TinyScrollbar: any; - IconChevronDown: any; - IconCopy: any; - TinySelectDropdown: any; - IconHalfselect: any; - IconCheck: any; - IconCheckedSur: any; - }; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/slide-bar/index.d.ts b/typings/slide-bar/index.d.ts deleted file mode 100644 index b0e983ba4..000000000 --- a/typings/slide-bar/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import SlideBar from './src/index'; -import '@opentiny/vue-theme/slide-bar/index.css'; -export default SlideBar; diff --git a/typings/slide-bar/src/index.d.ts b/typings/slide-bar/src/index.d.ts deleted file mode 100644 index 0e6322f57..000000000 --- a/typings/slide-bar/src/index.d.ts +++ /dev/null @@ -1,39 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - initBlocks: NumberConstructor; - wheelBlocks: { - type: NumberConstructor; - default: number; - }; - modelValue: ArrayConstructor; - tag: { - type: StringConstructor; - default: string; - }; - subTag: { - type: StringConstructor; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click" | "before-click")[], "click" | "before-click", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onClick?: ((...args: any[]) => any) | undefined; - "onBefore-click"?: ((...args: any[]) => any) | undefined; -}, { - tag: string; - wheelBlocks: number; - subTag: string; -}>; -export default _default; diff --git a/typings/slide-bar/src/pc.vue.d.ts b/typings/slide-bar/src/pc.vue.d.ts deleted file mode 100644 index 2edac13b0..000000000 --- a/typings/slide-bar/src/pc.vue.d.ts +++ /dev/null @@ -1,18 +0,0 @@ -declare const _default: { - components: { - IconChevronLeft: any; - IconChevronRight: any; - IconRadio: any; - }; - inheritAttrs: boolean; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/slider/index.d.ts b/typings/slider/index.d.ts deleted file mode 100644 index 987b8640f..000000000 --- a/typings/slider/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Slider from './src/index'; -export default Slider; diff --git a/typings/slider/src/index.d.ts b/typings/slider/src/index.d.ts deleted file mode 100644 index 840ee989a..000000000 --- a/typings/slider/src/index.d.ts +++ /dev/null @@ -1,153 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - TIP_HEIGHT: number; - BUTTON_SIZE: number; - HALF_BAR_HEIGHT: number; - PC_TIP_CLS: string; - PC_SLIDER_CLS: string; - PC_RANGE_CLS: string; - PC_BUTTON_CLS: string; - MOBILE_TIP_CLS: string; - MOBILE_SLIDER_CLS: string; - MOBILE_RANGE_CLS: string; - MOBILE_BUTTON_CLS: string; - Mode: string; - tipCls(mode: any): string; - sliderCls(mode: any): string; - rangeCls(mode: any): string; - buttonCls(mode: any): string; - }; - }; - formatTooltip: FunctionConstructor; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - height: { - type: StringConstructor; - default: string; - }; - max: { - type: NumberConstructor; - default: number; - }; - min: { - type: NumberConstructor; - default: number; - }; - modelValue: { - type: (ArrayConstructor | NumberConstructor)[]; - default: number; - }; - numPages: { - type: NumberConstructor; - default: number; - }; - range: { - type: BooleanConstructor; - default: boolean; - }; - showInput: { - type: BooleanConstructor; - default: boolean; - }; - showTip: { - type: BooleanConstructor; - default: boolean; - }; - step: { - type: NumberConstructor; - default: number; - }; - vertical: { - type: BooleanConstructor; - default: boolean; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "Start" | "Stop")[], "change" | "Start" | "Stop", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - TIP_HEIGHT: number; - BUTTON_SIZE: number; - HALF_BAR_HEIGHT: number; - PC_TIP_CLS: string; - PC_SLIDER_CLS: string; - PC_RANGE_CLS: string; - PC_BUTTON_CLS: string; - MOBILE_TIP_CLS: string; - MOBILE_SLIDER_CLS: string; - MOBILE_RANGE_CLS: string; - MOBILE_BUTTON_CLS: string; - Mode: string; - tipCls(mode: any): string; - sliderCls(mode: any): string; - rangeCls(mode: any): string; - buttonCls(mode: any): string; - }; - }; - formatTooltip: FunctionConstructor; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - height: { - type: StringConstructor; - default: string; - }; - max: { - type: NumberConstructor; - default: number; - }; - min: { - type: NumberConstructor; - default: number; - }; - modelValue: { - type: (ArrayConstructor | NumberConstructor)[]; - default: number; - }; - numPages: { - type: NumberConstructor; - default: number; - }; - range: { - type: BooleanConstructor; - default: boolean; - }; - showInput: { - type: BooleanConstructor; - default: boolean; - }; - showTip: { - type: BooleanConstructor; - default: boolean; - }; - step: { - type: NumberConstructor; - default: number; - }; - vertical: { - type: BooleanConstructor; - default: boolean; - }; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; - onStart?: ((...args: any[]) => any) | undefined; - onStop?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - height: string; - modelValue: number | unknown[]; - disabled: boolean; - max: number; - vertical: boolean; - min: number; - range: boolean; - step: number; - numPages: number; - showTip: boolean; - showInput: boolean; -}>; -export default _default; diff --git a/typings/slider/src/mobile.vue.d.ts b/typings/slider/src/mobile.vue.d.ts deleted file mode 100644 index f1d527b81..000000000 --- a/typings/slider/src/mobile.vue.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -import '@opentiny/vue-theme-mobile/slider/index.css'; -declare const _default: { - emits: string[]; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/slider/src/pc.vue.d.ts b/typings/slider/src/pc.vue.d.ts deleted file mode 100644 index 35fb54d40..000000000 --- a/typings/slider/src/pc.vue.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -import '@opentiny/vue-theme/slider/index.css'; -declare const _default: { - emits: string[]; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/split/index.d.ts b/typings/split/index.d.ts deleted file mode 100644 index c3f59e477..000000000 --- a/typings/split/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Split from './src/index.js'; -import '@opentiny/vue-theme/split/index.css'; -export default Split; diff --git a/typings/split/src/index.d.ts b/typings/split/src/index.d.ts deleted file mode 100644 index 539a60490..000000000 --- a/typings/split/src/index.d.ts +++ /dev/null @@ -1,62 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - PREFIX: string; - HORIZONTAL: string; - VERTICAL: string; - }; - }; - modelValue: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - mode: { - validator(value: unknown): boolean; - default: string; - }; - leftTopMin: { - type: (StringConstructor | NumberConstructor)[]; - default: string; - }; - rightBottomMin: { - type: (StringConstructor | NumberConstructor)[]; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("moving" | "moveend" | "movestart")[], "moving" | "moveend" | "movestart", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - PREFIX: string; - HORIZONTAL: string; - VERTICAL: string; - }; - }; - modelValue: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - mode: { - validator(value: unknown): boolean; - default: string; - }; - leftTopMin: { - type: (StringConstructor | NumberConstructor)[]; - default: string; - }; - rightBottomMin: { - type: (StringConstructor | NumberConstructor)[]; - default: string; - }; -}>> & { - onMoving?: ((...args: any[]) => any) | undefined; - onMoveend?: ((...args: any[]) => any) | undefined; - onMovestart?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - modelValue: string | number; - mode: string; - leftTopMin: string | number; - rightBottomMin: string | number; -}>; -export default _default; diff --git a/typings/split/src/pc.vue.d.ts b/typings/split/src/pc.vue.d.ts deleted file mode 100644 index 6ea946a45..000000000 --- a/typings/split/src/pc.vue.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -declare const _default: { - emits: string[]; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/steps/index.d.ts b/typings/steps/index.d.ts deleted file mode 100644 index 8560574bc..000000000 --- a/typings/steps/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Steps from './src/index'; -import '@opentiny/vue-theme/steps/index.css'; -export default Steps; diff --git a/typings/steps/src/index.d.ts b/typings/steps/src/index.d.ts deleted file mode 100644 index ac256fffa..000000000 --- a/typings/steps/src/index.d.ts +++ /dev/null @@ -1,47 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - nameField: { - type: StringConstructor; - default: string; - }; - countField: { - type: StringConstructor; - default: string; - }; - statusField: { - type: StringConstructor; - default: string; - }; - data: (ObjectConstructor | ArrayConstructor)[]; - space: NumberConstructor; - active: { - type: NumberConstructor; - default: number; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "click"[], "click", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onClick?: ((...args: any[]) => any) | undefined; -}, { - statusField: string; - nameField: string; - countField: string; - active: number; -}>; -export default _default; diff --git a/typings/steps/src/pc.vue.d.ts b/typings/steps/src/pc.vue.d.ts deleted file mode 100644 index 175d710ee..000000000 --- a/typings/steps/src/pc.vue.d.ts +++ /dev/null @@ -1,17 +0,0 @@ -declare const _default: { - emits: string[]; - components: { - IconRefres: any; - IconYes: any; - }; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/svg-icon/index.d.ts b/typings/svg-icon/index.d.ts deleted file mode 100644 index 959a9e5c3..000000000 --- a/typings/svg-icon/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import SvgIcon from './src/index.vue'; -import '@opentiny/vue-theme/svg/index.css'; -export default SvgIcon; diff --git a/typings/svg-icon/src/index.vue.d.ts b/typings/svg-icon/src/index.vue.d.ts deleted file mode 100644 index b9b022172..000000000 --- a/typings/svg-icon/src/index.vue.d.ts +++ /dev/null @@ -1,23 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - src: { - type: StringConstructor; - required: true; - }; - width: StringConstructor; - height: StringConstructor; - fill: StringConstructor; -}, unknown, unknown, { - styleExternalIcon(): { - mask: string; - '-webkit-mask': string; - }; -}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, {}>; -export default _default; diff --git a/typings/switch/index.d.ts b/typings/switch/index.d.ts deleted file mode 100644 index 8681855f5..000000000 --- a/typings/switch/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Switch from './src/index'; -export default Switch; diff --git a/typings/switch/src/index.d.ts b/typings/switch/src/index.d.ts deleted file mode 100644 index 1cfb695a0..000000000 --- a/typings/switch/src/index.d.ts +++ /dev/null @@ -1,86 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - PC_PREFIXCLS: string; - MOBILE_PREFIXCLS: string; - Mode: string; - prefixcls(mode: any): string; - }; - }; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - falseColor: StringConstructor; - falseValue: { - type: (BooleanConstructor | StringConstructor | NumberConstructor)[]; - default: boolean; - }; - mini: { - type: BooleanConstructor; - default: boolean; - }; - modelValue: { - type: (BooleanConstructor | StringConstructor | NumberConstructor)[]; - default: boolean; - }; - size: (StringConstructor | NumberConstructor)[]; - tabindex: { - type: StringConstructor; - default: string; - }; - trueColor: StringConstructor; - trueValue: { - type: (BooleanConstructor | StringConstructor | NumberConstructor)[]; - default: boolean; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "change"[], "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - PC_PREFIXCLS: string; - MOBILE_PREFIXCLS: string; - Mode: string; - prefixcls(mode: any): string; - }; - }; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - falseColor: StringConstructor; - falseValue: { - type: (BooleanConstructor | StringConstructor | NumberConstructor)[]; - default: boolean; - }; - mini: { - type: BooleanConstructor; - default: boolean; - }; - modelValue: { - type: (BooleanConstructor | StringConstructor | NumberConstructor)[]; - default: boolean; - }; - size: (StringConstructor | NumberConstructor)[]; - tabindex: { - type: StringConstructor; - default: string; - }; - trueColor: StringConstructor; - trueValue: { - type: (BooleanConstructor | StringConstructor | NumberConstructor)[]; - default: boolean; - }; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - modelValue: string | number | boolean; - tabindex: string; - disabled: boolean; - mini: boolean; - trueValue: string | number | boolean; - falseValue: string | number | boolean; -}>; -export default _default; diff --git a/typings/switch/src/mobile.vue.d.ts b/typings/switch/src/mobile.vue.d.ts deleted file mode 100644 index 8ae23e36b..000000000 --- a/typings/switch/src/mobile.vue.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -import '@opentiny/vue-theme-mobile/switch/index.css'; -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/switch/src/pc.vue.d.ts b/typings/switch/src/pc.vue.d.ts deleted file mode 100644 index 258c54726..000000000 --- a/typings/switch/src/pc.vue.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -import '@opentiny/vue-theme/switch/index.css'; -declare const _default: { - emits: string[]; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/tab-item/index.d.ts b/typings/tab-item/index.d.ts deleted file mode 100644 index cb2ea3bf3..000000000 --- a/typings/tab-item/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import TabItem from './src/index.vue'; -export default TabItem; diff --git a/typings/tab-item/src/index.vue.d.ts b/typings/tab-item/src/index.vue.d.ts deleted file mode 100644 index a894c1b46..000000000 --- a/typings/tab-item/src/index.vue.d.ts +++ /dev/null @@ -1,27 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - title: StringConstructor; - labelContent: FunctionConstructor; - name: StringConstructor; - withClose: BooleanConstructor; - disabled: BooleanConstructor; - lazy: BooleanConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - disabled: boolean; - lazy: boolean; - withClose: boolean; -}>; -export default _default; diff --git a/typings/tabbar-item/index.d.ts b/typings/tabbar-item/index.d.ts deleted file mode 100644 index e5a760510..000000000 --- a/typings/tabbar-item/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import TabbarItem from './src/index.vue'; -import '@opentiny/vue-theme-mobile/tabbar-item/index.css'; -export default TabbarItem; diff --git a/typings/tabbar-item/src/index.vue.d.ts b/typings/tabbar-item/src/index.vue.d.ts deleted file mode 100644 index df038d5e9..000000000 --- a/typings/tabbar-item/src/index.vue.d.ts +++ /dev/null @@ -1,23 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - url: StringConstructor; - replace: BooleanConstructor; - to: (ObjectConstructor | StringConstructor)[]; - dot: BooleanConstructor; - icon: ObjectConstructor; - name: (StringConstructor | NumberConstructor)[]; - info: (StringConstructor | NumberConstructor)[]; - badge: (StringConstructor | NumberConstructor)[]; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - replace: boolean; - dot: boolean; -}>; -export default _default; diff --git a/typings/tabbar-item/src/mobile.vue.d.ts b/typings/tabbar-item/src/mobile.vue.d.ts deleted file mode 100644 index f5d461606..000000000 --- a/typings/tabbar-item/src/mobile.vue.d.ts +++ /dev/null @@ -1,12 +0,0 @@ -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/tabbar/index.d.ts b/typings/tabbar/index.d.ts deleted file mode 100644 index fa1d47138..000000000 --- a/typings/tabbar/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Tabbar from './src/index.vue'; -import '@opentiny/vue-theme-mobile/tabbar/index.css'; -export default Tabbar; diff --git a/typings/tabbar/src/index.vue.d.ts b/typings/tabbar/src/index.vue.d.ts deleted file mode 100644 index 39f085039..000000000 --- a/typings/tabbar/src/index.vue.d.ts +++ /dev/null @@ -1,60 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - activeColor: StringConstructor; - border: { - type: BooleanConstructor; - default: boolean; - }; - fixed: { - type: BooleanConstructor; - default: boolean; - }; - inactiveColor: StringConstructor; - modelValue: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - }; - placeholder: BooleanConstructor; - route: BooleanConstructor; - safeAreaInsetBottom: { - type: BooleanConstructor; - default: null; - }; - zIndex: (StringConstructor | NumberConstructor)[]; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - route: boolean; - fixed: boolean; - modelValue: string | number; - placeholder: boolean; - border: boolean; - safeAreaInsetBottom: boolean; -}>; -export default _default; diff --git a/typings/table/index.d.ts b/typings/table/index.d.ts deleted file mode 100644 index 4dd1281f1..000000000 --- a/typings/table/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Table from './src/index.vue'; -import '@opentiny/vue-theme/table/index.css'; -export default Table; diff --git a/typings/table/src/index.vue.d.ts b/typings/table/src/index.vue.d.ts deleted file mode 100644 index b34a65e9b..000000000 --- a/typings/table/src/index.vue.d.ts +++ /dev/null @@ -1,21 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - columns: ArrayConstructor; - data: ArrayConstructor; - width: StringConstructor; - defaultChecked: ArrayConstructor; - keys: StringConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, {}>; -export default _default; diff --git a/typings/tabs/index.d.ts b/typings/tabs/index.d.ts deleted file mode 100644 index 903284893..000000000 --- a/typings/tabs/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Tabs from './src/index'; -export default Tabs; diff --git a/typings/tabs/src/index.d.ts b/typings/tabs/src/index.d.ts deleted file mode 100644 index 7a2a1924f..000000000 --- a/typings/tabs/src/index.d.ts +++ /dev/null @@ -1,95 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - TAB_ITEM: string; - }; - }; - tabStyle: StringConstructor; - activeName: StringConstructor; - withClose: BooleanConstructor; - withAdd: BooleanConstructor; - size: StringConstructor; - activeColor: { - type: StringConstructor; - default: string; - }; - modelValue: {}; - editable: BooleanConstructor; - position: { - type: StringConstructor; - default: string; - }; - beforeLeave: FunctionConstructor; - stretch: BooleanConstructor; - showMoreTabs: BooleanConstructor; - swipeable: { - type: BooleanConstructor; - default: boolean; - }; - popperClass: StringConstructor; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - dropConfig: { - type: ObjectConstructor; - default: () => null; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click" | "edit" | "close" | "add")[], "click" | "edit" | "close" | "add", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - TAB_ITEM: string; - }; - }; - tabStyle: StringConstructor; - activeName: StringConstructor; - withClose: BooleanConstructor; - withAdd: BooleanConstructor; - size: StringConstructor; - activeColor: { - type: StringConstructor; - default: string; - }; - modelValue: {}; - editable: BooleanConstructor; - position: { - type: StringConstructor; - default: string; - }; - beforeLeave: FunctionConstructor; - stretch: BooleanConstructor; - showMoreTabs: BooleanConstructor; - swipeable: { - type: BooleanConstructor; - default: boolean; - }; - popperClass: StringConstructor; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - dropConfig: { - type: ObjectConstructor; - default: () => null; - }; -}>> & { - onClick?: ((...args: any[]) => any) | undefined; - onClose?: ((...args: any[]) => any) | undefined; - onEdit?: ((...args: any[]) => any) | undefined; - onAdd?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - popperAppendToBody: boolean; - activeColor: string; - position: string; - stretch: boolean; - editable: boolean; - withClose: boolean; - showMoreTabs: boolean; - withAdd: boolean; - swipeable: boolean; - dropConfig: Record; -}>; -export default _default; diff --git a/typings/tabs/src/mobile.vue.d.ts b/typings/tabs/src/mobile.vue.d.ts deleted file mode 100644 index 9cc4f8809..000000000 --- a/typings/tabs/src/mobile.vue.d.ts +++ /dev/null @@ -1,58 +0,0 @@ -import '@opentiny/vue-theme-mobile/tabs/index.css'; -declare const _default: { - props: string[]; - components: { - TabNav: { - name: string; - components: { - IconClose: any; - }; - emits: string[]; - props: { - panes: { - type: ArrayConstructor; - default: () => never[]; - }; - currentName: StringConstructor; - activeColor: { - type: StringConstructor; - default: string; - }; - onTabClick: { - type: FunctionConstructor; - default: () => void; - }; - onTabRemove: { - type: FunctionConstructor; - default: () => void; - }; - showMoreTabs: BooleanConstructor; - showPanesCount: NumberConstructor; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - render(): JSX.Element; - }; - IconPlus: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - methods: { - getCurIndex(): number; - onTouchEnd(): void; - }; - render(): JSX.Element; -}; -export default _default; diff --git a/typings/tabs/src/pc.vue.d.ts b/typings/tabs/src/pc.vue.d.ts deleted file mode 100644 index 968d7aa11..000000000 --- a/typings/tabs/src/pc.vue.d.ts +++ /dev/null @@ -1,81 +0,0 @@ -import '@opentiny/vue-theme/tabs/index.css'; -declare const _default: { - emits: string[]; - props: string[]; - components: { - TabNav: { - name: string; - components: { - TabBar: { - name: string; - emits: string[]; - props: { - tabs: ArrayConstructor; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - }; - Popover: any; - IconChevronLeft: any; - IconChevronRight: any; - IconClose: any; - }; - emits: string[]; - props: { - panes: { - type: ArrayConstructor; - default: () => never[]; - }; - currentName: StringConstructor; - editable: BooleanConstructor; - onTabClick: { - type: FunctionConstructor; - default: () => void; - }; - onTabRemove: { - type: FunctionConstructor; - default: () => void; - }; - tabStyle: StringConstructor; - stretch: BooleanConstructor; - showMoreTabs: BooleanConstructor; - showPanesCount: NumberConstructor; - popperClass: StringConstructor; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - dropConfig: { - type: ObjectConstructor; - default: () => null; - }; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - render(): JSX.Element; - }; - IconPlus: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - render(): JSX.Element; -}; -export default _default; diff --git a/typings/tabs/src/tab-nav/index.vue.d.ts b/typings/tabs/src/tab-nav/index.vue.d.ts deleted file mode 100644 index ac9d4fc4e..000000000 --- a/typings/tabs/src/tab-nav/index.vue.d.ts +++ /dev/null @@ -1,64 +0,0 @@ -declare const _default: { - name: string; - components: { - TabBar: { - name: string; - emits: string[]; - props: { - tabs: ArrayConstructor; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - }; - Popover: any; - IconChevronLeft: any; - IconChevronRight: any; - IconClose: any; - }; - emits: string[]; - props: { - panes: { - type: ArrayConstructor; - default: () => never[]; - }; - currentName: StringConstructor; - editable: BooleanConstructor; - onTabClick: { - type: FunctionConstructor; - default: () => void; - }; - onTabRemove: { - type: FunctionConstructor; - default: () => void; - }; - tabStyle: StringConstructor; - stretch: BooleanConstructor; - showMoreTabs: BooleanConstructor; - showPanesCount: NumberConstructor; - popperClass: StringConstructor; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - dropConfig: { - type: ObjectConstructor; - default: () => null; - }; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - render(): JSX.Element; -}; -export default _default; diff --git a/typings/tabs/src/tab-nav/mb.vue.d.ts b/typings/tabs/src/tab-nav/mb.vue.d.ts deleted file mode 100644 index f68d21c36..000000000 --- a/typings/tabs/src/tab-nav/mb.vue.d.ts +++ /dev/null @@ -1,38 +0,0 @@ -declare const _default: { - name: string; - components: { - IconClose: any; - }; - emits: string[]; - props: { - panes: { - type: ArrayConstructor; - default: () => never[]; - }; - currentName: StringConstructor; - activeColor: { - type: StringConstructor; - default: string; - }; - onTabClick: { - type: FunctionConstructor; - default: () => void; - }; - onTabRemove: { - type: FunctionConstructor; - default: () => void; - }; - showMoreTabs: BooleanConstructor; - showPanesCount: NumberConstructor; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - render(): JSX.Element; -}; -export default _default; diff --git a/typings/tabs/src/tab-nav/tab-bar.vue.d.ts b/typings/tabs/src/tab-nav/tab-bar.vue.d.ts deleted file mode 100644 index ea6a0afb6..000000000 --- a/typings/tabs/src/tab-nav/tab-bar.vue.d.ts +++ /dev/null @@ -1,16 +0,0 @@ -declare const _default: { - name: string; - emits: string[]; - props: { - tabs: ArrayConstructor; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/tag/index.d.ts b/typings/tag/index.d.ts deleted file mode 100644 index dc9f03062..000000000 --- a/typings/tag/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Tag from './src/index'; -import '@opentiny/vue-theme/tag/index.css'; -export default Tag; diff --git a/typings/tag/src/index.d.ts b/typings/tag/src/index.d.ts deleted file mode 100644 index 204540044..000000000 --- a/typings/tag/src/index.d.ts +++ /dev/null @@ -1,31 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - hit: BooleanConstructor; - text: StringConstructor; - type: StringConstructor; - size: StringConstructor; - color: StringConstructor; - closable: BooleanConstructor; - effect: { - type: StringConstructor; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click" | "close")[], "click" | "close", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onClick?: ((...args: any[]) => any) | undefined; - onClose?: ((...args: any[]) => any) | undefined; -}, { - effect: string; - closable: boolean; - hit: boolean; -}>; -export default _default; diff --git a/typings/tag/src/pc.vue.d.ts b/typings/tag/src/pc.vue.d.ts deleted file mode 100644 index 54c8f3cdf..000000000 --- a/typings/tag/src/pc.vue.d.ts +++ /dev/null @@ -1,17 +0,0 @@ -declare const _default: { - components: { - IconClose: any; - }; - emits: string[]; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - render(): JSX.Element; -}; -export default _default; diff --git a/typings/text-popup/index.d.ts b/typings/text-popup/index.d.ts deleted file mode 100644 index ee4320bba..000000000 --- a/typings/text-popup/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import TextPopup from './src/index'; -import '@opentiny/vue-theme/text-popup/index.css'; -export default TextPopup; diff --git a/typings/text-popup/src/index.d.ts b/typings/text-popup/src/index.d.ts deleted file mode 100644 index 94b9b432d..000000000 --- a/typings/text-popup/src/index.d.ts +++ /dev/null @@ -1,49 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - modelValue: { - default: string; - }; - placeholder: { - type: StringConstructor; - required: false; - }; - readonly: { - type: BooleanConstructor; - default: boolean; - }; - width: { - type: (StringConstructor | NumberConstructor)[]; - default: number; - validator(value: unknown): boolean; - }; - separtor: { - type: StringConstructor; - default: string; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - width: string | number; - readonly: boolean; - modelValue: string; - separtor: string; -}>; -export default _default; diff --git a/typings/text-popup/src/pc.vue.d.ts b/typings/text-popup/src/pc.vue.d.ts deleted file mode 100644 index f5d461606..000000000 --- a/typings/text-popup/src/pc.vue.d.ts +++ /dev/null @@ -1,12 +0,0 @@ -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/time-line/index.d.ts b/typings/time-line/index.d.ts deleted file mode 100644 index 2457b1754..000000000 --- a/typings/time-line/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import TimeLine from './src/index'; -export default TimeLine; diff --git a/typings/time-line/src/index.d.ts b/typings/time-line/src/index.d.ts deleted file mode 100644 index eda83a574..000000000 --- a/typings/time-line/src/index.d.ts +++ /dev/null @@ -1,109 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - PROCESS_DONE_CLS: string; - PROCESS_CUR_CLS: string; - PROCESS_WAIT_CLS: string; - }; - }; - vertical: { - type: BooleanConstructor; - default: boolean; - }; - horizontal: { - type: BooleanConstructor; - default: boolean; - }; - showNumber: { - type: BooleanConstructor; - default: boolean; - }; - nameField: { - type: StringConstructor; - default: string; - }; - timeField: { - type: StringConstructor; - default: string; - }; - start: { - type: NumberConstructor; - default: number; - }; - data: ArrayConstructor; - space: NumberConstructor; - active: { - type: NumberConstructor; - default: number; - }; - reverse: { - type: BooleanConstructor; - default: boolean; - }; - showStatus: { - type: BooleanConstructor; - default: boolean; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "click"[], "click", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - PROCESS_DONE_CLS: string; - PROCESS_CUR_CLS: string; - PROCESS_WAIT_CLS: string; - }; - }; - vertical: { - type: BooleanConstructor; - default: boolean; - }; - horizontal: { - type: BooleanConstructor; - default: boolean; - }; - showNumber: { - type: BooleanConstructor; - default: boolean; - }; - nameField: { - type: StringConstructor; - default: string; - }; - timeField: { - type: StringConstructor; - default: string; - }; - start: { - type: NumberConstructor; - default: number; - }; - data: ArrayConstructor; - space: NumberConstructor; - active: { - type: NumberConstructor; - default: number; - }; - reverse: { - type: BooleanConstructor; - default: boolean; - }; - showStatus: { - type: BooleanConstructor; - default: boolean; - }; -}>> & { - onClick?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - reverse: boolean; - vertical: boolean; - start: number; - timeField: string; - showNumber: boolean; - nameField: string; - horizontal: boolean; - active: number; - showStatus: boolean; -}>; -export default _default; diff --git a/typings/time-line/src/mobile.vue.d.ts b/typings/time-line/src/mobile.vue.d.ts deleted file mode 100644 index d68c73b5b..000000000 --- a/typings/time-line/src/mobile.vue.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -import '@opentiny/vue-theme-mobile/time-line/index.css'; -declare const _default: { - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/time-line/src/pc.vue.d.ts b/typings/time-line/src/pc.vue.d.ts deleted file mode 100644 index a3147ed13..000000000 --- a/typings/time-line/src/pc.vue.d.ts +++ /dev/null @@ -1,17 +0,0 @@ -import '@opentiny/vue-theme/steps/index.css'; -declare const _default: { - emits: string[]; - props: string[]; - components: { - IconYes: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/time-panel/index.d.ts b/typings/time-panel/index.d.ts deleted file mode 100644 index 59f98c5f1..000000000 --- a/typings/time-panel/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import TimePanel from './src/index.vue'; -export default TimePanel; diff --git a/typings/time-panel/src/index.vue.d.ts b/typings/time-panel/src/index.vue.d.ts deleted file mode 100644 index ac93e3f77..000000000 --- a/typings/time-panel/src/index.vue.d.ts +++ /dev/null @@ -1,16 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - emitter: ObjectConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("pick" | "dodestroy")[], "pick" | "dodestroy", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onPick?: ((...args: any[]) => any) | undefined; - onDodestroy?: ((...args: any[]) => any) | undefined; -}, {}>; -export default _default; diff --git a/typings/time-picker/index.d.ts b/typings/time-picker/index.d.ts deleted file mode 100644 index 49dbb8973..000000000 --- a/typings/time-picker/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const TimePicker: any; -export default TimePicker; diff --git a/typings/time-picker/src/index.vue.d.ts b/typings/time-picker/src/index.vue.d.ts deleted file mode 100644 index 5298df7f0..000000000 --- a/typings/time-picker/src/index.vue.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: any; -export default _default; diff --git a/typings/time-range/index.d.ts b/typings/time-range/index.d.ts deleted file mode 100644 index f45579255..000000000 --- a/typings/time-range/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import TimeRange from './src/index.vue'; -export default TimeRange; diff --git a/typings/time-range/src/index.vue.d.ts b/typings/time-range/src/index.vue.d.ts deleted file mode 100644 index b5a4d7de7..000000000 --- a/typings/time-range/src/index.vue.d.ts +++ /dev/null @@ -1,17 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - emitter: ObjectConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("pick" | "dodestroy" | "select-range")[], "pick" | "dodestroy" | "select-range", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onPick?: ((...args: any[]) => any) | undefined; - onDodestroy?: ((...args: any[]) => any) | undefined; - "onSelect-range"?: ((...args: any[]) => any) | undefined; -}, {}>; -export default _default; diff --git a/typings/time-select/index.d.ts b/typings/time-select/index.d.ts deleted file mode 100644 index 2835ec281..000000000 --- a/typings/time-select/index.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const TimeSelect: any; -export default TimeSelect; diff --git a/typings/time-select/src/index.vue.d.ts b/typings/time-select/src/index.vue.d.ts deleted file mode 100644 index 5298df7f0..000000000 --- a/typings/time-select/src/index.vue.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const _default: any; -export default _default; diff --git a/typings/time-spinner/index.d.ts b/typings/time-spinner/index.d.ts deleted file mode 100644 index 0c0c9bf1f..000000000 --- a/typings/time-spinner/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import TimeSpinner from './src/index.vue'; -export default TimeSpinner; diff --git a/typings/time-spinner/src/index.vue.d.ts b/typings/time-spinner/src/index.vue.d.ts deleted file mode 100644 index f6029f85d..000000000 --- a/typings/time-spinner/src/index.vue.d.ts +++ /dev/null @@ -1,53 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - ANIMATIONNAME: string; - }; - }; - date: {}; - defaultValue: {}; - showSeconds: { - type: BooleanConstructor; - default: boolean; - }; - arrowControl: BooleanConstructor; - amPmMode: { - type: StringConstructor; - default: string; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "select-range")[], "change" | "select-range", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - ANIMATIONNAME: string; - }; - }; - date: {}; - defaultValue: {}; - showSeconds: { - type: BooleanConstructor; - default: boolean; - }; - arrowControl: BooleanConstructor; - amPmMode: { - type: StringConstructor; - default: string; - }; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; - "onSelect-range"?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - arrowControl: boolean; - showSeconds: boolean; - amPmMode: string; -}>; -export default _default; diff --git a/typings/time/index.d.ts b/typings/time/index.d.ts deleted file mode 100644 index a3be6bc00..000000000 --- a/typings/time/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Time from './src/index.vue'; -export default Time; diff --git a/typings/time/src/index.vue.d.ts b/typings/time/src/index.vue.d.ts deleted file mode 100644 index 3a8643ee0..000000000 --- a/typings/time/src/index.vue.d.ts +++ /dev/null @@ -1,26 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - show: BooleanConstructor; - timeArrowControl: BooleanConstructor; - emitter: ObjectConstructor; - value: DateConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("pick" | "dodestroy" | "select-range")[], "pick" | "dodestroy" | "select-range", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onPick?: ((...args: any[]) => any) | undefined; - onDodestroy?: ((...args: any[]) => any) | undefined; - "onSelect-range"?: ((...args: any[]) => any) | undefined; -}, { - show: boolean; - timeArrowControl: boolean; -}>; -export default _default; diff --git a/typings/toggle-menu/index.d.ts b/typings/toggle-menu/index.d.ts deleted file mode 100644 index 18af3e73e..000000000 --- a/typings/toggle-menu/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import ToggleMenu from './src/index.js'; -import '@opentiny/vue-theme/toggle-menu/index.css'; -export default ToggleMenu; diff --git a/typings/toggle-menu/src/index.d.ts b/typings/toggle-menu/src/index.d.ts deleted file mode 100644 index 156abe2d3..000000000 --- a/typings/toggle-menu/src/index.d.ts +++ /dev/null @@ -1,133 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - LOCALE_PLACEHOLDER: string; - }; - }; - data: ArrayConstructor; - placeholder: { - type: StringConstructor; - default: string; - }; - icon: ObjectConstructor; - defaultExpandAll: { - type: BooleanConstructor; - default: boolean; - }; - draggable: { - type: BooleanConstructor; - default: boolean; - }; - expandOnClickNode: { - type: BooleanConstructor; - default: boolean; - }; - ellipsis: { - type: BooleanConstructor; - default: boolean; - }; - wrap: { - type: BooleanConstructor; - default: boolean; - }; - showFilter: { - type: BooleanConstructor; - default: boolean; - }; - automaticFiltering: { - type: BooleanConstructor; - default: boolean; - }; - props: { - default: () => { - children: string; - disabled: string; - label: string; - }; - }; - getMenuDataSync: FunctionConstructor; - accordion: BooleanConstructor; - defaultCheckedKeys: ArrayConstructor; - showCheckbox: BooleanConstructor; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("node-collapse" | "node-expand" | "node-click" | "node-drag-end" | "node-drag-enter" | "node-drag-leave" | "node-drag-over" | "node-drag-start" | "node-drop")[], "node-collapse" | "node-expand" | "node-click" | "node-drag-end" | "node-drag-enter" | "node-drag-leave" | "node-drag-over" | "node-drag-start" | "node-drop", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - LOCALE_PLACEHOLDER: string; - }; - }; - data: ArrayConstructor; - placeholder: { - type: StringConstructor; - default: string; - }; - icon: ObjectConstructor; - defaultExpandAll: { - type: BooleanConstructor; - default: boolean; - }; - draggable: { - type: BooleanConstructor; - default: boolean; - }; - expandOnClickNode: { - type: BooleanConstructor; - default: boolean; - }; - ellipsis: { - type: BooleanConstructor; - default: boolean; - }; - wrap: { - type: BooleanConstructor; - default: boolean; - }; - showFilter: { - type: BooleanConstructor; - default: boolean; - }; - automaticFiltering: { - type: BooleanConstructor; - default: boolean; - }; - props: { - default: () => { - children: string; - disabled: string; - label: string; - }; - }; - getMenuDataSync: FunctionConstructor; - accordion: BooleanConstructor; - defaultCheckedKeys: ArrayConstructor; - showCheckbox: BooleanConstructor; -}>> & { - "onNode-collapse"?: ((...args: any[]) => any) | undefined; - "onNode-expand"?: ((...args: any[]) => any) | undefined; - "onNode-click"?: ((...args: any[]) => any) | undefined; - "onNode-drag-end"?: ((...args: any[]) => any) | undefined; - "onNode-drag-enter"?: ((...args: any[]) => any) | undefined; - "onNode-drag-leave"?: ((...args: any[]) => any) | undefined; - "onNode-drag-over"?: ((...args: any[]) => any) | undefined; - "onNode-drag-start"?: ((...args: any[]) => any) | undefined; - "onNode-drop"?: ((...args: any[]) => any) | undefined; -}, { - props: { - children: string; - disabled: string; - label: string; - }; - _constants: Record; - ellipsis: boolean; - placeholder: string; - accordion: boolean; - draggable: boolean; - defaultExpandAll: boolean; - wrap: boolean; - showCheckbox: boolean; - automaticFiltering: boolean; - expandOnClickNode: boolean; - showFilter: boolean; -}>; -export default _default; diff --git a/typings/toggle-menu/src/pc.vue.d.ts b/typings/toggle-menu/src/pc.vue.d.ts deleted file mode 100644 index f64aefa9b..000000000 --- a/typings/toggle-menu/src/pc.vue.d.ts +++ /dev/null @@ -1,19 +0,0 @@ -declare const _default: { - props: string[]; - components: { - TinyTree: any; - TinyInput: any; - TinyIconSearch: any; - TinyIconChevronLeft: any; - TinyIconChevronRight: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/tooltip/index.d.ts b/typings/tooltip/index.d.ts deleted file mode 100644 index 886882139..000000000 --- a/typings/tooltip/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Tooltip from './src/index.vue'; -import '@opentiny/vue-theme/tooltip/index.css'; -export default Tooltip; diff --git a/typings/tooltip/src/index.vue.d.ts b/typings/tooltip/src/index.vue.d.ts deleted file mode 100644 index 0a4305853..000000000 --- a/typings/tooltip/src/index.vue.d.ts +++ /dev/null @@ -1,226 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - adjustArrow: { - type: BooleanConstructor; - default: () => boolean; - }; - appendToBody: { - type: BooleanConstructor; - default: () => boolean; - }; - arrowOffset: { - type: NumberConstructor; - default: () => number; - }; - boundariesPadding: { - type: NumberConstructor; - default: () => number; - }; - closeDelay: { - type: NumberConstructor; - default: () => number; - }; - content: { - type: StringConstructor; - }; - disabled: { - type: BooleanConstructor; - }; - effect: { - type: StringConstructor; - default: () => string; - }; - enterable: { - type: BooleanConstructor; - default: () => boolean; - }; - hideAfter: { - type: NumberConstructor; - default: () => number; - }; - manual: { - type: BooleanConstructor; - }; - modelValue: { - type: BooleanConstructor; - }; - offset: { - default: () => number; - }; - openDelay: { - type: NumberConstructor; - default: () => number; - }; - placement: { - type: StringConstructor; - default: () => string; - }; - popper: {}; - popperClass: { - type: StringConstructor; - }; - popperOptions: { - default: () => { - gpuAcceleration: boolean; - boundariesPadding: number; - }; - }; - pre: { - type: BooleanConstructor; - }; - reference: {}; - renderContent: { - type: FunctionConstructor; - }; - tabindex: { - type: NumberConstructor; - default: () => number; - }; - transformOrigin: { - type: (BooleanConstructor | StringConstructor)[]; - default: () => boolean; - }; - transition: { - type: StringConstructor; - default: () => string; - }; - type: { - type: StringConstructor; - }; - visibleArrow: { - type: BooleanConstructor; - default: () => boolean; - }; - zIndex: { - type: StringConstructor; - default: () => string; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly boolean; - }; - appendToBody: { - type: BooleanConstructor; - default: () => boolean; - }; - arrowOffset: { - type: NumberConstructor; - default: () => number; - }; - boundariesPadding: { - type: NumberConstructor; - default: () => number; - }; - closeDelay: { - type: NumberConstructor; - default: () => number; - }; - content: { - type: StringConstructor; - }; - disabled: { - type: BooleanConstructor; - }; - effect: { - type: StringConstructor; - default: () => string; - }; - enterable: { - type: BooleanConstructor; - default: () => boolean; - }; - hideAfter: { - type: NumberConstructor; - default: () => number; - }; - manual: { - type: BooleanConstructor; - }; - modelValue: { - type: BooleanConstructor; - }; - offset: { - default: () => number; - }; - openDelay: { - type: NumberConstructor; - default: () => number; - }; - placement: { - type: StringConstructor; - default: () => string; - }; - popper: {}; - popperClass: { - type: StringConstructor; - }; - popperOptions: { - default: () => { - gpuAcceleration: boolean; - boundariesPadding: number; - }; - }; - pre: { - type: BooleanConstructor; - }; - reference: {}; - renderContent: { - type: FunctionConstructor; - }; - tabindex: { - type: NumberConstructor; - default: () => number; - }; - transformOrigin: { - type: (BooleanConstructor | StringConstructor)[]; - default: () => boolean; - }; - transition: { - type: StringConstructor; - default: () => string; - }; - type: { - type: StringConstructor; - }; - visibleArrow: { - type: BooleanConstructor; - default: () => boolean; - }; - zIndex: { - type: StringConstructor; - default: () => string; - }; -}>>, { - pre: boolean; - transition: string; - effect: string; - modelValue: boolean; - tabindex: number; - disabled: boolean; - manual: boolean; - popperOptions: { - gpuAcceleration: boolean; - boundariesPadding: number; - }; - placement: string; - visibleArrow: boolean; - offset: number; - boundariesPadding: number; - arrowOffset: number; - appendToBody: boolean; - zIndex: string; - closeDelay: number; - openDelay: number; - transformOrigin: string | boolean; - adjustArrow: boolean; - enterable: boolean; - hideAfter: number; -}>; -export default _default; diff --git a/typings/top-box/index.d.ts b/typings/top-box/index.d.ts deleted file mode 100644 index a9897fa35..000000000 --- a/typings/top-box/index.d.ts +++ /dev/null @@ -1,8 +0,0 @@ -import '@opentiny/vue-theme/top-box/index.css'; -declare const TopBox: { - (options: any): any; - close(id: any, userOnClose: any): void; - closeAll(): void; - version: string | undefined; -}; -export default TopBox; diff --git a/typings/top-box/src/index.d.ts b/typings/top-box/src/index.d.ts deleted file mode 100644 index 417bfa941..000000000 --- a/typings/top-box/src/index.d.ts +++ /dev/null @@ -1,28 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - emitter: ObjectConstructor; - _constants: { - type: ObjectConstructor; - default: () => { - SUCCESS: string; - INFO: string; - WARNING: string; - ERROR: string; - HELP: string; - }; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - SUCCESS: string; - INFO: string; - WARNING: string; - ERROR: string; - HELP: string; - }; - }; -}>>, { - _constants: Record; -}>; -export default _default; diff --git a/typings/top-box/src/pc.vue.d.ts b/typings/top-box/src/pc.vue.d.ts deleted file mode 100644 index 12f1f4afa..000000000 --- a/typings/top-box/src/pc.vue.d.ts +++ /dev/null @@ -1,21 +0,0 @@ -declare const _default: { - components: { - TinyButton: any; - IconClose: any; - IconSuccess: any; - IconError: any; - IconHelp: any; - IconWarning: any; - IconInfo: any; - }; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/transfer-panel/index.d.ts b/typings/transfer-panel/index.d.ts deleted file mode 100644 index acd3aecba..000000000 --- a/typings/transfer-panel/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import TransferPanel from './src/index.vue'; -export default TransferPanel; diff --git a/typings/transfer-panel/src/index.vue.d.ts b/typings/transfer-panel/src/index.vue.d.ts deleted file mode 100644 index 71155eb9d..000000000 --- a/typings/transfer-panel/src/index.vue.d.ts +++ /dev/null @@ -1,66 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - columns: ArrayConstructor; - data: { - type: ArrayConstructor; - default(): never[]; - }; - defaultChecked: ArrayConstructor; - filterMethod: FunctionConstructor; - filterable: BooleanConstructor; - format: ObjectConstructor; - isToLeft: BooleanConstructor; - optionRender: FunctionConstructor; - pagerOp: ObjectConstructor; - placeholder: StringConstructor; - props: ObjectConstructor; - render: ObjectConstructor; - renderContent: FunctionConstructor; - showLeft: BooleanConstructor; - showPager: BooleanConstructor; - title: StringConstructor; - treeOp: ObjectConstructor; - value: { - type: ArrayConstructor; - default(): never[]; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - data: unknown[]; - value: unknown[]; - filterable: boolean; - showPager: boolean; - isToLeft: boolean; - showLeft: boolean; -}>; -export default _default; diff --git a/typings/transfer/index.d.ts b/typings/transfer/index.d.ts deleted file mode 100644 index 9586c082e..000000000 --- a/typings/transfer/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Transfer from './src/index.js'; -import '@opentiny/vue-theme/transfer/index.css'; -export default Transfer; diff --git a/typings/transfer/src/index.d.ts b/typings/transfer/src/index.d.ts deleted file mode 100644 index cf6e25f7a..000000000 --- a/typings/transfer/src/index.d.ts +++ /dev/null @@ -1,194 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - TARGETORDER: string; - ISCHECKED: string; - DROPPANEL: string; - TRANSFERPANEL: string; - }; - }; - buttonTexts: { - type: ArrayConstructor; - default: () => never[]; - }; - columns: ArrayConstructor; - data: { - type: ArrayConstructor; - default: () => never[]; - }; - dropConfig: ObjectConstructor; - filterMethod: FunctionConstructor; - filterPlaceholder: { - type: StringConstructor; - default: string; - }; - filterable: BooleanConstructor; - format: { - type: ObjectConstructor; - default: () => {}; - }; - leftDefaultChecked: { - type: ArrayConstructor; - default: () => never[]; - }; - modelValue: { - type: ArrayConstructor; - default: () => never[]; - }; - pagerOp: { - type: ObjectConstructor; - default: () => { - mode: string; - pageVO: { - currentPage: number; - pageSize: number; - }; - }; - }; - props: { - type: ObjectConstructor; - default: () => { - label: string; - key: string; - disabled: string; - }; - }; - render: ObjectConstructor; - renderContent: FunctionConstructor; - renderType: StringConstructor; - rightDefaultChecked: { - type: ArrayConstructor; - default: () => never[]; - }; - showAllBtn: BooleanConstructor; - showPager: { - type: BooleanConstructor; - default: boolean; - }; - targetOrder: { - type: StringConstructor; - default: string; - }; - titles: { - type: ArrayConstructor; - default: () => never[]; - }; - toLeftDisable: { - type: BooleanConstructor; - default: boolean; - }; - toRightDisable: { - type: BooleanConstructor; - default: boolean; - }; - treeOp: ObjectConstructor; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "left-check-change" | "right-check-change")[], "change" | "left-check-change" | "right-check-change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - TARGETORDER: string; - ISCHECKED: string; - DROPPANEL: string; - TRANSFERPANEL: string; - }; - }; - buttonTexts: { - type: ArrayConstructor; - default: () => never[]; - }; - columns: ArrayConstructor; - data: { - type: ArrayConstructor; - default: () => never[]; - }; - dropConfig: ObjectConstructor; - filterMethod: FunctionConstructor; - filterPlaceholder: { - type: StringConstructor; - default: string; - }; - filterable: BooleanConstructor; - format: { - type: ObjectConstructor; - default: () => {}; - }; - leftDefaultChecked: { - type: ArrayConstructor; - default: () => never[]; - }; - modelValue: { - type: ArrayConstructor; - default: () => never[]; - }; - pagerOp: { - type: ObjectConstructor; - default: () => { - mode: string; - pageVO: { - currentPage: number; - pageSize: number; - }; - }; - }; - props: { - type: ObjectConstructor; - default: () => { - label: string; - key: string; - disabled: string; - }; - }; - render: ObjectConstructor; - renderContent: FunctionConstructor; - renderType: StringConstructor; - rightDefaultChecked: { - type: ArrayConstructor; - default: () => never[]; - }; - showAllBtn: BooleanConstructor; - showPager: { - type: BooleanConstructor; - default: boolean; - }; - targetOrder: { - type: StringConstructor; - default: string; - }; - titles: { - type: ArrayConstructor; - default: () => never[]; - }; - toLeftDisable: { - type: BooleanConstructor; - default: boolean; - }; - toRightDisable: { - type: BooleanConstructor; - default: boolean; - }; - treeOp: ObjectConstructor; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; - "onLeft-check-change"?: ((...args: any[]) => any) | undefined; - "onRight-check-change"?: ((...args: any[]) => any) | undefined; -}, { - props: Record; - data: unknown[]; - _constants: Record; - modelValue: unknown[]; - format: Record; - filterable: boolean; - pagerOp: Record; - showPager: boolean; - titles: unknown[]; - buttonTexts: unknown[]; - filterPlaceholder: string; - leftDefaultChecked: unknown[]; - rightDefaultChecked: unknown[]; - targetOrder: string; - showAllBtn: boolean; - toLeftDisable: boolean; - toRightDisable: boolean; -}>; -export default _default; diff --git a/typings/transfer/src/pc.vue.d.ts b/typings/transfer/src/pc.vue.d.ts deleted file mode 100644 index fe2aa5f8d..000000000 --- a/typings/transfer/src/pc.vue.d.ts +++ /dev/null @@ -1,20 +0,0 @@ -declare const _default: { - components: { - TinyButton: any; - TinyTransferPanel: any; - IconDoubleLeft: any; - IconChevronLeft: any; - IconChevronRight: any; - IconDoubleRight: any; - }; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/tree-menu/index.d.ts b/typings/tree-menu/index.d.ts deleted file mode 100644 index 1d2851340..000000000 --- a/typings/tree-menu/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import TreeMenu from './src/index.vue'; -import '@opentiny/vue-theme/tree-menu/index.css'; -export default TreeMenu; diff --git a/typings/tree-menu/src/index.vue.d.ts b/typings/tree-menu/src/index.vue.d.ts deleted file mode 100644 index 7152a3305..000000000 --- a/typings/tree-menu/src/index.vue.d.ts +++ /dev/null @@ -1,146 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - data: ArrayConstructor; - nodeKey: StringConstructor; - defaultExpandAll: BooleanConstructor; - suffixIcon: ObjectConstructor; - prefixIcon: ObjectConstructor; - searchIcon: { - type: ObjectConstructor; - default: () => any; - }; - props: ObjectConstructor; - draggable: { - type: BooleanConstructor; - default: boolean; - }; - emptyText: { - type: StringConstructor; - default: string; - }; - checkStrictly: BooleanConstructor; - lazy: { - type: BooleanConstructor; - default: boolean; - }; - load: FunctionConstructor; - showCheckbox: BooleanConstructor; - filterNodeMethod: FunctionConstructor; - defaultCheckedKeys: ArrayConstructor; - defaultExpandedKeys: ArrayConstructor; - defaultExpandedKeysHighlight: (StringConstructor | NumberConstructor)[]; - indent: { - type: NumberConstructor; - default: number; - }; - allowDrag: FunctionConstructor; - allowDrop: FunctionConstructor; - expandOnClickNode: { - type: BooleanConstructor; - default: boolean; - }; - ellipsis: { - type: BooleanConstructor; - default: boolean; - }; - wrap: { - type: BooleanConstructor; - default: boolean; - }; - getMenuDataSync: FunctionConstructor; - accordion: BooleanConstructor; - showTitle: { - type: BooleanConstructor; - default: boolean; - }; - showFilter: { - type: BooleanConstructor; - default: boolean; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("current-change" | "check-change" | "node-collapse" | "node-expand" | "node-click")[], "current-change" | "check-change" | "node-collapse" | "node-expand" | "node-click", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly any; - }; - props: ObjectConstructor; - draggable: { - type: BooleanConstructor; - default: boolean; - }; - emptyText: { - type: StringConstructor; - default: string; - }; - checkStrictly: BooleanConstructor; - lazy: { - type: BooleanConstructor; - default: boolean; - }; - load: FunctionConstructor; - showCheckbox: BooleanConstructor; - filterNodeMethod: FunctionConstructor; - defaultCheckedKeys: ArrayConstructor; - defaultExpandedKeys: ArrayConstructor; - defaultExpandedKeysHighlight: (StringConstructor | NumberConstructor)[]; - indent: { - type: NumberConstructor; - default: number; - }; - allowDrag: FunctionConstructor; - allowDrop: FunctionConstructor; - expandOnClickNode: { - type: BooleanConstructor; - default: boolean; - }; - ellipsis: { - type: BooleanConstructor; - default: boolean; - }; - wrap: { - type: BooleanConstructor; - default: boolean; - }; - getMenuDataSync: FunctionConstructor; - accordion: BooleanConstructor; - showTitle: { - type: BooleanConstructor; - default: boolean; - }; - showFilter: { - type: BooleanConstructor; - default: boolean; - }; -}>> & { - "onCurrent-change"?: ((...args: any[]) => any) | undefined; - "onCheck-change"?: ((...args: any[]) => any) | undefined; - "onNode-collapse"?: ((...args: any[]) => any) | undefined; - "onNode-expand"?: ((...args: any[]) => any) | undefined; - "onNode-click"?: ((...args: any[]) => any) | undefined; -}, { - ellipsis: boolean; - showTitle: boolean; - checkStrictly: boolean; - accordion: boolean; - draggable: boolean; - lazy: boolean; - defaultExpandAll: boolean; - searchIcon: Record; - wrap: boolean; - showCheckbox: boolean; - expandOnClickNode: boolean; - showFilter: boolean; - emptyText: string; - indent: number; -}>; -export default _default; diff --git a/typings/tree/index.d.ts b/typings/tree/index.d.ts deleted file mode 100644 index 9518ef485..000000000 --- a/typings/tree/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Tree from './src/index.js'; -import '@opentiny/vue-theme/tree/index.css'; -export default Tree; diff --git a/typings/tree/src/index.d.ts b/typings/tree/src/index.d.ts deleted file mode 100644 index c62fd4fd4..000000000 --- a/typings/tree/src/index.d.ts +++ /dev/null @@ -1,203 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - EMPTY_TEXT_LOCAL: string; - }; - }; - accordion: BooleanConstructor; - checkDescendants: { - type: BooleanConstructor; - default: boolean; - }; - allowDrag: FunctionConstructor; - allowDrop: FunctionConstructor; - autoExpandParent: { - type: BooleanConstructor; - default: boolean; - }; - checkOnClickNode: BooleanConstructor; - checkStrictly: BooleanConstructor; - currentNodeKey: (StringConstructor | NumberConstructor)[]; - data: { - type: ArrayConstructor; - }; - dataset: ObjectConstructor; - defaultCheckedKeys: ArrayConstructor; - defaultExpandAll: BooleanConstructor; - defaultExpandedKeys: ArrayConstructor; - defaultExpandedKeysHighlight: (StringConstructor | NumberConstructor)[]; - draggable: { - type: BooleanConstructor; - default: boolean; - }; - emptyText: StringConstructor; - expandIcon: ObjectConstructor; - expandOnClickNode: { - type: BooleanConstructor; - default: boolean; - }; - filterNodeMethod: FunctionConstructor; - highlightCurrent: BooleanConstructor; - icon: ObjectConstructor; - iconTriggerClickNode: { - type: BooleanConstructor; - default: boolean; - }; - indent: { - type: NumberConstructor; - default: number; - }; - lazy: { - type: BooleanConstructor; - default: boolean; - }; - load: FunctionConstructor; - nodeKey: StringConstructor; - parentKey: StringConstructor; - props: { - default(): { - children: string; - label: string; - disabled: string; - }; - }; - renderAfterExpand: { - type: BooleanConstructor; - default: boolean; - }; - renderContent: FunctionConstructor; - showCheckbox: { - type: BooleanConstructor; - default: boolean; - }; - showContextmenu: { - type: BooleanConstructor; - default: boolean; - }; - showRadio: { - type: BooleanConstructor; - default: boolean; - }; - shrinkIcon: ObjectConstructor; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("check" | "current-change" | "check-change" | "node-collapse" | "node-expand" | "node-click" | "node-drag-end" | "node-drag-enter" | "node-drag-leave" | "node-drag-over" | "node-drag-start" | "node-drop" | "node-contextmenu")[], "check" | "current-change" | "check-change" | "node-collapse" | "node-expand" | "node-click" | "node-drag-end" | "node-drag-enter" | "node-drag-leave" | "node-drag-over" | "node-drag-start" | "node-drop" | "node-contextmenu", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - EMPTY_TEXT_LOCAL: string; - }; - }; - accordion: BooleanConstructor; - allowDrag: FunctionConstructor; - checkDescendants: { - type: BooleanConstructor; - default: boolean; - }; - allowDrop: FunctionConstructor; - autoExpandParent: { - type: BooleanConstructor; - default: boolean; - }; - checkOnClickNode: BooleanConstructor; - checkStrictly: BooleanConstructor; - currentNodeKey: (StringConstructor | NumberConstructor)[]; - data: { - type: ArrayConstructor; - }; - dataset: ObjectConstructor; - defaultCheckedKeys: ArrayConstructor; - defaultExpandAll: BooleanConstructor; - defaultExpandedKeys: ArrayConstructor; - defaultExpandedKeysHighlight: (StringConstructor | NumberConstructor)[]; - draggable: { - type: BooleanConstructor; - default: boolean; - }; - emptyText: StringConstructor; - expandIcon: ObjectConstructor; - expandOnClickNode: { - type: BooleanConstructor; - default: boolean; - }; - filterNodeMethod: FunctionConstructor; - highlightCurrent: BooleanConstructor; - icon: ObjectConstructor; - iconTriggerClickNode: { - type: BooleanConstructor; - default: boolean; - }; - indent: { - type: NumberConstructor; - default: number; - }; - lazy: { - type: BooleanConstructor; - default: boolean; - }; - load: FunctionConstructor; - nodeKey: StringConstructor; - parentKey: StringConstructor; - props: { - default(): { - children: string; - label: string; - disabled: string; - }; - }; - renderAfterExpand: { - type: BooleanConstructor; - default: boolean; - }; - renderContent: FunctionConstructor; - showCheckbox: { - type: BooleanConstructor; - default: boolean; - }; - showContextmenu: { - type: BooleanConstructor; - default: boolean; - }; - showRadio: { - type: BooleanConstructor; - default: boolean; - }; - shrinkIcon: ObjectConstructor; -}>> & { - onCheck?: ((...args: any[]) => any) | undefined; - "onCurrent-change"?: ((...args: any[]) => any) | undefined; - "onCheck-change"?: ((...args: any[]) => any) | undefined; - "onNode-collapse"?: ((...args: any[]) => any) | undefined; - "onNode-expand"?: ((...args: any[]) => any) | undefined; - "onNode-click"?: ((...args: any[]) => any) | undefined; - "onNode-drag-end"?: ((...args: any[]) => any) | undefined; - "onNode-drag-enter"?: ((...args: any[]) => any) | undefined; - "onNode-drag-leave"?: ((...args: any[]) => any) | undefined; - "onNode-drag-over"?: ((...args: any[]) => any) | undefined; - "onNode-drag-start"?: ((...args: any[]) => any) | undefined; - "onNode-drop"?: ((...args: any[]) => any) | undefined; - "onNode-contextmenu"?: ((...args: any[]) => any) | undefined; -}, { - props: { - children: string; - label: string; - disabled: string; - }; - _constants: Record; - checkStrictly: boolean; - accordion: boolean; - draggable: boolean; - lazy: boolean; - defaultExpandAll: boolean; - showCheckbox: boolean; - expandOnClickNode: boolean; - renderAfterExpand: boolean; - checkOnClickNode: boolean; - checkDescendants: boolean; - autoExpandParent: boolean; - highlightCurrent: boolean; - indent: number; - iconTriggerClickNode: boolean; - showRadio: boolean; - showContextmenu: boolean; -}>; -export default _default; diff --git a/typings/tree/src/pc.vue.d.ts b/typings/tree/src/pc.vue.d.ts deleted file mode 100644 index e337a7a94..000000000 --- a/typings/tree/src/pc.vue.d.ts +++ /dev/null @@ -1,257 +0,0 @@ -declare const _default: { - props: string[]; - components: { - TreeNode: { - name: string; - componentName: string; - directives: any; - inject: string[]; - provide(): { - parentTree: any; - }; - emits: string[]; - props: { - node: { - default(): {}; - }; - props: {}; - expandIcon: ObjectConstructor; - shrinkIcon: ObjectConstructor; - renderContent: FunctionConstructor; - renderAfterExpand: { - type: BooleanConstructor; - default: boolean; - }; - showCheckbox: { - type: BooleanConstructor; - default: boolean; - }; - showRadio: { - type: BooleanConstructor; - default: boolean; - }; - currentRadio: { - type: ObjectConstructor; - default(): { - value: null; - }; - }; - }; - components: { - CollapseTransition: any; - Checkbox: any; - TinyRadio: any; - IconChevronRight: any; - IconLoading: any; - MenuContext: { - props: { - node: { - required: boolean; - }; - }; - render(): any; - }; - NodeContent: { - props: { - node: { - required: boolean; - }; - renderContent: FunctionConstructor; - }; - inject: string[]; - render(): any; - }; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - }; - }; - emits: string[]; - provide(): { - parentTree: { - props: string[]; - components: { - TreeNode: { - name: string; - componentName: string; - directives: any; - inject: string[]; - provide(): { - parentTree: any; - }; - emits: string[]; - props: { - node: { - default(): {}; - }; - props: {}; - expandIcon: ObjectConstructor; - shrinkIcon: ObjectConstructor; - renderContent: FunctionConstructor; - renderAfterExpand: { - type: BooleanConstructor; - default: boolean; - }; - showCheckbox: { - type: BooleanConstructor; - default: boolean; - }; - showRadio: { - type: BooleanConstructor; - default: boolean; - }; - currentRadio: { - type: ObjectConstructor; - default(): { - value: null; - }; - }; - }; - components: { - CollapseTransition: any; - Checkbox: any; - TinyRadio: any; - IconChevronRight: any; - IconLoading: any; - MenuContext: { - props: { - node: { - required: boolean; - }; - }; - render(): any; - }; - NodeContent: { - props: { - node: { - required: boolean; - }; - renderContent: FunctionConstructor; - }; - inject: string[]; - render(): any; - }; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - }; - }; - emits: string[]; - provide(): any; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - }; - TreeRoot: { - props: string[]; - components: { - TreeNode: { - name: string; - componentName: string; - directives: any; - inject: string[]; - provide(): { - parentTree: any; - }; - emits: string[]; - props: { - node: { - default(): {}; - }; - props: {}; - expandIcon: ObjectConstructor; - shrinkIcon: ObjectConstructor; - renderContent: FunctionConstructor; - renderAfterExpand: { - type: BooleanConstructor; - default: boolean; - }; - showCheckbox: { - type: BooleanConstructor; - default: boolean; - }; - showRadio: { - type: BooleanConstructor; - default: boolean; - }; - currentRadio: { - type: ObjectConstructor; - default(): { - value: null; - }; - }; - }; - components: { - CollapseTransition: any; - Checkbox: any; - TinyRadio: any; - IconChevronRight: any; - IconLoading: any; - MenuContext: { - props: { - node: { - required: boolean; - }; - }; - render(): any; - }; - NodeContent: { - props: { - node: { - required: boolean; - }; - renderContent: FunctionConstructor; - }; - inject: string[]; - render(): any; - }; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - }; - }; - emits: string[]; - provide(): any; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - }; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/tree/src/tree-node.vue.d.ts b/typings/tree/src/tree-node.vue.d.ts deleted file mode 100644 index d1f637d2a..000000000 --- a/typings/tree/src/tree-node.vue.d.ts +++ /dev/null @@ -1,138 +0,0 @@ -declare const _default: { - name: string; - componentName: string; - directives: any; - inject: string[]; - provide(): { - parentTree: { - name: string; - componentName: string; - directives: any; - inject: string[]; - provide(): any; - emits: string[]; - props: { - node: { - default(): {}; - }; - props: {}; - expandIcon: ObjectConstructor; - shrinkIcon: ObjectConstructor; - renderContent: FunctionConstructor; - renderAfterExpand: { - type: BooleanConstructor; - default: boolean; - }; - showCheckbox: { - type: BooleanConstructor; - default: boolean; - }; - showRadio: { - type: BooleanConstructor; - default: boolean; - }; - currentRadio: { - type: ObjectConstructor; - default(): { - value: null; - }; - }; - }; - components: { - CollapseTransition: any; - Checkbox: any; - TinyRadio: any; - IconChevronRight: any; - IconLoading: any; - MenuContext: { - props: { - node: { - required: boolean; - }; - }; - render(): any; - }; - NodeContent: { - props: { - node: { - required: boolean; - }; - renderContent: FunctionConstructor; - }; - inject: string[]; - render(): any; - }; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; - }; - }; - emits: string[]; - props: { - node: { - default(): {}; - }; - props: {}; - expandIcon: ObjectConstructor; - shrinkIcon: ObjectConstructor; - renderContent: FunctionConstructor; - renderAfterExpand: { - type: BooleanConstructor; - default: boolean; - }; - showCheckbox: { - type: BooleanConstructor; - default: boolean; - }; - showRadio: { - type: BooleanConstructor; - default: boolean; - }; - currentRadio: { - type: ObjectConstructor; - default(): { - value: null; - }; - }; - }; - components: { - CollapseTransition: any; - Checkbox: any; - TinyRadio: any; - IconChevronRight: any; - IconLoading: any; - MenuContext: { - props: { - node: { - required: boolean; - }; - }; - render(): any; - }; - NodeContent: { - props: { - node: { - required: boolean; - }; - renderContent: FunctionConstructor; - }; - inject: string[]; - render(): any; - }; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/upload-dragger/index.d.ts b/typings/upload-dragger/index.d.ts deleted file mode 100644 index de2fd3f09..000000000 --- a/typings/upload-dragger/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import UploadDragger from './src/index.vue'; -export default UploadDragger; diff --git a/typings/upload-dragger/src/index.vue.d.ts b/typings/upload-dragger/src/index.vue.d.ts deleted file mode 100644 index f510d3507..000000000 --- a/typings/upload-dragger/src/index.vue.d.ts +++ /dev/null @@ -1,15 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - disabled: BooleanConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - disabled: boolean; -}>; -export default _default; diff --git a/typings/upload-list/index.d.ts b/typings/upload-list/index.d.ts deleted file mode 100644 index 83eee48b8..000000000 --- a/typings/upload-list/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import UploadList from './src/index.vue'; -export default UploadList; diff --git a/typings/upload-list/src/index.vue.d.ts b/typings/upload-list/src/index.vue.d.ts deleted file mode 100644 index 4a8a44531..000000000 --- a/typings/upload-list/src/index.vue.d.ts +++ /dev/null @@ -1,97 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - disabled: { - type: BooleanConstructor; - default: () => boolean; - }; - display: { - type: BooleanConstructor; - default: () => boolean; - }; - files: { - type: ArrayConstructor; - default: () => never[]; - }; - filesIcon: { - type: ArrayConstructor; - default: () => never[]; - }; - handlePreview: FunctionConstructor; - isEdm: { - type: BooleanConstructor; - default: () => boolean; - }; - isFolder: { - type: BooleanConstructor; - default: () => boolean; - }; - listType: StringConstructor; - openDownloadFile: { - type: BooleanConstructor; - default: () => boolean; - }; - srcList: { - type: ArrayConstructor; - default: () => never[]; - }; - isFolderTitle: { - type: BooleanConstructor; - default: boolean; - }; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly boolean; - }; - display: { - type: BooleanConstructor; - default: () => boolean; - }; - files: { - type: ArrayConstructor; - default: () => never[]; - }; - filesIcon: { - type: ArrayConstructor; - default: () => never[]; - }; - handlePreview: FunctionConstructor; - isEdm: { - type: BooleanConstructor; - default: () => boolean; - }; - isFolder: { - type: BooleanConstructor; - default: () => boolean; - }; - listType: StringConstructor; - openDownloadFile: { - type: BooleanConstructor; - default: () => boolean; - }; - srcList: { - type: ArrayConstructor; - default: () => never[]; - }; - isFolderTitle: { - type: BooleanConstructor; - default: boolean; - }; -}>>, { - disabled: boolean; - display: boolean; - openDownloadFile: boolean; - isFolderTitle: boolean; - isEdm: boolean; - isFolder: boolean; - files: unknown[]; - filesIcon: unknown[]; - srcList: unknown[]; -}>; -export default _default; diff --git a/typings/upload/index.d.ts b/typings/upload/index.d.ts deleted file mode 100644 index 57a8d402e..000000000 --- a/typings/upload/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Upload from './src/index.vue'; -export default Upload; diff --git a/typings/upload/src/index.vue.d.ts b/typings/upload/src/index.vue.d.ts deleted file mode 100644 index f6e51c7d6..000000000 --- a/typings/upload/src/index.vue.d.ts +++ /dev/null @@ -1,118 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - accept: StringConstructor; - action: { - type: StringConstructor; - default: string; - }; - autoUpload: BooleanConstructor; - beforeUpload: FunctionConstructor; - data: ObjectConstructor; - disabled: BooleanConstructor; - drag: BooleanConstructor; - edmToken: { - type: ObjectConstructor; - default: () => {}; - }; - fileList: ArrayConstructor; - headers: ObjectConstructor; - httpRequest: { - type: FunctionConstructor; - default: any; - }; - isFolder: { - type: BooleanConstructor; - default: boolean; - }; - limit: NumberConstructor; - listType: StringConstructor; - multiple: BooleanConstructor; - name: { - type: StringConstructor; - default: string; - }; - onError: FunctionConstructor; - onExceed: FunctionConstructor; - onPreview: { - type: FunctionConstructor; - default: () => void; - }; - onProgress: FunctionConstructor; - onRemove: { - type: FunctionConstructor; - default: () => void; - }; - onStart: FunctionConstructor; - onSuccess: FunctionConstructor; - size: StringConstructor; - type: StringConstructor; - withCredentials: BooleanConstructor; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly {}; - }; - fileList: ArrayConstructor; - headers: ObjectConstructor; - httpRequest: { - type: FunctionConstructor; - default: any; - }; - isFolder: { - type: BooleanConstructor; - default: boolean; - }; - limit: NumberConstructor; - listType: StringConstructor; - multiple: BooleanConstructor; - name: { - type: StringConstructor; - default: string; - }; - onError: FunctionConstructor; - onExceed: FunctionConstructor; - onPreview: { - type: FunctionConstructor; - default: () => void; - }; - onProgress: FunctionConstructor; - onRemove: { - type: FunctionConstructor; - default: () => void; - }; - onStart: FunctionConstructor; - onSuccess: FunctionConstructor; - size: StringConstructor; - type: StringConstructor; - withCredentials: BooleanConstructor; -}>>, { - name: string; - action: string; - disabled: boolean; - multiple: boolean; - drag: boolean; - withCredentials: boolean; - autoUpload: boolean; - httpRequest: Function; - edmToken: Record; - isFolder: boolean; - onRemove: Function; - onPreview: Function; -}>; -export default _default; diff --git a/typings/user-account/index.d.ts b/typings/user-account/index.d.ts deleted file mode 100644 index 06944202c..000000000 --- a/typings/user-account/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import UserAccount from './src/index.js'; -import '@opentiny/vue-theme/user-account/index.css'; -export default UserAccount; diff --git a/typings/user-account/src/index.d.ts b/typings/user-account/src/index.d.ts deleted file mode 100644 index 330733e07..000000000 --- a/typings/user-account/src/index.d.ts +++ /dev/null @@ -1,49 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - getLangData: FunctionConstructor; - getUserInfo: FunctionConstructor; - getUserImageUrl: FunctionConstructor; - getLogoutUrl: FunctionConstructor; - redirectUrl: StringConstructor; - isLocal: BooleanConstructor; - network: FunctionConstructor; - isMock: BooleanConstructor; - isGuestUser: FunctionConstructor; - showLogin: FunctionConstructor; - showArrow: { - type: BooleanConstructor; - default: boolean; - }; - popperClass: StringConstructor; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - beforeLogout: FunctionConstructor; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - popperAppendToBody: boolean; - isLocal: boolean; - isMock: boolean; - showArrow: boolean; -}>; -export default _default; diff --git a/typings/user-account/src/pc.vue.d.ts b/typings/user-account/src/pc.vue.d.ts deleted file mode 100644 index 0ddeb2553..000000000 --- a/typings/user-account/src/pc.vue.d.ts +++ /dev/null @@ -1,16 +0,0 @@ -declare const _default: { - components: { - UserContact: any; - Logout: any; - }; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/user-contact/index.d.ts b/typings/user-contact/index.d.ts deleted file mode 100644 index 5625d30ee..000000000 --- a/typings/user-contact/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import UserContact from './src/index'; -import '@opentiny/vue-theme/user-contact/index.css'; -export default UserContact; diff --git a/typings/user-contact/src/index.d.ts b/typings/user-contact/src/index.d.ts deleted file mode 100644 index 4a4197ef9..000000000 --- a/typings/user-contact/src/index.d.ts +++ /dev/null @@ -1,85 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - showName: { - type: BooleanConstructor; - default: boolean; - }; - showArrow: { - type: BooleanConstructor; - default: boolean; - }; - /** - * 是否显示 userDescription, colType 为 false 时生效 - */ - showDescription: { - type: BooleanConstructor; - default: boolean; - }; - /** - * 是否显示 头像 - */ - showImg: { - type: BooleanConstructor; - default: boolean; - }; - /** - * 数据 - */ - data: { - type: ObjectConstructor; - }; - popperClass: StringConstructor; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - isNewImMode: { - type: BooleanConstructor; - default: boolean; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - popperAppendToBody: boolean; - isNewImMode: boolean; - showArrow: boolean; - showName: boolean; - showDescription: boolean; - showImg: boolean; -}>; -export default _default; diff --git a/typings/user-contact/src/pc.vue.d.ts b/typings/user-contact/src/pc.vue.d.ts deleted file mode 100644 index f0a0b2446..000000000 --- a/typings/user-contact/src/pc.vue.d.ts +++ /dev/null @@ -1,19 +0,0 @@ -declare const _default: { - props: string[]; - components: { - UserHead: any; - CardTemplate: any; - Popover: any; - IconChevronUp: any; - IconChevronDown: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/user-head/index.d.ts b/typings/user-head/index.d.ts deleted file mode 100644 index ea8dddb81..000000000 --- a/typings/user-head/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import UserHead from './src/index'; -import '@opentiny/vue-theme/user-head/index.css'; -export default UserHead; diff --git a/typings/user-head/src/index.d.ts b/typings/user-head/src/index.d.ts deleted file mode 100644 index 72ed06a9f..000000000 --- a/typings/user-head/src/index.d.ts +++ /dev/null @@ -1,123 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - /** - * @property {Boolean} [min=false] - 小尺寸模式 - */ - min: BooleanConstructor; - /** - * @property {Boolean} [round=true] - 圆形模式 - */ - round: BooleanConstructor; - /** - * @property {String} [color=#ffffff] - 文字颜色 - */ - color: { - type: StringConstructor; - default: string; - }; - /** - * @property {String} [backgroundColor=#BBBBBB] - 背景色 - */ - backgroundColor: { - type: StringConstructor; - default: string; - }; - /** - * @property {String} [type=label] - 头像类型,icon|image|label 可选 - */ - type: { - type: StringConstructor; - default: string; - }; - /** - * @property {String} - 头像资源 - * type=icon 时为图标类名,type=label时为字体串,type=image时为资源路径 - */ - value: { - type: (ObjectConstructor | StringConstructor)[]; - default: null; - }; - /** - * @property {Number} - 消息计数 - */ - messageTotal: NumberConstructor; - /** - * @property {String} [messageType=details] - 消息类型 details|basic 可选 - */ - messageType: { - type: StringConstructor; - default: string; - }; - /** - * @property {Number} [messageUpperLimit=0] - 消息显示上限 - */ - messageUpperLimit: { - type: NumberConstructor; - default: number; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly>, { - value: string | Record; - type: string; - round: boolean; - backgroundColor: string; - min: boolean; - color: string; - messageType: string; - messageUpperLimit: number; -}>; -export default _default; diff --git a/typings/user-head/src/pc.vue.d.ts b/typings/user-head/src/pc.vue.d.ts deleted file mode 100644 index afde1bdfe..000000000 --- a/typings/user-head/src/pc.vue.d.ts +++ /dev/null @@ -1,15 +0,0 @@ -declare const _default: { - components: { - IconUser: any; - }; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/user-link/index.d.ts b/typings/user-link/index.d.ts deleted file mode 100644 index 01ce64b4c..000000000 --- a/typings/user-link/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import UserLink from './src/index.js'; -import '@opentiny/vue-theme/user-link/index.css'; -export default UserLink; diff --git a/typings/user-link/src/index.d.ts b/typings/user-link/src/index.d.ts deleted file mode 100644 index b9f119ed2..000000000 --- a/typings/user-link/src/index.d.ts +++ /dev/null @@ -1,98 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - modelValue: StringConstructor; - cache: { - type: BooleanConstructor; - default: boolean; - }; - cacheKey: { - type: StringConstructor; - default: string; - }; - cacheFields: { - type: ArrayConstructor; - default: () => never[]; - }; - valueSplit: { - type: StringConstructor; - default: () => string; - }; - textSplit: { - type: StringConstructor; - default: () => string; - }; - valueField: { - type: StringConstructor; - default: () => string; - }; - textField: { - type: StringConstructor; - default: () => string; - }; - card: { - type: BooleanConstructor; - default: boolean; - }; - fetchUser: FunctionConstructor; - fetchW3Accounts: FunctionConstructor; - getUserImageUrl: FunctionConstructor; - fetchUserByUserId: FunctionConstructor; - UserCache: ObjectConstructor; - batch: { - type: (BooleanConstructor | NumberConstructor)[]; - default: number; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly never[]; - }; - valueSplit: { - type: StringConstructor; - default: () => string; - }; - textSplit: { - type: StringConstructor; - default: () => string; - }; - valueField: { - type: StringConstructor; - default: () => string; - }; - textField: { - type: StringConstructor; - default: () => string; - }; - card: { - type: BooleanConstructor; - default: boolean; - }; - fetchUser: FunctionConstructor; - fetchW3Accounts: FunctionConstructor; - getUserImageUrl: FunctionConstructor; - fetchUserByUserId: FunctionConstructor; - UserCache: ObjectConstructor; - batch: { - type: (BooleanConstructor | NumberConstructor)[]; - default: number; - }; -}>>, { - valueField: string; - textField: string; - card: boolean; - textSplit: string; - valueSplit: string; - cache: boolean; - cacheFields: unknown[]; - cacheKey: string; - batch: number | boolean; -}>; -export default _default; diff --git a/typings/user-link/src/pc.vue.d.ts b/typings/user-link/src/pc.vue.d.ts deleted file mode 100644 index f466a6a30..000000000 --- a/typings/user-link/src/pc.vue.d.ts +++ /dev/null @@ -1,20 +0,0 @@ -declare const _default: { - props: string[]; - components: { - TinyPopover: any; - IconChevronDown: any; - IconChevronUp: any; - }; - directives: { - loading: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/user/index.d.ts b/typings/user/index.d.ts deleted file mode 100644 index 2232d603e..000000000 --- a/typings/user/index.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -import User from './src/index.js'; -import '@opentiny/vue-theme/user/index.css'; -export default User; diff --git a/typings/user/src/index.d.ts b/typings/user/src/index.d.ts deleted file mode 100644 index 944861906..000000000 --- a/typings/user/src/index.d.ts +++ /dev/null @@ -1,270 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - COMPONENT_NAME: { - FormItem: string; - }; - EVENT_NAME: { - FormBlur: string; - }; - }; - }; - tabindex: { - type: StringConstructor; - default: string; - }; - modelValue: { - type: (StringConstructor | NumberConstructor)[]; - required: false; - }; - multiple: { - type: BooleanConstructor; - default: boolean; - }; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - valueSplit: { - type: StringConstructor; - default: string; - }; - textSplit: { - type: StringConstructor; - default: string; - }; - valueField: { - type: StringConstructor; - default: string; - }; - textField: { - type: StringConstructor; - default: string; - }; - cache: { - type: BooleanConstructor; - default: boolean; - }; - cacheKey: { - type: StringConstructor; - default: string; - }; - delay: { - type: NumberConstructor; - default: number; - }; - suggestLength: { - type: NumberConstructor; - default: number; - }; - cacheFields: { - type: ArrayConstructor; - default: () => never[]; - }; - collapseTags: { - type: BooleanConstructor; - default: boolean; - }; - placeholder: { - type: StringConstructor; - default: string; - }; - showOverflowTooltip: { - type: BooleanConstructor; - default: boolean; - }; - sortByFetchData: { - type: BooleanConstructor; - default: boolean; - }; - sortable: FunctionConstructor; - size: StringConstructor; - fetchW3Accounts: FunctionConstructor; - fetchSuggestUser: FunctionConstructor; - fetchUserByUserId: FunctionConstructor; - userCache: ObjectConstructor; - popperClass: StringConstructor; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - tagSelectable: { - type: BooleanConstructor; - default: boolean; - }; - copyable: { - type: BooleanConstructor; - default: boolean; - }; - batch: { - type: (BooleanConstructor | NumberConstructor)[]; - default: number; - }; - allowCopy: { - type: BooleanConstructor; - default: boolean; - }; - noDataText: StringConstructor; - loadingText: StringConstructor; - autoClose: BooleanConstructor; - queryDebounce: { - type: NumberConstructor; - default: number; - }; - hideSelected: BooleanConstructor; - ignoreEnter: { - type: BooleanConstructor; - default: boolean; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "error")[], "change" | "error", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - COMPONENT_NAME: { - FormItem: string; - }; - EVENT_NAME: { - FormBlur: string; - }; - }; - }; - tabindex: { - type: StringConstructor; - default: string; - }; - modelValue: { - type: (StringConstructor | NumberConstructor)[]; - required: false; - }; - multiple: { - type: BooleanConstructor; - default: boolean; - }; - disabled: { - type: BooleanConstructor; - default: boolean; - }; - valueSplit: { - type: StringConstructor; - default: string; - }; - textSplit: { - type: StringConstructor; - default: string; - }; - valueField: { - type: StringConstructor; - default: string; - }; - textField: { - type: StringConstructor; - default: string; - }; - cache: { - type: BooleanConstructor; - default: boolean; - }; - cacheKey: { - type: StringConstructor; - default: string; - }; - delay: { - type: NumberConstructor; - default: number; - }; - suggestLength: { - type: NumberConstructor; - default: number; - }; - cacheFields: { - type: ArrayConstructor; - default: () => never[]; - }; - collapseTags: { - type: BooleanConstructor; - default: boolean; - }; - placeholder: { - type: StringConstructor; - default: string; - }; - showOverflowTooltip: { - type: BooleanConstructor; - default: boolean; - }; - sortByFetchData: { - type: BooleanConstructor; - default: boolean; - }; - sortable: FunctionConstructor; - size: StringConstructor; - fetchW3Accounts: FunctionConstructor; - fetchSuggestUser: FunctionConstructor; - fetchUserByUserId: FunctionConstructor; - userCache: ObjectConstructor; - popperClass: StringConstructor; - popperAppendToBody: { - type: BooleanConstructor; - default: boolean; - }; - tagSelectable: { - type: BooleanConstructor; - default: boolean; - }; - copyable: { - type: BooleanConstructor; - default: boolean; - }; - batch: { - type: (BooleanConstructor | NumberConstructor)[]; - default: number; - }; - allowCopy: { - type: BooleanConstructor; - default: boolean; - }; - noDataText: StringConstructor; - loadingText: StringConstructor; - autoClose: BooleanConstructor; - queryDebounce: { - type: NumberConstructor; - default: number; - }; - hideSelected: BooleanConstructor; - ignoreEnter: { - type: BooleanConstructor; - default: boolean; - }; -}>> & { - onChange?: ((...args: any[]) => any) | undefined; - onError?: ((...args: any[]) => any) | undefined; -}, { - _constants: Record; - tabindex: string; - placeholder: string; - disabled: boolean; - popperAppendToBody: boolean; - valueField: string; - textField: string; - collapseTags: boolean; - multiple: boolean; - textSplit: string; - valueSplit: string; - copyable: boolean; - showOverflowTooltip: boolean; - delay: number; - tagSelectable: boolean; - allowCopy: boolean; - autoClose: boolean; - queryDebounce: number; - ignoreEnter: boolean; - cache: boolean; - suggestLength: number; - cacheFields: unknown[]; - cacheKey: string; - sortByFetchData: boolean; - batch: number | boolean; - hideSelected: boolean; -}>; -export default _default; diff --git a/typings/user/src/pc.vue.d.ts b/typings/user/src/pc.vue.d.ts deleted file mode 100644 index 73aeec4d6..000000000 --- a/typings/user/src/pc.vue.d.ts +++ /dev/null @@ -1,19 +0,0 @@ -declare const _default: { - components: { - TinySelect: any; - TinyOption: any; - IconUser: any; - IconGroup: any; - }; - inheritAttrs: boolean; - props: string[]; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/wizard/index.d.ts b/typings/wizard/index.d.ts deleted file mode 100644 index 0ba57d23f..000000000 --- a/typings/wizard/index.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import Wizard from './src/index'; -import '@opentiny/vue-theme/wizard/index.css'; -export default Wizard; diff --git a/typings/wizard/src/index.d.ts b/typings/wizard/src/index.d.ts deleted file mode 100644 index 17d36fbfe..000000000 --- a/typings/wizard/src/index.d.ts +++ /dev/null @@ -1,58 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - _constants: { - type: ObjectConstructor; - default: () => { - DOING_STATUS: string; - READY_STATUS: string; - WAIT_STATUS: string; - }; - }; - data: { - type: ArrayConstructor; - default: () => never[]; - }; - pageGuide: { - type: BooleanConstructor; - default: boolean; - }; - vertical: { - type: BooleanConstructor; - default: boolean; - }; - timeLineFlow: { - type: BooleanConstructor; - default: boolean; - }; -}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly { - DOING_STATUS: string; - READY_STATUS: string; - WAIT_STATUS: string; - }; - }; - data: { - type: ArrayConstructor; - default: () => never[]; - }; - pageGuide: { - type: BooleanConstructor; - default: boolean; - }; - vertical: { - type: BooleanConstructor; - default: boolean; - }; - timeLineFlow: { - type: BooleanConstructor; - default: boolean; - }; -}>>, { - data: unknown[]; - _constants: Record; - vertical: boolean; - pageGuide: boolean; - timeLineFlow: boolean; -}>; -export default _default; diff --git a/typings/wizard/src/pc.vue.d.ts b/typings/wizard/src/pc.vue.d.ts deleted file mode 100644 index fcc7ed76f..000000000 --- a/typings/wizard/src/pc.vue.d.ts +++ /dev/null @@ -1,20 +0,0 @@ -declare const _default: { - props: string[]; - emits: string[]; - components: { - TinyButton: any; - TinyUserContact: any; - TinyIconSuccessful: any; - TinyIconMarkOn: any; - TinyIconTriangleDown: any; - }; - setup(props: any, context: any): { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; - }; -}; -export default _default; diff --git a/typings/year-table/index.d.ts b/typings/year-table/index.d.ts deleted file mode 100644 index 79bf94c23..000000000 --- a/typings/year-table/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) 2022 - present TinyVue Authors. - * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd. - * - * Use of this source code is governed by an MIT-style license. - * - * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL, - * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR - * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS. - * - */ -import YearTable from './src/index.vue'; -export default YearTable; diff --git a/typings/year-table/src/index.vue.d.ts b/typings/year-table/src/index.vue.d.ts deleted file mode 100644 index 936d2866f..000000000 --- a/typings/year-table/src/index.vue.d.ts +++ /dev/null @@ -1,25 +0,0 @@ -declare const _default: import("vue").DefineComponent<{ - disabledDate: {}; - value: {}; - defaultValue: { - validator(val: unknown): any; - }; - date: {}; -}, { - t: any; - vm: any; - f: (props: any, attrs?: {}) => {}; - a: (attrs: any, filters: any, include: any) => {}; - d: (props: any) => void; - dp: (props: any) => void; -}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "pick"[], "pick", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly> & { - onPick?: ((...args: any[]) => any) | undefined; -}, {}>; -export default _default; diff --git a/vite.config.js b/vite.config.js deleted file mode 100644 index 0ce633bb3..000000000 --- a/vite.config.js +++ /dev/null @@ -1,55 +0,0 @@ -import { defineConfig } from 'vite' -import { createVuePlugin } from 'vite-plugin-vue2' -import path from 'path' -import vueJsx from '@vitejs/plugin-vue2-jsx' -import { createSvgPlugin } from 'vite-plugin-vue2-svg' -import md2Vue2Plugin from 'vite-plugin-md2vue2' -const { getAllModules } = require('./build/module-utils') - -const pathJoin = (...args) => path.join(__dirname, ...args) -const components = getAllModules(false) - -const doComponents = (alias = {}) => { - components.forEach((item) => { - alias[item.libName] = pathJoin(item.path) - alias[item.importName] = pathJoin(item.path) - - if (item.type === 'component') { - alias[`@opentiny/vue-theme/${item.LowerName}/index.css`] = pathJoin(`../tiny-vue-theme/src/${item.LowerName}/index.less`) - alias[`@opentiny/vue-theme-mobile/${item.LowerName}/index.css`] = pathJoin(`../tiny-vue-theme-mobile/src/${item.LowerName}/index.less`) - } - }) - return alias -} -const config = { - server: { - host: '127.0.0.1', - open: true - }, - plugins: [md2Vue2Plugin(), createVuePlugin(), vueJsx(), createSvgPlugin()], - resolve: { - extensions: ['.js', '.jsx', '.vue'], - alias: { - '@': pathJoin('example/src'), - '@opentiny/vue': pathJoin('packages'), - vue: pathJoin('./node_modules/vue/dist/vue.esm.js'), - 'vue-i18n': pathJoin('./node_modules/vue-i18n/dist/vue-i18n.esm.js'), - 'vue-router': pathJoin('./node_modules/vue-router/dist/vue-router.esm.js'), - '@opentiny/vue-locale': pathJoin('packages/locale'), - '@opentiny/vue-common': pathJoin('packages/common'), - '@opentiny/vue-renderless': pathJoin('../tiny-vue-renderless/src'), - '@opentiny/vue-icon': pathJoin('packages/icon/index.js'), - ...doComponents(), - '@opentiny/vue-theme/base/index.css': pathJoin('../tiny-vue-theme/src/base/index.less'), - '@opentiny/vue-theme/svg/index.css': pathJoin('../tiny-vue-theme/src/svg/index.less'), - '@opentiny/vue-theme/tall-storage/index.css': pathJoin('../tiny-vue-theme/src/tall-storage/index.less'), - '@opentiny/vue-theme': pathJoin('../tiny-vue-theme/src'), - '@opentiny/vue-theme-mobile/base/index.css': pathJoin('../tiny-vue-theme-mobile/src/base/index.less') - } - }, - define: { - 'process.env': process.env - } -} - -export default defineConfig(() => config) diff --git a/volar.config.js b/volar.config.js new file mode 100644 index 000000000..c6212d4c8 --- /dev/null +++ b/volar.config.js @@ -0,0 +1,22 @@ +/* eslint-env node */ + +/** @type {import('@volar-plugins/eslint')} */ +// const volarEslintPlugin = require('@volar-plugins/eslint') + +/** @type {import('@volar-plugins/prettier')} */ +// const { volarPrettierPlugin } = require('@volar-plugins/prettier') + +/** @type {import('@volar-plugins/prettyhtml')} */ +// const prettyhtml = require('@volar-plugins/prettyhtml') + +module.exports = { + plugins: [ + // volarEslintPlugin(require('./linting/resolve-config.js')), + // volarPrettierPlugin({ + // languages: ['html', 'css', 'scss', 'typescript', 'javascript'], + // html: { breakContentsFromTags: true }, + // useVscodeIndentation: true, + // }), + // prettyhtml({ printWidth: 100 }), + ], +}